
/* Reset Defaults
--------------------------------------------------------------------------------------- */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, del, dfn, font, img, ins, kbd, q, s, samp, strike, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-family: inherit; vertical-align: baseline;}
:focus { outline: 0;}
ul { list-style: none;}
table {	border-collapse: separate; border-spacing: 0;}
caption, th, td { text-align: left;	font-weight: normal;}
blockquote:before, blockquote:after, q:before, q:after { header: "";}
blockquote, q {	quotes: "" "";}


/* Basic Selectors
--------------------------------------------------------------------------------------- */

html {height: 100%; background: #111; }
body {
	font-size: 62.5%;
	font-family: 'Cabin', sans-serif;
	font-weight: 400; 
	color: #efefef;
	height:100%; 
	letter-spacing: 1px;
}

h1, h2, h3, h4, h5, h6 { font-size:2.4em; color: #efefef; font-family: "proxima-nova", Helvetica, Arial, sans-serif; font-weight: 700;}
p { font-size:1.4em; line-height:1.6em; margin:16px 0; }

.left { float:left; display:inline;}
.right { float: right; display: inline;}

.push { clear: both;}

a { text-decoration: none; }
a:link { color: #111;}
a:visited { color: #111;}
a:hover { color: #111; text-decoration: underline;}
a:active { color: #111;}

h6 a:link { color: #fff;}
h6 a:visited { color: #fff;}
h6 a:hover { color: #fff; text-decoration: underline;}
h6 a:active { color: #fff;}

.footer a:link { color: #fff;}
.footer a:visited { color: #fff;}
.footer a:hover { color: #fff; text-decoration: underline;}
.footer a:active { color: #fff;}

a.white:link { color: #fff;}
a.white:visited { color: #fff;}
a.white:hover { color: #fff; text-decoration: underline;}
a.white:active { color: #fff;}

.button_row { width: 100%; overflow: hidden;}
a.button { float:left; display:block; font-size: 1.2em; text-transform:  uppercase; padding: 14px 20px; text-indent: 2px; letter-spacing: 4px; border: 6px solid #fff; color: #fff; background: transparent; font-family: 'proxima-nova', Helvetica, Arial, sans-serif; font-weight: 700;}
a.button:hover { text-decoration: none; background: transparent; border-color: #111; color: #111;}




/* Content
--------------------------------------------------------------------------------------- */

.header_wrap {
	width: 100%;
	min-height:100%; position:relative;
	-moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;
	background: url(cloudmade.png) no-repeat center center; 
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.myBackground.jpg', sizingMethod='scale');
	-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='myBackground.jpg', sizingMethod='scale')";
}
.header { position:absolute; top:0; left:0; width:100%; height:100%; }

.head_social { width: 132px; position: absolute; top: 20px; right: 20px; z-index: 1; overflow: hidden;}
.head_social li { float: left; display: inline; width: 24px; margin-right: 12px; }
.head_social li.last { margin: 0;}
.head_social img { width: 100%; max-width: 100%; height: auto; }

h1.name { color: #fff; font-weight: 300; letter-spacing: 8px; font-size: 20px; text-indent: 4px; text-transform: uppercase; position: absolute; z-index: 1; left: 20px; top: 22px; line-height: 1em;}

a.arrow-down { width: 58px; height: 58px; position: absolute; bottom: 80px; margin-left: -29px; left: 50%; z-index: 99; display: block; }
a.arrow-down img { width: 100%; max-width: 100%; height: auto; }
a.arrow-down:hover { opacity:.5; filter:alpha(opacity=50);}

.col_2, .columns { width: 100%; margin-top: 60px;}
.col_2 .left, .col_2 .right { width: 47.5806451613%;}
.col_2.full .left, .col_2.full .right { width: 50%;}
.col_2.full .left .left, .col_2.full .left .right, .col_2.full .right .right, .col_2.full .right .left { background: none; width: 44.6428571429%;}
.fluid_half_wrap { margin: 0 auto; width: 80.6451612903%; padding: 60px 0;}
.panel { float: left; display: inline; margin-right: 1.38888888889%;}
.panel.last { margin: 0;}
.columns.panels_3 .panel { width: 32.4074074074%;}
.columns.panels_4 .panel { width: 23.9583333333%;}
.columns.panels_5 .panel { width: 18.8888888889%;}
.columns.panels_6 .panel { width: 15.5092592593%;}

.logo { width: 400px; position:  absolute; top: 20%; left: 50%; margin-left: -200px; }
.logo img { width: 100%; max-width: 100%; height: auto; }

img.recap { width: 100%; max-width: 100%; height: auto; position: absolute; bottom:-70px; width: 100%; }

.item { width: 25%; }
.item.w2 { width: 50%; }

.content_wrap { background: #fff;}

.section { width: 90%; max-width: 1440px; margin: 0 auto;}
h2.titles { text-align: center; color: #111; text-transform: uppercase; font-size: 2em; letter-spacing: 6px; text-indent: 3px;}
h2.sub-title { font-family: "kepler-std-display", Georgia, "Times New Roman", serif; font-style: italic; color: #999; font-size: 1.6em; text-align: center; font-weight: 300; margin-top: 12px; }

.hp_tier_1 { padding: 80px 0;}
.bg_video .section { max-width: 1600px; }
.bg_video h2.titles { margin: 50px auto 140px auto; font-size: 7em; font-weight: 100;}

.bg_video {
	position:relative;
	-moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;
	background: url(../images/bg-video.jpg) no-repeat center center; 
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.myBackground.jpg', sizingMethod='scale');
	-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='myBackground.jpg', sizingMethod='scale')";
}

.hp_tier_1.bg_video { padding-bottom: 140px;}


.experiences { width: 100%; max-width: 1440px; margin: 80px auto;}
.experiences a { display: block; background: #111;}
.experiences a:hover { background: #8ce0fc;}
.experiences img { width: 100%; max-width: 100%; height: auto; }
.experiences h4 { font-family: "kepler-std-display", Georgia, "Times New Roman", serif; color: #999; font-size: 2em; text-align: center; font-weight: 300; margin-top: 20px; text-transform: uppercase; letter-spacing: 4px; text-indent: 2px; }

.email_wrapper { width: 100%; max-width: 976px; margin: 0 auto; }
.email_wrapper .left, .email_wrapper .right { width: 47.9466119097%;}
.email_wrapper .left { margin-top: 18px;}
.email_wrapper .left h2.titles, .email_wrapper .left h2.sub-title { text-align: left; overflow: hidden;}

.hp_tier_2 { padding: 80px 0 0 0; background: #38d6b6;}
.hp_tier_2 .section { width: 100%; max-width: 100% !important;}
.hp_tier_2 .mission { margin-top: 60px;}
.hp_tier_2 h2.titles { color: #fff;}

.video_wrap { width: 90%; max-width: 1600px; margin: 80px auto 0 auto;}
.video_wrap p { margin: 24px 0 0 0; text-align: center; color: #111; text-transform: uppercase; font-size: 1.2em; letter-spacing: 2px; text-indent: 1px; font-family: "proxima-nova", Helvetica, Arial, sans-serif; font-weight: 700;}

.popup-gallery { width: 100%; overflow: hidden; margin-top: 80px;}
.popup-gallery a { float: left; display: inline; width: 25%; display: block; background: #000;}
.popup-gallery img { width: 100%; max-width: 100%; height: auto; } 
.popup-gallery a:hover img { opacity:.3; filter:alpha(opacity=30);} 

.sponsors_wrap { background: #f5f5f5; padding-top: 100px;}
.sponsors_wrap img { width: 100%; height: auto; }
.sponsor-table { width: 90%; max-width: 1200px; margin: 100px auto 0 auto; }
.sponsor-table td { text-align: center; vertical-align: middle;}
img.wd { max-width: 310px; margin: 0 auto;}
img.redbull { max-width: 417px; margin: 0 auto;}
img.invision { max-width: 370px; margin: 0 auto;}
img.born { max-width: 350px; margin: 0 auto;}
img.pt { max-width: 240px; margin: 0 auto;}
img.mw { max-width: 310px; margin: 0 auto;}
img.area { max-width: 370px; margin: 0 auto;}
.sponsor-table td a { display: block; opacity:.3; filter:alpha(opacity=30);}
.sponsor-table td a:hover { display: block; opacity:1; filter:alpha(opacity=100);}
.sponsor-logos.second { margin-top: 100px;}


/* Form
--------------------------------------------------------------------------------------- */

.email_wrapper .email_wrap { width:100%; padding: 22px 12px 12px 20px; height: 85px; position: relative; margin: 0 auto; background: #38d6b6; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
.email_wrapper .email_wrap label { position: absolute; left: 20px; top: 31px; color: #fff; font-family: "proxima-nova", Helvetica, Arial, sans-serif; font-weight: 300; font-size: 2em;}
.email_wrapper input.input_email { width: 100%; border: 0; padding: 0; margin: 9px 0 0 0; background: transparent; font-size: 2em; color: #111; font-family: "proxima-nova", Helvetica, Arial, sans-serif; font-weight: 300;}
.email_wrapper input.btn_submit { font-size: 1.2em; position: absolute; background: transparent; top: 27px; right: 12px; padding: 5px 8px; margin: 0; border: 3px solid #fff; color: #fff; letter-spacing: 2px; text-transform: uppercase; -webkit-appearance: none; border-radius: 0; font-family: "proxima-nova", Helvetica, Arial, sans-serif; font-weight: 700;}
.email_wrapper input.btn_submit:hover { background: #fff; border-color: #fff; color: #111;}

.email_wrapper #divEmailConfirmation { display: none; width:100%; padding: 26px 12px 12px 20px; height: 85px; position: relative; margin: 0 auto; background: #8ce0fc; text-align: center; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;}
.email_wrapper #divEmailConfirmation h3 { text-align: center; letter-spacing: 4px; font-size: 2em; line-height: 34px; margin: 0 0; text-transform: uppercase;}


/* Footer
--------------------------------------------------------------------------------------- */

.footer_wrap { background: #252525;}
.footer { color: #666; padding: 60px 0; overflow: hidden; width: 90%; max-width: 1440px; margin: 0 auto;}

p.copyright { font-size: 1.8em; margin: 9px 0 0 0;}

.social { width: 100px; float: right; display: inline; overflow: hidden;}
.social a { float:left; display:inline; width: 40px; margin-right: 20px; opacity:.3; filter:alpha(opacity=30);}
.social a:hover { opacity:1; filter:alpha(opacity=100);}
.social a img { width: 100%; max-width: 100%; height: auto; }
.social a.last { margin-right: 0;}

/* Media Queries
--------------------------------------------------------------------------------------- */

@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1) { 
	
	.classhere {
		background: transparent url(../images/bg_header@2x.jpg) !important;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}
	
}

/* Desktops and laptops ----------- */

@media only screen 
and (max-width : 1400px) {

	.logo { top: 30%; }
	img.recap { bottom:-40px; }

}

@media only screen 
and (max-width : 1200px) {

	.bg_video h2.titles { font-size: 5em; }

}

@media only screen 
and (max-width : 880px) {
	
	.logo { top: 30%; }
	img.recap { bottom:-15px; }
	a.arrow-down { bottom: 54px; }
	p.copyright { font-size: 1.4em; }
	.bg_video h2.titles { font-size: 4em; }

}

/* iPads (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {

	input { -webkit-appearance: none; border-radius: 0; }

	.logo { top: 30%; }
	img.recap { bottom:-15px; }
	a.arrow-down { bottom: 54px; }
	p.copyright { font-size: 1.4em; }
	
}

@media only screen 
and (max-width : 480px) {
	
	input { -webkit-appearance: none; border-radius: 0; }

	.col_2, .columns { margin-top: 40px;}
	.col_2 .left, .col_2 .right,
	.col_2 .left, .col_2 .right { width: 100%; float: none; display: block; }
	.col_2 .right { margin-top: 40px;}
	.columns .panel,
	.columns.panels_3 .panel,
	.columns.panels_4 .panel,
	.columns.panels_5 .panel,
	.columns.panels_6 .panel { width: 100%; float: none; display: block; margin-bottom: 30px;}	
	
	h1.name { letter-spacing: 8px; font-size: 14px; text-indent: 4px; text-transform: uppercase; position: absolute; z-index: 1; left: 20px; top: 26px; line-height: 1em;}
	.head_social { width: 110px; position: absolute; top: 20px; right: 20px; z-index: 1; overflow: hidden;}
	.head_social li { float: left; display: inline; width: 20px; margin-right: 10px; }

 	.logo { width: 90%; height: auto; position: relative; top: 6%; left: auto; margin: 0 auto 50px auto; padding: 40px 0;}
	.logo h1 { display: block;}
	
	.album_image { float: none; display: block; width: 70%; margin: 0 auto;}
	.album_image .right { max-width: 100%; border: 4px solid #fff;}
	.album_info { float: right; display: inline; width: 100%; margin-top: 30px;}
	.album_info h3 { width: 100%; font-size:1.4em; font-weight: 100; letter-spacing: 0; text-indent: 1px; text-align: center; }
	.album_info .button_row { max-width: 100%; margin-top: 30px;}
	.album_info .button_row a.button { padding-left: 0; padding-right: 0; text-align: center; width: 43.5%; text-align: center; font-size: 1.2em; letter-spacing: 1px;}
	.album_info .button_row a.button.last { float: right;}
	.album_info .button_row a.button:hover { background: #fff; color: #111; border-color: #fff;}

	.email_wrapper .email_wrap label { letter-spacing: 1px; font-size: 1.2em;}
	.email_wrapper input.input_email { letter-spacing: 1px; font-size: 1.2em; }
	.email_wrapper input.btn_submit { padding: 5px 6px;  letter-spacing: 1px; }
	
	.social { float: none; display: block; margin: 0 auto; overflow: hidden;}
	.footer { padding: 30px 0; }
	p.copyright { margin: 30px 0 0 0; text-align: center;}

  .email_wrap label { letter-spacing: 1px; font-size: 1.2em;}
  input.input_email { letter-spacing: 1px; font-size: 1.2em; }
  input.btn_submit { padding: 5px 6px;  letter-spacing: 1px; }

	h2.titles {font-size: 1.6em; letter-spacing: 2px; text-indent: 1px;}
	h2.sub-title { font-size: 1.4em; margin-top: 6px; }

	.hp_tier_1 { padding: 40px 0;}
	.hp_tier_1.bg_video { padding-bottom: 80px;}
	.bg_video h2.titles { margin: 4px auto 40px auto; font-size: 2em; font-weight: 100; letter-spacing: 2px; text-indent: 1px;}

	.experiences { margin: 40px auto;}
	.experiences h4 { font-size: 1.6em; margin-top: 16px;  }
	
	.email_wrapper { padding-top: 0;}
	.email_wrapper .left { width: 100%; float: none; display: block;}
	.email_wrapper .right { margin-top: 40px; width: 100%; float: none; display: block;}
	.email_wrapper .left h2.titles, .email_wrapper .left h2.sub-title { text-align: center; }
	
	.hp_tier_2 { padding: 40px 0; }
	.hp_tier_2 .mission { margin-top: 24px;}
	

	.mission .text p { font-size: 1.4em; line-height: 1.4em;}
	.mission .text p.tagline  { font-size: 2.4em; margin-bottom: 30px; }
	.video { margin-top: 30px; text-align: center;}

	.popup-gallery { margin-top: 40px;}
	.popup-gallery a { float: left; display: inline; width: 100%; display: block;}
	.video_wrap { margin-top: 40px;}

	.sponsors_wrap { padding-top: 40px;}
	.sponsor-table { margin: 40px auto 0 auto; }
	.sponsor-logos.second { margin-top: 40px;}

	.video_wrap p { margin: 12px 0 0 0; font-size: 1em; letter-spacing: 0; text-indent: 0; }


}

/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
	
	input { -webkit-appearance: none; border-radius: 0; }

	.col_2, .columns { margin-top: 40px;}
	.col_2 .left, .col_2 .right { width: 100%; float: none; display: block; }
	.col_2 .right { margin-top: 40px;}
	.columns .panel,
	.columns.panels_3 .panel,
	.columns.panels_4 .panel,
	.columns.panels_5 .panel,
	.columns.panels_6 .panel { width: 100%; float: none; display: block; margin-bottom: 30px;}	
		

	a.arrow-down { width: 40px; height: 40px; bottom: 100px; margin-left: -20px; }

  .email_wrap label { letter-spacing: 1px; font-size: 1.2em;}
  input.input_email { letter-spacing: 1px; font-size: 1.2em; }
  input.btn_submit { padding: 5px 6px;  letter-spacing: 1px; }
	
	.social { float: none; display: block; margin: 0 auto; overflow: hidden;}
	.footer { padding: 30px 0; }
	p.copyright { margin: 30px 0 0 0; text-align: center;}

 	.logo { top: 20%; }
	img.recap { bottom:-8px; }

	.email_wrapper .email_wrap label { letter-spacing: 1px; font-size: 1.2em;}
  .email_wrapper input.input_email { letter-spacing: 1px; font-size: 1.2em; }
  .email_wrapper input.btn_submit { padding: 5px 6px;  letter-spacing: 1px; }

	h2.titles {font-size: 1.6em; letter-spacing: 2px; text-indent: 1px;}
	h2.sub-title { font-size: 1.4em; margin-top: 6px; }
	
	.hp_tier_1 { padding: 40px 0;}
	.hp_tier_1.bg_video { padding-bottom: 80px;}
	.bg_video h2.titles { margin: 4px auto 40px auto; font-size: 2em; font-weight: 100; letter-spacing: 2px; text-indent: 1px;}

	.experiences { margin: 40px auto;}
	.experiences h4 { font-size: 1.6em; margin-top: 16px;  }
	
	.email_wrapper { padding-top: 40px;}
	.email_wrapper .left { width: 100%; float: none; display: block;}
	.email_wrapper .right { margin-top: 40px; width: 100%; float: none; display: block;}
	.email_wrapper .left h2.titles, .email_wrapper .left h2.sub-title { text-align: center; }
	
	.hp_tier_2 { padding: 40px 0; }
	.hp_tier_2 .mission { margin-top: 24px;}
	.mission .left { width: 100%; float: none; display: block;}
	.mission .right { width: 100%; float: none; display: block; margin-top: 24px;}
	

	.mission .text p { font-size: 1.4em; line-height: 1.4em;}
	.mission .text p.tagline  { font-size: 2.4em; margin-bottom: 30px; }
	.video { margin-top: 30px; text-align: center;}

	.sponsors_wrap { padding-top: 40px;}
	.sponsor-table { margin: 40px auto 0 auto; }
	.sponsor-logos.second { margin-top: 40px;}

	.video_wrap p { margin: 12px 0 0 0; font-size: 1em; letter-spacing: 0; text-indent: 0; }
		
}