/* ===================================================================================

* Theme Name: Appilo Child
* Theme URI: https://themeforest.net/item/appilo-app-landing-wordpress-theme/22358661
* Author: ThemeXriver
* Author URI: https://themeforest.net/user/themexriver
* Description: Appilo One Page App Landing WordPress Theme
* Version: 7.0.0
* Template: appilo
* Text Domain: appilo-child
* License: GNU General Public License version 3.0
* License URI: http://www.gnu.org/licenses/gpl-3.0.html
* Tags: one-column, right-sidebar, left-sidebar, custom-menu, featured-images, post-formats, sticky-post, translation-ready

* We encourage you to create Child theme for any modifications you will want to do.

* Why use Child theme?

* Because of appilo updates we may provide for this theme that will overwrite your
* modifications and all your custom work.

* If you are not familiar with Child Themes, you can read about it here:
* http://codex.wordpress.org/Child_Themes
* http://wp.tutsplus.com/tutorials/theme-development/child-themes-basics-and-creating-child-themes-in-wordpress/

====================================================================================== */
.saas_two_banner_section .s2-banner_content h1{
    font-size: 46px;
}
/* .saas_two_banner_section:before {
    background-image: none;
} */
/* .s2-banner_shape1, .s2-banner_shape2, .s2-banner_shape3, .page-breadcrumb {
    display: none !important;
} */
.s2-tilte_tag{
    display: none !important;
}
.s2-pricing_section .s2-pricing_item .s2-pricing_price .s2-pricing_text strong{
    font-size: 34px;
}
.s2-pricing_section .s2-pricing_item .s2-pricing_price .pricing_icon{
    margin-right: 14px;
}
.s2-pricing_section .s2-pricing_item .s2-pricing_price{
    padding: 40px 30px 25px;
}
.s2-pricing_section .s2-pricing_item .s2-pricing_list li {
    padding-left: 25px;
}
.s2-pricing_list_icon.s2-checked:not(:has(i)):not(:has(svg)) {
    display: none;
}
.page-id-2145 .full-width-page-wrapper ul{
    padding-inline-start: 1em;
    margin-top: 0.5rem;
}
.page-id-2145 .full-width-page-wrapper li {
    list-style: unset;     
    margin-left: 1.3em;
}
.saas_two_main_header .brand_logo {
    height: 100%;
    display: flex;
    align-items: center;
    padding: 0;
}
.saas_two_main_header .brand_logo img {
    max-width: 83%;
}
@media (max-width: 992px) {
    .saas_two_main_header .brand_logo img {
        max-width: 100%;
    }
    .saas_two_main_header .brand_logo {
        width: 120px;
    }
    .s2_mobile_menu_button{
        top: -36px;
    }
}

/* === Contact Form 7 - Appilo SaaS Classic Theme === */
.wpcf7 {
    font-family: "Poppins", sans-serif;
}
.wpcf7 br {
    display: none;
}

/* Labels */
.wpcf7 label {
    display: block;
    color: #383838;
    font-weight: 500;
    margin-bottom: 0px;
    margin-top: 10px;
}

/* All input fields & textarea */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea,
.wpcf7 .wpcf7-quiz-label + input { 
    width: 100%;
    height: 55px;
    border: none;
    border-radius: 8px;
    padding: 0 20px;
    font-size: 15px;
    color: #383838;
    background: rgba(255, 255, 255, 0.95);
    transition: box-shadow 0.3s ease;
    margin-top: 5px;   
    margin-bottom: 0;
}
.wpcf7 input{
    max-width: unset !important;
    padding-left: 18px;
    height: 56px !important;
}
.wpcf7 textarea {    
    width: 100%;
    border: none;
    padding: 10px 18px;
    border-radius: 5px;
    height: 100px;
}
  

/* Submit button */
.wpcf7 input[type="submit"] {
    width: 100%;
    height: 58px;
    border: none;
    border-radius: 8px;
    font-size: 17px;
    font-weight: 600;
    font-family: "Poppins", sans-serif;
    color: #fff;
    cursor: pointer;
    margin-top: 10px;
    background: #6458f1;
    transition: all 0.3s ease;
}

.wpcf7 input[type="submit"]:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(108, 43, 149, 0.55);
}

/* Validation messages */
.wpcf7 .wpcf7-not-valid-tip {
    color: #f51111;
    font-size: 13px;
    margin-top: 5px;
}

.wpcf7 .wpcf7-response-output {
    border-radius: 8px;
    padding: 15px !important;
    margin-top: -10px;
    color: #383838;
    border: 1px solid rgba(255, 255, 255, 0.3);
}

/* Spinner */
.wpcf7 .wpcf7-spinner {
    margin: 15px auto 0;
    display: block;
}
input[name="typix"] {
    display: none !important;
}
.saas_two_footer_section{
    background-color: #00163b;
}
.saas_two_footer_section:before{
    background-image: none !important;
}
 

.how-app-works .app-mobile {
     width: 450px;
    z-index: 1;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
    -ms-transition: all 1s;
    transition: all 1s;
} 

.check-content-list li{
    padding-left: 30px;
    position: relative;
    margin-bottom: 10px;
}
.check-content-list li:after {
    left: 0;
    color: #25d98f;
    font-size: 20px;
    content: "\f058";
    font-weight: 900;
    position: absolute;
    font-family: "Font Awesome 5 Free"
}
.box_list_ai .e-flex {
    visibility: visible;
    animation-duration: 1500ms;
    animation-delay: 600ms;
    transition: all 0.9s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    position: relative;
}
.box_list_ai .e-flex:hover{
    transform: translateY(-10px) scale(1.03);
    z-index: 10;
}





/*******************************/

/*
 * Typix Brand Colors Override
 *
 * Main:      #6458f1
 * Secondary: #c06dd8
 * Accent 1:  #ff855d (orange)
 * Accent 2:  #63d3d7 (teal)
 * Accent 3:  rgb(22, 145, 153) (dark teal)
 * Light BG:  #eceafd
 */

/* ==========================================================================
   HEADER & NAVIGATION
   ========================================================================== */

.saas_two_main_header .saas_sign_up_btn {
    background-color: #6458f1;
}

.saas_two_main_header .dropdown .dropdown-menu {
    border-bottom-color: #6458f1;
}

.saas_two_main_header .dropdown .dropdown-menu li a:after {
    background-color: #6458f1;
}

.s2_mobile_menu_button {
    color: #6458f1;
}

/* ==========================================================================
   TITLE TAGS (all sections)
   ========================================================================== */

.saas_two_section_title .title_tag,
.saas_two_banner_section .s2-banner_content .s2-tilte_tag,
.saas_two_feature_section .s2-feature_text .feature_tag,
.integration_section .integration_text .feature_tag {
    color: #6458f1;
    background-color: #eceafd;
}

/* ==========================================================================
   BANNER / HERO SECTION
   ========================================================================== */

.saas_two_banner_section .s2-banner_content .banner_btn a {
    border-color: #6458f1;
}

.saas_two_banner_section .s2-banner_content .banner_btn a:after {
    background-color: #6458f1;
}
.saas_two_banner_section .s2-banner_content .banner_btn a::before,
.s2-pricing_section .s2-pricing_item .s2-pricing_btn a:before{
    box-shadow: none;
}


.saas_two_banner_section .s2-banner_content .banner_btn a i {
    background: linear-gradient(-45deg, #6458f1 32%, #c06dd8 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* ==========================================================================
   SHARED BUTTON / ICON GRADIENT (used across many sections)
   ========================================================================== */

.saas_btn:before,
.service_read_more a:after,
.saas_two_about_section .s2-about_text_icon .s2-about_text a:after,
.integration_section .integration_text a:after,
.saas_two_feature_section .s2-feature_text .saas_btn a:before,
.s2-pricing_section .s2-pricing_item .s2-pricing_btn a i {
    background: linear-gradient(-45deg, #6458f1 32%, #c06dd8 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.saas_btn a {
    border-color: #6458f1;
}

.saas-classic-stylish-btn .saas_btn:after,
.saas_two_banner_section .s2-banner_content .banner_btn a:after,
.saas_two_feature_section .s2-feature_text .saas_btn:after,
.s2-pricing_section .s2-pricing_item .s2-pricing_btn a:after {
    background-color: #6458f1;
}

.saas-classic-stylish-btn .saas_btn i {
    background: linear-gradient(-45deg, #6458f1 32%, #c06dd8 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* ==========================================================================
   SCROLL-UP BUTTON
   ========================================================================== */

.saas-classic-scrollup {
    background-image: linear-gradient(-45deg, #c06dd8 32%, #6458f1 100%);
}

/* ==========================================================================
   FEATURE SECTION
   ========================================================================== */

.saas_two_feature_section .s2-feature_text .saas_btn a {
    border-color: #6458f1;
}

.saas_two_feature_section .s2-feature_right .s2-feature_list:nth-child(2) .s2-feature_icon i {
    color: #6458f1;
}

.saas_two_feature_section .s2-feature_right .s2-feature_list:nth-child(2):before {
    background-color: #6458f1;
}

/* ==========================================================================
   SERVICE SECTION
   ========================================================================== */

.saas_two_service_section .service_content_box:before {
    background-image: linear-gradient(45deg, #c06dd8 32%, #6458f1 100%);
}

/* ==========================================================================
   ABOUT SECTION
   ========================================================================== */

.saas_two_about_section .s2-about_text_icon .s2-about_icon {
    background-color: #6458f1;
}

/* ==========================================================================
   TEAM SECTION
   ========================================================================== */

.saas_two_team_section .s2-team_img_text .s2_tean_img:before,
.saas_two_team_section .s2-team_img_text .s2_tean_img:after {
    border-color: #c06dd8;
}

.saas_two_team_section .s2-team_img_text .s2_name_info .s2_mem_contact span i {
    color: #c06dd8;
}

.saas_two_team_section .s2-team_img_text:hover .s2-share_btn {
    background-color: #c06dd8;
}

/* ==========================================================================
   FAQ SECTION
   ========================================================================== */

.s2-faq_section .s2_faq_content button:after {
    color: #6458f1;
}

/* ==========================================================================
   PRICING SECTION
   ========================================================================== */

.s2-pricing_section .s2-pricing_item .s2-pricing_btn a {
    border-color: #6458f1;
}

.s2-pricing_section .s2-pricing_item .s2-pricing_price .pricing_icon:after {
    background-image: linear-gradient(-45deg, #c06dd8 32%, #6458f1 100%);
}

/* ==========================================================================
   FOOTER SECTION
   ========================================================================== */

.saas_two_footer_section .s2-newslatter_section {
    background-color: #6458f1;
    box-shadow: 0 0 16px 0 rgba(100, 88, 241, 0.34);
}

.saas_two_footer_section .s2-newslatter_section .s2-newslatter-form button {
    background-color: #c06dd8;
}

.saas_two_footer_section .s2_footer_widget .s2_footer_about span {
    color: #ff855d;
}

.saas_two_footer_section .s2_footer_widget .menu li a:after {
    background-color: #c06dd8;
}

.saas_two_footer_section .s2_footer_widget .menu li a:hover {
    color: #c06dd8;
}

.saas_two_footer_section .s2_footer_widget .menu li a:hover:before {
    color: #c06dd8;
}

.saas_two_footer_section .s2_footer_widget .s2_footer_social form button {
    background-color: #6458f1;
}