/*сверкание чата - фон чата*/
@-webkit-keyframes  blink6 {
 10% { transform: scale(1, 1) rotate(80deg); }
 20% { transform: scale(0, 0) rotate(160deg); }
 100% { transform: scale(0, 0) rotate(0deg); }
}
@keyframes  blink6 {
 10% { transform: scale(1, 1) rotate(80deg); }
 20% { transform: scale(0, 0) rotate(160deg); }
 100% { transform: scale(0, 0) rotate(0deg); }
}
.chatMain:after, .chatMain:before {
  content: "";
  position: absolute; top: 0; left: 0;
  display: block;
  width: 450px;
  height: 350px;
  background-image: 
    radial-gradient(rgba(255,255,255,1), rgba(255,255,255,0) 30%),
    linear-gradient(45deg, rgba(0,0,0,0) 49%, rgba(255,255,255,.4) 50%, rgba(0,0,0,0) 51%),
    linear-gradient(135deg, rgba(0,0,0,0) 49%, rgba(255,255,255,.4) 50%, rgba(0,0,0,0) 51%);
  -webkit-animation: blink6 10s linear infinite;
  animation: blink6 10s linear infinite;
  transform: scale(0, 0) rotate(0deg);
}
.chatMain:before {
  top: -20%;
  right: 0; left: auto;
  -webkit-animation-delay: 5s;
  animation-delay: 5s;
}

.chatHeader .chatTitle:after { --duration: 18s; content: ; font-size: 1,2rem; position: absolute; top: 14px; margin-left: 120px; width: 800px; white-space: nowrap; overflow: hidden; animation: typing var(--duration) infinite; text-shadow: none } @keyframes typing { 0% { width: 0 } 100% { color: #8B008B } }
.chatFull .transparent:before {
    position: absolute;
    width: 100%;
    text-align: center;
    left:0;
    color:  #778899; /* цвет текста меняем на нужный */
    top: 70%; /* положение текста 0% - 90% сверху вниз */
    content:'; /* содержание текста */
    font-size: 30px; /* размер текста */






























/**/
.chatSendExitPanel select {
background-color: #fff;
    box-sizing: border-box;
    height: 22px;
    width: 100%;
    padding:0 10px 0 10px;
    border: 1px solid #4993F4;
    border-radius:35px 3px 35px 5px;
  
box-shadow: 0 0 1px #fff, 0 0 2px #fff, 0 0 3px #fff, 0 0 4px #00FF00, 0 0 5px #F5DA81, 0 0 6px #F5DA81, 0 0 7px #F5DA81, 0 0 10px #F5DA81;
}


/**/
.chatSetupNickname {
    left: 15px;
    line-height: 62px;
    position: absolute;
    top: 0;

}


/*Кнопка переключения звука*/
.chatFooter .chatFooterWrapper .chatPanel div.chatSoundPanel a {
    background: transparent url("http://tri-svesdy.ru/images/sait/knopki/eltaiakn.png") no-repeat scroll 0 0;
    background-position: center left;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    border-radius:5px 35px 5px 35px;
   
    font-size: 8pt;
    font-weight: normal;
    height: 16px;
    padding:0px 15px 0px 15px;
    text-decoration: none;

}

/**/
.chatFooter .chatFooterWrapper .chatPanel div.chatSoundPanel a.muted {
    background-image: url("http://tri-svesdy.ru/images/sait/knopki/knopka_radio.gif");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 102%;
}


/*Фон обеих кнопок входа в чат*/
#join-chat-button, #join-chat-button2 {
    background: transparent url("http://tri-svesdy.ru/images/sait/knopki/knopka_radio_zeltaia.gif") no-repeat scroll 0 0;
    background-position: center left;
    background-repeat: no-repeat;
    background-size: 100% 110%;
    border-radius:35px 5px 35px 5px;;
   box-shadow: 0 0 1px #fff, 0 0 2px #fff, 0 0 3px #fff, 0 0 4px #00FF00, 0 0 5px #F5DA81, 0 0 6px #F5DA81, 0 0 7px #F5DA81, 0 0 10px #F5DA81;
}

 /*Кнопка входа в чат на панели чата*/
 

#join-chat-button {
    background: transparent url("http://tri-svesdy.ru/images/sait/knopki/siniakn.png") no-repeat scroll 0 0;
background-size: 100% 100%;
 padding:5px 15px 5px 15px; 
 border: 1px solid #4993F4;
    border-radius:35px 5px 35px 5px;
   
 box-shadow: 0 0 1px #fff, 0 0 2px #fff, 0 0 3px #fff, 0 0 4px #00FF00, 0 0 5px #F5DA81, 0 0 6px #F5DA81, 0 0 7px #F5DA81, 0 0 10px #F5DA81;
}

 #join-chat-button{
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
          transition: all 0.5s ease;
}
 
 /*Кнопка входа в чат на панели чата*/
 #join-chat-button:hover {
  border-radius: 50%;
  -webkit-transform: rotate(360deg);
     -moz-transform: rotate(360deg);
       -o-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
          transform: rotate(360deg);
}

/*Кнопка входа в чат на странице входа*/
 #join-chat-button2{
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
          transition: all 0.5s ease;
}
 
/*Кнопка входа в чат на странице входа*/
 #join-chat-button2:hover {
  border-radius: 50%;
  -webkit-transform: rotate(360deg);
     -moz-transform: rotate(360deg);
       -o-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
          transform: rotate(360deg);
}






.chatHeader {/* Шапка чата  */background-image:url(htt),url(https://2.bp.blogspot.com/-wlYIDnK6Eus/V_NueU6KhgI/AAAAAAABAP4/-wphO4WNi6wClOdWWXTwFNZqCQkwarRnwCLcB/s1600/%25D0%2591%25D0%259B%25D0%2598%25D0%259A%25D0%2598%2B%252847%2529.gif);background-position: center, 0px;background-repeat;background-color: # 0000CC;font-size: 0pt;border-radius: 25px;box-shadow: 0 0 1px #777, 0 0 2px #777, 0 0 3px #777, 0 0 4px #777, 0 0 5px #777, 0 0 6px #777, 0 0 7px #777, 0 0 20px #777 inset;}

.chatPrivateMessages{
       background-image: url(https://images.pexels.com/photos/417074/pexels-photo-417074.jpeg?auto=compress&cs=tinysrgb&fit=crop&h=627&w=1200);
       background-position: center;
       background-repeat: no-repeat;
       background-size: 100% 100%; 
       border-radius: 25px; /* можно менять радиус скругления */
}

/*Текст в чате*/
.chatMain .chatMessages, .chatMain .chatPrivateMessages {
font-weight: bold;font-family: Monotype Corsiva;
font-weight: 900;
text-shadow: 1px 1px 0 #000000;
      
}


.chatTime {
    font-size: 12pt;
    background: url(http://brainwidget.info/pic/bg/clock-ch.png);
    background-size: 120px 69px;
    background-position: 0px -1px;
    width: 60px;
    position: absolute;
    padding: 24px 30px;
    right: 10px;
    margin-top: -44px;
    color: rgba(182, 226, 69, 0.78);
    z-index: 999;
}
.chatTime {
    float: right;
    padding-right: 8px;
    color: #8B897E;
    font-size: 7pt;
    visibility: hidden;
    font-style: normal;
}

user agent stylesheet
div {
    display: block;
}
.user525847 {
background: transparent url("http://smiles24.ru/data/smiles/anime-serdechki-611.gif") no-repeat scroll 0px 0px / 15px 16px;
padding-left: 20px;
padding-bottom:0px;}
.chatPeople ul.chatPeopleList li.user-525847 a.chatUser { background: transparent url("http://smiles24.ru/data/smiles/anime-serdechki-444.gif") no-repeat 0px 0px / 15px 15px; padding-left: 20px; padding-bottom: 0px; height: 50px;font-weight: 900; }
 

/* летит орел и стая  птиц без  низа */
 
.chatMain::before,
.chatMain::after {
    position: absolute;
    top: 20%;
    width: 60px;
    height: 50px;
    content: '';
    background: url(http://www.webdesign-klamonfra.de/bilder/adler.gif) 0 0 no-repeat;
    background-size: 60px;
    animation: adler 30s infinite linear;
}

.chatMain:after {
    position: absolute;
    top: 15%;
    right: 250px;
    content: '';
    background: url(http://img-fotki.yandex.ru/get/9116/181450557.90/0_afea9_ee8153d4_orig.gif) 0 0 no-repeat;
    width: 470px;
    height: 93px;
}


.chatMain::after {
 top: 0;
 background: url(http://img-fotki.yandex.ru/get/9116/181450557.90/0_afea9_ee8153d4_orig.gif) no-repeat;
 animation: vogel 10s infinite linear;
}

.chatMain::after {
 top: 0;
 background: url(http://img-fotki.yandex.ru/get/9116/181450557.90/0_afea9_ee8153d4_orig.gif) no-repeat;
 animation: vogel 10s infinite linear;
}
@keyframes adler {
 from{transform: scale(1.5) translate3d(-2000px,10px,0)}
 to{transform: scale(1.5) translate3d(1500px,10px,0)}
}
@keyframes vogel { from{transform: scale(.5) translate3d(2500px,150px,0)} to{transform: scale(1) translate3d(-1500px,80px,0)} }

/* ЛЕТИТ ОРЕЛ В ШАПКЕ ЧАТА */
.chatTitle::before {
    position: absolute;
    width: 45px;
    height: 45px;
    top: 13px;
    left: 24px;
    content: '';
    background: url(https://content.foto.my.mail.ru/mail/maja.tatyana/_animated/i-14335.gif) 0 0 no-repeat;
    background-size: 40px;
    transition: all 0.3s ease;
}

/*мняв*/ 
.chatHeader:before { 
content:'\УКУШУ!'; 
font-family: Monotype Corsiva;font-weight: 900;
font-size: 13px; 
color:black ; 
font-weight: bold; 
display: inline-block; 
margin: 0 0 1em; 
white-space: pre-wrap; 
background: url('http://www.playcast.ru/uploads/2016/02/18/17381109.gif'); 
background-position: center center; 
background-repeat: no-repeat; 
background-size: 100% 100%; 
border-radius: 15px 65px 15px 65px; 
border-left: 0px solid white; 
border-right: 0px solid white; 
border-top: 0px solid white; 
border-bottom: 0px solid white; 
width: 200px; 
height: 200px; 
line-height: 18px; 
opacity: 0; 
padding: 10px 10px; 
position: absolute; 
right: 175px; 
top: -500px; 
-moz-transition: all 1s; 
-webkit-transition: all 1s; 
-o-transition: all 1s; 
transition: all 1s; 
}
.chatHeader:hover:before { /*мняв*/ 
width: 500px; 
height: 250px; 
right: 200px; 
top: 1000%; 
opacity: 1;
}
   /*мняв КОНЕЦ*/


.chatTabs > ul > li > a { padding: 0px 14px 0px 10px; height: 100%; text-decoration: none; border-top: 0px none !important; border-right: 0px none !important; vertical-align: middle; display: inline-block; line-height: 24px; border-radius: 25pxfont-family: Monotype Corsiva;font-style: normal;font-size: 16pt; }
 
.chatTabs ul li.appTab { -webkit-transition: all 0.8s ease; -moz-transition: all 0.8s ease; -o-transition: all 0.8s ease; -ms-transition: all 0.8s ease; transition: all 0.8s ease; }