
@-moz-keyframes spin{0%{-moz-transform:rotate(0deg)}100%{-moz-transform:rotate(360deg)}}
@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg)}}
@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}


.twoCol70-30 .colMain {width:100% !important; margin: 0!important;}
.twoCol70-30 .colAside {display:none !important;}
.textbox strong {font-family: 'FuturaStd-Book';}

.textbox strong {
	font-family: 'FuturaStd-Book';
}

.smallHero h1 {
    color: #90aed9;
}


html.noscroll, body.noscroll {
	/*height: 100%;
    overflow: hidden;*/
}


#what-container  p, #what-container ul,#what-container ol,#what-container dl,#what-container pre,#what-container address,#what-container table,#what-container blockquote{margin-bottom:0em;}


/* da aggiungere */
@font-face {
	font-family: 'FuturaStd-Light';
	src: url("../fonts/FuturaStd/FuturaStd-Light.eot");
	src: url('../fonts/FuturaStd/FuturaStd-Light.eot?#iefix') format('embedded-opentype'),
	url('../fonts/FuturaStd/FuturaStd-Light.woff') format('woff'),
	url("../fonts/FuturaStd/FuturaStd-Light.ttf") format("truetype"), 
	url("../fonts/FuturaStd/FuturaStd-Light.svg") format("svg");
	font-weight: normal;
	font-style: normal;
}

html, body {
	overflow: hidden
}

#ctl00_ContentPlaceHolderAll_divSection {
	margin: 0 !important;
	padding: 0 !important;
	max-width: none
}

#ctl00_ContentPlaceHolderAll_divSection .section:first-child {
	margin-bottom: 0
}

#what-container {
	height: 100%;
	width: 100%;
	font-family: 'FuturaNewBook', Arial, Helvetica, Verdana, sans-serif;
	color: #666666;
}

#what-container .block hr {
	position: absolute;
	left: 10px;
	right: 10px;
	border-color: #EAEAEA;
	z-index: -1;
	margin: 0;
	height: 0;
	bottom: 0
}


#what-container.loading .loader {
	pointer-events: auto;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	opacity: 1
}

#what-container .loader {
	pointer-events: none;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	background-color: rgba(255, 255, 255, 0.6);
	z-index: 1000;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-transition: 2s opacity cubic-bezier(0.19, 1, 0.22, 1);
	transition: 2s opacity cubic-bezier(0.19, 1, 0.22, 1);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	opacity: 0
}



#what-container .loader > div {
  background-color: #fff;
  border-radius: 100%;
  margin: 100px;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  border: 7px solid rgba(88, 176, 226, 1);
  border-bottom-color: transparent;
  border-right-color: transparent;
  height: 50px;
  width: 50px;
  background: transparent !important;
  display: inline-block;
  -webkit-animation: rotate 1.45s 0s linear infinite;
  animation: rotate 1.45s 0s linear infinite; 
}

@-webkit-keyframes rotate {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }

  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg); }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }

@keyframes rotate {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }

  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg); }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } 
}

@-moz-keyframes rotate {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }

  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg); }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }

@keyframes rotate {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }

  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg); }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } 
}

@keyframes rotate {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }

  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg); }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }

@keyframes rotate {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }

  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg); }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } 
}




#what-container .block {
	padding: 0;
	width: 100%;
	position: relative;
	overflow: hidden;
	height: 500px;
}


#what-container .titleColor {
	text-align: center;
	font-family: "FuturaStd-Light";
	font-size: 16px;
	padding-top: 15px;
	clear: both;
	color: #383838;
}


#what-container .section {
	background: transparent;
	padding: initial;
	margin: 0 auto;
	z-index: initial;
	max-width: 1200px;
	display: table;
	width: 100%;
}




/* First Block */
#what-container .block.first {
	    height: 450px;
	    background-size: cover;
		background-position: center center;
		background-image: url("first.jpg")
}

#what-container .block.first .section {
	max-width: 1000px;
	height:100%;
}


#what-container .block.first .textLayer {

	width: 100%;
    height: 100%;
    display: block;
    vertical-align: middle;
    padding: 15% 0% 0;
    margin: 0 auto;
        
}

#what-container .block.first .textLayer h2{
    font-family: "FuturaStd-Light";
    text-align: left;
    
    font-size: 42px;
    position: absolute;
    margin: 0;
    color: #fff;
    text-shadow: 0px 0px 6px rgba(0, 0, 0, 1);
    text-align: center;
    top: 28%;
    width: 100%;
}

#what-container .block.first .textLayer h3{
    font-family: "FuturaStd-Light";
    text-align: left;
    padding: 22px 10% 0;
    font-size: 24px;
    margin: 0;
    color:#fff;
    text-shadow: 0px 0px 6px rgba(0, 0, 0, 1);
    text-align:center;
        position: absolute;
    top: 35%;
}

#what-container .block.first .textLayer a {display:block;padding: 10px 0 0;color:#fff;text-shadow: 2px 2px #000;text-decoration:none;font-size:15px;margin-top: 20px;}


#what-container .block.first .textLayer a img { width: 27px;
    vertical-align: middle;
    margin-top: -6px;
    margin-left: 9px; }

#what-container .block.first .buttong {position: absolute;
    bottom: 9%;
    text-align: center;
    width: 100%;
    z-index:999;
    } 
    
 #what-container .block.first .buttong   a {background:#0099cc;border-radius:10px; padding:14px 30px 12px;color:#fff;text-decoration:none;font-size:16px;}

#what-container .block.first .imagebox .textLayer p {
	background: rgba(255,255,255,0.9);
    padding: 10px 20px;
    font-size: 28px;
	display: inline-block;
}

#what-container .not-active {
   pointer-events: none;
   cursor: default;
}

/* Second Block */
#what-container .block.second {
	    height: auto;
background: #050D21;
}


#what-container .block.second .section {
	width: 1000px;
padding-bottom:30px;
	-moz-transition: 0.3s all ease-out;
    	-webkit-transition: 0.3s all ease-out;
    	transition: 0.3s all ease-out;
    	
    		    height: auto;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#272f43+17,050d21+76 */
background: #272f43; /* Old browsers */
background: -moz-radial-gradient(center, ellipse cover, #272f43 17%, #050d21 76%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover, #272f43 17%,#050d21 76%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center, #272f43 17%,#050d21 76%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#272f43', endColorstr='#050d21',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

    min-height: 520px;
}

#what-container .block.second .headQ{    
	color: #fff;
    font-family: "FuturaStd-Light";
    text-align:center;
    font-size:30px;	
    padding-top:30px;
}

#what-container .block.second .re1a .headQ,
#what-container .block.second .re1b .headQ,
#what-container .block.second .re2a .headQ,
#what-container .block.second .re2b .headQ,
#what-container .block.second .re2c .headQ,
#what-container .block.second .re3a .headQ,
#what-container .block.second .re3b .headQ 
{
	

}

#what-container .block.second .que2 .headQ,#what-container .block.second .que3 .headQ {border-top:0;}


#what-container .block.second .vaiGamma{

	clear: both;
    text-align: center;
}

#what-container .block.second .answerQ {height: auto;display:inline-block;width:33%;text-align:center;color:#fff;font-size:14px;vertical-align:top;padding-bottom:35px;}



#what-container .block.second .answerQ img {width:270px;    margin: -1px;}

#what-container .block.second .answerQ .over {position:absolute;        margin-left: 3%;
    margin-top: 30px;border-radius:100%;border:5px solid #cccccc;width: 268px;
    height: 268px;
    -moz-transition: 0.3s all ease-out;
    	-webkit-transition: 0.3s all ease-out;
    	transition: 0.3s all ease-out;
    }

#what-container .block.second .answerQ .over:hover {
	border:8px solid #0098ce;
margin-left: 2.7%;
    margin-top: 27px;
}

#what-container .block.second .answerQ .text{  margin-top: 102%;padding:0 25px;  font-size:16px;  }
#what-container .block.second .answerQ .text span{   
    text-transform: uppercase;
    display: block;
    margin-top: 20px;
    
    text-align: center;
    width: 100%;
    padding-bottom: 15px;
    font-size:18px;
}

#what-container .block.second .answerQ a:hover,#what-container .block.second .answerQ a.selected{
	
}


#what-container .block.second .visited{

}


#what-container .block.second .question{
	height:100%;
	opacity:0;
	max-height:0px;
	overflow:hidden;
	-moz-transition: 1.3s opacity ease-out;
    -webkit-transition: 1.3s opacity ease-out;
    transition: 1.3s opacity ease-out;
    width:100%;	

position:relative;
top:0px;
}

#what-container .block.second .question.active{
	opacity:1;
	max-height:100%;
	text-align:center;
}


#what-container .block.second .banswers {
    position: absolute;
    height: auto;
    -moz-transition: 0.8s all ease-out;
    -webkit-transition: 0.8s all ease-out;
    transition: 0.8s all ease-out;
    overflow: hidden;
    
}

#what-container .block.second .banswers.active {position:relative;}

#what-container .block.second .banswer {
    margin-top: 20px;
    clear: both;
    opacity:0;
    height: 100%;
    overflow: hidden;
    -moz-transition: 0.6s all ease-out;
    -webkit-transition: 0.6s all ease-out;
    transition: 0.6s all ease-out;
    display: block;
    position: absolute;
    text-align:center;
    
}

#what-container .block.second .banswer.active{position: relative;}
#what-container .block.second .banswer img {display: block;
    margin: 0 auto;}

#what-container .block.second .banswer.active{
	opacity:1;
}

#what-container .block.second .banswer a{
	background: #0099cc;
    border-radius: 10px;
    padding: 14px 30px 12px;
    color: #fff;
    text-decoration: none;
    font-size: 16px;
    display: inline-block;
    text-transform:uppercase;

}


#what-container .block.second .toplist {
	border-top:1px solid #ccc;
	margin-top:20px;
	width:450px;
	margin:75px auto 60px;
	    position: relative;
}

#what-container .block.second .toplist .res {
	background:#060f1f;
	height: 36px;
    width: 36px;
    margin-top: -35px;
    position: absolute;
        -moz-transition: 0.5s all ease-out;
    -webkit-transition: 0.5s all ease-out;
    transition: 0.5s all ease-out;
        text-align:center;
    padding: 0 1%;


}

#what-container .block.second .toplist .res.box1{left:0;}
#what-container .block.second .toplist .res.box2{left:50%;margin-left:-4%;}
#what-container .block.second .toplist .res.box3{right:0;}


#what-container .block.second .toplist .res.box2.image {margin-left:-15px;}

#what-container .block.second .toplist .dot {
	
	    background: #090c1b;
	    width:15px;
	    height:15px;
	        border-radius: 100%;
    border: 2px solid #cccccc;
   	margin: 7px;
   	    -moz-transition: 1.3s background ease-out;
    -webkit-transition: 1.3s background ease-out;
    transition: 1.3s background ease-out;
	opacity:1;
	position: absolute;
	margin-top: 25px;
}

#what-container .block.second .toplist .res.image {
	height: 90px;
    width: 90px;
}

#what-container .block.second .toplist .res.image .dot {
		opacity:0;
}


#what-container .block.second .toplist .res .over {
	opacity:0;
	-moz-transition: 0.5s opacity ease-out;
    -webkit-transition: 0.5s opacity ease-out;
    transition: 0.5s opacity ease-out;
	position:absolute;
	z-index:20;
    width: 82px;
    margin-top: -5px;
    margin-left: 4px;
}

#what-container .block.second .toplist .res.image .over.active {
	opacity:1;
	z-index:200;
}


#what-container .block.second .toplist .dot.active {
	
	    background: #0099cc;
}

#what-container .block.second .toplist .res.box2.image .over.active,#what-container .block.second .toplist .res.box3.image .over.active {
   
    margin-left: 4px;
}



#what-container .block.second .toplist .res.box2.image {margin-left:-11%;}





#what-container .block.second .toplist .res .over img {width:69px;    margin: -1px;}

#what-container .block.second .toplist .overb {position:absolute;        margin-left: 3%;
    border-radius:100%;border:4px solid #cccccc;
        width: 67px;
    height: 67px;
    -moz-transition: 0.3s all ease-out;
    	-webkit-transition: 0.3s all ease-out;
    	transition: 0.3s all ease-out;
    }
    
#what-container .block.second .toplist .overb a{
    pointer-events: none;
   cursor: default;
    }
    
#what-container .block.second .toplist .image .overb a{
    pointer-events: inherit;
   cursor: inherit;
    }

#what-container .block.second .toplist .overb:hover {
	border:4px solid #0098ce;
}

#what-container .block.second .toplist .text{  margin-top: 102%;
    padding: 0 0px;
    text-align: center;
    width: 100%;
    font-size: 10px;
        }
#what-container .block.second .toplist .text span{   
    text-transform: uppercase;
    display: block;
    margin-top: 20px;
    
    text-align: center;
    width: 100%;
    padding-bottom: 15px;
    color:#fff;
}


#what-container .block.second .blockimage {display:table;padding-top:10px;vertical-align: middle;}
#what-container .block.second .blockimage .image,#what-container .block.second .blockimage .text {display:table-cell;width:50%;vertical-align:middle}
#what-container .block.second .blockimage .text {text-align: left;color:#fff;font-size:16px;padding-left: 4%;font-family: "FuturaStd-Light";}


#what-container .block.second .blockimage2 {display:table-cell;width:50%;padding-top:10px;vertical-align: middle;}
#what-container .block.second .blockimage2 .image,#what-container .block.second .blockimage2 .text {display:table-cell;width:50%;vertical-align:middle}
#what-container .block.second .blockimage2 .text {text-align: left;color:#fff;font-size:14px;padding-left: 4%;font-family: "FuturaStd-Light";}
#what-container .block.second .blockimage2 .image img {width: 300px;}

#what-container .block.second .result1, #what-container .block.second .result2 {
	width: 38%;
    display: inline-block;
    text-align: center;
    margin: 0px 0;
    padding-left: 11%;
}


#what-container .block.second .banswer .blockimage2 .result1,#what-container .block.second .banswer .blockimage2 .result2 {
	
	display:none;

}



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



#what-container .block.first {
    height: 550px;
}

#what-container .block.second .section {
    width: 100%;
}

#what-container .block.second .answerQ .text {
    margin-top: 0;
    padding: 0 25px;
    font-size: 16px;
}

#what-container .block.second .answerQ .over{
	margin-left:0;
	border-radius:0px;
	border:0;
    position: relative;
    width: 100%;
    height: 100%;
}

#what-container .block.second .answerQ img {
    width: 80%;
    margin: 0;
    border: 5px solid #cccccc;
    border-radius: 100%;
    display: block;
        margin: 0 auto;
}


#what-container .block.second .banswer img {
    display: block;
    margin: 0 auto;
    width: 400px;
}

#what-container .block.second .section {
    width: 92%;
    margin: 0 4%;
}

#what-container .block.second .blockimage2 {
    display: block;
    width: 100%;
    padding-top: 0px;
    vertical-align: middle;
}

#what-container .block.second .banswer.double .result1,#what-container .block.second .banswer.double .result2 {
	display:none;
	}


#what-container .block.second .banswer .blockimage2 .result1,#what-container .block.second .banswer .blockimage2 .result2 {
	
	display:block;
	width:100%;
	padding:0;
}

#what-container .block.second .answerQ .over:hover {
	border:0;
	margin-left:0;
	    margin-top: 30px;
}


#what-container .block.second .answerQ .text span {
	font-size:16px;
	}
	
	#what-container .block.second .answerQ .text {
    font-size: 14px;
}

#what-container .block.first .textLayer h2 {
    font-size: 33px;
    }


}



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


	#what-container .block.first .textLayer {
    
	}
	
	#what-container .block.second .answerQ {
    	width: 32%;
	}
	
	#what-container .block.second .banswer img {
    display: block;
    margin: 0 auto;
    width: 300px;
}
}

@media only screen and (max-width: 414px) {	
	
	#what-container .block.first .textLayer h2 {
    font-size: 20px;
	}
	
	#what-container .block.first .textLayer h3 {
    	font-size: 16px;
    }
	
	#what-container .block.first .textLayer {
 }

#what-container .block.first .buttong a {
    background: #0099cc;
    border-radius: 10px;
    padding: 14px 10px 12px;
    color: #fff;
    text-decoration: none;
    font-size: 12px;
}

#what-container .block.first {
    height: 400px;
}

#what-container .block.second .toplist {
    width: 350px;
    
    }
	
	#what-container .block.second .answerQ img {
    width: 80%;
    margin: 0;
    border: 2px solid #cccccc;
    border-radius: 100%;
    display: block;
    margin: 0 auto;
}

#what-container .block.second .answerQ .text span {
    font-size: 13px;
}

#what-container .block.second .answerQ .text {
    font-size: 13px;
    padding: 0 5px;
}

#what-container .block.second .headQ {
    font-size: 22px;
}

#what-container .block.second .blockimage2 .image, #what-container .block.second .blockimage2 .text {
    display: block;
    width: 100%;
    vertical-align: middle;
}

#what-container .block.second .blockimage2 .text {
	padding-bottom:30px;
}


#what-container .block.second .blockimage .image, #what-container .block.second .blockimage .text {
    display: block;
    width: 100%;
    vertical-align: middle;
}

#what-container .block.second .blockimage .text {
	padding-bottom:30px;
}

#what-container .block.second .banswer a {
    background: #0099cc;
    border-radius: 10px;
    padding: 14px 10px 12px;
    color: #fff;
    text-decoration: none;
    font-size: 14px;
    display: inline-block;
    text-transform: uppercase;
}
	
	
}

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

#what-container .block.first .textLayer a {
    font-size: 13px;
    }
    
    #what-container .block.second .toplist {
    width: 100%;
}
    
}

