/* Цвета шрифтов*/

.black{
    color: #1C1C1C;
}

.white{
    color: #FFFFFF;
}

.grey{
    color: #4D555D;
}

.light-grey{
    color: #767B82;
}

.solitude{
    color: #F3F4F6;
}

.solitude-80{
    color:  rgba(243, 244, 246, 0.80);
}

.solitude-90{
    color:  rgba(243, 244, 246, 0.90);
}

.marble{
    color: #E9EAEE;
}

.marble-55{
    color: rgba(233, 234, 238, 0.55);
}

.manatee{
    color: #8F96A3;
}

.manatee-30{
    color: rgba(143, 150, 163, 0.30);
}

.manatee-10{
    color: rgba(143, 150, 163, 0.10);
}

.error-red{
    color: #F80000;
}

.green{
    color: #0F5B48;
}

.green-60{
    color: rgba(15, 91, 72, 0.60);
}

.green-10{
    color: rgba(15, 91, 72, 0.10);
}

.red{
    color: #E04244;
}

.red-10{
    color: rgba(224, 66, 68, 0.10);
}

/* Цвета заднего фона*/

.bg-black{
    background-color: #1C1C1C;
}

.bg-white{
    background-color: #FFFFFF;
}

.bg-grey{
    background-color: #4D555D;
}

.bg-light-grey{
    background-color: #767B82;
}

.bg-solitude{
    background-color: #F3F4F6;
}

.bg-solitude-80{
    background-color:  rgba(243, 244, 246, 0.80);
}

.bg-solitude-90{
    background-color:  rgba(243, 244, 246, 0.90);
}

.bg-marble{
    background-color: #E9EAEE;
}

.bg-marble-55{
    background-color: rgba(233, 234, 238, 0.55);
}

.bg-manatee{
    background-color: #8F96A3;
}

.bg-manatee-30{
    background-color: rgba(143, 150, 163, 0.30);
}

.bg-manatee-10{
    background-color: rgba(143, 150, 163, 0.10);
}

.bg-error-red{
    background-color: #F80000;
}

.bg-green{
    background-color: #0F5B48;
}

.bg-green-60{
    background-color: rgba(15, 91, 72, 0.60);
}

.bg-green-10{
    background-color: rgba(15, 91, 72, 0.10);
}

.bg-red{
    background-color: #E04244;
}

.bg-red-10{
    background-color: rgba(224, 66, 68, 0.10);
}

/* --------1920-------- */

.rad-main{
    border-radius: 20px;
}

.rad-item{
    border-radius: 12px;
}

.rad-element{
    border-radius: 8px;
}

.lc-body{
    display: flex;
}

.lc-content{
    padding: 25px; 
    box-sizing: border-box; 
    width: 100%;
    margin-left: 350px;
}

.shadow{
    box-shadow: 0px 0px 4px rgba(143, 150, 163, 0.50);
}

.not-found-cont{
    height: calc(100vh - 50px);
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

.not-found-cont img{
    width: 470px;
}

/* --------2560-------- */

@media screen and (min-width: 2500px) {
    
    .rad-main{
        border-radius: 26x;
    }

    .rad-item{
        border-radius: 16px;
    }

    .rad-element{
        border-radius: 11px;
    }

    .lc-body{
        display: flex;
    }

    .lc-content{
        padding: 30px; 
        box-sizing: border-box; 
        width: 100%;
        margin-left: 460px;
    }

    .shadow{
        box-shadow: 0px 0px 5px rgba(143, 150, 163, 0.50);
    }

    .not-found-cont{
        height: calc(100vh - 60px);
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 20px;
    }

    .not-found-cont img{
        width: 625px;
    }
}

/* --------1440-------- */

@media screen and (max-width: 1900px) {

    .rad-main{
        border-radius: 12px;
    }

    .rad-item{
        border-radius: 8px;
    }

    .rad-element{   
        border-radius: 6px;
    }

    .lc-body{
        display: flex;
    }

    .lc-content{
        padding: 20px; 
        box-sizing: border-box; 
        width: 100%;
        margin-left: 265px;
    }

    .shadow{
        box-shadow: 0px 0px 3px rgba(143, 150, 163, 0.50);
    }

    .not-found-cont{
        height: calc(100vh - 40px);
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 20px;
    }

    .not-found-cont img{
        width: 350px;
    }
}

/* --------1280-------- */

@media screen and (max-width: 1420px) {
    
    .rad-main{
        border-radius: 12px;
    }

    .rad-item{
        border-radius: 8px;
    }

    .rad-element{
        border-radius: 6px;
    }

    .lc-body{
        display: flex;
    }

    .lc-content{
        padding: 16px; 
        box-sizing: border-box; 
        width: 100%;
        margin-left: 235px;
    }

    .shadow{
        box-shadow: 0px 0px 2.5px rgba(143, 150, 163, 0.50);
    }

    .not-found-cont{
        height: calc(100vh - 32px);
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 20px;
    }

    .not-found-cont img{
        width: 315px;
    }
}

/* --------768-------- */

@media screen and (max-width: 1200px) {
    
    .rad-main{
        border-radius: 16px;
    }
    
    .rad-item{
        border-radius: 14px;
    }

    .rad-element{
        border-radius: 12px;
    }
    
    .lc-body{
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .lc-content{
        padding: 20px; 
        box-sizing: border-box; 
        width: 100%;
        margin-bottom: 100px;
        margin-left: 0px;
    }

    .shadow{
        box-shadow: 0px 0px 5px rgba(143, 150, 163, 0.50);
    }

    .not-found-cont{
        height: calc(100vh - 140px);
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 20px;
    }

    .not-found-cont img{
        width: 470px;
    }
}

/* --------375-------- */

@media screen and (max-width: 530px) {
    
    .rad-main{
        border-radius: 16px;
    }

    .rad-item{
        border-radius: 14px;
    }

    .rad-element{
        border-radius: 12px;
    }
        
    .lc-body{
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .lc-content{
        padding: 20px 15px; 
        box-sizing: border-box; 
        width: 100%;
        margin-bottom: 85px;
        margin-left: 0px;
    }

    .shadow{
        box-shadow: 0px 0px 5px rgba(143, 150, 163, 0.50);
    }

    .not-found-cont{
        height: calc(100vh - 125px);
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 20px;
    }

    .not-found-cont img{
        width: 100%;
    }
}