/*=======================================================================
* Template Name: Xprosik - Saas Software WordPress Theme
* Template URL: http://themesholder.com/wp-demo/xprosik/
* Author: ThemesHolder
* Author URL: https://themeforest.net/user/themesholder
* Version: 1.0
* Tags: saas, software, startup, portfolio, landing page
======================================================================= */



/*------------------------------------------------------
Table of content
--------------------------------------------------------
*--> Header Area Style
*--> Hero Area Style
*--> Feature  Area Style
*--> Call To Action Area Style
*--> Overview Area Style
*--> Video Overview Area Style
*--> Features Overvbiew Area Style
*--> Pricing Area Style
*--> Testimonial Area Style
*--> Logo Carousel Area Style
*--> Faq Contact Area Style
*--> Footer Area Style
------------------------------------------------------*/


/*
-------------------------------------------
   Default Style
-------------------------------------------
*/
 body {
     font-family: 'Nunito', sans-serif;
     font-size: 14px;
     font-weight: 400;
     line-height: 28px;
     color: #6d7288;
}
 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: #141f4e;
     font-family: 'Nunito', sans-serif;
}
 p {
     color: #63688e;
     font-weight: 400;
     font-size: 16px;
}
 .section-padding {
     padding: 120px 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-50 {
     margin-bottom: 50px;
}
 .pd-70 {
     padding: 70px 0;
}
 .left {
     text-align: left;
}
 .right {
     text-align: right;
}
 .center {
     text-align: center;
}
 .yellow {
     background: #feca34;
}
.orange {
    background: #fe805a!important;
}
.purple {
    background: #926dde!important;
}
 .download_btn1, .mailchimp_btn1, .f_cta_btn_clr1 {
     background: #2ecc71 !important;
     color: #fff!important;
}
 .download_btn2, .mailchimp_btn2, .f_cta_btn_clr2 {
     background: #feca34!important;
     color: #fff!important;
}
 .download_btn3, .mailchimp_btn3, .f_cta_btn_clr3 {
     background: #e62ff1!important;
     color: #fff!important;
}
 .download_btn4, .mailchimp_btn4, .f_cta_btn_clr4 {
     background: #fe805a!important;
     color: #fff!important;
}
 footer.footer2, footer.footer3 {
    /* background: linear-gradient(to right, #4828DD 16%, #8431EA 61%);*/
	 background: linear-gradient(to right, #184d9d 16%, #00b3d0 61%)
}
 footer.footer1 {
     background: linear-gradient(-45deg, rgba(241, 114, 68, 1) 0%, rgba(235, 29, 139, 0.99) 100%);
}
/*.ftr-cta1 {
    */
    /* color: #141f4e;
    */
    /*
}
*/
/*.ftr-cta2 {
    */
    /* color: #fff;
    */
    /*
}
*/
/* ------------------------------------------- Base Style ------------------------------------------- */
 .section-title h3 {
     font-size: 24px;
     color: #FE805A;
     font-weight: 900;
     margin-bottom: 20px;
     text-transform: capitalize;
}
 .section-title h3 i {
     font-size: 36px;
}
 .section-title h2 {
     font-size: 48px;
     font-weight: 700;
     margin-bottom: 0;
}
 .section-title p {
     font-size: 24px;
     font-weight: 300;
     margin: 30px 0;
}
 .soft-feature-box:hover, .app.hero-area .hero-content a img:hover, .service-box:hover, .app-feature-box:hover, input.submit-btn:hover, .single-pricing-table:hover, .price-btn:hover, .cta-btn:hover, .hero-btn:hover {
     box-shadow: 0 30px 50px 0 rgba(0,0,29,.1);
     transform: translateY(-5px);
}
/* Image animation*/
 hero-area.landing .hero-content img, .img-animat .elementor-image img, .features-img img, .hero-area.home-2 .hero-content img, .hero-area.home-4 .hero-content-img img, .overview-image.wide-box img, .overview-image.two img, .middle-img img {
     animation: hover 3.25s ease infinite;
     animation-delay: -0.45s;
}
 .hero-area.landing .hero-content img, .img-animat .elementor-image img, .features-img img, .hero-area.home-2 .hero-content img, .hero-content-img img, .overview-image.wide-box img, .overview-image.two img , .middle-img img{
     z-index: 101;
    /*top: -50vw;
    */
     top: -2.5vw;
     webkit-animation-fill-mode: both;
     -webkit-animation-fill-mode: both;
     animation-fill-mode: both;
     webkit-animation: hover 3.25s ease infinite;
     -webkit-animation: hover 3.25s ease infinite;
     animation: hover 3.25s ease infinite;
     webkit-animation-delay: -0.25s;
     -webkit-animation-delay: -0.25s;
     animation-delay: -0.25s;
}
 .soft-right-img img, .download-btn a {
     z-index: 100;
     top: 0px;
     webkit-animation-fill-mode: both;
     -webkit-animation-fill-mode: both;
     animation-fill-mode: both;
     webkit-animation: hover 3.25s ease infinite;
     -webkit-animation: hover 3.25s ease infinite;
     animation: hover 3.25s ease infinite;
     webkit-animation-delay: -0.65s;
     -webkit-animation-delay: -0.65s;
     animation-delay: -0.65s;
}
 @-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);
    }
}
/* -------------------------------------------- Browser Scroll Control CSS | ------------------------------------------- */
 ::-webkit-scrollbar {
     width: 10px;
}
 ::-webkit-scrollbar-track {
     box-shadow: inset 0 0 5px grey;
     border-radius: 10px;
}
 ::-webkit-scrollbar-thumb {
     background: #271F62;
     border-radius: 10px;
}
/* ------------------------------------------- Header Area Style ------------------------------------------- */
 .single-slides-item {
     overflow: hidden;
}
/* ------------------------------------------- Hero Area Style ------------------------------------------- */
.hero-area {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: scroll;
    position: relative;
}
 .soft.hero-area{
     background-color: #fff;
}
 .soft.hero-area {
     position: relative;
     background-size: 90%;
     background-repeat: no-repeat;
     padding: 220px 0 100px 0;
     background-position: unset;
}
 .soft-right-img {
     width: 122%;
}
 .soft-right-img img {
     margin-top: -100px;
     width: 100%;
     z-index: 0;
}
 .hero-content h3 {
     font-size: 50px;
     font-weight: 700;
     /*text-transform: capitalize;*/
	 line-height: 62px;
     margin-bottom: 0;
     color: #fff;
}
 .hero-content p {
     font-size: 20px;
     padding: 20px 0;
     color: #fff;
}
 .hero-content a.hero-btn {
     font-size: 18px;
     text-transform: capitalize;
     font-weight: 900;
     color: #fff;
     padding: 20px 25px;
     border-radius: 3px;
     margin-right: 15px;
     color: #152444;
     display: inline-block;
}
 .hero-content a.hero-btn, .submit-btn, a.cta-btn, a.price-btn {
     transition: all .3s ease-in-out;
}
 .hero-area a.hero-btn-2nd {
     font-size: 16px;
     color: #fff;
     font-weight: 600;
     transition: .5s;
}
.hero-area a.hero-btn-2nd:hover {
    text-decoration: underline;
}
/*apps hero area*/
.app.hero-area .hero-content {
    padding: 200px 0;
}
.app.hero-area .hero-content a img {
    float: left;
    width: 40%;
    margin-top: 10%;
    z-index: 0;
    transition: .5s;
    margin-right: 30px;
}
.app.hero-area .hero-content a {
    margin-right: 15px;
    background: transparent;
}
/*Landig Hero Area*/
.hero-area.landing {
    padding-top: 180px;
}
.hero-area.landing .hero-content img {
    margin-top: 30px;
}
.hero-area.landing .hero-content a.hero-btn-2nd {
    display: block;
    margin-top: 15px;
    color: #fff;
}
.hero-area.landing .hero-content a.hero-btn {
    color: #fff;
}
/*startup hero area*/
.startup.hero-area {
    padding: 200px 0;
}
.startup.hero-area .hero-content h3, .startup.hero-area .hero-content p {
    color: #141f4e;
}
.startup.hero-area .hero-content a.hero-btn {
    color: #fff;
}
.startup.hero-area .hero-content a.hero-btn-2nd {
    color: #6d7288;
}
.startup-right-img {
    width: 120%;
}
/* ------------------------------------------- Servicre Area Style ------------------------------------------- */
 .service-box.style-1 {
     text-align: left;
     margin-bottom: 30px;
}
 .service-box {
     padding: 30px;
     transition: all .3s ease-in-out;
}
 .service-box.style-1 .service-icon {
     display: block;
     float: left;
     height: 100px;
     width: 100px;
}
 .service-icon {
     margin-bottom: 25px;
     font-size: 60px;
}
 .service-box h4 {
     font-size: 24px;
     font-weight: 700;
     margin-bottom: 20px;
}
 .service-box p {
     font-size: 16px;
     font-weight: 400;
     color: #717584;
}
/*Servkice two*/
.service-box.two {
    text-align: center;
    padding: 20px;
}
.service-box.two .service-icon {
    display: inline-block;
    float: none;

}
/* ------------------------------------------- Service List Area Style ------------------------------------------- */
.single-list img {
    float: left;
    display: block;
    margin-right: 30px;
    margin-bottom: 30px;
}
.list-content h3 {
    font-size: 24px;
    font-weight: 700;
    text-transform: capitalize;
    margin-bottom: 10px;
}
.list-content p {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
}
/* ------------------------------------------- Feature Area Style ------------------------------------------- */
 .app-feature-box {
     padding: 40px 20px;
     text-align: center;
     padding: 30px;
     transition: all .3s ease-in-out;
}
 .app-feature-box .feature-icon {
     margin-bottom: 25px;
}
 .app-feature-box .feature-icon i {
     font-size: 50px;
}
 .app-feature-box h4 {
     font-size: 24px;
     font-weight: 700;
     margin-bottom: 20px;
}
 .app-feature-box p {
     font-size: 16px;
     font-weight: 400;
}
.feature-icon img {
    width: 50px;
    height: 50px!important;
}
/* ------------------------------------------- Software Features Box Area Style ------------------------------------------- */
 .soft-feature-box {
     background: #fff;
     border-radius: 5px;
     text-align: center;
     padding: 30px 20px;
     box-shadow: 0 0 27px rgba(0,0,0,.12);
     transition: all .3s ease-in-out;
}
 .soft-feature-box .feature-icon {
     margin-bottom: 30px;
}
 .soft-feature-box .feature-icon i {
     font-size: 50px;
}
 .soft-feature-box h4 {
     font-size: 24px;
     font-weight: 700;
     text-transform: capitalize;
     margin-bottom: 20px;
}
 .soft-feature-box p {
     margin-bottom: 0;
}
/* ------------------------------------------- CTA Area Style ------------------------------------------- */
 .cta-box {
     background: #fff;
     padding: 30px;
     text-align: center;
     margin-top: -60px;
     box-shadow: 0 0 27px rgba(0,0,0,.12);
     border: 3px solid #fff;
     border-radius: 5px;
}
 .cta-box.style-2 {
     box-shadow: none;
}
 .cta-box.style-2 h2 {
     font-size: 48px;
     margin: 0 0;
     font-weight: 300;
}
 a.cta-btn {
     font-weight: 900;
     font-size: 18px;
     color: #fff;
     padding: 20px;
     border-radius: 3px;
     display: inline-block;
}
 a.cta-btn {
     font-weight: 900;
     font-size: 18px;
     color: #fff;
     padding: 20px;
     border-radius: 3px;
     display: inline-block;
}
 .cta-box.style-2 a.cta-btn {
     display: block;
     margin-bottom: 15px;
     color: #141f4e;
}
 .cta-hint {
     font-size: 13px;
}
/*cta two*/
.cta-box.two {
    border: 1px solid #d9d9d9;
    margin-top: 60px;
    box-shadow: none;
}
/* ------------------------------------------- Overview Area Style ------------------------------------------- */
 .overview-content {
     padding: 70px 0;
}
 .overview-icon i {
     font-size: 60px;
     color: #2af0a2;
}
 .overview-content h2 {
     font-size: 48px;
     font-weight: 700;
     margin: 20px 0;
}
 .overview-content p {
     margin-bottom: 0;
}
 .overview-image.wide-box {
     margin-right: -130px;
}
/*overview two*/
 .signle-overview.two .overview-content h2 {
     padding: 0 62px 0 0;
}
 .signle-overview.two .overview-content {
     padding: 30px 0;
}
/* ------------------------------------------- Video Overview Style ------------------------------------------- */
 .popup-video {
     height: 640px;
     width: 100%;
     background-attachment: scroll;
     background-position: center center;
     position: relative;
     border-radius: 30px;
     z-index: 0;
}
 .popup-video::after {
     position: absolute;
     content: "";
     width: 100%;
     height: 100%;
     left: 0;
     right: 0;
     opacity: .9;
     border-radius: 30px;
     overflow: hidden;
     z-index: -1;
}
 .popup-video a {
     background: #fff;
     color: #ed3371;
     z-index: 999999999;
     position: relative;
     left: 0;
     right: 0;
     margin: 0 auto;
     top: 40%;
     display: inline-block;
     width: 120px;
     height: 120px;
     line-height: 120px;
     font-size: 20px;
     border-radius: 60%;
}
 .popup-video a:before {
     content: "";
     position: absolute;
     z-index: 0;
     left: 50%;
     top: 50%;
     transform: translateX(-50%) translateY(-50%);
     -webkit-transform: translateX(-50%) translateY(-50%);
     -ms-transform: translateX(-50%) translateY(-50%);
     display: block;
     width: 120px;
     height: 120px;
     border-radius: 50%;
     -webkit-animation: pulse-border 1.5s ease-out infinite;
     animation: pulse-border 1.5s ease-out infinite;
     background: #fff;
     z-index: -1;
}
 .popup-video a:after {
     content: "";
     position: absolute;
     z-index: 1;
     left: 50%;
     top: 50%;
     -webkit-transform: translateX(-50%) translateY(-50%);
     -ms-transform: translateX(-50%) translateY(-50%);
     transform: translateX(-50%) translateY(-50%);
     display: block;
     width: 80px;
     height: 80px;
     border-radius: 50%;
     transition: all .2s;
}
 @keyframes pulse-border {
     0% {
         -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
         -ms-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
         transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
         opacity: 1;
    }
     100% {
         transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
         -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
         -ms-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
         opacity: 0;
    }
}
 @-webkit-keyframes pulse-border {
     0% {
         -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
         -ms-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
         transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
         opacity: 1;
    }
     100% {
         transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
         -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
         -ms-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
         opacity: 0;
    }
}
/* ------------------------------------------- Price Area Style ------------------------------------------- */
 .single-pricing-table {
     text-align: center;
     padding: 40px!important;
     box-shadow: 0 0 27px rgba(0,0,0,.12);
    /* background: #fff;
    */
     transition: all .3s ease-in-out;
     border-radius: 5px;
}
 .single-pricing-table h4 {
     font-size: 24px;
     font-weight: 700;
     text-transform: capitalize;
}
 .single-pricing-table h2 {
     font-size: 72px;
     font-weight: 700;
     margin: 30px 0;
}
/*.single-pricing-table h2 {
     color: #ed3074;
}
*/
 .single-pricing-table h2 span {
     font-size: 36px;
     font-weight: 400;
}
 .single-pricing-table ul {
     padding-bottom: inherit;
     list-style: none!important;
}
 .single-pricing-table, ol, ul {
     list-style: none;
     outline: 0;
     margin: 0;
     padding: 0;
}
 .single-pricing-table ul li {
     font-size: 16px;
     padding-bottom: 15px;
}
 a.price-btn {
     font-size: 18px;
     font-weight: 900;
     border: 3px solid;
     border-radius: 3px;
     display: inline-block;
     padding: 18px 50px;
}
/* ------------------------------------------- Testimonial Area Style ------------------------------------------- */
 .testimonail-area {
     position: relative;
}
 .testimonail-area::after {
     position: absolute;
     content: "";
     width: 100%;
     height: 200%;
     background: linear-gradient(to bottom, #f0f7fe 0%, #ffffff 140%);
     z-index: -1;
     transform: skew(0deg, -5deg);
     top: -600px;
}
 .single-testimonial .author-image {
     width: 30%;
     float: left;
}
 .single-testimonial .testimonial-content {
     float: right;
     width: 60%;
}
 .single-testimonial {
     display: flow-root;
     border-bottom: 3px solid #DCDEE5;
     padding: 40px 0;
}
 .owl-item.active.center .single-testimonial {
     border-color: #906CDB;
     transition: all 0.3s ease-in-out;
}
 .testimonial-content p {
     font-size: 18px;
     font-weight: 400;
     margin-bottom: 30px;
}
 .ratting a i {
     padding-right: 3px;
}
 .ratting a {
     display: inline-block;
     color: #ccd6df;
}
 .ratting.str_one a:nth-child(1), .ratting.str_two a:nth-child(1n+4), .ratting.str_three a:nth-child(1n+3), .ratting.str_four a:nth-child(1n+2), .ratting.str_five a {
     color: #fba842;
}
 .author-details h4 {
     color: #141f4e;
     font-size: 18px;
     font-weight: 600;
     text-transform: capitalize;
}
/*Home Two*/
 .testimonail-area.home-2 {
     padding: 200px 0;
}
 .testimonail-area.home-2::after {
     position: absolute;
     content: "";
     width: 100%;
     height: 100%;
     background: linear-gradient(to right, #4828DD 41%, #8431EA 90%);
     z-index: -1;
     transform: skew(0deg, -5deg);
     top: 0;
}
 .testimonail-area.home-2 .section-title h2 {
     color: #fff;
     padding-bottom: 65px;
}
 .single-testimonial.style-two p, .single-testimonial.style-two h4 {
     color: #fff;
}
 .single-testimonial.style-two .author-image {
     width: 100px;
     height: 100px;
     float: none;
}
 .single-testimonial.style-two {
     background-color: rgba(0,0,0,0.2);
     border-radius: 5px;
     display: block;
     padding: 30px;
     border-bottom: none;
}
 .single-testimonial.style-two .testimonial-content p {
     margin: 20px 0;
}
 .single-testimonial.style-two .testimonial-content {
     float: none;
     width: 100%;
}
/*Home 1*/
 .testimonail-area.home-3 {
     position: unset;
}
 .testimonail-area.home-3 .owl-item.active.center .single-testimonial {
     border-bottom: 3px solid #EF4C5F;
}
/*home 3 */
 .testimonail-area.home-1::after {
     top: -500px;
}
/* ------------------------------------------- FAQ & Contact Area Style ------------------------------------------- */
 a.card-link, a.card-link.collapsed i {
     color: #fe805a;
}
 a.card-link.collapsed, a.card-link.collapsed i {
     color: #141f4e;
}
 a.card-link.collapsed, a.card-link {
     width: 100%;
     display: inline-block;
     font-size: 20px;
     text-transform: capitalize;
     font-weight: 700;
     padding: 10px 0;
     border-bottom: 1px solid #bbbbbb;
}
 .card-header {
     background: #fff;
     border-color: #fff;
}
 .card {
     border-color: transparent;
}
 a.card-link.collapsed i.fa.fa-angle-up {
     display: none;
}
 a.card-link i.fa.fa-angle-up {
     display: block;
}
 a.card-link i.fa.fa-angle-down {
     display: none;
}
 a.card-link.collapsed i.fa.fa-angle-down {
     display: block;
}
 a.card-link i, a.card-link.collapsed i {
     float: right;
     font-size: 20px;
     margin-right: 10px;
     font-weight: 700;
}
 .card-body {
     color: #717584;
     font-size: 16px;
     font-weight: 400;
     padding-top: 0;
     padding-bottom: 0;
}
/* ------------------------------------------- Contact Form Style ------------------------------------------- */
 .contact-form h5 {
     font-size: 24px;
     font-weight: 700;
     margin-bottom: 25px;
     padding-top: 40px;
     display: block;
}
 .contact-form {
     padding: 0 35px;
     background-size: cover;
     background-position: center;
     background-repeat: no-repeat;
     background-attachment: scroll;
     border-radius: 10px;
}
 div#contact-form .form-group {
     margin-bottom: 1rem;
     padding: 0;
}
 div#contact-form .form-group p {
     margin: 0;
}
 div#contact-form p input, div#contact-form p textarea {
     border: 3px solid transparent;
}
 .submit-btn {
     width: 100%;
    /* border-color: #39EE9D!important;
    */
     outline: none;
     font-size: 14px;
     font-weight: 900;
     color: #fff;
     padding: 5px 0;
     text-transform: capitalize;
     border-radius: 3px;
     cursor: pointer;
}
 div#contact-form p input {
     display: block;
     width: 100%;
     padding: .375rem .75rem;
     line-height: 1.6;
     background-color: #fff;
     background-clip: padding-box;
     border: 1px solid transparent;
     border-radius: .25rem;
     transition: .15s ease-in-out,box-shadow .15s ease-in-out;
}
 div#contact-form p textarea {
     height: 1 130px;
}
 div#contact-form p input:focus, div#contact-form p input:textarea:focus, form.subscribe-form input:focus {
     box-shadow: 0px 0px 0px transparent!important;
     border-color: #fff;
}
 input.submit-btn.home-3 {
     background: linear-gradient(-45deg,rgba(237,60,163,1) 0,rgba(242,140,106,.99) 100%);
     border: none;
}
 .contact-form input[type="submit"] {
     width: 100%;
     padding: 5px 30px;
     text-transform: capitalize;
}

/* ------------------------------------------- Footer Area Style ------------------------------------------- */
 ul.nav.nav-tabs.design_tab li {
     text-align: center;
     width: 33.33%;
}
 .tab-content>div {
     background-repeat: no-repeat;
     background-size: 100%;
     background-attachment: scroll;
     background-position: bottom;
     height: 500px;
}
 .tab-content .tab_img {
     padding: 100px 250px;
}
 .tab-content .tab_img p {
     font-size: 18px;
}
 tab-nav{
     opacity:0;
     transition:all .3s linear;
     -moz-transition:all .3s linear;
     -webkit-transition:all .3s linear;
}
 .multipletab:hover .tab-nav{
     opacity:1;
}
 .tab-nav>span {
     position: absolute;
     top: 50%;
     cursor: pointer;
     display: block;
     height: 50px;
     width: 50px;
     border: 2px solid deepskyblue;
     border-radius: 50%;
     text-align: center;
}
 .tab-nav>span i {
     font-size: 30px;
     color: deepskyblue;
     text-align: center;
     font-weight: bolder;
     line-height: 44px;
}
 .tab-nav>span.next{
     right:10px;
     background-position:5px;
}
 .tab-nav>span.prev{
     left:10px;
     background-position:5px;
}
/*
-------------------------------------------
   Screenshot  Area Style
-------------------------------------------*/
#Xscreenshot.owl-carousel .owl-item img {
	border-radius: 20px;
}
/* #Xscreenshot.owl-carousel .owl-item.active.center {
	width: 230px!important;
} */
/* div#Xscreenshot.owl-carousel .owl-item img {
    border-radius: 20px;
}

div#Xscreenshot.owl-carousel .owl-item.active {
    width: 250px!important;
}

div#Xscreenshot.owl-carousel .owl-item.active.center {
    width: 270px!important;
}

div#Xscreenshot.owl-carousel .owl-item {
    width: 240px!important;
   margin: 0!important;
    padding: 0!important; 
} */

/*------------------------------------------------------ * 
============================================= 
              Responsive CSS 
============================================= 
-------------------------------------------------------- */
/*Big Screen pro*/
 @media only screen and (min-width: 1440px) and (max-width: 1920px) {
     .soft.hero-area {
         background-size: contain;
         padding: 230px;
    }
     .soft-right-img {
         width: 174%;
    }
     .hero-content h3 {
         font-size: 55px;
    }
     .hero-content p {
         font-size: 26px;
         padding: 40px 0;
         line-height: 40px;
    }
}
/*Ipad pro*/
 @media only screen and (min-width: 992px) and (max-width: 1200px) {
    /*Software Hero */

     .soft.hero-area {
         background-size: 100%;
         padding: 180px 0;
    }
     .hero-content h3 {
         font-size: 38px;
    }
     .hero-content p {
         font-size: 18px;
    }
     .hero-content a.hero-btn {
         font-size: 14px;
         padding: 14px 20px;
         margin-right: 20px;
    }
    .soft-right-img {
	    width: 100%;
	}
     .soft-right-img img {
         margin-top: -60px;
         width: 100%;
    }
	 /*app hero*/
	 .app-feature-box h4 {
		 font-size: 18px;
	 }
	 .app-feature-box p {
		 font-size: 14px; 
	 }
	 /*startup hero*/
	 .startup-right-img {
	    width: 100%;
	}
	 /*list service*/
	 .list-content p {
    	font-size: 14px; 
	 }
    /*section title*/
     .section-title h2 {
         font-size: 42px;
    }
    /*call to action */
	 .cta-box h2 {
		 font-size: 32px;
	 }
     .cta-box.style-2 h2 {
         font-size: 40px;
    }
     .cta-hint {
         font-size: 10px;
    }
    /*Video popup */
     .popup-video {
         height: 450px;
         width: 80%;
         left: 0;
         right: 0;
         margin: 0 auto;
    }
	 /*overview feature*/
	 .overview-image.wide-box {
		margin-right: 0;
	}
    /*soft feature box*/
     .soft-feature-box {
         padding: 20px 10px;
    }
    /*testimonial */
     .testimonial-content p {
         font-size: 14px;
         margin-bottom: 20px;
    }
    /*faq and Contact*/
     a.card-link.collapsed, a.card-link {
         font-size: 18px;
    }
     .card-body {
         font-size: 14px;
    }
     a.card-link.collapsed, a.card-link {
         font-size: 18px;
    }
}
/*Ipad*/
 @media only screen and (min-width: 768px) and (max-width: 991px) {
    /*soft hero area*/
     .hero-content h3 {
         font-size: 30px;
    }
     .soft-right-img {
         width: 100%;
    }
     .soft-right-img img {
         margin-top: -150px;
         width: 100%;
    }
     .hero-content {
         margin-top: -80px;
    }
     .hero-content h3 {
         font-size: 28px;
    }
     .hero-content p {
         font-size: 13px;
         padding: 16px 0;
         margin: 0;
         line-height: 18px;
    }
     .hero-content a.hero-btn {
         font-size: 12px;
         padding: 10px 14px;
    }
     .soft.hero-area a.hero-btn-2nd {
         font-size: 12px;
    }
	 /*app hero*/
	 .app.hero-area .hero-content a.x-app-btn {
		display: inline-block;
		padding: 0;
		width: 30%;
	}
	 .app.hero-area .hero-content a img {
		width: 100%;
		margin-top: 10px;
		margin-right: 15px;
	}
	 /*hero startu*/
	 .startup.hero-area .hero-content {
		margin: 0;
	}
	 .startup.hero-area a.hero-btn-2nd {
		font-size: 12px;
	}
	.startup-right-img {
		width: 100%;
	}

    /*section title*/
     .section-title h2 {
         font-size: 26px;
    }
     .section-title h3 {
         font-size: 16px;
    }
     .section-title h3 i {
         font-size: 18px;
    }
     .section-title p {
         font-size: 13px;
    }
    /*soft service*/
     .service-box h4 {
         font-size: 16px;
         margin-bottom: 10px;
    }
     .service-box p {
         font-size: 10px;
         line-height: 18px;
    }
     .service-box.style-1 .service-icon {
         height: 80px;
         width: 80px;
    }
     .service-box {
         padding: 20px;
    }
	 /*app service*/
	 .app-feature-box h4 {
		 font-size: 14px; 
	 }
	 .app-feature-box {
		 padding: 20px;
	 }
	 .app-feature-box p {
		font-size: 12px;
		line-height: 20px;
	}
    /*cta style2*/
	 .cta-box h2 {
		font-size: 22px;
		margin: 20px 0px;
	}
     .cta-box.style-2 h2 {
         font-size: 30px;
    }
     .cta-box.style-2 a.cta-btn {
         margin: 0;
    }
     .cta-hint {
         font-size: 8px;
    }
     .cta-box.style-2 h2 {
         font-size: 30px;
         margin: 0 0;
    }
	 /*list service*/
	 .list-content p {
		font-size: 13px;
		line-height: 20px;
	}
    /*video popup*/
     .popup-video {
         height: 500px;
         width: 80%;
         margin: 0 auto;
         left: 0;
         right: 0;
         text-align: center;
    }
    /*overview*/
     .overview-content h2 {
         font-size: 34px;
         margin: 20px 0;
    }
     .overview-content p {
         margin-bottom: 0;
         font-size: 13px;
    }
     .overview-image.wide-box {
         margin-right: 0px;
         margin-top: 60px;
    }
    /*soft feature*/
     .soft-feature-box .feature-icon {
         margin-bottom: 15px;
    }
     .soft-feature-box {
         padding: 20px 10px;
    }
     .soft-feature-box .feature-icon {
         margin-bottom: 15px;
    }
     .soft-feature-box h4 {
         font-size: 16px;
         margin-bottom: 10px;
    }
     .soft-feature-box p {
         margin-bottom: 0;
         font-size: 11px;
         line-height: 18px;
    }
    /*testimonial*/
     .testimonial-content p {
         font-size: 10px;
         font-weight: 400;
         margin-bottom: 10px;
         line-height: 20px;
    }
     .author-details h4 {
         font-size: 12px;
    }
     .ratting a {
         font-size: 10px;
         margin: 0;
         padding: 0;
         line-height: 0;
    }
     .single-testimonial {
         padding: 20px 0;
    }
    /*pricing table*/
     .single-pricing-table h4 {
         font-size: 16px;
    }
     .single-pricing-table h2 {
         font-size: 40px;
         margin: 16px 0;
    }
     .single-pricing-table ul li {
         font-size: 14px;
         padding-bottom: 6px;
    }
     a.price-btn {
         font-size: 12px;
         padding: 10px 30px;
    }
    /*faq*/
     a.card-link.collapsed, a.card-link {
         font-size: 16px;
         padding: 5px 0;
    }
     .card-body {
         font-size: 13px;
         font-weight: 300;
         line-height: 20px;
    }
     .card-header {
         padding: .55rem 1.10rem;
    }
     .contact-form h5 {
         font-size: 16px;
         padding-top: 20px;
         padding-bottom: 10px;
         margin: 0;
    }
     .contact-form {
         padding: 0px 20px;
    }
     .contact-form input[type="submit"] {
         padding: 4px 0px;
         font-size: 11px;
    }
}
@media only screen and (min-width: 499px) and (max-width: 767px) {
	.sticky .logo a img {
		width: auto!important
	}
	#mobile-menu .slicknav_btn {
		bottom: 40px!important;
	}
    .soft.hero-area {
        padding: 150px 0;
        background-size: cover;
        background-position: center center;
    }
    .soft-right-img {
        width: 100%;
    }
    .soft-right-img img {
     margin-top: 20px; 
    }
    .overview-image.wide-box {
        margin-right: 0;
    }
	/*apps hero*/
	.app.hero-area .hero-content-img {
		float: right;
		margin-top: 0;
		z-index: 0;
	}
	.app.hero-area .hero-content {
		padding: 150px 0 0 0;
	}
	/*hero startup*/
	.startup.hero-area .hero-content {
		margin: 0;
		padding: 0 0 50px 0;
	}
	/*overview*/
	.overview-image.wide-box {
		margin-right: 0;
	}
    
}
/*Iphone 414*/
 @media only screen and (min-width: 376px) and (max-width: 500px) {
    /*soft hero area*/
     .soft.hero-area {
         background-size: cover;
         padding: 146px 0 100px;
         margin-bottom: 30px;
    }
     .hero-content {
         padding: 0 20px;
    }
     .hero-content h3 {
         font-size: 34px;
    }
     .soft-right-img {
         display: none;
    }
     .hero-content p {
         font-size: 20px;
    }
     .soft.hero-area a.hero-btn-2nd {
         font-size: 18px;
         display: block;
         padding: 10px 0;
    }
	 /*hero startup*/
	 .startup.hero-area .hero-content {
		padding: 0 0 50px 0;
	}
	.startup.hero-area a.hero-btn-2nd {
		font-size: 12px;
	}
	.startup-right-img {
		width: 100%;
	}
	.startup.hero-area .hero-content a.hero-btn {
		font-size: 14px;
		padding: 14px 12px;
	}
	 .startup.hero-area .hero-content p {
		font-size: 18px;
		line-height: 30px;
		padding: 20px 0;
		margin: 0;
	}
	 /*app hero*/
	 .app.hero-area .hero-content {
		padding: 170px 0 0 0px;
	}
	 .app.hero-area .hero-content a img {
		 width: 40%!important; 
		 margin-right: 15px;
	 }
    /*section title*/
     .section-title h2 {
         font-size: 24px;
    }
     .section-title h3 {
         font-size: 18px;
         margin-bottom: 10px;
    }
     .section-title p {
         font-size: 12px;
    }
    /*service box 1*/
     .service-box h4 {
         font-size: 18px;
         margin-bottom: 10px;
    }
     .service-box.style-1 .service-icon {
         height: 80px;
         width: 80px;
    }
     .service-box p {
         font-size: 12px;
         line-height: 20px;
    }
     .service-box {
         padding: 10px 30px;
    }
     .service-box.style-1 {
         margin-bottom: 0;
    }
	 /*app service*/
	 .app-feature-box {
		border-bottom: 1px solid;
	}
    /*cta 1*/
	 .cta-box h2 {
    	font-size: 22px; 
	 }
     .cta-box.style-2 a.cta-btn {
         padding: 16px;
         width: 70%;
         margin: 0 auto;
    }
     .cta-box.style-2 h2 {
         font-size: 26px;
         margin-bottom: 0;
         padding-bottom: 16px;
    }
	 /*list service*/
	 .list-content p {
		font-size: 13px;
		line-height: 20px;
	}
    /*video popup*/
     .popup-video a {
         top: 34%;
         width: 90px;
         height: 90px;
         line-height: 90px;
         font-size: 15px;
         text-align: center;
    }
     .popup-video {
         height: 360px;
    }
    /*overview */
     .overview-content h2 {
         font-size: 36px;
         margin: 10px 0;
    }
     .overview-content p {
         font-size: 14px;
    }
     .overview-content {
         padding: 40px 0;
    }
     .overview-image.wide-box {
         margin-right: 0;
         width: 100%;
    }
    /*soft feature*/
     .soft-feature-box {
         margin-bottom: 20px;
    }
     .soft-feature-box .feature-icon {
         margin-bottom: 15px;
    }
     .soft-feature-box h4 {
         margin-bottom: 10px;
    }
    /*testomonial*/
     .testimonial-content p {
         font-size: 14px;
         line-height: 20px;
    }
}
/*android 320*/
 @media only screen and (min-width: 320px) and (max-width: 375px) {
    /*soft hero area*/
     .soft.hero-area {
         background-size: cover;
         padding: 146px 0 100px;
         margin-bottom: 30px;
    }
     .hero-content {
         padding: 0 20px;
    }
     .hero-content h3 {
         font-size: 26px;
    }
     .soft-right-img {
         display: none;
    }
     .hero-content p {
         font-size: 14px;
         line-height: 20px;
         padding: 15px 0;
         margin: 0;
    }
     .hero-content a.hero-btn {
         font-size: 16px;
         padding: 14px 20px;
    }
     .soft.hero-area a.hero-btn-2nd {
         font-size: 14px;
         display: block;
         padding: 10px 0;
    }
	 /*app hereo*/
	 .app.hero-area .hero-content {
		padding: 170px 0 0;
	}
	.app.hero-area .hero-content a {
		margin-right: 10px;
	}
	.app.hero-area .hero-content a img {
		width: 30%!important;
		margin-top: 10px;
		margin-right: 15px;

	}
	.app.hero-area .hero-content-img {
		float: none;
		width: 100%;
		margin-top: 0;
		z-index: 0;
	}
	 /* hero startup*/
	 .startup.hero-area {
		padding: 160px 0 70px;
	}
	 .startup.hero-area .hero-content {
		padding: 0 0 50px 0;
	}
	.startup.hero-area a.hero-btn-2nd {
		font-size: 12px;
	}
	.startup-right-img {
		width: 100%;
	}
	 .startup.hero-area .hero-content a.hero-btn {
		font-size: 14px;
		padding: 12px 10px;
		margin-right: 5px;
	}
	.startup.hero-area .hero-content p {
		font-size: 18px;
		line-height: 30px;
		padding: 20px 0;
		margin: 0;
	}
    /*section title*/
     .section-title h2 {
         font-size: 24px;
    }
     .section-title h3 {
         font-size: 18px;
         margin-bottom: 10px;
    }
     .section-title p {
         font-size: 12px;
    }
    /*service box 1*/
     .service-box h4 {
         font-size: 14px;
         margin-bottom: 10px;
    }
     .service-box.style-1 .service-icon {
         height: 80px;
         width: 80px;
    }
     .service-box p {
         font-size: 10px;
         line-height: 18px;
    }
     .service-box {
         padding: 10px 30px;
    }
     .service-box.style-1 {
         margin-bottom: 0;
    }
    /*cta 1*/
	 .cta-box h2 {
    	font-size: 22px; 
	 }
     .cta-box.style-2 a.cta-btn {
         padding: 10px;
         width: 70%;
         margin: 0 auto;
         font-size: 14px;
    }
     .cta-box.style-2 h2 {
         font-size: 20px;
         margin-bottom: 0;
         padding-bottom: 16px;
    }
     .cta-hint {
         font-size: 10px;
    }
	 /*list service*/
	 .list-content p {
		font-size: 13px;
		line-height: 20px;
	}
    /*video popup*/
     .popup-video a {
         top: 36%;
         width: 90px;
         height: 90px;
         line-height: 90px;
         font-size: 15px;
         text-align: center;
    }
     .popup-video {
         height: 360px;
    }
    /*overview */
     .overview-content h2 {
         font-size: 32px;
         margin: 10px 0;
    }
     .overview-content p {
         font-size: 14px;
    }
     .overview-content {
         padding: 40px 0;
    }
     .overview-image.wide-box {
         margin-right: 0;
         width: 100%;
    }
    /*soft feature*/
     .soft-feature-box {
         margin-bottom: 20px;
    }
     .soft-feature-box .feature-icon {
         margin-bottom: 15px;
    }
     .soft-feature-box h4 {
         margin-bottom: 10px;
    }
    /*testimonial*/
     .testimonial-content p {
         font-size: 14px;
         line-height: 20px;
    }
}