чат тик так

* шапка чата-01 */
.chatHeader {
background-image: /*АДРЕС КАРТИНКИ С НАЗВАНИЕМ ЧАТА*/url(https://i.ibb.co/gwpJFn5/text.gif), url(https://i.gifer.com/IrM.gif);
background-position: center, 0px;
background-repeat:no-repeat;
background-color: # 0000CC;
font-size: 0pt;
border-radius: 0px;
}
*СКОЛЬКО ЛЮДЕЙ В ЧАТЕ-04*/
.chatPeople .chatPeopleTitle {
color: #0000ff;
font-size: 12pt;
text-shadow: 2% 0 0 #ff0000;
margin: 14px 0 4px 8px;

}.chatPeople .chatPeopleTitle {
-webkit-animation: blink 2s linear infinite;
animation: blink 2s linear infinite;
}
@-webkit-keyframes blink {
50% { color: rgb(34, 34, 34); }
51% { color: rgba(34, 34, 34, 0); }
100% { color: rgba(34, 34, 34, 0); }
}
@keyframes blink {
50% { color: rgb(34, 34, 34); }
51% { color: rgba(34, 34, 34, 0); }
100% { color: rgba(34, 34, 34, 0); }
}


/*Цвет текста и размер названий вкладок-5*/
.chatTabs > ul > li > a {

font-size: 10pt;font-family: Comic Sans MS, monospace;
color:#0000ff;

text-shadow: 0px 0px 0px #0000ff;
}
.chatTabs > ul > li > a{
-webkit-animation: blink5 2s linear infinite;
animation: blink5 2s linear infinite;
}
@-webkit-keyframes blink5 {
0% { color: rgb(128, 0, 0); }
50% { color: rgb(183, 65, 14); }
100% { color: rgb(128, 0, 0); }
}
@keyframes blink5 {
0% { color: rgb(128, 0, 0); }
50% { color: rgb(183, 65, 14); }
100% { color: rgb(128, 0, 0); }
}/*РАЗМЕР НИЖНИХ ССЫЛОК-06*/
.chatFooter .chatFooterWrapper .chatPanel .chatSendLinksPanel {
position: absolute;
left: 16px;
top: 7px;
font-weight: normal;
font-size: 12pt;
z-index: 99;
}
/*КНОПКА ОНЛАЙН-07*/
.chatSendExitPanel select {
display: inline-block;
width: 100px;
height: 23px;
line-height: 20px;
font-size: 15px;
text-align: center;
text-decoration: none;
text-shadow: 0 1px rgba(255,255,255,.2), 0 -1px rgba(0,0,0,.8);
outline: none;
border: none;
border-radius: 100px;
background: rgb(28,107,114) radial-gradient(150% 100% at 50% 5px, rgba(255,255,255,.2), rgba(0,0,0,0));
box-shadow: inset rgba(0,0,0,.6) 0 -2px 5px, inset rgba(252,255,255,.7) 0 2px 5px, rgba(0,0,0,.8) 0 2px 5px -1px;
color: rgb(0,79,86);
user-select: none;
}
.chatSendExitPanel select:hover {
color: rgb(0,59,66);
cursor: pointer;
}
.chatSendExitPanel select:active {
padding-bottom: 1px;
box-shadow:
inset rgba(0,0,0,1) 0 1px 3px,
inset rgba(0,0,0,.6) 0 -2px 5px,
inset rgba(252,255,255,.7) 0 2px 5px,
0 1px rgba(255,255,255,.08);
color: rgb(128,207,214);
}
/*КНОПКА-ОТПРАВИТЬ-08*/
.chatSendButton {
display: inline-block;
width: 100px;
height: 25px;
line-height: 20px;
font-size: 15px;
text-align: center;
text-decoration: none;
text-shadow: 0 1px rgba(255,255,255,.2), 0 -1px rgba(0,0,0,.8);
outline: none;
border: none;
border-radius: 100px;
background: rgb(28,107,114) radial-gradient(150% 100% at 50% 5px, rgba(255,255,255,.2), rgba(0,0,0,0));
box-shadow: inset rgba(0,0,0,.6) 0 -2px 5px, inset rgba(252,255,255,.7) 0 2px 5px, rgba(0,0,0,.8) 0 2px 5px -1px;
color: rgb(0,79,86);
user-select: none;
}
.chatSendButton :hover {
color: rgb(0,59,66);
cursor: pointer;
}
.chatSendButton :active {
padding-bottom: 1px;
box-shadow:
inset rgba(0,0,0,1) 0 1px 3px,
inset rgba(0,0,0,.6) 0 -2px 5px,
inset rgba(252,255,255,.7) 0 2px 5px,
0 1px rgba(255,255,255,.08);
color: rgb(128,207,214);
}
/*КНОПКА ЧАТА В ШАПКЕ-09*/
.chatHeader .chatTopLine {
position: fixed;
display: inline-block;
color: #777674;
font-weight: bold;
text-decoration: none;
text-shadow: rgba(255,255,255,.5) 1px 1px, rgba(100,100,100,.3) 3px 7px 3px;
user-select: none;
padding: 0,5em 0,5em;
outline: none;
border-radius: 3px / 100%;
background-image:
linear-gradient(45deg, rgba(255,255,255,.0) 30%, rgba(255,255,255,.8), rgba(255,255,255,.0) 70%),
linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0) 20%, rgba(255,255,255,0) 90%, rgba(255,255,255,.3)),
linear-gradient(to right, rgba(125,125,125,1), rgba(255,255,255,.9) 45%, rgba(125,125,125,.5)),
linear-gradient(to right, rgba(125,125,125,1), rgba(255,255,255,.9) 45%, rgba(125,125,125,.5)),
linear-gradient(to right, rgba(223,190,170,1), rgba(255,255,255,.9) 45%, rgba(223,190,170,.5)),
linear-gradient(to right, rgba(223,190,170,1), rgba(255,255,255,.9) 45%, rgba(223,190,170,.5));
background-repeat: no-repeat;
background-size: 200% 100%, auto, 100% 2px, 100% 2px, 100% 1px, 100% 1px;
background-position: 200% 0, 0 0, 0 0, 0 100%, 0 4px, 0 calc(100% - 4px);
box-shadow: rgba(0,0,0,.5) 3px 10px 10px -10px;
}
.chatHeader .chatTopLine:hover {
transition: .5s linear;
background-position: -200% 0, 0 0, 0 0, 0 100%, 0 4px, 0 calc(100% - 4px);
}
.chatHeader .chatTopLine:active {
top: 1px;
}/*КНОПКА ВХОД В ЧАТ-10*/
#join-chat-button,#join-chat-button2 { color: #000000;font-family: Monotype Corsiva; padding: 10px; font-size: 15px; border-radius: 5px; box-shadow: 0px 1px 3px; position: relative; box-sizing: border-box; transition: all 500ms ease-out; } #join-chat-button,#join-chat-button2:hover { box-shadow: 0px 0px 0px 2px #ee105a, 0px 0px 0px 7px #a7f9c9, 0px 0px 0px 9px #f90914, 0px 0px 5px 10px #ff4d00; }

/*ФОНОВАЯ КАРТИНКА ПРИ ВХОДЕ В ЧАТ-11*/
.transparent { background-image: url(https://images.wallpaperscraft.ru/image/para_tanec_nebo_noch_derevo_siluety_oblaka_zvezdy_57095_1280x720.jpg) } .content { background-image: url(https://s8.hostingkartinok.com/uploads/images/2018/02/3ab0ee0b5d690d165e7e4b59fa1ae89b.gif); background-position:bottom center; background-repeat:no-repeat; }

/*КНОПКИ ОБЩИЙ И ПРИВАТ-12*/
.chatTabs > ul > li.chatTab > a {
color:#0080FF;
border-radius:3px/100%;

background-color: transparent;
background-image:
linear-gradient(45deg, rgba(255,255,255,.0) 30%, rgba(255,255,255,.8), rgba(255,255,255,.0) 70%),
linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0) 20%, rgba(255,255,255,0) 90%, rgba(255,255,255,.3)),
linear-gradient(to right, rgba(125,125,125,1), rgba(255,255,255,.9) 45%, rgba(125,125,125,.5)),
linear-gradient(to right, rgba(125,125,125,1), rgba(255,255,255,.9) 45%, rgba(125,125,125,.5)),
linear-gradient(to right, rgba(223,190,170,1), rgba(255,255,255,.9) 45%, rgba(223,190,170,.5)),
linear-gradient(to right, rgba(223,190,170,1), rgba(255,255,255,.9) 45%, rgba(223,190,170,.5));
background-repeat: no-repeat;
background-size: 200% 100%, auto, 100% 2px, 100% 2px, 100% 1px, 100% 1px;
background-position: 200% 0, 0 0, 0 0, 0 100%, 0 4px, 0 calc(100% - 4px);
transition: .9s linear;
box-shadow: -6px 6px 7px -5px #333;
}

.chatTabs > ul > li.chatTab.chatTabActive > a, .chatTabs > ul > li.chatTab > a:hover,
.chatTabs > ul > li.chatTab > a.active {
color:#ff0000;
border-radius:3px/100%;

background-color:#E6E6E6 ;
background-image:
linear-gradient(45deg, rgba(255,255,255,.0) 30%, rgba(255,0,0,.8), rgba(255,255,255,.0) 70%),
linear-gradient(to right, rgba(255,255,255,1), rgba(255,0,0,0) 20%, rgba(255,255,255,0) 90%, rgba(255,255,255,.3)),
linear-gradient(to right, rgba(125,125,125,1), rgba(30,144,255,.9) 45%, rgba(125,125,125,.5)),
linear-gradient(to right, rgba(125,125,125,1), rgba(30,144,255,.9) 45%, rgba(125,125,125,.5)),
linear-gradient(to right, rgba(223,190,170,1), rgba(30,144,255,.9) 45%, rgba(223,190,170,.5)),
linear-gradient(to right, rgba(223,190,170,1), rgba(30,144,255,.9) 45%, rgba(223,190,170,.5));
background-repeat: no-repeat;
background-size: 200% 100%, auto, 100% 2px, 100% 2px, 100% 1px, 100% 1px;
background-position: 200% 0, 0 0, 0 0, 0 100%, 0 4px, 0 calc(100% - 4px);
transition: .9s linear;
box-shadow: -6px 6px 7px -5px #333;
}
/*ФОН НИКОВ-13*/
.chatMain .chatUserFrom, .chatPeople ul.chatPeopleList li a.chatUser {
color: #031961;

background-image: url("https://i.gifer.com/origin/a4/a4fb1ab272da13569b081edaea1b2586_w200.webp");
background-position: right 0 bottom 0;
background-repeat: no-repeat;
border-radius: 2px;
background-size: 100% auto;
}.chatMessageToMe .chatToUser {

padding: 0px 10px 0px 10px;
background-image: transparent;
background-color: transparent;
color: blue;

}
/*ПАНЕЛЬ НАСТРОЙКИ ПРОФИЛЯ-14*/
.chatTopLineWrapper ul {background-image: url("http://333v.ru/uploads/eb/ebb2dcad196e012713374a9a61230fc8.jpg"); Monotype Corsiva;border-radius:25px 25px 25px 25px;color: #00ff00;
font-style: normal;
font-size: 10pt;
}
/*ОБВОДКА НИКА РАМОЧКОЙ-15*/
.chatPeople ul.chatPeopleList li { text-shadow: 0px 1px 0 #000; background-color: transparent; background-image: url(" "); background-position: right 0 bottom 0; background-repeat: no-repeat; background-size: 150% auto; border: 2px solid #fff; border-radius: 8px; box-shadow:1px 1px 6px #000,-1px -1px 1px #fff; }.chatTabs ul { text-shadow: 0px 1px 0 #000; background-color: transparent; background-image: url(""); background-position: right 0 bottom 0; background-repeat: no-repeat; background-size: 100% auto; border: 2px solid #fff; border-radius: 5px; box-shadow:1px 1px 6px #000,-1px -1px 1px #fff; }.chatPeople ul.chatPeopleList li .chatUserMenu .chatUserMenuItems ul {
background-image: url(https://s8.hostingkartinok.com/uploads/images/2018/01/76e7891a17885a125206ae444aed3cf4.jpg);
list-style-type:none;
margin:0;
padding:0;
width:100%;
overflow:hidden;
border-radius: 30px 15px 30px 15px;
box-shadow: 0px 0px 5px 5px #ffe799 inset;
}.chatPeople ul.chatPeopleList li {
margin:0;
padding:3px 0 0 3px;
border-top:1px solid transparent;
border-bottom:1px solid transparent;
*zoom:1;
font-family: Monotype Corsiva;
font-style: normal;
font-size: 12pt;
}.chatPopupMenuDiv1, .chatPopupMenuDiv2, .chatPeople ul.chatPeopleList li.hover {
background-image: url(https://i.gifer.com/UB7D.gif);
background-position: center center;
background-repeat:no-repeat;
background-size: 100% 100%;
font-family: Monotype Corsiva;
font-style: normal;
font-size: 12pt;
padding:5px 0px 0px 10px;
border: 1px solid #;
border-radius:30px 15px 30px 15px;
box-shadow: 0 0 1px #fff, 0 0 2px #fff, 0 0 3px #fff, 0 0 4px #c79900, 0 0 5px #ffe799, 0 0 6px #ffe799, 0 0 7px #ffe799, 0 0 10px #ffe799;
}
/*РАМКА НА СМАЙЛЫ-16*/
.chatPopupMenuDiv1 {

background: linear-gradient(168deg, #3060a0, #a3cddd, #afefbf);
border-radius: 0px;
}.chatPopupMenuDiv2 {

background: linear-gradient(168deg, #3060a0, #a3cddd, #afefbf);
height: 100px;
margin-left: 10px;
border-radius: 0px;
}.smilesBox p {

font-size: 18pt;
margin-left: 20pt;
margin-bottom: 0pt;
color: #ffffcc;
}.smilesBox {

background-image:url(https://images.wallpaperscraft.ru/image/zvezdy_zvezdnoe_nebo_tumannost_173576_1280x720.jpg);
width: 65%;
margin-left: -15pt;
border-radius: 0px;
}
.chatUserVip {
background: transparent url("https://s8.hostingkartinok.com/uploads/images/2018/02/e9e2eaeb08617b304fd53b733234d6cb.gif") no-repeat scroll 0 0;
background-size:100% 100%;
background-position: center center;

border-image-width: 2px;
border-image-source: url(https://s8.hostingkartinok.com/uploads/images/2018/02/e9e2eaeb08617b304fd53b733234d6cb.gif);
border-image-slice: 30;
border-image-repeat: stretch;
}