/*
Theme Name: School template ChaTemplate
Theme URI: https://madeas.ru/product/school-template/
Author: Andrej Sharapov 
Author URI: https://madeas.ru/ 
Description: School template ChaTemplate is an evolving project where you can find an interesting template to improve your favorite chatovod chat service, and also join a huge community of users who want to transform their chat. 
Version: 1.0.0

License: GNU General Public License v2 or later 
License URI: http://www.gnu.org/licenses/gpl-2.0.html 
Text Domain: school-template
Tags: madeas, chatemplate, design, template, chatovod, school-template, chat-colors, chat, full-width-template, new-web-design, madeas.ru, andrej-sharapov

This theme, like Chatovod, is licensed under the GPL. 
Use it to make something cool, have fun, and share what you've learned with others. 
*/

.chat {
  border: 7px solid #704214;
  font-family: Comic Sans MS;
}
.chatHeader {
  border-bottom-color: #704214;
}
.chatTitle {
  text-shadow:none!important;
  font: 14pt bold;
}
.chatTopLineWrapper ul > li > a {
  text-shadow:none!important;
  transition: .3s linear;
}
.chatTopLineWrapper ul > li > a:hover {
  background-color: rgba(0,0,0,.6);
}
.chatFooter {
  border-top: 4px solid #704214;
}
.chatHeader .chatTopLine {
  border-color: transparent;
  background-color:transparent;
  border: 0; 
}
.chatHeader,
.chatFooter,
.chatTabs,
.chatPeople {
  box-shadow:
   0 0 1px rgba(0,0,0,.5) inset,
   0 2px 3px rgba(0,0,0,.5) inset,
   0 1px 1px rgba(255,255,255,.1);
}

.chatTabsRight {
  right: 5px;
}
.chatTabsLeft {
  left: 5px;
}

.chat,
.chat a,
.chatSpecifyPassword input[type=text] {
  font-style: italic;
}
.transparent,
.chatMain,
.chatFooter,
.chatHeader {
  background: #004d20 url(http://madeas.usite.pro/ChaTemplate/bg/school.png) 0 0 no-repeat;
  background-size: cover;
}

.chatMain {
  color:#fff;
  font-weight:600;
}
.chatSendText,
.chatInputText,
.chatSpecifyPassword input[type=text] {
  border:0;
  background: transparent url(http://madeas.usite.pro/ChaTemplate/img/pencil.png) no-repeat 0 0 / 16px 16px;
  border-bottom:2px solid #704214;
  transition:.3s linear;
}
.chatSendText:focus,
.chatInputText:focus {background:#f4f4f4;}
.chatSpecifyPassword input[type=text] {
  padding-left:21px;
}
.chatSendText,
 select,
.chatInputText,
#sign-in-label a, 
.dialog-buttons button,
input[type="button"],
input[type="submit"],
input[type="text"]  {
  outline:none;
}
.chatSendButton,
 select,
input[type="button"],
input[type="submit"] {
  cursor:pointer;
}
.chat a,
.chatTitle,
.chatTopLineWrapper ul > li > a,
.smilesBox p,
.chatPopupMenuContent p,
.chatSpecifyPassword input[type=text] {
  color:#fff;
}
.chatMessage.chatSystemMessage {
  color:#58D3F7;
}
.chatLinkModerate::before,
.chatSendLinksPanel a span,
.chatLinkVip::after,
.chatSoundPanel a span {font-size:10pt;}
 select {
   background:transparent;
   color:#fff;
 }
 option {
   color:#888;
 }
.chatFull {
  background: radial-gradient(left center, black, rgba(0,0,0,.6), rgba(0,0,0,.3), transparent);
}
.chatSendLinksPanel a span,
.chatSoundPanel a span,
.chatUserMenuItems a,
.chatTabs a {
  text-decoration:none!important;
  border-bottom:none!important;
}
.chatPeople.vscrollable::after {
  position:absolute;
  bottom:2px;
  right:5px;
  content:'ChaTemplate';
  color:#333;
  font-size:9px;
}

a[href="/hot/"],
#register-menu-item {
  font-weight:bold;
}
.chatLinkVip {
  padding-right: 21px;
}
.chatLinkVip::after {
  position:absolute;
  margin-left: 21px;
  content:'Vip';
}
.chatLinkModerate {
  padding-right: 56px;
  background: transparent url(//st1.chatovod.ru/i/widget/shield.png) no-repeat 10px 0;
  border:0;
}
.chatLinkModerate::before {
  position:absolute;
  margin-left: 30px;
  content:'Moder';
}
.chatLinkMore {
  padding-left: 20px;
  background:transparent url('//madeas.usite.pro/ChaTemplate/icon/icon_plus.png') 0 0 no-repeat;
}
.smilesBox,
.chatPopupMenuDiv1 ,
.chatPopupMenuDiv2 {  
  transition: .3s linear;
  background-color: rgba(0,0,0,.4);
  border: 1px solid #555;
}
.chatPopupMenuDiv1 ,
.chatPopupMenuDiv2 {
  margin-top:-6px;
  margin-left:-5px;
}
.smilesBox {
  margin-top:-6px;
  margin-left:-7px;
  background-color: transparent;
  border: 0;
}
.smilesBox:hover,
.chatPopupMenuDiv2:hover {
  background-color: rgba(0,0,0,.8);
}
.chatMain .chatPeople {
  border-left: 4px solid #704214;
  margin-bottom:3px;
}
.chatMessageToMe .chatToUser {
  padding: 2px 5px;
}
.chatMessages.vscrollable img,
.chatPrivateMessages.vscrollable img {
  max-width: 70px;
  max-height: 70px;
  -moz-transition: all 1s ease-out;
  -o-transition: all 1s ease-out;
  -webkit-transition: all 1s ease-out;
  vertical-align: top!important;
}
.chatMain .chatMessages img:active {
  max-width: none!important;
  max-height: none!important;
  pointer-events: none;
  margin-bottom:1px!important;
}
.chatPeople ul.chatPeopleList li.hover {
  border-top:1px solid rgba(12,166,20,.50);
  border-bottom:1px solid rgba(12,166,20,.50);
  background-color: rgba(0,0,0,.20);
}
#scrollBottomBox {
  background-color: #E5DB68;
  border: 1px solid #AE6720;
  margin-top:-8px;
}
.chatMessages.vscrollable,
.chatPrivateMessages.vscrollable {
  margin:4px 7px 4px 0;
}
.smilesBox::-webkit-scrollbar,
.chatMessages.vscrollable::-webkit-scrollbar,
.chatPrivateMessages.vscrollable::-webkit-scrollbar {
  width: 6px;
}
.smilesBox::-webkit-scrollbar-thumb,
.chatMessages.vscrollable::-webkit-scrollbar-thumb,
.chatPrivateMessages.vscrollable::-webkit-scrollbar-thumb {
 -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
 box-shadow: inset 0 0 6px rgba(0,0,0,.3);
  background-color: #8A5520;
  border-radius: 6px;
}
.smilesBox::-webkit-scrollbar-thumb:hover,
.chatMessages.vscrollable::-webkit-scrollbar-thumb:hover,
.chatPrivateMessages.vscrollable::-webkit-scrollbar-thumb:hover {
  background-color: #999;
}
.chatUserAway[title="Не беспокоить"] {
  display: none;
}
.chatSendButton,
 select,
#join-chat-button,
#join-chat-button2,
input[type="submit"] {
  color:#fff;
  border-radius: 3px;
  border: 1px solid rgba(33,43,52,1);
  background: linear-gradient(rgb(110,112,120), rgb(81,81,86)) rgb(110,112,120);
  box-shadow:
   0 1px rgba(255,255,255,.2) inset,
   0 3px 5px rgba(0,1,6,.5),
   0 0 1px 1px rgba(0,1,6,.2);
  transition: .2s ease-in-out;
}
.chatSendButton:active,
 select:active,
#join-chat-button:active,
#join-chat-button2:active,
input[type="submit"]:active {
  top: 1px;
  background: linear-gradient(rgb(76,77,82), rgb(56,57,62)) rgb(76,77,82);
  box-shadow:
   0 0 1px rgba(0,0,0,.5) inset,
   0 2px 3px rgba(0,0,0,.5) inset,
   0 1px 1px rgba(255,255,255,.1);
}
.chatSendButton:focus:not(:active),
 select:focus:not(:active),
#join-chat-button:focus:not(:active),
#join-chat-button2:focus:not(:active),
input[type="submit"]:focus:not(:active) {
  background: linear-gradient(rgb(126,126,134), rgb(70,71,76)) rgb(126,126,134);
}