.container-box{
    background-color:#fff;
    padding:2rem;
    border-radius:10px;
    box-shadow:0 0 3px #ccc;
    margin:1rem
}
.container-box.card{
    margin:0
}
.container-box-area{
    display:flex;
    flex-direction:row
}
.container-box-area>.container-box{
    width:50%;
    margin-bottom:0
}
.container-box-area>.container-box:not(:first-of-type){
    margin-left:0
}
.container-box header{
    margin-bottom:3rem;
    position:relative
}
input[type=password]::-ms-clear,input[type=password]::-ms-reveal{
    display:none
}
.box-input:not(.check){
    position:relative
}
.box-input.pesquisa{
    width:245px
}
.box-input-login{
    height:55px!important
}
.box-input:not(.check) label{
    background-color:#fff
}
.box-input label{
    -webkit-user-select:none;
    -khtml-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none
}
.box-input:not(.check){
    flex-direction:column
}
.box-input.check{
    align-items:center
}
.box-input.check label{
    margin-left:1rem
}
.box-group{
    position:relative;
    display:flex;
    align-items:center;
    width:100%;
    border-radius:10px 10px 0 0;
    background-color:transparent;
    display:flex;
    border-radius:30px;
    min-height:41px;
    border:1px solid #dcdcdc;
    text-decoration:none;
    position:relative
}
.box{
    margin-bottom:2rem
}
.box:not(:last-child):not(.input-config){
    margin-right:1rem
}
.box-input input:not([type=checkbox]):not([type=radio]),.box-input textarea{
    width:100%;
    padding:10px 20px 10px 20px;
    border-radius:30px;
    font-size:14px;
    background-color:transparent;
    height:40px;
    min-height:40px
}
.box-input textarea:focus{
    box-shadow:none
}
.box-input textarea::-webkit-scrollbar{
    width:6px;
    cursor:pointer;
    background-color:#f4f4f4;
    border-radius:10px;
    border:1px solid #dee2e6
}
.box-input textarea::-webkit-scrollbar-thumb{
    background:#0098da;
    box-shadow:0 .125rem .25rem rgba(0,0,0,.075);
    -webkit-box-shadow:inset 0 0 6px #00a5e7
}
input[type=color]{
    /*padding:12px 20px 10px 20px!important*/
}
.box-login>input{
    height:54px!important;
    padding:10px 37px 10px 37px!important
}
.box-login>label{
    left:28px!important;
    padding:0 8px!important
}
.box-input input:disabled{
    background-color:#e6e6e6
}
.box-input:not(.check) label:not(.ckd-label):not(.lb-secound){
    position:absolute;
    cursor:text;
    left:15px;
    padding:0 5px;
    top:-12px;
    font-size:14px;
    z-index:1;
    -webkit-transition:all .3s ease;
    -moz-transition:all .3s ease;
    -ms-transition:all .3s ease;
    -o-transition:all .3s ease;
    transition:all .3s ease
}
.box-input.check label{
    font-size:14px
}
.box-input .icon{
    cursor:pointer;
    position:absolute;
    right:15px;
    display:flex;
    align-items:center;
    justify-content:center;
    z-index:1;
    background-color:#fff;
    -webkit-transition:all .3s ease;
    -moz-transition:all .3s ease;
    -ms-transition:all .3s ease;
    -o-transition:all .3s ease;
    transition:all .3s ease
}
.box-input .icon.spin{
    width:15px;
    height:15px;
    vertical-align:text-bottom;
    border:2px solid #676262;
    border-right-color:transparent;
    border-radius:50%;
    z-index:152;
    -webkit-animation:spin .75s linear infinite;
    animation:spin .75s linear infinite
}
.box-input button.icon:focus{
    outline:0
}
.box-input.selecao ul{
    display:none;
    width:100.8%;
    position:absolute;
    overflow:hidden;
    cursor:pointer;
    opacity:0;
    top:calc(58%);
    left:-1px;
    z-index:100;
    background-color:#fff;
    border:1px solid #dcdcdc;
    border-bottom-left-radius:25px;
    border-bottom-right-radius:25px;
    border-top:none;
    scrollbar-color:#0098da #f4f4f4;
    scrollbar-width:thin;
    scrollbar-shadow-color:0 .125rem .25rem rgba(0,0,0,.075)
}
.box-input.selecao ul::-webkit-scrollbar{
    width:6px;
    cursor:pointer;
    background-color:#f4f4f4;
    border-radius:10px;
    border:1px solid #dee2e6
}
.box-input.selecao ul::-webkit-scrollbar-thumb{
    -webkit-border-radius:10px;
    border-radius:10px;
    background:#0098da;
    box-shadow:0 .125rem .25rem rgba(0,0,0,.075);
    -webkit-box-shadow:inset 0 0 6px #00a5e7
}
.box-input.selecao ul li{
    padding:8px 20px;
    font-size:13px;
    border-bottom:1px solid #e4e4e4
}
.box-input.selecao ul li:first-of-type{
    margin-top:1rem;
    border-top:1px solid #dcdcdc
}
.box-input.selecao ul li.ativo,.box-input.selecao ul li:hover{
    background-color:#00a5e7;
    color:#fff
}
.box-input.selecao.show .icon{
    transform:rotate(180deg)
}
.box-input.selecao.show ul{
    opacity:1;
    max-height:165px
}
.box-input.selecao.show{
    z-index:101
}
.box-input textarea{
    height:255px;
    resize:none
}
.box-input.keywords{
    height:60px!important
}
.box-input.keywords textarea{
    height:60px!important
}
.box-textarea{
    height:255px!important
}
.note-editor.note-frame{
    border-radius:30px!important;
    overflow:auto;
    border:1px solid #dcdcdc!important
}
.note-popover.popover-content,.note-toolbar{
    margin:0!important;
    padding:12px 0 4px 20px!important;
    background-color:transparent!important
}
.lb-summernote{
    position:absolute;
    top:-11px;
    left:17px;
    margin-bottom:0;
    background-color:#fff;
    padding:0;
    z-index:1;
    padding:0 5px
}
.cl,.cl-1,.cl-10,.cl-11,.cl-12,.cl-2,.cl-3,.cl-4,.cl-5,.cl-6,.cl-7,.cl-8,.cl-9{
    position:relative;
    width:100%
}
@media only screen and (min-width:768px){
    .cl{
        flex-basis:0;
        -webkit-box-flex:1;
        flex-grow:1;
        max-width:100%
    }
    .cl-12{
        flex:0 0 100%;
        max-width:100%
    }
    .cl-11{
        flex:0 0 91.6666666667%;
        max-width:91.6666666667%
    }
    .cl-10{
        flex:0 0 83.3333333333%;
        max-width:83.3333333333%
    }
    .cl-9{
        flex:0 0 75%;
        max-width:75%
    }
    .cl-8{
        flex:0 0 66.6666666667%;
        max-width:66.6666666667%
    }
    .cl-7{
        flex:0 0 58.3333333333%;
        max-width:58.3333333333%
    }
    .cl-6{
        flex:0 0 50%;
        max-width:50%
    }
    .cl-5{
        flex:0 0 41.6666666667%;
        max-width:41.6666666667%
    }
    .cl-4{
        flex:0 0 33.3333333333%;
        max-width:33.3333333333%
    }
    .cl-3{
        flex:0 0 25%;
        max-width:25%
    }
    .cl-2{
        flex:0 0 16.6666666667%;
        max-width:16.6666666667%
    }
    .cl-1{
        flex:0 0 8.3333333333%;
        max-width:8.3333333333%
    }
}
@keyframes spin{
    100%{
        -webkit-transform:rotateZ(360deg);
        transform:rotateZ(360deg)
    }
}
.tooltip{
    opacity:0;
    pointer-events:none;
    transform:scale(0);
    z-index:999;
    -webkit-transition:all .3s ease;
    -moz-transition:all .3s ease;
    -ms-transition:all .3s ease;
    -o-transition:all .3s ease;
    transition:all .3s ease
}
.tooltip.tooltip-show{
    opacity:1;
    pointer-events:all;
    transform:scale(1)
}
.tooltip.tooltip-bottom::after,.tooltip.tooltip-left::after,.tooltip.tooltip-right::after,.tooltip.tooltip-top::after{
    content:'';
    position:absolute;
    border:7px solid transparent
}
.tooltip.tooltip-left::after{
    border-left:7px solid rgba(59,72,80,.9);
    right:-14px;
    top:50%;
    transform:translateY(-50%)
}
.tooltip.tooltip-right::after{
    border-right:7px solid rgba(59,72,80,.9);
    left:-14px;
    top:50%;
    transform:translateY(-50%)
}
.tooltip.tooltip-top::after{
    border-top:7px solid rgba(59,72,80,.9);
    left:50%;
    bottom:-14px;
    transform:translateX(-50%)
}
.tooltip.tooltip-bottom::after{
    border-bottom:7px solid rgba(59,72,80,.9);
    left:50%;
    top:-14px;
    transform:translateX(-50%)
}
.box-combo{
    position:relative
}
.box-combo>*{
    position:relative;
    -webkit-user-select:none;
    -khtml-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none
}
.box-combo{
    position:relative;
    -webkit-user-select:none;
    -khtml-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none
}
.box-combo-ul{
    background:#fff;
    box-shadow:0 4px 6px rgba(32,33,36,.28);
    list-style-type:none;
    margin:0;
    padding:0;
    border:0;
    border-radius:0 0 24px 24px;
    padding-bottom:4px;
    overflow:hidden;
    display:none;
    position:absolute;
    width:100%;
    z-index:149
}
.box-combo-ul>div{
    margin:0 20px 0 14px;
    padding-bottom:4px
}
.box-combo-ul>div:first-child{
    border-top:1px solid #e8eaed
}
.box-combo-ul>div:last-child{
    margin-top:7px
}
.box-combo-ul>ul{
    max-height:148px;
    overflow-y:auto;
    cursor:pointer;
    scrollbar-color:#0098da #f4f4f4;
    scrollbar-width:thin;
    scrollbar-shadow-color:0 .125rem .25rem rgba(0,0,0,.075)
}
#atividades-aprendizado,#atividades-aprendizado>ul{
    height:250px;
    max-height:250px
}
.box-combo-ul>ul li{
    padding:8px 20px;
    font-size:13px;
    border-bottom:1px solid #e4e4e4;
    text-align:left
}
.box-combo-ul>ul li.ativo,.box-combo-ul>ul li:hover{
    background-color:#0095ff;
    color:#fff
}
.box-combo-ul>ul::-webkit-scrollbar{
    width:6px;
    cursor:pointer;
    background-color:#f4f4f4;
    border-radius:10px;
    border:1px solid #dee2e6
}
.box-combo-ul>ul::-webkit-scrollbar-thumb{
    -webkit-border-radius:10px;
    border-radius:10px;
    background:#0098da;
    box-shadow:0 .125rem .25rem rgba(0,0,0,.075);
    -webkit-box-shadow:inset 0 0 6px #00a5e7
}
.box-combo-input{
    background:#fff;
    display:flex;
    border:1px solid #dfe1e5;
    box-shadow:none;
    border-radius:24px;
    z-index:3;
    height:42px;
    min-height:42px;
    margin:0 auto;
    width:482px;
    width:auto
}
.box-combo-input>.box-input>.box-group{
    border:none!important
}
.show-ul{
    border-bottom-left-radius:0;
    border-bottom-right-radius:0;
    border-color:rgba(223,225,229,0);
    box-shadow:0 1px 6px rgba(32,33,36,.28)
}
.box-combo-input:not(.show-ul) input:focus:not(:read-only):not(:disabled),.box-input:not(.selecao)>.box-group input:focus:not(:read-only):not(:disabled){
    box-shadow:0 1px 6px rgba(32,33,36,.28)
}
.lb-secound{
    position:absolute;
    cursor:text;
    right:16px;
    padding:0 5px;
    top:-12px;
    font-size:14px;
    z-index:101;
    -webkit-transition:all .3s ease;
    -moz-transition:all .3s ease;
    -ms-transition:all .3s ease;
    -o-transition:all .3s ease;
    transition:all .3s ease
}
.lb-secound>div{
    display:flex;
    align-items:center
}
.lb-secound>div>input{
    margin-right:4px
}
.carregando{
    content:'';
    width:100%;
    height:100vh;
    -webkit-transition:all .3s linear;
    -moz-transition:all .3s linear;
    -o-transition:all .3s linear;
    -ms-transition:all .3s linear;
    transition:all .3s linear;
    border-radius:4px;
    opacity:1;
    position:fixed;
    background-color:#000000b8;
    top:0;
    left:0
}
.carregando>.spin{
    position:relative;
    width:5rem;
    height:5rem;
    vertical-align:text-bottom;
    border:.5em solid #00a5e7;
    border-right-color:transparent;
    border-radius:50%;
    z-index:152;
    -webkit-animation:spin .75s linear infinite;
    animation:spin .75s linear infinite
}
body>footer:not(.front){
    margin-top:auto;
    font-size:13px;
    display:flex;
    justify-content:center;
    align-items:center;
    background-color:#3159A6;
    padding:15px 25px;
    position:relative;
    height:50px;
    min-height:50px
}
body>footer:not(.front) *{
    color:#fff
}
body>footer:not(.front) span:not(:last-of-type)::after{
    content:'-';
    padding:0 .5rem
}
.footer{
    position:fixed;
    bottom:0;
    right:0;
    width:100%;
    padding:15px 20px 15px 20px;
    display:flex;
    justify-content:flex-end;
    align-items:center
}
@media only screen and (max-width:830px){
    body>footer:not(.front){
        min-height:110px;
        height:110px;
        flex-direction:column;
        justify-content:center
    }
    body>footer:not(.front) span:not(:last-of-type)::after{
        content:'';
        padding:0
    }
}
.selec{
    background-color:#0095ff;
    color:#fff
}
.btn-show,.btn-show>button,.w-225{
    width:225px
}
.btn-show-ativo>ul{
    opacity:1!important;
    pointer-events:auto!important;
    -webkit-transition:all .3s ease;
    -moz-transition:all .3s ease;
    -ms-transition:all .3s ease;
    -o-transition:all .3s ease;
    transition:all .3s ease
}
.btn-show-ativo>button{
    width:100%;
    border-bottom-left-radius:0;
    border-bottom-right-radius:0;
    border-color:rgba(223,225,229,0);
    box-shadow:0 1px 6px rgba(32,33,36,.28);
    -webkit-transition:all 50ms ease;
    -moz-transition:all 50ms ease;
    -ms-transition:all 50ms ease;
    -o-transition:all 50ms ease;
    transition:all 50ms ease
}
.btn-disable>button{
    background-color:#6c757d!important;
    cursor:default!important
}
.btn-disable>a{
    cursor:default!important
}
.btn-disable>div{
    display:none!important
}
.btn-show>div{
    cursor:pointer;
    height:100%;
    width:42px;
    position:absolute;
    top:0;
    right:0;
    border-radius:27px;
    display:flex;
    align-items:center;
    justify-content:center;
    -webkit-transition:all .3s ease;
    -moz-transition:all .3s ease;
    -ms-transition:all .3s ease;
    -o-transition:all .3s ease;
    transition:all .3s ease
}
.btn-show-ativo>div{
    border-radius:0!important
}
.btn-show>div:hover{
    background-color:#ffffff26;
    -webkit-transition:all .3s ease;
    -moz-transition:all .3s ease;
    -ms-transition:all .3s ease;
    -o-transition:all .3s ease;
    transition:all .3s ease
}
.btn-show>div>i{
    color:#fff
}
.btn-show>ul{
    background-color:#fff;
    background:#0082de;
    box-shadow:0 4px 6px rgba(32,33,36,.28);
    list-style-type:none;
    margin:0;
    padding:0;
    border:0;
    border-radius:0 0 35px 35px;
    opacity:0;
    position:absolute;
    width:100%;
    z-index:102;
    color:#fff;
    overflow:hidden;
    pointer-events:none;
    -webkit-transition:all .1s ease;
    -moz-transition:all .1s ease;
    -ms-transition:all .1s ease;
    -o-transition:all .1s ease;
    transition:all .1s ease
}
.btn-show>ul>a{
    position:relative;
    display:block;
    width:100%;
    padding:.25rem .1rem;
    clear:both;
    font-weight:400;
    color:#fff;
    white-space:nowrap;
    background-color:transparent;
    border:0;
    text-align:center
}
.btn-show>ul>a:hover:before{
    opacity:0;
    -webkit-transform:translate(0,0);
    transform:translate(0,0)
}
.btn-show>ul>a:before{
    content:'';
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    z-index:1;
    -webkit-transition:all .5s;
    -moz-transition:all .5s;
    -o-transition:all .5s;
    transition:all .5s;
    opacity:1;
    border-radius:5px;
    -webkit-transform:translate(-105%,0);
    transform:translate(-105%,0);
    background-color:rgba(255,255,255,.25)
}
.input-arrow-box{
    right:10px;
    position:absolute;
    opacity:0;
    top:10%;
    height:80%;
    transition:.3s ease-in-out;
    z-index:102
}
.box-group:hover>.input-arrow-box,.box-group>input[inputmode=decimal]:focus~.input-arrow-box,.box-group>input[type=number]:focus~.input-arrow-box{
    opacity:1
}
.nowrap{
    white-space:nowrap
}
@media only screen and (max-width:767px){
    .box:not(.page-products){
        margin-right:0!important
    }
}
@media only screen and (max-width:425px){
    .container-box{
        padding:1rem
    }
    .container-main{
        padding:20px 0
    }
    .box-input.pesquisa{
        width:100%
    }
}
.noselect{
    -webkit-user-select:none;
    -khtml-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none
}
.lb-search{
    position:absolute;
    top:-11px;
    left:18px;
    background-color:#fff;
    padding:0 5px;
    z-index:9
}
.box-input .box-group .input-button~i{
    cursor:pointer;
    z-index:110
}
.box-group:hover>.input-arrow-box,.box-group>input[inputmode=decimal]:focus~.input-arrow-box,.box-group>input[type=number]:focus~.input-arrow-box{
    opacity:1
}
.filtro-selecionado{
    background-color:#0095ff;
    color:#fff
}
html{
    -webkit-animation:1s ease-in loadHTML;
    -moz-animation:1s ease-in loadHTML;
    -o-animation:1s ease-in loadHTML;
    animation:1s ease-in loadHTML
}
@keyframes loadHTML{
    0%{
        opacity:0;
        pointer-events:none
    }
    50%{
        opacity:.5
    }
    100%{
        opacity:1;
        pointer-events:all
    }
}
#rectLogo{
    animation:anim 4s .1s forwards;
    clip-path:polygon(0 0 0 100% 100% 100% 100% 0);
    height:200px;
    width:100%
}
@keyframes anim{
    0%{
        clip-path:polygon(0 0,0 100%,0 100%,0 0)
    }
    50%{
        clip-path:polygon(0 0,0 100%,100% 100%,100% 0)
    }
    100%{
        clip-path:polygon(0 0 0 100% 100% 100% 100% 0)
    }
}
.box-combo-descricao,.box-input>.erro,.box-input>.info,.box-input>small,.small-info{
    padding:0 1.2rem
}
.box-input>small{
    display:inline-block
}
.box-input-login>.erro{
    padding:0 20px
}
input:-webkit-autofill,input:-webkit-autofill:active,input:-webkit-autofill:focus,input:-webkit-autofill:hover{
    -webkit-transition:"color 9999s ease-out, background-color 9999s ease-out";
    -webkit-transition-delay:9999s
}
.sn-checkbox-open-in-new-window label input,.sn-checkbox-use-protocol label input{
    margin-right:.5rem
}

.container-main, .container-main-100vh {
    width: 100%;
    display: flex;
    flex-direction: column;
    height: auto;
    padding: 60px 10px;
    align-items: center;
}
.container-main>.main-section>header:not(.header-inicio), .container-main>.main>header:not(.header-inicio) {
    margin: 0 1rem;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    flex-wrap: wrap;
}