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

body{
	margin:0;
	font:15px/21px 'Montserrat', sans-serif;
	color:#6c6c6a;
	background:#fff;
}
img{border-style:none;} 
a{
	text-decoration:none;
	color:#1c20d0;
}
a:hover{text-decoration:underline;}
input, textarea, select{
	font:100% "Trebuchet MS", Arial, Helvetica, sans-serif;
	vertical-align:middle;
}
form, fieldset{
	margin:0;
	padding:0;
	border-style:none;
}
#wrapper{max-width:810px;margin:0 auto;overflow:hidden;position:relative;}
#header{width:100%;overflow:hidden;position:relative;margin:0 0 14px; background: url(../images/bg-header.jpg) repeat-x 0 100%;padding:54px 0 39px;}
#header .logo{margin:0 41px 0 0;float:right;width:203px;height:41px;text-indent:-9999px;overflow:hidden;background: url(../images/logo.png) no-repeat;}
#header .logo a{display:block;height:100%;}

#main{width:100%;overflow:hidden;position:relative;}
#main .visual{margin:0 0 14px;width:100%;overflow:hidden;position:relative;background: url(../images/bg-visual.jpg) repeat-x 50% 0;background-size:cover;}
#main .visual h1{text-transform:uppercase;color:#fff;margin:0;text-align:left;font:64px/76px GothamBold,Arial,sans-serif;}
#main .visual-h{padding:219px 0 211px;max-width:650px;margin:0 auto;overflow:hidden;text-align:center;}
#main .visual h2{display:inline-block;vertical-align:top;text-transform:uppercase;margin:0;color:#330066;font:38px/42px GothamBold,Arial,sans-serif;}
#main .visual h2 span{background:#f99a1c;padding:0 14px;}
#main .form{background: url(../images/bg-header.jpg) repeat-x ;overflow:hidden;padding:37px 0 0}
#main .form .row{overflow:hidden;}
#main .form .row h2{font:28px/32px GothamBold,Arial,sans-serif;padding:18px;text-align:center;overflow:hidden;margin:0;background:#4e0a5a;color:#fff;text-transform:uppercase;}
#main .form .img-h{overflow:hidden;}
#main .form .img-h img{width:100%;height:auto;display:block;}
#main .form .q{overflow:hidden;background:#8bd2ce;padding:20px 71px;}
#main .form .q h3{color:#fff;text-transform:uppercase;margin:0;font:18px/22px GothamBold,Arial,sans-serif;}
#main .form .a{padding:30px 57px;overflow:hidden;}
#main .form .a label{cursor:pointer;margin:0 0 6px;min-height:47px;vertical-align:middle;display:block;padding:10px;border:3px solid #8bd2ce;color:#605f5d;font-size:15px;line-height:20px;}
#main .form .a label strong{margin:0 0 0 9px;width:58px;line-height:47px;display:inline-block;vertical-align:middle;color:#8bd2ce;font-weight:bold;font-size:29px;}
#main .form .a label .t{display:inline-block;vertical-align:middle;	width:78%}
.jcf-hidden {display: block !important;position: absolute !important;left: -9999px !important; }
.rad-area {width:0;height:0;opaicty:0}
#main .form .a label.jcf-label-active{background:#8bd2ce;color:#fff}
#main .form .a label.jcf-label-active strong{color:#fff;}
#main .submit-h{overflow:hidden;background: url(../images/bg-header.jpg) repeat-x;padding:43px 0 30px}
#main .submit-h input[type="submit"]{width:257px;height:64px;cursor:pointer;display:block;background:#fcb813;font:25px/63px GothamBold,Arial,sans-serif;color:#fff;margin:0 auto;padding:0;border:none;text-transform:uppercase;}
#main .submit-h input[type="submit"]:hover{background:#8bd2ce;text-decoration:none;}

#main .result-box{padding:0 0 66px;text-align:center;background:#46329a;position:relative;margin:0 0 53px}
#main .result-box:after{width:100%;height:15px;content:'';position:absolute;bottom:-34px;left:0;background: url(../images/bg-header.jpg) repeat-x 0 100%;}
#main .result-box .h{padding:0 0 47px;overflow:hidden;}
#main .result-box .left{padding:98px 0 0;float:left;width:50%;}
#main .result-box .right{padding:82px 0 0;float:right;width:48%}
#main .result-box .right img{max-width:100%;height:auto;display:block;}
#main .result-box .right .one{display:none;}
#main .result-box .left h1{text-align:left;text-transform:uppercase;margin:0;color:#4e0a5a;font:60px/67px GothamBold,Arial,sans-serif;}
#main .result-box .left h1 span{padding:0 18px 0 22px;background:#71c6a0;}
#main .result-box .left .score{padding:37px 0 0;color:#e53c8e;display:block;text-transform:uppercase;margin:0;font:121px/140px GothamBold,Arial,sans-serif;}
#main .result-box .left .score .one{display:none;}
#main .result-box  .text-area{padding:0 28px 33px;text-align:center;overflow:hidden;}
#main .result-box  .text{color:#fff;text-transform:uppercase;font:28px/38px GothamBold,Arial,sans-serif;}
#main .result-box  .text.one{display:none;}
#main .result-box .share p{margin:0 0 40px}
#main .result-box  .btn{display:inline-block;vertical-align:top;color:#fff;background:#fcb813;text-transform:uppercase;padding:19px;font:25px/32px GothamBold,Arial,sans-serif;min-width:368px;}
#main .result-box  .btn:hover{background:#8bd2ce;text-decoration:none;}
#main .result-box .share{color:#fff;max-width:580px;margin:0 auto;overflow:hidden;font-size:28px;line-height:40px;padding:34px 0 0}
#main .result-box .share-btn{display:inline-block;vertical-align:top;background: url(../images/bg-share.png) no-repeat;width:385px;height:70px;text-indent:-9999px;overflow:hidden;margin:0 auto}

#main .result-box.one{background:#713368;}
#main .result-box.one .left .score {color:#52c0d0;}
#main .result-box.one .left .score span{display:none;}
#main .result-box.one .left .score span.one{display:inline;}
#main .result-box.one .text{display:none;}
#main .result-box.one .text.one{display:block;}
#main .result-box.one .right .img{display:none;}
#main .result-box.one .right .img.one{display:block;}

#main .result-box.two{background:#a73765;}
#main .result-box.two .left h1{color:#4e0a5a;}
#main .result-box.two .left h1 span{background:#ffd303;}
#main .result-box.two .left .score {color:#52c0d0;}
#main .result-box.two .left .score span{display:none;}
#main .result-box.two .left .score span.two{display:inline;}
#main .result-box.two .text{display:none;}
#main .result-box.two .text.two{display:block;}
#main .result-box.two .right .img{display:none;}
#main .result-box.two .right .img.two{display:block;}

#main .result-box.three{background:#cc6997;}
#main .result-box.three .left h1{color:#4e0a5a;}
#main .result-box.three .left h1 span{background:#ffd303;}
#main .result-box.three .left .score {color:#52c0d0;}
#main .result-box.three .left .score span{display:none;}
#main .result-box.three .left .score span.three{display:inline;}
#main .result-box.three .text{display:none;}
#main .result-box.three .text.three{display:block;}
#main .result-box.three .right .img{display:none;}
#main .result-box.three .right .img.three{display:block;}

#main .result-box.four{background:#9698cc;}
#main .result-box.four .left h1{color:#4e0a5a;}
#main .result-box.four .left h1 span{background:#ffd303;}
#main .result-box.four .left .score {color:#52c0d0;}
#main .result-box.four .left .score span{display:none;}
#main .result-box.four .left .score span.four{display:inline;}
#main .result-box.four .text{display:none;}
#main .result-box.four .text.four{display:block;}
#main .result-box.four .right .img{display:none;}
#main .result-box.four .right .img.four{display:block;}

#main .result-box.five{background:#a5d6dd;}
#main .result-box.five .left h1{color:#4e0a5a;}
#main .result-box.five .left h1 span{background:#ffd303;}
#main .result-box.five .left .score {color:#52c0d0;}
#main .result-box.five .left .score span{display:none;}
#main .result-box.five .left .score span.five{display:inline;}
#main .result-box.five .text{display:none;}
#main .result-box.five .text.five{display:block;}
#main .result-box.five .right .img{display:none;}
#main .result-box.five .right .img.five{display:block;}

#main .form .row.yes h2{padding:94px 20px 20px;background:#4e0a5a url(../images/bg-yes.png) no-repeat 50% 22px;}
#main .form .row.no h2{padding:94px 20px 20px;background:#4e0a5a url(../images/bg-no.png) no-repeat 50% 22px;}

#main .form .a label.correct{color:#fff;background:#8bd2ce url(../images/bg-correct.png) no-repeat 100% 50%;}
#main .form .a label.wrong strong,
#main .form .a label.correct strong{color:#fff;}
#main .form .a label.wrong{border-color:#f26c4f;color:#fff;background:#f26c4f url(../images/bg-wrong.png) no-repeat 100% 50%;}

#main .form .row.yes .img-h,
#main .form .row.no .img-h{display:none;}
#main .form .row .btn-h{display:none;}
#main .form .row.yes .btn-h,
#main .form .row.no .btn-h{display:block;text-align:center;padding:30px 0 16px}
#main .form .row.yes .btn,
#main .form .row.no .btn{display:inline-block;vertical-align:top;color:#fff;background:#fcb813;text-transform:uppercase;padding:19px;font:25px/32px GothamBold,Arial,sans-serif;min-width:268px;}
#main .form .row.yes .btn:hover,
#main .form .row.no .btn:hover{background:#8bd2ce;text-decoration:none;}

#footer {
	overflow: hidden;
    background: url(../images/bg-header.jpg) repeat-x;
    padding: 43px 0 30px;
}

@media only screen and (max-width: 810px) {
	#header .logo{float:none;display:block;margin:0 auto;}
	#main .visual-h{padding:20px;}
	#main .visual h1{text-align:center;}
	#main .visual h1{font-size:36px;line-height:46px;}
	#main .visual h2{font-size:34px;}
	#main .result-box .left{width:auto;padding:20px 20px 0}
	#main .result-box .left h1{font-size:48px;line-height:54px;}
	#main .result-box .right{width:100%;overflow:hidden;float:none;padding:22px 0 0}
	#main .result-box .left .score{font-size:96px;line-height:100px;}
	#main .result-box .text{font-size:19px;line-height:31px;}
	#main .result-box .btn{min-width:1px;}
	#main .result-box .share-btn{width:205px;background-size:205px auto}
	#main .result-box .share{font-size:19px;line-height:30px;padding:34px 20px 0}
	#main .result-box .right img{margin:0 auto}
	#main .form .q{padding:20px}
	#main .form .a{padding:20px}
	#main .form .a label .t{width:100%}
	#main .form .a label.correct,
	#main .form .a label.wrong{background-position:105% 23px}
}