/*
Template Name:Shop Com
File: Layout CSS
Author: Templates On Web
Author URI: http://templateonweb.com/
Licence: <a href="http://www.templateonweb.com/terms.php?v=content&contentid=152">Website Template Licence</a>
*/
/*********************center_home****************/
.center_home{
padding-top:40px;
padding-bottom:40px; 
 }
.center_1l{
border:3px solid #ddd;
 }
.center_1l h5{
padding:15px 15px 0px 15px;
 }
.center_1l h5 i{
 font-size:16px;
 margin-right:5px;
 }
.center_1l ul li a{
display:block;
font-size:16px; 
border-bottom:1px solid #ddd;
padding:15px;
color:#666;
 }
.center_1l ul li a:hover{
color:#1bbd36;
 }
.center_1l ul li  a .span_1 i{
margin-right:5px;
font-size:14px; 
 }
.center_1l ul li  a .span_2 i{
font-size:10px;
color:#999; 
 }
 
.fade-carousel {
    position: relative;
    min-height: 530px;
}
.fade-carousel .carousel-inner .item {
    min-height: 530px;
}
.fade-carousel .carousel-indicators > li {
    margin: 0 4px;
    opacity: .8;
}
.fade-carousel .carousel-indicators > li.active {
  opacity: 1;
}

.hero h5{
 background:#333;
 padding:10px;
 width:20%;
 text-align:center;
 }
/********************************/
/*          Hero Headers        */
/********************************/
.hero {
    position: absolute;
	width:100%;
    top: 50%;
    left:50%;
	padding:20px 15px;
    z-index: 2;
    color: #fff;
    text-transform:capitalize;
    text-shadow: 1px 1px 0 rgba(0,0,0,.75);
	-webkit-transform: translate3d(-50%,-50%,0);
	-moz-transform: translate3d(-50%,-50%,0);
	-ms-transform: translate3d(-50%,-50%,0);
	-o-transform: translate3d(-50%,-50%,0);
	transform: translate3d(-50%,-50%,0);
}


.fade-carousel .carousel-inner .item .hero {
    opacity: 0;
    -webkit-transition: 2s all ease-in-out .1s;
       -moz-transition: 2s all ease-in-out .1s; 
        -ms-transition: 2s all ease-in-out .1s; 
         -o-transition: 2s all ease-in-out .1s; 
            transition: 2s all ease-in-out .1s; 
}
.fade-carousel .carousel-inner .item.active .hero {
    opacity: 1;
    -webkit-transition: 2s all ease-in-out .1s;
       -moz-transition: 2s all ease-in-out .1s; 
        -ms-transition: 2s all ease-in-out .1s; 
         -o-transition: 2s all ease-in-out .1s; 
            transition: 2s all ease-in-out .1s;    
}

/********************************/
/*            Overlay           */
/********************************/
.overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 2;
    background-color: #080d1573;
    opacity: 1;
}

/********************************/
/*          Custom Buttons      */
/********************************/

/********************************/
/*       Slides backgrounds     */
/********************************/
.fade-carousel .slides .slide-1, 
.fade-carousel .slides .slide-2,
.fade-carousel .slides .slide-3 {
  min-height: 530px;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.fade-carousel .slides .slide-1 {
      background-image: url(../img/2.jpg);
}
.fade-carousel .slides .slide-2 {
    background-image: url(../img/3.jpg);
}
.fade-carousel .slides .slide-3 {
      background-image: url(../img/4.jpg);
}
#center .carousel-indicators{
  bottom:0;
  }
.fade-carousel .carousel-indicators > li{
      background: #000;
	  border-color: #000;
	  width:11px;
	  height:11px;
  }
.fade-carousel .carousel-indicators > li.active{
      width:11px;
	  height:11px;
	  background:#1bbd36;
	  border-color:#1bbd36;
  }

.center_2i h5 i{
 margin-right:5px;
 font-size:14px;
  }
.center_2i{
 border-left:1px solid #ddd;
 border-bottom:1px solid #ddd;
 border-top:1px solid #ddd;
 padding:15px;
 }
.center_2{
margin-left:15px;
margin-right:15px;
margin-top:30px; 
 }
.center_3{
margin-top:30px; 
 }
.center_3l1 .span_1{
 margin-top:15px;
 display:block;
 color:#FFCC66;
 }
.center_3l1 .span_2{
margin-right:20px;
text-decoration:line-through;
 }
.center_3l1 .button i{
margin-right:5px; 
 }
.center_3l1{
border:1px solid #ddd;
padding:20px 15px;
margin-top:30px; 
 }
.pager{
margin-bottom:0; 
 }
.center_3l1i{
margin-top:15px; 
border-bottom:1px solid #ddd;
padding-bottom:15px;
 }
.center_3l1 .form-control{
 margin-top:15px;
 border-radius:0;
 }
.mga img{
margin-left:auto;
margin-right:auto; 
 }
.mga p{
font-size:16px; 
 }
.center_3l1io ul li {
display:inline-block;
margin-top:5px; 
font-size:16px;
 }
.center_3l1io ul li a{
padding:8px;
display:block;
background:#f4f4f4;
 }
.center_3l1io ul li a:hover{
 background:#1bbd36;
 color:#fff;
 }
 
.center_3r1{
 border-bottom:3px solid #1bbd36;
 padding-bottom:15px;
 margin-bottom:15px;
 }
.center_3r2i .span_1{
 margin-top:15px;
 display:block;
 color:#FFCC66;
 }
.center_3r2i .span_2{
margin-right:20px;
text-decoration:line-through;
 }
.center_3r2i .button i{
margin-right:5px; 
 }
.center_3r1{
margin-top:30px; 
 }
 
.center_3r2 .center_3r2i {
background:#6cd4ae1f;
padding-bottom:20px; 
 }
.center_3r2 .col-sm-4  .center_3r2i{
background:none;
padding-bottom:0;  
 }
/*********************center_home****************/


@media screen and (max-width : 767px){
.center_1r {
margin-top:20px;
text-align:center;
 }
.hero h5{
 width:70%;
 margin:auto;
 }
.hero h2{
font-size:30px;
 }
.center_2i{
margin-bottom:15px;
border:1px solid #ddd; 
 }
.center_3l1ir {
margin-top:15px; 
 }
.center_3r {
margin-top:20px; 
 }
.center_3r1 {
text-align:center; 
 }
.center_3r2i {
margin-bottom:15px; 
 }
.center_3l1ir {
text-align:center; 
 }
.center_3r3l {
margin-bottom:15px; 
text-align:center;
 }
}

@media (min-width:768px) and (max-width:991px) {
.center_2i h5{
 font-size:14px;
 }
.center_3l1  h4{
 font-size:18px;
 }
.hero h5{
width:40%;
 }
.center_3l1 .span_2{
margin-right:10px;
font-size:15px; 
 }
.center_3l1 .span_3{
font-size:15px; 
 }
.center_3r2i .span_2{
 margin-right:5px;
font-size:15px; 
 }
.center_3r2i .span_3{
 margin-right:10px;
font-size:15px; 
 }
 }
@media (min-width:992px) and (max-width:1200px) {
.center_2i h6{
 font-size:13px;
 }
 }
@media (min-width:1201px) and (max-width:1340px) {

 }

/*--------------------------------------------------------------
# Pricing
--------------------------------------------------------------*/
.pricing .box {
  padding: 20px;
  background: #fff;
   align-items: center;
  text-align: center;
  border: 1px solid #eef0ef;
  border-radius: 0;
  position: relative;
  overflow: hidden;
}
.pricing h3 {
  font-weight: 400;
  margin: -20px -20px 20px -20px;
  padding: 20px 15px;
  font-size: 16px;
  font-weight: 600;
  color: #777777;
  background: #dde3e2;
}
.pricing h4 {
  font-size: 36px;
  color: #1bbd36;
  font-weight: 600;
  font-family: "Poppins", sans-serif;
  margin-bottom: 20px;
}
.pricing h4 sup {
  font-size: 20px;
  top: -15px;
  left: -3px;
}
.pricing h4 span {
  color: #bababa;
  font-size: 16px;
  font-weight: 300;
}
.pricing ul {
  padding: 0;
  list-style: none;
  color: #444444;
  text-align: center;
  line-height: 20px;
  font-size: 14px;
}
.pricing ul li {
  padding-bottom: 16px;
}
.pricing ul i {
  color: #1bbd36;
  font-size: 18px;
  padding-right: 4px;
}
.pricing ul .na {
  color: #ccc;
  text-decoration: line-through;
}
.pricing .btn-wrap {
  margin: 20px -20px -20px -20px;
  padding: 20px 15px;
  background: #dde3e2;
  text-align: center;
}
.pricing .btn-buy {
  background: #1bbd36;
  display: inline-block;
  padding: 8px 35px;
  border-radius: 50px;
  color: #fff;
  transition: none;
  font-size: 14px;
  font-weight: 400;
  font-family: "Raleway", sans-serif;
  font-weight: 600;
  transition: 0.3s;
}
.pricing .btn-buy:hover {
  background: #3ac162;
}
.pricing .featured h3 {
  color: #fff;
  background: #1bbd36;
}
.pricing .advanced {
  width: 200px;
  position: absolute;
  top: 18px;
  right: -68px;
  transform: rotate(45deg);
  z-index: 1;
  font-size: 14px;
  padding: 1px 0 3px 0;
  background: #1bbd36;
  color: #fff;
}
.get-started-btn2 {
  margin-left: 22px;
  background: #1bbd36;
  color: #fff;
  border-radius: 20px;
  padding: 5px 15px;
  white-space: nowrap;
  transition: 0.3s;
  font-size: 14px;
  display: inline-block;
}
.get-started-btn2:hover {
  background: #003869;
  color: #1bbd36;
}
/*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/
#hero {
  width: 100%;
  height: 80vh;
  background: url("../img/hero-bg.jpg") top center;
  background-size: cover;
  position: relative;
}

#hero h6 {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  line-height: 50px;
  color: #fff;
  font-family: "Poppins", sans-serif;
}

#hero:before {
  content: "";
  background: rgba(0, 0, 0, 0.4);
  position: absolute;
  bottom: 0;
  top: 0;
  left: 0;
  right: 0;
}
#hero .container {
  padding-top: 72px;
}

@media (max-width: 992px) {
  #hero .container {
    padding-top: 62px;
  }
}
#hero h1 {
  margin: 0;
  font-size: 40px;
  font-weight: 650;
  line-height: 56px;
  color: #fff;
  font-family: "Poppins", sans-serif;
}
#hero h2 {
  color: #eee;
  margin: 10px 0 0 0;
  font-size: 24px;
}
#hero .btn-get-started {
  font-family: "Raleway", sans-serif;
  font-weight: 500;
  font-size: 15px;
  letter-spacing: 1px;
  display: inline-block;
  padding: 10px 35px;
  border-radius: 50px;
  transition: 0.5s;
  margin-top: 30px;
  border: 2px solid #fff;
  color: #fff;
}
#hero .btn-get-started:hover {
  background: #1bbd36;
  border: 2px solid #1bbd36;
}
@media (min-width: 1024px) {
  #hero {
    background-attachment: fixed;
  }
}
@media (max-width: 768px) {
  #hero {
    height: 100vh;
  }
  #hero h1 {
    font-size: 28px;
    line-height: 36px;
  }
  #hero h2 {
    font-size: 18px;
    line-height: 24px;
  }
}

#hero1 {
  width: 100%;
  height: 40vh;
  background: url("../img/mem7.jpg") top center;
  background-size: cover;
  position: relative;
}

#hero1:before {
  content: "";
  background: rgba(0, 0, 0, 0.4);
  position: absolute;
  bottom: 0;
  top: 0;
  left: 0;
  right: 0;
}
#hero1 .container {
  padding-top: 72px;
}
@media (max-width: 992px) {
  #hero1 .container {
    padding-top: 62px;
  }
}

#hero1 .btn-get-started {
  font-family: "Raleway", sans-serif;
  font-weight: 500;
  font-size: 15px;
  letter-spacing: 1px;
  display: inline-block;
  padding: 10px 35px;
  border-radius: 50px;
  transition: 0.5s;
  margin-top: 30px;
  border: 2px solid #fff;
  color: #fff;
}
#hero1 h1 {
  margin: 0;
  font-size: 40px;
  font-weight: 400;
  line-height: 60px;
  color: #fff;
  font-family: "Poppins", sans-serif;
}
#hero1 h2 {
  color: #fff;
  margin: 0 0 0 0px;
  font-size: 20px;
  line-height: 20px;
  padding: 0px 0px;
  text-align:right
}
#hero1 .btn-get-started:hover {
  background: #1bbd36;
  border: 2px solid #1bbd36;
}
 #hero1 h1 {
    font-size: 18px;
    line-height: 16px;
  }
@media (min-width: 1024px) {
  #hero1 {
    background-attachment: fixed;
  }
}
@media (max-width: 768px) {
  #hero1 {
    height: 100vh;
  }

}

