@import url("margin_colors.css");

HTML {
    margin: 0;
    overflow: -moz-scrollbars-vertical;
    overflow-y: scroll;
    font-family: sans-serif;
}

BODY {
    margin: 0;
    padding: 0;
    height: 100%;
    font-size: 12px;
    line-height: 20px;
    font-family: Arial;
    text-align: center;
    background: #b4985a url(/img/bg_lrg_v2.jpg) no-repeat center top;
    background-size: cover;
    background-attachment: fixed;
}

.cent_ct {
    font-family: Roboto !important;
    font-weight: 300;
}


.save_ok {
    color: #009900;
    font-weight: bold;
    font-size: 12px;
    margin-top: 10px;
}

.save_ok img {
    float: left;
    margin-right: 5px;
    width: 16px;
    height: 16px;

}


.save_err {
    color: #990000;
    font-weight: bold;
    font-size: 12px;
    margin-top: 10px;
}

.save_err img {
    float: left;
    margin-right: 5px;
    width: 16px;
    height: 16px;

}

.save_err > div {
    font-weight: normal;
    color: #ff0000;
}


.nav_trail {
    height: 30px;
    line-height: 30px;
    font-size: 14px;

}

.nav_trail > div {
    float: left;
    padding-right: 20px;
    padding-left: 15px;
    background: transparent url(/img/bg_pointer.png) no-repeat 0 10px;
    cursor: pointer;
    color: #aaa;
}

.nav_trail > div:last-child {
    color: #919291;
    font-weight: bold;
    cursor: default;
}


.cent_ct {
    width: 1200px;
    margin: 0px auto;
    text-align: left;
}


th {
    text-align: left;
}


.def_ct {
    width: 1200px;
    margin: 0px auto;
    padding: 2px;
    background-color: #d2c8ac;
    border-radius: 25px
}

.def_ct > div {
    text-align: left;
    background-color: #fff;
    border-radius: 24px;
    padding: 35px;
    border: 1px solid #929192;
}

.def_ct h1 {
    margin: 0;
    padding: 0;
    color: #919291;
    font-weight: normal;
    font-size: 32px;
}

.def_ct h2 {
    margin: 0;
    padding: 0 0 20px 0;
    color: #b4985a;
    font-weight: normal;
    font-size: 32px;
}


.def_box {
    border: 2px solid #ccc;
    border-radius: 20px;
    padding: 20px;
    margin-top: 10px;
}

.fnt2 {
    font-size: 15px;
    line-height: 21px;
}


.spc {
    height: 40px;
}


.act_ico {
    width: 24px;
    height: 24px;
    float: right;
    margin-left: 5px;
    cursor: pointer;
}


.wk_periode {
    height: 30px;
    line-height: 30px;
}

.wk_periode div {
    float: left;
    margin-right: 20px;
}

.arr-rt:hover {
    border-left: 20px solid #000;
}

.arr-rt {
    cursor: pointer;
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;

    border-left: 20px solid #919291;
    margin-top: 5px;
}

.arr-lt:hover {
    border-right: 20px solid #000;
}

.arr-lt {
    cursor: pointer;
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;

    border-right: 20px solid #919291;
    margin-top: 5px;
}


.cdesc {
    background-color: #fff;
    border-radius: 0 0 50px 0;
    border: none;
    float: left;
    width: 175px;
    border-top: 1px solid #fff;
    border-left: 1px solid #fff;
    margin-right: 5px;
    margin-top: 0;
    padding: 0;
    font-size: 12px;
}

.c1, .c2, .c3, .c4, .c5, .c6, .c7, .c8, .c9, .c10, .c11, .c12, .c13, .c14, .c15, .c16, .c17, .c18, .c19, .c20 {
    width: 200px;
    padding: 0;
    margin: 0;
    border: 0;
}


.def_tbl {

    width: 100%;
    padding: 0;
}

.def_tbl th {
    padding: 2px 5px 1px 5px;
    text-align: left;

}

.def_tbl td {
    padding: 2px 5px 1px 5px;
    border-top: 1px solid #eee;
    text-align: left;

}


.tdsel {
    cursor: pointer;
    background-color: #fff;
}

.tdsel:hover {
    background-color: #d7ceaf;
}


.curr {
    text-align: right;
    width: 50px;

}

.curr > span {
    float: left;
}


.mnu_table tr {
    cursor: pointer;
}

.mnu_table td, .mnu_table th {
    padding: 0 5px 0 5px;
    margin: 0;
}


.mnu_table tr:hover td, .mnu_table tr:hover div.cdesc {
    background-color: #d7ceaf;
}

.mnu_table td div {
    padding: 0;
}


.mnu_table input {
    font-size: 12px;
    padding: 0 3px 0;
    margin: 0;
    height: 19px;
    line-height: 19px;
    text-align: right;
    box-sizing: border-box;
}


#menu_table tr {
    cursor: pointer;
}

#menu_table td, #menu_table th {
    padding: 0 5px 0 5px;
    margin: 0;
    text-align: left;
    white-space: nowrap;
}


#menu_table tr:hover td, #menu_table tr:hover div.cdesc {
    background-color: #d7ceaf;
}

#menu_table td div {
    padding: 0;
}


#menu_table input {
    font-size: 12px;
    padding: 0 3px 0;
    margin: 0;
    height: 19px;
    line-height: 19px;
    text-align: right;
    box-sizing: border-box;
}


#menu_table2 tr {
    cursor: pointer;
}

#menu_table2 td, #menu_table2 th {
    padding: 0 5px 0 5px;
}


#menu_table2 tr:hover td, #menu_table2 tr:hover div.cdesc {
    background-color: #d7ceaf;
}

#menu_table2 td div {
    padding: 0;
}


.menu_icons {
    width: 100%;

}


.menu_icons .btn {
    float: left;
    width: 200px;
    border-radius: 10px;
    border: 1px solid #ddd;
    text-align: center;
    font-weight: bold;
    font-size: 16px;
    margin-right: 30px;
    padding: 25px;
    background-color: #fff;
    cursor: pointer;
    margin-top: 30px;
}

.menu_icons .btn:hover {
    background-color: #e7ca36;
    border: 1px solid #919291;
}

.menu_icons > div > img {
    width: 48px;
    height: 48px;
    border: none;
    margin-bottom: 10px;
}


label {
    display: block;

}


input {

    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 3px 5px 3px 5px;

}


.def_frm select {
    border: 1px solid #ddd;
    /* border-radius: 10px; */
    border-radius: 0 10px 10px 0;
    padding: 6px 10px 6px 10px;
    font-size: 15px;
    height: 43px;
    line-height: 29px;
}


.vmodule_srch input {
    border: 1px solid #ddd;
    width: 1024px;
    border-radius: 0;
    padding: 2px 6px 2px 6px;
    font-size: 12px;
    height: 21px;
    line-height: 21px;
}

.vmodule_srch label {
    background-color: #ece4cd;;
    border: 1px solid #ddd;
    /* border-radius: 10px; */
    border-radius: 10px 0 0 10px;
    padding: 2px 6px 2px 6px;
    font-size: 12px;
    float: left;
    width: 119px;
    height: 21px;
    line-height: 21px;
    text-align: center;

}


.ctnt {
    width: 1200px;
    text-align: left;
    margin: 0px auto;
}


#tst {
    width: 1200px;
    text-align: left;
    margin: 0px auto;
}


.tst {
    border: 1px solid #ccc;
}


.testvm {
    width: 300px;

}


.testcase {
    border: 1px solid #ff0000;
    background-color: #ff88dd;
    color: #fff;
}


.custom-combobox {
    position: relative;
    display: inline-block;
}

.custom-combobox-toggle {
    position: absolute;
    top: 0;
    bottom: 0;
    margin-left: -1px;
    padding: 0;
}

.custom-combobox-input {
    margin: 0;
    padding: 5px 10px;
}


.gerechten {

}

.gerechten div {
    border-top: 1px solid #ccc;
    background-color: #fff;
}

.gerechten div:hover {
    background-color: #eee;
}


.btn_tbl1 {
    line-height: 23px;
    font-size: 12px;
    font-weight: bold;
    border: 1px solid #ccc;
    color: #000;
    padding: 3px 10px 4px 10px;
    cursor: pointer;
    border-radius: 10px;
    background-color: #fff;
    text-align: left;
}

.btn_tbl1 img {
    float: left;
    margin-right: 10px;
    margin-top: 3px;
    width: 16px;
    height: 16px;
}

.btn_tbl1:hover {
    background-color: #e7ca36;

}


.btn_t1 {
    line-height: 25px;
    font-size: 14px;
    font-weight: bold;
    border: 2px solid #ccc;
    color: #000;
    padding: 7px 20px 8px 20px;
    cursor: pointer;
    border-radius: 10px;
    background-color: #fff;
}


.btn_t1 img {
    float: left;
    margin-right: 10px;
}

.btn_t1:hover {
    background-color: #e7ca36;

}


.btn_del_t1 {
    width: 16px;
    height: 16px;
    background: #fff url(/img/ico_del_sml.png) no-repeat center center;
    cursor: pointer;

}


#menu_overview {

    width: 100%;
    padding: 0;
}

#menu_overview th {
    padding: 5px;


}

#menu_overview td {

    padding: 5px;

    border: 1px solid #eee;


}

#menu_overview tr > td:first {
    text-align: left;

}


.dagmenu {

    border: 2px solid #ccc;
    border-radius: 20px;
    padding: 20px;

}

.dagmenu > table {


    padding: 0;


}

.dagmenu > table th {

    font-weight: normal;
    padding: 0;
    border-bottom: 1px solid #aaa;

}


.dagmenu > table td {

    padding: 0 0 5px 0;

    border-bottom: 1px solid #eee;

}


.dagmenu > table td input {
    width: 75px;
    border: none;
}


.dagmenu > table td div {
    position: relative;
}


.dagmenu > table tr td:first-child > div {

    /*width: 500px;*/

    line-height: 25px;
    height: 25px;
    background: #fff url(/img/selectbox.png) no-repeat center right 10px;
    margin-right: 10px;

}


.numrcp {
    margin-left: 6px;
    margin-top: 15px;
    padding-bottom: 15px;
    color: #339933;
    font-size: 12px;
    font-weight: bold;
}


#recipe_menu {

    border: 2px solid #d2c8ac;
    /*border: 2px dashed #ccc; */
    padding: 20px;
    border-radius: 15px;
    display: none;
    width: 1024px;
    position: absolute;
    background-color: #fff;
    text-align: left;
}

#recipe_menu > span:first-child {
    dispay: block;
    border: 2px solid #ccc;
    background-color: #b4985a;
    font-size: 11px;
    font-weight: bold;
    color: #fff;
    cursor: pointer;
    padding: 5px;
    width: 100px;
    border-radius: 10px;
    position: absolute;
    right: 1px;
    top: 1px;

}


.rprd {
    text-align: left;

}

.wksl td {
    background-color: #fff;
    cursor: pointer;
}

.wksl td:hover {
    background-color: #d2c8ad;

}


#location {
    float: right;
}

#cur_location {
    width: 300px;
    background-color: #fff;
    padding: 2px;
    height: 30px;
    line-height: 30px;
    font-weight: bold;
    font-size: 1.2em;
    border: 1px solid #ccc;
}

#chc_location {
    display: none;
    width: 300px;
    height: 300px;
    padding: 2px;
    overflow-y: scroll;
    border: 1px solid #ccc;
    cursor: pointer;
}

#chc_location > div {
    background-color: #fff;
    border-bottom: 1px solid #b4985a;
    cursor: pointer;
    text-align: left;
}

#chc_location > div:hover {
    background-color: #d2c8ad;
}


#dagen {
    box-sizing: border-box;
}


.day {
    box-sizing: border-box;
}


.ddd {
    float: left;
    width: 97px;
    margin-right: 24px;
    border: 1px solid #ccc;
    border-radius: 10px;
    padding: 20px;
    cursor: pointer;
}


.day {
    position: relative;
    float: left;
    width: 12.5%;
    margin-right: 2%;
    border: 2px solid #eee;
    border-radius: 0 10px 0 10px;
    cursor: pointer;
    padding: 2px;
}


.day2 {
    position: relative;
    float: left;
    width: 12.5%;
    margin-right: 2%;
    box-sizing: border-box;
}


.day2 > div {
    border: 2px solid #eee;
    border-radius: 0 10px 0 10px;
    cursor: pointer;
    padding: 2px;
}


.day2 > div:hover {

    border: 2px solid #666;
}


.day2 > div:hover .daynm {
    background-color: #666;
}

.day2 > div:hover .datenm {
    color: #000;
}


.day2 .dsel {
    border: 2px solid #999;
}


.daybusy {
    height: 16px;
    line-height: 16px;
}


.daybusy img {
    position: absolute;
    left: -3px;
    bottom: -5px;
}

.daybusy div {
    float: left;
    border-radius: 0 0 0 10px;
    box-sizing: border-box;
    padding-left: 8px;
}

#dagen .dlst {
    margin-right: 0;
}


.dagen {
    box-sizing: border-box;
}

.dagen .dlst {
    margin-right: 0;
}


.dsel {
    border: 2px solid #999;

}


.daynm {
    box-sizing: border-box;
    background-color: #919291;
    color: #fff;
    font-weight: bold;
    padding: 3px 0 3px 6px;
    font-size: 14px;
    border-radius: 0 8px 0 0;

}


#bijdrage_res {
    font-weight: bold;
    font-size: 30px;
    padding-top: 20px;
}


/*
** Keuzemenu verkoopmodule
*/

.vmodule_srch {
    margin-top: -4px;
}


.sel_close {
    position: relative;
    z-index: 100;
    width: 125px;
    text-align: center;
    border-radius: 15px 15px 0 0;
    font-weight: bold;
    font-size: 14px;
    /*
    border: 2px dashed #ccc;
    background-color: #eee;
    color: #919291;
    */
    border: 2px solid #ccc;
    background-color: #b4985a;
    color: #fff;

    margin-top: -52px;
    padding: 4px 12px 4px 12px;
    float: right;
    cursor: pointer;
}


#vmodule {
    padding-top: 5px;
    height: -webkit-calc(100% - 50px);
    height: -moz-calc(100% - 50px);
    height: calc(100% - 50px);
    overflow-y: scroll;
}

#vmodule_chc {
    margin-top: 8px;
}

#vmodule_chc .vmodule_dsc {
    background-color: #ece4cd;
    border: 1px solid #ddd;
    height: 26px;
    line-height: 26px;
    margin: 1px 1px 0 1px;
    padding-left: 5px;
    font-size: 14px;
    font-weight: bold;
    cursor: pointer;
}

#vmodule_chc .vmodule_dsc > span {
    display: block;
    border: 1px solid #ccc;
    border-radius: 10px;
    font-size: 11px;
    font-weight: normal;
    background-color: #fff;
    float: right;
    margin-right: 10px;
    height: 16px;
    line-height: 16px;
    padding: 3px 8px 3px 8px;
    margin-top: 1px;

}

#vmodule_chc .vmodule_dsc > div {
    float: right;
    font-size: 12px;
    color: #919291;
    text-align: right;
    margin-right: 50px;
    font-weight: normal;
}


h3 {
    margin: 0;
    padding: 0 0 10px 0;
    color: #4a4a4a;
    font-weight: normal;
    font-size: 20px;
}

.def_frm input {
    border: 1px solid #ddd;
    /* border-radius: 10px; */
    border-radius: 0 10px 10px 0;
    padding: 6px 10px 6px 10px;
    font-size: 15px;
    height: 29px;
    line-height: 29px;
}

.def_frm label, .dum_frm label {
    background-color: #ece4cd;;
    border: 1px solid #ddd;
    /* border-radius: 10px; */
    border-radius: 10px 0 0 10px;
    padding: 6px 10px 6px 10px;
    font-size: 15px;
    float: left;
    width: 100px;
    height: 29px;
    line-height: 29px;
}


.def_frm label.checklabel {
    background-color: white;
    width: auto;
    float: none;
    border: none;
    display: inline;
    margin: 0 !important;
    padding: 0 !important;
    margin-left: 5px !important;
}

.input-mimic {
    border: 1px solid #ddd;
    border-radius: 0 10px 10px 0;
    padding: 3px 10px 3px 10px;
    margin-left: 122px;
    min-height: 35px;
}

.def_frm input.check-with-label {
    padding: 0;
    height: auto;
    margin: 0;
}

.def_frm .file-upload {
    border: 0;
    padding: 0;
}

#menu_table td, #menu_table th {
    font-size: 12px;
    border-bottom: 1px solid #ccc;
}

#menu_table tr td:last-child {
    width: 205px;
    overflow: hidden;
}


#menu_table2 td, #menu_table2 th {
    font-size: 12px;
    border-bottom: 1px solid #ccc;
}

#menu_table2 tr td:last-child {
    width: 205px;
    overflow: hidden;
}


.switch label input[type="checkbox"] {
    width: 0;
    height: 0;
    position: relative;
    z-index: -9999;
    margin: 0;
    padding: 0;
}

.switch label span {
    margin-left: 3px;
    margin-top: 2px;
    margin-bottom: 2px;
    width: 26px;
    height: 15px;
    display: block;
    background: url("/img/chkbox_unchecked.png");
}

.switch label input:checked + span {
    background: url("/img/chkbox_checked.png");
}


#blur_bg, #recipe_blur_bg {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    margin: 0;
    width: 100%;
    background: #7f7f7f;
    background: rgba(0, 0, 0, 0.5);
    z-index: 10000;
}

#blur_bg {
    z-index: 10001;
}

#blur_bg2 {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    margin: 0;
    width: 100%;
    background: #7f7f7f;
    background: rgba(0, 0, 0, 0.5);
    z-index: 10000;
}

#inf_scr {
    position: fixed;
    width: 1100px;
    margin-left: -550px;
    top: 100px;
    left: 50%;
    bottom: 100px;
    z-index: 10001;
}

#inf_scr.screen-lg {
    width: 1200px;
    margin-left: -600px;
    bottom: 100px !important;
    top: 100px !important;
}

#inf_scr.screen-lg > div > div > div {
    height: 100% !important;
    height: calc(100% - 50px);
}

#inf_scr > div {
    position: relative;
    padding: 2px;
    background-color: #d2c8ac;
    border-radius: 25px;


}

#inf_scr .close-info {
    dispay: block;
    border: 2px solid #ccc;
    background-color: #b4985a;
    font-size: 15px;
    font-weight: bold;
    color: #fff;
    cursor: pointer;
    padding: 5px;
    width: 100px;
    border-radius: 10px;
    margin-top: -18px;
    position: absolute;
    right: 25px;
}

#inf_scr > div > div {
    text-align: left;
    background-color: #fff;
    border-radius: 24px;
    padding: 20px 2px 20px 35px;
    border: 1px solid #929192;
}


#inf_scr > div > div > div {
    overflow-y: auto;
    height: 600px;
    padding-right: 18px;
}

.inf_img {
    float: left;
    margin-right: 5px;
    cursor: pointer;
}


.close_btn {
    position: absolute;
    right: 20px;
    top: -10px;
    float: none;
}

.close_btn span {
    dispay: block;
    border: 2px solid #ccc;
    background-color: #b4985a;
    font-size: 13px;
    font-weight: bold;
    color: #fff;
    cursor: pointer;
    padding: 5px 10px 5px 10px;
    border-radius: 10px;
}


.divrow {
    border-bottom: 1px solid #ccc;
    line-height: 22px;
    height: 22px;
}

.divrow-auto {
    border-bottom: 1px solid #ccc;
    line-height: 22px;
    height: auto;
}


#pwcheck {
    float: right;
    width: 425px;
}

#pwcheck img {
    float: left;
    margin-right: 8px;
    margin-top: 2px;
}


#btn_logoff {
    float: right;
    border-left: 1px solid #fff;
    padding: 0 30px 0 30px;
    cursor: pointer;
    background-color: transparent;
}

#btn_logoff img {
    margin-top: 5px;
}


.btn_tbl2 {
    line-height: 23px;
    font-size: 12px;
    font-weight: bold;
    border: 1px solid #ccc;
    color: #000;
    padding: 2px 6px 3px 6px;
    cursor: pointer;
    border-radius: 5px;
    background-color: #fff;
    text-align: left;
}

.btn_tbl2 img {
    float: left;
    margin-right: 5px;
    margin-top: 2px;
    width: 16px;
    height: 16px;
}

.btn_tbl2:hover {
    background-color: #e7ca36;

}


.portion_effic {
    border-radius: 50%;
    width: 19px;
    height: 17px;
    line-height: 16px;
    background-color: #919291;
    text-align: center;
    color: #fff;
    font-size: 11px;

}


.start_btn > div, .start_btn a.big_btn {
    float: left;
    width: 245px;
    height: 245px;
    padding: 20px;
    box-sizing: border-box;
    background-color: #daccac;
    color: #fff;
    font-size: 32px;
    line-height: 30px;
    position: relative;
    margin-bottom: 20px;
}

.start_btn .big_btn {
    cursor: pointer;
}

.start_btn > div:nth-child(5n) {
    margin-left: 0;
}

.start_btn_block h2 {
    color: #333333;
    font-size: 24px;
    margin: 0;
    padding: 0;
    margin-bottom: 10px;
    font-weight: 400;
}

.start_btn_wrapper div {
    margin-top: 10px;
    color: #333333 !important;
}

.start_btn_wrapper a:hover {
    text-decoration: underline !important;
}

.start_btn .start_btn_block a {
    font-size: 16px;
    display: block;
    text-decoration: none;
    color: #4a4a4a !important;
}
.start_btn_wrapper ul {
    margin:0;
    padding: 0;
    margin-left: 20px;
    margin-top: 10px !important;
}
.start_btn_wrapper ul li {
    margin-top: 5px;
    line-height: 20px;
}
.start_btn_wrapper ul li a {
    position:relative;
    padding-top: -15px;
}

.start_btn ::marker {
    font-size: 23px;
}

.start_btn ul, .start_btn:hover, .start_btn ul:hover, .start_btn ul li:hover {
    color:#b4985a !important;
}
.start_btn li:hover {
    color:#fff !important;
}

.start_btn .start_btn_block a:hover {
    color: #4a4a4a !important;
}


.start_btn > div > div:hover {
    color: #b4985a;
}

.vert_txt {
    -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    transform: rotate(270deg);
    white-space: nowrap;
    display: block;
    bottom: 0;
    width: 20px;
    height: 20px;
}

/*Image sortable*/
#ImageSortable {
    list-style-type: none;
    padding: 0;
    width: 100%;
}

#ImageSortable li {
    margin: 5px;
    padding: 1px;
    float: left;
    width: 258px;
    height: 258px;
    font-size: 4em;
    text-align: center;
    cursor: move;
}

#ImageSortable li > img {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 100
}

#ImageSortable li > span {
    position: absolute;
    z-index: 10000;
    margin-left: 10px;
    height: 15px;
    width: 15px;
    display: block;
    text-align: right;
    background-color: white;
    padding: 10px;
    margin-top: 10px;
    opacity: 0;
    border-radius: 4px;
}

#ImageSortable li > span a {
    width: 15px;
    height: 15px;
    display: block;
}

#ImageSortable li:hover > span {
    opacity: 1;

}

/*Loader*/

.lds-ellipsis {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 20px;
}

.lds-ellipsis div {
    position: absolute;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background: #b4985a;
    animation-timing-function: cubic-bezier(0, 1, 1, 0);
}

.lds-ellipsis div:nth-child(1) {
    left: 8px;
    animation: lds-ellipsis1 0.6s infinite;
}

.lds-ellipsis div:nth-child(2) {
    left: 8px;
    animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(3) {
    left: 32px;
    animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(4) {
    left: 56px;
    animation: lds-ellipsis3 0.6s infinite;
}

@keyframes lds-ellipsis1 {
    0% {
        transform: scale(0);
    }
    100% {
        transform: scale(1);
    }
}

@keyframes lds-ellipsis3 {
    0% {
        transform: scale(1);
    }
    100% {
        transform: scale(0);
    }
}

@keyframes lds-ellipsis2 {
    0% {
        transform: translate(0, 0);
    }
    100% {
        transform: translate(24px, 0);
    }
}


textarea.clean {
    font-family: sans-serif;
    border: 1px solid #ddd;
    border-radius: 10px;
    padding: 6px 10px 6px 10px;
    font-size: 15px;
    line-height: 20px;
}

textarea {
    font-family: sans-serif;
    border: 1px solid #ddd;
    border-radius: 0 10px 10px 10px;
    padding: 6px 10px 6px 10px;
    font-size: 15px;
    height: 29px;
    line-height: 29px;
    margin-top: 0px;
    resize: none;
}


.news-list {
    list-style: none;
    padding: 0;
    margin: 0;

}

.news-list li {
    margin-bottom: 20px;
    border-bottom: 1px solid #b4985a;;
    font-size: 15px !important;
    padding-bottom: 10px;

}

.news-list h3 {
    font-size: 18px;
    margin: 0;
    padding: 0;
    line-height: 24px;
    margin-bottom: 10px;
}

.news-list span {
    font-size: 13px !important;
}

.news-list a {
    line-height: 19px;
    font-size: 20px !important;
}

.news-list a span {
    font-size: 15px !important;
}

.news-list li a:hover,
.news-list li a:active,
.news-list li a:focus {
    color: inherit !important;
}

.news-list li a i {
    font-size: 15px;
    color: #b4985a;
    font-style: normal;
}

.news-list li a:hover i {
    text-decoration: underline;
}

input[type=text]:read-only {
    background-color: #bfbfbf;
    cursor: not-allowed
}

.hidden {
    display: none;;
}


pre {
    background-color: white;
    display: block;
    text-align: left;
    padding: 10px;
    margin: 10px;
}


/* New recipe add screen */

.attr img {
    width: 16px;
}

#recipe_wrapper {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    overflow-y: auto;
}

#recipe_wrapper #recipe_screen {
    position: fixed;
    margin-left: -622px;
    width: 1200px;
    top: 50px;
    left: 50%;
    bottom: 50px;
    z-index: 10001;
    display: block;
    border: 2px solid #d2c8ac;
    padding: 20px;
    border-radius: 15px;
    background-color: #fff;
    text-align: left;
    min-height: 400px;
}

#recipe_wrapper #recipe_screen .close_recipe {
    position: relative;
    z-index: 100;
    width: 125px;
    text-align: center;
    border-radius: 15px 15px 0 0;
    font-weight: bold;
    font-size: 14px;
    border: 2px solid #ccc;
    background-color: #b4985a;
    color: #fff;
    margin-top: -52px;
    padding: 4px 12px 4px 12px;
    float: right;
    cursor: pointer;
}

#recipe_wrapper .loader {
    position: fixed;
    top: 50%;
    left: 50%;
    width: 100px;
    height: 100px;
    text-align: left;
    margin-left: -50px;
    margin-top: -50px;
    z-index: 9999999;
    border: 2px solid #ccc;
    background-color: #b4985a;
    border-radius: 15px;
    color: white;

}

#recipe_wrapper .loader i {
    margin-left: 25px;
    margin-top: 25px;
    font-size: 50px;
}

#recipe_wrapper .recipe-loader-overlay {
    position: absolute;
    width: 98%;
    height: 98%;
    background-color: rgba(255, 255, 255, .5);
    top: 1%;
    left: 1%;
}

#recipe_wrapper .recipe-loader-overlay .loader {
    width: 50px;
    height: 50px;
    background-color: transparent;
    color: #b4985a;
    border: none;

}

#recipe_wrapper .recipe-loader-overlay .loader i {
    font-size: 50px !important;
    margin-left: 0px;
    margin-top: 0px;
}

#recipe_wrapper #recipe_screen .recipe-content {
    height: 100%;
    overflow-x: auto;
}

#recipe_wrapper #recipe_screen #vmodule_chc {
    height: auto;
}

.d-none {
    display: none;
}

.vmodule_srch select {
    height: 27px;
    width: 414px;
    border-radius: 0px;
    border: 1px solid #ddd;
}

.advanced-search .column {
    width: 33% !important;
    display: inline-block;
}

.advanced-search .column label, .advanced-search .column select, .advanced-search .column input {
    margin: 0;
    width: 212px;
}

.advanced-search .column label {
    width: 40%;
}

.advanced-search .column input[type=text] {
    width: 226px;
    border-radius: 0!important;
}

.input-group select {
    width: 99px !important;
}

.advanced-search .column .input-group .input {
    width: 100px !important;
    border-radius: 0;
}


#toasts {
    min-height: 0;
    position: fixed;
    right: 20px;
    top: 20px;
    width: 400px;
}

.tooltip {
    position: relative;
    display: inline-block;
}

.tooltip .tooltiptext {
    visibility: hidden;
    max-width: 300px;
    min-width: 100px;
    width: auto;
    background-color: black;
    color: #fff;
    border-radius: 6px;
    padding: 10px;
    position: absolute;
    z-index: 1;
    line-height: 16px;
    text-align: left;
}

tr.exists{
    cursor: not-allowed !important;
    color: #9e0000;
    font-style: italic;
}

.sep {
    height: 0px;
    border-collapse: collapse;
    background-color: transparent;
    border: 1px solid #efefef;
    width: 97.5%;
    margin: 10px 10px 10px 3px;

}

.tooltip:hover .tooltiptext {
    visibility: visible;
}

#toasts .toast {
    background: #d6d8d9;
    border-radius: 3px;
    box-shadow: 2px 2px 3px rgba(0, 0, 0, .1);
    color: rgba(0,0,0, .6);
    cursor: default;
    margin-bottom: 20px;
    opacity: 0;
    position: relative;
    padding: 20px;
    transform: translateY(15%);
    transition: opacity .5s ease-in-out, transform .5s ease-in-out;
    width: 100%;
    will-change: opacity, transform;
    z-index: 1100;
}

#toasts .toast.success {
    background: #26d68a;
}

#toasts .toast.warning {
    background: #ffa533;
}

#toasts .toast.info {
    background: #2cbcff;
}

#toasts .toast.error {
    background: #f44336;
}

#toasts .toast.show {
    opacity: 1;
    transform: translateY(0);
    transition: opacity .5s ease-in-out, transform .5s ease-in-out;
}

#toasts .toast.hide {
    height: 0;
    margin: 0;
    opacity: 0;
    overflow: hidden;
    padding: 0 30px;
    transition: all .5s ease-in-out;
}

#toasts .toast .close {
    cursor: pointer;
    font-size: 24px;
    height: 16px;
    margin-top: -10px;
    position: absolute;
    right: 14px;
    top: 50%;
    width: 16px;
}

.day {
    box-sizing: border-box;
    position: relative;
    float: left;
    width: 11.5%;
    margin-right: 1%;
    border: 1px solid #eee;
    border-radius: 0 10px 0 10px;
    cursor: pointer;
    padding: 2px;
    font-size: 14px;
    background-color: #fff;
}

.weekbox {
    border-radius: 10px;
    padding: 5px 0 5px 0;
    position: relative;
}

.weekbox:hover > .day {
    background-color: #fffae2;
    border: 1px solid #919291;
}


.daynm {

    font-weight: normal;

}

#dagen .dlst {
    margin-right: 0;
}

.wk {
    position: relative;
    float: left;
    width: 22%;
    margin-right: 1%;
    border: 1px solid #eee;
    border-radius: 0 10px 0 10px;
    padding: 2px 2px 1px 5px;

}

#weken_sel > div {
    margin-top: 2px;
    font-size: 14px;
}


.dlst {
    margin-right: 0;
}

.day > label > input {
    width: 0;
    height: 0;
    position: relative;
    z-index: -9999;
    margin: 0;
    padding: 0;
}

.day > label span {
    margin-left: 3px;
    margin-top: 2px;
    margin-bottom: 2px;
    width: 26px;
    height: 15px;
    display: block;
    background: url("../../img/chkbox_unchecked.png");
}

.day > label input:checked + span {
    background: url("../../img/chkbox_checked.png");
}

.daynm {
    box-sizing: border-box;
    background-color: #919291;
    color: #fff;
    font-weight: bold;
    padding: 3px 0 3px 6px;
    font-size: 14px;
    border-radius: 0 8px 0 8px;

}


.image-select a img {
    margin-right: 5px;
}

.image-select a.selected img {
    border: 2px solid #777777;
}