/*
    new standard blue (for buttons and headers)    #0061b4
    standard blue for headtypo      #003f8e
*/
a {
    color: #0061b4;
}

.nav-link {
    color: #0061b4;
}


#loginlogo {
    background-image: url(../images/ihk-logo.svg);
    background-size: cover;
    display: block;
    width: 284px;
    height: 52px;
    text-align: center;
    margin: 0 auto 20px auto;
}

#loginmask {
    width: 300px;
    position: relative;
    min-height: 100%;
    margin: 0 auto;
    margin-top: 100px;
}

#divResetPassword {
    width: 300px;
    position: relative;
    min-height: 100%;
    margin: 0 auto;
    margin-top: 100px;
}

#loginwindow {
    background-repeat: no-repeat;
    /*background-color: white;*/
    padding-top: 0px;
    margin-bottom: 20px;
    -moz-border-radius: 10px;
    -khtml-border-radius: 10px;
    -webkit-border-radius: 10px;
    -ms-border-radius: 10px;
    border-radius: 10px;
    /*-webkit-box-shadow: 1px 1px 15px #909089;
    -moz-box-shadow: 1px 1px 15px #909089;*/
    zoom: 1;
    /*box-shadow: 1px 1px 15px #909089;*/
    text-align: center;
}

    #loginwindow div {
        margin-top: 10px;
        display: inline-block;
    }

    #loginwindow input, #loginwindow .btn {
        width: 90%;
        margin: auto;
    }

#loginbutton {
    margin-bottom: 20px !important;
    text-align: center;
}

    #loginbutton input {
        cursor: pointer;
    }

body {
    background-color: #ecf2f7;
    /*text-align: center;*/
    font-family: Arial;
    margin-bottom: 50px;
}

#warnings {
    text-align: center;
    color: red;
    font-weight: bold;
}

/*#wrapper { 
    width: 1150px;
    height: 780px;
    margin: 0 auto;
    padding: 15px;
    position: relative;
    -moz-border-radius: 10px;
    -khtml-border-radius: 10px;
    -webkit-border-radius: 10px;
    -ms-border-radius: 10px;
    border-radius: 10px;
    -webkit-box-shadow: 1px 1px 15px #909089;
    -moz-box-shadow: 1px 1px 15px #909089;
    zoom: 1;
    box-shadow: 1px 1px 15px #909089;
    background: white;
}*/

#wrapper {
    margin: 0 auto;
    margin-top: 70px;
    padding: 15px;
    -moz-border-radius: 10px;
    -khtml-border-radius: 10px;
    -webkit-border-radius: 10px;
    -ms-border-radius: 10px;
    border-radius: 10px;
    -moz-box-shadow: 1px 1px 15px #909089;
}

#content {
    /*width: 945px;*/
    margin: 0 auto;
    text-align: left;
    font-family: Arial !important;
}

footer {
    font-size: 12px;
    color: grey;
    margin: 0 auto;
    position: relative;
    margin-top: 10px;
    position: absolute;
    width: 100%;
    bottom: 0px;
}

    footer .footerTextSession {
        float: left;
        width: auto;
    }

        footer .footerTextSession a.btn {
            margin-right: 5px;
        }

    footer .footerTextInfo {
        float: none;
        display: block;
        margin: auto;
        clear: none;
        text-align: center;
        width: 500px;
    }

    footer .footerTextCopyright {
        display: inline-block;
        position: absolute;
        float: right;
        right: 0px;
        top: 0px;
    }


.btn { /* override bootstrap basic*/
    border-radius: 0.5rem; /*basic 0.25rem*/
}

label {
    color: #444444;
    /*color: #909090;*/
    /*font-weight: bold;*/
    vertical-align: middle;
    font-size: 18px;

    display: initial; /* RESETS THE "index-block" by the REBOOT, this will fix the empty labels to have a height, because empty labels can push text or elements down the list and feel like extra margin between elements */
}

div.formelement input {
    margin-bottom: 5px; /* Gives some extra-space for inputlabels when placed in a form-element DIV, this is used in questionnaires! So the Changes for labels gives the inputelements at least a little space */
}

h1, h2, h3, h4, h5 {
    color: #03447e;
}

h2 {
    font-size: 22px;
}

h5 {
    font-size: 16px;
    padding: 5px 0 5px 0 !important;
    margin: 0 !important;
}

table td > a.btn,
table td > button.btn {
    padding: 3px 25px;
    margin: 2px 5px;
}

table {
    /*width: 100%;*/
    font-size: 14px;
    border: 1px solid #02437d;
}


    table th {
        background-color: #02437d;
        padding: 5px;
        color: white;
        font-weight: bold;
        font-size: 14px;
        text-align: left;
        height: 40px;
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        z-index: 1;
        border: 0;
    }

        table th a {
            width: 100%;
            display: block;
            padding: 5px;
            margin: -10px -5px;
            color:white;
        }

            table th a:hover {
                background-color: rgba(255,255,255,0.5);
                text-decoration: none;
                color:white;
            }



    table td {
        background-color: inherit;
        max-height: 50px;
        /*height: 30px;*/
        padding-left: 5px;
        padding-right: 25px;
        text-align: left;
        white-space: nowrap;
    }

        table td:nth-child(1) {
            white-space: inherit; /* making the first column for the tables, the company names, to break to second line. So the rest of the tables with the buttons get moved more to right and prevent horizontal scrolling */
        }


    table > tbody > tr:nth-of-type(2n+1) {
        background-color: #ecf0f5;
    }

    table > tbody > tr:nth-of-type(2n):hover {
        background-color: #c4d9e9;
    }

    table > tbody > tr:nth-of-type(2n+1):hover {
        background-color: #c4d9e9;
    }

/*table.visitlist_table td:last-child {
        width: 100% !important;
    }
    table.visitlist_table th:last-child {
        width: 100% !important;
    }*/

div.SignaturePad table {
    width: inherit;
    font-size: 14px;
}

    div.SignaturePad table td {
        padding-top: 3px;
        padding-bottom: 3px;
        padding-right: 10px;
        padding-left: 0px;
        white-space: normal;
        text-align: left;
    }

    div.SignaturePad table > tbody > tr:nth-of-type(2n+1) {
        background-color: transparent !important;
    }

    div.SignaturePad table > tbody > tr:nth-of-type(2n):hover {
        background-color: transparent !important;
    }

    div.SignaturePad table > tbody > tr:nth-of-type(2n+1):hover {
        background-color: transparent !important;
    }

input, select, textarea {
    box-shadow: inset 0 1px 4px rgba(0,0,0,.2);
    -webkit-box-shadow: inset 0 1px 4px rgba(0,0,0,.2);
    background-clip: padding-box;
    border-radius: .25rem;
    border: 1px solid #b3b3b3;
    padding: 0.475rem 0.25rem;
    line-height: 1.4;
}

    input:focus, select:focus, textarea:focus {
        -moz-box-shadow: 0 0 12px #387bbe;
        -webkit-box-shadow: 0 0 12px #387bbe;
        box-shadow: 0 0 12px #387bbe
    }

    input.btn.disabled {
        pointer-events: none;
        /* disables the mouse click on the button when this class is used */
    }
    input[type=checkbox], input[type=radio] {
        transform: scale(1.5);
        margin-right: 10px;
        box-shadow: none;
    }

.btn-primary.disabled, .btn-primary:disabled,
.btn-secondary.disabled, .btn-secondary:disabled {
    border: 1px dashed #6c757d;
    background-color: white;
    color: #6c757d;
}

.eq-valid-input {
    background-color: #c5fc83 !important;
}

.eq-required-input {
    background-color: #ff6060 !important;
}

input.inputicon {
    padding-left: 30px; /* Defines the given space for the additional icon */
    padding-right: 2px; /* descrease the 6px or more on right side for not cutting date or time values in shorter inputfields*/
}

select.inputicon {
    padding-left: 25px; /* Defines the given space for the additional icon */
    padding-right: 2px; /* descrease the 6px or more on right side for not cutting date or time values in shorter inputfields*/
}

i.inputicon { /* defines the size and position of the icons, which are laying over the input-fields */
    width: 20px;
    height: 20px;
    display: block;
    padding-left: 10px;
    padding-top: 10px;
    pointer-events: none;
    color: #666666;
}

.btn-default,
.btn-primary,
.btn-secondary,
.btn-success,
.btn-info,
.btn-warning,
.btn-danger {
    /*-webkit-box-shadow: 0px 3px 0px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0px 3px 0px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 3px 0px rgba(0, 0, 0, 0.3);*/
    box-shadow: none;
}

    .btn-default:active,
    .btn-primary:active,
    .btn-secondary:active,
    .btn-success:active,
    .btn-info:active,
    .btn-warning:active,
    .btn-danger:active {
        /*margin-top: 3px;
        margin-bottom: -3px;*/
    }

.btn-primary {
    background-color: #02437d;
    border-color: #02437d;
}
.text-primary {
    color: #02437d!important;
}
.btn-secondary {
    color: black;
    background-color: #ccd8e8;
    border-color: #6f8aae;
}

a.printbtn {
    background-image: url(Images/printer.png);
    width: 40px;
    height: 40px;
    display: block;
}

.versionInfoText {
    font-size: 14px;
    color: #666666;
    font-weight: normal;
}

.required {
    background-color: #e0edf8;
}

a.printImageLabel, .printImageLabel {
    width: 210px;
    height: 90px;
    display: block;
    padding: 10px 0 0 10px;
    background-repeat: no-repeat;
    color: #000000;
    font-weight: normal;
}

a.printImageSticker, .printImageSticker {
    width: 250px;
    height: 152px;
    display: block;
    padding: 10px 0 0 10px;
    background-repeat: no-repeat;
    color: #000000;
    font-weight: normal;
}

.labelsmall16px {
    font-size: 16px;
    color: black;
    font-weight: bold;
}

.labelsmall13px {
    font-size: 13px;
    color: black;
    font-weight: normal;
}

.labelsmall11px {
    font-size: 11px;
    color: grey;
    font-weight: normal;
}

.wait {
    /*-webkit-filter: blur(4px);
    -moz-filter: blur(4px);
    -o-filter: blur(4px);
    -ms-filter: blur(4px);
    filter: blur(4px);*/
    /*filter: url("https://gist.githubusercontent.com/amitabhaghosh197/b7865b409e835b5a43b5/raw/1a255b551091924971e7dee8935fd38a7fdf7311/blur".svg#blur);*/
    /*filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius='4');*/
    /* Disables all Mouse Events on waiting Objects */
    pointer-events: none;
}

div#imgWait {
    border: 16px solid #f3f3f3; /* Light grey */
    border-top: 16px solid #3498db; /* Blue */
    border-radius: 50%;
    width: 80px;
    height: 80px;
    animation: spin 2s linear infinite;
    z-index: 1000;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}



element {
}

.bootstrap-datetimepicker-widget table th {
    height: 40px !important;
    background-color: transparent;
    color: #333333 !important;
}

.bootstrap-datetimepicker-widget table td.day {
    line-height: 30px !important;
}

label.btn span.fa {
    opacity: 0;
}

label.btn.active span.fa {
    opacity: 1;
}


div.visitor_locked {
    color: #c30707;
    font-size: 25px;
    display: inline-block;
    float: right;
}

/*
    ============================================
    Test für Checkbox 
    ===========================================

*/


*, *:after, *:before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

.switch {
    /*margin: 50px auto;*/
    position: relative;
}

    .switch label {
        width: 100%;
        height: 100%;
        position: relative;
        display: block;
    }

    .switch input {
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        opacity: 0;
        z-index: 100;
        position: absolute;
        width: 100%;
        height: 100%;
        cursor: pointer;
        margin-top: 5px;
    }

    /* Styling Checkbox Slider */

    .switch.slider {
        width: 80px;
        height: 35px;
    }

        .switch.slider label {
            display: block;
            width: 100%;
            height: 100%;
            background: #BBBBBB;
            transition: background-color 0.5s linear;
            border-radius: 40px;
        }

            .switch.slider label:after {
                content: "";
                position: absolute;
                z-index: -1;
                top: -8px;
                right: -8px;
                bottom: -8px;
                left: -8px;
                border-radius: inherit;
                background: #ababab;
            }

            .switch.slider label:before {
                content: "";
                position: absolute;
                z-index: -1;
                top: -18px;
                right: -18px;
                bottom: -18px;
                left: -18px;
                border-radius: inherit;
                background: #eee;
            }

            .switch.slider label i {
                display: block;
                height: 100%;
                width: 60%;
                border-radius: inherit;
                border: 2px solid #bbbbbb;
                background: silver;
                position: absolute;
                z-index: 2;
                right: 40%;
                top: 0;
                background: white;
                transition: right 0.1s linear;
            }

                .switch.slider label i:after {
                    content: "";
                    position: absolute;
                    left: 15%;
                    top: 25%;
                    width: 70%;
                    height: 50%;
                    border-radius: inherit;
                }

                .switch.slider label i:before {
                    content: "✘"; /* off */
                    text-transform: uppercase;
                    font-style: normal;
                    font-weight: bold;
                    /*color: rgba(0,0,0,0.4);*/
                    color: white;
                    /*text-shadow: 0 1px 0 #bcb8ae, 0 -1px 0 #97958e;*/
                    font-family: Helvetica, Arial, sans-serif;
                    font-size: 17px;
                    position: absolute;
                    top: 50%;
                    margin-top: -12px;
                    right: -50%;
                }

        .switch.slider input[required] ~ label {
            background-color: #ff6060;
        }

        .switch.slider input:checked ~ label {
            background: #5bba22;
        }

            .switch.slider input:checked ~ label i {
                right: -1%;
            }

                .switch.slider input:checked ~ label i:before {
                    content: "✔"; /* on */
                    right: 115%;
                    color: #ffffff;
                    /*text-shadow: 0 1px 0 #afcb9b, 0 -1px 0 #6b8659;*/
                }

/* Is this class needed in VisitControl EMPFANG ? */
/*.file-upload {
    display: none;
}*/


.signatureSigned {
    color: #336600;
}

.signatureNotSigned {
    color: #cc0000;
}


/* Notify PreRegistrations */
#notify-preregister {
    width: 290px;
    height: 35px;
    display: block;
    background-color: #eee;
    position: fixed;
    margin: 0 auto;
    top: 0px;
    margin-left: -465px;
    left: 50%;
    z-index: 100;
    font-size: 14px;
    color: #666;
    -webkit-border-bottom-right-radius: 1em;
    -webkit-border-bottom-left-radius: 1em;
    -moz-border-radius-bottomright: 1em;
    -moz-border-radius-bottomleft: 1em;
    border-bottom-right-radius: 1em;
    border-bottom-left-radius: 1em;
    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, .3);
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, .3);
    box-shadow: 0px 1px 4px rgba(0,0,0,0.3);
}

    #notify-preregister span {
        margin-top: 5px;
        margin-left: 10px;
        display: inline-block;
        min-width: 24px;
        text-align: center;
    }

    #notify-preregister a {
        color: #666666;
    }

span.preregister-counter {
    background-color: #fff;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px;
    min-width: 15px;
    min-height: 15px;
    padding: 2px 5px 2px 5px;
    margin-right: 5px;
}

#close-notify-preregister {
    width: 60px;
    height: 35px;
    padding: 0px;
    margin: 0;
    float: right;
    border-left: 1px solid #666;
    color: #666;
    -webkit-border-bottom-right-radius: 1em;
    -moz-border-radius-bottomright: 1em;
    border-bottom-right-radius: 1em;
}

    #close-notify-preregister:hover {
        border-left: 1px solid #909089;
        background-color: #999;
        color: #ddd;
    }

    #close-notify-preregister span {
        margin: 9px 0 0 0;
        width: 100%;
        text-align: center;
        font-size: 17px;
    }

.file-upload {
    display: none;
}

#lblMustFieldsInfos {
    color: red;
    font-weight: normal;
}

.eq-help::before {
    font-family: "Font Awesome 5 Free";
    content: "\f059";
    font-size: 150%;
    position: absolute;
    right: -40px;
    top: -36px;
}

.linkCustom1.eq-help::before,
.linkCustom2.eq-help::before {
    vertical-align: middle;
    padding-right: 5px;
    right: auto !important;
    top: auto !important;
    margin-top: -5px;
    margin-left: -30px;
    text-decoration: none;
}

.linkCustom1,
.linkCustom2 {
    position: absolute;
    display: block;
    text-decoration: none;
    padding-left: 30px;
}


td .fa-square,
td .fa-check-square { /* Set Squared icons to be centered in tables */
    text-align: center;
    display: block;
}


#divFormsSigned {
    width: 100%;
}

    #divFormsSigned span {
        display: block;
    }

    #divFormsSigned i {
        margin-bottom: 20px;
    }

    #divFormsSigned #imgFormsSignature {
        display: block;
        margin: 0px auto 10px auto;
    }

.modal-dialog .modal-content {
    max-width: 600px;
    margin: 1.75rem auto;
}

.modal-header,
.modal-footer {
    border-bottom: 0px solid #dee2e6;
    border-top: 0px solid #dee2e6;
}

.modal-footer {
    display: block;
}

table.eq_table_filled_forms td {
    padding: 0px;
    font-size: 120%;
}

.modal {
    background-color: rgba(0,0,0,0.3);
    z-index: 10000;
}
.show {
    display: block;
}

#imgVisitorSignature,
#imgFormsSignature {
    padding: 20px 20px;
    border: 8px solid rgba(0,0,0,.15);
    border-radius: 20px;
    box-shadow: #dbdbdb 2px 2px 5px inset;
    margin: auto;
    display: block;
    width: 100%;
}


td.required-form {
}

    td.required-form a {
        border: 2px solid #6c757d !important;
        font-weight: bold;
    }

.PreVisitorList table#tableVisitorForms td a,
.Visitlist table#tableVisitorForms td a {
    text-decoration: none;
    padding: 0.275rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: 0.5rem;
    margin-bottom: 3px;
    display: inline-block;
    color: #6c757d;
    background-color: transparent;
    border: 1px solid #6c757d;
}

    .PreVisitorList table#tableVisitorForms td a:hover,
    .Visitlist table#tableVisitorForms td a:hover {
        background-color: #5a6268;
        color: white;
    }

.PreVisitorList table#tableVisitorForms td,
.Visitlist table#tableVisitorForms td {
    padding: 0rem;
}

.bootstrap-datetimepicker-widget.dropdown-menu {
    min-width: 22em;
}



/* Styles for validation helpers
-----------------------------------------------------------*/
.field-validation-error {
    color: #f00;
    display: block;
    margin-top: 8px;
    text-align: center;
}

.field-validation-valid {
    display: none;
}

.input-validation-error {
    border: 1px solid #f00;
    background-color: #fee;
}

.validation-summary-errors {
    font-weight: bold;
    color: #f00;
}

.validation-summary-valid {
    display: none;
}


/* jQuery mobile styles
-----------------------------------------------------------*/

/* Make listview buttons fill the whole horizontal width of the screen */
.ui-li .ui-btn-inner a.ui-link-inherit, .ui-li-static.ui-li {
    padding-right: 15px;
}

.ui-bar-a, .ui-body-a, .ui-btn-up-a, .ui-btn-hover-a, .ui-btn-down-a,
.ui-bar-b, .ui-body-b, .ui-btn-up-b, .ui-btn-hover-b, .ui-btn-down-b,
.ui-bar-c, .ui-body-c, .ui-btn-up-c, .ui-btn-hover-c, .ui-btn-down-c,
.ui-bar-d, .ui-body-d, .ui-btn-up-d, .ui-btn-hover-d, .ui-btn-down-d,
.ui-bar-e, .ui-body-e, .ui-btn-up-e, .ui-btn-hover-e, .ui-btn-down-e,
.ui-btn-active {
    text-shadow: none;
}

/* SODY */
#loading-div-background {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    background: black;
    width: 100%;
    height: 100%;
    z-index: 10000;
}

#loading-div {
    width: 300px;
    height: 200px;
    background-color: #222;
    text-align: center;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -150px;
    margin-top: -100px;
}

    #loading-div h2 {
        color: white;
        font-weight: normal;
    }

pre {
    border: 1px solid rgb(90, 90, 90);
    border-radius: 8px;
    background-color: rgb(244, 244, 244);
    padding: 8px;
    padding-right: 50px; /*extra space for .copycode button */
    overflow-wrap: break-word;
    white-space: pre-wrap;
    text-align: left;
}
    pre code {
        word-break: break-all;
    }



.copycode {
    margin-left: -30px;
    margin-top: 20px;
    float: right;
}

.eq-companylogo-list {
    max-width: 100px;
    max-height: 50px;
    display: block;
    margin: auto;
}