.stick_block_layer {
  background  : #00000099;
  opacity     : 0.17;
  -ms-filter  : "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
  filter      : alpha(opacity=70);
  width       : 100%;
  height      : 100%;
  position    : fixed;
  top         : 0;
  left        : 0;
}

.stick_popup {
  height                 : 200px;
  width                  : 500px;
  box-shadow             : 0px 0px 17px #4a4a4a;
  -moz-box-shadow        : 0px 0px 17px #4a4a4a;
  -webkit-box-shadow     : 0px 0px 17px #4a4a4a;
  background-color       : #242424;
  color                  : #ff3300;
  text-align             : center;
  border                 : 2px solid #019901;
  -webkit-animation      : zoomin 0.7s;
  animation              : zoomin 0.7s;
  border-radius          : 15px;
  -webkit-border-radius  : 15px;
  -moz-border-radius     : 15px;
  -ms-border-radius      : 15px;
  -o-border-radius       : 15px;
}

.zd-okno-popup {
  width             : 500px;
  height            : 500px;
  border-radius     : 20px;
  border            : 3px solid orange;
  background-color  : black;
  color             : white;
}

.zd-konsola-popup-data {
  color        : #01cf01;
  font-weight  : bold;
  text-align   : center;
  font-size    : 46px;
  font-family  : Arial;
}

.zd-konsola-popup-imieniny {
  display      : block;
  color        : #ff9100;
  font-weight  : bold;
  text-align   : center;
  font-size    : 24px;
  font-family  : Arial;
}

.zd-konsola-popup-imiona {
  color        : #00eeff;
  font-weight  : bold;
  text-align   : center;
  font-size    : 20px;
  font-family  : Arial;
  display      : inline;
  white-space  : nowrap;
}

.zd-konsola-popup-dzien-text {
  color        : #ff6060;
  font-weight  : bold;
  font-size    : 20px;
  font-family  : Arial;
}

.zd-konsola-popup-dzien {
  color        : #e5ff00;
  font-weight  : bold;
  font-size    : 20px;
  font-family  : Arial;
}

.zd-konsola-popup-wz {
  color        : #ffd000;
  font-weight  : bold;
  font-size    : 20px;
  font-family  : Arial;
}

.stick_content {
  padding  : 2px;
}

/*
CSS3 animation keyframes.
*/
@-webkit-keyframes zoomin {
  0% {
    -webkit-transform  : scale(0);
    -ms-transform      : scale(0);
    transform          : scale(0);
    opacity            : 0;
  }

  50% {
    -webkit-transform  : scale(1.04);
    -ms-transform      : scale(1.04);
    transform          : scale(1.04);
    opacity            : 1;
  }

  100% {
    -webkit-transform  : scale(1);
    -ms-transform      : scale(1);
    transform          : scale(1);
    opacity            : 1;
  }
}

@-ms-keyframes zoomin {
  0% {
    -webkit-transform  : scale(0);
    -ms-transform      : scale(0);
    transform          : scale(0);
    opacity            : 0;
  }

  50% {
    -webkit-transform  : scale(1.04);
    -ms-transform      : scale(1.04);
    transform          : scale(1.04);
    opacity            : 1;
  }

  100% {
    -webkit-transform  : scale(1);
    -ms-transform      : scale(1);
    transform          : scale(1);
    opacity            : 1;
  }
}

@keyframes zoomin {
  0% {
    -webkit-transform  : scale(0);
    -ms-transform      : scale(0);
    transform          : scale(0);
    opacity            : 0;
  }

  50% {
    -webkit-transform  : scale(1.04);
    -ms-transform      : scale(1.04);
    transform          : scale(1.04);
    opacity            : 1;
  }

  100% {
    -webkit-transform  : scale(1);
    -ms-transform      : scale(1);
    transform          : scale(1);
    opacity            : 1;
  }
}

/* --------------------------------- Konsola -------------------------------- */
@keyframes typingGlow {
  0% {
    box-shadow  : 0 0 10px #ff0000;
  }

  50% {
    box-shadow  : 0 0 20px #ff0000;
  }

  100% {
    box-shadow  : 0 0 10px #ff0000;
  }
}

input[type="text"],
input[type="text"]:hover,
input[type="text"]:active {
  background-color  : #000000;
  color             : #ff0000;
  font-weight       : bold;
  border-radius     : 5px;
  border            : 1px solid #019901;
  box-sizing        : border-box;
  caret-color       : #ff0000;
}

input:focus {
  background-color  : #000000 !important;
  color             : #ff0000 !important;
  border-color      : #ff0000;
  outline           : none;
  animation         : typingGlow 1s infinite;
  caret-color       : #ff0000;
}

input:-webkit-autofill {
  box-shadow               : 0 0 0 1000px #000000 inset !important;
  -webkit-text-fill-color  : #ff0000 !important;
  caret-color              : #ff0000;
  transition               : background-color 0s ease-in-out 0s;
}

input:-webkit-autofill:focus {
  background-color         : #000000 !important;
  -webkit-text-fill-color  : #ff0000 !important;
  caret-color              : #ff0000;
}

input[type="password"],
input[type="password"]:hover,
input[type="password"]:active {
  background-color       : #000000;
  color                  : #ff0000;
  font-weight            : bold;
  border-radius          : 5px;
  border                 : 1px #019901 solid;
  box-sizing             : border-box;
  -webkit-border-radius  : 5px;
  -moz-border-radius     : 5px;
  -ms-border-radius      : 5px;
  -o-border-radius       : 5px;
}

input[type="submit"] {
  appearance     : none;
  border         : 3px solid #019901;
  background     : hsl(0 0 0/0);
  padding        : 0.35em 0.5em;
  color          : #ffffff;
  border-radius  : 2em;
  transition     : 1s;

  &:hover,
  &:focus,
  &:active {
    background  : #ff0000;
    color       : #ffffff;
  }
}

input[type="number"] {
  background-color       : #000000;
  color                  : #ffffff;
  font-weight            : bold;
  border-radius          : 5px;
  border                 : 1px #019901 solid;
  box-sizing             : border-box;
  -webkit-border-radius  : 5px;
  -moz-border-radius     : 5px;
  -ms-border-radius      : 5px;
  -o-border-radius       : 5px;
}

input[type="color"] {
  background-color       : #000000;
  border-radius          : 5px;
  border                 : 1px #019901 solid;
  -webkit-border-radius  : 5px;
  -moz-border-radius     : 5px;
  -ms-border-radius      : 5px;
  -o-border-radius       : 5px;
}

textarea {
  width                  : 300px;
  height                 : 60px;
  padding                : 5px 10px;
  background-color       : #000000;
  color                  : #ffffff;
  font-weight            : bold;
  border-radius          : 5px;
  border                 : 1px #019901 solid;
  box-sizing             : border-box;
  -webkit-border-radius  : 5px;
  -moz-border-radius     : 5px;
  -ms-border-radius      : 5px;
  -o-border-radius       : 5px;
}

.legend {
  display                : block;
  padding-left           : 10px;
  padding-right          : 10px;
  border                 : 1px solid #019901;
  background-color       : #000000;
  color                  : goldenrod;
  box-shadow             : 0 0 15px #019901;
  border-radius          : 20px;
  -webkit-border-radius  : 20px;
  -moz-border-radius     : 20px;
  -ms-border-radius      : 20px;
  -o-border-radius       : 20px;
}

fieldset {
  border                 : 1px solid #019901;
  box-shadow             : 0 0 15px #019901;
  border-radius          : 20px;
  -webkit-border-radius  : 20px;
  -moz-border-radius     : 20px;
  -ms-border-radius      : 20px;
  -o-border-radius       : 20px;
}

.zielony {
  color        : #00ff00;
  font-weight  : bolder;
}

.numer {
  color        : #ffaa22;
  font-size    : 30px;
  font-weight  : bolder;
}

.dzien {
  color        : #34c534;
  font-size    : 12px;
  font-weight  : bolder;
}

.dzien1 {
  color        : #34c534;
  font-size    : 12px;
  font-weight  : bolder;
}

.dzien1 {
  color        : #00c3ffd0;
  font-size    : 16px;
  font-weight  : bolder;
  text-align   : center;
}

.czerwony {
  color        : #ff0000;
  font-size    : 12px;
  font-weight  : bolder;
}

.zolty {
  color        : #ffff00;
  font-size    : 12px;
  font-weight  : bolder;
}

.zielony {
  color        : #33ff00;
  font-size    : 12px;
  font-weight  : bolder;
}

.niebieski {
  color        : #0000ff;
  font-size    : 12px;
  font-weight  : bolder;
}

.blenkit {
  color        : #00ddff;
  font-size    : 12px;
  font-weight  : bolder;
}

.iloscpozdro {
  color        : #00ff00;
  font-size    : 46px;
  font-weight  : bolder;
}

.iloscpiosenek {
  color        : #00ff00;
  font-size    : 46px;
  font-weight  : bolder;
}

.text_1 {
  font-family  : Arial, Helvetica;
  font-size    : 12px;
  color        : #ffffff;
}

.text_2 {
  font-family  : Arial, Helvetica;
  font-size    : 12px;
  color        : #ffa51a;
}

.text_3 {
  font-family  : Arial, Helvetica;
  font-size    : 12px;
  color        : #00ff00;
}

.text_4 {
  font-family  : Arial, Helvetica;
  font-size    : 12px;
  color        : #ff0000;
}

.text_5 {
  font-family  : Arial, Helvetica;
  font-size    : 12px;
  color        : #00ddff;
}

.nick {
  font-family  : Arial, Helvetica;
  font-size    : 16px;
  color        : #48de02;
}

.logowanie_naglowek {
  font-family  : Arial, Helvetica;
  font-size    : 16px;
  color        : #48de02;
  font-weight  : bolder;
  text-align   : center;
  margin       : 10px auto;
  text-shadow  : #ffaa22 0px 0px 2px;
}

.piosenki_1 {
  font-family  : Arial, Helvetica;
  font-size    : 16px;
  color        : #48de02;
  font-weight  : bolder;
}

.piosenki_2 {
  font-family  : Arial, Helvetica;
  font-size    : 16px;
  color        : #ffffff;
  font-weight  : bolder;
}

body {
  background-color  : #000040;
  color             : #ffa51a;
  font-weight       : bolder;
}

table {
  background-color  : #2a2a2a;
  margin            : auto;
}

.menu {
  font-family            : Arial, Helvetica;
  font-size              : 14px;
  color                  : #9b9b9b;
  border                 : 1px solid #019901;
  border-radius          : 15px;
  -webkit-border-radius  : 15px;
  -moz-border-radius     : 15px;
  -ms-border-radius      : 15px;
  -o-border-radius       : 15px;
  text-align             : center;
}

.td1 {
  color                  : #ffffff;
  font-family            : Arial, Helvetica;
  font-size              : 12px;
  border-radius          : 25px;
  -webkit-border-radius  : 25px;
  -moz-border-radius     : 25px;
  -ms-border-radius      : 25px;
  -o-border-radius       : 25px;
  text-align             : center;
}

.td2 {
  border                 : 1px solid #019901;
  color                  : #ffffff;
  font-family            : Arial, Helvetica;
  font-size              : 14px;
  border-radius          : 15px;
  -webkit-border-radius  : 15px;
  -moz-border-radius     : 15px;
  -ms-border-radius      : 15px;
  -o-border-radius       : 15px;
  text-align             : left;
  padding                : 0px 0px 0px 15px;
}

.td3 {
  border                 : 1px solid #019901;
  color                  : #ffffff;
  font-family            : Arial, Helvetica;
  font-size              : 14px;
  border-radius          : 15px;
  -webkit-border-radius  : 15px;
  -moz-border-radius     : 15px;
  -ms-border-radius      : 15px;
  -o-border-radius       : 15px;
  text-align             : left;
  padding                : 10px 0px 0px 10px;
}

.td4 {
  border                 : 1px solid #019901;
  color                  : #ffffff;
  font-family            : Arial, Helvetica;
  font-size              : 14px;
  border-radius          : 15px;
  -webkit-border-radius  : 15px;
  -moz-border-radius     : 15px;
  -ms-border-radius      : 15px;
  -o-border-radius       : 15px;
  text-align             : center;
}

.td4a {
  border                 : 1px solid #019901;
  color                  : #ff0000;
  font-family            : Arial, Helvetica;
  font-size              : 14px;
  border-radius          : 15px;
  -webkit-border-radius  : 15px;
  -moz-border-radius     : 15px;
  -ms-border-radius      : 15px;
  -o-border-radius       : 15px;
  text-align             : center;
}

.td_pozdrowienia {
  border                 : 1px solid #019901;
  color                  : #ffffff;
  font-family            : Arial, Helvetica;
  border-radius          : 15px;
  -webkit-border-radius  : 15px;
  -moz-border-radius     : 15px;
  -ms-border-radius      : 15px;
  -o-border-radius       : 15px;
  text-align             : left;
  padding                : 10px 0px 0px 10px;
}

.konsole {
  border                 : 1px solid #019901;
  color                  : #9b9b9b;
  font-family            : Arial, Helvetica;
  font-size              : 14px;
  border-radius          : 15px;
  -webkit-border-radius  : 15px;
  -moz-border-radius     : 15px;
  -ms-border-radius      : 15px;
  -o-border-radius       : 15px;
  text-align             : center;
  width                  : 25%;
}

.statykto {
  color        : #b0e0e6;
  font-family  : Arial, Helvetica;
  font-size    : 12px;
  font-weight  : bolder;
  text-align   : center;
  margin       : 0px 0 0 0px;
}

.statyile {
  color        : #b0e0e6;
  font-family  : Verdana, Arial, Helvetica, sans-serif;
  font-size    : 12px;
  font-weight  : bolder;
  text-align   : center;
  margin       : 0px 0 0 0px;
}

.serduszka {
  color        : #b0e0e6;
  font-family  : Verdana, Arial, Helvetica, sans-serif;
  font-size    : 12px;
  font-weight  : bolder;
  text-align   : center;
  margin       : 0px 0 0 0px;
}

.cyfra {
  color        : #00ff00;
  font-size    : 32px;
  font-weight  : bolder;
  text-align   : center;
}

.zalogowany {
  color        : #00ffdd;
  font-size    : 14px;
  font-weight  : bolder;
}

.logujeszsie_jako {
  color        : #00ffdd;
  font-size    : 20px;
  font-weight  : bolder;
}

.zalogowany_jest {
  color        : #00ff00;
  font-size    : 30px;
  font-weight  : bolder;
}

.zalogowany_nick {
  color        : #0099ff;
  font-size    : 14px;
  font-weight  : bolder;
}

.ia_id {
  border       : 0 none;
  color        : #afafaf;
  font-family  : Verdana, Arial;
  font-size    : 20px;
  font-weight  : bold;
}

.ia_obow {
  border       : 0;
  color        : #afafaf;
  font-family  : Verdana, Arial;
  font-size    : 14px;
  font-weight  : bold;
  text-align   : left;
}

#content {
  width                  : 400px;
  margin                 : 50px auto;
  padding                : 10px;
  text-align             : center;
  background             : #2a2a2a;
  border                 : 1px solid #019901;
  box-shadow             : 0px 0px 50px 5px #019901;
  border-radius          : 10px;
  -webkit-border-radius  : 10px;
  -moz-border-radius     : 10px;
  -ms-border-radius      : 10px;
  -o-border-radius       : 10px;
}

#bar {
  background-color  : #ff0000;
  height            : 16px;
  width             : 0;
}

#barbox {
  background-color  : #666;
  border            : 1px solid #00ff22;
  float             : none;
  height            : 16px;
  margin            : -20px 0 0 90px;
  width             : 100px;
}

#count {
  color        : orange;
  float        : none;
  font-family  : Arial, Helvetica;
  font-size    : 20px;
  font-weight  : bold;
  margin       : 0 0 0 115px;
}

#contentbox {
  border       : 1px solid #333;
  font-family  : Arial, Helvetica;
  font-size    : 14px;
  height       : 130px;
  width        : 250px;
}

.tip {
  background     : none repeat scroll 0 0 #1d1d1d;
  border-color   : #ffffff;
  border-radius  : 3px 3px 3px 3px;
  border-style   : solid;
  border-width   : 1px;
  color          : #ffffff;
  display        : none;
  padding        : 10px;
  position       : absolute;
  z-index        : 1000;
}

.tlopozdro {
  height  : 0px;
  width   : 350px;
}

.nazwapozdro {
  font-family  : "comic sans ms";
  color        : #ffa51a;
  font-size    : 20px;
  padding      : 15px 0 0;
}

.ramka_pozdro_wyglond {
  background-color  : #0000a7;
  border            : 2px solid #ffa51a;
  border-radius     : 15px 15px 15px 15px;
  box-shadow        : 0px 0 10px 1px #cccccc;
  color             : #fff;
  font-size         : 12px;
  font-weight       : bold;
  padding           : 5px 0 0 10px;
}

.ramka_pozdro_pozycja {
  margin  : 10px 0 0;
}

.znakipozdro {
  color      : orange;
  font-size  : 11px;
  padding    : 5px;
}

.ramka_kto_wyglond {
  background-color  : #0000a7;
  border            : 2px solid #ffa51a;
  border-radius     : 15px 15px 15px 15px;
  box-shadow        : 0px 0 10px 1px #cccccc;
  color             : #fff;
  font-size         : 12px;
  font-weight       : bold;
  padding           : 5px 0 0 10px;
  height            : 25px;
  width             : 275px;
}

.ramka_kto_wyglond1 {
  background-color  : #0000a7;
  border            : 2px solid #ffa51a;
  border-radius     : 15px 15px 15px 15px;
  box-shadow        : 0px 0 10px 1px #cccccc;
  color             : #fff;
  font-size         : 12px;
  font-weight       : bold;
  padding           : 5px 0 0 10px;
  height            : 25px;
  width             : 300px;
}

.ramka_ktopozdro_pozycja {
  padding  : 5px 0 0;
}

.nlipozdro {
  color      : #fff;
  font-size  : 16px;
  padding    : 3px 0 0;
}

.wyslij_pozycjapozdro {
  margin  : 3px 0 0;
}

.tlopiosenki {
  height  : 350px;
  width   : 350px;
}

.nazwapiosenki {
  font-family  : "comic sans ms";
  color        : #ffa51a;
  font-size    : 20px;
  padding      : 15px 0 0 10px;
}

.wykonawca {
  color      : #fff;
  font-size  : 16px;
  margin     : 15px 0 0 -240px;
}

.ramka_wykonawca {
  background-color  : #0000a7;
  border            : 3px solid #ffa51a;
  border-radius     : 15px 15px 15px 15px;
  box-shadow        : 0px 0 10px 1px #666666;
  color             : #fff;
  font-size         : 14px;
  height            : 25px;
  margin            : -24px 0 0 110px;
  width             : 275px;
}

.tytul {
  color      : #fff;
  font-size  : 16px;
  margin     : 15px 0 0 -300px;
}

.ramka_tytul {
  background-color  : #0000a7;
  border            : 3px solid #ffa51a;
  border-radius     : 15px 15px 15px 15px;
  box-shadow        : 0px 0 10px 1px #666666;
  color             : #fff;
  font-size         : 14px;
  font-weight       : bold;
  height            : 25px;
  margin            : -24px 0 0 110px;
  width             : 275px;
}

.dokogo {
  color      : #fff;
  font-size  : 16px;
  margin     : 15px 0 0 -260px;
}

.ramka_dokogo {
  background-color  : #0000a7;
  border            : 3px solid #ffa51a;
  border-radius     : 15px;
  color             : #fff;
  font-weight       : bold;
  font-size         : 14px;
  height            : 25px;
  margin            : -24px 0 0 110px;
  width             : 275px;
}

.ramka_dokogo1 {
  width             : 300px;
  height            : 50px;
  padding           : 12px 20px;
  box-sizing        : border-box;
  border            : 2px solid #ccc;
  border-radius     : 15px;
  background-color  : #000;
  font-size         : 16px;
  resize            : none;
  color             : #fff;
}

.odkogo {
  color      : #fff;
  font-size  : 16px;
  margin     : 15px 0 0 -270px;
}

.ramka_odkogo {
  background-color  : #0000a7;
  border            : 3px solid #ffa51a;
  border-radius     : 15px;
  color             : #fff;
  font-weight       : bold;
  font-size         : 14px;
  height            : 55px;
  margin            : -24px 0 0 110px;
  width             : 275px;
}

.ramka_srodek {
  background-color  : #0000a7;
  color             : #fff;
  font-weight       : bold;
  font-size         : 14px;
  height            : 25px;
  width             : 260px;
  border            : 0px;
}

.ramka_srodek1 {
  background-color  : #0000a7;
  color             : #fff;
  font-weight       : bold;
  font-size         : 14px;
  height            : 50px;
  width             : 260px;
  border            : 0px;
}

.wyslij_wyglond {
  background-color  : #0000a7;
  border            : 3px solid #ffa51a;
  border-radius     : 15px 15px 15px 15px;
  box-shadow        : 0px 0 10px 1px #999999;
  color             : #ffffff;
  font-size         : 16px;
  font-weight       : bold;
  margin            : 10px 0 0 100px;
  width             : 150px;
}

.czas {
  /*?background             : linear-gradient(to right, #ef5350, #f48fb1, #7e57c2, #2196f3, #26c6da, #43a047, #eeff41, #f9a825, #ff5722);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    */
  color        : #00ddff;
  font-family  : Arial, Helvetica;
  font-size    : 20px;
  font-weight  : bold;
  margin       : 0 0 0 0px;
}

.czas_dj {
  color        : #00ddff;
  font-family  : Arial, Helvetica;
  font-size    : 16px;
  font-weight  : bold;
  text-align   : center;
}

.czas_dj_text {
  color        : #ffa600;
  font-family  : Arial, Helvetica;
  font-size    : 16px;
  font-weight  : bold;
  text-align   : center;
}

.ustawienia {
  color                  : #62aeb9;
  font-family            : Arial, Helvetica;
  text-decoration        : none;
  font-size              : 16px;
  font-weight            : bold;
  text-align             : center;
  width                  : 200px;
  height                 : 15px;
  margin                 : 0 0 0 0px;
  padding                : 2 0 2 0px;
  border                 : 2px solid;
  border-color           : #019901;
  background             : #000000;
  border-radius          : 15px;
  -webkit-border-radius  : 15px;
  -moz-border-radius     : 15px;
  -ms-border-radius      : 15px;
  -o-border-radius       : 15px;
  box-shadow             : 0px 0 10px 1px #666666;
  -webkit-box-shadow     : 0px 0 10px 1px #666666;
  -moz-box-shadow        : 0px 0 10px 1px #666666;
  -ms-box-shadow         : 0px 0 10px 1px #666666;
  -o-box-shadow          : 0px 0 10px 1px #666666;
  text-shadow            : 0px 0px 10px #000000;
}

.nick {
  color        : #00ff7f;
  font-family  : Arial, Helvetica;
  font-size    : 14px;
  font-weight  : bold;
  margin       : -2px 0 0 10px;
}

.infokonsola {
  color        : orange;
  font-size    : 16px;
  font-weight  : bold;
  text-align   : center;
  margin-top   : 100px;
}

.infopozdro {
  color        : orange;
  font-size    : 14px;
  font-weight  : bold;
  height       : 350px;
  text-align   : center;
  width        : 350px;
}

.infoip {
  color        : orange;
  font-size    : 14px;
  font-weight  : bold;
  height       : 350px;
  text-align   : center;
  width        : 350px;
}

.infopiosenka {
  color        : #ff0000;
  font-size    : 12px;
  font-weight  : bold;
  height       : 350px;
  text-align   : center;
  width        : 350px;
}

.input {
  background  : none repeat scroll 0 0 #ffffcc;
  border      : 1px solid #000066;
}

.button {
  border                 : 2px solid #019901;
  background             : #000000;
  color                  : #ffffff;
  border-radius          : 5px;
  -webkit-border-radius  : 5px;
  -moz-border-radius     : 5px;
  -ms-border-radius      : 5px;
  -o-border-radius       : 5px;
  text-align             : center;
}

p.error {
  color        : #ff0000;
  font-size    : 10pt;
  font-weight  : bold;
  text-align   : center;
}

div.c1 {
  text-align  : center;
}

div.c2 {
  text-align  : left;
}

a:link,
a:visited {
  color            : #f0ffff;
  font-size        : 14px;
  font-weight      : bold;
  text-decoration  : none;
}

a:hover {
  color            : #ffffff;
  text-decoration  : underline;
}