/*Всем жирный шрифт*/ 
.chatMessage{ font-weight: Bold Italic; }

/*Шапка чата*/
.chatHeader{
    height:45px;
    width:100%;
    position: relative;
    opacity:1; /*Прозрачность шапки*/
    background-color: transparent;
    background-image:  url(""), url(""), url("https://imgs.su/upload/753/2945071151.jpg");  
    background-position: bottom 0px left 5px,  bottom 1px left 40%, bottom  center;
    background-repeat: no-repeat, no-repeat,repeat ;
-webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
       -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
            box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    -webkit-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
       -moz-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
            box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px 

}
.chatHeader .chatTitle {
  display: none;
  
}

/*Футер*/
.chatFooter {
    background-image: url("");
    background-position: center center; 
    background-repeat:no-repeat; 
    background-size: 100% 100%;
}

.chatFooter { border-radius: 15px 15px 15px 15px;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;}

/*Выделение сообщения для ника*/
.chatMessageToMe .chatToUser {
    padding: 0px 10px 0px 10px;
    background: black;
    position: relative;
    -webkit-animation-name: myfirst;
    -webkit-animation-duration: 5s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: 4s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
    -webkit-animation-play-state: running;
    animation-name: myfirst;
    animation-duration: 5s;
    animation-timing-function: linear;
    animation-delay: 0s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-play-state: running;
    border-radius: 10px;
}

/*Меню*/
.chatMain.chatTopLine {background-color:transparent;
 border: 0px solid #FEF;
font-family:Georgia;
 color: #fff;
text-shadow: 0 1px #000, 0 1px #32231c;
    font-size: 12px;
}
/*Общий фон*/
.chatTopLine{background-color:transparent;
 background-image:url("https://vmeste.eu/news?read=7533166");
     background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
 border-image-width: 2px;
border-image-source: url(" ");
border-image-slice: 30;
border-image-repeat: stretch;   
border-radius: 5px;
 box-shadow: 0 0 2px #B1F4F8, 0 0 4px #B1F4F8, 0 0 6px #fff, 0 0 8px #fff, 0 0 10px #fff;
}
/*Активный фон*/
.chatTopLineWrapper > ul > li > a:hover {background-color:transparent;
    background-image: url("https://imgs.su/upload/753/3355428001.jpg");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
color: #fff;
      border-image-width: 0px;
border-image-source: url("");
border-image-slice: 30;
border-image-repeat: stretch;
border-image-radius: 15px;
border-radius: 5px;
     box-shadow: 0 0 2px #B1F4F8, 0 0 4px #B1F4F8, 0 0 6px #fff, 0 0 8px #fff, 0 0 10px #fff;

}
/*Фон вкладок*/
.chatTopLineWrapper ul li ul {

      background-image:url(""), url(""), url("https://imgs.su/upload/753/3739547104.jpg"); 
    background-position:bottom 0 right -20px, top 0px right 60%, top 0 right 0;
    background-repeat:no-repeat, no-repeat, no-repeat ;
    background-size:auto 80%, auto 15%, 200% 100%;
  
padding: 30px 30px 30px 30px;
	
-webkit-transition: all 1s ease-in-out;
        -moz-transition: all 1s ease-in-out;
        -o-transition: all 1s ease-in-out;
        -ms-transition: all 1s ease-in-out;
        transition: all 1s ease-in-out;

border-radius: 5px;

  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), -23px 0 20px -23px rgba(0, 0, 0, 0.8), 23px 0 20px -23px rgba(0, 0, 0, 0.8), 0 0 40px rgba(0, 0, 0, 0.1) inset;

}

/*Фон краёв меню*/
.chatTopLineWrapper > ul > li > ul > li > a:hover {
    background-color:  transparent;
background-image: url("https://imgs.su/upload/753/3739547104.jpg");
     background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;

border-image-width: 1px;
border-image-source: url("");
border-image-slice: 30;
border-image-repeat: stretch;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), -23px 0 20px -23px rgba(115, 110, 110, 0.8), 23px 0 20px -23px rgba(115, 110, 110, 0.8), 0 0 40px rgba(255, 255, 255, 0.1) inset;
}

/*Текст меню*/
.chatTopLineWrapper > ul > li > ul > li > a{
font-family:Comic Sans MS;
font-size: 10pt;

color:#000;
text-shadow: 0px 0px 0 #000;
 }

/*Юзер меню при наведении*/
.chatPeople ul.chatPeopleList li:hover {
    background-color:#a3bae4;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    border: 0px solid #91623b;
    border-radius: 3px;
    box-shadow: inset rgba(0, 0, 0, 0.6) 0 -3px 3px, inset rgba(89, 123, 184, 0.7) 0 3px 3px, rgba(163, 186, 228, 0.8) 0 3px 3px -3px; }

/*Курсор*/
/*Курсор*/ #.chat { cursor: url(https://imgs.su/upload/765/1660188399.png ), default; }
/*Курсор-2*/
.chat{
cursor: url("https://imgs.su/upload/765/1660188399.png"), default; 
}
a, input[type="button"], input[type="submit"], .chatUserFrom, .buttons > div { 
cursor: url("https://imgs.su/upload/765/1660188399.png"), default !important; 
}

/*Полоса */
.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: 1px solid #0D23C5;
    border-radius: 5px;
    box-shadow: /1px 1px 6px #000,-1px -1px 1px #fff/;
}

/*Общий и приват*/
.chatTabs > ul > li.chatTab.chatTabActive > a, .chatTabs > ul > li.chatTab > a:hover, 
.chatTabs > ul > li.chatTab > a.active {
 padding:0px 5px;  
 border:solid 1px #042a6b; 
 -webkit-border-radius:4px;
 -moz-border-radius:4px; 
 border-radius: 3px; 
 font-weight:bold; 
 color:#ffffff; 
background-color: transparent;
border: 0px solid #a0ca2d;
background-image: url("https://vmfile.com/upload/772/1723265922.png");  
    background-position: top 0 left 0;
    background-repeat: no-repeat;
    background-size:100% 100%; 
transition: .9s linear;
}
/*Настройка кнопок комнат*/
.chatTabs > ul > li.chatTab > a{
text-decoration:none; text-align:center; 
 padding:0px 5px; 
 border:solid 0px #042a6b; 
font-family: "Bona Nova", serif;
 color:#ffffff; 
background-color: transparent;
border: 0px solid #a0ca2d;
}

/*Время*/
.chatTime {
    float: left;
    color: #000;
    font-family: Arial Black;
    font-style: italic;
    font-size: 10pt;
    visibility: inherit;
}

/*Параметры верхних ссылок*/
.chatTabs ul li a {
    color: #000;
    font-family: 'Arial Black' !important;
    font-size: 15px!important;
    font-weight: bolder;
    border-radius: 12px;
}

/*Сколько человек в чате*/

.chatPeople .chatPeopleTitle{
    margin: 10px 0 0 0;
}
.chatPeople .chatPeopleTitle{
    height:22px;
    width:179px;
}
.chatPeople .chatPeopleTitle {
    background-image: url("");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 179px;    
    font-size: 10pt;    
    padding: 0 5px 0 10px;
}
.chatUsersCount::after {
    content: " ";
    right: 0px;
}

/*Ники с права в овале*/
.chatPeople ul.chatPeopleList li a.chatUser {
       background-image: url("https://imgs.su/upload/753/3355428001.jpg");
       padding:0 10px 0 10px;
       border: 3px solid #8da6d4;
       border-radius:35px 5px 35px 5px;
       color: #a3bae4;
       font-family: Monotype;
       font-style: normal;
       font-size: 12pt;
}

/*Круглые иконки ников*/
.chatUserIcon {
     background-color: #a3bae4;
     border-radius: 10px;
     border: 2px solid #8da6d4;
     margin: 1px 2px 1px -2px;
}

/*Окантовка чата*/
.chat {
text-shadow: 0px 0px 0 #000;
background-color: transparent;
background-image: url("");
background-position: right 0 bottom 0;
background-repeat: no-repeat;
background-size: 100% auto;

border: 5px solid #fff;
border-radius: 10px 10px 10px 10px;/*настройка радиуса*/

 box-shadow:1px 1px 6px #000,-1px -1px 1px #fff;
}

/*Обводка вход в чат*/
.chatSpecifyPassword input[type="text"] {
    background-color: #a3bae4;
    border: 1px solid #8da6d4;
    box-sizing: border-box;
    border-radius: 5px;
    padding: 5px 4px;
    width: 100%;
    box-shadow: margin: 1em auto;
    padding: 1em;
    border: 3px dashed #8da6d4;
    box-shadow: 0 0 0 1px #a3bae4, inset 0 0 0 1px #5FAEB0;
}

/*Параметры строчек*/
.chatMain .chatMessages .chatMessage,
.chatMain .chatPrivateMessages .chatMessage {
  margin-top: 7px; /*Расстояние строчек*/
  margin-right: 5px;
  margin-bottom: 3px;
  padding: .25rem;
  padding-left: 1rem;
  font-weight: 500;
  border: 3px dotted rgba(119, 153, 212, 0.9);
  border-radius: 7px;
  background-color: rgba(163, 186, 228, 0.3);
}

/*Кнопки отправить и онлайн*/
.chatSendExitPanel select {
  position: relative;
  color: black;
  font-weight: bold;
  text-decoration: none;
  text-shadow: /-3px -1px #000/;
  user-select: none;
  padding: 0em 0em;
  outline: none;
  background-color: #a2b9e3;
  background-image: linear-gradient(45deg, rgba(255,255,255,.0) 30%, rgba(255,255,255,.8), rgba(255,255,255,.0) 70%), radial-gradient(190% 100% at 50% 0%, rgba(255,255,255,.7) 0%, rgba(255,255,255,.5) 50%, rgba(0,0,0,0) 50%);
  background-repeat: no-repeat;
  background-size: 200% 200%, auto;
  background-position: 200% 0, 0 0;
  box-shadow: rgba(0,0,0,.3) 0 2px 5px;
} 
.chatSendExitPanel select:active {
  top: 1px;
  box-shadow: none;
}
.chatSendExitPanel select:hover {
  transition: .5s linear;
  background-position: -200% 0, 0 0;
}
.chatSendButton {
  position: relative;
  color: black;
  font-weight: bold;
  text-decoration: none;
  text-shadow: /-3px -1px #000/;
  user-select: none;
  padding: 0em 0em;
  outline: none;
  background-color: #a2b9e3;
  background-image: linear-gradient(45deg, rgba(255,255,255,.0) 30%, rgba(255,255,255,.8), rgba(255,255,255,.0) 70%), radial-gradient(190% 100% at 50% 0%, rgba(255,255,255,.7) 0%, rgba(255,255,255,.5) 50%, rgba(0,0,0,0) 50%);
  background-repeat: no-repeat;
  background-size: 200% 200%, auto;
  background-position: 200% 0, 0 0;
  box-shadow: rgba(0,0,0,.3) 0 2px 5px;
} 
.chatSendButton:active {
  top: 1px;
  box-shadow: none;
}
.chatSendButton:hover {
  transition: .5s linear;
  background-position: -200% 0, 0 0;
}

/* Онлайн оффлайн цвет */
 option[value="ONLINE"] {
	background: #4caf50;
	color: #fff;
}
 option[value="AWAY"],
 option[value="CUSTOM"],
 option[value="DND"] {
	background: rgba(230, 230, 250.85);
	color: #a3bae4;
}
 option[value="EXIT"] {
	background: #990000;
	color: #fff;
}

/*Кнопка звук вкл выкл*/
.chatFooter .chatFooterWrapper .chatPanel div.chatSoundPanel a.muted {
    background-image: url("https://imgs.su/upload/765/507635869.png");
color: black;
font-weight: bold;
padding: 0px 5px 0px 21px;
border-radius: 2px;
box-shadow: 0 0 2px #B1F4F8, 0 0 4px #B1F4F8, 0 0 8px #B1F4F8, 0 0 16px #2F2BAD, 0 0 32px #2F2BAD;
}

.chatFooter .chatFooterWrapper .chatPanel div.chatSoundPanel a {
    background: transparent url("https://imgs.su/upload/765/896318302.png") no-repeat scroll 0 0;
    float: right;
    font-size: 8pt;
color: red;
font-weight: bold;
    font-weight: normal;
    height: 16px;
    padding: 0px 5px 0px 21px;
    text-decoration: none;
border-radius: 2px;
box-shadow: 0 0 2px #B1F4F8, 0 0 4px #B1F4F8, 0 0 8px #B1F4F8, 0 0 16px #2F2BAD, 0 0 32px #2F2BAD;
}

/*Кнопка входа в чат*/
#join-chat-button,
#join-chat-button2 {
   background-color: #a2b9e3; 
   box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
    transition: .3s;
}
#join-chat-button:hover,
#join-chat-button2:hover {
  background-color: #a2b9e3;  
  box-shadow: 0px 15px 20px rgba(0, 0, 0, 0.4);
    transform: translateY(-3px);
  }

/*Статус пользователя*/
.chatUserAway[title="Отошел"] .chatUserWrapper span{
     display: none;
}

.chatUserAway[title="Отошел"] .chatUserWrapper::after {
     content: "* Отошел *";
     font-style: italic;
     font-weight: 800;
     color: #4654d4;
     margin-left: -18px;
}

.chatUserAway[title="Не беспокоить"] .chatUserWrapper span{
     display: none;
}

.chatUserAway[title="Не беспокоить"] .chatUserWrapper::after {
     content: "* Не беспокоить *";
     font-style: italic;
     font-weight: 800;
     color: #FF0000;
     margin-left: -18px;
}

/*Добавить на свой сайт*/
#chatMainMenuChat > li:nth-child(7) {
     display: none;
}

/*Нижняя панель*/
.chatSendLinksPanel a.chatLinkSmiles { color: black;
background: transparent url("") no-repeat scroll 0 0;
font-weight: bold;
    padding: 2px 5px 2px 5px;
border-radius: 2px;
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.8) inset;
    display: 
}

.chatSendLinksPanel .chatLinkImage { color: black;
background: transparent url("") no-repeat scroll 0 0;
font-weight: bold;
    padding: 2px 5px 2px 5px;
border-radius: 2px;
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.8) inset;
    display: 
}

.has-user-id .chatLinkProfile { color: black;
background: transparent url("") no-repeat scroll 0 0;
font-weight: bold;
    padding: 2px 5px 2px 5px;
border-radius: 2px;
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.8) inset;
    display: 
}

.chatLinkGold { color: black;
background: transparent url("") no-repeat scroll 0 0;
font-weight: bold;
    padding: 2px 5px 2px 5px;
border-radius: 2px;
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.8) inset;
    display: 
}

.chatLinkVip {
    background: transparent url("https://imgs.su/upload/765/3423045562.png") no-repeat scroll 0 0;
 color: #FF1493;
    padding: 0px 5px 0px 21px;
    display:
}

.chatLinkModerate {
    background: transparent url("https://imgs.su/upload/765/3575428859.png") no-repeat scroll 0 0;
    background-size: auto  110%;
    margin-right: 7px !important;
    width: 26px;
    
}

.chatLinkMore { color: black;
font-weight: bold;
    padding: 2px 5px 2px 5px;
border-radius: 2px;
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.8) inset;
    display: 
}

/*Текстовое окно*/
.chatSendText.chatInputText {
    	background-clip: content-box;
                  font-family:Georgia;
    	background: rgba(175, 238, 238, 0.3);
	border: 1px solid #3b83bd !important;
                  font-weight: bolder;
                  border-radius: 5px;
    	font-size: 16px;
	height: 20px;
    	padding-left:3px;
}
.chatSendText.chatInputText:focus {
    	background: rgba(175, 238, 238, 0.3);
    	border-color: #3b83bd;
	border:3px double rgba(120, 133, 139, 1);
                  font-weight: bolder;
    	outline: 0 !important;
}
.chatSetupNickname {
    	position: absolute;
    	left: 50%;
	width:200px;
	margin-left:-75px;
                  line-height: 65px;
    	top: 0;
}

/*Размеры кнопок нижнего меню*/
.chatSendLinksPanel a.chatLinkSmiles {font-size:12pt;/*"смайлы"*/}
.chatSendLinksPanel .chatLinkImage {font-size:12pt;/*"медиа"*/}
.chatLinkProfile {font-size:12pt;/*"мой профиль"*/}
.chatLinkGold {font-size:12pt;/*"счет"*/}
.chatLinkMore {font-size:12pt;/*"еще"*/
}

/*Верхняя панель ссылок*/
.chatTabs ul li.appTab { color: black;
font-weight: bold;
    padding: 1px 1px 1px 5px;
border-radius: 2px;
box-shadow: 1px 1px 1px 2px rgba(0, 0, 0, 0.8) inset;}
.chatSendExitPanel select:active {
  top: 1px;
  box-shadow: none;
}
.chatSendExitPanel select:hover {
  transition: .5s linear;
  background-position: -200% 0, 0 0;
}

/*Своя иконка верхней панели ссылок*/
.chatTabs ul li.appTab a {
    background-color: transparent;
    background-image: url(https://imgs.su/upload/765/1354896493.png) !important;
    background-position: 4px 4px;
    background-repeat: no-repeat;
    background-size: 16px;
}

/*Верхние ссылки приложений при наведении*/
.chatTabs ul li.appTab:hover {box-shadow: inset rgba(0, 0, 0, 0.6) 0 -3px 8px, inset rgba(89, 123, 184, 0.7) 0 3px 3px, rgba(59, 88, 143, 0.8) 0 3px 3px -3px; }
.chatTabs ul li.appTab {background:url('https://imgs.su/upload/753/1501358383.jpg');



Копирование дизайна строго запрещено, будет караться кровяным гемороем и раком сердца!!!