@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900&display=swap');
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800;900&display=swap');


.wchat{
position: fixed;
right: -100px;
bottom: 10px;
z-index: 999;
}

.wchat img{
width: 50%;
}

.top{
font-family: 'Poppins', sans-serif;
background:#21682e;
font-size: 13px;
}

.top-left ul{
  margin: 0px;
color:#fff;
padding-left: 0px;
}

.top-left ul li{
color:#fff;
display: inline-block;
margin-right: 4px;
  margin-top: 8px;
}

.top-left ul li:nth-child(1){
  padding-right: 6px;
  border-right: 1px solid #2e9140;
}

.top-left ul li span{
color:#b0cb1f;  
margin-right: 5px;
}

.top-left ul li a{
 color:#fff;
 text-decoration: none; 
 -webkit-transition: all 300ms ease;
-moz-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
transition: all 300ms ease;
}


.top-right ul{
padding-left: 0px;
margin: 0px;
float: right;
border-right: 1px solid #2d8a3e;
}

.top-right ul li{
float: left;
list-style: none;
color: #fff;
}

.top-right ul li span{
 color: #b0cb1f;
margin-right: 4px; 
}

.top-right ul li:nth-child(1){
  padding-right: 8px;
  padding-top: 8px;
}

.top-right ul li a
{
color:#98b015;
text-decoration: none;
display: block;
line-height: 35px;
padding: 0 8px;
border-left: 1px solid #2d8a3e;
-webkit-transition: all 300ms ease;
-moz-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
transition: all 300ms ease;
}

.top-right ul li a:hover{
  color: #faf7d4;
}

.top-right ul li a span
{
color:#1a2845;
margin-right: 5px;
}



header{
padding: 15px 0px;
box-shadow: 0 2px 4px rgba(34, 34, 34, 0.58);
position: relative;
z-index: 99;
background: url(../images/header_bg.png) 400px 0px;
}


.logo{
padding-top: 4px;  
}

.logo img{
width: 100%;
}

.navbar-inverse {
    background:none;
    border: none;
    margin: 0;
}


.navigation{
background: #222;
}

.nav > li > a {
font-family: 'Poppins', sans-serif;
text-transform: uppercase;
font-weight: 600;
    opacity: 1;
     transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    padding: 15px 18px;
  }

  .navbar-inverse{
    background:none;
    border:none;
    margin-bottom:0px;
    margin-top: 5px;
}

.navbar .nav > li::before {
    bottom: 40px;
}

.navbar .nav > li:hover::before{
    opacity: 1;
}

.navbar .nav > li::before {
    position: absolute;
    content: '';
    left: 0px;
    bottom: 0px;
    width: 100%;
    height: 2px;
    opacity: 0;
    background-color:#f42225;
    transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
}


.navbar-inverse .navbar-nav > li > a {
    color: #21682e;
}

.navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:focus, .navbar-inverse .navbar-nav > .active > a:hover {
    color:#f42225;
    background:none;
}

.navbar-inverse .navbar-nav > .active::before{
    opacity: 1;
}

.navbar-inverse .navbar-nav > .active::after{
    opacity: 1;
}



.navbar-inverse .navbar-nav > li > a:focus, .navbar-inverse .navbar-nav > li > a:hover {
    color: #f42225;
    background:none;
}

.navbar .nav > li::after {
 position: absolute;
    content: '';
    left: 50%;
    bottom: 0px;
    margin-left: -6px;
    opacity: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 8px solid #f42225;
    transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
}

.navbar .nav > li:hover::after {
    opacity: 1;
}

.navbar-nav {
    float: right;
}

.dropdown-menu > li > a {
font-family: 'Poppins', sans-serif;
padding: 8px 20px;
font-weight: 600;
}

.dropdown-menu > li > a:hover {
color: #fff;
text-decoration: none;
background-color: #f42225;
}

.navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:focus, .navbar-inverse .navbar-nav > .open > a:hover {
    color: #f42225;
    background: none;
}



.carousel-caption p
{
font-family: 'Open Sans', sans-serif;
line-height: 26px;
}

.first-banner{
left: 12%;
top: 18%;
right: 58%;
text-align: left;
z-index: 999;
background: #222;
padding: 15px;
bottom: 18%;
background: rgba(33, 104, 46, 0.92);
}


.first-banner h2{
font-family: 'Poppins', sans-serif;
position: relative;
color: #fff;
margin-top: 0px;
}

.first-banner h2::before{
content: "";
position: absolute;
left: 0;
bottom: -7px;
height: 2px;
width: 50px;
background-color:#fff;
}


.first-banner p{
color: #e3e3e3;
}

.first-banner .btn {
text-shadow: none;
background:transparent;
color: #b0cb1f;
border: 2px solid #b0cb1f;
text-transform: uppercase;
font-family: 'Roboto', sans-serif;
transition: all 0.5s ease-in-out 0s;
-webkit-transition: all 0.5s ease-in-out 0s;
}

.first-banner .btn:hover{
  background:#b0cb1f;
  color: #fff;
}


.third-banner{
    left: 12%;
    top: 26%;
    right: 55%;
    text-align: left;
    z-index: 999;
    padding: 15px;
    bottom: 26%;
}

.third-banner h2{
font-family: 'Poppins', sans-serif;
position: relative;
color: #fff;
margin-top: 0px;
}

.third-banner h2::before{
content: "";
position: absolute;
left: 0;
bottom: -7px;
height: 2px;
width: 50px;
background-color:#fff;
}

.third-banner p {
  color: #e3e3e3;
}

.third-banner .btn{
text-shadow: none;
background: transparent;
color: #b0cb1f;
border: 2px solid #b0cb1f;
text-transform: uppercase;
font-family: 'Roboto', sans-serif;
transition: all 0.5s ease-in-out 0s;
-webkit-transition: all 0.5s ease-in-out 0s;
}

.third-banner .btn:hover{
background: #b0cb1f;
color: #fff;
}


.carousel .item.active .animated1 {
   -webkit-animation: fadeInRight 1s ease-in-out 500ms both;
animation: fadeInRight 1s ease-in-out 500ms both;
        
}

.carousel .item.active .animated2 {
   -webkit-animation: fadeInLeft 1s ease-in-out 500ms both;
animation: fadeInLeft 1s ease-in-out 500ms both;
        
}

.carousel .item.active .animated3 {
   -webkit-animation: fadeInDown 1s ease-in-out 500ms both;
animation: fadeInDown 1s ease-in-out 500ms both;    
}

.carousel .item.active .animated4 {
   -webkit-animation: fadeInUp 1s ease-in-out 500ms both;
animation: fadeInUp 1s ease-in-out 500ms both;    
}

.carousel-caption{
    transition: opacity 100ms;
    text-shadow: none;
}

.carousel .item img{
  width: 100%;
}

.carousel-inner > .item .carousel-caption {
z-index: 0;
opacity: 0;
-webkit-transition: opacity 500ms;
-moz-transition: opacity 500ms;
-o-transition: opacity 500ms;
transition: opacity 500ms;
}

.carousel .item.active .carousel-caption {
    z-index: 0;
    opacity: 1;
    -webkit-transition: opacity 100ms;
    -moz-transition: opacity 100ms;
    -o-transition: opacity 100ms;
    transition: opacity 100ms;  
}


.carousel-fade .carousel-inner .item {
  -webkit-transition-property: opacity;
  transition-property: opacity;
}
.carousel-fade .carousel-inner .item,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  opacity: 0;
}
.carousel-fade .carousel-inner .active,
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}
.carousel-fade .carousel-inner .next,
.carousel-fade .carousel-inner .prev,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}
.carousel-fade .carousel-control {
  z-index: 2;
}

.carousel-control.right {
    background: none;
}

.carousel-control.left {
    background: none;
}

.sec-1{
padding: 40px 0px 20px;
position: relative;
overflow: hidden;
}

.sec-1::after{
    content: '';
    position: absolute;
    bottom: -75px;
    left: 76%;
    width: 570px;
    height: 510px;
    background: url(../images/crop-right.png) center top no-repeat;
    z-index: 1;
    transform: rotate(30deg);
}

.sec-1::before {
    content: '';
    position: absolute;
    bottom: -75px;
    right: 76%;
    width: 570px;
    height: 510px;
    background: url(../images/crop-left.png) center top no-repeat;
    z-index: 1;
    transform: rotate(-30deg);
}

.sec-1-left img{
width: 50px;
}

.sec-1-left h1{
font-family: 'Poppins', sans-serif;
font-weight: 700;
margin-top: 0px;
position: relative;
color: #21682e;
}

.sec-1-left h1::before{
position: absolute;
content: '';
left: 0px;
bottom: -6px;
width: 40px;
height: 4px;
background: #b0cb1f;
}

.sec-1-left p{
  font-family: 'Open Sans', sans-serif;
  line-height: 26px;
  color: #777;
}

.sec-1-left a{
font-family: 'Roboto', sans-serif;
text-transform: uppercase;
background: #b0cb1f;
padding: 12px 30px;
display: inline-block;
color: #fff;
text-decoration: none;
vertical-align: middle;
-webkit-transform: perspective(1px) translateZ(0);
transform: perspective(1px) translateZ(0);
box-shadow: 0 0 1px rgba(0, 0, 0, 0);
position: relative;
-webkit-transition-property: color;
transition-property: color;
-webkit-transition-duration: 0.5s;
transition-duration: 0.5s;
}

.sec-1-left a::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #21682E;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

.sec-1-left a:hover::before{
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
    transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
}

.sec-1-right-box{
  position: relative;
  overflow: hidden;
  margin-bottom: 20px;
  z-index: 2;
}

.sec-1-right-box h4{
font-family: 'Roboto', sans-serif;
font-weight: 600;
font-size: 20px;
text-transform: uppercase;
position: absolute;
width: 100%;
opacity: 1;
bottom: 25px;
background:rgba(176, 203, 31, 0.85);;
padding: 10px;
text-align: center;
color: #fff;
transition: .4s;
-webkit-transition: .4s;
}

.sec-1-right-box:hover h4{
opacity: 0;
}

.sec-1-matter{
position: absolute;
content: '';
bottom: 0px;
left: 0px;
height: 0%;
width: 100%;
background:rgba(33, 104, 46, 0.85);
opacity: 0; 
padding: 15px;
-webkit-transition: .5s ease-out;
transition: .5s ease-out;

}

.sec-1-matter h5
{
  font-size: 18px;
color: #fff;
font-family: 'Poppins', sans-serif;
position: relative;
}

.sec-1-matter h5::before{
  position: absolute;
content: '';
left: 0px;
bottom: -5px;
width: 30px;
height: 2px;
background: #fff;
}

.sec-1-matter p{
  color: #f1f1f1 !important;
line-height: 1.4 !important;
font-family: 'Open Sans', sans-serif;
}

.sec-1-matter a{
  text-decoration: none;
}

.sec-1-matter .more{
font-family: 'Roboto', sans-serif;
background: #b0cb1f;
padding: 8px 15px;
display: inline-block;
border-radius: 4px;
color: #fff;  
}

.sec-1-right-box:hover .sec-1-matter{
opacity: 1;

visibility: visible;
-webkit-transition: .5s ease-in-out;
transition: .5s ease-in-out;
height: 100%;
}

.sec-2
{
  padding: 40px 0px;
  background:url(../images/sec-2-bg.png);
  background-size: cover;
  position: relative;
  overflow: hidden;
}

.sec-2 h1 {
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    margin-top: 0px;
    position: relative;
    color: #f42225;
}

.sec-2 h1 span{
  font-weight: 500;
  display: block;
  color: #21682e;
}

.sec-2 h1::after{
position: absolute;
content: '';
left: 0px;
bottom: -7px;
height: 3px;
width: 40px;
background: #21682e;
}

.sec-2 h1::before{
position: absolute;
content: '';
left: 46px;
bottom: -7px;
width: 15px;
height: 3px;
background: #f42225;
}

.sec-2 p {
    font-family: 'Open Sans', sans-serif;
    line-height: 26px;
    color: #555;
}

.sec-2 a{
font-family: 'Roboto', sans-serif;
text-transform: uppercase;
background: #21682E;
padding: 12px 30px;
display: inline-block;
color: #fff;
text-decoration: none;
vertical-align: middle;
-webkit-transform: perspective(1px) translateZ(0);
transform: perspective(1px) translateZ(0);
box-shadow: 0 0 1px rgba(0, 0, 0, 0);
position: relative;
-webkit-transition-property: color;
transition-property: color;
-webkit-transition-duration: 0.5s;
transition-duration: 0.5s;
}

.sec-2 a::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background:#b0cb1f;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

.sec-2 a:hover::before{
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
    transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
}


.sec-3 {
    background: url(../images/sec-3-bg.jpg) fixed;
    background-position: center bottom;
    padding: 50px 0px;
}

.why-top{
  text-align: center;
}

.why-top h1
{
  font-family: 'Poppins', sans-serif;
font-weight: 500;
margin: 0px;
color: #fff;
}

.why-top h1 span{
  color: #f42225;
}

.why-box
{
margin-top: 20px;
}

.why-box span{
float: left;
border: 1px solid #f42225;
height: 50px;
width: 50px;
text-align: center;
line-height: 50px;
color: #f42225;
font-size: 18px;
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
transition: .4s;
-webkit-transition: .4s;
margin-top: 10px;
}

.why-box span::after {
    content: '';
    position: absolute;
    width: 40px;
    height: 40px;
    opacity: 0;
    border: 1px dashed #fff;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: .4s;
-webkit-transition: .4s;
    }

.why-box span i {
    -ms-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}


.why-box .why-detail {
    margin-left: 80px;
}

.why-box .why-detail h4 {
   font-family: 'Roboto', sans-serif;
    font-weight: 600;
    margin-bottom: 5px;
    margin-top: 0px;
    color: #fff;
}

.why-box .why-detail p {
    font-family: 'Open Sans', sans-serif;
    color: #f1f1f1;
    line-height: 26px;
}

.why-box:hover span{
  background:#f42225;
  color: #fff;
}

.why-box:hover span::after{
opacity: 1;
}


.sec-4 {
    padding: 30px 0px;
    background: #f42225 url(../images/sec-4-bg.png) center;
}

.counter {
    text-align: center;
}

.counter h3{
font-family: 'Poppins', sans-serif;
font-weight: 600;
position: relative;
margin-bottom: 25px;
color: #fff;
font-size: 30px;
}

.counter p{
  font-family: 'Open Sans', sans-serif;
  color:#f9f9f9;
font-size: 15px;
}

.counter h3::before {
content: "";
position: absolute;
background: #f1f1f1;
width: 45px;
height: 2px;
bottom: -12px;
left: 105px;
}

.counter .add::after {
    content: "\f067";
    position: absolute;
    display: inline-block;
    font-family: FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    font-size: 18px;
    -webkit-font-smoothing: antialiased;
    top: -7px;
    font-weight: 400;
}

.sec-5{
  padding: 40px 0px;
}

.sec-5-title h2{
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 28px;
  color: #1d5727;
  position: relative;
  margin-top: 0px;
}

.sec-5-title h2 span{
  color: #f42225;
}

.sec-5-title h2::before {
    position: absolute;
    content: '';
    left: 46px;
    bottom: -6px;
    width: 15px;
    height: 3px;
    background:#f42225;
}

.sec-5-title h2::after {
    position: absolute;
    content: '';
    left: 0px;
    bottom: -6px;
    height: 3px;
    width: 40px;
    background: #21682e;
}

.slider {
margin:45px 0px 0px;
}

.slick-slide {
margin: 0px 10px;
}

.slick-pre{
position: absolute;
right: 40px;
top: -46px;
color: #fff;
z-index: 99;
cursor: pointer;
padding: 10px 12px;
background: #1d5727;
opacity: 1;
margin-right: 10px;
}

.slick-nxt {
position: absolute;
right: 10px;
z-index: 99;
top: -46px;
color: #fff;
cursor: pointer;
padding: 10px 12px;
background:#1d5727;
opacity: 1;
}

.featured-pro{
  position: relative;
  margin:20px; 
  transition: .4s;
-webkit-transition: .4s;
}


.featured-pro h4{
font-family: 'Roboto', sans-serif;
position: absolute;
left: -10px;
bottom: 12px;
display: inline-block;
background: #b0cb1f;
padding: 7px 12px;
color: #fff;
margin: 0px;
transition: .4s;
-webkit-transition: .4s;
}

.featured-pro h4::before {
    border-right: 10px solid #4f5b0d;
    border-top: 10px solid transparent;
    content: "";
    display: block;
    height: 0;
    left: 0px;
    position: absolute;
    top: -10px;
    width: 7px;
  }

.featured-pro:hover{
box-shadow: 0 2px 4px #222;
}

/*about page*/

.about-banner{
  padding: 70px 0px;
  background: url(../images/about-banner.jpg);
}
.inner-banner-title{
border-left: 4px solid #b0cb1f;
padding-left: 15px;
}

.inner-banner-title h1{
font-family: 'Poppins', sans-serif;
text-transform: uppercase;
font-weight: 700;
margin-top: 0px;
font-size: 32px;
color: #fff;
}

.inner-banner-title ul{
padding-left: 0px;
margin-bottom: 0px;
}

.inner-banner-title ul li{
display: inline-block;
font-family: 'Roboto', sans-serif;
color: #f9f9f9;
}

.inner-banner-title ul li a{
  color: #b0cb1f;
  text-decoration: none;
}

.inner-matter{
padding: 40px 0px;
}

.in-title h2{
font-family: 'Roboto', sans-serif;
color:#21682e;
position: relative;
margin-top: 0px;
font-size: 26px;
font-weight: 600;
}

.in-title h2::before {
    content: '';
    position: absolute;
    left: 0;
    bottom: -6px;
    height: 3px;
    width: 30px;
    background-color: #b0cb1f;
}

.in-title h2::after {
    content: '';
    position: absolute;
    left: 36px;
    bottom: -6px;
    height: 3px;
    width: 10px;
    background-color: #f42225;
}

.inner-matter p {
    font-family: 'Open Sans', sans-serif;
    line-height: 26px;
    color: #555;
    position: relative;
    z-index: 9;
}

.about-right{
position: relative;
}

.about-right::before
{
  position: absolute;
  content: '';
  background: url(../images/pattern.png);
  right:-25px;
  bottom:-25px;
  height: 80%;
  width: 80%;
  z-index: -1;
}
.about-right::after{
   position: absolute;
  content: '';
  background: #f7f7f6;
  left: -25px;
  top: -25px;
  height: 80%;
  width: 80%;
  z-index: -1;
}

.inner-matter h3{
font-family: 'Roboto', sans-serif;
color: #f42225;
position: relative;
margin-top: 0px;
font-size: 26px;
font-weight: 600;
border-bottom: 1px solid #ececec;
padding-bottom: 5px;
margin-bottom: 5px;
}

.about-table {
  width: 55%;
}

.about-table tr:nth-child(2n) {
    background: #f9f9f9;
}

.about-table tr:nth-child(2n+1) {
    background: #FFF;
}

.about-table tr td {
    border: 1px solid #eaeaea;
    padding: 10px;
    font-family: 'Open Sans', sans-serif;
}

.about-table tr th {
    border: 1px solid #fff;
    padding: 10px;
    background:#f42225;
    color: #fff;
    text-align: left;
    font-family: 'Open Sans', sans-serif;
    font-size: 15px;
}

/* end about page*/


/* quality page */

.quality-banner {
    padding: 70px 0px;
    background: url(../images/quality-banner.jpg) 80%;
    background-size: cover;
}


.qty-img{
  margin-top: -40px;
}

/*quality page end*/


/*Infrastructure page*/

.infrastructure-banner {
    padding: 70px 0px;
    background: url(../images/infrastructure-banner.jpg);
    background-size: cover;
}

/*end Infrastructure*/


/*enquiry*/

.enquiry-banner {
    padding: 70px 0px;
    background: url(../images/enquiry-banner.jpg) 80%;
    background-size: cover;
}

.enq-form {
    padding-top: 15px;
    display: inline-block;
    width: 100%;
}

.enq-form i {
    position: absolute;
    font-size: 16px;
    color: #a5a2a2;
    padding: 11px;
}

.enq-form input {
    height: 40px;
    border-radius: 0px;
    margin-bottom: 30px;
    padding-left: 35px;
    font-family: 'Roboto', sans-serif;
}

.enq-form textarea {
    border-radius: 0px;
    padding-left: 40px;
    padding-top: 10px;
    margin-bottom: 30px;
     font-family: 'Roboto', sans-serif;
}

.enq-form small{
    font-family: 'Roboto', sans-serif;
}

.enq-form .sendbtn {
    background: #f42225;
    color: #fff;
    font-family: 'Roboto', sans-serif;
    padding: 10px 20px;
    border: 0;
    transition: .4s;
    width: 100%;
    text-transform: uppercase;
}


/* end enquiry*/

/*contact us page*/

.contact-banner {
    padding: 70px 0px;
    background: url(../images/contact-banner.jpg) 80%;
    background-size: cover;
}

.cnt-box{
position: relative;
overflow: hidden;
padding: 40px 30px;
background: #f9f9f9;
border-radius: 6px;
margin: 20px 0px;
height: 220px;
transition: .4s;
-webkit-transition: .4s;
}

.cnt-box:hover{
box-shadow: 0 3px 4px #ccc;
}

.cnt-box h4{
font-family: 'Roboto', sans-serif;
margin-top: 0px;
font-weight: 600;
font-size: 21px;
color: #f42225;
border-bottom: 1px solid #ececec;
padding-bottom: 8px;
}

.cnt-box h4 span{
position: relative;
background: #21682e;
font-size: 20px;
color: #fff;
height: 45px;
width: 45px;
text-align: center;
line-height: 45px;
border-radius: 6px;
margin-right: 8px;
}

.cnt-box p{
  font-size: 15px;
}

.cnt-box i{
position: absolute;
color: #000;
font-size: 200px;
line-height: 180px;
bottom: -35px;
right: -15px;
opacity: 0.05;
z-index: 0;
}

.cnt-box a{
color: #555;
text-decoration: none;
transition: .4s;
-webkit-transition: .4s;
}

.cnt-box a:hover{
color: #f42225;
}

/*end contact us page*/


/*product page*/



.product-banner {
    padding: 70px 0px;
    background: url(../images/product-banner.jpg) 80%;
    background-size: cover;
}


.pro-img{
margin: 15px 0px;
}

.pro-title h3{
font-size: 22px;
}

.pro-table{
  width: 100%;
  margin: 15px 0px;
}

.pro-table tr:nth-child(2n) {
    background: #f9f9f9;
}

.pro-table tr:nth-child(2n+1) {
    background: #FFF;
}

.pro-table tr td {
    border: 1px solid #eaeaea;
    padding: 10px;
    font-family: 'Open Sans', sans-serif;
}

.pro-table tr th {
    border: 1px solid #fff;
    padding: 10px;
    background:#21682e;
    color: #fff;
    text-align: left;
    font-family: 'Open Sans', sans-serif;
    font-size: 15px;
    width: 50%;
}

.side-pro h2 {
    font-family: 'Roboto', sans-serif;
    font-weight: 600;
    font-size: 25px;
    background: #f42225;
    color: #fff;
    padding: 8px 12px;
    position: relative;
    display: block;
    border-radius: 0px;
    margin-top: 0px;
}

.side-pro h2::after {
    position: absolute;
    content: '';
    right: 0px;
    top: 50%;
    margin-top: -8px;
    transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    border: 8px solid transparent;
    border-right: 8px solid #fff;
    opacity: 1;
}

.side-pro ul {
    padding-left: 0px;
}

.side-pro ul li {
    list-style: none;
    font-size: 15px;
    font-family: 'Roboto', sans-serif;

    position: relative;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    border: 1px solid #d1d1d1;
    margin-bottom: 6px;
}

.side-pro ul li a {
    text-decoration: none;
    color: #5c5c5c;
    display: block;
    -webkit-transition: 0.5s;
    transition: 0.5s;
  padding: 12px 11px;
}

.side-pro ul li a  span{
  padding-right: 5px;
}

.side-pro li::before {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    top: auto;
    width: 0;
    height: 0;
    border-left: 9px solid transparent;
    border-right: 9px solid #b0cb1f;
    border-bottom: 9px solid #b0cb1f;
    border-top: 9px solid transparent;
    opacity: 0;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}


.side-pro li:hover a {
    color: #fff;
     background: #21682e;
}

.side-pro li:hover::before {
    opacity: 1;
}

.side-pro ul .active::before {
    opacity: 1;
}

.side-pro li.active {
    background: #21682e;
    color: #fff ;
}

.side-pro li.active a{
  color: #fff;
}

/*end product page*/


.video-box {
    border: 1px solid #c7c7c7;
    padding: 10px;
    margin: 10px 0;
    border-radius: 10px;
}

.video-box span {
    color: #f42225;
    padding: 0 5px;
}

.video-box h3 {
    position: relative;
    color: #1d5727;
font-family: 'Roboto', sans-serif;
    font-size: 20px;
}

.pdf-box {
    text-align: center;
    border: 2px solid #b0cb1f;
    transition: .4s;
    margin:10px 0px;
}

.pdf-box a {
    text-decoration: none;
    color: #555;
    transition: .4s;
}

.pdf-box img {
    width: 60%;
    display: inline-block;
    padding: 15px 0px;
}

.pdf-box p {
    line-height: 1.4;
    margin: 0px;
    background: #b0cb1f;
    padding: 4px 2px;
    transition: .4s;
    color: #1d5727;
    font-weight: 600;
}

.pdf-box:hover p {
background: #f42225;
color: #fff;
}

.pdf-box:hover {
border: 2px solid #f42225;
}


.achievement-banner {
    padding: 70px 0px;
    background: url(../images/achievement-banner.jpg) 80%;
        background-size: auto;
    background-size: cover;
}

.achievement-box{
  margin-top: 15px;
}

.other-pro {
  margin-top: 15px;
  text-align: center;
}

.other-pro .pr-name{
background: #21682e;
padding: 10px 15px;
height: 95px;
}

.other-pro .pr-name h4{
font-family: 'Roboto', sans-serif;
margin-top: 0px;
margin-bottom: 5px;
color: #fff;
}

.other-pro .pr-name p{
margin-bottom: 0px;
color: #fff;
}



footer{
background-color: #1d5727;
padding: 40px 0px;
}

footer h2
{
font-family: 'Roboto', sans-serif;
color: #fff;
position: relative;
margin-top: 0px;
font-size: 25px;
}

footer h2::before
{
  content: '';
  position: absolute;
left: 0;
bottom: -6px;
height: 3px;
width: 30px;
background-color:#b0cb1f;
}

footer h2::after
{
content: '';
position: absolute;
left: 36px;
bottom: -6px;
height: 3px;
width: 10px;
background-color: #f1cf69;
}

footer ul{
  padding-left: 0px;
  margin: 0px;
}

footer ul li{
  list-style: none;
  position: relative;
  padding-left: 15px;
}


footer ul li::before {
    position: absolute;
    left: 0;
    top: 2px;
    font-size: 14px;
    line-height: 26px;
    color: #f1cf69;
    font-weight: 900;
    font-family: "FontAwesome";
    content: "\f105";
}

footer ul li a{
 color: #f1f1f1;
  font-family: 'Open Sans', sans-serif;
  line-height: 30px;
  -webkit-transition: all 300ms ease;
-moz-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
transition: all 300ms ease;
  text-decoration:none !important; 
}

footer ul li a:hover{
color: #b0cb1f;
}

.f-about h1
{
font-size: 28px;
font-weight: 600;
font-family: 'Poppins', sans-serif;
margin: 0px;
color: #fff;
}

.f-about p{
   color: #f1f1f1;
  font-family: 'Open Sans', sans-serif;
   line-height: 26px;
}

.f-about a{
color:#fff;
padding: 9px 20px;
text-decoration: none;
background-color:#b0cb1f;
overflow: hidden;
font-family: 'Roboto', sans-serif;
-webkit-transition: all 300ms ease;
-moz-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
transition: all 300ms ease;
display: inline-block;
}

.f-about a:hover{
background:#91A818;
}

@media (max-width: 320px) {

}


@media (min-width:320px) and (max-width:414px){

.top{
  text-align: center;
}

.top-left ul li:nth-child(1) {
    padding-right: 0px;
    border-right: 0px solid #2e9140;
} 

.top-left ul li {
    margin-right: 0px;
    font-size: 12px;
}

.top-right ul li:nth-child(1) {
    padding-right: 0px;
    display: block;
    width: 100%;
}

.top-right ul li a {
    border-left: 0px solid #2d8a3e;
  }

  .top-right ul li{
        font-size: 12px;
        display: inline-block;
        float: none;
  }


.top-right ul {
  display: inline-block;
    float: none;
    border-right: 0px solid #2d8a3e;
}

.logo{
  text-align: center;
}

.logo img {
    width: 45%;
    display: inline-block;
}

.navbar-header{
background: #23662e;
}

.navbar-inverse .navbar-toggle {
    border-color: #b0cb1f;
    background: #b0cb1f;
}

.navbar-inverse .navbar-toggle:focus, .navbar-inverse .navbar-toggle:hover {
     border-color: #b0cb1f;
    background: #b0cb1f;
}

.navbar-nav {
    float: none;
    background: #b0cb1f;
margin-top: 0px;
}

.navbar .nav > li::after {
left: 10%;
 }

.first-banner {
right: 50%;
padding: 10px;
}

.first-banner h2{
font-size:15px; 
}

.carousel-caption p {
    display: none;
}

.first-banner .btn {
padding: 4px;
font-size: 12px;
margin-top: 10px;
border: 1px solid #b0cb1f;
}

.third-banner{
right: 50%;
top: 15%;
padding: 10px;
}

.third-banner h2{
font-size:15px; 
}

.third-banner .btn {
padding: 4px;
font-size: 12px;
margin-top: 10px;
border: 1px solid #b0cb1f;
}

.sec-1-left h1 {
font-size: 24px;
}

.sec-1-left a {
padding: 8px 18px;
font-size: 13px;
margin-bottom: 15px;
}

.sec-1::before {
right:50%;
}

.sec-1::after {
left: 50%;
}

.sec-1-right-box h4 {
font-size: 12px;
bottom: 10px;
padding: 5px 4px;
}

.sec-1-matter p {
display: none;
}

.sec-1-matter h5 {
font-size: 14px;
}

.sec-1-matter .more {
    padding: 6px 12px;
    font-size: 13px;
    margin-top: 35px;
}

.sec-2 h1 {
font-size: 24px;
}

.sec-2 a {
    padding: 8px 14px;
    font-size: 13px;
    margin-bottom:20px;
}

.why-top h1 {
font-size: 25px;
}

.why-box span {
    height: 35px;
    width: 35px;
    line-height: 35px;
    font-size: 13px;
    margin-top: 10px;
}

.why-box span::after {
width: 25px;
height: 25px;
}

.why-box .why-detail {
margin-left: 55px;
}

.why-box .why-detail p {
    display: none;
}

.why-box .why-detail h4 {
    font-size: 13px;
    padding-top: 10px;
}

.counter h3 {
font-size: 22px;
}

.counter h3::before{
left: 60px;
}

.sec-5-title h2 {
font-size: 22px;
}

.slick-pre {
top:-38px;
padding: 8px 10px;
margin-right: 15px;
}

.slick-nxt {
top:-38px;
padding: 8px 10px;
}

.slider {
margin: 10px 0px 0px;
}


.cnt-box {
padding: 25px 20px;
}

.cnt-box p {
    font-size: 13px;
}

.cnt-box {
height: 170px;

  }

.m-cnt{
height: 270px;
}

.f-about h1 {
font-size: 22px;
}

.f-about a{
padding: 7px 12px;
}


footer h2 {
font-size: 22px;
margin-top: 15px;
}


}