/*
Template Name: Manufacturer
File: Layout CSS
Author: TemplatesOnWeb
Author URI: https://www.templateonweb.com/
Licence: <a href="https://www.templateonweb.com/license">Website Template Licence</a>
*/

h4 .text-white {
   color: #ffffff;
   text-shadow: 1px 1px 5px #000000;
}

/*********************center_home****************/
.center_hm {
   background: #000000b8;
   padding-top: 120px;
   padding-bottom: 120px;
}

.center_h {
   background-image: url(../img/1.jpg);
}

/*********************center_home_end****************/

/*********************serve****************/
#serve {
   padding-top: 40px;
   padding-bottom: 40px;

}

.serve_2 {
   margin-bottom: 20px;
}

.serve_2i {
   box-shadow: 0px 0px 7px 0px #848ab89e;
   padding: 30px 20px;
}

/*********************serve_end****************/

/*********************prod****************/
#prod {
   padding-top: 40px;
   padding-bottom: 40px;
   background: #feeded;
}


.prod_1i1 img {
   height: 320px;
}

.prod_1i2 {
   width: 100%;
   height: 100%;
   top: 0;
   padding-top: 130px;
}

.prod_1i3 {
   width: 100%;
   height: 100%;
   top: 0;
   background: #300300c2;
   padding-top: 50px;
   display: none;
}

.prod_1i:hover .prod_1i2 {
   display: none;
}

.prod_1i:hover .prod_1i3 {
   display: block;
}


/*********************prod_end****************/

/*********************spec****************/
#spec {
   padding-top: 40px;
   padding-bottom: 40px;
   background: #fae9e9;
}

.spec_1i span i {
   font-size: 60px;
   display: inline-block;
   margin-bottom: 15px;
}

.spec_1i {
   box-shadow: 0 0 10px #848ab89e;
   padding: 30px 15px;
}

/*********************spec_end****************/

/*********************news_h****************/
#news_h {
   padding-top: 40px;
   padding-bottom: 40px;
   background: #f6faff;
}

.news_h1li2 {
   width: 100%;
   height: 100%;
   top: 0;
   background: #000000b8;
   padding: 20px;
   padding-top: 220px;
}

.news_h1li3 {
   width: 100%;
   height: 100%;
   top: 0;
   background: #000000b8;
   padding: 20px;
   padding-top: 200px;
   display: none;
}

.news_h1li:hover .news_h1li2 {
   display: none;
}

.news_h1li:hover .news_h1li3 {
   display: block;
}

#news_h .carousel-indicators [data-bs-target] {
   background-color: #848ab8;
}

#news_h .carousel-indicators {
   bottom: -60px;
}

.news_h1r1i {
   background: #fff;
   padding: 30px 20px;
   border-radius: 3px;
}

.news_h1r1i1 img {
   border-radius: 50%;
   float: left;
   margin-right: 15px;
}

/*********************news_h_end****************/

@media screen and (max-width : 767px) {
   .center_h1 h1 {
      font-size: 40px !important;
   }

   .center_h1 br {
      display: none;
   }

   .center_h1 .button {
      padding: 12px 12px 11px 12px;
   }

   .center_h1 .button_1 {
      padding: 12px 12px 11px 12px;
   }

   .center_hm {
      padding-top: 60px;
      padding-bottom: 60px;
   }

   .serve_2i {
      margin-bottom: 10px;
   }

   .prod_1i {
      margin-bottom: 10px;
   }

   .prod_1i1 img {
      height: 280px;
   }

   .spec_1i {
      margin-bottom: 10px;
   }

   .news_h1li1 img {
      height: 280px;
   }

   .news_h1li {
      margin-bottom: 10px;
   }

   .news_h1li3 {
      padding: 20px;
      padding-top: 180px;
   }

   .news_h1li2 {
      padding: 20px;
      padding-top: 200px;
   }

   #news_h {
      padding-bottom: 80px;
   }
}

@media (min-width:768px) and (max-width:991px) {
   .center_h1 br {
      display: none;
   }

   .prod_1i1 img {
      height: 280px;
   }

   .prod_1i3 br {
      display: none;
   }

   .news_h1li1 img {
      height: 280px;
   }

   .news_h1li3 {
      padding: 20px;
      padding-top: 180px;
   }

   .news_h1li2 {
      padding: 20px;
      padding-top: 200px;
   }

   #news_h {
      padding-bottom: 80px;
   }
}

@media (min-width:992px) and (max-width:1200px) {
   .prod_1i1 img {
      height: 280px;
   }

   .news_h1li1 img {
      height: 280px;
   }

   .news_h1li3 {
      padding: 20px;
      padding-top: 180px;
   }

   .news_h1li2 {
      padding: 20px;
      padding-top: 200px;
   }
}

.carousel-caption p {
   color: #ffffff;
   text-shadow: 1px 1px 4px black;
}

.carousel-caption h2 {
   color: #ffffff;
   text-shadow: 1px 1px 4px black;
}