
#front{
	background: #000;
    display: none;
    height: 100%;
    left: 0;
    opacity: 0.8;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 10000;
    overflow: auto;
    background-image: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 100, color-stop(0%, rgba(127,127,127,0.8)), color-stop(5%, rgba(127,127,127,0.8)), color-stop(100%, rgba(0,0,0,0.8)));
    background-image: -webkit-radial-gradient(rgba(127,127,127,0.8),rgba(127,127,127,0.8) 5%,rgba(0,0,0,0.8));
    background-image: -moz-radial-gradient(rgba(127,127,127,0.8),rgba(127,127,127,0.8) 5%,rgba(0,0,0,0.8));
    background-image: -o-radial-gradient(rgba(127,127,127,0.8),rgba(127,127,127,0.8) 5%,rgba(0,0,0,0.8));
    background-image: -ms-radial-gradient(rgba(127,127,127,0.8),rgba(127,127,127,0.8) 5%,rgba(0,0,0,0.8));
    background-image: radial-gradient(rgba(127,127,127,0.8),rgba(127,127,127,0.8) 5%,rgba(0,0,0,0.8));
}
.login-popup {
    background: #f9f9f9;
    display: none;
    float: left;
    left: 50%;
    top: 50%;
    position: fixed;
    text-align: left;
    width: 700px;
    z-index: 10001;
	margin-top: -200px; margin-left: -362px;
	opacity:1;
}
.close-modal {
    font-size: 35px;
    position: absolute;
    right: -14px;
    top: -14px;
}

@media (max-width: 701px) {
	.login-popup {
		width:100%;
		margin-top: 0; margin-left: 0;
		left:0;
		top:0;
		position: absolute;
	}
}
.login-popup-close {
    background-color: #FB825C;
    border-radius: 0.75em 0.75em 0.75em 0.75em;
    display: inline-block;
    height: 0.75em;
    position: relative;
    width: 0.75em;
    behavior: url(http://webkind.ru/css/img/PIE.htc);
}
.symbol-close {
    color: #fff;
    font-size: 40%;
    font-family: 'Tahoma';
    font-weight: bold;
    left: 35%;
    top: 8%;
    position: absolute;
}
.login-popup-main-content {
    margin-top: 25px;
    overflow: hidden;
    padding: 0px 25px 0px 25px;
    position: relative;
}
.login-login-container {
    float: left;
    width: 45%;
}
.login-popup button {
    display: block;
    width: 100%;
    margin-bottom: 25px;
    vertical-align: top;
	border: none;
    border-radius: 3px;
    text-shadow: 1px 1px 0px #666;
    color: #fff;
    font-size: 14px;
    padding: 15px;
}
.login-popup .vk {
    background-color: #36638e;
    border: 1px solid #2e4470;
    box-shadow: inset 0px 1px 0px 0px #5c86bd;
}
.login-popup .ok {
    background-color: #ef7c00;
    border: 1px solid #d95900;
    box-shadow: inset 0px 1px 0px 0px #eeb200;
}
.login-popup .fb {
    background-color: #3B5998;
    border: 1px solid #303b7d;
    box-shadow: inset 0px 1px 0px 0px #6177c3;
}
.login-popup img.logo.vk {
    background-image: url(http://webkind.ru/css/img/css-sprite.png);
    background-position: -92px -0px;
    background-repeat: no-repeat;
}
.login-popup button img.logo {
    background: none;
    border: none;
    box-shadow: none;
    width: 14px;
    height: 14px;
    margin-right: 10px;
}
.login-popup img.logo.ok {
    background-image: url(http://webkind.ru/css/img/css-sprite.png);
    background-position: -92px -28px;
    background-repeat: no-repeat;
}
.login-popup img.logo.fb {
    background-image: url(http://webkind.ru/css/img/css-sprite.png);
    background-position: -92px -14px;
    background-repeat: no-repeat;
}
.login-or-wrapper {
    color: #C1C1C1;
    font-size: 12px;
    font-style: italic;
    height: 100%;
    border-bottom: medium none;
    bottom: 0;
    left: 0;
    pointer-events: none;
    text-align: center;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 0;
}
.login-or-bar {
    border-right-color: #C1C1C1;
    border-right-style: solid;
    border-right-width: 1px;
    display: block;
    height: 48%;
    margin: 0 auto;
    width: 0;
}
.login-join-container {
    float: right;
    width: 45%;
}
.login-popup label {
    color: #5B5B5B;
    display: block;
    font-size: 15px;
    margin-bottom: 12px;
}
.login-popup .join {
    background-color: #999;
    border: 1px solid #888;
    box-shadow: inset 0px 1px 0px 0px #bbb;
}
.login-popup input {
    width: 93%;
}
.login-popup input {
    background-color: #fff;
    border: 1px solid #e5e4e1;
    font-size: 15px;
    outline: none;
    padding: 5px 10px 5px 10px;
}
.login-popup #login-regbyemail-captcha {
    width: 93%;
}
.login-popup #captchaimg{
	border: 1px solid #e5e4e1;
	border-width:1px 1px 0px 1px;
}
.login-login-container p {
    font-size: 18px;
    font-weight: normal;
    margin: 0px 0px 15px 0px;
    padding: 0px;
    color: #5B5B5B;
    font-family: Open Sans, Tahoma, sans-serif;
}
.login-popup p {
    color: #5B5B5B;
    font-size: 16px;
    font-family: 'Myriad Pro', 'Segoe UI', Calibri, Tahoma, sans-serif;
}
.c {
    clear: both;
}
.login-popup-legal {
    color: #848484;
    text-align: center;
    font-size: 13px;
    margin: 25px;
}
login-popup-main-content a {
    font-size: 14px;
    text-decoration: none;
	color: #0083b7;
    -webkit-transition: color 0.2s;
    -moz-transition: color 0.2s;
    -o-transition: color 0.2s;
    transition: color 0.2s;
}
.login-popup .loginbyemail {
    background-color: #f94c16;
}
.a_login{
	color:#3a9fa9;
}
.a_registration, .rose{
	color:#d12052;
}
#login_button{
	position: relative;
	float:right;
	padding:7px 10px;
	border: 1px solid #d1d1d1;
	border-width:0px 0px 1px 1px;
	font-size:14px;
	z-index:1000;
}
.login-popup .err {
    color: #c93214;
	font-size:12px;
}
.login-popup-warning-box {
    background-color: #fcded0;
    color: #c93214;
    text-align: left;
    padding: 25px;
    margin-bottom: 25px;
    display: none;
}
.reg-form label {
    color: #5B5B5B;
    display: block;
    font-size: 15px;
    margin-bottom: 12px;
}
.reg-form{
	padding:7px;
	text-align:left;
}

.reg-form #captchaimg{
	border: 1px solid #e5e4e1;
	border-width:1px 1px 0px 1px;
}

.reg-form input {
    background-color: #fff;
    border: 1px solid #e5e4e1;
    font-size: 15px;
    outline: none;
    padding: 5px 10px 5px 10px;
	width:200px;
}
.reg-form .join{
	width:200px;
    vertical-align: top;
	border: none;
    border-radius: 3px;
    text-shadow: 1px 1px 0px #666;
    color: #fff;
    font-size: 14px;
    padding: 15px;
	margin:0px;
	line-height:normal;
	display: inline-block;
	text-align:center;
	cursor:pointer;
}
.supbut, #comm_box a.supbut{
    vertical-align: top;
	border: none;
    border-radius: 0px 0px 4px 4px;
    text-shadow: 1px 1px 0px #666;
    color: #fff;
    font-size: 14px;
    padding: 8px 15px;
	margin:0px;
	line-height:normal;
	display: inline-block;
	text-align:center;
	cursor:pointer;
	margin-top:-4px;
}
.supbut, #comm_box a.supbut{
    background-color: #999;
    border: 1px solid #888;
    box-shadow: inset 0px 1px 0px 0px #bbb;
}
.reg-form .join {
    background-color: #999;
    border: 1px solid #888;
    box-shadow: inset 0px 1px 0px 0px #bbb;
}
.reg-form .title {
    font-size: 16px;
    color: #d12052;
}
.login-popup-warning {
    background-color: #fcded0;
    color: #c93214;
    text-align: left;
}
.com_q{
	color:#959595;
}
.com_t{
	color:#fff;
	background: #4BBEC5;
	display:block;
	padding:6px 8px;
	font-size:16px;
}
.com_t .words{
	color:#d12052;
}
.com_form{
	position:relative;
	width:100%;
}
.com_form form{
	display:block;
	margin: 0px 0px 0px 0px;
}
.com_form textarea {
    margin: 0px;
    padding: 6px;
    width: 100%;
    resize: vertical;
    min-height: 84px;
    color: #252525;
    font-size: 14px;
    border: 1px solid #999;
	border-width:0px 0px 1px 1px;
	font-family: inherit;
}
.onec{
	margin:0px;
	color:#000;
    border-bottom: 1px dashed #959595;
    border-left: 1px solid #999;		
	padding:6px;
	background:#fff;
}
.onec span{
	color:#959595;
	font-size:12px;
}
.onec:nth-child(2n) {
    background: #f0f0f0;
}
#crumbs {
    position: relative;
    padding: 7px 10px;
    border: 1px solid #d1d1d1;
    border-width: 0px 0px 1px 0px;
    font-size: 14px;
    z-index: 100;
}
#crumbs a,#crumbs span{
	margin: 0 4px;
}
.one pre{
	display:block;
	clear:both;
	margin:0px;
	color:#828282;
}
div#interesting{
    background: #FDE4E9;
    padding: 10px;
	border-bottom:1px dashed #7f9db9;
	overflow:hidden;
	position: relative;
	text-align: justify;
}
#fuller{
	position:absolute;
	bottom:0px;
	left:0px;
	width:100%;
	color: #ffffff;
	background-image: -webkit-linear-gradient(top, rgba(253, 228, 233, 0.85), rgba(249, 248, 248, 1));
	background-image: -o-linear-gradient(top, rgba(253, 228, 233, 0.85), rgba(249, 248, 248, 1));
	background-image: linear-gradient(to bottom, rgba(253, 228, 233, 0.85),  rgba(249, 248, 248, 1));
	background-repeat: repeat-x;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00000000", endColorstr="#f2000000", GradientType=0);
	cursor:pointer;
	color: #3a9fa9;
	text-decoration:underline;
	padding:6px;
}
div#interesting .in_top{
	display:block;
	color:#d12052;
	text-transform: uppercase;
	font-size:12px;
}
div#interesting>p{
	margin:0px;
}
div#left_col{
	float:left;
	width:200px;
}
div#left_col ol{
	margin-left:-9px;
}
div#right_col{
	overflow: hidden;
	margin-left: 200px;
}
ol#song_list{
	padding:0px;
	margin:0px;
	background:#fff;
	margin-left:0px;
}
ol#song_list li{
	list-style-type:none;
	clear:both;
	height:30px;
}
ol#song_list li:nth-child(2n){
	background: #f0f0f0;
}
div#capt{
	background:#f0f0f0;
	height:30px;
	clear:both;
}
#other_songs{
	background:#D2D1D1;
	color:#fff;
	margin-left:-9px;
	text-align:center;
	padding: 6px 0px;
}
#other_songs .words{
	color:#d12052;
}
.c_name,.c_transl,.c_video,.c_rate,.c_num,.c_text{
	display:block;
	padding:6px 10px;
	border:1px solid #fff;
}
ol#song_list li:nth-child(2n+1) span{
	border-color: #f0f0f0;
}
.c_num{
	padding:6px 0px;
	width:20px;
	float:left;
	text-align:center;
	border-width:0px 1px 0px 0px;
}
.c_name{
	float:left;
	border:0px;
	border-width:0px;
}
.c_text{
	clear:both;
	padding:0px 6px 0px 6px;
	margin:0;
	border-width:0px;
	margin-left:20px;
	border-width:0px 0px 0px 1px;
}
.c_transl{
	float:right;
	border-width:0px 1px 0px 1px;
	width:55px;
	text-align:center;
}
.c_video{
	float:right;
	border-width:0px 1px 0px 0px;
	width:55px;
	text-align:center;
}
.c_rate{
	float:right;
	width:60px;
	text-align:center;
	border-width:0px 0px 0px 0px;
}
ol#song_list li span.c_rate{
	float:right;
	width:60px;
	text-align:left;
}
span.t_left{
	width:60px;
	text-align:right;
	margin-right:6px;
	margin-bottom:6px;
	display:inline-block;
}
span.t_left_l{
	margin-bottom:6px;
	display:inline-block;
	margin-right:6px;
}
span.top_ol{
	display:block;
	clear:both;
}
#tabs_title{
	list-style: none; margin: 20px 0px 0px 0px; padding: 0px 0px 2px 0px;
	clear:both;
	border-bottom:1px solid #4BBEC5;
	display:block;
	position:relative;
}
#tabs_title li{
	display: inline;
	padding:6px 10px 2px 10px;
	margin-left:10px;
	background:#cccccc;
    border-radius: 4px 4px 0px 0px; 
	color:#fff;
	font-size:14px;
	cursor:pointer;
}
#tabs_title li.activ{
	background:#4BBEC5;
	cursor:default;
}
#tabs{
	background:#fff;
	padding:10px;
}
#tabs .tab_none{
	display:none;
}
#video_pesni{
	background:#000;
	text-align:center;
}
#tab_otkritka_pesni a{
	color:#fff;
	text-decoration:none;
}
.year{
	color:#fff;
	padding:10px 8px;
	background:#4BBEC5;
	position:relative;
}
.year_in{
	position:relative;
	clear:both;
	background: #D2D1D1;
}
.year_list{
	list-style: none; margin: 0px; padding: 0px;
	clear:both;
	background: #fff;
}
.year_list li{
	float:left;
	line-height:43px;
	height:45px;
	border:1px solid #D2D1D1;
	border-width:0px;
	background: #fff;
	width:50%;
}
.year_list li>a{
	padding:0px 6px;
	color:#000;
	text-decoration:none;
	font-size:16px;
}
.year_list li:nth-child(4n+2),.year_list li:nth-child(4n+3){
	background: #D2D1D1;
}
.year_list li:nth-child(4n+2) a,.year_list li:nth-child(4n+3) a{
	color:#fff;
}
#list_album{
	background:#fff;
}
#wikiart{
	padding:0px 6px;
	text-align: justify;
}
#comm_box{
	clear:both;
	padding:0px 0px 9px 0px;
}
pre b{
    color: #3a9fa9;
}
#stats{
	clear:both;
	background: #FDE4E9;
    padding: 10px;
    border: 1px dashed #7f9db9;
	border-width:1px 0px 1px 0px;
    overflow: hidden;
}
.stat{
	float:left;
	width:20%;
	text-align:center;
}
.stats_title{
	display:block;
	text-align:center;
	clear:both;
	font-size:18px;
	color: #d12052;
    text-transform: uppercase;
	margin-bottom:10px;
}
.stat b{
	font-size:20px;
}
@media (max-width: 701px) {
	html,body{min-width: 370px;}
	div#first{
		margin: 0px;
		padding:0px;
		min-width:370px;
	}
	div#left_col{
		width:100%;
		text-align:center;
	}
	div#right_col{
		clear:both;
		margin-left:0px;
	}
	.img_cover{ 
		width: 50%;
		height:auto;
		min-width:200px;
	}
	.c_name{
		width:100%;
	}
	div#tags a {
		line-height:2.3em;
		margin:5px;
	}
	div#p-right a{
		line-height:2.1em;
	}
}
/*
   ===============================
   ========= GREY STYLE ==========
   =============================== 
*/

.grey:first-child { /* styling for the left part */
 padding: 7px;
 float: left;
 width: 32px;
 height: 32px;
/* border radius */
 -webkit-border-radius: 4px 0 0 4px;  
 -moz-border-radius: 4px 0 0 4px;  
 border-radius: 4px 0 0 4px;
/* backgorund */
 background: -webkit-gradient(linear, left top, left bottom, from(#fbfbfb), to(#c6c6c6));
 background: -moz-linear-gradient(#fbfbfb, #c6c6c6);
 background-color: #ccc;
/* shadows and highlights */
 -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3),
0 1px 1px rgba(255, 255, 255, 0.8) inset;  
 -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3),
0 1px 1px rgba(255, 255, 255, 0.8) inset;  
 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3),
0 1px 1px rgba(255, 255, 255, 0.8) inset;
/* border */
 border: 1px solid #bbb;
}

.dropbutton:hover .grey:first-child {
 background: -webkit-gradient(linear, left top, left bottom, from(#fdfdfd), to(#d5d5d5));
 background: -moz-linear-gradient(#fdfdfd, #d5d5d5);
 background-color: #ddd;
}

.dropbutton:active .grey:first-child {
 background: -webkit-gradient(linear, left top, left bottom, from(#d5d5d5), to(#fafafa));
 background: -moz-linear-gradient(#d5d5d5, #fafafa);
 background-color: #fbfbfb;
}

.grey  {  /* styling for the right part */
 height: 46px;
 padding: 0px 7px;
 max-width:400px;
 overflow:hidden;
 float: left;
 text-align: center;
/* border radius */
 -webkit-border-radius: 0 4px 4px 0;  
 -moz-border-radius: 0 4px 4px 0;  
 border-radius: 0 4px 4px 0;
/* backgorund */
 background: -webkit-gradient(linear, left top, left bottom, from(#fbfbfb), to(#c6c6c6));
 background: -moz-linear-gradient(#fbfbfb, #c6c6c6);
 background-color: #ccc;
/* shadows and highlights */
 -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3),
0 1px 1px rgba(255, 255, 255, 0.8) inset;  
 -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3),
0 1px 1px rgba(255, 255, 255, 0.8) inset;  
 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3),
0 1px 1px rgba(255, 255, 255, 0.8) inset;
/* border */
 border: 1px solid #bbb;
 border-left: 0;
 z-index:3;
}

.dropbutton {
 height: 48px;
 width: 100%;
 font: bold 16px/48px arial;
 margin: 20px 0px;
 position: relative;
 z-index: 0;
}
.dropbutton:hover .grey  {
 background: -webkit-gradient(linear, left top, left bottom, from(#fdfdfd), to(#d5d5d5));
 background: -moz-linear-gradient(#fdfdfd, #d5d5d5);
 background-color: #ddd;
}
.dropbutton:active .grey  {
 background: -webkit-gradient(linear, left top, left bottom, from(#d5d5d5), to(#fafafa));
 background: -moz-linear-gradient(#d5d5d5, #fafafa);
 background-color: #fbfbfb;
}
.grey  a { 
 color: #333;
 font: bold 16px/32px arial, helvetica, sans-serif;
 text-decoration: none;
 text-shadow: 0 1px 0 #fff;
}
/*
   ====================================
   ====== LIGHT STYLE (DROPDOWN) ======
   ====================================
*/

.light {
 top: 48px;
 width: 200px;
 height: 15px;
 padding: 3px 6px;
 margin-left: 48px;
 position: absolute;
 clear: both;
 -webkit-transition: top .6s linear;
/* text */
 color: #333;
 font: bold 12px/15px arial, helvetica, sans-serif;
 text-decoration: none;
 text-shadow: 0 1px 0 #fff;
/* border radius */
 -webkit-border-radius: 0 0 4px 4px;  
 -moz-border-radius:0 0 4px 4px;  
 border-radius: 0 0 4px 4px;
/* backgorund */
 background: -webkit-gradient(linear, left top, left bottom, from(#bababa), color-stop(.1, #e4e4e4), to(#f2f2f2));
 background: -moz-linear-gradient(#bababa, #e4e4e4 10%, #f2f2f2);
 background-color: #ccc;
/* shadows and highlights */
 -webkit-box-shadow: 0 1px -1px rgba(255, 255, 255, 1) inset;  
 -moz-box-shadow: 0 -1px 1px rgba(255, 255, 255, 1) inset;  
 box-shadow: 0 1px -1px rgba(255, 255, 255, 0.8) inset;
/* border */
 border: 1px solid #bbb;
 border-top: 0;
 text-align:center;
}


.light span {
color: #555;
font-weight: normal;
}