@import url(https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400..700&display=swap);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick-theme.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.css);
@import url(css/ma5-menu.min.css);
@import url(css/animate.css);
/* Global */
@font-face {font-family: "ClashDisplay-Bold";  src: url(fonts/ClashDisplay-Bold.ttf);}
@font-face {font-family: "ClashDisplay-Extralight";  src: url(fonts/ClashDisplay-Extralight.ttf);}
@font-face {font-family: "ClashDisplay-Light";  src: url(fonts/ClashDisplay-Light.ttf);}
@font-face {font-family: "ClashDisplay-Medium";  src: url(fonts/ClashDisplay-Medium.ttf);}
@font-face {font-family: "ClashDisplay-Regular";  src: url(fonts/ClashDisplay-Regular.ttf);}
@font-face {font-family: "ClashDisplay-Semibold";  src: url(fonts/ClashDisplay-Semibold.ttf);}
@font-face {font-family: "ClashDisplay-Variable";  src: url(fonts/ClashDisplay-Variable.ttf);}
:root{--Popines: "Poppins", sans-serif; --Gradient: linear-gradient(to left, #0071bb, #9bc32e); /*--shadow: rgb(23, 71, 109) 0px 4px 15px;*/}
h1,h2,h3,h4,h5,h6{font-size: 30px; margin: 0px; padding: 0px; font-weight: 600; font-family: "ClashDisplay-Variable";}
ul{padding: 0px; margin: 0px; list-style-type: none;}
li{padding: 0px; margin: 0px; font-size: 15px;  font-family: var(--Popines);}
a{font-size: 15px; font-family: var(--Popines); text-decoration: none;}
a:hover{text-decoration: none;}
p{font-size: 15px; padding: 0px; margin: 0px; font-family: var(--Popines);}
small{font-family: var(--Popines);}
body{padding: 0px; margin: 0px; box-sizing: content-box;  counter-reset: pbmitbox1 pbmitbox2 pbmitbox3 pbmit-rev-counter; overflow-x: hidden;}
span{padding: 0px; margin: 0px; font-family: var(--Popines);}
input{font-family: var(--Popines);}
button{font-family: var(--Popines);}
select{font-family: var(--Popines);}
option{font-family: var(--Popines);}
textarea{font-family: var(--Popines);}
label{font-family: var(--Popines);}
::selection {  color: #fff;  background: #9bc32e;}
::-webkit-scrollbar {  width: 10px;}
::-webkit-scrollbar-track {  background: var(--Gradient);}
::-webkit-scrollbar-thumb {  background:#fff;}
::-webkit-scrollbar-thumb:hover {  background: #555;}
/* Start CSS */
.logo-side { position: relative; z-index: 9;  width: 25%;}
.logo-side img{width: 100%;}
header { position: relative; z-index: 9;     background: rgba(255, 255, 255, 0.1);    backdrop-filter: blur(10px);    -webkit-backdrop-filter: blur(10px);    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);    border-bottom: 1px solid rgba(255, 255, 255, 0.2);    transition: background 0.3s ease;}
header .row {display: flex; align-items: center;}
header .row-grid {    display: flex;    align-items: center;    justify-content: space-between; flex-wrap: wrap;}
.navigation-side {    width: 75%; }

/* header:after{position: absolute; top: 0; width: 100%; height: 100px;  content: ''; background: rgba(255, 255, 255, 0.1); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1); border-bottom: 1px solid rgba(255, 255, 255, 0.2); transition: background 0.3s ease;} */
/* Fennec Mobile Nav */
.fennec-mobile-nav .navbar-nav {  overflow-y: auto;}
.fennec-nav .navbar .navbar-nav .nav-item {  position: relative;  padding: 0;}
.fennec-nav .navbar .navbar-nav .nav-item a {  font-weight: normal;    color: #fff;    text-transform: capitalize;    padding: 20px 12px;    position: relative;    z-index: 1;    margin: 0;    font-size: 14px; font-weight: 400; font-family: var(--Popines);}
.fennec-nav .navbar .navbar-nav .nav-item a:hover::before, .fennec-nav .navbar .navbar-nav .nav-item a:focus::before, .fennec-nav .navbar .navbar-nav .nav-item a.active::before {  opacity: 1;  visibility: visible;}
.fennec-nav .navbar .navbar-nav .nav-item .dropdown-menu {  -webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);          box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);    background: #000; position: absolute;  border: none;  top: 80px;  left: 0;  width: 350px;  z-index: 99;  display: block;  opacity: 0;  visibility: hidden;  border-radius: 0;  -webkit-transition: all 0.3s ease-in-out;  transition: all 0.3s ease-in-out;  padding-top: 15px;  padding-left: 5px;  padding-right: 5px;  padding-bottom: 15px;  border-radius: 15px;}
.fennec-nav .navbar .navbar-nav .nav-item .dropdown-menu li a {  text-transform: capitalize;  padding: 5px 15px;  display: block;  color: #fff;   font-size: 14px;  font-weight: 400;}
.fennec-nav .navbar .navbar-nav .nav-item .dropdown-menu li a::before {  display: none;}
.fennec-nav .navbar .navbar-nav .nav-item .dropdown-menu li a:hover, .fennec-nav .navbar .navbar-nav .nav-item .dropdown-menu li a:focus, .fennec-nav .navbar .navbar-nav .nav-item .dropdown-menu li a.active {  color: #fff; }
.fennec-nav .navbar .navbar-nav .nav-item .dropdown-menu li a:hover::after, .fennec-nav .navbar .navbar-nav .nav-item .dropdown-menu li a:focus::after, .fennec-nav .navbar .navbar-nav .nav-item .dropdown-menu li a.active::after {  opacity: 1;  visibility: visible;  -webkit-transform: scale(1);          transform: scale(1);}
.fennec-nav .navbar .navbar-nav .nav-item .dropdown-menu li a:first-child {  margin-top: 0;}
.fennec-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu {  left: 220px;  top: 0;  opacity: 0;  visibility: hidden;}
.fennec-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu {  left: 220px;  top: 0;  opacity: 0;  visibility: hidden;}
.fennec-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li:hover .dropdown-menu {  opacity: 1;  visibility: visible;  top: -15px;}
.fennec-nav .navbar .navbar-nav .nav-item .dropdown-menu li:hover .dropdown-menu {  opacity: 1;  visibility: visible;  top: -15px;}
.fennec-nav .navbar .navbar-nav .nav-item:hover .dropdown-menu {  opacity: 1;  visibility: visible;  top: 100%;  margin-top: 0;}
.navbar{padding: 0px;}
/* .navigation-side ul li:last-child a { background: var(--Gradient);    border-radius: 50px;} */
a.last-child-design { position: relative;    top: 10px;  background: var(--Gradient);    padding: 10px 30px !important;    border-radius: 50px;}
.slider-width {    width: 55%;    text-align: center;      margin: auto;   align-items: center;    height: 100vh;    align-items: center;    align-self: center;    align-content: center;}
.hero-slider {position: relative; margin-top: -120px;}
.slider-item{height: 100vh;}
.slider-width h1 {   padding-left: 100px; padding-right: 100px; font-size: 50px;}
.slider-btn a {  text-decoration: none; border-radius: 50px; background: var(--Gradient);    padding: 10px 30px;}
.slider-width p{padding-left: 50px; padding-right: 50px;}
/* Main Slider */
.Main_slider .slick-dots li.slick-active button { height: 20px;    border-radius: 10px;   background-color: white; border: 1px solid #234b69;}
.Main_slider .slick-dots li button {    width: 12px;    height: 12px;    background-color: rgba(255, 255, 255, 0.4);    border-radius: 100%;}
.Main_slider  .slick-dots li button:before{	content: '';}
.Main_slider ul.slick-dots {  display: flex;    flex-direction: column;    right: 30px;    align-items: end;    top: 50%;    width: 3%;}
.slick-dots li{margin: 5px 5px;}
/* Slider image Zoom Effect */
.slider-item {    animation: zoomEffect 12s ease-in-out infinite;}
/* Zoom-in Zoom-out keyframes */
@keyframes zoomEffect {
0% { background-size: 100%;}
50% { background-size: 110%;}
100% {background-size: 100%;}
}
.slider-item:nth-child(1) { animation: zoomEffect 30s ease-in-out infinite; }
.slider-item:nth-child(2) { animation: zoomEffect 25s ease-in-out infinite; }
.slider-item:nth-child(3) { animation: zoomEffect 20s ease-in-out infinite; }
.social-media-links {    position: absolute;    left: -95px;    top: 50%;}
.social-media-links ul { top: 50%;    z-index: 1000;    display: flex;    flex-direction: column;    gap: 1rem;    display: flex;  flex-direction: row-reverse; align-items: center;    transform: rotate(-90deg);}
.social-media-links ul li a{width: 40px; height: 40px;  background: rgba(255, 255, 255, 0.1);    border-radius: 50%;    display: flex;    align-items: center;    justify-content: center;    color: white;    text-decoration: none;    transition: all 0.3s ease;    backdrop-filter: blur(10px);    border: 1px solid rgba(255, 255, 255, 0.2);     transform: rotate(90deg);}
.social-media-links ul li a:hover {    background: var(--Gradient) ;    color: white;     transform: rotate(445deg);}
.social-media-links ul li a i{  transform: rotate(0deg);}
.slider-width {  opacity: 0.9;  transform: translateY(40px);  transition: 0s;}
.slider-animate {  animation: slideUp 0.8s ease-out forwards;}
@keyframes slideUp {
0% {    opacity: 0;    transform: translateY(40px);}
100% {    opacity: 1;    transform: translateY(0);  }
}
.about-content-side p{text-align: justify;}
.about-btn a{background: var(--Gradient);  padding: 10px 25px; border-radius: 50px; box-shadow: var(--shadow);}
#toTop {    position: fixed;    bottom: 40px;    right: 25px;    cursor: pointer;    transition: 0.5s;    z-index: 9999;}
.about-img-side span {    position: absolute;    z-index: 99;    color: #fff;    bottom: 45px;    left: 40px; font-family: "ClashDisplay-Semibold"; font-size: 30px;}
.animation-text p{background: url(img/smoke.jpg); font-family: var(--Popines); font-weight: bold; -webkit-background-clip: text; -webkit-text-fill-color: transparent;    animation-iteration-count: infinite; font-weight: 900;    font-size: 55px;    line-height: 50px;  text-transform: uppercase;   -webkit-background-clip: text;    -webkit-text-fill-color: transparent;    -webkit-animation-name: masked-animation;    animation-name: masked-animation;    -webkit-animation-duration: 10s;    animation-duration: 10s;    -webkit-animation-iteration-count: infinite;    animation-iteration-count: infinite;    -webkit-animation-timing-function: linear;    animation-timing-function: linear; -webkit-box-reflect:below 1px linear-gradient(transparent,transparent, #000); background-clip: text; }
.img-side-full{background: url(img/smoke.jpg);}
@keyframes masked-animation {
0% {background-position: 50% 35%;}
50% {background-position: 50% 65%;}
100% {background-position: 50% 35%;}
}

.bg-content{background: url(img/bg-img.jpg) no-repeat; background-size: cover; background-position: 50% 50%; }

.content_inner span{font-size: 30px; font-family: "ClashDisplay-Semibold";  color: #e3f3ff;}
.content_inner p {    color: #e3f3ff;}
/** Style 7**/
.pbmit-ihbox-style-7 {    position: relative;    overflow: hidden;}
.pbmit-ihbox.pbmit-ihbox-style-7 .pbmit-ihbox-icon-type-image {    overflow: hidden;}
.pbmit-ihbox.pbmit-ihbox-style-7 .pbmit-ihbox-icon-type-image img {    width: 100%;}
.pbmit-ihbox-style-7 {    position: relative;    overflow: hidden;}
.pbmit-ihbox-style-7 .pbmit-element-title{  font-family: "ClashDisplay-Semibold";   font-size: 60px;    line-height: 70px;    font-weight: 700;    text-transform: uppercase;    margin-bottom: 0;    color: #fff;}
.pbmit-ihbox-style-7 .pbmit-ihbox-contents {    position: absolute;    left: 0;    top: 0;    width: 100%;    height: 100%;    text-align: center;    background-color: rgba(25,35,43, 0.30);}
.pbmit-ihbox-style-7 .pbmit-element-title {    position: absolute;    left: 0;    top: 50%;    width: 100%;    height: 100%;   -khtml-transform: translateX(0%) translateY(-8%);    -moz-transform: translateX(0%) translateY(-8%);    -ms-transform: translateX(0%) translateY(-8%);    -o-transform: translateX(0%) translateY(-8%);    transform: translateX(0%) translateY(-8%);}
.pbmit-ihbox-style-7 .pbmit-ihbox-btn a{    font-size: 0;    padding: 0;	position: relative;    display: inline-block;    line-height: 16px;}
.pbmit-ihbox-style-7 .pbmit-ihbox-btn a:before {    display: none;}
.pbmit-ihbox-style-7 .pbmit-ihbox-btn a:after {    content: '\e818';    color: #fff;    width: 55px;    height: 55px;    font-size: 22px;    line-height: 55px;     text-align: center;    background-color: var(--pbmit-global-color);    font-family: "pbminfotech-base-icons";    top: -1px;    right: 0;    font-weight: 400;    position: absolute;}
.pbmit-ihbox-style-7 .pbmit-ihbox-btn {    position: absolute;    bottom: 35px;    right: 0;}
.pbmit-ihbox-style-7:after {content: "0" counter(pbmitbox2) ""; counter-increment: pbmitbox2;    position: absolute;    top: 50%;    left: 50%;    font-size: 150px;    line-height: 150px;    -webkit-text-stroke: 1px rgba(255,255,255,0.6);    font-weight: 900;    color: transparent;   -khtml-transform: translateX(32%) translateY(-50%);    -moz-transform: translateX(32%) translateY(-50%);    -ms-transform: translateX(32%) translateY(-50%);    -o-transform: translateX(32%) translateY(-50%);    transform: translateX(32%) translateY(-50%);}
.pbmit-ihbox.pbmit-ihbox-style-7 .pbmit-ihbox-icon-type-image{	overflow: hidden;}
.pbmit-ihbox.pbmit-ihbox-style-7:hover .pbmit-ihbox-icon-type-image img {    -webkit-transform: scale(1.2);    -ms-transform: scale(1.2);    transform: scale(1.2);}
.pbmit-ihbox-style-7:hover .pbmit-ihbox-contents{	background-color: transparent;}
.pbmit-ihbox.pbmit-ihbox-style-7 .pbmit-ihbox-icon-type-image img,
.pbmit-ihbox-style-7 .pbmit-ihbox-contents{    -webkit-transition: all 0.5s ease 0s;    -o-transition: all 0.5s ease 0s;    transition: all 0.5s ease 0s;}
.pbmit-element-miconheading-style-7 .pbmit-element-posts-wrapper.row {    margin-left: 0;    margin-right: 0;}
.pbmit-element-miconheading-style-7 .pbmit-element-posts-wrapper.row .pbmit-ele{    padding-right: 0;    padding-left: 0;    margin-bottom: 0;}
.pbmit-ihbox.pbmit-ihbox-style-7 .pbmit-ihbox-icon-type-image img{    width: 100%;}

.our-products{background: url(img/shape30.png) repeat; background-size: center;}
.our-products .title span{font-size: 35px; font-family: "ClashDisplay-Medium"; }
.our-products .title{position: relative;}
.our-products .title span{position: relative;}
.our-products .title span::after{    position: absolute;    content: '';    bottom: -14px;    background-color: #000;    width: 50%;    height: 1px;    left: 55px;}
.our-products .title span::before{        position: absolute;    content: '';    bottom: 0px;    background-color: #000;    width: 40%;    height: 1px;    left: 65px;    top: 46px;}
.content_inner{position: relative;}
.content_inner  span{position: relative;}
.content_inner  span::after{          position: absolute;    content: '';    bottom: -16px;    background-color: white;    width: 7%;    height: 1px;    left: 588px;}
.content_inner  span::before{      position: absolute;    content: '';    bottom: 0px;    background-color: white;    width: 5%;    height: 1px;    left: 600px;    top: 50px;}
/* .our-products{background: url(img/product-showcase-slider-base.jpg) center / cover no-repeat; } */
    
.content-side-metter{width: 30%;}
.content-side-metter small{    font-size: 100px;    font-weight: 200;    line-height: 1.25;    letter-spacing: -3px;    color: #234b69;    margin-top: 20px;    }
.content-side-metter{    max-width: 270px;    font-weight: 600;    font-size: 32px;    line-height: 1.15;    letter-spacing: -0.96px;    background: linear-gradient(114deg, #203748 3.47%, #000 51.38%, #9bc32e 83.28%);    background-clip: text;    -webkit-background-clip: text;    -webkit-text-fill-color: rgba(0, 0, 0, 0);    text-transform: capitalize;    }
.content-side-metter {    position: absolute;    top: 0;}


.button-hover a{    gap: 24px;    font-weight: 600;    font-size: 20px;    color: #000;    line-height: 1.1;    letter-spacing: -0.6px;}
.button-hover a i{    background: var(--Gradient);    border-radius: 50px;    width: 40px;    height: 40px;    text-align: center;    line-height: 42px;    margin-left: 10px;    color: #fff;    font-size: 14px;}


.sldiebar {    background: var(--Gradient)}

.item-slide span {    display: flex;    align-items: center;    font-size: 30px;    font-family: "ClashDisplay-Semibold";     color: #fff;    margin-right: 15px;}
.item-slide img {    filter: brightness(0) invert(1);    margin-right: 14px;}
.our-support button {    font-size: 15px;    line-height: 24px;    font-weight: 700;    text-transform: uppercase;    color: #000 !important;    height: 50px;    background-color: #FFBA01;    display: inline-block;    padding: 10px 30px;    text-align: center;    position: relative;    z-index: 1;    margin-top: 20px;    border:0;}
.our-support button:hover {    color: #fff !important;    border-color: #fff !important;    background-color: #184689;}
.industries{    background: url(../images/bg.png) 0 0 no-repeat;    background-size: cover;    background-position: center center;    width: 100%;   margin-top: 100px;    text-align: center;	padding-bottom: 30px;}
.our-industries {    padding: 60px 0 0 0;}
.industry-experience {    background-color: #184689;    padding: 60px 0;    text-align: center;}
.polygon{    position: relative;}.industry-center {    position: absolute;    top: 22%;    left: 50%;    transform: translate(-50%, -50%);    text-align: center;}
.industries::before{    position: absolute;    content: "";}
.industry-center-2 img{    width: 45px;  }
.polygons .text-light:after {    content: "\f067";    font-family: 'FontAwesome';    font-size: 23px;    padding-left: 5px;    margin: 0px 0 -6px 0px;}    
.polygons .lights:after {    display:none !important;}
.polygons p{	color:#fff;}
.year-images img{    position: relative;    width:100%;    height: 560px;}
.year-subimages img {    position: absolute;    bottom: 12px;    right: 12px;    width: 50%;}
.support {    display: flex;    padding-bottom: 20px;}
span.heading-type {font-size: 30px; font-family: "ClashDisplay-Medium";}
.support-content span {   color: #000; display: block;    margin-bottom: 5px;    font-size: 18px;    font-weight: 500;}
.support-img {    margin-right: 22px;}
.year-images img{border-radius: 15px;}

.businee-overview{background: url(img/image-7-scaled.webp) no-repeat; background-attachment: fixed; background-size: cover;}
.businee-overview .title{position: relative;}
.businee-overview .title span{position: relative; font-size: 30px; font-family: "ClashDisplay-Medium"; }
.businee-overview .title span::after{    position: absolute;    content: '';    bottom: -14px;    background-color: #fff;    width: 50%;    height: 1px;    left: 55px;}
.businee-overview .title span::before{        position: absolute;    content: '';    bottom: 0px;    background-color: #fff;    width: 40%;    height: 1px;    left: 65px;    top: 39px;}

.carbon-box .bg-white{border-radius: 15px;     min-height: 400px;}
.carbon-box span {   color: #000; font-size: 22px;    display: block;    margin-bottom: 12px; font-family: "ClashDisplay-Medium"; }

.bag-bg{background: url(img/product-package-bg.webp) no-repeat; background-position: center;}
marquee{font-family: "ClashDisplay-Medium";   font-size: 100px;}

.before-blue-gradient { position: relative;}
.before-blue-gradient::before {    position: absolute;    content: '';    width: 300px;    height: 90vh;        background: linear-gradient(to left, rgba(206, 206, 206, 0) 0%, rgb(226, 226, 226) 100%);    left: 0px;    z-index: 9;    top: 0px;}
.before-blue-gradient::after {    position: absolute;    content: '';    width: 300px;    height: 90vh;        background: linear-gradient(to right, rgba(206, 206, 206, 0) 0%, rgb(226, 226, 226) 100%);    right: 0px;    z-index: 9;    top: -0px;}
.div-bg img{width: 60%;;}
.bag-bg{height: 90vh; }
marquee.outlined {    position: absolute;    top: 35%;}
.div-bg {    z-index: 9;}
/* .logos-design{background: url(img/image-7-scaled.webp) no-repeat; background-attachment: fixed; background-size: cover;} */
.logos-design .title{position: relative;}
.logos-design .title span{position: relative; font-size: 30px; font-family: "ClashDisplay-Medium"; }
.logos-design .title span::after{    position: absolute;    content: '';    bottom: -14px;    background-color: #000;    width: 50%;    height: 1px;    left: 55px;}
.logos-design .title span::before{        position: absolute;    content: '';    bottom: 0px;    background-color: #000;    width: 40%;    height: 1px;    left: 65px;    top: 39px;}

.form-design {background: url(img/footer-background.jpg) no-repeat; background-size: cover; background-attachment: fixed;}
.form_inner{    background: rgba(255, 255, 255, 0.1);    backdrop-filter: blur(10px);    -webkit-backdrop-filter: blur(10px);    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);    border-bottom: 1px solid rgba(255, 255, 255, 0.2);    transition: background 0.3s ease;    border-radius: 30px;}
.form_inner input{width: 100%; height: 45px; background-color:transparent; border:none; color: #fff; font-family: var(--Popines); border-bottom: 1px solid #ccc;     margin-bottom: 15px; font-size: 14px;}
.form_inner input:focus{outline: none;}
.form_inner input::placeholder{color: #fff;}
.form_inner select:focus{outline: none;}
.form_inner select{width: 100%; height: 45px; background-color:transparent; border:none; color: #fff; font-family: var(--Popines);  border-bottom: 1px solid #ccc; font-size: 14px;}
.form_inner select option{color: #000;}
.form_inner textarea{width: 100%; height: 100px; background-color:transparent; border:none; color: #fff; font-family: var(--Popines); border-bottom: 1px solid #ccc; padding-top: 10px; margin-bottom: 15px; resize: none; font-size: 14px; padding-top: 15px;}
.form_inner textarea:focus{outline: none;}
.form_inner textarea::placeholder{color: #fff;}
.form_inner button{background-color: red; border: none; font-family: var(--Popines);}

.form_inner .title{position: relative;}
.form_inner .title span{position: relative; font-size: 30px; font-family: "ClashDisplay-Medium"; }
.form_inner .title span::after{ position: absolute;    content: '';    bottom: -18px;    background-color: #fff;    width: 50%;    height: 1px;    left: 170px;}
.form_inner .title span::before{  position: absolute;    content: '';    bottom: 0px;    background-color: #fff;    width: 40%;    height: 1px;    left: 205px;    top: 44px;}
.buttom-center button{    background: var(--Gradient);    border-radius: 50px;}

/* partner-map */
.partner-map {    background-size: contain;    background-repeat: no-repeat;    position: relative;    z-index: 1; background-position: 50% 50%;}
.partner-map span {   font-size: 100px;    font-weight: 600;    display: inline-block;    position: relative;    margin-top: -10px;    margin-bottom: 20px;    line-height: 80px;}
.partner-map p {    margin: 0;    font-weight: 600;    font-size: 36px;}
.bg-contain-center,.partner-shape {    background-size: contain;    background-repeat: no-repeat;}
.partner-items ul {    display: grid;    grid-template-columns: 1fr 1fr 1fr;    grid-row-gap: 0;    position: relative;    z-index: 1;    overflow: hidden;    text-align: center;}
.types-list,ul.check-list {    grid-template-columns: 1fr 1fr;    grid-column-gap: 30px;}
.service-area ul li a {    color: #000;    font-size: 14px;}
.service-area ul li {    line-height: 30px;}
.service-area i {    color: #000;}
span.mask-text {    background-size: cover;    background-position: center;    -webkit-background-clip: text;    background-clip: text;    color: transparent;  -webkit-text-fill-color: transparent;   display: inline-block;    text-transform: capitalize;}
.faqs-design_img img{border-radius: 30px;}
.set-content {    position: absolute;    bottom: 95px;    width: 65%;    color: #fff;    left: 16%;  }
.set-content span{font-family: "ClashDisplay-Medium"; font-size: 25px;}
/* tagline */
/* .tagline{background: #234b69 url(img/pattern.png) repeat;     background-size: 90em auto;} */
.contact-side span {    font-size: 56px;font-weight: 200;}
.contact-side small {    font-weight: 600;}
.contact-side p{width: 65%; font-size: 18px; margin: 0px auto;}
.btn-hyper a {    border: 1px solid #fff;    padding: 10px 30px;    color: #fff;    border-radius: 5px; transition: 0.5s;}
.btn-hyper a:hover{background:var(--Gradient);}
img.setimg {    position: absolute;    bottom: 0;}
/* Tagline */
.tagline {    position: relative;    background: linear-gradient(135deg, #9bc32e 0%, #0071bb 30%, #2952728f 70%, #14263412 100%), url(img/coal-img.jpg);    background-size: cover;    background-position: center;    background-attachment: fixed;    color: white;    text-align: center;      padding: 25px 0px 85px;  overflow: hidden;    clip-path: polygon(0 0, 100% 0, 100% 80%, 0% 100%);}
.client-item img {border: 1px solid #f1f1f1;    border-radius: 10px;}
.client-item{    margin: 10px;}
.logos-design{background: url(img/brand-bg.webp);}
/* Over Goverment */
.our-goverment .title{position: relative;}
.our-goverment .title span{position: relative; font-size: 30px; font-family: "ClashDisplay-Medium"; }
.our-goverment .title span::after{ position: absolute;    content: '';    bottom: -18px;    background-color: #000;    width: 50%;    height: 1px;    left: 170px;}
.our-goverment .title span::before{  position: absolute;    content: '';    bottom: 0px;    background-color: #000;    width: 40%;    height: 1px;    left: 205px;    top: 44px;}
.goverment-item img{border: 1px solid #f1f1f1; padding: 5px;}
.main-goverment {    direction: rtl;}
.sldiebar {    transform: rotate(-1deg);}
.widget p{text-align: justify; font-size: 14px;}

.rotate-plate img {    animation-name: MoveCircle360;    animation-timing-function: linear;    animation-duration: 30s;    animation-delay: 0s;    animation-iteration-count: infinite;    top:0px;    position: relative;}
@keyframes MoveCircle360 {
100% {        transform: rotate(360deg);        -webkit-transform: rotate(360deg); }
}
@keyframes width100 {
0% {        opacity: 0;       transform: scaleX(0); }
100% {opacity: 1; transform: scaleX(1);}
}
footer{background: url(img/waves_white-15.png) no-repeat;  padding-bottom: 50px; position: relative;}
.widget span{font-family: "ClashDisplay-Semibold"; font-size: 18px;}
.about {    background: url(img/line.png) no-repeat;    background-size: contain;    background-position: bottom;}
.copy-right{background:var(--Gradient);}
/* Social Media */
.social-media_link-footer  a .fa-facebook-f {background-color: #395693; width: 35px; height: 35px; display: flex; justify-content: center; align-items: center; border-radius: 50px; box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;}
.social-media_link-footer  a .fa-x-twitter {background-color: #000; width: 35px; height: 35px; display: flex; justify-content: center; align-items: center; border-radius: 50px; box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;}
.social-media_link-footer  a .fa-instagram { width: 35px; height: 35px;    background: #f09433; background: -moz-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%); background: -webkit-linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f09433', endColorstr='#bc1888',GradientType=1 );     display: flex; justify-content: center; align-items: center; border-radius: 50px; box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;}
.social-media_link-footer  a .fa-youtube{background-color: red; width: 35px; height: 35px; display: flex; justify-content: center; align-items: center; border-radius: 50px; box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;}
/* Animation Text Design */
.animation-text-design p{font-size: 50px; line-height: 0px;  font-family: "ClashDisplay-Bold"; color: #0574b8;}
.blink {   animation: blinkMe 3s linear infinite;}
@keyframes blinkMe {
0% {    opacity: 1;}
50% {    opacity: 0;}
100% {    opacity: 1;}
}
/*Whatsapp-popup*/
#whatsapp .wtsapp:focus {    border: none;    outline: none;}
#whatsapp .wtsapp {    position: fixed;    transition: all .5s ease;    background: #25d366;    display: block;    text-align: center;    box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);    /* margin: 0; */    border-radius: 50px;    border-right: none;    color: #fff;    font-weight: 700;    font-size: 18px;    bottom: 141px;    left: 25px;    border: 0;    z-index: 999;    width: 50px;    height: 50px;    line-height: 48px;}
#whatsapp .wtsapp:before {    content: "";    position: absolute;    z-index: -1;    left: 50%;    top: 50%;    transform: translateX(-50%) translateY(-50%);    display: block;    width: 60px;    height: 60px;    background: #25d366;    border-radius: 50%;    -webkit-animation: pulse-border 1500ms ease-out infinite;    animation: pulse-border 1500ms ease-out infinite;}
@keyframes pulse-border {
0% {
transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
opacity: 1;
}

100% {
transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
opacity: 0;
}
}
.phone_lefts-side a {    position: fixed;    bottom: 232px;    color: white;    animation: topBottom 4s infinite;    z-index: 999;    left: 20px;    background: #000;    color: white;   padding: 10px 16px;    border-radius: 50%;    font-size: 20px;    animation: bounce 4s infinite alternate;     box-shadow: var(--shadow);}
/*Call Me*/
.phone_lefts-side {    position: relative;}
.glow {    font-size: 80px;    color: #fff;    text-align: center;    -webkit-animation: glow 1s ease-in-out infinite alternate;   -moz-animation: glow 1s ease-in-out infinite alternate;    animation: glow 1s ease-in-out infinite alternate;}
@-webkit-keyframes glow {
from {text-shadow: 0 0 10px #f3fffd , 0 0 20px #f3fffd, 0 0 30px #f3fffd , 0 0 40px #f3fffd , 0 0 50px #f3fffd , 0 0 60px #f3fffd , 0 0 70px #f3fffd ;}
to {text-shadow: 0 0 20px #f3fffd, 0 0 30px #f3fffd , 0 0 40px #f3fffd , 0 0 50px #016098 , 0 0 60px #f3fffd , 0 0 70px #f3fffd , 0 0 80px #f3fffd ;}
}
@keyframes glow {
from {text-shadow: 0 0 10px #f3fffd , 0 0 20px #f3fffd, 0 0 30px #f3fffd , 0 0 40px #f3fffd , 0 0 50px #f3fffd , 0 0 60px #f3fffd , 0 0 70px #f3fffd ;}
to {text-shadow: 0 0 20px #f3fffd, 0 0 30px #f3fffd , 0 0 40px #f3fffd , 0 0 50px #016098 , 0 0 60px #f3fffd , 0 0 70px #f3fffd , 0 0 80px #f3fffd ;}
}
.bounce {    animation: bounce 965 1.6s ease infinite;    transform-origin: 50% 50%;}
@keyframes bounce {
0% {transform: translateY(0);} 
12.5% {transform: translateY(0);}
25% {transform: translateY(0);}
50% {transform: translateY(-15px);}
62.5% {transform: translateY(0);}
75% {transform: translateY(-15px);}
100% {transform: translateY(0);}
}
/* Send Enquire */
.enquiry {    position: fixed;    z-index: 1000;    bottom: 45px;    left: 25px;    height: 50px;    color: #fff;    font-size: 18px;    text-align: center;    text-decoration: none;   cursor: pointer;}
.enquiry i {    float: left;    z-index: 999;    position: absolute;    left: 0;    width: 50px;    height: 50px;    border-radius: 50%;    color: #fff;    font-size: 24px;    line-height: 50px;    text-align: center;    text-decoration: none;    cursor: pointer;  background: var(--Gradient);   transition: 0.5s;    box-shadow: var(--shadow);}
.enquiry strong {    background-color: #171b1e;    line-height: 28px;    color: #000;    padding: 10px 20px;    border-radius: 0 30px 30px 0;    height: 45px;    float: left;    font-size: 15px;    margin-top: 3px;    margin-left: 35px;   box-shadow: 2px 2px 6px rgba(0,0,0,0.4);}
.modal-header{background: #fffbf7; border-bottom: 1px solid #e1e1e1;}
.modal-body{background: #fffbf7;}
.modal-body input{height: 45px; background-color: transparent; border: none; color: #000; border-bottom: 1px solid #e1e1e1; margin-bottom: 10px; font-size: 14px;}
.modal-body select{height: 45px; background-color: transparent; border: none; color: #000; border-bottom: 1px solid #e1e1e1; margin-bottom: 10px; font-size: 14px;}
.modal-body select option{color: #000; font-size: 14px;}
.modal-body select:focus{outline: none;}
.modal-body textarea{height:100px; background-color: transparent; border: none; color: #000; border-bottom: 1px solid #e1e1e1; font-size: 14px;}
.modal-body input::placeholder{color: #000;}
.modal-body textarea::placeholder{color: #000;}
.modal-body input:focus{outline: none;}
.modal-body textarea:focus{outline: none;}
.modal-body button {    width: 100%;    border: none;    padding: 10px 0; background: var(--Gradient); border-radius: 50px;}
.modal-header span {    font-size: 25px; font-family: "ClashDisplay-Regular";}
.rotate-plate {    height: 150px;    overflow: hidden;}
/* .img-center {    padding-top: 15px;} */
img.set-img-1 {    position: absolute;    right: 0;    top: 0;}
img.set-img-2 {    position: absolute;    right: 0;    top: 0;}
.support-img img {    filter: grayscale(1) invert(0);}
header.fixed{width: 100%; top: 0px;  z-index: 999; position: fixed;background: rgba(0, 0, 0, 0.5);    backdrop-filter: blur(10px);    -webkit-backdrop-filter: blur(10px);    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);    border-bottom: 1px solid rgba(31, 31, 31, 0.5);    transition: background 0.3s ease;}
nav.mobile-menu {    display: none;}

.mobile-three-item {    text-align: center;    display: none;    position: fixed;    z-index: 999;    bottom: 0;    width: 100%;}
.mobile-three-item li {    display: inline-block;    margin-right: 0;    width: 32%;}
.mobile-three-item li:nth-child(1) {    background-color: #000;}
.mobile-three-item li:nth-child(2) {    background-color: #64b161;}
.mobile-three-item li:last-child {background: var(--Gradient);}
.mobile-three-item li a {    padding: 5px 0;    color: #fff;}
.mobile-btn-animation {    position: fixed;    left: 0;    bottom: 0;    width: 30%;    color: white;    text-align: center;    font-weight: bold;    padding-top: 10px;    padding-bottom: 10px;    margin-left: 2.5%;    z-index: 1000;    background-color: #000;}
.mobile-btn-animation a {    color: white;}
#mobile-call-container a {    width: 100%;    min-width: 100%;}
/* Product Item */
.product-btn a{font-size: 19px;    font-family: "ClashDisplay-Semibold";    width: 80%;    display: block;    margin: 0px auto;    line-height: 25px;    background: linear-gradient(114deg, #203748 3.47%, #000 20.38%, #9bc32e 83.28%);    background-clip: text;    -webkit-background-clip: text;    -webkit-text-fill-color: rgba(0, 0, 0, 0);}
.image-hover{overflow: hidden; position: relative; transition: 0.8s; border-radius: 50px;}
.image-hover img{overflow: hidden; position: relative; transition: 0.8s; border-radius: 50px;}
.image-hover img:hover{ transform: scale(1.1);}

.before-blue-gradient-1 { position: relative;}
.before-blue-gradient-1::before {    position: absolute;    content: '';    width: 300px;    height: 90vh;        background: linear-gradient(to left, rgba(206, 206, 206, 0) 0%, rgb(226, 226, 226) 100%);    left: 0px;    z-index: 9;    top: 0px;}
.before-blue-gradient-1::after {    position: absolute;    content: '';    width: 300px;    height: 90vh;        background: linear-gradient(to right, rgba(206, 206, 206, 0) 0%, rgb(226, 226, 226) 100%);    right: 0px;    z-index: 9;    top: -0px;}
.breadcumb{background: url(img/breadcumb.jpg) no-repeat; padding: 100px 0;     margin-top: -85px; clip-path: polygon(0 0, 100% 0, 100% 90%, 0% 100%); background-size: cover; background-attachment: fixed; background-position: 50% 50%;}
.inner_breadcumb{padding-top: 100px;}
.inner_breadcumb h1{font-size: 40px;}
.stretch-cover {         padding: 15px;        width: 40%;         margin: 0px auto;    background:linear-gradient(to left, #0070bbd0, #9bc32eb3);    border-radius: 30px;}

ul.stlyed-exporter li a {    background: var(--Gradient);    padding: 10px 30px; border-radius: 15px; }
ul.stlyed-exporter li {   width: 32%;}
.inner-states a{background-color: #000; display: block;  border-radius: 15px; }
.color-site a {    background: #0071bb;  border-radius: 15px;  display: block;    padding: 10px 30px; }
.skin-color a {    background: #9bc32e;   border-radius: 15px;   display: block;    padding: 10px 30px;}
.more-help {    background-color: #f9f5f2;    padding: 60px 0;}
.more-help .help-card {    padding: 16px;    min-height: 200px;    background-color: #fff;    text-align: center;     border-radius: 30px;}
.help-card span {    font-size: 20px;    font-weight: 600;    font-family: "ClashDisplay-Medium";    display: block;}
.help-card i {    font-size: 30px;    margin-bottom: 17px;    color:#0071bb;}
.help-card a {    font-size: 17px;}
.help-card p {    font-size: 17px;}
.map-side iframe{border-radius: 30px;}
form.contact-form-design input {    border:none;    height: 45px;    padding-left: 11px;    font-size: 14px; border-radius: 15px;}
form.contact-form-design input:focus{outline: none;}
form.contact-form-design textarea:focus{outline: none;}
form.contact-form-design select:focus{outline: none;}
form.contact-form-design select { border-radius: 15px;    border:none;   height: 45px;    padding-left: 11px;    font-size: 14px; color:#555;}
form.contact-form-design textarea {   border-radius: 40px; border:none;    height: 100px;    padding-left: 11px;    font-size: 14px;}
.reveal--top{background: var(--Gradient); border-radius: 50px;}
button#submit-btn {    background: #000;    padding: 10px 30px;    border: none;    border-radius: 50px;    color: #fff;}
.page-error span {    font-size: 25px;}
.page-error a {    background: var(--Gradient);    padding: 12px 25px;    transition: 0.5s; border-radius: 50px;}
.page-error a:hover{background-color: #000;}
.white-wrap .form { background: url(img/3.jpg) no-repeat; background-size: cover;  background-position: 50% 50%;  padding: 1px 20px 1px 20px;    position: relative;     border-radius: 25px;}
.img-side-details img {    width: 100%;    border-radius: 50px;    float: left;}
.img-side-details {    width: 40%;    float: left;    margin-right: 25px;}
p.related-heading {    background: var(--Gradient);    width: 100%;    display: block;    padding: 10px 15px;    font-size: 22px;    font-weight: 700;}
.related_img img {    width: 100%;    object-fit: contain;    height: 250px;    margin: 10px 0px;    border: 1px solid #f1f1f1;    padding: 2px;}
.read-btn a {    background: #000;    border-radius: 50px;    padding: 7px 15px;    color: #fff;}
.datails-content p{text-align: justify; }
.related_content p {    text-align: justify;    line-height: 25px;}
.inputBox input {   border-radius: 20px; height: 40px;    padding-left: 12px;    font-size: 14px;}
.inputBox textarea {   border-radius: 20px; height: 100px;    padding-left: 12px;    font-size: 14px; padding-top: 10px;}
.inputBox select{ border-radius: 20px; height: 40px;    padding-left: 12px;    font-size: 14px; width: 100%; color: #666; border: none;}
.inputBox select:focus{outline: none;}
.inputBox button{background-color: #000; border-radius: 50px; font-size: 18px; padding: 10px 0;}
.inputBox input:focus{outline: none;}
.inputBox textarea:focus{outline: none;}
/* Box */
.box{    background: #333;    border-radius: 50px;    text-align: center;    overflow: hidden;    position: relative;    transition: all 0.35s ease-in-out;}
.box:before,
.box:after{    content: "";        background: linear-gradient(to left, #0070bbd0, #9bc32eb3);    width: 100%;    height: 0;    position: absolute;    opacity: 0.3;   transition: all 0.4s ease-in-out;    z-index: 1;}
.box:before{    right: 0;    bottom: 0;}
.box:after{    top: 0;    left: 0;}
.box:hover:before,.box:hover:after{    width: 100%;    height: 100%;}
.box img{    width: 100%;    height: auto;    transform: scale(1.1) translateY(4%);    transition: all 0.35s ease-in-out;}
.box:hover img{     opacity: 0.3;    transform: scale(1.1) translateY(-4%);}
.box-content{    color: #fff;    width: 100%;    opacity: 0;    transform: translateX(-50%) translateY(-50%);    position: absolute;    top: 50%;    left: 50%;    z-index: 2;    transition: all 0.25s ease 0s;}
.box:hover .box-content{ opacity: 1; }
.box .title{    font-size: 22px;    font-weight: 600;    text-transform: uppercase;    margin: 0;}
.box .post{    font-size: 25px;    font-weight: 300;    text-transform: capitalize;    margin: 0 0 10px;    display: block;}
.box .icon{    padding: 0;    margin: 0;    list-style: none;}
.box .icon li{    margin: 0 3px;    display: inline-block;}
.box .icon li a{    color: #0674b5;    background: #fff;    font-size: 14px;    line-height: 29px;    width: 32px;    height: 32px;    border: 3px solid transparent;    display: block;    position: relative;    transition: all 0.25s ease;}
.box .icon li a:hover{     color: #fff;    background: #000;    border: 3px solid #fff;    text-shadow: 3px 3px 3px rgba(0,0,0,0.4); }
.box .icon li  a i{line-height:inherit;}
@media only screen and (max-width:990px){
.box{ margin: 0 0 30px; }
}
.box-content span{font-family: "ClashDisplay-Medium"; padding-left: 15px; padding-right: 15px; line-height: 25px;}

.honor-pictture img{border-radius: 40px;}

.content-honor span{font-family: "ClashDisplay-Medium"; font-size: 30px;}

.name-type small{font-family: var(--Popines); font-size: 20px;}


.content-honor {position: relative;}
.content-honor  span{position: relative; font-size: 30px; font-family: "ClashDisplay-Medium"; }
.content-honor  span::after{ position: absolute;    content: '';    bottom: -5px;    background-color: #000;    width: 30%;    height: 1px;    left: 340px;}
.content-honor  span::before{ position: absolute;    content: '';    bottom: 0px;    background-color: #000;    width: 20%;    height: 1px;    left: 400px;    top: 44px;}

.honor-pictture img{filter: grayscale(0.9); transition: 0.5s;}
.honor-pictture img:hover{filter: grayscale(0);}
.director-message{background: url(img/footer-wave.png) repeat; background-position: 16% 50%;}