/* .blockDark {background:var(--blockDark); margin-bottom:20px; transition: 0.5s} .blockDark:hover {cursor:pointer; transform: translateY(-5px); transition: 0.5s} .blockDark > h5, h6 {color:#fff;} .blockDark .bg-text {padding: 5px; font-weight: 700} .blockDark .block2 {padding:15px; min-height:350px} .blockDark .block3 {padding:10px; min-height:300px} .blockDark .block4 {padding:10px; min-height:350px} .blockDark .down {padding: 5px; min-height:280px} .blockDark .mkt {padding:15px; min-height:350px} @media screen and (max-width:1080px){.blockDark .block4 {min-height:420px}} @media screen and (max-width: 980px){.blockDark .block4 {min-height:360px}} @media screen and (max-width: 880px){.blockDark .block4 {min-height:340px}} @media screen and (max-width: 640px){.blockDark .block4 {min-height:300px}} */ /*font-family:'Julius Sans One', sans-serif, arial*/ a {color:var(--fontes); text-decoration:none; outline:none} a strong {font-weight: 700; outline:none} a img {border: none; outline:none} p {color:var(--fonp); font-size: 105%; line-height:140%} p strong {font-weight:700} @media screen and (max-width:768px){p{font-size:105%; line-height:130%}} @media screen and (max-width:540px){p{font-size:105%; line-height:120%}} h1 {font-size:180%; line-height: 1; font-weight:400; color:var(--fontes)} h2 {font-size:150%; line-height: 1; font-weight:400; color:var(--fontes)} h3 {font-size:130%; line-height:110%; font-weight:400; color:var(--fontes)} h4 {font-size:105%; line-height:130%; font-weight:400; color:var(--fontes)} h5 {font-size:100%; line-height:140%; font-weight:400; color:var(--fontes)} h6 {font-size: 80%; line-height:100%; font-weight:400; color:var(--fontes)} .h1 {font-size:180%; line-height: 1; font-weight:400; color:var(--fontes)} .h2 {font-size:150%; line-height: 1; font-weight:400; color:var(--fontes)} .h3 {font-size:130%; line-height:110%; font-weight:400; color:var(--fontes)} .h4 {font-size:105%; line-height:130%; font-weight:400; color:var(--fontes)} .h5 {font-size: 90%; line-height:140%; font-weight:400; color:var(--fontes)} .h6 {font-size: 80%; line-height:100%; font-weight:400; color:var(--fontes)} .h7 {color:#fff} .fw {font-weight: 700} .alignBox {width:100%; height:60px; display: flex; align-items: center; justify-content: center} .alignBox div {width: 100px; height: 100px} .border {border:1px dotted var(--border); padding:10px; border-radius: 10px; overflow: hidden} @media screen and (max-width:540px){.border{border: 1px dotted var(--border); padding: 10px; border-radius: 5px}} .borderbg {background:var(--blobkg); border-left: solid 1px #fff; border-top: solid 0px #fff} .borderDark {border:1px dotted var(--borderDark); padding: 10px; border-radius: 10px; overflow: hidden} .box {background:var(--boxbkg); border:1px solid var(--boxbor); width:100%; height:100%; margin:0 auto; padding: 20px !important; border-radius:20px; text-align: left; overflow:hidden; box-shadow:-1px -1px 20px 11px rgba(0,0,0, 0.06)} @media screen and (max-width:540px){.box{background:var(--boxbkg); border:0px solid var(--boxbor); padding: 0px !important; border-radius:0px; box-shadow:-0px -0px 0px 0px rgba(0,0,0, 0.06)}} .cp {cursor:pointer;} .display-table {display:table} .display-cell {display:table-cell; vertical-align:middle;} .upper {text-transform: uppercase;} .trans-bg {transition: background-color 0.5s ease} .fright {float:right;} .fleft {float:left;} .left {text-align:left;} .right {text-align:right;} .center {text-align:center;} .bloco-center {display: block; margin-left: auto; margin-right: auto;} .label {display: inline; background-color: #0aa4ae; margin-left:5px; padding:5px 10px 5px; font-size:65%; font-weight:600; line-height: 1; color: #fff; letter-spacing:0.03em; text-align: center; white-space: nowrap; vertical-align: baseline; border-radius: .25em;} .crd {cursor:default!important} .crp {cursor: pointer;} .btf {width:100%} .mt1 {margin-top:1px} .mt2 {margin-top:2px} .mt3 {margin-top:3px} .mt5 {margin-top:5px} .mt10 {margin-top:10px} .mt15 {margin-top:15px} .mt20 {margin-top:20px} .mt30 {margin-top:30px} .mr1 {margin-right:1px} .mr2 {margin-right:2px} .mr3 {margin-right:3px} .mr5 {margin-right:5px} .mr10 {margin-right:10px} .mr15 {margin-right:15px} .mr20 {margin-right:20px} .mr30 {margin-right:30px} .mb1 {margin-bottom:1px} .mb2 {margin-bottom:2px} .mb3 {margin-bottom:3px} .mb5 {margin-bottom:5px} .mb10 {margin-bottom:10px} .mb15 {margin-bottom:15px} .mb20 {margin-bottom:20px} .mb30 {margin-bottom:30px} .ml1 {margin-left:1px} .ml2 {margin-left:2px} .ml3 {margin-left:3px} .ml5 {margin-left:5px} .ml10 {margin-left:10px} .ml15 {margin-left:15px} .ml20 {margin-left:20px} .ml30 {margin-left:30px} .mg1 {margin:1px} .mg2 {margin:2px} .mg3 {margin:3px} .mg5 {margin:5px} .mg10 {margin:10px} .mg15 {margin:15px} .mg20 {margin:20px} .mg30 {margin:30px} .pt1 {padding-top: 1px} .pt2 {padding-top: 2px} .pt3 {padding-top: 3px} .pt5 {padding-top: 5px} .pt10 {padding-top: 10px} .pt15 {padding-top:15px} .pt20 {padding-top:20px} .pt30 {padding-top:30px} .pr1 {padding-right:1px} .pr2 {padding-right:2px} .pr3 {padding-right:3px} .pr5 {padding-right:5px} .pr10 {padding-right:10px} .pr15 {padding-right:15px} .pr20 {padding-right:20px} .pr30 {padding-right:30px} .pb1 {padding-bottom:1px}.pb2 {padding-bottom:2px} .pb3 {padding-bottom:3px} .pb5 {padding-bottom:5px}.pb10 {padding-bottom:10px}.pb15 {padding-bottom:15px}.pb20 {padding-bottom:20px} .pb30 {padding-bottom:30px} .pl1 {padding-left: 1px} .pl2 {padding-left: 2px} .pl3 {padding-left:3px} .pl5 {padding-left:5px} .pl10 {padding-left:10px} .pl15 {padding-left:15px} .pl20 {padding-left:20px} .pl30 {padding-left:30px} .pd1 {padding: 1px} .pd2 {padding: 2px} .pd3 {padding:3px} .pd5{padding:5px} .pd10 {padding:10px} .pd15{padding:15px} .pd20 {padding:20px} .pd30 {padding:30px} .radius3 {border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius:3px;} .radius6 {border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius:6px;} .radius10 {border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px;} .radius15 {border-radius:15px; -moz-border-radius:15px; -webkit-border-radius:15px;} .radius20 {border-radius:20px; -moz-border-radius:20px; -webkit-border-radius:20px;} .radius30 {border-radius:30px; -moz-border-radius:30px; -webkit-border-radius:30px;} .f700 {font-weight:700} /*:hover {cursor:pointer; transition: all .8s; opacity: 0.7}*/ .ttindex {width:100%; color:var(--ttindexfont); border-bottom:var(--ttindexborda) dotted 1px; text-align:center; font: 300 28px/32px 'Roboto',sans-serif; text-align: left; margin-bottom:0; padding:10px 10px 5px 0px; margin-bottom: 20px} .boxIndex h1 {font-size:180%; color:var(--boxindexfont); margin:10px 0} .boxIndex h5 {font-size: 90%; color:var(--boxindexfont)} .boxIndex p {font-size: 110%; color:var(--boxindexfont)} .boxIndex .texto {width:58%; padding:2%; margin-bottom:4%} .boxIndex .imagem {width:40%; padding:2%} @media screen and (max-width:975px){.boxIndex .texto{width:50%;}.boxIndex .imagem{width:50%}} @media screen and (max-width:835px){.boxIndex .texto{width:100%;}.boxIndex .imagem{width:100%; padding:2% 10%}} .clearfix:before, .clearfix:after {content: " "; display: table;} .clearfix:after {clear:both;} .clearfix {*zoom:1;} .clear {clear:both;} .navigation {background: var(--navbar); color:var(--navfon); border: solid 1px var(--navbor); font: bold 13px 'Lato'; letter-spacing: 0.3px; min-width: 30px; height:40px; margin-right:2px; margin-bottom:3px; padding:0 15px; border-radius: 3px; display: flex; align-items: center; text-transform:uppercase} .navigation:hover {background: var(--navhover)} .navigation a {font: bold 13px 'Lato'; color:var(--navfon); cursor:pointer; text-transform:uppercase} .navigation span {font: bold 13px 'Lato'; color:var(--navfon); text-transform:uppercase} .hrnav {margin:2px 0 10px 0; border: 1px dotted var(--hrlinc)} .navcorona {background: var(--navcorbar); color:var(--navcorfon); border: solid 1px var(--navcorbor); font: bold 13px 'Lato'; letter-spacing: 0.3px; min-width: 30px; height:40px; margin-right:2px; margin-bottom:3px; padding:0 15px; border-radius: 3px; display: flex; align-items: center} .navcorona:hover{background: var(--navcorhover)} .navcorona a {font: bold 13px 'Lato'; color:var(--navcorfon); cursor:pointer} .navcorona span {font: bold 13px 'Lato'; color:var(--navcorfon)} .navhrnav {margin:2px 0 10px 0; border: 1px dotted var(--hrcorlinc)} .portais-pag .full {background: var(--portaispag); color:var(--porfon); border: solid 1px var(--navbor); font: bold 13px 'Lato'; letter-spacing: 0.3px; min-width: 30px; height:30px; margin-right:2px; margin-bottom:3px; padding:0 15px; border-radius: 3px; display: flex; align-items: center} .portais-pag .active{background: var(--poractive); color:var(--porfon); border: solid 1px var(--navbor); font: bold 13px 'Lato'; letter-spacing: 0.3px; min-width: 30px; height:30px; margin-right:2px; margin-bottom:3px; padding:0 15px; border-radius: 3px; display: flex; align-items: center} .portais-pag .full:hover {background: var(--porhover)} .portais-pag a {font: bold 13px 'Lato'; color:var(--porfon)} /* ----- Sistema News (carossel/scroll) ----- */ .flexcroll {width:100%; height:350px; overflow-y:scroll} .flexcroll::-webkit-scrollbar {width: 12px} .flexcroll::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); -webkit-border-radius: 10px; border-radius: 10px} .flexcroll::-webkit-scrollbar-thumb {-webkit-border-radius: 10px; border-radius: 10px; background:var(--ttabkg); -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5)} .aside .bkg {background:var(--blobkg); padding: 15px; border-radius: 5px} .block-center {display: block; margin-left: auto; margin-right: auto;} /* ----- Scroll do navegador) ----- */ ::-webkit-scrollbar-track {background-color:var(--scrollbkg)} ::-webkit-scrollbar {width: 12px; background:var(--scroll)} ::-webkit-scrollbar-thumb {background:var(--scrollmov)} ::-webkit-scrollbar-thumb:hover {background:var(--scrollhover)} .aside .bkg {background:var(--blobkg); padding: 15px; border-radius: 5px} .block-center {display: block; margin-left: auto; margin-right: auto;} /* xadrez para tabelas*/ .aside table {border-spacing: 0px; width:100%} .aside td {padding:15px} .aside tr:nth-child(odd) {background:var(--tabela); border-top: 1px solid var(--tabelatop); border-bottom: 1px solid var(--tabelabot)} .aside tr:nth-child(even){background:var(--tabelaPar); border-top: 1px solid var(--tabelatop); border-bottom: 1px solid var(--tabelabot)} .aside tr:hover {background:var(--tabelahover); cursor:pointer} .aside .icon i {font-size:25px; color:#00a0d4} .aside .text {width:100%; padding:10px;} /* aside coluna cor cinza padrão */ .aside-col a {background: var(--aside); border-left: solid 1px var(--asileft); border-right: solid 1px var(--asiright); border-bottom:solid 1px var(--asibot); display:block; width:100%; padding:6px 10px; margin:0; overflow:hidden;} .aside-col a:hover {background: var(--asihover); cursor:pointer; overflow:hidden; outline: none} .aside-col:focus{outline: 0} .aside-col img {float:left; margin:0 10px 0 0; width:80px; height:auto;} .aside-col i {margin-right:7px;} /* aside coluna outros padrões de cores */ .aside-color {background: var(--asidecolor); padding:8px} .aside-color a {color:var(--asicolfon); border-top: solid var(--asicoltop) 1px; font-size: 90%; display:block; width:100%; padding:7px 10px; margin:0; overflow:hidden} .aside-color a:hover{background: var(--asicolh); border-left:; cursor:pointer; overflow:hidden; outline: none} .aside-color:focus {outline: 0} .aside-color img{float:left; margin:0 10px 0 0; width:80px; height:auto;} .aside-color i {margin-right:7px;} /* idem aside-col com padding menor e subtitulo */ .aside-col-min .sub {margin-left:13px} .aside-col-min a {background: var(--aside); border-left: solid 1px var(--asibrw); font-size:95%; border-top: solid 1px var(--asibrw); border-right: solid 0px var(--asibrb); border-bottom:solid 1px var(--asibrb); display:block; width:100%; padding:5px 10px; margin:0; overflow:hidden} .aside-col-min a:hover {background: var(--asihover); cursor:pointer; overflow:hidden; outline: none} .aside-col-min:focus{outline: 0} .aside-col-min img {float:left; margin:0 10px 0 0; width:80px; height:auto;} .aside-col-min i {margin-right:7px;} .aside-col-min h4 {font-size:90%; font-weight:700} /* aside linha cor cinza pradrão */ .aside-line {background: var(--aside); border-left: solid 1px var(--asibrw); border-top: solid 1px var(--asibrw); border-right: solid 0px var(--asibrb); border-bottom:solid 1px var(--asibrb); width:100%; padding: 5px 10px; min-height:40px; font-size:90%; font-weight: 700; display: flex; align-items: center; margin:auto;} .aside-line:hover {background:rgba(0,0,0,0.04); cursor:pointer; overflow:hidden; outline: none} .aside-line:before {content: "\f061"; font-family: FontAwesome; font-size: 120%; margin-right:10px} /* aside coluna outros padrões de cores */ .aside-service {background: var(--asideservice); padding:8px} .aside-service a {color:var(--asiserfon); border-top: solid var(--asisertop) 1px; font-size: 90%; display:block; width:100%; padding:7px 10px; margin:0; overflow:hidden} .aside-service a:hover{background: var(--asiserh); border-left:; cursor:pointer; overflow:hidden; outline: none} .aside-service:focus{outline: 0} .aside-service img {float:left; margin:0 10px 0 0; width:80px; height:auto;} .aside-service i {margin-right:7px;} .acordion-showbox {background: var(--acordion); border-top: solid 1px var(--acotop); border-bottom:solid 1px var(--acobot); border-left: solid 4px var(--acolef); border-right: solid 4px var(--acorig); padding: 12px 0; border-radius:7px; min-height:25px; line-height:25px; cursor:pointer} .acordion-showbox:hover {background:var(--acorhover)} .acordion-showbox span {color:var(--acorfont); font-weight:400; display: inline-block; vertical-align: middle; line-height: normal; text-transform: uppercase} @media screen and (max-width:414px){.acordion-showbox{font-size:90%}} .midias-bkg {background:var(--midiasbkg)} .midias-topo {min-height: 30px; font-size:140%; font-weight: 400; color:var(--midiasfon); overflow:hidden; display: flex; align-items: center} .midias-middle {min-height:360px; font-size: 90%; font-weight: 400; color:var(--midiasfon); padding-top:10px;} .midias-middle a{font-size: 90%; font-weight: 400; color:#fff} .midias-botton {height: 40px} .block {background:var(--block); border-left: solid 1px var(--borwhite); border-top: solid 1px var(--borwhite); border-right: solid 1px var(--borblack); border-bottom:solid 1px var(--borblack); box-shadow: 1px 1px 0px var(--borshadow); margin-bottom:15px; transition: 0.5s} .block:hover {background:var(--blockHover); cursor:pointer; box-shadow: 0 15px 15px rgba(0, 0, 0, 0.15); transform: translateY(-5px); transition: 0.5s} .block .block1 {padding:15px; min-height:450px} .block .block2 {padding:15px; min-height:370px} .block .block3 {padding:10px; min-height:320px} .block .block4 {padding:10px; min-height:250px} .block .block5 {padding:10px; min-height:200px} .block .down {padding: 5px; min-height:280px} .block .mkt {padding:15px; min-height:350px} @media screen and (max-width:1080px){.block4 {min-height:420px}} @media screen and (max-width: 980px){.block4 {min-height:360px}} @media screen and (max-width: 880px){.block4 {min-height:340px}} @media screen and (max-width: 640px){.block4 {min-height:300px}.block{margin-bottom:0}} .block-home {background:var(--block-home); padding: 20px} .block-home .ctt {color:var(--block-home-font); margin-bottom: 20px; border-bottom:1px solid #555555; height:40px; font: 300 32px/36px "Roboto",sans-serif; padding-left: 10px; text-transform:uppercase} .ttbkg {background:var(--ttbkg); border-bottom:var(--ttbkgfont) dotted 1px; width:100%; color:var(--ttbkgfont); font: 300 28px/45px 'Roboto',sans-serif; text-align: left; padding:0 10px; margin-bottom:10px; display: flex; align-items: center;} .ttbkg a {padding: 0 10px; font-size:15px; color:var(--ttbkgfont); float:right; text-align:right; display: flex; align-items: center} .ttbkg a:hover {cursor:pointer; font-weight:400} .ttbkgdark {background:var(--ttbkgdark); width:100%; color:var(--ttbkgdarkfont); font: 300 28px/56px 'Roboto',sans-serif; text-align: left; padding:0 10px; margin-bottom:10px; display: flex; align-items: center;} .ttbkgdark a {padding: 0 10px; height:56px; font: 300 13px/56px 'Roboto', sans-serif; color:var(--ttbkgdarkfont); font-weight: 300; float:right; text-align:right; display: flex; align-items: center} .ttbkgdark a:hover {cursor:pointer; font-weight:400} .ttline {border-bottom:var(--ttline) dotted 1px; width:100%; color:var(--ttlinefont); font: 300 28px/46px 'Roboto',sans-serif; text-align: left; padding:0; margin-bottom:10px; display: flex; align-items: center; text-transform:uppercase} .ttline a {padding: 0 10px; height:56px; font: 300 13px/56px 'Roboto', sans-serif; color:var(--ttlinefont); font-weight: 400; float:right; text-align:right; display: flex; align-items: center} .ttline a:hover {cursor:pointer; font-weight:700} .ttlinedark {border-bottom:var(--ttlinedark) dotted 1px; width:100%; color:var(--ttlinedarkfont); font: 300 28px/46px 'Roboto',sans-serif; text-align: left; padding:0; margin-bottom:10px; display: flex; align-items: center; text-transform:uppercase} .ttlinedark a {padding: 0 10px; height:56px; font: 300 13px/56px 'Roboto', sans-serif; color:var(--ttlinedarkfont); font-weight: 400; float:right; text-align:right; display: flex; align-items: center} .ttlinedark a:hover {cursor:pointer; font-weight:700} .tt3 {font-size:170%; color:var(--fonttt3); line-height: 140%; font-weight:400; margin:5px 0 5px 5px} .tt3:before {content: "\f101"; font-family: FontAwesome; margin-right:10px} .tta {background-color:var(--ttabkg); width:100%; min-height:45px; padding: 7px 7px 7px 10px; margin:auto; font-size:110%; font-weight: 700; color:var(--ttafon); text-transform:uppercase; display: flex; align-items: center; margin:auto; margin-bottom: 1px} .tta:before {content: "\f101"; font-family: FontAwesome; margin-right:10px} .ttb:before {border-top:11px solid var(--ttabkg); content: ""; display: inline-block; vertical-align: middle; margin-right: 30px; width: 0; height: 0; border-left:11px solid transparent; border-right:11px solid transparent; margin-left:30px; margin-top:-12px;} .tts {border-bottom:solid 1px var(--ttabkg); width:100%; padding: 7px 7px 7px 10px; margin:auto; font-size:180%; font-weight: 400; color:var(--ttabkg); text-transform:none; display: flex; align-items: center; margin:auto; margin-bottom: 1px} .tts:before {content: "\f101"; font-family: FontAwesome; margin-right:10px} .ttsb:before {border-top:11px solid var(--ttabkg); content: ""; display: inline-block; vertical-align: middle; margin-right: 30px; width: 0; height: 0; border-left:11px solid transparent; border-right:11px solid transparent; margin-left:30px; margin-top:-12px;} .ptta {background-color:var(--pttabkg); width:100%; min-height:40px; padding: 7px 7px 7px 10px; margin:auto; font-size:90%; font-weight: 700; color:var(--ttafon); text-transform:uppercase; display: flex; align-items: center; margin:auto; margin-bottom: 1px} .ptta:before {content: "\f101"; font-family: FontAwesome; margin-right:10px} .pttb:before {border-top:11px solid var(--pttabkg); content: ""; display: inline-block; vertical-align: middle; margin-right: 30px; width: 0; height: 0; border-left:11px solid transparent; border-right:11px solid transparent; margin-left:30px; margin-top:-12px;} .ttaa {background:var(--ttabkg); font-weight: 700; color:var(--ttafon); width:100%; min-height:40px; padding: 7px 7px 7px 10px; margin:auto; display: flex; align-items: center; margin:auto; margin-bottom: 1px} .ttaa a {font-size:90%; text-transform:uppercase;} .ttaa:before {content: "\f101"; font-family: FontAwesome; color:var(--ttafon); margin-right:10px} .ttaa:hover {background:var(--ttahover); cursor: pointer;} #ttbut {background:var(--ttbut); max-width:100%; min-height:40px; overflow:hidden} .tttex {font: 300 28px/56px "Roboto", sans-serif; color:var(--ttbutfon); padding-left: 10px; display: flex; align-items: center; margin-bottom: 1px} .ttbut a {padding: 0 10px; height:56px; font-weight: 700; display: flex; align-items: center; cursor:pointer} .ttbut a:hover {background:var(--ttbuthover); cursor:pointer} #ttabut {background:var(--ttabkg); max-width:100%; min-height:40px; overflow:hidden} .ttatex {color:var(--ttafon); height:40px; font-weight: 700; padding-left: 10px; text-transform:uppercase; display: flex; align-items: center; margin-bottom: 1px} .ttabut a {color:var(--ttafon)!important; height:40px; font-weight: 700; margin-right: 10px; display: flex; align-items: center; text-transform:uppercase; cursor:pointer; transition: all .8s;} .ttabut:hover {background:#000; cursor:pointer; transition: all .8s; opacity: 0.7} #pttabut {background:var(--pttabkg); max-width:1080px; min-height:40px; overflow:hidden} .pttatex {color:var(--pttafon); height:40px; font-weight: 700; padding-left: 10px; text-transform:uppercase; display: flex; align-items: center; margin-bottom: 1px} .pttabut a {color:var(--pttafon)!important; height:40px; font-weight: 700; margin-right: 10px; display: flex; align-items: center; text-transform:uppercase; cursor:pointer; transition: all .8s;} .pttabut:hover {background:#000; cursor:pointer; transition: all .8s; opacity: 0.7} .alignxy {display: flex; align-items: center; justify-content: center} .aligny {display: flex; align-items: center} .alignx {display: flex; justify-content: center} .align {display: flex; align-items: center; justify-content: center} hr {margin:10px 0; border: 1px dotted var(--hrclean)} .hr {margin:10px 0; border: 1px dotted var(--hrdark)} .modulo-abas {position:relative; font-size:0; text-align:left; color:#666} .modulo-abas > input {position:absolute; display:none} .modulo-abas > label {position:relative; z-index:1; display:inline-block; box-sizing:border-box; -moz-box-sizing:border-box; padding:1px; padding-top:0; padding-left:0; font-size:13px; line-height:45px; cursor:pointer} .modulo-abas > label span {display:block; padding:0px; background:rgba(255, 255, 255, .9)} .modulo-abas > label span span {padding:0 14px; background:transparent; transition:background .3s, color .4s; -o-transition:background .3s, color .4s; -ms-transition:background .3s, color .4s; -moz-transition:background .3s, color .4s; -webkit-transition:background .3s, color .4s} .modulo-abas > label:hover span span {background:var(--modHover); color:var(--modFont)} .modulo-abas > input:checked + label span span {background:var(--modHover); color:var(--modFont)} .modulo-abas > ul {list-style:none; position:relative; display:block; font-size:13px} .modulo-abas > ul > li {background:var(--modulosBkg); border:1px solid var(--modulosbor); position:absolute; min-height:330px; top:0; left:0; width:100%; padding:0px; box-sizing:border-box; -moz-box-sizing:border-box; opacity:0; -o-transform-origin:0% 0%; -ms-transform-origin:0% 0%; -moz-transform-origin:0% 0%; -webkit-transform-origin:0% 0%; -o-transition:opacity .8s, -o-transform .8s; -ms-transition:opacity .8s, -ms-transform .8s; -moz-transition:opacity .8s, -moz-transform .8s; -webkit-transition:opacity .8s, -webkit-transform .8s} .modulo-abas > .abas-1:checked ~ ul > .abas-1, .modulo-abas > .abas-2:checked ~ ul > .abas-2, .modulo-abas > .abas-3:checked ~ ul > .abas-3, .modulo-abas > .abas-4:checked ~ ul > .abas-4, .modulo-abas > .abas-5:checked ~ ul > .abas-5 {position:relative; z-index:1; opacity:1} /* ---------- button type="submit" class="btns" ---------- */ .btf {width:100%; text-align:center} .btns, .btnm, .btng {background:var(--button); font: bold 13px 'Lato'; padding:0; border:0; display:inline-block; letter-spacing:0.01em; outline:0; cursor:pointer; transition: all .3s} .btns:hover, .btnm:hover, .btng:hover {background: var(--buthover)} .btns {color:#fff; height:23px; line-height:23px; padding-right:15px;} .btnm {color:#fff; height:30px; line-height:30px; padding-right:15px;} .btng {color:#fff; height:35px; line-height:35px; padding-right:15px;} .btns i {color:#fff; height:23px; line-height:23px; width:23px; margin-right:10px; float:left; background-color:rgba(0,0,0,0.2); text-align:center} .btnm i {color:#fff; height:30px; line-height:30px; width:28px; margin-right:10px; float:left; text-align:center; background-color:rgba(0,0,0,0.2)} .btng i {color:#fff; height:35px; line-height:35px; width:35px; margin-right:10px; float:left; text-align:center; background-color:rgba(0,0,0,0.2)} /* ----------