body{    
    font-family: 'Overpass Mono', monospace;
    background-color: #f5f5f5;    
    font-size: 12px;
    color: #333333;
}

label{
    
    margin-top: 10px;
    margin-bottom: 0px;
    
}

.header{
    background-color: #fff;   
}

.modal-xl {
    width: 90%;
    max-width:1300px;
}


#logged{
    float: right;
    text-align: right; 
    padding-top: 15px;
    font-size: 10px;
}

#logged span, #logged a{
    font-size: 14px;
}


.header img{
    max-height: 60px; 
    margin: 10px 0;
}

.footer{    
    position: fixed;
    bottom: 0;
    width: 100%;    
}

#up{
    
    display: inline-block;
    float: right;
    cursor: pointer;
    
}

.menu{
    background-color: #036499;
    height: 40px;
    width: 100%;
    color: #FFF;
    padding: 13px;
}

.menu a{    
    color: #FFF;
    display: inline-block;
    margin: 0 5px;    
}

.menu-accounting{    
    background-color: #006600;    
}

.menu-membership{    
    background-color: #cc0000;    
}


/*------------------------------------------------------------------*/

#login{
    width: 500px;
    margin: 10% auto;
    border: 1px solid #ced4da;
    padding: 40px;
    background-color: #FFF;
    border-radius: 10px;
}

#login h1{
    text-align: center;
    font-size: 20px;
    text-transform: uppercase;
}

#login input{    
    margin-bottom: 10px;    
}

/*---------------------------------------------------------------*/

#panel{
    
    margin: 10px;
    border: 1px solid #ced4da;
    padding: 40px;
    background-color: #FFF;
    border-radius: 10px;
    
}


.panel-button-container{
    text-align: center;
    
}

.panel-button{
    color: #FFF;
    font-size: 80px;
    width:90%;
    padding: 25% 0;
    margin: auto;
    text-align: center; 
    border-radius: 10px;
    cursor: pointer;
}

.bg-membership{
    background-color: #cc0000;
}

.bg-accounting{
    background-color: #006600;
}

.bg-setting{
    background-color: #036499;
}


/*----------------------------------------------*/

.grid-box{
    
    margin: 10px 0;
    border: 1px solid #ced4da;
    padding: 40px;
    background-color: #FFF;
    border-radius: 10px;
    width: 100%;
}

.grid-box h4{    
    width: 100%;
    margin: 0;
    text-align: center;
}

.container-fluid-margined{width: 96%;}


.chosen-single span{
    
    text-align: left;
    
}

.row_red td{
    
    background-color: #ffcccc !important;
    
}

.jsgrid table{
    
    font-size: 12px;
    
}

.jsgrid table button{
    
    font-size: 12px;
    margin: 2px;
    
}

.jsgrid-table .ended{
    color: red;
}

/*-------------------------------------------------*/

.custom-combobox-input{    
    background: none;
    background-color: #FFF;
    border-color: #a9a9a9 !important;
    width: 80% !important;
}

.custom-combobox-toggle{    
    background: none;
    background-color: #FFF;
    border-color: #a9a9a9 !important;
    border-radius: 0;
    height: 31px;
    top: -3px;    
}

.add-button{    
    color: #009966 !important;
    font-size: 25px;
    display: inline-block;
    width: 45%;
    margin: 2%;
}

.add-button span{
    font-size: 10px;
}

.chosen-container{
    
    width: 100% !important;
    height: calc(2.25rem + 2px);
    font-size: 1rem;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    
    
}

.chosen-single{
    
    background-color: #FFF !important;
    background-image: none !important;
    
}

/*--------------------------------------*/

.print{    
    text-align: center; 
    cursor: pointer;
}

.print i{
    display: block;
    font-size: 50px;
    margin: 20px;
}

.print:hover > i{
    display: block;
    font-size: 60px;
    margin: 15px;
}

/*-------------------FORM-----------------------*/

.chose-form-box .chosen-single{
    height: 100%;
    padding-top: 8px;
}


.toggle{    
    display: none;    
}