* {
    padding: 0px;
    margin: 0px;
}

:root {
    --primary-clr1: #0c0c0c;
    --primary-clr2: #FBF5F3;
    --primary-clr3: #E28413;
}

.golosText {
    font-family: "Golos Text", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
}

html {
    position: relative;
    width: 100vw;
    height: 100vh;
    margin: 0px;
    overflow-x: hidden;

    @media(min-width: 1280px) {
        background-color: var(--primary-clr1);
    }
}

body[lang="en"] [lang="por"], body[lang="por"] [lang="en"] {
    display: none;
}

body {
    position: relative;
    width: 100%;
    height: 100%;
    margin: 0px;
    background-color: var(--primary-clr2);
    overflow-x: hidden;
    overflow-y: scroll;


    @media(max-width: 1050px) {
        position: relative;
        width: 100vw;
        overflow-x: hidden;
    }

    @media(min-width: 1980px) {
        width: 1300px;
        height: 100vh;
        margin-left: calc(50% - 650px);
        background-color: var(--primary-clr2);
    }
}

.pEleClass1 {
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-weight: 100;
    font-style: normal;
    font-variation-settings: "wdth" 100;
}

header {
    position: fixed;
    z-index: 9999;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 50px;
    margin: 0px;

    @media(max-width: 1050px) {
        width: 100vw;
        background-color: rgba(0, 0, 0, 0.9);
        border-bottom-left-radius: 20px;
        border-bottom-right-radius: 20px;
    }

    @media(min-width: 1980px) {
        width: 1300px;
        margin-left: calc(50% - 650px);
    }
}

footer {
    position: relative;
    width: 100%;
    height: 50px;
    background-color: var(--primary-clr1);

    @media(min-width: 1280px) {
        width: 1300px;
        margin-left: calc(50% - 650px);
        overflow-x: hidden;
    }
}

#hdFltMnu {
    position: fixed;
    z-index: 99999;
    top: 0;
    right: 0px;
    width: 300px;
    margin: 0px;
    margin-right: -300px;
    height: 100vh;
    color: black;
    background-color: white;
    transition-duration: 0.5s;
}

#hdFltMnu ul {
    position: relative;
    top: 0px;
    right: 0px;
    width: 250px;
    color: black;
    margin: 0px;
    margin-top: 70px;
}

.hdFltMnuLi {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 75%;
    height: 40px;
    margin: 10px 0px;
    margin-left: 5%;
    list-style-type: none;
    border: 1px solid black;
    border-radius: 20px;
    cursor: default;
}

.hdFltMnuLi:hover {
    color: white;
    background-color: black;
}

header div {
    position: relative;
    float: left;
}

#hdDiv1 {
    width: 25%;
    height: 100%;

    @media(max-width: 1050px) {
        width: 45%;
    }
}

#hdDiv2 {
    position: relative;
    z-index: 99999;
    width: 50%;
    height: 100%;

    @media(max-width: 1050px) {
        width: 10%;
    }
}

#hdDiv3 {
    width: 25%;
    height: 100%;

    @media(max-width: 1050px) {
        width: 45%;
    }
}

#lngSelBtn {
    position: absolute;
    z-index: 9999;
    top: 5px;
    left: 0px;
    width: 55px;
    height: 40px;

    @media(max-width: 1050px) {
        left: 0px;
    }
}

#lngSelBtnTtl {
    position: absolute;
    z-index: 99;
    top: 5px;
    left: 0px;
    display: block;
    width: 4.5em;
    margin-top: 10px;
    margin-left: 14px;
    padding: 2px;
    padding-right: 15px;
    background-color: white;
    color: black;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    text-align: right;
    transition-duration: 0.5s;
    overflow: hidden;

    @media(max-width: 1050px) {
        left: 0px;
    }
}

#hdMnuBtn {
    position: absolute;
    top: 0px;
    right: 0px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin: 5px 0px;
    margin-right: 20px;
    background-color: var(--primary-clr3);
    border-style: none;
    border-radius: 25px;
    transition-duration: 0.5s;
}

#hdMnuBtnImgIcn {
    position: relative;
    width: 25px;
    height: 25px;
}

#hdMnuBtn2ImgIcn {
    position: relative;
    width: 15px;
    height: 15px;
}

#hdMnuBtn2 {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    float: right;
    width: 40px;
    height: 40px;
    margin: 5px 0px;
    margin-right: 20px;
    background-color: var(--primary-clr3);
    border-style: none;
    border-radius: 25px;
}

#heroDiv {
    position: relative;
    z-index: 999;
    width: 100%;
    height: auto;
    margin: 0px;
    background-color: var(--primary-clr2);
}

.heroSubDiv {
    position: relative;
    width: 100%;
    height: 100vh;
    margin: 0px;

    @media(min-width: 1980px) {
        width: 1300px;
        height: 700px;
        margin-left: calc(50% - 650px);
        overflow-x: hidden;
        overflow-y: hidden;
    }
}

#wrp1 {
    background: url(img/bckgrdImg2.jpg);
    background-size: 100% 100%;

    @media(max-width: 1050px) {
        width: 100vw;
        height: 600px;
        background-size: 100% 100%;
    }
}

#wrp3 {
    overflow: visible;

    @media(max-width: 1050px) {
        width: 100vw;
        height: 870px;
        overflow-y: hidden;
        overflow-x: hidden;
    }
}

#wrpPrt {
    height: 350px;

    @media(max-width: 1050px) {
        height: 980px;
    }
}

#wrp4 {
    @media(max-width: 1050px) {
        width: 100vw;
        height: 1250px;
    }
}

#wrp5 {
    @media(max-width: 1050px) {
        height: 1520px;
    }
}

#wrp1BbyChickImgHld {
    position: absolute;
    top: -60px;
    left: 21%;
    width: 55%;
    height: 110%;
    transition-duration: 0.5s;

    @media(max-width: 1050px) {
        top: 20px;
        left: calc(50% - 275px);
        width: 550px;
        height: 600px;
    }
}

#wrp1Wrd1 {
    position: absolute;
    top: calc(50% - 1em);
    left: 15%;
    margin: 0px;
    font-size: 400%;
    color: white;
    transition-duration: 0.5s;

    @media(max-width: 1050px) {
        visibility: hidden;
    }
}

#wrp1Wrd2 {
    position: absolute;
    top: calc(50% - 1em);
    right: 15%;
    margin: 0px;
    font-size: 400%;
    color: white;
    transition-duration: 0.5s;

    @media(max-width: 1050px) {
        visibility: hidden;
    }
}

#wrp1SpaceDiv {
    position: relative;
    width: 100%;
    height: 0px;
    visibility: hidden;

    @media(max-width: 1050px) {
        height: 50px;
        visibility: visible;
    }
}

#wrp1Wrd3 {
    position: relative;
    width: 100%;
    margin: 0px;
    font-size: 2.5em;
    color: white;
    transition-duration: 0.5s;
    visibility: hidden;
    text-align: center;

    @media(max-width: 1050px) {
        visibility: visible;
    }
}

#wrp1BtnHld1 {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 60px;
    bottom: 100px;
    left: 0px;
}

#wrp1BtnHld1Btn1, #wrp1BtnHld1Btn1Por {
    position: relative;
    width: 150px;
    height: 40px;
    margin: 0px;
    margin-right: 20px;
    border-style: none;
    text-align: center;
    background-color: var(--primary-clr1);
    color: white;
}

#wrp1BtnHld1Btn2, #wrp1BtnHld1Btn2POR {
    position: relative;
    width: 160px;
    height: 40px;
    border-style: none;
    text-align: center;
    background-color: var(--primary-clr3);
    color: white;
}

.wrp1BtnHld1Arrow {
    margin: 0px;
    margin-left: 15px;
}

#wrp1PrdsHld {
    position: absolute;
    top: 8%;
    right: -5px;
    width: 60px;
    height: 90%;

    @media(max-width: 1050px) {
        visibility: hidden;
    }
}

#wrp1VlueHld {
    position: absolute;
    top: 10%;
    left: 0px;
    width: 60px;
    height: 80%;
    visibility: hidden;

    @media(max-width: 1050px) {
        visibility: hidden;
    }
}

.wrp1PrdDtlArrCpt {
    position: absolute;
    top: 150px;
    right: -600px;
    width: 550px;
    height: 400px;
    transition-duration: 0s;
}

#wrp1PrdDtlArrCpt1 {
    z-index: 9;
}

#wrp1PrdDtlArrCpt2 {
    z-index: 9;
}

#wrp1PrdDtlArrCpt3 {
    z-index: 9;
}

#wr1PrdDtl1 {
    position: absolute;
    top: 200px;
    right: 130px;
    width: auto;
    height: auto;
    color: white;
    transition-duration: 1s;
    opacity: 0;
}

#wr1PrdDtl1SubDiv {
    position: relative;
    width: auto;
    height: auto;
    margin: 0px;
    margin-top: 35px;
    margin-right: 40px;
    transform: scale(155%);
}

#wr1PrdDtl2 {
    position: absolute;
    top: 200px;
    right: 80px;
    width: auto;
    height: auto;
    color: white;
    transform: scale(100%);
    transition-duration: 1s;
    opacity: 0;
}

#wr1PrdDtl3 {
    position: absolute;
    top: 200px;
    right: 120px;
    width: auto;
    height: auto;
    color: white;
    transform: scale(100%);
    transition-duration: 1s;
    opacity: 0;
}

.wrp1PrdDtlBtnCls {
    position: relative;
    z-index: 99999;
    width: 150px;
    height: 40px;
    margin: 0px;
    margin-top: 30px;
    margin-left: calc(50% - 75px);
    border-style: none;
    background-color: var(--primary-clr1);
    color: white;
    border-left: 5px solid var(--primary-clr3);
    transition-duration: 1s;
}

#wrp1PrdDtlBtn1 {
    position: absolute;
    bottom: 110px;
    left: 0;
}

#wrp1PrdDtlBtn2 {
    position: absolute;
    bottom: 130px;
    left: 0;
}

#wrp1PrdDtlBtn3 {
    position: absolute;
    bottom: 70px;
    left: 30px;
}

.wrp1PrdDes2H1 {
    position: relative;
    font-size: 7.3em;
    margin: 0px;
}

#wrp1PrdDes2H1Por {
    letter-spacing: -40px;
}

.wrp1PrdDes2H2 {
    position: relative;
    margin: 0px;
    margin-top: -20px;
    letter-spacing: 8px;
}

#wrp1PrdDes2P1 {
    position: relative;
    width: 100%;
    margin: 0px;
    margin-top: 0px;
    font-weight: 700;
    text-align: center;
}

.wrp1PrdsHldTtl {
    position: relative;
    width: 100px;
    height: auto;
    margin: 0px;
    margin-top: 80px;
    margin-bottom: 100px;
    margin-left: -25px;
    transform: rotate(-90deg);
    color: white;
}

#wrp1VluesHldTtl {
    position: relative;
    width: 100px;
    height: auto;
    margin: 0px;
    margin-top: 80px;
    margin-bottom: 100px;
    margin-left: -25px;
    transform: rotate(-90deg);
    color: white;
}

.wrp1PrdsTtlHld {
    position: relative;
    display: flex;
    z-index: 9999;
    align-items: center;
    justify-content: center;
    width: 100px;
    height: 50px;
    margin: 0px;
    margin-top: 70px;
    margin-left: -25px;
    border: 2px solid rgba(255, 255, 255, 0.664);
    border-bottom: none;
    transform: rotate(-90deg);
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.664);
    transition-duration: 1s;
}

.wrp1PrdsTtlHld p, .wrp1PrdsTtlHld2 p {
    z-index: 999;
    cursor: default;
}

.wrp1PrdsTtlHld2 {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100px;
    height: 50px;
    margin: 0px;
    margin-top: 70px;
    margin-left: -25px;
    border: 2px solid rgba(255, 255, 255, 0.664);
    border-top: none;
    transform: rotate(-90deg);
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.664);
}

#wrp1PrdDiv1 {
    z-index: 0;
}

#wrp1PrdDiv2 {
    z-index: 99;
}

#wrp1PrdDiv3 {
    z-index: 9999;
}

#wrp1PrdDiv1:hover, #wrp1PrdDiv2:hover, #wrp1VlueDiv1:hover, #wrp1VlueDiv2:hover {
    background-color: var(--primary-clr1);
    opacity: 0.7;
}

#priHdMnuNav {
    position: relative;
    z-index: 99999;
    width: 100%;
    height: 100%;
    margin: 0px;
    margin-top: -49px;
    color: var(--primary-clr2);
    background-color: rgba(0, 0, 0, 0);
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px;
    transition-duration: 0.5s;

    @media(max-width: 1050px) {
        visibility: hidden;
    }
}

#priHdMnuNavUl {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px;
    overflow: hidden;
}

.priHdMnuNavLi {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(100% / 4);
    height: 100%;
    margin: 0px;
    list-style-type: none;
    cursor: default;
}

.priHdMnuNavLi:hover {
    background-color: var(--primary-clr3);
    color: white;
}

#priHdMnuNavToggle {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    bottom: -25px;
    left: calc(50% - 15px);
    width: 30px;
    height: 30px;
    transform: rotate(90deg);
    border-radius: 30px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    color: var(--primary-clr2);
    background-color: rgba(0, 0, 0, 0.3);
    font-size: 1.5em;
    transition-duration: 0.5s;
}

#priHdMnuNavTogglePEle {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    cursor: pointer;
}

#wrp2 {
    overflow: visible;
    background-color: rgb(146, 22, 0);

    @media(max-width: 1050px) {
        height: 800px;
    }
}

#wrp2Div1 {
    position: absolute;
    z-index: 9999;
    top: 0;
    left: 0;
    width: 80%;
    height: calc(100% + 50px);
    margin: 0px;
    margin-top: -50px;
    margin-left: 10%;
    color: var(--primary-clr2);
    background-color: var(--primary-clr1);
    background: linear-gradient(to bottom, var(--primary-clr1), #0c0c0c, #0c0c0c, #0c0c0c, #0c0c0c00);

}

#wrp2Div1Line {
    position: absolute;
    top: -40px;
    right: 10%;
    width: 80%;
    height: 10px;
    margin: 0px;
    border-top: 3px solid var(--primary-clr3);

    @media(max-width: 1050px) {
        position: relative;
        width: 90%;
        top: 0px;
        left: 5%;
        margin: 0px;
    }
}

#wrp2Div2 {
    position: absolute;
    z-index: 9999;
    top: 50%;
    left: 0;
    width: 80%;
    height: 300px;
    margin: 0px 10%;
    color: var(--primary-clr2);

    @media(max-width: 1050px) {
        position: relative;
        top: 370px;
        font-size: 1em;
    }
}

#wrp2ChickGrpHld {
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    height: 300px;
    overflow: hidden;
}

#wrp2ChickGrp {
    position: absolute;
    top: 0px;
    left: 0px;
    width: auto;
    height: 300px;
}

#wrp2Div1LogoShild {
    position: absolute;
    top: -25px;
    left: calc(50% - 40px);
    width: 80px;
    height: 80px;
}

#wrp2Div1LogoHld {
    position: absolute;
    top: -13px;
    left: calc(50% - 25px);
    width: 50px;
    height: 50px;
}

#wrp2Div1 div {
    position: relative;
    float: left;
    width: 49%;
    height: 100%;

    @media(max-width: 1050px) {
        float: none;
        width: 100%;
        height: auto;
    }
}

#wrp2Div1 #wrp2Div1Sub1 {
    width: 45%;
    font-size: 1.9em;
    margin: 0px;
    margin-top: 50px;
    margin-left: 50px;
    color: var(--primary-clr3);
    font-family: "Raleway", sans-serif;
    font-optical-sizing: auto;
    font-weight: 900;
    font-style: normal;
    overflow: hidden;

    @media(max-width: 1050px) {
        width: 100%;
        margin-top: 60px;
        margin-left: 20px;
        font-size: 1em;
    }
}

#wrp2Div1Sub2 {
    @media(max-width: 1050px) {
        width: 100%;
        height: auto;
    }
}

.wrp2Div1Sub2PEle {
    position: relative;
    display: block;
    width: 70%;
    height: auto;
    margin: 0px;
    margin-left: 15%;
    margin-top: 20%;
    padding: 10px 0px;
    padding-left: 25px;
    border-left: 3px solid var(--primary-clr3);
    font-size: 1.3em;

    @media(max-width: 1050px) {
        width: 90%;
        margin: 0px;
        margin-left: 5%;
        border-left: none;
        border-top: 3px solid var(--primary-clr3);
        padding: 0px;
        padding-top: 10px;
        font-size: 1em;
    }
}

.wrp2Div1Sub2H2 {
    position: relative;
    margin: 0px;
    margin-top: 15px;
    margin-left: calc(15% + 25px);

    @media(max-width: 1050px) {
        margin-left: 5%;
        font-size: 1em;
    }
}

.wrp2WhoWeAreH2 {
    position: relative;
    width: 80%;
    margin: 0 10%;
    margin-bottom: 10px;

    @media(max-width: 1050px) {
        font-size: 1em;
    }
}

.wrp2WhoWeAreP1 {
    position: relative;
    width: 80%;
    margin: 0px 10%;
    font-size: 1.3em;

    @media(max-width: 1050px) {
        width: 90%;
        margin: 0px 5%;
        font-size: 1em;
    }
}

.wrp3DivClass {
    position: relative;
    float: left;
    width: 50%;
    height: calc(100% - 50px);
    margin: 0px;
    margin-top: 50px;

    @media(max-width: 1050px) {
        position: absolute;
        top: 0px;
        left: 0px;
        height: 800px;
        width: 100vw;
        margin: 0px;
    }
}

#wrp3SubDiv1 {
    @media(max-width: 1050px) {
        height: 20px;
        z-index: 999;
        background-color: red;
    }
}

#wrp3SubDiv2 {
    height: 100%;
    background-color: none;

    @media(max-width: 1050px) {
        z-index: 9999;
        height: 800px;
        margin-top: 80px;
        left: -30px;
        transform: scale(80%);
    }
}

#wrp3SubDiv2Div1ImgHld {
    position: relative;
    width: 2000px;
    height: 550px;
    margin: 0px;
    transition-duration: 1s;
}

.wrp3SubSubDiv {
    position: relative;
    float: left;
    width: 400px;
    height: 500px;
    margin: 0px;
    margin-top: 30px;
    transition-duration: 1s;
}

#wrp3SubSubDiv1 {
    transform: scale(100%);
    margin-left: 0px;
}

#wrp3SubSubDiv2 {
    width: 450px;
    height: 550px;
    transform: scale(90%);
    margin-left: -20px;
}

#wrp3SubSubDiv3 {
    transform: scale(90%);
    margin-left: -20px;

    @media(max-width: 1050px) {
        width: 490px;
        margin-left: -90px;
        margin-right: 0px;
        overflow: hidden;
    }
}

#wrp3SubSubDiv4 {
    margin-left: 70px;

    @media(max-width: 1050px) {
        margin-left: 50px;
    }
}

#wrp3SubSubDiv3PrdHld {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    bottom: -30px;
    left: 0px;
    width: 500px;
    height: 80px;

    @media(max-width: 1050px) {
        display: block;
        top: 200px;
        left: 0px;
        width: 80px;
        height: 500px;
    }
}

.wrp3SuSuDi3PrHdImgCl {
    position: relative;
    width: 70px;
    height: 70px;
    margin: 0px 10px;
    transition-duration: 1s;
}

.wrp3SuSuDi3PrHdImgCl:hover {
    transform: scale(130%);
}

#wrp3SuSuDi3PrHdImgCl1 {
    margin-top: -15px;
}

.wrp3SubSubDiv1Img {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 400px;
    height: 500px;
}

#wrp3SuSuDiv3Img1, #wrp3SuSuDiv3Img2 {
    width: 500px;
}

.wrp3SubSubDiv1Img2 {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 500px;
    height: 500px;

    @media(max-width: 1050px) {
        left: 100px;
    }
}

#wrp3SuSuDiv1Img1, #wrp3SuSuDiv2Img1, #wrp3SuSuDiv3Img1 {
    z-index: 9999;
    opacity: 1;
    transition-duration: 1.5s;
}

#wrp3SuSuDiv2Img1, #wrp3SuSuDiv2Img2 {
    margin-left: 60px;

    @media(max-width: 1050px) {
        margin-left: 0px;
    }
}

#wrp3SuSuDiv1Img1 {
    opacity: 0;
    width: 500px;
    margin-left: -50px;

    @media(max-width: 1050px) {
        margin-top: 30px;
        margin-left: -10px;
        width: 470px;
        height: 470px;
    }
}

#wrp3SuSuDiv1Img2 {
    width: 500px;
    margin-left: -50px;

    @media(max-width: 1050px) {
        margin-top: 30px;
        margin-left: -10px;
        width: 470px;
        height: 470px;
    }
}

#wrp3SubDiv2Div1 {
    position: relative;
    width: 90%;
    height: 83%;
    margin: 0px;
    margin-top: 120px;
    margin-left: 10%;
    overflow-x: hidden;

    @media(max-width: 1050px) {
        position: absolute;
        top: 0px;
        left: 0px;
        z-index: 999999;
        width: 600px;
        height: 600px;
        margin-top: -65px;
        margin-left: 0px;
        transform: scale(80%);
        overflow: hidden;
    }
}

#wrp3Sub2Div1LeanGradient {
    position: absolute;
    z-index: 9999;
    top: 0;
    left: 0;
    width: 5px;
    height: 100%;
    background: linear-gradient(to right, var(--primary-clr2), rgba(255, 255, 255, 0));

    @media(max-width: 1050px) {
        top: 120px;
        height: 67%;
    }
}

#wrp3Sub2Div1LeanGradient2 {
    position: absolute;
    z-index: 9999;
    top: 0;
    left: 450px;
    width: 70px;
    height: 100%;
    background: linear-gradient(to left, white, var(--primary-clr2), rgba(255, 255, 255, 0));
    visibility: hidden;

    @media(max-width: 1050px) {
        visibility: hidden;
        left: calc(100vw - 70px);
        border: 1px solid black;
    }
}

.wrp3SubDiv1MnH1 {
    position: relative;
    margin: 0px;
    margin-left: 100px;
    margin-top: 30px;
}

#wrp3SubDiv1Ul {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 90%;
    height: 50px;
    margin: 0px 5%;
    margin-top: 30px;
    list-style-type: none;

    @media(max-width: 1050px) {
        display: block;
        width: 100%;
        margin: 0;
        margin-left: 0px;
        color: white;
        background-color: red;
    }
}

.wrp3SubDiv1Li {
    position: relative;
    width: calc(100% / 4 - 1%);
    cursor: pointer;
    transition-duration: 0.5s;

    @media(max-width: 1050px) {
        float: left;
        width: calc(100% / 3);
        margin: 0px;
    }
}

.wrp3SubDiv1Li:hover {
    color: white;
    background-color: var(--primary-clr1);
    border-radius: 10px;

    @media(max-width: 1050px) {
        background-color: red;
    }
}

.wrpSelectPrdHover:hover {
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}


#wrp3SubDiv1Li1, #wrp3SubDiv1Li2, #wrp3SubDiv1Li3 {
    @media(max-width: 1050px) {
        width: 20%;
    }
}

.wrp3SubDiv1Li p {
    width: 100%;
    height: 100%;
    text-align: center;
    cursor: pointer;

    @media(max-width: 1050px) {
        font-size: 0.8em;
        margin-top: 20px;
    }
}

#wrp3SubDiv1Li4 {
    width: 300px;

    @media(max-width: 1050px) {
        width: 40%;
        height: 48px;
        font-size: 0.9em;
    }
}

#wrp3SubDiv1Li4 p {
    @media(max-width: 1050px) {}
}

#wrp3SubDiv1Line1 {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    border-bottom: 1px solid black;
    transition-duration: 0.5s;

    @media(max-width: 1050px) {
        border-bottom: 1px solid white;
    }
}

#wrp3SubDiv1Line2, #wrp3SubDiv1Line3, #wrp3SubDiv1Line4 {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 0%;
    height: 100%;
    border-bottom: 1px solid black;
    transition-duration: 0.5s;

    @media(max-width: 1050px) {
        border-bottom: 1px solid white;
    }
}

#wrp3PrdDesc {
    position: relative;
    width: 80%;
    height: 400px;
    margin: 0px;
    margin-left: 11%;

    @media(max-width: 1050px) {}
}

.wrp3PrdDescHd {
    position: absolute;
    top: 20px;
    left: 0;
    width: 600px;
    height: 450px;

    @media(max-width: 1050px) {
        top: -40px;
        left: -70px;
        transform: scale(80%);
    }
}

#chickPrdTtlWrp3 {
    margin-top: 30px;
    margin-left: 70px;
    transform: scale(130%);

    @media(max-width: 1050px) {
        position: absolute;
        top: 0px;
        left: -50px;
        margin: 0px;
        transform: scale(80%);
    }
}

.wrp3PrdDes1H1-2 {
    color: white;
}

#wrp3PrdDes1h1WrdHAPPY2 {
    top: 7px;

    @media(max-width: 1050px) {
        top: -5px;
    }
}

#chickenPrdTtlWrp3 {
    position: relative;
    width: auto;
    height: auto;
    transform: scale(95%);
    margin-top: 20px;

    @media(max-width: 1050px) {
        position: absolute;
        top: -30px;
        left: -70px;
        margin-top: 0px;
        transform: scale(70%);
    }
}

#goodsPrdTtlWrp3 {
    transform: scale(80%);
    margin-left: -50px;

    @media(max-width: 1050px) {
        position: absolute;
        top: -30px;
        left: -70px;
        margin: 0px;
        transform: scale(70%);
    }
}

#wrp3PrdDescHd1 {
    visibility: visible;
    transition-duration: 0s;
}

#wrp3PrdDescHd2, #wrp3PrdDescHd3, #wrp3PrdDescHd4 {
    visibility: hidden;
    transition-duration: 0s;
}

.wrp3PrdDes1H1 {
    position: relative;
    display: block;
    margin: 0px;
    margin-top: -10px;
    margin-left: 40px;
    font-size: 3.1em;
}

#wrp3PrdDes1H1-1 {
    letter-spacing: 9px;
}

.wrp3PrdDes1H1-2 {
    position: absolute;
    display: block;
    top: 10px;
    left: -10px;
    height: 4em;
    margin: 0px;
    margin-left: 20px;
    padding: 5px;
    font-size: 1.2em;
    line-height: 0.8em;
    background-color: red;
}

#wrp3PrdDes1P1, #wrp3PrdDes1P1-2 {
    text-transform: uppercase;
    width: 270px;
    margin: 0px;
    margin-top: -3px;
    margin-left: 10px;
    font-size: 0.95em;
    border-top: 1px solid white;
}

#wrp3PrdDes1P1-2 {
    border-top: 1px solid black;

    @media(max-width: 1050px) {
        text-align: center;
    }
}

#wrp3PrdDes2H1 {
    position: relative;
    font-size: 6.5em;
    margin: 0px;
    color: var(--primary-clr3);
}

#wrp3PrdDes2H2 {
    position: absolute;
    top: 0px;
    left: 400px;
}

#wrp3PrdDes2P1 {
    margin: 0px;
    margin-top: -5px;
    padding-top: 3px;
    font-size: 1.2em;
    letter-spacing: 8px;
    border-top: 1px solid black;
    text-align: center;

    @media(max-width: 1050px) {
        z-index: 99999;
    }
}

.wrp3PrdDes3H1Cl {
    position: relative;
    width: 384px;
    margin: 0px;
    font-size: 4em;
    letter-spacing: 14.5px;
    overflow: hidden;
}

.wrp3PrdDes3H1Cl2 {
    position: relative;
    width: 384px;
    margin: 0px;
    font-size: 4em;
    overflow: hidden;
    background-color: red;
    color: white;
    letter-spacing: 0px;
}

#wrp3PrdDes3P1 {
    position: relative;
    width: 384px;
    margin: 0px;
    padding: 5px 0px;
    text-transform: uppercase;
    letter-spacing: 30px;
}

#wrp3PrdDes3P2 {
    position: relative;
    width: 384px;
    margin: 0px;
    padding-top: 5px;
    text-transform: uppercase;
    letter-spacing: 57px;
}

#chickPrdDesWrp3, #chickenPrdDesWrp3, #goodsPrdDesWrp3, #eggsPrdDesWrp3 {
    @media(max-width: 1050px) {
        position: absolute;
        top: 470px;
        left: 0;
        width: 420px;
        height: auto;
        color: white;
        background-color: rgba(0, 0, 0, 0.9);
        border-radius: 10px;
    }
}

#eggsPrdDesWrp3 {
    @media(max-width: 1050px) {
        top: 380px;
        left: -40px;
        width: 350px;
        margin-left: calc(50% - 175px + 40px);
    }
}

#chickPrdDesWrp3 p, #chickenPrdDesWrp3 p, #goodsPrdDesWrp3 p, #eggsPrdDesWrp3 p {
    position: absolute;
    top: 200px;
    left: -30px;
    width: 80%;
    height: auto;
    padding: 10px;
    font-size: 1.3em;
    color: white;
    background-color: black;
    border-radius: 10px;

    @media(max-width: 1050px) {
        position: relative;
        top: 0;
        left: 0;
        background-color: rgba(0, 0, 0, 0);
    }
}

#eggsPrdDesWrp3 p {
    top: 170px;
    width: 600px;
    height: auto;
    padding: 20px;

    @media(max-width: 1050px) {
        position: relative;
        top: 0px;
        width: 90%;
        margin: 10px 5%;
        padding: 8px;
        font-size: 1em;
    }
}

.wrp3PrdDescHd p {
    width: 90%;
    margin-left: 5%;
}

#wrp4TopSpacer {
    position: relative;
    width: 100%;
    height: 50px;
    margin: 0px;
}

#eggsTtlWrp3 {
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    top: 0px;
    left: 0px;
    width: 300px;
    height: 85px;
    margin: 0px;
    margin-top: 50px;
    margin-left: calc(50% - 150px);
    transform: scale(140%);

    @media(max-width: 1050px) {
        top: -30px;
        transform: scale(100%);
    }
}

#eggsTtlWrp3 h1 {
    margin: 0px;
    font-size: 5em;
    margin-left: 10px;
    letter-spacing: 10px;
}

#eggsTtlWrp3 h2 {
    margin: 0px;
    margin-bottom: -20px;
}

.wrp4DivTtl {
    position: relative;
    width: 50%;
    height: auto;
    margin: 0px;
    margin-top: 30px;
    margin-left: 25%;

    @media(max-width: 1050px) {
        width: 90%;
        margin-left: 20px;

        @media(max-width: 1050px) {
            transform: scale(80%);
        }
    }
}

.wrpPrtMnH1 {
    position: relative;
    width: 100%;
    margin: 0px;
    margin-top: 20px;
    text-align: center;
    font-size: 3em;
    color: var(--primary-clr1);
}

.h1Spacer {
    margin-top: 100px;
    margin-bottom: -50px;
}

.wrpPrtBrdCnt {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 220px;

    @media(max-width: 1050px) {
        height: auto;
        display: block;
        height: auto;
    }
}

.wrpPrtBrdHld {
    position: relative;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 240px;
    height: 190px;
    margin: 0px 20px;

    @media(max-width: 1050px) {
        float: none;
        margin-left: calc(50% - 125px);
        transform: scale(80%);
    }
}

.wrpPrtBrdHldImgCl {
    position: relative;
    width: 200px;
    height: 150px;
}

.wrp4DivTtlPEle1 {
    position: relative;
    margin: 0px;
    margin-bottom: -10px;
    font-weight: 700;
}

.wrp4DivTtlSubDiv {
    position: relative;
    width: auto;
    height: auto;
}

.wrp4DivTtlSubDiv h1 {
    position: relative;
    display: inline-block;
    margin: 0px;
    font-size: 5em;
    text-transform: uppercase;
    color: var(--primary-clr3);

    @media(max-width: 1050px) {
        width: 90vw;
        margin-bottom: 0px;
        text-align: center;
    }
}

#wrp4DivTtlSubDivMinH2Hld {
    position: absolute;
    top: 0px;
    left: 360px;
    width: 300px;
    height: 200px;
}

#wrp4DivTtlH1Por {
    margin-left: -40px;

    @media(max-width: 1050px) {
        margin-left: -10px;
    }
}

.wrp4DivTtlSubDiv p {
    position: relative;
    display: inline-block;
    margin: 0px;
    padding: 0px;
    font-size: 1.4em;

    @media(max-width: 1050px) {
        position: absolute;
        top: 2.8em;
        left: 0;
        width: 90vw;
        text-align: center;
        font-weight: 700;
    }
}


#wrp4DivTtlPElePor {
    margin-left: 7px;
}

.wrp4DivTtlSubDiv h2 {
    position: relative;
    margin: 0px;
    font-size: 3em;
}

#wrp4DivTtlSubDivH2Wrd1 {
    position: absolute;
    top: 30px;
    right: 40px;
    margin-top: -20px;

    @media(max-width: 1050px) {
        visibility: hidden;
    }
}

#wrp4DivTtlSubDivH2Wrd2 {
    position: absolute;
    top: 70px;
    right: -21px;
    margin-top: -20px;

    @media(max-width: 1050px) {
        visibility: hidden;
    }
}

#wrp4DivTtlSubDivH2Wrd3 {
    visibility: hidden;

    @media(max-width: 1050px) {
        width: 100%;
        margin: 0px;
        font-size: 1.8em;
        visibility: visible;
        letter-spacing: 3px;
    }
}

.wrp4DivTtlH3 {
    position: relative;
    display: flex;
    align-items: center;
    height: 30px;
    width: 200px;
    margin: 0px;
    margin-top: -60px;
    padding: 0px;
    padding-left: 10px;
    color: var(--primary-clr2);
    background-color: var(--primary-clr1);
    border-left: 3px solid red;
    font-size: 1em;

    @media(max-width: 1050px) {
        margin-top: 10px;
    }
}

#wrp4DivTtlH3Por {
    width: 250px;
}

.wrp4DivDesHld {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 90%;
    height: 60%;
    margin: 0px;
    margin-top: 40px;
    margin-left: 5%;

    @media(max-width: 1050px) {
        display: block;
        width: 90vw;
    }
}

.wrp4DivDesDiv {
    position: relative;
    width: calc(100% / 3 - 30px);
    height: 90%;
    margin: 0px 15px;
    color: var(--primary-clr2);
    background-color: var(--primary-clr1);
    border-radius: 30px;
    box-shadow: 2px 2px 4px 1px rgba(0, 0, 0, 0.555);

    @media(max-width: 1050px) {
        width: 90%;
        height: 300px;
    }
}

.wrp4DesDivSpacer {
    position: relative;
    width: 0%;
    height: 0px;

    @media(max-width: 1050px) {
        width: 100%;
        height: 10px;
    }
}

.wrp4DivDesDivH2 {
    width: 90%;
    height: auto;
    margin: 0px;
    margin-top: 20px;
    margin-left: 7%;
    color: var(--primary-clr3);
}

.wrp4DivDesDivPEle {
    width: 80%;
    height: auto;
    margin: 0px;
    margin-top: 20px;
    margin-left: 10%;
    font-size: 1.3em;

    @media(max-width: 1050px) {
        font-size: 1em;
    }
}

#wrp5TopSpacer {
    position: relative;
    width: 100%;
    height: 50px;
    margin: 0px;
}

.wrp5SubDiv {
    position: relative;
    float: left;
    width: 48%;
    height: 100%;
    margin: 0% 1%;

    @media(max-width: 1050px) {
        float: none;
        width: 90%;
    }
}

#wrp5SubDiv1 {
    @media(max-width: 1050px) {
        height: 850px;
    }
}

#wrp5SubDiv2 {
    @media(max-width: 1050px) {
        width: 100vw;
        height: 590px;
        margin-left: 0px;
    }
}

#wrp5SubDiv1 h1 {
    margin: 0px;
    margin-left: 5%;
    font-size: 3em;
}

#wrp5SubDiv1 p {
    margin: 0px;
    margin-top: 20px;
    margin-left: 5%;
    font-size: 1em;
}

.wrp5SubDivCntUsDtlPEle {

    @media(max-width: 1050px) {
        width: auto;
        height: 200px;
    }
}

.wrp5SocialIconHld {
    position: relative;
    width: 90%;
    height: 140px;
    margin: 0px 5%;
    margin-top: 10px;
    overflow: visible;

    @media(max-width: 1050px) {
        margin-top: -35px;
    }
}

.wrp5SocialIconPEle {
    position: relative;
    display: inline-block;
    width: 220px;
    height: 35px;
    margin: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-right: 10px;
    padding: 0px;
    padding-top: 8px;
    border-radius: 5px;
    font-size: 1.5em;
    text-decoration: none;
    color: black;
    text-align: center;
    border: 1px solid rgba(0, 0, 0, 0.2);
    transform: scale(80%);
}

.wrp5SocialIconPEle:hover {
    color: black;
    border: 0px;
    box-shadow: 2px 2px 3px 2px rgba(0, 0, 0, 0.371);
}

.wrp5SocialIconImgCla {
    position: absolute;
    top: 5px;
    left: 5px;
    display: inline-block;
    width: 30px;
    height: 30px;
    margin: 0px;
}

#wrp5SupHld {
    position: relative;
    width: 90%;
    height: 45%;
    margin: 0px 5%;
    margin-top: 0%;

    @media(max-width: 1050px) {
        width: 350px;
        height: 495px;
        margin: 0px;
        margin-left: calc(50% - 170px);
    }
}

.wrp5SupInfoDivs {
    position: relative;
    float: left;
    width: calc(100% / 3 - 2%);
    height: auto;
    margin: 10px 1%;

    @media(max-width: 1050px) {
        float: none;
        width: 300px;
        height: 150px;
        margin: 10px 0px;
        margin-left: calc(50% - 150px);
    }
}

#cntDtlHld {
    position: relative;
    width: 80%;
    height: 80%;
    margin: 0px 10%;
    padding: 0px;
    color: black;
    background-color: white;
    border-radius: 30px;
    box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.411);

    @media(max-width: 1050px) {
        width: 90%;
        height: 560px;
        margin: 0px 5%;
    }
}

#cntDtlFrtDivSpacer {
    position: relative;
    width: 100%;
    height: 50px;

    @media(max-width: 1050px) {
        height: 20px;
    }
}

#cntDtlHld h2 {
    position: relative;
    margin: 0px;
    margin-top: 0px;
    margin-left: 10%;
    font-size: 2em;
}

#cntDtlHld p {
    position: relative;
    margin-top: 10px;
    margin-left: 10%;
}

#cntDtlHld input {
    position: relative;
    border-style: none;
    height: 35px;
    padding: 0px 10px;
    margin: 10px 5px;
    background-color: white;
    border: 1px solid lightgray;
    border-radius: 17.5px;
}

#cntDtlHld #cntDtl1 {
    margin-left: 10%;

    @media(max-width: 1050px) {
        width: 75%;
    }
}

#cntDtlHld #cntDtl2 {
    @media(max-width: 1050px) {
        position: relative;
        width: 75%;
        margin: 0px;
        margin-left: 10%;
        margin-bottom: 10px;
    }
}

#cntDtlHld #cntDtl3 {
    width: 75%;
    margin: 0px;
    margin-left: 10%;
}

#cntDtl4 {
    height: 35px;
    width: 70px;
    border: 1px solid lightgray;
    background-color: white;
    text-align: center;
    border-top-left-radius: 17.5px;
    border-bottom-left-radius: 17.5px;

    @media(max-width: 1050px) {
        width: 30%;
    }
}

#cntDtl5 {
    @media(max-width: 1050px) {
        width: 55%;
    }
}

#cntDtlPhnNumHld {
    position: relative;
    width: 80%;
    margin-left: 10%;
}

#cntDtlPhnNumHld input {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}

#cntDtl6 {
    width: 75%;
    margin-left: 10%;
    border-style: none;
    padding: 0px 10px;
    background-color: white;
    border: 1px solid lightgray;
    border-radius: 17.5px;
}

#submitCntDtl {
    width: 80%;
    height: 35px;
    margin: 10px 0px;
    margin-left: 10%;
    border-style: none;
    color: var(--primary-clr2);
    background-color: var(--primary-clr3);
    border-radius: 17.5px;
}

#wrpGallery {
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 550px;
    overflow: hidden;
}

.scroll-container {
    width: 100%;
    overflow-x: scroll;
    white-space: nowrap;
    /* Prevents items from wrapping to the next line */
    padding: 20px 0;
    /* Add some vertical padding for better visual */
}

.scroll-wrapper {
    display: inline-flex;
    /* Ensures items are in a row */
    align-items: center;
    /* Vertically centers the items */
}

.scroll-container::-webkit-scrollbar {
    display: none;
}

.element-with-hidden-scrollbar {
    scrollbar-width: none;
    /* Hides the scrollbar in Firefox */
}

.item {
    display: inline-block;
    margin: 0 10px;
    width: 400px;
    height: 400px;
    /* Spacing between items */
    background-color: lightblue;
    transition: transform 0.3s ease-in-out;
    /* Smooth transition for scaling */
}

.item.centered {
    transform: scale(1.2);
    /* Scale up the centered item */
}

.galImgCl {
    position: relative;
    width: 100%;
    height: 100%;
}

.linkToDesigner {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: start;
    bottom: 10px;
    right: 20px;
    color: white;
}

.linkToMe {
    display: inline-block;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 200px;
    height: 25px;
    margin-left: 20px;
    border-radius: 20px;
    text-decoration: none;
    color: white;
    background-color: gray;
    text-align: center;
}