@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i&display=swap');

/*default*/
html, button, input, select, textarea {color:#000;overflow-x:hidden;}
body {margin:0px;padding:0px;background:#FFF;font-family: 'Open Sans', sans-serif;}
::-moz-selection {background:#1217fd;text-shadow:none;color:#FFF;}
::selection {background:#1217fd;text-shadow:none;color:#FFF;}
hr {display: block;height: 1px;border: 0;border-top: 1px solid #ccc;}
img {margin:0px;padding:0px;border:0px;outline:none;vertical-align: middle;}
a {text-decoration:none;outline:none;border:none;}
fieldset {border:0;margin:0;padding:0;}
textarea {resize: vertical;}
.chromeframe { margin: 0.2em 0;background:#ccc;color:#000;padding:0.2em 0;}
img {width:100%;}

/*clearfix*/
.clearfix {clear:both;}
.clearfix:before, .clearfix:after {content:" ";display:table; }
.clearfix:after {clear:both;}
.clearfix {width:100%;*zoom:1;}

/*default link*/
a, a:link, a:visited, a:active, a:hover {
	color:#333;
	text-decoration:none;
	outline:none;
	border:none;
	-webkit-transition:	all 0.3s ease-in-out;
	-moz-transition:	all 0.3s ease-in-out;
	-o-transition:		all 0.3s ease-in-out;
	-ms-transition:		all 0.3s ease-in-out;
	transition:			all 0.3s ease-in-out;
    border-bottom:1px solid rgba(0,0,0,0)
}
a:hover {color:#000;border-bottom:1px solid #000;}

/*intro*/
#top {width:auto;height:auto;clear:both;position:absolute;top:40px;left:20px;right:20px;z-index:9;}
#top ul {list-style:none;margin:0px auto;padding:0px;text-align:center;}
#top ul li {display:inline-block;margin:0px 20px;}
#top ul li a {color:#231F20;font-size:14px;text-decoration:none;padding-bottom:5px;border-bottom:1px solid rgba(0,0,0,0);}
#top ul li a:hover {color:#000;border-bottom:1px solid #000;}
#intro {width:100%;height:100vh;overflow:hidden;display:block;clear:both;text-align:center;background-image: url("../img/bg.jpg");background-position:center;background-repeat:no-repeat;background-size:cover;margin:0px;padding:0px;}
#logo {width:100%;left:0px;right:0px;position:absolute;top:50%;-webkit-transform: translateY(-50%);-ms-transform: translateY(-50%);transform: translateY(-50%);z-index:99;}
#logo .logo {width:720px;margin:0px auto;-webkit-transition:  all 0.5s ease-in-out;-moz-transition:  all 0.5s ease-in-out;-o-transition:  all 0.5s ease-in-out;-ms-transition:  all 0.5s ease-in-out;transition:  all 0.5s ease-in-out;}
#logo .logo img {width:100%;}
#logo .logo img.logo {display:block;margin:20px auto 5px auto;}
#logo .logo img.payoff {display:block;margin:5px auto;}
#logo.scroll-to-fixed-fixed {-webkit-transform: translateY(0%);-ms-transform: translateY(0%);transform: translateY(0%);background:#FFF;overflow:hidden;height:90px;}
#logo.scroll-to-fixed-fixed .logo {width:420px;}
#logo.scroll-to-fixed-fixed img.payoff {opacity:0;}
#down {position:absolute;bottom:40px;left:20px;right:20px;z-index:9;}
#down span {width:60px;height:60px;border:1px solid #231F20;display:block;margin:0px auto;position:relative;}
#down svg {width:6px;height:60px;fill:#231f20;position:absolute;top:-30px;left:50%;margin-left:-3px;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;-ms-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
#down span a {border:none;outline:none;display:block;width:60px;height:60px;cursor:pointer;}
#down:hover svg {top:30px;}
#overlay {position:absolute;top:0;left:0;width:100%;height:100%;background:#FFF;opacity: 0;z-index:1;}

/*text*/
#testo {padding:15em 0px;}
#testo h1 {margin:0px 0px 20px 0px;padding:0px;font-size:40px;font-weight:bold;color:#231f20;}
#testo h1 small {display:block;font-weight:300;font-size:20px;padding:5px 0px;font-style:italic;color:#606060;}
#testo ul {margin:0px;padding:0px 0px 0px 25px;list-style:none;}
#testo ul li {position:relative;padding:2px 0px;font-size:14px;}
#testo ul li::before {content:"";display:block;width:5px;height:5px;border-top:2px solid #ccc;border-right:2px solid #ccc;position:absolute;top:12px;left:-15px;-ms-transform: rotate(45deg);-webkit-transform: rotate(45deg);transform: rotate(45deg);}
#testo ul li em {color:#606060}
#testo p {margin:40px 0px 10px 0px;color:#231f20;font-weight:bold;font-size:18px;}
#testo img {padding:5px; -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.4);-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.4);box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.4);}
#testo p.first {margin:10px 0px 20px 10px;font-weight:normal;line-height:30px;}
#testo p.first span {display:inline-block;width:25px;}
#testo p.first svg {height:16px;width:auto;}

/*bottom*/
#bottom {width:100%;margin:0px;padding:20px 0px;overflow:hidden;display:block;clear:both;text-align:center;background-image: url("../img/bg.jpg");background-position:center;background-repeat:no-repeat;background-size:cover;}
#bottom p {margin:0px;padding:0px;color:#231f20;font-size:14px;}
#bottom p a {display:inline-block;margin:0px 20px;padding:0px;color:#231f20;font:14px;}

/*responsive*/
@media handheld, only screen and (max-width:1280px) {
    #logo .logo {width:620px;}
    #testo {padding:10em 0px;}
    
}

@media handheld, only screen and (max-width:1024px) {
    #logo .logo {width:480px;}
    #testo {padding:7em 0px;}
}

@media handheld, only screen and (max-width:700px) {
    #logo .logo {width:100%;padding:0px 10px;}
    #testo {padding:3em 0px;}
    #testo img {margin-bottom:30px;}
    #bottom p a {margin:0px 15px;}
}



















