/*
Template Name: Wrapkit
Author: Wrappixel
Email: niravjoshi87@gmail.com
File: scss
*/
/*
Template Name: Wrapkit
Author: wrappixel
Email: niravjoshi87@gmail.com
File: scss
*/
/*Theme Colors*/
/*bootstrap Color*/
/*Light colors*/
/*Normal Color*/
/*Extra Variable*/
/*Gradiant*/
/*============================================================== 
 This scss/css we made it from our predefine componenet 
 we just copy that css and paste here you can also do that
 ============================================================== */
/*******************
This is for Header
*******************/
/*******************
Header 3
*******************/
.h3-topbar {
  padding: 10px 0; }
  .h3-topbar .list-inline {
    margin-bottom: 0px; }
    .h3-topbar .list-inline li {
      display: inline-block; }
      .h3-topbar .list-inline li a {
        padding: 10px 8px;
        display: block;
        color: #8d97ad;
        font-weight: 400;
        font-size: 14px; }
        .h3-topbar .list-inline li a:hover {
          color: #263238; }
        .h3-topbar .list-inline li a .info-icon {
          display: inline-block;
          vertical-align: middle;
          margin-right: 8px;
          font-size: 25px; }
        .h3-topbar .list-inline li a .vdevider {
          width: 1px;
          background: rgba(120, 130, 140, 0.13);
          display: inline-block;
          height: 25px;
          vertical-align: middle; }
  .h3-topbar .t-r {
    text-align: right; }

.h3-navbar {
  border-top: 1px solid rgba(120, 130, 140, 0.13);
  position: relative; }
  .h3-navbar .navbar-brand {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 240px;
    text-align: center;
    background: #ffffff;
    -webkit-box-shadow: 0px 0px 30px rgba(115, 128, 157, 0.1);
    box-shadow: 0px 0px 30px rgba(115, 128, 157, 0.1);
    padding: 20px 15px;
    top: -67px; }
  .h3-navbar .navbar {
    padding: 0px;
    margin-top: -1px; }
    .h3-navbar .navbar .navbar-nav .nav-item {
      margin: 0 10px; }
    .h3-navbar .navbar .navbar-nav .nav-link {
      padding: 22px 20px;
      font-weight: 500;
      text-transform: uppercase;
      font-size: 14px;
      color: #8d97ad;
      border-top: 1px solid transparent; }
    .h3-navbar .navbar .navbar-nav .nav-item.active .nav-link, .h3-navbar .navbar .navbar-nav .nav-item:hover .nav-link {
      border-top: 1px solid #ff4d7e;
      color: #ff4d7e; }

/*-------------------*/
/*Slider Style Start*/
/*-------------------*/
.slider6 .slide-text {
  bottom: 0;
  top: auto !important;
  -ms-transform: translate(-50%, 0) !important;
  transform: translate(-50%, 0) !important;
  -webkit-transform: translate(-50%, 0) !important;
  -moz-transform: translate(-50%, 0) !important; }

.slider6 .slider-control span {
  width: 53px;
  height: 53px;
  line-height: 53px;
  border-radius: 50%; }

.slider6 h2 {
  line-height: 42px;
  font-size: 36px; }

.slider6 p {
  color: #ffffff; }

.slider6 .btn-md {
  border: 1px solid #ffffff; }

.slider6 .slide-content {
  padding: 40px;
  position: relative;
  opacity: 0.9; }

.slider6 .price-tag {
  position: absolute;
  right: -65px;
  top: -65px;
  width: 130px;
  height: 130px;
  padding-top: 33px;
  border-radius: 50%; }
  .slider6 .price-tag span {
    font-weight: 300;
    font-size: 36px;
    line-height: 36px; }

@media (max-width: 767px) {
  .slider6 .slider-control span {
    width: 34px;
    height: 34px;
    line-height: 34px; }
  .slider6 h2 {
    font-size: 28px;
    line-height: 36px; }
  .slider6 .slide-text {
    padding: 0 !important;
    width: 80% !important; }
  .slider6 .slide-image {
    height: 430px; }
  .slider6 .slide-content {
    padding: 30px; } }

@media (max-width: 590px) {
  .slider6 .price-tag {
    right: 0;
    top: -80px;
    left: 0;
    margin: auto;
    padding-top: 20px;
    width: 100px;
    height: 100px; }
    .slider6 .price-tag span {
      font-size: 30px; }
    .slider6 .price-tag label {
      font-size: 12px; } }

@media (max-width: 428px) {
  .slider6 .slider-control span {
    width: 26px;
    height: 26px;
    line-height: 26px;
    font-size: 12px !important; }
  .slider6 .slide-content {
    padding: 30px 20px; }
  .slider6 .slide-image {
    left: -90%; }
  .slider6 h2 {
    font-size: 22px;
    line-height: 30px; }
  .slider6 .btn-md {
    padding-left: 25px;
    padding-right: 25px; } }

@media (max-width: 320px) {
  .slider6 .slide-content {
    padding: 30px 15px; }
  .slider6 h2 {
    font-size: 20px; }
  .slider6 .btn-md {
    padding-left: 20px;
    padding-right: 20px; }
  .slider6 .slide-image {
    height: 390px; } }

/*******************
Feature 2
*******************/
.wrap-feature2-box .card-body {
  padding: 40px; }

/*******************
Feature 47
*******************/
.wrap-feature47-box .f-47-line {
  line-height: 40px; }

.wrap-feature47-box .video-img {
  cursor: pointer; }

/*******************
Pricing 4
*******************/
.pricing4 .price small {
  color: #8d97ad;
  font-size: 16px; }

/*******************
Testimonial 10
*******************/
.testimonial10 {
  background-size: cover;
  background-position: center center;
  background-attachment: fixed; }
  .testimonial10 .testi10 .quote-bg {
    max-width: 800px;
    width: 100%;
    margin: 0 auto;
    padding: 60px;
    background: url(../images/up-quote.png) no-repeat top left, url(../images/down-quote.png) no-repeat bottom right; }
  .testimonial10 .testi10 h3 {
    line-height: 40px; }
  .testimonial10 .testi10 .customer-thumb {
    margin: 15px 0; }
    .testimonial10 .testi10 .customer-thumb img {
      width: 60px; }

/*******************
Blog homepage 4
*******************/
.blog-home4 .tweet {
  text-align: center; }
  .blog-home4 .tweet .card-title {
    color: #ffffff; }
    .blog-home4 .tweet .card-title a {
      color: #ffffff; }
      .blog-home4 .tweet .card-title a:hover {
        color: #263238; }