@import url("https://fonts.googleapis.com/css2?family=El+Messiri:wght@400;500;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,300;0,400;0,600;0,700;1,500&display=swap");

* {
    font-family    : "Poppins", sans-serif;
    font-weight    : 400;
    scroll-behavior: smooth;
}

.elm {
    font-family: "El Messiri", sans-serif;
}

.letter-height {
    line-height: 33px;
    color      : #888888;
}

button:focus,
input[type="submit"]:focus {
    outline: 0;
}

a:hover {
    text-decoration: none;
}

.cmn-btn {}

.cmn-btn:hover {}

.p-100 {
    padding: 100px 0px;
}

.main-title {
    font-size  : 55px;
    font-family: "El Messiri", sans-serif;
    font-weight: bold;
    color      : #000;
    line-height: 70px;
}

input:focus,
textarea:focus {
    outline   : none !important;
    box-shadow: none !important;
    border    : 0;
}

/* HEADER CSS */

.header {
    position: relative;
    z-index : 999;
}

.header.shrink nav {
    position          : fixed;
    top               : 0;
    left              : 0;
    z-index           : 999;
    width             : 100%;
    background-color  : #fff;
    box-shadow        : 0 0 11px rgba(0, 0, 0, 0.18);
    animation-name    : SlideDown;
    transform         : translateY(0px);
    animation-duration: 1s;
    border-radius     : 0 0 15px 15px;
}

@keyframes SlideDown {
    from {
        transform: translateY(-70px);
    }

    to {
        transform: translateY(0px);
    }
}

.header nav {
    background-color: #2360C3;
}

.header nav .navbar-brand .green-logo {
    display: none;
}

.header.shrink nav .navbar-brand .green-logo {
    display: block;
}

.header.shrink nav .navbar-brand .white-logo {
    display: none;
}

.header.shrink .navbar-nav .nav-item .nav-link {
    color: #888888;
}

.header .navbar-nav .nav-item {
    margin-left: 20px;
}

.header .navbar-nav .nav-item .nav-link {
    font-size     : 16px;
    color         : #fff;
    text-transform: uppercase;
    font-weight   : 600;
    letter-spacing: 1px;
    padding       : 0;
    position      : relative;
}

.header .navbar-nav .nav-item.active .nav-link,
.header .navbar-nav .nav-item:hover .nav-link {
    color: #fff;
}

.header .navbar-nav .nav-item .nav-link::before {
    position        : absolute;
    content         : "";
    background-color: #fff;
    height          : 2px;
    width           : 0%;
    border-radius   : 50px;
    bottom          : -6px;
    left            : 0;
    right           : 0;
    margin          : 0px auto;
    transition      : all 0.3s;
}

.header.shrink .navbar-nav .nav-item .nav-link.active,
.header.shrink .navbar-nav .nav-item:hover .nav-link {
    color: #2360C3;
}

.header.shrink .navbar-nav .nav-item .nav-link::before {
    background-color: #2360C3;
}

.header .navbar-nav .nav-item .nav-link.active::before,
.header .navbar-nav .nav-item:hover .nav-link::before {
    width: 30px;
}

/* FOOTER CSS */

.footer {
    background-color: #fff;
    padding-top     : 50px;
    color           : #888888;
}

.footer .footer-title {
    color      : #2360C3;
    font-size  : 22px;
    font-weight: 600;
    line-height: 34px;
}

.footer .letter-height {
    font-size  : 18px;
    line-height: 27px;
}

.footer ul {
    list-style-type: none;
}

.footer .clm-1 ul li {
    margin-bottom: 8px;
}

.footer .clm-2 .link-wrap ul {
    display   : flex;
    flex-wrap : wrap;
    margin-top: 20px;
}

.footer .clm-2 .link-wrap ul li:not(:last-child) {
    margin-right: 20px;
}

.footer .clm-2 .link-wrap ul li a {
    width        : 37px;
    height       : 37px;
    line-height  : 40px;
    border-radius: 3px;
    box-shadow   : 0 3px 6px rgba(0, 0, 0, 0.16);
    display      : block;
    text-align   : center;
}

.footer .clm-2 .link-wrap ul li a i {
    font-size: 18px;
}

.footer .clm-2 .link-wrap ul li a.facebook i {
    color: #3B5998;
}

.footer .clm-2 .link-wrap ul li a.instagram i {
    color: #FF4343;
}

.footer .clm-2 .link-wrap ul li a.twitter i {
    color: #00ACEE;
}

.footer .clm-2 .link-wrap ul li a.linkedin i {
    color: #0E76A8;
}

.footer .clm-3 .form-group {
    position     : relative;
    margin-bottom: 0;
    margin-top   : 20px;
}

.footer .clm-3 .form-group .email-img {
    position : absolute;
    top      : 50%;
    transform: translateY(-50%);
    left     : 11px;
}

.footer .clm-3 .form-group input {
    box-shadow   : 0 3px 6px rgba(0, 0, 0, 0.16);
    padding-left : 36px;
    padding-right: 40px;
    border       : 0;
}

.footer .clm-3 .form-group input:focus {
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16) !important;
}

.footer .clm-3 .form-group button {
    position        : absolute;
    top             : 50%;
    transform       : translateY(-50%);
    height          : 37px;
    width           : 37px;
    background-color: #2360C3;
    border          : 0;
    border-radius   : 5px;
    right           : 0;
}

.footer .clm-4 a {
    font-size       : 15px;
    background-color: #fff;
    color           : #2360C3;
    padding         : 10px 20px;
    display         : inline-block;
    border-radius   : 5px;
    border          : 1px solid #2360C3;
    transition      : all 0.3s;
    margin-top      : 20px;
}

.footer .clm-4 a:hover {
    box-shadow: 3px 6px 9px rgba(0, 0, 0, 0.2);
}

.footer ul>li>a:hover {
    color: #2360C3;
}


.footer .footer-last-row {
    margin-top      : 70px;
    background-color: #2360C3;
}

.footer .footer-last-row p {
    color  : #2F7418;
    padding: 18px 0px;
}

.footer .footer-last-row p a {
    color: #fff;
}

/* INDEX PAGE CSS */

.home-sec-1 {
    position: relative;
}

.home-sec-1 .wave-wrap {
    height  : 561px;
    width   : 100%;
    position: absolute;
    left    : 0;
    top     : -68px;
    overflow: hidden;
    z-index: -9;
}
.home-sec-1 .wave-wrap .wave{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 561px;
    background: url(../images/single-green-wave.svg);
    background-size: 1200px 561px;
    animation: wave 12s linear infinite;
    z-index: 1000;
    animation-delay: 0s;
    background-repeat-y: no-repeat;
}
.home-sec-1 .wave-wrap .wave:nth-child(2){
    position: absolute;
    top: 13px;
    left: 0;
    width: 100%;
    height: 561px;
    background: url(../images/single-white-wave.svg);
    background-size: 1200px 561px;
    animation: wave2 12s linear infinite;
    z-index: 1000;
    animation-delay: 0s;
    background-repeat-y: no-repeat;
}
@keyframes wave {
    0% {
        background-position-x: 0;
    }

    100% {
        background-position-x: 1200px;
    }
}
@keyframes wave2 {
    0% {
        background-position-x: 0;
    }

    100% {
        background-position-x: 1200px;
    }
}
/* .home-sec-1 .wave-wrap .wave {
    background: url(../images/single-green-wave.svg) repeat-x;
    position: absolute;
    top: 0;
    width: 6400px;
    height: 561px;
    animation: wave 15s cubic-bezier(0.36, 0.45, 0.63, 0.53) infinite;
    transform: translate3d(0, 0, 0);
  }
  
  .home-sec-1 .wave-wrap .wave:nth-of-type(2) {
    background: url(../images/single-white-wave.svg) repeat-x;
    top: 13px;
    animation: wave 15s cubic-bezier(0.36, 0.45, 0.63, 0.53) -0.1s infinite,
      swell 15s ease -1.01s infinite;
    opacity: 1;
  }

@keyframes wave {
    0% {
        margin-left: 0;
    }

    100% {
        margin-left: -100%;
    }
}

@keyframes swell {

    0%,
    100% {
        transform: translate3d(0, -15px, 0);
    }

    50% {
        transform: translate3d(0, 5px, 0);
    }
} */

.home-sec-1 .title-clm .main-title {
    color      : #fff;
    padding-top: 126px;
    text-align : center;
    text-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
}

.home-sec-1 .title-clm .store-title {
    color         : #000;
    text-transform: uppercase;
    font-size     : 24px;
    text-align    : center;
    font-weight   : 500;
    line-height   : 35px;
    padding-top   : 230px;
}

.home-sec-1 .title-clm .strore-btns {
    list-style-type: none;
    padding        : 0;
    display        : flex;
    justify-content: center;
    margin-top     : 40px;
}

.home-sec-1 .title-clm .strore-btns li:hover a {
    transform : scale(1.02);
    box-shadow: 3px 6px 9px rgba(0, 0, 0, 0.2);
}

.home-sec-1 .title-clm .strore-btns li:not(:last-child) {
    margin-right: 40px;
}

.home-sec-1 .title-clm .strore-btns li a {
    font-size       : 20px;
    line-height     : 30px;
    color           : #fff;
    background-color: #2360C3;
    padding         : 12.5px 20px;
    display         : block;
    border-radius   : 5px;
    border          : 1px solid #2360C3;
    transition      : all 0.3s;
}

.home-sec-1 .title-clm .strore-btns li a i {
    margin-right: 9px;
    font-size   : 28px;
    position    : relative;
    top         : 3px;
}

.home-sec-1 .title-clm .strore-btns li.app-store a {
    background-color: #fff;
    color           : #2360C3;
}

.home-sec-2 {
    padding-bottom: 50px;
}

.home-sec-2 .left-clm .main-title {
    font-size: 46px;
}

.home-sec-2 .left-clm .letter-height {
    font-size: 18px;
}

.home-sec-3 {
    background-color: #f7f7f7;
    padding-bottom  : 50px;
}

.home-sec-3 .title-clm .main-title {
    margin-bottom: 15px;
}

.home-sec-3 .card-item {
    padding: 25px 18px;
}

.home-sec-3 .card-item .icon {
    margin-bottom: 25px;
}

.home-sec-3 .card-item .card-heading {
    color             : #000;
    font-weight       : 600;
    font-size         : 24px;
    margin-bottom     : 20px;
    display           : -webkit-box;
    text-overflow     : ellipsis;
    -webkit-line-clamp: 1;
    display           : -webkit-box;
    -webkit-box-orient: vertical;
    white-space       : normal;
    overflow          : hidden;
}

.home-sec-3 .card-item .card-desc {
    font-size         : 18px;
    display           : -webkit-box;
    text-overflow     : ellipsis;
    -webkit-line-clamp: 4;
    display           : -webkit-box;
    -webkit-box-orient: vertical;
    white-space       : normal;
    overflow          : hidden;
}

.home-sec-3 .learnmore {
    color           : #fff;
    padding         : 16px 32px;
    font-size       : 20px;
    background-color: #2360C3;
    box-shadow      : 0 3px 6px rgba(0, 0, 0, 0.16);
    border-radius   : 5px;
    margin-top      : 40px;
    display         : inline-block;
    transition      : all 0.3s;
}

.home-sec-3 .learnmore:hover {
    box-shadow: 3px 6px 9px rgba(0, 0, 0, 0.2);
}

.home-sec-4 {
    padding-top: 152px;
    position   : relative;
}

.home-sec-4::before {
    position        : absolute;
    content         : "";
    background-image: url(../images/feedback-wave.svg);
    width           : 100%;
    height          : 152px;
    top             : 0;
    left            : 0;
}

.home-sec-4 .quote-wrap .quote {
    position     : relative;
    text-align   : center;
    margin-top   : 20px;
    margin-bottom: 20px;
}

.home-sec-4 .quote-wrap .quote:before {
    position        : absolute;
    content         : "";
    background-color: #2360C3;
    width           : 238px;
    height          : 1px;
    top             : 50%;
    left            : 50%;
    transform       : translate(-50%, -50%);
}

.home-sec-4 .quote-wrap .quote i {
    width           : 63px;
    height          : 63px;
    line-height     : 63px;
    font-size       : 28px;
    background-color: #2360C3;
    border-radius   : 50%;
    color           : #fff;
    position        : relative;
}

.home-sec-4 .slider-clm {
    text-align: center;
}

.home-sec-4 .slider-clm .item .testimonial-text {
    font-size: 18px;
}

.home-sec-4 .slider-clm .item .img-box {
    width        : 103px;
    height       : 103px;
    overflow     : hidden;
    position     : relative;
    border-radius: 50%;
    margin       : 20px auto 0;
}

.home-sec-4 .slider-clm .item .img-box img {
    max-height: 103px;
    width     : unset;
    position  : absolute;
    left      : 50%;
    top       : 50%;
    transform : translate(-50%, -50%);
}

.home-sec-4 .slider-clm .item .img-name .name {
    font-size  : 18px;
    color      : #000;
    font-weight: 600;
    line-height: 27px;
    margin-top : 10px;
}

.home-sec-4 .slider-clm .item .img-name .desig {
    font-size  : 14px;
    color      : #888888;
    font-weight: 300;
    line-height: 21px;
}

.home-sec-4 .slider-clm .owl-nav {
    display: none;
}

.home-sec-4 .slider-clm .owl-dots {
    margin-top: 40px;
}

.home-sec-4 .slider-clm .owl-dots button {
    width           : 9px;
    height          : 9px;
    background-color: #888888;
    border-radius   : 50%;
}

.home-sec-4 .slider-clm .owl-dots button:not(:last-child) {
    margin-right: 10px;
}

.home-sec-4 .slider-clm .owl-dots button.active {
    background-color: #2360C3;
}

.home-sec-5 {
    background-image     : url(../images/download-bg.png);
    background-position  : center;
    background-size      : cover;
    background-attachment: fixed;
    background-repeat    : no-repeat;
    position             : relative;
    padding-bottom       : 150px;
}

.home-sec-5::before {
    position        : absolute;
    content         : "";
    background-color: rgba(0, 0, 0, 0.7);
    width           : 100%;
    height          : 100%;
    top             : 0;
    left            : 0;
}

.home-sec-5::after {
    content: "";
    display: block;
    position: absolute;
    height: 100px;
    width: 100%;
    bottom: 0px;
    left: 0px;
    z-index: 9;
    background-color: #2360C3;
    opacity: 1;
    clip-path: polygon(50% 100%, 100% 50%, 100% 0%, 50% 100%, 0% 0%, 0% 50%);
    -webkit-clip-path: polygon(50% 100%, 100% 50%, 100% 100%, 50% 100%, 0% 100%, 0% 50%);
}

.home-sec-5 .title-clm .main-title {
    color: #fff;
}

.home-sec-5 .title-clm ul {
    list-style-type: none;
    padding        : 0;
    display        : flex;
    justify-content: center;
    margin-top     : 30px;
}

.home-sec-5 .title-clm .ul li:hover a {
    transform : scale(1.02);
    box-shadow: 3px 6px 9px rgba(0, 0, 0, 0.2);
}

.home-sec-5 .title-clm ul li:not(:last-child) {
    margin-right: 56px;
}



.contact-modal .modal-dialog {
    position : relative;
    max-width: 716px;
}

.contact-modal .modal-dialog .modal-content {
    border: 0;
}

.contact-modal .modal-dialog .modal-content>.fa-times {
    position : absolute;
    top      : 0;
    right    : -40px;
    color    : #fff;
    font-size: 30px;
    cursor   : pointer;
}

.contact-modal .modal-dialog .modal-content .modal-body {
    padding-bottom: 50px;
    padding-top   : 30px
}

.contact-modal .modal-dialog .info-box {
    border-radius   : 12px;
    background-color: #2360C3;
    padding         : 25px;
    max-width       : 338px;
    position        : absolute;
    width           : 338px;
    height          : 492px;
    left            : -34px;
}

.contact-modal .modal-dialog .info-box .title {
    color        : #fff;
    margin-bottom: 30px;
}

.contact-modal .modal-dialog .info-box .contact-details {
    list-style-type: none;
    padding        : 0;
}

.contact-modal .modal-dialog .info-box .contact-details li {
    display    : flex;
    align-items: flex-start;
}

.contact-modal .modal-dialog .info-box .contact-details li:not(:last-child) {
    margin-bottom: 25px;
}

.contact-modal .modal-dialog .info-box .contact-details li .img-box {
    width       : 20px;
    margin-right: 20px;
}

.contact-modal .modal-dialog .info-box .contact-details li label {
    color: #fff;
}

.contact-modal .modal-dialog .info-box .social-icons {
    display        : flex;
    flex-wrap      : wrap;
    margin-top     : 30px;
    list-style-type: none;
    padding        : 0;
}

.contact-modal .modal-dialog .info-box .social-icons li:not(:last-child) {
    margin-right: 20px;
}

.contact-modal .modal-dialog .info-box .social-icons li a {
    width           : 37px;
    height          : 37px;
    line-height     : 40px;
    border-radius   : 3px;
    box-shadow      : 0 3px 6px rgba(0, 0, 0, 0.16);
    display         : block;
    text-align      : center;
    background-color: #fff;
}

.contact-modal .modal-dialog .info-box .social-icons a i {
    font-size: 18px;
}

.contact-modal .modal-dialog .info-box .social-icons a.facebook i {
    color: #3B5998;
}

.contact-modal .modal-dialog .info-box .social-icons a.instagram i {
    color: #FF4343;
}

.contact-modal .modal-dialog .info-box .social-icons a.twitter i {
    color: #00ACEE;
}

.contact-modal .modal-dialog .info-box .social-icons a.linkedin i {
    color: #0E76A8;
}

.contact-modal .modal-dialog .form-clm {
    padding-left : 0;
    padding-right: 25px;
}

.contact-modal .modal-dialog .title {
    font-size  : 36px;
    font-weight: 500;
    color      : #2360C3;
    line-height: 55px;
}

.contact-modal .modal-dialog .subtitle {
    color        : #888888;
    font-size    : 18px;
    margin-bottom: 10px;
}

.contact-modal .modal-dialog .form-clm input,
.contact-modal .modal-dialog .form-clm textarea {
    background-color: rgba(0, 0, 0, 0.04);
    border          : 0px;
}

.contact-modal .modal-dialog .form-clm .form-group label {
    font-size    : 12px;
    color        : #000;
    font-weight  : 600;
    margin-bottom: 3px;
}

.contact-modal .modal-dialog .form-clm .form-group label span {
    color      : #ff0000;
    font-size  : 12px;
    font-weight: 700;
}

.contact-modal .modal-dialog .form-clm .form-group button[type="submit"] {
    border          : 0;
    background-color: #2360C3;
    border-radius   : 5px;
    font-size       : 15px;
    color           : #fff;
    padding         : 8px 18px;
    line-height     : 23px;
}

.contact-modal .modal-dialog .form-clm .form-group button[type="submit"] i {
    margin-right: 7px;
}