:root{
    --dark-bg : #d1d0c93d;
}

*{margin: 0; padding: 0;}

body{ font-family: "Rubik"; background: url(../images/light_bg.webp); font-size: 15px; line-height: 26px; letter-spacing: 0.2px; color: #555c63; background-attachment: fixed; }

.mafacContainer{}
.mafacContainer .manBack{padding: 0 50px;width: 100%;float: left;margin-bottom: 100px;}
.mafacContainer .manBack .content{background: var(--dark-bg);text-align: center;width: 388px;float: right;padding: 40px 30px;text-align: left;color: #555c63;}
.mafacContainer .manBack .content p em{font-style: normal;color: #222;font-weight: 500;font-size: 15px;}
.mafacContainer .manBack .content .heading{font-family: 'Playfair Display', sans-serif;font-weight: 500;font-size: 39px;line-height: 50px;margin-bottom: 30px;text-align: right;color: #222d35;position: relative;}
.mafacContainer .manBack .content .heading:before{    content: ''; background: url(../../assets/images/icon_certified.webp) no-repeat center center; width: 140px; height: 140px; position: absolute; background-size: contain; top: 22px; left: -10px; transform: rotate(0deg); filter: opacity(0.2); z-index: 0;}
.mafacContainer .manBack .content .heading strong{display: block;}
.mafacContainer .manBack .content .imgCont{margin-left: -70px;margin-right: -70px;margin-bottom: 25px;margin-top: 25px;position: relative;overflow: hidden;}
.mafacContainer .manBack .content .imgCont:before{position: absolute; top: 0; left: -75%; display: block; content: ''; width: 50%; height: 100%; background: -o-linear-gradient(left,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%); background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, .3))); background: linear-gradient(to right, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .3) 100%); -webkit-transform: skewX(-25deg); -ms-transform: skewX(-25deg); transform: skewX(-25deg);}
.mafacContainer .manBack .content .imgCont:hover:before{-webkit-animation: shine 1s;animation: shine 1s;}
@-webkit-keyframes shine{ 100% { left:125% } }
@keyframes shine{ 100% { left:125% } }
.mafacContainer .manCont{margin-top: 110px;}
.mafacContainer .manCont .eachContent{padding: 36px 23px 0;}
.mafacContainer .manCont .eachContent .eachImgCnt {position: relative;width: 45px;height: 45px;margin-bottom: 15px;transition: all ease-in-out 0.5s;}
.mafacContainer .manCont .eachContent .eachImgCnt:before {position: absolute; content: ''; height: 45px; width: 45px; opacity: 1; top: -5px; left: 0; border-radius: 50px; -webkit-transition: .5s all ease; -ms-transition: .5s all ease; -moz-transition: .5s all ease; -o-transition: .5s all ease; transition: .5s all ease;background: #e0dcd88a !important;}
.mafacContainer .manCont .eachContent .eachImgCnt img{width: 45px;height: 45px;margin-left: 11px;z-index: 1;position: relative;}
.mafacContainer .manCont .eachContent .eachDtls{transition: all ease-in-out 0.5s;}
.mafacContainer .manCont .eachContent .eachDtls .title{font-size: 15px; line-height: 30px; margin-bottom: 12px; font-weight: 500; text-transform: UPPERCASE; font-family: "Rubik", sans-serif; margin: 0;}
.mafacContainer .manCont .eachContent .eachDtls .desc{color: #555c63;line-height: 22px;margin-bottom: 6px;}
.mafacContainer .manCont .eachContent .eachDtls a{color: #222d35;text-transform: uppercase;font-weight: 500;text-decoration: none;padding: 0;border: 0;font-size: 14px;opacity: 0;transition: all ease-in-out 0.5s;}
.mafacContainer .manCont .eachContent:hover .eachImgCnt{transform: translateY(-25px);-ms-transform: translateY(-25px);-webkit-transform: translateY(-25px);-moz-transform: translateY(-25px);opacity: 0;}
.mafacContainer .manCont .eachContent:hover .eachDtls{transform: translateY(-25px);-ms-transform: translateY(-25px);-webkit-transform: translateY(-25px);-moz-transform: translateY(-25px);}
.mafacContainer .manCont .eachContent:hover a{transform: translateY(-25px);-ms-transform: translateY(-25px);-webkit-transform: translateY(-25px);-moz-transform: translateY(-25px); opacity: 1;}

.aboutSection{width: 100%;float: left;background: var(--dark-bg);padding: 90px 0;}
.aboutSection .dtls{padding: 0 60px 0 0;}
.aboutSection .dtls .subHeading{color: #000; font-weight: 500; display: inline-block; text-transform: uppercase; font-size: 15px; line-height: 0; margin-bottom: 8px; letter-spacing: 0.7px; position: relative; }
.aboutSection .dtls .heading{font-weight: 500; font-size: 39px; line-height: 50px; margin-bottom: 30px;    font-family: 'Playfair Display', sans-serif;color: #222d35;}
.aboutSection .dtls ul {margin: 0 0 20px 0;padding: 0;}
.aboutSection .dtls ul li{list-style-type: none;position: relative;padding-left: 30px;margin-bottom: 10px;}
.aboutSection .dtls ul li:before{content: "\f00c"; font: 600 20px 'Font Awesome 7 Pro'; position: absolute; left: 0; top: 5px;}
.aboutSection .dtls ul li strong{ display: block; color: black; font-weight: 500; }
.aboutSection .dtls p{}
.aboutSection .dtls .linkGroup{}
.aboutSection .dtls .linkGroup a{color: #fff;background-color: #000; outline: 2px solid #000;font-size: 14px;margin-right: 20px;margin-top: 15px;display: inline-block;vertical-align: middle;line-height: normal;padding: 15px 32px 15px 31px;position: relative;text-transform: uppercase;font-weight: 500;overflow: hidden;z-index: 1;transition: all 0.5s ease 0s;text-decoration: none;}
.aboutSection .dtls .linkGroup a:before{content: ''; position: absolute; background-color: #343434; width: 0%; height: 100%; right: 0; left: auto; top: 0; -webkit-transition: .4s all ease-in-out; -o-transition: .4s all ease-in-out; transition: .4s all ease-in-out; z-index: -1;}
.aboutSection .dtls .linkGroup a:hover:before{right: auto; left: 0; width: 100%;}
.aboutSection .dtls .linkGroup a:last-child{background: transparent; outline: 2px solid #343434; color: #000;}
.aboutSection .dtls .linkGroup a:last-child:hover{color: #fff;}
.aboutSection .imgCont{margin-top: -230px;position: relative;padding-right: 65px;margin-right: -65px;padding-top: 65px;overflow: hidden;}
.aboutSection .imgCont:before{background-image: url(../../assets/images/img-pattern-bg1.png); content: ''; position: absolute; width: 190px; height: 226px; background-repeat: no-repeat; right: 0; top: 0; z-index: -1;}
.aboutSection .imgCont:after{position: absolute; top: 0; left: -75%; display: block; content: ''; width: 50%; height: 100%; background: -o-linear-gradient(left,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%); background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, .3))); background: linear-gradient(to right, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .3) 100%); -webkit-transform: skewX(-25deg); -ms-transform: skewX(-25deg); transform: skewX(-25deg);}
.aboutSection .imgCont:hover:after{-webkit-animation: shine 1s;animation: shine 1s;}

.countSection{width: 100%;float: left;padding: 90px 0 120px;background-image: url(../../assets/images/row-bgimage-1.png);background-repeat: no-repeat;background-size: cover;background-position: center;background-attachment: fixed;}
.countSection .heading{font-weight: 500;font-size: 39px;line-height: 50px;margin-bottom: 30px;font-family: 'Playfair Display', sans-serif;color: #ffffff;}
.countSection p{color: rgba(255, 255, 255, .85);margin: 0 0 0px;}
.countSection .eachCounter {padding: 0;border-radius: 5px;text-align: center;margin-bottom: 50px;}
.countSection .eachCounter .counterImg{ height: 85px; line-height: 85px; display: block; position: relative; width: 85px; text-align: center; border-radius: 5px; margin: 0px auto 47px; border-width: 1px; border-style: solid; border-color: rgba(255, 255, 255, 0.26); border-image: initial; background: rgba(0, 0, 0, 0.35); }
.countSection .eachCounter .counterImg img{filter: invert(1); transition: ease-in-out all 0.9s;}
.countSection .eachCounter:hover img{transform: rotateY(360deg);}
.countSection .eachCounter .dtls{display: flex;align-items: center;justify-content: center;}
.countSection .eachCounter .dtls small{font-size: 30px;color: white;}
.countSection .eachCounter .dtls .count-title {margin-top: 10px;text-align: center;color: #fff;font-size: 46px;line-height: 50px;font-weight: 500;margin-bottom: 0;font-family: "Rubik", sans-serif;display: inline;}
.countSection .eachCounter .dtls .count-text { font-size: 13px; font-weight: normal;  margin-top: 10px; margin-bottom: 0; text-align: center; }


.categorySection{width: 100%;float: left;padding: 70px 0;}
.categorySection .subHeading{color: #000; font-weight: 500; display: inline-block; text-transform: uppercase; font-size: 15px; line-height: 0; margin-bottom: 8px; letter-spacing: 0.7px; position: relative; }
.categorySection .heading{font-weight: 500; font-size: 39px; line-height: 50px; margin-bottom: 30px;    font-family: 'Playfair Display', sans-serif;color: #222d35;}
.categorySection .design{padding: 50px 0 230px;margin-top: -130px;margin-right: -85px;padding-right: 70px;z-index: 1;position: relative;}
.categorySection .design .design1 { background-position: center; background-size: cover; background: url(../../assets/images/light_bg.webp); position: absolute; height: 100%; top: 0; left: 0; width: auto; margin-left: -500px; right: 0; }
.categorySection .design .design1 > div{ position: absolute; height: 100%; width: 100%; top: 0; left: 0; background: var(--dark-bg); }
.categorySection .design .design2 {position: relative; z-index: 9;}
.categorySection .catHolder{margin-top: -250px;}
.categorySection .catHolder .item{transition: all ease-in-out 0.5s;padding-top: 20px;padding-bottom: 20px;}
.categorySection .catHolder .item:hover{ -webkit-transform: translateY(-7px); -moz-transform: translateY(-7px); -ms-transform: translateY(-7px); -o-transform: translateY(-7px); transform: translateY(-7px);}
.categorySection .catHolder .eachItem{background: #fff;padding: 17px;box-shadow: 0 0 15px rgba(0, 0, 0, .1); transition: all ease-in-out 0.5s;}
.categorySection .catHolder .eachItem:hover{}
.categorySection .catHolder .eachItem a{text-decoration: none;color: #555c63;}
.categorySection .catHolder .eachItem a img{}
.categorySection .catHolder .eachItem a .title{ position: relative; overflow: hidden; font-size: 18px; line-height: 20px; font-weight: 500; margin-bottom: 5px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; width: 100%; display: flex; justify-content: space-between; padding-top: 15px; color: #555; }
.categorySection .catHolder .eachItem a .desc{line-height: 22px;}
.categorySection .controls{ width: 100%; float: left; text-align: center; margin-top: 20px; }
.categorySection .controls button{ width: 35px; height: 10px; background: #d9d5d5 !important; margin: 0 5px; border-radius: 50px; }
.categorySection .controls button.active{background: #8c9095 !important;}
.categorySection .cstBtn{color: #000;background-color: transparent;outline: 2px solid #000;font-size: 14px;margin-top: 15px;display: inline-block;vertical-align: middle;line-height: normal;padding: 15px 32px 15px 31px;position: relative;text-transform: uppercase;font-weight: 500;overflow: hidden;z-index: 1;transition: all 0.5s ease 0s;text-decoration: none;margin-top: 40px;}
.categorySection .cstBtn:hover{color: #fff;}
.categorySection .cstBtn:before{content: ''; position: absolute; background-color: #343434; width: 0%; height: 100%; right: 0; left: auto; top: 0; -webkit-transition: .4s all ease-in-out; -o-transition: .4s all ease-in-out; transition: .4s all ease-in-out; z-index: -1;}
.categorySection .cstBtn:hover:before{right: auto; left: 0; width: 100%;}

.directorDesk{width: 100%;float: left;padding: 0px 0;position: relative;background: var(--dark-bg);overflow: hidden;}
.directorDesk .bgimage-yes{height: 100%;z-index: 2;position: relative;}
.directorDesk .bgimage-yes .bgimage-yes-layer{background-image: url(../../assets/images/col-bgimage-2.jpg);background-position: center;background-size: cover;width: auto;margin-left: -500px;right: 0;position: absolute;height: 100%;top: 0;left: 0;}
.directorDesk .layer-content{position: relative;z-index: 1;height: 100%;width: 100%;margin-top: -50px;float: left;}
.directorDesk .ddMsgCont{position: relative;}
.directorDesk .ddCover{color: #000;padding: 30px 0;}
.directorDesk .heading{font-family: 'Playfair Display', sans-serif;font-size: 38px !important;line-height: 40px;margin: 0 0 15px 0;}
.directorDesk .ddCont{padding: 30px 0 0 40px;margin-left: -180px;z-index: 2;position: relative;float: left;}
.directorDesk .ddCont .bgimage-yes1{width: auto;margin-right: -500px;right: 0;background: url(../../assets/images/light_bg.webp);position: absolute;height: 100%;top: 0;left: 0;}
.directorDesk .ddCont .title{ font-family: 'Playfair Display', sans-serif; font-weight: 500; font-size: 39px; line-height: 50px; margin-bottom: 30px; color: #000 !important; text-transform: capitalize; }
.directorDesk .ddCont .message{ margin-bottom: 100px; }
.directorDesk .ddCont .message .imgContainer{ float: left; width: 185px; margin: 8px 40px 37px 0; text-align: center; }
.directorDesk .ddCont .message .imgContainer img{ float: left; width: 185px; margin: 8px 0px 20px 0; -webkit-mask-image: url(https://wdtninos.wpengine.com/wp-content/uploads/2022/10/custom-shape-bg-layer1a.svg); -webkit-mask-size: cover; -webkit-mask-position: center center; -webkit-mask-repeat: no-repeat; }
.directorDesk .ddCont .message .imgContainer em{width: 100%;float: left;font-style: normal;font-weight: 500;text-align: center;line-height: 20px;color: #2f865b;text-transform: uppercase;font-size: 14px;letter-spacing: 0;}
.directorDesk .ddCont .message p{color: #000;}
.directorDesk .ddCont .message .msgLnkCont{transition: all ease-in-out 0.3s;padding: 10px 30px;color: #000;text-decoration: none;margin: 0 20px 0 0;border-radius: 3px;border: 2px solid #545c51;display: contents;float: right;cursor: pointer;}
.directorDesk .ddCont .message .msgLnk{position: relative;transition: all ease-in-out 0.3s;padding: 10px 30px;color: #000;text-decoration: none;margin: 0 20px 0 0;border-radius: 3px;border: 2px solid #545c51;display: inline-block;float: right;cursor: pointer;}
.directorDesk .ddCont .message .msgLnk:hover{color: #fff;}
.directorDesk .ddCont .message .msgLnk:before{content: ''; position: absolute; background-color: #343434; width: 0%; height: 100%; right: 0; left: auto; top: 0; -webkit-transition: .4s all ease-in-out; -o-transition: .4s all ease-in-out; transition: .4s all ease-in-out; z-index: -1;}
.directorDesk .ddCont .message .msgLnk:hover:before{right: auto; left: 0; width: 100%;}
.directorDesk .ddCont .message .viewLess{position: relative;transition: all ease-in-out 0.3s;padding: 10px 30px;color: #000;text-decoration: none;margin: 0 20px 0 0;border-radius: 3px;border: 2px solid #545c51;display: inline-block;float: right;cursor: pointer;}
.directorDesk .ddCont .message .viewLess:hover{color: #fff;}
.directorDesk .ddCont .message .viewLess:before{content: ''; position: absolute; background-color: #343434; width: 0%; height: 100%; right: 0; left: auto; top: 0; -webkit-transition: .4s all ease-in-out; -o-transition: .4s all ease-in-out; transition: .4s all ease-in-out; z-index: -1;}
.directorDesk .ddCont .message .viewLess:hover:before{right: auto; left: 0; width: 100%;}
.directorDesk .ddCont .message .showHideDiv{}
.directorDesk .ddCont .message ul{margin: 0 0 13px 0;padding: 0 0 0 31px;color: #222;}
.directorDesk .ddCont .message ul li{list-style-type: unset;line-height: 28px;}

.supplyChn{position: relative;padding: 70px 0;background: var(--dark-bg);width: 100%;float: left;}
.supplyChn .heading span{ font-size: 14px; line-height: 0; margin-bottom: 8px; letter-spacing: 0.7px; position: relative; }
.supplyChn .heading h4{font-family: 'Playfair Display', sans-serif;font-size: 40px;font-weight: 400;color: #000;}
.supplyChn .heading h4 strong{display: block;font-weight: 800;color: var(--theme-green);}
.supplyChn .serialSL{counter-reset: serialSL; }
.supplyChn .serialSL .eachDiv{filter: drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.08));background: #fff;position: relative;margin-bottom: 30px;}
.supplyChn .serialSL .eachDiv:before{content: '';/* position: absolute; */width: 40px;height: 40px;background: #ffffff;left: 20px;bottom: -65px;border-radius: 50px;filter: drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.04));}
.supplyChn .serialSL .eachDiv:after{content: '';/* position: absolute; *//* background: #c37979; */left: 23px;bottom: -32px;/* border-radius: 50px; */filter: drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.04));/* border-style: solid; *//* border-width: 16px; *//* border-color: #ffffff #00000000 #00000000 #00000000; */}
.supplyChn .serialSL .eachDiv img{width: 100%;}
.supplyChn .serialSL .eachDiv .icon{/* position: relative; *//* background: #ffffff; */left: 20px;/* bottom: -65px; *//* border-radius: 50px; */filter: drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.04));display: flex;justify-content: center;text-align: center;padding: 6px 10px 0;}
.supplyChn .serialSL .eachDiv .icon:before{ counter-increment: serialSL; content: counter(serialSL, decimal-leading-zero) " "; }
.supplyChn .serialSL .eachDiv p{margin: 0;padding: 10px 10px 10px 0px;letter-spacing: 0;line-height: 18px;min-height: 80px;}
.supplyChn .serialSL .eachDiv p span {display: block;letter-spacing: 0.05rem;font-size: 13px;margin-top: 6px;color: #000;}

.febrics{width: 100%;float: left;padding: 70px 0;}
.febrics .stickyDiv{top: 200px;margin-right: 30px;}
.febrics .stickyDiv .subHeading{ background: var(--dark-bg); padding: 5px 10px; color: #3e3a3a; font-weight: 400; letter-spacing: 0.05rem; display: inline-block; }
.febrics .stickyDiv .heading{ font-family: 'Playfair Display', sans-serif; font-weight: 500; font-size: 39px; line-height: 50px; margin-bottom: 30px; color: #000; }
.febrics .stickyDiv p strong{ font-weight: 500; color: #242f37; font-size: 21px; }
.febrics .susEach {background: #fff;margin: 0;box-shadow: 0px 0px 18px #cccccc73;border: 10px solid #fff;}
.febrics .susEach img { width: 100%; height: 100%; object-fit: cover; }
.febrics .susEach span { display: flex; flex-direction: column; justify-content: center; padding: 15px 30px 15px 5px; height: 100%; position: relative; }
.febrics .susEach span:before { content: ''; position: absolute; top: 10px; bottom: 10px; left: -46px; border-color: #c35c5c00 #ffffff #00000000 #ffffff00; border-style: solid; border-width: 14px 14px 14px 22px; }
.febrics .susEach span .h3 {font-family: 'Playfair Display', sans-serif;color: #000;margin: 0 0 12px 0;}
