/*ГУГЛЕ КОДЫ*/
 /*Код дрожания от Гугле*/
@-webkit-keyframes Tada {
    0% {
        -webkit-transform:scale(1)
    }
    10%, 20% {
        -webkit-transform:scale(0.9) rotate(-1deg)
    }
    30%, 50%, 70%, 90% {
        -webkit-transform:scale(1.1) rotate(1deg)
    }
    40%, 60%, 80% {
        -webkit-transform:scale(1.1) rotate(-1deg)
    }
    100% {
        -webkit-transform:scale(1) rotate(0)
    }
}
@-moz-keyframes Tada {
    0% {
        -moz-transform:scale(1)
    }
    10%,20% {
        -moz-transform:scale(0.9) rotate(-1deg)
    }
    30%, 50%, 70%, 90% {
        -moz-transform:scale(1.1) rotate(1deg)
    }
    40%, 60%, 80% {
        -moz-transform:scale(1.1) rotate(-1deg)
    }
    100% {
        -moz-transform:scale(1) rotate(0)
    }
}
@-o-keyframes Tada {
    0% {
        -o-transform:scale(1)
    }
    10%,20% {
        -o-transform:scale(0.9) rotate(-1deg)
    }
    30%, 50%, 70%, 90% {
        -o-transform:scale(1.1) rotate(1deg)
    }
    40%, 60%, 80% {
        -o-transform:scale(1.1) rotate(-1deg)
    }
    100% {
        -o-transform:scale(1) rotate(0)
    }
}
@keyframes Tada {
    0% {
        transform:scale(1)
    }
    10%, 20% {
        transform:scale(0.9) rotate(-1deg)
    }
    30%, 50%, 70%, 90% {
        transform:scale(1.1) rotate(1deg)
    }
    40%, 60%, 80% {
        transform:scale(1.1) rotate(-1deg)
    }
    100% {
        transform:scale(1) rotate(0)
    }
}

/*конец Код дрожания от Гугле*/


/*Текст в комнатах*/
.chatMain .chatMessages, .chatMain .chatPrivateMessages {

    font-weight: bold;
    font-style:#6B3D5B;
	font-style:italic;
    font-family:Serif;
}



/*Название чата*/
.chatHeader .chatTitle {
 border: 0px solid #a0ca2d;
 }


/*Курсор на титрах в шапке*/
.chatHeader .chatTitle {
cursor: pointer;
}

/*Титры в шапке*/
.chatHeader .chatTitle {
	color:transparent;
font-size: 0px;
}

/*Фон шапки*/
.chatHeader {
	height: 35px;
background-color: transparent;
border: 0px solid #a0ca2d;
background-image: url("картинка");  
    background-position: top 0 left 0;
    background-repeat: no-repeat;
    background-size:100% 100%;

}


/*фон в движении*/
.chatMain {background-color:transparent;
    background: url(rfhnbyrf) fixed;
	     background-size:auto 50%;
	    background-repeat: repeat;
animation: citas 60s linear infinite;
border: 0px solid #a0ca2d;
   }

  /*движение бесперерывное*/
@keyframes citas {
    from { background-position:  597px 100%;}
    to { background-position: 0 100%; }
   }
   
.chatMain .chatMessages, .chatMain .chatPrivateMessages {background-color:transparent;
    background: url(картинка);
	     background-size:100% 100%;
	    background-repeat: no-repeat;

border: 0px solid #a0ca2d;
   }

/*ОБЩИЙ ФОН ЧАТА*/
body {
    background: url(https://i.postimg.cc/FRccpkM8/oblaka.png) repeat-x 0 100% fixed,
	url(https://i.postimg.cc/66f4QKtr/oblakaa.png) repeat-x 0 100% fixed,
	url(https://i.postimg.cc/Qd3TNMWJ/Cartoon-Sun-PNG-Photo.png) no-repeat 0 100% fixed,
                url(гифка) repeat-x 0 100%fixed, 
                url(гифка) no-repeat fixed, url(гифка) no-repeat  fixed,
       url(https://i.postimg.cc/d3h8xGy1/1612800520-24-p-golubaya-laguna-fon-38.jpg) repeat 0 100% fixed,
                linear-gradient(to top, transparent, transparent) fixed;
				background-size:900px auto, 900px auto, auto 17%, 900px 100%, 40% auto, 300px auto, 100% 100%, 100% 100%;
    animation: city 90s linear infinite;
border: 0px solid #a0ca2d;
   }

  /*движение бесперерывное*/
@keyframes city {
    from { background-position: -900px 0, 900px -5%, 68% -5%, -900px 100%, 40% -3%,  50% 70%,  0 100%, 0 100%;}
    to { background-position: 0 0, 0 -5%, 68% -5%, 50% 50%,  40% -3%, 50% 70%, 0 100%, 0 100%; }
   }
   
/*ФОН ОБЩЕЙ КОМНАТЫ*/

   .chatMain .chatMessages { 
   background-color: rgba(255,255,255,.4); 
       background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    border: 3px solid #fff;
    border-radius:10px;
 -webkit-box-shadow:0px 1px 3px #050505, inset 0px 0px 1px #ffffff; 
 -moz-box-shadow: 0px 2px 3px #050505,  inset 0px 1px 1px #ffffff;  
 }
 
 
 /*ФОН ПРИВАТНОЙ КОМНАТЫ*/
 
 .chatMain .chatPrivateMessages { 
 background-image: url("http://www.playcast.ru/uploads/2018/03/19/24880127.png");  
    background-color: rgba(225,225,225,.4); 
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    border: 3px solid #fff;
    border-radius:10px;
 -webkit-box-shadow:0px 1px 3px #050505, inset 0px 0px 1px #ffffff; 
 -moz-box-shadow: 0px 2px 3px #050505,  inset 0px 1px 1px #ffffff;  
 }

/*ФОН ФУТЕРА*/

.chatFooter{
background-color: transparent;
border-top: 0px solid transparent;
background-image: url("");  
    background-position: top 0 left 0;
    background-repeat: no-repeat;
    background-size:100% 100%;
}

/*Накладная полоса правой колонки*/
.chatMain .chatPeople:before{
content:"";
width: 17px;
height: 100%;
     position: fixed;
        bottom:35px;
		 right:173px;
z-index:9;
background-color: transparent;
background-image: url("картинка");  
    background-position: top 43px left 0;
    background-repeat: no-repeat;
    background-size:100% 96%;
}

/*КНОПКИ ПЕРЕКЛЮЧЕНИЯ КОМНАТ*/

.chatTabs > ul > li > a {
    border-right: 0 none !important;
    border-top: 0 none !important;
    display: inline-block;
    font-size: 9pt;
    color: #2CA348;
    height: 100%;
    line-height: 24px;
    padding: 0 14px 0 10px;
    vertical-align: middle;
    font-family: Corbel; 
    font-style: normal;
	  -webkit-animation-duration: 0.4s;
   -moz-animation-duration: 0.4s;
   -o-animation-duration: 0.4s;
   animation-duration: 0.4s;
   -webkit-animation-timing-function: ease;
   -moz-animation-timing-function: ease;
   -o-animation-timing-function: ease;
   animation-timing-function: ease; 
}

.chatTabs > ul > li.chatTab.chatTabActive > a, .chatTabs > ul > li.chatTab > a:hover, .chatTabs > ul > li.chatTab > a.active {
    background-image: url("https://i.postimg.cc/P5yzBDFw/siniakn.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    border: 3px solid #fff;
    border-radius:35px 3px 35px 5px;
 -webkit-box-shadow:0px 1px 3px #050505, inset 0px 0px 1px #ffffff; 
 -moz-box-shadow: 0px 2px 3px #050505,  inset 0px 1px 1px #ffffff;  
 
transition: .9s linear;
  -webkit-animation-name: Tada;
  -moz-animation-name: Tada;
  -o-animation-name: Tada;
  animation-name: Tada;
   
}

.chatTabs > ul > li.chatTab > a {
    background-image: url("https://i.postimg.cc/YSJ4VqkF/siniakntemnaia.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
border: 3px solid #f0f0f0;
    border-radius:35px 3px 35px 5px;
	  -webkit-animation-name: Tada;
  -moz-animation-name: Tada;
  -o-animation-name: Tada;
  animation-name: Tada;
   box-shadow:0px 0px 0px #050505;  
}

/*Крестик закрытия на кнопках*/

.chatTabs ul li.chatTab .close {
    background: transparent url("https://i.postimg.cc/W3G4HG5R/hot-kr.png") no-repeat scroll 0 0;
background-size: 100% 100%;
    cursor: pointer;
    height: 8px;
    position: absolute;
    right: 3px;
    top: 2px;
    width: 8px;
	
}

/*Фон и атрибутика приложений после переключений комнат*/

.appTab {
cursor:pointer;
	display:inline-block;
	color:#FFF;
	
	border:1px solid #FFF;
	background:#fff;
	border-radius:4px;

	border:1px solid #FFF;
	text-decoration:none;
		
	-webkit-transition: all 0.3s linear;
     -khtml-transition: all 0.3s linear;
       -moz-transition: all 0.3s linear;
         -o-transition: all 0.3s linear;
            transition: all 0.3s linear;}
			

			
.appTab:hover{
	color:#FF0000;
	-webkit-box-shadow:rgba(0,0,0,0.7) 0px 5px 15px, inset rgba(0,0,0,0.15) 0px -5px 10px;
     -khtml-box-shadow:rgba(0,0,0,0.7) 0px 5px 15px, inset rgba(0,0,0,0.15) 0px -5px 10px;
       -moz-box-shadow:rgba(0,0,0,0.7) 0px 5px 15px, inset rgba(0,0,0,0.15) 0px -5px 10px;
         -o-box-shadow:rgba(0,0,0,0.7) 0px 5px 15px, inset rgba(0,0,0,0.15) 0px -5px 10px;
            box-shadow:rgba(0,0,0,0.7) 0px 5px 15px, inset rgba(0,0,0,0.15) 0px -5px 10px;
}	

 .appTab {
    display: block;
    position: relative;
    background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 50%, rgba(255,255,255,0) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(50%,rgba(255,255,255,0.9)), color-stop(100%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.9) 50%,rgba(255,255,255,0) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.9) 50%,rgba(255,255,255,0) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.9) 50%,rgba(255,255,255,0) 100%); /* IE10+ */
	background: linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.9) 50%,rgba(255,255,255,0) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 */

}	

 .appTab:active {
    -webkit-box-shadow: rgba(255,255,255,0.25) 0px 1px 0px, inset rgba(255,255,255,0.03) 0px 20px 0px, inset rgba(0,0,0,0.15) 0px -20px 20px, inset rgba(255,255,255,0.05) 0px 20px 20px;
     -khtml-box-shadow: rgba(255,255,255,0.25) 0px 1px 0px, inset rgba(255,255,255,0.03) 0px 20px 0px, inset rgba(0,0,0,0.15) 0px -20px 20px, inset rgba(255,255,255,0.05) 0px 20px 20px;
       -moz-box-shadow: rgba(255,255,255,0.25) 0px 1px 0px, inset rgba(255,255,255,0.03) 0px 20px 0px, inset rgba(0,0,0,0.15) 0px -20px 20px, inset rgba(255,255,255,0.05) 0px 20px 20px;
         -o-box-shadow: rgba(255,255,255,0.25) 0px 1px 0px, inset rgba(255,255,255,0.03) 0px 20px 0px, inset rgba(0,0,0,0.15) 0px -20px 20px, inset rgba(255,255,255,0.05) 0px 20px 20px;
            box-shadow: rgba(255,255,255,0.25) 0px 1px 0px, inset rgba(255,255,255,0.03) 0px 20px 0px, inset rgba(0,0,0,0.15) 0px -20px 20px, inset rgba(255,255,255,0.05) 0px 20px 20px;
    text-shadow:1px 1px 1px #eee;
}



/*КНОПКИ И МЕНЮ СПРАВА В ШАПКЕ*/
/* Кнопки меню справа*/
.chatHeader .chatTopLine{color:#fff;
	background-color: transparent;
background-image: url("https://i.postimg.cc/ZqrZbTpp/1siniakn.png");
background-position: top 0px left 0;
background-repeat:no-repeat;
background-size: 100% 100%;    
 box-shadow:0px #ffffff; 
border:solid 0px #EFA713;  
	 transition: .4s linear;
  animation: bounce .6s; 

	}
 
.chatHeader .chatTopLine:hover{
	color:#000;
	background-color: transparent;
background-image: url("https://i.postimg.cc/ZqrZbTpp/1siniakn.png");
background-position: top 0px left 0;
background-repeat:no-repeat;
background-size: 100% 100%;    
 box-shadow:0px #ffffff; 
 border:solid 0px #EFA713; 
	 transition: .4s linear;
  animation: bounce .6s; 


 }
 
.chatHeader .chatTopLine:active {
		background-color: transparent;
 padding:0px 12px; 
 border:solid 0px #EFA713;
 	 transition: .4s linear;
  animation: bounce .6s; 

} 

/* Фон анкеты в меню справа вверху*/
.chatTopLineWrapper ul li ul {

background: rgba(212,228,239,1);
background: -moz-linear-gradient(-45deg, rgba(212,228,239,1) 0%, rgba(255,255,255,0.39) 100%);
background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(212,228,239,1)), color-stop(100%, rgba(255,255,255,0.39)));
background: -webkit-linear-gradient(-45deg, rgba(212,228,239,1) 0%, rgba(255,255,255,0.39) 100%);
background: -o-linear-gradient(-45deg, rgba(212,228,239,1) 0%, rgba(255,255,255,0.39) 100%);
background: -ms-linear-gradient(-45deg, rgba(212,228,239,1) 0%, rgba(255,255,255,0.39) 100%);
background: linear-gradient(135deg, rgba(212,228,239,1) 0%, rgba(255,255,255,0.39) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d4e4ef', endColorstr='#ffffff', GradientType=1 );

    display: block;
    visibility: hidden;
    border-color:  #ccc;
    border-style: solid;
    border-width: 1px;
border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;


-webkit-box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.75);
box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.75);


}

.chatTopLineWrapper > ul > li > a:hover {
    background-color: transparent;
}

/*Дрожжание меню и текст в меню сверху справа*/
.chatTopLineWrapper > ul > li > ul > li > a {
    color: #333;
	font-size: 9pt;
}
.chatTopLineWrapper > ul > li > ul > li > a:hover {
	background: rgba(212,228,239,1);
background: -moz-linear-gradient(-45deg, rgba(212,228,239,1) 0%, rgba(255,255,255,0.39) 100%);
background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(212,228,239,1)), color-stop(100%, rgba(255,255,255,0.39)));
background: -webkit-linear-gradient(-45deg, rgba(212,228,239,1) 0%, rgba(255,255,255,0.39) 100%);
background: -o-linear-gradient(-45deg, rgba(212,228,239,1) 0%, rgba(255,255,255,0.39) 100%);
background: -ms-linear-gradient(-45deg, rgba(212,228,239,1) 0%, rgba(255,255,255,0.39) 100%);
background: linear-gradient(135deg, rgba(212,228,239,1) 0%, rgba(255,255,255,0.39) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d4e4ef', endColorstr='#ffffff', GradientType=1 );
color: #199DDB;
font-size: 13pt;
transition: .4s linear;
  animation: bounce .6s; 
    text-shadow: -1px 0 1px white, 0 -1px 1px white, 0 1px 1px white, 1px 0 1px white, 0 0 8px white, 0 0 8px white, 0 0 8px white, 2px 2px 3px black;
}

/*Иконки в верхнем правом меню пользователя*/

.msi{
  display: none;
}

@keyframes bounce {
  0%, 100% { 
    transform: translate(0); 
  }
  25% { 
    transform: rotateX(5deg) translateY(2px) rotate(-3deg); 
  }
  50% { 
    transform: translateY(-5px) rotate(3deg) scale(1.1);  
  }
}
/*Коды*/

@-webkit-keyframes progress-bar-stripes {
  from { background-position: 0 0; }
  to { background-position: 40px 0; }
}

@-moz-keyframes progress-bar-stripes {
  from { background-position: 0 0; }
  to { background-position: 40px 0; }
}

@keyframes progress-bar-stripes {
  from { background-position: 0 0; }
  to { background-position: 40px 0; }
}

/*Сколько человек в чате*/
.chatPeopleTitle {
display:none;
}


/*ИКОНКИ НИКОВ В ПРАВОЙ КОЛОНКЕ*/

/*Неизвестная*/
.chatPeople ul.chatPeopleList li a.chatUserSex0 b {
	background-color: transparent;
    background:  url("https://img.icons8.com/?size=1x&id=FCwnhn5MOeF9&format=png") no-repeat scroll 0 0;
background-size: 100% 100%;
border: 0px solid #FF00FF;
position: relative;
}

/*Мужская*/
.chatPeople ul.chatPeopleList li a.chatUserSex1 b {
background-color: transparent;
     background: transparent url("https://img.icons8.com/?size=1x&id=RDvTNzHl9FfD&format=png") no-repeat scroll 0 0;
background-size: 100% 100%;
border-radius: 3%;
position: relative;
}

/*Женская*/
.chatPeople ul.chatPeopleList li a.chatUserSex2 b {
	background-color: transparent;
    background: transparent url("http://tri-svesdy.ru/images/chat_Romaschkovo/zenskaia.png") no-repeat scroll 0 0;
background-size: 100% 100%;
border: 0px solid #FF0000;
position: relative;
}

/*Иконки с ВИПом*/
.chatUserVip {
    background: transparent url("") no-repeat scroll 0 0;
background-size:100% 100%;
background-position: center center;

border-image-width: 0px;
border-image-source: url();
border-image-slice: 30;
border-image-repeat: stretch;
}

/*Корона для админа*/
.adm-icon {
    background: transparent url("https://i.postimg.cc/XvrPjrZF/icon-dp2.gif") no-repeat scroll 0 0;
background-size:100% 100%;
background-position: center center;
border-radius: 5%;
}

/*Щит для модеров*/

.mod-icon {
    background: transparent url("https://i.postimg.cc/wMgFmMvx/nnm.gif") no-repeat scroll 0 0;
background-size:100% 100%;
background-position: center center;
}

/*Нет аватара*/
.chatUserAvatar {
    background: transparent url("https://i.postimg.cc/wBS9g8By/icons8-voprositel'nyj-znak.gif") no-repeat scroll center center;
background-size:100% 100%;
    float: left;
    height: 80px;
    width: 55px;
    overflow: hidden;
}


 /*Фон меню пользователей в правой	 колонке*/
 
.chatPeopleList{
     border-bottom: 0px solid #cde390;
    border-top: 0px solid #cde390;
	color: #fff;
	font-weight: bold;
	 border-radius:7px;
	 
	 transition: .4s linear;
  animation: bounce .6s; 
    text-shadow: -1px 0 1px white, 0 -1px 1px white, 0 1px 1px white, 1px 0 1px white, 0 0 8px white, 0 0 8px white, 0 0 8px white, 2px 2px 3px black;

position: fixed;
z-index:99;

}

.chatPeopleList li.hover{
	background: rgba(212,228,239,1);
background: -moz-linear-gradient(-45deg, rgba(212,228,239,1) 0%, rgba(255,255,255,0.39) 100%);
background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(212,228,239,1)), color-stop(100%, rgba(255,255,255,0.39)));
background: -webkit-linear-gradient(-45deg, rgba(212,228,239,1) 0%, rgba(255,255,255,0.39) 100%);
background: -o-linear-gradient(-45deg, rgba(212,228,239,1) 0%, rgba(255,255,255,0.39) 100%);
background: -ms-linear-gradient(-45deg, rgba(212,228,239,1) 0%, rgba(255,255,255,0.39) 100%);
background: linear-gradient(135deg, rgba(212,228,239,1) 0%, rgba(255,255,255,0.39) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d4e4ef', endColorstr='#ffffff', GradientType=1 );
color: #199DDB;
font-size: 13pt;
transition: .4s linear;
  animation: bounce .6s; 
    text-shadow: -1px 0 1px white, 0 -1px 1px white, 0 1px 1px white, 1px 0 1px white, 0 0 8px white, 0 0 8px white, 0 0 8px white, 2px 2px 3px black;
	    border-color:  #ccc;
    border-style: solid;
    border-width: 1px;
	
border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;


-webkit-box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.75);
box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.75);
}

.chatTabs > ul > li.chatTab.chatTabActive > a, .chatTabs > ul > li.chatTab > a:hover, .chatTabs > ul > li.chatTab > a.active {
    background-color: transparent;
}


/*Время*/
.chatSystemMessage {
    font-style: italic;
    overflow: hidden;
}


.chatTime {
position: absolute;
    right: 12px;
    visibility: hidden;

    color: #1A4877;
    float: right;
    font-size: 10pt;
    font-style: normal;
    padding-right: 18px;
 
    }
	
	
/*НИЖНЯЯ ПАНЕЛЬ ВКЛАДОК ПРИЛОЖЕНИЙ*/

/*ФОН ВСЕЙ ПАНЕЛИ ССЫЛОК*/

.chatSendLinksPanel a {

	color: transparent;
   font-size: 0px;
   height: 20px;

}

 /*РАКСРЫВАЮЩЕСЯ ОКНО СМАЙЛОВ*/

/*Размер и позиция окна смайлов*/
.smilesBox{
padding:0px 5px;
    position: absolute;
    left: -30px;
    height: 250px;
	    width: 78%;
    overflow: auto;
    z-index: 999;
		font-size: 0px;
	 color: transparent;
}

.smilesBox a{
		font-size: 0px;
	 color: transparent;
	 	 transition: .4s linear;
  animation: bounce .6s; 
}

/*Фон окна смайлов*/
.smilesBox{
	font-size: 0px;
	 color: transparent;
background: rgba(212,228,239,1);
background: -moz-linear-gradient(-45deg, rgba(212,228,239,1) 0%, rgba(255,255,255,0.39) 100%);
background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(212,228,239,1)), color-stop(100%, rgba(255,255,255,0.39)));
background: -webkit-linear-gradient(-45deg, rgba(212,228,239,1) 0%, rgba(255,255,255,0.39) 100%);
background: -o-linear-gradient(-45deg, rgba(212,228,239,1) 0%, rgba(255,255,255,0.39) 100%);
background: -ms-linear-gradient(-45deg, rgba(212,228,239,1) 0%, rgba(255,255,255,0.39) 100%);
background: linear-gradient(135deg, rgba(212,228,239,1) 0%, rgba(255,255,255,0.39) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d4e4ef', endColorstr='#ffffff', GradientType=1 );
   border: 2px solid #FFF;
    border-radius:5px;
 box-shadow:4px -4px 15px #999999;
 	 transition: .4s linear;
  animation: bounce .6s; 

    }
   
   

.chatLinkMore { color:transparent;
font-size: 1px;
background: url("https://i.postimg.cc/nzxCQcCQ/icon_plus.png");
   background-position: top 0px left 0;
background-repeat:no-repeat;
background-size: 100% 100%;
 color: transparent;
   padding: 0px 0px 0px 0px;

 text-shadow: 0px 0px 0px #000;
    height: 20px;
    width: 20px;


}
.chatLinkMore:hover {  animation: bounce .6s;

}

	
/*КНОПКА ПЕРЕКЛЮЧЕНИЯ ЗВУКА*/

/*Расположение кнопок*/
.chatSoundPanel {
    background-color: transparent !important;
	position: absolute !important;
right: 20px !important;
top: -28px !important;

 z-index: 98;
 	 transition: .4s linear;
  animation: bounce .6s;
 
}

/*Включен*/
.chatFooter .chatFooterWrapper .chatPanel div.chatSoundPanel a {
color: transparent;
    font-size: 0pt;
   height: 35px !important;
    width: 35px !important;
    background-image: url("http://tri-svesdy.ru/images/chat_Romaschkovo/1vkl.gif");
    background-position: right center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
		 transition: .4s linear;
 
}

.chatFooter .chatFooterWrapper .chatPanel div.chatSoundPanel a:hover{
 animation: bounce .6s;
}

.chatFooter .chatFooterWrapper .chatPanel div.chatSoundPanel a {
color: transparent;
    font-size: 0pt;
   height: 35px !important;
    width: 35px !important;
    background-image: url("http://tri-svesdy.ru/images/chat_Romaschkovo/1vkl.gif");
    background-position: right center;
    background-repeat: no-repeat;
    background-size: 100% 100%;

}

/*Выключен*/
.chatFooter .chatFooterWrapper .chatPanel div.chatSoundPanel a.muted {

  
   color: transparent;
    font-size: 0pt;
 
    height: 35px !important;
    width: 35px !important;
    background-image: url("http://tri-svesdy.ru/images/chat_Romaschkovo/1vykl.png");
    background-position: right center;
    background-repeat: no-repeat;
    background-size: 100% 100%;

}



/*ОКНО ВВОДА СООБЩЕНИЙ*/

.chatInputText {
color: #000;
font-weight:bold;

background-image: url("http://tri-svesdy.ru/images/chat_schanson_plus/1/ramka_otpravki.png");
background-position: bottom 0px left 0;
background-repeat:no-repeat;
background-size: 100% 100%;
    
    box-sizing: border-box;
    height: 22px;
    width: 100%;
    padding:0 5px;
    border: 3px solid #0899E5;
    border-radius:35px 3px 35px 5px;
	 box-shadow: inset 0px 0px 10px 5px rgba(255,255,255,0.7);

 opacity: 0.7;
 transition: opacity 1s ease-in-out;
 -moz-transition: opacity 1s ease-in-out;
 -webkit-transition: opacity 1s ease-in-out;
  }

.chatInputText:hover {
color: #000;
font-weight:bold;

background-image: url("http://tri-svesdy.ru/images/chat_schanson_plus/1/ramka_otpravki.png");
background-position: center center;
background-repeat:no-repeat;
background-size: 100% 150%;
    
    box-sizing: border-box;
    height: 22px;
    width: 100%;
    padding:0 5px;

    border: 3px solid #0899E5;
    border-radius:35px 3px 35px 5px;
	 
  
opacity: 1.0;
 transition: opacity .55s ease-in-out;
 -moz-transition: opacity .55s ease-in-out;
 -webkit-transition: opacity .55s ease-in-out;

}



/*КНОПКА ОТПРАВКИ СООБЩЕНИЙ В ЧАТ*/

.chatFooter .chatFooterWrapper .chatPanel .chatSendButtonPanel .chatSendButton {
    box-sizing: none;
    height: 22px;
    width: 81px;
	border: 0px solid #ccc;

}

.chatFooter .chatFooterWrapper .chatPanel .chatSendButtonPanel .chatSendButton{
color: #fff;
font-weight:bold;
	background-color: transparent;
    background-image: url("http://tri-svesdy.ru/images/chat_Romaschkovo/siniakn.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    border: 3px solid #fff;
    border-radius:35px 3px 35px 5px;
 -webkit-box-shadow:0px 1px 3px #050505, inset 0px 0px 1px #ffffff; 
 -moz-box-shadow: 0px 2px 3px #050505,  inset 0px 1px 1px #ffffff;  
 
    
  }

.chatFooter .chatFooterWrapper .chatPanel .chatSendButtonPanel .chatSendButton:hover{
color: #fff;
font-weight:bold;
	background-color: transparent;
    background-image: url("http://tri-svesdy.ru/images/chat_Romaschkovo/siniaknSV.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    border: 3px solid #fff;
    border-radius:35px 3px 35px 5px;
 -webkit-box-shadow:0px 1px 3px #050505, inset 0px 0px 1px #ffffff; 
 -moz-box-shadow: 0px 2px 3px #050505,  inset 0px 1px 1px #ffffff;  
   		 transition: .4s linear;
  animation: bounce .6s; 
  }
  
  .chatFooter .chatFooterWrapper .chatPanel .chatSendButtonPanel .chatSendButton:active{
color: #fff;
font-weight:bold;
	background-color: transparent;
    background-image: url("http://tri-svesdy.ru/images/chat_Romaschkovo/siniakntemnaia.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    border: 3px solid #fff;
    border-radius:35px 3px 35px 5px;
 -webkit-box-shadow:0px 1px 3px #050505, inset 0px 0px 1px #ffffff; 
 -moz-box-shadow: 0px 2px 3px #050505,  inset 0px 1px 1px #ffffff;  
 
   		 transition: .4s linear;
  animation: bounce .6s; 
    
  }


/*БЛОК ВЫХОДА ИЗ ЧАТА*/
/*КНОПКА ВЫХОДА ИЗ ЧАТА*/
.chatSendExitPanel select {
    background-image: url("http://tri-svesdy.ru/images/chat_Romaschkovo/siniakn.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    border: 3px solid #fff;
    border-radius:35px 3px 35px 5px;
 -webkit-box-shadow:0px 1px 3px #050505, inset 0px 0px 1px #ffffff; 
 -moz-box-shadow: 0px 2px 3px #050505,  inset 0px 1px 1px #ffffff;  
 

}

  .chatSendExitPanel select:hover {
    background-image: url("http://tri-svesdy.ru/images/chat_Romaschkovo/siniakn.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    border: 3px solid #fff;
    border-radius:35px 3px 35px 5px;
 -webkit-box-shadow:0px 1px 3px #050505, inset 0px 0px 1px #ffffff; 
 -moz-box-shadow: 0px 2px 3px #050505,  inset 0px 1px 1px #ffffff;  
 
transition: .9s linear;
  -webkit-animation-name: Tada;
  -moz-animation-name: Tada;
  -o-animation-name: Tada;
  animation-name: Tada;
-webkit-box-shadow: -1px -1px 5px 0px rgba(0,0,0,0.5);
-moz-box-shadow: -1px -1px 5px 0px rgba(0,0,0,0.5);
box-shadow: -1px -1px 5px 0px rgba(0,0,0,0.5);

  animation: bounce .6s; 

}

/*КНОПКА ВХОДА В ЧАТ НА СТРАНИЦЕ ЧАТА*/
     /*Общий фон кнопки*/
	 
/*Сама кнопка*/


#join-chat-button{
    background-image: url("http://tri-svesdy.ru/images/chat_Romaschkovo/siniakn.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    border: 3px solid #fff;
    border-radius:35px 3px 35px 5px;
 -webkit-box-shadow:0px 1px 3px #050505, inset 0px 0px 1px #ffffff; 
 -moz-box-shadow: 0px 2px 3px #050505,  inset 0px 1px 1px #ffffff;  
 
transition: .9s linear;
  -webkit-animation-name: Tada;
  -moz-animation-name: Tada;
  -o-animation-name: Tada;
  animation-name: Tada;


  }
  
  #join-chat-button:hover{
    background-image: url("http://tri-svesdy.ru/images/chat_Romaschkovo/siniaknSV.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    border: 3px solid #fff;
    border-radius:35px 3px 35px 5px;
 -webkit-box-shadow:0px 1px 3px #050505, inset 0px 0px 1px #ffffff; 
 -moz-box-shadow: 0px 2px 3px #050505,  inset 0px 1px 1px #ffffff;  
 
transition: .9s linear;
  -webkit-animation-name: Tada;
  -moz-animation-name: Tada;
  -o-animation-name: Tada;
  animation-name: Tada;
-webkit-box-shadow: -1px -1px 5px 0px rgba(0,0,0,0.5);
-moz-box-shadow: -1px -1px 5px 0px rgba(0,0,0,0.5);
box-shadow: -1px -1px 5px 0px rgba(0,0,0,0.5);

box-shadow:  0px #333;
   		 transition: .4s linear;
  animation: bounce .6s; 

  }
  
   #join-chat-button:active{
    background-image: url("http://tri-svesdy.ru/images/chat_Romaschkovo/siniakn.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    border: 3px solid #fff;
    border-radius:35px 3px 35px 5px;
 -webkit-box-shadow:0px 1px 3px #050505, inset 0px 0px 1px #ffffff; 
 -moz-box-shadow: 0px 2px 3px #050505,  inset 0px 1px 1px #ffffff;  
 
transition: .9s linear;
  -webkit-animation-name: Tada;
  -moz-animation-name: Tada;
  -o-animation-name: Tada;
  animation-name: Tada;
-webkit-box-shadow: -1px -1px 5px 0px rgba(0,0,0,0.5);
-moz-box-shadow: -1px -1px 5px 0px rgba(0,0,0,0.5);
box-shadow: -1px -1px 5px 0px rgba(0,0,0,0.5);

  }
  
    
  /*СТРАНИЦА ВХОДА*/
  
  /*Фон страницы входа*/

.chatFull{color:#20ace3;
font-weight:bold;
}

.chatFull a {
	font-weight:bold;
    color: #ff0000;
}

.chatFull .transparent {
	color:#fff;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
	background-color: transparent;
  background-image: url("картинка"),url("картинка"), url("картинка");
 background-position: top 0 left 0, top 0 right 0, top 0 left 0;
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size:  100% 100%, 70% 70%, 100% 100%;
    opacity: 1;
    z-index: -1;
}

/*Кнопка (морская звезда*/
#join-chat-button2 {
	    height: 80px;
    width: 80px;
	    position: absolute;
    right: 5%;
bottom:20px;
border: 0px solid #ccc;

color:transparent;
    font-size: 10pt;
background-color: transparent;
  background: url(https://i.postimg.cc/hG3vDLBk/R.gif);
  background-repeat: no-repeat;
  background-size:50% 50%;
  background-position:0 0;

box-shadow:  0px #333;
  animation: float_9130 2s linear infinite;
  transform-origin: 50% 50%;
}

@keyframes float_9130 {
  0% { transform: translateY(0) }
  50% { transform: translateY(-6px) }
  100% { transform: translateY(0) }
}

#join-chat-button2:hover {
	    height: 80px;
    width: 80px;
	    position: absolute;
    right: 5%;
bottom:20px;
border: 0px solid #ccc;

color:transparent;
    font-size: 10pt;
background-color: transparent;
  background: url(https://i.postimg.cc/hG3vDLBk/R.gif);
  background-repeat: no-repeat;
  background-size:50% 50%;
  background-position:0 0;
cursor: pointer;
box-shadow:  0px #333;
  animation: bounce .6s; 
}

#join-chat-button2:active {
	    height: 80px;
    width: 80px;
	    position: absolute;
    right: 5%;
bottom:20px;
border: 0px solid #ccc;
cursor: pointer;
color:transparent;
    font-size: 10pt;
background-color: transparent;
  background: url(https://i.postimg.cc/hG3vDLBk/R.gif);
  background-repeat: no-repeat;
  background-size:50% 50%;
  background-position:0 0;

box-shadow:  0px #333;
}

.user2853576 {
    background: transparent url("https://i.postimg.cc/nzxCQcCQ/icon_plus.png") no-repeat scroll 0px 0px / 15px 16px;
    padding-left: 20px;
    padding-bottom:0px;
    
}

.chatHeader .chatTitle:after { --duration: 18s; content: '#ВераНадеждаЛюбвь'; font-size: 1.2rem; position: absolute; top: 14px; margin-left: 30px; width: 500px; white-space: nowrap; overflow: hidden; animation: typing var(--duration) infinite; text-shadow: none } @keyframes typing { 0% { width: 0 } 100% { color: #FFFFFF}