html, body { height: 100%;min-width:1350px; }

@font-face {
    font-family: "WhitneyBook"; 
    src: url(/fonts/whitney-book.eot);
    src: local("WhitneyBook"), url(/fonts/whitney-book.ttf) format("truetype");
}

@font-face {
    font-family: "CenturyGothic"; 
    src: url(/fonts/century_gothic__2_.eot);
    src: local("CenturyGothic"), url(/fonts/century-gothic.ttf) format("truetype");
}

/*login page*/

.activeAdmin {font-size: 11px; margin: 0 auto; width: 80%;color: #6e879b;padding-left: 30px;}
.activeAdmin td:nth-child(3) {padding-left: 10px;}
.icon_admin {margin-right: 10px;vertical-align: sub;}
#info-redirect{font-family:arial;font-size:12px;width:100%;}
.chat-body{background:rgba(0, 0, 0, 0) linear-gradient(181deg, #5f8093 5%, #f4f4f4 38%) no-repeat scroll 0 0 / 100% 100%;height:100%;margin:0;overflow:hidden;}
.msg{color:red;font-family:arial;font-size:12px;margin-top:-24px;position:absolute;}
.chat-body footer{background:#284660 none repeat scroll 0 0;bottom:0;display:block;height:35px;position:fixed;width:100%;}
#form-chat-login{background:rgba(0, 0, 0, 0) linear-gradient(180deg, #f3f3f3 24%, #ffffff 99%) no-repeat scroll 0 0 / 100% 100%;height:269px;}
#chat-admin.admin-set-password {height: 300px;}
#chat-admin.admin-set-password #form-chat-login {height: 220px;}

.form-chat-action input,.admin-reset-password input, #chat-admin-login input{border:1px solid #a8a8a8;color:#636363;font-family:arial;font-size:12px;padding:5px;width:100%;}
#chat-admin.admin-reset-password {height: auto;}
#form-chat-login.box-reset {height: 146px;}
#chat-admin{background:white none repeat scroll 0 0;border:1px solid #c8c8c8;box-shadow:-4px 6px 10px -4px rgba(0, 0, 0, 0.75);height:355px;margin:10% auto 0;moz-box-shadow:-4px 6px 10px -4px rgba(0, 0, 0, 0.75);padding:10px;webkit-box-shadow:-4px 6px 10px -4px rgba(0, 0, 0, 0.75);width:560px;}
#chat-admin-login .footer-login .btn, #reset-btn {background: #4a7185 none repeat scroll 0 0;border-radius: 31px;color: white;float: none;font-size: 12px;margin: 0 auto;padding-left: 13px;padding-right: 13px;text-align: center;width: auto;border:1px solid #a8a8a8}

#chat-admin h2{background:#4a7185 none repeat scroll 0 0;color:white;font-family:"WhitneyBook", arial;font-size:35px;font-weight:normal;height:60px;margin:0;padding:23px 0 0;text-align:center;}
.chat-body footer{background:#284660 none repeat scroll 0 0;bottom:0;display:block;height:35px;position:fixed;width:100%;}
.form-chat-action label,.admin-reset-password label, #chat-admin-login label{color:#636363;display:block;font-family:arial;font-size:13px;padding-bottom:2px;padding-top:5px;}
#reset-btn {padding-bottom: 4px;padding-top: 4px;}
#chat-admin-login .footer-login .btn:hover, #reset-btn:hover { background: #7198ac;cursor: pointer;}.form-chat-action #body-chat-login .buttonsadds label {display: inline;font-family: arial;font-size: 12px;}
#body-chat-login{margin:0 auto;padding-top:38px;width:62%;}
.buttonsadds div{color:#636363;float:left;font-size:12px;padding-right:0;width:50%;}
#body-chat-login div{margin-bottom:16px;}
#chat-admin-login .buttonsadds input[type="checkbox"]{margin-right:6px;    vertical-align: middle;margin-top: -1px;width:auto;}
.link-small,label span{bottom:-2px;color:#717171;float:right;font-size:10px;position:relative;text-decoration:none;}
.link-small:hover,.link-small:focus,.link-small:active {text-decoration: none; color: #004c9a;}
#body-chat-login div{display:block;height:42px;margin-bottom:23px;}
#body-chat-login .buttonsadds > div{font-family:arial;padding-top:14px;margin-bottom:0;padding-top:0;font-size: 12px;}
.msg + #body-chat-login div{margin-bottom:23px;}
#body-chat-login div.buttonsadds{margin-bottom:0;padding-bottom:14px;}
.form-chat-action .footer-login input.btn, #reset-btn, {background:#4a7185 none repeat scroll 0 0;border-radius:31px;color:white;float:none;font-size:12px;margin:0 auto;padding-left:13px;padding-right:13px;text-align:center;width:auto;}
.footer-login{border-top:1px solid #dedede;padding-top:12px;text-align:center;width:100%;}
.newchat { background: #f4f4f4 linear-gradient(#5c7f92 0%, #eee 30%, #f4f4f4 100%) repeat-x scroll 0 0;font-family:"WhitneyBook", Arial;margin:0 }
/*END LOGIN PAGE*/

.newchat header { width:1347px;margin:auto;padding-top:28px;min-width:1270px;position:relative; }
.newchat header h1 { color:#fff;text-align:center;margin-top: 12px;font-size:24px;clear:both;position:fixed;width:auto;white-space:nowrap; }
.newchat header .search { display:none;border:1px solid #93abb7;color:#fff;width:200px;padding:5px 20px;font-size:15px; }

.newchat .main { display:table;margin:auto;padding:0 25px 0 15px;margin-top:80px; }
.newchat .box { background:#fff;display:table-cell;-webkit-box-shadow: 0px 5px 14px 2px rgba(153,153,153,1);-moz-box-shadow: 0px 5px 14px 2px rgba(153,153,153,1);box-shadow: 0px 5px 14px 2px rgba(153,153,153,1); }
.newchat #side { width: 275px;margin-right:10px;min-width:250px;margin-left:15px; }
.newchat #main { min-width:980px;max-width:1094px;position:relative;right:-10px;margin-right:25px; }
.newchat #main.empty {  }

.newchat #side ul { list-style-type:none;width:98%;padding-left:2px;position:relative;top:-3px; }
.newchat #side ul li { color:#6e879b;padding-left:30px;margin-bottom:10px;cursor:pointer; }
.newchat #side>ul>li { margin-bottom:2px;padding:9px 23px 9px 48px }
.newchat #side ul li span { background:rgba(0, 0, 0, 0) url("/images/kolko-chat.png") no-repeat scroll 0 0;color: #000;float: right;font-size: 13px;height: 20px;padding: 3px 0 2px 1px;text-align: center;width: 22px; }
.newchat #side ul li i { font-style:normal;position:relative;bottom:0px }
.newchat #side ul li span i { /*left:-1px;*/ }
/*.newchat #side ul li span.less { font-size:11px; }
.newchat #side ul li span.less i { top:1px }*/
.newchat #side ul li.request { background: url(/images/chat-req-ico.png) no-repeat 23px 50%; }
.newchat #side ul li.active { background: url(/images/chat-active-ico.png) no-repeat 23px 50%; }
.newchat #side ul li.past { background: url(/images/chat-past-ico.png) no-repeat 23px 50%; }
.newchat #side ul li.my { background: url(/images/chat-my-ico.png) no-repeat 23px 50%; } 
.newchat #side ul li.operator {background: rgba(0, 0, 0, 0) url("/images/admins.png") no-repeat scroll 25px 51%;   cursor: auto; margin-top: 22px;}
.newchat #side ul li.request:hover, .newchat #side ul li.active:hover, .newchat #side ul li.past:hover, .newchat #side ul li.my:hover { background-color: #f5f5f5; }

.newchat #main h1 { margin-left:15px;padding-left:50px;color:#6e879b;font-size:30px;margin-top:23px;margin-right:15px;padding-bottom:20px;border-bottom:1px solid #e5e5e5;}
.newchat #main.active h1 { background: url(/images/chat-active-ico2.png) no-repeat 0 5px; }
.newchat #main.my h1 { background: url(/images/chat-my-ico2.png) no-repeat 0 5px;border:none;padding-bottom:6px; }
.newchat #main.my .empty h1 { border-bottom:1px solid #e5e5e5;padding-bottom:20px; }
.newchat #main.past h1 { background: url(/images/chat-past-ico2.png) no-repeat 0 5px;border:none;padding-bottom:6px; }
.newchat #main.past .empty h1, .newchat #main.past .notabs h1 { border-bottom:1px solid #e5e5e5;padding-bottom:20px; }
.newchat #main.request h1 { background: url(/images/chat-req-ico2.png) no-repeat 0 2px; }

.newchat #main .empty .intro-com { text-align:center;margin-top:210px;display:block;}
.newchat #main .intro-com {display:none }
.newchat #main .empty>ul { display:none }
.newchat #main .loader { text-align:center;margin-top:150px;position:absolute;left:45% }

.newchat #main #active, .newchat #main #request, .newchat #main #past, .newchat #main #my { display:none;min-height:546px;max-width: 980px }
.newchat #main.active #active, .newchat #main.request #request, .newchat #main.past #past, .newchat #main.my #my { display:block }

.newchat #main #my.blink .chat, .newchat #main #my.blink .tabs li.current, .newchat #main #my.blink .chat .plask, .newchat #main #my.blink ul.tabs a.remove { background-color:#f5f5f5}

.newchat #main ul.tabs { clear: both;float: left;height: 22px;list-style-type: none;margin-bottom: 2px;margin-top: 0;overflow-y: hidden;padding-left: 15px !important;width:97% !important;padding-right: 5px;padding-top: 15px;z-index: 0; }
.newchat #main ul.tabs li { float:left;padding:4px 5px 5px 38px;background: #f3f3f3 url(/images/chat-nieaktywny.png) no-repeat 18px 50%;min-width:120px;font-size: 12px;position:relative;top:-1px;border-radius: 0 15px 0 0;cursor:pointer;box-shadow:0 0 6px 0 rgba(153, 153, 153, 1);font-family:arial; }
.newchat #main ul.tabs li.sended { background: #f3f3f3 url(/images/chat-z-wiadomoscia.png) no-repeat 18px 50%; }
.newchat #main ul.tabs li.current { background: #fff url(/images/chat-okna-aktywnego.png) no-repeat 13px 50%;min-width:170px;padding-left:46px;top:-10px;padding-top:8px;font-size:15px;height:23px; }
.newchat #main ul.tabs a.remove { background: rgb(255, 255, 255) none repeat scroll 0% 0%; position: absolute; right: 6px; padding: 4px; top: 4px; }
.newchat #main ul.tabs a.remove img {width:10px; }
.newchat #main ul.tabs li span , .newchat #main ul.tabs li br{display:none}

.newchat #main .chat { clear:both;padding-top:20px;box-shadow:0 0 6px 0 rgba(153, 153, 153, 1);position:relative;margin:0 15px 30px;z-index:200; }
.newchat #main .chat .talk { height: 328px }
.newchat #main .chat .talk div.me, .newchat #main .chat .talk div.he, .newchat #main .chat .talk .stat { padding:5px 10px 5px 10px;margin:0 8px 3px 13px;font-size:13px;color:#6b6b6b;position:relative;width: 72%; border-radius:8px }
.newchat #main .chat .talk div.he {  }
.newchat #main .chat .talk div.he {  }
.newchat #main .chat .talk .stat.ended { margin-top:0;/*45px;*/margin-left:5px;color:#000;font-style:italic }
.newchat #main .chat .talk .stat.ended span {display: none;}
 .newchat #main .chat .talk .he { background: #e7f0f5; border: 1px solid #a9bac3; }
.newchat #main .chat .talk .me { background: #f5f5f5;margin-left:30px;margin-left:15% !important;  border: 1px solid #cbcbcb;}
.newchat #main .chat .talk span#transcriptTime { position:relative;color:#dfdfdf;float:right;top:5px;font-size:12px;margin-right:20px; }
.newchat #main .chat .talk span#transcriptTime span, .newchat #main .chat .talk span#transcriptTime em { position:relative;left:-4px;top:0px }
.newchat #main .chat .talk div span span { right: -16px;top:2px;font-size: 11px }
.newchat #main .chat .talk div span em { font-size:10px;position:relative;left:0px;font-style:normal; }

.newchat #main .chat .footer textarea { width: 97%;margin:13px;margin-top:7px;margin-bottom:30px;font-family: Arial;font-size:13px;height:40px;resize: vertical;max-height:100px;min-height:50px;border:1px solid #999;padding:5px; }
.newchat #main .chat .footer .btn, .newchat #main #request ul ul li .btn, .newchat #main #past ul ul li .btn { border:none;padding:3px;background:#70909d;color:#fff; }
.newchat #main .chat .footer .btn:hover, .newchat #main #request ul ul li .btn:hover, .newchat #main #past ul ul li .btn:hover { background:#799ba9; }
.newchat #main .btn:hover { cursor:pointer }
.newchat #main .chat .footer .btn { margin-left:80px; font-size: 13px;}
.newchat #main .chat .footer div input, .newchat #main .chat .footer div select {font-size: 12px;margin-right: 15px;padding-bottom: 4px;padding-left: 2px;padding-top: 4px;}
.newchat #main .chat .footer .send { display:none }
.newchat #main .chat .footer .send, .newchat #main #request ul ul li .submit, .newchat #main #past ul ul li .submit { float: right;margin-top: 35px;padding:5px 10px; margin-right: 8px;cursor:pointer; }
.newchat #main .chat .footer.ended textarea, .newchat #main .chat .footer.ended > input { display:none }
.newchat #main #request ul ul li .submit, .newchat #main #past ul ul li .submit { margin-top:1px;cursor:pointer; }
.newchat #main .chat .footer div { padding:20px;background:#f5f5f5;}
.newchat #main .chat .footer>div { min-height:69px; }
.newchat #main .chat .footer div input { background: #fff;border:1px solid #999;padding:5px;font-size:11px; }
.newchat #main .chat .footer div.clerspace {display: block;padding: 10px;}
.newchat #main .chat .footer div input#phone { width: 100px }
.newchat #main .chat .footer div input#state { width: 50px }
.newchat #main .chat .footer div label { font-size:13px;color:#000 }

.newchat #main .chat .new-chat-msg { font-size:13px;position:absolute;top:0;font-style:italic;padding-left:12px;display:none }

.newchat #main .chat .plask { background:#fff;height:5px;position:absolute;top:-5px;width:221px }
.newchat #main .chat { font-family: arial; }

.newchat #main .chatslist ul {list-style-type: none;font-family:arial;padding-left:0px;width:100%;margin-bottom:0px; }
.newchat #main .chatslist ul ul { clear: both;float: left;height: auto;margin-bottom: 2px;margin-top: 0;overflow-y: hidden;padding-left: 0;z-index: 0; }
.newchat #main .chatslist ul ul.head li { min-height: 10px;height:18px;font-weight:bold;color:#6e879b;padding-top:11px; }

.newchat #main .chatslist ul ul li { color:#6b6b6b;font-size:13px;float:left;padding:3px 0px 0px 20px;min-width:50px;width:184px;font-size: 13px;position:relative;top:0;min-height:16px;cursor:default;}
.newchat #main #active ul ul li { min-height: 13px; }
.newchat #main #past ul ul li { cursor:pointer; }

.newchat #main .chatslist ul ul li span { font-size:10px; } 
.newchat #main #chatInvites span {font-size: 13px;}
.newchat #main #past ul ul li { max-width:155px }
.newchat #main #past ul ul li.xadmin { max-width: 120px }
.newchat #main #past ul ul li.xwhen { max-width: 147px }
.newchat #main #past ul li ul.head li {cursor: unset;}
.newchat #main #request ul ul li.cell, .newchat #main #past ul ul li.cell, .newchat #main #active ul ul li.cell { padding-top:10px;text-overflow: ellipsis; overflow: hidden; padding-bottom: 10px;-webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none;user-select: none; }
.newchat #main #request ul ul li.cell.email { overflow:hidden;text-overflow:ellipsis }
.newchat #main #request ul ul li, .newchat #main #active ul ul li { min-width:60px;width:180px }
.newchat #main #request ul ul li.queue { width: 100px; }
.newchat #main #active ul ul li.wide, .newchat #main #past ul ul li.wide { width:184px }
.newchat #main #request ul ul li.wide { width:257px }
.newchat #main #past ul ul li.wide { width:263px;max-width:500px; }
.newchat #main #request ul ul li.widel { min-width:15%;max-width:20% }
.newchat #main #request ul ul li.wider { min-width:40%;max-width:50% }
.newchat #main #request ul ul li.short, .newchat #main #active ul ul li.short, .newchat #main #past ul ul li.short { width: 8% }
.newchat #main #request ul li.hover-row:nth-child(even) ul, .newchat #main #active ul li.hover-row:nth-child(even) ul, .newchat #main #past ul li.hover-row:nth-child(even) ul { background-color: #eaeaea; }
.newchat #main #request ul li.hover-row:nth-child(even) ul:hover, .newchat #main #active ul li.hover-row:nth-child(even) ul:hover, .newchat #main #past ul li.hover-row:nth-child(even) ul:hover { background-color: #e0e0e0; }
.newchat #main #request ul li.hover-row:nth-child(2n+1) ul, .newchat #main #active ul li.hover-row:nth-child(2n+1) ul, .newchat #main #past ul li.hover-row:nth-child(2n+1) ul, .newchat #main #request ul li ul.head, .newchat #main #past ul li ul.head { background-color: #f9f9f9; }
.newchat #main #request ul li.hover-row:nth-child(2n+1) ul:hover, .newchat #main #active ul li.hover-row:nth-child(2n+1) ul:hover, .newchat #main #past ul li.hover-row:nth-child(2n+1) ul:hover { background-color: #f4f4f4; }
.newchat #main .chatslist ul li ul.head { background:#fff !important;width:98%; height:37px;cursor:default; }

.newchat #main #endedChats, .newchat #main #chatInvites { height:510px;overflow-y:auto;overflow-x:hidden;clear:both;margin-bottom:40px; }
.newchat #main .msg_push { height: 305px;overflow:auto }
.newchat #main #past .is-typing { position: absolute; bottom: -3px;color: #000; font-style: italic; }
.newchat header .head-chat { background: url(/images/user-icon.png) no-repeat 0 0;width:25px;height:25px;float:right;cursor:pointer;position:fixed;margin-right:100px;top:41px;z-index:2000; }

#new-msg { font-size: 11px;font-style: italic;left: 20px;position: absolute;top: -16px; }

 /* Popup container */
.popup {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

/* The actual popup (appears on top) */
.popup .popuptext {
    visibility: hidden;
    width: 160px;
    background-color: #fff;
    color: #555;
	cursor:default;
    text-align: left;
    padding: 10px 20px 8px 20px;
	font-size:14px;
    position: absolute;
    z-index: 1;
    top: 125%;
    left: 50%;
    margin-left: -100px;
	-webkit-box-shadow: 0px 6px 8px 1px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 6px 8px 1px rgba(0,0,0,0.75);
	box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.75);
}

/* Popup arrow */
.popup .popuptext::after {
    content: "";
    position: absolute;
    bottom: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent #fff transparent;
}

.popup .popuptext span.m {
	display:block;
	/*border-top:1px solid #ccc;*/
	padding-top: 15px;
	margin-top:7px;
	font-weight: normal;
	width: 160px;
	text-align:right;
	font-size:13px;
}

.popup .popuptext span { font-weight:bold; }
.popup .popuptext .m a {
	text-decoration:none;
	color: #555;
	background-color: #eee;
	border-radius: 25px;
	padding: 2px 7px;
}
.popup .popuptext .m a:hover {
	background-color: #ccc;
}

.popup .popuptext span.status { display:block;font-weight:400;padding-left:10px;position:relative;top: 7px;left:-11px;width:62px;cursor:pointer }
.popup .popuptext span.status.focused {  left: -11px;top: 7px; }
.popup .popuptext ul { display:none;background:#fff;border:1px solid #ddd;left: 76px;list-style-type: none;padding: 0;position: absolute;top: 22px; }
.popup .popuptext ul.focused { display:block }
.popup .popuptext ul.focused li { padding:0 10px 4px 10px;cursor:pointer }
.popup .popuptext ul.focused li.over { background: #eee }

/* Toggle this class when clicking on the popup container (hide and show the popup) */
.popup #myPopup.popuptext.show {
    visibility: visible !important;
    -webkit-animation: fadeIn 1s;
    animation: fadeIn 1s
}

/* Add animation (fade in the popup) */
@-webkit-keyframes fadeIn {
    from {opacity: 0;}
    to {opacity: 1;}
}

@keyframes fadeIn {
    from {opacity: 0;}
    to {opacity:1 ;}
}   to {opacity: 1;}
}

@keyframes fadeIn {
    from {opacity: 0;}
    to {opacity:1 ;}
}

/* DLA CHROME SAFARI*/
@media screen and (-webkit-min-device-pixel-ratio: 0) { 
    .newchat #side ul li span{  padding: 3px 0px 0px 0.3px;}
}


@media screen and (-webkit-min-device-pixel-ratio:0)
  and (min-resolution:.001dpcm) {
	.newchat #side ul li span { width:23px }
	.newchat #side ul li span i { bottom:-1px }
}