/*RESET*/
* {margin: 0; padding:0}
.clear {clear: both}

/*TYPO*/
@font-face {
  font-family: 'WCROUGHTRADBtaRegular';
  src: url('../still/webfonts/wc_roughtrad-webfont.eot');
  src: url('../still/webfonts/wc_roughtrad-webfont.eot?#iefix') format('embedded-opentype'),
  url('../still/webfonts/wc_roughtrad-webfont.woff') format('woff'),
  url('../still/webfonts/wc_roughtrad-webfont.ttf') format('truetype'),
  url('../still/webfonts/wc_roughtrad-webfont.svg#WCROUGHTRADBtaRegular') format('svg')
}
@font-face {
  font-family: 'ubuntu_condensedregular';
  src: url('../still/webfonts/ubuntucondensed-regular-webfont.eot');
  src: url('../still/webfonts/ubuntucondensed-regular-webfont.eot?#iefix') format('embedded-opentype'),
  url('../still/webfonts/ubuntucondensed-regular-webfont.woff') format('woff'),
  url('../still/webfonts/ubuntucondensed-regular-webfont.ttf') format('truetype'),
  url('../still/webfonts/ubuntucondensed-regular-webfont.svg#ubuntu_condensedregular') format('svg');
  font-weight: normal;
  font-style: normal;
}
a {outline: none; text-decoration: none; color: #555}
a img {border: none}
p {padding-bottom: 10px}
h1 {font-size: 25px; border-bottom: 1px dotted #333; margin-bottom: 12px; padding-bottom: 8px}
h1 span.links {margin-top: -10px; float: right; font-size: 14px}
h1 span.links span.links-text {margin-top: 7px; margin-right: 6px; display: block; float: left}
h1 span.links a {display: inline-block; zoom: 1; *display: inline; width: 30px; height: 30px; margin-left: 3px}
h1 span.links a.amazon {background: url('../still/images/amazon.png')}
h1 span.links a.emp {background: url('../still/images/emp.png')}
h1 span.links a.itunes {background: url('../still/images/itunes.png')}
h1 span.links a.amazon:hover {background: url('../still/images/amazon-active.png')}
h1 span.links a.emp:hover {background: url('../still/images/emp-active.png')}
h1 span.links a.itunes:hover {background: url('../still/images/itunes-active.png')}
h1 span.voe {margin-left: 20px; font-size: 14px}
h2 {font: bold 20px/18px WCROUGHTRADBtaRegular, Verdana, Arial, Sans-serif; color: #333; margin-bottom: 12px}
h3 {font: 22px/30px WCROUGHTRADBtaRegular, Verdana, Arial;
  text-transform:uppercase;
  text-shadow: -1px -1px 1px #000 ;
  color:#222120;
  border-bottom: 1px solid #333;
}
strong {font-weight: bold}
input, textarea {outline: none; font: 14px 'ubuntu_condensedregular', Verdana, Arial, Sans-serif}

/*CONTAINER*/
body {background: #f0ecd1 url('../still/images/body-bg.jpg') fixed center top no-repeat; color:#555; font: 14px/18px 'ubuntu_condensedregular', Verdana, Arial, Sans-serif}
.wrapper {width: 1240px; margin: 0 auto 35px auto}

/*HEADER*/
.header {width: 1020px; height: 300px; background: url('../still/images/header-bg.png') center top no-repeat; text-align: center; margin: 0 auto; position: relative}
a.logo {position: absolute; top: 70px; left: 31%}

/*CONTENT*/
.content {padding: 20px; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; -webkit-box-shadow: 0px 5px 15px #000000; -moz-box-shadow: 0px 5px 15px #000000; box-shadow: 0px 5px 15px #000000; background: #e9e8db; width: 1200px; margin: 20px auto 30px auto}

.content .articeltop {float: left}
.content .articeltop.first {width: 40%; margin-right: 2%}
.content .articeltop.second {width: 30%; margin-right: 2%; overflow: hidden; height: 250px}
.content .articeltop.third {width: 26%; overflow: hidden; height: 250px}

.content .articel-wrapper {width: 1200px; padding: 20px; margin-left: -20px; border-top: 1px solid #333}
.content .articel-wrapper.scrollbig {height: 500px; overflow: hidden}
.content .articel-wrapper ul {margin-bottom: 10px}
.content .articel-wrapper ul li {list-style-image: url(../still/images/bulletpoint-articel.png); margin-left: 15px}
.content .articel-wrapper ul li ul li {list-style-image: url(../still/images/bulletpoint-articel-second.png); margin-left: 15px}
.content .articel-wrapper p:last-child {padding: 0}
.content .articel-wrapper.light {background: #f0ecd1}
.content .articel-wrapper .articel {width: 48%; height: 320px; overflow: hidden}
.content .articel-wrapper .articel.high450 {height: 450px}
.content .articel-wrapper .articel.left {float: left; text-align: right}
.content .articel-wrapper .articel.left img {width: 100%}
.content .articel-wrapper .articel.left img.small {width: 58%}
.content .articel-wrapper .articel.right {float: right}

/*MENU-MAIN*/
ul.menu-main {padding: 0 15px; background: url('../still/images/menu-level-one-bg.png') no-repeat; height: 50px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;m-webkit-box-shadow: 0 0 5px #000000; -moz-box-shadow: 0 0 5px #000000; box-shadow: 0 0 5px #000000; width: 990px; margin: 0 auto; position: relative; z-index: 50}
ul.menu-main li {list-style-type: none; display: inline}
ul.menu-main li a {font: 18px/50px WCROUGHTRADBtaRegular, Verdana, Arial, Sans-serif; text-transform: uppercase; height: 50px; color: #f0ecd1; display: block; float: left; padding: 0 15px}
ul.menu-main li a:hover {border-top: 10px solid #2c2c2b; margin-top: -10px; -webkit-box-shadow: 0 -5px 8px -5px #000000; -moz-box-shadow: 0 -5px 8px -5px #000000; box-shadow: 0 -5px 8px -5px #000000; background-color: rgba(239, 235, 209, 0.4)}
ul.menu-main li a.menuactive {color: #2c2c2b; border-top: 10px solid #2c2c2b; margin-top: -10px; -webkit-box-shadow: 0 -5px 8px -5px #000000; -moz-box-shadow: 0 -5px 8px -5px #000000; box-shadow: 0 -5px 8px -5px #000000; background-color: rgba(239, 235, 209, 0.9)}

/*FOOTER*/
.footer {text-align: center; width: 1020px; margin: 0 auto 30px auto}

/*PLAYER*/
.player-wrapper {-webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; -webkit-box-shadow: 0px 5px 15px #000000; -moz-box-shadow: 0px 5px 15px #000000; box-shadow: 0px 5px 15px #000000; background: url('../still/images/menu-level-one-bg.png') no-repeat; width: 1020px; margin: 20px auto 30px auto}
.jp-playlist, #jp_container_2 {display: none}
#jp_container_2 {position: fixed; right: 50px; z-index: 100; bottom: 60px}
.equalizer {display: none; position: absolute; left: 705px; top: 8px}

/*SCROLLBAR*/
.mCSB_container {width: auto; margin-right: 30px; overflow:hidden}
.mCSB_container.mCS_no_scrollbar {margin-right: 0}
.mCS_disabled>.mCustomScrollBox>.mCSB_container.mCS_no_scrollbar, .mCS_destroyed>.mCustomScrollBox>.mCSB_container.mCS_no_scrollbar {margin-right: 30px}
.mCustomScrollBox>.mCSB_scrollTools {width: 16px; height: 100%; top: 0; right: 0}
.mCSB_scrollTools .mCSB_draggerContainer {position: absolute; top: 0; left: 0; bottom: 0; right: 0; height: auto}
.mCSB_scrollTools a+.mCSB_draggerContainer {margin: 20px 0}
.mCSB_scrollTools .mCSB_draggerRail {width: 2px; height: 100%; margin: 0 auto; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px}
.mCSB_scrollTools .mCSB_dragger {cursor: pointer; width: 100%; height: 30px}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {width: 4px; height: 100%; margin: 0 auto; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; text-align: center}
.mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_buttonDown {display: block; position: relative; height: 20px; overflow: hidden; margin: 0 auto; cursor: pointer}
.mCSB_scrollTools .mCSB_buttonDown {top: 100%; margin-top: -40px}
.articeltop >.mCustomScrollBox>.mCSB_scrollTools {height: 97%; top: 2%; right: 0.5%}
.articeltop .mCSB_scrollTools .mCSB_draggerRail {width: 0;	border-right:1px solid #666}
.articeltop .mCSB_scrollTools .mCSB_dragger {height: 11px}
.articeltop .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {width: 11px; -webkit-border-radius: 11px; -moz-border-radius: 11px; border-radius: 11px; background: #333; -moz-box-shadow: 0 0 2px #000; -webkit-box-shadow: 0 0 2px #000; box-shadow: 0 0 2px #000}
.articel.right >.mCustomScrollBox>.mCSB_scrollTools {height: 97%; top: 2%; right: 0.5%}
.articel.right .mCSB_scrollTools .mCSB_draggerRail {width: 0;	border-right:1px solid #666}
.articel.right .mCSB_scrollTools .mCSB_dragger {height: 11px}
.articel.right .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {width: 11px; -webkit-border-radius: 11px; -moz-border-radius: 11px; border-radius: 11px; background: #333; -moz-box-shadow: 0 0 2px #000; -webkit-box-shadow: 0 0 2px #000; box-shadow: 0 0 2px #000}
.scrollbig >.mCustomScrollBox>.mCSB_scrollTools {height: 97%; top: 2%; right: 0.5%}
.scrollbig .mCSB_scrollTools .mCSB_draggerRail {width: 0;	border-right:1px solid #666}
.scrollbig .mCSB_scrollTools .mCSB_dragger {height: 11px}
.scrollbig .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {width: 11px; -webkit-border-radius: 11px; -moz-border-radius: 11px; border-radius: 11px; background: #333; -moz-box-shadow: 0 0 2px #000; -webkit-box-shadow: 0 0 2px #000; box-shadow: 0 0 2px #000}

/*
 * jQuery FlexSlider v2.2.0
 * http://www.woothemes.com/flexslider/
 *
 * Copyright 2012 WooThemes
 * Free to use under the GPLv2 license.
 * http://www.gnu.org/licenses/gpl-2.0.html
 *
 * Contributing author: Tyler Smith (@mbmufffin)
 */


/* Browser Resets
*********************************/
.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus  {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;}

/* Icon Fonts
*********************************/
/* Font-face Icons */
@font-face {
  font-family: 'flexslider-icon';
  src:url('fonts/flexslider-icon.eot');
  src:url('fonts/flexslider-icon.eot?#iefix') format('embedded-opentype'),
  url('fonts/flexslider-icon.woff') format('woff'),
  url('fonts/flexslider-icon.ttf') format('truetype'),
  url('fonts/flexslider-icon.svg#flexslider-icon') format('svg');
  font-weight: normal;
  font-style: normal;
}

/* FlexSlider Necessary Styles
*********************************/
.flexslider {margin: 0; padding: 0;}
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {width: 100%; display: block;}
.flex-pauseplay span {text-transform: capitalize;}

/* Clearfix for the .slides element */
.slides:after {content: "\0020"; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
html[xmlns] .slides {display: block;}
* html .slides {height: 1%;}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {display: block;}

/* FlexSlider Default Theme
*********************************/
.flexslider { margin: 0 0 60px; background: #fff; position: relative; border: 8px solid #2c2c2b; -webkit-box-shadow: 0 1px 4px rgba(0,0,0,.8); -moz-box-shadow: 0 1px 4px rgba(0,0,0,.8); -o-box-shadow: 0 1px 4px rgba(0,0,0,.8); box-shadow: 0 1px 4px rgba(0,0,0,.8); zoom: 1; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px}
.flex-viewport { max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; }
.loading .flex-viewport { max-height: 300px; }
.flexslider .slides { zoom: 1; }
.carousel li { margin-right: 5px; }

/* Direction Nav */
.flex-direction-nav {*height: 0;}
.flex-direction-nav a  { display: block; width: 40px; height: 40px; margin: -20px 0 0; position: absolute; top: 50%; z-index: 10; overflow: hidden; opacity: 0; cursor: pointer; color: rgba(0,0,0,0.8); text-shadow: 1px 1px 0 rgba(255,255,255,0.3); -webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease; }
.flex-direction-nav .flex-prev { left: -50px; }
.flex-direction-nav .flex-next { right: -50px; text-align: right; }
.flexslider:hover .flex-prev { opacity: 0.7; left: 10px; }
.flexslider:hover .flex-next { opacity: 0.7; right: 10px; }
.flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover { opacity: 1; }
.flex-direction-nav .flex-disabled { opacity: 0!important; filter:alpha(opacity=0); cursor: default; }
.flex-direction-nav a:before  { font-family: "flexslider-icon"; font-size: 40px; display: inline-block; content: '\f001'; }
.flex-direction-nav a.flex-next:before  { content: '\f002'; }

/* Pause/Play */
.flex-pauseplay a { display: block; width: 20px; height: 20px; position: absolute; bottom: 5px; left: 10px; opacity: 0.8; z-index: 10; overflow: hidden; cursor: pointer; color: #000; }
.flex-pauseplay a:before  { font-family: "flexslider-icon"; font-size: 20px; display: inline-block; content: '\f004'; }
.flex-pauseplay a:hover  { opacity: 1; }
.flex-pauseplay a.flex-play:before { content: '\f003'; }

/* Control Nav */
.flex-control-nav {width: 100%; position: absolute; bottom: -40px; text-align: center;}
.flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-paging li a {width: 11px; height: 11px; display: block; background: #666; background: rgba(0,0,0,0.5); cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; -webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); -moz-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); -o-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); box-shadow: inset 0 0 3px rgba(0,0,0,0.3); }
.flex-control-paging li a:hover { background: #333; background: rgba(0,0,0,0.7); }
.flex-control-paging li a.flex-active { background: #000; background: rgba(0,0,0,0.9); cursor: default; }

.flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;}
.flex-control-thumbs li {width: 25%; float: left; margin: 0;}
.flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer;}
.flex-control-thumbs img:hover {opacity: 1;}
.flex-control-thumbs .flex-active {opacity: 1; cursor: default;}

@media screen and (max-width: 860px) {
  .flex-direction-nav .flex-prev { opacity: 1; left: 10px;}
  .flex-direction-nav .flex-next { opacity: 1; right: 10px;}
}

/*CONTAINER*/
div.jp-audio {background-color: #f0ecd1; width: 96%; padding: 0 2%; margin-bottom: 15px; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; height: 35px}
div.jp-interface {position: relative; width:100%}
div.jp-interface ul.jp-controls {list-style-type: none; overflow: hidden; float: left}
div.jp-interface ul.jp-controls li {display:inline; float: left}
div.jp-interface ul.jp-controls a {display:block; overflow:hidden; text-indent:-9999px; height: 30px; padding: 0; width: 17px; padding: 0 3px}
div.jp-type-playlist .jp-playlist-show {background: url("../still/images/jplayer.flag.png") -42px -4px no-repeat; margin-right: 20px}

/*CONTROLS*/
div.jp-type-playlist .jp-playlist-show:hover {background: url("../still/images/jplayer.flag.png") -142px -4px no-repeat}
div.jp-type-playlist .jp-play {background: url("../still/images/jplayer.flag.png") -42px -40px no-repeat}
div.jp-type-playlist .jp-play:hover {background: url("../still/images/jplayer.flag.png") -142px -40px no-repeat}
div.jp-type-playlist .jp-pause {background: url("../still/images/jplayer.flag.png") -42px -120px no-repeat}
div.jp-type-playlist .jp-pause:hover {background: url("../still/images/jplayer.flag.png") -142px -120px no-repeat}
div.jp-type-playlist .jp-stop {background: url("../still/images/jplayer.flag.png") -42px -80px no-repeat}
div.jp-type-playlist .jp-stop:hover {background: url("../still/images/jplayer.flag.png") -142px -80px no-repeat}
div.jp-type-playlist .jp-previous {background: url("../still/images/jplayer.flag.png") -42px -201px no-repeat}
div.jp-type-playlist .jp-previous:hover {background: url("../still/images/jplayer.flag.png") -142px -201px no-repeat}
div.jp-type-playlist .jp-next {background: url("../still/images/jplayer.flag.png") -42px -161px no-repeat}
div.jp-type-playlist .jp-next:hover {background: url("../still/images/jplayer.flag.png") -142px -161px no-repeat}
div.jp-interface ul.jp-controls a.jp-mute, div.jp-interface ul.jp-controls a.jp-unmute, div.jp-interface ul.jp-controls a.jp-volume-max {background: url("../still/images/jplayer.flag.png") 0px -330px no-repeat; width: 16px; height: 11px; margin-left: 190px; margin-top: 10px}
div.jp-interface ul.jp-controls a.jp-mute:hover {background: url("../still/images/jplayer.flag.png") -25px -330px no-repeat}
div.jp-interface ul.jp-controls a.jp-unmute {background: url("../still/images/jplayer.flag.png") -60px -330px no-repeat}
div.jp-interface ul.jp-controls a.jp-unmute:hover {background: url("../still/images/jplayer.flag.png") -85px -330px no-repeat}
div.jp-interface ul.jp-controls a.jp-volume-max {background: url("../still/images/jplayer.flag.png") 0px -350px no-repeat}
div.jp-interface ul.jp-controls a.jp-volume-max:hover {background: url("../still/images/jplayer.flag.png") -25px -350px no-repeat}
.jp-volume-bar {background: url("../still/images/jplayer.flag.png") 0px -300px repeat-x; width: 100px; height: 8px; overflow: hidden; float: right; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; margin-top: 13px}
.jp-volume-bar:hover {cursor:  pointer}
.jp-volume-bar-value {background: url("../still/images/jplayer.flag.png") 0px -308px repeat-x; height: 8px}


/*PROGRESS-BAR*/
div.jp-seeking-bg {background: url("../still/images/jplayer.seeking.gif")}
.jp-progress {width: 500px; height: 22px; overflow: hidden; float: left; margin-left: 25px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; margin-top: 6px; position: relative; background: url("../still/images/jplayer.flag.png") 0px -256px repeat-x}
.jp-seek-bar {background: url("../still/images/jplayer.flag.png") 0px -256px repeat-x; width: 0px; height: 100%; overflow: hidden; cursor: pointer; position: relative}
.jp-play-bar {background: url("../still/images/jplayer.flag.png") 0px -278px repeat-x; width:0px; height: 100%; overflow:hidden}
.jp-current-time, .jp-duration {color: #333; float: right; padding-right: 10px; margin-top: 2px; position: absolute; top: 6px; left: 668px}

/*PLAYLIST*/
.jp-title ul, .jp-playlist ul {list-style-type: none; margin: 0; padding: 0; position: absolute; z-index: 100; background: #f0ecd1; margin-top: 5px; width: 250px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;m-webkit-box-shadow: 0 0 5px #000000; -moz-box-shadow: 0 0 5px #000000; box-shadow: 0 0 5px #000000}
.jp-title li, .jp-playlist li {position: relative; padding: 2px 0; border-top:1px solid #333; overflow: hidden}
.jp-title li {border-bottom:none; border-top: none; padding: 0; text-align: center}
div.jp-type-playlist div.jp-playlist li:first-child {padding-top: 3px}
div.jp-type-playlist div.jp-playlist li:last-child {padding-bottom: 3px; border-bottom: 1px solid #555}
div.jp-type-playlist div.jp-playlist a {color: #555; text-decoration: none; padding: 0 20px; display: block}
div.jp-type-playlist div.jp-playlist li:hover {background: #555}
div.jp-type-playlist div.jp-playlist li:hover a {color: #fff}
div.jp-type-playlist div.jp-playlist li.jp-playlist-current {background-color: #333}
div.jp-type-playlist div.jp-playlist li.jp-playlist-current a {color: #fff}
div.jp-type-playlist div.jp-playlist a.jp-playlist-item-remove {float: right; display: inline; text-align: right; margin-left: 10px; font-weight: bold; color: #8C7A99}
div.jp-type-playlist div.jp-playlist a.jp-playlist-item-remove:hover {color:#E892E9}
div.jp-type-playlist div.jp-playlist span.jp-free-media {display: none}

/*CURRENT-TITLE*/
.jp_current_track_title {position: absolute; color: #fff; padding: 0 10px; margin-top:2px; z-index: 20}