@font-face {
    font-family: 'FontRegular';
    src: url('../Libraries/fonts/Lato/Lato-Regular.woff2') format('woff2'),url('../Libraries/fonts/Lato/Lato-Regular.woff') format('woff'),url('../Libraries/fonts/Lato/Lato-Regular.ttf') format('truetype'),url('../Libraries/fonts/Lato/Lato-Regular.svg#Lato-Regular') format('svg'),url('../Libraries/fonts/Lato/Lato-Regular.eot?#iefix') format('embedded-opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'FontBold';
    src: url('../Libraries/fonts/Lato/Lato-Bold.woff2') format('woff2'),url('../Libraries/fonts/Lato/Lato-Bold.woff') format('woff'),url('../Libraries/fonts/Lato/Lato-Bold.ttf') format('truetype'),url('../Libraries/fonts/Lato/Lato-Bold.svg#Lato-Bold') format('svg'),url('../Libraries/fonts/Lato/Lato-Bold.eot?#iefix') format('embedded-opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'FontLight';
    src: url('../Libraries/fonts/Lato/Lato-Light.woff2') format('woff2'), url('../Libraries/fonts/Lato/Lato-Light.woff') format('woff'), url('../Libraries/fonts/Lato/Lato-Light.ttf') format('truetype'), url('../Libraries/fonts/Lato/Lato-Light.svg#Lato-Light') format('svg'), url('../Libraries/fonts/Lato/Lato-Light.eot?#iefix') format('embedded-opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'FontBlack';
    src: url('../Libraries/fonts/Lato/Lato-Black.woff2') format('woff2'), url('../Libraries/fonts/Lato/Lato-Black.woff') format('woff'), url('../Libraries/fonts/Lato/Lato-Black.ttf') format('truetype'), url('../Libraries/fonts/Lato/Lato-Black.svg#Lato-Black') format('svg'), url('../Libraries/fonts/Lato/Lato-Black.eot?#iefix') format('embedded-opentype');
    font-weight: normal;
    font-style: normal;
}

:root {
    --theme1: #B88051;
    --theme2: #6C6763;
    --theme3: #8C8581;
    --default1: #303030;
    --default2: #E0E0E0;
    --default3: #FAFAFA;
    --default4: #FFFFFF;
    --warning_yellow: #F9BE00;
    --warning_red: #FF5859;
    --warning_green: #00AE8D;
    --ddd: #E0E0E0;
    --footer: #3a2718;
    --searchborder: 1px solid #ced4da;
}

body {
    font-family: "FontRegular";
}

.footer {
    background: #333;
}

    .footer, .footer a {
        color: white;
    }

.bar {
    width: 100%;
}

    .bar:before, .bar:after {
        content: '';
        height: 2px;
        width: 0;
        bottom: 0px;
        position: absolute;
        background: #696259;
        -webkit-transition: all 0.5s ease;
        transition: all 0.5s ease;
    }

.group {
    position: relative;
    margin-top: 30px;
}

    .group.twolines {
        margin-top: 50px;
    }

.input {
    padding: 10px 10px 10px 5px;
    -webkit-appearance: none;
    display: block;
    background: transparent;
    color: #000;
    width: 100%;
    border: none;
    border-radius: 0;
    border-bottom: 1px solid #ddd;
}

    .input:focus {
        outline: none;
    }

.input-label {
    font-size: 14px;
    color: var(--inputlabelcolor);
    font-family: var(--fontregular);
    font-weight: normal;
    position: absolute;
    pointer-events: none;
    top: 11px;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.input:focus ~ .bar:before, .input:focus ~ .bar:after {
    width: 100%;
}

.input:focus ~ .input-label, .input.used ~ .input-label {
    top: -17px;
    color: var(--inputlabelfocuscolor);
}

.input:focus ~ .icon, .input.used ~ .icon {
    color: #696259 !important;
}

.spnError {
    color: tomato;
}

td .edit, td .delete {
    margin-right: 15px;
}

a {
    text-decoration: none;
}

.courseTemplate {
}

    .courseTemplate .card-body {
        cursor: pointer;
        min-height: 160px;
    }

.course-progress {
    height: 50px;
    width: 50px;
}

table .bootstrap-datetimepicker-widget {
    inset: auto !important;
}

.babloader {
    z-index: 1000;
    width: 4em;
    height: 4em;
}

.table-selectable td {
    cursor: pointer !important;
}


ins {
    text-decoration: none;
    background-color: #d4fcbc;
}

del {
    text-decoration: line-through;
    background-color: #fbb6c2;
    color: #555;
}

.upload-circle-progress {
    height: 100px;
    width: 100px;
    background: var(--bs-gray-500);
    border-radius: 50%;
}

.drag {
    border-style: dashed !important;
    min-width: 200px !important;
}

.detail-view:hover, .detail-view:hover td, .detail-view td:hover {
    background: white !important;
    background-color: white !important;
}