/* CSS Document */
/* Built by Jack at Tristar */
/* Modified for improved browser compatibility by <a href="http://www.os-templates.com/">OS Templates</a> */

/* Reset */
*{margin:0; padding:0;}
img, img a{outline:none; border:none;}
body{background-color:#fff; color:#575757; font:81.3% "arial",sans-serif; margin:0; padding:0;}
a, a:visited{outline:none; color:#4086c6; text-decoration:none;}
a:hover{text-decoration:underline;}

/* Modern Clear Floating Fix */

.clear:before, .clear:after{content:""; display:table;}
.clear:after{clear:both;}
.clear{zoom:1; /* For IE 6/7 (trigger hasLayout) */}

/* HTML5 Fix */

header, section, footer, aside, nav, article{display:block;}

/* Base Structure */

.bodywidth{width:960px; margin:0 auto; clear:both;}

/* General Type */

h1, h2, h3, h4, h5, h6{color:#2f2f2f; font-family:"Ubuntu",arial;}
.bold{font-weight:bold;}
.blue{color:#4086c6;}

/* Header */

#headerwrap{width:100%; background:url("../images/headerbg.jpg") repeat-x 0 0; height:117px;}
#mainheader{padding:35px 0 0 0; color:#2f2f2f; text-shadow:0 0 1px #fff;}
.logo{float:left; margin:0 10px 0 0; -webkit-transition:-webkit-transform 0.4s ease-out; -moz-transition:-moz-transform 0.4s ease-out; transition:transform 0.4s ease-out;}
.logo:hover{cursor:pointer; -webkit-transform:rotate(360deg); -moz-transform:rotate(360deg); transform:rotate(360deg);}
#websitetitle{float:left; margin:-8px 0 0 0;}
#websitetitle h2{font-size:2.538em; font-weight:normal;}
#websitetitle h3{font:1.462em "Georgia"; font-style:italic; font-weight:normal; margin:-3px 0 0 0;}
#mainheader nav{float:right; font:1.4em "Ubuntu",arial; margin:8px 0 0 0;}
#mainheader nav li{list-style-type:none; display:inline; margin:0 0 0 45px;}
#mainheader a, #mainheader:visited{color:#2f2f2f;}
#mainheader a:hover{text-decoration:none; color:#7e7e7e;}

/* Intro */

#introduction{margin-top:15px;}
#introduction h2{font-size:2.231em; font-weight:bold; margin:0 0 5px 0;}
#introduction p{font-size:1.154em; line-height:140%;}
#introleft{float:left; width:540px; margin:0 0 10px 0; background:url("../images/sfondo_testata-540px.jpg") no-repeat;}
#introleft h4{color:red; text-align:center; font-size:18px;}
#introquote{float:right; font-style:italic; font-size:1.15em; width:335px; background:url("../images/leftquotemark.png") no-repeat 0 0; padding:28px 0 0 45px; margin:10px 0 15px 0;}
#introduction .quotename{float:right; height:27px; background:url("../images/rightquotemark.png") no-repeat right top; margin:10px 0 0 0; padding:0 50px 0 0; font:0.9em "Ubuntu"; color:#4086c6;}
a.findoutmore, a.findoutmore:visited{padding:10px; font:0.9em "Ubuntu",arial; font-weight:bold; color:#fff; text-shadow:0 0 1px #1e5298; background-image:-webkit-gradient(linear,left bottom,left top,color-stop(0.12,rgb(109,171,229)),color-stop(0.56,rgb(59,126,189))); background-image:-moz-linear-gradient(center bottom,rgb(109,171,229) 12%,rgb(59,126,189) 56%); background-color:#468ac9; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; margin:13px 0 0 0; float:left;}
a.findoutmore:hover{background-color:#2f2f2f; background-image:none; text-shadow:0 0 1px #000; text-decoration:none;}
#intro-citta h4{color:red; text-align:center; font-size:18px;}

/* Main Content */

#maincontent{border-top:1px #dbdbdb solid; padding:25px 0 0 0; overflow:hidden;}
#maincontent{font-size:110%;}
#aboutleft{float:left; width:590px;}
#aboutleft h1{font-size:1.5em; font-weight:bold; margin:0 0 15px 0;}
#aboutleft h2{font-size:1.3em; font-weight:bold; margin:10px 0 15px 0;}
#aboutleft p{line-height:135%; margin:0 0 15px 0;}
#articlesright{float:right; width:330px;}
#articlesright article{clear:both; margin:0 0 20px 0; overflow:hidden;}
#articlesright figure{padding:5px; border:1px #dbdbdb solid; float:left; width:119px; height:119px; margin:0 15px 0 0;}
#articlesright p{line-height:135%;}
#articlesright h2{margin-bottom:10px; margin:15px 0 10px 0; color:#F00692;}
#articlesright h3{font-size:1.2em; margin:0 0 6px 0; color:#F00692;}
#articlesright h3:hover{color:#2f2f2f;}
a.readmore, a.readmore:visited{padding:4px; font:0.9em "Ubuntu",arial; font-weight:bold; color:#fff; text-shadow:0 0 1px #1e5298; background-image:-webkit-gradient(linear,left bottom,left top,color-stop(0.12,rgb(109,171,229)),color-stop(0.56,rgb(59,126,189))); background-image:-moz-linear-gradient(center bottom,rgb(109,171,229) 12%,rgb(59,126,189) 56%); background-color:#468ac9; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; margin:10px 0 0 0; float:left;}
a.readmore:hover{background-color:#2f2f2f; background-image:none; text-shadow:0 0 1px #000; text-decoration:none;}

#banner-fondopagina {overflow:hidden;}

/* Footer */

#footerwrap{width:100%; margin:20px 0 0 0; padding:30px 0; background:#2d2d2d url("../images/footerbg.jpg");}
#mainfooter{text-shadow:0 0 1px #000;}
#mainfooter nav{float:left; font-style:italic; font-size:1.1em;}
#mainfooter nav ul{margin:0; padding:0; list-style:none;}
#mainfooter li{list-style-type:none; float:left; margin:0 15px 0 0;}
#mainfooter li:last-child{margin-right:0;}
#mainfooter a, #mainfooter a:visited{color:#fff;}
.copyright{float:right; color:#b8b8b8;}
.disclaimer{color:#b8b8b8; text-align:center; margin-top:5px;}

/* MEDIA QUERIES */

/* Under 960px */
@media only screen and (max-width: 980px) and (min-width: 821px) {
.bodywidth{width:800px;}
#mainheader nav{font-size:1.1em;}
#mainheader nav li{margin:0 0 0 40px;}
#introleft{width:470px; background:url("../images/sfondo_testata-470px.jpg") no-repeat;}
#introquote{width:270px;}
#introduction h2{font-size:2.85em;}
#aboutleft{width:450px;}
#articlesright{width:324px;}
#articlesright article{font-size:0.95em;}
#mainfooter{font-size:0.9em;}
#mainfooter li{margin:0 25px 0 0;}
#mainfooter li:last-child{margin-right:0;}
}

/* Under 800px */
@media only screen and (max-width: 820px) and (min-width: 621px) {
.bodywidth{width:600px;}
#mainheader{padding:10px 0 0 0;}
#mainheader nav{font-size:1.1em; margin:12px 0 0 0;}
#mainheader nav li{margin:0 0 0 15px;}
.logo{width:40px; height:40px;}
#websitetitle h1{font-size:2.3em;}
#websitetitle h2{font-size:1.2em;}
#introleft{width:600px; background:url("../images/sfondo_testata-600px.jpg") no-repeat;}
#introquote{display:none;}
#aboutleft{width:400px;}
#articlesright{width:170px;}
#articlesright figure{display:none;}
#mainfooter{font-size:0.9em;}
#mainfooter nav, .copyright{display:block; float:none; width:100%; margin-bottom:15px;}
#mainfooter li{margin:0 15px 0 0;}
#mainfooter li:last-child{margin-right:0;}
.copyright{color:#b8b8b8; margin-bottom:0;}
}

/* Under 600px */
@media only screen and (max-width: 620px) and (min-width: 501px) {
.bodywidth{width:480px;}
#mainheader{padding:25px 0 0 0;}
#mainheader nav{float:left; font-size:1.1em; margin:18px 0 0 0;}
#mainheader nav li{margin:0 30px 0 0;}
.logo{width:40px; height:40px;}
#websitetitle h1{font-size:2.3em;}
#websitetitle h2{font-size:1.2em;}
#websitetitle h3{font-size:1.1em;}
#introleft{width:480px; background:url("../images/sfondo_testata-470px.jpg") no-repeat;}
#introduction h2{font-size:2.7em;}
#introquote{display:none;}
#aboutleft{width:310px; font-size:0.9em;}
#articlesright{width:150px;}
#articlesright article{font-size:0.9em;}
#articlesright figure{display:none;}
#mainfooter{font-size:0.9em;}
#mainfooter nav, .copyright{display:block; float:none; width:100%; margin-bottom:15px;}
#mainfooter li{margin:0 15px 0 0;}
#mainfooter li:last-child{margin-right:0;}
.copyright{color:#b8b8b8; margin-bottom:0;}
#banner-fondopagina {width:450px; overflow:hidden;}
#box-miniature-intro {width:450px; overflow:hidden;}
}

/* Under 480px */
@media only screen and (max-width: 500px) and (min-width: 341px) {
.bodywidth{width:320px;}
#mainheader{padding:25px 0 0 0;}
#mainheader nav{float:left; font-size:1.1em; margin:18px 0 0 0;}
#mainheader nav li{margin:0 30px 0 0;}
.logo{width:40px; height:40px;}
#websitetitle h1{font-size:2.3em;}
#websitetitle h2{font-size:1.2em;}
#websitetitle h3{font-size:1.1em;}
#introleft{width:320px; font-size:0.8em; background:url("../images/sfondo_testata-300px.jpg") no-repeat;}
#introduction h2{font-size:2.3em;}
#introquote{display:none;}
#aboutleft{width:320px; font-size:0.9em;}
#articlesright{width:320px; float:left; border-top:1px #dbdbdb solid; padding:20px 0 0 0; margin:10px 0 0 0;}
#articlesright article{font-size:0.9em;}
#articlesright figure{display:none;}
#mainfooter{font-size:0.8em;}
#mainfooter nav, .copyright{display:block; float:none; width:100%; margin-bottom:15px;}
#mainfooter li{margin:0 6px 0 0;}
#mainfooter li:last-child{margin-right:0;}
.copyright{color:#b8b8b8; margin-bottom:0;}
#banner-fondopagina {width:450px; overflow:hidden;}
#box-miniature-intro {width:450px; overflow:hidden;}
}

/* Under 320px */
@media only screen and (max-width: 340px) and (min-width: 5px)  {
.bodywidth{width:300px;}
#mainheader{padding:27px 0 0 0;}
#mainheader nav{float:left; font-size:0.9em; margin:15px 0 0 0;}
#mainheader nav li{margin:0 30px 0 0;}
.logo{width:40px; height:40px;}
#websitetitle h1{font-size:2.3em;}
#websitetitle h2{font-size:1.2em;}
#websitetitle h3{font-size:1.1em;}
#introleft{width:300px; font-size:0.8em; background:url("../images/sfondo_testata-300px.jpg") no-repeat;}
#introduction h2{font-size:2.3em;}
#introquote{display:none;}
#aboutleft{width:300px; font-size:0.9em;}
#articlesright{width:300px; float:left; border-top:1px #dbdbdb solid; padding:20px 0 0 0; margin:10px 0 0 0;}
#articlesright article{font-size:0.9em;}
#articlesright figure{display:none;}
#mainfooter{font-size:0.7em;}
#mainfooter nav, .copyright{display:block; float:none; width:100%; margin-bottom:15px;}
#mainfooter li{margin:0 6px 0 0;}
#mainfooter li:last-child{margin-right:0;}
.copyright{color:#b8b8b8; margin-bottom:0;}
#banner-fondopagina {width:300px; overflow:hidden;}
#box-miniature-intro {width:300px; overflow:hidden;}
}

#scegli-regione{background-color:#F0D0EE; padding:5px; margin-bottom:10px;}
#box-login{display:none; width:300px; float:right;}

/* 4 colonne */

.a { float: Left; width: 25%; }
.b { float: Left; width: 25%; }
.c { float: Left; width: 25%; }
.d { float: Left; width: 25%; }

/* 2 colonne */
.box50a { float: left; width: 48%; border-right: 1px solid #dedede;}
.box50b { float: left; width: 48%; padding-left:10px;}

/* 3 colonne */
.box33a { float: left; width: 32%;}
.box33b { float: left; width: 32%; border-left: 1px solid #2f2f2f; padding-left:10px;}
.box33c { float: left; width: 32%; border-left: 1px solid #2f2f2f; padding-left:10px;}

@media only screen and ( max-width: 767px) {
.a { width: 100%; }
.b { width: 100%; }
.c { width: 100%; }
.d { width: 100%; }
.box50a, .box50b {width: 100%; border-right: none; padding-left:0px;}
.box33a, .box33b, .box33c {float:none; width: 100%; border-right: none; padding-left:0px; border-left:none} 
}

#elenco-stati h3{margin-top:5px; margin-bottom:10px;}
#elenco-stati li{list-style-type:none; padding-bottom:3px;}


/* fade slider */
.slides {
    height:150px;
    margin:5px auto;
    overflow:hidden;
    position:relative;
    /*width:180px;
	float:left;*/
}
.slides ul {
    list-style:none;
    position:relative;
}

/* keyframes #anim_slides */
@-webkit-keyframes anim_slides {
    0% {
        opacity:0;
    }
    6% {
        opacity:1;
    }
    24% {
        opacity:1;
    }
    30% {
        opacity:0;
    }
    100% {
        opacity:0;
    }
}
@-moz-keyframes anim_slides {
    0% {
        opacity:0;
    }
    6% {
        opacity:1;
    }
    24% {
        opacity:1;
    }
    30% {
        opacity:0;
    }
    100% {
        opacity:0;
    }
}

.slides ul li {
    opacity:0;
    position:absolute;
    top:0;

    /* css3 animation */
    -webkit-animation-name: anim_slides;
    -webkit-animation-duration: 24.0s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: normal;
    -webkit-animation-delay: 0;
    -webkit-animation-play-state: running;
    -webkit-animation-fill-mode: forwards;

    -moz-animation-name: anim_slides;
    -moz-animation-duration: 24.0s;
    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: infinite;
    -moz-animation-direction: normal;
    -moz-animation-delay: 0;
    -moz-animation-play-state: running;
    -moz-animation-fill-mode: forwards;
}

/* css3 delays */
.slides ul  li:nth-child(2), .slides ul  li:nth-child(2) div {
    -webkit-animation-delay: 6.0s;
    -moz-animation-delay: 6.0s;
}
.slides ul  li:nth-child(3), .slides ul  li:nth-child(3) div {
    -webkit-animation-delay: 12.0s;
    -moz-animation-delay: 12.0s;
}
.slides ul  li:nth-child(4), .slides ul  li:nth-child(4) div {
    -webkit-animation-delay: 18.0s;
    -moz-animation-delay: 18.0s;
}
.slides ul li img {
    display:block;
}

/* keyframes #anim_titles */
@-webkit-keyframes anim_titles {
    0% {
        left:100%;
        opacity:0;
    }
    5% {
        left:10%;
        opacity:1;
    }
    20% {
        left:10%;
        opacity:1;
    }
    25% {
        left:100%;
        opacity:0;
    }
    100% {
        left:100%;
        opacity:0;
    }
}
@-moz-keyframes anim_titles {
    0% {
        left:100%;
        opacity:0;
    }
    5% {
        left:10%;
        opacity:1;
    }
    20% {
        left:10%;
        opacity:1;
    }
    25% {
        left:100%;
        opacity:0;
    }
    100% {
        left:100%;
        opacity:0;
    }
}

.slides ul li div {
    background-color:#000000;
    border-radius:10px 10px 10px 10px;
    box-shadow:0 0 5px #FFFFFF inset;
    color:#FFFFFF;
    font-size:16px;
    left:5%;
    margin:0 auto;
    padding:5px;
    position:absolute;
    top:50%;
    width:100px;

    /* css3 animation */
    -webkit-animation-name: anim_titles;
    -webkit-animation-duration: 24.0s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: normal;
    -webkit-animation-delay: 0;
    -webkit-animation-play-state: running;
    -webkit-animation-fill-mode: forwards;

    -moz-animation-name: anim_titles;
    -moz-animation-duration: 24.0s;
    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: infinite;
    -moz-animation-direction: normal;
    -moz-animation-delay: 0;
    -moz-animation-play-state: running;
    -moz-animation-fill-mode: forwards;
}

#elenco-citta {background-color:rgba(247, 6, 6, 0.2); margin-bottom:10px; padding:3px;}
#elenco-citta  h3{margin-bottom:5px;}
#elenco-citta li{list-style-type:none; padding-bottom:3px;}

#banner-googlemap {width:300px; height:250px; float:left; margin: 5px 5px 5px 0;}
#banner-sidebar {width:330px; text-align:center; border-top: 1px solid #2f2f2f; padding-top:5px;}
#banner-elenco-citta {width:300px; height:250px; float:right; margin: 5px 0 5px 5px;}

@-webkit-keyframes blinker { from {opacity:1.0;} to {opacity:0.0;} }
        @keyframes blinker { from {opacity:1.0;} to {opacity:0.0;} }

.blink {
   text-decoration:blink;

  -webkit-animation-name:blinker;
          animation-name:blinker;  
  -webkit-animation-iteration-count:infinite;  
          animation-iteration-count:infinite;  
  -webkit-animation-timing-function:cubic-bezier(1.0,0,0,1.0);
          animation-timing-function:cubic-bezier(1.0,0,0,1.0);
  -webkit-animation-duration:1s; 
          animation-duration:1s; 
}


form dl {text-align:left;}

dl.horizontal {margin:10px 0; padding:0; }
dl.horizontal dt {margin:0 0 5px 0; padding:0; width:100px; float:left; clear:left;}
dl.horizontal dd {margin:0 0 5px 0; padding:0; width:195px; float:left;  }

dd input, 
dd select,
dd textarea,
dd checkbox { border:1px inset #585858;} 

dd button { width:120px; padding:5px; font-size:16px; margin-bottom:20px; color:white; background-color:rgb(216, 44, 44);} 

input.checkbox {width:auto; background:transparent; border-style:none;}

dl.horizontal dd.nolabel {clear:both; position:relative; left:120px; width:auto;}

.cadastrados {font-size:13px; color:red;}

select#Idade,
select#seekingAgeTo {width:86px;}


.snippet-utente {
margin: 5px 5px 5px 0;
height: 100px;
width: 235px;
float:left;
font-size: 12px;
line-height: 20px;
}

.snippet-utente a {
margin-bottom: 5px;
font-size: 14px;
}

.img-snippet-utente {
width:100px;
float:left;
margin-right: 10px;
}

.box-testo-risultati {
width:540px;
float:left;
margin-top: 40px;

}
	
.box-profili {
	max-height: 350px;
	overflow: hidden;
	}

.box-profili h4{
	margin-top:5px; 
	margin-bottom:10px; 
	color:#F00692; 
	font-size:15px;
	}
	
.box-profili p
	{
	font-size: 8pt;
	line-height: 1em;
	}
	
	
.miniatura
	{
	border:1px solid #ccc; 
	width: 100px;
	height: 145px;
	float:left;
	margin:3px;
	padding:3px;
	}	
	
/* menu di navigazione mobile friendly */
	

			#nav > a
			{
				display: none;
			}


@media only screen and ( max-width: 620px) {
			

			#nav
			{
			width: 60em; /* 1000 */
			font-family: 'Open Sans', sans-serif;
			font-weight: 200;
			margin-left: -30em; /* 30 480 */
			position: relative;
			top: auto;
			left: auto;
			}
				#nav > a
				{
					width: 3.125em; /* 50 */
					height: 3.125em; /* 50 */
					text-align: left;
					text-indent: -9999px;
					background-color: #4086c6;
					position: relative;
				}
					#nav > a:before,
					#nav > a:after
					{
						position: absolute;
						border: 2px solid #fff;
						top: 35%;
						left: 25%;
						right: 25%;
						content: '';
					}
					#nav > a:after
					{
						top: 60%;
					}

				#nav:not( :target ) > a:first-of-type,
				#nav:target > a:last-of-type
				{
					display: block;
				}

			#nav li
			{
				position: relative;
			}
				#nav li a
				{
					color: #fff;
					display: block;
				}
				#nav li a:active
				{
					background-color: #ffa3fb !important;
				}
				
				#nav span:after
			{
				width: 0;
				height: 0;
				border: 0.313em solid transparent; /* 5 */
				border-bottom: none;
				border-top-color: #efa585;
				content: '';
				vertical-align: middle;
				display: inline-block;
				position: relative;
				right: -0.313em; /* 5 */
			}			
				
			/* first level */

			#nav > ul
			{
				height: auto;
				display: none;
				position: absolute;
				left: 0;
				right: 0;
				background-color: #4086c6;
			}
				#nav:target > ul
				{
					display: block;
				}
				#nav > ul > li
				{
					width: 100%;
					height: 100%;
					float: none;
				}
					#nav > ul > li > a
					{
						height: auto;
						text-align: left;
						padding: 0 0.833em; /* 20 (24) */
						font-size: 1.2em; /* 24 */
						line-height: 1.5em; /* 60 (24) */
					}
						#nav > ul > li:not( :last-child ) > a
						{
							border-right: none;
							border-bottom: 1px solid #cc470d;
						}

						#nav > ul > li:hover > a,
						#nav > ul:not( :hover ) > li.active > a
						{
							background-color: #ffa3fb;
						}


				/* second level */

				#nav li ul
				{
					position: static;
					padding: 1.25em; /* 20 */
					padding-top: 0;
					background-color: #ffa3fb;
					display: none;
					top: 100%;
				}
		


	
					#nav li:hover ul
					{
						display: block;
						left: 0;
						right: 0;
					}
						#nav li:not( :first-child ):hover ul
						{
							left: -1px;
						}
						#nav li ul a
						{
							font-size: 1.25em; /* 20 */
							border-top: 1px solid #4086c6;
							padding: 0.75em; /* 15 (20) */
						}
							#nav li ul li a:hover,
							#nav li ul:not( :hover ) li.active a
							{
								background-color: #4086c6;
							}

}