/*!
 * InfoCuba - XenCuba v4.1.1 Beta
 * Powered By Maxwell
 * Correo: carlosmaxwell93@gmail.com
 */

@charset "utf-8";

@font-face {
  font-family: 'Viga';
  font-style: normal;
  font-weight: 400;
  src: local('Viga-Regular'), url('../../fonts/Viga-Regular/WaD5umPYwC0_59FEtsVqIA.woff2') format('woff2');
  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: 'raul';
    src: url('/fuentes/raul2.ttf') ;
}

@font-face {
    font-family: 'raul2';
    src: url('/fuentes/raul.ttf') ;
}

@font-face {
    font-family: 'raul4';
    src: url('/fuentes/raul4.ttf') ;
}

@font-face {
    font-family: 'raul5';
    src: url('/fuentes/raul5.ttf') ;
}

@font-face {
    font-family: 'marlen';
    src: url('/fuentes/marlen.ttf') ;
}

@font-face {
    font-family: 'bigboss';
    src: url('/fuentes/bigboss.otf') ;
}

@font-face {
    font-family: 'lider';
    src: url('/fuentes/lider.ttf') ;
}

@font-face {
    font-family: 'dama';
    src: url('/fuentes/dama.ttf') ;
}
@font-face {
    font-family: 'boss';
    src: url('/fuentes/boss.ttf') ;
}
@font-face {
    font-family: 'manager';
    src: url('/fuentes/manager.otf') ;
}
@font-face {
    font-family: 'fundadora';
    src: url('/fuentes/fundadora.ttf') ;
}
@font-face {
    font-family: 'supervisor';
    src: url('/fuentes/supervisor.otf') ;
}
@font-face {
    font-family: 'disciplina';
    src: url('/fuentes/disciplina.ttf') ;
}
@font-face {
    font-family: 'emp';
    src: url('/fuentes/emp.ttf') ;
}
@font-face {
    font-family: 'user';
    src: url('/fuentes/user.otf') ;
}
@font-face {
  font-family: 'Viga';
  font-style: normal;
  font-weight: 400;
  src: local('Viga-Regular'), url('../../fonts/Viga-Regular/ysvjm4ygfCN9igDTKjiHkg.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}

@font-face{font-family:"Roboto";src:local(Roboto Thin),url("../../fonts/roboto/Roboto-Thin.woff2") format("woff2"),url("../../fonts/roboto/Roboto-Thin.woff") format("woff");font-weight:100}@font-face{font-family:"Roboto";src:local(Roboto Light),url("../../fonts/roboto/Roboto-Light.woff2") format("woff2"),url("../../fonts/roboto/Roboto-Light.woff") format("woff");font-weight:300}@font-face{font-family:"Roboto";src:local(Roboto Regular),url("../../fonts/roboto/Roboto-Regular.woff2") format("woff2"),url("../../fonts/roboto/Roboto-Regular.woff") format("woff");font-weight:400}@font-face{font-family:"Roboto";src:local(Roboto Medium),url("../../fonts/roboto/Roboto-Medium.woff2") format("woff2"),url("../../fonts/roboto/Roboto-Medium.woff") format("woff");font-weight:500}@font-face{font-family:"Roboto";src:local(Roboto Bold),url("../../fonts/roboto/Roboto-Bold.woff2") format("woff2"),url("../../fonts/roboto/Roboto-Bold.woff") format("woff");font-weight:700}

html {
  position: relative;
}

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

body {
	font-family: "Roboto","Helvetica Neue",Helvetica,Arial,sans-serif;
	direction: ltr;
	overflow-x: hidden;
	font-size: 16px;
	line-height: 1.5em;
	margin-top: 53px;
	transition: all .4s;
	-webkit-transition-duration: 0.4s;
	-moz-transition-duration: 0.4s;
	-o-transition-duration: 0.4s;
	transition-duration: 0.4s;
    background-size: cover;
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-position: center center;
    background-image: url(logos/fondo7.jpg);

}


audio
{
-webkit-transition:all 0.5s linear;
-moz-transition:all 0.5s linear;
-o-transition:all 0.5s linear;
transition:all 0.5s linear;
-moz-box-shadow: 2px 2px 4px 0px #006773;
-webkit-box-shadow:  2px 2px 4px 0px #006773;
box-shadow: 2px 2px 4px 0px #006773;
-moz-border-radius:7px 7px 7px 7px ;
-webkit-border-radius:7px 7px 7px 7px ;
border-radius:7px 7px 7px 7px ;
background: aquamarine;
}

.panel {
	border: none;
    border-radius: 3px;
}

.progress.progress_sm {
    border-radius: 5px;
    margin-bottom: 10px;
    height: 10px !important;
}

.progress.progress_sm .progress-bar {
    height: 10px !important;
    border-radius: 5px;

}

.bg-green {
float: left;
width: 0;
height: 100%;
font-size: 12px;
line-height: 20px;
color: #fff;
text-align: center;
background-color: #00c292;
-webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
-webkit-transition: width .6s ease;
-o-transition: width .6s ease;
transition: width .6s ease;
}
.bg-blue {
float: left;
width: 0;
height: 100%;
font-size: 12px;
line-height: 20px;
color: #fff;
text-align: center;
background-color: #1f73e1;
-webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
-webkit-transition: width .6s ease;
-o-transition: width .6s ease;
transition: width .6s ease;
}
.bg-pink {
float: left;
width: 0;
height: 100%;
font-size: 12px;
line-height: 20px;
color: #fff;
text-align: center;
background-color: #f027e7;
-webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
-webkit-transition: width .6s ease;
-o-transition: width .6s ease;
transition: width .6s ease;
}

textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {
  border-color: #00c292;
  border-style: solid;
  border-width: 1px;
  outline: 0;
  outline: thin dotted \9;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  -webkit-transition-duration: 0.2s;
	-moz-transition-duration: 0.2s;
	-o-transition-duration: 0.2s;
	transition-duration: 0.2s;
}

a[href] {
	color: #00c292;
}

.jconfirm.jconfirm-white .jconfirm-box .jconfirm-buttons button, 
.jconfirm.jconfirm-light .jconfirm-box .jconfirm-buttons button {
    text-transform: capitalize;
}

.showrating DIV,.showstaff DIV{
	display: inline;
	padding-top: 10px;
	position: relative;
}

.showrating IMG,.showstaff IMG{
	z-index: 100;
}

.showrating POS{
	position: absolute;
    background: #00c292;
    font-size: 8px;
    font-weight: 600;
    padding-left: 3px;
    padding-right: 4px;
    color: #FFFFFF;
    margin-top: 0px;
    border-radius: 5px;
    height: 15px;
    vertical-align: middle;
    line-height: normal;
    right: 3px;
    border: rgb(255,255,255) solid 2px;
    top:4px;
}

.img-rating,.showstaff IMG{
	margin-top: 10px;
	margin-right: 5px;
	width: 44px;
}

.btn:focus,
.btn:active,
.btn:hover {
	outline: 0 !important;
    border: #ff0606 solid 2px;
}

.alert {
	border: none;
}

.navbar-brand {
	font-family: 'Viga';
	color: #fff !important;
}

.desban_modal{
	overflow: scroll;
}

.portada_top{
    top: -13px;
}

.navbar-default,.modal-header,.mynoti {
background-color: #1a1b1b !important;
color: red;
font-family: 'Viga';
border-color: transparent;
box-shadow: 0 4px 5px 0 rgba(0,0,0,0.14),0 1px 10px 0 rgba(0,0,0,0.12),0 2px 4px -1px rgba(0,0,0,0.2);
background: #161515;
background: -webkit-linear-gradient(to right, #000000, #000000);
background: linear-gradient(to right, #000000, #000000);
    background-color: rgba(0, 0, 0, 0);
    opacity: 0.7;
}

.modal-header{
	border-radius: 6px 6px 0px 0px;
}

.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover, .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
    background-color: #5f7c8a !important;
    color: #fff;
}

.modal-header .close {
    margin-top: -2px;
    color: #fff;
}

.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover {
  background-color: transparent;
  color: rgb(214, 62, 61);
  border-bottom: rgb(214, 62, 61) solid 2px;
}

.animated {
	-webkit-animation-duration: 0.6s; 
	animation-duration: 0.6s; 
	-webkit-animation-fill-mode: both; 
	animation-fill-mode: both; 
}

.badge {
  display: inline-block;
  min-width: 10px;
  padding: 3px 7px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  color: #555;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  background-color: rgb(212, 217, 221);
  border-radius: 10px;
}

footer .footer {
    border-top: 1px solid #f9f9f9;
    padding: 10px 0;
    margin-top: 25px;
    z-index: 25;
    font-size: 14px;
}

@media (min-width: 768px) {
	/*.dropdown-menu-right:after {
	  border-bottom: 6px solid #fff;
	  border-left: 6px solid transparent;
	  border-right: 6px solid transparent;
	  content: " ";
	  display: inline-block;
	  right: 4%;
	  position: absolute;
	  top: -6px;
	}*/
	.dropdown-user-opcion{
		margin-right: 5px;
	}
}
/*emoticonos azules*/
.emojis{
	min-width: 245px;
}
.emoticons{
	min-width: 345px;
}
.stickers{
	min-width: 245px;
}
.rating{
	min-width: 343px;
}
.adjuntos{
	min-width: 245px;
}
.emojis,.emoticons,.stickers,.adjuntos,.rating,.radio{
	border-top-left-radius: 4px !important;
    border-top-right-radius: 4px !important;
}


@media (max-width: 768px) {
	.navbar-nav .open .dropdown-menu:not(.dropup-m) {
		position: fixed;
		top:57px;
		background-color: #fff;
		border: none;
		-webkit-box-shadow: 0 6px 12px rgba(0,0,0,.25);
		box-shadow: 0 6px 12px rgba(0,0,0,.25);
		border-radius:0px;
		float:left;
	}
	.navbar-nav .open .dropdown-menu.dropup-m {
	    position: fixed;
	    bottom: 80px;
	    background-color: #fff;
	    border-radius: 0px;
	    width: calc(100% - 38px);
	    border-top: #eee solid 1px;
	}
}

.dropdown-user-opcion {
  font-size: 14px;
}

.dropdown-user-opcion li:first-child {
	padding-top: 5px;
}

.dropdown-user-opcion li:last-child {
	padding-bottom: 5px;
}

.log-false {
    padding-top: 80px;
    transition: -webkit-transform 0.3s ease 0s, -moz-transform 0.3s ease 0s, -o-transform 0.3s ease 0s, transform 0.3s ease 0s, opacity 0.3s ease 0s;
    z-index: 5;
    overflow: auto;
    align-items: center;
    justify-content: center;
    display: flex;
    color: rgb(48, 46, 46);
   
}

.btn-red {
  border: 0;
  background:  #00c292;
  color: rgb(255, 255, 255);
  border: none;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  cursor: pointer;
  font-size: 14px;
  transition: 0.25s linear;
  box-shadow: inset 0 -3px 0 rgba(0, 0, 0, 0.2);
  -moz-box-shadow: inset 0 -3px 0 rgba(0,0,0,.2);
  -webkit-box-shadow: inset 0 -3px 0 rgba(0, 0, 0, 0.2);
}

.jconfirm-content{
	font-family: 'Viga';
}

.btn-red:hover,.btn-red:active,.btn-red:focus {
	color: #fff;
	outline: none;
}

.btn-send{
	background: #00c292;
  	color: rgb(143, 73, 73);
  	box-shadow: none;
  	outline: none;
}

.btn-send:hover,.btn-send:focus,.btn-send:active{
	color: #fff;
}

.caret:hover,.caret,.caret:focus,.caret:active{
	color: #fff !important;
}

@media (min-width: 768px) {
	.modal-dialog.login {
	    width: 300px;
	    margin: 60px auto;
	}
	.modal-dialog.medium {
	    width: 300px;
	    margin: 60px auto;
	}
}

/* alert bootstrap */
.alert-success {
  color: #fff;
  background-color: #00bc8c;
}
.alert-success hr {
  border-top-color: #c9e2b3;
}
.alert-success .alert-link {
  color: #2b542c;
}
.alert-danger {
  color: #fff;
  background: #F4645F none repeat scroll 0% 0%;
}
.alert-danger hr {
  border-top-color: #e4b9c0;
}
.alert-danger .alert-link {
  color: #843534;
}

.chat-container {
	padding-top: 55px;
}

.footer-start {
	background-color: #00000014;
	bottom: 0;
	height: 80px;
	position: fixed;
	width: calc(100% - 380px);
	padding: 6px;
}

.footer-start .navbar-nav{
	margin: 0px;
	margin-bottom: 4px;
	min-width: 100%;
}

.footer-start .navbar-nav li{
	margin-left: 2px;
}

@media (max-width: 768px) {
	.footer-start {
	    width: 100% !important;
	}
}
@media(min-width:768px) {
    .notifications {
        min-width: 350px!important;
        margin-right: -5px;
        margin-top: 1px!important
	}
}
.notifications {
    max-height: 350px;
    overflow: auto
}
.notifications {
    color: #fff;
	background-color: #0f3652;
}
.notifications>li {
    padding: 10px;
    padding-bottom: 5px;
    padding-top: 5px;
    border-bottom: #eee solid 1px;
    background-color: #0f3652;
}
.notifications>li:last-child {
    top:53px;
    background-color: #0f3652;
	border: none;
		
}
.notifications>li>img {
    position: absolute
}
.notifications>li>.information {
    padding-left: 50px
}
.notifications>li>.information>span {
    font-weight: 500;
    font-size: 13px
}
.notifications>li>.information>p {
    color: #9e9d9d;
    font-size: 12px;
    line-height: normal
}
.notifications>li>.information>span>time {
    font-weight: 400;
    font-size: 10px;
    color: #fff;
    vertical-align: middle;
    float: right
}
.count-notify {
    position: absolute;
    top: 10px;
    font-size: 9px;
    right: 3px;
    padding: 2px 4px;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    background-color: #dc0909;
    border-radius: 10px;
    min-width: 10px
}

@media(min-width:768px) {
    .mensajes {
        min-width: 350px!important;
        margin-right: -5px;
        margin-top: 1px!important
	}
}

/*@media(max-height:768px) {
    .menu-p {
        max-height: 370px;        
        overflow: scroll;
	}
}*/

.mensajes {
    max-height: 350px;
    overflow: auto
}
.mensajes {
    color: #fff;
	background-color: #0f3652;
}
.mensajes>li {
    padding: 10px;
    padding-bottom: 5px;
    padding-top: 5px;
    background-color: #0f3652;
    border-bottom: #eee solid 1px;
}
.mensajes>li:last-child {
    top:53px;
    background-color: #0f3652;
	border: none;
		
}
.mensajes>li>img {
    position: absolute
}
.mensajes>li>.info-sms {
    padding-left: 50px
}
.mensajes>li>.info-sms>span {
    font-weight: 500;
    font-size: 13px
}
.mensajes>li>.info-sms>p {
    color: #9e9d9d;
    font-size: 12px;
    line-height: normal
}
.mensajes>li>.info-sms>span>time {
    font-weight: 400;
    font-size: 10px;
    color: #9e9d9d;
    vertical-align: middle;
    float: right
}
.count-sms {
    position: absolute;
    top: 10px;
    font-size: 9px;
    right: 3px;
    padding: 2px 4px;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    background-color: #dc0909;
    border-radius: 10px;
    min-width: 10px
}

@media(min-width:768px) {
    .sol-amigos {
        min-width: 350px!important;
        margin-right: -5px;
        margin-top: 1px!important
	}
}

.sol-amigos {
    max-height: 350px;
    overflow: auto
}
.sol-amigos {
    color: #fff;
	background-color: #0f3652;
}
.sol-amigos>li {
    padding: 10px;
    padding-bottom: 5px;
    padding-top: 5px;
    background-color: #0f3652;
    border-bottom: #eee solid 1px;
}
.sol-amigos>li:last-child {
    top:53px;
    background-color: #0f3652;
	border: none;
		
}
.sol-amigos>li>img {
    position: absolute
}
.sol-amigos>li>.info-sol-amigos {
    padding-left: 50px
}
.sol-amigos>li>.info-sol-amigos>span {
    font-weight: 500;
    font-size: 13px
}
.sol-amigos>li>.info-sol-amigos>p {
    color: #9e9d9d;
    font-size: 12px;
    line-height: normal
}
.sol-amigos>li>.info-sol-amigos>span>time {
    font-weight: 400;
    font-size: 10px;
    color: #fff;
    vertical-align: middle;
    float: right
}
.count-sol-amigos {
    position: absolute;
    top: 10px;
    font-size: 9px;
    right: 3px;
    padding: 2px 4px;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    background-color: #dc0909;
    border-radius: 10px;
    min-width: 10px
}

.header-start {
	position: fixed;
	left: 0px;
	top:52px;
	height: auto;
	background-color: #f3f5f3;
	z-index: 500;
	width: 100%;
}

.user-list {
	top: 52px;
	backface-visibility: hidden !important;
	bottom: 0;
	height: calc(100% - 52px);
	right: 0;
	position: fixed;
	/*transition: -webkit-transform 0.3s ease 0s, -moz-transform 0.3s ease 0s, -o-transform 0.3s ease 0s, transform 0.3s ease 0s, opacity 0.3s ease 0s;*/
	transition: all .5s;
	width: 380px;
	z-index: 500;
	/*background-color: #48474f;*/
	background-color: rgb(255, 255, 255);;
	/*color: #9b9ea1;*/
	overflow-y: auto;
	overflow-x: hidden;
}

.view-profile{
	top: 52px;
	backface-visibility: hidden !important;
	bottom: 0;
	height: calc(100% - 52px);
	right: -350px;
	position: fixed;
	transition: -webkit-transform 0.3s ease 0s, -moz-transform 0.3s ease 0s, -o-transform 0.3s ease 0s, transform 0.3s ease 0s, opacity 0.3s ease 0s;
	width: 350px;
	z-index: 550;
	/*background-color: #48474f;*/
	background-color: #f0f0f0;;
	/*color: #9b9ea1;*/
	overflow-y: auto;
}

.view-profile .about{
	width: 100%;
    margin-bottom: 20px;
}

.view-profile .thumb {
    width: 100%;
    height: 350px;
    padding: 20px;
}

.view-profile .avatar {
    height: 100%;
    width: 100%;
    overflow: hidden;
    position: relative;
    border-radius: 4px;
}

.avatar .avatar-image {
    height: 100%;
    width: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    -webkit-transition-duration: 0.4s;
	-moz-transition-duration: 0.4s;
	-o-transition-duration: 0.4s;
	transition-duration: 0.4s;
}

.avatar .avatar-image:hover{
	opacity: .8;
	cursor: -webkit-zoom-in;
	cursor: -moz-zoom-in;
}

.view-profile .info {
    white-space: normal;
    padding: 0 20px;
}

.view-profile .info h3 {
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
    font-size: 24px;
    margin: 8px 0;
    line-height: 27px;
    text-overflow: ellipsis;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
}

.view-profile nav {
	margin-top: 20px;
    padding: 0 20px;
}

.view-profile nav .btn{
	margin-bottom: 5px;
}

.view-profile nav .back {
    float: right;
}

.header-usuario {
	position: fixed;
	top:52px;
	height: 55px;
	text-align: center;
	background: transparent;
	width: 350px;
	backface-visibility: hidden !important;
	right: 0;
	position: fixed;
	transition: all .3s;
	z-index: 1030;
	padding: 10px;
	padding-top: 15px;
}

.header-privados {
	width: calc(100% - 350px);
	left:0px;
	padding-left: 10px;
	padding-top: 4px;
}

div.user > div {
	vertical-align: top;
	display: inline-block;
}

div.user > div > nick {
	display: block;
	font-size: 13px;
}

/*** zona de mensajes ***/

#zone-boddy{
	position: fixed;
	background-color: #fff;
	width: calc(100%);
	height: calc(100% - 188px);
	padding-top: 5px;
	padding-left: 3px;
	/**padding-right: 185px;**/
	overflow: auto;
}

.contenedor {
    /*Estilos estándar experimentales (Principalmente Firefox)*/
    scrollbar-color: rgba(0, 0, 0, .5) rgba(0, 0, 0, 0);
    scrollbar-width: thin;
	scrollbar-width: 10px;
}


@media (max-width: 768px) {
	.user-list {
		height: calc(100% - 132px);
		left: calc(100% - 57px);
		width: 100%;
	}

	/*#zone-boddy{
		width: calc(100% - 57px);
	}*/

	.header-usuario{
		width: 65px;
	}

	.header-privados{
		width: calc(100% - 65px);
	}

	#zone-header{
		margin-top: 4px;
	}
	.popover{
		width: 100%;
	}
}

#send_message{
	border-radius:0px;
	border-right:none;
}

.header-privados li {
	position: relative;
}

.header-privados li.active::after {
	border-bottom: 6px solid #0f3652;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    content: "";
    display: inline-block;
    left: 40%;
    position: absolute;
    bottom: -10px;
}

.header-privados li.active > img{
	border: #f40707 solid 3px;
}

.header-privados .img-thumbnail {
	padding: 2px;
}

ul#zone-header li {
	position: relative;
	cursor: pointer;
	transition: all .4s;
	-webkit-transition-duration: 0.4s;
	-moz-transition-duration: 0.4s;
	-o-transition-duration: 0.4s;
	transition-duration: 0.4s;
}

ul#zone-header li:hover {
	opacity: 0.8;
}

.user-list div.user {
	padding: 6px;
	padding-top: 8px;
	padding-bottom: 8px;
	font-size: 13px;
	border-bottom: rgba(226,226,226, 0.2) solid 1px;
	cursor: pointer;
	transition: all .3s;
	-webkit-transition-duration: 0.3s;
	-moz-transition-duration: 0.3s;
	-o-transition-duration: 0.3s;
	transition-duration: 0.3s;
}
/*
.user-list div.user:nth-child(2n+1) {
    background-color: #f1f1f1;
}
*/
.user-list div.user:hover {
	background-color: #e2e2e2;
}

div.user div:first-child {
	padding: 3px;
}

.user deco i {
	padding-right: 0px;
}

.user msg {
	display: block;
	text-align: right;
	align-content: right;
}

div.app-item{
	display: block;
	position: relative;
	padding: 5px;
	/*margin-bottom: 20px;*/
	font-size: 14px;
	transition: all .3s;
	-webkit-transition-duration: 0.3s;
	-moz-transition-duration: 0.3s;
	-o-transition-duration: 0.3s;
	transition-duration: 0.3s;
	/*background-color: #f4f4f4;*/
}

div.app-item:hover{
	/*background-color: #f4f4f4;*/
}

/* avatar en mensaje */
div.app-item > div.app-item-avatar{
	vertical-align: middle;
	position: absolute;
}

.app-item-msg nick{
	/*display: block;*/
}

.app-item-msg time{
	/*display: block;*/
	color: #ccc;
	padding-left: 5px;
	font-size: 8px;
	vertical-align: middle;
}

div.app-item-msg > p{
	margin: 0px;
}

.app-item-avatar img{
	vertical-align: middle;
}

.app-item-msg{
	/*width: 100%;*/
	/*border-radius: 6px;*/
	padding: 3px;
	/*padding-left: 1px;*/
	padding-right: 8px;
	margin-left: 45px;
}

.app-item-msg{
	/*background-color: #f2f2f2;*/
	font-style: normal;
	font-weight: normal;
	line-height: 1.42857143;
	text-align: left;
	text-align: start;
	text-decoration: none;
	text-shadow: none;
	text-transform: none;
	letter-spacing: normal;
	word-break: normal;
	word-spacing: normal;
	word-wrap: normal;
	white-space: normal;
}

.tx0 {color:#000000;} .tx1 {color:#313131;} .tx2 {color:#585858;} .tx3 {color:#808080;}
.tx4 {color:#FF0000;} .tx5 {color:#A80000;} .tx6 {color:#D74600;} .tx7 {color:#FF8040;}
.tx8 {color:#56562C;} .tx9 {color:#808040;}

#text_color {
    text-align: center;
    width: 10px;
    height: 10px;
    vertical-align: bottom;
    border-radius: 5px;
}

.buttons-footer button{
	margin-left: 4px;
	display: inline-block;
}

.system {
	color: #993300;
}

.tx-gray { 
	color:#999;
}

.bold {
	font-weight:bold;
}

.italic {
	font-style:italic;
}

.unline {
	text-decoration:underline;
}

.divemot {
	padding: 10px;
}

.divemot:hover {
	cursor:pointer;
}

.selemot > img {
	cursor: pointer;
	padding: 3px;
}

.popover { 
    max-width: 400px;
}

.status-1 { /* en linea */
	background: #008200;
	width: 10px;
	height: 10px;
	border-radius: 5px;
	display: inline-block;
	margin-right: 3px;
	animation-name: pulse;
    -webkit-animation-name: pulse;
    animation-duration: 0.9s;
    -webkit-animation-duration: 0.4s;
    animation-delay: 0.6s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}

.status-2 { /* offline */
	background: #ddd;
	width: 6px;
	height: 6px;
	border-radius: 3px;
	display: inline-block;
	margin-right: 3px;
	animation-name: pulse;
    -webkit-animation-name: pulse;
    animation-duration: 0.4s;
    -webkit-animation-duration: 0.4s;
    animation-delay: 0.6s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}

.status-3 { /* ausente */
	background: #dd4f43;
	width: 10px;
	height: 10px;
	border-radius: 5px;
	display: inline-block;
	margin-right: 3px;
	animation-name: pulse;
    -webkit-animation-name: pulse;
    animation-duration: 0.9s;
    -webkit-animation-duration: 0.4s;
    animation-delay: 0.6s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}
.stt0{ }
.stt1{color:#008200; text-shadow: #ffffffe0 0px 1px 11px;font-weight:bold;} /* Visitantes 1 */

.stt2{font-family: 'user';color:#005330; text-shadow: #ffffffe0 0px 1px 11px;font-weight:bold;} /* Señor 2*/
.stt3{font-family: 'user';color:#f2697d; text-shadow: #ffffffe0 0px 1px 11px;font-weight:bold;} /* Señora 2*/
.stt4{font-family: 'user';color:#aa6161; text-shadow: #ffffffe0 0px 1px 11px;font-weight:bold;} /* Diamonds 2*/
.stt5{font-family: 'user';color:#463d4f; text-shadow: #ffffffe0 0px 1px 11px;font-weight:bold;} /* Super chico 2*/
.stt6{font-family: 'user';color:#ac17ac; text-shadow: #ffffffe0 0px 1px 11px;font-weight:bold;} /* Super Chica 2*/
.stt7{font-family: 'user';color:#5c7b06; text-shadow: #ffffffe0 0px 1px 11px;font-weight:bold;} /* Conde 2*/
.stt8{font-family: 'user';color:#950930; text-shadow: #ffffffe0 0px 1px 11px;font-weight:bold;} /* Condesa 2*/
.stt9{font-family: 'user';color:#1a028f; text-shadow: #ffffffe0 0px 1px 11px;font-weight:bold;} /* Markes 2*/
.stt10{font-family: 'user';color:#c40dc4; text-shadow: #ffffffe0 0px 1px 11px;font-weight:bold;} /* Markesa 2*/
.stt11{font-family: 'user';color:#0a43ec; text-shadow: #ffffffe0 0px 1px 11px;font-weight:bold;} /* Principe 2*/
.stt12{font-family: 'user';color:#e60404eb; text-shadow: #ffffffe0 0px 1px 11px;font-weight:bold;} /* Princesa 2*/
.stt13{font-family: 'user';color:#158254; text-shadow: #ffffffe0 0px 1px 11px;font-weight:bold;} /* Duke 2*/
.stt14{font-family: 'user';color:#a001fc; text-shadow: #ffffffe0 0px 1px 11px;font-weight:bold;} /* Dukeza 2*/
.stt15{font-family: 'user';color:#770202; text-shadow: #423d3d 0px 1px 11px;font-weight:bold;} /* Rey 2*/
.stt16{font-family: 'user';color:#f735f7; text-shadow: #423d3d 0px 1px 11px;font-weight:bold;} /* Reyna 2*/
.stt17{font-family: 'emp';color:#050305; text-shadow: #423d3d 0px 1px 11px;font-weight:bold;} /* Emperador 2*/
.stt18{font-family: 'emp';color:#ff0162; text-shadow: #423d3d 0px 1px 11px;font-weight:bold;} /* Emperatriz 2*/

.stt19{font-family: 'disciplina';background: url(/efectos/star2.gif); color: #0a105f; text-shadow: rgb(247, 3, 3) 0px 1px 11px; font-weight:bold;} /* Disciplina*/
.stt20{font-family: 'supervisor';background: url(/efectos/star1.gif); color: #0616f7; text-shadow: rgb(2, 2, 2) 0px 1px 11px; font-weight:bold;} /* Supervisor 3*/
.stt21{font-family: 'fundadora';background: url(/efectos/flojo.gif); color: #ae00ff; text-shadow: rgb(0, 0, 0) 0px 1px 11px; font-weight:bold;} /* Fundador 3*/
.stt22{font-family: 'raul4';background: url(/efectos/duro.gif); color: #ff0000; text-shadow: rgb(0, 0, 0) 0px 1px 11px; font-weight:bold;} /* Manager 3*/
.stt23{font-family: 'boss';background: url(/efectos/fuego.gif); color: #f10a0a; text-shadow: rgb(255, 2, 2) 0px 1px 11px; font-weight:bold;} /* Boss 3*/
.stt24{font-family: 'dama';background: url(/efectos/fuego.gif); color: #fd00d3; text-shadow: rgb(0, 0, 0) 0px 1px 11px; font-weight:bold;} /* 1ra Dama */
.stt25{font-family: 'lider';background: url(/efectos/fuego.gif); color: #000000; text-shadow: rgb(247, 3, 3) 0px 1px 11px; font-weight:bold;} /* Lider 4*/
.stt26{font-family: 'raul2';background: url(/efectos/fuego.gif); text-shadow: #000000 0px 1px 11px; font-weight:bold; -webkit-animation: myfirst 10s linear infinite; /* Chrome, Safari, Opera */ animation: myfirst 15s linear infinite; } /* Chrome, Safari, Opera */ @-webkit-keyframes myfirst { 0% {color: #000000;} 20% {color: #0000FF;} 30% {color: #FE2E2E;} 40% {color: #04B404;} 50% {color: #000000;} 60% {color: #DF01D7;} 70% {color: #FF0000;} 80% {color: #000000;} 90% {color: #0101DF;} 100% {color: #3ADF00;} } /* Standard syntax */ @keyframes myfirst { 0% {color: #0101DF;} 20% {color: #000000;} 30% {color: #DF013A;} 40% {color: #FF0000;} 50% {color: #FFFF00;} 60% {color: #0101DF;} 70% {color: #FFBF00;} 80% {color: #FFBF00;} 90% {color: #0101DF;} 100% {color: #000000;}} /* Supremo 4*/
.stt27{font-family: 'marlen';background: url(/efectos/fuego.gif); text-shadow: #000000 0px 1px 11px; font-weight:bold; -webkit-animation: myfirst 10s linear infinite; /* Chrome, Safari, Opera */ animation: myfirst 15s linear infinite; } /* Chrome, Safari, Opera */ @-webkit-keyframes myfirst { 0% {color: #000000;} 20% {color: #0000FF;} 30% {color: #FE2E2E;} 40% {color: #04B404;} 50% {color: #000000;} 60% {color: #DF01D7;} 70% {color: #FF0000;} 80% {color: #000000;} 90% {color: #0101DF;} 100% {color: #3ADF00;} } /* Standard syntax */ @keyframes myfirst { 0% {color: #0101DF;} 20% {color: #000000;} 30% {color: #DF013A;} 40% {color: #FF0000;} 50% {color: #FFFF00;} 60% {color: #0101DF;} 70% {color: #FFBF00;} 80% {color: #FFBF00;} 90% {color: #0101DF;} 100% {color: #000000;}} /* Patrona 5*/
.stt28{font-family: 'raul'; background: url(/efectos/fuego.gif); text-shadow: #000000 0px 1px 11px; font-weight:bold; -webkit-animation: myfirst 10s linear infinite; /* Chrome, Safari, Opera */ animation: myfirst 15s linear infinite; } /* Chrome, Safari, Opera */ @-webkit-keyframes myfirst { 0% {color: #000000;} 20% {color: #0000FF;} 30% {color: #FE2E2E;} 40% {color: #04B404;} 50% {color: #000000;} 60% {color: #DF01D7;} 70% {color: #FF0000;} 80% {color: #000000;} 90% {color: #0101DF;} 100% {color: #3ADF00;} } /* Standard syntax */ @keyframes myfirst { 0% {color: #0101DF;} 20% {color: #000000;} 30% {color: #DF013A;} 40% {color: #FF0000;} 50% {color: #FFFF00;} 60% {color: #0101DF;} 70% {color: #FFBF00;} 80% {color: #FFBF00;} 90% {color: #0101DF;} 100% {color: #000000;}} /* Patron 5*/



/*.stt17{background: url(/efectos/fuego.gif); text-shadow: #fff 0px 1px 11px; font-weight:bold; -webkit-animation: myfirst 10s linear infinite; /* Chrome, Safari, Opera */ animation: myfirst 15s linear infinite; } /* Chrome, Safari, Opera */ @-webkit-keyframes myfirst { 0% {color: #f8f303;} 20% {color: #9203f8;} 30% {color: #03f8f8;} 40% {color: #ff0707;} 50% {color: #69fb07;} 60% {color: #fb8907;} 70% {color: #fb07ca;} 80% {color: #1707fb;} 90% {color: #07fb95;} 100% {color: #f8f303;} } /* Standard syntax */ @keyframes myfirst { 0% {color: #f8f303;} 20% {color: #9203f8;} 30% {color: #03f8f8;} 40% {color: #ff0707;} 50% {color: #69fb07;} 60% {color: #fb8907;} 70% {color: #fb07ca;} 80% {color: #1707fb;} 90% {color: #07fb95;} 100% {color: #f8f303;}} /* Patron  5*/



.color-1 { /* Registrado */
	background: #008200;
	width: 6px;
	height: 6px;
	border-radius: 3px;
	display: inline-block;
	margin-right: 3px;
	animation-name: pulse;
    -webkit-animation-name: pulse;
    animation-duration: 0.4s;
    -webkit-animation-duration: 0.4s;
    animation-delay: 0.6s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}

.color-2 { /* Estrella */
	background: #749218;
	width: 6px;
	height: 6px;
	border-radius: 3px;
	display: inline-block;
	margin-right: 3px;
	animation-name: pulse;
    -webkit-animation-name: pulse;
    animation-duration: 0.4s;
    -webkit-animation-duration: 0.4s;
    animation-delay: 0.6s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}

.color-3 { /* Super Estrella */
	background: #800080;
	width: 6px;
	height: 6px;
	border-radius: 3px;
	display: inline-block;
	margin-right: 3px;
	animation-name: pulse;
    -webkit-animation-name: pulse;
    animation-duration: 0.4s;
    -webkit-animation-duration: 0.4s;
    animation-delay: 0.6s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}

.color-4 { /* Estrella Permanente */
	background: #F26600;
	width: 6px;
	height: 6px;
	border-radius: 3px;
	display: inline-block;
	margin-right: 3px;
	animation-name: pulse;
    -webkit-animation-name: pulse;
    animation-duration: 0.4s;
    -webkit-animation-duration: 0.4s;
    animation-delay: 0.6s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}

.color-5 { /* Prince */
	background: #6696FA;
	width: 6px;
	height: 6px;
	border-radius: 3px;
	display: inline-block;
	margin-right: 3px;
	animation-name: pulse;
    -webkit-animation-name: pulse;
    animation-duration: 0.4s;
    -webkit-animation-duration: 0.4s;
    animation-delay: 0.6s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}

.color-6 { /* Princess */
	background: #FF0066;
	width: 6px;
	height: 6px;
	border-radius: 3px;
	display: inline-block;
	margin-right: 3px;
	animation-name: pulse;
    -webkit-animation-name: pulse;
    animation-duration: 0.4s;
    -webkit-animation-duration: 0.4s;
    animation-delay: 0.6s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}
.color-7 { /* Destacado */
	background: #9999FF;
	width: 6px;
	height: 6px;
	border-radius: 3px;
	display: inline-block;
	margin-right: 3px;
	animation-name: pulse;
    -webkit-animation-name: pulse;
    animation-duration: 0.4s;
    -webkit-animation-duration: 0.4s;
    animation-delay: 0.6s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}

.color-8 { /* Hombre VIP */
	background: #993300;
	width: 6px;
	height: 6px;
	border-radius: 3px;
	display: inline-block;
	margin-right: 3px;
	animation-name: pulse;
    -webkit-animation-name: pulse;
    animation-duration: 0.4s;
    -webkit-animation-duration: 0.4s;
    animation-delay: 0.6s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}

.color-9 { /* Mujer VIP */
	background: #9900FF;
	width: 6px;
	height: 6px;
	border-radius: 3px;
	display: inline-block;
	margin-right: 3px;
	animation-name: pulse;
    -webkit-animation-name: pulse;
    animation-duration: 0.4s;
    -webkit-animation-duration: 0.4s;
    animation-delay: 0.6s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}

.color-10 { /* Reina */
	background: #c0f;
	width: 6px;
	height: 6px;
	border-radius: 3px;
	display: inline-block;
	margin-right: 3px;
	animation-name: pulse;
    -webkit-animation-name: pulse;
    animation-duration: 0.4s;
    -webkit-animation-duration: 0.4s;
    animation-delay: 0.6s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}

.color-11 { /* Asistente */
	background: #3B3BBD;
	width: 6px;
	height: 6px;
	border-radius: 3px;
	display: inline-block;
	margin-right: 3px;
	animation-name: pulse;
    -webkit-animation-name: pulse;
    animation-duration: 0.4s;
    -webkit-animation-duration: 0.4s;
    animation-delay: 0.6s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}

.color-12 { /* Operador */
	background: #0303FE;
	width: 6px;
	height: 6px;
	border-radius: 3px;
	display: inline-block;
	margin-right: 3px;
	animation-name: pulse;
    -webkit-animation-name: pulse;
    animation-duration: 0.4s;
    -webkit-animation-duration: 0.4s;
    animation-delay: 0.6s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}
.color-13 { /* Supervisor */
	background: #A53486;
	width: 6px;
	height: 6px;
	border-radius: 3px;
	display: inline-block;
	margin-right: 3px;
	animation-name: pulse;
    -webkit-animation-name: pulse;
    animation-duration: 0.4s;
    -webkit-animation-duration: 0.4s;
    animation-delay: 0.6s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}

.color-14 { /* Sub-Admin */
	background: #DD4F43;
	width: 6px;
	height: 6px;
	border-radius: 3px;
	display: inline-block;
	margin-right: 3px;
	animation-name: pulse;
    -webkit-animation-name: pulse;
    animation-duration: 0.4s;
    -webkit-animation-duration: 0.4s;
    animation-delay: 0.6s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}

.color-15 { /* Administrador */
	background: #000000;
	width: 6px;
	height: 6px;
	border-radius: 3px;
	display: inline-block;
	margin-right: 3px;
	animation-name: pulse;
    -webkit-animation-name: pulse;
    animation-duration: 0.4s;
    -webkit-animation-duration: 0.4s;
    animation-delay: 0.6s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}

.color-16 { /* Webmaster */
	background: #FF0000;
	width: 6px;
	height: 6px;
	border-radius: 3px;
	display: inline-block;
	margin-right: 3px;
	animation-name: pulse;
    -webkit-animation-name: pulse;
    animation-duration: 0.4s;
    -webkit-animation-duration: 0.4s;
    animation-delay: 0.6s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}

.color-17 { /* Maxwell */
	background: #6c3483;
	width: 6px;
	height: 6px;
	border-radius: 3px;
	display: inline-block;
	margin-right: 3px;
	animation-name: pulse;
    -webkit-animation-name: pulse;
    animation-duration: 0.4s;
    -webkit-animation-duration: 0.4s;
    animation-delay: 0.6s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}

.color-18 { /* Maxwell */
	background: #6c3483;
	width: 6px;
	height: 6px;
	border-radius: 3px;
	display: inline-block;
	margin-right: 3px;
	animation-name: pulse;
    -webkit-animation-name: pulse;
    animation-duration: 0.4s;
    -webkit-animation-duration: 0.4s;
    animation-delay: 0.6s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}
.bg19 {
    background: #0a105f;
    color: #fff;
    font-family: disciplina;
    font-size: 18px;
    vertical-align: text-top;
    border-radius: 10px
}
.bg20 {
    background: #0616f7;
    color: #fff;
    font-family: supervisor;
    font-size: 18px;
    vertical-align: text-top;
    border-radius: 10px
}
.bg21 {
    background: #ae00ff;
    color: #fff;
    font-family: fundadora;
    font-size: 20px;
    vertical-align: text-top;
    border-radius: 10px
}
.bg22 {
    background: #ff0000;
    color: #fff;
    font-family: raul4;
    font-size: 20px;
    vertical-align: text-top;
    border-radius: 10px
}
.bg23 {
    background: #f10a0a;
    color: #fff;
    font-family: boss;
    font-size: 20px;
    vertical-align: text-top;
    border-radius: 10px;
}
.bg24 {
    background: #000000;
    color: #fd00d3;
    font-family: dama;
    font-size: 20px;
    vertical-align: text-top;
    border-radius: 10px;
}
.bg25 {
    background: #000000;
    color: #fff;
    font-family: lider;
    font-size: 20px;
    vertical-align: text-top;
    border-radius: 10px;
}
.bg26 {
    background: #f10303;
    color: rgb(0, 0, 0);
    font-family: raul2;
    font-size: 20px;
    vertical-align: text-top;
    border-radius: 10px;
}
.bg27 {
    background: #000000;
    color: rgb(231, 9, 9);
    font-family: marlen;
    font-size: 25px;
    vertical-align: text-top;
    border-radius: 10px;
}
.bg28 {
    background: #000000;
    color: rgb(247, 12, 12);
    font-family: raul;
    font-size: 25px;
    vertical-align: text-top;
    border-radius: 10px;
}
span.send {
	color: #ff0000;
}

.isgif {
	vertical-align: middle;
	width: 40px;
	height: 40px;
}

.ispngemojis {
	vertical-align: middle;
	width: 40px;
	height: 40px;
}

.isgifsticks {
	vertical-align: middle;
	width: 120px;
	height: 120px;
}

li[zone] {
	position: relative;
}

li[zone] > img {
	width: 44px;
	height: 42px;
}

.dropdown-user-opcion li:not(.vis) {
	display: none;
}

.app-item-msg nick:hover {
	cursor: pointer;
}

.edata {
    position: absolute;
    background: radial-gradient( 5px -9px, circle, white 8%, red 26px );
    background-color: red;
    font-size: 10px;
    font-weight: 600;
    padding-left: 3px;
    padding-right: 4px;
    color: #FFFFFF;
    margin-top: 0px;
    border: 2px solid white;
    border-radius: 12px; /* one half of ( (border * 2) + height + padding ) */
    box-shadow: 1px 1px 1px black;
    height: 17px;
    vertical-align: middle;
    line-height: normal;
    right: 3px;
    display: none;
}

#float-mnu {
    position: fixed;
    left: 100%;
    margin-left: -535px;
    width: 135px;
    text-align: right;
    z-index: 255;
}

#float-mnu DIV {
 float:right;
 font-size:10px;
 color:#006600;
}

.uactive,.usernew {
	float:right; 
	margin:2px; 
	cursor:pointer;
	position:relative;
}

@media (max-width: 768px) {
	#float-mnu {
		display: none;
	}
	#zone-boddy{
		padding-right: 0px;
	}
}

label.icon {
	display: inline-block;
}

@-moz-keyframes blinker {  
 0% { opacity: 1.0; }
 50% { opacity: 0.3; }
 100% { opacity: 1.0; }
 }

@-webkit-keyframes blinker {  
 0% { opacity: 1.0; }
 50% { opacity: 0.3; }
 100% { opacity: 1.0; }
 }

@keyframes blinker {  
 0% { opacity: 1.0; }
 50% { opacity: 0.3; }
 100% { opacity: 1.0; }
} 

.escribiendo {
	animation-name: blinker;
	animation-duration: 1s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}

.attcolor {
	display: inline-block;
    height: 30px;
    width: 30px;
    padding: 5px;
    -webkit-padding:0px;
}

.zoom {
	cursor: -webkit-zoom-in;
	cursor: -moz-zoom-in;
}

.zoom:hover {
	opacity: .8;
}

.loader {
	width: 100%;
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	-moz-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	padding: 5px 0;
}

.loader:after {
	display: block;
	position: relative;
	width: 20px;
	height: 20px;
	-webkit-animation: rotate 0.6s linear infinite;
	-moz-animation: rotate 0.6s linear infinite;
	-ms-animation: rotate 0.6s linear infinite;
	-o-animation: rotate 0.6s linear infinite;
	animation: rotate 0.6s linear infinite;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
	border-top: 1px solid #545a6a;
	border-bottom: 1px solid #d4d4db;
	border-left: 1px solid #545a6a;
	border-right: 1px solid #d4d4db;
	content: '';
	opacity: .5;
}

.loader.loader_large:after {
	width: 40px;
	height: 40px;
}

.loader.loader_medium:after {
	width: 25px;
	height: 25px;
}

.loader.loader_small:after {
	width: 10px;
	height: 10px;
}

.loader.loader_green:after {
	opacity: 1;
	border-top: 1px solid #42a26e;
	border-bottom: 1px solid #fff;
	border-left: 1px solid #42a26e;
	border-right: 1px solid #fff;
}

.loader_f {
	width: 100%;
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	-moz-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	padding: 5px 0;
}

.loader_f:after {
	display: block;
	position: relative;
	width: 20px;
	height: 20px;
	-webkit-animation: rotate 0.6s linear infinite;
	-moz-animation: rotate 0.6s linear infinite;
	-ms-animation: rotate 0.6s linear infinite;
	-o-animation: rotate 0.6s linear infinite;
	animation: rotate 0.6s linear infinite;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
	border-top: 1px solid #545a6a;
	border-bottom: 1px solid #d4d4db;
	border-left: 1px solid #545a6a;
	border-right: 1px solid #d4d4db;
	content: '';
	opacity: .5;
}

.loader-search {
	width: 100%;
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	-moz-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	padding: 5px 0;
}

.loader-search:after {
	display: block;
	position: relative;
	width: 20px;
	height: 20px;
	-webkit-animation: rotate 0.6s linear infinite;
	-moz-animation: rotate 0.6s linear infinite;
	-ms-animation: rotate 0.6s linear infinite;
	-o-animation: rotate 0.6s linear infinite;
	animation: rotate 0.6s linear infinite;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
	border-top: 1px solid #545a6a;
	border-bottom: 1px solid #d4d4db;
	border-left: 1px solid #545a6a;
	border-right: 1px solid #d4d4db;
	content: '';
	opacity: .5;
}

.loader-search-mobile {
	width: 100%;
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	-moz-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	padding: 5px 0;
}

.loader-search-mobile:after {
	display: block;
	position: relative;
	width: 20px;
	height: 20px;
	-webkit-animation: rotate 0.6s linear infinite;
	-moz-animation: rotate 0.6s linear infinite;
	-ms-animation: rotate 0.6s linear infinite;
	-o-animation: rotate 0.6s linear infinite;
	animation: rotate 0.6s linear infinite;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
	border-top: 1px solid #545a6a;
	border-bottom: 1px solid #d4d4db;
	border-left: 1px solid #545a6a;
	border-right: 1px solid #d4d4db;
	content: '';
	opacity: .5;
}

.loader-up-avatar{
	width: 100%;
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	-moz-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	padding: 5px 0;
}

.loader-up-avatar:after {
	display: block;
	position: relative;
	width: 20px;
	height: 20px;
	-webkit-animation: rotate 0.6s linear infinite;
	-moz-animation: rotate 0.6s linear infinite;
	-ms-animation: rotate 0.6s linear infinite;
	-o-animation: rotate 0.6s linear infinite;
	animation: rotate 0.6s linear infinite;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
	border-top: 1px solid #545a6a;
	border-bottom: 1px solid #d4d4db;
	border-left: 1px solid #545a6a;
	border-right: 1px solid #d4d4db;
	content: '';
	opacity: .5;
}

@keyframes rotate {
	0% {
		transform: rotateZ(-360deg);
		-webkit-transform: rotateZ(-360deg);
		-moz-transform: rotateZ(-360deg);
		-o-transform: rotateZ(-360deg);
	}
	100% {
		transform: rotateZ(0deg);
		-webkit-transform: rotateZ(0deg);
		-moz-transform: rotateZ(0deg);
		-o-transform: rotateZ(0deg);
	}
}
@-webkit-keyframes rotate {
	0% {
		transform: rotateZ(-360deg);
		-webkit-transform: rotateZ(-360deg);
		-moz-transform: rotateZ(-360deg);
		-o-transform: rotateZ(-360deg);
	}
	100% {
		transform: rotateZ(0deg);
		-webkit-transform: rotateZ(0deg);
		-moz-transform: rotateZ(0deg);
		-o-transform: rotateZ(0deg);
	}
}
@-moz-keyframes rotate {
	0% {
		transform: rotateZ(-360deg);
		-webkit-transform: rotateZ(-360deg);
		-moz-transform: rotateZ(-360deg);
		-o-transform: rotateZ(-360deg);
	}
	100% {
		transform: rotateZ(0deg);
		-webkit-transform: rotateZ(0deg);
		-moz-transform: rotateZ(0deg);
		-o-transform: rotateZ(0deg);
	}
}
@-o-keyframes rotate {
	0% {
		transform: rotateZ(-360deg);
		-webkit-transform: rotateZ(-360deg);
		-moz-transform: rotateZ(-360deg);
		-o-transform: rotateZ(-360deg);
	}
	100% {
		transform: rotateZ(0deg);
		-webkit-transform: rotateZ(0deg);
		-moz-transform: rotateZ(0deg);
		-o-transform: rotateZ(0deg);
	}
}

.js-upload-avatar {
	display: none;
}

.navbar-search-user{
	display: none;
}

.navbar-search {
    position: relative;
    top: 2px;
    background: #b6c3ca;
    border: none;
    width: auto;
    min-width: 320px;
    -webkit-box-shadow: none;
    box-shadow: none;
    /*transition: all 1.4s;
    -webkit-transition-duration: 1.4s;
	-moz-transition-duration: 1.4s;
	-o-transition-duration: 1.4s;
	transition-duration: 1.4s;*/
}

.navbar-search:focus{
	background:#b6c3ca;
}

.dropdown-user-opcion{
	  min-width: 180px;
}

table.dataTable thead .sorting:after {
    opacity: 0;
    content: "";
}

table.dataTable thead .sorting_asc:after {
    content: "";
}

table.dataTable thead .sorting_desc:after {
    content: "";
}

.dropdown-user-opcion > li > a:hover,
.dropdown-user-opcion > li > a:focus {
	color:#fff !important;
	background-color:#5f7c8a !important;
	/*background-color: rgba(47,62,79,.8) !important;
	background-image: -webkit-linear-gradient(top, #2f3e4f 0%, #293748 100%) !important;
	background-image:      -o-linear-gradient(top, #2f3e4f 0%, #293748 100%) !important;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#2f3e4f), to(#293748)) !important;
	background-image:         linear-gradient(to bottom, #2f3e4f 0%, #293748 100%) !important;
	background-repeat: repeat-x !important;*/
}

.dropdown-user-opcion > li > a {
	color:#929090 !important;
}

/*mensajes

.dropdown-sms > li:hover,
.dropdown-sms > li:focus {
	color:#fff !important;
	background-color:#929090 !important;
}

.dropdown-sms > ul > li {
	color:#fff !important;
	background-color:#fff !important;
}*/

.dropdown-widget{
	width:400px;
	color: #555;
}

.dropdown-widget{
	padding-bottom:0!important;
	padding-top:0!important;
	border-top:0 none!important;
}

.dropdown-widget-header{
	padding:8px;
	border-bottom:1px solid #e4e4e4;
	display:block;
	font-size:11px;
	font-weight:600;
	line-height:16px
}

.dropdown-widget-body{
	overflow: auto;
	max-height: 280px;
}

.dropdown-widget-header a:hover{
	text-decoration:underline;
}

.mt10{
	margin-top: 10px;
}

.mb10{
	margin-bottom: 10px;
}

@media (min-width: 768px) {
	.dropdown-search {
		left: 0!important;
		top: 50px!important;
		right: inherit!important;
		margin-left: 7px;
		margin-right: 15px;
		width: calc(100% - 25px);
	}
}

@media (min-width: 768px) {
	.dropdown-search-mobile {
		left: 0!important;
		top: 50px!important;
		right: inherit!important;
		margin-left: 7px;
		margin-right: 15px;
		width: calc(100% - 25px);
	}
}

.dropdown-search-mobile  {
    width: 339px;
}

.div-separator-buscar  {
    padding:2px;
    padding-top:5px;
    text-align:left;
    border-top:1px solid #e5e5e5
}

/* feeds-item */
.feeds-item {
	border-bottom: 1px solid #e4e4e4;
}
.feeds-item:last-child {
	border-bottom: 0 none;
}
.feeds-item.unread {
	background: #E9EAED;
}

.feeds-item.active {
	background: #D0E2FF;
}
/* -- */

/* data-container */
.box-container {
    border: 1px solid #EFEFEF;
    border-radius: 1px;
    margin-bottom: 15px;
}
.data-container {
	position: relative; /* relative for .data-avatar to be absolute */
	display: block;
	width: 100%;
	padding: 8px;
	min-height: 64px; /* 50px avatar + 16px padding */
	border-radius: 3px;
}
.data-container.small {
	min-height: 46px; /* 30px avatar + 16px padding */
}

a.data-container:hover, .data-container.clickable:hover {
	background: #f6f7f8;
	text-decoration: none;
	cursor: pointer;
}

.data-avatar {
	position: absolute;
	top: 8px;
	left: 8px;
	width: 30px;
	height: 30px;
	text-align: center;
	border-radius: 2px;
}
.data-avatar .left-avatar, 
.data-avatar .right-avatar {
	background-size: cover;
	background-position: center center;
	float: left;
	overflow: hidden;
	width: 14px;
	height: 30px;
	margin-right: 1px;
	border-radius: 2px 0 0 2px;
}
.data-avatar .right-avatar {
	width: 15px;
	margin-right: 0;
	border-radius: 0 2px 2px 0;
}

@media (min-width: 768px){
	.data-avatar {
	    width: 50px;
	    height: 50px;
	    border-radius: 3px;
	}
}


.data-content {
	padding-left: 38px;
	color: #818181;
	font-size: 11px;
	line-height: 16px;
}

@media (min-width: 768px){
	.data-content {
		padding-left: 58px;
		font-size: 12px;
	}
}


.data-content .data-img {
	background-color: #fff;
    border: 1px solid #ddd;
    padding: 1px;
    width: 48px;
}

.data-content .btn {
	font-size: 10px;
	line-height: 1.5;
	-webkit-transition: padding .5s;
	transition: padding .5s;
}

.data-content .name {
	font-weight: bold;
}

.data-content .time {
	font-size: 10px;
	color: #bbb;
}

.data-content .text {
	word-break: break-all;
}
/* -- */

.navbar-form-mobile-search {
	border-top:0px solid transparent;
    border-bottom:0px solid transparent;
    -webkit-box-shadow:inset 0 0 0 rgba(255,255,255,.1),0 0 0 rgba(255,255,255,.1);
    box-shadow:inset 0 0 0 rgba(255,255,255,.1),0 0 0 rgba(255,255,255,.1)
}

.navbar-form {
	margin-top: 7px;
	margin-left: -10px;
}

.nav > li {
	display:inline-block;
}

.navbar-default .navbar-nav>li>a {
    color: #b6c3ca;
}

.navbar-default .navbar-nav>li>a:hover {
     color: #fff;
     background-color: transparent;
}

.masthead {
     color: #FFFFFF;
     margin-bottom: 0;
}
.masthead h1 {
     font-size: 120px;
     letter-spacing: -2px;
     line-height: 1;
}
.jumbotron:after {
     background: linear-gradient(45deg, #020031 0%, #6D3353 100%) repeat scroll 0 0 transparent;
     box-shadow: 0 3px 7px rgba(0, 0, 0, 0.2) inset, 0 -3px 7px rgba(0, 0, 0, 0.2) inset;
     bottom: 0;
     content: "";
     display: block;
     left: 0;
     opacity: 0.4;
     position: absolute;
     right: 0;
     top: 0;
}
.jumbotron {
     color: #FFFFFF;
     padding: 5px 0;
     position: relative;
     text-align: center;
     text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4), 0 0 30px rgba(0, 0, 0, 0.075);
     height:100%;
}
bode{
     background: linear-gradient(45deg, #020031 0%, #6D3353 100%) repeat scroll 0 0 transparent;
     box-shadow: 0 3px 7px rgba(0, 0, 0, 0.2) inset, 0 -3px 7px rgba(0, 0, 0, 0.2) inset;
     font-family: "Roboto","Helvetica Neue",Helvetica,Arial,sans-serif;
     margin: 0px;
     padding: 0px;
     height:100%;
}
.container:after {
     clear: both;
}
.container:before, .container:after {
     content: "";
     display: table;
     line-height: 0;
}
.container:before, .container:after {
     content: "";
     display: table;
     line-height: 0;
}
.jumbotron .container {
     position: relative;
     z-index: 2;
}

.yoyo {
    -webkit-animation: nkz 2s linear 1s;
    -moz-animation: nkz 2s linear 1s;
    -ms-animation: nkz 2s linear 1s;
    -o-animation: nkz 2s linear 1s;
    animation: nkz 2s linear 1s;
}

@keyframes nkz {
    0% {
        background-color: #FFF;
    }
    50% {
        background-color: #f80e2d;
    }
    100% {
        background-color: #FFF;
    }
}

@-webkit-keyframes nkz {
    0% {
        background-color: #FFF;
    }
    50% {
        background-color: #f80e2d;
    }
    100% {
        background-color: #FFF;
    }
}

@-moz-keyframes nkz {
    0% {
        background-color: #FFF;
    }
    50% {
        background-color: #f80e2d;
    }
    100% {
        background-color: #FFF;
    }
}

#emorta {
    z-index: 999999999999;
    display: none;
    background: #fff;
    border: solid #ccc 1px;
    width: 300px;
    height: 250px;
    position: absolute;
    left: 14px;
    bottom: 50px;
    padding: 8px;
    overflow: auto;
}

#emorlist {
    height: 50px
}

#emortlist div {
    width: 24px;
    height: 24px;
    margin: 2px;
    border: transparent solid 1px;
    display: inline-block;
    background-size: contain;
    cursor: pointer;
    background-repeat: no-repeat
}

#emortlist div:hover {
    border: red solid 1px
}

div[n="mokongo"] {
    background: #000;
    color: #18EA47;
    padding: 2px;
    font-family: monospace;
}

div[n="mokongo"] img {
    display: none !important;
}


/*div[n="mokongo"] * {color: #F30808 !important}*/

#wriscroll[sero='mokongo']>#writemain>a {
    display: none !important;
}

div[n="mokongo"] .us01 {
    display: none;
}

[sero="MokonGo"] {
    background: #000;
}

[sero="MokonGo"] span,
[sero="MokonGo"] label {
    display: none !important;
}

#_MokonGo {
    background: #000;
    color: 18EA47;
    border: none;
}

div[n="mokongo"].yoyo {
    -webkit-animation: none !important;
    -moz-animation: none !important;
    -o-animation: none !important;
    -ms-animation: none !important;
    animation: none !important;
}

#postale {
    height: 300px;
    width: 100%;
    pointer-events: none;
}

#nieve {
    background: none;
    background-image: url('s1.png'), url('s2.png'), url('s3.png');
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
    -webkit-animation: nwnw 10s linear infinite;
    -moz-animation: nwnw 10s linear infinite;
    -ms-animation: nwnw 10s linear infinite;
    animation: nwnw 10s linear infinite;
    pointer-events: none;
}

@keyframes nwnw {
    0% {
        background-position: 0px 0px, 0px 0px, 0px 0px;
    }
    50% {
        background-position: 500px 500px, 100px 200px, -100px 150px;
    }
    100% {
        background-position: 500px 1000px, 200px 400px, -100px 300px;
    }
}

@-moz-keyframes nwnw {
    0% {
        background-position: 0px 0px, 0px 0px, 0px 0px;
    }
    50% {
        background-position: 500px 500px, 100px 200px, -100px 150px;
    }
    100% {
        background-position: 400px 1000px, 200px 400px, 100px 300px;
    }
}

@-webkit-keyframes nwnw {
    0% {
        background-position: 0px 0px, 0px 0px, 0px 0px;
    }
    50% {
        background-position: 500px 500px, 100px 200px, -100px 150px;
    }
    100% {
        background-position: 500px 1000px, 200px 400px, -100px 300px;
    }
}

@-ms-keyframes nwnw {
    0% {
        background-position: 0px 0px, 0px 0px, 0px 0px;
    }
    50% {
        background-position: 500px 500px, 100px 200px, -100px 150px;
    }
    100% {
        background-position: 500px 1000px, 200px 400px, -100px 300px;
    }
}

#kzd {
    position: relative;
    margin-top: -409px;
    left: 253px;
    pointer-events: none;
}

@-webkit-keyframes shake {
    from,
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0);
    }
    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0);
    }
}

@keyframes shake {
    from,
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0);
    }
    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0);
    }
}

.shke {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-name: shake;
    animation-name: shake;
}

.uppi {
    -moz-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

.text_red {
    color: red;
    display: inline-block;
}

.oficializacion {
    display: inline-block;
    text-align: center;
    padding: 20px;
    color: #FFF;
    font-size: 13px;
    border-radius: 4px;
    background: linear-gradient(65deg, #dc0f50, #f21616, #741be3);
    background-size: 600% 600%;
    -webkit-animation: navidadback 22s ease infinite;
    -moz-animation: navidadback 22s ease infinite;
    animation: navidadback 22s ease infinite;
    text-transform: uppercase;
    font-weight: bold;
}

.chiste{
    display: inline-block;
    text-align: center;
    padding: 20px;
    color: #FFF;
    font-size: 13px;
    border-radius: 4px;
    background: linear-gradient(65deg, #0fdc99, #f21616, #741be3);
    background-size: 600% 600%;
    -webkit-animation: navidadback 22s ease infinite;
    -moz-animation: navidadback 22s ease infinite;
    animation: navidadback 22s ease infinite;
    text-transform: none;
    font-weight: bold;
}

.bot1{
    display: inline-block;
    text-align: left;
    padding: 20px;
    color: #FFF;
    font-size: 13px;
    border-radius: 4px;
    background: linear-gradient(65deg, #0fdc99, #f21616, #741be3);
    background-size: 600% 600%;
    -webkit-animation: navidadback 22s ease infinite;
    -moz-animation: navidadback 22s ease infinite;
    animation: navidadback 22s ease infinite;
    text-transform: none;
    font-weight: bold;
}

.bot{
    font-weight: 900;
    background: #879b9d;
    padding: 4px;
    border-radius: 4px;
    margin-right: 10px;
}

.mudo::before {
    content: 'Upss, tenemos un problema!';
    font-weight: 900;
    background: #879b9d;
    padding: 4px;
    border-radius: 4px;
    margin-right: 10px;
}

.info1{
    display: inline-block;
    text-align: center;
    padding: 20px;
    color: #FFF;
    font-size: 13px;
    border-radius: 4px;
    background: linear-gradient(65deg, #0fdc99, #f21616, #741be3);
    background-size: 600% 600%;
    -webkit-animation: navidadback 22s ease infinite;
    -moz-animation: navidadback 22s ease infinite;
    animation: navidadback 22s ease infinite;
    text-transform: none;
    font-weight: bold;
}
.info2::before {
    content: 'Atencion Operadores:';
    font-weight: 900;
    background: #e66;
    padding: 4px;
    border-radius: 4px;
    margin-right: 10px;
	color: white;
}

.chiste1::before {
    content: 'Aqui tienes un chiste:';
    font-weight: 900;
    background: #879b9d;
    padding: 4px;
    border-radius: 4px;
    margin-right: 10px;
}

.popular1::before {
    content: 'Usuario mas popular:';
    font-weight: 900;
    background: #879b9d;
    padding: 4px;
    border-radius: 4px;
    margin-right: 10px;
}

.anunciacion {
    display: inline-block;
    text-align: center;
    padding: 20px;
    color: #FFF;
    font-size: 13px;
    border-radius: 4px;
    background: linear-gradient(65deg, #0f61dc, #a9afec, #741be3);
    background-size: 600% 600%;
    -webkit-animation: navidadback 22s ease infinite;
    -moz-animation: navidadback 22s ease infinite;
    animation: navidadback 22s ease infinite;
    font-weight: bold;
}

@-webkit-keyframes suik {
    0% {
        background-position: 0% 50%
    }
    50% {
        background-position: 100% 50%;
        background-size: 15%
    }
    100% {
        background-position: 0% 50%
    }
}

@-moz-keyframes suik {
    0% {
        background-position: 0% 50%
    }
    50% {
        background-position: 100% 50%;
        background-size: 15%
    }
    100% {
        background-position: 0% 50%
    }
}

@keyframes suik {
    0% {
        background-position: 0% 50%
    }
    50% {
        background-position: 100% 50%;
        background-size: 15%
    }
    100% {
        background-position: 0% 50%
    }
}

@-webkit-keyframes koru {
    from {
        background-position: 0% 100%;
    }
    to {
        background-position: 200% 100%;
    }
}

@keyframes koru {
    from {
        background-position: 0% 100%;
    }
    to {
        background-position: 200% 100%;
    }
}

[kor]::before {
    -webkit-animation: koru 4s infinite linear;
    animation: koru 4s infinite linear;
    background: -webkit-linear-gradient(0deg, #7FEFBD 0%, #FFF689 11%, #EC0B43 22%, #7FEFBD 33%, #FFF689 44%, #EC0B43 55%, #7FEFBD 66%, #FFF689 77%, #EC0B43 88%, #7FEFBD 100%);
    background: linear-gradient(90deg, #7FEFBD 0%, #FFF689 11%, #EC0B43 22%, #7FEFBD 33%, #FFF689 44%, #EC0B43 55%, #7FEFBD 66%, #FFF689 77%, #EC0B43 88%, #7FEFBD 100%);
    background-size: 300% 100%;
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border-radius: 4px;
    -webkit-filter: blur(3px);
    filter: blur(3px);
    z-index: -1;
    -webkit-transform: scale(0.99) translateY(3px);
    transform: scale(0.99) translateY(3px);
}

.topic2 {
    border-radius: 50px;
    background-image: url('../../img/chat/menubar.png');
    border-color: #fff;
        border-right-color: rgb(255, 255, 255);
        border-left-color: rgb(255, 255, 255);
    border-width: .30em;
        border-right-width: 0.3em;
        border-left-width: 0.3em;
    border-style: dashed;
        border-right-style: dashed;
        border-left-style: dashed;
    font-weight: bold;
    color: white;
    border-left-color: #5e9de6;
    border-right-color: #4b8ad6;
    display: block;
    background: #fff;
    padding: 5px 15px 5px;
    margin: 1 0 0 20px;
    position: relative;
    font-family: Georgia, serif;
    font-size: 14px;
    line-height: 1.2;
    color: #666;
    -moz-box-shadow: 2px 2px 15px #ccc;
    -webkit-box-shadow: 2px 2px 15px #ccc;
    box-shadow: 2px 2px 15px #ccc;
    border-left-style: solid;
    border-left-width: 15px;
    border-right-style: solid;
    border-right-width: 2px;
}

.login__submit {
  position: relative;
  width: 100%;
  height: 4rem;
  
  font-size: 1.5rem;
  border-radius: 3rem;
  cursor: pointer;
  overflow: hidden;
  transition: width 0.3s 0.15s, font-size 0.1s 0.15s;
}
.login__submit:after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -1.5rem;
  margin-top: -1.5rem;
  width: 3rem;
  height: 3rem;
  border: 2px dotted #fff;
  border-radius: 50%;
  border-left: none;
  border-bottom: none;
  transition: opacity 0.1s 0.4s;
  opacity: 0;
}
.login__submit.processing {
  width: 4rem;
  font-size: 0;
}
.login__submit.processing:after {
  opacity: 1;
  -webkit-animation: rotate 0.5s 0.4s infinite linear;
          animation: rotate 0.5s 0.4s infinite linear;
}
.login__submit.success {
  transition: opacity 0.1s 0.3s, background-color 0.1s 0.3s, -webkit-transform 0.3s 0.1s ease-out;
  transition: transform 0.3s 0.1s ease-out, opacity 0.1s 0.3s, background-color 0.1s 0.3s;
  transition: transform 0.3s 0.1s ease-out, opacity 0.1s 0.3s, background-color 0.1s 0.3s, -webkit-transform 0.3s 0.1s ease-out;
  -webkit-transform: scale(30);
          transform: scale(30);
  opacity: 0.9;
}
.login__submit.success:after {
  transition: opacity 0.1s 0s;
  opacity: 0;
  -webkit-animation: none;
          animation: none;
}

.etiqueta_check input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
}

.etiqueta_check:hover input ~ .checkmark {
  background-color: #ccc;
}

.etiqueta_check input:checked ~ .checkmark {
  background-color: #2196F3;
}

.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.etiqueta_check input:checked ~ .checkmark:after {
  display: block;
}

.etiqueta_check .checkmark:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
} 

.rec_button {
width: 5rem;
font-size: 1.5rem;
border-radius: 3rem;
cursor: pointer;
overflow: hidden;
transition: width 0.3s 0.15s, font-size 0.1s 0.15s;
border: 1px solid #9f91a800; /*anchura, estilo y color borde*/
padding: 10px; /*espacio alrededor texto*/
background-color: #3f81cc; /*color bot贸n*/
color: #ffffff; /*color texto*/
text-decoration: none; /*decoraci贸n texto*/
text-transform: uppercase; /*capitalizaci贸n texto*/
font-family: 'Helvetica', sans-serif; /*tipograf铆a texto*/
border-radius: 50px; /*bordes redondos*/
}

.rec_button_stop {
width: 5rem;
font-size: 1.5rem;
border-radius: 3rem;
cursor: pointer;
overflow: hidden;
transition: width 0.3s 0.15s, font-size 0.1s 0.15s;
border: 1px solid #9f91a800; /*anchura, estilo y color borde*/
padding: 10px; /*espacio alrededor texto*/
background: #00c292;
color: rgb(255, 255, 255);
text-decoration: none; /*decoraci贸n texto*/
text-transform: uppercase; /*capitalizaci贸n texto*/
font-family: 'Helvetica', sans-serif; /*tipograf铆a texto*/
border-radius: 50px; /*bordes redondos*/
}

.camera_button {
width: 5rem;
font-size: 1.5rem;
border-radius: 3rem;
cursor: pointer;
overflow: hidden;
transition: width 0.3s 0.15s, font-size 0.1s 0.15s;
border: 1px solid #9f91a800; /*anchura, estilo y color borde*/
padding: 10px; /*espacio alrededor texto*/
background-color: #3f81cc; /*color bot贸n*/
color: #ffffff; /*color texto*/
text-decoration: none; /*decoraci贸n texto*/
text-transform: uppercase; /*capitalizaci贸n texto*/
font-family: 'Helvetica', sans-serif; /*tipograf铆a texto*/
border-radius: 50px; /*bordes redondos*/
}
 
.camera_button:hover {
	outline: 0 !important;
        border: #00c292 solid 1px;
}

.ntc:hover
{
	position:relative;
	top:30px;
	left:-3px;

}
.ntc
{
	position:relative;
	top:30px;
	left:-3px;

}