@font-face {
    font-family: 'Montserrat-italic';
    src: url('fonts/Montserrat-ExtraBoldItalic.eot');
    src: local('Montserrat ExtraBold Italic'), local('fonts/Montserrat-ExtraBoldItalic'),
    url('fonts/Montserrat-ExtraBoldItalic.eot?#iefix') format('embedded-opentype'),
    url('fonts/Montserrat-ExtraBoldItalic.woff2') format('woff2'),
    url('fonts/Montserrat-ExtraBoldItalic.woff') format('woff'),
    url('fonts/Montserrat-ExtraBoldItalic.ttf') format('truetype'),
    url('fonts/Montserrat-ExtraBoldItalic.svg#Montserrat-ExtraBoldItalic') format('svg');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat-italic';
    src: url('fonts/Montserrat-BoldItalic.eot');
    src: local('Montserrat Bold Italic'), local('fonts/Montserrat-BoldItalic'),
    url('fonts/Montserrat-BoldItalic.eot?#iefix') format('embedded-opentype'),
    url('fonts/Montserrat-BoldItalic.woff2') format('woff2'),
    url('fonts/Montserrat-BoldItalic.woff') format('woff'),
    url('fonts/Montserrat-BoldItalic.ttf') format('truetype'),
    url('fonts/Montserrat-BoldItalic.svg#Montserrat-BoldItalic') format('svg');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

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

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

@font-face {
    font-family: 'Montserrat';
    src: url('fonts/Montserrat-ExtraBold.eot');
    src: local('Montserrat ExtraBold'), local('fonts/Montserrat-ExtraBold'),
    url('fonts/Montserrat-ExtraBold.eot?#iefix') format('embedded-opentype'),
    url('fonts/Montserrat-ExtraBold.woff2') format('woff2'),
    url('fonts/Montserrat-ExtraBold.woff') format('woff'),
    url('fonts/Montserrat-ExtraBold.ttf') format('truetype'),
    url('fonts/Montserrat-ExtraBold.svg#Montserrat-ExtraBold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat-italic';
    src: url('fonts/Montserrat-BlackItalic.eot');
    src: local('Montserrat Black Italic'), local('fonts/Montserrat-BlackItalic'),
    url('fonts/Montserrat-BlackItalic.eot?#iefix') format('embedded-opentype'),
    url('fonts/Montserrat-BlackItalic.woff2') format('woff2'),
    url('fonts/Montserrat-BlackItalic.woff') format('woff'),
    url('fonts/Montserrat-BlackItalic.ttf') format('truetype'),
    url('fonts/Montserrat-BlackItalic.svg#Montserrat-BlackItalic') format('svg');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat-italic';
    src: url('fonts/Montserrat-LightItalic.eot');
    src: local('Montserrat Light Italic'), local('fonts/Montserrat-LightItalic'),
    url('fonts/Montserrat-LightItalic.eot?#iefix') format('embedded-opentype'),
    url('fonts/Montserrat-LightItalic.woff2') format('woff2'),
    url('fonts/Montserrat-LightItalic.woff') format('woff'),
    url('fonts/Montserrat-LightItalic.ttf') format('truetype'),
    url('fonts/Montserrat-LightItalic.svg#Montserrat-LightItalic') format('svg');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

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

@font-face {
    font-family: 'Montserrat-italic';
    src: url('fonts/Montserrat-Italic.eot');
    src: local('Montserrat Italic'), local('fonts/Montserrat-Italic'),
    url('fonts/Montserrat-Italic.eot?#iefix') format('embedded-opentype'),
    url('fonts/Montserrat-Italic.woff2') format('woff2'),
    url('fonts/Montserrat-Italic.woff') format('woff'),
    url('fonts/Montserrat-Italic.ttf') format('truetype'),
    url('fonts/Montserrat-Italic.svg#Montserrat-Italic') format('svg');
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('fonts/Montserrat-SemiBold.eot');
    src: local('Montserrat SemiBold'), local('fonts/Montserrat-SemiBold'),
    url('fonts/Montserrat-SemiBold.eot?#iefix') format('embedded-opentype'),
    url('fonts/Montserrat-SemiBold.woff2') format('woff2'),
    url('fonts/Montserrat-SemiBold.woff') format('woff'),
    url('fonts/Montserrat-SemiBold.ttf') format('truetype'),
    url('fonts/Montserrat-SemiBold.svg#Montserrat-SemiBold') format('svg');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat-italic';
    src: url('fonts/Montserrat-MediumItalic.eot');
    src: local('Montserrat Medium Italic'), local('fonts/Montserrat-MediumItalic'),
    url('fonts/Montserrat-MediumItalic.eot?#iefix') format('embedded-opentype'),
    url('fonts/Montserrat-MediumItalic.woff2') format('woff2'),
    url('fonts/Montserrat-MediumItalic.woff') format('woff'),
    url('fonts/Montserrat-MediumItalic.ttf') format('truetype'),
    url('fonts/Montserrat-MediumItalic.svg#Montserrat-MediumItalic') format('svg');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat-italic';
    src: url('fonts/Montserrat-SemiBoldItalic.eot');
    src: local('Montserrat SemiBold Italic'), local('fonts/Montserrat-SemiBoldItalic'),
    url('fonts/Montserrat-SemiBoldItalic.eot?#iefix') format('embedded-opentype'),
    url('fonts/Montserrat-SemiBoldItalic.woff2') format('woff2'),
    url('fonts/Montserrat-SemiBoldItalic.woff') format('woff'),
    url('fonts/Montserrat-SemiBoldItalic.ttf') format('truetype'),
    url('fonts/Montserrat-SemiBoldItalic.svg#Montserrat-SemiBoldItalic') format('svg');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

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

@font-face {
    font-family: 'Montserrat';
    src: url('fonts/Montserrat-Medium.eot');
    src: local('Montserrat Medium'), local('fonts/Montserrat-Medium'),
    url('fonts/Montserrat-Medium.eot?#iefix') format('embedded-opentype'),
    url('fonts/Montserrat-Medium.woff2') format('woff2'),
    url('fonts/Montserrat-Medium.woff') format('woff'),
    url('fonts/Montserrat-Medium.ttf') format('truetype'),
    url('fonts/Montserrat-Medium.svg#Montserrat-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

* {
    margin: 0;
    padding: 0;
}

body {
    min-width: 320px;
    overflow-x: hidden;
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    font-size: 16px;
}

img {
    max-width: 100%;
    height: auto;
}

.full-height {
    min-height: 100vh;
}

.height100 {
    height: auto;
}

input.error {
    border: 1px solid red!important;
}

span.reg {
    color: red;
}

label.error {
    color: red;
    font-weight: 300;
    font-size: 13px;
    margin-top: 5px;
}

.input-group label.error {
    position: absolute;
    bottom: -24px;
}

.input-group label.error + span + div {
    margin-bottom: 15px;
}

.width-fit {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
}

table.restables-clone {
    display: none;
}

@media (max-width: 991px) {
    table.restables-origin {
        display: none;
    }

    table.restables-clone {
        display: table;
    }

    table.restables-clone tbody td:last-child {
        text-align: right;
    }

    table.restables-clone tbody tr:first-child {
        background-color: #dee2e6;
    }
}

.loading {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 999;
    width: 100%;
    height: 100%;
    background-color: rgba(255,255,255,0.8);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.btn img {
    min-width: 16px;
}

.for__all-icon img {
    max-width: 34px;
    min-width: 34px;
    margin-top: -5px;
}

.sticky__tool {
    width: 100%;
    position: sticky;
    bottom: 0;
    z-index: 9;
    background-color: #fff;
}

.sticky__group {
    width: 100%;
    position: sticky;
    bottom: 0;
    background-color: #fff;
    z-index: 11;
}

.material__item-file {
    background-color: #F5F6F7;
}

.bg-gray {
    background-color: rgba(222, 226, 230, 0.3);
}

.button__number {
    min-width: 42px;
    outline: none!important;
    box-shadow: none!important;
}

.button__test-next[disabled] {
    color: rgba(0, 0, 0, 0.5);
    background-color: rgba(222, 226, 230, 1);
    border-color: rgba(222, 226, 230, 1);
}

.button__number.current {
    color: rgba(33, 37, 41, 1);
    background-color: rgba(128, 174, 248, 1);
    border-color: rgba(128, 174, 248, 1);
}

.button__number.error {
    color: rgba(33, 37, 41, 1);
    background-color: rgba(233, 125, 125, 1);
    border-color: rgba(233, 125, 125, 1);
}

.button__number.success {
    color: rgba(33, 37, 41, 1);
    background-color: rgba(115, 239, 172, 1);
    border-color: rgba(115, 239, 172, 1);
}

.test__wrap-step {
    display: none;
}

.test-label-result {
    border-radius: 4px;
    font-weight: 600;
    color: rgba(33, 37, 41, 1);
    font-size: 16px;
    padding: 5px 10px;
    width: max-content;
    display: none;
}

.test-label-result.result-success {
    background-color: rgba(115, 239, 172, 1);
}

.test-label-result.result-error {
    background-color: rgba(233, 125, 125, 1);
}

.btn-final-test {
    display: none;
}

.test__wrap-final {
    display: none;
}

.width-content {
    width: max-content;
}

.course__status {
    border-radius: 4px;
    font-weight: 400;
    color: rgba(33, 37, 41, 1);
    font-size: 16px;
    padding: 5px 25px;
    width: max-content;
}

.course__status.new {
    background-color: rgba(235, 240, 244, 1);
}

.course__status.complete {
    background-color: rgba(115, 239, 172, 1);
}

.course__status.failed {
    background-color: rgba(233, 125, 125, 1);
}

@media(max-width: 992px) {
    .status-column {
        display: flex;
        justify-content: flex-end;
    }
}

.theme__video {
    overflow:hidden;
    position:relative;
    padding-bottom:56.25%;
    padding-top:30px;
    height:0;
}

.theme__video iframe{
    position:absolute;
    width:100%;
    height:100%;
    left:0;
    top:0;
}

.button-column-group {
    flex-direction: column;
}

.button-column-group a {
    font-size: 14px;
    width: 160px;
    margin-bottom: 5px;
}

.panel__sort {
    display: flex;
    align-items: center;
    width: 100%;
}

.panel__sort a {
    display: flex;
    align-items: center;
    text-decoration: none;
}
.panel__sort a svg {
    width: 24px;
}