html{
    font-size: 100%;
}
/* html, 
body{scroll-behavior: smooth;} */
@media (prefers-reduced-motion: no-preference) {
    html {
        scroll-behavior: smooth;
    }
}
:root{
    --spacing-padding-inline: 0.25rem; /*  min-width:640px ( 40rem )*/
    --color-primary:;
    --color-secondary:;
    --color-text:;
    --color-link-color:;
    --color-background-color:;
    --color-background-color-gradiant:;
    
}

/* Padding works only for main section  */
.main-section-padding .e-con-inner,
.e-flex.e-con-boxed.e-con.e-parent .e-con-inner{
    padding-inline: calc(var(--spacing-padding-inline) * 10);
}

@media screen and (width < 112.5rem) {
 .main-section-padding .e-con-inner, 
    .e-flex.e-con-boxed.e-con.e-parent .e-con-inner{
        padding-inline: calc(var(--spacing-padding-inline) * 15);
    }
}

@media screen and (width < 85.375rem){
    .main-section-padding .e-con-inner, 
    .e-flex.e-con-boxed.e-con.e-parent .e-con-inner{
        padding-inline: calc(var(--spacing-padding-inline) * 20);
    }
}

@media screen and (width < 75rem){
    .main-section-padding .e-con-inner, 
    .e-flex.e-con-boxed.e-con.e-parent .e-con-inner{
        padding-inline: calc(var(--spacing-padding-inline) * 10);
    }
}

@media screen and (width <= 40rem) {
 .main-section-padding .e-con-inner, 
    .e-flex.e-con-boxed.e-con.e-parent .e-con-inner{
    padding-inline: calc(var(--spacing-padding-inline) * 6);
    }
}
 .hidden {
            display: none;
        }