a {
    text-decoration: none;
    /*color:#B8860B;*/
}

a:hover {
    /*color:#A0522D;*/
}

a:after {
    content: "" !important;
}

body {
    background-color: #DEB887;
    color: #000000;
    font-family: Arial;
    /*Verdana  Arial*/
    font-weight: normal;
    font-size: 14px;
    line-height: normal;
    margin: 0;
}

/*таблицы*/
.utab {
    font-size: 1.2em;
    /*border-collapse: collapse;*/
    text-align: center;
    margin: 5px 0;

}

th {
    border: 1px solid grey;
    background: #DEB887;
    padding: 3px 7px;
}

td {
    border: 1px solid grey;
    background: #ffffff;
    padding: 3px 7px;
}

tr.tcur {}

tr.tcur:hover {

    color: #003bff;
    cursor: pointer;
}


#container {
    /*border:2px solid #7cfc00;*/
    width: 970px;
    position: relative;
    margin: 0 auto;
    text-align: left;
}

/*Блок меню*/
#menu {
    height: 70px;
    background-color: #696969;
    margin-bottom: 10px;
}

/*CSS меню*/

/* END CSS меню */

.tl {
    text-align: left;

}

.tc {
    text-align: center;

}

.logo {
    margin-top: 10%;
    padding: 20px;
    text-align: center;

}

.u_mod1 {
    text-align: center;
}

/*Заголовок*/
.u_header {

    margin: 3px 10px;
    background-color: #FFEBCD;
    border: 2px #B8860B solid;
    border-radius: 7px;
    padding: 5px;
    text-align: center;

}

.u_name_header {
    flex: auto;
    margin: 0 40px;
    background-color: #FFFFFF;
    border: 2px #B8860B solid;
    border-radius: 7px;
    padding: 10px;
    text-align: center;
}

.u_header2 {
    flex: auto;
    background-color: #FFFFFF;
    border: 2px #B8860B solid;
    border-radius: 7px;
    padding: 10px;
    margin: 0 50px 0 0;
    text-align: center;
}

.u_header3 {

    margin: 3px 55px;
    background-color: #FFEBCD;
    border: 2px #B8860B solid;
    border-radius: 7px;
    padding: 3px;
    text-align: center;

}

.u_name_h2 {
    flex: auto;
    background-color: #FFFFFF;
    border: 2px #B8860B solid;
    border-radius: 7px;
    padding: 10px;
    text-align: center;
}

.p_hst1 {
    margin: 0 3px 0 55px;
}

.p_hst2 {
    margin: 0 3px;
}

.p_hst {
    margin: 3px 20px;
}


.p_hst3 {
    margin: 0 55px;
}

.p_hst4 {
    margin: 0 55px 0 3px;
}

.p_hst5 {
    padding: 3px;
    width: 200px;
}

.p_hst6 {
    padding: 3px;
    width: 99%;
}

.p_hst7 {
    margin: 6px 0;
}

.p_hst8 {
    margin: 6px 20px;
}

.p_hst9 {
    margin: 0px 3px;
}

.mt1 {
    margin-top: 5px;
}

/*Размеры для поля ввода*/
.r1 {
    width: 100%;
}

.r2 {
    width: 98%;
}

.r3 {
    width: 750px;
}

.r4 {
    width: 670px;
}

.r5 {
    width: 50%;
}

.r6 {
    width: 10%;
}

/*Разделы*/
.partition {
    background-color: #FFEBCD;
    background-image: none;
    border: 2px #B8860B solid;
    border-radius: 5px;
    padding: 10px;
    margin: 6px;
}

/*Разделы*/
.ppartition {
    /*    -webkit-flex-grow: 1;
    flex-grow: 1;*/
    flex: auto;
    background-color: #FFEBCD;
    border: 2px #B8860B solid;
    padding: 10px;
    border-radius: 7px;
    /*margin: 0 5px;*/

}

.ppartition2 {
    /*    -webkit-flex-grow: 1;
    flex-grow: 1;*/
    flex: auto;
    background-color: #ffffff;
    border: 2px #B8860B solid;
    padding: 10px;
    border-radius: 7px;
    /*margin: 0 5px;*/

}

/*Кнопки стилей*/
.u_button_style {
    cursor: pointer;
    border: 1px solid #B8860B;
    border-radius: 2px;
    /*width:80px;*/
    height: 15px;
    margin: 2px 5px;
    cursor: pointer;
    -webkit-flex-grow: 1;
    /* Safari */
    flex-grow: 1;
}

.u_button_style2 {
    font-size: 1em;
    cursor: pointer;
    border: 1px solid #B8860B;
    border-radius: 2px;
    text-align: center;
    /*height: 15px;*/
    margin: 0px 7px;
    cursor: pointer;
    -webkit-flex-grow: 1;
    /* Safari */
    flex-grow: 1;
    height: auto;
    align-self: stretch;

}

.u_button_style2:hover {
    background-color: #ffe86d;
}

.u_button_style3 {
    font-size: 0.9em;
    font-weight: 600;
    cursor: pointer;
    border: 2px solid #B8860B;
    border-radius: 50px;
    text-align: center;
    /*height: 15px;*/
    margin: 0px 5px;
    cursor: pointer;
    -webkit-flex-grow: 1;
    /* Safari */
    flex-grow: 1;
    height: auto;
    align-self: stretch;
    padding: 1px 4px;

}

.u_button_style3:hover {
    background-color: #ffe86d;
}

/*стили этапов. подсветка активной кнопки*/
.u_button_green {
    background-color: #73ff6d;
}

#u_st1 {
    background-color: #DEB887;
}

#u_st2 {
    background-color: #B0C4DE;
}

#u_st3 {
    background-color: #D8BFD8;
}

#u_st4 {
    background-color: #4682B4;
}

#u_st5 {
    background-color: #fdfdfd;
}

/* END Кнопки стилей*/
/*Поле для расположение блоков слева*/
.flex_left {
    /*border:2px dotted red;*/
    display: flex;
    /*
	http://frontender.info/a-guide-to-flexbox
	http://css-live.ru/articles/vizualnoe-rukovodstvo-po-svojstvam-flexbox-iz-css3.html
*/
    flex-direction: row;
    /*слева направо*/
    -webkit-flex-direction: row;
    /* Safari */
    flex-wrap: nowrap;
    /*однострочный*/
    justify-content: flex-start;
    /*элементы сдвигаются к началу строки*/
    align-items: center;
    /*элементы выравниваются по центру поперечной оси;*/
    align-content: center;
    /*строки выравниваются по центру контейнера;*/
}

/* Поле для расположения блоков справа*/
.flex_right {
    /*margin-top: 5px;*/
    /*border:2px dotted red;*/
    display: flex;
    flex-direction: row-reverse;
    /* справо на лево*/
    -webkit-flex-direction: row-reverse;
    /* Safari */
    flex-wrap: nowrap;
    /*однострочный*/
    justify-content: flex-start;
    /*элементы сдвигаются к началу строки*/
    align-items: center;
    /*элементы выравниваются по центру поперечной оси;*/
    align-content: center;
    /*строки выравниваются по центру контейнера;*/
}

/* Поле для расположения блоков в центре*/
.flex_center {
    /*margin-top: 5px;*/
    /*border:2px dotted red;*/
    display: flex;
    flex-direction: row;
    /*слева направо*/
    flex-wrap: nowrap;
    /*однострочный*/
    justify-content: center;
    /*элементы выравниваются по центру*/
    -webkit-justify-content: center;
    /* Safari */
    align-items: center;
    /*элементы выравниваются по центру поперечной оси;*/
    align-content: center;
    /*строки выравниваются по центру контейнера;*/
}
.flex_center2 {
    /*margin-top: 5px;*/
    /*border:2px dotted red;*/
    display: flex;
    flex-direction: row;
    /*слева направо*/
    flex-wrap: nowrap;
    /*однострочный*/
    justify-content: space-between;
    /*элементы распределяются по всей строке*/
    -webkit-justify-content: space-between;
    /* Safari */
    align-items: center;
    /*элементы выравниваются по центру поперечной оси;*/
    align-content: center;
    /*строки выравниваются по центру контейнера;*/
}
/*Тема раздела*/
.part_topic {
    background-color: #ffffff;
    border: 2px #FFEBCD solid;
    border-radius: 5px;
    padding: 10px;
    margin: 3px 0px 3px 5px;
}

.block1 {
    margin: 6px 60px;
}

.block2 {
    margin: 3px 60px 3px 15px;
}

.block3 {
    margin: 3px 55px 6px;
}

.block4 {
    margin: 3px 5px 6px;
}

/*растягиваем блок ссылку до максимума относительно других блоков*/
.block_auto_flex {
    flex: auto;
    /*	flex-grow:1;*/
}

/*текст заголовков*/
.txt_header {
    color: #000000;
    /*font-family:Verdana;*/
    font-size: 16px;
    font-weight: bold;
}

/*силь кнопки power*/
.txt_ico_power_on {
    color: #67ff73;
    cursor: pointer;
    border: 2px solid #ffebcd;
    border-radius: 7px;
    text-align: center;
    padding: 2px;
    margin: 0px 3px;
    background-color: #b8860b;
}

/*Текстовые иконки*/
.txt_ico {
    cursor: pointer;
    border: 2px solid #ffebcd;
    border-radius: 7px;
    text-align: center;
    padding: 2px;
    color: #B8860B;
    /*font-size:16px;*/
    margin: 0px 3px;
    /*width: 29px;*/
}

.txt_ico2 {
    cursor: pointer;
    border: 2px solid #DEB887;
    border-radius: 7px;
    text-align: center;
    padding: 2px;
    color: #FFEBCD;
    /*font-size:16px;*/
    margin: 0px 5px;
    width: 29px;
}

.txt_ico3 {
    cursor: pointer;
    text-align: center;
    padding: 2px;
    color: #B8860B;
}

/*Блок этапа темы*/
.block_stage {
    border: 1px #B8860B solid;
    border-radius: 7px;
    margin: 5px 0px;
    padding: 7px;
    background-color: #FFEBCD;
}

.block_stage3 {

    margin: 5px 40px;
    padding: 5px 5px;
    background-color: #FFEBCD;
    border-radius: 7px;
    border: 2px #B8860B solid;
}

/* картинка в этапе*/
.block_image {
    /*	border: 1px #A9A9A9 solid;*/
    margin: 7px auto;
    text-align: center;
}

.img {
    width: 100%;
}

/* заголовок этапа*/
.nstage {

    background-color: #FFFFFF;
    border: 2px #B8860B solid;
    border-radius: 7px;
    padding: 5px;
    text-align: center;
}

/*текст блока темы под картинкой*/
.txt_stage {
    background-color: white;
    border: 1px #A9A9A9 solid;
    margin: 5px auto;
    padding: 7px;
    border-radius: 5px;
    text-align: left;
}

.color1 {
    background-color: #DEB887;
    background: -moz-linear-gradient(bottom, #DEB887 0%, #F5DEB3 100%);
    background: -webkit-linear-gradient(bottom, #DEB887 0%, #F5DEB3 100%);
    background: -o-linear-gradient(bottom, #DEB887 0%, #F5DEB3 100%);
    background: -ms-linear-gradient(bottom, #DEB887 0%, #F5DEB3 100%);
    background: linear-gradient(bottom, #DEB887 0%, #F5DEB3 100%);
    border: 1px #DEB887 solid;
}

.color1:hover {
    background-color: #F5DEB3;
    background: -moz-linear-gradient(bottom, #F5DEB3 0%, #DEB887 100%);
    background: -webkit-linear-gradient(bottom, #F5DEB3 0%, #DEB887 100%);
    background: -o-linear-gradient(bottom, #F5DEB3 0%, #DEB887 100%);
    background: -ms-linear-gradient(bottom, #F5DEB3 0%, #DEB887 100%);
    background: linear-gradient(bottom, #F5DEB3 0%, #DEB887 100%);
}

.color2 {
    background-color: #DEB887;
    background: -moz-linear-gradient(bottom, #b98d55 0%, #dcbf8a 100%);
    background: -webkit-linear-gradient(bottom, #b98d55 0%, #dcbf8a 100%);
    background: -o-linear-gradient(bottom, #b98d55 0%, #dcbf8a 100%);
    background: -ms-linear-gradient(bottom, #b98d55 0%, #dcbf8a 100%);
    background: linear-gradient(bottom, #b98d55 0%, #dcbf8a 100%);
    border: 1px #DEB887 solid;
    /*border: 4px #bd906a solid;*/
}

.color2:hover {
    background-color: #F5DEB3;
    background: -moz-linear-gradient(bottom, #F5DEB3 0%, #DEB887 100%);
    background: -webkit-linear-gradient(bottom, #F5DEB3 0%, #DEB887 100%);
    background: -o-linear-gradient(bottom, #F5DEB3 0%, #DEB887 100%);
    background: -ms-linear-gradient(bottom, #F5DEB3 0%, #DEB887 100%);
    background: linear-gradient(bottom, #F5DEB3 0%, #DEB887 100%);
}

.color3 {
    background-color: #DEB887;
    background: -moz-linear-gradient(bottom, #b98d55 0%, #dcbf8a 100%);
    background: -webkit-linear-gradient(bottom, #b98d55 0%, #dcbf8a 100%);
    background: -o-linear-gradient(bottom, #b98d55 0%, #dcbf8a 100%);
    background: -ms-linear-gradient(bottom, #b98d55 0%, #dcbf8a 100%);
    background: linear-gradient(bottom, #b98d55 0%, #dcbf8a 100%);
    border: 1px #DEB887 solid;
    /*background-color: #fff5e1;
    -webkit-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.075), 0px 0px 8px rgba(162, 90, 37, 0.83);
    -moz-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.075), 0px 0px 8px rgba(162, 90, 37, 0.83);
    box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.075), 0px 0px 8px rgba(162, 90, 37, 0.83);
    outline: 0;*/
}

.shadow {}

.shadow:hover {
    -webkit-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.075), 0px 0px 8px rgba(160, 82, 45, 0.60);
    -moz-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.075), 0px 0px 8px rgba(160, 82, 45, 0.60);
    box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.075), 0px 0px 8px rgba(160, 82, 45, 0.60);
    outline: 0;

    color: #A0522D;
    border-color: #A0522D;

}

.shadow2 {}

.shadow2:hover {
    color: #A0522D;
    border-color: #A0522D;
}

.shadow4 {
    border: 4px solid #B8860B;
}

.shadow4:hover {
    -webkit-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.075), 0px 0px 8px rgba(160, 82, 45, 0.60);
    -moz-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.075), 0px 0px 8px rgba(160, 82, 45, 0.60);
    box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.075), 0px 0px 8px rgba(160, 82, 45, 0.60);
    outline: 0;

    color: #A0522D;
    border-color: #A0522D;
}



.sfon {}

.sfon:hover {
    background-color: #79ff68;
}

.sfon2 {}

.sfon2:hover {
    background-color: #ffc2c2;
}


.button_desk {

    border: 2px #B8860B solid;
    border-radius: 7px;
    margin: 5px 5px;
    padding: 50px 195px;
    background-color: #FFEBCD;

}

.button_stage {
    cursor: pointer;
    border-radius: 3px;
    padding: 7px;
    margin-right: 50%;
    font-weight: bold;

}

.button_stage2 {
    cursor: pointer;
    border-radius: 3px;
    padding: 0px;
    margin-right: 50%;
    font-weight: bold;
    font-size: 1.5em;
    width: 50%;

}

.button_stage3 {
    cursor: pointer;
    border-radius: 3px;
    padding: 7px;
    font-weight: bold;

}

/*Кнопка ОК в этапах*/
.button_stage_ok {

    font-weight: bold;
    cursor: pointer;
    border-radius: 3px;
    padding: 7px;
    width: 98px;
    text-align: center;
}

.u_button_key {
    cursor: pointer;
    border: 2px solid #a06d56;
    border-radius: 7px;
    text-align: center;
    padding: 2px 40px;
    color: #a06d56;
    background-color: rgba(0, 0, 0, 0);
    font-size: 14px;
    margin-top: 10px;
}

.u_button_key:hover {
    -webkit-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.075), 0px 0px 8px rgb(62, 20, 0);
    -moz-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.075), 0px 0px 8px rgb(62, 20, 0);
    box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.075), 0px 0px 8px rgb(62, 20, 0);
    outline: 0;

    color: #834121;
    border-color: #834121;

}



/* кнопки ответов */

.form_radio_btn {
    /*display: inline-block;*/
    margin: 0 5px;
}

.form_radio_btn input[type=radio] {
    display: none;
}

.form_radio_btn label {


    cursor: pointer;
    user-select: none;
    background-color: #ffffff;
    border: 2px #B8860B solid;
    padding: 10px;
    border-radius: 7px;
    width: 100%;
    font-size: 16px;


}

/* Checked */
.form_radio_btn input[type=radio]:checked + label {
    background-color: #bbffbb;
}

/* Hover */
.form_radio_btn label:hover {
    background-color: #79ff68;
}

/*------*/
.form_toggle {

    text-align: center;


}

.form_toggle-item {
    display: inline-block;
}

.form_toggle-item input[type=radio] {
    display: none;
}

.form_toggle-item label {
    cursor: pointer;
    user-select: none;
    background-color: #ffffff;
    border: 2px #B8860B solid;
    padding: 10px;
    border-radius: 7px;
    width: 250px;
    margin: 6px 20px;
    font-size: 16px;

}

.form_toggle .item-1 label:hover {

    background-color: #ffc2c2;
}

.form_toggle .item-2 label:hover {
    background-color: #79ff68;

}

/* Checked */
.form_toggle .item-1 input[type=radio]:checked + label {
    background: #ffc5c5;
}

.form_toggle .item-2 input[type=radio]:checked + label {
    background: #79ff68;
}





.pass_box {
    width: 250px;
    height: 30px;
    /*line-height:18px;  */

    border: 1px #CCCCCC solid;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    border-radius: 7px;
    background-color: #FFFFFF;
    background-image: none;
    color: #000000;
    font-weight: normal;
    font-size: 20px;
    padding: 2px;
    text-align: center;
    vertical-align: middle;
    margin: 5px 0;
}

.pass_box:focus {
    border-color: #834121;
    -webkit-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.075), 0px 0px 8px rgba(0, 0, 0, 0.60);
    -moz-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.075), 0px 0px 8px rgba(0, 0, 0, 0.60);
    box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.075), 0px 0px 8px rgba(0, 0, 0, 0.60);
    outline: 0;
}



/* Бегунок */
.slider-track {
    background-image: -webkit-linear-gradient(top, #ffffff 0, #ffffff 100%);
    background-image: -o-linear-gradient(top, #ffffff 0, #ffffff 100%);
    background-image: linear-gradient(to bottom, #ffffff 0, #ffffff 100%);

}

.slider-tick {
    background-image: -webkit-linear-gradient(top, #ffffff 0, #ffffff 100%);
    background-image: -o-linear-gradient(top, #ffffff 0, #ffffff 100%);
    background-image: linear-gradient(to bottom, #ffffff 0, #ffffff 100%);

}

.slider-handle {
    background-image: linear-gradient(to bottom, #b8860b 0, #b8860b 100%);
}

.slider-selection.tick-slider-selection {
    background-image: linear-gradient(to bottom, #ffdead 0, #deb887 100%);
}


.slider-tick.in-selection {
    background-image: linear-gradient(to bottom, #b8860b 0, #b8860b 100%);
}

/* END бегунок */



@media only screen and (min-width: 720px) and (max-width: 969px) {
    #container {
        width: 720px;
    }

    #header {}

    .partition {
        /*   
   margin: 6px 20px;
*/
    }

    .part_topic {}

    .button_desk {
        padding: 50px 132px;
    }

    .img {
        display: block;
        opacity: 1;
        -webkit-transform: scale(1, 1);
        -webkit-transition-timing-function: ease-out;
        -webkit-transition-duration: 450ms;
        -moz-transform: scale(1, 1);
        -moz-transition-timing-function: ease-out;
        -moz-transition-duration: 550ms;
    }

    .img:hover {
        -webkit-transform: scale(1.2, 1.2);
        -webkit-transition-timing-function: ease-out;
        -webkit-transition-duration: 550ms;
        -moz-transform: scale(1.2, 1.2);
        -moz-transition-timing-function: ease-out;
        -moz-transition-duration: 550ms;
    }
}

/*CSS меню*/

/* END CSS меню */

@media only screen and (min-width: 480px) and (max-width: 719px) {
    #container {
        width: 480px;
    }

    #header {}

    .u_header {
        margin: 3px 3px;
    }

    .u_name_header {
        margin: 0 5px;
    }

    .u_header2 {
        flex: auto;
        margin: 0 5px 0 0;
    }

    .u_header3 {
        margin: 3px 10px 3px 10px;
    }

    .block_stage3 {

        margin: 5px 0;
    }

    .partition {
        margin: 6px 5px;
    }

    .part_topic {}

    .block2 {
        margin: 3px 15px 3px 15px;
    }

    .block3 {
        margin: 3px 15px 3px 15px;
    }

    .block1 {
        margin: 6px 10px;
    }

    .button_desk {
        padding: 30px 190px;
    }

    .img {
        display: block;
        opacity: 1;
        -webkit-transform: scale(1, 1);
        -webkit-transition-timing-function: ease-out;
        -webkit-transition-duration: 450ms;
        -moz-transform: scale(1, 1);
        -moz-transition-timing-function: ease-out;
        -moz-transition-duration: 550ms;
    }

    .img:hover {
        -webkit-transform: scale(1.2, 1.2);
        -webkit-transition-timing-function: ease-out;
        -webkit-transition-duration: 550ms;
        -moz-transform: scale(1.2, 1.2);
        -moz-transition-timing-function: ease-out;
        -moz-transition-duration: 550ms;
    }

    .r5 {
        width: 100%;
    }
}

/*CSS меню*/

/* END CSS меню */

@media only screen and (max-width: 479px) {
    #container {
        width: 320px;
    }

    #header {}

    .u_header {
        margin: 3px 3px;
    }

    .u_name_header {
        margin: 0 5px;
    }

    .u_header2 {
        margin: 0 5px 0 0;

    }

    .u_header3 {

        margin: 3px 10px 3px 10px;
    }

    .partition {
        margin: 6px 5px;
    }

    .part_topic {}


    .block1 {
        margin: 6px 10px;
    }

    .block2 {
        margin: 3px 15px 3px 15px;
    }

    .block3 {
        margin: 3px 15px 3px 15px;
    }


    .button_stage {
        margin-right: 0;
    }

    .block_stage3 {

        margin: 5px 0;
    }

    .button_stage2 {
        margin-right: 0;
        width: 100%;
    }

    .button_desk {
        padding: 20px 110px;
    }

    .img {
        display: block;
        opacity: 1;
        -webkit-transform: scale(1, 1);
        -webkit-transition-timing-function: ease-out;
        -webkit-transition-duration: 450ms;
        -moz-transform: scale(1, 1);
        -moz-transition-timing-function: ease-out;
        -moz-transition-duration: 550ms;
    }

    .img:hover {
        -webkit-transform: scale(1.2, 1.2);
        -webkit-transition-timing-function: ease-out;
        -webkit-transition-duration: 550ms;
        -moz-transform: scale(1.2, 1.2);
        -moz-transition-timing-function: ease-out;
        -moz-transition-duration: 550ms;
    }

    .fa-2x {
        font-size: 1.4em !important;
    }

    .txt_ico {
        /*width: 21px;*/
    }

    .txt_ico2 {
        width: 21px;
    }

    .part_topic {
        width: 220px;
    }

    .r5 {
        width: 100%;
    }

    .utab {
        font-size: 0.8em;

    }


}

/*CSS меню*/

/* END CSS меню */