@font-face {
    font-family: 'WebSymbolsRegular';
    src: url('fonts/websymbols-regular-webfont.eot');
    src: url('fonts/websymbols-regular-webfont.eot?#iefix') format('embedded-opentype'),
        url('fonts/websymbols-regular-webfont.woff') format('woff'),
        url('fonts/websymbols-regular-webfont.ttf') format('truetype'),
        url('fonts/websymbols-regular-webfont.svg#WebSymbolsRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: 'ss-social-regular';
    src: url('fonts/ss-social-regular.eot');
    src: url('fonts/ss-social-regular.eot?#iefix') format('embedded-opentype'),
        url('fonts/ss-social-regular.woff') format('woff'),
        url('fonts/ss-social-regular.ttf') format('truetype'),
        url('fonts/ss-social-regular.svg#WebSymbolsRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "SSStandard";
    src: url('fonts/ss-standard.eot');
    src: url('fonts/ss-standard.eot?#iefix') format('embedded-opentype'),
        url('fonts/ss-standard.woff') format('woff'),
        url('fonts/ss-standard.ttf')  format('truetype'),
        url('fonts/ss-standard.svg#SSStandard') format('svg');
    font-weight: normal;
    font-style: normal;
}

/*highlighting text style*/
::selection {
    color:white;
    background: #0062A3; /* Safari */
}
::-moz-selection {
    color:white;
    background: #0062A3; /* Firefox */
}
html{
    height:100%;
}
body#home{
    background:white;
    margin: 0px 0px 25px 0px;
    border-left: 10px solid #0062A3;
    border-right: 10px solid #0062A3;
    padding:0;
    font-family: 'Open Sans Condensed', sans-serif;
    min-height: 100%;
}

.btn{
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    display: inline-block;
    padding: 4px 20px;
    margin: 20px;
    text-decoration: none;
    line-height: 20px;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    background-color: #000;
    color: #fff;
}

.clearfix{
    clear: both;
}
.infinite_navigation {
    position: absolute;
    bottom: 0;
    left: 50%;
}
#infscr-loading {
    position: absolute;
    bottom: -50px;
    height: 50px;
    left: 50%;
    width:200px;
    margin-left:-100px;
}
div.container{
    background: #FFF;
    padding-bottom: 55px;
}

section#content {
    background-color:white;
}

div.nav{
    background-color:white;
    height: 90px;
    display: block;
    position: fixed;
    width: auto;
    bottom:0;
    top:0;
    left:0;
    right:0;
    margin:0;
    z-index: 102;
    border-top: solid #0062A3 10px;
    border-left: solid #0062A3 10px;
    border-right: solid #0062A3 10px;
}

div.nav ul#main_nav{
    padding: 0;
    list-style: none;
    height: 30px;
    font-family: 'Open Sans Condensed', sans-serif;
    position: relative;
    margin-top: 30px;
}
div.nav ul#main_nav ul.submenu li{
    width: 130px;
    margin-left: -30px;
}
div.nav ul#main_nav li{
    float: left;
    padding:0 30px;
}

div.nav ul#main_nav li a{
    display: block;
    text-align: center;
    text-decoration: none;
    color: #404040;
    font-size: 16px;
    padding:0 0 0 0;
    text-transform: uppercase;
    background-color: transparent;
    transition: color 1s;
    -moz-transition: color 1s, -moz-transform 1s; /* Firefox 4 */
    -webkit-transition: color 1s, -webkit-transform 1s; /* Safari and Chrome */
    -o-transition: color 1s, -o-transform 1s; /* Opera */

}

div.nav ul#main_nav li.active a{
    color:#404040;
    font-family:'Open Sans Condensed', sans-serif;
    font-weight: 700;
}

div.nav ul#main_nav li a:hover, div.nav ul#main_nav li.active:hover a{
    color: #0061A8;
    transition:color 1s;
    -moz-transition: color 1s, -moz-transform 1s; /* Firefox 4 */
    -webkit-transition: color 1s, -webkit-transform 1s; /* Safari and Chrome */
    -o-transition: color 1s, -o-transform 1s; /* Opera */

}
div.nav ul#main_nav li a:active, div.nav ul#main_nav li.active:active a{
    color: #000000;
    transition: color 1s;
    -moz-transition: color 1s, -moz-transform 1s; /* Firefox 4 */
    -webkit-transition: color 1s, -webkit-transform 1s; /* Safari and Chrome */
    -o-transition: color 1s, -o-transform 1s; /* Opera */
}

div.nav ul#main_nav li ul {
    position: absolute;
    display: block;
    width: 130px;
    margin-left: -30px;
    left: -999em;
    opacity: 0;
    transition:opacity 1s;
    -moz-transition:opacity 1s, -moz-transform 1s; /* Firefox 4 */
    -webkit-transition:opacity 1s, -webkit-transform 1s; /* Safari and Chrome */
    -o-transition:opacity 1s, -o-transform 1s; /* Opera */
}

div.nav ul#main_nav li:hover ul {
    left: auto;
    display: block;
    background-color: #fff;
    padding-left: 0;
    list-style-type:none;
    opacity: 1;
    transition:opacity 1s;
    -moz-transition:opacity 1s, -moz-transform 1s; /* Firefox 4 */
    -webkit-transition:opacity 1s, -webkit-transform 1s; /* Safari and Chrome */
    -o-transition:opacity 1s, -o-transform 1s; /* Opera */
}
div.nav ul#main_nav ul.submenu{
    padding:0px;
    margin-left: -30px;
}
div.nav .downArrow{
    display:inline;
    font-size:13px;
    font-family:SSStandard;
}
.page_header
{
    padding: 110px 0 20px 0;
    text-align: center;
    font-size: 45px;
    text-transform: uppercase;
}
div.footer{
    background: #0062A3;
    height: 30px;
    position: fixed;
    width: 100%;
    bottom: 0;
    z-index: 10;
    font-family: 'Open Sans Condensed', sans-serif;
    font-weight: 700;
    padding-top: 5px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}
div.footer ul#footer_nav{
    list-style: none;
    padding:0;
    margin:0;
}

div.footer ul#footer_nav li{
    display:inline;
}

div.footer ul#footer_nav li a{
    text-transform: uppercase;
    text-decoration: none;
    color: white;
    margin: 0 7px;
}

div.footer div.copy_notice{
    float: left;
    margin: 0 20px;
    color: #404040;
    text-transform: uppercase;
}

div.nav img.logo{
    position: absolute;
    left: 15px;
    top: 10px;
    height: 70px;
}

div.nav img.logo_mobile{
    display: none;
}
div.nav ul.social_bar{
    margin: 0;
    padding: 0;
    list-style: none;
    float: right;
    font-family: ss-social-regular;
    font-size: 16px;
    position:absolute;
    right:15px;
    top: 50%;
    margin-top: -15px;
}
div.nav ul.social_bar li{
    float: left;
    margin: 3px 5px;
}

ul.language_bar {
    list-style: none;
    text-align: left;
    padding: 0;
    margin: 7px 15px 0 0;
    float: right;
    position: relative;
    z-index: 10;
}
ul.language_bar li{
    display: inline;
    padding: 0 4px;
}

ul.language_bar li a{
    cursor: pointer;
    font-size: 1.2em;
    line-height: 1.1em;
    text-decoration: none;
    color: #868686;
}

ul.language_bar li.selected a{
    color: #0061A8;
}

div.nav ul.social_bar li a{
    color:#404040;
    text-decoration: none;
}
div.nav ul.social_bar li a:hover{
    color:#0061A8;
}
div.nav ul.social_bar li a span{
    font-family: 'Open Sans Condensed', sans-serif;
    text-transform: uppercase;
    color: #7F7F7F;
    font-size: 13px;
    top: -3px;
    position: relative;
}

@media all and (max-width: 1170px) {
    div.nav ul.social_bar li a span{
        display: none;
    }
}

/* ********* Carousel ********** */
div.carousel{
    margin: 0;
    border: 0;
    zoom: 1;
    position: relative;
}
div.carousel ul{
    margin:0;
    padding:0;
    width:100%;
    list-style:none;
}

div.carousel ul li{
    position: relative;
    width: 100%;
    margin: 0;
    height: auto;
}

div.carousel ul li img{
    display: block;
    width: 100%;
    height: 100%;
}

div.carousel-pagination p{
    text-align: center;
    display: block;
    height: 8px;
    margin:0 auto;
    padding: 5px;
    width: 42px;
}

div.carousel-pagination p a{
    background: white;
    border-radius: 7px;
    display: block;
    float: left;
    margin:2px;
    width: 7px;
    height: 7px;
    text-indent: -9999px;  
}

div.carousel-pagination p a.active{
    background:#0065A7;
}

input.carousel-control{
    position: absolute;
    z-index: 5;
}

input.carousel-control.disabled{
    display: none;
}

input.carousel-previous{
    left: 0;
    top: 125px;
    background: url(/img/banner_left.jpg) no-repeat 0 0 transparent;
    border: none;
    height: 38px;
    text-indent: -9999px;
    cursor: pointer;
    width: 38px;
}

input.carousel-next{
    right: 0;
    top: 125px;
    background: url(/img/banner_right.jpg) no-repeat 0 0 transparent;
    border: none;
    height: 38px;
    text-indent: -9999px;
    cursor: pointer;
    width: 38px;
}

div.artistWrapper{
    background: white;
    margin: 0;
    float: left;
    padding: 10px 0;
    width: 100%;
}

div.artistWrapper h1{
    text-align: center;
    font-size: 50px;
    text-transform: uppercase;
    margin: 50px 0;
    width: 100%;
}

div.artistWrapper ul.alphas{
    height: 20px;
    margin: 0 50px;
    font-family:'Open Sans Condensed', sans-serif;
    padding: 0;
    display: block;
}

div.artistWrapper div.search{
    height: 60px;
    position: relative;
    margin: 0 20px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    display: block;
}

div.artistWrapper div.search form{
    float: left;
    display: block;
    position: absolute;
    min-width: 300px;
}
div.artistWrapper div.search form input{
    display: block;
    margin: 8px 0 0 0;
    width: 100%;
    background: #F1F1F1;
    font-family: 'Open Sans Condensed', sans-serif;
    border: 0;
    font-size: 15px;
    float: left;
    padding: 8px 0 5px 5px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

div.artistWrapper ul.alphas li{
    float: left;
    padding: 5px 0 0 0;
    width: 3.703%;
    display: block;
    text-align: center;
}

div.artistWrapper ul.alphas li a{
    color:#7F7F7F;
    text-decoration: none;
    font-size: 16px;
    text-transform: uppercase;
}

div.artistWrapper ul.alphas li.current a, div.artistWrapper ul.tags li.current a{
    color:#0061A8;
    /*font-weight: bold;*/
    font-family: 'Open Sans Condensed', sans-serif;
    font-weight: 700;

}
.mobileMenu{
    display: none;
}
div.artistWrapper div.search ul{
    margin: 0;
    list-style: none;
    top: 9px;
    padding: 6px 6px 6px 300px;
    float: right;
    height: 20px;
    font-family: 'Open Sans Condensed', sans-serif;
    box-sizing: border-box;
    display: table;
    background: white;
    overflow: hidden;
    width: 100%;
}

div.artistWrapper div.search ul li{
    text-align: center;
    display: table-cell;
    min-width: 7.14287%;
    height: 20px;
    text-align: center;
}

div.artistWrapper div.search ul li a{
    color: #7F7F7F;
    text-decoration: none;
    font-size: 13px;
    margin: 0 2px;
    white-space: nowrap;
    text-transform: uppercase;
}
h1.artist{
    color: #404040;
    text-align: center;
    font-size: 50px;
    margin: 40px 0 20px 0;
    font-weight: normal;
    text-transform: uppercase;
}
ul.topArtist{
    list-style: none;
    margin: 110px 0 0 0;
    padding: 0;
    height: 130px;

}

ul.topArtist li{
    float:left;
}

ul.topArtist li a{
    display: block;
    text-decoration: none;
    text-transform: uppercase;
    color: #B4B4B4;
}

ul.topArtist li a.artistLink{
    margin:0 0 0 5px;
}

ul.artistSections{
    padding: 15px 0 9px 0;
    margin: 0;
    float: left;
    text-align: center;
    background: #F2F2F2;
    width: 100%;
}

ul.artistSections li{
    display: inline;
    padding: 0 25px;
}

ul.artistSections li a{
    text-transform: uppercase;
    text-decoration: none;
    color: #404040;
    font-family: 'Open Sans Condensed', sans-serif;
    font-size: 1.5em;
}

ul.artistSections li a.current{
    color:#0061A8;
    font-family: 'Open Sans Condensed', sans-serif;
}

ul.socialFilters{
    list-style: none;
    margin: 15px 0 0 0;
    font-size: 16px;
    font-family: 'Open Sans Condensed', sans-serif;
    padding: 0;
    text-align: center;
    text-transform: uppercase;
}

ul.socialFilters li{
    display: inline;
    padding: 0 5px;
}

ul.socialFilters li a{
    display:inline;
    text-decoration: none;
    color:#C7C7C7;
}

ul.socialFilters li a.current{
    display:inline;
    text-decoration: none;
    font-family: 'Open Sans Condensed', sans-serif;
    font-weight: 700;
    color:#404040;
}

div.socialHeadings{
    width: 97%;
    position: relative;
    margin: 0 auto;
    float:left;
}

div.socialHeadings h3.official{
    float: left;
    text-transform: uppercase;
    font-family: 'Open Sans Condensed', sans-serif;
    color: #363636;
    font-weight: 700;
    margin: 0;
    line-height: 30px;
    width: 25%;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    padding: 10px 10px 0;
}

div.socialHeadings h3.social{
    float: right;
    text-transform: uppercase;
    font-family: 'Open Sans Condensed', sans-serif;
    font-weight: 700;
    color: #363636;
    line-height: 30px;
    width: 75%;
    position: relative;
    padding: 10px 10px 0 10px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    margin: 0;
}

div.socialHeadings h3.social span{
    float: right;
    position: absolute;
    top: 10px;
    right: 0;
    margin: 0 10px 0 0;
}

div.socialHeadings h3.social span strong{
    font-weight: normal;
}

div.socialHeadings h3.social span a{
    font-family: 'Open Sans Condensed', sans-serif;
    color: #363636;
    text-decoration: none;
}

div.socialHeadings h3.social span a:hover{
    color:#0062a3;
}

div.socialHeadings h3.social span a.current{
    font-family: 'Open Sans Condensed', sans-serif;
    font-weight: 700;
    color:#0062a3;
}

/* ***** Masonary ******* */

.masonary{
    min-height: 142px;
    clear: both;
    width: 97%;
    margin: 0 auto;    
    margin-bottom: 50px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

.element{
    position:relative;
    list-style:none;
    clear:both;
}

div.element h3{
    text-transform: uppercase;
    color: #7F7F7F;
    text-align: left;
    font-size: 1.4em;
    font-weight: normal;
    margin-top: 0;
    float:left;
}

div.element h3 a, .post_author{
    color:#383838;
    text-decoration: none;
    /*font-weight: bold;*/
    font-family: 'Open Sans Condensed', sans-serif;
    font-weight: 700;
}

div.element h3 a:hover{
    text-decoration: underline;
}

div.news h3{
    float: left;
    margin: 0 0 10% 0;
}

div.news div.webicon, li.news div.webicon{
    font-family: SSStandard;
}

div.element h3 strong{
    color:#363636;
    font-family: 'Open Sans Condensed', sans-serif;
    font-weight: 700;
}

iframe.linkBlock_youtube{
    width: 100%;
    height: 200px;
    overflow:hidden;
}

div.linkBlock_twitter,div.linkBlock_facebook,div.linkBlock_instagram{
    overflow:hidden;
    box-sizing:border-box;
    -moz-box-sizing:border-box; /* Firefox */
    -webkit-box-sizing:border-box; /* Safari */
}

div.linkBlock_twitter{
    text-align: center;
    font-size: 20px;
    background-color:#f2f2f2;
    text-transform: uppercase;
    line-height:20px;
    font-family: 'Open Sans Condensed', sans-serif;
    padding:10%;
    margin-bottom: 10px;
}

div.linkBlock_facebook{
    line-height: 19px;
    font-family: 'Open Sans Condensed', sans-serif;
    text-align:left;
    background-color: #f2f2f2;
    font-size: 17px;
    padding: 5%;
    margin-bottom: 5px;
}

div.linkBlock_facebook p{
    margin:0;
}

div.linkBlock_facebook.nopad{
    padding:0;
}
div.linkBlock_facebook.nopad p{
    margin: 5%;
}

div.linkBlock_instagram img{
    width:100%;
    margin-bottom: 5px;
}
.linkBlock_facebook img{
    display:block;
    margin:auto;
    width:100%;
}

.linkBlock_twitter a,.linkBlock_facebook a
{
    /*color:#adadad;*/
    color: #06c;
    text-decoration: none;
}

.linkBlock_twitter a:hover,.linkBlock_facebook a:hover
{
color: #666;
}

.linkBlock_youtube{
    min-width:240px;
    min-height:240px;
    margin-bottom: 5px;
    box-sizing:border-box;
    -moz-box-sizing:border-box; /* Firefox */
    -webkit-box-sizing:border-box; /* Safari */
}
a.linkBlock_link, a.linkBlock_facebook, a.linkBlock_instagram{
    display:block;
    height: 265px;
    display: block;
    overflow:hidden;
    text-indent: -9999px;
}

.webicon{
    font-family: ss-social-regular;
    color:#0062A3;
    text-transform: none;
    display:inline;
    padding-right:5px;
}

.symbol{
    font-family: WebSymbolsRegular;
}

div.stats{
    border-top: solid #E7E7E7 1px;
    text-align: center;
    font-size: 13px;
    padding: 10px 0 0 0;
    text-transform: uppercase;
    color: #949494;
}

div.stats .symbol{
    color: #383838;
    padding: 5px;
}

div.stats a{
    padding: 8px 6px 5px;
    background: #383838;
    color: white;
    text-transform: uppercase;
    text-decoration: none;
    letter-spacing: 1px;
    font-size: 11px;
    font-weight: normal;
}
a.shareicon{
    /*removed because we only want this on the hk site*/
    display:none !important;
}
a.linkicon {
    font-family: WebSymbolsRegular;
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    text-align: left;
    margin:15px;
    color:#0062A3;
    display:none;
    background-color: rgba(255, 255, 255, 0.8);
    padding: 10px;
    font-size: 20px;
    line-height: 20px;
    height:20px;
    width:20px;
    text-decoration:none;
    transition: background 0.5s;
    -moz-transition: background 0.5s; /* Firefox 4 */
    -webkit-transition: background 0.5s; /* Safari and Chrome */
    -o-transition: background 0.5s; /* Opera */
}
a.linkicon:hover{
    background-color: rgba(0,98, 163, 0.8);
}
.holdingBox{
    padding:10px;
    box-sizing:border-box;
    -moz-box-sizing:border-box; /* Firefox */
    -webkit-box-sizing:border-box; /* Safari */
}

.holdingBox h3{
    font-family:'Open Sans Condensed', sans-serif;
    text-transform: uppercase;
    color:#7F7F7F;
}

.holdingBox h3 a{
    font-family: 'Open Sans Condensed', sans-serif;
    font-weight: 700;
    color:#363636;
    text-decoration: none;
}

.holdingBox h3 a:hover{
    color:#0062a3;
    text-decoration: underline;
}

div.loading{
    min-height: 200px;
    width: 50px;
    background: url(../img/ajax-loader.gif) no-repeat center center transparent;
    display: block;
    margin: 0 auto;
    position: relative;
}

div.feed{
    float: left;
    width: 100%;
}

div.feed h2{
    font-size: 37px;
    text-align: center;
    margin: 20px 0 0 0;
    color: #404040;
    text-transform: uppercase;
}

div.feed h2.noShows{            
    font-size: 15px;
}

.masonary .news{
    float: left; 
    background-color: transparent; 
}

.masonary .news div.holdingBox{
    padding: 0 10px 10px 10px;
}

@media all and (max-width: 554px) {
    div.masonary div.news{
        height:auto;
    }
}

div.newsItem{
    background: #F2F2F2;
    /* width: 100%; */
    margin: 10px 0 10px 0;
    /* float: left; */
    padding: 5%;
    font-size: 18px;
    line-height: 19px;
    text-align: justify;
    /* overflow: hidden; */
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

div.newsItem h3{
    font-family: 'Open Sans Condensed', sans-serif;
    font-weight: 700;
    color: #363636;
    text-transform: uppercase;
    margin: 0 0 10px 0;
    line-height: 19px;
    min-height: 30px;
    /* clear:both; */
    font-size: 20px;
    /* float: left; */
    background: url(http://d1s3316fcdotv.cloudfront.net/images/logo_tiny.png) no-repeat 0 0;
    padding: 0 0 0 50px;
}
div.newsItem h3 span{
    display: block;
    font-family: 'Open Sans Condensed', sans-serif;
    color: #0062a3;
    font-size: 17px;
    line-height: 24px;
}
div.newsItem div.text{
    color: #373737;
    font-family: 'Open Sans Condensed', sans-serif;
    font-size: 18px;
    line-height: 19px;
    margin: 0;
    overflow: hidden;
    margin-bottom: 1em;
}
div.newsItem.current div.text {
    overflow: visible;
}
div.newsItem div.text p{
    margin:0;
}

div.newsItem div.text a:hover{
    color:inherit;
    text-decoration:none;
}

div.newsItem div.text img{
    max-width: 100% !important;
}
div.newsItem div.bottom{
    text-align: center;
    margin-top: 1em;
}
div.newsItem .readmore{
    text-decoration: none;
}
div.newsItem .readmore:hover{
    color: inherit;
}
a.newsItunesLink 
{
background: url('http://files.warners.com.s3.amazonaws.com/test/iTunes.png') no-repeat;
background-position: center;
display: inline-block;
width: 90px;
height: 40px;
margin: 1em 0 0 5em;
max-width: 100% !important;
background-size: contain;
text-indent: -99999px;
}

a.newsGooglePlayLink
{
background: url('http://files.warners.com.s3.amazonaws.com/test/Google-play.png') no-repeat;
background-position: center;
display: inline-block;
width: 90px;
height: 40px;
margin: 1em 0 0 5em;
max-width: 100% !important;
background-size: contain;
text-indent: -99999px;
}

div.artist_bio_text{
    color: #363636;
    font-size: 16px;
    padding-left: 10%;
    padding-right: 10%;
    font-family: 'Open Sans Condensed', sans-serif;
}
#scrollLoadingIcon{
    margin: 0px auto;
    width: 31px;
    position: relative;
    display: block;    
    display: none;
}


.elem_youtube img.ytThumb{
    width: 100%;
    display: block;
    cursor:pointer;
}

.elem_youtube div.yt-playButton{
    position: absolute;
    top: 50%;
    left: 50%;
    font-size: 40px;
    text-decoration: none;
    height: 40px;
    width: 40px;
    color: #fff;
    cursor: pointer;
    margin: -40px -20px;
}
#wookmark_tiles {
    position: relative;
    padding: 30px 0 30px 0;
}

/**
 * Grid container
 */
#wookmark_tiles {
    list-style-type: none;
    position: relative; /** Needed to ensure items are laid out relative to this container **/
    margin: 0;
    padding-right: 40px;
}

/**
 * Grid items
 */
#wookmark_tiles li  {
    width: auto;
    display: none; /** Hide items initially to avoid a flicker effect **/
    /*cursor: pointer;*/
    padding: 0 20px 0 20px ;
    /*transition: all 1s ease-in;*/
}

#wookmark_tiles li img {
    display: inline-block;
    max-width: 100%;
    height: auto !important;
}

/**
 * Grid item text
 */
#wookmark_tiles li p {
    color: #666;
    margin: 7px 0 0 0;
}

/** Loader **/

#loader {
    height: 16px;
    text-align: center;
    padding: 25px 0 25px 0;
}

#loaderCircle {
    width: 32px;
    height: 32px;
    margin: 0 auto;
}
#mainLoadingIcon{
    position: absolute;
    left: 50%;        
}
/*------ END------------- New Masonry Plugin Wookmark Attributes    */

/*--signup form*/

div.qtip-content{background-color: #FFFFFF;}

#mailingsignup-form 
{ 
    color: #000000; 
    font-family: 'Open Sans Condensed', sans-serif;
}

.signupHeading {padding-top: 10px; }
.signupHeading .heading { font-size: 20px; font-weight: bold;}
.signupHeading .heading span {color: rgb(0,115,180); }

.gray{color: #7F7F7F;}

.signupHeading div.message 
{
    display: block; 
    font-family: 'Open Sans Condensed', sans-serif;
    font-size: 16px;
    color: #A5A5A5;
    width: 270px; 
    margin-top: 8px;
    line-height: 1;
}

#mailingsignup-form input { margin-top: 8px; }

#mailingsignup-form input.login_input
{
    margin-top: 12px;
    width: 260px;
    height: 30px;
    border: none;
    background-color: #EFEFEF;
    padding-left: 5px;
    color: #202020;
    font-size: 16px;
}


#signupCheckbox div.checkbox input{ width: 16px; height: 17px; vertical-align: bottom; position: relative; top: 6px; *overflow: hidden;}
#signupCheckbox div.checkbox label {font-size: 1.2em; }
#signupCheckbox div.checkbox span.span_policy{ color: rgb(0,115,180); font-weight: bold; }

body .qtip-custom .tooltip_btn 
{
    float: left; 
    width: 58px; 
    height: 25px;
    line-height: 2;
    background-color: rgba(0,100,173,0.9); 
    margin-top: 14px; 
    margin-bottom: 5px;
    font-size: 12px;
    padding: 0px 8px 0px 8px;
    border-radius: 3px;
    overflow: hidden;
}


div.signupFooter 
{
    display: none;
    clear: both;
    width: 100%; 
    height: 20px; 
    overflow: hidden;
    position: absolute; 
    bottom: 0px; 
    left: 0px; 
    background-color: rgb(0,101,172); 
    padding-left: 9px; 
    padding-bottom: 8px; 
}

div.signupFooter span.tooltip_message{ color: white;  font-size: 1.2em; line-height: 2.2; font-family: 'Open Sans Condensed', sans-serif;}


/*signup form--*/

/*HONGKONG START*/
ul#carousel li a img{
    background: url(/themes/warners/img/ajax-loader.gif) center center no-repeat transparent;
    width: 128px;
    height: 128px;
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");
    -webkit-filter: grayscale(0%);
}
ul#carousel li{
    position:relative;
}
ul#carousel li.hidden{
    display:none;
    width:0!important;
}
ul#carousel li a img.grayscale,ul#carousel li a img.notInFocus {
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
    filter: gray; /* IE6-9 */
    -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
    opacity:0.5;
}
ul#carousel li a img:hover {
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");
    -webkit-filter: grayscale(0%);
    opacity:1!important;
}
ul#carousel li .tab {
    display:none;
}
ul#carousel li.selected .tab {
    position: absolute;
    width:35px;
    height:18px;
    bottom: 1px;
    left: 50%;
    margin-left: -18px;
    z-index: 7;
    display: block;
    background-image: url("/themes/warnersHK/img/artistselect_arrow.png");
}
#artistCarousel {
    position: relative;
    margin-bottom: -35px;
}
#artistCarousel .dropShadow {
    width: 100%;
    height: 8px;
    bottom: 26px;
    position: absolute;
    z-index: 5;
}
#carouselSelector{
    width:100%;
}
.selectOption {
    font-family: 'Open Sans Condensed', sans-serif;
    display: inline;
    text-align: center;
    background-color: #F2F2F2;
    float:left;
    border-top: solid 2px #f2f2f2;
    text-transform: uppercase;
    cursor: pointer;
    padding: 3px 0;
}
@media all and (max-width: 390px){
    .selectOption {
        font-size: 0.7em;
    }
}
.selectOption.selected {
    background-color:white;
    font-family: 'Open Sans Condensed', sans-serif;
    font-weight: 700;
}

.jspPane p {
    font-family: 'Open Sans Condensed', sans-serif;
    padding: 0px 10px 0px 20px!important;
    font-size: 12.5px;
    line-height: 19px;
    box-sizing: border-box;
    margin: 0;
}

/*HONGKONG FINISH*/
#errorPage {
    text-align: center;    
    color: #404040;
    text-transform: uppercase;
}
#errorPage .title {
    font-size: 4em;
    font-family: 'Open Sans Condensed', sans-serif;
    font-weight: 700;
}
#errorPage .description {
    font-size: 4em;
    line-height: 0.9em;
    font-family: 'Open Sans Condensed', sans-serif;
}
#errorPage .links {
    margin-top: 50px;
    font-size: 2.2em;
}
#errorPage .links a {
    padding: 0 10px;
    text-decoration: none;
    color:#0062A3;
}
#errorPage .links a:hover {
    color:#404040;
}

.errorMessage, .mailDiv {
    color: #cc2222;
    font-weight: bold;
    text-transform: uppercase;
}
.selectedNewsItem{
    max-width:800px;
    margin: 3em auto;
    background: #F2F2F2;
}
.selectedNewsItem div.newsItem{
    margin: 10px 0 0px 0;
    padding: 5% 5% 0;
}
.selectedNewsItem div.newsItem h3 {
    line-height: 27px;
    font-size: 30px;
    text-align: center;
}
.selectedNewsItem div.newsItem div.text p{
    margin: 0 0 1.5em;
}
.selectedNewsItem div.newsItem div.text p:last-child {
    margin: 0;
}
.selectedNewsItem .image {
    width: 50%!important;
    height: auto!important;
    float: left;
    padding-right: 1em;
    padding-bottom: 1em;
}

.selectedNewsItem .text {
    /* float: right; */
    /* width: 50%; */
    background: #F2F2F2;
}
.selectedNewsItem .stats {
    display: block;
    padding: 0 5%;
}
.selectedNewsItem div.webicon{
    font-family: SSStandard;
}
.latestNewsTitle {
    font-size: 7em;
    line-height: 0.9em;
    font-family: 'Open Sans Condensed', sans-serif;
    text-align: center;
    margin: 1em 0 0.3em;
}
.newsItem:hover .newsUrl{    
    opacity: 1;
}
.newsItem .newsUrl {
    display: block;
    opacity:0;
    position: absolute;
    top: 25px;
    right: 35px;
    width: 40px;
    height: 40px;
    background-color: white;
    text-align: center;
    line-height: 36px;
    text-decoration: none;
    transition: opacity .5s ease-out;
    -moz-transition: opacity .5s ease-out;
    -webkit-transition: opacity .5s ease-out;
    -o-transition: opacity .5s ease-out;
}
.newsItem .newsUrl .icon{    
    font-family: WebSymbolsRegular;
    cursor: pointer;
}
.newsItem .newsUrl:hover {    
    background-color: #0062A3;
}
.newsItem .newsUrlPopup {
    display:none;
    position: absolute;
    top: -20px;
    right: 30px;
    left: 30px;
    background-color: black;
    color: white;
    height: 40px;
    line-height: 39px;
    padding: 0 10px;
    white-space: nowrap;
    cursor: default;
}
.newsItem .newsUrlPopup .webicon {
    float: right;
    color: gray;
    cursor: pointer;
}
.newsItem .newsUrlPopup .webicon span:hover{
    color: white;
}
#wookmark_tiles li.news {
    cursor: initial;
}