html,body { overflow-x: hidden; }

body {
    margin: 0;
    padding: 0;
    color: #fff;
    background: #000;
    font-size: 14px;
}

a, .scroll-pane {
    outline: 0;
}

.page {
    min-height: 820px;
    width: 1164px;
    text-align: center;
    margin: 0 auto;
}

#ring {
    display: block;
    width: 120px;
    height: 120px;
    background: url(http://ridersofrohan.blob.core.windows.net/content/global/ring/ring.png) no-repeat;
    position: absolute;
    top: -4px;
    right: 182px;
    z-index: 2;
}

#header {
    width: 1164px;
    margin: 12px auto 0;
    position: relative;
    z-index: 100;
}

#header h1 {
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    width: 0;
    height: 0;
    margin: 0;
    padding: 0;
}

#header .nav {
    width: 1164px;
    height: 130px;
    background: url(http://ridersofrohan.blob.core.windows.net/content/us/images/home/nav/nav_BG.png) no-repeat;
    position: relative;
}

#header .nav ul {
    padding: 47px 0 0 70px;
    margin: 0;
    list-style: none;
    overflow: hidden;
}

#header .nav li {
    float: left;
}

#header .nav a {
    display: block;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}

#header .nav a.home { width: 51px; height: 16px; background: url(http://ridersofrohan.blob.core.windows.net/content/us/images/home/nav/home.png) no-repeat; }
#header .nav a.home:hover, #header .nav a.home.current { background-image: url(http://ridersofrohan.blob.core.windows.net/content/us/images/home/nav/home_active.png); }

#header .nav a.features { margin-left: 30px; width: 74px; height: 16px; background: url(http://ridersofrohan.blob.core.windows.net/content/us/images/home/nav/features.png) no-repeat; }
#header .nav a.features:hover, #header .nav a.features.current { background-image: url(http://ridersofrohan.blob.core.windows.net/content/us/images/home/nav/features_active.png); }

#header .nav a.feature-videos { margin-left: 23px; width: 123px; height: 16px; background: url(http://ridersofrohan.blob.core.windows.net/content/us/images/home/nav/feature-videos.png) no-repeat; }
#header .nav a.feature-videos:hover, #header .nav a.feature-videos.current { background-image: url(http://ridersofrohan.blob.core.windows.net/content/us/images/home/nav/feature-videos_active.png); }

#header .nav a.images { margin-left: 20px; width: 61px; height: 16px; background: url(http://ridersofrohan.blob.core.windows.net/content/us/images/home/nav/images.png) no-repeat; }
#header .nav a.images:hover, #header .nav a.images.current { background: url(http://ridersofrohan.blob.core.windows.net/content/us/images/home/nav/images_active.png); }

#header .nav a.story { margin-left: 270px; width: 134px; height: 16px; background: url(http://ridersofrohan.blob.core.windows.net/content/us/images/home/nav/behind-the-story.png) no-repeat; }
#header .nav a.story:hover, #header .nav a.story.current { background-image: url(http://ridersofrohan.blob.core.windows.net/content/us/images/home/nav/behind-the-story_active.png); }

#header .nav a.pre-order { margin-left: 10px; margin-top: -50px; width: 244px; height: 112px; background: url(http://ridersofrohan.blob.core.windows.net/content/us/images/home/nav/buy-now.png) no-repeat 90px 42px; }
#header .nav a.pre-order:hover, #header .nav a.pre-order.current { background-image: url(http://ridersofrohan.blob.core.windows.net/content/us/images/home/nav/buy-now_active.png); }


#ring:hover ~ .nav a.pre-order { background-image: url(http://ridersofrohan.blob.core.windows.net/content/us/images/home/nav/buy-now_active.png); }

#header .flags {
    position: absolute;
    top: 5px;
    right: 55px;
}

#header .flags ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

#header .flags li {
    float: left;
}

#header .flags a {
    display: block;
    width: 24px;
    height: 19px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    margin-left: 5px;
}

#header .flags a.us { background: url(http://ridersofrohan.blob.core.windows.net/content/global/images/flags/US.png) no-repeat; }
#header .flags a.uk { background: url(http://ridersofrohan.blob.core.windows.net/content/global/images/flags/UK.png) no-repeat; }
#header .flags a.fr { background: url(http://ridersofrohan.blob.core.windows.net/content/global/images/flags/FR.png) no-repeat; }
#header .flags a.de { background: url(http://ridersofrohan.blob.core.windows.net/content/global/images/flags/GER.png) no-repeat; }

#header .e3-logo {
    position: absolute;
    top: 72px;
    left: 70px;
    width: 119px;
    height: 137px;
    background: url(http://ridersofrohan.blob.core.windows.net/content/global/images/e3_logo.png) no-repeat;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}

/* ================================================================= footer === */

#footer {
    position: relative;
    font-family: arial, sans-serif;
    font-size: 11px;
    color: #747474;
    z-index: 1;
}

#footer a {
    color: #747474;
}

#footer a.big-order-button {
    display: block;
    width: 343px;
    height: 101px;
    background: url(http://ridersofrohan.blob.core.windows.net/content/us/images/home/btn_buy_now.png) no-repeat;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    margin: 0 auto 20px;
}

#footer .wrapper, #footer .legal {
    width: 960px;
    margin: 0 auto;
    text-align: center;
}

#footer .left {
    width: 20%;
    float: left;
}

#footer .logos {
    width: 194px;
    height: 52px;
    background: url(http://ridersofrohan.blob.core.windows.net/content/global/images/logos/logos.png) no-repeat;
}

#footer .right {
    float: right;
    width: 20%;
    text-align: right;
}

#footer .middle {
    text-align: center;
    float: left;
    width: 60%;
}

#footer .links a {
    padding: 0 10px;
}

#footer .social a {
    display: inline-block;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    margin: 15px 5px;
}

#footer a.facebook {
    width: 20px;
    height: 20px;
    background: url(http://ridersofrohan.blob.core.windows.net/content/global/images/facebook.png) no-repeat;
}

#footer a.twitter {
    width: 20px;
    height: 20px;
    background: url(http://ridersofrohan.blob.core.windows.net/content/global/images/twitter.png) no-repeat;
}

#footer .legal {
    font-size: 9px;
    clear: both;
    padding: 15px 0;
}

/* ================================================================= faq === */

#faq {
    display: none;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: #000;
    background: rgba(0,0,0,0.8);
    z-index: 50;
}

#faq .content {
    width: 564px;
    height: 489px;
    padding: 20px 40px;
    background: url(http://ridersofrohan.blob.core.windows.net/content/global/images/faq-lightbox.png) no-repeat;
}

#faq > div {
    width: 644px;
    margin: 200px auto;
    position: relative;
}

#faq .scroll-pane {
    height: 410px;
    overflow: auto;
}

#faq h2 ,
#faq p b {
    color: #E6B300;
}

#faq p {
    margin: 0;
    padding: 0;
    line-height: 1.2;
    color: #fff;
}

#faq li {
    padding-bottom: 20px;
    color: #E6B300;
}

#faq .close {
    display: block;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    width: 66px;
    height: 14px;
    background: url(http://ridersofrohan.blob.core.windows.net/content/us/images/btn_close.png) no-repeat;
    position: absolute;
    top: -10px;
    right: 15px;
}

/* ================================================================= overlay === */

#overlay {
    display: none;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: #000;
    background: rgba(0,0,0,0.8);
    z-index: 50;
}