/*----------------------------------------------------------
The base color for this template is #5c87b2. If you'd like
to use a different color start by replacing all instances of
#5c87b2 with your new color.
----------------------------------------------------------*/
body
{
	background: url(img/bg.jpg) repeat;
	font-size: .75em;
	font-family: Verdana, Helvetica, Sans-Serif;
	margin: 0;
	padding: 0;
}

a:link
{
	color: #034af3;
	text-decoration: none;
}
a:visited
{
	color: #505abc;
	text-decoration: none;
}
a:hover
{
	color: #1d60ff;
	text-decoration: none;
}
a:active
{
	color: #12eb87;
	text-decoration: none;
}

p, ul
{
	margin-bottom: 20px;
	line-height: 1.6em;
}

/* HEADINGS   
----------------------------------------------------------*/
h1, h2, h3, h4, h5, h6
{
	font-size: 2em;
	color: #FFFFFF;
	font-family: Arial, Helvetica, sans-serif;
}

h1
{
	font-size: 28px;
	padding-bottom: 0;
	margin-bottom: 0;
}
h2
{
	padding: 0 0 10px 0;
	color:#3B5998;
}
h3
{
	font-size: 2em;
	color:#3B5998;
}
h4
{
	font-size: 1.1em;
	color:#3B5998;
	padding:0px;
	margin-bottom:2px;
	margin-top:2px;
}
h5, h6
{
	font-size: 1em;
}

/* this rule styles <h2> tags that are the 
first child of the left and right table columns */
.rightColumn > h1, .rightColumn > h2, .leftColumn > h1, .leftColumn > h2
{
	margin-top: 0;
}

/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/

/* you can specify a greater or lesser percentage for the 
page width. Or, you can specify an exact pixel width. */
.page
{
	width: 100%;
	margin: 0px;
}

#header
{
	position: absolute;
	bottom: 40px;
	margin: 0px;
	width: 100%;
	color: #000;
	z-index:3;
}

#header h1
{
	font-weight: bold;
	padding: 5px 0;
	margin: 0;
	color: #fff;
	border: none;
	line-height: 2em;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 32px !important;
}

#main
{
	position:absolute;
	top:10px;
	bottom:10px;
	margin-right:2.5%;
	margin-left:2.5%;
	background-color: #000000;
	border: 1px solid #FFFFFF;
	color: #FFFFFF;
	/*opacity: 0.7;*/
	padding: 30px 30px 15px;
	width: 90%;
	min-height:500px;
	_height: 1px; /* only IE6 applies CSS properties starting with an underscrore */
}

#footer{ position:absolute;bottom:3px; left:0px; color: #999;max-height:20px;text-align: center;line-height: normal;font-size: .9em; width:100%;}
.main_content{ float:left; width:100%; }
.content{ position:absolute; top:100px; bottom:100px; right:2.5%; left:0px; background-color:#222222; opacity:0.8;filter:alpha(opacity=80);-moz-opacity:0.8; border:solid 1px gray; display:none;}
.biglietto_evento{border:solid 1px #FFFFFF; max-width:250px; max-height:240px; float:left; margin:30px;}
.par{ width:300px; float:left; margin-top:0px; max-height:380px; text-align:justify; }
.fb_comments{ height:460px; width:490px; position:absolute; top:20px; right:30px;}
.bottom_panel{ width:51%; margin-left:15px; margin-right:15px; position:absolute; bottom:0px;}
.bottom_panel p { margin-bottom:0px; margin-top:0px; text-align:justify;}
/*Galleria style*/
.galleria{ width:670px; position:absolute; right:0; background-color:#222222; display:none;}
#loading{float:right; margin-top:130px; margin-right:300px; display:none; }
/*.gallery_menu{ position:absolute; float:left; max-width:350px; max-height:300px; padding:0px;}
.gallery_menu ul{ padding-left:25px;}
.gallery_menu li{ border-left:solid 5px; width:100%; display:block;}
.gallery_menu li:hover{ border-left:solid 5px #3B5998;}
.gallery_menu span{ color:#034af3; cursor:pointer; padding-left:10px; padding-top:3px; padding-right:5px;}
/*--------------------------*/
.galleria-container{position:relative;overflow:hidden;background:#222222;}
.galleria-container img{-moz-user-select:none;-webkit-user-select:none;-o-user-select:none;}
.galleria-stage{position:absolute;top:10px;bottom:60px;left:10px;right:10px;overflow:hidden; border:solid 1px #FFFFFF;}
.galleria-thumbnails-container{height:50px;bottom:0;position:absolute;left:10px;right:10px;z-index:2;}
.galleria-carousel .galleria-thumbnails-list{margin-left:30px;margin-right:30px;}
.galleria-thumbnails .galleria-image{height:40px;width:60px;background:#000;margin:0 5px 0 0;border:1px solid #000;;float:left;cursor:pointer;}
.galleria-counter{position:absolute;bottom:10px;left:10px;text-align:right;color:#fff;font:normal 11px/1 arial,sans-serif;z-index:2;}
.galleria-loader{background:#000;width:20px;height:20px;position:absolute;top:10px;right:10px;z-index:2;display:none;background:url(classic-loader.gif) no-repeat 2px 2px;}
.galleria-info{width:50%;top:15px;left:15px;z-index:2;position:absolute;}
.galleria-info-text{background-color:rgba(0,0,0,.9);*background-color:#000;padding: 12px;display:none;}
.galleria-info-title{font:bold 12px/1.1 Verdana,sans-serif;margin:0;color:#fff;}
.galleria-info-description{font:italic 12px/1.4 Verdana,serif;margin:0;color:#bbb;}
.galleria-info-title+.galleria-info-description{margin-top:7px;}
.galleria-info-close{width:9px;height:9px;position:absolute;top:5px;right:5px;background-position:-753px -11px;opacity:.5;cursor:pointer;display:none;}
.galleria-info-link{background-position:-669px -5px;opacity:.8;position:absolute;width:20px;height:20px;cursor:pointer;background-color:#000;}
.galleria-info-link:hover,
.galleria-info-close:hover{opacity:.5;}
.galleria-image-nav{position:absolute;top:50%;margin-top:-15px;width:100%;height:31px;left:0;}
.galleria-image-nav-left,
.galleria-image-nav-right{opacity:.7;cursor:pointer;width:16px;height:31px;position:absolute;left:10px;z-index:2;}
.galleria-image-nav-right{left:auto;right:10px;background-position:-300px 0;z-index:2;}
.galleria-image-nav-left:hover,
.galleria-image-nav-right:hover{opacity:.5;}
.galleria-thumb-nav-left,
.galleria-thumb-nav-right{cursor:pointer;display:none;background-position:-495px 5px;position:absolute;left:0;top:0;height:40px;width:23px;z-index:3;opacity:.8;}
.galleria-thumb-nav-right{background-position:-578px 5px;border-right:none;right:0;left:auto;}
.galleria-thumbnails-container .disabled,
.galleria-thumbnails-container .disabled:hover{opacity:.2;cursor:default;}
.galleria-thumb-nav-left:hover,
.galleria-thumb-nav-right:hover{opacity:1;background-color:#111;}
.galleria-carousel .galleria-thumb-nav-left,
.galleria-carousel .galleria-thumb-nav-right{display:block;}
.galleria-thumb-nav-left,
.galleria-thumb-nav-right,
.galleria-info-link,
.galleria-info-close,
.galleria-image-nav-left,
.galleria-image-nav-right{background-image:url(classic-map.png);background-repeat:no-repeat;}
/*---------------------------------------------------------------------------------------------*/
/* TAB MENU   

ul#menu
{
	border-bottom: 1px #5C87B2 solid;
	padding: 0 0 2px;
	position: relative;
	margin: 0;
	text-align: right;
}

ul#menu li
{
	display: inline;
	list-style: none;
}

ul#menu li#greeting
{
	padding: 10px 20px;
	font-weight: bold;
	text-decoration: none;
	line-height: 2.8em;
	color: #fff;
}

ul#menu li a
{
	padding: 10px 20px;
	font-weight: bold;
	text-decoration: none;
	line-height: 2.8em;
	background-color: #e8eef4;
	color: #034af3;
}

ul#menu li a:hover
{
	background-color: #fff;
	text-decoration: none;
}

ul#menu li a:active
{
	background-color: #a6e2a6;
	text-decoration: none;
}

ul#menu li.selected a
{
	background-color: #fff;
	color: #000;
}
----------------------------------------------------------*/
/* FORM LAYOUT ELEMENTS   
----------------------------------------------------------*/

fieldset
{
	margin: 1em 0;
	padding: 1em;
	border: 1px solid #CCC;
}

fieldset p
{
	margin: 2px 12px 10px 10px;
}

fieldset label
{
	display: block;
}

fieldset label.inline
{
	display: inline;
}

legend
{
	font-size: 1.1em;
	font-weight: 600;
	padding: 2px 4px 8px 4px;
}

input[type="text"]
{
	width: 200px;
	border: 1px solid #CCC;
}

input[type="password"]
{
	width: 200px;
	border: 1px solid #CCC;
}

/* TABLE
----------------------------------------------------------*/

table
{
	border: solid 1px #e8eef4;
	border-collapse: collapse;
}

table td
{
	padding: 5px;
	border: solid 1px #e8eef4;
}

table th
{
	padding: 6px 5px;
	text-align: left;
	background-color: #e8eef4;
	border: solid 1px #e8eef4;
}
/* Bookmarks */
#bookmarks{ display:none; position:absolute; width:468px; height:20px; background-color:#222222; border:1px solid #FFFFFF; border-top:0px; right:30px; bottom:80px;}
#bookmarks ul { margin-top:0;padding-left:0;position:absolute;right:30px;top:2px;}
#bookmarks ul li{ display:inline; margin-left:5px;}
#bookmarks img { border:0px none;}
/* Main Menu */
.menu
{
	font: 16px Verdana;
	position: relative;
	padding: 0px;
	margin: 10px 0;
	overflow: hidden;
}
.menu li
{
	float: left;
	list-style: none;
	padding: 3px;
}
.menu li.backLava
{
	background-color: #3B5998;
	opacity:0.8;filter:alpha(opacity=80);-moz-opacity:0.8;
	width: 9px;
	position: absolute;
}

.menu li a
{
	text-decoration: none;
	color: #FFFFFF;
	text-align: center;
	padding: 2px 5px;
	z-index: 10;
	display: block;
	position: relative;
	margin: auto 5px;
}
#facebook_panel{ position:absolute; right:0px; max-height:500px; top:0px;}
#fb_content{ background-color:#222222; display:none; width:300px; float:left;}
#fb_button{ display:block; cursor:pointer; top:0px; float:left; opacity:0.8 filter:alpha(opacity=80);-moz-opacity:0.8;}
/* MISC  
----------------------------------------------------------*/
.clear
{
	clear: both;
}

.error
{
	color: Red;
}

#menucontainer
{
	float: left;
	width: 70%;
	background-color: #000000;
	opacity: 0.7;filter:alpha(opacity=70);-moz-opacity:0.7;
	height: 50px;
}
#eventicontainer
{
	display:none;
	border-right:solid 1px #FFFFFF;
	float: left;
	position:absolute;
	width: 250px;
	background-color: #222222;
	left:0px;
	top:0px;
	height:94%;
	z-index:2;
}
#galleryMenuContainer{float:left; max-width:350px; max-height:300px; padding:0px;}
#eventicontainer h3 { font-family:Agency FB; font-weight:bold; font-size:25px; text-align:center; background-color:#3B5998; margin-top:0px; margin-bottom:0px; height:30px; z-index:2;}
#menu_eventi{ padding:0px; line-height:1.3em; list-style:none; margin-left:0px;}
#menu_eventi li{ border-left:solid 5px #222222; width:100%; display:block;}
#menu_eventi li:hover{ border-left:solid 5px #3B5998; background-color:#FFFFFF; opacity:0.8;filter:alpha(opacity=80);-moz-opacity:0.8; color: gray;}
#menu_eventi a{display:block;}
.title{font-family:Agency FB; font-weight:bold; font-size:40px;}
.subtitle{color:#3B5998; font-size:25px; font-weight:bold; font-family:Agency FB; position:absolute; right:40px; top:0px; margin-bottom:3px; margin-top:5px;}
.banner{ width:468px; height:60px; display:none; position:absolute; right:30px; top:40px;}

#map_canvas{ border:solid 1px #FFFFFF; position:absolute; top:0px; right:0px; width:800px; height:100%;}
#get_directions{ position:absolute; bottom:0px; right:0px; background-color:#000; opacity:0.7;filter:alpha(opacity=70);-moz-opacity:0.7; color:#FFFFFF; width:468px; z-index:1;}
#directions{ position:absolute; width: 370px; height:100%; overflow:auto; z-index:2; background-color:#222; display:none;}

.partners{ margin:10px 30px 10px 30px;}
.partners li{ background-color:#FFFFFF; padding:10px; margin:10px; float:left; width:20%; height:100px; border:solid 3px #FFFFFF; display:inline;}
.white_bg{ background-color:#FFFFFF;}
.black_bg { background-color:#000000;}
.partners img{display:block; margin-left:auto; margin-right:auto;}
.partners li:hover{ border:solid 3px #3B5998;}
.il_locale{ text-align:justify; left:3px; max-height:150px; right:553px; position:absolute; bottom:10px; padding-left:10px; padding-right:10px; font:10px Verdana;}
.promo{ position:absolute; top:2px; left:10px; right:810px; bottom:150px; border:solid 1px #FFFFFF; display:block;}
.promo input[type='text'] { width:245px;}
.promo table{ width:100%; margin:0 auto; border:0px;}
.promo #subscription{ text-align:center; display:block;}
.promo #promo_header{ text-align:justify; padding:10px; color:#FFFFFF;}
#promo_header strong{color:#3B5998;}
#chicco_riso{bottom:125px;left:80px;position:absolute;}
#photogallery_menu
        {
        	position:absolute;
        	display: inline; 
        	width: 512px;
            background: #222222;
            top:10px;
        }
#photogallery_menu img
        {
            margin: 5px;
            background: #333;
            width:50px;
            height:40px;
            float: left;
        }
#photogallery_menu a { cursor:pointer;}
#photogallery_menu ul
        {
            margin: 0;
            padding: 0;
            list-style: none;
        }
#photogallery_menu ul li
        {
            margin: 2px;
            background: #333;
            width: 250px;
            float: left;
            border: 1px solid #fff;
        }
#photogallery_menu ul li:hover
        {
            /*--Hover State--*/
            border: 1px solid #3B5998;
        }
#photogallery_menu ul li:active
        {
            /*--Active State--*/
            background: #fff;
            color:#000000;
            cursor: default;
        }
#photogallery_menu ul li h2
        {
            font-size: 14px;
            margin: 5px 0;
            padding: 0;
        }
#photogallery_menu ul li .block
        {
            float:left;
			margin-left:3px;
			padding:0;
        }
/*---------------------------SlideBar-----------------------------------------*/
.scroll-pane {
	width: 250px;
	height: 220px;
	overflow: auto;
	float: left;
}
.jScrollPaneContainer {	position: relative;	overflow: hidden;	z-index: 1;}
.jScrollPaneTrack {
	position: absolute;
	cursor: pointer;
	right: 0;
	top: 0;
	height: 100%;
	background: #000;
	opacity:0.7;filter:alpha(opacity=70);-moz-opacity:0.7;
}
.jScrollPaneDrag {
	position: absolute;
	background: #3B5998;
	cursor: pointer;
	overflow: hidden;
}
.jScrollPaneDragTop {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}
.jScrollPaneDragBottom {
	position: absolute;
	bottom: 0;
	left: 0;
	overflow: hidden;
}
a.jScrollArrowUp {
	display: block;
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;}
a.jScrollArrowUp:hover {/*background-color: #f60;*/}
a.jScrollArrowDown {
	display: block;
	position: absolute;
	z-index: 1;
	bottom: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
}
a.jScrollArrowDown:hover {/*background-color: #f60;*/}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {/*background-color: #f00;*/}
/*---------------------------Index Slider-------------------------------------*/
 .main_image
        {
            width: 550px;
            height:100%;
            display:block;
            position:absolute;
            right:0px;
            bottom:0px;
            background: #222222;
            overflow: hidden; /*--Overflow hidden allows the description to toggle/tuck away as it slides down--*/
            color: #fff;
        }
        .main_image img{ display:block; margin:auto; max-height:100%;}
        .main_image h2
        {
            font-size: 2em;
            font-weight: normal;
            margin: 0 0 5px;
            padding: 10px;
        }
        .main_image p
        {
            font-size: 1.2em;
            line-height: 1.6em;
            padding: 10px;
            margin: 0;
        }
        .block small
        {
            /*--We'll be using this same style on our thumbnail list--*/
            font-size: 0.8em;
            padding: 0 0 0 20px;
            background: url(icon_calendar.gif) no-repeat 0 center;
        }
        .main_image .block small
        {
            margin-left: 10px;
        }
        .main_image .desc
        {
            position: absolute;
            bottom: 0;
            left: 0; /*--Stick the desc class to the bottom of our main image container--*/
            width: 100%;
            display: none; /*--Hide description by default, if js is enabled, we will show this--*/
        }
        .main_image .block
        {
            width: 100%;
            background: #111;
            border-top: 1px solid #000;
        }
        .main_image a.collapse
        {
            /*--This is our hide/show tab--*/
            background: url(btn_collapse.gif) no-repeat left top;
            height: 27px;
            width: 93px;
            text-indent: -99999px;
            position: absolute;
            top: -27px;
            right: 20px;
        }
        .main_image a.show
        {
            background-position: left bottom;
        }
        .image_thumb
        {
        	position:absolute;
        	right:555px;
            width: 250px;
            background: #222222;
        }
        .image_thumb img
        {
            margin: 5px;
            background: #333;
            width:50px;
            height:100%;
            float: left;
            max-height:50px;
        }
        .image_thumb ul
        {
            margin: 0;
            padding: 0;
            list-style: none;
        }
        .image_thumb ul li
        {
            margin: 2px;
            background: #333;
            width: 250px;
            float: left;
            border: 1px solid #fff;
        }
        .image_thumb ul li.hover
        {
            /*--Hover State--*/
            cursor: pointer;
            border: 1px solid #3B5998;
        }
        .image_thumb ul li.active
        {
            /*--Active State--*/
            background: #fff;
            color:#000000;
            cursor: default;
        }
        html .image_thumb ul li h2
        {
            font-size: 14px;
            margin: 5px 0;
            padding: 0;
        }
        .image_thumb ul li .block
        {
            float:left;
			margin-left:3px;
			padding:0;
        }
        .image_thumb ul li p
        {
            display: none;
        }
/*----------------------------------------------------------------------------*/
#logo
{
	background: #000000;
	float: left;
	width: 30%;
	display: block;
	height: 50px;
}
#logo img
{
	background: url(img/shakymakaky.jpg) no-repeat;
	left: 25px;
	position: absolute;
	top: 12px;
}

div#title
{
	display: block;
	float: left;
	text-align: left;
	float: right;
}

#logindisplay
{
	font-size: 1.1em;
	display: block;
	text-align: right;
	margin: 10px;
	color: White;
}

#logindisplay a:link
{
	color: white;
	text-decoration: underline;
}

#logindisplay a:visited
{
	color: white;
	text-decoration: underline;
}

#logindisplay a:hover
{
	color: white;
	text-decoration: none;
}

.field-validation-error
{
	color: #ff0000;
}

.input-validation-error
{
	border: 1px solid #ff0000;
	background-color: #ffeeee;
}

.validation-summary-errors
{
	font-weight: bold;
	color: #ff0000;
}