body, html {
	margin:0;
	padding:0;
	color:#FFF;
	font-family: 'Oswald', Helvetica, Verdana;
	color:#FFFFFF;
	font-size:.85em;
	letter-spacing: .5px;
	background-color: #402065
}

.Heading{
	font-size:1.3em;
}

.header{
	width:100%;
	height:80px;
	background-image: url("HeaderBG.png");
}

.header div, .header a{
	position:absolute;
}

.SiteTitle{
	width:108px;
	height:14px;
	left:41px;
	top:56px;
	background-image: url("SiteHeader.png");
}

.Facebook, .Twitter, .Mail{
	cursor: pointer;
	display:block;
	background-position-y:0px;
}

.Facebook{
	width:9px;
	height:20px;
	left:192px;
	top:48px;
	background-image: url("facebookIcon.png");
}

.Facebook:hover{
	background-position-y:-20px;
}

.Twitter{
	width:20px;
	height:17px;
	left:162px;
	top:51px;
	background-image: url("twitterIcon.png");
}
.Twitter:hover{
	background-position-y:17px;
}

.Mail{
	width:20px;
	height:14px;
	left:212px;
	top:54px;
	background-image:url("MailIcon.png");
}
.Mail:hover{
	background-position-y: -14px;
}

.holder{
	width:auto;
	background-color: #CCC;
	
}

.menu{
	width:200px;
	height:100%;
	background-color: #CCC;
}

.content, .mainContent{
	width:100%;
	float:left;
	height:200px;
	border-right:1px solid #ccc;
	border-bottom:1px solid #ccc;
	background-color: #000;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    
}

.content{
	display:block;
	cursor: pointer;
	opacity:0.92;
}

.AdaptIntro{
	cursor:default;
	opacity:1;
}

.content:hover{
	opacity:1;
}


.mainContent{
	width:100%
}

.doubleHeight{
	height:400px;
}

.tripleHeight{
	height:auto;
	background-color: #402065;
	background:url("AdaptLogo.png") no-repeat #402065;
}

.fourHeight{
	height:800px;
}

.nonMobile{
	display:none;
}

.AdaptIntro{
	padding:110px 35px 35px 35px;
}



.CallawayGolf{
	background: url("CallawayImage.jpg") center center no-repeat;
}

.Magicians{
	background: url("MagicianImage.jpg") center center no-repeat;
}

.Discover{
	background: url("DiscoverImage.jpg") center center no-repeat;
}

.Barbados{
	background: url("BarbadosImage.jpg") center center no-repeat;
}

.MS{
	background: url("MSImage.jpg") center center no-repeat;
}

.Room{
	background: url("RoomImage.jpg") center center no-repeat;
}

.TAG{
	background: url("TAGImage.jpg") center center no-repeat;
}

.Diesel{
	background: url("DieselImage.jpg") center center no-repeat;
}

.Subaru{
	background: url("SubaruImage.jpg") center center no-repeat;
}

.Kings{
	background: url("KingsmanImage.jpg") center center no-repeat;
}

.CathayPacific{
	background: url("CathayImage.jpg") center center no-repeat;
}

.Cherokee{
	background: url("JeepImage.jpg") center center no-repeat;
}
.DomP{
	background: url("DomImage.jpg") center center no-repeat;
}
.IPlayer{
	background: url("BBCImage.jpg") center center no-repeat;
}
.MrPorter{
	background: url("MrPorterImage.jpg") center center no-repeat;
}
.Ralph{
	background: url("RLImage.jpg") center center no-repeat;
}
.DolphinTale{
	background: url("DolphinImage.jpg") center center no-repeat;
}

/*2020*/
.Zwift{
	background: url("ZwiftImage.jpg") center center no-repeat;
}
.Kenwood{
	background: url("KenwoodImage.jpg") center center no-repeat;
}
.TagSkylight{
	background: url("TAGSkylightImage.jpg") center center no-repeat;
}
.Mclaren{
	background: url("MclarenImage.jpg") center center no-repeat;
}
.Graff{
	background: url("GraffImage.jpg") right center no-repeat;
}
.Dior{
	background: url("DiorImage.jpg") center center no-repeat;
}
.Volkswagen{
	background: url("VolkswagenImage.jpg") center center no-repeat;
}
.Maybelline{
	background: url("MaybellineImage.jpg") right center no-repeat;
}
.Hotel{
	background: url("HotelImage.jpg") center center no-repeat;
}

footer{
	clear: both;
}

.InfoPanel{
	position:relative;
	width:100%;
	height:87px;
	top:112px;
	background-repeat: no-repeat;
}

.CallawayGolf .InfoPanel{
	background-image: url("Callaway_Info.png");
}

.Room .InfoPanel{
	background-image: url("Room_Info.png");
}

.Magicians .InfoPanel{
	background-image: url("Magician_Info.png");
}

.Diesel .InfoPanel{
	background-image: url("Diesel_Info.png");
}

.Discover .InfoPanel{
	background-image: url("Discover_Info.png");
}

.MS .InfoPanel{
	background-image: url("MS_Info.png");
}

.MrPorter .InfoPanel{
	background-image: url("Porter_Info.png");
}

.Barbados .InfoPanel{
	background-image: url("Barbados_Info.png");
}

.TAG .InfoPanel{
	background-image: url("TAG_Info.png");
}

/*2020*/
.Zwift .InfoPanel{
	background-image: url("Zwift_Info.png");
}
.Kenwood .InfoPanel{
	background-image: url("Kenwood_Info.png");
}
.TagSkylight .InfoPanel{
	background-image: url("TAGSkylight_Info.png");
}
.Mclaren .InfoPanel{
	background-image: url("Mclaren_Info.png");
}
.Graff .InfoPanel{
	background-image: url("Graff_Info.png");
}
.Dior .InfoPanel{
	background-image: url("Dior_Info.png");
}
.Volkswagen .InfoPanel{
	background-image: url("Volkswagen_Info.png");
}
.Maybelline .InfoPanel{
	background-image: url("Maybelline_Info.png");
}
.Hotel .InfoPanel{
	background-image: url("Hotel_Info.png");
}

.textured{
	background-image: url("TexturedBG.jpg");
}

.platforms{
	position:absolute;
	right:0px;
	width:100%;
	height:200px;
	background: url("Platforms.png") no-repeat center top;
}

.partners{
	position:absolute;
	right:0px;
	width:100%;
	height:200px;
	background: url("Partners.png") no-repeat center center;
	opacity:0;
	visibility: hidden;
}

.socialTwitter{
	background: url("SocialCutout.jpg") center;
}

.socialLink{
	display:block;
	width:100%;
	height:100%;
	cursor:pointer;
	background: none;
}
.socialLink:hover{
	background:url("SocialLinkBG.png");
}

.socialCTA{
	width:100%;
	height:100%;
}

.socialTwitter .socialCTA{
	background: url("FollowUsTwitter.png") center center no-repeat;
}

.socialFacebook{
	background: url("SocialCrowd.jpg") center;
}

.socialFacebook .socialCTA{
	background: url("FollowUsFacebook.png") center center no-repeat;
}

footer{
	
	background: #402065;
	min-height:359px;
}

footer a{
	display:block;
	background-color: #523079;
	width:230px;
	margin:3px;
	padding:8px;
	padding-left:40px;
	color: #FFF;
	text-decoration: none;
}
footer a:hover{
	background-color: #FFF;
	color:#000;
}

.FooterContent{
	background: url("FooterShadow.png") repeat-x;
	width:100%;
	height:100%;
}
.FooterText{
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
	padding:20px 20px 30px 20px;
	width:100%;
}

.FooterText li{
	display:block;
}

.FooterText ul{
	margin:0;
	padding:0;
	padding-top:10px;
}

.linkFacebook, .linkTwitter, .linkMail, .linkLinkedIn{
	
	background-repeat:no-repeat;
	
}
.linkFacebook{
	background-image: url("FacebookLinkIcon.png");
	background-position-x:15px;
	background-position-y: 6px;
}
.linkFacebook:hover{
	background-position-y:-44px;
}

.linkTwitter{
	background-image: url("TwitterLinkIcon.png");
	background-position-x:10px;
	background-position-y: 8px;
}
.linkTwitter:hover{
	background-position-y:-42px;
}

.linkMail{
	background-image: url("MailLinkIcon.png");
	background-position-x:10px;
	background-position-y: 10px;
}
.linkMail:hover{
	background-position-y:-40px;
}

.linkLinkedIn{
	background-image: url("LinkedInLinkIcon.png");
	background-position-x:10px;
	background-position-y: 5px;
}
.linkLinkedIn:hover{
	background-position-y:-45px;
}

/*
 * Recommendations
 */
.recommendation{
	position:absolute;
	width:100%;
	height:200px;
	background-position: center top;
	background-repeat: no-repeat;
}

#Recommendation1{
	background-position-y:-14px;
	background-image:url("Recommendation1.png");
}
#Recommendation5{
	background-image:url("Recommendation5.png");
	opacity:0;
	visibility: hidden;
}
#Recommendation4{
	background-position-y:-7px;
	background-image:url("Recommendation4.png");
	opacity:0;
	visibility: hidden;
}
#Recommendation3{
	background-position-y:-7px;
	background-image:url("Recommendation3.png");
	opacity:0;
	visibility: hidden;
}
#Recommendation2{
	background-image:url("Recommendation2.png");
	opacity:0;
	visibility: hidden;
}

/*
 * Publisher
 */
.publisher{
	position:absolute;
	width:100%;
	height:200px;
	background-position: center top;
	background-repeat: no-repeat;
}

#Publisher1{
	background-position-y:-14px;
	background-image:url("Publisher1.png");
}
#Publisher5{
	background-image:url("Publisher5.png");
	opacity:0;
	visibility: hidden;
}
#Publisher4{
	background-position-y:-7px;
	background-image:url("Publisher4.png");
	opacity:0;
	visibility: hidden;
}
#Publisher3{
	background-position-y:-7px;
	background-image:url("Publisher3.png");
	opacity:0;
	visibility: hidden;
}
#Publisher2{
	background-image:url("Publisher2.png");
	opacity:0;
	visibility: hidden;
}

.platformLink{
	display: block;
    position: absolute;
    background-color: black;
    opacity: 0;
    height: 100%;
}

#pictela{
	right: 42%;
	width: 200px;
}

#studio{
	left:58.5%;
	width:90px;
}

#CompanyInfo{
	width:100%;
	background-color: #000;
	padding-top:5px;
	padding-bottom:5px;
}
#CompanyInfo span{
	padding:0px 5px 0px 35px;
}

/*------------------------------------------------------------------------------------
 * YouTube
 */
.VideoHolder{
	position:fixed;
	left:0;
	width:100%;
	/*height:600px;*/
	visibility: hidden;
	z-index: 50;
	opacity:0;
	top:0;
	bottom:0;
}

.VideoBG{
	width:100%;
	height:100%;
	background-color: #000000;
	opacity:0.7;
}
#YouTubePlayer{
	position:absolute;
	margin:auto;
	width:300px;
	height:168px;
	left:0;
	top:0;
	right:0;
	bottom:0;
}


@media screen and (min-width: 500px) {
	.tripleHeight{
		height:600px;
	}
	.content{
		width:50%;
	}
	.mainContent{
		width:100%
	}
	.nonMobile{
		display:block;
	}
	footer{
		background: url("FooterLogo.png") bottom right no-repeat #402065;
	}
	.FooterText{
		padding:40px 0px 30px 35px;
		width:50%;
	}
	
	#YouTubePlayer{
		width:516px;
		height:244px;
	}
}
@media screen and (min-width: 675px) {
	.content{
		width:33.3%;
	}
	.mainContent{
		width:50%
	}
	.nonMobile{
		display:block;
	}
	.recommendation{
		width:50%;	
	}
    .publisher{
		width:50%;	
	}
	.partners, .platforms{
		width:50%;
	}
	.VideoHolder{
		position:absolute;
		top:80px;
		height:600px;
		bottom:auto;
		left:33.3%;
		width:66.6%;
	}
	
	#YouTubePlayer{
		
		width:500px;
		height:280px;
	}
	
}
@media screen and (min-width: 1000px) {
	.content{
		width:25%;
	}
	.mainContent{
		width:50%
	}
	.nonMobile{
		display:block;
	}
	
	.VideoHolder{
		height:600px;
		bottom:auto;
		position:absolute;
		top:80px;
		left:25%;
		width:75%;
	}
	
	#YouTubePlayer{
		width:650px;
		height:350px;
	}
}