/* modals */

/* LOADER */
#loader {
    display:none;
    width:330px;height:160px;padding:35px;
    position:fixed;top:30%;left:50%;margin-left:-165px;
    background: url(../images/bg-loader-red.png);
    color:#fff;text-align:center;
    font-size:14px;
    font-family: "Roboto", sans-serif;font-weight:400;
    -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;
    line-height: 1.8;
    border-left: solid #b04542 2px
}
#loader strong {font-weight:600;}

#modalAlert {display:block;position:fixed;top:25%;left:50%;width:400px;height:195px;margin-left:-200px;padding:28px !important;line-height:1.2;z-index:999999;background:#fff;border: solid #dedede 1px;
    -webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;}
#modalAlert .modal-header {padding:0 0 10px 0;line-height:1.0;border-bottom: solid #dedede 1px}
#modalAlert .modal-header H3 {font-family:"Roboto",sans-serif;font-weight:600;font-size:21px;color:#c01d1d;margin:0 !important}
#modalAlert #modalAlertBody {font-size:14px;font-family: "Open Sans";font-weight:600;line-height:1.3;color:#000;height:70px;padding:15px 0 0 0}
#modalAlert .modal-header .close {margin:5px 0 0 0;background: url(../images/alert-x.png) no-repeat 0 0; border:none;width:11px; height:11px;display:block;float:right;opacity:1;filter: alpha(opacity=100);}

#modalInfo {display:block;position:fixed;top:25%;left:50%;width:400px;height:195px;margin-left:-200px;padding:28px !important;line-height:1.2;z-index:999999;background:#fff;border: solid #dedede 1px;
    -webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;}
#modalInfo .modal-header {padding:0 0 10px 0;line-height:1.0;border-bottom: solid #dedede 1px}
#modalInfo .modal-header H3 {font-family:"Roboto",sans-serif;font-weight:600;font-size:21px;color:#04b500;margin:0 !important}
#modalInfo #modalInfoBody {font-size:14px;font-family: "Open Sans";font-weight:600;line-height:1.3;color:#000;height:70px;padding:15px 0 0 0}
#modalInfo .modal-header .close {margin:5px 0 0 0;background: url(../images/alert-x.png) no-repeat 0 0; border:none;width:11px; height:11px;display:block;float:right;opacity:1;filter: alpha(opacity=100);}

#modalConfirm {display:block;position:fixed;top:25%;left:50%;width:400px;height:195px;margin-left:-200px;padding:28px !important;line-height:1.2;z-index:999999;background:#fff;border: solid #dedede 1px;
    -webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;}
#modalConfirm .modal-header {padding:0 0 10px 0;line-height:1.0;border-bottom: solid #dedede 1px}
#modalConfirm .modal-header H3 {font-family:"Roboto",sans-serif;font-weight:600;font-size:21px;color:#579000;margin:0 !important}
#modalConfirm #modalConfirmBody {font-size:14px;font-family: "Open Sans";font-weight:600;line-height:1.3;color:#000;display:block;height:70px;padding:15px 0 0 0}
#modalConfirm .modal-header .close {margin:5px 0 0 0;background: url(../images/alert-x.png) no-repeat 0 0; border:none;width:11px;height:11px;display:block;float:right;opacity:1;filter: alpha(opacity=100);}

.modal.modalForm {display:table;position:absolute;top:20%;left:50%;width:450px !important;height:auto !important;margin-left:-225px !important;
    margin-bottom:50px;padding:20px 25px;line-height:1.2;z-index:999999;background:#fff;border:none;
    -webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;}
.modal.modalForm .modal-header {padding:0 0 10px 0;line-height:1.0;border-bottom: solid #dedede 1px}
.modal.modalForm .modal-header H3 {font-family:"Roboto",sans-serif;font-weight:500;font-size:17px;color:#333;margin:0 !important}
.modal.modalForm .modal-body {font-size:14px;font-family: "Open Sans";font-weight:500;line-height:1.3;color:#000;height:auto;padding:15px 0 0 0}
.modal.modalForm .modal-header .close {margin:4px 0 0 0;background: url(../images/alert-x.png) no-repeat 0 0; border:none;width:11px; height:11px;display:block;float:right;opacity:1;filter: alpha(opacity=100);}

.modal.modalForm.modal {overflow-y:auto !important;}

.modal.modalForm.wide {width:650px !important;margin-left:-325px !important;}

#backdrop {width:100%;height:100%;position:fixed;top:0;right:0;bottom:0;left:0;z-index:999998;background:#000;opacity:0.7;filter:alpha(opacity=70);
    -webkit-background-size: cover;-moz-background-size: cover; -o-background-size: cover; background-size: cover;}
#backdropLoading {position:absolute;top:0;right:0;bottom:0;left:0;margin:auto}

.btnModalCancel {width:166px;height:34px;display:block;border:none !important;background:url(../images/btn-modal-cancel.png) no-repeat 0 0}
.btnModalOk {width:166px;height:34px;display:block;border:none !important;background:url(../images/btn-modal-ok.png) no-repeat 0 0}
.btnModalClose {width:166px;height:34px;display:block;border:none !important;background:url(../images/btn-modal-close.png) no-repeat 0 0}

@media screen and (max-width: 768px) {
    .modal.modalForm.wide {width:450px !important; margin-left: -225px !important }
}

@media screen and (max-width: 480px) {
    .modal.modalForm, .modal.modalForm.wide {width:380px !important;margin-left:-190px !important}
}

@media screen and (max-width: 420px) {
    #loader {width:290px;margin-left:-145px;height:140px;padding:25px}
    #modalAlert {width:320px;margin-left:-160px}
    #modalAlert #modalAlertBody {height:75px}
    #modalConfirm {width:320px;margin-left:-160px}
    #modalConfirm #modalConfirmBody {height:75px}
    #modalInfo {width:320px;margin-left:-160px}
    #modalInfo #modalInfoBody {height:75px}
    .modal.modalForm, .modal.modalForm.wide {width:320px !important;margin-left:-160px !important}

    .btnModalCancel.btnModalConfirm {width:120px;background:url(../images/btn-modal-cancel-small.png) no-repeat 0 0}
    .btnModalOk.btnModalConfirm {width:120px;background:url(../images/btn-modal-ok-small.png) no-repeat 0 0}
}