/*---------------- My Dividers ----------------------->*/

.my-body-1 {
    background-color: #d6eaf8;
    
}

.my-body-2 {      
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment:fixed;
}

.my-container {
    border: 0px solid green;
}

.my-row {
    border: 1px solid red;
}

.my-row-separator {
    height: 20px;
}

.my-modalrow-separator {
    height: 10px;
}

.my-header-separator {
    height: 45px;
}

.my-col {
    border: 1px dotted blue;
}

.row-margin-right-15 {
    margin-right: 15px;
}

.loginpage-logo {
    margin: 30px;
}

.TopIconSpacing {
    color: white;
    vertical-align: middle;
    height: 50px;
    width: 50px;    
    cursor:pointer;
}


.My-TextBox {
    display: initial;
    width: 90%;
}



.table.dataTable tbody tr.selected {
    color: dodgerblue;
    font-weight: 600;
    background-color: #eeeeee;
}

.table.dataTable tbody tr.hover {
    background-color: #eeeeee;
}


input[type="checkbox"] {
    cursor: pointer;
}


/*---------------- My Labels ----------------------->*/

.ModalLabelError{
    color: red;    
    transition: 1s;
}


.LabelAppear {
    color: #4C70DD;    
    transition: 1s;
}



.MainMenuIconSize {

    height: 30px;
    width: 35px;
}



.LabelErrorNoFlash {
    color: darkred;
    font-weight: 700;
}


.LabelError {
    color: darkred;        
    font-weight: 700;
    animation: blinker 4s linear infinite;
}

@keyframes blinker {
    50% {
        opacity: 0;
    }
}


.LabelTime {
    color: #ffffff;
    font-family: Lato, Calibri;
    font-size: 12px;
    font-weight: 600;
}


.LabelPageTitle {    
    font-size: 22px;
    font-style: italic;    
    font-weight: 700;
}

.LabelGeneralField {
    font-size: 12px;
}



.LabelProminentField {
    color: #B7950B;
    font-family: Lato, Calibri;
    font-style: italic;
    font-size: 20px;
    text-align: left;
    font-weight: 600;
}

.LabelPanelField {
    color: #1ABC9C;
    font-family: Lato, Calibri;
    font-size: 12px;
    font-weight: 700;
    margin-right: 7px;
    font-style: italic;
}


.LabelSectionHeading {
    color: #4C70DD;
    font-weight: 700;
    font-style: italic;
}

.LabelPanelAnswer {
    color: #B7950B;
    font-family: Lato, Calibri;
    font-size: 12px;
    font-weight: 700;
    margin-left: 5px;
}

.LabelPageLoading {
    color: #B03A2E;
    font-family: Lato, Calibri;
    font-size: 18px;
    font-weight: 700;
}

.LabelNotification {
    font-family: Lato, Calibri;
    font-style: italic;
    font-size: 12px;
    font-weight: 600;
    animation: LabelFade 6.0s backwards;
}


@keyframes LabelFade {
    0% {
        color: transparent;
    }

    20% {
        color: white;
    }

    90% {
        color: white;
    }

    95% {
        color: transparent;
    }

    100% {
        color: transparent;
    }
}



.Label-ControlLabel{
    margin: 10px;
    font-size: small;
}


.collapse-item-custom{
    font-size: 13px;
    font-weight: 500;
}



.slide-right {
    width: 100%;
    overflow: hidden;
    margin-left: 400px;
    max-width: 500px
}

    .slide-right h2 {
        animation: 2s slide-right;
        animation-delay: 2s;
    }

@keyframes slide-right {
    from {
        margin-left: -500px;
    }

    to {
        margin-left: 0%;
    }
}

/*---------------- My Buttons ----------------------->*/




.AuthoriseButton {
    border-radius: 5px;
    height: 35px;
    width: 100px;
    transition: 0.5s;
    background-color: #B03A2E;
    color: #FFFFFF;
    font-weight: 600;
    font-size: 12px;
    cursor: pointer;
    font-family: Lato, Calibri;
    border: solid;
    border-width: 2px;
    border-color: #B03A2E;
}


    .AuthoriseButton:hover {
        border: solid;
        border-width: 2px;
        border-color: #f4d03f;
        background-color: #CB4335;
    }


.CreateButton {
    border-radius: 5px;
    height: 35px;
    width: 100px;
    transition: 0.5s;
    background-color: #4e73df;
    color: #FFFFFF;
    font-weight: 600;
    font-size: 12px;
    cursor: pointer;
    font-family: Lato, Calibri;
    border: solid;
    border-width: 2px;
    border-color: #4e73df;
}


    .CreateButton:hover {
        border: solid;
        border-width: 2px;
        border-color: #f4d03f;
        background-color: #85c1e9;
    }




/*---------------- Modal CSS ----------------------->*/


.ModalLabel {     
    text-wrap: none;
    font-weight: 600;
    font-size: smaller;
}



/*---------------- Loader CSS ----------------------->*/





.LoaderBody {
    position: absolute;
    top: 0;
    right: 0;
    background-color: rgba(0,0,0,0.6);
    height: 100%;
    width: 100%;
    transition: 0.8s;
    text-align: center;    
    z-index: 999999;
}

.LoaderInner {
    position: absolute;
    top: 45%;
    left: 50%;
    background-color: rgba(248,249,252,1);
    border-radius: 4px;
    transform: translate(-45%,-50%);
    width: 100px;
    height: 100px;
    z-index: 999999;
}


.myFont {
    font-size: 14px;
}

.select2 {    
    font-size: 14px
}



/* Sliding Switches*/

.switch {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 22px;    
}

    .switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

    .slider:before {
        position: absolute;
        content: "";
        height: 16px;
        width: 16px;
        left: 1px;  
        bottom: 3px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }

input:checked + .slider {
    background-color: #2196F3;
}

input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 20px;
}

    .slider.round:before {
        border-radius: 50%;
    }




.TextBoxValidateBorder {
    border-color: red !important;
    border-width: 1.5px !important;
    transition: 2s !important;
}


.btn-success {
    color: #fff;
    background-color: #1cc88a;
    border-color: #1cc88a;
}

    .btn-success:hover {
        color: #fff;
        background-color: #17a673;
        border-color: #169b6b;
    }

    .btn-success:focus, .btn-success.focus {
        color: #fff;
        background-color: #17a673;
        border-color: #169b6b;
        box-shadow: 0 0 0 0.2rem rgba(62, 208, 156, 0.5);
    }

    .btn-success.disabled, .btn-success:disabled {
        color: #fff;
        background-color: #1cc88a;
        border-color: #1cc88a;
    }

    .btn-success:not(:disabled):not(.disabled):active, .btn-success:not(:disabled):not(.disabled).active,
    .show > .btn-success.dropdown-toggle {
        color: #fff;
        background-color: #169b6b;
        border-color: #149063;
    }

        .btn-success:not(:disabled):not(.disabled):active:focus, .btn-success:not(:disabled):not(.disabled).active:focus,
        .show > .btn-success.dropdown-toggle:focus {
            box-shadow: 0 0 0 0.2rem rgba(62, 208, 156, 0.5);
        }


.btn-Purple {
    color: white;
    background-color: #8e44ad !important;
    border-color: #8e44ad !important;
    
}

    .btn-Purple:hover {
        color: #fff;
        background-color: #6A1B9A !important;
        border-color: #6A1B9A !important;
    }

    .btn-Purple:focus, .btn-Purple.focus {
        color: #fff;
        background-color: #6A1B9A !important;
        border-color: #6A1B9A !important;
        box-shadow: 0 0 0 0.2rem rgba(74, 120, 140, 0.5);
    }


.btn-Brown {
    color: white;
    background-color: #8d6e63 !important;
    border-color: #8d6e63 !important;
    height: 38px !important;
    width: 40px !important;
}

    .btn-Brown:hover {
        color: #fff;
        background-color: #5d4037 !important;
        border-color: #5d4037 !important;
    }

    .btn-Brown:focus, .btn-Brown.focus {
        color: #fff;
        background-color: #8d6e63 !important;
        border-color: #8d6e63 !important;
        box-shadow: 0 0 0 0.2rem rgba(74, 120, 140, 0.5);

    }


.btn-Silver {
    color: #fff;
    background-color: #4fc3f7 !important;
    border-color: #4fc3f7 !important;
}

    .btn-Silver:hover {
        color: #fff;
        background-color: #29b6f6 !important;
        border-color: #29b6f6 !important;
    }

    .btn-Silver:focus, .btn-Silver.focus {
        color: #fff;
        background-color: #29b6f6 !important;
        border-color: #29b6f6 !important;
        box-shadow: 0 0 0 0.2rem rgba(21, 101, 192, 0.5);
    }


.btn-inlineedit {
    color: #fff;
    background-color: #4fc3f7 !important;
    border-color: #4fc3f7 !important;
    height: 30px !important;
    width: 30px !important;
    border-radius: 3px !important;
}

    .btn-inlineedit:hover {
        color: #fff;
        background-color: #42a5f5 !important;
        border-color: #42a5f5 !important;
    }

    .btn-inlineedit:focus, .btn-inlineedit.focus {
        color: #fff;
        background-color: #4fc3f7 !important;
        border-color: #4fc3f7 !important;
        box-shadow: 0 0 0 0.2rem rgba(21, 101, 192, 0.5);
    }




.btn-InLineDelete {
    color: #fff;
    background-color: #ec7063 !important;
    border-color: #ec7063 !important;
    height: 25px !important;
    width: 25px !important;
    border-radius: 3px !important;
}

    .btn-InLineDelete:hover {
        color: #fff;
        background-color: #CB4335 !important;
        border-color: #CB4335 !important;
    }

    .btn-InLineDelete:focus, .btn-InLineDelete.focus {
        color: #fff;
        background-color: #ec7063 !important;
        border-color: #ec7063 !important;
        box-shadow: 0 0 0 0.2rem rgba(21, 101, 192, 0.5);
    }





.btn-InlineWHBtn {
    color: #fff;
    background-color: #8d6e63 !important;
    border-color: #8d6e63 !important;
    height: 27px !important;
    width: 27px !important;
    border-radius: 3px !important;
}

    .btn-InlineWHBtn:hover {
        color: #fff;
        background-color: #6d4c41 !important;
        border-color: #6d4c41 !important;
    }

    .btn-InlineWHBtn:focus, .btn-InlineWHBtn.focus {
        color: #fff;
        background-color: #8d6e63 !important;
        border-color: #8d6e63 !important;
        box-shadow: 0 0 0 0.2rem rgba(21, 101, 192, 0.5);
    }


.btn-InlineDownloadBtn {
    color: #fff;
    background-color: #f6c23e !important;
    border-color: #f6c23e !important;
    height: 27px !important;
    width: 27px !important;
    border-radius: 3px !important;
}

    .btn-InlineDownloadBtn:hover {
        color: #fff;
        background-color: #f4b619 !important;
        border-color: #f4b30d !important;
    }

    .btn-InlineDownloadBtn:focus, .btn-InlineDownloadBtn.focus {
        color: #fff;
        background-color: #f4b619 !important;
        border-color: #f4b30d !important;
        box-shadow: 0 0 0 0.2rem rgba(247, 203, 91, 0.5);
    }