html {
    box-sizing: border-box;
}

*,
*::before,
*::after {
    box-sizing: inherit;
}

a {
    text-decoration: none;
    color: black;
}

ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    padding: 0;
    font-weight: normal;


}

p {
    margin: 0;
    padding: 0;
}


body {
    font-family: sans-serif;
    font-size: 14px;
    background-color: var(--bgpage-color);
}



.container {
    max-width: 1270px;
    margin: 0 auto;
    padding: 0 50px;
    background-color: #fff;
}


.box_shadow {
    -webkit-box-shadow: 0 4px 20px rgba(0, 0, 0, .1);
    box-shadow: 0 4px 20px rgba(0, 0, 0, .1);
}



/* ------------------------banner---------------------------------------------------------------- */





.main_banner {
    border-radius: 10px;
    height: 400px; 
    width: 100%;
    background-image: url(../images/11.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center 40%; 
    color: #ffffff;
    padding-left: 50px;
    padding-right: 75px;
    padding-top: 30px;
    margin-bottom: 16px;
}

.main_banner_subtitle {
    font-size: 32px;
    font-weight: 800;
    line-height: 1.3;
    text-shadow: 5px 5px 15px rgba(255, 255, 255, 0.3),
                 5px 5px 12px #000000,
                 5px 5px 9px #000000,
                 3px 3px 5px #000000,
                 2px 2px 2px #000000,
                 1px 1px 2px #000000,
                 -1px 1px 2px #000000,
                 1px -1px 2px #000000,
                 0px 0px 2px #fff;
    width: 100%;
    margin-top: 10px;
    text-transform: uppercase;
    max-width: 550px;

}
.main_banner_advant {
    padding: 0;
    margin: 0;
    margin-top: 140px;
}
.main_banner_advant li {
    font-size: 21px;
    font-weight: 400;
    color: #ffffff;
    line-height: 1;
    text-shadow: 5px 5px 15px rgba(255, 255, 255, 0.3),
                 3px 3px 12px #000000,
                 3px 3px 9px #000000,
                 3px 3px 6px #000000,
                 2px 2px 3px #000000,
                 1px 1px 3px #000000,
                 -1px 1px 3px #000000,
                 1px -1px 3px #000000,
                 0px 0px 2px #fff;
    
}
.main_banner_warning {
    margin-top: 24px;
    color: #fff;
    text-align: center;
    font-size: 16px;
    font-weight: 300;
    line-height: 1;

    text-shadow: 5px 5px 15px rgba(255, 0, 0, 0.5),
                 3px 3px 12px rgba(255, 0, 0, 0.5),
                 3px 3px 9px rgba(255, 0, 0, 0.5),
                 3px 3px 6px rgba(255, 0, 0, 0.5),
                 2px 2px 4px rgba(255, 0, 0, 0.5),
                 1px 1px 4px rgba(255, 0, 0, 0.5),
                 -1px 1px 4px rgba(255, 0, 0, 0.5),
                 1px -1px 4px rgba(255, 0, 0, 0.5),
                 0px 0px 1px #fff;


}


@media (max-width: 900px) {
    .main_banner{
        padding-left: 50px;
        padding-right: 50px;
        margin-bottom: 0;
        height: 380px;
        padding-top: 26px;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: 40% center; 

    }

    .main_banner_subtitle {
        font-size: 28px;
        font-weight: 800;
        line-height: 1.3;
        text-shadow: 5px 5px 15px rgba(255, 255, 255, 0.3),
                     5px 5px 12px #000000,
                     5px 5px 9px #000000,
                     3px 3px 5px #000000,
                     2px 2px 2px #000000,
                     1px 1px 2px #000000,
                     -1px 1px 2px #000000,
                     1px -1px 2px #000000,
                     0px 0px 2px #fff;
        width: 100%;
        margin-top: 10px;
        text-transform: uppercase;
        max-width: 500px;
    
    }

    .main_banner_advant {

        margin-top: 140px;
    }
    .main_banner_advant li {
        font-size: 18px;        
    }

    .main_banner_warning {
        margin-top: 35px;
        font-size: 15px;        
    }
    
    
}


@media (max-width: 767px) {
    .main_banner{
        padding-left: 30px;
        padding-right: 50px;
        margin-bottom: 0;
        height: 320px;
        padding-top: 20px;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: 35% center;
    }
    
    .main_banner_subtitle {
        font-size: 24px;
        font-weight: 700;
        width: 100%;
        margin-top: 10px;
        text-transform: uppercase;
        max-width: 400px;
    }


    .main_banner_advant {

        margin-top: 120px;
    }
    .main_banner_advant li {
        font-size: 16px;
        font-weight: 300;        
    }

    .main_banner_warning {
        margin-top: 22px;
        font-size: 12px;
        text-shadow: 4px 4px 12px rgba(255, 0, 0, 0.5),
                 2px 2px 10px rgba(255, 0, 0, 0.5),
                 2px 2px 8px rgba(255, 0, 0, 0.5),
                 2px 2px 5px rgba(255, 0, 0, 0.5),
                 1px 1px 3px rgba(255, 0, 0, 0.5),
                 1px 1px 4px rgba(255, 0, 0, 0.5),
                 -1px 1px 4px rgba(255, 0, 0, 0.5),
                 1px -1px 4px rgba(255, 0, 0, 0.5),
                 0px 0px 1px #fff;       
    }
}

@media (max-width: 580px) {
    .main_banner{
        padding-left: 20px;
        padding-right: 50px;
        margin-bottom: 0;
        height: 290px;
        padding-top: 15px;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: 30% center;
    }
    
    .main_banner_subtitle {
        max-width: 380px;
        font-size: 22px;
        margin-top: 10px;

    }


    .main_banner_advant {

        margin-top: 105px;
    }
    .main_banner_advant li {
        font-size: 15px;
        font-weight: 300;        
    }

    .main_banner_warning {
        margin-top: 22px;
        font-size: 12px;     
    }
}

@media (max-width: 480px) {
    .main_banner{
        padding-left: 15px;
        padding-right: 15px;
        margin-bottom: 0;
        height: 180px;
        padding-top: 5px;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: 25% center;
    }
    
    .main_banner_subtitle {
        max-width: 300px;
        font-size: 18px;
        margin-top: 5px;
    }


    .main_banner_advant {
        display: none;
    }
    .main_banner_warning {
        margin-top:100px;
        font-size: 12px;    
    }
}





.c-amount__up .icon, .c-amount__down .icon {
    fill: var(--accent-color);
}