html,
body {
  /*        background-color: #eee;*/
  color: #333;
  font-family: "Trebuchet MS", Trebuchet, tahoma, serif;
}

body {
  margin: 0;
  padding: 8px;
  margin-bottom: auto;
  /*background:#eee url('tile.jpg') 100% 0 repeat-y;*/
  /* мрамор был спизжен и отсюда тоже:        background-image: url(/marble/8.jpg);
		background-position: center;
		background-attachment: fixed;
		background-size: cover;*/
}

h1 {
  display: block;
  color: #996793;
  text-align: center;
  font-size: 24px;
  margin: 8px 3px;
}

#infoban {
  display: flex;
  align-items: center;
  margin-top: 30px;
}

#infoban-center {
  width: 750px;
  text-align: center;
}

#infoban-left,
#infoban-right {
  flex: 1;
}

#infoban img {
  display: block;
  margin: 0px auto;
  border: 0px;
  /*box-shadow: 0 0 25px silver;*/
}

#advert {
  display: block;
  margin: 0px auto;
  width: 700px;
}

#advert img {
  margin: 10px;
}

#clock {
  float: right;
}

#slides {
  background: black;
  height: 500px;
}

#slides img {
  display: block;
  margin: auto 0px;
  width: 100%;
}

#djs {
  display: block;
  overflow: hidden;
  padding: 0px 100px;
  text-align: center;
}

#djs b {
  margin: 2px;
  padding: 5px;
}

#slides,
#shed,
.ballon {
  /*        border: 1px solid #BBB;*/
  background-color: rgba(255, 255, 255, 0.3);
  border-radius: 10px;
  margin: 20px auto;
  width: 90%;
  overflow: hidden;
  padding: 10px 10px 30px 10px;
}

#shed {
  padding: 10px;
}

.feeds {
  overflow: hidden;
  padding: 0px;
  /*background: url(/imgs/NathanFielder-PortholeSimulation.webp) bottom 50px right 10% no-repeat transparent;*/
}

.newsright {
  display: block;
}

.newsbottom {
  display: block;
}

#podcasts,
#radiochat {
  height: 400px;
  overflow-y: scroll;
  overflow-x: hidden;
  /*    border:1px solid #BBB;*/
  /*    background-color:#fcfcfc;*/
  background-color: rgba(255, 255, 255, 0.3);
  border-radius: 10px;
  font-size: 10px;
  font-family: sans-serif;
  text-align: left;
  margin-top: 3px;
}

#podcasts tr:nth-child(even) {
  background-color: #ffffff;
}
#podcasts tr:nth-child(odd) {
  background-color: #f7f7f7;
}

#kookareque,
#newsfeed,
#vnuchaev {
  /*        border: 1px solid #BBB;*/
  background-color: rgba(255, 255, 255, 0.3);
  /*        background-color: #fcfcfc;*/
  border-radius: 10px;
  overflow: hidden;
  padding: 0px 0px 30px 0px;
}

#newsfeed {
  padding: 0px;
  font-size: 10px;
  font-family: sans-serif;
  text-align: center;
  margin-top: 3px;
}

#newsfeed h1 {
  font-size: 20px;
  margin: 10px 1px;
}

#newsfeed p {
  border-radius: 7px;
  background: #f6f6f6 url("/imgs/holder.png");
  background-repeat: repeat-x;
  text-align: left;
  color: #456;
  margin: 2px 2px;
  padding: 2px;
}

#newsfeed time {
  background: #ccc;
  padding: 1px 3px;
  border-radius: 3px;
  margin-right: 3px;
}

#newsfeed a {
  white-space: nowrap;
  font-size: 11px;
  color: #008cf0;
  overflow: hidden;
  padding: 0px;
  margin: 0px;
}

#kookareque p {
  /*        background:#f6f6f6 url("/holder.png");*/
  background: rgba(0, 0, 0, 0.05);
  background-repeat: repeat-x;
  display: block;
  margin: 5px 10px;
  overflow: hidden;
  padding: 10px;
  border-radius: 10px;
}

#kookareque p.aa {
  background: #fee;
  margin: 10px 0px;
  padding: 20px;
  border: 0px;
  border-radius: 0px;
  color: black;
  font-size: 1.2em;
}

#kookareque .userpost {
  color: #008cf0;
  word-break: break-word;
}

#kookareque .userpost a {
  color: inherit;
}

#kookareque time {
  float: right;
}

#kookareque mark {
  background: none;
  overflow: hidden;
  border-radius: 10px;
  display: inline;
}

#kookareque mark img {
  filter: blur(10px);
  overflow: hidden;
  transform: translate3d(0, 0, 0);
}

.kookareque_image {
  display: inline-block;
  max-width: fit-content;
  max-height: fit-content;
  max-width: 50vw;
  max-height: 25vh;
}

.kookareque_image img {
  vertical-align: top;
  max-width: 50vw;
  max-height: 25vh;
}

.kookareque_audio,
.kookareque_video {
  display: block;
}

.kookareque_image,
.kookareque_audio,
.kookareque_video {
  margin-top: 6px;
  border-radius: 10px;
  vertical-align: top;
  overflow: hidden;
}

.kookareque_local {
  vertical-align: middle;
  margin-bottom: 2px;
  margin-right: 2px;
}

.kookareque_expand {
  display: inline;
  padding: 0 6px;
  color: #aaa;
  font-size: small;
  background: none;
  border: none;
  cursor: pointer;
}

.kookareque_expand:hover {
  color: #ccc;
}

.kookareque_expand:active {
  color: #777;
}

#kookareque video {
  max-width: 640px;
  max-height: 360px;
}

#kookareque iframe {
  display: block;
}

#kookareque .ava {
  margin: -10px 15px 0px -10px;
  max-width: 60px;
  max-height: 100px;
}

#kookareque .grava {
  margin: -10px -10px 0px 3px;
}

#kookareque .user_id {
  display: inline;
}

#kookareque .user_fio {
  display: none;
}

#kookareque.showDjNames .user_id {
  display: none;
}

#kookareque.showDjNames .user_fio {
  display: inline;
}

#kookaBar {
  display: flex;
  gap: 10px;
  justify-content: right;
  margin: 15px 10px 0 10px;
  padding-top: 15px;
  border-top: thin solid #ddd;
  box-sizing: border-box;
}

#kookaBar button {
  display: inline-block;
  margin: 0 4px;
  padding: 6px 12px;
  background: rgba(0, 0, 0, 0.05);
  border: none;
  border-radius: 7px;
  cursor: pointer;
}

#kookaBar button:hover {
  background: rgba(0, 0, 0, 0.035);
}

#kookaBar button:active {
  background: rgba(0, 0, 0, 0.07);
}

#kookaBar button[data-enabled="true"] {
  background: darkseagreen;
}

#kookaBar button[data-enabled="false"] {
  background: darksalmon;
}

.dj {
  color: #c00;
  font-weight: bold;
}

.announce,
.from_id,
.user_fio,
.user_id {
  color: #996793;
  font-weight: bold;
}

#warn {
  background-color: #fcfcfc;
  border: 2px solid #700;
  border-radius: 7px;
  margin: 0px 60px;
  padding: 10px 50px;
}

.l80 {
  width: 60%;
  float: left;
  margin: 3px 2px;
}

.l90 {
  margin: 0px auto;
  width: 90%;
}

#bh {
  display: block;
  margin: 20px auto;
  text-align: center;
}

#warn h1 {
  margin: 0.25em 0;
  text-align: center;
  font-size: 25px;
}

@media (min-width: 480px) {
  iframe#gg {
    width: 480px;
    height: 320px;
  }
}

@media (min-width: 900px) {
  iframe#gg {
    width: 800px;
    height: 460px;
  }
}

@media (min-width: 1400px) {
  iframe#gg {
    width: 1280px;
    height: 720px;
  }
}
