body{margin:0 auto;padding:0;min-width:320px;display:flex;flex-flow:wrap;justify-content:center}
p,li,form,div,option{font:14px sans-serif}
img{border:0;max-width:100%}

.monospace{font-family:monospace}
.red{color:#d71920}
.center{margin:auto;text-align:center}
.right{text-align:right}
.ok   {color:green;border:1px solid green;background-color:#efe;text-align:left;padding:2px;border-radius:4px}
.error{color:#393;border:1px solid red;background-color:#fee;text-align:left;padding:4px;border-radius:4px}
.clearfix:after{clear:both;content:".";display:block;font-size:0;height:0;line-height:0;visibility:hidden;zoom:1}
p.ma,li.ma{line-height:1.8em}
a.ma{margin-right:1ex}

#box_224,#a160600{display:none}
#box_1     { width:100%; padding-bottom:44px; background-color:#fff}
#box_nav   { width:100%; height:44px;             bottom: 0; position: fixed; background-color:#fff }   
div:target {             height: auto !important; top   : 0; position: inherit !important}

h1{margin:0;padding:8px 2px;text-shadow:2px 2px 8px #fcc;text-align:center;background-color:#eee;font: 28px sans-serif}
p.h1_description{width:96%;margin:0 auto;text-align:center;font:italic 12px sans-serif;color:#999}
p.radio_description{margin:0 auto 16px;font:italic 12px sans-serif}

header{background-color:#393;width:100%;height:44px;display:flex;justify-content:space-around;align-items:center;text-align:center}
header a{color:white;text-shadow:1px 1px 1px #000;text-decoration:none}
header div.home  {width:min-content}
header div.home a{font-size:14px}
header form input{width:128px}
header form input[type='submit']{width:inherit;padding:1px 4px}
header div.menu a {font-family:initial;font-size:48px;color:#fff;text-shadow:1px 1px 1px #000}

#filter select{width:100%;margin:8px 0}
#random {margin:16px auto 0;text-align:center}

nav{background-color:#ddd;color:#000;padding:16px 2px;margin-top:32px}
nav ul{list-style-type:none;margin:0;padding:0;background-color:#eee}
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{background-color:#ddd;margin:32px 0 0;padding:8px;border-top:1px dotted #333}


@media screen and (min-width:540px)
{
p.ma,li.ma{line-height:normal}
a.ma{margin-right:0}

#box_1{width:calc(100% - 190px);max-width:600px}
#box_nav{position:inherit;width:190px;height:auto;min-width:190px}

header{width:auto;height:auto;flex-wrap:wrap;justify-content:center;text-align:center;padding:4px 4px 16px}
header a:hover{text-decoration:underline}
header div.home  {margin:16px auto}
header div.home a{font-size:24px}
header div.menu{display:none}

footer{border-top:none;border-left:1px dotted #333}
}


/* Включение правого блока рекламы до 160*600 */
/* 320 +32+160+32+ 190+17 = 751 */
@media screen and (min-width:751px)
{
#box_1{width:calc(100% - 224px - 190px)}
#box_224 {display:block;width:224px}
#a160600 {display:block;width:160px;height:600px;padding:0 32px 32px}

#box_nav > div {position:sticky;top:0}

div.preview {padding:4px;margin-bottom:32px}
div.preview img {float:left;margin-right:4px}
div.preview > div {margin:8px auto;padding:8px;border-radius:8px;background-color:#fff;overflow:hidden}    
div.preview > span.view {background-color:#eee;padding:4px}
div.preview > div > div {float:left;width:124px}    
div.preview > div > a {text-decoration: none}    

div.news{margin:32px auto 0}
div.news span{font-style:normal;font-weight:bold}
div.news p {margin:0}
div.news p br {display:none}
}