@import url("http://hello.myfonts.net/count/2fbe36");


@font-face {font-family: FFDINWebProCond;src: url('http://downloads.paramount.com/ppi/13hours/uk/fonts/2FBE36_0_0.eot');src: url('http://downloads.paramount.com/ppi/13hours/uk/fonts/2FBE36_0_0.eot?#iefix') format('embedded-opentype'),url('http://downloads.paramount.com/ppi/13hours/uk/fonts/2FBE36_0_0.woff2') format('woff2'),url('http://downloads.paramount.com/ppi/13hours/uk/fonts/2FBE36_0_0.woff') format('woff'),url('http://downloads.paramount.com/ppi/13hours/uk/fonts/2FBE36_0_0.ttf') format('truetype');}


@font-face {font-family: FFDINWebProCondBold;src: url('http://downloads.paramount.com/ppi/13hours/uk/fonts/2FBE36_1_0.eot');src: url('http://downloads.paramount.com/ppi/13hours/uk/fonts/2FBE36_1_0.eot?#iefix') format('embedded-opentype'),url('http://downloads.paramount.com/ppi/13hours/uk/fonts/2FBE36_1_0.woff2') format('woff2'),url('http://downloads.paramount.com/ppi/13hours/uk/fonts/2FBE36_1_0.woff') format('woff'),url('http://downloads.paramount.com/ppi/13hours/uk/fonts/2FBE36_1_0.ttf') format('truetype');}


@font-face {font-family:  FFDINWebProCondMedium;src: url('http://downloads.paramount.com/ppi/13hours/uk/fonts/2FBE36_2_0.eot');src: url('http://downloads.paramount.com/ppi/13hours/uk/fonts/2FBE36_2_0.eot?#iefix') format('embedded-opentype'),url('http://downloads.paramount.com/ppi/13hours/uk/fonts/2FBE36_2_0.woff2') format('woff2'),url('http://downloads.paramount.com/ppi/13hours/uk/fonts/2FBE36_2_0.woff') format('woff'),url('http://downloads.paramount.com/ppi/13hours/uk/fonts/2FBE36_2_0.ttf') format('truetype');}

html {
    height: 100%;
    color: #010E22;
}

body {
    padding: 0;
    margin: 0;
    font-family: 'FFDINWebProCond', sans-serif;
    background-color: #001228;
}

a[disabled] {
    pointer-events: none;
}

h1,h2,h3,h4,h5,h6,h7 {
    font-weight: 300;
}

.wrap {
    min-height: 100%;
    background: url(../images/splash/title-bg.png) no-repeat top;
    background-size: 100% auto;
    -webkit-background-size: 100% auto;
    -moz-background-size: 100% auto;
    position: relative;
}

.register .wrap {
    background-position: 100% -10px, bottom;
}

.main {
    max-width: 1200px;
    margin: 0 auto;
}

.main .inner {
    max-width: 1300px;
    margin: 0 auto;
    text-align: center;
}

.main .inner img {
    max-width: 100%;
}

.header {
    background: url(../images/splash/header-bg.png) repeat-y;
    background-size: 100% 100%;
    -webkit-background-size: 100% 100%;
    -moz-background-size: 100% 100%;
    padding: 15px 15px 5px 15px;
    border-bottom: none;
    margin-bottom: 0;
    overflow: hidden;
    clear: both;
    box-shadow: 0 0 20px #000;
    position: relative;
    z-index: 1;
}

.header img {
    max-width: 100%;
}

.header .left {
    float: left;
    text-align: left;
    width: 45%;
    position: relative;
}

.header .right {
    float: right;
    text-align: right;
    width: 45%;
    position: relative;
}

.title {
    text-align: center;
    position: relative;
    line-height: 0;
    margin-top: -32px;
    margin-bottom: 20px;
}

.title img {
    position: relative;
    width: 90%;
    max-width: 783px;
}

.buttons {
    margin: 0 auto;
    padding: 25px 0 0 0;
    overflow: auto;
    clear: both;
    text-align: center;
}

.buttons a {
}

.buttons a.bluray {
    display: inline-block;
    margin: 0 25px;
}

.buttons a.digitalhd {
    display: inline-block;
    margin: 0 25px;
}

.buttons img {
    max-width: 100%;
}

.story {
    margin: 100px 0;
}

.billing {
    margin: 100px 0 50px 0;
}

.quote {
    margin-top: 100px;
}

.quote img {
    width: 100%;
}

.quote1 {
    float: left;
    display: block;
}

.quote2 {
    float: right;
    display: block;
}

.video-wrap {
    max-width: 600px;
    width: 100%;
    margin: 50px auto 25px auto;
}

.video {
    position: relative;
    margin: 0 auto;
    text-align: center;
    padding-bottom: 56.25%;
    height: 0;
    text-align: center;
}

.video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.carousel {
    position: relative;
    max-width: 100%;
    text-align: center;
    font-size: 0;
    white-space: nowrap;
}

#left-arrow {
    position: relative;
    display: inline-block;
    width: 14px;
    height: 15px;
    background: url(../images/splash/left-arrow.png) no-repeat center;
    padding: 28px 10px;
}

#right-arrow {
    position: relative;
    display: inline-block;
    width: 14px;
    height: 15px;
    background: url(../images/splash/right-arrow.png) no-repeat center;
    padding: 28px 10px;
}

.carousel .inner {
    position: relative;
    height: 72px;
    max-width: 80%;
    white-space: nowrap;
    overflow: hidden;
    display: inline-block;
}

.carousel .inner a {
    position: relative;
    margin: 0 5px;
    border: 1px solid #999;
    display: inline-block;
}

.carousel .inner a:first-child {
    margin-left: 0;
}

.carousel .inner a:last-child {
    margin-right: 0;
}

.carousel .inner img {
}

.fb-like {
    margin-right: 30px;
    top: -5px;
    position: relative;
    overflow: hidden;
}

.packs {
    overflow: auto;
    clear: both;
    text-align: center;
    margin: 100px 0;
}

.pack {
    padding: 0 50px;
    display: inline-block;
}

.packs .divider {
    width: 100%;
    height: 2px;
    background-color: #C8E7D1;
    margin: 20px 0 30px 0;
}

#popover-digital, #popover-dvd, #popover-bluray {
    position: absolute;
    display: none;
    z-index: 1000;
}

#popover-digital {
    background: url(../images/splash/popup.png) no-repeat;
    width: 291px;
    height: 252px;
    padding: 25px;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
}

#popover-digital a {
    width: 119px;
    height: 47px;
    padding: 0;
    float: left;
}

#popover-digital a.close {
    position: absolute;
    width: 38px;
    height: 40px;
    top: 0;
    right: 0;
}

#popover-digital.down {
    background: url(../images/splash/popup-down.png) no-repeat;
    padding-top: 40px;
    width: 291px;
    height: 252px;
}

#popover-digital.down a.close {
    position: absolute;
    width: 38px;
    height: 40px;
    top: auto;
    bottom: 0;
    right: 0;
}

#popover-dvd, #popover-bluray {
    background: url(../images/splash/popup2.png) no-repeat;
    width: 168px;
    height: 252px;
    padding: 25px;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
}

#popover-dvd a, #popover-bluray a {
    height: 46px;
    padding: 0;
    display: block;
}

#popover-dvd a.close, #popover-bluray a.close {
    position: absolute;
    width: 38px;
    height: 40px;
    top: 0;
    right: 0;
}

.footer {
    color: #777;
    margin: 0 auto;
    padding: 25px;
    overflow: auto;
    clear: both;
    text-transform: uppercase;
    font-size: 80%;
}

.footer .flags {
    margin-top: 10px;
}

.footer .asterisk {
    margin: 10px 0;
}

.footer a {
    color: #777;
    text-decoration: none;
}

.footer img {
    max-width: 100%;
}

.footer .left {
    float: left;
    width: 40%;
}

.footer .rating {
}

.footer .right {
    float: right;
    text-align: right;
    width: 60%;
    margin-top: 44px;
}

.footer .left img {
    margin: 0 10px 0 0;
}

.footer .left img:first-child {
    margin-left: 0;
}

.footer .logo {
    float: right;
    padding: 5px 0 0px 10px;
}

.footer .menu {
    margin-bottom: 20px;
    white-space: nowrap;
}

.footer .menu a {
    padding: 0 15px;
    display: inline-block;
}

.footer .menu a:last-child {
    padding-right: 0;
}

.footer .copyright {
    margin: 0;
    color: #fff;
}

.footer .tagline {
    margin: 0;
}

#pp_registration {
}

#pp_registration .title img {
    width: 100%;
    max-width: 783px;
    margin-top: 50px;
}

@media screen and (min-width: 1400px) {
    #pp_registration {
        background: url(../images/splash/title-bg.png) no-repeat top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        -moz-background-size: 100% auto;
        background-color: #001228;
    }

    #pp_registration .title img {
        margin-top: 140px;
    }
}

#pp_contrainer {
    max-width: 520px;
    width: 95%;
    color: #fff;
}

#pp_contrainer a {
    color: #fff;
}

#pp_registration #pp_submit {
    border: none;
    width: 164px;
    height: 44px;
    text-indent: -10000px;
    background: url(../images/splash/submit-button.png) no-repeat;
}

/**
 *
 * Utility
 *
 **/

.pull-right {
    float: right;
}

.center {
    text-align: center;
}

/**
 *
 * Mobile
 *
 */

@media screen and (max-width: 1120px) {
    .wrap {
        background: none;
    }

    .quote {
        margin: 0 20px 10px 20px;
        width: 35%;
    }

    .quote1 {
        float: none;
        display: inline-block;
    }

    .quote2 {
        float: none;
        display: inline-block;
    }

    .video-wrap {
        margin: 25px auto;
    }

    .carousel a {
        max-width: 50%;
    }

    .packs {
        margin: 50px auto;
    }

    .story {
        margin: 50px auto;
    }

    .billing {
        margin: 50px auto 25px auto;
    }

    .footer img {
        max-width: 50%;
    }

    .footer {
        height: auto;
        padding: 20px;
    }

    .footer .left {
        float: none;
        width: 100%;
        text-align: center;
    }

    .footer .flags {
        padding-top: 10px;
    }

    .footer .asterisk {
        text-align: center;
    }

    .footer .right {
        float: none;
        text-align: center;
        width: auto;
        margin-top: 10px;
    }

    .footer .logo {
        float: none;
        padding: 20px 0 25px 10px;
    }

    .footer .menu {
        margin-bottom: 20px;
        white-space: normal;
    }

    .footer .menu a {
        padding: 10px 15px;
    }

    .footer .menu a:last-child {
    }

    .footer .copyright {
        text-align: center;
        margin: 5px 0;
    }

    .footer .tagline {
        margin: 5px 0;
    }

    .packs .divider {
        background-color: transparent;
        margin: 10px 0;
    }
}

@media screen and (max-width: 925px) {
    .title {
        margin-top: -10px;
    }

    .main .inner {
        width: 90%;
    }

    .header .left {
        float: none;
        width: 100%;
        margin: 0 auto;
        text-align: center;
    }

    .header .right {
        float: none;
        width: 100%;
        margin: 0 auto;
        text-align: center;
    }

    .buttons {
        margin-top: 0;
        margin-bottom: 0;
    }

    .buttons a.bluray {
        width: 40%;
        margin: 0;
    }

    .buttons a.digitalhd {
        width: 40%;
        margin: 0;
    }

    .pack {
        padding: 0 10px;
    }

    .fb-like {
        top: -10px;
    }
}

@media screen and (max-width: 480px) {
    .main {
        width: 100%;
        margin: 0 auto;
    }

    .wrap {
    }
}