@charset 'iso-8859-2';
.clear { clear: both; width: 100%; height: 1px; }
.clear-2 { clear: both; width: 100%; margin: 30px 0px; }
.anFF1 { -webkit-transition: all 0.1s ease; transition: all 0.1s ease; }
.anFF2 { -webkit-transition: all 0.2s ease; transition: all 0.2s ease; }
.anFF10 { -webkit-transition: all 1.0s ease; transition: all 1.0s ease; }
/* Fontes */
.fwnone { font-weight: 0; } .fw100{ font-weight: 100; } .fw500{ font-weight: 500; } .fw900{ font-weight: 900; }
/* Tamanho das fontes */
.fsize-8{font-size:8px}.fsize-9{font-size:9px}.fsize-10{font-size:10px}.fsize-11{font-size:11px}.fsize-12{font-size:12px}.fsize-13{font-size:13px}.fsize-14{font-size:14px}.fsize-15{font-size:15px}.fsize-16{font-size:16px}.fsize-17{font-size:17px}.fsize-18{font-size:18px}.fsize-19{font-size:19px}.fsize-20{font-size:20px}.fsize-21{font-size:21px}.fsize-22{font-size:22px}.fsize-23{font-size:23px}.fsize-24{font-size:24px}.fsize-25{font-size:25px}.fsize-26{font-size:26px}.fsize-27{font-size:27px}.fsize-28{font-size:28px}.fsize-29{font-size:29px}.fsize-30{font-size:30px}.fsize-31{font-size:31px}.fsize-32{font-size:32px}.fsize-33{font-size:33px}.fsize-34{font-size:34px}.fsize-35{font-size:35px}.fsize-36{font-size:36px}.fsize-37{font-size:37px}.fsize-38{font-size:38px}.fsize-39{font-size:39px}.fsize-40{font-size:40px}.fsize-41{font-size:41px}.fsize-42{font-size:42px}.fsize-43{font-size:43px}.fsize-44{font-size:44px}.fsize-45{font-size:45px}.fsize-46{font-size:46px}.fsize-47{font-size:47px}.fsize-48{font-size:48px}.fsize-49{font-size:49px}.fsize-50{font-size:50px}.fsize-51{font-size:51px}.fsize-52{font-size:52px}.fsize-53{font-size:53px}.fsize-54{font-size:54px}.fsize-55{font-size:55px}.fsize-56{font-size:56px}.fsize-57{font-size:57px}.fsize-58{font-size:58px}.fsize-59{font-size:59px}.fsize-60{font-size:60px}.fsize-80{font-size:80px}
.lheight-8{line-height:8px}.lheight-9{line-height:9px}.lheight-10{line-height:10px}.lheight-11{line-height:11px}.lheight-12{line-height:12px}.lheight-13{line-height:13px}.lheight-14{line-height:14px}.lheight-15{line-height:15px}.lheight-16{line-height:16px}.lheight-17{line-height:17px}.lheight-18{line-height:18px}.lheight-19{line-height:19px}.lheight-20{line-height:20px}.lheight-21{line-height:21px}.lheight-22{line-height:22px}.lheight-23{line-height:23px}.lheight-24{line-height:24px}.lheight-25{line-height:25px}.lheight-26{line-height:26px}.lheight-27{line-height:27px}.lheight-28{line-height:28px}.lheight-29{line-height:29px}.lheight-30{line-height:30px}.lheight-31{line-height:31px}.lheight-32{line-height:32px}.lheight-33{line-height:33px}.lheight-34{line-height:34px}.lheight-35{line-height:35px}.lheight-36{line-height:36px}.lheight-37{line-height:37px}.lheight-38{line-height:38px}.lheight-39{line-height:39px}.lheight-40{line-height:40px}.lheight-41{line-height:41px}.lheight-42{line-height:42px}.lheight-43{line-height:43px}.lheight-44{line-height:44px}.lheight-45{line-height:45px}.lheight-46{line-height:46px}.lheight-47{line-height:47px}.lheight-48{line-height:48px}.lheight-49{line-height:49px}.lheight-50{line-height:50px}.lheight-51{line-height:51px}.lheight-52{line-height:52px}.lheight-53{line-height:53px}.lheight-54{line-height:54px}.lheight-55{line-height:55px}.lheight-56{line-height:56px}.lheight-57{line-height:57px}.lheight-58{line-height:58px}.lheight-59{line-height:59px}.lheight-60{line-height:60px}
.semi-bold { font-weight: 600;}
/* CSS para os textos */
.showPass{ position: absolute; right: 0px; top: 5px; z-index: 3; }

.color-grey, .color-grey * {color: #77797F;}.color-black, .color-black * {color: #000000;} .color-white, .color-white *{color: #ffffff;} .color-blue, .color-blue *{color: #2C7192;}
.bg-grey {background-color: #9c9a9a;}.bg-black {background-color: #000000;} .bg-white {background-color: #ffffff;} .bg-blue { background-color: #275575;}
.btn-dark-blue, .btn-dark-blue:hover { background-color: #275575;} .btn-light-blue, .btn-light-blue:hover { background-color: #49AFE8;}

.txt * { font-size:15px; color:#515151; font-family: arial; font-weight: 400; }
.txt p{ margin: 15px 0px; }
.txt * b,.txt * b *,.txt * strong, .txt * strong * { color: #333333; font-family: 'robotoblack', arial;  font-weight: 600;}
.txt * i,.txt * em,.txt * i *,.txt * em * { font-style:italic; }
.txt * a,.txt * a * { text-decoration:underline; }
strong{ font-weight: 600;}
/* opacidade */
.op1 { -webkit-transition: all .2s linear; transition: all .2s linear;}
.op2 { -webkit-transition: all .2s linear; transition: all .2s linear;}
.op3 { -webkit-transition: all .2s linear; transition: all .2s linear;}
.op1:hover { -ms-filter:'progid:DXImageTransform.Microsoft.Alpha(Opacity=60)'; filter: alpha(opacity=60); -moz-opacity:0.6; -khtml-opacity: 0.6; opacity: 0.6; }
.op2:hover { -ms-filter:'progid:DXImageTransform.Microsoft.Alpha(Opacity=80)'; filter: alpha(opacity=80); -moz-opacity:0.8; -khtml-opacity: 0.8; opacity: 0.8; }
.op3:hover { -ms-filter:'progid:DXImageTransform.Microsoft.Alpha(Opacity=90)'; filter: alpha(opacity=90); -moz-opacity:0.9; -khtml-opacity: 0.9; opacity: 0.9; }

legend { border-bottom: 1px solid #ececec; padding-bottom: 10px;}

.showUpper{text-transform: uppercase;}
.boxLoadCss{  width: 100%; position: absolute; background: rgba(255,255,255,0.8); height: 100%; top: 0px; left: 0px; z-index: 100;}
.lds-css.ng-scope{left: 50%;top: 50%;margin-left: -25px;margin-top: -25px;position: absolute;}

.ret-save{ top: 15px; right: 20px; border-radius: 5px; color: #FFFFFF; }
.opcityInitial{ opacity:0 }

/* HOME - MEUS APLICATIVOS  */
article.my-apps { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; cursor: default;}
article.my-apps section { background-color: #FFFFFF; max-width: 250px; width: 30%; margin: 0 1.5% 30px;}
article.my-apps section a { height: 100%;}
article.my-apps section a p span{ font-weight: 700;}
article.my-apps section a p.descricao{ position: absolute; display: block; bottom: 15px;}

/* PAGINA APLICATIVO */
.application { max-width: 1550px;}
section.plan-info .container { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-pack: distribute; -webkit-box-pack: justify; justify-content: space-between; cursor: default;}

.disabledRow .disabledRowBkg { top: 0; left: 0; width: 100%; height: 100%; background: #BBBBBB3f; z-index: 1000; }

section.app-users > header, section.app-users article.list-user section{ display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
section.app-users > header div, section.app-users article.list-user section div{ overflow: hidden; -webkit-box-sizing: border-box; box-sizing: border-box;}
section.app-users > header div p, section.app-users article.list-user section div p {overflow: hidden;}
section.app-users > header div .btn{background-color: #8853EF; border-color: none; border-radius: 4px;}
section.app-users article.list-user section div.allow .abrev{ line-height: 60px;}
section.app-users article.list-user section div .lojaUser{ border-radius: 5px;}
article.modal{ background-color: #0000003f; overflow: hidden;}
article.modal .modal-content { max-width: 700px; top: 50%; max-height: 95vh; border: none; border-radius: 5px; -webkit-transform: translateY(-50%); transform: translateY(-50%);}
article.modal .modal-content header{ border-top-left-radius: 5px; border-top-right-radius: 5px; }

/* Customização formulário */
.modal-content input[type='email']{ border-bottom: 1px solid #3d3d3d;}
.modal-content .btn { height: 35px;}
.modal-content .rdiobox{ cursor: pointer !important; }
/* .modal-content .rdiobox label{ cursor: pointer !important; } ativar quando tiver personalização de grupos */
.modal-content .rdiobox input[type='radio'] { height: 0px; width: 0px; display: contents;}
.modal-content .rdiobox input[type='radio'] + span:before, .modal-content .rdiobox input[type='radio']:checked  + span:after {  top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.modal-content .rdiobox span:after { width: 14px; height: 14px;}
.modal-content .rdiobox .unchangeable{ cursor: not-allowed;}
.modal-content .rdiobox input[type='radio']:checked + span:before { background-color: #757575;}
.modal-content .rdiobox input[type='radio']:checked  + span:after { background-color: #757575; border: 2px solid #ffffff; left: 1px;}
.modal-content .custom-control-label, .modal-content .custom-control-label::before{ position: relative; width: 100%; height: 30px; top: 0px; border-radius: 5px;}
.modal-content .custom-control-input:checked~.custom-control-label::before{ background-color: #275575; }
.modal-content .custom-control-input:focus~.custom-control-label::before{ -webkit-box-shadow: none; box-shadow: none;}
.modal-content .custom-control-label::after{ color: #CCCCCC; content: "\ec9d"; left: 50%; top: 6px; font-size: 1.35rem; line-height: 1.2rem; margin-left: -0.65rem; font-family: Linearicons!important; border-radius: 50%; width: 1.3rem; height: 1.3rem;}
/* .modal-content .custom-control-label:hover::after{ content: "\ec59";} ativar quando tiver personalização de grupos*/
.modal-content .custom-control-input:checked~.custom-control-label::after { color: #6c757d; content: "\ec59"; background-color: #4CA6E4; border-radius: 50%;}

@media screen and (max-width: 1100px){
	article.my-apps section {width: 47%; margin: 0 auto 30px;}
	section.plan-info .container { max-width: 100%;}
}
@media screen and (max-width: 991px){
	section.app-users header { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end;}
	section.app-users article.list-user { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
	section.app-users article.list-user section{-ms-flex-wrap: wrap;flex-wrap: wrap; -ms-flex-pack: distribute; justify-content: space-around; -ms-flex: 0 0 49%; -webkit-box-flex: 0; flex: 0 0 49%; max-width: 49%;}
	section.app-users article.list-user section div.allow{ -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1;}
	section.app-users article.list-user section div.allow span{ width: 60px; height: 60px; border-radius: 50%;}
	section.app-users article.list-user section div.allow .abrev.adm { background-color: #4D308C;}
	section.app-users article.list-user section div.allow .abrev.con { background-color: #774AD9;}
	section.app-users article.list-user section div.allow .abrev.ven { background-color: #7285F2;}
	section.app-users article.list-user section div.allow .abrev.mar { background-color: #63A1F2;}
	section.app-users article.list-user section div.allow .abrev.tec { background-color: #40BDE7;}
	section.app-users article.list-user section div.allow .abrev.per { background-color: #5CD7F2;}
	section.app-users article.list-user section div{ -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2;}
}
@media screen and (max-width: 860px){
	article.my-apps section {width: 47%; margin: 0 auto 30px;}
	section.plan-info .container { max-width: 100%;}
}
@media screen and (max-width: 620px){
	section.app-users article.list-user section{-ms-flex-wrap: wrap;flex-wrap: wrap; -ms-flex-pack: distribute; justify-content: space-around; -ms-flex: 0 0 100%; -webkit-box-flex: 0; flex: 0 0 100%; max-width: 100%;}
}
@media screen and (max-width: 550px){
	article.my-apps section {width: 100%;}
	section.plan-info .container div * {font-size: 14px;}
}