﻿/* videos */
.cbg-jwplayer {
  width: 100%; height: 100%; background: #000;
}
.cbg-video-mask {
  position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #000;
}
/* fix jwplayer 1px bottom spacing in Safari */
#playerUoUKOnijsTOF_wrapper {
  height: 100%!important;
}

/* slider banners */
#cbg-banner {
  height: 585px; max-height: 900px;
}
  #cbg-banner .slides li > a {
    display: block; position: relative; overflow: hidden; height: 585px; max-height: 900px;
  }
  #cbg-banner .slides li > a img {
    height: 100%;
    position: absolute; left: -9999px; top: -9999px; right: -9999px; bottom: -9999px; margin: auto; width: auto!important;
  }
  #cbg-banner .slides li > span {
    display: block; position: relative; overflow: hidden; height: 585px; max-height: 900px;
  }
  #cbg-banner .slides li > span img {
    height: 100%;
    position: absolute; left: -9999px; top: -9999px; right: -9999px; bottom: -9999px; margin: auto; width: auto!important;
  }
/* press events */
#cbg-press {
  position: relative; height: auto; padding: 0; overflow: hidden; background: #ccc url('../images/press_bg.jpg');
}
  #cbg-press > ul {
    width: auto; margin: 2px; max-width: inherit;
  }
  #cbg-press > ul > li {
    width: 50%;
  }
  #cbg-press > ul > li > div {
    position: relative; display: block; width: auto; margin: 2px; padding-bottom: 51.6771488%; overflow: hidden;
  }
  #cbg-press > ul > li > div > a > img {
    position: absolute; left: 0; top: 0; width: 100%; min-height: 100%;
  }
  #cbg-press > ul > li > div > div.flexslider {
    position: absolute; width: 100%; height: 100%;
  }
  #cbg-press div.flexslider,
  #cbg-press div.flexslider .flex-viewport,
  #cbg-press div.flexslider .slides {
    height: 100%;
  }
  #cbg-press div.flexslider ul.slides > li {
    display: block; height: 100%;
  }
  #cbg-press div.flexslider ul.slides > li > a {
    display: block; height: 100%; position: relative;
  }
  #cbg-press div.flexslider ul.slides > li > a img {
    position: absolute; left: 0; top: 0; width: 100%; min-height: 100%;
  }
  /* custom styles for paging */
  #cbg-press .flex-control-nav {
    right: 10px; width: auto; padding: 6px 6px 5px 6px; border-radius: 20px; background-color: #222;
  }
  #cbg-press .flex-control-nav li {
    margin: 0 3px;
  }
  #cbg-press .flex-control-nav li a {
    width: 15px; height: 15px; border: #999 solid 2px!important; background: transparent; box-shadow: none; transition: all linear 0.2s;
  }
  #cbg-press .flex-control-nav li a:hover {
    background: #111;
  }
  #cbg-press .flex-control-nav li a.flex-active {
    background-color: #999!important;
  }

/* stores */
#cbg-stores {
  position: relative; overflow: hidden; background-color: #333;
}
  #cbg-stores .cbg-bg {
    position: absolute; width: 104%; height: 800px; left: -2%; top: -40px;
  }
  #cbg-stores .cbg-bg .layer {
    width: 100%; height: 100%; background: #333 url('../images/maps_bg.jpg'); background-position: center top;
  }
  #cbg-stores .cbg-wrapper {
    position: relative; left: 0; top: 0; width: 100%; height: 100%;
  }
  #cbg-stores h2 {
    margin: 70px 0; text-align: center; font-size: 2em; letter-spacing: 0.2em;
  }
  #cbg-stores h2 span {
    display: block; width: 110px; height: 110px; margin: 0px auto; margin-bottom: 1em; background: url('../../cbg/images/sprites_2.png') no-repeat;
  }
  #cbg-stores ul.figures {
    width: 70%; margin: 0 auto;
  }
    #cbg-stores ul.figures li {
      width: 33.33%; font-size: 1.2em; text-align: center; border-right: #505050 solid 1px;
    }
    #cbg-stores ul.figures li.cbg-last {
      width: 33.0%; border-right: none;
    }
    #cbg-stores ul.figures li em {
      display: block; margin-bottom: 0.5em; font-size: 2em; font-family: Arial, sans-serif; font-weight: lighter;
    }
  #cbg-stores form {
    margin: 70px 0; text-align: center;
  }
  #cbg-stores form .sbHolder {
    display: inline-block; width: 20%; min-width: 220px; margin: 0.5em; text-align: left; font-size: 1.4em; font-family: inherit;
  }
  #cbg-stores form .sbSelector,
  #cbg-stores form .sbOptions {
    width: 100%;
  }
  #cbg-stores form .sbOptions {
    max-height: 170px!important;
  }
  #cbg-stores form div.actions {
    margin: 4em 0;
  }
  #cbg-stores form input[type=submit] {
    margin: 0 1em;
  }
  #cbg-stores h3 {
    width: 8em; margin: 0 auto; text-align: center; color: #fff; font-size: 1.3em; padding-bottom: 0.5em; border-bottom: #c52525 solid 2px;
  }
  /* Online stores */
  #cbg-stores .online-stores {
    padding: 40px 0; background: url('../images/online_stores_bg.png') repeat-y;
  }
  #cbg-stores .online-stores ul {
    width: 900px; margin: 0 auto;
  }
  #cbg-stores .online-stores ul li {
    width: 33%; height: 40px; text-align: center; border-right: #333 solid 1px;
  }
  #cbg-stores .online-stores ul li.cbg-last {
    border-right: none;
  }
  #cbg-stores .online-stores ul li a {
    display: block; margin: 0 auto; text-indent: -9999px; background: url('../../cbg/images/sprites_cbg_1.png') no-repeat;
  }
    #cbg-stores .online-stores ul li.col-1 a { /* VMALL */
      width: 100px; height: 40px; background-position: -131px -283px;
    }
      #cbg-stores .online-stores ul li.col-1 a:hover {
        background-position: -131px -333px;
      }
    #cbg-stores .online-stores ul li.col-2 a { /* Tmall */
      width: 160px; height: 40px; background-position: -253px -283px;
    }
      #cbg-stores .online-stores ul li.col-2 a:hover {
        background-position: -254px -333px;
      }
    #cbg-stores .online-stores ul li.col-3 a { /* JD */
      width: 160px; height: 40px; background-position: -440px -283px;
    }
      #cbg-stores .online-stores ul li.col-3 a:hover {
        background-position: -440px -333px;
      }
    #cbg-stores .online-stores ul li.col-4 a { /* Gome */
      width: 110px; height: 40px; background-position: -131px -387px;
    }
      #cbg-stores .online-stores ul li.col-4 a:hover {
        background-position: -131px -439px;
      }

/* SNS */
#cbg-footer-nav {
  margin-top: -310px;
}
  #cbg-footer-nav .cbg-overlay {
    background-color: #000; opacity: 0.45; filter: alpha(opacity=45);
  }
#cbg-sns {
  padding: 20px 0; padding-bottom: 312px; background: url('../images/sns_bg.jpg'); background-position: top center; background-size: cover;
}
  /* text feeds */
  #cbg-sns .cbg-text-feeds {
    height: 163px; overflow: hidden; color: #fff; background: url('../images/sina_feeds_bg.jpg') no-repeat; background-position: center center;
  }
  #cbg-sns .cbg-text-feeds h2 {
    display: block; width: 60px; height: 60px; margin: 5px auto; text-indent: -9999px; background: url('../../cbg/images/sprites_cbg_1.png') no-repeat; background-position: -22px -125px;
  }
  #cbg-sns .cbg-text-feeds h2 a {
    display: block; width: 100%; height: 100%;
  }
  #cbg-sns .cbg-text-feeds ul li {
    height: 85px;
  }
  #cbg-sns .cbg-text-feeds q {
    display: block; width: 96%; margin: 0 auto; font-size: 1.2em; text-align: center; line-height: 140%;
  }
  #cbg-sns .cbg-text-feeds p {
    width: 80%; margin: 1em auto; text-align: right;
  }
  #cbg-sns .cbg-text-feeds p em {
    display: block; float: right; padding: 0.5em 1em; background-color: #c52525; color: #fff;
  }
  /* feeds strips */
  #cbg-sns .cbg-feeds {
    position: relative; height: auto; overflow: hidden; margin: 20px 0;
  }
  #cbg-sns .cbg-feeds .heading {
    display: table; position: absolute; left: 50%; margin-left: -60px; width: 120px; height: 100%;
    z-index: 10;
  }
  #cbg-sns .cbg-feeds .heading .cbg-overlay {
    position: absolute; width: 100%; height: 110%; background-color: #000; opacity: 0.8; filter: alpha(opacity = 80);
  }
  #cbg-sns .cbg-feeds .heading-inner {
    display: table-cell; position: relative; text-align: center; vertical-align: middle;
  }
  #cbg-sns .cbg-feeds .heading a {
    display: inline-block; width: 100%; height: 100%; background: url('../../cbg/images/sprites_cbg_icon.png') no-repeat; text-indent: -9999px;
  }
  #cbg-sns .cbg-club-feeds {
    margin-top: 14px;
  }
  #cbg-sns .cbg-club-feeds .heading a {
    width: 80px; height: 80px; background-position: -10px -290px;
  }
  #cbg-sns .cbg-youku-feeds .heading a {
    width: 120px; height: 80px; background-position: 10px -200px;
  }
  #cbg-sns .cbg-facebook-feeds .heading a {
    width: 48px; height: 48px; background-position: -379px -233px;
  }
  #cbg-sns .cbg-youtube-feeds .heading a {
    width: 58px; height: 52px; background-position: -432px -233px;
  }
  #cbg-sns .cbg-feeds ul.slides li {
    height: auto;
  }
  #cbg-sns .cbg-feeds ul.slides li a {
    position: relative; display: block; width: 100%; height: 100%; color: #fff;
  }
  #cbg-sns .cbg-feeds ul.slides li a:hover {
    color: #eee;
  }
  /* image item */
  #cbg-sns .cbg-feeds ul li.cbg-img img {
    min-width: 100%; height: 100%;
  }
  #cbg-sns .cbg-feeds ul li.cbg-img div.cbg-overlay {
    position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #000; opacity: 0.3; filter: alpha(opacity = 30); transition: all linear 0.2s;
  }
    #cbg-sns .cbg-feeds ul li.cbg-img div.cbg-overlay:hover {
      opacity: 0; filter: alpha(opacity = 0);
    }
  #cbg-sns .cbg-feeds ul li.cbg-img div.text-outer {
    display: table; width: 101%; height: 101%; background: #c52525 url('../images/sns_block_bg_red.jpg') repeat-y;
  }
  #cbg-sns .cbg-facebook-feeds ul li.cbg-img div.text-outer {
    background: #3b5998 url('../images/sns_block_bg_facebook.jpg') repeat-y;
  }
  #cbg-sns .cbg-youtube-feeds ul li.cbg-img div.text-outer {
    background: #bb0000 url('../images/sns_block_bg_youtube.jpg') repeat-y;
  }
  #cbg-sns .cbg-youku-feeds ul li.cbg-img div.text-outer {
    background: #9b6e07 url('../images/sns_block_bg_yellow.jpg') repeat-y;
  }
  #cbg-sns .cbg-feeds ul li.cbg-img div.text-inner {
    display: table-cell; width: 100%; height: 100%; padding: 5%; font-size: 12px; text-align: center; vertical-align: middle; line-height: 160%;
  }
  /* text-only item */
  #cbg-sns .cbg-feeds ul li.text {
    background-color: #c52525; color: #fff; line-height: 150%; text-align: center;
  }
  #cbg-sns .cbg-feeds ul li.text p {
    padding: 1em;
  }



/* override */
#cbg-stores h2 {
  font-size: 3em; letter-spacing: 0;
}
#cbg-stores form .sbHolder {
  margin: 0.5em 30px; font-size: 1.2em;
}
#cbg-stores form .sbOptions {
  max-height: 150px!important;
}
#cbg-sns {
  padding-top: 1px;
}
.jwplayer .x-over{
 position:absolute;
 z-index:1;
 top:50%;
 left:50%;
 margin-left:-200px;
 margin-top:60px;
 color:#fff;
 font-size:18px;
 display:none;
}
.jwplayer .x-over a,.jwplayer .x-over span{
 color: #3399ff;
}
.jwplayer .x-over a{
 text-decoration: underline;
 background: url('../images/001.png') no-repeat right 2px;
 padding-right: 18px;
}
.jwplayer .x-over span{
 font-family: -webkit-body;
 font-weight: bold;
}
.jwplayer .x-mask{
 background-color: rgba(0,0,0,.5); 
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7f000000,endColorstr=#7f000000);
}
.jwplayer .x-opacity{
 opacity: 0.5!important;
}