@charset "UTF-8";
/* CSS Document */

	
html, body{padding:0; margin:0;}
body{
	background: #000 url(imgs/image1.png) top center no-repeat fixed;
	background-size: 70%;
	-webkit-background-size:70%;
	color:#fff;
	font-family: "futura-pt", Futura, Trebuchet MS,Arial,sans-serif; 
	font-weight: 	300;
	
}
main{overflow-y: hidden;}
.consent { position:fixed; display:table; left:0; bottom:0; width:100%; background:rgba(0,0,0,0.9); text-align:center; padding:10px 0;
-webkit-animation:fadeBar 1s 1s both; animation:fadeBar 1s 1s both;}
.consent a{    text-decoration: underline;}
.consent a:hover{color:#7F7F7F;}
#ok:hover{opacity:0.8;}
.cookie, .copyright{font-size: 10px;}
.cookie a:hover{text-decoration: underline;}
@-webkit-keyframes fadeBar {
	0% { opacity:0; -webkit-transform:translateY(100%); }
	100% { opacity:1; -webkit-transform:none; }
	}
@keyframes fadeBar {
	0% { opacity:0; transform:translateY(100%); }
	100% { opacity:1; transform:none; }
	}
.consent p, .consent span { display:table-cell; vertical-align:middle; } 

h1, h2, h3, h4, p{line-height:1; margin:0;}
h1, h3, h4{font-weight: 700; text-transform: uppercase;}
h1, h4{ color:#2E9DC4;}
h2{font-weight:300;}

li{list-style:none; display:block;}
a{color:#fff; text-decoration:none; }
a:hover{ transition: 0.3s;}
a.link{text-decoration:underline; font-weight: 500;}
a.link:hover{color:#2E9DC4;}
header a li {width:150px; padding:7px 0; display:inline-block;}
a li { width:80%; max-width:400px; padding:10px 0; font-weight: 500; text-align:center; text-decoration:none; color:#000; font-size:12px; font-weight:500; letter-spacing:1px; margin: 0 auto 2px auto;background:#fff; color:#000;}
a li:hover{background:#2E9DC4; color:#fff;transition: 0.3s;}
.largescreen{display:none;}
	.normalscreen{display:inline;}
#home{background: #000 url(imgs/GTO_PREORDER_LandingPage_SkyBackground.jpg) top center no-repeat fixed;
background-size:100%;
-webkit-background-size:100%;}
#home, #video, #album, #bio, #tourdates{min-height:100vh; position:relative; overflow:visible; }
#video, #album, #bio, #tourdates{background: rgba(0, 0, 0, 0.87);}
.container{
	margin:auto;
   width: 100%;
   text-align: center;
   padding: 30% 0 10%;
}	
#home .container{padding: 10% 0;}
   .text{margin:0 auto; padding:6px 0 0 0;}
   
   header{background:#000; padding:5px; color:#fff; position:fixed; z-index:2; width:100%; text-align:center; display:none;box-shadow: 0px 7px 24px #000;}


.socials img{width:100%; max-width:30px;}
.socials .largescreen img{max-width:130px;}
a.tint:hover{ background: #2E9DC4; position: relative;}

.socials{display: block; margin: 5px auto;}
.buttons{margin-top:10px;}
#video-box {
    width: 90%;
    max-width: 1000px;
    min-width: 227px;
    display: inline-block;
}
.video-container {
    font-size: 10px;
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}
.video-container iframe,  
.video-container object,  
.video-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
 
.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#mc_embed_signup{font-size:14px; text-transform: uppercase;display: inline-block; font-family: inherit;}
#mc_embed_signup label {font-weight:300; font-size:14px; display: inline-block;}
#mc_embed_signup input.email{ font-weight:300; border-radius:0; padding:2px; margin: auto; display:inline-block; height:auto; width: 100px; font-family: inherit; font-size:12px; min-height: 10px; min-width:100px;}
#mc_embed_signup input.button {background:#fff; border-radius:0; padding:5px; color:#000; border:none; width:200px; display: inline-block; line-height:1; margin: 0; font-size:10px; height: auto; min-height: 10px; text-transform:uppercase;}
#mc_embed_signup input.button:hover{background:#2E9DC4; color:#fff;}
#mc_embed_signup form {padding:0; text-align: center;}
#mce-EMAIL{width: 190px; margin: 5px auto;}

   .packshot img{width:100%; max-width:500px;}
.albuminfo p, #bio p{line-height:1;}
#bio img{width:100%; max-width:600px;}
#bio p{width:90%; max-width:700px; padding:10px; margin: 20px auto 0;}
.close{color:#000; font-size:20px; padding:10px; position: absolute;
left: 15px;}
.mobhide{display:none;}
footer{background:#000; width:100%; padding:10px 0; color:#fff; text-align:center; z-index:2;bottom: 0;}

#home .logo{width: 80%;
max-width: 400px;}
   
   @media (min-width:400px){
	  #mc_embed_signup input.button {width: 124px;}
	  a li{ background:#fff; width:250px; padding:5px 0; }
   }
   
  
@media (min-width:500px){
	.clear{display: inline-block;}
	   #mce-EMAIL{width:100px;}
	    #mc-embedded-subscribe{width:100px; padding: 3px;}
		.mobhide{display:inline;}
		.desktophide{display:none;}
	.container{padding:20% 0 0;}
	#home .container{padding: 10% 0;}
	
	 }
	 @media (min-width:603px) and (max-width: 802px){
		 body { font-size:20px;}
		 main{background: url(imgs/image1.png) no-repeat center top;
background-size: 80%;}

a li {background: #fff;width: 350px;padding: 7px 0;text-align: center;text-decoration: none;color: #000;font-size: 12px;font-weight: 500;letter-spacing: 1px;margin: 0 auto 5px auto;}}
	@media (min-width:770px){ 
		header a li{ display:inline-block;width: 193px;}
	.container{margin-top: auto; padding: 10% 0;}
	
	#mc_embed_signup form {text-align:left;}
	}
@media (min-width: 1000px){
	body{background: #000 url(imgs/image1.png) top center no-repeat fixed;
	background-size: 40%;}
	   #home, #video, #album, #bio, #tourdates{height:100vh; position:relative; overflow:visible;}
.container{margin:auto;  position: absolute;               /* 2 */
   top: 50%;                         /* 3 */
   transform: translate(0, -50%); padding:0; }	
   header{text-align: left;}
   #mc_embed_signup{font-size:12px; margin-left:10px;}
   #mc_embed_signup label {font-size:12px;}
   #mc_embed_signup input.button {width:100px;}
   header a li, .socials{vertical-align: middle;}
  .socials{float:right; margin: 3px 10px 0 0; display:inline-block;}
.socials img{width:100%; max-width:25px;}
   .packshot, .albuminfo{display:inline-block; vertical-align: middle;}
   .albuminfo{padding:10px; max-width:500px;}
   #video-box{width:40%; display: inline-block;}
   
}
@media (min-width: 1381px){
	a li {background: #fff;width: 350px;padding: 7px 0;text-align: center;text-decoration: none;color: #000;font-size: 12px;font-weight: 500;letter-spacing: 1px;margin: 0 auto 5px auto;}
}
	@media (min-width: 1600px){
		/*incase apple request .largescreen{display:inline;}
	.normalscreen{display:none;}
	*/
	}
@media (min-width: 1681px){
	#home .content{font-size:20px;}
	a li {background: #fff;width: 410px;padding: 12px 0;text-align: center;text-decoration: none;color: #000;font-size: 12px;font-weight: 500;letter-spacing: 1px;margin: 0 auto 5px auto;}

}
@media (min-width: 2200px){
	
}

@media (max-width: 320px){
	h1, h2, h3, h4, p{line-height:1; margin: 0;}}
	
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 667px) {
	#home{background: #000 url(imgs/GTO_PREORDER_LandingPage_SkyBackground.jpg) top center no-repeat fixed;
background-size:auto;
-webkit-background-size:auto;}
body{background: #000 url(imgs/image1.png) top center no-repeat fixed;
background-attachment: fixed !important;
-webkit-background-size: 60%;
-moz-background-size: 60%;
-o-background-size: 60%;
background-size: 60%;}
		h2, body{font-weight:500;}
.container{margin:auto; text-align:center;}	
#home .container {padding:0 0 10%;}
#tourdates .container, #video .container{ margin: 26% 0 0;}
#album .container{margin: 10% 0 0; padding: 20% 0 10%;}
header a li {width:150px; padding:7px 0;}
a li { width:80%; max-width:400px; padding:10px 0; font-weight: 500;}
#mc_embed_signup label {
    font-weight: 500;
	}
}