:root {
    --cor1: #313131;
    --cor2: #0BD65F;
    --cor3: #000000;
    --cor4: #838383;
    --cor5: #DBDBDB;
    --cor6: #FFFFFF;

    --apoio1: #b8c3f8;
    --apoio2: rgba(94,13,211,.3);
    --apoio3: rgba(11,214,95,.3);
    --apoio4: rgba(224,224,224,.3);
    --apoio5: linear-gradient(90deg, #5E0DD3 0%, #C35BE7 100%);
    --apoio6: rgba(219,219,219,.3);

    --comp1: #FFBABA;
    --comp2: #CBEFFF;
    --comp3: #FFF0D5;
    --comp4: #E0C3FA;
    --comp5: #C0FFDA;
    --comp6: #F8FFCB;


    --font1: 'Plus Jakarta Sans', sans-serif;
    --font2: 'Montserrat', sans-serif;
}

.wow { visibility:hidden}

.bgRule { background-position: center; background-repeat: no-repeat; background-size: cover;}

html { scroll-behavior: smooth}
body { margin:0; -webkit-font-smoothing: antialiased; overflow-x: hidden; font-family: var(--font1) }
a { text-decoration:none; transition: all .25s ease}
img { border:0; vertical-align:top; }
p { font-size: 18px; line-height: 150%; }
ul li { font-size: 18px; line-height: 150%; }

h1 { font-weight: 700; font-size: 40px; line-height: 120%; text-decoration: underline; text-decoration-color: var(--cor1); text-underline-offset: 5px; text-decoration-thickness: 2px;}
h2 { font-weight: 700; font-size: 36px; line-height: 120%; border-left: 5px solid var(--cor1); padding-left: 15px; }
h3 { font-weight: 700; display: inline-table; font-size: 24px; line-height: 120%; background: linear-gradient(transparent 60%, var(--apoio1) 60%, var(--apoio1) calc(60% + 40px), transparent calc(60% + 40px)); background-size: 100% 1.2em; background-repeat: repeat-y;}
h4 { font-weight: 700; font-size: 20px; line-height: 120%; }


            
    .holdaHead {display: flex; width: 100%; align-items: center; justify-content: flex-start; box-sizing: border-box; padding: 0 0 0 20px}
    .holdaHead strong { font-size: 33px; font-weight: 700; }
    .voltar {width: 30px; height: 30px; margin: 0 20px 0 0; background-color: #F5F5F5; color: var(--cor4); border-radius: 50%; font-size: 20px;
    transform: rotate(-90deg); display: flex; align-items: center; justify-content: center; }
    .voltar:hover {background-color: var(--cor1); color: #FFF;}
    
    .xtraOpts {flex-grow: 1; margin: 0 0 0 15px; display: flex; align-items: stretch; justify-content: flex-end}
    
    
    .busca { position: relative; max-width: 250px; width:100%;}
    .busca i { position: absolute; color: var(--cor1); top: 10px; right: 14px; font-size: 18px;}
	.busca input[type=text] { -webkit-appearance: none; width: 100%; margin:0; box-sizing:border-box; font-size:15px; font-family: var(--font1); outline:none; border-radius:30px; border:0px; background-color:#F5F5F5; color:#000; padding:10px 40px 10px 15px; }

    .busca input::-webkit-input-placeholder {color: #777;}
    .busca input:-moz-placeholder {color: #777}
    .busca input::-moz-placeholder {color: #777}
    .busca input:-ms-input-placeholder {color: #777}
    
    .add { background-color: var(--cor1); width: 100%; font-size: 15px; max-width: 270px; padding: 0 20px; display: flex; align-items: center; justify-content: center; color: #FFF; border-radius: 30px; margin: 0 0 0 10px;}
    .add i { margin: 0 0 -4px 10px; font-size: 18px;}

    #stage { display: flex; align-items: stretch; justify-content: space-between; }
    
    
    #dash { width: 400px; height: 100dvh; border-right: 1px solid #c0c0c0;}
    #pagina { flex-grow: 1; max-width: calc(100vw - calc(401px + 4vw)); margin: 0 4vw 0 0;}
    
    #laPagina { box-sizing: border-box; padding: 20px; max-height: calc(100dvh - 80px); overflow: auto; }
    
    header { height: 80px; border-bottom: 1px solid #c0c0c0; display: flex; align-items: center; justify-content: center; position: relative; }
    
    .logo { width: 210px;}
    
    
    .menu { width: 100%; margin: 0; box-sizing: border-box; padding: 0 20px 0 4vw;}
    
    .menu li { list-style: none; border-bottom: 1px solid var(--apoio1);}
    .menu li a { display: flex; font-size: 14px; font-weight: 700; position: relative; padding: 30px 0; align-items: center; color: var(--cor3); justify-content: flex-start; box-sizing: border-box; }
    .menu li a i { font-size: 20px; color: var(--cor1); margin: 0 10px -5px 0;}
    .menu li a em { font-style: normal; transition: all .15s ease }
    
    .menu li a:after {position: absolute; top: calc(50% - 10px); right: 0;}
    .menu li a:hover:after {content: url('https://api.iconify.design/ion/arrow-up-sharp.svg?color=%23b8c3f8&width=20&rotate=90deg'); }
    
    .menu li:last-child { border: 0}



.menuFiltro1 { width: 100%; padding: 0; margin: 0; display: flex; align-items: flex-start;}
    .menuFiltro1 li {; flex-grow: 1; list-style: none; }
    .menuFiltro1 li a { width: 100%; font-size: 14px; font-weight: 500; color: var(--cor3); display: block; text-align: center; border-bottom: 1px solid var(--apoio4); box-sizing: border-box; padding: 10px 0;}
    .menuFiltro1 li a:hover {border-bottom: 1px solid var(--cor1);}

    .semLink { position: absolute; padding: 2px 0; transform: rotate(45deg); top: 20px; right: -23px; background-color: #d00; width: 100px; color: #FFF; text-transform: uppercase; font-size: 11px; text-align: center; }
    .semInfo{ position: absolute; padding: 2px 0; transform: rotate(45deg); top: 33px; right: -57px; background-color: #000; width: 200px; color: #fff; text-transform: uppercase; font-size: 11px; text-align: center; }

    .menuExtra2 { width: 100%; display: flex; padding: 30px 0 10px 0; align-items: stretch; justify-content: flex-end;}
    .filtros {display: flex; cursor: pointer; color: var(--cor3); border: 1px solid #FFF; box-sizing: border-box; border-radius: 5px; align-items: center; justify-content: flex-start;}
    .filtros i { font-size: 20px; margin: 0 0 -5px 5px}
    .filtros:hover, .ativoFiltros { background-color: var(--apoio4); border: 1px solid var(--cor4);}
    
    .resultados { margin: 0 13px}
    .lixeira {border-left: 1px solid var(--cor3); color: var(--cor1);}
    .lixeira:hover {text-decoration: underline}
    
    .filtros, .lixeira, .resultados { padding: 1px 10px; font-size: 15px;}
    
    .listaItens { display: flex; align-items: stretch; padding: 20px 0 0 0; justify-content: flex-start; flex-wrap: wrap;}
    .umItem {width: calc(20% - 20px); position: relative; overflow: hidden; transition: all .15s ease; margin: 0 25px 25px 0; box-sizing: border-box; padding: 15px; border-radius: 10px; border: 1px solid #c0c0c0;  }
    .recolhido .umItem { width: calc(16.66% - 21px)}

    .completo .umItem:nth-of-type(5n) { margin-right: 0;}
    .recolhido .umItem:nth-of-type(6n) { margin-right: 0;}

    .umItem:hover { transform: scale(1.05); }
    .fotoItem { width: 100%; border-radius: 5px;}
    .fotoItem img {width: 100%; opacity: 0;}
    
    .infoItem { margin: 20px 0 0 0; position: relative; }
    .infoItem b { width: calc(100% - 30px); display: block; font-size: 16px; }
    .infoItem em {color: var(--cor4); width: calc(100% - 30px); display: block; font-style: normal; font-size: 13px;}
    
    .destak { width: 28px; height: 28px; position: absolute; top: 0; right: 0; display: flex; align-items: center; justify-content: center; border: 1px solid var(--cor1); color: var(--cor1); font-size: 20px; border-radius: 50%;}
    
    .maisItem { display: flex; justify-content: center; padding: 10px 0; align-items: center; margin: 30px 0 0 0; border-radius: 30px; font-size: 14px; font-weight: 600; color: var(--cor1); border: 1px solid var(--cor1); cursor: pointer;}
    .maisItem i { margin: 0 0 -5px 5px; font-size: 18px;}
    
    .maisItem:hover { background-color: var(--apoio1);}
   
    .paginas { padding: 20px 0; display: flex; align-items: stretch; justify-content: flex-start;}
    .paginas a { margin: 0 10px 0 0; border-radius: 5px; border: 1px solid var(--cor1); font-weight: 600; box-sizing: border-box; font-size: 15px; padding: 8px 15px; color: var(--cor1)}
    .paginas a:hover { background-color: var(--apoio1); transform: scale(1.05)}
    .current, .current:hover { background-color: var(--cor1)!important; color: #FFF!important; font-weight: 700!important}




    
    .uploadFile input[type=text] { -webkit-appearance: none; width:100%; margin:0 0 10px 0; box-sizing:border-box; font-size:16px; font-family: var(--font1); outline:none; border-radius:10px; border:1px solid var(--cor4); background-color:#fff; color:#333; padding:15px; }
	
	.uploadFile input[type=submit] { -webkit-appearance: none; width:170px; box-sizing:border-box; font-size:16px; font-family: var(--font1);  outline:none; border-radius:10px; border:0px; background-color:var(--cor1); color:#FFF; padding:15px; margin:20px 0 0 0; text-transform:uppercase; cursor:pointer; transition:all .15s ease;}
	.uploadFile input[type=submit]:hover { background-color:#000}
		
		.uploadFile input::-webkit-input-placeholder {color: #777;}
		.uploadFile input:-moz-placeholder {color: #777}
		.uploadFile input::-moz-placeholder {color: #777}
		.uploadFile input:-ms-input-placeholder {color: #777}
                
        .file-container2 { width: calc(50% - 5px); border: 1px solid var(--cor4); max-width: 300px; background-color: #FFF; color: var(--cor4); font-family: var(--font1); font-size: 16px; position: relative; display: flex; box-sizing: border-box; border-radius: 10px; padding: 12px 0 16px 0; align-items: center; justify-content: center; text-align: center; }
        .file-container2 i { font-size: 20px; margin: 0 28px 0 0; position: relative; }
        .file-container2 i svg { position: absolute;  margin: 3px 0 0 0 }

        .file-container2:hover { background-color: var(--cor5); }
        .file-container2 input[type="file"] { position: absolute; top: 0; left: 0; opacity: 0; width: 100%; height: 100%; cursor: pointer; }

    
    .holdaFilePasta { display: flex; align-items: stretch; justify-content: space-between; }
    
    .pasta { display: flex; cursor: pointer; width: calc(50% - 5px); padding: 12px 0 16px 0; border-radius: 10px; border: 1px solid var(--cor4); color: var(--cor4); align-items: center; justify-content: center}
    .pasta i {  font-size: 20px; margin: 0 10px -5px 0;}
    
    .pasta:hover { background-color: var(--cor5)}
    
    .holdaPasta { border: 1px solid var(--cor4); max-height: 146px; display: none; overflow: auto; margin: 10px 0 0 0; border-radius: 10px;}
    .showPastas { display: block}
    .umaPasta { width: 100%; box-sizing: border-box; padding: 5px 0; cursor: pointer; display: flex; align-items: center; justify-content: flex-start;}
    .umaPasta:before { content: url('https://api.iconify.design/ic/baseline-folder.svg?color=%23cbb548&width=22'); margin: 0 10px -4px;}
    .umaPasta:hover {opacity: .8}
    
    .umaPasta:nth-of-type(odd) { background-color: #FFF}
    .umaPasta:nth-of-type(even) { background-color: #eee}
    
    .nova:before {content: url('https://api.iconify.design/ic/baseline-folder.svg?color=%2300acdd&width=22'); }
    
    .umaPasta em { display: none; }
    
    .pastaNova em { display: block}
    .pastaNova b { display: none}
    
    
    .umaPasta input[type=text] { font-size: 14px; padding: 0; border: 0; margin: 0; border-radius: 0; font-weight: 700;}
    
    
    .leMainArq { box-sizing: border-box; color: var(--cor3); font-weight: 700; margin: 0 0 20px 0; border-radius: 10px; border: 1px solid var(--cor1); display: flex; align-items: center; justify-content: flex-start; padding: 20px 15px;}
    .leMainArq:hover { color: var(--cor1); }
    .leMainArq i { font-size: 23px; margin: 0 10px -5px 0; color: var(--cor1);}
    
    .resultadoLista { margin: 40px 0 0 0; }
    
    .avisos { border: 1px solid var(--cor5); border-radius: 10px; margin: 10px 0; box-sizing: border-box; padding: 10px 15px; font-weight: 700;} 
    .erros { border-color: #F00; color: #F00; background-color: #FDE1E1 }
    .okok { border-color: #0c0; color: #0c0; background-color: #E8FFE8}
    
    .umAsset { padding: 15px 0 15px 36px; position: relative; box-sizing: border-box; border-bottom: 1px solid var(--cor5); cursor: pointer;}
    .umAsset:hover { border-bottom: 1px solid var(--cor4);}
    .umAsset b { min-width: 25px; height: 25px; display: flex; align-items: center; justify-content: center; border-radius: 30px; font-size: 14px; border: 1px solid var(--cor3); color: var(--cor3); position: absolute; top: 20px; left: 0;}
    .umAsset em { display: block; font-size: 13px; color: var(--cor4); font-style: normal; }
    .umAsset strong {font-size: 15px; color: var(--cor3); }



.aberto .umModal { max-width: calc(100% - 400px)!important}
    .infoModal { background-color: #FBFBFB}
    .topoNome { display: flex; text-decoration: none; align-items: center; justify-content: flex-start; font-size: 22px; color: #333;}
    .voltador { width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; transform: rotate(-90deg); font-size: 18px; margin: 0 10px 0 0; cursor: pointer; border-radius: 50%; background-color: #F5F5F5; color: #999;}
    .headCard { display: flex; align-items: flex-start; justify-content: space-between; }
    .hC1 { width: 350px;}
    .hC2 { flex-grow: 1; margin: 0 20px 0 50px;}
    .hC3 { width: 350px; display: flex; justify-content: space-between; flex-wrap: wrap; }
    .umaLc { min-height: 92px; margin: 0 0 20px 0;}
    .umaLc b { display: block; margin: 0 0 20px 0;}
    .hC3 .umaLc { width: calc(50% - 10px);}
    .hC3 .umaLc:last-child { width: 100%; }
    .leCardFace { width: 100%; cursor: pointer; height: 230px; border-radius: 15px; position: relative; overflow: hidden; }
    
    input[type=text], input[type=password], input[type=datetime-local], input[type=email], input[type=url], textarea { -webkit-appearance: none; width:100%; margin:0; box-sizing:border-box; font-size:16px; font-family: var(--font1); outline:none; border-radius:10px; border:1px solid #DADADA; background-color:#FFF; color:#000; padding:15px; }
    input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {color: #AAA;}
    input:-moz-placeholder, textarea:-moz-placeholder {color: #AAA}
    input::-moz-placeholder, textarea::-moz-placeholder {color: #AAA}
    input:-ms-input-placeholder, textarea:-ms-input-placeholder {color: #AAA}
    
    input[type=submit] { -webkit-appearance: none; width:170px; box-sizing:border-box; font-size:16px; font-family: 'Open Sans', sans-serif;  outline:none; border-radius:10px; font-weight: 700; border:0px;  background-color:var(--cor1); color:#FFF; padding:15px; margin:20px 0 0 0; cursor:pointer; transition:all .15s ease;}
	input[type=submit]:hover { background-color:#000}
		
	
    .opcoesBox { display: flex; height: 50px; align-content: center; justify-content: flex-start; }
    .umaOpcao { display: flex; align-items: center; justify-content: center; margin: 0 15px 0 0; }
    .umaOpcao input[type="radio"], .umaOpcao input[type="checkbox"] { -webkit-appearance: none; appearance: none; background-color: #fff; margin: 0;}
	.umaOpcao input[type="radio"], .umaOpcao input[type="checkbox"] { appearance: none; background-color: #fff; margin: 3px 10px 0 0; font: inherit; color: var(--cor1); width: 1.15em; height: 1.15em; border: 2px solid var(--cor1); border-radius: 0.15em; transform: translateY(-0.075em);}
    .umaOpcao input[type="radio"], .umaOpcao input[type="checkbox"] { display: grid; place-content: center; min-width: 19px;}
	.umaOpcao input[type="radio"]::before, .umaOpcao input[type="checkbox"]::before { content: ""; width: 0.65em; height: 0.65em; transform: scale(0); transition: 120ms transform ease-in-out; box-shadow: inset 1em 1em var(--form-control-color);}
	.umaOpcao input[type="radio"], .umaOpcao input[type="checkbox"] { display: grid; place-content: center;}
    .umaOpcao input[type="radio"]::before, .umaOpcao input[type="checkbox"]::before { content: ""; width: 0.65em; height: 0.65em; transform: scale(0); transition: 120ms transform ease-in-out; box-shadow: inset 1em 1em var(--form-control-color);}
    .umaOpcao input[type="radio"]:checked, .umaOpcao input[type="checkbox"]:checked { background-color: var(--cor1);}
    .umaOpcao input[type="radio"]:checked::before, .umaOpcao input[type="checkbox"]:checked::before { transform: scale(1);}
    .umaOpcao input[type="radio"]::before, .umaOpcao input[type="checkbox"]::before { background-color: #FFF;}
	.umaOpcao input[type="radio"]::before, .umaOpcao input[type="checkbox"]::before { transform-origin: bottom left; clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);}
    .holdaSelect { width: 100%; height: 50px; position: relative; }
    .holdaSelect i { font-size: 25px; position: absolute; top: calc(50% - 10px); right: 15px; color: var(--cor1)}
    .holdaSelect select { -webkit-appearance: none; z-index: 9; top: 0; left: 0; position: absolute; width:100%; margin:0; box-sizing:border-box; font-size:16px; font-family: var(--font1); outline:none; border-radius:10px; border:1px solid #DADADA; background-color:transparent; color:#000; padding:15px 40px 15px 15px; }
    .tabsCard {border-bottom: 1px solid var(--cor1)}
    .tabsCard { margin: 0 0 20px 0; min-height: 45px; padding: 0 0 0 5px; display: flex; align-items: flex-end; justify-content: flex-start;}
    .tabsCard li { list-style: none; transition: all .1s ease!important; cursor: pointer; font-weight: 700; color: #999; font-size: 13px; padding: 7px 15px; margin: 0 0 5px 5px; box-sizing: border-box; border: 1px solid var(--apoio1); border-radius: 7px;}
    .tabsCard li:hover {border: 1px solid var(--cor1)}
    .tabsCard li:last-child { background-color: var(--cor1); color: #FFF; margin-left: auto; font-size: 16px; padding: 7px 30px;}
    .tabsCard li:last-child:hover { background-color: var(--apoio1); color: var(--cor1)}
    .ativadaT { color: #000!important; position: relative; background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 50%, rgba(255,255,255,1) 50%, rgba(251,251,251,1) 100%)!important; margin-bottom: -1px!important; border-radius: 10px 10px 0 0!important; padding: 10px 15px 15px 15px!important;  border: 1px solid var(--cor1)!important; border-bottom: 0!important;}
    
    .tabsx { display: none;}
    .ativadaTab { display: block!important}
    
    .noselect, .copiavel {
          -webkit-touch-callout: none; 
            -webkit-user-select: none; 
             -khtml-user-select: none; 
               -moz-user-select: none; 
                -ms-user-select: none; 
                    user-select: none; 
    }
    
    .posicionar { display: flex; width: fit-content; align-items: center; color: var(--cor1); cursor: pointer; font-size: 13px; justify-content: center; border: 1px solid var(--cor1); border-radius: 20px; padding: 10px 30px; margin: 15px auto 0 auto}
    .posicionar i { margin: 0 0 0 10px;}
    .posicionar:hover { background-color: var(--cor1); color: #FFF;}
    .mudarFace { width: 100%; height: 100%; opacity: 0; transition: all .15s ease; position: absolute; top: 0; left: 0; display: flex; align-items: center; justify-content: center; background-color: rgba(255,255,255,.8); color: var(--cor1); font-size: 30px;}
    .mudarFace:before { content: ''; width: calc(100% - 40px); height: calc(100% - 40px); border: 1px solid var(--cor1); border-radius: 10px; position: absolute; top: 20px; left: 20px;}
    .leCardFace:hover .mudarFace { opacity: 1;}
    .leCardFace { border: 1px solid #FFF}
    .leCardFace:hover { border: 1px solid #DDD}
    .colDado { flex-grow: 1; margin: 0 10px;}
    .linhaChecks { width: 100%; box-sizing: border-box; padding: 15px 0 0 10px; display: flex; align-items: flex-start; justify-content: flex-start; flex-wrap: wrap}
    .linhaChecks .umaOpcao { width: calc(20% - 10px); justify-content: flex-start; margin: 0 10px 25px 0;}
    .linhaUrls2 { width: 100%;  display: flex; align-items: flex-start; flex-wrap: wrap; margin: 0 0 15px 0 }
    .linhaUrls2 div { margin: 0 10px;}
    .linhaUrls2 div:first-child { margin-left: 0;}
    .linhaUrls2 div:last-child { margin-right: 0;}
    .linhaUrls2 input { width: 100%; max-width: none; }
    .linU1 { flex: 1}
    .linU2 { width: 50%;}
    .linhaRow { display: flex; flex-wrap: wrap; padding: 25px 0 25px 0; border-bottom: 1px solid #CCC; align-items: center; justify-content: space-between; }
    .titulosB { font-size: 16px; margin: 0 20px 0 0; font-weight: 700; display: flex; align-items: center; justify-content: flex-start; }
    .titulosB i { color: var(--cor1); font-size: 22px; margin: 0 10px 0 0;}
    .umShort { flex-grow: 1; margin: 0 5px;}
    .umShort em { font-style: normal; font-size: 13px; margin: 0 0 7px 0; display: block; }
    .copiavel { background-color: #F5F5F5!important; color: #747474!important; cursor: pointer; }
    .copiavel::-webkit-input-placeholder {color: #747474!important;}
    .copiavel:-moz-placeholder {color: #747474!important}
    .copiavel::-moz-placeholder {color: #747474!important}
    .copiavel:-ms-input-placeholder {color: #747474!important}
    .linhaUrls {width: 100%; display: flex; align-items: center; justify-content: flex-start; margin: 0 0 10px 0;}
    .linhaUrls b { margin: 0 10px 0 0; min-width: 120px; font-size: 14px;}
    .linhaUrls i { color: var(--cor1); cursor: pointer; font-size: 22px; margin: 0 0 0 12px;}
    .linhaUrls input { max-width: 750px;}
    #resultadoDiv { margin: 0 0 0 20px; }
    .linhaFinal { display: flex; align-items: center; justify-content: flex-end;}
    .linhaFinal ul { display: flex; align-items: center; justify-content: flex-end;}
    .linhaFinal ul li { cursor: pointer; text-align: center; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 16px; list-style: none; margin: 0 0 0 10px; padding: 15px 20px; border-radius: 10px;}
    .linhaFinal ul li i { font-size: 20px; margin: 0 5px -4px 0;}
    .linhaFinal ul li:first-child { color: #EC0000;}
    .linhaFinal ul li:last-child { background-color: var(--cor1); border: 1px solid var(--cor1); min-width: 170px; color: #FFF;}
    .linhaFinal ul li:last-child:hover { background-color: var(--apoio1); color: var(--cor1)}
     
    #blocoVantagens { width: 100%; }
    .maisVantagem { position: relative; text-decoration: underline; font-size: 14px; color: var(--cor1); font-weight: 700; display: table; margin: 10px 0 0 5px; cursor: pointer; }
    .maisVantagem i { position: absolute; top: -1px; right: -23px; font-size: 20px; }

    .copiarx {
        -webkit-animation-duration: .5s; -webkit-animation-name: copiarx;
        -webkit-animation-delay: 0s; -webkit-animation-fill-mode: forwards;
    }
    @-webkit-keyframes copiarx {
        0% { box-shadow: 0px 0px 20px -6px var(--cor1) } 
        100% { box-shadow: 0px 0px 0px 0px var(--cor1) }
    }

    .remove { transform: scale(0); }



    .atualizando { font-size: 15px!important; text-align: center; margin: 0 0 0 10px; transform: scale(3); opacity: 0;  color: #FFF; border-radius: 10px; background-color: #0c0; box-sizing: border-box; padding: 2px 10px; }
    .atualizando {
        -webkit-animation-duration: .3s; -webkit-animation-name: atualizando;
        -webkit-animation-delay: 0s; -webkit-animation-fill-mode: forwards;
    }
    @-webkit-keyframes atualizando {
        0% { transform: scale(3); opacity: 0;} 
        100% {transform: scale(1); opacity: 1;}
    }

    .erro { background-color: #A00!important;}




  .expandir {position: absolute; z-index: 9999; background-color: #f00; opacity: 0; top: 11px; left: 40px; cursor: pointer; color: #777; font-size: 11px; background: #FFF; border: 1px solid #CCC; box-sizing: border-box; padding: 2px 10px; border-radius: 7px;}    
  .umModal:hover .expandir { opacity: 1;}
  .expandir:hover { color: #333;}
  .expandir:after { content: 'Expandir';}

  .expandido .umModal { right: 0; width: 100%!important; max-width: 100%!important; top: 0; border: 0!important; }


.expandido .expandir:after { content: 'Recolher';}

 .expandido .dadosSys textarea { height:220px;}


@media screen and (max-width: 1500px)
{
    .umItem {width: calc(25% - 15px); margin: 0 20px 25px 0; }
    .completo .umItem:nth-of-type(5n) { margin-right: 20px;}
    .completo .umItem:nth-of-type(4n) { margin-right: 0;}
    
    .recolhido .umItem {width: calc(20% - 15px); margin: 0 20px 25px 0; }

    .recolhido .umItem:nth-of-type(6n) { margin-right: 21px;}
    .recolhido .umItem:nth-of-type(5n) { margin-right: 0;}
   

}
@media screen and (max-width: 1300px)
{
   #dash { width: 300px; }
   #pagina { max-width: calc(100vw - calc(301px + 4vw)); }
        .logo { max-width: 160px;}

}

