/* Getting the new tags to behave */
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video{ display: block; }
mark, rp, rt, ruby, summary, time{ display: inline }



/* Site-wide properties ======================================================== */
html {  font-family: 'Source Sans Pro', Arial, serif; font-weight: 300; line-height:1.4em; color:#000 }
body { font-size:62.5%; height:100%; text-align:center; background:#fff; padding:0; margin:0; -moz-text-size-adjust:none; -webkit-text-size-adjust:none; -ms-text-size-adjust:none }
code, kbd, samp, pre, tt, var, input[type='text'], input[type='password'], textarea { font-size:1.2em }
h1 { font-size:2.4em; color:#000; margin:0 0 15px 0 }
h2 { font-size:1.8em; color:#000; margin:0 0 15px 0; line-height:80% }
h3 { font-size:1.4em; color:#000; margin:0 0 15px 0 }
h4 { font-size:1.3em; color:#000; margin:0 0 15px 0 }
h5 { font-size:1.2em; color:#000; margin:0 0 15px 0 }
h6 { font-size:1.2em; color:#000; margin:0 0 15px 0 }
p { font-size: 2.0em; color:#014751; margin:0 0 25px 0; line-height:160% }
a { color:#009999; transition:color 0.3s ease; -moz-transition:color 0.3s ease; -webkit-transition:color 0.3s ease; -ms-transition:color 0.3s ease; }
a:hover { color:#EB352A }
a:visited {  }
a:active {  }
ul { margin:0 0 15px 0; font-size:2.0em; list-style:none }
ol { margin:0 0 15px 0; font-size:2.0em; list-style:none }
dl { margin:0 0 15px 0; font-size:2.0em; list-style:none }
hr { display:block; background:#aaa; color:#aaa; width:100%; height:1px; border:none }
address { font-size:1.2em; color:#fff; margin:0 0 15px 0; line-height:180%; font-style:normal }

/* Reusable classes ============================================================ */

/* clearfix */
.cf:before,
.cf:after { content: " "; display: table }
.cf:after { clear: both }
.cf { *zoom: 1 }
.cb { clear:both }

/* Left & Right alignment */
.left{ float: left; }
.right{ float: right; }

/* The inside class provides consistent padding. To be used often! */
.ir { display:block; text-indent:-9999px }

/* The fraction classes are useful for column lists */
.half, .third, .quarter, .fifth, .sixth{ width: 100%; }
.half li, .third li, .quarter li, .fifth li, .sixth li{ float: left; }
.half li{ padding-right: 5%; width: 45% }
.third li{  padding-right: 5%; width: 28.3% }
.quarter li{  padding-right: 5%; width: 20% }
.fifth li{  padding-right: 5%; width: 15% }

/* For when a <br /> just ain't enough */
.separator { clear: both; float: left; height: 1px; width: 100%; }

.blue-dotted-line { width:300px; height:7px; margin:0 auto; display:block; background:url(../images/global/dotted-line.png) no-repeat}

/* Basic Structure ============================================================= */
.wrapper {  margin: 0 auto; position: relative; max-width: 1020px; }

/* Header */
header#header { float: left; width: 100%; background:#fff; position:fixed; top:0; z-index:999 }
header#header h1 a { width:251px; height:102px; background:url(../images/global/roller-coaster-challenge-logo.gif) no-repeat; display:block; text-indent:-9999px }
header#header h2 a { width:361px; height:102px; background:url(../images/global/tmc-logo.gif) no-repeat; display:block; text-indent:-9999px }
header#header #header-contact { font-weight: 400; font-size:1.4em; float:left; margin:2.7% 0 0 2.7%}
header#header #header-contact li { list-style:none }
header#header nav#collapsible-navigation { float:right; margin:3% 0 0 0 }
header#header .menu-toggle { float:right; width:86px; height:26px; background:url(../images/global/menu-btn.gif) no-repeat; display:block; text-indent:-9999px; margin:20px 15px 0 0}
header#header nav#collapsible-navigation ul { }
#banner { background:url(../images/banners/banner-tear.gif) no-repeat bottom #d9f2f3; text-align:center; padding:180px 0 45px 0}
#banner img { width:70%; height:auto}
#goto-top { display:block; position:fixed; bottom:0; right:0; z-index:9999px}

/* Primary Navigation */
header#header nav#primary-navigation { width:100%;}
header#header nav#primary-navigation ul { width:90%; margin:0 auto; clear:both; font-size:2.1em; text-transform:uppercase; margin-bottom:45px }
header#header nav#primary-navigation ul li { list-style:none; float:left; padding:0 14px }
header#header nav#primary-navigation ul li a { text-decoration:none }    

/* Content */
section#the-info { padding:50px 0 50px 0 }
section#the-info h2 { font-size:6.2em; font-weight:200; color:#009999; padding:125px 0 30px 0 }
section#the-info h3 { font-size:4.4em; font-weight:200; color:#000; padding:0 0 50px 0 }
section#the-info h4 { font-size:2.8em; font-weight:200; color:#009999; padding:0 }
section#the-info ul { line-height:200% }  
section#the-info #the-aim { background:url(../images/icons/click-for-more-info.gif) no-repeat 15% 95% }
section#the-info #the-aim h2 { background:url(../images/icons/coaster-icon.gif) no-repeat top center }
section#the-info ul.breadcrumb { width:39%; padding:20px 0 30px 0; background:url(../images/global/dotted-line.gif) no-repeat bottom center; margin:0 auto }
section#the-info ul.breadcrumb li { width:50%; float:left; font-size:2.0em; font-weight:200; color:#009999; padding:0 }
section#the-info ul.breadcrumb li a.build { background:url(../images/icons/build-icon.gif) no-repeat top center; text-decoration:none; display:block; padding:90px 0 0 0 }
section#the-info ul.breadcrumb li a.rules { background:url(../images/icons/rules-icon.gif) no-repeat top center; text-decoration:none; display:block; padding:90px 0 0 0}
section#the-info #the-build {}
section#the-info #the-build h2 { background:url(../images/icons/build-icon.gif) no-repeat top center }
section#the-info ul.breadcrumb li.back { width:90%}
section#the-info ul.breadcrumb li.back a { background:url(../images/icons/back-icon.gif) no-repeat top center; text-decoration:none; display:block; padding:50px 0 0 0}
section#the-info #the-rules {}
section#the-info #the-rules h2 { background:url(../images/icons/rules-icon.gif) no-repeat top center }
section#the-video { background:#009999; padding:50px 0 20px 0}
section#the-video h2 { font-size:6.2em; font-weight:200; color:#fff; background:url(../images/icons/the-video-icon.gif) no-repeat top center; padding:125px 0 30px 0 }
section#the-video img { width:74%; height:auto }
section#the-video ul#video-thumbs { width:74%; margin:0 auto }
section#the-video ul#video-thumbs li { width:23%; float:left; text-align:center; padding:0 1% } 
section#the-video ul#video-thumbs li img { width:100%; height:auto}
section#the-video .video-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden }
section#the-video .video-container iframe,.video-container object,.video-container embed { position: absolute; top: 0; left: 5%; width: 90%; height: 100% }
 
section#the-gallery { background:url(../images/global/lower-tear.gif) no-repeat bottom; padding:80px 0 10% 0 }
section#the-gallery #gallery { width:90%; margin:0 auto; background:red }
section#the-gallery #gallery img { width:100%!important; height:auto }

section#the-awards { background:url(../images/awards-bg.jpg) no-repeat #e5e6e8 bottom; padding:50px 0 50px 0}
section#the-awards h2 { font-size:6.2em; font-weight:200; color:#009999; background:url(../images/icons/the-awards-icon.gif) no-repeat top center; padding:125px 0 30px 0 }
section#the-awards h3 { font-size:4.4em; font-weight:200; color:#000; padding:0 0 50px 0; line-height:100% }
section#the-awards blockquote { font-size:2.8em; font-weight:300; color:#009999; padding:0 0 30px 0; line-height:100% }
section#the-awards p span { color:#009999 }
section#the-awards #awards-gallery { width:90%; margin:0 auto }
section#the-awards #awards-gallery img { width:100%!important; height:auto }

#what-next { background:#d9f2f3; padding:50px 0 100px 0 }
#what-next h2 { font-size:6.2em; font-weight:200; color:#009999; background:url(../images/icons/what-next-icon.gif) no-repeat top center; padding:125px 0 30px 0 }
#what-next img { width:60%; height:auto }
#what-next #contact-form { width:100%; margin:0 auto; margin:0; padding:0}
#what-next #contact-form li { margin:0 0 20px 0; overflow:hidden}
#what-next #contact-form li.split { width:50%; float:left}
#what-next #contact-form li label { float:left; width:20%; display:block; margin:10px 10px 0 0; text-align:right }
#what-next #contact-form li input.txt, textarea { width:70%; float:left; border:1px solid #6cc5c6; padding:8px 5px; font-size:0.9em; font-weight:200!important}
#what-next #contact-form li.submit-btn { text-align:left }
#what-next #contact-form li.submit-btn input { background:#009999; border:none; color:#fff; font-size:1.0em; padding:5px 15px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px; margin:0 0 0 21.5%}

/* Footer */
footer#footer { background:#d9f2f3; padding-bottom:20px }
footer#footer ul { width:85%; margin:0 auto; font-size:1.6em; margin-bottom:20px; }
footer#footer ul li { width:33%; float:left; text-align:left; line-height:120%}
footer#footer ul li#footer-logo a { width:100%; height:64px; background:url(../images/global/tmc-logo2.gif) no-repeat; display:block; text-indent:-9999px;}
footer#footer p.copyright {width:85%; margin:0 auto; clear:both; font-size:1.6em }

.menu-toggle { visibility: hidden}