@keyframes fade {
	0%: { opacity: 0; }
	100%: { opacity: 1; }
}

@keyframes fade-out {
	0%: { opacity: 1; }
	100%: { opacity: 0; }
}

body, html, .grid-wrapper, .grid, .page, .page-wrapper { width: 100%; height: 100%; }
body { font-family: Calibri, Arial; min-height: 320px; overflow: hidden; }

.clearfix::after { display: block; width: 100%; clear: both; content: ''; }

[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak { display: none !important; }

.chat { position: absolute; width: 337px; height: 100%; bottom: 0; right: 0; background: #e2e2e2; z-index: 10; }
.chat .new-message, .chat .new-user, .chat .social { position: absolute; bottom: 0; width: 90%;  height: 70px; border: 1px solid #d5d5d5; box-sizing: border-box; resize: none; margin: 0 auto 10px; left: 0; right: 0; font-size: 16px; padding: 10px 60px 10px 10px; border-radius: 5px; }
.chat .new-user { height: 50px; bottom: 9px; }
.chat .submit { position: absolute; width: 40px; height: 40px; border-radius: 20px; border: 0; background: url(../img/note.svg) center no-repeat #000; background-size: 20px; padding: 0; bottom: 25px; right: 32px; cursor: pointer; }
.chat .submit.login { background: url(../img/login.svg) center no-repeat #000; background-size: 20px; }
.chat .toggle-chat { display: none; }
.chat .logout { position: absolute; right: 34px; font-size: 12px; font-style: italic; color: #777; bottom: 12px; }
.chat .social { background: #fff; line-height: 70px; text-align: center; padding: 0; }
.chat .social::after { display: inline-block; height: 100%; vertical-align: middle; content: ''; }
.chat .social a { width: 40px; height: 40px; display: inline-block; font-size: 18px; vertical-align: middle; margin-left: 5px; }
.chat .social .vk { background: url(../img/vk.png); }
.chat .social .facebook { background: url(../img/facebook.png); }
.chat .social .instagram { background: url(../img/instagram.png); }
.chat .message .remove { position: absolute; top: 8px; right: 6px; width: 15px; height: 15px; display: inline-block; background: url(../img/remove.svg); background-size: 100%; }

.messages { height: 100%; padding-bottom: 90px; box-sizing: border-box; }
.messages .messages-inner { height: 100%; overflow: auto; position: relative; }
.message { position: relative; padding: 6px 4px 6px 0; box-sizing: border-box; width: 320px; text-align: right; }
.message .text { width: 230px; background: #fff; border-radius: 5px; padding: 10px 10px 17px; display: inline-block; text-align: left; min-height: 35px; vertical-align: bottom; position: relative; word-break: break-all; }
.message .text::before { content: url(../img/tail.png); position: absolute; left: -13px; bottom: 5px; }
.message .nickname, .message .time { position: absolute; bottom: 0px; right: 3px; color: #777; font-style: italic; font-size: 12px; }
.message .time { left: 3px; }
.message img { vertical-align: bottom; border-radius: 50%; margin: 0 12px 5px 0; width: 45px; height: 45px; }

.grid-wrapper { padding-right: 337px; box-sizing: border-box; }
.grid { position: relative; }
.grid .tile { width: 20%; height: 33.3333%; float: left; box-sizing: border-box; border: 1px solid #fff; background-size: cover; background-position: center; position: relative; z-index: 2 }
.grid .tile.ng-enter { opacity: 0; }
.grid .tile.ng-enter.ng-enter-active { opacity: 1; }
.grid .tile .user { font-size: 24px; position: absolute; bottom: 15px; text-align: center; width: 100%; color: #fff; opacity: .8; text-shadow: 0 0 1px #000, 0 0 2px #000, 0 0 3px #000; text-decoration: none; }
.grid .tile-7 { margin-right: 20%; }

.player { position: absolute; width: 20%; height: 33.3333%; top: 33.3333%; left: 40%; text-align: center; }
.player audio { display: none; }
.player h1 { font-size: 52px; padding-top: 30px; line-height: 1; margin: 0; text-shadow: 0 0 5px #fff; }
.player a { position: absolute; width: 130px; height: 129px; left: 0; right: 0; top: 0; bottom: 0; margin: auto; background: url(../img/play-button.png) center no-repeat, url(../img/player.png) center no-repeat; background-size: 30%, auto; z-index: 3; }
.player a.played { background: url(../img/pause-button.png) center no-repeat, url(../img/player.png) center no-repeat; background-size: 30%, auto; }
.player .song-name { font-weight: bold; font-size: 14px; position: absolute; bottom: 50px; width: 100%; text-align: center; text-shadow: 0 0 5px #fff; }
.player .rzslider { position: absolute; bottom: 0; left: 0; width: 90%; right: 0; margin: 35px auto 10px; z-index: 3; }
.player .rzslider .rz-pointer { height: 13px; top: -4px; outline: 0; }
.player .rzslider .rz-pointer::after { display: none; }
.player .rzslider .rz-bar.rz-selection, .player .rzslider .rz-pointer { background: #FE9807; }
.player .rzslider .rz-bar { height: 6px; }

.panel { position: fixed; top: 0; left: 72px; padding: 4px; background: #fff; z-index: 20; border-radius: 0 0 5px 5px; height: 32px; }
.panel a { width: 32px; height: 32px; border-radius: 16px; display: inline-block; }
.panel .instagram { background: url(../img/instagram.svg) center/100% no-repeat; }
.panel .schedule { background: url(../img/list2.svg) center/100% no-repeat; }
.panel .hosts { background: url(../img/user.svg) center/100% no-repeat; }

.images, .admin-schedule, .admin-hosts { width: 800px; height: 400px; position: fixed; left: 0px; top: 0px; background: #fff; z-index: 11; padding-top: 50px; overflow: hidden; box-shadow: 0 0 10px rgba(0, 0, 0, .2); }
.images .image { display: inline-block; float: left; width: 80px; height: 80px; margin: 10px; background-size: cover; background-position: center; position: relative; }
.images .image .hidden { position: absolute; width: 24px; height: 24px; background: url(../img/hide.svg) center no-repeat #D75A4A; background-size: 75%; border-radius: 50%; right: -5px; top: -5px; }
.images .image .pinned { position: absolute; width: 24px; height: 24px; background: url(../img/pin.svg) center no-repeat #4cd74a; background-size: 75%; border-radius: 50%; right: -5px; top: -5px; }
.images .image .hidden + .pinned { right: 25px; }
.images .button, .admin-schedule .button, .page .button, .admin-hosts .button { position: absolute; top: 4px; width: 32px; height: 32px; border-radius: 16px; display: inline-block; background-size: 100%; }
.images .prev { background-image: url(../img/left-arrow.svg); right: 112px; }
.images .next { background-image: url(../img/right-arrow.svg); right: 76px; }
.images .add { background-image: url(../img/plus.svg); right: 40px; }
.images .close, .admin-schedule .close, .admin-hosts .close { background-image: url(../img/cancel.svg); right: 4px; }
.images .operations { padding-bottom: 40px; }
.images .operations, .admin-hosts .host-form { position: fixed; top: 50px; left: 0; right: 0; margin: auto; width: 500px; background: #fff; z-index: 12; box-shadow: 0 0 15px rgba(0, 0, 0, .2); }
.images .operations img { max-width: 90%; margin: 5% auto; display: block; max-height: 450px; }
.images .operations .hide, .images .operations .save, .images .limit input, .images .link input, .images .operations .delete { padding: 2px; color: #fff; background: #D96354; border-radius: 5px; margin: 10px auto 5%; display: block; width: 140px; text-decoration: none; text-align: center; box-sizing: border-box; border: 1px solid #999; font-size: 14px; }
.images .operations .hide.show, .images .operations .save { background: #0ebb13; }
.images .operations .hide, .images .operations .save, .images .operations .delete { position: absolute; bottom: 10px; margin: 0; }
.images .operations .hide { left: 5%; }
.images .operations .save { right: 5%; }
.images .operations .delete { left: 0; right: 0; margin: auto; }
.images .limit { position: relative; }
.images .limit input, .images .link input { padding-right: 25px; background: #fff; color: #000; }
.images .limit a, .images .link a { position: absolute; right: 0; top: 0; width: 25px; height: 25px; background: url(../img/checked.svg) center/15px no-repeat #ff0; border-radius: 0 5px 5px 0; border: 1px solid #999; box-sizing: border-box; transition: background-color .3s; }
.images .limit a.success, .images .link a.success { background-color: #0f0; }
.images .pin { margin: 0 5%; display: inline-block; font-size: 0; width: 115px; vertical-align: middle; }
.images .pin a { display: inline-block; width: 15px; height: 15px; margin: 3px; border: 1px solid #999; }
.images .pin a.position-6 { margin-right: 26px; }
.images .pin a:hover { background: #ff0; }
.images .pin a.taken { background: #f00; cursor: default; }
.images .pin a.active { background: #0f0; cursor: pointer; }
.images .right { display: inline-block; vertical-align: middle; margin-right: 5%; float: right; }
.images .link { margin: 0 5%; position: relative; }
.images .link input { width: 100%; margin-bottom: 5px; }
.images .upload { border: 0; cursor: pointer; margin: 10px auto !important; }
.images .upload + img { margin-top: 0; }

.menu { position: absolute; left: 0; top: 0; z-index: 11; padding: 5px 10px 10px; height: 56px; overflow: hidden; box-sizing: border-box; width: 310px; }
.menu.active { height: 100%;/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,7db9e8+100 */
background: #000000; /* Old browsers */
background: -moz-linear-gradient(left,  #000000 0%, rgba(0, 0, 0, 0) 30%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  #000000 0%,rgba(0, 0, 0, 0) 30%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  #000000 0%,rgba(0, 0, 0, 0) 30%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#7db9e8',GradientType=1 ); /* IE6-9 */
 }
.menu .toggle { width: 40px; height: 40px; display: inline-block; background: url(../img/bars.svg) center/70% no-repeat #fff; border-radius: 50%; margin-bottom: 16px; }
.menu ul { padding: 0; margin: 0; }
.menu li { display: block; margin-bottom: 5px; }
.menu.active .toggle, .menu.active a span, .menu.active a::before { box-shadow: 0 0 10px rgba(0, 0, 0, .1); }
.menu nav a { color: #000; text-decoration: none; min-height: 32px; display: block; }
.menu nav a::before { display: inline-block; width: 32px; height: 32px; background-color: #fff; background-size: 60%; background-position: center; background-repeat: no-repeat; content: ''; border-radius: 50%; vertical-align: middle; margin-right: 4px; }
.menu nav a.schedule::before { background-image: url(../img/clock.svg); }
.menu nav a.host::before { background-image: url(../img/users.svg); }
.menu nav a.rec::before { background-image: url(../img/rec.svg); background-size: 90%; }
.menu nav a.vk::before { bottom: 10px; background: url(../img/vk.svg) center/70% no-repeat #fff; }
.menu nav a.fb::before { bottom: 55px; background: url(../img/facebook.svg) center/70% no-repeat #fff; }
.menu nav a.zelenoe::before { background: url(../img/zelenoe.png) center/90% no-repeat #fff; }
.menu nav a.lebedev::before { background: url(../img/lebedev.png) center/70% no-repeat #fff; }
.menu nav a span { background: #fff; padding: 2px 6px; border-radius: 10px; display: inline-block; vertical-align: middle; }
.menu .bottom { position: absolute; bottom: 10px; display: none; width: 300px; }
.menu .bottom::before { width: 40px; height: 40px; }
.menu .fb { bottom: 195px; }
.menu .vk { bottom: 150px; }
.menu .lebedev { bottom: 55px; }
.menu .zelenoe { bottom: 10px; }
.menu.active a { display: block; }

.admin-schedule .day .toggle, .admin-schedule .save, .admin-hosts .action, .host-form button, .images .upload { display: block; background: #444; color: #fff; text-decoration: none; padding: 10px; margin-bottom: 5px; }
.admin-schedule .day .toggle:hover, .admin-schedule .add:hover, .admin-schedule .remove:hover, .admin-schedule .save:hover, .admin-hosts .action:hover, .admin-hosts .add:hover, .host-form button:hover { background: #555; }
.admin-schedule .add, .admin-schedule .remove, .admin-hosts .add { width: 30px; height: 30px; color: #fff; text-decoration: none; font-size: 16px; text-align: center; line-height: 30px; background: #444; display: inline-block; }
.admin-schedule .add, .admin-hosts .add { display: block; margin: 0 0 5px 5px; }
.admin-schedule .row { margin: 5px 0; box-sizing: border-box; padding-left: 5px; }
.admin-schedule .save, .admin-hosts .action, .host-form button { padding: 5px 10px; margin: 10px 0 10px 5px; display: inline-block; border: 0; cursor: pointer; }

.admin-hosts .name { display: inline-block; padding-left: 5px; font-size: 18px; }
.admin-hosts .action { float: right; margin: 0 5px 0 0; }
.admin-hosts .host { margin-bottom: 5px; padding-bottom: 5px; border-bottom: 1px solid #e2e2e2; }

#schedule, #hosts { overflow: auto; height: 100%; }

.page { position: fixed; padding: 50px 387px 50px 50px; box-sizing: border-box; z-index: 11; }
.page .close { background: url(../img/cancel.svg) #fff; right: -12px; border-radius: 50%; z-index: 1; top: -12px; width: 40px; height: 40px; }
.page-wrapper { position: relative; }

.schedule-page, .hosts-page { width: 100%; height: 100%; background: #fff; overflow: auto; position: relative; box-sizing: border-box; padding: 10px; font-size: 0; }
.schedule-page .day { width: 14.28571428571429%; display: inline-block; box-sizing: border-box; padding: 0 2px; vertical-align: top; border-right: 1px solid #e2e2e2; min-height: 100%; }
.schedule-page .day .heading { padding: 6px 0 6px 20px; background: #444; color: #fff; text-transform: uppercase; font-size: 20px; }
.schedule-page .day .row { margin-top: 10px; padding-left: 5px; }
.schedule-page .day .row.last { margin-bottom: 10px; }
.schedule-page .day .row div { font-size: 18px; }
.schedule-page .day .row .time { font-size: 16px; }
.schedule-page .day .row .name { font-weight: bold; }
.schedule-page .day .row .host { color: #999; font-size: 14px; }

.hosts-page .host { margin-bottom: 10px; border-bottom: 1px solid #e2e2e2; padding-bottom: 10px; }
.hosts-page .host.last { border: 0; }
.hosts-page .host .image { float: left; width: 200px; height: 200px; background-size: contain; }
.hosts-page .host .right { margin-left: 210px; }
.hosts-page .host .name { font-size: 32px; text-transform: uppercase; font-weight: bold; margin-bottom: 10px; line-height: 1 }
.hosts-page .host .text { font-size: 16px; }
.hosts-page .empty { font-size: 40px; text-align: center; margin-top: 30px; }

.host-form { padding: 10px; }
.host-form img { max-width: 100px; max-height: 100px; display: block; margin: 0 auto 10px; }
.host-form textarea { width: 100%; resize: none; margin: 5px 0; height: 100px; }
.host-form button { margin: 0; }

@media (max-height: 860px)
{
	.player h1 { font-size: 30px; padding-top: 10px; }
	.player .song-name { bottom: 25px; }
}

@media (max-height: 630px)
{
	.player h1 { font-size: 20px; padding-top: 5px; }
	.player .song-name { bottom: 20px; }
}

@media (max-height: 530px)
{
	.tile-1, .tile-2, .tile-3, .tile-4, .tile-5, .tile-11, .tile-12, .tile-13, .tile-14 { display: none; }
	.grid .tile, .player { height: 100%; }
	.player { top: 0; }
}

@media (max-width: 1600px)
{
	.schedule-page .day .heading { font-size: 13px; }
}

@media (max-width: 1280px)
{
	.tile-1, .tile-5, .tile-6, .tile-9, .tile-10, .tile-14 { display: none; }
	.grid .tile, .player { width: 33.3333% }
	.grid .tile-7 { margin-right: 33.3333% }
	.player { left: 33.3333%; }
	.schedule-page .day { width: 100%; min-height: auto; }
}

@media (max-width: 1024px)
{
	.chat { width: 237px; }
	.chat .new-message { width: 200px; }
	.message { width: 100%; text-align: center; }
	.message .text { width: 90%; }
	.message .text::before, .message img { display: none; }
	.grid-wrapper { padding-right: 237px; }
	.page { padding-right: 287px; }
}

@media (max-width: 740px)
{
	.tile-2, .tile-3, .tile-4, .tile-11, .tile-12, .tile-13 { display: block; }
	.grid .tile { height: 33.3333%; }
	.grid .tile .user { display: none; }
	.player { width: 100%; height: 100%; position: absolute; left: 0; top: 0; }
	.player h1 { display: none; }
	.grid-wrapper { padding-right: 0; }
	.page { padding: 0; }
	.page .close { top: 5px; right: 10px; }
	.chat { width: 100%; height: 40px; overflow: hidden; padding-top: 40px; -webkit-transition: height .3s; transition: height .3s; }
	.chat.active { height: 80%; }
	.chat .toggle-chat { display: block; position: absolute; top: 0; width: 100%; text-align: center; line-height: 40px; font-size: 20px; z-index: 1; text-decoration: none; color: #000; background: inherit; }
	.chat .new-message { width: 90%; }
	.message .nickname { right: 5%; }
	.player .song-name { display: none; }
	.player h1 { background: rgba(255, 255, 255, .6); }
	.player .rzslider { bottom: 50px; }
	.schedule-page, .hosts-page { padding-top: 50px; }
	.hosts-page .host .image { float: none; margin: 0 auto 10px; }
	.hosts-page .host .right { margin: 0; }
	.menu li a { font-size: 12px; }
}

@media (max-width: 740px) and (orientation: landscape)
{
	.tile-1, .tile-5, .tile-6, .tile-9, .tile-10, .tile-14 { display: block; }
	.grid .tile { width: 20%; }
	.grid .tile-7 { margin-right: 20%; }
	.menu .bottom::before { width: 32px; height: 32px; }
	.menu .lebedev { bottom: 45px; }
	.menu .vk { bottom: 80px; }
	.menu .fb { bottom: 115px; }
}

.ui-slider-horizontal {
    height: 6px;
    border-radius: 0 3px 3px 0;
}

.ui-widget.ui-widget-content {
    border: none;
    background: #FE9807;
}

.ui-slider .ui-slider-handle {
    height: 13px;
    width: 32px;
    border: none;
    background: #FE9807;
    top: -3.654px;
    border-radius: 16px;
    margin-left: -32px;
    cursor: pointer;
}

.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus, .ui-button:hover, .ui-button:focus {
    border: none;
    background: #FE9807;
    font-weight: normal;
    outline: none;
    box-shadow: none;
}

.ui-slider-handle[style*="left: 0"] {
  /*margin-left: -1px;*/
}

.ui-slider-handle[style*="left: 100"] {
    /*margin-left: -1.9em;*/
}

.volume-controll {
	position: absolute;
	bottom: 0;
    left: 0;
    width: 90%;
    right: 0;
    margin: 35px auto 10px;
    border-radius: 3px;
    background: #FE9807;
    z-index: 3;
}

.volume-controll-elem {
	margin-left: 32px;
    cursor: pointer;
}

.ct {
    position: fixed;
    top: -5px;
    left: 53px;
    padding: 10px;
    max-height: 40px;
    z-index: 95;
}

.ct.open {
	max-height: unset;
}

.ct__ico {
	position: relative;
    width: 40px;
    height: 40px;
    padding: 1px;
    /*box-shadow: 0 0 8px 2px #949494;*/
    border-radius: 100%;
    margin-bottom: 10px;
    cursor: pointer;
}

.ct__ico-img {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: inherit;
	height: inherit;
	background-image: url(../img/btn-ico.svg);
    background-position: center;
    background-size: 30px;
    background-repeat: no-repeat;
    border-radius: 100%;
    background-color: #fff;
}

.ct__current {
    position: absolute;
    top: 8px;
    left: 46px;
    background: #fff;
    border-radius: 5px;
    padding: 4px 8px;
    display: inline-block;
    vertical-align: top;
}

.ct__content {
	opacity: 0;
	background: #fdfdfde8;
	border-radius: 10px;
	padding: 10px;
	transition: transform 0.5s cubic-bezier(0.18, 0.88, 1, 1.36), opacity 0.5s linear;
	transform: translateX(-200px);
}

.ct__content.open {
	opacity: 1;
	transform: translateX(0px);
}

.ct__content:hover {
	background: #fff;
}

.ct__city {
	display: block;
	cursor: pointer;
	text-decoration: none;
	color: #000;
}

.ct__city:hover {
	color: #000;
}

.ct__city.active {
	color: #000;
	/*cursor: default;*/
}

.qtip-default {
    max-width: 100%;
}
.cities_tip {
    position: relative;
    z-index: 100;
}
.cities_tip__background {
	display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.3);
    z-index: 99;
}
.cities_tip__title {
    font-weight: bold;
    margin-bottom: 15px;
}
.cities_tip__text {
    margin-bottom: 10px;
}
.cities_tip__button {
    border: 0;
    outline: none;
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    padding: 8px 12px 8px 12px;
    color: #fff;
    background: #000;
    text-transform: uppercase;
    cursor: pointer;
    min-width: 100px;
    text-align: center;
}

.qtip-bootstrap {
    background-color: #fff;
    color: #000;
}

.close-window {
	cursor: pointer;
}

.window {
	display: none;
}

#schedule, #hosts {
	overflow-y: auto !important;
}

.menu nav a.fran::before {
    background-image: url(../img/host.png);
    background-size: 81%;
}

.menu nav a.mic::before {
    background-image: url(../img/mic.png);
    background-size: 81%;
}

.menu nav a.team::before {
    background-image: url(../img/team.png);
    background-size: 81%;
}

.menu nav a.play-market::before {
    background-image: url(../img/logo-play-market.png);
    background-size: 61%;
    background-position: left 10px center;
}

.menu nav a.app-store::before {
    background-image: url(../img/logo-app-store.png);
    background-size: 69%;
}

.menu nav a.host::before {
    background-image: url(../img/mic.png);
    background-size: 81%;
}

.page-content {
	width: 100%;
    height: 100%;
    background: #fff;
    overflow: auto;
    position: relative;
    box-sizing: border-box;
    padding: 10px;
}

.grid-wrapper.nochat {
	padding-right: 0px;
}

.big-paddings {
	padding-right: 50px;
	padding-left: 50px;
}

.projects-menu {
	display: none;
	position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.menu.active .projects-menu {
	display: block;
}

.projects-menu a.bottom {
	position: static;
}

.btn {
    display: inline-block;
    vertical-align: top;
    padding: 7px 25px;
    border-radius: 5px;
    border: 1px solid #000;
    cursor: pointer;
    text-decoration: none;
    color: #000;
    margin: 0;
    transition: 0.3s ease-out;
}

.btn:hover {
	background: #000;
	color: #fff;
}

.btn + .btn {
	margin-left: 10px;
}

.window .page-wrapper .btn {
	margin-bottom: 20px;
}

.window .page-wrapper iframe[src*="youtu"] {
    max-width: 560px;
}

.iframe_video {
	display: inline-block;
	vertical-align: top;
}

@media only screen and (max-width: 1080px) {
	.iframe_video {
		display: block;
	}
	.iframe_video {
		height: 0px;
		padding-bottom: 56.2%;
		position: relative;
	}
	.iframe_video iframe {
		width: 100%;
		height: 100%;
		position: absolute;
	}
	.btn + .btn {
	    margin-left: 0;
	}
	.btn {
		margin-right: 10px;
	}
}

@media only screen and (max-width: 470px) {
	.window .page-wrapper .btn {
		display: block;
		margin-right: 0px;
	}
}

.message_box_wrapper {
    width: 100%;
    padding: 5px 20px;
    box-sizing: border-box;
    position: absolute;
    bottom: 0;
    z-index: 2;
}
.chat.open .message_box_wrapper {
	display: block;
}
#message_box {
    width: 100%;
    max-width: 100%;
    height: 75px;
    margin: 0;
    font-size: 12px;
    padding: 10px;
    border-radius: 7px;
    box-shadow: none;
    outline: none;
    border: none;
    resize: none;
    box-sizing: border-box;
}
#send_message {
    width: 40px;
    height: 40px;
    padding: 0;
    margin: 0;
    background: #003;
    position: absolute;
    font-size: 0;
    top: calc(50% - 2.5px);
    right: 30px;
    transform: translateY(-50%);
    border-radius: 100%;
    cursor: pointer;
    box-sizing: border-box;
    background-image: url(../img/mail-send.svg);
    background-repeat: no-repeat;
    background-size: 25px;
    background-position: center;
    z-index: 5;
}
#send_message:active,
#send_message:hover,
#send_message:focus {
	outline: none;
	box-shadow: none;
	border: none;
}
.ps-scrollbar-y-rail {
	z-index: 3;
}
.btnChat {
	display: none;
	position: fixed;
	top: 10px;
	right: 10px;
	width: 40px;
	height: 40px;
	cursor: pointer;
	z-index: 12;
	border-radius: 100%;
	background-image: url(../img/chat.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 25px;
	background-color: black;
}
.hiddenMsg {
    color: darkgray;
}
.message img {
    object-fit: cover;
    object-position: top;
}
.chat_logout {
    position: absolute;
    bottom: 10px;
    right: 34px;
    font-size: 12px;
    text-decoration: none;
    color: gray;
}
@media (max-width: 740px) {
	.chat {
		padding-top: 0px;
		overflow: visible;
	}
	.chat .toggle-chat {
		z-index: 10;
	}
	.chat .toggle-chat::after {
		content: '';
		position: absolute;
		z-index: 10;
		display: block;
		top: -40px;
		height: 40px;
		left: 0;
		right: 0;
		cursor: pointer;
	}
	.chat.open {
		height: calc(100% - 50px);
	}
	.btnChat {
		display: block;
	}
	.menu {
		width: 100%;
	}
	.messages {
		padding-top: 40px;
	}
	.message_box_wrapper {
		display: none;
	}
	.chat .social {
		display: none;
	}
	.chat.open .social {
		display: block;
	}
}
.ps-scrollbar-y-rail {
	display: none !important;
}
.mCSB_inside>.mCSB_container {
    margin-right: 0;
}
.btnChat {
	display: none !important;
}
/*.chat {
	z-index: 99999;
}
.chat .toggle-chat {
	z-index: 99999;
}
.chat .toggle-chat::after {
	content: '';
	display: block;
	position: absolute;
	top: -20px;
	left: 0;
	right: 0;
	bottom: 0;
	cursor: pointer;
	z-index: 99999;
}*/

.menu nav a.menuChat::before {
    background-image: url(../img/chat2.svg);
    background-size: 70%;
}