* {
    outline: none;
}

body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    background: #eeeeee;
}

.wrapper {
    max-width: 2500px;
    margin: 0 auto;
    width: 100%;
}

/*Шапка сайта*/
    header .head {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: space-between;
        align-items: center;
        height: 100%;
        max-width: 1300px;
        margin: 0 auto;
        padding: 0 25px;
    }

        header .head a.logo {
            display: block;
            width: 300px;
        }

            header .head a.logo img {
                display: block;
                width: 100%;
                height: auto;
            }

        header span.bars {
            display: block;
            width: 30px;
            padding: 25px;
            cursor: pointer;
        }

            header span.bars img {
                width: 100%;
                height: auto;
                display: block;
            }

/*Главный слайд*/
.slide {
    background-image: url(../images/slide.jpg);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    height: 550px;
    position: relative;
}

    .slide .slide_content {
        position: absolute;
        bottom: 75px;
        right: 50%;
        max-width: 650px;
        font: normal 18px /*'Roboto'*/;
        padding: 0 0 0 20px;
        box-sizing: border-box;
    }

        .slide .slide_content h1 {
            font: normal 45px /*'Gothic'*/;
            margin: 0 0 15px 0;
            padding: 0;
            display: block;
            color: #333;
        }

        .slide .slide_content ul {
            margin: 0;
            padding: 0;
            list-style: none;
        }

            .slide .slide_content ul li {
                position: relative;
                display: block;
                padding: 6px 0 6px 40px;
            }

                .slide .slide_content ul li:before {
                    content: '';
                    position: absolute;
                    top: 6px;
                    left: 0;
                    display: block;
                    width: 22px;
                    height: 18px;
                    background-image: url(../images/marker.svg);
                    background-repeat: no-repeat;
                    background-size: cover;
                }

/*Информационный блок*/
.info_block {
    padding: 100px 25px;
}

.info_block_content {
    max-width: 1300px;
    margin: 0 auto;
}

    .info_block_content h2 {
        font: normal 45px /*'Gothic'*/;
        margin: 0 0 25px 0;
        padding: 0;
        display: block;
        text-align: center;
        color: #1D1D1B;
    }

    .info_block_content .short_text {
        font: normal 17px /*'Roboto'*/;
        line-height: 30px;
        color: #1D1D1B;
        margin: 0 0 25px 0;
        text-align: center;
    }

    .info_block_content .boxs {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
    }

        .info_block_content .boxs .box {
            width: calc(30% - 30px);
            margin: 15px; 
        }

            .info_block_content .boxs .box .icon {
                background: url(../images/icon_bg.svg);
                background-repeat: no-repeat;
                background-size: 100% 100%;
                width: 55px;
                height: 55px;
                padding: 66px;
                margin: 0 auto 15px auto;
            }

                .info_block_content .boxs .box .icon img {
                    width: 100%;
                    display: block;
                    height: auto;
                }

            .info_block_content .boxs .box .info {
                text-align: center;
                font: normal 17px /*'Roboto'*/;
                color: #1D1D1B;
                width: 88%;
                margin: 0 auto;
            }

/*Форма обратной связи*/
.contact_form {
    padding: 100px 25px;
    background: #333;
}

.contact_form_content {
    max-width: 900px;
    margin: 0 auto;
}

    .contact_form_content h3 {
        font: normal 45px /*'Gothic'*/;
        margin: 0 0 15px 0;
        color: #ffffff;
        display: block;
        text-align: center;
    }

    .contact_form_content .columns {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
    }

        .contact_form_content .columns .column {
            width: calc(50% - 30px);
            margin: 15px;
        }

            .contact_form_content .columns .column .field {
                margin: 0 0 30px 0;
            }

                .contact_form_content .columns .column .field:last-child {
                    margin: 0 0 0 0;
                }

.contact_form .field input, .contact_form .field textarea {
    display: block;
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
    border: none;
    border-radius: 4px;
    font: normal 17px /*'Roboto'*/;
    color: #8B8B8B;
}

.contact_form .field textarea {
    width: 100%;
    height: 240px;
    min-width: 100%;
    max-width: 100%;
    min-height: 150px;
}

.contact_form .field input::-webkit-input-placeholder {
    font: normal 17px /*'Roboto'*/;
}

.contact_form .field input:focus::-webkit-input-placeholder {
    color: transparent;
}

.contact_form .field input:focus::-moz-placeholder {
    color: transparent;
}

.contact_form .field input:focus::-ms-input-placeholder {
    color: transparent;
}

.contact_form .field textarea::-webkit-input-placeholder {
    font: normal 17px /*'Roboto'*/;
}

.contact_form .field textarea:focus::-webkit-input-placeholder {
    color: transparent;
}

.contact_form .field textarea:focus::-moz-placeholder {
    color: transparent;
}

.contact_form .field textarea:focus::-ms-input-placeholder {
    color: transparent;
}

.contact_form .buttons {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    grid-gap: 25px;
}

    .contact_form .buttons input {
        display: block;
        background: #FFFFFF;
        width: 100%;
        padding: 20px;
        box-sizing: border-box;
        border: none;
        border-radius: 4px;
        font: normal 17px /*'Roboto'*/;
        color: #8B8B8B;
        cursor: pointer;
    }

        .contact_form .buttons input[type=submit] {
            color: #333;
        }

/*Инфо-шашки*/
.checkers {
}

    .checkers .checker_box {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
    }

        .checkers .checker_box .grafic_checker {
            display: flex;
            flex-direction: row;
            justify-content: center;
            align-items: flex-end;
            order: 1;
            width: 50%;
        }

            .checkers .checker_box .grafic_checker .grafic {
                max-width: 700px;
                width: 100%;
            }

                .checkers .checker_box .grafic_checker .grafic img {
                    display: block;
                    width: 100%;
                }

        .checkers .checker_box .text_checker {
            display: flex;
            flex-direction: row;
            justify-content: center;
            align-items: center;
            order: 2;
            width: 50%;
        }

            .checkers .checker_box .text_checker .text {
                text-align: left;
                font: normal 15px/25px /*'Roboto'*/;
                color: #1D1D1B;
                max-width: 450px;
                width: 100%;
                padding: 25px;
            }

                .checkers .checker_box .text_checker .text h3 {
                    font: normal 35px /*'Gothic'*/;
                    margin: 0 0 15px 0;
                    padding: 0;
                    display: block;
                    color: #333;
                }

        .checkers .checker_box:nth-child(2n) .grafic_checker {
            order: 2;
            background: #ccc;
        }

        .checkers .checker_box:nth-child(2n) .text_checker {
            order: 1;
            width: 50%;
        }

        .checkers .checker_box .text_checker .text > div a {
            display: inline-block;
            border: solid 2px #333;
            padding: 10px 18px;
            border-radius: 50px;
            font: normal 14px Roboto;
            color: #333;
            cursor: pointer;
            text-decoration: none;
            margin: 15px 0 0 0;
            -webkit-transition: all 0.2s ease;
            -moz-transition: all 0.2s ease;
            -ms-transition: all 0.2s ease;
            -o-transition: all 0.2s ease;
            transition: all 0.2s ease;
        }

            .checkers .checker_box .text_checker .text > div a:hover {
                background: #333;
                color: #ffffff;
            }

/*Навигационное меню*/
.navigation {
    position: fixed;
    top: 0;
    right: 0;
    left: 110%;
    bottom: 0;
    width: 20%;
    background: #333;
    box-shadow: 0px 0px 33px #0000006b;
    padding: 80px 0 0 0;
    z-index: 2;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

    .navigation.active {
        left: 80%;
    }

    .navigation .close_navigation {
        position: absolute;
        right: 15px;
        top: 15px;
        width: 45px;
        height: 45px;
        cursor: pointer;
        -webkit-transition: all 0.2s ease;
        -moz-transition: all 0.2s ease;
        -ms-transition: all 0.2s ease;
        -o-transition: all 0.2s ease;
        transition: all 0.2s ease;
    }

        .navigation .close_navigation img {
            display: block;
            width: 100%;
            height: auto;
        }

    .navigation ul {
        list-style: none;
        margin: 0;
        padding: 50px 30px;
    }

        .navigation ul li a {
            display: block;
            padding: 10px 15px;
            font: normal 20px/25px /*'Roboto'*/;
            text-decoration: none;
            color: #FFFFFF;
            -webkit-transition: all 0.2s ease;
            -moz-transition: all 0.2s ease;
            -ms-transition: all 0.2s ease;
            -o-transition: all 0.2s ease;
            transition: all 0.2s ease;
        }

            .navigation ul li a:hover {
                background: #ffffff12;
            }

/*Общие правила для страницы контента*/
.page {
    max-width: 1300px;
    margin: 0 auto;
    padding: 75px 25px;
}

    .page .page_head {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: space-between;
        align-items: center;
        margin: 0 0 45px 0;
    }

        .page .page_head h1 {
            display: block;
            margin: 0 0 0 0;
            padding: 0;
            font: normal 35px /*'Gothic'*/;
            color: #333;
            width: 100%;
        }

        .page .page_head .page_search {
            flex-basis: 250px;
            flex-shrink: 0;
            flex-grow: 0;
        }

            .page .page_head .page_search input {
                padding: 10px 15px;
                box-sizing: border-box;
                font: normal 17px /*'Roboto'*/;
                border: none;
                width: 100%;
            }

                .page .page_head .page_search input::-webkit-input-placeholder {
                    font: normal 17px /*'Roboto'*/;
                }

                .page .page_head .page_search input:focus::-webkit-input-placeholder {
                    color: transparent;
                }

                .page .page_head .page_search input:focus::-moz-placeholder {
                    color: transparent;
                }

                .page .page_head .page_search input:focus::-ms-input-placeholder {
                    color: transparent;
                }

    .page .text {
        font: normal 15px/21px /*'Roboto'*/;
    }

/*Оформление видеогалереи*/
.video_list {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 50px;
    grid-row-gap: 50px;
}

    .video_list .element {
    }

        .video_list .element.rta-add-btn {
            display: flex;
            align-self: center;
            justify-content: center;
        }

        .video_list .element .add {
            display: inline-block;
            border: solid 2px #333;
            padding: 15px 45px;
            border-radius: 50px;
            font: normal 18px Roboto;
            color: #333;
            cursor: pointer;
            -webkit-transition: all 0.2s ease;
            -moz-transition: all 0.2s ease;
            -ms-transition: all 0.2s ease;
            -o-transition: all 0.2s ease;
            transition: all 0.2s ease;
        }

            .video_list .element .add:hover {
                background: #333;
                color: #ffffff;
            }

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

            .video_list .element .player iframe,
            .video_list .element .player object,
            .video_list .element .player embed {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
            }

        .video_list .element .element_info {
            margin: 15px 0 0 0;
        }

            .video_list .element .element_info .name {
                font: normal 16px /*'Roboto'*/;
                padding: 0 40px 0 0;
            }

        .video_list .element .control {
            margin: 0 0 8px 0;
        }

            .video_list .element .control .removeVideo {
                position: relative;
                display: inline-block;
                background: #333;
                font: normal 16px/25px /*'Roboto'*/;
                padding: 5px 20px 5px 40px;
                border-radius: 500px;
                cursor: pointer;
                color: #FFFFFF;
                -webkit-transition: all 0.2s ease;
                -moz-transition: all 0.2s ease;
                -ms-transition: all 0.2s ease;
                -o-transition: all 0.2s ease;
                transition: all 0.2s ease;
            }

                .video_list .element .control .removeVideo:hover {
                    background: #ef2d0d;
                }

                .video_list .element .control .removeVideo:before {
                    content: ' ';
                    display: block;
                    position: absolute;
                    left: 10px;
                    top: 7px;
                    width: 20px;
                    height: 20px;
                    background-image: url(../images/delete.svg);
                    background-repeat: no-repeat;
                    background-size: cover;
                }

/*Попап стили*/
.popup_wrapper {
    display: none;
    align-items: center;
    justify-content: center;
    position: fixed;
    padding: 45px 35px;
    background: #00000094;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 1;
}

    .popup_wrapper.active {
        display: flex;
    }

.popup {
    display: none;
    position: relative;
    max-width: 450px;
    width: 100%;
    background: #ffffff;
    border-radius: 8px;
    padding: 30px;
}

    .popup.active {
        display: block;
    }

    .popup .close_popup {
        position: absolute;
        top: -25px;
        right: -25px;
        width: 30px;
        height: 30px;
        padding: 10px;
        border-radius: 50px;
        background: #333;
        cursor: pointer;
        -webkit-transition: all 0.2s ease;
        -moz-transition: all 0.2s ease;
        -ms-transition: all 0.2s ease;
        -o-transition: all 0.2s ease;
        transition: all 0.2s ease;
    }

        .popup .close_popup:hover {
            transform: rotate(180deg);
        }

        .popup .close_popup img {
            display: block;
            width: 100%;
            height: auto;
        }

    /*Форма добавления*/
    .popup .add_form .field {
        margin: 0 0 25px 0;
    }

        .popup .add_form .field input[type=text], .popup .add_form .field input[type=password] {
            padding: 15px 15px;
            box-sizing: border-box;
            font: normal 17px /*'Roboto'*/;
            border: none;
            width: 100%;
            border-bottom: solid 1px #ccc;
            color: #333;
        }

            .popup .add_form .field input[type=text]::-webkit-input-placeholder, .popup .add_form .field input[type=password]::-webkit-input-placeholder {
                font: normal 17px /*'Roboto'*/;
                color: #a4a4a4;
            }

            .popup .add_form .field input[type=text]:focus::-webkit-input-placeholder, .popup .add_form .field input[type=password]:focus::-webkit-input-placeholder {
                color: transparent;
            }

            .popup .add_form .field input[type=text]:focus::-moz-placeholder, .popup .add_form .field input[type=password]:focus::-moz-placeholder {
                color: transparent;
            }

            .popup .add_form .field input[type=text]:focus::-ms-input-placeholder, .popup .add_form .field input[type=password]:focus::-ms-input-placeholder {
                color: transparent;
            }

    .popup .add_form .submit input {
        padding: 10px 15px;
        box-sizing: border-box;
        font: normal 17px /*'Roboto'*/;
        border: none;
        width: 100%;
        border-bottom: solid 1px #ccc;
        border-radius: 4px;
        background: #efefef;
        cursor: pointer;
        -webkit-transition: all 0.2s ease;
        -moz-transition: all 0.2s ease;
        -ms-transition: all 0.2s ease;
        -o-transition: all 0.2s ease;
        transition: all 0.2s ease;
    }

        .popup .add_form .submit input:hover {
            background: #333;
            color: #ffffff;
        }


    .popup .add_form .field_file {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: center;
    }

        .popup .add_form .field_file label {
            display: block;
            flex-basis: 150px;
            background: #333;
            color: #ffffff;
            padding: 10px 15px;
            box-sizing: border-box;
            font: normal 14px /*'Roboto'*/;
            text-align: center;
            border-radius: 4px;
            cursor: pointer;
        }

        .popup .add_form .field_file .file_name {
            padding: 0 0 0 15px;
            font: normal 14px /*'Roboto'*/;
            color: #333333;
        }






.select {
    position: relative;
    display: block;
    min-width: 220px;
    width: 100%;
}

.select_head {
    width: 100%;
    max-width: 100%;
    cursor: pointer;
    box-sizing: border-box;
    color: #a4a4a4;
    padding: 15px 15px;
    box-sizing: border-box;
    font: normal 17px /*'Roboto'*/;
    border: none;
    width: 100%;
    border-bottom: solid 1px #ccc;
    margin: 0 0 25px 0;
}

    .select_head.selected {
        color: #333;
    }

    .select_head::after {
        width: 10px;
        height: 6px;
        background: #FFF url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.50495 5.78413L0.205241 1.25827C-0.0684138 0.970375 -0.0684138 0.503596 0.205241 0.215836C0.478652 -0.0719461 0.922098 -0.071946 1.19549 0.215837L5.00007 4.22052L8.80452 0.215953C9.07805 -0.0718292 9.52145 -0.0718292 9.79486 0.215953C10.0684 0.503736 10.0684 0.970492 9.79486 1.25839L5.49508 5.78425C5.35831 5.92814 5.17925 6 5.00009 6C4.82085 6 4.64165 5.928 4.50495 5.78413Z' fill='%23ED266A'/%3E%3C/svg%3E%0A") no-repeat center / cover;
        position: absolute;
        right: 10px;
        bottom: 50%;
        transform: translateY(50%);
        content: '';
        display: block;
        transition: .2s ease-in;
    }

    .select_head.open::after {
        transform: translateY(50%) rotate(180deg);
    }

.select_list {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #eeeeee;
    margin-top: 5px;
    max-height: 205px;
    overflow-x: hidden;
    overflow-y: auto;
    z-index: 100;
    margin: 0;
    padding: 0;
    font-size: 14px;
    color: #424348;
    scrollbar-color: dark;
    scrollbar-width: thin;
    overscroll-behavior: contain;
    font: normal 17px /*'Roboto'*/;
}

    .select_list::-webkit-scrollbar {
        width: 7px;
        background-color: #F8F9FA;
        padding: 5px;
    }

    .select_list::-webkit-scrollbar-thumb {
        border-radius: 10px;
        background-color: #D9D9D9;
    }

    .select_list .select_item {
        position: relative;
        border-top: 1px solid rgba(224, 229, 231, 0.5);
        padding: 15px;
        cursor: pointer;
        list-style-type: none;
    }

        .select_list .select_item:hover {
            background-color: rgba(224, 229, 231, 0.5);
        }












/*Логин-пароль*/
.login_wrapper {
    padding: 150px 50px;
}

    .login_wrapper .login {
        position: relative;
        max-width: 450px;
        margin: 0 auto;
        padding: 30px;
        box-sizing: border-box;
        background: #333;
        overflow: hidden;
    }

        .login_wrapper .login h1 {
            display: block;
            margin: 0 0 15px 0;
            padding: 0;
            color: #ffffff;
            font: normal 25px /*'Gothic'*/;
        }




        .login_wrapper .login:after {
            content: "";
            position: absolute;
            background: url(../images/white_logo.svg) 0 0 no-repeat;
            background-size: cover;
            width: 1000px;
            height: 300px;
            top: 0;
            right: -225px;
            z-index: 0;
            opacity: 0.2;
        }

        .login_wrapper .login form {
            position: relative;
            z-index: 1;
        }

        .login_wrapper .login .login_logo {
            position: absolute;
        }

        .login_wrapper .login .field {
            margin: 0 0 15px 0;
        }

            .login_wrapper .login .field input {
                padding: 15px 20px;
                box-sizing: border-box;
                font: normal 17px /*'Roboto'*/;
                border: none;
                width: 100%;
                border-radius: 4px;
                background: #efefef;
            }

                .login_wrapper .login .field input::-webkit-input-placeholder {
                    font: normal 17px /*'Roboto'*/;
                }

                .login_wrapper .login .field input:focus::-webkit-input-placeholder {
                    color: transparent;
                }

                .login_wrapper .login .field input:focus::-moz-placeholder {
                    color: transparent;
                }

                .login_wrapper .login .field input:focus::-ms-input-placeholder {
                    color: transparent;
                }



                .login_wrapper .login .field input.error::-webkit-input-placeholder {
                    font: normal 17px /*'Roboto'*/;
                    color: #ff6000;
                }

                .login_wrapper .login .field input.error:focus::-webkit-input-placeholder {
                    color: transparent;
                }

                .login_wrapper .login .field input.error:focus::-moz-placeholder {
                    color: transparent;
                }

                .login_wrapper .login .field input.error:focus::-ms-input-placeholder {
                    color: transparent;
                }


        .login_wrapper .login .submit input {
            padding: 10px 15px;
            box-sizing: border-box;
            font: normal 17px /*'Roboto'*/;
            border: none;
            display: inline-block;
            border-radius: 4px;
            background: #d13a21;
            cursor: pointer;
            color: #ffffff;
        }

            .login_wrapper .login .submit input:hover {
                background: #b12710;
            }

form .field_error {
    display: none;
    font: normal 14px /*'Roboto'*/;
    color: #333;
    margin: 0 0 25px 0;
}

    form .field_error.active {
        display: block;
    }



/*Дистрибутивы*/
.i_table {
    font: normal 14px /*'Roboto'*/;
    /*overflow-x: scroll;*/
}

    .i_table table {
        width: 100%;
        border-collapse: collapse;
        overflow-x: scroll;
        min-width: 600px;
    }

        .i_table table td {
            border: solid 1px #ccc;
            padding: 15px;
        }

        .i_table table tr:nth-child(2n) {
            background: #f9f9f9;
        }

        .i_table table tr:first-child td {
            background: #333;
            border: solid 1px #333;
            color: #FFFFFF;
        }

        .i_table table td div.controls {
            display: flex;
            flex-direction: row;
            flex-wrap: nowrap;
            justify-content: flex-start;
            grid-gap: 10px;
        }

            .i_table table td div.controls span {
                display: block;
                width: 30px;
                cursor: pointer;
            }

            .i_table table td div.controls a {
                display: block;
                width: 30px;
                cursor: pointer;
            }

            .i_table table td div.controls div img {
                display: block;
                width: 100%;
                height: auto;
            }

        .i_table table td.add_table_obj {
            background: #f9f9f9;
            padding: 0px;
        }

            .i_table table td.add_table_obj span {
                display: inline-block;
                background: #f9f9f9;
                padding: 15px;
                cursor: pointer;
                border-right: solid 1px #ccc;
                color: #333;
                -webkit-transition: all 0.2s ease;
                -moz-transition: all 0.2s ease;
                -ms-transition: all 0.2s ease;
                -o-transition: all 0.2s ease;
                transition: all 0.2s ease;
            }

                .i_table table td.add_table_obj span:hover {
                    background: #eeeeee;
                }

        .i_table table tbody tr td.name {
            width: 50%;
        }

        .i_table table tbody tr td.prop {
            width: 25%;
        }

        .i_table table tbody tr td.controls {
            width: 25%;
        }

div.validation-summary-errors {
    padding: 15px;
}

.validation-summary-errors ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

    .validation-summary-errors ul li {
        font: normal 14px /*'Roboto'*/;
        color: #333;
    }