/*Common Section*/


@font-face {
    font-family: 'WorkSans';
    src: url(../fonts/worksans/WorkSans-Regular.ttf);
}

html {
    scroll-behavior: smooth;
}

/* width */
::-webkit-scrollbar {
    width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
    background: transparent;

}

/* Handle */
::-webkit-scrollbar-thumb {
    background: var(--secondaryColor);
    border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: #555;
}


:root {
    --themeColor: #0F172A;
    --secondaryColor: #D09A10;
    --BackgroundColor: #F0F8FF;
    --buttonColor: #F26F35;
    --primaryTextColor: #34312C;
    --secondaryTextColor: #535558;
    --fontFamily: 'WorkSans';
    --fontBold: 700;
    --fontWeightRegular: 400;
    --borderRadius10: 10px;
    --borderRadius5: 5px;
    --lineHeight: 1.7;
    --color-white: white;
    --line-height-titles: 1.2;
    --grid-gap: 40px 60px;
    --box-shadow10: 1px 5px 10px 0px #F2F7FA;
    --box-shadow20: 1px 5px 20px 0px #F2F7FA;
    --box-shadow30: 10px 15px 30px 0px rgb(91, 49, 69, 0.1);
    --box-shadow40L: 0 .5rem 2rem rgba(55, 62, 66, 0.2);
    --box-shadow40: 0 .5rem 2rem rgba(100, 16, 7, .2);
    --backgroundImageRight: linear-gradient(to right, #0c2233, #184361, #236692, #2c8cc7, #34b4ff);

    --Approved: #239B56;
    --New: #B03A2E;
    --InProgress: #F39C12;
    --OnHold: #FF5733;
    --Closed: #2ECC71;
    --Assigned: #0096CC;
}

h1,
h2,
h3 {
    color: var(--primaryTextColor);
    font-family: var(--fontFamily);
}

h4,
h5,
h6,
p {
    color: var(--secondaryTextColor);
    font-family: var(--fontFamily);
}

.sectionBody {
    padding: 5% 0%;
}

/*Common Section*/
.paggination h5 {
    color: var(--secondaryColor);
}

.paggination h5 a {
    font-weight: 200;
    font-size: 0.7em;
    text-decoration: none;
    color: var(--secondaryColor);
}

.sectionHeaderTop {
    text-align: center;
}

.sectionHeaderTop h3 {
    text-align: center;
    color: var(--secondaryColor);
    font-weight: 800;
}

.sectionHeaderTop h3 span {
    font-weight: bold;
    font-size: 1.3em;
}

.sectionHeaderTop h5 {
    text-align: center;
    line-height: 25px;
    font-size: 1.1em;
    letter-spacing: 0px;
    color: var(--secondaryTextColor);
}

.sectionHeaderTop h6 {
    text-align: center;
    line-height: 22px;
    font-size: 1em;
}

.sectionHeaderTop a {
    text-align: center;
    line-height: 22px;
    font-size: 1em;
    color: grey;
    font-weight: 100;
}

/* ----------- INDEX PAGE --------------- */
/* =========== LANDING SECTION =========== */
#LandingSection .container-fluid {
    padding: 0% 0px 0px 0px;
    margin: 0px;
}

.mySwiper {
    width: 100%;
    height: 100%;

}

.swiper {
    width: 100%;
    height: 100%;

}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: var(--BackgroundColor);
    display: flex;
    justify-content: center;
    align-items: center;
}
 
#LandingSection .swiperContent h2 {
    color: white;
    letter-spacing: 1px;
    padding-bottom: 15px;
    text-align: center;
    font-weight: 800;
}

#LandingSection .swiperContent h4 {
    color: white;
    line-height: 30px;
    text-align: center;
}

#LandingSection .SwiperButton {
    display: flex;
    justify-content: center;
}

 
#LandingSection .swiper:hover .BtnPrimaryDark {
    background-color: var(--secondaryColor);
    color: white;
    border: 1px solid var(--secondaryColor);
}

#LandingSection .swiperImage {
    position: relative;
    overflow: hidden;
}

#LandingSection .swiperImage::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(15, 23, 42, 0.8);
    /* Change the color and opacity as needed */
}

/* =========== LANDING SECTION =========== */

/*ABOUT SECTION*/


#inAboutUs .founderDesk .BtnPrimaryWhite {
    padding: 12px 15px;
    font-size: 0.9em;
    background-color: var(--themeColor);
    color: white;
}

.founderDesk {
    margin-top: 2%;
    background-color: var(--secondaryColor);
    background-image: url(../image/bgImg01.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.founderDesk .row .col-lg-6 {
    padding: 0px;
    margin: 0px;
}

.founderDesk .founderQuote {
    padding: 10% 10% 0% 10%;
}

.founderDesk h3 {
    text-align: center;
    padding: 3% 0%;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 2.2em;
    color: var(--themeColor);
}

.founderDesk h5 {
    padding: 2% 0%;
    color: var(--themeColor);
    line-height: 30px;
    font-size: 1.1em;
    text-align: center;
}

#inAboutUs .tellYourStory .BtnPrimaryWhite {
    padding: 12px 15px;
    font-size: 0.9em;
    background-color: var(--BackgroundColor);
    color: var(--themeColor);
}

.tellYourStory {
    margin-top: 0%;

    background-color: var(--themeColor);
    background-image: url(../image/bgImg02.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.tellYourStory .row .col-lg-6 {
    padding: 0px;
    margin: 0px;
}

.tellYourStory .founderQuote {
    padding: 4% 10%;
}

.tellYourStory h3 {
    text-align: center;
    padding: 0% 0%;
    text-transform: uppercase;
    font-size: 2.2em;
    color: white;
}

.tellYourStory h5 {
    padding: 2% 0%;
    color: white;
    line-height: 30px;
    font-size: 1.1em;
    text-align: center;
}

.aboutIconHome {
    padding: 2% 10%;
    text-align: left;
    background-color: white;
}


.aboutIconHome .aboutIconHomeImg img {
    height: 50px;
}

.aboutIconHome h2 {
    font-weight: bold;
    font-size: 1.5em;
    margin: 0px;
    padding: 0px;
}

.aboutIconHome h4 {
    font-size: 0.8em;
    margin: 0px;
    padding: 0px;
}

/*ABOUT SECTION*/

/*inProducts SECTION*/


#inProducts {
    background-image: url(../image/inProductsBgWhite.png);
    background-size: cover;
    background-position: center;
}

#inProducts .workshopTypes {
    padding: 2% 0%;
}
    
#inProducts .BtnPrimaryWhite {
    padding: 12px 15px;
    font-size: 0.9em;
    background-color: var(--themeColor);
    color: white;
    margin:0px;
}
#inProducts .WorkshopTypesDash .well {
    padding: 0px;
    overflow: hidden;
    border-radius: 10px;
    border: none;
}

#inProducts .WorkshopTypesDash .well h3 {
    color: white;
    font-weight: bold;
    font-size: 1.2em;
    margin: 0px;
    padding: 0px;
    text-transform: uppercase;
}

#inProducts .WorkshopTypesDash .well h4 {
    color: white;
    line-height: 25px;
    font-size: 1em;
    padding: 0px 0px;
}
 

#inProducts .WorkshopTypesDash .well .productImage img {
    transition: 0.7s ease-in;
}

#inProducts .WorkshopTypesDash .well:hover img {
    transform: scale(1.1);
    transition: 0.1s ease-in;
}

#inProducts .WorkshopTypesDash .well .BtnPrimaryWhite {
    background-color: transparent;
    color: white;
    padding: 15px;
    margin: 0px;
    letter-spacing: 0px;
}

#inProducts .WorkshopTypesDash .well:hover .BtnPrimaryWhite {
    background-color: white;
    color: var(--secondaryColor);
}



#inProducts .productShortComp {
    padding-left: 6%;
}

#inProducts .productDashWrapper h4 {
    padding: 15px 0px;
    font-size: 1em;
    margin: 0px 0px 20px 0px;
}

#inProducts .productImageComp {
    border-radius: 10px;
    overflow: hidden;
    cursor: pointer;
    transition: 0.5s ease-in;
}

#inProducts .productImageComp:hover img {
    transform: scale(1.1);
    transition: 0.2s ease-in;
}

#inProducts .productImageComp img {
    width: 100%;
    height: 100%;
    transition: 0.5s ease-in;
}

/*inProducts SECTION*/

/*inProductsType SECTION*/
#inProductsType .container-fluid {
    padding: 2% 10%;

}

#inProductsType {
    background-color: var(--themeColor);
    background-attachment: fixed;
}

#inProductsType .container-fluid {
    padding: 2% 10%;
}

#inProductsType .sectionHeaderTop h5 {
    color: #CDCED0;
}

.productUseType .well .productUseImg {
    height: 230px;
    overflow: hidden;
    border-radius: 0px 0px 25px 25px;
}

.productUseType {
    padding-top: 2%;
}

.productUseType .well {
    padding: 0px;
    border-radius: 15px;
    overflow: hidden;
    border: 1px solid var(--themeColor);
    background-color: white;
    box-shadow: var(--box-shadow30);
}

.productUseType .well img {
    transition: 0.3s ease-in;
}

.productUseType .well:hover img {
    transform: scale(1.1);
    transition: 0.3s ease-in;
}

.productUseContent {
    padding: 10px 25px;
}

.productUseContent h4 {
    font-weight: bold;
    font-size: 1.3em;
}

.productUseContent h5 {
    font-size: 1em;
    line-height: 25px;
}

/*inProductsType SECTION*/

/* inMaterialType SECTION STARTS */


.materialTypeComp img{
    border-radius: 10px;
}

.materialHead h3 {
    font-size: 1.5em;
    margin: 0px;
    font-weight: bold;
    padding: 0px;
    color: var(--primaryTextColor);
}

.materialHead h5 {
    font-size: 1.1em;
    margin: 0px;
    line-height: 22px;
    padding: 10px 0px 0px 0px;
    color: var(--secondaryTextColor);
}

/* inMaterialType SECTION ENDS*/

/* inGalleryType SECTION STARTS */


#inGalleryType .sectionHeaderTop h3 {
    color: var(--themeColor);
}

#inGalleryType .sectionHeaderTop h5 {
    color: var(--primaryTextColor);
}



.inGalleryType img:hover {
    transition: 0.5s ease-in;
}

/* inGalleryType SECTION ENDS */

/* inTestimonials SECTION STARTS */


.testimonialComp .sectionHeadComp h2 {
    font-size: 2.5em;
    line-height: 45px;
    font-weight: bold;
    padding: 0px 0px;
    color: var(--primaryTextColor);
}

.testimonialComp .sectionHeadComp h4 {
    font-size: 1.2em;
    text-transform: uppercase;
}

#inTestimonials .carousel-control {
    height: 60px;
    opacity: 1;
    color: white;
    background-color: var(--secondaryColor);
    box-shadow: none;
    transform: rotate(90deg);
    position: absolute;
    top: 310px;
    border-radius: 0px;
    margin-right: -35px;
    width: 60px;
}

#inTestimonials .carousel-control .glyphicon-chevron-left {
    transform: rotate(-90deg);
    margin-top: -15px;
    font-size: 1em;
    margin-left: -10px;
}

#inTestimonials .carousel-control .glyphicon-chevron-right {
    transform: rotate(-90deg);
    margin-top: -15px;
    font-size: 1em;
    margin-right: -20px;
}

#inTestimonials .lineDividerLong {
    margin-top: 5px;
}

#inTestimonials h3 {
    font-size: 1em;
    margin: 0px;
    padding: 0px;
}

#inTestimonials h5 {
    font-size: 0.8em;
    margin: 0px;
    padding: 5px 0px;
}

.happyClients {
    position: absolute;
    background-color: var(--primaryTextColor);
    top: 0px;
    right: 15px;
    padding: 15px;
}

.happyClients h2 {
    font-size: 2em;
    text-align: center;
    padding: 0px 35px 0px 0px;
    margin: 0px;
    font-weight: 600;
    color: var(--secondaryColor);
}

.happyClients h5 {
    line-height: 25px;
    margin: 0px;
    color: white;
    padding: 5px 0px;
}

#myCarouselTestimonial .item {
    height: 100%;
    padding: 5% 0%;
}

.indicatorTestimonial .carousel-indicators {
    display: flex;
    justify-content: end;
    width: 80%;
}

.indicatorTestimonial .carousel-indicators .active {
    background-color: var(--secondaryColor);
    border: 1px solid var(--secondaryColor);
    border-radius: 0px;
    padding: 3px;
    height: 10px;
    width: 25px;
    margin: 10px 5px;
    z-index: 1;
}

.indicatorTestimonial .carousel-indicators li {
    background-color: white;
    height: 10px;
    width: 10px;
    margin: 10px 5px;
    border-radius: 0px;
    border: 1px solid var(--secondaryColor);
    z-index: 1;
}

.boxComp h4 {
    text-align: justify;
    color: var(--primaryTextColor);
    padding: 10px 0px;
    line-height: 25px;
    font-size: 1em;
}

.ratingComp {
    color: var(--secondaryColor);
    padding-left: 35px;
    display: flex;
    justify-content: space-between;
    font-size: 1em;
}

.testiUserComp .testiUserImg {
    height: 100px;
    width: 100px;
    border-radius: 10px;
    margin-top: 0px;
    overflow: hidden;
    z-index: 1;
}

.testiUserComp h3 {
    font-weight: bold;
}

/* inTestimonials SECTION ENDS */


/*ART MATERIAL SECTION*/
#inArtMaterial .container-fluid {
    padding: 2% 10%;

}

/*ART MATERIAL SECTION*/
/* ----------- INDEX PAGE --------------- */


/*OHTER PAGES*/
#hiddenSection {
    height: 55px;
}



.paggigSmallDevice {
    text-align: center;
}

.paggigSmallDevice h3 {
    text-align: center;
    font-size: 1em;
}

#bodyWrapper .sectionHeaderTop h3 {
    font-size: 1.5em;
    font-weight: bold;
}

.WorkshopTypes .well {
    padding: 0px;
    overflow: hidden;
    background-color: white;
    border-radius: 10px;
    border: none;
    cursor: pointer;
    margin-bottom: 35px;
    box-shadow: var(--box-shadow40L);
}

.WorkshopTypes .well h3 {
    color: var(--themeColor);
    line-height: 35px;
    text-transform: uppercase;
}

.WorkshopTypes .well h4 {
    color: var(--themeColor);
    line-height: 35px;
    font-size: 1.1em;
}

.WorkshopTypes .well h5 {
    color: var(--primaryTextColor);
    line-height: 25px;
    padding-left: 15px;
    font-size: 1em;
}

.workshopContent {
    background-color: var(--secondaryColor);
    border-radius: 0px;
    text-align: center;
    padding: 15px;
}

.WorkshopTypes .well .workshopImage {
    transition: 0.5s ease-in;
    height: 100%;
    overflow: hidden;
}

.WorkshopTypes .well img {
    transition: 0.8s ease-in;
}

.WorkshopTypes .well:hover img {
    transform: scale(1.3);
    transition: 1s ease-in;
}

.WorkshopTypes .well .BtnPrimaryWhite {
    padding: 15px 10px;
    border: 1px solid var(--themeColor);
    background-color: white;
}

.WorkshopTypes .well:hover .BtnPrimaryWhite {
    background-color: var(--secondaryColor);
    color: white;
    transition: 0.3s ease-in;
}

#sectionOurServices .WorkshopTypes .well:hover {
    background-color: white;
    transition: 0.5s ease-in;
}

/*OTHER PAGES*/

/*FOOTER SECTION*/

.footerImage img {
    height: 55px;
}

.footerLinks h3 {
    color: white;
    font-weight: 800;
    font-size: 1.2em;
    padding-bottom: 15px;
}

.footerLinks a {
    text-decoration: none;
}

.footerLinks h4 {
    color: white;
    font-size: 1em;
    line-height: 20px;
}

.footerLinks h5 {
    color: white;
    font-size: 1.5em;
    font-weight: 800;
}

.footerLinks h6 {
    color: white;
    font-size: 1em;
    line-height: 30px;
}

.footerLinks i {
    padding-right: 10px;
}

.footerIcons {
    padding-top: 5%;
}

.footerIcons i {
    background-color: var(--secondaryColor);
    height: 40px;
    width: 40px;
    cursor: pointer;
    color: white;
    border-radius: 10px;
    margin: 15px 15px 0px 0px;
    padding: 13px;
    font-size: 1.2em;
    transition: 0.5s ease-in;
}

.footerIcons i:hover {
    background-color: var(--themeColor);
    color: white;
    border-radius: 50%;
    transition: 0.1s ease-in;
}

.copyright {
    padding: 5% 0% 0% 0%;
}

.copyright h4 {
    margin: 0px;
    color: white;
    font-size: 0.8em;
}

.copyright a {
    text-decoration: none;
    color: white;
}

.copyright h5 {
    margin: 0px;
    text-align: center;
    color: white;
    font-size: 0.8em;
}

.copyright h6 {
    margin: 0px;
    color: white;
    font-size: 0.7em;
}


.toTheTopIcon {
    height: 40px;
    width: 40px;
    color: white;
    font-size: 1.4em;
    
    position: fixed;
    cursor: pointer;
    transition: 0.4s ease-in;
    padding: 5px 0px 0px 14px;
}

.toTheTopIcon a {
    color: white;
    text-decoration: none;
}
    .whatsappIcon {
height: 40px;
width: 40px;
color: white;
font-size: 1.3em;
position: fixed;
cursor: pointer;
z-index: 555555;
background-color: #25d366;
transition: 0.4s ease-in;
padding: 5px 0px 0px 14px;
}
.whatsappIcon a {
color: white;
text-decoration: none;
}

/*FOOTER SECTION*/


.PrivacySection .sectionPrivacy h2 {
    font-size: 1.4em;
    font-weight: 600;
    line-height: 30px;
}

.PrivacySection h3 {
    font-size: 1.2em;
    text-align: center;
    padding-bottom: 20px;
    line-height: 30px;
}

.PrivacySection h4 {
    font-size: 1.2em;
    line-height: 30px;
    font-weight: bold;
}
.PrivacySection .sectionPrivacy h5 {
    font-size: 1.1em;
    text-align: justify;
    line-height: 35px;
}


/*CONTACT US PAGE*/
.secContactComp iframe {
    margin-top: 5%;
    border-radius: var(--borderRadius10);
}

.contactForm h4 {
    text-align: left;
    padding-top: 20px;
}

.contactForm span {
    color: var(--themeColor);
}

.contactForm label {
    margin-top: 10px;
    font-size: 0.9em;
    padding-bottom: 5px;
    color: var(--themeColor);
}

.contactForm input {
    border-radius: 7px;
    padding: 24px 15px;
    font-size: 1em;
    box-shadow: none;
    background-color: white;
    border: 1px solid var(--secondaryColor);
    margin-bottom: 5px;
}


.secContactComp h6 {
    font-size: 1.1em;
    text-align: center;
    background-color: var(--themeColor);
    color: white;
    line-height: 25px;
    padding: 10px 120px;
    float: right;
    margin-top: -70px;
    margin-right: 130px;
    border-radius: 5px;
}

/*CONTACT US PAGE*/

/*AUTHENTICATE*/
.containerBackUser {
    background-repeat: no-repeat;
    background-image: url(../../Assets/image/bgImg14.png);
    background-size: cover;
}

.AuthwrapperUser .container-fluid {
    padding: 10% 10% 3% 10%;
}

.authCompImg img {
    height: 60px;
}

.aboutProfile {
    padding-top: 2%;
}

.loginCardUser .well {
    background-color: white;
    box-shadow: var(--box-shadow40);
    z-index: 2;
    padding: 15px 20px 15px 20px;
    margin-top: 20px;
    border-radius: 10px;
    overflow: hidden;
    border: transparent;
}

.loginCardUser .well h1 {
    font-size: 1.4em;
    color: var(--themeColor);
    margin: 0px;
    padding-bottom: 5px;
}

.loginCardUser .well h4 {
    font-size: 1em;
    margin: 0px;
    font-style: italic;
    padding-top: 7px;
}

#sectionUserComp .formPannelAuth .formPannel input {
    border: 1px solid var(--themeColor);
    border-radius: var(--borderRadius5);
    background-color: transparent;
    font-size: 1em;
    border-radius: 10px;
    padding: 27px 25px;
    margin-top: 15px;
}

#sectionUserComp .formPannelAuth input::placeholder {
    font-size: 1em;
    letter-spacing: 1px;
}

.loginCardUser .well .actionBtnDark {
    padding: 15px 25px;
    border-radius: 10px;
    margin-top: 10px;
    background-color: var(--themeColor);
    width: 100%;
    color: white;
    border: none;
}

.incorrectBaner {
    height: 50px;
    background-color: transparent;
    padding-top: 15px;
    text-align: center;
}

#incorrect {
    color: red;
    padding: 5px;
    border-radius: 15px;
}

#sectionUserComp .actionBtnBack {
    background-color: transparent;
    border: none;
    padding-top: 15px;
}

#sectionUserComp .createOneComp .well {
    background-color: white;
    border-radius: var(--borderRadius10);
    box-shadow: var(--box-shadow40);
    padding: 10px;
    margin: 0px;
    border-radius: 10px;
    text-align: center;
    margin-top: 20px;
}

#sectionUserComp .createOneComp p {
    font-size: 1em;
    padding: 0px;
    padding-top: 10px;
    text-align: center;
}

#sectionUserComp .createOneComp p a {
    font-size: 1em;
    font-weight: bold;
    color: var(--themeColor);
}

#AllFields {
    text-align: center;
    color: red;
}

.AuthwrapperUser .infoBottom h6 {
    text-align: center;
    font-size: 0.9em;
    line-height: 22px;
    padding-top: 10px;
    margin: 0px;
}

.showPassword {
    padding-top: 10px;
}

.errorPane {
    background-color: var(--New);
    color: white;
    font-size: 1em;
    text-align: center;
    padding: 8px 55px;
    border-radius: 40px;
}

/*AUTHENTICATE*/

.sideDashComp a h4.Active {
    background-color: rgba(203, 124, 50, 1);
    color: white;
    font-size: 1em;
    text-align: center;
    border-radius: 10px;
    padding: 15px;
}

.myAccount .well .sideDashComph4 {
    font-size: 1.1em;
    text-align: center;
}

.myAccount .well .sideDashComp h4 a {
    color: var(--secondaryColor);
    font-weight: bold;
}

.myAccount .well h5 {
    font-size: 1em;
    line-height: 30px;
    margin-top: 10%;
    text-align: center;
}

.myAccount .well h5 a {
    color: var(--secondaryColor);
    font-weight: bold;
}

.myAccount .well {
    background-color: white;
    border-radius: 10px;
    box-shadow: var(--box-shadow40L);
    padding: 5px 20px 5px 15px;
    height: 100%;
}

.myAccount .well label {
    padding-top: 15px;
}

.myAccount .well input {
    border-radius: 7px;
    padding: 30px 25px;
    font-size: 1em;
    background-color: white;
    border: 1px solid var(--secondaryColor);
    margin-bottom: 5px;
}

.sideDashComp a h4 {
    background-color: rgba(203, 124, 50, 0.2);
    color: var(--themeColor);
    font-size: 1em;
    text-align: center;
    text-decoration: none;
    border-radius: 10px;
    padding: 15px;
}

.sideDashComp a:hover {
    text-decoration: none;
}

.notSignIn h4 {
    text-align: center;
    font-size: 1em;
}

.notSignIn h4 a {
    font-weight: 600;
    color: var(--themeColor);
    font-size: 1em;
}

.moveBack h5 {
    padding: 5px 5px;
    font-size: 1em;
    color: var(--secondaryColor);
    float: right;
    transition: 0.5s ease-in;
}

.moveBack a {
    text-decoration: none;
    color: var(--secondaryColor);
    transition: 0.5s ease-in;
}

.moveBack i {
    transition: 0.3s ease-in;
}

.moveBack a:hover i {
    padding-right: 5px;
    transition: 0.3s ease-in;
}

/*PRODUCTS PAGES STARTS*/
.productWrapper img:hover {
    transition: 0.5s ease-in;
}

.productWrapper h4 {
    padding: 15px;
    font-size: 1em;
    margin: 0px 0px 20px 0px;
}

 .productWrapper .productImage {
              border-radius: 10px;
              overflow: hidden;
              cursor: pointer;
              transition: 0.5s ease-in;
              }

.productImageComp:hover img {
    transform: scale(1.1);
    transition: 0.2s ease-in;
}

.productImageComp img {
    width: 100%;
    transition: 0.5s ease-in;
}

.ProductQuality {
    padding: 2%;
}

.ProductQuality img {
    border-radius: 25px;
}

.ProductQuality h3 {
    font-weight: bold;
    font-size: 1.3em;
}

.ProductQuality h4 {
    font-size: 1em;
    line-height: 20px;
}

#bodyWrapper .ProductCompCardTypes {
    padding: 2% 0%;
}

#bodyWrapper .ProductCompCard .well {
    padding: 0px;
    overflow: hidden;
    border-radius: 10px;
    box-shadow: var(--box-shadow30);
    border: none;
}

#bodyWrapper .ProductCompCard .well h3 {
    color: white;
    font-weight: bold;
    margin: 0px;
    font-size: 1.4em;
    padding: 0px;
    text-transform: uppercase;
}

#bodyWrapper .ProductCompCard .well h4 {
    color: white;
    line-height: 25px;
    font-size: 1em;
    padding: 0px 0px;
}

#bodyWrapper .ProductCompCard .well .productImage {
    transition: 0.7s ease-in;
    height: 250px;
    overflow: hidden;
}

#bodyWrapper .ProductCompCard .well .productImage img {
    transition: 0.7s ease-in;
}

#bodyWrapper .ProductCompCard .well:hover img {
    transform: scale(1.1);
    transition: 0.1s ease-in;
}

#sectionOurProduct .productShortComp {
    padding-left: 6%;
}

#sectionOurProduct .productDashWrapper h4 {
    padding: 15px 0px;
    font-size: 1em;
    margin: 0px 0px 20px 0px;
}

#sectionOurProduct .productImageComp {

    border-radius: 10px;
    overflow: hidden;
    cursor: pointer;
     width: 90%;
    height: 100%;
    transition: 0.5s ease-in;
}

#sectionOurProduct .productImageComp:hover img {
    transform: scale(1.1);
    transition: 0.2s ease-in;
}

#sectionOurProduct .productImageComp img {
    width: 100%;
    transition: 0.5s ease-in;
}

.mySwiperGallery {
    padding-bottom: 5%;
}

.swiperWrapperBig {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.swiperWrapperBig img {
    height: 250px;
    margin: 0px 0px 25px 0px;
    border-radius: 10px;
    cursor: pointer;
    transition: 0.3s ease-in;
}

.swiperWrapperBig img:hover {
    transition: 0.5s ease-in;
}
 
.swiperWrapperSmall img {
    height: 250px;
    margin: 0px 0px 25px 0px;
    border-radius: 10px;
    cursor: pointer;
    transition: 0.3s ease-in;
}

.swiperWrapperSmall img:hover {
    transition: 0.5s ease-in;
}

/*PRODUCTS PAGES ENDS*/