.fs11{font-size:11px}
.fs12{font-size:12px}
.idate{font:10px sans-serif;color:#777;margin:0}

p.more{margin: 0; text-align:right;font-size:11px}

div.parent{padding:1px}
input.comment{width:50%;min-width:240px}
div.parent p{background-color:#eee;margin:1ex auto 1px;padding:8px;border-radius:16px}
div.parent > div{padding-left:1em;background-color:#fff}
div.status{color:red}

input.s_input{width:126px;background-color:#dfc}
input.s_button{width:18px;padding:1px 4px;color:green}

p.radio_description{margin:0 auto; padding:0 2px;font:italic 12px sans-serif;text-align:center}

div.ga1{width:100%;max-width:1200px;height:100px;margin:16px auto 32px;overflow:hidden}
div.ga2{width:300px;height:250px;margin:36px 0}
div.ga3{width:100%;max-width:1200px;height:100px;margin:32px auto;overflow:hidden}

ins.ga1,ins.ga3{width:100%;height:100px;margin:0}

#cols_123{width:100%; margin:0 auto; font:14px sans-serif}
#col_1{width:300px;margin:  0   auto  }
#col_2{width:300px;margin: 30px auto 0}
#col_3{width:300px;margin: 30px auto 0}

#radio_player_box{width:300px;min-height:285px;text-align:center;background-color:lightgreen;background:linear-gradient(to bottom,#6c6,#efe 30%,#3c3);padding:4px 0;border-radius:16px}
#online_radio_player{display:flex;justify-content:space-evenly;align-items:center;text-align:center;width:300px;margin-top: 16px;}
#stop_play{font-size:40px}
#timeupdate{font-size:26px}
#mute{font-size:40px}
#now_playing{text-align:left;margin:0 4px}
#play_list{margin:0}
#play_list li{font-size:12px}
#rp1{font-size:13px}


#radio_favorite{width:292px;padding:4px;min-height:285px;text-align:center;background-color:#ffc;overflow:auto}
#radio_favorite div{font-size:12px}
div.rf_1{float:left;width: 97px;margin:0}
div.rf_2{float:left;width:107px;margin:0}
div.rf_3{float:left;width: 88px;margin:0}
div.rf_3 img{margin:4px 0}
img.favorite, #guzei_online_radio_toplist img{margin:4px 0}

#like_buttons{width:300px;height:300px;margin-top:30px;background-color:#eee;background:linear-gradient(to bottom,#ddd,#fff 30%,#eee)}

#radio_info{width:292px;padding:0 4px;min-height:285px;overflow:auto;background-color:blanchedalmond}
#radio_info h3{font:bold 18px sans-serif;text-align:center;margin:0}

#radio_news{width:300px;height:283px;padding:2px 0 0;overflow:auto;margin-top:30px;background-color:#eef}
#radio_news h3{font:bold 18px sans-serif;text-align:center;margin:0}
#radio_news img{border-radius:4px;max-width:128px}
div.news1{margin: 32px 0 0}
div.news11{float:left; w1idth: 130px}
div.news12{float:left; width: 146px; margin: 0 0 0 4px;}
p.news_date{ margin: 0; font: italic 11px sans-serif}
p.news_subject{ margin: 4px 0 0; font: bold 13px sans-serif}
p.news{margin: 4px 0 0; font-size: 12px}

div.img_stat{float:left;margin:16px 0 0 32px;max-width:360px}


div.lang_i{display: flex; flex-flow: row wrap; justify-content: center;max-width:600px;padding:4px;font-family: monospace; line-height: 1.6em}
div.lang_i div{margin:4px}

nav{max-width: 500px;margin: 32px auto 0;padding:16px 2px;background-color:#1bb71b;color:#fff}
nav form{text-align:center}
nav ul{margin: 16px auto 8px; padding: 0; background-color: #eee; list-style-type: none}
nav ul li {padding: 4px 2px; border-bottom:1px solid #ccc}
nav ul li:hover {background-color: #ddd}
nav ul li a{text-decoration:none}

footer{margin:32px 0 0;padding:8px;border-top:1px dotted #333;background-color:#ddd}

#form_comment{display:none}



@media screen and (min-width:327px)
{
div.ga1{width:98%}
div.ga2{margin-top:calc(100vh - 530px)}
div.ga3{width:98%;margin:32px 1%}
}

@media screen and (min-width:480px)
{
div.ga3{width:calc(100% - 34px);margin:16px auto 32px 4px}
div.ga2{margin-top:30px}
}

@media screen and (min-width:768px)
{
#cols_123{width:630px}
#col_1{float:left}
#col_2{float:left; margin: 0 0 0 30px}
#col_3{float:left; width:630px}
#radio_info		 {float:left}
#radio_news      {float:left; margin: 0 0 0 30px}
div.ga3{float:left}
div.parent > div {padding-left:2em}
}

@media screen and (min-width:1024px)
{
#cols_123{float:left;margin-left:calc(50% - 410px)}
div.ga3{width:160px;height:600px;margin:0 0 0 30px}
ins.ga3{width:160px;height:600px}
}

@media screen and (min-width:1366px)
{
#cols_123{width:960px; margin-left:calc((100% - 960px - 160px - 30px)/2)}
#col_2{margin-left:30px}
#col_3{float:left; width:300px; margin: 0 0 0 30px}
#radio_info		 {float:none}
#radio_news      {float:none; margin: 30px 0 0 0}
nav div.il p.lang_i{line-height:1.2em}
}
