/*=======================================================================
* Template Name: quickspace core plugin style
* Template URL:  http://wpdemo.smartsoftfirm.com/quickspace
* Author      : SmartSoftFirm 
* Author URL  : https://themeforest.net/user/smartsoftfirm
* Version: 1.2.0
* Tags: agency, saas, startyp, business
======================================================================= */

/*------------------------------------------------------
Table of content
--------------------------------------------------------
*--> Header Area Style
*--> Hero Area Style
*--> About  Area Style
*--> Service Area Style
*--> Portfolio Area Style
*--> Counter Area Style
*--> CTA Area Style
*--> Price Area Style
*--> Testimonial Area Style
*--> Logo Carousel Area Style
*--> Contact Area Style
*--> Blog  Area Style
*--> Footer Area Style
------------------------------------------------------*/

/*google-Fonts*/

/*
-------------------------------------------
   Default Style
-------------------------------------------
*/
body {
  font-family: 'Poppins', sans-serif;
     color: #717584;
}
 ul, ol {
     list-style: none;
     outline: none;
     margin: 0;
     padding: 0;
}
 a, a:hover, a:focus, :focus {
     text-decoration: none;
     outline: none;
}
 img {
     max-width: 100%;
}
 h1, h2, h3, h4, h5, h6 {
     color: #090F4E;
	 font-weight: 600;
}
 p {
     color: #63657E;
     font-weight: 400;
     font-size: 16px;
}
 .section-padding {
     padding: 130px 0;
}
 .section-margin {
     margin: 130px 0;
}
 .pd-80 {
     padding: 80px 0;
}
 .p-t-40 {
     padding-top: 40px;
}
 .pt-65 {
     padding-top: 65px;
}
 .p-t-140 {
     padding-top: 140px;
}
 .m-b-65 {
     margin-bottom: 50px;
}
 .pd-70 {
     padding: 70px 0;
}
 .pd-50 {
     padding: 50px 0;
}
 .mt-30 {
     margin-top: 30px;
}
 .left {
     text-align: left;
}
 .right {
     text-align: right;
}
 .center {
     text-align: center;
}
/* ------------------------------------------- Animtion Style ------------------------------------------- */
.hero-five-right-img img, .hero-four-right-img img, div#loader-wrapper img{
     animation: hover 3.25s ease infinite;
     animation-delay: -0.45s;
}
 @-webkit-keyframes hover {
     0% {
         webkit-transform: translateY(0);
         -webkit-transform: translateY(0);
         transform: translateY(0);
         webkit-animation-timing-function: cubic-bezier(0.3, 0.36, 0.6, 1);
         -webkit-animation-timing-function: cubic-bezier(0.3, 0.36, 0.6, 1);
         animation-timing-function: cubic-bezier(0.3, 0.36, 0.6, 1);
    }
     25% {
         webkit-transform: translateY(-6.25px);
         -webkit-transform: translateY(-6.25px);
         transform: translateY(-6.25px);
         webkit-animation-timing-function: cubic-bezier(0.51, -0.05, 0.85, 0.82);
         -webkit-animation-timing-function: cubic-bezier(0.51, -0.05, 0.85, 0.82);
         animation-timing-function: cubic-bezier(0.51, -0.05, 0.85, 0.82);
    }
     50% {
         webkit-transform: translateY(0);
         -webkit-transform: translateY(0);
         transform: translateY(0);
         webkit-animation-timing-function: cubic-bezier(0.3, 0.36, 0.6, 1);
         -webkit-animation-timing-function: cubic-bezier(0.3, 0.36, 0.6, 1);
         animation-timing-function: cubic-bezier(0.3, 0.36, 0.6, 1);
    }
     75% {
         webkit-transform: translateY(6.25px);
         -webkit-transform: translateY(6.25px);
         transform: translateY(6.25px);
         webkit-animation-timing-function: cubic-bezier(0.51, -0.05, 0.85, 0.82);
         -webkit-animation-timing-function: cubic-bezier(0.51, -0.05, 0.85, 0.82);
         animation-timing-function: cubic-bezier(0.51, -0.05, 0.85, 0.82);
    }
     100% {
         webkit-transform: translateY(0);
         -webkit-transform: translateY(0);
         transform: translateY(0);
    }
}
 @keyframes hover {
     0% {
         webkit-transform: translateY(0);
         -webkit-transform: translateY(0);
         transform: translateY(0);
         webkit-animation-timing-function: cubic-bezier(0.3, 0.36, 0.6, 1);
         -webkit-animation-timing-function: cubic-bezier(0.3, 0.36, 0.6, 1);
         animation-timing-function: cubic-bezier(0.3, 0.36, 0.6, 1);
    }
     25% {
         webkit-transform: translateY(-6.25px);
         -webkit-transform: translateY(-6.25px);
         transform: translateY(-6.25px);
         webkit-animation-timing-function: cubic-bezier(0.51, -0.05, 0.85, 0.82);
         -webkit-animation-timing-function: cubic-bezier(0.51, -0.05, 0.85, 0.82);
         animation-timing-function: cubic-bezier(0.51, -0.05, 0.85, 0.82);
    }
     50% {
         webkit-transform: translateY(0);
         -webkit-transform: translateY(0);
         transform: translateY(0);
         webkit-animation-timing-function: cubic-bezier(0.3, 0.36, 0.6, 1);
         -webkit-animation-timing-function: cubic-bezier(0.3, 0.36, 0.6, 1);
         animation-timing-function: cubic-bezier(0.3, 0.36, 0.6, 1);
    }
     75% {
         webkit-transform: translateY(6.25px);
         -webkit-transform: translateY(6.25px);
         transform: translateY(6.25px);
         webkit-animation-timing-function: cubic-bezier(0.51, -0.05, 0.85, 0.82);
         -webkit-animation-timing-function: cubic-bezier(0.51, -0.05, 0.85, 0.82);
         animation-timing-function: cubic-bezier(0.51, -0.05, 0.85, 0.82);
    }
     100% {
         webkit-transform: translateY(0);
         -webkit-transform: translateY(0);
         transform: translateY(0);
    }
}
/* ------------------------------------------- Base Style ------------------------------------------- */
 .scrollup {
     height: 50px;
     width: 50px;
     background-color: #F81C47;
     border-radius: 50%;
     text-align: center;
     line-height: 50px;
     position: fixed;
     right: 50px;
     bottom: 30px;
     cursor: pointer;
     color: #ffffff;
     transition: .5s;
     z-index: 999;
     display: none;
}
 .bdr-r {
     border-right: 1px solid #ddd;
}
 .scrollup:hover{
     color: #fff;
}
 .scrollup:hover, .buttons-wrap ul li a:hover, .cta:hover, .hire-btn.footer a:hover, .hire-btn a:hover, #pop-contact:hover {
     transform: translateY(-5px);
     box-shadow: 0px 30px 50px 0px rgba(0, 0, 29, 0.1);
}
 .scrollup i {
     font-size: 24px;
     margin-top: 10px;
}
*/
 .hire-btn a:hover, #pop-contact:hover {
     background-color: #fff;
     color: #141f4e;
}
 .hire-btn a, #pop-contact {
     font-weight: 700;
     font-size: 18px;
     color: #fff;
     padding: 15px 36px;
     border-radius: 3px;
     margin-left: 20px;
     border: 1px solid #fff;
     text-transform: capitalize;
}
 .sticky .hire-btn a {
     padding: 10px 30px 
}
/* ------------------------------------------- Hero Area Style ------------------------------------------- */
 .hero-one-area {
     background-repeat: no-repeat;
     background-size: cover;
     background-position: center center;
}
.hero-content h3 {
    font-size: 75px;
    font-weight: 600;
    color: #090F4E;
    line-height: 80.4px;
    text-transform: capitalize;
    display: inline-block;
    margin-bottom: 20px;
}
 .hero-content {
     padding: 210px 0px;
}
 .hero-content h5 {
     font-size: 14px;
     font-weight: 600;
     opacity: .7;
     color: #293FCC;
     background: #F8FAFF;
     display: inline-block;
     padding: 15px;
     border-radius: 10px;
     margin-bottom: 20px;
}
 .hero-one-right-img img {
     width: 100%;
     padding: 170px 0;
	 transform: scale(1.2);
}
 .hero-one-area .hero-content p {
    font-size: 16px;
    color: #63657E;
    font-weight: 400;
    opacity: .7;
    line-height: 32px;
    padding: 0 110px 0 0;
}
 a.hero-btn.one {
     font-size: 18px;
     color: #fff;
     padding: 15px 50px;
     display: inline-block;
     border-radius: 6px;
     background: #293FCC;
     text-align: center;
     margin-right: 40px;
}
a.hero-btn.one:hover {
	background: #6a3aff;
}
 a.hero-btn.two {
     color: #0B0757;
     font-size: 16px;
     line-height: 24px;
     transition: .6s;
}
 a.hero-btn.two i {
     color: #293FCC;
     border: 1px solid #293FCC;
     width: 30px;
     height: 30px;
     font-size: 14px;
     line-height: 30px;
     text-align: center;
     border-radius: 1000%;
     transition: .6s;
     margin-right: 8px;
}
a.hero-btn.two i::before {
    margin-left: 3px;
}
 a.hero-btn.two:hover {
     color: #6a3aff;
}
 a.hero-btn.two:hover i {
     background: #6a3aff;
     color: #fff;
     border-color: #6a3aff;
}
/* -------------------- Hero Two Style --------------------- */
 .hero-two-area .hero-content h1 {
     font-size: 60px;
     font-weight: bold;
     line-height: 73px;
     text-transform: capitalize;
     color: #0B0757;
     margin-bottom: 30px;
}
 .hero-two-area .hero-content h1 span {
     color: #F87AC3;
}
 .hero-two-area .hero-content p {
     font-size: 18px;
     line-height: 28px;
     font-weight: normal;
}
 .hero-two-subcribe-form h6 {
     color: #8480AE;
     font-size: 16px;
     line-height: 28px;
     padding: 0 70px 0 0;
}
 .hero-two-area .hero-content {
     padding: 170px 35px;
}
 .hero-two-right-img {
     padding: 60px 0;
}
 .hero-two-subcribe-form {
     margin-top: 80px;
}
 .qs-imput-subs {
     position: relative;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
     -ms-flex-align: stretch;
     align-items: self-start;
     width: 71%;
}
 .qs-imput-subs > input[type="text"] {
     border-radius: 10px;
     background-color: #F7F5FE;
     padding: 23px;
     color: #8480AE;
     z-index: 0;
     border: none;
     font-size: 14px;
     line-height: 14px;
     font-family: 'Poppins';
     width: 100%;
}
 .qs-imput-subs button.hero-two-subBTn {
     position: absolute;
     right: 8px;
     background: #7264D6;
     color: #fff;
     top: 50%;
     font-size: 14px;
     line-height: 17px;
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
     padding: 16px;
     border-radius: 10px;
     font-weight: bold;
     font-family: 'Poppins';
     transition: .6s;
}
 .qs-imput-subs button.hero-two-subBTn:hover {
     background: #6A35FF;
}
 .qs-imput-subs > input[type="text"]::placeholder {
     color: #8480AE;
     line-height: 14px;
}
 .h-boble.one {
     background: #C7F1FD;
     top: 52%;
     left: 46%;
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
     -webkit-animation: spin1 2s infinite alternate;
     animation: zoom-in-zoom-out 2s ease-out infinite;
     width: 19px;
     height: 19px;
}
 .h-boble.two {
     background: #FFDAF0;
     top: 60%;
     left: 40%;
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
     -webkit-animation: spin1 2s infinite alternate;
     animation: zoom-in-zoom-out 2s ease-out infinite;
     width: 10px;
     height: 10px;
}
 .h-boble.thre {
     background:#DBDAFF;
     top: 83%;
     left: 53%;
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
     -webkit-animation: spin1 2s infinite alternate;
     animation: zoom-in-zoom-out 2s ease-out infinite;
     width: 10px;
     height: 10px;
}
 .h-boble.four {
     background: #DFDAFF;
     top: 23%;
     left: 62%;
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
     -webkit-animation: spin1 2s infinite alternate;
     animation: zoom-in-zoom-out 2s ease-out infinite;
     width: 10px;
     height: 10px;
}
 .h-boble.five {
     background: #FFF2DA;
     bottom: 0;
     left: 78%;
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
     -webkit-animation: spin1 2s infinite alternate;
     animation: zoom-in-zoom-out 2s ease-out infinite;
     width: 10px;
     height: 10px;
}
 @keyframes zoom-in-zoom-out {
     0% {
         transform: scale(1, 1);
    }
     50% {
         transform: scale(1.5, 1.5);
    }
     100% {
         transform: scale(1, 1);
    }
}
 .hero-two-area {
     position: relative;
}
 .QS_booble_class .h-boble {
     position: absolute;
     border-radius: 50%;
     z-index: 1;
}
 .h-boble.six {
     background: #FFF2DA;
     bottom: 0;
     left: 22%;
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
     animation: spin1 35s infinite alternate;
     width: 15px;
     height: 15px;
}
 @keyframes spin1{
     0%{
         transform:rotate(0deg) translate(-70px) rotate(0deg);
    }
     100%{
         transform:rotate(360deg) translate(-50px) rotate(-160deg);
    }
}
/* ------------------- Hero Three Style ------------------- */
 .hero-three .hero-content {
     padding: 200px;
     text-align: center;
}
 .hero-three .hero-content h3 {
     font-size: 60px;
     font-weight: 600;
     line-height: 130%;
     color: #090F4E;
     margin-bottom: 50px;
}
 .hero-three .hero-content p {
     color: #63657E;
     font-size: 18px;
     line-height: 200%;
     font-weight: 400;
     opacity: .7;
     margin-bottom: 50px;
}
 .hero-three-bottom {
     margin-top: -10%;
}
 .hero-three {
     background-size: cover;
     background-repeat: no-repeat;
     background-position: center center;
}
 .qs-hero-three-btn {
     background: #252C64;
     padding: 19px 37px;
     color: #ffffff!important;
     border-radius: 6px;
     box-shadow: 0px 15px 25px rgba(0, 199, 184, 0.08);
     font-size: 18px;
     line-height: 150%;
     font-weight: 600;
     transition: .6s;
     border: 1px solid transparent;
}
 .qs-hero-three-btn:hover {
     background: transparent;
     color: #252C64!important;
     border-color: #252C64;
}
/* ------------------- Hero Four Style ------------------- */
.hero-four-area .hero-content {
    padding: 210px 90px 190px 0;
}
.hero-four-area .hero-content h1 {
    font-size: 55px;
    font-weight: 600;
    line-height: 130%;
    color: #090F4E;
    margin-bottom: 30px;
}
.hero-four-area .hero-content h5 {
    font-size: 16px;
    font-weight: 600;
    opacity: 1;
    color: #090F4E;
    background: #6a35ff17;
    display: inline-block;
    padding: 15px;
    border-radius: 10px;
    margin-bottom: 20px;
    font-family: 'Poppins';
}
.hero-four-area .hero-content p {
    font-size: 18px;
    color: #63657E;
    font-weight: 400;
    line-height: 32px;
	margin: 0;
}
.app-store-img {
    margin-top: 30px;
}
.hero-four-right-img {
    text-align: center;
    position: relative;
    z-index: 1;
}
.hero-four-right-img img {
    width: 44%;
    margin-top: 30%;
    z-index: 1;
}
.hero-four-right-img::before {
    position: absolute;
    content: "";
    width: 450px;
    height: 450px;
    bottom: 60px;
    left: 0;
    background: #6a35ff70;
    z-index: -1;
    border-radius: 64%;
    right: 0;
    margin: 0 auto;
}
.hero-four-right-img::after {
    position: absolute;
    content: "";
    width: 550px;
    height: 550px;
    bottom: 15px;
    left: 0;
    background: #6a35ff70;
    z-index: -2;
    border-radius: 64%;
    right: 0;
    margin: 0 auto;
}
.app-store-img a {
    margin-right: 30px;
    background: transparent;
    display: inline-block;
}
/* ------------------- Hero Five  Style ------------------- */
.hero-five-area {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: left center;
}
.hero-five-area .hero-content h3 {
    font-size: 63px;
    font-weight: 700;
    line-height: 73px;
}
.hero-five-right-img {
    width: 128%;
    margin-top: 24%;
}
.hero-five-area .hero-content p {
    font-size: 18px;
}
.hero-five-area a.hero-btn.two:hover {
	text-decoration: underline;
}
.hero-five-area a.hero-btn.one:hover {
    background: #6a35ff;
    color: #fff;
}
/* ------------------- Hero Six  Style ------------------- */
.hero-six-area .hero-content {
    text-align: left;
}
.hero-six-area .hero-content h5 {
	opacity: 1;
}
.hero-six-area .hero-content h3 {
	font-size: 70px;
}
.hero-six-area .hero-content p {
    margin-bottom: 40px;
}
.hero-six-right-img {
    width: 100%;
    margin-top: 20%;
}
.hero-six-area .hero-content a.hero-btn.two i {
    color: #ffffff;
	border: 1px solid #ffffff;
}
.hero-six-area .hero-content a.hero-btn.two:hover i{
	border-color: #293fcc;
	background: #293fcc;
}
.hero-six-area .hero-content a.hero-btn.two:hover { 
	color: #293fcc!important;
}
.hero-six-area {
    position: relative;
    z-index: 1;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}
.hero-six-area::after {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: #090f4e;
    z-index: -1;
    opacity: .4;
}

.qs-hero-slider .owl-nav button {
    position: absolute;
    top: 50%;
    width: 100%;
}
.qs-hero-slider .owl-nav button.owl-next {
    text-align: right;
    right: -20%;
}
.qs-hero-slider:hover .owl-nav button.owl-next {
      right: 20px;
}
.qs-hero-slider .owl-nav button.owl-prev {
    text-align: left;
    left: -20%;
}

.qs-hero-slider:hover .owl-nav button.owl-prev {
    left: 20px;
}

.qs-hero-slider .owl-nav button.owl-prev i, .qs-hero-slider .owl-nav button.owl-next i {
    font-size: 20px;
    background: #293fcc;
    width: 50px;
    height: 50px;
    display: inline-block;
    text-align: center;
    color: #fff;
    border-radius: 30px;
    line-height: 50px;
    transition: .5s;
}
.qs-hero-slider .owl-item.active .hero-six-area .hero-content h3 {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  animation-name: fadeInLeft;
  animation-delay: 0.5s;
}
.qs-hero-slider .owl-item.active .hero-six-area .hero-content h5 {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  animation-name: fadeInLeft;
  animation-delay: 0.3s;
}
.qs-hero-slider .owl-item.active .hero-six-area .hero-content p {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  animation-name: fadeInUp;
  animation-delay: 0.7s;
}
.qs-hero-slider .owl-item.active .hero-six-area .hero-content a.hero-btn {
  -webkit-animation-duration: 1s;
  animation-duration: 1.3s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  animation-name: fadeInUp;
  animation-delay: 0.9s;
}
.qs-hero-slider .owl-item.active .hero-six-area .hero-content a.hero-btn.two {
  -webkit-animation-duration: 1s;
  animation-duration: 1.3s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  animation-name: fadeInUp;
  animation-delay: 0.9s;
}
.owl-carousel .owl-stage-outer {
    /* override */
/*     overflow: initial; */
}
/* ------------------- Section Title ------------------- */
 .qs-section-title h5 {
     font-size: 14px;
     font-weight: 600;
     line-height: 200%;
     display: inline-block;
     padding: 10px 30px;
     border-radius: 10px;
     margin-bottom: 12px;
}
 .qs-section-title h2 {
     font-size: 30px;
     font-weight: 600;
     line-height: 45px;
     color: #090F4E;
     margin-bottom: 30px;
}
 .qs-section-title p {
     font-size: 18px;
     font-weight: 400;
     line-height: 36px;
     color: #63657E;
}
/*------------------ Pricing area -------------------- */
 h2.QS-p-m {
     DISPLAY: NONE;
}
 .price-swetch {
     text-align: center;
     margin-bottom: 100px;
}
 .single-pricing-table {
     text-align: left;
     padding: 40px 30px;
     background: #fff;
     transition: .6s;
     border: 2px solid #F5F6FA;
     border-radius: 15px;
     box-sizing: border-box;
     margin: 0px 5px;
}
 .single-pricing-table:hover {
     box-shadow: 0px 20px 47px rgba(0, 0, 0, 0.05);
}
 .single-pricing-table h4 {
     font-size: 28px;
     font-weight: 600;
     line-height: 39px;
     padding-bottom: 20px;
     margin: 0;
}
 .single-pricing-table p {
     font-size: 16px;
     font-weight: normal;
     width: 250px;
     margin: 0;
}
 .single-pricing-table h2 {
     font-size: 42px;
     font-weight: 600;
     padding: 20px 0 30px;
     line-height: 51px;
     margin-bottom: 30px;
     border-bottom: 1px solid #F5F6FA;
}
 .single-pricing-table h2 span {
     font-size: 16px;
     font-weight: 500;
     line-height: 22px;
     margin-left: 14px;
}
 .single-pricing-table ul li {
     font-size: 14px;
     padding-bottom: 10px;
     font-weight: normal;
     text-transform: capitalize;
     line-height: 22px;
     position: relative;
     margin-left: 30px;
}
 .single-pricing-table ul li::after {
     position: absolute;
     content: "\f00c ";
     background: #E5F1FF;
     width: 24px;
     height: 24px;
     left: -30px;
     color: #377DFF;
     font-family: 'FontAwesome';
     text-align: center;
     line-height: 24px;
     border-radius: 40px;
}
 .single-pricing-table .price-btn {
     border: 1px solid;
     line-height: 24px;
     text-align: center;
     display: block;
     padding: 18px 30px;
     margin-top: 30px;
     transition: .6s;
     border-radius: 10px;
     font-size: 20px;
     font-weight: 500;
}
 .toggler {
     position: relative;
     font-size: 18px;
     line-height: 24px;
     font-weight: 500;
     color: #63657E;
}
 .toggle, .toggler {
     display: inline-block;
     vertical-align: middle;
     margin: 10px;
}
 .b {
     display: block;
}
 .toggle {
     position: relative;
     width: 65px;
     height: 26px;
     border-radius: 100px;
     background-color: #42ca8c;
     overflow: hidden;
     box-shadow: inset 0 0 2px 1px rgba(0, 0, 0, 0.05);
}
 .check {
     position: absolute;
     display: block;
     cursor: pointer;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     opacity: 0;
     z-index: 6;
}
 .check:checked ~ .switch {
     right: 2px;
     left: 60.5%;
     transition: 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86);
     transition-property: left, right;
     transition-delay: .08s, 0s;
}
 .switch {
     position: absolute;
     left: 4px;
     top: 3px;
     bottom: 2px;
     right: 57.5%;
     background-color: #fff;
     border-radius: 36px;
     z-index: 1;
     transition: 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86);
     transition-property: left, right;
     transition-delay: 0s, .08s;
     box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
     width: 20px;
     height: 20px;
}
/* ------------------------------------------- Service Area Style ------------------------------------------- */
 .quickspace-service-box:hover {
     box-shadow: 0px 20px 47px rgba(0, 0, 0, 0.05);
}
 .quickspace-service-box {
     transition: .6s;
     padding: 40px 30px;
     border-radius: 10px;
     background: #fff;
}
 .quickspace-service-icon {
     width: 106px;
     height: 106px;
     border-radius: 20px;
     margin-bottom: 20px;
     text-align: center;
     padding: 32px 0;
}
.quickspace-service-icon img {
    width: 34%;
}
 .quickspace-service-box h4 {
     font-size: 24px;
     font-weight: 600;
     line-height: 36px;
     color: #090F4E;
     margin-bottom: 20px;
}
 .quickspace-service-box p {
     font-size: 16px;
     color: #63657E;
     line-height: 28px;
     font-weight: 400;
}
 .quickspace-service-icon i {
     font-size: 40px;
     text-align: center;
}
 a.qs-service-btn {
     font-size: 16px;
     color: #282D648C;
     line-height: 24px;
     font-weight: 600;
     transition: .6s;
}
 .quickspace-service-box:hover a.qs-service-btn {
     color: #293fcc;
}
 a.qs-service-btn i {
     font-size: 18px;
     margin-left: 5px;
     transition: .6s;
}
 .quickspace-service-box:hover a.qs-service-btn i {
     margin-left: 10px;
}
/*service page about page vector bg*/
.qs-progressbg::before, .aboutpagevector::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: -90px;
    background-image: url(http://wpdemo.smartsoftfirm.com/quickspace/wp-content/uploads/2022/03/Vector-14.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center; 
	z-index: 0;
}
/* ----------------------------- portfolio Style ----------------------------- */


.portfolio-menu ul li.active {
    background: rgba(41, 63, 204, 0.1);
    color: #293FCC;
}
.portfolio-menu ul li {
    font-size: 16px;
    font-weight: 500;
    border: 1px solid #efefef;
    
    border-radius: 6px;
    line-height: 42px;
    display: inline-block;
    padding: 8px 15px;
    outline: none;
    background: none;
    color: #090f4e;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    margin-right: 20px;
    margin-bottom: 10px;
cursor: pointer;text-transform: capitalize;}


.portfolio-menu {margin: 50px 0;}

.portfolio-menu h2 {margin-bottom: 50px;font-size: 60px;text-transform: capitalize;}

.qs-single-portfolio {width: 30%;margin: 0px 15px 30px 15px;}

.qs-single-portfolio > img {width: 100%;height: 300px!important;border-radius: 30px!important;}

.portfolio-content a {font-size: 20px;font-weight: 500;line-height: 30px;color: #ffffff;}

.portfolio-wrapper {position: absolute;top: 0%; text-align: center;margin: 0 auto;left: 0;right: 0;background: rgba(41, 63, 204, 0.5);width: 100%;height: 100%;transition: .9s;overflow: hidden;visibility: hidden;opacity: 0;border-radius: 31px;}


.portfolio-content {position: absolute;bottom: 0;left: 0;right: 0;margin: 0 auto;transition: .9s;}

.qs-single-portfolio:hover .portfolio-wrapper {top: 0%;visibility: visible;overflow: visible;opacity: 1;}

.qs-single-portfolio:hover .portfolio-content {bottom: 10%;}

/*portfolio single page*/
.porfolio-sidebar {padding: 30px;}

.porfolio-sidebar a {font-size: 16px;display: block;padding: 10px;border: 2px solid #f3f7ff;margin: 5px;border-radius: 3px;}

.porfolio-sidebar h2 {font-size: 24px;margin-bottom: 30px;text-transform: capitalize;border-bottom: 1px solid #293fcc;display: inline-block;}

.porfolio-sidebar a:hover {background: #293fcc;color: #fff;}
.qucikspace-internal-area.portfolio .portfolio-details .post-thumb img {
    width: 540px;
    height: 330px;
}
/* ----------------------------- Service Box Two Style ----------------------------- */
 .quickspace-service-box-two {
     text-align: center;
     transition: .6s;
     background: #fff;
     padding: 0px 0px 10px 0px;
}
 .quickspace-service-box-two:hover {
     box-shadow: 0px 20px 47px rgb(0 0 0 / 5%);
     border-radius: 10px;
}
 .quickspace-service-img {
     max-width: 265px;
     height: 130px;
     text-align: center;
     margin: 0 auto;
}
 .quickspace-service-img img {
     width: 100%;
}
 .quickspace-service-box-two h3 {
     font-size: 18px;
     line-height: 10px;
     padding-top: 40px;
     padding-bottom: 15px;
     color: #0B0757;
     font-weight: bold;
}
 .quickspace-service-box-two p {
     font-size: 12px;
     line-height: 12px;
     color: #8480AE;
     font-weight: 400;
}
/* -------------- Promo section style --------------- */
 .qs-promo-one {
     position: relative;
}
 .qs-promo-one-right-img {
     width: 120%;
}
 .qs-promo-one-right-img img {
     width: 638px;
     height: 562px;
     margin-left: -30px;
}
 .qs-promo-content h5 {
     font-size: 16px;
     line-height: 28px;
     color: #8480AE;
     font-weight: bold;
     margin-bottom: 28px;
}
 .qs-promo-content h3 {
     font-size: 45px;
     line-height: 48px;
     font-weight: 700;
     color: #0B0757;
     margin-bottom: 35px;
}
 .qs-promo-content p {
     font-size: 18px;
     line-height: 28px;
     font-weight: 400;
     color: #B4B2C9;
     margin-bottom: 35px;
}
 a.qs-pro-btn {
     padding: 15px 30px;
     background: #7264D6;
     color: #fff;
     border-radius: 10px;
     font-size: 14px;
     line-height: 17px;
     font-weight: 700;
     display: inline-block;
}
 a.qs-pro-btn:hover {
     background: #6A35FF;
}
 .qs-promo-content {
     padding: 100px 0;
}
 .h-boble.p-one {
     background: #FFDADA;
     top: 11%;
     left: 14%;
     animation: zoom-in-zoom-out 2s ease-out infinite;
     width: 10px;
     height: 10px;
}
 .h-boble.p-two {
     background: #DAE9FF;
     top: -6%;
     left: 46%;
     animation: zoom-in-zoom-out 2s ease-out infinite;
     width: 10px;
     height: 10px;
}
 .h-boble.p-thre {
     background: #FFF5DA;
     top: 0%;
     left: 98%;
     animation: zoom-in-zoom-out 2s ease-out infinite;
     width: 10px;
     height: 10px;
}
 .h-boble.p-four {
     background: #FFF5DA;
     bottom: -10%;
     left: 5%;
     animation: zoom-in-zoom-out 2s ease-out infinite;
     width: 10px;
     height: 10px;
}
 .h-boble.p-five {
     background: #DAE0FF;
     bottom: -0%;
     left: 57%;
     animation: zoom-in-zoom-out 2s ease-out infinite;
     width: 10px;
     height: 10px;
}
 .h-boble.p-six {
     background: #DAE9FF;
     bottom: 20%;
     right: -3%;
     animation: zoom-in-zoom-out 2s ease-out infinite;
     width: 20px;
     height: 20px;
}
 .h-boble.p-seven {
     width: 340px;
     height: 340px;
     background: #F7F5FE;
     left: -22%;
     z-index: -1;
     top: 17%;
}
/* ------------------------ Promo Two ------------------------- */
 .qs-promo-two-right-img {
     width: 120%;
}
 .h-boble.p2-one {
     width: 398px;
     height: 398px;
     background: #F0FAFF;
     z-index: -1;
     left: 31%;
     top: -10%;
}
 .h-boble.p2-two {
     width: 364px;
     height: 364px;
     background: #F7F5FE;
     z-index: -1;
     right: -19%;
     top: 56%;
}
 .h-boble.p2-thre {
     width: 219px;
     height: 219px;
     background: #F0FAFF;
     z-index: -1;
     left: -23%;
     bottom: -23%;
}
 .h-boble.p2-four {
     width: 19px;
     height: 19px;
     background: #C7F1FD;
     left: 20%;
     animation: zoom-in-zoom-out 2s ease-out infinite;
}
 .h-boble.p2-five {
     width: 10px;
     height: 10px;
     background: #FFDADA;
     right: 0;
     top: -20%;
     animation: zoom-in-zoom-out 2s ease-out infinite;
}
 .h-boble.p2-six {
     width: 10px;
     height: 10px;
     background: #C7F1FD;
     left: 30%;
     bottom: 15%;
     animation: zoom-in-zoom-out 2s ease-out infinite;
}
 .h-boble.p2-seven {
     width: 10px;
     height: 10px;
     background: #FFDADA;
     right: 13%;
     bottom: -4%;
     animation: zoom-in-zoom-out 2s ease-out infinite;
}
 .h-boble.p2-eight {
     width: 10px;
     height: 10px;
     background: #FFECDA;
     right: 40%;
     bottom: 8%;
     animation: zoom-in-zoom-out 2s ease-out infinite;
}
/* --------------- Package Plan Box --------------- */
 .quickspace-Packageplan-box {
     padding: 48px 36px;
     border-radius: 40px;
}
 .quickspace-Packageplan-box h2 {
     font-size: 36px;
     line-height: 44px;
     font-weight: 600;
     margin-bottom: 20px;
}
 .quickspace-Packageplan-box p {
     font-size: 18px;
     line-height: 28px;
     font-weight: normal;
}
 a.qs-packageplan-btn {
     padding: 15px 30px;
     font-size: 14px;
     line-height: 17px;
     font-weight: bold;
     border-radius: 14px;
     margin-right: 16px;
}
 a.qs-packageplan-btn:hover {
     background: #6A35FF!important;
     color: #fff!important;
}
 .Packageplan-butto span {
     font-size: 18px;
     line-height: 100%;
     font-weight: 500;
}
/* ------------------------------------------- Testimonial Area Style ------------------------------------------- */
/* .single-testimonial {
     border-left: 1px solid #ddd;
}
 */
 .single-testimonial {
     text-align: left;
     padding: 40px 0;
     position: relative;
     cursor: e-resize;
}
 .quickspace-testimonial-stitle {
     position: relative;
}
 .quickspace-testimonial-stitle h2 {
     font-size: 48px;
     font-weight: 600;
     line-height: 60px;
     color: #090F4E;
     letter-spacing: 0.2px;
}
 span.qs-testi-quote i {
    font-size: 32px;
    font-weight: 900;
    color: #fff;
}
 span.qs-testi-quote {
     background: #13A6FA;
     width: 100px;
     height: 100px;
     display: block;
     text-align: center;
     line-height: 100px;
     border-radius: 100%;
     position: absolute;
     top: -60px;
     z-index: -1;
     left: -50px;
}
 .testimonial-content h3 {
     font-size: 24px;
     font-weight: 400!important;
     line-height: 40px;
     color: #090F4E;
     letter-spacing: 0.16px;
}
 .testimonial-content p {
     font-size: 15px;
     line-height: 28px;
     font-weight: normal;
     margin: 16px 0;
     width: 80%;
}
 .author-details {
     display: flex;
     align-items: flex-start;
     margin-top: 40px;
}
 .author-image {
     width: 60px;
     height: 60px;
     overflow: hidden;
     margin-right: 20px;
     border-radius: 50%;
}
 .author-details-content {
     flex: 1;
     align-self: center;
}
 .author-details-content h5 {
     font-size: 16px;
     line-height: 24px;
     font-weight: 600;
     color: #090F4E;
     text-transform: capitalize;
}
 .author-details-content span {
     font-size: 14px;
     line-height: 28px;
     font-weight: normal;
     text-transform: capitalize;
}
 .testimonial {
     height: 400px;
}
 .testimonial .owl-nav button {
     position: absolute;
     top: -100px;
     right: 0;
}
 .testimonial .owl-nav button i {
     font-size: 20px;
     line-height: 30px;
     font-weight: 600;
     color: #63657E;
     transition: .6s;
     display: inline-block;
}
 .testimonial .owl-nav button.owl-prev {
     display: inline-block;
     overflow: hidden;
     WIDTH: 50px;
     margin-right: 15px;
}
 .testimonial .owl-nav button i .testimonial .owl-nav button i {
     font-size: 30px;
     line-height: 30px;
     font-weight: 600;
     color: #63657E;
     transition: .6s;
     display: inline-block;
     margin: 0 -15px;
}
 .testimonial .owl-nav button.owl-prev:hover i {
     font-size: 30px;
     line-height: 27px;
     color: #090F4E;
     margin-left: -15px;
}
 .testimonial .owl-nav button.owl-next:hover i {
     font-size: 30px;
     line-height: 27px;
     color: #090F4E;
     margin-right: -15px;
}
.testimonial .owl-item {
    /* position: absolute; */
    left: -280px;
    /* float: left; */
    /* margin: 0; */
    /* padding: 0; */
    max-width: 550px;
}
  .testimonial .owl-item.active.center {
     border-right: 2px solid #EBF0F4;
     margin-right: 80px!important;
     padding-right: 0;
}

/*Testimonial Style 2 */
.single-testimonial.style-2 {
  background-color: #f3f7ff;
  border-radius: 40px 0 40px 0;
  display: block;
	text-align: center;
  padding: 30px 20px;
  border-bottom: none;
}
.single-testimonial.style-2 .testimonial-content p {
    font-size: 16px;
    color: #090F4E;
    margin: 0px!important;
	width: 100%;
}
.single-testimonial.style-2 .author-details {
    display: block;
    align-items: flex-start;
    margin-top: 0;
}
.ratting a {
    color: #f70b48;
}
.single-testimonial.style-2 .author-details h4 {
    font-size: 18px;
    margin-top: 5px;
}
.single-testimonial.style-2 .author-image {
  width: 100px;
  height: 100px;
	margin: 0 auto;
}
.single-testimonial.style-2 .testimonial-content p {
  padding: 20px 0;
}
/* ------------------------------------------- Team Style -------------------------------------------*/
.qs-team .qs-team-social {opacity: 0;transition: .6s;visibility: hidden; margin-top: 10px;}
.qs-team:hover .qs-team-social { opacity: 1; visibility: visible; margin-top: 0px;}
/* ------------------------------------------- NewsLetter Area Style ------------------------------------------- */
 .quickspace-newsletter h2 {
     font-size: 36px;
     line-height: 54px;
     font-weight: 600;
}
 .quickspace-newsletter {
     text-align: center;
}
 .quickspace-newsletter p {
     font-size: 18px;
     line-height: 30px;
     font-weight: normal;
     color: #63657E;
     padding: 0 30px;
}
 .quickspace-newsletter {
     width: 480px;
     margin: 0 auto;
}
 .quickspace-newsletter-form input[type=text] {
     background: #fff;
     border: 1px solid #fff;
     border-radius: 50px;
     width: 100%;
     text-align: center;
     font-size: 14px;
     line-height: 28px;
}
 input[type="text"]::placeholder {
    color: rgba(11, 7, 87, 0.2);
    font-weight: normal;
}
 .quickspace-newsletter-form button.submit {
     position: absolute;
     top: 0;
}
 button.qs-ns {
     position: absolute;
     top: 15%;
     right: 2%;
     width: 45px;
     height: 45px;
     background: #293fcc;
     border-radius: 50px;
     transition: .6s;
}
 button.qs-ns:hover {
     background: #6A35FF;
}
 .quickspace-newsletter-form {
     position: relative;
}
 button.qs-ns i {
     color: #fff;
     font-size: 20px;
     font-weight: 600;
}
/* ------------------------------------------- Fun Fact Style ------------------------------------------- */
 .qs-funfact-content h2 {
     font-size: 44px;
     font-weight: 600;
     line-height: 160%;
}
 .qs-funfact-box {
     padding: 40px;
     border-radius: 20px;
     box-shadow: 0px 20px 47px rgba(0, 0, 0, 0.03);
}
 .qs-funfact-content span {
     font-size: 20px;
     line-height: 36px;
     font-weight: 500;
     color: #090F4E;
}
/* ------------------------------------------- Contact Form Area ------------------------------------------- */
 .qscontact-form input[type="text"] {
     border: 1px solid #ffffff;
     color: rgba(11, 7, 87, 0.5);
     font-weight: 300;
     height: 68px;
     padding: 20px 24px;
     width: 100%;
     border-radius: 12px;
     font-size: 14px;
     line-height: 28px;
     border: none;
     text-transform: capitalize;
     font-family: "Poppins", sans-serif;
}
 .qscontact-form textarea {
     font-size: 14px;
     border: none;
     border-radius: 12px;
     line-height: 28px;
     color: rgba(11, 7, 87, 0.5);
     padding: 20px 24px;
     font-family: "Poppins", sans-serif;
     height: 180px;
}
 .qscontact-form textarea::placeholder, .qscontact-form input[type="text"]::placeholder {
     color: rgba(11, 7, 87, 0.5);
     font-size: 14px;
     font-weight: normal;
     font-family: "Poppins", sans-serif;
     line-height: 28px;
}
 .qscontact-form input[type="submit"] {
     font-size: 18px;
     color: #fff;
     padding: 17px 55px;
     display: block;
     border-radius: 6px;
     background: #293FCC;
     text-align: center;
     transition: .6s;
     font-weight: 600;
     font-family: "Poppins", sans-serif;
     line-height: 27px;
}
 .qscontact-form input[type="submit"]:hover {
     background: #6A35FF;
}
/* ------------------------------------------- Blog Box Area ------------------------------------------- */
.qs-blog-box h3 {
    text-align: center;
    margin-bottom: 50px;
}
.qs-blog-box .single-blog {
    position: relative;
    overflow: hidden;
    margin-right: 10px;
}
.qs-blog-box .single-blog::after {
    width: 100%;
    height: 100%;
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    background: rgba(9, 15, 78, 0.3);
    z-index: 0;
    opacity: 1;
    transition: .5s;
}
.qs-blog-box .single-blog:last-child {
    margin-right: 0;
}
.qs-blog-box .single-blog img {
    height: 400px!important;
    transition: transform .5s ease;
    width: 100%;
}
.qs-blog-box .single-blog:hover img {
  transform: scale(1.1) rotate(5deg);
}
.qs-blog-box .blog-meta {
  margin-bottom: 10px;
}
.qs-blog-box .blog-content {
    position: absolute;
    bottom: 0;
    color: #fff;
    text-align: center;
    background: linear-gradient(to top, #212529ab 0%, rgba(19, 19, 19, -0.12) 100%);
    padding: 30px 30px;
    z-index: 1;
}
.qs-blog-box .blog-content h2 {
    font-size: 26px;
    color: #fff;
    font-weight: 600;
    text-transform: capitalize;
    transition: .5s;
}
.qs-blog-box .blog-content a {
  transition: .5s;
}
.qs-blog-box .blog-content a:hover h2 {
  opacity: .9;
}
.qs-blog-box .blog-meta ul li {
  display: block;
  font-size: 16px;
  text-transform: capitalize;
}
.qs-blog-box .blog-meta ul li i {
  margin-right: 5px;
}
/*some of element style*/
.qs-progressbg {
background: linear-gradient(178.7deg, rgba(234, 240, 255, 0) 1.11%, #d7e2ff6b 53.76%, rgba(234, 240, 255, 0) 103.22%);
    
}
.elementor-tab-content {
	border-radius: 20px;
}
/*=======================================================================
  Responsive Media Query Code 
=======================================================================*/
 @media only screen and (min-width: 1400px) {
	  a.logo-theme img {
    max-width: 160px;
}
}
 @media only screen and (min-width: 1024px) and (max-width: 1200px) {
    /*hero one*/
     .hero-one-area .hero-content h3 {
         font-size: 50px;
         line-height: 55px;
    }
     .hero-one-area .hero-content p {
         font-size: 14px;
         line-height: 28px;
		 padding: 0;
    }
     a.hero-btn.one {
         padding: 15px 30px;
         margin-right: 20px;
    }
    /*hero two*/
     .hero-two-area .hero-content {
         padding: 120px 50px;
    }
     .hero-two-area .hero-content h1 {
         font-size: 37px;
         line-height: 46px;
         margin-bottom: 20px;
    }
     .hero-two-area .hero-content p {
         font-size: 16px;
         line-height: 28px;
         font-weight: normal;
    }
     .hero-two-subcribe-form {
         margin-top: 0;
    }
     .hero-two-subcribe-form h6 {
         font-size: 16px;
         line-height: 28px;
         padding: 0 0 0 0;
    }
     .qs-imput-subs {
         width: 100%;
    }
     .qs-imput-subs > input[type="text"] {
         width: 100%;
    }
    /*hero three*/
     .hero-three .hero-content {
         padding: 200px 120px;
    }
	 	 /*hero four*/
	 .hero-four-area .hero-content h1 {
		font-size: 38px;
	}
	 .hero-four-area .hero-content h5 {
		font-size: 14px;
		margin-bottom: 10px;
	}
	 .hero-four-area .hero-content p {
		font-size: 15px;
		line-height: 30px;
		margin: 0;
	}
	 .hero-four-right-img {
		margin-top: 10%;
	}
	 .hero-four-right-img::before {
		width: 350px;
		height: 350px;
		bottom: 15px;
	}
	 .hero-four-right-img::after {
		width: 450px;
		height: 450px;
		bottom: -34px;
	}
	 /*hero six*/
	 .hero-six-area .hero-content h3 {
		font-size: 50px;
		line-height: 60px;
	}
    /*promo box*/
     .qs-promo-content h3 {
         font-size: 37px;
    }
     .qs-promo-content p {
         font-size: 16px;
    }
    /*service one*/
     .quickspace-service-box {
         padding: 30px 25px;
    }
    /*testimonial*/
     .quickspace-testimonial {
         padding: 50px;
    }
     .quickspace-testimonial-stitle h2 {
         font-size: 40px;
         line-height: 50px;
    }
     span.qs-testi-quote {
         top: -60px;
         left: -50px;
    }
     .testimonial .owl-nav button {
         top: -20%;
    }
     .testimonial-content h3 {
         font-size: 20px;
         line-height: 30px;
    }
     .testimonial-content p {
         font-size: 14px;
         line-height: 27px;
         margin: 16px 0;
         width: 90%;
    }
     .testimonial .owl-item.active {
         margin-left: 45px;
    }
    .testimonial .owl-item.active.center {
         margin-right: 0px!important;
    }
    /*pricing table*/
     .single-pricing-table h2 {
         padding: 20px 0 15px;
         margin-bottom: 15px;
    }
     .single-pricing-table h2 span {
         display: block;
    }
     .single-pricing-table .price-btn {
         padding: 18px 0;
         font-size: 16px;
         font-weight: 600;
    }
    /*funfact*/
     .qs-funfact-box {
         padding: 26px;
    }
	 /*service and about page vector bg*/
	 .qs-progressbg::before, .aboutpagevector::before {
		top: -203px;
		background-size: contain;
		}
}
 @media only screen and (min-width: 768px) and (max-width: 1023px) {
    /*hero one*/
     .hero-one-area .hero-content {
         padding: 150px 0px;
    }
     .hero-one-right-img img {
         padding: 130px 0;
    }
     .hero-one-area .hero-content h3 {
         font-size: 44px;
         line-height: 50px;
         margin-bottom: 20px;
    }
    .hero-one-area .hero-content p {
         font-size: 14px;
         line-height: 30px;
		 padding: 0 30px 0px 0;
    }
     a.hero-btn.one {
         padding: 14px 32px;
         margin-right: 10px;
    }
    /*hero two*/
     .hero-two-area .hero-content {
         padding: 100px 20px;
    }
     .hero-two-area .hero-content h1 {
         font-size: 34px;
         line-height: 50px;
    }
     .hero-two-area .hero-content p {
         font-size: 16px;
    }
     .hero-two-subcribe-form {
         margin-top: 0;
    }
     .hero-two-subcribe-form h6 {
         font-size: 15px;
         line-height: 28px;
         padding: 0;
    }
     .qs-imput-subs, .qs-imput-subs > input[type="text"] {
         width: 100%;
    }
     .qs-imput-subs button.hero-two-subBTn {
         padding: 14px;
    }
    /*hero three*/
     .hero-three .hero-content {
         padding: 150px 50px;
    }
     .hero-three .hero-content h3 {
         font-size: 45px;
         margin-bottom: 30px;
    }
	/*hero three*/
     .hero-three .hero-content {
         padding: 200px 120px;
    }
	 	 /*hero four*/
	 .hero-four-area .hero-content {
		padding: 180px 10px 190px 0;
	}
	 .hero-four-area .hero-content h1 {
		font-size: 38px;
	}
	.hero-four-area .hero-content h5 {
		font-size: 12px;
		margin-bottom: 10px;
		padding: 12px 10px;
	}
	 .hero-four-area .hero-content p {
		font-size: 15px;
		line-height: 30px;
		margin: 0;
	}
	 .hero-four-right-img {
		margin-top: 10%;
	}
	 .hero-four-right-img::before {
		width: 300px;
		height: 300px;
		bottom: 6px;
	}
	 .hero-four-right-img::after {
		width: 350px;
		height: 350px;
		bottom: -20px;
	}
	 /*hero six*/
	 .hero-six-area .hero-content h3 {
		font-size: 38px;
		line-height: 48px;
	}
	 .hero-six-area .hero-content h5 {
		 margin-bottom: 0;
	 }
    /*service two*/
     .quickspace-service-img {
         height: 110px;
    }
     .quickspace-service-box-two h3 {
         padding-top: 0;
         padding-bottom: 15px;
    }
    /*promo box*/
     .qs-promo-content {
         padding: 10px 0;
    }
     .qs-promo-content h3 {
         font-size: 28px;
         line-height: 38px;
         margin-bottom: 20px;
    }
     .qs-promo-content p {
         font-size: 14px;
         line-height: 24px;
         margin-bottom: 24px;
    }
     .qs-promo-content h5 {
         font-size: 14px;
         line-height: 24px;
         margin-bottom: 10px;
    }
     .qs-promo-two .qs-promo-content h3 {
         font-size: 26px;
         width: 94%;
    }
    /*pckage plan*/
     .quickspace-Packageplan-box {
         padding: 40px 30px;
    }
     .quickspace-Packageplan-box h2 {
         font-size: 28px;
        ;
    }
    /*section title*/
     .qs-section-title h2 {
         font-size: 30px!important;
         line-height: 35px;
         margin-bottom: 10px;
    }
     .qs-section-title p {
         font-size: 14px;
         line-height: 28px;
    }
    /*service one*/
     .quickspace-service-box {
         padding: 25px;
    }
     .quickspace-service-box h4 {
         font-size: 16px;
         line-height: 20px;
         margin-bottom: 10px;
    }
     .quickspace-service-box p {
         font-size: 14px;
         line-height: 24px;
    }
     a.qs-service-btn {
         font-size: 14px;
         line-height: 20px;
    }
    /*pricing*/
     .single-pricing-table {
         padding: 25px 20px;
    }
     .single-pricing-table h4 {
         font-size: 22px;
         line-height: 26px;
         padding-bottom: 10px;
    }
     .single-pricing-table p {
         font-size: 12px;
         font-weight: 400;
         width: 105%;
         margin: 0;
         line-height: 20px;
    }
     .single-pricing-table h2 {
         font-size: 35px;
         padding: 20px 0 15px;
         line-height: 51px;
         margin-bottom: 15px;
    }
     .single-pricing-table h2 span {
         font-size: 14px;
         font-weight: 500;
         line-height: 22px;
         margin-left: 0;
         display: block;
    }
     .single-pricing-table ul li {
         font-size: 13px;
         padding-bottom: 10px;
         line-height: 22px;
         margin-left: 20px;
    }
     .single-pricing-table ul li::after {
         width: 20px;
         height: 20px;
         line-height: 20px;
         top: 2px;
    }
     .single-pricing-table .price-btn {
         line-height: 16px;
         padding: 15px 10px;
         font-size: 11px;
         font-weight: 600;
         letter-spacing: 0.3px;
    }
	 /*portfoliio*/
	 .qs-single-portfolio {
		width: 25%;
	 }
	 .qs-single-portfolio > img {
		height: 200px!important;
	}
	 /*portfolio single page*/
	 .porfolio-sidebar {
		padding: 0;
	}
	.porfolio-sidebar a {
		font-size: 14px;
		display: block;
		padding: 10px 15px;
	}
    /*newsletter*/
     .quickspace-newsletter h2 {
         font-size: 26px;
         line-height: 40px;
    }
     .quickspace-newsletter p {
         font-size: 16px;
         line-height: 24px;
    }
     .quickspace-newsletter-form input[type=text] {
         width: 60%;
    }
     button.qs-ns {
         right: 22%;
    }
    /*testomonial*/
     .quickspace-testimonial-stitle h2 {
         font-size: 34px;
         line-height: 46px;
    }
     .testimonial .owl-item.active.center {
         border-right: 2px solid #EBF0F4;
         margin-right: 50px!important;
         padding-right: 0;
         margin-left: 100px;
    }
     .author-details-content h5 {
         font-size: 14px;
         line-height: 16px;
    }
     .testimonial-content p {
         font-size: 13px;
         line-height: 27px;
         margin: 16px 0;
         width: 85%;
    }
     .author-details {
         margin-top: 25px;
    }
     .testimonial-content h3 {
         font-size: 16px;
         font-weight: 500!important;
         line-height: 30px;
         letter-spacing: 0.16px;
    }
     .author-details-content span {
         font-size: 12px;
         line-height: 24px;
    }
     span.qs-testi-quote {
         width: 70px;
         height: 70px;
         line-height: 80px;
         top: -47px;
         left: -29px;
    }
     .testimonial .owl-nav button {
         top: -18%;
         right: 30px;
         margin-right: 15px;
    }
    /*funfact*/
     .qs-funfact-box {
         padding: 30px 20px;
    }
     .qs-funfact-content h2 {
         font-size: 30px;
         font-weight: 600;
         line-height: 118%;
         margin-bottom: 0;
    }
     .qs-funfact-content span {
         font-size: 12px;
         line-height: 24px;
         font-weight: 600;
    }
	 	 /*service and about page vector bg*/
	 .qs-progressbg::before, .aboutpagevector::before {
		top: -130px;
		background-size: contain;
		}
}
 @media only screen and (max-width: 767px) {
	 .QS_booble_class .h-boble {
		 z-index: -1;
	 }
    /*hero one*/
     .hero-one-area .hero-content {
         padding: 180px 25px 0;
    }
     .hero-one-right-img img {
         width: 100%;
         padding: 50px 0;
    }
     .hero-one-area .hero-content h3 {
         font-size: 60px;
         line-height: 65px;
    }
     a.hero-btn.one {
         font-size: 18px;
         padding: 15px 40px;
         margin-right: 20px;
    }
    /*hero two*/
     .hero-two-area .hero-content {
         padding: 130px 20px 0;
    }
     .hero-two-area .hero-content h1 {
         font-size: 42px;
         line-height: 50px;
         margin-bottom: 20px;
    }
     .hero-two-subcribe-form {
         margin-top: 50px;
    }
     .hero-two-subcribe-form h6 {
         font-size: 16px;
         line-height: 28px;
         padding: 0 70px 10px 0;
    }
     .qs-imput-subs, .qs-imput-subs > input[type="text"] {
         width: 100%;
    }
     .hero-two-right-img {
         padding: 0;
    }
	 /*hero five*/
	 .hero-five-area {
		background-size: cover
	}
    /*promo box*/
     .qs-promo-content {
         padding: 70px 20px;
    }
     .qs-promo-one-right-img {
         width: 115%;
    }
     .qs-promo-one-right-img img {
         width: 90%;
         margin: 0 auto;
    }
     .qs-promo-content h3 {
         font-size: 30px;
         line-height: 40px;
         margin-bottom: 20px;
    }
     .qs-promo-content h5 {
         font-size: 16px;
         line-height: 28px;
         margin-bottom: 10px;
    }
    /*promo box two*/
     .qs-promo-two-right-img {
         width: 104%;
    }
    /*package plan*/
     .quickspace-Packageplan-box h2 {
         font-size: 30px;
         margin-bottom: 15px;
    }
     .Packageplan-butto span {
         font-size: 16px;
    }
    /*testimonial*/
     .quickspace-testimonial-stitle h2 {
         font-size: 26px;
         line-height: 40px;
         width: 80%;
    }
     .testimonial .owl-nav button {
         top: -70px;
         right: -5px;
    }
     .testimonial .owl-item.active.center {
         margin-right: 20px!important;
         padding-right: 0;
/*          margin-left: -250px; */
         margin-top: 50px;
    }
     .testimonial .owl-nav button.owl-next:hover i {
         font-size: 24px;
         margin-right: -5px;
    }
    /*pricing table*/
     .single-pricing-table .price-btn {
         line-height: 24px;
         padding: 18px 20px;
         font-size: 18px;
    }
     .single-pricing-table {
         margin: 0 5px 30px;
    }
     .price-swetch {
         margin-bottom: 50px;
    }
	 /*portfoliio*/
	 .portfolio-menu ul li {
    display: block;
}
	 .qs-single-portfolio {
		width: 100%;
		 margin: 0px 0px 30px 0px;
	 }
	 .qs-single-portfolio > img {
		height: 400px!important;
	 }
	 /*single portfolio*/
	 .qucikspace-internal-area.portfolio .portfolio-details .post-thumb img {
		width: 100%;
		height: 250px;
	}
	 .qucikspace-internal-area.portfolio .portfolio-details article .quickspace-blog-post {
		margin: 0 10px;
		padding: 0 10px;
	}
    /*newsletter*/
     .quickspace-newsletter p {
         font-size: 14px;
         line-height: 28px;
         padding: 0 30px;
    }
     .quickspace-newsletter h2 {
         font-size: 21px;
         line-height: 30px;
    }
     .quickspace-newsletter {
         width: auto;
    }
	/*service and about page vector bg*/
	 .qs-progressbg::before, .aboutpagevector::before {
		top: -38px;
		background-size: contain;
		}
}
 @media only screen and (min-width: 389px) and (max-width: 576px) {
	 /*hero one*/
	 .hero-one-area .hero-content h3 {
		font-size: 46px;
		line-height: 55px;
		margin-bottom: 30px;
	}
	 .hero-one-area .hero-content p {
		 padding: 0;
	 }
    /*hero three*/
     .hero-three {
         background-size: unset;
         background-position: top center;
    }
	.hero-three .hero-content {
		padding: 150px 20px 50px;
	}
	.hero-three .hero-content h3 {
		font-size: 40px;
		margin-bottom: 20px;
	}
     .hero-three-bottom {
         margin-top: 0px;
    }
     .testimonial .owl-item.active.center {
         margin-right: 35px!important;
         padding-right: 0;
         margin-left: -110px;
         margin-top: 50px;
    }
     .testimonial-content h3 {
         font-size: 20px;
         line-height: 34px;
         width: 88%;
    }
	 /*Hero four*/
	 .hero-four-area .hero-content {
		padding: 200px 16px 40px 15px;
	}
	 .hero-four-area .hero-content h5 {
		font-size: 15px;
		padding: 20px 15px;
		margin-bottom: 10px;
	}
	 .hero-four-area .hero-content h1 {
		font-size: 40px;
	}
	 .hero-four-right-img img {
		width: 50%;
		margin-top: 5%;
	 }
	 .hero-four-right-img::before {
		width: 320px;
		height: 320px;
		bottom: 25px;
	}
	 .hero-four-right-img::after {
		width: 380px;
		height: 380px;
		bottom: 0px;
	}
	 
	 /*hero five*/
	  .hero-five-area .hero-content {
		padding: 150px 15px 0 15px;
	}
	 .hero-five-area .hero-content h5 {
		margin-bottom: 10px;
	}
	 .hero-five-area .hero-content h3 {
		font-size: 36px;
		line-height: 54px;
	}
	.hero-five-area .hero-content p {
		font-size: 15px;
	}
	 .hero-five-area .hero-content a.hero-btn.one {
    	margin: 0;
	}
	 .hero-five-area .hero-content a.hero-btn.two {
		display: block;
		margin-top: 10px;
	}
	 .hero-five-right-img {
		width: 110%;
		margin-top: 4%;
	}
	 /*hero six*/
	 .hero-six-area .hero-content {
		padding: 200px 15px 100px 15px;
	}
	 .hero-six-area .hero-content h3 {
		font-size: 42px;
		line-height: 50px;
	}
	 .hero-content h5 {
		margin-bottom: 5px;
	}
	 
	 
}
 @media only screen and (min-width: 320px) and (max-width: 388px) {
	 /*hero one*/
	 .hero-one-area .hero-content h3 {
		font-size: 40px;
		line-height: 50px;
	}
	 .hero-one-area .hero-content p {
		 font-size: 14px;
		 padding: 0;
	 }
    /*hero one*/
     a.hero-btn.one {
         font-size: 18px;
         padding: 14px 30px;
         margin-right: 15px;
    }
    /*hero three*/
     .hero-three {
         background-size: unset;
         background-position: top center;
    }
     .hero-three .hero-content {
         padding: 150px 20px 70px;
    }
	 .hero-three .hero-content h3 {
		 font-size: 36px;
		 margin-bottom: 20px;
	 }
     .hero-three-bottom {
         margin-top: px;
    }
	 .quickspace-testimonial-stitle h2 {
		font-size: 24px;
		line-height: 38px;
	}
	 .testimonial-content h3 {
		font-size: 20px;
		line-height: 30px;
		 width: 95%;
	}
	 /*Hero four*/
	 .hero-four-area .hero-content {
		padding: 190px 16px 50px 15px;
	}
	 .hero-four-area .hero-content h5 {
		font-size: 12px;
		padding: 15px 15px;
		margin-bottom: 10px;
	}
	 .hero-four-area .hero-content h1 {
		font-size: 36px;
	}
	 .hero-four-right-img img {
		width: 50%;
		margin-top: 5%;
	 }
	 .hero-four-right-img::before {
		width: 320px;
		height: 320px;
		bottom: 25px;
	}
	 .hero-four-right-img::after {
		width: 380px;
		height: 380px;
		bottom: 0px;
	}
    /*pricing tabnle*/
     .single-pricing-table h2 span {
         margin-left: 15px;
         display: block;
    }
     .toggler {
         position: relative;
         font-size: 16px;
    }
     .toggle, .toggler {
         margin: 10px 5px;
    }
	  /*hero five*/
	  .hero-five-area .hero-content {
		padding: 150px 15px 0 15px;
	}
	 .hero-five-area .hero-content h5 {
		margin-bottom: 10px;
	}
	 .hero-five-area .hero-content h3 {
		font-size: 32px;
		line-height: 42px;
	}
	.hero-five-area .hero-content p {
		font-size: 14px;
	}
	 .hero-five-area .hero-content a.hero-btn.one {
    	margin: 0;
	}
	 .hero-five-area .hero-content a.hero-btn.two {
		display: block;
		margin-top: 10px;
	}
	 .hero-five-right-img {
		width: 110%;
		 margin-top: 4%;
	 }
	 	 /*hero six*/
	  .hero-six-area .hero-content {
		padding: 200px 15px 100px 15px;
	}
	 .hero-six-area .hero-content h3 {
		font-size: 34px;
		line-height: 46px;
	}
	 .hero-content h5 {
		margin-bottom: 5px;
	}
		
}
@media only screen and (min-width: 500px) and (max-width: 766px) {
	    /*testimonial*/
     .testimonial .owl-item.active.center {
         margin-left: -250px!important;
    }
}
@media only screen and (min-width: 360px) and (max-width: 389px) {
	    /*testimonial*/
     .testimonial .owl-item.active.center {
         margin-left: -70px!important;
    }
}
@media only screen and (min-width: 320px) and (max-width: 359px) {
	    /*testimonial*/
     .testimonial .owl-item.active.center {
         margin-left: -30px!important;
    }
}
