html, body { margin: 0; padding: 0; overflow-x: hidden; max-width: 100vw; }.heading { color: #00AEEB; } .btn-home { background-color: #00AEEB; border-radius: 20px; color: white; border: none; width: 113px; height: 38px; font-weight: bold; } .btn-home:hover { background-color: #007acc; } .home-img { max-width: 500px; } @media (max-width: 768px) { .home-img { max-width: 480px; } } @media (max-width: 480px) { .home-img { max-width: 280px; } } .swiper-slider { margin-left: 10px; display: flex; flex-direction: row; justify-content: space-between; align-items: center; width: 100%; } .swiper { width: 100%; max-width: 1250px; overflow: hidden; } .swiper-wrapper { display: flex; align-items: center; } .swiper-slide .slide { width: auto; flex-shrink: 0; display: flex; gap: 20px; justify-content: center; align-items: center; transition: transform 0.5 ease-in-out; } @media (max-width: 768px) { .img1 { max-width: 90px; height: auto; } .img2 { max-width: 90px; height: auto; } .img3 { max-width: 90px; height: auto; } .img4 { max-width: 100px; height: 80px; } } @media (max-width: 480px) { .img1 { max-width: 50px; height: auto; } .img2 { max-width: 50px; height: auto; } .img3 { max-width: 50px; height: auto; } } @media (max-width: 425px) { .img1 { max-width: 60px; height: auto; } .img2 { max-width: 60px; height: auto; } .img3 { max-width: 60px; height: auto; } .img4 { max-width: 60px; height: 60px; } } @media (max-width: 375px) { .img1 { max-width: 55px; height: auto; } .img2 { max-width: 50px; height: auto; } .img3 { max-width: 55px; height: auto; } .img4 { max-width: 55px; height: 60px; } } @media (max-width: 320px) { .img1 { max-width: 50px; height: auto; } .img2 { max-width: 45px; height: auto; } .img3 { max-width: 45px; height: auto; } .img4 { max-width: 55px; height: 60px; } } .swipper-wrapper { width: 110%; position: relative; } .img1 { width: 200px; height: 110px; object-fit: contain; vertical-align: middle; } .img2 { width: 200px; height: 80px; object-fit: contain; } .img3 { width: 160px; } .img4 { width: 200px; height: auto; } .top-features-heading { color: #00AEEB; margin-top: 100px; } .feature-box { padding: 20px; text-align: center; } .feature-border { background-color: rgba(0, 174, 235, 0.8); padding: 10px; margin-bottom: 20px; width: 79px; height: 79px; display: inline-block; border-radius: 10px; } .feature-bg { background-color: rgba(173, 248, 241, 0.8); border-radius: 80px; padding: 25px; width: 60px; height: 60px; margin-bottom: 35px; display: flex; justify-content: center; align-items: center; } @media (max-width: 480px) { .fea-text1 { margin-top: 60px; } .features-card { height: 180px !important; } } @media (max-width: 768px) { .features-card { height: 190px !important; } } .fa-2xl { color: white; width: 195px; } .feature-bg img { width: 45px !important; height: 45px !important; margin-top: -6px; margin-right: 1px; } .crm-features { color: #00AEEB; padding-bottom: 30px; } .features-card { position: relative; display: flex; text-align: left; padding: 40px 20px 20px; border-radius: 10px; background-color: #FCFCFC; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); transition: transform 0.3s ease-in-out; height: 150px; } .features-card:hover { transform: translateY(-5px); } .features-icon { position: absolute; width: 100px; height: 100px; display: flex; align-items: center; justify-content: center; border-radius: 50%; margin-right: 15px; flex-shrink: 0; } .features-icon img { width: 70px; height: 70px; } .blue-bg { margin-top: -80px; background-color: #d1e9ff; border-radius: 50px; padding: 10px; } .yellow-bg { margin-top: -80px; background-color: #F5E18E; border-radius: 50px; padding: 10px; } .green-bg { margin-top: -80px; background-color: #ADF8F1; border-radius: 50px; padding: 10px; } .purple-bg { margin-top: -80px; background-color: #98B5E8; border-radius: 50px; padding: 10px; } .feature-text { flex-grow: 1; margin-top: 10px; margin-left: -80px; } .mission-text-container { text-align: justify; } .security-title { color: #00AEEB; margin-bottom: 10px; } .security-text { text-align: justify; font-size: 18px; } .sec-text { width: 55%; } .text-div { display: flex; justify-content: center; align-items: center; flex-direction: column; } @media (max-width: 768px) { .security-img-div { max-width: 300px !important; margin-bottom: 20px; } .sec-text { max-width: 100%; padding-bottom: 30px; text-align: center; } .security-img1 { margin-top: -70px; } .security-img { margin-bottom: 50px; } .security-img2 { margin-top: -70px; } .security-text { margin-left: 2px; margin-right: 2px; } } @media (max-width: 480px) { .sec-text { width: 100%; } } .sec-text { font-size: 18px; } .security-img { width: 100%; } .security-img1 { width: 100%; height: 364px; object-fit: contain; } .security-img2 { width: 100%; height: 364px; object-fit: contain; } #iblog { background-color: rgba(246, 246, 255); } .blog-sec { margin-left: 20px; } .blog-section { padding: 50px 25px; align-items: center; } .blog-title { color: #00AEEB; font-weight: bold; flex-grow: 1; overflow: hidden; text-overflow: ellipsis; text-align: left; } @media (max-width: 480px) { .blog-title { font-size: 18px; } .blog-button { border-radius: 50px; width: 45%; font-size: 14px; } .blog-button i { width: 8px; } .card-blog { margin-bottom: 20px; } } .blog-button { background-color: #00AEEB; color: white; border-radius: 20px; padding: 8px 20px; border: none; } .blog-button:hover { background-color: #007acc; color: white; } .blog-card { background: #fff; border-radius: 10px; box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1); max-width: 300px; width: 100%; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; transition: 0.3 ease-in-out; cursor: pointer; height: 420px; padding-left: 20px; } .blog-card:hover { transform: translateY(-5px); } .blog-card img { width: 100%; height: 250px; object-fit: contain; border-radius: 10px; } @media (max-width: 576px) { .blog-card { margin-left: 45px; } } @media (max-width: 375px) { .blog-card { margin-left: 25px !important; } } @media (max-width: 425px) { .blog-card { margin: 50px; } } @media (max-width: 320px) { .blog-card { margin-left: -12px !important; } } @media (max-width: 344px) { .blog-card { margin-left: 6px !important; } } #image-header-shape { width: 100%; } .review-section { display: flex; justify-content: center; text-align: center; flex-direction: column; padding: 40px 10px; position: relative; } .review-text { font-size: 12px; flex-grow: 1; overflow: hidden; text-overflow: inherit; } .profile { display: flex; align-items: center; gap: 5px; } .profile img { width: 45px; height: 45px; border-radius: 50%; } .review-card-heading h5 { font-weight: bold; font-size: 16px; margin-top: -5px; margin-left: 5px; margin-bottom: -1px; } .review-card-heading p { font-size: 13px; margin-bottom: -1px; margin-left: 5px; } @media (max-width: 768px) { .review-text { font-size: 0.9rem; } } .text-muted { font-size: 18px; } .stars { margin-top: -20px; max-width: 5px; height: auto; color: #ffd700; } .experience { font-size: 15px; font-weight: bold; } .gray-bg { background-color: #F3F2F2; border-radius: 50%; padding: 8px; margin-bottom: 25px !important; } .mySwiper1 { width: 90%; max-width: 900px; height: 450px; } .swiper-slide { display: flex; justify-content: center; align-items: center; transition: transform 0.5 ease-in-out; } .swiper-button-next, .swiper-button-prev { position: absolute; bottom: -10px; transform: translateY(50%); color: rgb(71, 71, 71) !important; width: 10px !important; height: 227px !important; display: flex; justify-content: center; align-items: center; z-index: 10; border-radius: 50%; gap: 50px; } .swiper-button-next::after, .swiper-button-prev::after { font-size: 16px !important; font-weight: bold; gap: 50px !important; } .swiper-button-prev { left: 40%; margin-left: 370px; } .swiper-button-next { left: 40%; margin-right: 370px; } .swiper-pagination { position: absolute; bottom: 5px; width: 100%; text-align: center; z-index: 10; } .swiper-pagination-bullet { width: 10px; height: 10px; margin: 0 5px; margin-bottom: 15px; transition: background 0.3s ease-in-out; background: #00AEEB !important; opacity: 1; } .swiper-pagination-bullet-active { background: #007acc !important; opacity: 1; } .slider-container { width: 80%; overflow: hidden; margin: auto; position: relative; } .review-card { background: white; display: flex; flex-direction: column; overflow: hidden; min-width: calc(100% / 3 - 20px); border-radius: 10px; text-align: left; transition: 0.5s ease-in-out; width: 280px; padding: 20px; box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1); transition: transform 0.5s ease-in-out; margin: 5px; height: 330px; } @media (max-width:768px) { .review-card { max-width: 95%; height: 440px; margin: 0 auto; } } .faq-container { width: 80%; background: white; padding: 20px; border-radius: 10px; box-shadow: 0px 4px 15px rgba(0, 174, 235, 0.8); transition: box-shadow 0.3s ease-in-out; } .faq-question { width: 100%; color: #00AEEB; padding: 15px; font-size: 16px; text-align: left; background: none; border: none; cursor: pointer; outline: none; display: flex; justify-content: space-between; align-items: center; font-weight: bold; } .faq-answer { display: none; padding: 15px; font-size: 14px; color: #555; } .icon { font-size: 25px; transition: transform 0.3s; color: #000; } .faq-item.active .faq-answer { display: block; } .faq-item.active .icon { transform: rotate(45deg); } :root { --global-palette1: #4481EB; --global-palette2: #04BEFE; --global-palette3: #1a202c; --global-palette4: #2d3748; --global-palette5: #4a5568; --global-palette6: #718096; --global-palette7: #edf2f7; --global-palette8: #f7fafc; --global-palette9: #ffffff; } .text { color: var(--global-palette4); } .btn-primary { background-color: var(--global-palette9); border: 2px solid var(--global-palette9); color: var(--global-palette2); } .btn-sedondary { background-color: var(--global-palette2); border: 2px solid var(--global-palette2); color: var(--global-palette9); } .btn-primary:hover { color: var(--global-palette9); } .btn-sedondary:hover { color: var(--global-palette2); } .btn-primary-bg { background-color: var(--global-palette1); color: var(--global-palette9); border: 1px solid var(--global-palette1); } .btn-primary-bg:hover { background-color: var(--global-palette2); color: var(--global-palette9); border: 1px solid var(--global-palette1); } .btn-primary-outline-bg { background-color: var(--global-palette9); color: var(--global-palette1); border: 1px solid var(--global-palette1); } .text-primary { color: var(--global-palette1) !important; } .owl-theme .owl-nav [class*=owl-]:hover { color: var(--global-palette1); } .owl-theme .owl-dots .owl-dot:hover span { background: var(--global-palette1); } .owl-theme .owl-dots .owl-dot.active span { background: var(--global-palette3); } .bs-shape .shape-fill { fill: var(--global-palette7); } .hero-title { color: var(--global-palette4); } .hero-sub-title { color: var(--global-palette4); } nav .onwave-link a { color: var(--global-palette3); } .menu-item-hover { color: var(--global-palette3); } .card-items .card .card-body i { color: var(--global-palette1); background-color: var(--global-palette7); } .card-items .card:hover .card-body i { color: var(--global-palette7); background-color: var(--global-palette1); } .card-items .card:hover .card-body { background-color: var(--global-palette7); } .colaboration-area { color: var(--global-palette9); } .service-cola-area { color: var(--global-palette9); } footer { color: var(--global-palette3); } .social-icons a:hover i { color: var(--global-palette1); } .blog-grid .blog-img .date { background: var(--global-palette4); } .blog-grid .blog-img img { background-color: var(--global-palette4); } .blog-grid:hover .blog-img .date { background: var(--global-palette9); color: var(--global-palette4); } .blog-grid:hover .blog-info h5 a { color: var(--global-palette1); } .blog-grid .blog-info h5 a { color: var(--global-palette4); } .px-btn-arrow { color: var(--global-palette1); } .box-content { background: var(--global-palette9); } .fixed .menu-item-hover, .fixed .logo-title { color: var(--global-palette3) !important; }.text {font-size: 18px !important;color: var(--global-palette4);}