/* Poppins Google Font Link */
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');


/* Root Value */
:root{
    /* Main-colors */
    --background-gray:#fbfbfb;
    --black:#000000;
    --white:#ffffff;
    --dark-blue:#032d60;
    --blue:#1890ff;
    --input-border-color:#d7d7d7;
    --progress-border: #ececec;
    --mui-input: #b9b9b9;
    --mui-input-text: #5e5e5e;


    /* Other Root */
    --shadow: rgba( 0, 0, 0, 0.4);
    --shadow-2: rgba( 0, 0, 0, 0.2);
    --main-btn-shadow: rgba( 24, 144, 255, 0.2);

    /* Icon-bg-color */
    --icon-1: rgba( 238, 176, 47, 0.4);
    --icon-2: rgba( 227, 29, 90, 0.4);
    --icon-3: rgba( 66, 215, 85, 0.4);
    --icon-4: rgba( 54, 198, 239, 0.4);
    --icon-5: rgba( 52, 177, 122, 0.4);
    --icon-6: rgba( 157, 100, 199, 0.4);
    --icon-7: rgba( 79, 169, 40, 0.4);
    --icon-8: rgba( 117, 115, 193, 0.4);
    --icon-9: rgba( 0, 161, 222, 0.4);
    --icon-10: rgba( 211, 102, 157, 0.4);
    --icon-11: rgba( 15, 206, 196, 0.4);
    --icon-12: rgba( 211, 116, 24, 0.4);
    --icon-13: rgba( 49, 103, 32, 0.4);
    --icon-14: rgba( 231, 180, 47, 0.4);
    --icon-15: rgba(219, 32, 90, 0.4);
    --icon-16: rgba(52, 197, 240, 0.4);
    --icon-17: rgba( 255, 0, 0, 0.4);
    --icon-18: rgba( 112, 112, 112, 0.4);
    /* Note:- Ask Section Icon In HTML No.18 is --icon-8 and No.15 is --icon-7 are same color  */

    /* Card-bg */
    --card:#f6f4f4;

}


*{
    margin: 0;
    padding: 0;
}

body{
    font-size: 14px;
    color: var(--black);
    background-color: var(--background-gray);
    font-family: 'Poppins', sans-serif;
    position: relative;
}


/* headdings */
h1 {
    color: var(--blue);
}

h1 span{
    color: var(--dark-blue);
}

/* Lable */
label{
    font-size: 14px;
    font-weight: bold;
    color: var(--dark-blue);
    margin-bottom: 5px;
}

/* Input */
.contact input[type=text]{
    padding: 8px 12px;
    background-color: var(--white);
    border-radius: 4px;
    border: 1px solid var(--input-border-color);
    width: 100%;
    margin-bottom: 15px;
}
.contact ::placeholder{
    font-weight: 600;
    color: var(--input-border-color);
    font-size: 12px;
}

/* Text Area */
.contact textarea{
    padding: 8px 12px;
    background-color: var(--white);
    border-radius: 4px;
    border: 1px solid var(--input-border-color);
    width: 100%;
    margin-bottom: 15px;
}


/* Buttons */
.main-btn{
    color: var(--white);
    background-color: var(--black);
    border: 3px solid var(--blue);
    border-radius: 25px;
    text-transform: uppercase;
    font-size: 18px;
    font-weight: 500;
    padding: 8px 30px;
}
.main-btn:hover{
    background-color: var(--dark-blue);
    color: var(--white);
}
.main-btn:focus{
    box-shadow: 0 0 0 0.2rem var(--main-btn-shadow)
}

.sec-btn{
    color: #032d60;
    background-color: #c3c3c3;
    border-radius: 25px;
    text-transform: uppercase;
    font-size: 18px;
    font-weight: 500;
    padding: 8px 30px;
}
.sec-btn:hover{
    background-color: var(--dark-blue);
    color: var(--white);
}
.sec-btn:focus{
    box-shadow: 0 0 0 0.2rem var(--main-btn-shadow)
}


/* Header */
header{
    background: var(--dark-blue);
    padding: 20px 15px;
    box-shadow: 0px 4px 4px var(--shadow);
    position: fixed;
    z-index: 999;
    width: 100%;
}

header .header-email p{
    margin-bottom: 2px;
    margin-left: 10px;
    color: var(--white);
    font-weight: bold;
}

header .header-email i{
    color: var(--blue);
    font-size: 16px;

}

header .header-email:hover{
    text-decoration: none;
}

header .header-email:hover p{
    color: var(--blue);
}


/* Hero Banner */
.hero-baner{
    background-image: url(../images/hero-banner-bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom center;
    box-shadow: 0px 10px 10px var(--shadow-2);
    padding-top: 67px;
}

.hero-img {
    width: 100%;
    height: auto;
    margin: 20px 0;
}

.hero-content .hero-title{
    font-size: 45px;
    font-weight: 600;
    margin-bottom: 15px;
}
.hero-content .hero-title span {
    font-size: 48px;
}
.hero-content .hero-text{
    font-size: 20px;
    font-weight: 600;
    color: var(--blue);
    margin-bottom: 15px;
}
.small-hero-text{
    margin-top: 15px;
}


/* Ask Questions Section */
.ask-questions{
    padding: 60px 0;
}

.ask-title-box{
    background-color: var(--dark-blue);
    border-radius: 8px;
    width: 70%;
    margin: 0 auto;
    box-shadow: 0px 8px 18px var(--shadow);
    margin-bottom: 60px;
    padding: 12px 0;
}

.ask-title{
    font-size: 32px;
    font-weight: bold;
    color: var(--white);
    padding: 1px 0;
    margin: 0;
}

.ask-icon-wrapper{
    width: 95%;
    margin: 0 auto;
}

.ask-icon .icon-wrapper{
    height: 90px;
    width: 90px;
    border-radius: 50%;
    margin: 0 auto;
    margin-bottom: 15px;
}
.ask-icon .icon-wrapper img{
    margin: 0 auto;
}
.ask-icon .icon-title{
    text-transform: uppercase;
    color: var(--black);
    font-size: 14px;
    font-weight: bolder;
    text-align: center;
    margin-bottom: 40px;
}

/* Ask Icon Color Set */
.ask-icon-wrapper .col-md-2:nth-child(1) .ask-icon .icon-wrapper{
    background: var(--icon-1);
}
.ask-icon-wrapper .col-md-2:nth-child(2) .ask-icon .icon-wrapper{
    background: var(--icon-2);
}
.ask-icon-wrapper .col-md-2:nth-child(3) .ask-icon .icon-wrapper{
    background: var(--icon-3);
}
.ask-icon-wrapper .col-md-2:nth-child(4) .ask-icon .icon-wrapper{
    background: var(--icon-4);
}
.ask-icon-wrapper .col-md-2:nth-child(5) .ask-icon .icon-wrapper{
    background: var(--icon-5);
}
.ask-icon-wrapper .col-md-2:nth-child(6) .ask-icon .icon-wrapper{
    background: var(--icon-6);
}
.ask-icon-wrapper .col-md-2:nth-child(7) .ask-icon .icon-wrapper, .ask-icon-wrapper .col-md-2:nth-child(15) .ask-icon .icon-wrapper{
    background: var(--icon-7);
}
.ask-icon-wrapper .col-md-2:nth-child(8) .ask-icon .icon-wrapper, .ask-icon-wrapper .col-md-2:nth-child(18) .ask-icon .icon-wrapper{
    background: var(--icon-8);
}
.ask-icon-wrapper .col-md-2:nth-child(9) .ask-icon .icon-wrapper{
    background: var(--icon-9);
}
.ask-icon-wrapper .col-md-2:nth-child(10) .ask-icon .icon-wrapper{
    background: var(--icon-10);
}
.ask-icon-wrapper .col-md-2:nth-child(11) .ask-icon .icon-wrapper{
    background: var(--icon-11);
}
.ask-icon-wrapper .col-md-2:nth-child(12) .ask-icon .icon-wrapper{
    background: var(--icon-12);
}
.ask-icon-wrapper .col-md-2:nth-child(13) .ask-icon .icon-wrapper{
    background: var(--icon-13);
}
.ask-icon-wrapper .col-md-2:nth-child(14) .ask-icon .icon-wrapper{
    background: var(--icon-14);
}
.ask-icon-wrapper .col-md-2:nth-child(16) .ask-icon .icon-wrapper{
    background: var(--icon-15);
}
.ask-icon-wrapper .col-md-2:nth-child(17) .ask-icon .icon-wrapper{
    background: var(--icon-16);
}
.ask-icon-wrapper .col-md-2:nth-child(21) .ask-icon .icon-wrapper{
    background: var(--icon-17);
}
.ask-icon-wrapper .col-md-2:nth-child(22) .ask-icon .icon-wrapper{
    background: var(--icon-18);
}


/* Get Started Section */
.get-started{
    background-image: url(../images/get-started-bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    box-shadow: 0px 10px 10px var(--shadow-2);
}
.get-started-img{
    margin: 40px 0 92px 0;
}
.get-started-patten{
    position: absolute;
    width: 100%;
    bottom: 0;
    right: 0;
}
.get-started-content h1{
    font-size: 36px;
    font-weight: bold;
    color: var(--dark-blue);
    margin-bottom: 30px;
}
.get-started-content {
    z-index: 1;
}


/* Term and Policy */
.policy-term{
    padding-top: 127px;
    padding-bottom: 60px;
}

.policy-term .main-headding{
    margin-bottom: 60px;
}
.policy-term b{
    color: var(--dark-blue);
}


/* Contact */
.contact{
    padding-top: 127px;
    padding-bottom: 60px; 
}
.contact h1, .contact p{
    margin-bottom: 20px;
}
.icon-content{
    margin-left: 15px;
}
.icon-content p{
    margin: 0;
}
.icon-content b{
    color: var(--dark-blue);
    margin-bottom: 10px;
}
.contact-icon-wrapper .icon-box .icon{
    width: 60px;
    height: 60px;
    border-radius: 50%;
}
.contact-icon-wrapper .icon-box{
    margin-bottom: 20px;
}
.contact-icon-wrapper .icon-box:nth-child(1) .icon{
    background: var(--icon-8);
}
.contact-icon-wrapper .icon-box:nth-child(2) .icon{
    background: var(--icon-16);
}
.contact-icon-wrapper .icon-box:nth-child(3) .icon{
    background: var(--icon-7);
}
.contact-form-wrapper{
    background-color: var(--card);
    border-radius: 8px;
    padding: 30px;
}
.contact-form-wrapper h5{
    color: var(--dark-blue);
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 20px;
}


/* Footer */
footer{
    padding: 20px 0;
}
.copyright a{
    color: var(--blue);
}
.copyright a:hover{
    color: var(--dark-blue);
}
.footer-other-link a{
    color: var(--black);
}
.footer-other-link a:hover{
    color: var(--blue);
}

/* Footer-Patten */
.footer-patten{
    box-shadow: 0px 10px 10px var(--shadow-2);
}

/* 08 Sep 2022 ========================== */

.step_slider_box{
    margin-top: 68px;
    padding: 76px 0;
 }
 
 .step_count img{
     width: 100%;
 }
 
 .step_content_card h3{
     color: #1890ff;
     font-size: 32px;
     font-weight: 600;
     margin: 0 0 20px 0;
     text-align: center;
 }
 
 .step_content_card h4{
     color: #032d60;
     font-size: 26px;
     font-weight: 700;
     margin: 0 0 30px 0;
     text-align: center;
 }
 
 .step_content_form label{
     color: #5e5e5e;
     font-size: 14px;
     font-weight: 600;
     margin: 0 0 10px 0;
 }

 .step_content_card .progress-bar{
    background-color: #13447b;
  }

  .contact_f_box{
    margin-bottom: 15px;
  }

  .ant-form-item-explain-error{
    color: red;
    font-size: 12px;
  }

  /* 02-09-2022 */
  .step-progress {
    width: 80%;
    margin: 30px auto;
    border-radius: 18px;
    border: 1px solid var(--progress-border);
    box-shadow: 0 0 4px var(--shadow-2);
    height: 18px;
  }
  .step-progress .progress-bar {
    border-radius: 10px;
  }

  .step-btn-group{
    margin-top: 30px;
  }
  .content-bg{
    box-shadow: 0px 10px 10px var(--shadow-2);
  }
  .step_count{
    margin: auto 0;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
  }
  .step-btn{
    text-decoration: none !important;
  }
  .step-btn .sec-btn{
    color: var(--black);
  }
  .step-btn .sec-btn:hover{
    background-color: var(--black);
    color: var(--white);
  }
  .check-box-text{
    font-size: 11px !important;
    font-weight: 400 !important;
    margin-top: 3px !important;
  }
  .thanks-text-center{
    margin-top: 42px;
  }
  .mob-steps{
    display: none;
  }
  select{
    /** for the dropdown indicator */
    appearance: none;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 1em;
  }
  textarea::placeholder{
    color:rgb(94, 94, 94);
    font-weight: 400;
  }
  .form-item-holder .ant-form-item-control-input-content {
    display: flex;
}
/* ========================== */


 /* Media Query */
@media only screen and (max-width: 768px){
    .mob-header{
        display: block !important;
        text-align: center;
    }
    .logo{
        margin: 0 auto;
        margin-bottom: 15px;
        display: block;
    }
    .header-email{
       margin: 0 auto;
       display: block;
       justify-content: center;
    }
    .step_slider_box {
        margin-top: 105px;
        padding: 40px 0px !important;
    }
    .mob-steps{
        display: block !important;
        margin-bottom: 30px;
    }
    .desktop-steps{
        display: none !important;
    }
    .step_count{
        margin: 0px !important;
    }
    .step-btn .sec-btn {
        padding: 8px 20px;
        font-size: 14px;
    }
    .step-btn .main-btn {
        padding: 8px 20px;
        font-size: 14px;
    }
}

@media only screen and (max-width: 767px){
    .get-started-img{
        width: 100%;
        margin-bottom: 0;
    }

    .hero-baner{
        padding-top: 125px;
    }

    .main-btn{
        padding: 8px 20px;
        font-size: 14px;
    }

    .get-started-content h1{
        font-size: 28px;
        margin-top: 30px;
    }

    .get-started-content{
        text-align: center;
    }

    .ask-icon-wrapper .col-md-2 {
        width: 50%;
    }

    .hero-content{
        text-align: center;
    }

    .hero-content .hero-title{
        font-size: 26px;
    }

    .hero-content .hero-title span{
        font-size: 24px;
    }

    .ccd{
        justify-content: center;
    }

    .step_count {
        margin: 50px 0 50px 0;
}

}