:root {
    --main-background:                #ffffff;
    --module-background:              #ffffff;
    --breadcrums-background:          #f1f1f1;

    --gap-columns:                    24px;
    --width-column-page:              20%;
    --default-products-grid:          5;
    --default-products-gap:           30px;
    --subcategory-products:           6;

    --color-primary:                  #ffb700;
    --color-secondary:                #000000;
    --color-background:               #eeeeee;
    --color-background2:              #dddddd;

    --color-black:                    #18181F;
    --color-white:                    #ffffff;
    --color-red:                      #ff0000;
    --color-grey:                     #cccccc;
    --color-grey-dark:                #999999;
    --color-grey-white:               #f4f4f4;

    --radius:                         18px;
    --input-radius: 18px;
    --search-border-color: #ACAFB0;

    --color-href:                     #000000;
    --color-href-hover:               #ffb700;

    --color-general-border:           #dddddd;

    --color-dropdown:                 #fafafa;

    --color-footer-border:            #ACAFB0;

    --color-specialprice:             #ffb700;             

    --btn-menu-color:                 #000000;
    --btn-menu-hover-color:           #ff0000;
    --border-menu-color:              #dddddd;
    
    --btn-default-color:              #18181F;
    --btn-default-border:             #dddddd;
    --btn-default-background:         #ffffff;
    --btn-default-hover-color:        #18181F;
    --btn-default-hover-border:       #eeeeee;
    --btn-default-hover-background:   #eeeeee;

    --btn-success-color:              #ffffff;
    --btn-success-border:             #16A316;
    --btn-success-background:         #16A316;
    --btn-success-hover-color:        #ffffff;
    --btn-success-hover-border:       #2a552a;
    --btn-success-hover-background:   #2a552a;

    --btn-secondary-color:            #ffffff;
    --btn-secondary-border:           #000000;
    --btn-secondary-background:       #000000;
    --btn-secondary-hover-color:      #000000;
    --btn-secondary-hover-border:     #ffb700;
    --btn-secondary-hover-background: #ffb700;

    --btn-bigger-secondary-color:            #ffb700;
    --btn-bigger-secondary-border:           #000000;
    --btn-bigger-secondary-background:       #000000;
    --btn-bigger-secondary-hover-color:      #000000;
    --btn-bigger-secondary-hover-border:     #ffb700;
    --btn-bigger-secondary-hover-background: #ffb700;
    --btn-bigger-secondary-size: 18px;

    --btn-warning-color:              #ffffff;
    --btn-warning-border:             #dca707;
    --btn-warning-background:         #dca707;
    --btn-warning-hover-color:        #ffffff;
    --btn-warning-hover-border:       #7d610d;
    --btn-warning-hover-background:   #7d610d;

    --btn-primary-color:              #000000;
    --btn-primary-border:             #ffb700;
    --btn-primary-background:         #ffb700;
    --btn-primary-hover-color:        #ffffff;
    --btn-primary-hover-border:       #000000;
    --btn-primary-hover-background:   #000000;

    --btn-bigger-primary-color:              #000000;
    --btn-bigger-primary-border:             #ffb700;
    --btn-bigger-primary-background:         #ffb700;
    --btn-bigger-primary-hover-color:        #ffffff;
    --btn-bigger-primary-hover-border:       #000000;
    --btn-bigger-primary-hover-background:   #000000;
    --btn-bigger-primary-size: 18px;

    --btn-danger-color:               #ffffff;
    --btn-danger-border:              #b11212;
    --btn-danger-background:          #b11212;
    --btn-danger-hover-color:         #ffffff;
    --btn-danger-hover-border:        #cc3939;
    --btn-danger-hover-background:    #cc3939;

    --btn-info-color:                 #ffffff;
    --btn-info-border:                #19779f;
    --btn-info-background:            #19779f;
    --btn-info-hover-color:           #ffffff;
    --btn-info-hover-border:          #205971;
    --btn-info-hover-background:      #205971;

    --header-link-color: #ffffff;
    --header-link-color-hover: #ffb700;
    --header-bottom-btn-color: #141414;
    --header-bottom-btn-hover-color: #ffb700;

    --footer-text-color: #ffffff;
    --footer-link-color: #ffffff;
    --footer-link-hover-color: #ffb700;

    --clr-buton: #ffb700;
    /* --clr-buton-hover: #12206b; */
    --clr-buton-hover: #000000;
    --clr-buton-spatiu: #ffffff;
    --primary-color: #ffb700;
    --culoare-activa: #ffb700;
    --culoare-secundara: #000000;
    --primary-hover-color: #399;
    --secondary-color: #ffffff;
    --secondary-light-color: #555;
    --border-color: solid 1px #ddd;
    --border-hover-color: solid 1px #ff4040;
    --background-color: #e7e7e7;
    --background-color2: #f9f4ef;
    --box-shadow: rgb(0 0 0 / 10%) 0px 4px 6px -1px, rgb(0 0 0 / 6%) 0px 2px 4px -1px;
    --primary-color-site: #f9f4ef;
}

.form-control {
    border-radius: var(--input-radius);
}
.container.container-small {
    max-width: 1360px !important;
}
.row-with-background {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.element-with-background {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.element-with-background.background-repeat {
    background-position: 0% 0%;
    background-repeat: repeat;
    background-size: contain;
}

.section-row-title {
    position: relative;
    width: 100%;
    margin-bottom: 80px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}
.section-row-title * {
    text-transform: uppercase;
}
.section-row-title .before_line, 
.section-row-title .after_line {
    height: 2px;
    background-color: var(--color-black);
    min-width: 20px;
    margin-bottom: 14px;
}
.section-row-title.section-row-title-yellow .before_line, 
.section-row-title.section-row-title-yellow .after_line {
    background-color: var(--color-primary);
}
.section-row-title h2 {
    max-width: calc(100% - 40px);
    padding: 0px 20px;
    background-color: transparent;
    font-size: 60px;
    font-family: 'barlow_condensed', 'Arial', 'Tahoma', sans-serif;
    font-weight: 600;
    font-style: normal;
    font-display: swap;
    color: var(--color-black);
    line-height: 1.2;
    text-align: center;
}
.section-row-title.section-row-title-yellow h2 {
    color: var(--color-primary);
}
.section-row-big-title h2 {
    padding: 0px 10px 10px;
    margin-bottom: 10px;
    background-color: transparent;
    font-size: 90px;
    font-family: 'barlow_condensed', 'Arial', 'Tahoma', sans-serif;
    font-weight: 500;
    font-style: normal;
    font-display: swap;
    color: var(--color-black);
    line-height: 1.2;
    text-align: center;
}
.section-row-big-title.section-row-title-yellow h2 {
    color: var(--color-primary);
}
.section-with-img-above {
    position: relative;
    z-index: 2;
}
.section-with-img-above .row-with-background {
    background-position: center bottom;
    padding-bottom: 246px;
}
.section-with-img-under {
    margin-top: -246px;
    position: relative;
    z-index: 1;
}

.section-after-header-auto-height {
    width: 100%;
    margin-top: -90px;
}
.section-after-header-auto-height .row-with-background {
    padding-top: 90px;
}
.other-pages-header-hero {
    width: 100%;
    height: 310px;
    margin-top: -90px;
}

.section-above-hero-title h4 {
    font-size: 39px;
    color: var(--color-black);
    font-family: 'Poppins', 'Arial', 'Tahoma', sans-serif;
    font-weight: bold;
    font-style: normal;
    font-display: swap;
    -webkit-text-stroke: 2px var(--color-primary); /* width and color */
    paint-order: stroke fill;  /* <-- add this for ticker text stroke  */
    line-height: 1.2;
    text-align: center;
}
.section-hero-title h1 {
    font-size: 90px;
    color: var(--color-primary);
    font-family: 'barlow_condensed', 'Arial', 'Tahoma', sans-serif;
    font-weight: 900;
    font-style: normal;
    font-display: swap;
    margin-bottom: 20px;
    -webkit-text-stroke: 3px var(--color-black); /* width and color */
    paint-order: stroke fill;  /* <-- add this for ticker text stroke  */
    text-transform: uppercase;
    line-height: 1.2;
    text-align: center;
}

@media ( max-width: 1600px ) {
    .other-pages-header-hero {
        height: 274.4px;
    }
}

@media ( max-width: 1380px ) {
    .section-after-header-auto-height {
        margin-top: -76.1px;
    }
    .section-after-header-auto-height .row-with-background {
        padding-top: 76.1px;
        padding-bottom: 166px;
    }
    .section-with-img-under {
        margin-top: -166px;
    }
    .other-pages-header-hero {
        height: 226.1px;
        margin-top: -76.1px;
    }
}

@media ( max-width: 1365px ) {
    .section-above-hero-title h4 {
        font-size: 30px;
    }
    .section-hero-title h1 {
        font-size: 70px;
    }
    .section-row-big-title h2 {
        font-size: 70px;
    }
}

@media ( max-width: 1023px ) {
    .section-above-hero-title h4 {
        font-size: 28px;
    }
    .section-hero-title h1 {
        font-size: 60px;
    }
    .section-row-big-title h2 {
        font-size: 60px;
    }
}

@media ( max-width: 767px ) {
    .section-after-header-auto-height .row-with-background {
        padding-bottom: 10px;
    }
    .section-with-img-under {
        margin-top: -130px;
    }
    .section-row-title {
        margin-bottom: 50px;
    }
    .section-above-hero-title h4 {
        font-size: 26px;
    }
    .section-hero-title h1 {
        font-size: 50px;
    }
    .section-row-title h2 {
        font-size: 40px;
    }
    .section-row-big-title h2 {
        font-size: 50px;
    }
}

@media ( max-width: 570px ) {
    .section-after-header-auto-height {
        margin-top: -62.65px;
    }
    .section-after-header-auto-height .row-with-background {
        padding-top: 62.65px;
    }
    .other-pages-header-hero {
        height: 162.65px;
        margin-top: -62.65px;
    }
}

@media ( max-width: 530px ) {
    .section-after-header-auto-height {
        margin-top: -63.18px;
    }
    .section-after-header-auto-height .row-with-background {
        padding-top: 63.18px;
    }
    .section-with-img-under {
        margin-top: -110px;
    }
    .other-pages-header-hero {
        height: 127.18px;
        margin-top: -63.18px;
    }
}

@media ( max-width: 479px ) {
    .section-above-hero-title h4 {
        font-size: 20px;
    }
    .section-hero-title h1 {
        font-size: 38px;
    }
    .section-row-title h2 {
        font-size: 32px;
    }
    .section-row-big-title h2 {
        font-size: 38px;
    }
}