  /*--------------------------------------------------------------
# Sections
--------------------------------------------------------------*/

/* Sections Header
--------------------------------*/
#why-us {
    padding: 60px 0;
}

.section-header h2 {
  font-size: 36px;
  color: #413e66;
  text-align: center;
  font-weight: 700;
  position: relative;
  font-family: "Montserrat", sans-serif;
  margin-bottom: 60px;
  position: relative;
  display: inline-block;
 
}
.section-header h2::before{content: ''; border-left: #00aced 6px solid;padding: 15px;position: absolute;left: -40px; top: 18px;
  transform: rotate(30deg);
}
.section-header h2::after{content: ''; border-left: #f08519 6px solid;padding: 15px;position: absolute;right: -60px; top: 18px;
  transform: rotate(30deg);
}


.section-header p {
  text-align: center;
  margin: auto;
  font-size: 15px;
  padding-bottom: 60px;
  color: #535074;
  width: 50%;
}
.why-us-content p{
  font-size: 18px;
  line-height: 180%;
  margin: 0 0 30px 0;
  color: #848484;
}
#why-us .why-us-content .features {
  margin: 0 0 15px 0;
  padding: 0;
  transition: 0.3s ease-in-out;
}

#why-us .why-us-content .features i {
  font-size: 36px;
  float: left;
  color: #137ed9;
}
#why-us .why-us-content .features svg {
  font-size: 36px;
  float: left;
  color: #137ed9;
}
#why-us .why-us-content .features h4 {
  font-size: 24px;
  font-weight: 600;
  margin-left: 56px;
  color: #137ed9;
  margin-bottom: 5px;
}

#why-us .why-us-content .features p {
  font-size: 16px;
  margin-left: 56px;
  color: #555186;
}

.align-center{text-align: center;}

/* Section with background
--------------------------------*/
/* ==========================================================================
3. Hero Area
========================================================================== */
#hero-area {
  color: #fff;
  overflow: hidden;
  position: relative;
  background: url(/imgs/1x.jpg) no-repeat center ;

  height: 630px;
}

#hero-area .contents {
  padding: 170px 0px 50px;
}

#hero-area .contents h5 {
  font-size: 50px;
}

#hero-area .contents .head-title {
  color: #585b60;
  font-size: 34px;
  line-height: 48px;
  font-weight: 700;
  margin-bottom: 30px;
}

.sloder-img {
  background: #34363a;
}

/* Services Item */
.services-item {
  padding: 15px;
  border-radius: 4px;
  text-align: left;
  transition: all 0.3s ease-in-out 0s;
  -moz-transition: all 0.3s ease-in-out 0s;
  -webkit-transition: all 0.3s ease-in-out 0s;
  -o-transition: all 0.3s ease-in-out 0s;
}

.services-item .icon i {
  font-size: 42px;
  width: 42px;
  display: block;
  height: 42px;
  color: #137ED9;
}

.services-item .services-content h3 {
  margin-top: 10px;
  font-weight: 500;
  margin-bottom: 10px;
}

.services-item .services-content h3 a {
  font-size: 22px;
  text-transform: uppercase;
  color: #585b60;
}

.services-item .services-content h3 a:hover {
  color: #137ED9;
}
.services-item .services-content p {
    font-weight: 400;
    font-family: 'Montserrat', sans-serif;
    margin: 0px;
    font-size: 14px;
    color: #ccc;
}

/* Team Item */
.team-item:hover {
  box-shadow: 0 20px 30px -12px rgba(0, 0, 0, 0.35);
}

.team-item {
  margin: 15px 0;
  border-radius: 0px;
  box-shadow: 0 10px 30px -7px rgba(0, 0, 0, 0.35);
  transition: all 0.3s ease-in-out 0s;
  -moz-transition: all 0.3s ease-in-out 0s;
  -webkit-transition: all 0.3s ease-in-out 0s;
  -o-transition: all 0.3s ease-in-out 0s;
}

.team-item .team-img {
  position: relative;
  cursor: pointer;
  overflow: hidden;
  border-radius: 0px;
}

.team-item .team-overlay {
  height: 100%;
  position: absolute;
  top: 0;
  background: rgba(255, 255, 255, 0.8);
  opacity: 0;
  width: 100%;
  border-radius: 0px;
  transition: all 0.3s ease-in-out 0s;
  -moz-transition: all 0.3s ease-in-out 0s;
  -webkit-transition: all 0.3s ease-in-out 0s;
  -o-transition: all 0.3s ease-in-out 0s;
}

.team-item .overlay-social-icon {
  color: #fff;
  top: 45%;
  position: absolute;
  display: table-cell;
  margin: 0 auto;
  width: 100%;
}

.team-item .overlay-social-icon .social-icons {
  padding-left: 0;
  transition: all 0.3s ease-in-out 0s;
  -moz-transition: all 0.3s ease-in-out 0s;
  -webkit-transition: all 0.3s ease-in-out 0s;
  -o-transition: all 0.3s ease-in-out 0s;
}

.team-item .overlay-social-icon .social-icons li {
  display: inline-block;
  margin: 0 4px;
}

.team-item .overlay-social-icon .social-icons li a {
  letter-spacing: 0px;
  outline: 0 !important;
}

.team-item .overlay-social-icon .social-icons li a i {
  font-size: 20px;
  color: #fff;
  width: 36px;
  height: 36px;
  background: #137ED9;
  display: block;
  border-radius: 4px;
  line-height: 36px;
  transition: all 0.3s ease-in-out 0s;
  -moz-transition: all 0.3s ease-in-out 0s;
  -webkit-transition: all 0.3s ease-in-out 0s;
  -o-transition: all 0.3s ease-in-out 0s;
}

.team-item .overlay-social-icon .social-icons li a:hover .lni-facebook-filled {
  background: #3B5998;
}

.team-item .overlay-social-icon .social-icons li a:hover .lni-twitter-filled {
  background: #00aced;
}

.team-item .overlay-social-icon .social-icons li a:hover .lni-instagram-filled {
  background: #fb3958;
}

.team-item .info-text {
  padding: 15px 20px;
  background: #fff;
}

.team-item .info-text h3 {
  font-size: 16px;
  text-transform: uppercase;
  font-weight: 700;
  margin-bottom: 5px;
}

.team-item .info-text h3 a {
  color: #333;
}

.team-item .info-text h3 a:hover {
  color: #137ED9;
}

.team-item .info-text p {
  margin: 0;
  color: #888;
}

.team-item:hover .team-overlay {
  opacity: 1;
}



.section-bg {
  background: #f5f8fd;
}
.section-bg1 {
  background: #f5f8fd;
  background: url(bg01#.jpg) left top no-repeat;
  background-size: 100%;
}
.section-bg3 {
  background: #f1f6ff
}
.section-bg4 {
  background: #cfdef1
}
.section-bg5 {
  background: #fff
}
.section-bg6 {
  background: #f9f9f9
}



.x-block2-a{border-radius: 10px; background: #f2f2f2;padding: 20px 20px;
    border: 2px solid #137ed9;font-size: 26px;}
.x-color-red{color: #fb3958;}

.xblock2{    box-shadow: 1px 1px 20px #ddd;    padding: 10px 15px;border: 2px solid #fb3958;
border-radius: 20px;margin-bottom: 15px;}
.xblock2 h2{font-size: 20px;font-weight: bold;position: relative;padding-left: 19px;}

.xblock2 p{margin-bottom: 10px;padding-left: 19px;}
.xblock2 h2::after{content: '2';height: 32px;width: 32px;text-align: center;position: absolute;background: #00aced;
color: #fff;left: -30px;top: 0;border-radius: 6px;line-height: 32px;}
.xblock2 h2.child1::after{content: '1';}
.xblock2 h2.child2::after{content: '2';}
.xblock2 h2.child3::after{content: '3';}
.xblock2 h2.child4::after{content: '4';}

/*===========================
       6.PRICING css 
===========================*/
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .pricing-area {
      padding-top: 90px;
      padding-bottom: 100px; } }
  @media (max-width: 767px) {
    .pricing-area {
      padding-top: 70px;
      padding-bottom: 80px; } }

  .single-pricing{display: flex;flex-direction: column}
  
  .single-pricing .pricing-package {

    border-top-left-radius: 5px;
    border-top-right-radius: 5px; }

    .pricing-package1{ background-color: #754ef9;}
    .pricing-package2{ background-color: #0fbcf1}
    .pricing-package3{ background-color: #ef5425}

    .pricing-body{ background: #fff;}
    .single-pricing .pricing-package .package-title {
      font-size: 22px;
      color: #fff;
      padding: 25px; margin-bottom: 0;}
  .single-pricing .pricing-body {
    border: 1px solid #ddd;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px; }
    .single-pricing .pricing-body .pricing-text {
      border-bottom: 1px solid #ddd;
      padding: 20px 25px; }
      .single-pricing .pricing-body .pricing-text .price {
        font-size: 30px;
        font-weight: 600;
        color: #754ef9;
        padding-top: 15px; }
        .pricing-text1{display: flex;flex-direction: row;flex-wrap: wrap;}
   .pricing-text p{border: 1px solid #222;padding: 5px;border-radius: 10px;margin-bottom: 10px;color: #222;}
   .pricing-text p:hover{background: #b2edff}

.pricing-text1 p{margin-right: 12px;}
    .single-pricing .pricing-body .pricing-list {
      padding-top: 30px; }
      .single-pricing .pricing-body .pricing-list ul li {
        line-height: 36px;
        color: #32333c;
        font-size: 16px; }
    .single-pricing .pricing-body .pricing-btn {
      padding-top: 25px;
      padding-bottom: 40px; }
      .single-pricing .pricing-body .pricing-btn .main-btn {
        background-color: #fff;
        color: #754ef9; }
        .single-pricing .pricing-body .pricing-btn .main-btn:hover {
          background-color: #754ef9;
          color: #fff; }
  .single-pricing.active {
     
    -webkit-box-shadow: 0px 0px 21px 0px rgba(152, 152, 152, 0.23);
    -moz-box-shadow: 0px 0px 21px 0px rgba(152, 152, 152, 0.23);
    box-shadow: 0px 0px 21px 0px rgba(152, 152, 152, 0.23); }
    .single-pricing.active .pricing-body .pricing-btn .main-btn {
      background-color: #754ef9;
      color: #fff; }
      .single-pricing.active .pricing-body .pricing-btn .main-btn:hover {
        background-color: #fff;
        color: #754ef9; }


.jnyq{display: flex;flex-direction: column;flex-wrap: nowrap;}
.xblock4{display: flex;flex-direction: row;margin-bottom: 15px;}
.xblock4 div{margin:0  10px;width: 35%;border: 1px solid #ccc;padding: 8px 15px;
  box-shadow: 1px 2px 6px 1px rgba(53, 54, 102, 0.08);background: #fff;}
.xblock4 div strong{font-size: 20px;margin-bottom: 10px;display: inline-block;color: #ed1818;}
.xblock4 div p{margin-bottom: 10px;}
.xblock4 div.xbox4{width: 260px;margin-right: 50px;border: 0;position: relative;}
.xblock4 div.xbox4 h4{margin-bottom: 0;}
.xblock4 .xbox4::before{width: 50px;height: 50px;background:#00aced ;position: absolute;content: '';
right: -20px;top: 50%;transform: rotate(45deg);margin-top: -25px;}

.xblock4 .xbox4{background: #00aced;display: flex;align-items: center;justify-content: center;width: 200px;color: #fff;font-size: 28px;}
.xblock4 .xbox4c2{background: #dc7519;}
.xblock4 .xbox4c2::before{background: #dc7519;}
.xblock4 .xbox4c3{background: #ff6f54;}
.xblock4 .xbox4c3::before{background: #ff6f54;}


.zssb{display: flex;flex-direction: row;justify-content:center;}
.xblock5{background: #c8f2ff;position: relative;width: 260px;height: 90px;padding: 10px 15px 10px 20px;
  margin-bottom: 30px;margin-right: 60px;border-radius: 12px;box-shadow: 1px 2px 6px 1px rgba(53, 54, 102, 0.08);text-align: center;
  display: flex;justify-content: center;align-items: center;
}
.xblock5::after{width: 20px;height: 20px;background:#c8f2ff ;position: absolute;content: '';
  right: -10px;top: 50%;transform: rotate(45deg);margin-top: -10px;}
.xnum{width: 30px;height: 30px;border-radius: 50%;background: #00aced;text-align: center;line-height: 30px;color: #fff;
position: absolute;left:-15px;top: -15px;;}

.zssbewm{display: flex;align-items: center;justify-content: center;flex-direction: row-reverse;width: 70%;background: #eee;
margin: 0 auto;border-radius: 12px;}
.zssbewm p{padding: 15px;margin: 0;}
.afternone::after{display: none;}

.kdjs{display: flex;flex-direction: row;justify-content:center;align-items: center;}
.xbox6-img{width: 50%;margin-right: 40px;text-align: center;}
.xbox6-img img{border-radius: 20px;margin-bottom: 10px;box-shadow: 1px 1px 15px 0px rgb(152 152 152 / 25%)}
.xbox6-img p{margin: 0;}
.xbox6{width: 50%;}
.xbox6 p{margin-bottom: 15px;}
.kdjsh4 {display: inline-block;background: #00aced;color: #fff;padding: 9px;margin: 0 auto;margin-bottom: 20px;}
