/* =============================== variables =======================================*/
:root {
  --mainColor: #eb008b;
  --secondColor: #0099cc;
}
/* =============================== variables =======================================*/

/* =============================== global=======================================*/
*,
::before,
::after {
  /*transition: 0.3s;*/
}
body {
  font-family: "cna";
}
html {
  scroll-behavior: smooth;
}
.container {
  width: 100%;
  max-width: 1200px;
}
fieldset,
legend {
  border: none !important;
}
/* =============================== global=======================================*/

/* =============================== header=======================================*/



.headerr{
width:100%;
position:fixed;
display: inline-block;
width: 100%;
background: #c6c6c6;
z-index:9;
}

.header_bottom{
  padding:18px 0px;
}

.header_bottom,
.header_top{
  border-bottom:1px solid #d5d5d5;
}


.header_menu ul li a{
  font-family:"Poppinsmed";
  font-size:16px;
  text-transform: uppercase;
  padding:0px 8px;

}

.header_menu ul li{
  margin-right:12px;
}

.titleslider{
  font-size: 43px;
  font-family: "FuturaPTMedium";
  width: 80%;
  position: relative;
  padding-bottom: 35px;
  margin-bottom: 40px;
}


.titleslider::before{
  content:" ";
  background: #2f2f2f;
  width:225px;
  height:1px;
  display: inline-block;
  position:absolute;
  bottom:0px;
  left:0px;
}


.bodyslider{
  font-family:"Poppinsreg";
  font-size:15px;
}


#block-views-block-slider-block-1 .slick-prev{
  position: absolute;
  top: 49%;
  left: 80px;
  border: 0px;
  background: url(../images/lefarriow.png) no-repeat;
  width: 35px;
  height: 35px;
  display: inline-block;
  font-size: 0px;
  transition: 0.2s;
}

#block-views-block-slider-block-1 .slick-next{
  position: absolute;
  top: 49%;
  right: 100px;
  border: 0px;
  background: url(../images/rightarrowws.png) no-repeat;
  width: 43px;
  height: 35px;
  display: inline-block;
  font-size: 0px;
  transition: 0.2s;
}

#block-views-block-slider-block-1 .slick-next:hover{
  right: 90px;
}


#block-views-block-slider-block-1 .slick-prev:hover{
  left: 60px;
}

#block-views-block-about-us-block-1 h2{
  text-align: center;
  margin:50px 0px;
  font-size:22px;
  font-family:"Poppinsmed";    text-transform: uppercase;
}
#block-views-block-about-us-block-1{
  font-family:"Poppinsreg";
  font-size:15px;
}


#block-views-block-about-us-block-1 p{
  text-align: center;
}
#block-views-block-about-us-block-1 .views-field-nothing a{
  font-size: 14px;
  font-family: "Poppinsmed";
  color: #2977a9;
  background: url(../images/arowaboutt.png) no-repeat 95%;
  padding-right: 39px;
 
  transition: 0.2s;
}

#block-views-block-about-us-block-1 .views-field-nothing a:hover{
  background: url(../images/arowaboutt.png) no-repeat 100%;
}


#block-views-block-about-us-block-1  .views-field-nothing{
  text-align: center;
}

#block-views-block-slider-block-1 .views-field-field-image{
  width:50%;
  float:left;
}


#block-views-block-slider-block-1 .views-field-nothing{
  width:40%;
  display:inline-block;
  margin-top:50px;
}


.header_menu{
  display: inline-block;
  margin-top: 20px;
  margin-left: 170px;
}
.header_top_left{
  width: 50%;
    float: left;
}

.header_top_right{
  display:inline-block;
  width:50%;
}


#block-views-block-brands-block-1 h2{
  margin:60px 0px;
  font-family:"Poppinsmed";
  text-align: center;    font-size: 22px;
}



#block-views-block-brands-block-1 .views-field-field-image{
  display: flex;
  justify-content: center;
  align-items: center;
  height: 90px;
}

#block-views-block-brands-block-1 .views-field-field-image img{
  max-width:110px;
  height:auto;
}


#block-socialmedia-2 li{
  margin-right:10px;
}


#block-views-block-brands-block-1 .slick-prev{
  position: absolute;
  top: 59%;
  left: -20px;
  border: 0px;
  background: url(../images/lefftt2.png) no-repeat;
  width: 35px;
  height: 68px;
  display: inline-block;
  font-size: 0px;
}

#block-views-block-brands-block-1{
  position:relative;
  margin-bottom:90px;
}

#block-views-block-brands-block-1 .slick-next{
  position: absolute;
  top: 59%;
  right: -20px;
  border: 0px;
  background: url(../images/leftttttt.png) no-repeat;
  width: 35px;
  height: 68px;
  display: inline-block;
  font-size: 0px;
}


#block-sitebranding{
  float:left;
}

.slide__caption{
  padding:0px;
}

#block-views-block-slider-block-1 .slide__description{
  padding-top: 220px;
  padding-left: 100px;
}


.phonee{
  background: url(../images/phonee.png) no-repeat left;
  font-size:13px;
  padding-left:40px;
  font-family:"Poppinsreg";
  padding-right:14px;
  padding-bottom: 8px;
  padding-top: 11px;
}

.location{
  background: url(../images/locationnnn.png) no-repeat left;
  font-size:13px;
  padding-left:40px;
  font-family:"Poppinsreg";
  padding-right:14px;
  margin-left:14px;
  padding-bottom: 8px;
  padding-top: 11px;
}

.slider{
  display:inline-block;
  width:100%;
  background: #c6c6c6;
}

#block-socialmedia{
  text-align: right;
  margin-top:9px;
}


#block-socialmedia ul li{
  margin-left:10px;
}



.header_menu ul li a{
  font-family:"Poppinsmed";
  font-size:16px;
  text-transform: uppercase;
  padding:0px 8px;
  position:relative;
  z-index: 999;
}


.header_menu ul li a::before {
    content: '';
    background: #1175bc;
    display: block;
    position: absolute;
    bottom: 0px;
    left: 0;
    width: 0;
    height: 12px;
    transition: all 0.3s ease-in-out;
    z-index: -9;
}

.header_menu ul li a.is-active::before,
.header_menu ul li:hover a::before  {
   width: 100%;
 }


 #block-contactheader a:hover{
  color:#1175bc;
 }

/* =============================== header=======================================*/

/* ================================ slider ================================= */


.findus h2,
.contactus h2,
.footer_menu h2{
  font-family:"Poppinsmed";
  font-size:22px;
  color:#302e2f;
  margin:0px;
  margin-bottom:30px;
}
.findus {
  width: 50%;
  float: left;
}

.contactus {
  float: left;
  width: 25%;
  padding-left: 100px;
}

.footer_menu {
  display: inline-block;
    width: 25%;
    padding-left: 171px;
}

footer a{
  font-family:"Poppinsmed";
  font-size:15px;
}

footer{
  font-family:"Poppinsmed";
  font-size:15px;
  color:#302e2f;
  padding-top:45px; 
}

#block-mainmenu-2 li{
  width:100%;
  margin-bottom:25px;
}


#block-copyright p{
  text-align: center;
  font-family: "PoppinsLight";
  padding: 17px 0px;
  background: #c6c6c6;
  color: #404040;
  font-size: 14px;
  margin: 0px;
  margin-top: 25px;
}


#block-copyright p a{
  color: #1d7abd;
  font-size:14px; 
   font-family:"PoppinsLight";

}
footer a:hover{
  color: #00327b;
}
#block-copyright p a:hover{
   color:#404040;
}

.inner-space .headerr{
  background: #fff;
  position:relative;
}


#block-socialmedia li img 
{


  transition: transform .7s ease-in-out;
}
#block-socialmedia li img:hover {
  transform: rotate(360deg);
}

.inner{
  position:relative;

}


.title_bread{
  position:absolute;
  top:73px;
  width:100%;
  text-align: center;  
  font-family:"Poppinsmed";
  font-size:22px;
  color:#302e2f;
}


#block-pagetitle h1{
  margin:0px; font-size:22px;
  color:#302e2f;
  text-transform: uppercase;
  margin-bottom:15px;
}



#block-zamzam-content{
  padding:0px 100px;
  font-family:"Poppinsreg";
  font-size:14px;
}

.page-node-aboutus #block-zamzam-content .views-row:nth-child(odd) .views-field-field-image{
  float:left;
  width: 47%;
  margin-right: 4%;
}


.page-node-aboutus #block-zamzam-content .views-row:nth-child(even) .views-field-field-image{
  float:right;
  width: 48%;
  margin-left: 2%;
}

.abouttitle{
font-size:21px;
font-family:"Poppinsmed";
color:#302e2f;
text-transform: capitalize;
margin-bottom:23px;
}

.aboutbody{
  color:#646464;
}
.page-node-aboutus #block-zamzam-content .views-row:nth-child(even) .views-field-nothing{
  display:inline-block;
  width: 48%;
  margin-right: 2%;
  height:306px;
    display: flex;
  justify-content: center;
  align-items: center;
}
.page-node-aboutus #block-zamzam-content .views-row:nth-child(odd) .views-field-nothing{
  display:inline-block;
  width: 48%;
  margin-left: 2%;
  display: flex;
  justify-content: center;
  align-items: center;  height:306px;
}

.page-node-aboutus #block-zamzam-content .views-row{
display:inline-block;
width:100%;
margin:15px 0px;
}


.page-node-aboutus #block-zamzam-content .views-row p{
  text-align: justify;
}


.row1{

}

.page-node-product-categories #block-zamzam-content .row2{
  display:inline-block;
  width:65%;
}
.page-node-product-categories #block-zamzam-content .row11,
.page-node-product-categories #block-zamzam-content .row8,
.page-node-product-categories #block-zamzam-content .row9,
.page-node-product-categories #block-zamzam-content .row6,
.page-node-product-categories #block-zamzam-content .row5,
.page-node-product-categories #block-zamzam-content .row3{
  display:inline-block;
  width:65%;
}

.page-node-product-categories #block-zamzam-content .views-row:first-child{
  float:left;
  width:31%;
  margin-right:35px;
}


.page-node-product-categories #block-zamzam-content .views-row{
  position:relative;
  margin-bottom:30px;
}
.page-node-product-categories #block-zamzam-content .views-row .views-field-name{
  font-size:17px;
  font-family:"Poppinsmed";
  position:absolute;
  top:50%;
  width:100%;
  text-align: center;
  transition: 0.2s;
}


.page-node-product-categories #block-zamzam-content .views-row .views-field-name .field-content{
  background: #ffffffc9;
  padding: 20px 60px;
  transition: 0.2s;
}

.page-node-product-categories #block-zamzam-content .views-row:hover .views-field-name .field-content{
  width: 100%;
  height: 100%;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}


.page-node-product-categories #block-zamzam-content .views-row:hover .views-field-name{
  top: 0;
  width: 100%;
  text-align: center;
  left: 0px;
  height: 100%;
}


.page-node-product-categories #block-zamzam-content .views-row:hover .views-field-name a{
  font-size: 18px;
  color: #1475ba;
}

.page-node-product-categories #block-zamzam-content .views-row .views-field-name a{
  font-size: 17px;
  background-position: center;
}


.page-node-product-categories #block-zamzam-content .views-row:hover .views-field-name a{
  background: url(../images/zoom.png) no-repeat bottom;
  padding-bottom: 44px;
}
#block-views-block-inner-products-block-1 .views-field-body{
  font-size:14px;font-family:"Poppinsreg";
  border-bottom:1px solid #cdcdcd;
  padding-bottom:25px;
  margin-top:25px;
  margin-bottom:25px;
  width: 50%;
  display: inline-block;
}

#block-views-block-inner-products-block-1 .views-field-field-description,
#block-views-block-inner-products-block-1 .views-field-field-category{
  font-size:14px;font-family:"Poppinsreg";
  font-size:14px;
  
}




.page-node-product-categories #block-zamzam-content .views-row .views-field-nothing{
  display:inline-block;
  width:100%;
  height:100%;
  position:absolute;
  top:0px;
}


.page-node-product-categories #block-zamzam-content .views-row .views-field-nothing a{
  display: inline-block;
  width: 100%;
  height: 100%;
  font-size:0px;
}




.page-node-product-categories #block-zamzam-content .views-row:nth-child(10),
.page-node-product-categories #block-zamzam-content .row7,
.page-node-product-categories #block-zamzam-content .row4{
  float:left;
  width:31%;
  clear:both;
  margin-right:35px;
}


.page-node-products #block-zamzam-content .item-list ul{
  position: relative;
  display: flex;
  padding: 40px 10px;
  justify-content: center;
  gap: 18px;
  flex-wrap: wrap;
}

.page-node-products #block-zamzam-content .item-list ul li{
  position: relative;
  width: 25%;
}

.page-node-products #block-zamzam-content .item-list ul li .views-field-field-image img{
  width:100%;
  height:auto;
}


.page-node-products #block-zamzam-content .item-list ul li .views-field-field-image{
  height:250px;
  overflow:hidden;
}



.page-node-products #block-zamzam-content .item-list ul li .views-field-title{
  font-size: 17px;
  font-family: "Poppinsmed";
  position: absolute;
  top: 50%;
  width: 100%;
  text-align: center;
}


.page-node-products #block-zamzam-content .item-list ul li .views-field-title .field-content {
  background: #ffffffc9;
  padding: 11px 20px;
  display: inline-block;
  width: 74%;

}



#block-views-block-product-categories-block-1 .views-field-field-image{
  width:50%;
  float:left;
}

#block-views-block-product-categories-block-1 .views-field-nothing{
  display: inline-block;
  width: 50%;
  background: url(../images/bkkkk.png) no-repeat;
  height: 318px;
}

#block-views-block-product-categories-block-1 .views-field-field-image img{
  width: 100%;
  height: 318px;
  object-fit: cover;
}


#block-views-block-product-categories-block-1 .views-field-nothing .field-content{
  display: flex;
  align-items: center;
  height: 318px;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  padding: 0px 43px;
}


#block-views-block-product-categories-block-1 .views-field-nothing .field-content li{
  width:100%;

}


#block-views-block-product-categories-block-1 .views-field-nothing .field-content li.viewtitle{
  font-size:23px;	
  font-family:"Poppinsreg";
  margin-bottom:27px;
}


#block-views-block-product-categories-block-1 .views-field-nothing .field-content li.viewpeoducts a{
  font-family: "Poppinsmed";
  font-size: 16px;
  padding: 16px 58px 16px 20px;
  background: url(../images/leeeeeee.png) no-repeat 86%;
  display: inline-block;
  border: 1px solid #ffffffad;
}



#block-views-block-product-categories-block-1 .views-field-nothing .field-content li.viewpeoducts a:hover{
  background: #003381 url(../images/leeeeeee.png) no-repeat 90%;
  color: #fff;
}



.products .container{
  width: 100%;
  max-width: 100%;
  padding: 0px;
}


#block-contactus-2 h2,
#block-location h2,
form.webform-submission-contact-add-form .js-form-type-processed-text p{
  font-family: "Poppinsmed";
  font-size: 21px;
  margin-bottom:40px;
  margin-top:0px !important;
}

#block-contactus ul li,
#block-contactus-2 ul li{
  margin-bottom:24px;
  width:100%;
  font-size:15px;  
  font-family: "Poppinsmed";
}

#block-contactus ul li a,
#block-contactus-2 ul li a{
  font-size:15px;  
  font-family: "Poppinsmed";
  color:#b6b2b2;
}


#block-contactus ul li a:hover,
#block-contactus-2 ul li a:hover{
  color:#000;
}


.page-node-contactus #block-zamzam-content{
  float: left;
  width: 49%;
  padding-right: 0px;
  margin-right: 2%;
}


.page-node-contactus #block-zamzam-content form.webform-submission-contact-form .form-item label{
  display:none;
}

.page-node-contactus #block-zamzam-content form.webform-submission-contact-form .form-item textarea,
.page-node-contactus #block-zamzam-content form.webform-submission-contact-form .form-item input{
  border: 1px solid #f6f6f6;
  border-radius: 3px;
  padding: 25px 20px;
  margin-bottom: 25px;
  width:100%;
}

.page-node-contactus #block-zamzam-content form.webform-submission-contact-form .form-item.js-form-type-email{
  float: left;
  width: 48%;
  margin-right: 2%;
}
.page-node-contactus #block-zamzam-content form.webform-submission-contact-form .form-item.form-item-subject{
  display:inline-block;
  width:48%;
  margin-left: 2%;
}

.page-node-contactus #block-zamzam-content form.webform-submission-contact-form .form-actions input{
  background: #1175bc;
  color: #fff;
  border: 0px;
  padding: 15px 90px;
  text-transform: capitalize;
}

#block-location{
  float:left;
  width:24%;
}


#block-contactus-2{
  display: inline-block;
  width:24%;
}

footer{
  padding-top: 40px;
  box-shadow: 2px 0px 13px #cdcdcd7d;
  padding-top: 45px !important;
}


a{
  outline:none !important;
}

.inner-page-content-main{
  padding: 40px 0px;
  min-height:500px;
  height:auto;
}


#block-breadcrumbs{
  font-size: 14px;
  color: #1175bc;
}


#block-breadcrumbs a{
  font-size: 14px;
  color: #1175bc;
}


#block-breadcrumbs a::after{
  content:" - ";
  font-size: 14px;
  color: #1175bc;
}


#block-views-block-product-categories-block-1 .slick__arrow{
  display:none;
}

.products{
  margin-top:60px;
}







#block-views-block-inner-products-block-1{
  padding:0px 100px;
}


#block-views-block-inner-products-block-1 .views-field-field-images{
  width: 43%;
  float: left;
  border: 1px solid #cdcdcd;
  text-align: center;
  margin-right: 2%;
}

#block-views-block-inner-products-block-1 .views-field-title{
  display: inline-block;
  font-size:18px;  
  font-family: "Poppinsmed";
  color:#000;
  width:50%;
}