html{
    font-size: 13px;
}
*{
    font-size: 1rem;
    font-family: sans-serif;
}

.hide{
    display: none;
}
body{
    margin: 0;
    padding: 0;
    font-size: 1rem;
    background-color: #fff;
}
header{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4rem;
    background: #fff;
}
/*
footer{
    background-color: #e60000;
    height: 1.5em;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    font-size: 1rem;
    line-height: 1.5rem;
    color: #fff;
    padding: 0 1rem;
    text-align: right;
}
*/
header div.menuTop{
    position: absolute;
    right: 0;
    padding: 1rem;
}

header div.menuTop .userAccount{
    cursor: pointer;
}

img.icon{
    filter: #e60000;
    filter: invert(48%) sepia(74%) saturate(2476%) hue-rotate(331deg) brightness(118%) contrast(119%) drop-shadow(1px 3px 6px #c0c0c0)
}
img.icon.button{
    cursor: pointer;
}


pre{
    white-space: pre-wrap;
    line-height: 150%;
}
main{
    background: #fff;
    position: absolute;
    left: 0;
    right: 0;
    top: 4rem;
    bottom: 0;
}
main div.main{
    background: #f9fafc;
    position: absolute;
    width:100%;
    right: 0;
    top: 0;
    bottom: 0;

    -webkit-box-shadow: inset 0px 0px 14px -2px rgba(0,0,0,0.13); 
    box-shadow: inset 0px 0px 14px -2px rgba(0,0,0,0.13);
}
main div.main.disconnected{
    width: 100%;
}

header div.brand{
    padding: 1rem;
    font-size: 1.8rem;
    color: #ff530d;
    text-shadow: 1px 1px #b7b7b794;
    position: absolute;
    left: 0;
    top: 0;
    width: 20vw;
}
header div.section{
    padding: 1rem 0;
    font-size: 1.5rem;
    line-height: 2rem;
    color: #585858;
    position: absolute;
    left: 50px;
}

main .main section{
    padding: 2rem;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0; /*1.5rem;*/
    overflow: auto;
}

main .main section nav{
    display: grid;
    grid-template-columns: 1fr 4fr 1fr;
    grid-gap: 20px;
    grid-column: auto;
    align-content: center;
    justify-content: start;
    align-items: center;
    justify-items: center;
    margin-bottom: 1rem;
}

main .main section.dashboard{
    
}




main .main section table.list{
    width: 100%;
    border-spacing: 0px;
    border-collapse: separate;
    background-color: transparent;

    border-radius: 10px;
}

main .main section table.list button{
    background-color: #e60000;
    border: 1px solid #e60000;
    color: #fff;
    border-radius: 10px;
    font-size: 0.8rem;
    padding: 0.5rem 1rem;
    cursor: pointer;
}

main .main section table.list tbody tr{
    cursor: pointer;
}

main .main section table.list td, main .main section table.list th{
    background-color: #fff;
    padding: 1rem;
    font-size: 1rem;
    text-align: left;
}
main .main section table.list thead{
    background-color: transparent;
}
main .main section table.list thead tr{
    background-color: transparent;
}
main .main section table.list thead tr th{
    background-color: #fcfcfc;
    border-bottom: 1px solid #efeff2;
}
main .main section table.list thead tr th:first-child{
    border-radius: 10px 0 0 0;
}
main .main section table.list thead tr th:last-child{
    border-radius: 0 10px 0 0;
}
main .main section table.list tbody{
    
}
main .main section table.list tbody tr{
    
}
main .main section table.list tbody tr.statusFinished{
    color: #388f0e;
}
main .main section table.list tbody tr.statusFinished td{
    background-color: #effae8;
}
main .main section table.list tbody tr td{
    background-color: #fff;
    border-bottom: 1px solid #efeff2;
    padding: 1rem;
}
main .main section table.list tbody tr td.late{
    background-color: #FFD000;
}
main .main section table.list tbody tr td.late.days_0{
    background-color: #FF6500;
    color: #fff;
}
main .main section table.list tbody tr td.late.days_1{
    background-color: #FF8000;
    color: #fff;
}
main .main section table.list tbody tr td.late.days_2{
    background-color: #FF9A00;
}
main .main section table.list tbody tr td.late.days_3{
    background-color: #FFB500;
}


main .main section table.list tbody tr td.overdue{
    background-color: #feea04;
    color: red;
}
main .main section table.list tfoot{
    
}
main .main section table.list tfoot tr{
    
}
main .main section table.list tfoot tr th{
    background-color: #fcfcfc;
}
main .main section table.list tfoot tr th:first-child{
    border-radius: 0 0 0 10px;
}
main .main section table.list tfoot tr th:last-child{
    border-radius: 0 0 10px 0;
}

main .main section ul.breadcrumbs{
    list-style: none;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    padding: 0.3rem 0.3rem;
    font-size: 0.7rem;
}
main .main section ul.breadcrumbs > li{
    display: inline;
    font-size: 0.9rem;
    padding-left: 1rem;
}
main .main section ul.breadcrumbs > li::before{
    content : '> ';
    position: relative;
    left: -0.4rem;
}
main .main section ul.breadcrumbs > li:first-child{
    color : #e60000;
}
main .main section ul.breadcrumbs > li:first-child::before{
    content : '';
}

main .main section .options button{
    background-color: #fff;
    border: 1px solid #e60000;
    color: #e60000;
    border-radius: 10px;
    font-size: 0.8rem;
    padding: 1rem;
    cursor: pointer;
}

main .main section .options button.active{
    background-color: #e60000;
    color: #fff;
    cursor: default;
}

main .main section .menu{
    text-align: right;
}

main .main section .menu button{
    background-color: #e60000;
    border: 1px solid #e60000;
    color: #fff;
    border-radius: 10px;
    font-size: 0.8rem;
    padding: 1rem;
    cursor: pointer;
}

main .main section form button{
    background-color: #e60000;
    border: 1px solid #e60000;
    color: #fff;
    border-radius: 10px;
    font-size: 0.8rem;
    padding: 1rem;
    cursor: pointer;
}


main .main section .nav.topNav{

}


main .main section{
    display: none;
}
main .main section.active{
    display: block;
}

main .main section > div{
    display: none;
}
main .main section > div.active{
    display: block;
}



.boxContainer{
    background-color: #fff;
    padding: 1rem;
    margin: 2rem 0;
    position: relative;
}



.boxShadow{
    border-radius: 10px;
    -webkit-box-shadow: 0px 5px 10px 3px rgb(0 0 0 / 14%);
    box-shadow: 0px 5px 10px 3px rgb(0 0 0 / 14%);
}


main .main section form{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}


main .main section form fieldset{
    border: 0;
    margin: 0.2rem;
}


main .main section form fieldset input
, main .main section form fieldset select
, main .main section form fieldset textarea
{
    width: 100%;
    font-size: 1rem;
    padding: 0.5rem;
    margin: 0;
}
main .main section form fieldset textarea{
    height: 14rem;
    resize: none;
}

main .main section form fieldset select option{
    line-height:1.5rem;
    font-size: 1rem;
}



.row{
    display: grid;
    grid-template-columns: repeat(6, 1fr);
}

.col{
    grid-column: 1fr;
}

.col-2{
    grid-column: span 2;
}
.col-3{
    grid-column: span 3;
}
.col-4{
    grid-column: span 4;
}
.col-5{
    grid-column: span 5;
}
.col-6{
    grid-column: span 6;
}



.panelFollowup_list ul.list{
    list-style: none;
    margin: 0;
    padding: 0;
}



.panelFollowup_list ul.list li{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}



span.tag_status_2{
    background-color: #37a503;
    color: #fff;
    padding: 0.3rem 0.5rem;
    border-radius: 6px;
    white-space: nowrap;
}
span.tag_status_1{
    background-color: #ffea08;
    color: #4c4c4c;
    padding: 0.3rem 0.5rem;
    border-radius: 6px;
    white-space: nowrap;
}


span.label_finished_early{
    color: #36a501;
    font-size: 0.8rem;
}

span.label_finished_overdue{
    color: #f95200;
    font-size: 0.8rem;
}











/* LOADER _ BEGIN */
div.loader.active {
    display: flex;
}

div.loader {
    position: absolute;
    border-radius: 10px;
    left: 1px;
    right: 1px;
    top: 1px;
    bottom: 1px;
    z-index: 100000;
    background-color: rgb(0 0 0 / 14%);
    align-items: center;
    display: none;
    justify-content: center;
}
div.loader .lds-dual-ring {
    display: inline-block;
    width: 80px;
    height: 80px;
}
div.loader .lds-dual-ring:after {
    content: " ";
    display: block;
    width: 64px;
    height: 64px;
    margin: 8px;
    border-radius: 50%;
    border: 6px solid #fff;
    border-color: #fff transparent #fff transparent;
    animation: loader-lds-dual-ring 1.2s linear infinite;
}
@keyframes loader-lds-dual-ring {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
/*LOADER _ END*/



/* ALERT MESSAGE - BEGIN */
.alertMessage{
    position: absolute;
    z-index: 1000;
    background-color: #00000085;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    display: none;
    justify-content: center;
    align-items: center;
}

.alertMessage.active{
    display: flex;
}
.alertMessage .message{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: 4rem;
}
.alertMessage .buttons{
    position: absolute;
    left: 1rem;
    right: 1rem;
    bottom: 1rem;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
}

.alertMessage .buttons button{
    background-color: #e60000;
    border: 1px solid #e60000;
    color: #fff;
    border-radius: 10px;
    font-size: 0.8rem;
    padding: 1rem;
    cursor: pointer;
    margin-left: 1rem;
}

/*END*/




.fileAttachment-list{
    display: flex;
    flex-direction: column;
    
}

.fileAttachment-list > *{
    /*flex-basis: 100%;*/
    margin: 0; /*0.5rem 1rem;*/
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
}

.fileAttachment-list > * > *{
    flex-basis: 100%;
    margin: 0.5rem 1rem;
    overflow: hidden;
}

.fileAttachment-list > * > .fileName{
    flex-basis: 68%;
}

.fileAttachment-list > * > .fileSize{
    flex-basis: 10%;
}

.fileAttachment-list > * > .fileType{
    flex-basis: 20%;
}

.fileAttachment-list > * > button.delete{
    flex-basis: 10%;
    padding: 0.5rem 1rem;
}


.fileAttachment-list > * + *{
    border-top: 1px solid #c0c0c0;
}

.fileAttachment-list .downloadItem{
    /*cursor: pointer;*/
}
.fileAttachment-list .downloadItem::after {
    /*
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24' width='24'%3E%3Cpath d='M12 15.825 6.725 10.55 8.3 8.925 10.85 11.475V3.45H13.15V11.475L15.7 8.925L17.275 10.55ZM5.875 20.375Q4.925 20.375 4.263 19.712Q3.6 19.05 3.6 18.1V14.75H5.875V18.1Q5.875 18.1 5.875 18.1Q5.875 18.1 5.875 18.1H18.1Q18.1 18.1 18.1 18.1Q18.1 18.1 18.1 18.1V14.75H20.375V18.1Q20.375 19.05 19.712 19.712Q19.05 20.375 18.1 20.375Z'/%3E%3C/svg%3E");
    margin: 0.5rem 1rem;
    */
}

.fileAttachment-list .downloadItem:hover {
    background-color: #fff4eb;
}

.fileAttachment-list .downloadItem .button{
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    height: 30px;
    width: 30px;
    border: 0;
    padding: 0;
    margin: 0 10px 0 0;
    flex-basis: auto;
    cursor: pointer;
}

.fileAttachment-list .downloadItem .button.download{
    background-image: url(icons/download_FILL0_wght400_GRAD0_opsz48.svg);
}

.fileAttachment-list .downloadItem .button.play{
    background-image: url(icons/play_circle_FILL1_wght400_GRAD0_opsz48.svg);
}





.fileAttachment-list:not(:empty){
    border: 1px solid #c0c0c0;
    border-radius: 8px;
    margin: 10px 10px 0 0;
}

.fileAttachment-list:not(:empty)::before {
    content: 'Arquivos';
    position: relative;
    background-color: #e60000;
    color: #fff;
    padding: 5px 14px;
    border-radius: 6px 6px 0 0;
}



.viewWindow {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: #72727278;
    z-index: 100;
    display: none;
}

.viewWindow.active {
    display: flex;
}



.viewWindow .panel .contentBox {
    display: none;
}
.viewWindow .panel .contentBox.active {
    display: block;
}


.viewWindow .panel {
    background-color: #fff;
    padding: 1rem;
    border-radius: 1rem;
    border: 1px solid #f1634e;
    margin: auto;
    width: 90%;
    height: 80%;
}



.viewWindow .panel .image {
    background-image: url('');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    width: 100%;
    height: 100%;
}



.viewWindow .panel button.close {
    margin: 2rem 0 0 -1rem;
    background-color: #e60000;
    border: 1px solid #e60000;
    color: #fff;
    border-radius: 10px;
    font-size: 0.8rem;
    padding: 1rem;
    cursor: pointer;
}







/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
    
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
    
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
    
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
    
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
    
}