/*
Theme created for use with Sequence.js (http://www.sequencejs.com/)

Theme: Modern Slide In
Version: 1.0
Theme Author: Ian Lunn @IanLunn
Author URL: http://www.ianlunn.co.uk/
Theme URL: http://www.sequencejs.com/themes/modern-slide-in/

This is a FREE theme and is available under a MIT License:
http://www.opensource.org/licenses/mit-license.php

Sequence.js and its dependencies are (c) Ian Lunn Design 2012 unless otherwise stated.
*/
/* CSS RESET - http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 */

#sequence-theme ol, #sequence-theme ul {
    list-style: none;
    margin:0;
    padding:0;
}

/* !CSS RESET */
/* prefix declarations */
/* THEME STYLES */
#sequence-theme {
    background-color:white;
    color: white;
    margin: 0 auto;
    position: relative;
    width: auto;
    max-width: 100%;
    height:590px;
    -webkit-backface-visibility: hidden;
    /* prevent graphical glitches in WebKit browsers when using transitions */
}

#sequence-theme #sequence,#sequence li .image {
    height: 550px;
    background-repeat: no-repeat;
    background-position: center center;
    background-color: white;
}
#sequence-theme #sequence {

    margin: 0 auto;
    position: relative;
    overflow: hidden;
    background-color: white;
}
#sequence-theme .next,
#sequence-theme .prev {
    font-family:WebSymbolsRegular;
    position: absolute;
    cursor: pointer;
    position: absolute;
    top: 50%;
    z-index: 5;
    background-color: white;
    color: #111111;
    text-align: center;
    line-height: 39px;
    font-size: 20px;
    width: 39px;
    height: 39px;
    -webkit-transition-duration: 0.1s;
    -moz-transition-duration: 0.1s;
    -ms-transition-duration: 0.1s;
    -o-transition-duration: 0.1s;
    transition-duration: 0.1s;
}
#sequence-theme .next:hover,
#sequence-theme .prev:hover {
    color:#0061A8;
    -webkit-transition-duration: 0.1s;
    -moz-transition-duration: 0.1s;
    -ms-transition-duration: 0.1s;
    -o-transition-duration: 0.1s;
    transition-duration: 0.1s;
}
#sequence-theme .next:active,
#sequence-theme .prev:active {
    background-color:#0061A8;
    color:white;
    -webkit-transition-duration: 0.1s;
    -moz-transition-duration: 0.1s;
    -ms-transition-duration: 0.1s;
    -o-transition-duration: 0.1s;
    transition-duration: 0.1s;
}
#sequence-theme .pause {
    bottom: 0;
    cursor: pointer;
    position: absolute;
    z-index: 1000;
}
#sequence-theme .paused {
    opacity: 0.3;
}
#sequence-theme .prev {
    left: 0%;
    margin-top: -20px;
}
#sequence-theme .next {
    right: 0%;
    margin-top: -20px;
}
#sequence-theme #sequence-preloader {
    background: #d9d9d9;
}

#sequence-theme .sequence-preloader .preloading .circle {
    fill: #0062A3;
}

#sequence-theme .navWrap{
    position: absolute;
    right: 50%;
    margin: auto;
    bottom: -3px;
    z-index: 0;
    min-width: 100px;
}

#sequence-theme .nav {
    font-size: 30px;
    position: relative;
    -moz-transition-duration: 0.5s;
    -ms-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
    left: 50%;
}
#sequence-theme .nav li {
    display: inline-block;
    height: auto;
    margin: 5px;
}
#sequence-theme .nav li {
    display: inline;
    float:left;
    /* Hack for IE7 and below as they don't support inline-block */
}

#sequence-theme .nav li a{
    text-decoration: none;
    cursor: pointer;
    color:#363636;
}
#sequence-theme .nav li a:hover{
    color:#111111;
}
#sequence-theme .nav li a.active{
    color:#0061A8;
}
#sequence-theme .nav li img {
    height:2.5%;
    cursor: pointer;
    opacity: 0.5;
    -webkit-transition-duration: 1s;
    -moz-transition-duration: 1s;
    -ms-transition-duration: 1s;
    -o-transition-duration: 1s;
    transition-duration: 1s;
}
#sequence-theme .nav li img.active {
    opacity: 1;
}
#sequence-theme #sequence li {
    position: absolute;
    top: 0;
}
#sequence-theme #sequence li > * {
    position: absolute;
}
#sequence-theme #sequence li img {
    width: auto; /* ie8 */
}

.banner_click{
    cursor: pointer;
}
/**************************************/
/*MAIN IMAGE*/
#sequence-theme .image {
    left: 50%;
    top:0;
    opacity: 0;
    width: 100%;
    background-size:cover;
    background-position: center center;
}

#sequence-theme .animate-in .image {

    left: 0%;
    opacity: 1;
    -webkit-transition:left 1s,opacity 1s;
    -moz-transition:left 1s,opacity 1s;
    -ms-transition:left 1s,opacity 1s;
    -o-transition:left 1s,opacity 1s;
    transition:left 1s,opacity 1s;
}
#sequence-theme .animate-out .image {
    left: -50%;
    opacity: 0;
    -webkit-transition:left 1s,opacity 1s;
    -moz-transition:left 1s,opacity 1s;
    -ms-transition:left 1s,opacity 1s;
    -o-transition:left 1s,opacity 1s;
    transition:left 1s,opacity 1s;
}
/**************************************/
/*LINKS*/
#sequence-theme .links_box a{
    background-color: black;
    font-family: ss-social-regular;
    color:white;
    margin:2px;
    cursor: pointer;
    text-shadow: 0 1% 0 white;
    text-decoration: none;
    opacity:0.6;
}
#sequence-theme .links_box a:hover{
    opacity:1;
}

#sequence-theme .link h3{
    font-size:30px;
    margin-bottom: 5px;
    padding:2px 0 0 0;
    color:#8d8d8d;
    text-transform: uppercase;
    font-family: 'Open Sans Condensed', sans-serif;
}
.widget_weibo_link{
    background: url("../img/weibo.png") no-repeat scroll center center transparent;
    height: 38px;
    width: 20px;
    text-indent: -9999px;
}
.widget_youku_link{
    background: url("../img/youku.png") no-repeat scroll center center transparent;
    height: 38px;
    width: 20px;
    text-indent: -9999px;
}

.widget_vk_link{
    background: url("../img/vk_white.png") no-repeat scroll center center transparent;
    background-size: contain;
    height: 38px;
    width: 20px;
    text-indent: -9999px;
}

#sequence-theme .link a{
    font-size: 20px;
    display: inline-block;
    width: 30px;
    height: 30px;
    line-height: 37px;
    text-align: center;
}
#sequence-theme .link a.widget_official_link {
    width: auto;
    font-family: 'Open Sans Condensed', sans-serif;
    font-weight: 700;
    padding: 0 4px;
    display: block;
    margin: 1px 1px 0 0;
    text-transform: uppercase;
    float: left;
    line-height: 1.8em;
}

#sequence-theme .link {
    z-index: 55;
    opacity: 0;
    position: relative;
    height: auto;
    width:auto;
}
/**************************************/
/*TITLE*/
#sequence-theme .title {
    width:60%;
    font-size:105px;
    font-family: 'Open Sans Condensed', sans-serif;
    font-weight: 700;
    color: #363636;
    text-transform: uppercase;
    opacity: 0;
    z-index: 50;
    white-space:nowrap;
}
/**************************************/
/*SUB TITLE*/
#sequence-theme .subtitle{
    font-size:75px;
    color:#8d8d8d;
    text-transform: uppercase;
    font-family: 'Open Sans Condensed', sans-serif;
    width: 60%;
    opacity: 0;
    z-index:50;
    white-space:nowrap;
}
#sequence-theme .animate-in .link,
#sequence-theme .animate-in .title,
#sequence-theme .animate-in .shop,
#sequence-theme .animate-in .subtitle {
    opacity: 1;
    -webkit-transition-duration: 2s;
    -moz-transition-duration: 2s;
    -ms-transition-duration: 2s;
    -o-transition-duration: 2s;
    transition-duration: 2s;
}
#sequence-theme .animate-out .link,
#sequence-theme .animate-out .title,
#sequence-theme .animate-out .shop ,
#sequence-theme .animate-out .subtitle {
    opacity: 0;
    -webkit-transition-duration: 2s;
    -moz-transition-duration: 2s;
    -ms-transition-duration: 2s;
    -o-transition-duration: 2s;
    transition-duration: 2s;
}
/**************************************/
/*TOP TITLE*/
#sequence-theme  .title.Top-Right,
#sequence-theme  .title.Top-Center,
#sequence-theme  .title.Top-Left{
    top: 30px;}
#sequence-theme  .subtitle.Top-Right,
#sequence-theme  .subtitle.Top-Center,
#sequence-theme  .subtitle.Top-Left{
    top:137px;}
/*BOTTOM TITLE*/
#sequence-theme  .title.Bottom-Right,
#sequence-theme  .title.Bottom-Center,
#sequence-theme  .title.Bottom-Left{
    top: 286px;}
#sequence-theme  .subtitle.Bottom-Right,
#sequence-theme  .subtitle.Bottom-Center,
#sequence-theme  .subtitle.Bottom-Left{
    top: 422px;}
/*CENTER TITLE*/
#sequence-theme  .title.Center{
    top: 168px;}
#sequence-theme  .subtitle.Center{
    top: 284px;
    margin:0 -30%;}
/*LEFT TITLE*/
#sequence-theme  .title.Bottom-Left,
#sequence-theme  .title.Top-Left{
    left: 30%;}
#sequence-theme  .subtitle.Bottom-Left,
#sequence-theme  .subtitle.Top-Left{
    left: 5%;}
#sequence-theme  .animate-in .title.Bottom-Left,
#sequence-theme  .animate-in .title.Top-Left,
#sequence-theme .animate-in .subtitle.Bottom-Left,
#sequence-theme .animate-in .subtitle.Top-Left{
    left: 10%;}
#sequence-theme  .animate-out .title.Bottom-Left,
#sequence-theme  .animate-out .title.Top-Left{
    left: -90%;}
#sequence-theme  .animate-out .subtitle.Bottom-Left,
#sequence-theme  .animate-out .subtitle.Top-Left {
    left: 60%;}
/*RIGHT TITLE*/
#sequence-theme  .title.Bottom-Right,
#sequence-theme  .title.Top-Right{
    text-align:right;  right:30%;}
#sequence-theme  .subtitle.Top-Right,
#sequence-theme  .subtitle.Bottom-Right{
    text-align:right; right: 5%;}
#sequence-theme .animate-in .subtitle.Bottom-Right,
#sequence-theme .animate-in .subtitle.Top-Right,
#sequence-theme  .animate-in .title.Top-Right,
#sequence-theme  .animate-in .title.Bottom-Right{
    right: 10%;}
#sequence-theme  .animate-out .title.Top-Right,
#sequence-theme  .animate-out .title.Bottom-Right{
    right: -90%;}
#sequence-theme  .animate-out .subtitle.Top-Right,
#sequence-theme  .animate-out .subtitle.Bottom-Right{
    right: 60%;}
/*CENTER TITLE*/
#sequence-theme  .title.Center,
#sequence-theme  .title.Bottom-Center,
#sequence-theme  .title.Top-Center{
    text-align:center;  left:30%; }
#sequence-theme  .subtitle.Center,
#sequence-theme  .subtitle.Top-Center,
#sequence-theme  .subtitle.Bottom-Center{
    text-align:center; left: 70%; }
#sequence-theme .animate-in .subtitle.Center,
#sequence-theme .animate-in .subtitle.Bottom-Center,
#sequence-theme .animate-in .subtitle.Top-Center,
#sequence-theme  .animate-in .title.Center,
#sequence-theme  .animate-in .title.Top-Center,
#sequence-theme  .animate-in .title.Bottom-Center{
    left: 50%;}
#sequence-theme  .animate-out .title.Center,
#sequence-theme  .animate-out .title.Top-Center,
#sequence-theme  .animate-out .title.Bottom-Center{
    left: 70%;}
#sequence-theme  .animate-out .subtitle.Center,
#sequence-theme  .animate-out .subtitle.Top-Center,
#sequence-theme  .animate-out .subtitle.Bottom-Center{
    left: 30%;}

/**************************************/
/*TOP LINKS*/
#sequence-theme  .link.Top-Left,
#sequence-theme  .link.Top-Center,
#sequence-theme  .link.Top-Right{
    top: -150px;}
#sequence-theme .animate-in .link.Top-Left,
#sequence-theme .animate-in .link.Top-Center,
#sequence-theme .animate-in .link.Top-Right  {
    top: 150px;}
#sequence-theme  .animate-out .link.Top-Left,
#sequence-theme  .animate-out .link.Top-Center,
#sequence-theme  .animate-out .link.Top-Right {
    top: 250px;}
/*BOTTOM LINKS*/
#sequence-theme  .link.Bottom-Right,
#sequence-theme  .link.Bottom-Center,
#sequence-theme  .link.Bottom-Left {
    top: 150px;}
#sequence-theme .animate-in .link.Bottom-Right,
#sequence-theme .animate-in .link.Bottom-Center,
#sequence-theme .animate-in .link.Bottom-Left  {
    top: 350px;}
#sequence-theme  .animate-out .link.Bottom-Right,
#sequence-theme  .animate-out .link.Bottom-Center,
#sequence-theme  .animate-out .link.Bottom-Left {
    top: 550px;}
/*CENTER LINKS*/
#sequence-theme  .link.Center {
    top: 25px;}
#sequence-theme .animate-in .link.Center{
    top: 225px;}
#sequence-theme  .animate-out .link.Center{
    top: 425px;}
/*LEFT LINKS*/
#sequence-theme .link.Bottom-Left,
#sequence-theme .link.Top-Left {
    left: 10%;}
/*RIGHT LINKS*/
#sequence-theme  .link.Top-Right,
#sequence-theme  .link.Bottom-Right {
    text-align:right;  right: 10%;}
/*CENTER LINKS*/
#sequence-theme .link.Bottom-Center,
#sequence-theme .link.Center,
#sequence-theme .link.Top-Center {
    left: 50%;}
/*RIGHT LINKS*/
/**************************************/
/*TOP SHOP*/
#sequence-theme  .shop.Top-Right,
#sequence-theme  .shop.Top-Center,
#sequence-theme  .shop.Top-Left {
    top: 225px;}
#sequence-theme .animate-in .shop.Top-Right,
#sequence-theme .animate-in .shop.Top-Center,
#sequence-theme .animate-in .shop.Top-Left{
    top: 25px;}
#sequence-theme  .animate-out .shop.Top-Right,
#sequence-theme  .animate-out .shop.Top-Center,
#sequence-theme  .animate-out .shop.Top-Left{
    top: -175px;}
/*BOTTOM SHOP*/
#sequence-theme  .shop.Bottom-Right,
#sequence-theme  .shop.Bottom-Center,
#sequence-theme  .shop.Bottom-Left{
    top: 500px;}
#sequence-theme .animate-in .shop.Bottom-Right,
#sequence-theme .animate-in .shop.Bottom-Center,
#sequence-theme .animate-in .shop.Bottom-Left {
    top: 300px;}
#sequence-theme  .animate-out .shop.Bottom-Right,
#sequence-theme  .animate-out .shop.Bottom-Center,
#sequence-theme  .animate-out .shop.Bottom-Left{
    top: 100px;}
/*CENTER SHOP*/
#sequence-theme  .shop.Center{
    top: 350px;}
#sequence-theme .animate-in .shop.Center {
    top: 150px;}
#sequence-theme  .animate-out .shop.Center{
    top: -50px;}
/*LEFT SHOP*/
#sequence-theme  .shop.Bottom-Left,
#sequence-theme  .shop.Top-Left{
    left: 10%;}
/*RIGHT SHOP*/
#sequence-theme  .shop.Bottom-Right,
#sequence-theme  .shop.Top-Right{
    right: 10%;}
/*CENTER SHOP*/
#sequence-theme  .shop.Bottom-Center,
#sequence-theme  .shop.Center,
#sequence-theme  .shop.Top-Center{
    left: 50%;margin-left: -100px;}

/*SHOP*/
#sequence-theme .shop a{
    padding: 1%;
    margin: 2%;
    padding: 1%;
    float: left;
    cursor: pointer;
    background-color: #0061A8;
    font-family: 'Open Sans Condensed', sans-serif;
    color: white;
    text-decoration: none;
    opacity: 0.6;
    display: inline-block;
    width: 42%;
    font-size: 18px;
    vertical-align: top;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

#sequence-theme .shop a.widget_itunes_link,
#sequence-theme .shop a.widget_googleplay_link{
    background-position: center;
    background-repeat: no-repeat;
    background-color: transparent;
    height:30px;
    background-size: contain;
    text-indent: -99999px;
}
#sequence-theme .shop a.widget_itunes_link{
    background-image: url('http://files.warners.com.s3.amazonaws.com/test/iTunes.png');
}
#sequence-theme .shop a.widget_itunes_link.preorder{
    background-image: url('http://files.warners.com.s3.amazonaws.com/test/preorder_itunes.png');
}
#sequence-theme .shop a.widget_googleplay_link{
    background-image: url('http://files.warners.com.s3.amazonaws.com/test/Google-play.png');
}

#sequence-theme .shop a.widget_thewarehouse_link {
    font-size: 12px;
    padding: 5% 1% 3.2% 1%;
}
#sequence-theme .shop a:hover{
    opacity:1;
}

#sequence-theme .shop {
    z-index: 55;
    opacity: 0;
    position: relative;
    height: auto;
    width:200px;
    text-align: center;
}

.banner_logo{
    bottom: 1%;
    right: 1%;
    z-index: 1;
}

#sequence-theme #sequence .shop img{
    width: 100%;
    display: block;
}

#sequence-theme .shop a.packshotimage{
    padding: 0;
    border: 0;
    outline: none;
    width: 90%;
    margin: 0 auto;
    display: block;
}

@media all and (min-width: 720px){
    #sequence-theme  .title.Center,
    #sequence-theme  .title.Bottom-Center,
    #sequence-theme  .title.Top-Center,
    #sequence-theme  .subtitle.Center,
    #sequence-theme  .subtitle.Top-Center,
    #sequence-theme  .subtitle.Bottom-Center{
        margin-left:-30%;
    }
    #sequence-theme .link.Bottom-Center,
    #sequence-theme .link.Center,
    #sequence-theme .link.Top-Center {
        margin-left:-5%;
    }
}
