@import url('https://fonts.googleapis.com/css?family=Open+Sans:300&display=swap');

body{
    font-family: 'Open Sans', sans-serif;
    background: #f9f9f9;
    color: #000;
}

body[theme='dark'] {
    background: #090a0e;
    color: #fff;
}

body[theme='greenDark'] {
    background: #19181f;
    color: #fff;
}

body[theme='visuallyImpaired']{
    background: #fff;
    color: #000;
    font-size: 18px;
}

/*Начало Header*/

body > main > .header {
    position: fixed;
    z-index: 10000 !important;
    width: 100%;
    background-color: rgba(255, 255, 255, 0.7);
    box-shadow: 0px 7px 25px 1px rgba(0,0,0,0.08);
    backdrop-filter: saturate(180%) blur(20px);
    -webkit-backdrop-filter: saturate(180%) blur(20px);
    border-bottom: 1px solid #dbdbdb;
    box-sizing: border-box;
}

body > main > .header[theme='dark'] {
    background-color: rgba(21, 24, 31, 0.7);
    border-bottom: 1px solid #000000;
}

body > main > .header[theme='greenDark'] {
    background-color: rgba(31, 30, 37, 0.7);
    border-bottom: 1px solid #000000;
}

body > main > .header[theme='visuallyImpaired']{
    background: #fff;
    border-bottom: 1px solid #000000;
}

body > main > .header > .container-fluid > .row > .col-6 {
    padding: 15px 0;
    color: #f41e26;
    font-weight: bold;
    font-size: 24px;
    text-align: center;
}

body > main > .header > .container-fluid > .row > .col-6[theme='greenWhite'] {
    color: #00b46e;
}

body > main > .header > .container-fluid > .row > .col-6[theme='greenDark'] {
    color: #00b46e;
}

body > main > .header > .container-fluid > .row > .col-6[theme='visuallyImpaired'] {
    color: #000;
}

body > main > .header > .container-fluid > .row > .col-6 > font{
    color: #3f3f3f;
}

body > main > .header > .container-fluid > .row > .col-6 > font[theme='dark'] {
    color: #fff;
}

body > main > .header > .container-fluid > .row > .col-6 > font[theme='greenWhite'] {
    color: #ff8300;
}

body > main > .header > .container-fluid > .row > .col-6 > font[theme='greenDark'] {
    color: #ff8300;
}

body > main > .header > .container-fluid > .row > .col-6 > font[theme='visuallyImpaired'] {
    color: #000;
}

body > main > .header > .container-fluid > .row > .col-3 > .profile {
    cursor: pointer;
    position: relative;
    height: 66px;
    text-align: right;
}
    
body > main > .header > .container-fluid > .row > .col-3 > .profile > .name_user{
    position: absolute;
    top: 21px;
    right: 60px;
    color: #000;
}

body > main > .header > .container-fluid > .row > .col-3 > .profile > .name_user[theme='dark']{
    color: #fff;
}

body > main > .header > .container-fluid > .row > .col-3 > .profile > .name_user[theme='greenDark']{
    color: #fff;
}
    
body > main > .header > .container-fluid > .row > .col-3 > .profile > .photo_user{
    position: absolute;
    width: 50px;
    height: 50px;
    top: 8px;
    right: 0px;
    border-radius: 100%;
    background-color: #f41e26;
    background-position: center;
    background-size: cover;
}

body > main > .header > .container-fluid > .row > .col-3 > .profile > .photo_user[theme='greenWhite']{
    background-color: #00b46e;
}

body > main > .header > .container-fluid > .row > .col-3 > .profile > .photo_user[theme='greenDark']{
    background-color: #00b46e;
}

body > main > .header > .container-fluid > .row > .col-3 > .profile > .photo_user[theme='visuallyImpaired']{
    background-color: #000;
}

body > main > .header > .container-fluid > .row > .col-3 > .panel_profile{
    display: none;
    position: fixed;
    z-index: 10000!important;
    top: 85px;
    right: 15px;
    width: 250px;
    height: auto;
    box-sizing: border-box;
    padding: 15px;
    border-radius: 4px;
    background: #fff;
    box-shadow: 0px 7px 25px 1px rgba(0,0,0,0.08);
}

body > main > .header > .container-fluid > .row > .col-3 > .panel_profile[theme='dark']{
    background: #15181f;
}

body > main > .header > .container-fluid > .row > .col-3 > .panel_profile[theme='greenDark']{
    background: #1f1e25;
}

body > main > .header > .container-fluid > .row > .col-3 > .panel_profile[theme='visuallyImpaired']{
    border: 1px solid #000;
}

body > main > .header > .container-fluid > .row > .col-3 > .panel_profile > a{
    display: block;
    margin: 5px 0;
    color: #3f3f3f;
    text-decoration: none;
}

body > main > .header > .container-fluid > .row > .col-3 > .panel_profile > a[theme='dark']{
    color: #fff;
}

body > main > .header > .container-fluid > .row > .col-3 > .panel_profile > a[theme='greenDark']{
    color: #fff;
}

body > main > .header > .container-fluid > .row > .col-3 > .panel_profile > a:hover{
    color: #f41e26;
}

body > main > .header > .container-fluid > .row > .col-3 > .panel_profile > a:hover[theme='greenWhite']{
    color: #ff8300;
}

body > main > .header > .container-fluid > .row > .col-3 > .panel_profile > a:hover[theme='greenDark']{
    color: #ff8300;
}

/*Конец Header*/

/*Начало Menu*/

body > main > menu {
    height: 100vh;
    display: flex;
    align-items: center;
    position: absolute;
    margin: 0;
    padding: 0;
}

body > main > menu > .menu_desktop {
    transition: 0.3s;
    overflow-x: hidden;
    float: left;
    position: fixed;
    z-index: 10001 !important;
    width: 100px;
    /*margin-top: 100px;
    margin-top: calc( ( 100vh - 730px ) / 2 ); */
    box-shadow: 0px 7px 25px 1px rgba(0,0,0,0.08);
    border-radius: 0 15px 15px 0;
}

body > main > menu > .menu_desktop:hover{
    width: 350px;
}

body > main > menu > .menu_desktop > .menu_panel {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    padding: 15px 0;
    border-radius: 0 15px 15px 0;
    background: #fff;
    text-align: center;
}

body > main > menu > .menu_desktop > .menu_panel[theme='dark'] {
    background: #15181f;
}

body > main > menu > .menu_desktop > .menu_panel[theme='greenDark'] {
    background: #1f1e25;
}

body > main > menu > .menu_desktop > .menu_panel[theme='visuallyImpaired'] {
    border: 1px solid #000;
}

body > main > menu > .menu_desktop > .menu_panel > .li {
    display: block;
    width: 100px;
    height: 20px;
    margin: 40px 0;
    color: #3f3f3f;
    text-decoration: none;
}

body > main > menu > .menu_desktop > .menu_panel > .li[theme='dark']{
    color: #fff;
}

body > main > menu > .menu_desktop > .menu_panel > .li[theme='greenWhite']{
    color: #00b46e;
}

body > main > menu > .menu_desktop > .menu_panel > .li[theme='greenDark']{
    color: #00b46e;
}

body > main > menu > .menu_desktop > .menu_panel > .li > .new_messages {
    position: absolute;
    left: 58px;
    margin-top: 10px;
    width: 14px;
    height: 14px;
    box-sizing: border-box;
    background: #f41e26;
    border: 2px solid #fff;
    border-radius: 100%;
}

body > main > menu > .menu_desktop > .menu_panel > .li > .new_messages[theme='dark'] {
    border: 2px solid #15181f;
}

body > main > menu > .menu_desktop > .menu_panel > .li > .new_messages[theme='greenWhite'] {
    background: #00b46e;
}

body > main > menu > .menu_desktop > .menu_panel > .li > .new_messages[theme='greenDark'] {
    background: #00b46e;
}

body > main > menu > .menu_desktop > .menu_panel > .li:hover {
    color: #f41e26;
}

body > main > menu > .menu_desktop > .menu_panel > .li:hover[theme='greenWhite'] {
    color: #ff8300;
}

body > main > menu > .menu_desktop > .menu_panel > .li:hover[theme='greenDark'] {
    color: #ff8300;
}

body > main > menu > .menu_desktop > .menu_panel > .li > .icon_menu {
    font-size: 24px;
    line-height: 0;
}

body > main > menu > .menu_desktop > .menu_panel > .li > .name {
    display: block;
    box-sizing: border-box;
    position: absolute;
    width: 250px;
    left: 100px;
    padding: 10px;
    margin-top: -35px;
    border-radius: 10px;
    background: #fff;
    color: #3f3f3f;
    text-align: left;
}

body > main > menu > .menu_desktop > .menu_panel > .li > .name[theme='dark'] {
    background: #15181f;
    color: #fff;
}

body > main > menu > .menu_desktop > .menu_panel > .li > .name[theme='greenDark'] {
    background: #1f1e25;
    color: #fff;
}

body > main > menu > .menu_desktop:hover .new_messages{
    display: none;
}

body > main > menu > .menu_mobile {
    position: fixed;
    z-index: 10001 !important;
    bottom: 0px;
    width: 100%;
    border-radius: 15px 15px 0 0;
    background: #fff;
}

body > main > menu > .menu_mobile[theme='dark'] {
    background: #15181f;
}

body > main > menu > .menu_mobile[theme='greenDark'] {
    background: #1f1e25;
}

body > main > menu > .menu_mobile[theme='visuallyImpaired'] {
    border: 1px solid #000;
}

body > main > menu > .menu_mobile > .menu_panel > .container > .row > .col-3 {
    display: block;
    position: relative;
    font-size: 32px;
    padding: 5px 0;
    text-align: center;
    color: #3f3f3f;
}

body > main > menu > .menu_mobile > .menu_panel > .container > .row > .col-3[theme='dark'] {
    color: #fff;
}

body > main > menu > .menu_mobile > .menu_panel > .container > .row > .col-3[theme='greenWhite'] {
    color: #00b46e;
}

body > main > menu > .menu_mobile > .menu_panel > .container > .row > .col-3[theme='greenDark'] {
    color: #00b46e;
}

body > main > menu > .menu_mobile > .menu_panel > .container > .row > .col-3:hover {
    color: #f41e26;
}

body > main > menu > .menu_mobile > .menu_panel > .container > .row > .col-3:hover[theme='greenWhite']  {
    color: #ff8300;
}

body > main > menu > .menu_mobile > .menu_panel > .container > .row > .col-3:hover[theme='greenDark']  {
    color: #ff8300;
}

body > main > menu > .menu_mobile > .menu_panel > .container > .row > .col-3 > .new_messages {
    position: absolute;
    left: 60%;
    margin-top: 28px;
    width: 14px;
    height: 14px;
    box-sizing: border-box;
    background: #f41e26;
    border: 2px solid #fff;
    border-radius: 100%;
}

body > main > menu > .menu_mobile > .menu_panel > .container > .row > .col-3 > .new_messages[theme='dark'] {
    border: 2px solid #15181f;
}

body > main > menu > .menu_mobile > .menu_panel > .container > .row > .col-3 > .new_messages[theme='greenWhite'] {
    background: #00b46e;
}

body > main > menu > .menu_mobile > .menu_panel > .container > .row > .col-3 > .new_messages[theme='greenDark'] {
    background: #00b46e;
}

body > main > menu > .menu_mobile > .menu_open {
    display: none;
    z-index: 9999 !important;
    position: fixed;
    top: 0;
    width: 100%;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.7);
    backdrop-filter: saturate(180%) blur(20px);
}

body > main > menu > .menu_mobile > .menu_open > .close_panel {
    position: fixed;
    display: block;
    width: 28px;
    top: 10px;
    right: 10px;
    font-size: 28px;
    line-height: 0;
    color: #fff;
    text-align: center;
}

body > main > menu > .menu_mobile > .menu_open > .menu_panel {
    position: fixed;
    bottom: 0px;
    width: 100%;
    height: 90%;
    border-radius: 15px 15px 0 0;
    background: #fff;
    overflow-y: scroll;
    box-sizing: border-box;
    padding: 15px;
    text-align: center;
}

body > main > menu > .menu_mobile > .menu_open > .menu_panel[theme='dark'] {
    background: #15181f;
}

body > main > menu > .menu_mobile > .menu_open > .menu_panel[theme='greenDark'] {
    background: #1f1e25;
}

body > main > menu > .menu_mobile > .menu_open > .menu_panel > .li {
    display: inline-block;
    width: 200px;
    height: 120px;
    margin: 10px;
    vertical-align: top;
    box-sizing: border-box;
    border: 1px solid #919191;
    border-radius: 15px;
    padding: 35px 15px;
    color: #3f3f3f;
    text-decoration: none;
    transition: 0.3s;
}

body > main > menu > .menu_mobile > .menu_open > .menu_panel > .li[theme='dark'] {
    border: 1px solid #fff;
    color: #fff;
}

body > main > menu > .menu_mobile > .menu_open > .menu_panel > .li[theme='greenWhite']  {
    border: 1px solid #00b46e;
    color: #00b46e;
}

body > main > menu > .menu_mobile > .menu_open > .menu_panel > .li[theme='greenDark']  {
    border: 1px solid #00b46e;
    color: #00b46e;
}

body > main > menu > .menu_mobile > .menu_open > .menu_panel > .li:hover {
    border: 1px solid #f41e26;
    background-color: #f41e26;
    color: #fff;
}

body > main > menu > .menu_mobile > .menu_open > .menu_panel > .li:hover[theme='greenWhite']  {
    border: 1px solid #ff8300;
    background-color: #ff8300;
    color: #fff;
}

body > main > menu > .menu_mobile > .menu_open > .menu_panel > .li:hover[theme='greenDark']  {
    border: 1px solid #ff8300;
    background-color: #ff8300;
    color: #fff;
}

body > main > menu > .menu_mobile > .menu_open > .menu_panel > .li > .icon_menu {
    font-size: 36px;
    line-height: 0;
}

body > main > menu > .menu_mobile > .menu_open > .menu_panel > .li > .name {
    margin-top: 5px;
}

/*Конец Menu*/



/*Начало Body*/

body > main > .body {
    width: 100%;
    box-sizing: border-box;
    padding: 80px 15px;
    position: relative;
}

/*Конец Body*/



/*Начало Copyright*/

body > main > .body > .copyright {
    box-sizing: border-box;
    padding: 15px 0;
    text-align: center;
    font-size: 12px;
}

/*Конец Copyright*/



/*Начало global_correctional*/

@media (min-width: 250px) {

    /*Начало Header*/

    body > main > .header > .container-fluid > .row > .col-3 > .profile {
        display: none;
    }

    body > main > .panel_profile {
        display: none;
    }

    /*Конец Header*/
    
    /*Начало Menu*/

    .menu_desktop{
        display: none;
    }

    .menu_mobile{
        display: block;
    }

    body > main > .menu_mobile > .menu_open > .menu_panel > .li {
        width: 90%;
    }

    /*Конец Menu*/

    /*Начало Body*/

    body > main > .body {
        width: 100%;
    }

    /*Конец Body*/
}

@media (min-width: 576px) {

    /*Начало Header*/

    body > main > .header > .container-fluid > .row > .col-3 > .profile {
        display: none;
    }

    body > main > .panel_profile {
        display: none;
    }

    /*Конец Header*/

    /*Начало Menu*/

    .menu_desktop{
        display: none;
    }

    .menu_mobile{
        display: block;
    }

    body > main > .menu_mobile > .menu_open > .menu_panel > .li {
        width: 200px;
    }

    /*Конец Menu*/
    
    /*Начало Body*/

    body > main > .body {
        width: 100%;
    }

    /*Конец Body*/
}

@media (min-width: 768px) {

    /*Начало Header*/

    body > main > .header > .container-fluid > .row > .col-3 > .profile {
        display: none;
    }

    body > main > .panel_profile {
        display: none;
    }

    /*Конец Header*/

    /*Начало Menu*/

    .menu_desktop{
        display: none;
    }

    .menu_mobile{
        display: block;
    }

    body > main > .menu_mobile > .menu_open > .menu_panel > .li {
        width: 200px;
    }

    /*Конец Menu*/
    
    /*Начало Body*/

    body > main > .body {
        width: 100%;
    }

    /*Конец Body*/
}

@media (min-width: 992px) {

    /*Начало Header*/

    body > main > .header > .container-fluid > .row > .col-3 > .profile {
        display: block;
    }

    body > main > .panel_profile {
        display: none;
    }

    /*Конец Header*/

    /*Начало Menu*/

    .menu_desktop{
        display: block;
    }

    .menu_mobile{
        display: none;
    }

    body > main > .menu_mobile > .menu_open > .menu_panel > .li {
        width: 200px;
    }

    /*Конец Menu*/
    
    /*Начало Body*/

    body > main > .body {
        width: calc( 100% - 100px );
        float: right;
    }

    /*Конец Body*/
}

@media (min-width: 1200px) {

    /*Начало Header*/

    body > main > .header > .container-fluid > .row > .col-3 > .profile {
        display: block;
    }

    body > main > .panel_profile {
        display: none;
    }

    /*Конец Header*/

    /*Начало Menu*/

    .menu_desktop{
        display: block;
    }

    .menu_mobile{
        display: none;
    }

    body > main > .menu_mobile > .menu_open > .menu_panel > .li {
        width: 200px;
    }

    /*Конец Menu*/
        
    /*Начало Body*/

    body > main > .body {
        width: calc( 100% - 100px );
        float: right;
    }

    /*Конец Body*/
}

@media (min-width: 1440px) {

    /*Начало Header*/

    body > main > .header > .container-fluid > .row > .col-3 > .profile {
        display: block;
    }

    body > main > .panel_profile {
        display: none;
    }

    /*Конец Header*/
    
}

/*Конец global_correctional*/