@media screen and (min-width: 320px) and (max-width: 767px) and (orientation: portrait) {
/*	html {
		transform: rotate(-90deg);
		transform-origin: left top;
		width: 100vh;
		height: 100vw;
		overflow-x: hidden;
		position: absolute;
		top: 100%;
		left: 0;
	}
*/
}

body {
	margin: 0;
	font-family: Roboto !important;
}

.h1-fina {
	font-family: Roboto;
	font-weight: 300 !important;
}

.h1-grossa {
	font-family: Roboto !important;
	font-weight: bold;
}

.input-group-text,
.form-control {
	border-radius: 0 !important;
}

.swal2-title {
	color: #9D9FB6 !important;
	font-size: 1.2em !important;
}

.swal2-styled.swal2-confirm {
	border-radius: 0 !important;
	background-color: #1D1E27 !important;
	color: #fff;
	font-size: 1.0625em;
}

.fechar-painel {
	font-size: 1.5rem !important;
	color: #D1D2DD;
}

a {
	text-decoration: none;
}

.form-check-label {
	margin-top: 0.25em;
}

.fa-minus-circle:hover {
	color: #626684;
}

.fa-minus-circle:active {
	color: #DADBE4;
}

.sprite {
	background: url("/assets/images/sprite-icons.png") no-repeat;
	width: 40px;
	height: 40px;
	display: inline-block;
}

a.minimizar {
	background-position: 0px -280px;
}

a.minimizar:hover {
	background-position: -40px -280px;
}

a.minimizar:active {
	background-position: -80px -280px;
}

a.lupa-mais {
	background-position: 0px -800px;
}

a.lupa-mais:hover {
	background-position: -40px -800px;
}

a.lupa-mais:active {
	background-position: -80px -800px;
}

a.lupa-menos {
	background-position: 0px -840px;
}

a.lupa-menos:hover {
	background-position: -40px -840px;
}

a.lupa-menos:active {
	background-position: -80px -840px;
}

a.mochila {
	background-position: 0px 0px;
}

a.mochila:hover {
	background-position: -40px 0px;
}

a.mochila:active {
	background-position: -80px 0px;
}

a.mochila-user {
	background-position: 0px -1360px;
}

a.mochila-user:hover {
	background-position: -40px -1360px;
}

a.mochila-user:active {
	background-position: -80px -1360px;
}

a.camera {
	background-position: 0px -160px;
}

a.camera:hover {
	background-position: -40px -160px;
}

a.camera:active {
	background-position: -80px -160px;
}

a.smile {
	background-position: 0px -120px;
}

a.smile:hover {
	background-position: -40px -120px;
}

a.smile:active {
	background-position: -80px -120px;
}

a.celular {
	background-position: 0px -200px;
}

a.celular:hover {
	background-position: -40px -200px;
}

a.celular:active {
	background-position: -80px -200px;
}

a.audio {
	background-position: 0px -720px;
}

a.audio:hover {
	background-position: -40px -720px;
}

/*
a.audio:focus {
	background-position: -80px -720px;
}*/

a.duvida {
	background-position: 0px -760px;
}

a.duvida:hover {
	background-position: -40px -760px;
}

a.duvida:active {
	background-position: -80px -760px;
}

a.anotacao {
	background-position: 0px -40px;
}

a.anotacao:hover {
	background-position: -40px -40px;
}

a.anotacao:active {
	background-position: -80px -40px;
}

a.sair {
	background-position: 0px -80px;
}

a.sair:hover {
	background-position: -40px -80px;
}

a.sair:active {
	background-position: -80px -80px;
}
/* Css do compartilhar */
a.compartilhar {
	background-position: 0px -880px;
}

a.compartilhar:hover {
	background-position: -40px -880px;
}

a.compartilhar:active {
	background-position: -80px -880px;
}

.social .fbtn {
    width: 30px;
    display: inline-block;
    color: #fff;
    text-align: center;
    line-height:10px;
    border-radius:100px;
    margin-right:3px;
}

.social .fa{
	padding: 7px 8px;
}
.facebook {
    background-color: #3b5998;
	cursor: pointer;
}

.twitter {
    background-color: #55acee;
	cursor: pointer;
}

.linkedin {
    background-color: #0077b5;
	cursor: pointer;
}

.whatsapp {
    background-color: #075e54;
	cursor: pointer;
}

.clipboard{
	background-color: #1D1E27;
	cursor: pointer;
}

.share-button.sharer .social.active.top {
  transform: scale(1) translateY(-10px);
}
.share-button.sharer .social.active {
  opacity: 1;
  transition: all 0.4s ease 0s;
  visibility: visible;
}
.share-button.sharer .social.networks-5 {
    background-color: #DADBE4!important;
    padding: 5px;
    border-radius: 10px;
}
.share-button.sharer .social.top {
  margin-top: -80px;
  transform-origin: 0 0 0;
}
.share-button.sharer .social {
  margin-left: -170px;
  margin-bottom: 50px;
  opacity: 0;
  transition: all 0.4s ease 0s;
  visibility: hidden;
}
/* Fim do Css do compartilhar */

/* Novo chat */
#chat-circle {
	color: white;
	cursor: pointer;
  margin-top: -1.45%;
}
#chat-overlay {
	background: rgba(255, 255, 255, 0.1);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	display: none;
}
.chat-box {
	display: none;
	background: #efefef;
	position: fixed;
	right: 30px;
	bottom: 0;
	width: 270px;
	max-width: 85vw;
	max-height: 100vh;
	border-radius: 5px;
}

.chat_box .chat_message_wrapper ul.chat_message > li + li {
    margin-top: 4px;
}
.popup-box-on {
    display: block !important;
}
a:focus {
    outline: none;
    outline-offset: 0px;
}
textarea:focus, input:focus{
    outline: none;
}
.popup-head-left.float-start h1 {
    white-space: nowrap;
    width: 9.5em;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #fff;
    float: left;
    font-family: Roboto;
    font-size: 16px;
    margin: 20px 0 0 10px;

}
.chat-header-button {
    background: #fff none repeat scroll 0 0;
    border: 1px solid #fff;
    border-radius: 50px;
    font-size: 15px;
    height: 26px;
    opacity: 0.9;
    padding: 0;
    text-align: center;
    width: 26px;
}
.popup-head-right {
    margin: 9px 0 0;
}
.popup-head .btn-group {
    margin: -5px 3px 0 -1px;
}

/* Topo de Todas as Janelas Modais do Site */
.popup-head {
    background: #26272F none repeat scroll 0 0 !important;
    color: #fff;
    display: table;
    width: 100%;
    padding: 8px;
}
/* ************************************** */

.popup-head .md-user-image {
    float: left;
	height: 50px;
	width: 50px;
    padding: 2px;
    background: linear-gradient(to bottom, #2D349E, #CF50F9, #FBBA3C) border-box;
}
.uk-input-group-addon .glyphicon.glyphicon-send {
    color: #ffffff;
    font-size: 21px;
    line-height: 36px;
    padding: 0 6px;
}
.chat_box_wrapper.chat_box_small.chat_box_active {
    height: 340px;
    overflow-y: scroll;
}
aside {
    background-attachment: fixed;
    background-clip: border-box;
    background-color: rgba(0, 0, 0, 0);
    background-image: url("https://z-1-scontent-cdg2-1.xx.fbcdn.net/hphotos-xpt1/v/t1.0-9/12670232_624826600991767_3547881030871377118_n.jpg?oh=b4541268dfcdc6c8b2758066dba9c0c7&oe=572DDCE7");
    background-origin: padding-box;
    background-position: center top;
    background-repeat: repeat;
    border: 1px solid #304445;
    bottom: 0;
    display: none;
    position: fixed;
    left: 230px;
    width: 318px;
    font-family: 'Roboto', sans-serif;
}
.chat_box {
    padding: 16px;
}
.chat_box .chat_message_wrapper::after {
    clear: both;
}
.chat_box .chat_message_wrapper::after, .chat_box .chat_message_wrapper::before {
    content: " ";
    display: table;
}
.chat_box .chat_message_wrapper .chat_user_avatar {
    float: left;
}
.chat_box .chat_message_wrapper {
    margin-bottom: 32px;
}
.md-user-image {
    border-radius: 50%;
    width: 34px;
}
img {
    border: 0 none;
    box-sizing: border-box;
    height: auto;
    max-width: 100%;
    vertical-align: middle;
}
.nome-user{
	font-weight: 900;
    color: #ED3C46;
    padding-bottom: 5px;
    font-family: 'Roboto';
}
.chat_box .chat_message_wrapper ul.chat_message, .chat_box .chat_message_wrapper ul.chat_message > li {
    list-style: outside none none;
    padding: 0;
}
.chat_box .chat_message_wrapper ul.chat_message {
    float: left;
    margin: 20px 0 0 20px;
    max-width: 70%;
}
.chat_box.chat_box_colors_a .chat_message_wrapper ul.chat_message > li:first-child::before {
    border-right-color: #616161;
}
.chat_box .chat_message_wrapper ul.chat_message > li:first-child::before {
    border-color: transparent #ededed transparent transparent;
    border-style: solid;
    border-width: 0 16px 16px 0;
    content: "";
    height: 0;
    left: -14px;
    position: absolute;
    top: 0;
    width: 0;
}
.chat_box.chat_box_colors_a .chat_message_wrapper ul.chat_message > li {
    background: #FCFBF6 none repeat scroll 0 0;
    color: #000000;
}
.open-btn {
    border: 2px solid #189d0e;
    border-radius: 32px;
    color: #189d0e !important;
    display: inline-block;
    margin: 10px 0 0;
    padding: 9px 16px;
    text-decoration: none !important;
    text-transform: uppercase;
}
.chat_box .chat_message_wrapper ul.chat_message > li {
    background: #ededed none repeat scroll 0 0;
    border-radius: 4px;
    clear: both;
    color: #212121;
    display: block;
    float: left;
    font-size: 13px;
    padding: 8px 16px;
    position: relative;
    word-break: break-all;
}
.chat_box .chat_message_wrapper ul.chat_message, .chat_box .chat_message_wrapper ul.chat_message > li {
    list-style: outside none none;
    padding: 0;
}
.chat_box .chat_message_wrapper ul.chat_message > li {
    margin: 0;
}
.chat_box .chat_message_wrapper ul.chat_message > li p {
    margin: 0;
}
.chat_box.chat_box_colors_a .chat_message_wrapper ul.chat_message > li .chat_message_time {
    color: rgba(185, 186, 180, 0.9);
}
.chat_box .chat_message_wrapper ul.chat_message > li .chat_message_time {
    color: #727272;
    display: block;
    font-size: 11px;
    padding-top: 2px;
    text-transform: uppercase;
}
.chat_box .chat_message_wrapper.chat_message_right .chat_user_avatar {
    float: right;
}
.chat_box .chat_message_wrapper.chat_message_right ul.chat_message {
    float: right;
    margin-left: 0 !important;
    margin-right: 24px !important;
}
.chat_box.chat_box_colors_a .chat_message_wrapper.chat_message_right ul.chat_message > li:first-child::before {
    border-left-color: #DADBE4;
}
.chat_box.chat_box_colors_a .chat_message_wrapper ul.chat_message > li:first-child::before {
    border-right-color: #FCFBF6;
}
.chat_box .chat_message_wrapper.chat_message_right ul.chat_message > li:first-child::before {
    border-color: transparent transparent transparent #ededed;
    border-width: 0 0 29px 29px;
    left: auto;
    right: -14px;
}
.chat_box .chat_message_wrapper ul.chat_message > li:first-child::before {
    border-color: transparent #ededed transparent transparent;
    border-style: solid;
    border-width: 0 29px 29px 0;
    content: "";
    height: 0;
    left: -14px;
    position: absolute;
    top: 0;
    width: 0;
}
.chat_box.chat_box_colors_a .chat_message_wrapper.chat_message_right ul.chat_message > li {
    background: #DADBE4 none repeat scroll 0 0;
}
.chat_box .chat_message_wrapper ul.chat_message > li {
    background: #ededed none repeat scroll 0 0;
    border-radius: 12px;
    clear: both;
    color: #212121;
    display: block;
    float: left;
    font-size: 13px;
    padding: 8px 16px;
    position: relative;
}
.gurdeep-chat-box {
    background: #fff none repeat scroll 0 0;
    border-radius: 5px;
    float: left;
    padding: 3px;
}
#submit_message {
    background: transparent none repeat scroll 0 0;
    padding: 4px;
    border: none;
}
.gurdeep-chat-box i {
    color: #333;
    font-size: 21px;
    line-height: 1px;
}
.chat_submit_box {
    bottom: 0;
    box-sizing: border-box;
    left: 0;
    overflow: hidden;
    padding: 10px;
    position: absolute;
    width: 100%;
}
.uk-input-group {
    border-collapse: separate;
    display: table;
    position: relative;
}

a.chat {
	background-position: 0px -480px;
}

a.chat:hover {
	background-position: -40px -480px;
}

a.chat:active {
	background-position: -80px -480px;
}

a.cutucar {
	background-position: 0px -520px;
}

a.cutucar:hover {
	background-position: -40px -520px;
}

a.cutucar:active {
	background-position: -80px -520px;
}

a.controle-sala {
	background-position: 0px -920px;
}

a.controle-sala:hover {
	background-position: -40px -920px;
}

a.controle-sala:active {
	background-position: -80px -920px;
}

a.adicionar {
	background-position: 0px -320px;
}

a.adicionar:hover {
	background-position: -40px -320px;
}

a.adicionar:active {
	background-position: -80px -320px;
}

a.mudar-avatar {
	background-position: 0px -640px;
}

a.mudar-avatar:hover {
	background-position: -40px -640px;
}

a.mudar-avatar:active {
	background-position: -80px -640px;
}

a.banir {
	background-position: 0px -680px;
}

a.banir:hover {
	background-position: -40px -680px;
}

a.banir:active {
	background-position: -80px -680px;
}

a.atrair {
	background-position: 0px -960px;
}

a.atrair:hover {
	background-position: -40px -960px;
}

a.atrair:active {
	background-position: -80px -960px;
}

a.fechar {
	background-position: 0px -1040px;
}

a.fechar:hover {
	background-position: -40px -1040px;
}

a.fechar:active {
	background-position: -80px -1040px;
}

a.editar-sala {
	background-position: 0px -1000px;
}

a.editar-sala:hover {
	background-position: -40px -1000px;
}

a.editar-sala:active {
	background-position: -80px -1000px;
}

a.homem {
	background-position: 0px -1120px;
}

a.homem:hover {
	background-position: -40px -1120px;
}

a.homem:active {
	background-position: -80px -1120px;
}

a.mulher {
	background-position: 0px -1160px;
}

a.mulher:hover {
	background-position: -40px -1160px;
}

a.mulher:active {
	background-position: -80px -1160px;
}

a.editar-avatar {
	background-position: 0px -1080px;
}

a.editar-avatar:hover {
	background-position: -40px -1080px;
}

a.editar-avatar:active {
	background-position: -80px -1080px;
}

a.remover-avatar {
	background-position: 0px -600px;
}

a.remover-avatar:hover {
	background-position: -40px -600px;
}

a.remover-avatar:active {
	background-position: -80px -600px;
}

a.mais {
	background-position: 0px -240px;
}

a.mais:hover {
	background-position: -40px -240px;
}

a.mais:active {
	background-position: -80px -240px;
}

a.grafico {
	background-position: 0px -1200px;
}

a.grafico:hover {
	background-position: -40px -1200px;
}

a.grafico:active {
	background-position: -80px -1200px;
}

a.adicionar-sala {
	background-position: 0px -1240px;
}

a.adicionar-sala:hover {
	background-position: -40px -1240px;
}

a.adicionar-sala:active {
	background-position: -80px -1240px;
}

a.notificar-usuario {
	background-position: 0px -640px;
}

a.notificar-usuario:hover {
	background-position: -40px -640px;
}

a.notificar-usuario:active {
	background-position: -80px -640px;
}

a.remover-agenda {
	background-position: 0px -1520px;
}

a.remover-agenda:hover {
	background-position: -40px -1520px;
}

a.remover-agenda:active {
	background-position: -80px -1520px;
}

a.desenho {
	background-position: 0px -1560px;
}

a.desenho:hover {
	background-position: -40px -1560px;
}

a.desenho:active {
	background-position: -80px -1560px;
}

a.doc {
	background-position: 0px -1600px;
}

a.doc:hover {
	background-position: -40px -1600px;
}

a.doc:active {
	background-position: -80px -1600px;
}

a.apresentacao {
	background-position: 0px -1640px;
}

a.apresentacao:hover {
	background-position: -40px -1640px;
}

a.apresentacao:active {
	background-position: -80px -1640px;
}

a.calculadora {
	background-position: 0px -1680px;
}

a.calculadora:hover {
	background-position: -40px -1680px;
}

a.calculadora:active {
	background-position: -80px -1680px;
}

a.mapa {
	background-position: 0px -1760px;
}

a.mapa:hover {
	background-position: -40px -1760px;
}

a.mapa:active {
	background-position: -80px -1760px;
}

a.menu-h {
	background-position: 0px -1800px;
}

a.menu-h:hover {
	background-position: -40px -1800px;
}

a.menu-h:active {
	background-position: -80px -1800px;
}

a.joystick {
	background-position: 0px -1840px;
}

a.joystick:hover {
	background-position: -40px -1840px;
}

a.joystick:active {
	background-position: -80px -1840px;
}

a.left {
	background-position: 0px -1880px;
}

a.left:hover {
	background-position: -40px -1880px;
}

a.left:active {
	background-position: -80px -1880px;
}

a.right {
	background-position: 0px -1920px;
}

a.right:hover {
	background-position: -40px -1920px;
}

a.right:active {
	background-position: -80px -1920px;
}

a.top {
	background-position: 0px -2000px;
}

a.top:hover {
	background-position: -40px -2000px;
}

a.top:active {
	background-position: -80px -2000px;
}

a.bottom {
	background-position: 0px -1960px;
}

a.bottom:hover {
	background-position: -40px -1960px;
}

a.bottom:active {
	background-position: -80px -1960px;
}

a.controle {
	background-position: 0px -2120px;
	cursor: pointer;
}

a.controle:hover {
	background-position: -40px -2120px;
}

a.controle:active {
	background-position: -80px -2120px;
}

a.menu-sidebar {
	background-position: 0px -1800px;
	cursor: pointer;
}

a.menu-sidebar:hover {
	background-position: -40px -1800px;
}

a.menu-sidebar:active {
	background-position: -80px -1800px;
}

a.reload {
	background-position: 0px -2160px;
	cursor: pointer;
}

a.reload:hover {
	background-position: -40px -2160px;
}

a.reload:active {
	background-position: -80px -2160px;
}

a.novo-chat {
	background-position: 0px -2200px;
}

a.novo-chat:hover {
	background-position: -40px -2200px;
}

a.novo-chat:active {
	background-position: -80px -2200px;
}

a.transmissao {
	background-position: 0px -2240px;
}

a.transmissao:hover {
	background-position: -40px -2240px;
}

a.transmissao:active {
	background-position: -80px -2240px;
}

a.transmissao:focus {
	background-position: -80px -2240px;
}


a.game2d {
	background-position: 0px -2080px;
}

a.game2d:hover {
	background-position: -40px -2080px;
}

a.game2d:active {
	background-position: -80px -2080px;
}

.game3d {
	background-position: 0px -2040px;
}

.desabilitado {
	color: currentColor;
	cursor: not-allowed;
	opacity: 0.2;
	text-decoration: none;
}

.popup {
	z-index: 9999999999999;
	background-color: #1D1E27;
	border: 1px solid #1D1E27;
	text-align: center;
	min-width: 30%;
	max-height: 100%;
	max-width: 100%;
	display: none;
}

/* Topo Arrastável */

.popup {
	position: absolute;
	resize: both;
	overflow: none;
}

.fechar-popup {
	position: absolute;
	top: 3px;
	right: 0;
	z-index: 9;
	background-color: black !important;
}

.popup-header {
	padding: 30px;
	cursor: move;
	z-index: 10;
	background-color: #1D1E27;
	color: #fff;
}

.popup-footer {
	padding: 10px;
	z-index: 10;
	background-color: #1D1E27;
	color: #fff;
}

/*Redimensionável*/

.popup .resizer-right {
	width: 5px;
	height: 100%;
	background: transparent;
	position: absolute;
	right: 0;
	bottom: 0;
	cursor: e-resize;
}

.popup .resizer-bottom {
	width: 100%;
	height: 5px;
	background: transparent;
	position: absolute;
	right: 0;
	bottom: 0;
	cursor: n-resize;
}

.popup .resizer-both {
	width: 5px;
	height: 5px;
	background: transparent;
	z-index: 10;
	position: absolute;
	right: 0;
	bottom: 0;
	cursor: nw-resize;
}

.funcoes-celular {
	width: 40px;
	height: 40px;
	float: left;
	margin-right: 5px;
	margin-top: 0px;
}

.form-switch .form-check-input:focus {
	border-color: #1D1E27;
	outline: 0;
	box-shadow: 0 0 0 0 #1D1E27;
	background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%231D1E27'/></svg>");
}

.form-switch .form-check-input:checked {
	background-color: #626684;
	border-color: #626684;
	border: none;
	background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23626684'/></svg>");
}

img.avatar-celular {
	float: left;
  margin: 0 10px;
  border-radius: 50px;
  width: 47px;
  max-height: 47px;
  border: 2px solid #ffffff;
  padding: 1px;
  margin-bottom: 5px;
}

.nome-avatar-celular {
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	text-align: left;
	font-weight: bold;
	padding: 25px 10px;
	font-size: 0.9rem;
}

.list-group-item {
	position: relative;
	display: block;
	padding: .5rem 0.3rem!important;
	color: #212529;
	text-decoration: none;
	margin: 0 auto;
	background-color: transparent !important;
	border: 0 !important;
}

.card-container {
	border-radius: 5px;
	color: #fff;
	padding-top: 30px;
	position: relative;
	width: 150px;
	max-width: 100%;
	text-align: center;
}

.card-container .round {
	width: 120px;
	height: 120px;
	cursor: pointer;
	border-radius: 100%;
	background: #2D349E;
	background: -webkit-linear-gradient(to bottom, #2D349E, #CF50F9, #FBBA3C);
	border: 2px solid transparent;
	background: linear-gradient(to bottom, #2D349E, #CF50F9, #FBBA3C) border-box;
}

.profile-photo {
	width: 100px;
	height: 100px;
	cursor: pointer;
	border-radius: 100%;
	background: #2D349E;
	background: -webkit-linear-gradient(to bottom, #2D349E, #CF50F9, #FBBA3C);
	border: 2px solid transparent;
	background: linear-gradient(to bottom, #2D349E, #CF50F9, #FBBA3C) border-box;
	/*3*/
}

.btn-mudar-foto {
	position: absolute;
	top: 32%;
	left: 15.5%;
	transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	background-color: #1D1E27;
	color: white;
	border: none;
}

.card {
	position: relative;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-webkit-flex-direction: column;
	-ms-flex-direction: column;
	flex-direction: column;
	min-width: 0;
	word-wrap: break-word;
	background-color: #fff;
	background-clip: border-box;
	border: 1px solid rgba(0, 0, 0, 0.125);
	border-radius: 0;
}

.card-body {
	-webkit-box-flex: 1;
	-webkit-flex: 1 1 auto;
	-ms-flex: 1 1 auto;
	flex: 1 1 auto;
	padding: 1.25rem;
}

.card-header {
	padding: 1.75rem 0;
	margin-bottom: 0;
	background-color: rgba(0, 0, 0, 0.03);
	border-bottom: 1px solid rgba(0, 0, 0, 0.125);
	text-align: center;
}

/* Nova Sidebar */
.wrapper {
    display: flex;
    overflow: hidden;
    max-width: 100%;
    align-items: stretch;
	background: transparent;
}
/* ---------------------------------------------------
    Estilo da Sidebar
----------------------------------------------------- */

#sidebar {
    min-width: 240px;
    max-width: 240px;
    background: #26272F;
    color: #fff;
	overflow-y: auto;
    transition: all 0.3s;
}

#sidebar.active {
    margin-left: -240px;
}

#sidebar .sidebar-header {
    padding: 10px;

}
#sidebar .sidebar-list {
	width:210px;
	height:220px;
	border-radius: 5px;
	background-color: #5b6069;
}


/* width */
#sidebar .sidebar-list::-webkit-scrollbar {
	width: 10px;
  }

  /* Track */
  #sidebar .sidebar-list::-webkit-scrollbar-track {
	background: #f1f1f1;
  }

  /* Handle */
  #sidebar .sidebar-list::-webkit-scrollbar-thumb {
	background: #888;
  }

  /* Handle on hover */
  ::-webkit-scrollbar-thumb:hover {
	background: #555;
  }
#sidebar .sidebar-listname {
		text-overflow: ellipsis;
		white-space: nowrap;
		overflow: hidden;
		text-align: left;
		font-weight: bold;
		padding: 10px 10px;
		font-size: 0.9rem;
}

#sidebar ul li.active>a,
a[aria-expanded="true"] {
    color: #2980b9;
    background: #ffffff;
}

a[data-toggle="collapse"] {
    position: relative;
    transform: translateY(-50%);

}

.dropdown-toggle::after {
    display: block;
    position: absolute;
    top: 24px;
    right: 20px;
    transform: translateY(-50%);
}

ul ul a {
    font-size: 0.9em !important;
    padding-left: 30px !important;
    background: #236d9e;
}
ul ul a:hover {
    background-color: #1f628f !important;
}
/* ------------------------------------------------------
    Botões = Menu + Vídeo Conferência + Streaming + Chat
------------------------------------------------------ */

.menu-bar {
	display: flex;
	justify-content: space-between;
	position: absolute;
	top:2%;
  margin-left: .4%;
  }

  /* Cor do botão do menu */
.active, .menu-sidebar{
	/* background-position: -80px -1800px!important; */
}

  .video-conferencia {
	display: flex;
	justify-content: space-between;
	position: absolute;
	top:2%;
	margin-left: 240px;
  }

  .streaming {
	display: flex;
	justify-content: space-between;
	position: absolute;
	top:2%;
	margin-left: 160px;
}

  .icone-chat {
	display: flex;
	justify-content: space-between;
	position: absolute;
	top:2%;
	margin-left: 85px;
  }

/* ---------------------------------------------------
    Conteúdo da Tela
----------------------------------------------------- */

#content {
    width: 100%;
    padding: 0;
    min-height: 100vh;
    transition: all 0.3s;
}

/* ---------------------------------------------------
    MEDIAQUERIES
----------------------------------------------------- */


@media (max-width: 1399.9px) {
  .wrapper {
      margin: 0;
      box-shadow: none;
      -webkit-box-shadow: none;
      -moz-box-shadow: none;
  }
}
@media (max-width: 768px) {
    .wrapper {
		display: flex;
		overflow: hidden;
		width: 100%;
		align-items: stretch;
		background: transparent;
	}

	#sidebar.active {
        margin-left: -250px;
		overflow-y: auto;
		height: 100%;
    /* max-height: 100vw; */
    min-height: 60vw;
    }

    #sidebar {
        margin-left: 0;
    }
    #sidebarCollapse span {
        display: none;
    }
    .mobile-logo{
      display: block;
   }

   /* Scroolbar */
   ::-webkit-scrollbar {
	width: 8px;
   }
   ::-webkit-scrollbar-track {
	background: #607d8b;
   }
   ::-webkit-scrollbar-thumb {
	background: linear-gradient(#4c616c, #242424);
   }

}
/* Fim da Sidebar */

.meet {
	height: 100vh;
	z-index: 1;
}

@media (min-width: 576px) {
	.popup-meet {
		position: absolute;
		resize: both;
		overflow: none;
		display: block;
		inset: 65vh 0px 30px 65vw;
		z-index: +999999;
	}
}
@media (min-width: 991.98px) {
	.popup-meet {
		position: absolute;
		resize: both;
		overflow: none;
		inset: 65vh 0px 40px 65vw;
		z-index: +999999;
	}
}
.popup-meet {
	z-index: 9999999999999;
	background-color: #1D1E27;
	border: 1px solid #1D1E27;
	text-align: center;
	min-height: 10%;
	min-width: 20%;
	max-height: 100%;
	max-width: 100%;
	display: block;
	}
	/* Topo Arrastável */
	.popup-meet {
	position: absolute;
	resize: both;
	overflow: none;
	z-index: +999999;
	}
	.fechar-popup-meet {
	position: absolute;
	top: 6px;
	right: 1px;
	z-index: 9;
	}
	.popup-header-meet {
	padding: 5px;
	cursor: move;
	height: 8vh;
	z-index: 10;
	background-color: #fff;
	color: #1D1E27;
	}
	.popup-footer-meet {
	padding: 10px;
	z-index: 10;
	background-color: #1D1E27;
	color: #fff;
	}
	/*Redimrgb(136, 94, 94)onável*/
	.popup-meet .resizer-right {
	width: 5px;
	height: 100%;
	background: transparent;
	position: absolute;
	right: 0;
	bottom: 0;
	cursor: e-resize;
	}
	.popup-meet .resizer-bottom {
	width: 100%;
	height: 5px;
	background: transparent;
	position: absolute;
	right: 0;
	bottom: 0;
	cursor: n-resize;
	}
	.popup-meet .resizer-both {
	width: 5px;
	height: 5px;
	background: transparent;
	z-index: 10;
	position: absolute;
	right: 0;
	bottom: 0;
	cursor: nw-resize;
	}


.icon-user-form {
	font-size: 1.2rem !important;
	border-radius: 0 !important;
}

.col-entrar {
	background-color: #d1d2dd;
	padding: 20px;
	border-right: 10px solid #fff;
}

.col-cadastrar {
	background-color: #9D9FB6;
	padding: 20px;
	border-left: 10px solid #fff;
}

.btn-carteira {
	font-size: 1rem !important;
	text-align: center;
	color: #D1D2DD !important;
	background: #1D1E27 !important;
}

.inventory-modal {
	border: 0 !important;
	border-radius: 0 !important;
}

.inventory-close {
	font-size: 1rem;
	color: #fff !important;
	background-color: #fff !important;
	border-radius: 100px !important;
	margin: -0.5rem 0.5rem -0.5rem auto !important;
}

.inventory-close:hover {
	background-color: #3c3c3c;
	color: #fff;
}

.inventory {
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
	margin: 30px;
	z-index: 1;
}

.inventory-inner {
	display: flex;
	flex-direction: column;
	background: rgba(1.0, 1.0, 1.0, 0.75);
}

.inventory-row {
	display: flex;
	flex-direction: row;
	justify-content: space-evenly;
}

.inventory-column {
	display: flex;
	flex-direction: column;
	justify-content: space-evenly;
}

.modal p {
	font-size: 1rem;
	line-height: 1.3rem;
	color: #626684;
}

.inventory-title {
	/* font-size: 1.5em; */
	height: 70px;
	/* color: #D1D2DD; */
	margin: 0;
	padding-left: 105px !important;
	/* background-color: #1D1E27; */
	margin-left: 0 !important;
	background-image: url(/assets/images/logo-icon.svg);
	background-position: 20px center;
	background-repeat: no-repeat;
  border-radius: 7px 7px 0 0!important;
}

.tituloModal {
  margin-left: -85px!important;
}

.inventory-character {
	background-size: cover;
	overflow: hidden;
	width: 200px;
	height: 270px;
}

.inventory-item {
	border: black;
	border-style: solid;
	border-radius: 10%;
	background-color: black;
	width: 50px;
	height: 50px;
	margin: 2px;
	background-size: cover;
}

.inventory-item:hover {
	filter: sepia(100%);
}

.modal {
	z-index: 9999999999999999;
}

.body-modal-user {
	background-color: #d1d2dd;
	padding: 20px;
}

.foto-funcionarios {
	width: 80px;
	height: 80px
}

/* CSS do Cell Phone */
/*
.cellphone-modal {
	position: absolute;
	top: 15px;
	left: 200px;
	width: 80%;
	height: 100%;
	min-width: 440px;
	overflow: auto;
}

/* As bordas do Cell Phone

.smartphone {
    position: relative;
    width: 1180px;
    height: 820px;
    margin: auto;
    border: 16px black solid;
    border-top-width: 60px;
    border-bottom-width: 60px;
    border-radius: 36px;
    top: 9%;
    left: 0;
} */


/* A linha horizontal na parte superior do dispositivo */

.smartphone:before {
	content: '';
	display: block;
	width: 60px;
	height: 5px;
	position: absolute;
	top: -30px;
	left: 50%;
	transform: translate(-50%, -50%);
	background: #333;
	border-radius: 10px;
}


/* O círculo na parte inferior do dispositivo */

.smartphone:after {
	content: '';
	display: block;
	width: 35px;
	height: 35px;
	position: absolute;
	left: 50%;
	bottom: -65px;
	transform: translate(-50%, -50%);
	background: #333;
	border-radius: 50%;
}


/* A tela (ou conteúdo) do dispositivo */

.smartphone .content {
	width: 100%;
	height: 100%;
	background-image: linear-gradient(to bottom, #464b85, #454b87, #444b88, #424c8a, #414c8c, #3d488a, #394587, #354185, #2e397f, #273178, #1f2a72, #17226b);
}


/* Fechar o modal */

.fechar-modal-cellphone {
	position: absolute;
	top: -50px;
	right: 0;
	z-index: 9;
	background-color: black !important;
}


/* Botão para voltar a tela principal do Cell Phone */

.voltar-cellphone {
	position: absolute;
	left: 47.5%;
	bottom: -50px;
	height: 5vh;
	width: 50px;
	cursor: pointer;
	z-index: 9;
}
/* Ícones do Cell Phone */

li a.salas {
	border-radius: 100%;
	width: 47px;
	height: 47px;
	background: #37394A;
	display: inline-block;
	line-height: 47px;
	vertical-align: middle;
	text-align: center;
	cursor: pointer;
}

li a.salas:hover {
	background: #626684;
}

li a.salas:active {
	background: #DADBE4;
}

.icones-cellphone {
	width: 40px;
	height: 40px;
	display: block;
	margin: 0 auto 5px auto;
	cursor: pointer;
}

.cellphone-page-usuarios {
	position: absolute;
	top: 0vw;
	left: 0px;
	width: 101%;
	height: 100%;
	background-color: #000;
}

.cellphone-page-unit {
	position: absolute;
	top: 60px;
	width: 99%;
	height: 87%;
	background-color: white;
}

#cell-list {
	position: relative;
  left: 0px;
  width: 815px; /* Largura dos ícones no celular */
  margin-top: 60px;
}

#cell-list li {
	margin: 0;
	padding: 0;
	list-style: none;
	position: absolute;
	top: 0;
}

#cell-list li,
#cell-list a {
	height: 40px;
	display: block;
	text-align: center;
	font-size: 1.35rem;
	font-family: roboto;
	color: #fff;
	margin-bottom: 5px;
}

/* Botão Usuários na Sala */
#cell-sala {
	width: 50px;
    height: 47px !important;
    background: url(/assets/images/sprite-icons-celular.png) 0 -1671px;
    background-repeat: no-repeat;
}

#cell-sala:hover {
	background-position:  -156px -1671px;
}

#cell-sala:active {
	background-position: -78px -1671px;
}

/* Botão Contatos */
#cell-contato {
	width: 50px;
    height: 47px !important;
    background: url(/assets/images/sprite-icons-celular.png) 0 -620px;
    background-repeat: no-repeat;
}

#cell-contato:hover {
	background-position: -156px -620px;
}

#cell-contato:active {
	background-position: -78px -620px;
}

/* Botão Galeria */
#cell-galeria {
	left: 150px;
	width: 40px;
	background: url('/assets/images/sprite-icons-celular.png') 0 -400px;
	background-repeat: no-repeat;
}

#cell-galeria:hover {
	width: 40px;
	background-position: -40px -400px;
}

#cell-galeria:active {
	width: 40px;
	background-position: -80px -400px;
}

/* Botão Salas Favoritas */
#cell-favorita {
	width: 50px;
    background: url(/assets/images/sprite-icons-celular.png) 0 -1284px;
    background-repeat: no-repeat;
    height: 47px !important;
}

#cell-favorita:hover {
	background-position: -156px -1284px;
}

#cell-favorita:active {
	background-position: -78px -1284px;
}

/* Botão Celendario */
#cell-calendario {
	width: 50px;
    height: 47px !important;
    background: url(/assets/images/sprite-icons-celular.png) 0 -1230px;
    background-repeat: no-repeat;
}

#cell-calendario:hover {
	background-position: -156px -1230px;
}

#cell-calendario:active {
	background-position: -78px -1230px;
}

/* Botão Notificação */
#cell-notificar {
	top: 138px !important;
	width: 50px;
	height: 47px!important;
	background: url('/assets/images/sprite-icons-celular.png') 0 -1451px;
	background-repeat: no-repeat;
}

#cell-notificar:hover {
	background-position: -156px -1451px;
}

#cell-notificar:active {
	background-position: -78px -1451px;
}

/* Criar Notificação */
#cell-notificacao {
	top: 70px !important;
	width: 50px;
	height: 47px!important;
	background: url('/assets/images/sprite-icons-celular.png') 0 -1340px;
	background-repeat: no-repeat;
}

#cell-notificao:hover {
	background-position: -159px -1340px;
}

#cell-notificao:active {
	background-position: -78px -1340px;
}

/* Botão Tarefas */
#cell-writ {
	top: 70px !important;
  width: 50px;
  background: url(/assets/images/sprite-icons-celular.png) 0 -1395px;
  background-repeat: no-repeat;
  height: 47px !important;
}

#cell-writ:hover {
	background-position: -156px -1395px;
}

#cell-writ:active {
	background-position: -78px -1395px;
}

/* Botão Editar Salas */
#cell-editar {
	top: 140px !important;
    /* left: 80px; */
    width: 50px;
    background: url(/assets/images/sprite-icons-celular.png) 0 -990px;
    background-repeat: no-repeat;
    height: 47px !important;
}

#cell-editar:hover {
	background-position: -156px -990px;
}

#cell-editar:active {
	background-position: -78px -990px;
}

/*********************************************************************************/

.circulo {
	border-radius: 50%;
	width: 30px;
	height: 30px;
	padding: 6px;
	background: #1D1E27;
	color: #D1D2DD !important;
	text-align: center;
	cursor: pointer;
}

.circulo:hover {
	background: #626684;
	color: #D1D2DD !important;
}

.circulo:active {
	background: #D1D2DD;
	color: #1D1E27 !important;
}

.box {
	display: none;
}

.medida-group {
	width: 120px;
}

/* CSS DO EVENT DASHBOARD */
.bg-dashboard {
	padding-left: 3rem;
	overflow-y: auto;
	/*background-image: linear-gradient(to left top, #58cfef, #2ec2fb, #26b3ff, #50a0ff, #8089ff, #8a78fa, #9764f1, #a54be5, #8747d5, #6941c3, #4c3bb1, #2d349e);*/
}

.titulo {
	max-width: 30ch;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.MultiCarousel {
	float: left;
	overflow: hidden;
	padding: 15px;
	width: 100%;
	position: relative;
}

.MultiCarousel .MultiCarousel-inner {
	transition: 1s ease all;
	float: left;
}

.MultiCarousel .MultiCarousel-inner .item {
	float: left;
}

.MultiCarousel .leftLst,
.MultiCarousel .rightLst {
	position: absolute;
	top: calc(50% - 20px);
}

.MultiCarousel .leftLst {
	left: 0;
}

.MultiCarousel .rightLst {
	right: 0;
}

.MultiCarousel .leftLst.over,
.MultiCarousel .rightLst.over {
	pointer-events: none;
}

.PalestraCarousel {
	float: left;
	overflow: hidden;
	padding: 15px;
	width: 100%;
	position: relative;
}

.PalestraCarousel .PalestraCarousel-inner {
	transition: 1s ease all;
	float: left;
}

.PalestraCarousel .PalestraCarousel-inner .item {
	float: left;
}

.PalestraCarousel .PalestraleftLst,
.PalestraCarousel .PalestrarightLst {
	position: absolute;
	top: calc(50% - 20px);
}

.PalestraCarousel .PalestraleftLst {
	left: 0;
}

.PalestraCarousel .PalestrarightLst {
	right: 0;
}

.PalestraCarousel .PalestraleftLst.over,
.PalestraCarousel .PalestrarightLst.over {
	pointer-events: none;
}

.ProximaCarousel {
	float: left;
	overflow: hidden;
	padding: 15px;
	width: 100%;
	position: relative;
}

.ProximaCarousel .ProximaCarousel-inner {
	transition: 1s ease all;
	float: left;
}

.ProximaCarousel .ProximaCarousel-inner .item {
	float: left;
}

.ProximaCarousel .ProximaleftLst,
.ProximaCarousel .ProximarightLst {
	position: absolute;
	top: calc(50% - 20px);
}

.ProximaCarousel .ProximaleftLst {
	left: 0;
}

.ProximaCarousel .ProximarightLst {
	right: 0;
}

.ProximaCarousel .ProximaleftLst.over,
.ProximaCarousel .ProximarightLst.over {
	pointer-events: none;
}

.fa-heart-o {
	color: red;
	cursor: pointer;
	margin-right: 15px;
	font-size: 1.3rem !important;
}

.fa-heart {
	color: red;
	cursor: pointer;
	margin-right: 15px;
	font-size: 1.3rem !important;
}

.fa-calendar-alt {
	cursor: pointer;
}

.doc-chat{
	width: 81%;
    background-color: #F1F3F4;
    height: 50px;
    border-radius: 5px;
    padding-right: 8px;
    color: #000;
}

.record:hover .fa-microphone:before{
	content:"\f28b";
	color:rgba(180, 22, 22, 1);
  }
/* CSS do menu suspenso do avatar */
  .menu input {position: absolute; display: none}

  * {
	-webkit-touch-callout: text;
	-webkit-user-select: text;
	-moz-user-select: text;
	-ms-user-select: text;
	user-select: text;
  }

  .menu {
	margin: 0 auto;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -25px;
	margin-top: -25px;
  }

  .btn-chamada {
	width: 70px;
	height: 270px;
	position: absolute;
	overflow: hidden;
	cursor: pointer;
	z-index: 9999;
  }
  .btn-icones {
	position: absolute;
	overflow: hidden;
	cursor: pointer;
  }

  .btn-chamada {
	background: #ECEFF1;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
		-ms-flex-pack: center;
			justify-content: center;
	-webkit-box-align: center;
		-ms-flex-align: center;
			align-items: center;
  }
  .btn-icones {
	z-index: 99!important;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
		-ms-flex-pack: center;
			justify-content: center;
	-webkit-box-align: center;
		-ms-flex-align: center;
			align-items: center;

	-webkit-transition: all 0.3s cubic-bezier(.25,.8,.25,1);
	transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  }

  .btn-icones:not(:first-child) {
	opacity: 0;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	z-index: -2;

	-webkit-transition: all 0.6s cubic-bezier(.87,-.41,.19,1.44);
	transition: all 0.6s cubic-bezier(.87,-.41,.19,1.44);
  }

  /* Botão mochila */
  .btn-icones:nth-child(2) {left:0px;top:50px;-webkit-transition-delay: 0s;transition-delay: 0s}
  /* Botão editar avatar */
  .btn-icones:nth-child(3) {top:50px;left:0px;-webkit-transition-delay: 0.1s;transition-delay: 0.1s}
  /* Botão menu */
  .btn-icones:nth-child(4) {left:0px;top:50px;-webkit-transition-delay: 0.2s;;transition-delay: 0.2s}
  /* Botão celular */
  .btn-icones:nth-child(5) {left:0px;top:50px;-webkit-transition-delay: 0.3s;;transition-delay: 0.3s}
  /* Botão Joystick */
  .btn-icones:nth-child(6) {left:0px;top:50px;-webkit-transition-delay: 0.4s;;transition-delay: 0.4s}

  /* Botão mochila */
  input#toggle:checked ~ #show-menu .btn-icones:nth-child(2) {
	top: -50px;left: -50px;opacity:1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  }
  /* Botão editar avatar */
  input#toggle:checked ~ #show-menu .btn-icones:nth-child(3) {
	top: -100px;left: 30px;opacity:1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  }
  /* Botão menu */
  input#toggle:checked ~ #show-menu .btn-icones:nth-child(4) {
	left: 60px;top: -50px;opacity:1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  }
  /* Botão celular */
  input#toggle:checked ~ #show-menu .btn-icones:nth-child(5) {
	left: -30px;top: -100px;opacity:1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  }
  /* Botão Joystick */
  input#toggle:checked ~ #show-menu .btn-icones:nth-child(6) {
	left: 0px;top: -150px;opacity:1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  }

  .menuBtn, .closeBtn {
	position: absolute;
	transition: all 0.3s ease;
  }

  .closeBtn {
	transform: translateY(50px);
	opacity: 0;
  }

  input#toggle:checked ~ #show-menu .btn-icones .menuBtn {
	transform: translateY(-50px);
	opacity: 0;
  }

  input#toggle:checked ~ #show-menu .btn-icones .closeBtn {
	transform: translateY(0px);
	opacity: 1;
  }

  div.left {
	position: absolute;
	left: 250px;
	visibility: hidden;
	bottom:50%;
  }
  div.right {
	position: absolute;
	right: 0;
	visibility: hidden;
	bottom:50%;
  }
  div.bottom {
	position: absolute;
	top: 0;
	visibility: hidden;
	left:50%;
  }
  div.top {
	position: absolute;
	bottom: 0;
	visibility: hidden;
	left:50%;
  }

  .accordion-button::after{
	background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/></svg>")!important;
  }

  .cidade, .pontosTuristicos, .escritorios, .espacosEventos{
	position:relative;
	z-index: 9;
	margin-top: 7%;
	height: 85%;
	overflow: auto;
  }

/* CSS responsivo */

@media (min-width: 992px) {
	.dashboard-app {
		margin-left: 238px;
	}

	.dashboard-compact .dashboard-app {
		margin-left: 0;
	}
}


@media (max-width: 992px) {
	.dashboard-nav {
		display: block;
		position: fixed;
		top: 0;
		right: 80%;
		left: 0;
		bottom: 0;
		z-index: 1070 !important;
	}

	.dashboard-nav.mobile-show {
		display: none;
	}
}

@media (max-width: 992px) {
	.dashboard-nav header .menu-toggle {
		display: -webkit-box;
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
	}
}

@media (min-width: 992px) {
	.dashboard-toolbar {
		left: 250px;
	}

	.dashboard-compact .dashboard-toolbar {
		left: 0;
	}
}

.table, th, td{
	vertical-align: middle!important;
	text-align: center!important;
}

.cellphone-modal {
  position: absolute;
  top: 15px;
  left: 10%;
  width: 100%;
  height: 100%;
  min-width: 440px;
  overflow: auto;
}

.smartphone {
  position: relative;
  max-width: 400px; width: 365px;
  max-height: 700px; height: 700px;
  margin: auto;
  border: 10px black solid;
  border-top-width: 60px;
  border-bottom-width: 60px;
  border-radius: 36px;
  top: 5%;
  left: -100px;
}


/* Set the text color to gray */
.avatar-text {
	color: gray;
  }

  /* Create the glowing effect using box-shadow */
  .avatar-text-glow {
	animation: avatarglow 1s ease-in-out infinite alternate;
  }

  @keyframes avatarglow {
	from {
	  box-shadow: 0 0 5px gray;
	}
	to {
	  box-shadow: 0 0 20px gray;
	}
  }

/********************************** Medias para resoluções do Tablet ***************************************/

/* Telas Maiores - Exemplos: TVs Smarts */
@media (min-width: 1432px) {
	/* Barra de Ícones: Microfone / Câmera / Etc */
	.toolbox-content-items {
		position: absolute;
    	top: -55px;
	}

	/* Janela de Vídeo Conferência */
	.popup-meet {
		position: absolute;
		resize: both;
		overflow: none;
		display: block;
		inset: 65vh 0px 30px 65vw;
		z-index: +999999;
	}
}



/* Telas Grandes - Exemplos: Tablets / iPads */
@media (min-width: 992px) and (max-width: 1399px) {
	.cellphone-modal {
		position: absolute;
    top: 20px;
    left: 20%;
    width: 79%;
    height: 100%;
    min-width: 440px;
    overflow: auto;
	}

  .smartphone {
    position: relative;
    width: 365px;
    height: 667px;
    margin: auto;
    border: 16px black solid;
    border-top-width: 60px;
    border-bottom-width: 60px;
    border-radius: 36px;
    top: 10%;
    left: -64px;
  }
}

@media (min-width: 1200px) and (max-width: 1300px) {
  /* .cellphone-modal {
    left: 17%;
	}

  .smartphone {
    position: relative;
    width: 920px;
    height: 667px;
    margin: auto;
    border: 16px black solid;
    border-top-width: 60px;
    border-bottom-width: 60px;
    border-radius: 36px;
    top: 9%;
    left: -78px;
  } */

  #cell-list {
    position: relative;
    left: 10px;
    width: 765px;
    margin-top: 60px;
  }
}

@media (min-width: 1165px) and (max-width: 1199px) {
  /* .smartphone {
    position: relative;
    width: 920px;
    height: 667px;
    margin: auto;
    border: 16px black solid;
    border-top-width: 60px;
    border-bottom-width: 60px;
    border-radius: 36px;
    top: 9%;
    left: -78px;
  } */
}

@media (min-width: 1098px) and (max-width: 1164px) {
  /* .smartphone {
    position: relative;
    width: 870px;
    height: 667px;
    margin: auto;
    border: 16px black solid;
    border-top-width: 60px;
    border-bottom-width: 60px;
    border-radius: 36px;
    top: 9%;
    left: -74px;
  } */
}

@media (min-width: 1020px) and (max-width: 1097px) {
  /* .smartphone {
    position: relative;
    width: 760px;
    height: 667px;
    margin: auto;
    border: 16px black solid;
    border-top-width: 60px;
    border-bottom-width: 60px;
    border-radius: 36px;
    top: 9%;
    left: -47px;
  } */

  .cellphone-modal {
		position: absolute;
    top: 20px;
    left: 20%;
    width: 79%;
    height: 100%;
    min-width: 440px;
    overflow: auto;
	}
}

@media (min-width: 992px) and (max-width: 1019px) {
  .smartphone {
    position: relative;
    width: 365px;
    height: 667px;
    margin: auto;
    border: 16px black solid;
    border-top-width: 60px;
    border-bottom-width: 60px;
    border-radius: 36px;
    top: 10%;
    left: -43px;
  }

  .cellphone-modal {
		position: absolute;
    top: 20px;
    left: 20%;
    width: 79%;
    height: 100%;
    min-width: 440px;
    overflow: auto;
	}
}

/* Resolução Média - Exemplo: Celualres, Smartphones Maiores */
@media (min-width: 577px) and (max-width: 991px){
	/* .cellphone-modal {
		position: absolute;
		top: 15px;
		left: 15%;
		width: 100%;
		height: 100%;
		min-width: 440px;
		overflow: auto;
	} */

	.smartphone {
		position: relative;
    width: 355px;
    height: 680px;
    margin: auto;
    border: 16px black solid;
    border-top-width: 60px;
    border-bottom-width: 60px;
    border-radius: 36px;
    top: 8%;
    left: -110px;
	}

	/* Parte branca da tela do Tablet */
	.cellphone-page-unit {
		position: absolute;
		top: 60px;
		width: 99%;
		height: 75%;
		background-color: white;
	}

	/* Botão Voltar Celular */
	.voltar-cellphone {
		position: absolute;
		left: 45%;
		top: 104%;
		height: 5vh;
		width: 50px;
		cursor: pointer;
		z-index: 9;
	}
}

  /* Quando a tela for menor do que 576px de resolução iphones 5, 6 por exemplo*/
 @media (max-width: 576px) {
	/* .cellphone-modal {
		position: absolute;
		top: 15px;
		left: 15%;
		width: 100%;
		height: 100%;
		min-width: 440px;
		overflow: auto;
	}*/

	.smartphone {
    position: relative;
    max-width: 400px;
    width: 340px;
    max-height: 700px;
    height: 700px;
    margin: auto;
    border: 10px black solid;
    border-top-width: 60px;
    border-bottom-width: 60px;
    border-radius: 36px;
    top: 5%;
    left: -80px;
  }

	/* Botão Voltar Celular */
	.voltar-cellphone {
		position: absolute;
		left: 45%;
		top: 104%;
		height: 5vh;
		width: 50px;
		cursor: pointer;
		z-index: 9;
	}

	.contact-profile {
		line-height: 60px;
		background: #659FFC;
		height: 18%;
	}

	/* Vídeo Conferência */

	/* Minimizar Janela VConf */
	.minimizar-popup-meet {
		inset: 65vh 250px 5px 65vw;
	}

	/* Maximizar Janela VConf */
	.maximizar-popup-meet {
		inset: 0vh 5px 5px 25vw;
	}

  }

  @media (max-height: 420px) {
	#sidebar {
		min-width: 240px;
		max-width: 240px;
		background: #26272F;
		color: #fff;
		overflow-x: hidden;
		overflow-y:scroll;
		transition: all 0.3s;
	}
  }

  @media (max-width: 495px) {
    .modal-content {
      width: 650px !important;
      position: relative !important;
      /*left: -68px !important;*/
    }

    .profile-photo {
      width: 90px;
      height: 90px;
      margin-left: 5px;
    }

    .cellphone-modal {
      position: absolute;
      top: 15px;
      left: 15%;
      width: 100%;
      height: 100%;
      min-width: 440px;
      overflow: auto;
    }

    .smartphone {
      position: relative;
      width: 345px;
      height: 650px;
      margin: 50px;
      border: 16px black solid;
      border-top-width: 60px;
      border-bottom-width: 60px;
      border-radius: 36px;
      top: 2%;
      left: -48px;
    }

    #cell-list {
      width: 725px;
    }
  }