body { background: #DBFFE6; font-family: Verdata; }

.site_wrapper { width: 100%; max-width: 1000px; margin: 0 auto;}
.content  {}

.login_wrap { width: 100%; max-width: 400px; margin: 0 auto;}
.login_top_part {text-align: center;}
.login_top_part img { display: inline-block;}
.login_top_part h1 { margin: 5px 0; font-size: 2em;}



.main_wrapper { 
    width: 100%; 
    display: grid; 
    grid-template-columns: 1fr 4fr;   
    justify-content: space-between;
    min-height: 80vh;
    
    border-bottom: 1px solid #ccc;
}
.main_left { border-right:  1px solid #ddd;}

.menu_left { font-size: 1.5em; padding-left: 0; margin-top: 30px;}
.menu_left_sub { font-size: 0.8em;}

.menu_left li,
.menu_left_sub li { list-style: none; }
.menu_left li.divider {border-bottom: 1px solid #ccc; padding: 5px;}

.main_right {}


.main_top { min-height: 50px; border-bottom: 1px solid #ccc;}

.add_select2 {min-width: 300px;  height: 50px;}

.main_wrapper .btn { padding: 4px 12px;}

.main_region, .main_home {margin: 20px 0;}
.btn_region_delete {margin-right: 20px;}

.no_homes_msg { font-size: 16px; padding: 5px 0; }
.main_home_info { padding: 10px 0 10px; border-bottom: 1px solid #aaa;  border-top: 1px solid #aaa;}

.main_levels {}
.level_wrap { padding: 30px 0 20px; border-bottom: 1px solid #aaa; }
.level_info { padding: 5px; box-sizing: border-box;  display: flex; align-items: center; }
.level_info span { font-size: 20px; margin-right: 20px; }
.level_info .btn { margin-right: 5px;}
.room_wrap {
    min-width: 300px;
    border: 1px solid #000;
    margin-right: 10px;
    margin-bottom: 10px;    
    display: inline-flex;
    flex-direction: column;    
}
.room_btns_panel {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px;
    border-bottom: 1px solid #000;
    box-sizing: border-box;
}
    .room_options {
        font-size: 20px;
    }
    
    .room_options i {color: #005fed;}
    

    .room_num{} 
    .room_btns{}
    
.places_row{
    display: inline-flex;
    padding: 10px 10px 10px 10px;        
}
.place{
cursor: pointer;
    width: 40px;
    height: 70px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 5px;
    background: #fff;
    border: 3px solid #000;
    position: relative;    
}
.room_wrap .place i {
    font-size: 14px;
    position: absolute;
    top: 5px;
    left: 5px;
}

.place.status_free { background: #acffdb; border-color: #acffdb; }
.place.status_busy { background: #62d53d; border-color: #62d53d; }
.place.status_shield { background: #ffbcbc; border-color: #ffbcbc; }

.place.less_3day { border-color: #ff8f00; }
.place.less_1day { border-color: #ff0000; }
.place.over_day { border-color: #ff0000; }
.place.no_date { border-color: #ff00f0; }



.dropdown-menu {padding: 5px;}
.dropdown-menu li { border-bottom:  1px solid #ddd; padding: 5px; cursor: pointer;}
.dropdown-menu li:last-child {border: 0;}


.home_state_item {}
.home_state_item .value { margin-left: 10px; font-weight: bold;}

.fa.fa-toilet {
    width: 20px;
    height: 20px;
    position: relative;
}

.fa.fa-toilet:before {
    position: absolute;
    display: block;
    content: '';
    width: 20px;
    height: 20px;
    background: url(/assets/images/toilet.png) center center no-repeat;
    background-size: contain;
    margin-top: 2px;
}    


/*
.btn-success, .btn-green {
    color: #fff;
    background-color: #00a651;
    border-color: #008d45;
}
.btn-success:hover, .btn-green:hover {
    color: #fff;
    background-color: #007338;
    border-color: #004f27;
}
*/

.users_table { margin: 20px 0 10px;}
.users_table tr th,
.users_table tr td {
    border: 1px solid #ccc;
    padding: 5px;
}




.ajax_loader {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #555 url(../images/ajax-loader.gif) center center no-repeat;
    opacity: 0.5;
}

.ajax_loader_pic {
}



/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~ fancy ~~~~~~~~~~~~~~~~~~~~~~~~~ */
.fancy_confirm_form { max-width: 500px; box-sizing: border-box; padding: 10px 20px; z-index: 999999; }
.fancy_confirm_form .fancy_msg {width: 100%; font-size: 16px;}
.fancy_confirm_form .fancy_buttons { width: 100%; text-align: right; margin-top: 10px;}
.fancy_confirm_form button  {margin-left: 10px;}
.fancy_confirm_form .fancybox-close-small {display:none; }

.popup_caption { font-size: 20px;}


.users_popup { width: 100%; max-width: 400px; display: none;}
.user_popup_caption {padding-bottom: 10px; font-size: 18px;}
/* .region_field, .home_field { display: none;} */
.btn_user_save { font-size: 20px; padding: 5px 20px; }

.errors_msg {color: red; padding: 10px 0; display: none;}


.lotos_popups { width: 100%; max-width: 400px; display: none; }
.popup_caption {padding-bottom: 10px; font-size: 18px;}

.lotos_popups .input-group-addon {min-width: 40px; padding: 0;}

.lotos_popups .form-check { box-sizing: border-box; padding: 0 10px; font-size: 14px; display: flex; align-items: center; }
.lotos_popups .form-check input {width: 20px; height: 20px; margin: 0 10px 0 0;}

.lotos_popups .form-check .fa.fa-toilet {width: 10px;}
.lotos_popups .form-check .fa.fa-toilet:before { width: 10px; height: 25px;}
.lotos_popups .form-check label {margin: 0;}