/*	CSS-Framework

	Version		: 0.3.1
	Author		: Aleksej Romanovskij (http://css-framework.ru)
	License		: Creative Commons Attribution 3.0 Unported License (http://creativecommons.org/licenses/by/3.0/)
		
/* Utilites
------------------------------ */

* { margin: 0; padding: 0; }

/* border:1px solid red; */

*:focus { outline: none; }
.hidden { display: none; }
.show { display: block!important; }
.no-margin { margin: 0!important; }
.no-padding { padding: 0!important; }
.no-bg { background: none!important; }
.no-border, a img { border: none; }
.container:after, .columns:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.img-repl { text-indent: -9999px; overflow: hidden; display: block; }
.cc { clear: both; }
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.divider { margin: 20px 0 5px; }
ul li { list-style: none;}

/* Text align, float
------------------------------ */
.f-left { float: left; }
.f-right { float: right; }

/* Fonts
------------------------------ */


/* Main styles
------------------------------ */

html { height: 100%; color: #171717; font: 14px/24px Verdana, serif; }
body { height: auto !important; height: 100%; min-height: 100%; }

a           { color: #293235; text-decoration:none; }
a:visited   {  }
a:hover     { color: #cc0221; text-decoration:none; }
a:active    {  }
.w-65 a     { text-decoration: underline; }

/* Layout elements amd content blocks
------------------------------ */
#header     { height: 420px; background: #000 url(../i/bg_header_2020_v.2.jpg) no-repeat center top; }
#navbar     { height: 40px;  background: #171717 url(../i/bg-navbar.png) repeat-x; border-top: 1px solid #293235; border-bottom: 1px solid #293235;}
#content-wrap   { background: #fff url(../i/VO_site_back_white.jpg) no-repeat 0 0; background-attachment:fixed;}
.page       { margin: 0 auto; width: 860px; position: relative; }
#header .page { height: 100%; }
#page       { background: rgba(255,255,255,0.7); }
#content    { float: left; }
#sbar       { float: right; }
.w-65   { width: 65%; }
.w-35   { width: 35%; }
.w-100  { width: 100%; }
.cont-pad           { padding: 20px; }
#sbar .cont-pad     { background: transparent url(/assets/i/vo-man.png) no-repeat 80% bottom; padding-bottom: 110px; } 
#footer   { height: 375px; background: #000 url(../i/bg_footer_2020_v.2.jpg) no-repeat center top; }
#footer p { color: #fff; font-size: 13px; padding-top: 340px; }
#footer a { color: #fff; border-bottom: 1px dotted #fff; }
/* Featured Block
------------------------------ */
#featured-box {  background: #e9e9e9; left: -20px; margin: 0 0 20px; padding: 0 20px 20px; position: relative; width: 261px; }
.page #featured-box img, .page .featured-box p { margin: 0; }
.page #featured-box h2, .page #featured-box p { font: 16px Lucida Sans Unicode,Lucida Grande,sans-serif; margin: 0; padding: 2px 0 5px 6px; }
.page #featured-box p { font-size: 13px; }
#f-desc { margin: -30px 0 0 90px; background: #000; opacity: 0.8;}
#f-desc .rec-label { font-weight: bold !important; }

/* Top Navigation
------------------------------ */
.page .active a { cursor: default; }

#navbar ul    { margin: 0; }
#navbar li    { margin: 0 0 1px 0; float: left; }
#navbar li a  { background: #171717; color: #fff; display: block; margin-right: 2px; padding: 8px 10px; }
#navbar li.active a,
#navbar li a:hover    { background: #293235; }
#navbar li.active a   { cursor: default; color: #fff; }
/*#navbar .last         { float: right; padding: 4px 0; }
#navbar .last a       { padding: 4px 8px; background: red; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }*/

/*#navbar .last a { background: #a90329;
background: -moz-linear-gradient(top,  #a90329 0%, #8f0222 44%, #6d0019 100%); 
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a90329), color-stop(44%,#8f0222), color-stop(100%,#6d0019)); 
background: -webkit-linear-gradient(top,  #a90329 0%,#8f0222 44%,#6d0019 100%); 
background: -o-linear-gradient(top,  #a90329 0%,#8f0222 44%,#6d0019 100%); 
background: -ms-linear-gradient(top,  #a90329 0%,#8f0222 44%,#6d0019 100%); 
background: linear-gradient(to bottom,  #a90329 0%,#8f0222 44%,#6d0019 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#6d0019',GradientType=0 ); 
}*/

.priority-box { background: #e9e9e9; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; padding: 15px; }
.page .priority-box ul { margin: 0; }
.page .priority-box li { border-bottom: 1px solid #fff; }

/* Vertical Menu
------------------------------ */
.nav-links li           { border-bottom: 1px solid #ccc; padding: 4px 0; }
.nav-links li.active    { padding-left: 10px;}
.nav-links li a         { color: #4a4a4a}
.nav-links li a:hover   { color: #cc0221; }
.nav-links li.active a,
.nav-links li.active a:hover  { color: #490007; }
.nav-links li.last      { border-bottom: 0; }

/* Footer Menu
------------------------------ */
#f-navbar ul { border-top: 1px solid #ccc; height: 48px; margin: 20px 0 0; padding: 20px 0 0; }
#f-navbar li          { float: left; margin: 0 10px 0 0; }
#f-navbar li a        { display: block; padding: 2px 10px 4px; color: #4a4a4a; }
#f-navbar li.active   { background: #4a4a4a; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#f-navbar li.active a { color: #fff; }

/* Track List / Player
------------------------------ */
.b-track-list a { padding-left: 20px; background: url(/assets/i/p_listen_dull.png) no-repeat 0 1px; }
.b-track-list li { overflow:hidden; }
.b-track-list a:hover, .b-track-list .played { background: url(/assets/i/p_listen_act.png) no-repeat 0 1px; color: #EE1C25; }
.b-track-list .loading { background: #fff url(/assets/i/ajax-loader.gif) no-repeat 0 3px!important;}
.b-track-list ol li { list-style-position: inside; height: 28px; }
.band-lineup li { list-style: disc inside; }

.player-links li       { border-bottom: 1px solid #ccc; font: 13px/30px Verdana; overflow: hidden; white-space: nowrap; } 
.player-links li.last  { border-bottom: 0; }
/* News Paging
------------------------------ */
.pageList li { float: left; }
.pageList li a { padding: 0 10px; display: block; border: none !important; }
.pageList li a.active { color: #47ACAC; }

.news-block { padding: 0 0 20px; margin: 0 0 20px; /*background: transparent url(/assets/i/vo-logo-grey-s.png) no-repeat center bottom;*/ }


/* Bands Listing
------------------------------ */
.content-list-item              { margin: 0 0 20px; }
.page .content-list-item img    { float: left; margin: 5px 20px 5px 0; border: 1px solid #4a4a4a; }
#content img                    { border: 1px solid #4a4a4a; }

/* Styles for text
------------------------------ */
h1, h2, h3, h4 { font: bold 32px/20px Trebuchet MSv, sans-serif; padding: 0 0 15px;}
h1 { padding: 5px 0 20px; line-height: 36px; color: #490007; }
.body-1 h1 { padding-top: 0; }
h2 { font-size: 24px; line-height: 32px; color: #293235; }
h3 { color: #6b020a; font-size: 18px; clear: left; }
h4 { font-size: 18px; }
h5 { margin: 20px 0 5px; font-size: 11px; }

#header h2      { background: url("../i/VO_site_title.png") no-repeat; height: 93px; width: 330px; position: absolute; left: 0; bottom: 40px; text-indent: -2000em; }
#header .sub-header    { position: absolute; left: 50px; bottom: 50px; font: 14px 'Trebuchet MS', Helvetica, sans-serif; color: #6B020A; }

#lang-switch { background: #ccc; display: block; padding: 2px 6px; position: absolute; right: 5px; top: 6px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lang-switch a { }
#lang-switch span { color: #999; font-weight: bold; }

#sbar h2, #sbar h3, #sbar h4 { padding: 0 0 10px; }

.page p, .page ul, .page ol, .page img { margin: 0 0 15px 0; }
#content p { text-align: justify; }
#page img { padding: 2px; border: 1px solid #ccc; }
#page .sbar p { margin: 0 0 10px; }
#page .galleriffic img { margin: 0; padding: 0; border: none; }
.newsFormat .date { font: 12px 'Trebuchet MS', Helvetica, sans-serif; padding: 2px 0 0; color: #4A4A4A; float: right; } 
#sbar .note { font: 12px 'Trebuchet MS', Helvetica, sans-serif; padding: 2px 0 0; color: #4A4A4A; } 

.f-cd { min-height:140px; }
#page .f-cd p, #page .f-cd ul li, #popup .f-cd ul li { margin:0; font: 12px/20px Arial, Helvetica, sans-serif; } 
.b-list-item { border-bottom: 4px double #ccccc9; }
.sbar .b-list-item { border-bottom: 4px double #59544d; padding: 0 10px;}
#page .sbar li p { padding: 0; margin: 0;}
.b-list-item dl { float: left; margin: 0 40px 20px 0; width: 135px; }
#page .b-list-item dl img { margin:0; border: 1px solid #ccccc9; padding:5px; }
#page .b-list-item dl dt a { font-size:12px; }
.small { font: 12px/15px Arial, Helvetica, sans-serif; }

#content iframe { margin: 0 0 20px; border: 1px solid #ccc; }

address { font-style: normal; display: block; margin: 0 0 10px 10px; }
dt { margin: 0 0 10px; }
dt a { }
dd { margin: 0 0 20px; }

.caption-text { font-size: 12px; }
/* Social icons
------------------------------ */
.soc        { padding: 0 0 0 25px; }
.soc li     { float: left; padding: 0 10px 0 0; }
.soc li a   { display: block; width: 32px; height: 32px; background: url(../i/soc.png) 0 0 no-repeat; }
.soc li a.twitter   { background-position: -32px 0; }
.soc li a.email     { background-position: -64px 0; }
/* Press Kit
------------------------------ */
#press-kit #page            { width: 600px; position: relative; }
#press-kit h1 { text-indent: 0; padding: 50px 0 30px; }
#press-kit .rec-lineup a    { border: none; color: #000; }
#press-kit-footer           { border-top: 1px solid #E1E3E2; padding-top: 20px; margin-top: 30px; }
#page #pdf-links            { display: none; position: absolute; left: 20px; top: 15px; }
body:hover #page #pdf-links { display: block; }
#pdf-links a, #pdf-links { font-size: 12px; }
#pdf-links a { text-decoration: underline; }
#pdf-links a:hover { color: #6f660b; text-decoration: none; }

.pdf { height: 16px; width: 16px; display: inline-block; background: url(/assets/i/pdf.gif) no-repeat; margin: 0 5px 0 0; }
.img-caption, .cd-caption { display: block; margin: -15px 0 20px; font: 12px/18px Verdana,serif; color: #555; }
.cd-caption { margin: 0 !important; width: 275px; overflow: hidden; }

/* Discography Listing
------------------------------ */
.b-cd-list { overflow: hidden; margin: 0 0 25px; }
.b-cd-list dl {  float: left;  margin: 5px;  width: 216px; height: 260px; overflow: hidden; }
#page .b-cd-list img { margin: 0; padding: 5px; }
#page .b-cd-list a { border-bottom: none; }
.b-cd-list dt, .b-cd-list dd { margin: 0;}

/*	Tables
------------------------------ */

table { border-collapse: collapse; width: 100%; }
table th, table td { border: 1px solid #ccc; padding: 2px 3px; vertical-align: top; }
table th { background: #f4f4f4; }
table td {  }

/* Images
------------------------------ */

#page .cont-img         { padding: 2px; border: 1px solid #B4B4B4; margin: 15px 15px 0; }
#page .w-profile img    { float: right; margin: 0 0 0 20px; }
.b-img img { padding:2px; border: 1px solid #ccccc9;}
.content .hw-item img { padding: 0!important; border: 6px solid #002446!important; margin-top: .4em; }

img.f-left { margin-right: 20px!important; }
img.f-right { margin-left: 20px!important; }
.cd-thumb { width: 100px; height: 100px; border: 1px solid #ccc; padding: 2px; }

.b-gallery { overflow: hidden; }
.b-photo { position:relative; /*float: left; margin: 0 20px 20px 0; width: 187px; height: 187px; padding-bottom:30px !important; border:1px solid red;*/ }
#c .b-photo dt { text-align: center; font-weight: normal; font-size: 11px; line-height: 14px; }
.b-gallery .b-photo dt { position: absolute; left: 330px; top:30px; font-weight:normal; }
.b-gallery .b-photo dd { padding-left:3em; } 
.b-photo dt a { text-decoration: none; color: #000; }
.b-photo dd img { margin: 0; border: 1px solid #ccc;}

.f-right img { margin-left: 10px;}
#fcb { position:absolute; display:block; width:25px; height:25px; background: url(../i/facebook.png) left top no-repeat; top: 13px; right: 15px; }
#fcb:hover { background: url(../i/facebook.png) left -25px no-repeat; }

.article_caption { margin: 0 0 20px; font-size: 12px; }
.article_img     { margin: 20px 0; width: 100%; }

#copy   { text-align: center; padding: 40px 0 0; }
#copy p { font-size: 12px; }
#copy a { color: #afa352; }

/* Contact Form test
------------------------------ */
form label { display: inline-block; vertical-align: top; width: 20%; }
.f-inputs { /*padding: 0 0 10%;*/ }

input { vertical-align: middle; }
.i-text { width: 350px; padding: 5px; font: 1em sans-serif; }
.f-actions input { border: none; }
.f-actions .button { cursor: pointer; background: #555; color: #fff; font-weight: bold; padding: 5px 15px; }

.error { color: #EE1C25; padding-bottom: 1em; margin-bottom:1em;}


/* Gallery block
---------------------------------------- */
.thumb  { float: left; }
.desc   { float: left; padding: 0 0 0 20px; width: 70%; }
.gal-item-active        { float: left; margin: 5px; }
.gal-item-active img    { margin-right: 10px !important; padding: 1px !important; }


/* RWD SCREEN SIZE STYLES
---------------------------------*/

/* ----------- 860 ----------- */
@media only screen and (max-width : 860px), (max-device-width: 860px) {
.page { width: 100%; overflow: hidden; }
}
/* ----------- 768 ----------- */
@media only screen and (max-width : 768px), (max-device-width: 768px) {
#header     { height: 270px; }
#header h2  { left: 15px; bottom: 0; }
#header .sub-header { bottom: 20px; }
#footer     { background-image: none; height: auto; padding: 5px 10px; }
#footer p   { line-height: 20px; padding-top:10px; }
}


/* ----------- 720 ----------- */
@media only screen and (max-width : 719px), (max-device-width: 719px) {
#header         { background-image: none; height: 70px; }
#header h2  { position: relative; top: 10px; height: 38px; background-size: contain;}
#content-wrap   { background-image: none; }
#header .sub-header { display: none; }
}

/* ----------- 640 ----------- */
@media only screen and (max-width : 640px), (max-device-width : 640px) {
#content, #sbar { float: none; width: 100%; }
}

/* ----------- 600 ----------- */
@media only screen and (max-width : 600px), (max-device-width : 600px) {
#navbar         { height: auto; }
#navbar ul      { width: 600px; min-width: 600px; }
#navbar li      { float: none;  border-bottom: 1px solid #293235;}
#f-navbar ul    { height: auto; }
#f-navbar li    { float: none; margin: 0 10px; }
#f-navbar li.active { background: #e9e9e9; }
/*#lang-switch { right: 5px; top: 6px; }*/
}









/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-width : 600px) 
and (max-width : 768px) {
/* Styles */
}

/* iPads (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
/* Styles */
}

/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
/* Styles */
}

/* iPads (portrait) ----------- */
@media only screen 
and (min-width : 768px) 
and (max-width : 1024px) 
and (orientation : portrait) {
/* Styles */
}

/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
/* Styles */
}
