@font-face {
    font-family: 'Gilroy';
    src: url('fonts/Gilroy-Black.woff2') format('woff2'),
        url('fonts/Gilroy-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url('fonts/Gilroy-Bold.woff2') format('woff2'),
        url('fonts/Gilroy-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url('fonts/Gilroy-Regular.woff2') format('woff2'),
        url('fonts/Gilroy-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url('fonts/Gilroy-SemiBold.woff2') format('woff2'),
        url('fonts/Gilroy-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url('fonts/Gilroy-Light.woff2') format('woff2'),
        url('fonts/Gilroy-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url('fonts/Gilroy-ExtraBold.woff2') format('woff2'),
        url('fonts/Gilroy-ExtraBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url('fonts/Gilroy-Heavy.woff2') format('woff2'),
        url('fonts/Gilroy-Heavy.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url('fonts/Gilroy-Medium.woff2') format('woff2'),
        url('fonts/Gilroy-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url('fonts/Gilroy-Thin.woff2') format('woff2'),
        url('fonts/Gilroy-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url('fonts/Gilroy-UltraLight.woff2') format('woff2'),
        url('fonts/Gilroy-UltraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

html {
    scroll-behavior: smooth
}

body {
    padding: 0;
    margin: 0;
    font-family: 'Gilroy', sans-serif;
    font-size: 16px;
}

*, ::after, ::before {
    box-sizing: border-box;
}

a,
a:hover {
    text-decoration: none
}

ul{
    margin: 0;
    padding: 0;
    list-style: none;
}

section {
    width: 100%;
    float: left
}

.themeRow {
    width: 100%;
    float: left
}

.themeContainer {
    width: 100%;
    margin: 0 auto;
    max-width: 1280px
}

input, .form-select{
    outline: none;
}

ul::-webkit-scrollbar{
    width: 7px;
    border-radius: 10px;
}

ul::-webkit-scrollbar-track{
    background: #1ad5975e;
    border-radius: 10px;
}

ul::-webkit-scrollbar-thumb{
    background: #1AD598;
    border-radius: 10px;
}

ul::-webkit-scrollbar-thumb:hover{
    background: #0fa372;
}

#header.noneShadow{box-shadow: none;}
#header{
    position: relative;
    padding-top: 42px;
    padding-bottom: 30px;
    box-shadow: 3px 2px 8px 0px #00000033;
    z-index: 99;
}
.logoArea{
    width: 100%;
    float: left;
}
.logoArea a{
    width: 100%;
    float: left;
}
.logoArea a img{
    float: left;
}
.headerMenu{}
.headerMenu .navbar{}
.headerMenu .navbar .navbar-nav{}
.headerMenu .navbar .navbar-nav li{}
.headerMenu .navbar .navbar-nav li a{
    color: #222222;
    font-size: 16px;
    font-weight: 600;
    padding: 0px 20px 10px 20px;
}
.headerMenu .navbar .navbar-nav li a.active, .headerMenu .navbar .navbar-nav li a:hover{color: #FBBD18;}
.headerContact{
    width: 100%;
    float: left;
    margin: 0;
}
.headerContact a{
    background: #FBBD18;
    color: white;
    padding: 10px 35px;
    border-radius: 10px;
    font-size: 20px;
    float: left;
    margin: 0;
    transition: all .3s ease!important;
}
.headerContact a:hover{
    box-shadow: 1px 1px 10px 3px #0000003d;
}

#homebanner{position: relative;padding-top: 72px;}
#homebanner:before{
    content: "";
    background: url('../img/line1.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    width: 65%;
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: -1;
    right: 0;
}
.leftBannerDesc{
    width: 100%;
    float: left;
    margin-top: 35px;
}
.leftBannerDesc h2{
    font-size: 100px;
    color: #222222;
    font-weight: 600;
}
.leftBannerDesc h2 span{color: #FBBD18;}
.leftBannerDesc p{
    font-size: 30px;
    line-height: 35px;
    color: #000000;
    margin: 0px 0px 70px 0px;
    font-weight: 500;
    width: 80%;
}

a:focus, a.btn-primary:focus, a.btn-secondary:focus, .btn-primary:active:focus, .btn-secondary:active:focus{
    outline:none;
    border:none;
    box-shadow:none;
}

a.btn-secondary{
    background: #FFFFFF;
    box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.25);
    border-radius: 10px;
    font-size: 20px;
    line-height: 23px;
/* identical to box height */
    color: #222222!important;
    padding: 10px 20px;
    font-weight: 600;
    outline: none;
    transition: all .3s ease-in-out;
}
a.btn-primary{
    background: #FBBD18;
    border-radius: 10px;
    padding: 10px 20px;
    font-weight: 600;
    font-size: 20px;
    line-height: 23px;
    margin-right: 17px;
    outline: none;
    transition: all .3s ease-in-out;
}

a.btn-primary:hover,a.btn-primary:focus{
    background: #e4ad15;
}
a.btn-secondary:hover,a.btn-secondary:focus{
    background: #f3f3f3;
    box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.25)!important;
}

.rightBanner{
    width: 100%;
    float: left;
}
.rightBanner img{
    float: right;
    width: 100%;
}
#longBanner{
    background-color: #F6F6F6;
    padding: 125px 100px 140px 100px;
    position: relative;
    margin-top: -45px;
    z-index: -1;
}
#longBanner:before{
    content:
    "";
    z-index: 1;
    width:100%;
    top:0;
    bottom: -33px;
    position:
    absolute;
    left:0;
    background-image: url('../img/hand.png');
    background-repeat: no-repeat;
    background-position: 0 0px;
    background-size: contain;
}
.longBannerWrapper{
    width: 100%;
    max-width: 60%;
    float: right;
}
.longBannerWrapper h2{
    font-size: 65px;
    line-height: 76px;
    text-align: right;
    color: #222222;
    font-weight: bold;
    margin-bottom: 50px;
}
.longBannerWrapper p{
    font-size: 40px;
    line-height: 47px;
    text-align: right;
    color: #000000;
    font-weight: 600;
    margin-bottom: 40px;
}
.longBannerWrapper p small{
    font-size: 24px;
    line-height: 32px;
    text-align: right;
    width: 90%;
    float: right;
}
.longBannerWrapper p span{
    color: #FBBD18;
}
#offered{
    padding: 130px 0px;
    position: relative;
}

#offered:before{
    content: "";
    background: url('../img/line2.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    width: 100%;
    position: absolute;
    top: 35%;
    z-index: 0;
    left: 0;
    right: 0;
    height: 100%;
}

.themeTitle{
    width: 100%;
    float: left;
    margin-bottom: 70px;
}
.themeTitle h2{
    font-size: 65px;
    line-height: 76px;
    text-align: center;
    color: #222222;
    font-weight: bold;
    margin-bottom: 35px;
}
.themeTitle p{
    font-size: 24px;
    line-height: 28px;
/* identical to box height */
    text-align: center;
    color: #222222;
    font-weight: 600;
    margin: 0;
}
.widgetWrapper{
    background: #F6F6F6;
    border-radius: 20px;
    position: relative;
    float: left;
    width: 100%;
    padding: 30px 20px 20px 20px;
    margin-bottom: 70px;
}
.widgetWrapper span{
    width: 59px;
    height: 59px;
    background: #FBBD18;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
    position: absolute;
    top: -20px;
    left: 5px;
}
.widgetWrapper span img{}
.widgetWrapper h3{
    font-size: 20px;
    line-height: 23px;
    color: #000000;
    font-weight: bold;
    margin-bottom: 13px;
    text-align: center;
}
.widgetWrapper p{
    font-size: 14px;
    line-height: 16px;
    text-align: center;
    color: #000000;
}
#aboutUs{margin-top: 70px;margin-bottom: 140px;z-index: -1;position: relative;}

.aboutWrapper{
    width: 100%;
    float: left;
    background: #222222;
    border-radius: 25px;
    padding: 35px 0px;
    position: relative;
}
.aboutArea{
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding-left: 50px;
}
.aboutImg{
    position: absolute;
    bottom: -50px;
}
.aboutImg img{}

.aboutCard{
    font-size: 35px;
    line-height: 41px;
    color: #FFFFFF;
    font-weight: 500;
    float: left;
    display: flex;
    flex-direction: column;
}

.counting{
    height: 60px;
    float: left;
    width: 100%;
    text-align: center;
}

.countingDesc{
    width: 100%;
    float: left;
}

.aboutCard{
    width: 100%;
    float: left;
    text-align: center;
}

.aboutCard span{
    font-size: 55px;
    line-height: 64px;
    color: #FFFFFF;
    font-weight: bold;
}
.sliderWrapper{
    width: 100%;
    margin: 0 auto;
    max-width: 1000px;
}

.sliderWrapper.owl-carousel .owl-stage-outer{
    width: calc(100% + 30px);
}

.sliderWrapper .owl-carousel .owl-stage{
    padding-right: 50px;

}

.prodCard{
    background: #F6F6F6;
    border-radius: 20px;
    margin: 40px 0 5px 0;
    padding: 64px 13px 20px 13px;
    position: relative;
    width: 100%;
    float: left;
}
.prodCard span{
    width: 105px;
    height: 105px;
    border-radius: 39.5px;
    background: #FBBD18;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    right: -20px;
    top: -40px;
}
.prodCard span img{
    width: 35px!important;
}
.prodCard h3{
    font-size: 20px;
    line-height: 23px;
    color: #000000;
    font-weight: bold;
    margin-bottom: 18px;
}
.prodCard p{
    font-size: 14px;
    line-height: 16px;
    color: #000000;
}
.price{
    font-size: 13px;
    line-height: 3px;
    color: #5c4506;
    font-weight: bold;
    float: left;
    width: 100%;
    margin-bottom: 20px;
}
.prodCard a{
    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    background: #222222;
    border-radius: 5px;
    color: white;
    padding: 4px 10px;
    width: 100%;
    float: left;
    text-align: center;
    transition: all .3s ease-in-out;
    font-weight: 500;
}

.prodCard a:hover{
    background: #FBBD18;
    color: #222;
}

#bannerContact{
    margin-bottom: 140px;
}
.bannerContactWrapper{
    background: #FBBD18;
    border-radius: 25px;
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    padding: 50px 60px 50px 0px;
    justify-content: space-between;
    position: relative;
}
.bannerContactWrapper p{
    font-size: 35px;
    line-height: 41px;
    color: #222222;
    font-weight: bold;
    max-width: 40%;
    margin: 0;
}
.bannerContactWrapper a{
    background: #FFFFFF;
    box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.25);
    border-radius: 20px;
    font-size: 20px;
    line-height: 23px;
/* identical to box height */
    color: #222222;
    font-weight: bold;
    padding: 27px 75px;
    float: right;
    transition: all .3s ease-in-out;
    border: 1px solid #fff0;
}

.bannerContactWrapper a:hover{
    background: #222222;
    color: white;
    border-color: white;
}

.bannerImgS{
    float: left;
    width: 100%;
    max-width: 20%;
}

.bannerContactWrapper img{
    position: absolute;
    bottom: -60px;
}
.bannerContact{}
#footer{
    background: #222;
    position: relative;
    margin-top: 120px;
    padding: 60px 0px 163px 0px;
}
#footer::before{content: "";background: url('../img/ftleft.svg');background-position: center;position: absolute;background-repeat: no-repeat;background-size: auto;
    left: 0;
    bottom: 0;
    z-index: 5;
    width: 138px;
    height: 172px;
}
#footer::after{content: "";background: url('../img/ftright.svg');background-position: center;position: absolute;background-repeat: no-repeat;background-size: auto;right: 0;
    top: -70px;
    z-index: 5;
    width: 104px;
    height: 204px;
}
#slider{
    padding-bottom: 140px;
    position: relative;
}

#slider:before{
    content: "";
    background: url('../img/line3.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    width: 100%;
    position: absolute;
    top: 25%;
    z-index: 0;
    left: 0;
    right: 0;
    height: 100%;
}

.footerDesc{
    width: 100%;
    float: left;
}
.footerDesc p{
    width: 100%;
    float: left;
    margin: 0;
    font-weight: 600;
    color: white;
    padding-right: 20px;
}
.footerDesc img{
    margin-bottom: 26px;
}

.owl-carousel .owl-nav button{
    width: 56.25px;
    height: 45px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    top: 40%;
}

.owl-carousel .owl-nav button.owl-next{
    background: url('../img/left.svg');
    font-size: 0;
    position: absolute;
    left: -160px;
}

.owl-carousel .owl-nav button.owl-prev{
    background: url('../img/rgiht.svg');
    font-size: 0;
    position: absolute;
    right: -160px;
}

#sss{}
.accordion{
    width: 100%;
    float: left;
}
.accordion-item{
    border: none;
    margin-bottom: 10px;
    float: left;
    width: 100%;
}
.accordion-item h2{
    border: 0px;
}
.accordion-item button{
    font-weight: 600;
}

.accordion-button{
    font-size: 24px;
    line-height: 28px;
    text-align: center;
    color: #222222;
    background: #F6F6F6;
    border-radius: 15px;
}

.accordion-button.collapsed{

}

.accordion-button:not(.collapsed) {
    color: #222222;
    background-color: #FBBD18;
    box-shadow: none;
    border: none;
    outline: none;
    border-radius: 0px;
    border-radius: 15px 15px 0px 0px;
    font-weight: 600;
}

.accordion-button{

}

.accordion-item:first-of-type .accordion-button{
    border-radius: 15px 15px 0px 0px;
    box-shadow: none;
}

.accordion-collapse.show{
    background: #FBBD18;
    border-radius: 0px 0px 15px 15px;
}

.accordion-body {
    padding: 1rem 1.25rem 4rem 1.25rem;
    font-size: 20px;
    font-weight: 600;
    line-height: 23px;
    color: #222222;
}

.accordion-item:last-of-type .accordion-button.collapsed {
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
}

.accordion-button:focus {
    z-index: 3;
    border-color: none;
    outline: 0;
    box-shadow: none;
}

.accordion-button::after {
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    margin-left: auto;
    content: "";
    background-image: url('../img/down.svg');
    background-repeat: no-repeat;
    background-size: 1.25rem;
    transition: transform .2s ease-in-out;
}

.accordion-button:not(.collapsed)::after {
    background-image: url('../img/close.svg');
    transform: rotate(-180deg);
}

.accordion-button span{
    font-size: 24px;
    line-height: 28px;
    text-align: center;
    background: #FBBD18;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    min-width: 40px;
    min-height: 40px;
    color: #222222;
    font-weight: 600;
    margin-right: 15px;
}
.accordion-button:not(.collapsed) span{
    background-color: white;
}

.accordion-item:last-of-type .accordion-collapse {
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
}

.ftMenu{
    width: 100%;
    float: left;
    padding-left: 50px;
}
.ftMenu ul{
    width: 100%;
    float: left;
}
.ftMenu ul li{
    width: 100%;
    float: left;
    margin-bottom: 20px;
}
.ftMenu ul li a{
    font-size: 24px;
    line-height: 28px;
    color: #FFFFFF;
    font-weight: 700;
    transition: all .3s ease-in-out;
}

.ftMenu ul li a:hover{
    color: #FBBD18;
    margin-left: 5px;
}

.ftInfo{
    width: 100%;
    float: left;
}
.ftInfo ul{
    width: 100%;
    float: left;
}
.ftInfo ul li{
    width: 100%;
    float: left;
    margin-bottom: 20px;
}
.ftInfo ul li a{
    font-size: 20px;
    line-height: 23px;
    color: #FFFFFF;
    font-weight: 700;
    display: flex;
    align-items: flex-start;
    gap: 15px;
    transition: all .3s ease-in-out;
}

.ftInfo ul li a:hover{
    color: #FBBD18;
}

.ftInfo ul li a span{
    width: 20px;
}

.ftInfo ul li a img{
}

.copyright{
    font-size: 20px;
    line-height: 23px;
    text-align: right;
    font-weight: 600;
    color: #FFFFFF;
    width: 100%;
    float: left;
}

.ftSocial{
    width: 100%;
    float: left;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-end;
}
.ftSocial > a{
    background: #FBBD18;
    border-radius: 10px;
    padding: 10px 20px;
    font-weight: 600;
    font-size: 20px;
    line-height: 23px;
    margin-right: 17px;
    outline: none;
    transition: all .3s ease-in-out;
    color: white;
    float: left;
}

.ftSocial > a:hover{
    background: white;
    color: #FBBD18;
}

.socialMediaFt{
    clear: left;
    width: 100%;
    float: left;
    margin-top: 45px;
    margin-bottom: 45px;
    text-align: right;
}
.socialMediaFt a{
    margin-left: 10px;
}

.socialMediaFt img{
    transition: all .3s ease-in-out;
}
.socialMediaFt a:hover img{
    transform: scale(1.15);
}

.bg1{
    background: #F6F6F6;
}

#bannerWrapper{
    /* background: #F6F6F6; */
    margin-bottom: 60px;
}
.bannerArea{
    width: 100%;
    float: left;
    position: relative;
    z-index: 9;
}
.bannerArea img{
    width: 100%;
    float: left;
}

.bannerDesc{
    float: left;
    display: flex;
    flex-direction: column;
    gap: 15px;
    position: absolute;
    top: 15%    ;
    left: 6.5%;
}

.bannerDesc h1{
    font-size: 75px;
    line-height: 88px;
    color: #222222;
    margin-bottom: 0;
    font-weight: bold;
}

.bannerDesc.onlyTitle h1{font-size: 60px;}

.bannerDesc p{
    font-size: 30px;
    line-height: 35px;
    color: #000000;
    font-weight: 500;
}

.bannerVideoWrapper{
    width: 100%;
    float: left;
    padding:63px 100px;
    margin-bottom: 75px;
}
.bannerVideo{
      float: left;
    width: 50%;
    padding: 30px;
}
}
.bannerVideo h2{
    font-size: 65px;
    line-height: 76px;
    color: #222222;
    font-weight: bold;
    margin-bottom: 45px;
}
.bannerVideo p{
    font-size: 24px;
    line-height: 28px;
    color: #000000;
    font-weight: 600;
    margin-bottom: 25px;
    max-width: 100%;
}
.bannerVideo p span{
    color: #FBBD18;
    font-size: 40px;
    line-height: 47px;
}
.bannerVideo a{}
.bannerVideoArea{
    float: left;
    width: 50%;
    display: flex;
    justify-content: flex-end;
}
.bannerVideoArea img{
    width: 100%;
    max-width: 617px;
}

.leftPosition{}
.leftPosition .bannerVideoArea{justify-content: flex-start;}
.leftPosition .bannerVideo{text-align: right;flex-direction: column;display: flex;justify-content: flex-end;align-items: flex-end;}
.leftPosition .bannerVideo h2{}
.leftPosition .bannerVideo p{float: right;}
.leftPosition .bannerVideo a{}

.pagination{
    width: 100%;
    float: left;
    margin-top: 150px;
}
.pagination ul{
    width: 100%;
    float: left;
    display: flex;
    justify-content: center;
    align-items: center;
}
.pagination ul li{}
.pagination ul li a{}
.pagination ul li a{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 62px;
    height: 62px;
    min-width: 62px;
    min-height: 62px;
    background: #C4C4C4;
    color: white;
    font-weight: 700;
}

.pagination ul li a:hover{
    background: #FBBD18;
    color: white;
}

.pagination ul li:nth-child(1) a,.pagination ul li:nth-child(2) a,.pagination ul li:nth-last-child(1) a,.pagination ul li:nth-last-child(2) a{
    border-radius: 20px;
    margin: 0px 5px 0px 5px;
}
.pagination ul li:nth-child(3) a{
    background: #FBBD18;
    border-radius: 20px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    margin-left: 5px;
}
.pagination ul li:nth-last-child(3) a{
    background: #FBBD18;
    border-radius: 20px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    margin-right: 5px;
}
.pagination ul li a img{}

.noneLine:after{display: none;}

.footerLine{
    width: 100%;
    float: left;
    position: relative;
}

.footerLine:after{
    content: "";
    background: url(../img/line5.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    bottom: 0;
    z-index: -1;
    left: 0;
    right: 0;
    height: 685px;
}

.headerLine{
    width: 100%;
    float: left;
    position: relative;
}

.headerLine:after{
    content: "";
    background: url(../img/line4.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    top: 780px;
    left: 0;
    right: 0;
    height: 685px;
    z-index: -1;
}

.seoWrapper{
    width: 100%;
    float: left;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-bottom: 80px;
}
.seoWrapper p{
    font-weight: 600;
    font-size: 24px;
    line-height: 28px;
    text-align: center;
    color: #000000;
    margin-bottom: 16px;
}
.seoWrapper h2{
    font-size: 65px;
    line-height: 76px;
    text-align: center;
    color: #222222;
    font-weight: bold;
    margin-bottom: 40px;
}

#gallery{}
.galleryWrapper{
    display: flex;
    flex-direction: column;
    gap: 30px;
    width: 100%;
    float: left;
    padding: 0px 100px;
    margin-bottom: 400px;
}
.galleryArea{
    width: 100%;
    float: left;
    display: flex;
    justify-content: space-between;
    gap: 30px;
}
.galleryArea a{
    float: left;
    overflow: hidden;
}
.galleryArea a img{
    width: 100%;
    float: left;
    transition: all .4s ease-in-out;
}
.galleryArea a:hover img{
    transform: scale(1.06);
}

#references{}

.referencesWrapper{
    width: 100%;
    float: left;
    display: flex;
    flex-wrap: wrap;
    gap: 80px;

}

.referencesCard{
    width: calc(100% * 1/3 - 53.333px);
    float: left;
    background-color: white;
}

.referencesCard a{
    width: 100%;
    float: left;
    min-height: 200px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    line-height: 23px;
    color: #222222;
    font-weight: bold;
    padding: 25px;
    border: 2px solid #C4C4C4;
    border-radius: 20px;
    transition: all .3s ease-in-out;
}

.referencesCard a:hover{
    border: 2px solid #fff0;
    box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.25);
}

.referencesCard a img{
    object-fit: contain;
    max-width: 300px;
    margin-bottom: 10px;

}

.referencesCard a span{}

#post{
    margin-bottom: 160px;
}

.postImg a{
    width: 100%;
    float: left;
    display: flex;
    justify-content: center;
}
.postImg{
    width: 100%;
    float: left;
    display: flex;
    justify-content: center;
    margin-right: 20px;
}

.postImg img{
    float: left;
}

.postDesc{
    width: 100%;
    max-width: 620px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.postDesc p{}

.postDesc p{
    font-weight: 600;
    font-size: 24px;
    line-height: 28px;
    text-align: center;
    color: #000000;
    margin-bottom: 16px;
}

.mb90{margin-bottom: 90px;}

#blogDetail{}

.blogDetailWrapper{
    width: 100%;
    float: left;
    margin-bottom: 61px;
}
.blogInfo{
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}
.blogLeft{
    display: flex;
    align-items: center;
    gap: 15px;
}
.blogLeft > a{
    font-size: 18px;
    line-height: 21px;
    color: #000000;
    font-weight: bold;
}
.blogLeft span{
    font-size: 18px;
    line-height: 21px;
    color: #FFAE2F;
    font-weight: 600;
}
.blogLeft span img{}
.blogRight{
    font-size: 18px;
    line-height: 21px;
    color: #000000;
    font-weight: bold;
}
.blogImage{
    width: 100%;
    float: left;
    margin-bottom: 22px;
}
.blogImage a{
    width: 100%;
    float: left;
}
.blogImage a img{
    width: 100%;
    float: left;
}
.blogTags{
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.tags{width: 100%;max-width: 80%;}
.tags a{
    background: #FFAE2F;
    border-radius: 5px;
    font-size: 14px;
    line-height: 16px;
    color: #000000;
    font-weight: bold;
    padding: 8px 28px;
    margin-right: 9px;
    white-space: nowrap;
    float: left;
    margin-bottom: 10px;
    float: left;
}
.socialMediaBlog{display: flex;gap: 10px;}
.socialMediaBlog a{}
.socialMediaBlog a img{}
.blogTitle h2{
    font-size: 45px;
    line-height: 53px;
    color: #000000;
    font-weight: bold;
    text-align: center;
    margin-bottom: 30px;
}
.blogDescText{
    width: 50%;
}
.blogDescText p{
    font-size: 24px;
    line-height: 28px;
    color: #000000;
    font-weight: 500;
}
.blogDescImage img{
    width: 100%;
    max-width: 437px;
}
.blogDescImage{
    width: 50%;
}
.blogDescription{
    width: 100%;
    padding: 0px 100px;
    display: flex;
    align-items: center;
    gap: 110px;
    margin-bottom: 75px;
}
.blogInfo h2{}
.blogInfo{}
.blogTitle{
    width: 100%;
    padding: 0px 100px;
}

#bigPostArea{}
.blogPostWrapper{
    width: 100%;
    float: left;
}
.bigPost{
    width: 100%;
    float: left;
    display: flex;
    margin-bottom: 85px;
}
.postImg{}
.postImg img{
    width: 100%;
}
.bigPostDesc{
    width: 50%;
    float: left;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.blogInfoTop{
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}
.blogInfoDate{
    font-size: 18px;
    line-height: 21px;
    color: #000000;
    font-weight: bold;
}
.blogInfoTag{
    display: flex;
}
.blogInfoTag a{
    font-size: 14px;
    line-height: 16px;
    color: #000000;
    padding: 8px 28px;
    font-weight: bold;
    background: #FFAE2F;
    border-radius: 5px;
}
.bigPostDesc h2{
    font-size: 45px;
    line-height: 53px;
    color: #000000;
    font-weight: bold;
    margin-bottom: 21px;
}
.bigPostDesc p{
    font-size: 24px;
    line-height: 28px;
    color: #000000;
    font-weight: 500;
    margin-bottom: 26px;
}
.bigPostDesc > a{
    font-size: 20px;
    line-height: 23px;
    color: #ffffff;
    padding: 13px 34px 13px 34px;
    font-weight: bold;
    background: #FFAE2F;
    border-radius: 5px;
    display: flex;
}
.postList{
    width: 100%;
    float: left;
    display: flex;
    flex-wrap: wrap;
    gap: 82px;
}
.productCard{
    width: calc(100% * 1/3 - 54.666px);
    float: left;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.productImg{
    width: 100%;
    float: left;
    margin-bottom: 12px;
}
.productImg a{
    width: 100%;
    float: left;
}
.productImg a img{
    width: 100%;
    float: left;
}
.productInfo{
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}
.prodCardDate{
    font-size: 12px;
    line-height: 14px;
    color: #000000;
    font-weight: bold;
}
.productCardTag{}
.productCardTag a{
    font-size: 12px;
    line-height: 14px;
    color: #000000;
    padding: 3px 7px 3px 7px;
    font-weight: bold;
    background: #FFAE2F;
    border-radius: 5px;
}
.productDesc{
    width: 100%;
    float: left;
}
.productDesc h3{
    font-size: 18px;
    line-height: 21px;
    color: #000000;
    font-weight: bold;
    margin-bottom: 12px;
    width: 100%;
    float: left;
    height: 42px;
    overflow: hidden;
    text-overflow:
    ellipsis;
    white-space: pre-wrap;
    display: -webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient: vertical;
}
.productDesc p{
    font-size: 15px;
    line-height: 22px;
    color: #000000;
    font-weight: 500;
    height: 65px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: pre-wrap;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    width: 100%;
    float: left;
}
.prodDetailLink{}
.prodDetailLink a{
    font-size: 14px;
    line-height: 16px;
    color: #ffffff;
    padding: 7px 14px 7px 14px;
    font-weight: bold;
    background: #FFAE2F;
    border-radius: 5px;
    display: flex;
}

.prl100{padding: 0px 100px;}
.prl235{padding: 0px 235px;}

#contactPage{}

.contactFormWrapper{
    width: 100%;
    float: left;
}
.contactLogo{
    width: 100%;
    float: left;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    margin-bottom: 50px;
}
.contactLogo img{
    width: 100%;
    max-width: 624px;
}
.contactLogo p{
    font-size: 24px;
    line-height: 28px;
/* identical to box height */
    color: #000000;
    margin: 24px 0px 0px 0px;
}
.contactInfo{
    width: 100%;
    float: left;
}
.contactInfo ul{
    width: 100%;
    float: left;
}
.contactInfo ul li{
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    margin-bottom: 20px;
    background: #E5E5E5;
    border-radius: 20px;
}
.contactInfo ul li:nth-child(odd){
    background: #FBBD18;
}
.contactInfo ul li:nth-child(even){}
.contactInfo ul li a{
    font-size: 24px;
    line-height: 28px;
    text-align: center;
    color: #222222;
    font-weight: bold;
    width: calc(100% - 104px);
    text-align: center;
}
.contactIcon{width: 104px;border-right: 3px solid #222222;height: 104px;display: flex;align-items: center;justify-content: center;min-width: 104px;min-height: 104px;}
.contactIcon img{}
.contactFormArea{
    width: 100%;
    float: left;
    margin-top: 85px;
}
.contactFormDesc{}
.form-control{
    background: #E5E5E5;
    border-radius: 20px;
    height: 70px;
    padding: 20px;
}
.form-label{
    font-size: 25px;
    line-height: 30px;
    color: #000000;
    font-weight: 500;
}
.contactFormDesc{
    width: 100%;
    float: left;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-bottom: 54px;
}
.contactFormDesc p{
    font-size: 24px;
    line-height: 28px;
    color: #000000;
    margin: 24px 0px 0px 0px;
}
.contactFormDesc h2{
    font-size: 45px;
    line-height: 53px;
    color: #222222;
    font-weight: bold;
    margin: 0;
}

.btn-form{
    background: #FBBD18;
    border-radius: 20px;
    width: 100%;
    margin-top: 50px;
    font-size: 40px;
    line-height: 60px;
    color: #FFFFFF;
    font-weight: 700;
    padding: 28px 0px;
}

textarea.form-control {
    min-height: 250px;
}

.modal-title{
    color: black;
    font-size: 32px;
    font-weight: 600;
}
.bigPostDesc > a, .prodDetailLink a{
    transition: .3s;
}
.bigPostDesc > a:hover, .prodDetailLink a:hover{
    background: #e28900;
}
