@font-face {
  font-family: 'iconHeaderAtl';
  src:url('fonts/header-atl.eot?-m1nxqc2');
  src:url('fonts/header-atl.eot?#iefix-m1nxqc2') format('embedded-opentype'),
  url('fonts/header-atl.ttf?-m1nxqc2') format('truetype'),
  url('fonts/header-atl.woff?-m1nxqc2') format('woff'),
  url('fonts/header-atl.svg?-m1nxqc2#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="icon-header-atl"], [class*=" icon-"] {
  font-family:'iconHeaderAtl';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-pause.icon-header-atl:before {content: "\e60c";}
.icon-play.icon-header-atl:before {content: "\e60d";}
.icon-settings.icon-header-atl:before {content: "\e60f";}


.all{padding-top:100px;}

.site-header{top:0; left:0; right:0; position:fixed; z-index:101; background-color:#000;}
.site-header .logo {width:113px; height:70px; background:url(logo.png) center center no-repeat; display:inline-block; text-indent:-999em;}
.site-header .header-main{height:100px; position:relative;}
.site-header .header-main .site-title{top:50%; left:50%; position:absolute; -moz-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%);}
.site-header .header-main .go-back{top:0; left:0; height:60px; text-align:center; line-height:60px; color:#fff; position:absolute; text-decoration:none; font-size:25px; -moz-transform:translateX(-60px); -webkit-transform:translateX(-60px); transform:translateX(-60px); background-color:#000; z-index:3; -moz-transition: -moz-transform .3s; -webkit-transition: -webkit-transform .3s; transition:transform .3s; padding:0 20px;}
.site-header .header-main .go-back i{line-height:60px;}
.device-desktop .site-header .header-main .go-back{display:none;}
.site-header .header-main .trigger-nav{top:0; left:0; height:100px; text-align:center; line-height:95px; position:absolute; text-decoration:none; -moz-transition: -moz-transform .3s; -webkit-transition: -webkit-transform .3s; transition:transform .3s; padding:0 20px;}

.site-header .header-main .trigger-nav .icon-nav{height:13px; width:18px; margin-right:5px; display:inline-block; vertical-align:middle; position:relative;}
.site-header .header-main .trigger-nav .icon-nav em,
.site-header .header-main .trigger-nav .icon-nav:after,
.site-header .header-main .trigger-nav .icon-nav:before{height:1px; width:18px; left:0; background-color:#fff; position:absolute; content:''; -moz-transition:background-color .25s; -webkit-transition:background-color .25s; transition:background-color .25s;}

.site-header .header-main .trigger-nav .icon-nav em{top:6px;}
.site-header .header-main .trigger-nav .icon-nav:after{top:12px;}
.site-header .header-main .trigger-nav .icon-nav:before{top:0;}
.site-header .header-main .trigger-nav span{color:#fff; font-size:11px; text-transform:uppercase; display:inline-block; vertical-align:middle; -moz-transition:color .25s; -webkit-transition:color .25s; transition:color .25s;}
.site-header .header-main .trigger-nav.active span,.site-header .header-main .trigger-nav:hover span{color:#959595;}

.site-header .header-main .trigger-nav.active .icon-nav em,
.site-header .header-main .trigger-nav:hover .icon-nav em,
.site-header .header-main .trigger-nav.active .icon-nav:after,
.site-header .header-main .trigger-nav:hover .icon-nav:after,
.site-header .header-main .trigger-nav.active .icon-nav:before,
.site-header .header-main .trigger-nav:hover .icon-nav:before{background-color:#959595;}

#swf-player-embed {visibility:hidden; position:absolute; width:0px; height:0px; overflow:hidden;}

#atl-player{top:50%; right:60px; width:270px; height:50px; background-color:#1c1c1c; position:absolute; -moz-transform:translateY(-50%); -webkit-transform:translateY(-50%); transform:translateY(-50%);}
#atl-player a{width:50px; height:50px; float:left; overflow:hidden; position:relative; text-decoration:none;}
#atl-player a img{display:block; width:100%;}
#atl-player a .overlayer{width:50px; height:50px; top:0; left:0; position:absolute; background-color:rgba(0,0,0,0.75); color:#fff; font-size:20px; text-align:center; line-height:50px; opacity:1; -moz-transition:opacity .5s; -webkit-transition:opacity .5s; transition:opacity .5s;}
#atl-player a .overlayer span{display:none;}
#atl-player a .overlayer .icon-pause{display:none;}
#atl-player a .overlayer .icon-play,#atl-player a .overlayer .icon-pause{line-height:50px!important;}
#atl-player.playing a .overlayer .icon-pause{display:inline-block;}
#atl-player.playing a .overlayer .icon-play{display:none;}
#atl-player .text{overflow:hidden; padding:6px 0 5px 10px;}
#atl-player h2{color:#fff; font-size:16px; text-transform:uppercase; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
#atl-player h3{color:#959595; font-size:10px; text-transform:uppercase;}

.site-header .header-main .atl-bar{top:50%; right:345px; position:absolute; -moz-transform:translateY(-50%); -webkit-transform:translateY(-50%); transform:translateY(-50%); opacity:0.2; -moz-transition:opacity .5s; -webkit-transition:opacity .5s; transition:opacity .5s;}
.site-header .header-main .atl-bar.playing{opacity:1;}
.site-header .header-main .trigger-config-city{height:100px; line-height:100px; top:0; right:0; text-align:center; position:absolute; text-decoration:none; color:#fff; font-size:21px; -moz-transition:color .25s; -webkit-transition:color .25s; transition:color .25s; padding:0 20px;}
.site-header .header-main .trigger-config-city:hover{color:#959595;}
.site-header .header-main .trigger-config-city.active{color:#959595;}
.site-header .header-main .trigger-config-city i{line-height:60px;}

.nav-header-atl {
  top:99px; bottom:0; width:250px; position:fixed; z-index:101; background-color:#1c1c1c;
  -webkit-transition: -webkit-transform .3s;
  -moz-transition: -moz-transform .3s;
  transition:transform .3s;

  -webkit-backface-visibility:hidden;
  -moz-backface-visibility:hidden;
  backface-visibility:hidden;
  overflow-y:auto; overflow-x:hidden; overflow-scrolling:touch; font-weight:normal;
}

#nav-sidebar {left:0;
  -webkit-transform: translateX(-250px);
  -moz-transform: translateX(-250px);
  transform: translateX(-250px);
  text-align:right;
}
.nav-region {right:0;}
#nav-sidebar dd ul li a {text-align:left;}
#nav-sidebar dd ul.nav-region {
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  transform: translateX(0);
}
.all {
  -webkit-transition: -webkit-transform .3s;
  -moz-transition: -moz-transform .3s;
  transition:transform .3s;

  -webkit-backface-visibility:hidden;
  -moz-backface-visibility:hidden;
  backface-visibility:hidden;
}

body.nav-sidebar-active #nav-sidebar {
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  transform: translateX(0);
}
body.nav-sidebar-active .all {
  -webkit-transform: translateX(250px);
  -moz-transform: translateX(250px);
  transform: translateX(250px);
  overflow-x:hidden; position:relative;
}

#lockscreen {top:60px; left:0; right:0; bottom:0; position:fixed; z-index:100; display:none;}
body.nav-region-active #lockscreen,
body.nav-sidebar-active #lockscreen {display:block;}

.nav-header-atl dt{border-top:solid 1px #000;}
.nav-header-atl dt:first-child{border-top:none;}
.nav-header-atl dt a{font-size:18px; color:#fff; text-decoration:none; text-transform:uppercase; display:block; padding:20px 25px; font-weight:normal;}
.nav-header-atl dd{display: block; height:0; -webkit-transition: all .3s; -moz-transition: all .3s; transition: all .3s; overflow: hidden; opacity: 0;}
.nav-header-atl dd.active{display:block; height:495px; opacity:1;}
.nav-header-atl dt.active{background-color:#292929;}
.nav-header-atl ul li a{font-size:14px; color:#777; text-decoration:none; text-transform:uppercase; display:block; padding:10px 25px;}
.nav-header-atl ul li a.active,
.nav-header-atl ul li a:hover{color:#fff;}
.nav-header-atl ul li a small{line-height:14px; font-size:13px; letter-spacing:.08em; float:right;}

@media screen and (max-width:1024px) {
  .all{padding-top:60px;}
  .site-header .header-main{height:60px;}
  .site-header .header-main .trigger-nav{height:60px; line-height:60px; padding:0 15px;}
  .site-header .header-main .trigger-config-city{height:60px; line-height:60px; padding:0 15px;}
  .site-header .logo {width:96px; height:75px; -webkit-background-size:95px; background-size:95px; }

  #atl-player{right:50px; width:auto; background-color:transparent;}
  #atl-player a{width:60px;}
  #atl-player a .overlayer{line-height:45px; position:relative; width:40px; padding-right:10px;}
  #atl-player a .overlayer i{vertical-align:middle;}
  #atl-player a .overlayer span{top:6px; right:-24px; position:absolute; font-size:12px; color:#fff; width:30px; line-height:14px; text-align:left; font-weight:200; vertical-align:middle; text-transform:uppercase; display:block; padding:5px;}
  #atl-player a img,#atl-player .text{display:none;}

  .site-header .header-main .atl-bar{right:50px;}
  .site-header .header-main .trigger-config-city:hover{color:#fff;}
  .site-header .header-main .trigger-config-city.active{color:#959595;}
  .site-header .header-main .trigger-nav:hover span{color:#fff;}
  .site-header .header-main .trigger-nav:hover .icon-nav em,.site-header .header-main .trigger-nav:hover .icon-nav:after,.site-header .header-main .trigger-nav:hover .icon-nav:before{background-color:#fff;}
  .site-header .header-main .trigger-nav.active span{color:#959595;}

  .site-header .header-main .trigger-nav.active .icon-nav em,
  .site-header .header-main .trigger-nav.active .icon-nav:after,
  .site-header .header-main .trigger-nav.active .icon-nav:before{background-color:#959595;}
  .nav-header-atl {top:59px; z-index:105;}
}

@media screen and (max-width: 800px) {
  .site-header .header-main{height:60px;}
  .site-header .header-main .trigger-nav{height:60px; line-height:60px; padding:0 15px;}
  .site-header .header-main .trigger-config-city{height:60px; line-height:60px; padding:0 15px; display:none;}

  #atl-player{right:15px; width:auto; background-color:transparent;}
  #atl-player a{width:60px;}
  #atl-player a .overlayer{line-height:45px; position:relative; width:40px; padding-right:10px;}
  #atl-player a .overlayer i{vertical-align:middle;}
  #atl-player a .overlayer span{top:6px; right:-24px; position:absolute; font-size:12px; color:#fff; width:30px; line-height:14px; text-align:left; font-weight:200; vertical-align:middle; text-transform:uppercase; display:block; padding:5px;}
  #atl-player a img,
  #atl-player .text{display:none;}

  .site-header .header-main .site-title{-webkit-transform:translate(-50%,-50%) scale(0.6); -moz-transform:translate(-50%,-50%) scale(0.6); transform:translate(-50%,-50%) scale(0.6);}
  .site-header .header-main .atl-bar{right:50px;}
  .site-header .header-main .trigger-config-city:hover{color:#fff;}
  .site-header .header-main .trigger-config-city.active{color:#959595;}
  .site-header .header-main .trigger-nav:hover span{color:#fff;}
  .site-header .header-main .trigger-nav:hover .icon-nav em,.site-header .header-main .trigger-nav:hover .icon-nav:after,.site-header .header-main .trigger-nav:hover .icon-nav:before{background-color:#fff;}
  .site-header .header-main .trigger-nav.active span{color:#959595;}
  .site-header .header-main .trigger-nav.active .icon-nav em,.site-header .header-main .trigger-nav.active .icon-nav:after,.site-header .header-main .trigger-nav.active .icon-nav:before{background-color:#959595;}
}
@media screen and (min-width:1600px) {
  .site-header .header-main{margin:0 30px;}
}