body {font-size:16px;}

.relativeBlock {
    position: relative;
}
.absoluteBlock {
    position: absolute;
    background: none !important;
    color: black !important;
    right: 5px;
    top: 0;
}

#message-block {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999;
    text-align: center;
    border-radius: 0 0 10px 10px;
    transition: transform 2s, 2s;
    transform: translateY(-100%);
}
.bg-color__red{
    background-color: rgba(253, 20, 20, 0.5);
}
.bg-color__blue{
    background-color: rgba(10, 83, 190, 0.5);
}
#message-block.show {
    transform: translateY(0%) !important;
}

.access_denied {
    text-align: center;
    width: 100%;
    margin: 20px 0;
    font-size: 30px;
    color: #fe7062;
}
.access_denied a {
    font-size: 10px;
}
#sendpassword {
    margin-top: 10px;
    background-color: #4243e9;
    border: 1px solid #4243e9;
    color: white;
    border-radius: 5px;
}
#password {
    margin-top: 3px;
    border-radius: 5px;
    border: 2px solid rgb(128, 128, 128);
    padding: 5px 10px;
    font-size: 28px;
}
#auth-error {
    font-size: 16px;
}
#logout {
    position: absolute;
    z-index: 999;
    right: 10px;
    top: 10px;
    opacity: 70%;
}
#logout img {
    width: 60px;
}
.dashboard_header div:first-child .dashboard_header-item {background:#76D2F0;}
.dashboard_header div:nth-child(2) .dashboard_header-item {background:#FFF27E;}
.dashboard_header div:nth-child(3) .dashboard_header-item {background:#88EBCF;}
.dashboard_header div:nth-child(4) .dashboard_header-item {background:#F6D4A0;}
.dashboard_header .dashboard_header-item {padding:5px 10px;border-radius:4px;}
.dashboard_header .dashboard_header-item img {height:30px;}
.dashboard_header .dashboard_header-item div:first-child {display:flex;max-height:111px;}
.dashboard_header .dashboard_header-item div:last-child {font-weight:800;font-size:24px;}
.dashboard_header .dashboard_header-item div:last-child strong {font-size:40px;margin-right:6px;}
.dashboard_header .dashboard_header-item div span {white-space:nowrap;}

.dashboard_item {background:#F2F2F2;border-radius:4px;}
.dashboard_item .progress {background:none;height:auto;overflow:visible;}
.dashboard_item .progress div:first-child {background:#fff;border-radius:100px;height:16px;width:calc(95% - 75px);}
.dashboard_item .progress div:first-child div {background:#0BB887;font-size:12px;text-align:center;color:#fff;font-weight:bold;line-height:16px;}
.dashboard_item .progress span {font-size:15px;color:#0BB887;}
.dashboard_item .progress.fail div:first-child div {background:#F22455;}
.dashboard_item .progress.fail div:first-child div.second {background:#9b2d30;}
.dashboard_item .progress.fail strong {color:#F22455; font-size: 13px;}

.dashboard_item > div:first-child img {width:60px;height:60px;border-radius:50%;}
.dashboard_item > div:first-child strong {margin:10px 0 0 15px;}
.dashboard_item .chart {margin:10px 0;text-align:center;}
.dashboard_item .chart canvas {width:80px;height:60px;}
.dashboard_item .chart div:last-child {font-size:14px;}
.dashboard_item .row strong {color:#24c0f2;}
.dashboard_item .row strong.green {color:#0BB887;}
.dashboard_item > div:last-child {font-size:14px;height:38px;}
.dashboard_item .chart_img {width:30px !important;max-width:unset;}
.dashboard_item .cup {top:-8px;right:7px;}
.dashboard_item .cup img {width:40px;height:40px;border-radius:0;}
.dashboard_item .birthday {top:-8px;right:55px;}
.dashboard_infopanel {color: rgb(128, 128, 128);font-size: 13px;}

.usernameblock {
    margin: 0 0 0 15px;
}

.user-name {
    font-weight: bold;
}

.user-plan-profit {

}

.user-plan-profit span {
    color: #24c0f2;
}

@media screen and (max-width: 991px) {
    .dashboard_header .dashboard_header-item div:last-child strong {font-size:32px;}
}


@media screen and (min-width: 1920px) {
    .main_content .container {max-width:100%;}
    .dots_wrap {height:2px;background:#E4E4E4;}
    .dots_wrap .owl-dots {top:-16px;background:#fff;display:inline-block;}
    .owl-dots button {width:14px;height:14px;background:#C4C4C4 !important;margin:8px;border-radius:50%;border:0 none;outline:none;}
    .owl-dots button.active {background:#F22455 !important;}
}


.dark {background:#2C3436;color:#fff;}
.dark .dashboard_header div:first-child .dashboard_header-item {background:#025D7A;}
.dark .dashboard_header div:nth-child(2) .dashboard_header-item {background:#504343;}
.dark .dashboard_header div:nth-child(3) .dashboard_header-item {background:#195F4B;}
.dark .dashboard_header div:nth-child(4) .dashboard_header-item {background:#614C2C;}

.dark .dashboard_item {background:#374556;}
.dark .dots_wrap .owl-dots {background:#2C3436;}
.gifts {
    background-attachment: local;
    background-repeat: no-repeat;
}
.style-pageupload{
    text-align: center;
    color: #b3bdce;
    font-size: 22px;
    font-weight: bold;
}
/*ко всем еще привязать заголовок*/
.fon-3 {background: url("../images/fon/fon-3.jpg") center center;}
.fon-4 {background: url("../images/fon/fon-4.jpg") center center; }
.fon-5 {background: url("../images/fon/fon-5.jpg") center center; }
.fon-6 {background: url("../images/fon/fon-6.jpg") center center; }
.fon-7 {background: url("../images/fon/fon-7.jpg") center center; }
.fon-8 {background: url("../images/fon/fon-8.jpg") center center; }
.fon-9 {background: url("../images/fon/fon-9.jpg") center center; }
.fon-10 {background: url("../images/fon/fon-10.jpg")center center; }

.fon-3, .fon-4, .fon-5, .fon-6, .fon-7, .fon-8, .fon-9, .fon-10{
    background-size: 100% 100%;
    position: fixed;
    z-index: -1;
    width: 100%;
    height: 100%
}

.fon-3 .dashboard_infopanel, .fon-3 .style-pageupload,
.fon-4 .dashboard_infopanel, .fon-4 .style-pageupload {
    color: #e5e5e5 !important;
}

.fon-6 .dashboard_infopanel, .fon-6 .style-pageupload, .fon-6 .dashboard_name,
.fon-10 .dashboard_infopanel, .fon-10 .style-pageupload {
    color: #FFFFFF !important;
}

.fon-7 .dashboard_infopanel, .fon-7 .style-pageupload, .fon-7 .dashboard_name,
.fon-8 .dashboard_infopanel, .fon-8 .style-pageupload, .fon-8 .dashboard_name,
.fon-9 .dashboard_infopanel, .fon-9 .style-pageupload, .fon-9 .dashboard_name {
    color: #000000 !important;
}

@media screen and (max-width: 1919px) {
    .dashboard_header > div {padding:0 15px !important;}
}

.card_grid{
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(65px, 1fr));
    grid-auto-flow: row;
    justify-items: center;
    grid-gap: 5px;
}
.dashboard_name{
    display: flex;
    text-align: center;
    font-size: 22px;
    justify-content: center;
}