/*------------------------------------------------*/
/* Basic styles */
/* Designed and coded by HeroWP.com*/
/* Don't forget to visit us daily for tons of freebies:
	-PSD Templates
	-Wordpress Plugins
	-Wordpess Themes
	-HTML Designs
	-& many more!
*/
/*------------------------------------------------*/


body{
	font-family:'Coda', Arial;
	color:#fff;
	background:top center no-repeat #000;
	background-size:100%;
	height: 100%;
	width: 100%;
	padding:0;margin:0;
}

.overlay{
	background:rgba(0,0,0,.8);
	position:absolute;
	left:0;
	top:0;
	bottom:0;
	right:0;
	width:100%;
	height:100%;
	z-index:1;
	overflow:hidden;
}
.hidden-mobile{display:block;}
.visible-mobile{display:none;}
.vert-text {
	display: table-cell;
	vertical-align: middle;
}
.cover{
	display: table;
	height: 100%;
	width: 100%;
	height: 100vh;
    background: url("../images/logo-spray.png") no-repeat center top fixed, url("../images/reskey.jpg") no-repeat center top fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	color:#FFFFFF;
}
#toggle-goruck, .toggle-content{padding: 0px 10px 0px 0px; display: none; width: 100%;}
.cover .countdown-row {display:inline-block;}
.cover .wording{float:right; margin-left:380px; /*width:35%; min-width:400px;*/ font-size:20px; font-size:8vh; text-align:right; text-transform:uppercase; position: absolute; top: 50%;	margin-top: -40vh; right:5vw; text-shadow: 0 0 3px rgba(0, 0, 0, 0.6);
}

.cover .wording h1{text-align:right;display:inline-block;margin-bottom: 0; 
	font-family:'Condiment', Cursive;
}
.cover h1{	font-family:'Condiment', Cursive;}
.cover #accordion h3{	color:#00C2FF; font-family:'Condiment', Cursive;}
.cover .wording p,
.cover .wording .link-list{font-size:3vh;text-align:right; line-height:120%; }

.cover .wording p.sub-title{font-size:4vh;}
.cover .wording a{display:block;margin-right:0;background:rgba(0,0,0,0.0);/* min-width: 40%; */ font-size:2.5vh;}

@media (min-width: 1200px){
	.container {
		width:1170px;
	}
}

#wrap{
	width:100%;
	height:100%;
	display:table;
	position:relative;
	z-index:10000;
	margin:10vh 0;
}

#defaultCountdown{
	z-index:2;
	display:table;
	position:relative;
	margin-left: 5vh;
	margin-bottom:10vh;
}
.countdown-row{text-shadow:0px 2px 2px rgba(0,0,0,0.4); margin:0; padding:0;}
.countdown-section{display:block; margin-right:3vh;margin-top:1vh;}
.countdown-amount {font-size: 80px; font-size: 18vh;display:block;margin-top:10vh;margin-bottom:1vh;line-height:80%;font-weight:700; font-family:'Coda','Montserrat',monospace;}
.countdown-period {font-size:24px; font-size: 7vh;line-height:100%;}

.countdown-section:nth-child(3):before{display:table;content:"";}
.countdown-section:nth-child(3),.countdown-section:nth-child(4){display:inline-block;}
.countdown-section:nth-child(3) .countdown-amount {font-size: 40px; font-size: 10vh;}
.countdown-section:nth-child(4) .countdown-amount {font-size: 40px; font-size: 10vh;}
.countdown-section:nth-child(3) .countdown-period {font-size:16px; font-size: 3.5vh;}
.countdown-section:nth-child(4) .countdown-period {font-size:16px; font-size: 3.5vh;}

.image-align{
	margin:0 auto;
	text-align:center;
	display:block;
	padding-top: 100px;
}

h1{
	font-size:56px;
	font-size:8vh;
	font-weight:100;
	text-align:center;
}

h1 span{
	font-size:32px;
}

.blue{
	color:#00C2FF;
	font-size:56px;
	font-size:8vh;
}

p{
	font-size:16px;
	line-height:30px;
	text-align:center;
	font-weight:100;
}
p.sub-title{font-size:38px;line-height:46px;}

a{
	color:#fff;
	text-decoration:underline;
}

p.copyright{
	font-size:13px;
	margin-top:30px;
}

a.btn{display:inline-block;border:1px solid #FFF;color:#FFF;padding:10px 20px; margin:5px 10px; text-decoration:none;}
a.btn:hover{border-color:#00C2FF; background:rgba(0, 194, 255, 0.2) ;color:#00C2FF; box-shadow:inset 0 0 3px rgba(0,0,0,0.4);}
a.btn-link{display:inline-block;color:#FFF;padding: 1.2vh;margin: 1vh 0; text-decoration:none;}
a.btn-link:before{content:"> "}
a.btn-link:hover{color:#00C2FF;}
a.btn-link[href="#"]{opacity:0.1;}
a.btn-link[href="#"]:hover{color:#FFF;}
/*------------------------------------------------*/
/* Responsive styles */
/*------------------------------------------------*/
#toggle-goruck a.btn-link:first-child,  .toggle-content a.btn-link:first-child{margin-top:0;}
#toggle-goruck a.btn-link:last-child, .toggle-content a.btn-link:last-child{margin-bottom:0;}
.cover .wording .toggle-content a{background:none;}
.cover .wording a.btn-link.open{color:#00C2FF;}

.cover .wording .toggle>a.btn-link:before{content: "";}


@media (min-width: 801px){
	.cover{
		background: url("../images/logo-spray.png") no-repeat center bottom fixed, url("../images/reskey.jpg") no-repeat center top fixed;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}
}
@media (max-width: 800px) and (orientation:portrait){
	a.btn-link{padding: 2vw;margin: 2vw 0;}
	.hidden-mobile{display:none;}
	.visible-mobile{display:block;}
	
	.cover .wording{ font-size:18vw; width:60%; min-width:100px;  text-align:right;top:50%; max-width:520px; margin-top:-60vw;}
	.cover .wording h1{text-align:right;display:inline-block;}
	.cover .wording h1:after{display:table;content:"";clear:both;}
	.cover .wording h1,.cover .wording .blue{ font-size:8vw;}
	.cover .wording p.sub-title{font-size:5vw;}
	.cover .wording p{ font-size:2.5vw;text-align:right;}
	.cover .wording a{margin-right:0;width:96%;min-width:100px;font-size:4vw;}
	
	#defaultCountdown{margin-bottom:15vw;margin-left: 3vh;}
	.countdown-amount {font-size: 18vw;}
	.countdown-period {font-size: 6.5vw;}
	.countdown-section{margin-right:2vw;margin-bottom:3vw;}
	.countdown-section:nth-child(3),.countdown-section:nth-child(4){display:block;}
	.countdown-section:nth-child(3) .countdown-amount {font-size: 40px; font-size: 10vw;}
	.countdown-section:nth-child(4) .countdown-amount {font-size: 40px; font-size: 10vw;}
	.countdown-section:nth-child(3) .countdown-period {font-size:16px; font-size: 3vw;}
	.countdown-section:nth-child(4) .countdown-period {font-size:16px; font-size: 3vw;}
}
@media (max-width: 600px) and (orientation:portrait){
	a.btn{padding:5px 10px; display:block; margin:5px;}
}
@media (max-width: 420px) and (orientation:portrait){
	#defaultCountdown:after{clear:both; content:"";display:block;}
}