

:root {
    --font1: "Montserrat", sans-serif;
    --font2: 'Nunito', sans-serif;

    --col1: gray;  /* 2 #413C58;/*#48304D; */
    --col2: #C8C4FD; /*  #e6f4ff;*/
    --col3: #ebebeb; /* fon*/
    --col4: #48304D;  /; /* #48304D;/*#584B53 wenge; */
    --col5: #b3deff; /* 2 #FEC8AF; */
    --colfortext: rgb(41, 41, 41);

    /*--topmenu_color: rgba(255,255,255,0.5);*/


    --bigbuttoncolor: #48304D;

    --roundedcolor: #FC814A;


}



body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td,section, article { padding: 0; margin: 0;
    margin-block-start: 0; margin-block-end: 0;}
li { list-style-type: none;}


.pad10 { padding: 10px;}


body {  color: var(--mainfontcolor); background: var(--mainbgcolor); font-family: var(--mainfont); font-size: var(--mainfontsize); line-height: var(--mainlineheight); }
a { color: var(--mainlinkcolor); cursor: pointer; }
a:hover { color: var(--highlightcolor);}

textarea { font-family: var(--polefont);  font-size: var(--polefontsize); }

h1, h2, h3, h4, h5 { font-family: var(--zagfont); font-weight: 600; font-style:normal; text-align: left; color: var(--zagcolor); line-height:28px; text-rendering: optimizeLegibility;
 text-size-adjust: 100%; visibility: visible; word-break: break-word;
 word-wrap: break-word; -webkit-font-smoothing: antialiased; text-transform:none; }

h1 { font-size: 30px; line-height: 34px; padding: 10px; font-family: 'MontserratAlt';}
h2 { padding-bottom: 20px;  font-size:24px; line-height:32px; margin-top: 40px; padding-left: 30px; }
h3 { padding-bottom: 20px; font-size: 20px; line-height:25px; margin-top: 40px; padding-left: 30px; }
p { padding-bottom: var(--padbot_main); font-family: var(--pfont); font-size: var(--fontsize_main); line-height: var(--lineheight_main); }
.comment, .ser { font-size: var(--fontsize_mini); }
.krupnee {  font-size: var(--fontsize_krupnee);  line-height: var(--lineheight_krupnee);}


.pole { min-width: 350px; max-width: 350px; padding: 5px; border: 1px /*#F8F5F1 /*#FFC05C*/ #b3deff /* #e3646c*/ solid; border-radius:5px;
background: var(--polebg);}
.w_350 {min-width: 350px;}
.w_250 {min-width: 250px; width: 250px; max-width: 250px;  }
.w_200 {min-width: 200px; width: 200px;  max-width: 200px;  }
.w_150 {min-width: 150px; width: 150px; max-width: 150px;  }
.w_100 {min-width: 100px; width: 100px;  max-width: 100px; }
.w_50 {min-width: 50px;  max-width: 50px; }
.w_35 {min-width: 35px;  max-width: 35px; }
.poleunlim { width: 100%; padding: 5px; border: 1px /*#F8F5F1 /*#FFC05C*/ #b3deff /* #e3646c*/ solid; border-radius:5px;
background: #F8F5F1; /*#FFF7EB; /* #FFEEE2;*/}
.nepole { padding: 5px; background: none; border: 0px; }
.bold { font-weight: 600;}


.topmenu_container { position: fixed; top:0; display: flex; flex-direction: column;
    background-color: var(--topmenu_color); width: 100%; height: var(--topmenu_height); z-index: 110;
     background: linear-gradient(74deg, rgba(255,255,255,1) 6%, rgba(56,128,224,0.5382528011204482) 47%, rgba(148,25,230,0.40940126050420167) 92%)}
    .topmenu_bread {  display: flex; flex-direction: row; }
    .topmenu { display: flex; flex-direction: row;}
        .topmenu_left_logo_place { flex-grow: 0; flex-shrink: 0; flex-basis: 250px;  }
        .topmenu_left_logo { height: 70px; padding: 0px 30px; max-width: 200px; width: 200px; padding-right: 30px; }

        .topmenu_mid_punkts_container { flex-grow: 1; display: flex; justify-content: flex-start; align-items: center; }
        .topmenu_mid_punkts_container a { margin-left: 50px; color: black;/*var(--topmenu_button_font_color);*/ font-family: 'MontserratAlt';}

        .topmenu_right_userdata { flex-grow: 0; flex-shrink: 0; flex-basis: 300px; display: flex; align-items: center; gap: 10px; justify-content: flex-end; padding-right: 20px; }
            .topmenu_login_place {display: flex; align-items: center; justify-content: center; border-radius:5px; padding: 5px; margin: 5px;  }
            .topmenu_login_place .icon { border: 1px sold black; margin-right: 10px;}
            .topmenu_login_place a { padding: 15px; color: white; text-decoration: none; font-family: var(--topbuttonfont); font-size: 14px; }
            .topmenu_login_place a:hover { color: var(--topmenu_button_hover); }

.topmenu_container a {text-decoration: none;}
.topmenu_container a:hover {text-decoration: underline; }

.topmenu_mobile { display: none; position: sticky; top: 0; background: var(--mainbgcolor); min-height: 45px; }

@media screen and (max-width: 700px) {
.topmenu_button { display:none;  }
.topmenu_container { display:none;  }
.topmenu_mobile { display: block;  background-color: var(--mainbgcolor) !important; width: 100%; position: sticky; z-index: 1000; min-height: 45px;}
}
@media screen and (orientation: portrait) {
.topmenu_button { display:none;  }
.topmenu_container { display:none;  }
.topmenu_mobile { display: block;  background-color: var(--mainbgcolor) !important; width: 100%; position: sticky; z-index: 1000; min-height: 45px;}
}


.page_container { display: flex; flex-direction: row; margin: 0; margin-top: var(--topmenu_height); background-color: var(--mainbgcolor); }

.page_leftmenu { flex: 15%; min-width: 250px; min-height: 100vh;  background-color: var(--mainbgcolor); width: 250px; /* height: 100%;*/
 transition-property: all; transition-duration: 0.3s; transition-timing-function: ease-in;
  -webkit-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; padding-top: 10px;  }

        .page_leftmenu_uzk { flex-grow: 0; flex-shrink: 0; flex-basis: 90px; display: flex; flex-direction: column;
        padding: 0; margin: 0; /*background-color: #d4d4d4; height: 80vh; */ background-color: #ebebeb; z-index: 1;}

        .hidingblock { display: none; }
        /*.hiding_show { display: block; }
        .hidingblock a { text-decoration: none; }
        .hidingblock div { margin: 5px !important; padding: 10px 3px; cursor:pointer; }
        .hidingblock div:first-child { padding-top: 4px; }
        .hidingblock div:hover { color: #b3b3b3 !important; }*/
        .punkt_active { /*border-left: 1px solid #d4d4d4 !important;*/ color: #b3b3b3 !important; cursor: default !important; /*#b3b3b3;*/ }

        .menu_lev1 { cursor: pointer; padding: 1rem; font-weight: 600;  font-family: var(--topbuttonfont);}

        .open { display: block !important; padding-bottom: 1rem;  padding-left: 1rem;}
        .open a { padding: 1rem; display: block; font-family: var(--topbuttonfont); -webkit-transition: all 0.25s ease;
             -o-transition: all 0.25s ease; transition: all 0.25s ease;}

        .menu { padding: 1rem;  }


        /* leftmenu */
        .nav-toggle { /*position: absolute; right: 0; top: 0;*/ /*left: 300px; top: 80px;*/ padding: 10px; color: #F26928;  cursor: pointer;
          font-size: 1.2em;  line-height: 1; z-index: 5001; -webkit-transition: color .25s ease-in-out; -moz-transition: color .25s ease-in-out; transition: color .25s ease-in-out; }
        .nav-toggle:after { content: '\002190'; text-decoration: none; }
        .nav-toggle:hover { color: #3F88C5; }

        [id='menuswitch']:checked ~ .page_leftmenu .nav-toggle:after { content: '\2192'; text-decoration: none;  }
        [id='menuswitch']:checked ~ .page_leftmenu { flex: 2%; min-width: 40px; transition-property: all; transition-duration: 0.3s; transition-timing-function: ease-in;
        -webkit-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s;  }
        [id='menuswitch']:checked ~ .page_main { flex: 96%; transition-property: all; transition-duration: 0.3s; transition-timing-function: ease-in;
        -webkit-transition: 0.3s; -moz-transition: 0.3s; transition: 0.3s; }
        [id='menuswitch']:checked ~ .page_leftmenu .menu { display:none;  }


.page_main { flex: 85%;  padding-right: 1rem; padding-bottom: 1rem;}
    .main_vars { margin: 0; display: flex; flex-wrap: wrap; max-width: 80vw; z-index: 10; line-height: 14px;}
    /*.vars_title { font-size: 14px;  font-weight: 400; color: #191919; line-height: 28px; }*/
    /*.vars_link { font-size: 14px;  font-weight: 400; line-height: 28px; }*/
        .main_vars:first-child { margin-top: 16px;  }
        .main_vars:last-child { margin-bottom: 5px; }
        .main_vars a { margin-right: 25px; margin-bottom: 10px; }
        .main_vars span { margin-right: 25px; }
        .main_vars .vars_active { text-decoration: none; background: var(--vars_menuactive_bg); padding: 5px;
         margin-top: -5px;  margin-bottom: 10px; margin-right: 20px; }
        .menuactive { text-decoration: none; background: var(--vars_menuactive_bg); padding: 5px;
         margin-top: -5px;  margin-bottom: 10px; margin-right: 20px; }
        @media screen and (max-width: 700px) {
        .main_vars { max-width: 85vw;  justify-content: center; margin: 0 auto; margin-top: 50px; gap: 10px 25px; }
        .main_vars a { padding: 5px; margin-right: 0px; margin-bottom: 0px; }
        .main_vars span { margin-right: 0px; }
        .main_vars .vars_active { padding: 5px; margin-top: 0px;  margin-bottom: 0px; margin-right: 0px; }
        .main_vars:first-child {  margin-top: 0px;}
        }
        @media screen and (orientation: portrait) {
        .main_vars { max-width: 85vw; justify-content: center;  margin: 0 auto; margin-top: 50px; gap: 10px 25px;   }
        .main_vars a { padding: 5px; margin-right: 0px; margin-bottom: 0px; }
        .main_vars span { margin-right: 0px; }
        .main_vars .vars_active { padding: 5px; margin-top: 0px;  margin-bottom: 0px; margin-right: 0px; }
        .main_vars:first-child {  margin-top: 0px;}
        }

    .main_zag { display: flex; flex-wrap: wrap; align-items: center; margin-left: 50px; margin-top: 20px; /*margin: 0.8rem; */}
        .zag_before { margin-right: 20px; font-size: 22px; color: var(--zag_before_color); font-family: var(--topbuttonfont); font-weight: 600; }
        .zag_zag { margin-right: 20px; color: var(--zag_color);  }
        .zag_after { color: var(--zag_after_color); margin-right: 40px; }
        .zag_status { padding: 5px; background: #F8F5F1; border-radius: 15px; color: gray;}
        .status_status { color: gray; }

        @media screen and (max-width: 700px) {
        .main_zag { flex-direction: column; font-size: 18px !important; justify-content: center; padding-right: 0 !important; margin-top: 50px; margin-left: 0px;
         max-width: 90vw; boz-sizing: border-box;}
        .zag_zag { margin-right: 0; text-align: center; }
        .zag_after { margin-right: 0; padding-bottom: 15px; text-align: center;  }
        .zag_before { margin-right: 0; text-align: center;}
        }
        @media screen and (orientation: portrait) {
        .main_zag { flex-direction: column; font-size: 18px !important; justify-content: center; padding-right: 0 !important; margin-top: 50px; margin-left: 0px;
         max-width: 90vw; boz-sizing: border-box;}
        .zag_zag { margin-right: 0; text-align: center; }
        .zag_after { margin-right: 0; padding-bottom: 15px; text-align: center; }
        .zag_before { margin-right: 0; text-align: center;}
        }


    .main_buttons { display: flex; flex-direction: column;  background: var(--mainbgcolor); position: sticky; top: 50px; z-index: 90; }
        .main_buttons a { background-color: var(--buttonbg); border-radius:5px; color: var(--buttonfontcolor); text-decoration: none;
         padding: 7px; margin-right: 10px; margin-bottom: 10px; border: var(--buttonborder); /*color: white;*/}
        .main_buttons a:hover { background-color: var(--buttonbg_hover); color: var(--buttoncolor_hover); border: var(--buttonborder_hover);}
        .main_buttons a:active { background-color: var(--buttonbg_active); color: var(--buttoncolor_hover);}
        @media screen and (max-width: 700px) { .main_buttons { margin-left: 0; margin-right: 0; justify-content: center; display:none; }}
        @media screen and (orientation: portrait) { .main_buttons { margin-left: 0; margin-right: 0; justify-content: center; display:none;}}

        .main_buttons_bts { z-index: 90; display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
        justify-content: var(--btsjustifycontent); background: var(--btsbg); border-radius: var(--btsborderraduis); margin: var(--btsmargin); padding: var(--btspadding);}

        .main_buttons_white {min-height: 35px; background: var(--contentbg); border-radius:15px 15px 0 0; width: 100%; z-index: 90; display: flex; flex-direction: row; /*position: sticky; top: 91px;*/}
        .main_buttons_vkl {min-height: 35px; background: var(--mainbgcolor); /*border-radius:15px 15px 0 0;*/ width: 100%; z-index: 90; position: sticky; top: 100px; display: flex; flex-direction: row;}
        .main_buttons_bts a { background-color: var(--buttoncolor); border-radius: 5px; color: rgb(41, 41, 41); padding: var(--btsbuttonpadding); margin: var(--btsbuttonmargin);
        /*margin-right: 10px; margin-bottom: 10px;*/ border: 0px #dc3943 solid; /*color: white;*/ display: flex; flex-direction: row; align-items: center; height: 20px; min-height: 20px;}

        @media screen and (max-width: 700px) {
        .main_buttons_vkl { top: 45px; }
        }
        @media screen and (orientation: portrait) {
        .main_buttons_vkl { top: 45px; }
        }

        /* Vkladki*/
        .vkl_button { background: var(--vkladkainactivebg); min-width: 150px; height: var(--vkladkaheight); border-radius: 15px 15px 0 0; display: block; position: relative;
          display: flex; flex-direction: row; justify-content: space-between; margin-right: 10px; cursor:pointer; color: var(--vkladkafontcolor);}
        .act { background: var(--vkladkaactivebg) !important; }
        .vkl_text { padding: 10px;}
        .unit20w { display: block; min-width: 20px; width: 20px; min-height: 10px;}
        .vkladka {display: none;}
        .active { display:block;}

        @media screen and (max-width:600px) {
        .vkl_text {  font-size: 14px; }
        .vkl_button { min-height: 50px; }
        }




    .main_content {  background:  var(--contentbg); border: var(--contentborder); border-radius: 0 0 15px 15px; padding: 40px 50px; padding-top: 10px; min-height: 60vh;}
    .main_content_vkladki { border-radius: 0 15px 15px 15px; background:  var(--contentbg);
    border: var(--contentborder); padding: 40px 50px; padding-top: 10px; min-height: 60vh; }

    /*.bottom { display: flex; width: 100%; }*/



    @media screen and (max-width: 700px) {
    #help { border-bottom: 1px solid var(--helpborder); border-left: 0px; box-sizing: border-box;
    padding-top: 70px; width: 99% !important; min-width: 100vw; border-radius: 0; display: none; min-height: 100vh; z-index: 100; height: auto;
     padding-left: 30px;}
    .help_close { top: 60px; color:red;}
    }

    @media screen and (max-width: 1000px) {
    #help { width: auto; margin: 0 auto; position: absolute; right: 0;  top: 0; }}
    .help_img { border: 1px solid var(--helpimgborder);}




.stolb_container {width: 99%; padding-left: 100px; box-sizing: border-box; display: flex; flex-wrap: wrap; justify-content: center;}
    .stolb_four { display:block; width: 23%; float: left; text-align:left; font-family: var(--font1); font-size: var(--fontsize_mini); line-height:20px;}
    @media screen and (max-width:750px) {
    .stolb_container {padding-left: 0; }
    .stolb_four {width: 45%; max-width: 45vw; padding-left: 20px; }}
    @media screen and (max-width:500px) {
    .stolb_four { width: 90%; max-width: 85vw; padding-left: 20px; background: red; }
    .stolb_container {padding-left: 0; }
    }

    .soc_mal { width: 22px; height: 20px; display: inline-block; border-radius: 50%; margin-right: 5px; margin-bottom: -4px; }