:: **Zploit** v1.0 | Current Path: **/home/bbbncs7/amtechint.com/assets/css/**
:: Editing File: style.css
/*----------------------------------------------------------------------------------- Template Name: Techmax - Technology IT Solutions Consultancy HTML5 Template Template URI: https://thepixelcurve.com/ Description: A Library of Responsive Bootstrap5, HTML5, and CSS3 Website Templates Author: Raistheme Author URI: https://thepixelcurve.com/ Version: 1.0 ----------------------------------------------------------------------------------- CSS INDEX =================== 01. Theme default CSS 02. Header CSS 2.1. Header Top CSS 2.2. Header Bottom CSS 2.3 Offcanvas Menu CSS 03. Hero CSS 04. Service CSS 05. About CSS 06. Skill CSS 07. Counter CSS 08. Case Study CSS 09. Features CSS 10. Team CSS 11. Testimonial CSS 12. Blog CSS 13. Brand CSS 14. CTA CSS 15. Video CSS 16. Pricing CSS 17. Blog Standard CSS 18. Blog Details CSS 19. Contact CSS 20. Page Banner CSS 21. Subscribe CSS 22. FAQ CSS 23. Overview CSS 24. Login Register CSS 25. Footer CSS 25.1. Footer Widget CSS -----------------------------------------------------------------------------------*/ /*----------------------------------------*/ /* 01. Theme default CSS /*----------------------------------------*/ /*-- Google Font --*/ @import url("https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Open+Sans:wght@400;500;600;700&display=swap"); /*-- Common Style --*/ *, *::after, *::before { box-sizing: border-box; margin: 0; padding: 0; } body { font-size: 14px; line-height: 1.75; font-weight: 400; font-family: "Roboto", sans-serif; color: #4c4d56; outline: none; visibility: visible; overflow-X: hidden; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: ""; } body[dir="rtl"] { text-align: right; } h1, h2, h3, h4, h5, h6 { font-family: "Manrope", sans-serif; color: #090d2f; font-weight: 700; margin-top: 0; line-height: 1.5; margin-bottom: 0; } h1 { font-size: 36px; } @media only screen and (max-width: 767px) { h1 { font-size: 30px; } } h2 { font-size: 30px; } @media only screen and (max-width: 767px) { h2 { font-size: 24px; } } h3 { font-size: 24px; } @media only screen and (max-width: 767px) { h3 { font-size: 20px; } } h4 { font-size: 18px; } h5 { font-size: 16px; } h6 { font-size: 14px; } p { margin-bottom: 0; } a, button { color: inherit; display: inline-block; line-height: inherit; text-decoration: none; cursor: pointer; } a, button, img, input { transition: all 0.3s linear; outline: 0; } a:focus, button:focus, img:focus, input:focus { outline: 0; } a:focus { color: none; outline: none; text-decoration: none; } a:hover { text-decoration: none; color: #005de0; } ul, ol { padding: 0; list-style: none; margin: 0; } button, input[type="submit"] { cursor: pointer; } img { max-width: 100%; } input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { opacity: 1; } input:-moz-placeholder, textarea:-moz-placeholder { opacity: 1; } input::-moz-placeholder, textarea::-moz-placeholder { opacity: 1; } input:-ms-input-placeholder, textarea:-ms-input-placeholder { opacity: 1; } /*-- Common Classes --*/ .section, .main-wrapper { float: left; width: 100%; } /*--Section Spacing--*/ /*.section-padding {*/ /* padding-top: 145px;*/ /* padding-bottom: 145px;*/ /*}*/ @media only screen and (max-width: 1199px) { .section-padding { padding-top: 100px; padding-bottom: 100px; } } @media only screen and (max-width: 991px) { .section-padding { padding-top: 80px; padding-bottom: 80px; } } @media only screen and (max-width: 767px) { .section-padding { padding-top: 60px; padding-bottom: 60px; } } .section-padding-02 { padding-top: 145px; } @media only screen and (max-width: 1199px) { .section-padding-02 { padding-top: 100px; } } @media only screen and (max-width: 991px) { .section-padding-02 { padding-top: 80px; } } @media only screen and (max-width: 767px) { .section-padding-02 { padding-top: 60px; } } .section-padding-03 { padding-top: 120px; } @media only screen and (max-width: 1199px) { .section-padding-03 { padding-top: 100px; } } @media only screen and (max-width: 991px) { .section-padding-03 { padding-top: 80px; } } @media only screen and (max-width: 767px) { .section-padding-03 { padding-top: 60px; } } /*--Section Title--*/ .section-title { max-width: 690px; margin: 0 auto; } .section-title .title { font-size: 40px; line-height: 54px; font-family: "Manrope", sans-serif; font-weight: 700; color: #333333; } @media only screen and (max-width: 1199px) { .section-title .title { font-size: 36px; line-height: 48px; } } @media only screen and (max-width: 767px) { .section-title .title { font-size: 28px; line-height: 36px; } } .section-title .title.white { color: #ffffff; } .section-title .sub-title { font-size: 14px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 800; color: #005de0; letter-spacing: 1px; text-transform: uppercase; margin-bottom: 12px; } /*--Section Title Two--*/ .section-title2 { max-width: 690px; margin: 0 auto; } .section-title2 .title { font-size: 48px; line-height: 54px; font-family: "Manrope", sans-serif; font-weight: 800; color: #333333; } .section-title2 .title span { color: #005de0; } @media only screen and (max-width: 1199px) { .section-title2 .title { font-size: 36px; line-height: 48px; } } @media only screen and (max-width: 767px) { .section-title2 .title { font-size: 28px; line-height: 36px; } } .section-title2 .title.white { color: #ffffff; } .section-title2 .sub-title { font-size: 12px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 800; color: #a1a1a1; text-transform: uppercase; margin-bottom: 10px; } .section-title2 .sub-title.primary { color: #005de0; } .section-title2 p { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 600; color: #4c4d56; padding: 0 50px; margin-top: 20px; } /*--Section Title--*/ .section-title3 { max-width: 925px; margin: 0 auto; } .section-title3 .title { font-size: 48px; line-height: 72px; font-family: "Manrope", sans-serif; font-weight: 700; color: #333333; } @media only screen and (max-width: 1199px) { .section-title3 .title { font-size: 36px; line-height: 48px; } } @media only screen and (max-width: 767px) { .section-title3 .title { font-size: 28px; line-height: 36px; } } .section-title3 .sub-title { font-size: 14px; height: 40px; line-height: 38px; padding: 0 40px; border-radius: 35px; display: inline-block; background: #ffeeeb; font-family: "Manrope", sans-serif; font-weight: 800; color: #ff5538; text-transform: uppercase; margin-bottom: 12px; } .techmax-pagination .pagination .page-item { margin: 0 3px; } .techmax-pagination .pagination .page-item .page-link { width: 35px; height: 35px; padding: 0; line-height: 33px; font-size: 14px; font-family: "Manrope", sans-serif; font-weight: 400; text-align: center; color: #6c7381; border: 0; background: transparent; border-radius: 50%; cursor: pointer; transition: all 0.3s linear; } .techmax-pagination .pagination .page-item .page-link:focus { box-shadow: none; } .techmax-pagination .pagination .page-item .page-link:hover { background: #005de0; color: #ffffff; } .techmax-pagination .pagination .page-item .page-link i { font-size: 12px; } .techmax-pagination .pagination .page-item.active .page-link { background: #005de0; color: #ffffff; } /*--Swiper Pagination--*/ .swiper-pagination .swiper-pagination-bullet { border-radius: 50%; background-color: #ffffff; width: 13px; height: 13px; transition: all 0.3s linear; opacity: 1; } .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #5abaf7; } /*--Swiper Bullet--*/ .slider-bullet .swiper-pagination { position: relative; margin-top: 30px; } .slider-bullet .swiper-pagination .swiper-pagination-bullet { width: 10px; height: 10px; background-repeat: 50%; background: #e1e1e1; } .slider-bullet .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background: #005de0; } /*-- Preloader Styles --*/ #preloader { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: #ffffff; z-index: 999999; } #preloader .preloader { width: 50px; height: 50px; display: inline-block; padding: 0px; text-align: left; box-sizing: border-box; position: absolute; top: 50%; left: 50%; } #preloader .preloader span { position: absolute; display: inline-block; width: 50px; height: 50px; border-radius: 50%; background-color: #005de0; -webkit-animation: preloader 1.3s linear infinite; animation: preloader 1.3s linear infinite; } #preloader .preloader span:last-child { -webkit-animation-delay: -0.8s; animation-delay: -0.8s; } @-webkit-keyframes preloader { 0% { transform: scale(0, 0); opacity: 0.5; } 100% { transform: scale(1, 1); opacity: 0; } } @keyframes preloader { 0% { transform: scale(0, 0); opacity: 0.5; } 100% { transform: scale(1, 1); opacity: 0; } } /*----------------------------------------*/ /* 02. Elements CSS /*----------------------------------------*/ /*-- /* 2.4 - Form CSS /*----------------------------------------*/ label { display: block; line-height: 1; margin-bottom: 10px; font-weight: 400; text-transform: capitalize; } /*Input Field & Select*/ input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]), textarea { border: 1px solid #ebebeb; box-shadow: none; color: #415674; border-radius: 4px; background-color: #ffffff; margin-bottom: 0; padding: 10px 25px; max-width: 100%; width: 100%; font-size: 13px; line-height: 30px; font-weight: 600; transition: all 0.3s linear; } input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus, textarea:focus { outline: none; border-color: #005de0; } input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-webkit-input-placeholder, textarea::-webkit-input-placeholder { opacity: 0.95; font-size: 13px; color: #898c94; font-weight: 600; } input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-moz-placeholder, textarea:-moz-placeholder { opacity: 0.95; font-size: 13px; color: #898c94; font-weight: 600; } input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-moz-placeholder, textarea::-moz-placeholder { opacity: 0.95; font-size: 13px; color: #898c94; font-weight: 600; } input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-ms-input-placeholder, textarea:-ms-input-placeholder { opacity: 0.95; font-size: 13px; color: #898c94; font-weight: 600; } select { -webkit-appearance: none; -moz-appearance: none; appearance: none; background-image: url(../images/icons/select-arrow-down.html); background-position: calc(100% - 25px) 50%; background-repeat: no-repeat; font-family: "Roboto", sans-serif; width: 100%; border: none; background-color: #f7f7f7; line-height: 24px; font-weight: 300; height: 50px; padding: 10px 44px 10px 21px; color: #4c4d56; border-radius: 0; max-width: 500px; } /*-- /* 2.3 - Button CSS /*----------------------------------------*/ .btn-margin { margin-top: 40px; } .btn-wrap { display: flex; flex-wrap: wrap; margin: -5px; } .btn-wrap .btn { margin: 5px; } .btn { display: inline-block; position: relative; overflow: hidden; z-index: 1; background-color: #005de0; border-color: transparent; color: #ffffff; border-radius: 5px; font-size: 18px; font-family: "Manrope", sans-serif; font-weight: 700; height: 60px; line-height: 56px; padding: 0px 55px; border: 2px solid #005de0; border-style: solid; box-shadow: none; transition: all 0.3s ease 0s; cursor: pointer; z-index: 1; position: relative; } .btn::after { position: absolute; content: ""; z-index: -1; display: block; left: -20%; right: -20%; top: -4%; height: 150%; width: 150%; bottom: 0; background: #ffffff; transform: skewX(45deg) scale(0, 1); transition: all 0.5s ease 0s; } .btn:focus, .btn:focus:active { box-shadow: none; } .btn:hover { box-shadow: none; color: #005de0; } .btn:hover::after { transform: skewX(45deg) scale(1, 1); } .btn-2 { height: 50px; line-height: 45px; font-size: 14px; padding: 0 45px; } .btn-3 { background: #ff5538; border: 2px solid #ff5538; } .btn-3:hover { color: #ff5538; } .btn-round { border-radius: 100px; } .btn-square { border-radius: 0; } [class*="btn-icon-"] i { position: absolute; top: 0; width: 60px; height: 60px; line-height: 28px; text-align: center; padding: 15px; background-color: rgba(0, 0, 0, 0.1); } .btn-icon-left { padding-left: 69px; } .btn-icon-left i { left: 0; right: auto; } .btn-icon-right { padding-right: 69px; } .btn-icon-right i { left: auto; right: 0; } .btn-primary { background-color: #005de0; border-color: #005de0; color: #ffffff; } .btn-primary:hover { background-color: #005de0; border-color: #005de0; } .btn-secondary { background-color: #000c29; border-color: #000c29; color: #ffffff; } .btn-secondary:hover { background-color: #000c29; border-color: #000c29; } .btn-white { background-color: #ffffff; border-color: #ffffff; color: #090d2f; box-shadow: 11px 10px 38px 0 rgba(46, 63, 99, 0.15); } .btn-white::after { background: #005de0; } /*----------------------------------------*/ /* 02. Header CSS /*----------------------------------------*/ /*-- /* 2.1 - Header Top CSS /*----------------------------------------*/ .transparent-header { position: absolute; left: 0; top: 0; background: #ffffff; width: 100%; z-index: 999; } @media only screen and (max-width: 991px) { /* .transparent-header { padding: 15px 0; } */ } .header-wrap { display: flex; justify-content: space-between; align-items: center; } .header-logo a img { width: 150px; } @media only screen and (max-width: 1199px) { .header-logo a img { width: 130px; } } .header-menu .main-menu { display: flex; } .header-menu .main-menu li { position: relative; padding: 30px 25px; } @media only screen and (max-width: 1199px) { .header-menu .main-menu li { padding: 30px 20px; } } .header-menu .main-menu li a { font-size: 15px; font-family: "Manrope", sans-serif; font-weight: 700; text-transform: capitalize; color: #090d2f; } .header-menu .main-menu li.active-menu > a { color: #005de0; } .header-menu .main-menu li.active-menu > .menu-icon::after { color: #005de0; } .header-menu .main-menu li .menu-icon::after { content: '\f16c'; font-family: "flaticon"; font-size: 10px; color: #94a0b9; margin-left: 5px; transition: all 0.3s linear; } .header-menu .main-menu li:hover > .menu-icon::after { color: #005de0; } .header-menu .main-menu li:hover > a { color: #005de0; } .header-menu .main-menu li:hover > .sub-menu { opacity: 1; visibility: visible; top: 100%; } .header-menu .main-menu li .sub-menu { position: absolute; left: 0; top: 110%; width: 270px; background: #ffffff; box-shadow: 0 2px 29px rgba(0, 0, 0, 0.05); padding: 20px 0; border-radius: 5px; border-top: 3px solid #005de0; opacity: 0; z-index: 99; visibility: hidden; transition: all 0.3s linear; } .header-menu .main-menu li .sub-menu li { padding: 0; } .header-menu .main-menu li .sub-menu li a { padding: 5px 25px; font-size: 15px; font-family: "Manrope", sans-serif; font-weight: 600; text-transform: capitalize; display: block; position: relative; z-index: 1; } .header-menu .main-menu li .sub-menu li a::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background: #005de0; width: 10px; height: 2px; opacity: 0; visibility: hidden; transition: all 0.3s linear; } .header-menu .main-menu li .sub-menu li.active > a { color: #005de0; padding-left: 35px; } .header-menu .main-menu li .sub-menu li.active > a::before { opacity: 1; visibility: visible; left: 15px; } .header-menu .main-menu li .sub-menu li:hover > a { color: #005de0; padding-left: 35px; } .header-menu .main-menu li .sub-menu li:hover > a::before { opacity: 1; visibility: visible; left: 15px; } .header-meta { display: flex; align-items: center; white-space: nowrap; } .header-info { align-items: end; } .header-info .info-icon i { font-size: 25px; color: #005de0; } .header-info .info-text { margin-left: 10px; } .header-info .info-text span { display: block; font-size: 10px; line-height: 18px; font-weight: 700; font-family: "Manrope", sans-serif; color: #ababab; } .header-info .info-text .number { display: block; font-size: 14px; line-height: 18px; font-weight: 700; font-family: "Manrope", sans-serif; color: #090d2f; } .header-search { margin-left: 25px; } .header-search .search-btn { width: 40px; height: 40px; line-height: 38px; font-size: 16px; border-radius: 50%; text-align: center; color: #333333; border: 1px solid #ddd; transition: all 0.3s linear; } .header-search .search-btn:hover { color: #005de0; } .search-wrap { width: 100%; height: 100%; overflow: hidden; display: none; position: fixed; top: 0; left: 0; z-index: 121; background: rgba(0, 0, 0, 0.9); } .search-wrap .search-inner { position: relative; width: 100%; height: 100%; } .search-wrap .search-inner .search-close { position: absolute; top: 50px; right: 50px; font-size: 22px; color: #ffffff; cursor: pointer; transition: all 0.3s linear; } .search-wrap .search-inner .search-close:hover { transform: rotate(90deg); color: #005de0; } .search-wrap .search-inner .search-cell { position: absolute; top: 50%; width: 100%; transform: translateY(-50%); } .search-wrap .search-inner .search-cell .search-field-holder { width: 50%; margin: auto; position: relative; } @media only screen and (max-width: 991px) { .search-wrap .search-inner .search-cell .search-field-holder { width: 60%; } } @media only screen and (max-width: 575px) { .search-wrap .search-inner .search-cell .search-field-holder { width: 80%; } } .search-wrap .search-inner .search-cell .search-field-holder .main-search-input { width: 100%; height: 70px; border: 0; padding: 0 50px; text-transform: uppercase; background: transparent; font-size: 25px; font-weight: 400; color: #ffffff; border-bottom: 2px solid #898989; text-align: center; letter-spacing: 2px; } @media only screen and (max-width: 1199px) { .search-wrap .search-inner .search-cell .search-field-holder .main-search-input { padding: 0 35px; font-size: 20px; } } @media only screen and (max-width: 767px) { .search-wrap .search-inner .search-cell .search-field-holder .main-search-input { font-size: 16px; padding: 0 15px; } } .search-wrap .search-inner .search-cell .search-field-holder .main-search-input::-webkit-input-placeholder { opacity: 0.95; font-size: 25px; color: #ffffff; font-weight: 400; } @media only screen and (max-width: 1199px) { .search-wrap .search-inner .search-cell .search-field-holder .main-search-input::-webkit-input-placeholder { font-size: 20px; } } @media only screen and (max-width: 767px) { .search-wrap .search-inner .search-cell .search-field-holder .main-search-input::-webkit-input-placeholder { font-size: 16px; } } @media only screen and (max-width: 575px) { .search-wrap .search-inner .search-cell .search-field-holder .main-search-input::-webkit-input-placeholder { font-size: 14px; } } .search-wrap .search-inner .search-cell .search-field-holder .main-search-input:-moz-placeholder { opacity: 0.95; font-size: 25px; color: #ffffff; font-weight: 400; } @media only screen and (max-width: 1199px) { .search-wrap .search-inner .search-cell .search-field-holder .main-search-input:-moz-placeholder { font-size: 20px; } } @media only screen and (max-width: 767px) { .search-wrap .search-inner .search-cell .search-field-holder .main-search-input:-moz-placeholder { font-size: 16px; } } @media only screen and (max-width: 575px) { .search-wrap .search-inner .search-cell .search-field-holder .main-search-input:-moz-placeholder { font-size: 14px; } } .search-wrap .search-inner .search-cell .search-field-holder .main-search-input::-moz-placeholder { opacity: 0.95; font-size: 25px; color: #ffffff; font-weight: 400; } @media only screen and (max-width: 1199px) { .search-wrap .search-inner .search-cell .search-field-holder .main-search-input::-moz-placeholder { font-size: 20px; } } @media only screen and (max-width: 767px) { .search-wrap .search-inner .search-cell .search-field-holder .main-search-input::-moz-placeholder { font-size: 16px; } } @media only screen and (max-width: 575px) { .search-wrap .search-inner .search-cell .search-field-holder .main-search-input::-moz-placeholder { font-size: 14px; } } .search-wrap .search-inner .search-cell .search-field-holder .main-search-input:-ms-input-placeholder { opacity: 0.95; font-size: 25px; color: #ffffff; font-weight: 400; } @media only screen and (max-width: 1199px) { .search-wrap .search-inner .search-cell .search-field-holder .main-search-input:-ms-input-placeholder { font-size: 20px; } } @media only screen and (max-width: 767px) { .search-wrap .search-inner .search-cell .search-field-holder .main-search-input:-ms-input-placeholder { font-size: 16px; } } @media only screen and (max-width: 575px) { .search-wrap .search-inner .search-cell .search-field-holder .main-search-input:-ms-input-placeholder { font-size: 14px; } } .header-cart { margin-left: 10px; } .header-cart .cart-btn { width: 40px; height: 40px; line-height: 38px; font-size: 16px; border-radius: 50%; text-align: center; background: none; color: #333333; border: 1px solid #ddd; position: relative; transition: all 0.3s linear; } .header-cart .cart-btn:hover { color: #005de0; } .header-cart .cart-btn .count { width: 20px; height: 20px; line-height: 20px; text-align: center; background: #005de0; border-radius: 50%; font-size: 10px; font-weight: 400; display: inline-block; color: #ffffff; position: absolute; top: -5px; right: -10px; } .dropdown-cart { max-width: 370px; padding: 30px; border-radius: 10px; box-shadow: 11px 10px 38px 0 rgba(46, 63, 99, 0.15); border: 0; transform: translateX(-50%) !important; left: 50% !important; top: 63px !important; } @media only screen and (max-width: 1399px) { .dropdown-cart { left: 0 !important; transform: translateX(-85%) !important; } } @media only screen and (max-width: 991px) { .dropdown-cart { top: 56px !important; } } @media only screen and (max-width: 449px) { .dropdown-cart { left: 0 !important; transform: translateX(-72%) !important; } } .dropdown-cart .cart-items { height: 280px; overflow-y: auto; } .dropdown-cart .cart-items .single-cart-item { display: flex; align-items: center; position: relative; } .dropdown-cart .cart-items .single-cart-item + .single-cart-item { margin-top: 30px; } .dropdown-cart .cart-items .single-cart-item .item-image img { border-radius: 50%; } .dropdown-cart .cart-items .single-cart-item .item-content { flex: 1; padding-right: 25px; padding-left: 20px; } .dropdown-cart .cart-items .single-cart-item .item-content .title { font-size: 16px; font-weight: 700; color: #000000; line-height: 1.3; } .dropdown-cart .cart-items .single-cart-item .item-content .quantity { font-size: 14px; color: #005de0; line-height: 1.75; display: block; } .dropdown-cart .cart-items .single-cart-item .btn-close { position: absolute; width: 5px; height: 5px; top: 0; right: 5px; } .dropdown-cart .cart-total { display: flex; justify-content: space-between; margin-top: 25px; } .dropdown-cart .cart-total .label { font-size: 18px; font-weight: 700; line-height: 1.75; display: block; color: #000000; } .dropdown-cart .cart-total .value { font-size: 18px; font-weight: 700; line-height: 1.75; display: block; color: #005de0; } .dropdown-cart .cart-btns { margin-top: 25px; display: flex; justify-content: space-between; } .dropdown-cart .cart-btns .btn { height: 50px; line-height: 46px; font-size: 16px; padding: 0 35px; width: 48%; } .dropdown-cart .cart-btns .btn.btn-2 { background: #000c29; border: 2px solid transparent; transition: all 0.3s linear; } .dropdown-cart .cart-btns .btn.btn-2:hover { color: #000c29; } .header-section-2 .header-wrap .header-menu-2 { position: relative; padding-left: 20px; } @media only screen and (max-width: 1399px) { .header-section-2 .header-wrap .header-menu-2 { padding-left: 10px; } } .header-section-2 .header-wrap .header-menu-2::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background: #ebebeb; width: 1px; height: 44px; } .header-section-2 .header-wrap .header-menu-2 .main-menu > li { padding: 40px 25px; } @media only screen and (max-width: 1399px) { .header-section-2 .header-wrap .header-menu-2 .main-menu > li { padding: 40px 15px; } } .header-section-2 .header-wrap .header-meta .header-search { margin-left: 0; } .header-section-2 .header-wrap .header-meta .header-search .search-btn { border: none; } .header-section-2 .header-wrap .header-meta .header-cart { margin-left: 0; } .header-section-2 .header-wrap .header-meta .header-cart .cart-btn { border: none; } .header-section-2 .header-wrap .header-meta .header-cart .cart-btn .count { position: absolute; top: 0px; right: -2px; } .header-section-2 .header-wrap .header-meta .header-info { position: relative; padding-left: 30px; margin-left: 30px; } @media only screen and (max-width: 1399px) { .header-section-2 .header-wrap .header-meta .header-info { padding-left: 20px; margin-left: 20px; } } .header-section-2 .header-wrap .header-meta .header-info::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background: #ebebeb; width: 1px; height: 44px; } .header-section-2 .header-wrap .header-meta .header-btn-2 { margin-left: 30px; } @media only screen and (max-width: 1399px) { .header-section-2 .header-wrap .header-meta .header-btn-2 { margin-left: 20px; } } .header-section-2 .header-wrap .header-meta .header-btn-2 .btn { height: 50px; line-height: 46px; padding: 0 45px; } .header-logo-3 .logo-black { display: none; } .transparent-header-3 { background: transparent; border-bottom: 1px solid #b5b5b5; } .transparent-header-3.sticky { background: #ffffff; border-bottom: 0; } .transparent-header-3.sticky .header-wrap .header-logo-3 .logo-black { display: block; } .transparent-header-3.sticky .header-wrap .header-logo-3 .logo-white { display: none; } .transparent-header-3.sticky .header-wrap .header-menu-3 .main-menu li a { color: #090d2f; } .transparent-header-3.sticky .header-wrap .header-menu-3 .main-menu li .menu-icon::after { color: #94a0b9; } .transparent-header-3.sticky .header-wrap .header-meta .header-info .info-icon i { color: #ff5538; } .transparent-header-3.sticky .header-wrap .header-meta .header-info .info-text span { color: #ababab; } .transparent-header-3.sticky .header-wrap .header-meta .header-info .info-text .number { color: #090d2f; } .transparent-header-3.sticky .header-wrap .header-meta .header-search .search-btn { color: #333333; border: 1px solid #ddd; } .transparent-header-3.sticky .header-wrap .header-meta .header-search .search-btn:hover { color: #ff5538; } .transparent-header-3.sticky .header-wrap .header-meta .header-cart .cart-btn { color: #333333; border: 1px solid #ddd; } .header-section-3 .header-wrap .header-menu-3 .main-menu li a { color: #ffffff; } .header-section-3 .header-wrap .header-menu-3 .main-menu li.active-menu > a { color: #ff5538; } .header-section-3 .header-wrap .header-menu-3 .main-menu li.active-menu > .menu-icon::after { color: #ff5538; } .header-section-3 .header-wrap .header-menu-3 .main-menu li .menu-icon::after { color: #ffffff; } .header-section-3 .header-wrap .header-menu-3 .main-menu li:hover > .menu-icon::after { color: #ff5538; } .header-section-3 .header-wrap .header-menu-3 .main-menu li:hover > a { color: #ff5538; } .header-section-3 .header-wrap .header-menu-3 .main-menu li .sub-menu { border-top: 3px solid #ff5538; } .header-section-3 .header-wrap .header-menu-3 .main-menu li .sub-menu li a { color: #090d2f; } .header-section-3 .header-wrap .header-menu-3 .main-menu li .sub-menu li a::before { background: #ff5538; } .header-section-3 .header-wrap .header-menu-3 .main-menu li .sub-menu li.active > a { color: #ff5538; } .header-section-3 .header-wrap .header-menu-3 .main-menu li .sub-menu li:hover > a { color: #ff5538; } .header-section-3 .header-wrap .header-meta .header-info .info-icon i { color: #ff5538; } .header-section-3 .header-wrap .header-meta .header-info .info-text span { color: #ffffff; } .header-section-3 .header-wrap .header-meta .header-info .info-text .number { color: #ffffff; } .header-section-3 .header-wrap .header-meta .header-info .info-text .number a:hover { color: #ff5538; } .header-section-3 .header-wrap .header-meta .header-search .search-btn { color: #ffffff; border: 1px solid #ffffff; } .header-section-3 .header-wrap .header-meta .header-search .search-btn:hover { color: #ff5538; } .header-section-3 .header-wrap .header-meta .header-search .search-wrap .search-inner .search-close:hover { color: #ff5538; } .header-section-3 .header-wrap .header-meta .header-search .search-wrap .search-inner .search-cell .search-field-holder .main-search-input:focus { border-color: #ff5538; } .header-section-3 .header-wrap .header-meta .header-cart .cart-btn { color: #ffffff; border: 1px solid #ffffff; } .header-section-3 .header-wrap .header-meta .header-cart .cart-btn:hover { color: #ff5538; } .header-section-3 .header-wrap .header-meta .header-cart .cart-btn .count { background: #ff5538; color: #ffffff; } .header-section-3 .header-wrap .header-meta .header-cart .dropdown-cart .cart-items .single-cart-item .item-image img { border-radius: 50%; } .header-section-3 .header-wrap .header-meta .header-cart .dropdown-cart .cart-items .single-cart-item .item-content .title a:hover { color: #ff5538; } .header-section-3 .header-wrap .header-meta .header-cart .dropdown-cart .cart-items .single-cart-item .item-content .quantity { color: #ff5538; } .header-section-3 .header-wrap .header-meta .header-cart .dropdown-cart .cart-total .value { color: #ff5538; } .header-section-3 .header-wrap .header-meta .header-cart .dropdown-cart .cart-btns .btn { height: 50px; line-height: 46px; font-size: 16px; padding: 0 35px; width: 48%; } .header-section-3 .header-wrap .header-meta .header-cart .dropdown-cart .cart-btns .btn.btn-2 { background: #000c29; border: 2px solid transparent; transition: all 0.3s linear; } .header-section-3 .header-wrap .header-meta .header-cart .dropdown-cart .cart-btns .btn.btn-2:hover { color: #000c29; } .header-toggle { margin-left: 30px; } .header-toggle button { background: none; border: 0; padding: 0; } .header-toggle button span { width: 25px; height: 2px; background: #005de0; margin: 5px 0; display: block; } .header-toggle button span:last-child { margin-bottom: 0; } .header-toggle-3 button span { background: #ff5538; } .header-section-4 .header-wrap .header-menu { margin-left: auto; } .header-section-4 .header-wrap .header-meta-4 { margin-left: 15px; } .header-section-4 .header-wrap .header-meta-4 .header-search { position: relative; margin-right: 5px; padding-right: 5px; } .header-section-4 .header-wrap .header-meta-4 .header-search::before { content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); background: #ebebeb; width: 1px; height: 30px; } .header-section-5 { background: rgba(0, 0, 0, 0.7); } .header-section-5 .header-wrap .header-logo .logo-black { display: none; } .header-section-5 .header-wrap .header-menu .main-menu li a { color: #ffffff; } .header-section-5 .header-wrap .header-menu .main-menu li.active-menu > a { color: #005de0; } .header-section-5 .header-wrap .header-menu .main-menu li.active-menu > .menu-icon::after { color: #005de0; } .header-section-5 .header-wrap .header-menu .main-menu li .menu-icon::after { color: #ffffff; } .header-section-5 .header-wrap .header-menu .main-menu li:hover > .menu-icon::after { color: #005de0; } .header-section-5 .header-wrap .header-menu .main-menu li:hover > a { color: #005de0; } .header-section-5 .header-wrap .header-menu .main-menu li .sub-menu { border-top: 3px solid #005de0; } .header-section-5 .header-wrap .header-menu .main-menu li .sub-menu li a { color: #090d2f; } .header-section-5 .header-wrap .header-menu .main-menu li .sub-menu li a::before { background: #005de0; } .header-section-5 .header-wrap .header-menu .main-menu li .sub-menu li.active > a { color: #005de0; } .header-section-5 .header-wrap .header-menu .main-menu li .sub-menu li:hover > a { color: #005de0; } .header-section-5 .header-wrap .header-meta .header-search .search-btn { color: #ffffff; } .header-section-5 .header-wrap .header-meta .header-cart .cart-btn { color: #ffffff; } .header-section-5.sticky { background: #ffffff; } .header-section-5.sticky .header-wrap .header-logo .logo-black { display: block; } .header-section-5.sticky .header-wrap .header-logo .logo-white { display: none; } .header-section-5.sticky .header-wrap .header-menu .main-menu li a { color: #090d2f; } .header-section-5.sticky .header-wrap .header-menu .main-menu li.active-menu > a { color: #005de0; } .header-section-5.sticky .header-wrap .header-menu .main-menu li.active-menu > .menu-icon::after { color: #005de0; } .header-section-5.sticky .header-wrap .header-menu .main-menu li .menu-icon::after { color: #ffffff; } .header-section-5.sticky .header-wrap .header-menu .main-menu li:hover > .menu-icon::after { color: #005de0; } .header-section-5.sticky .header-wrap .header-menu .main-menu li:hover > a { color: #005de0; } .header-section-5.sticky .header-wrap .header-menu .main-menu li .menu-icon::after { color: #94a0b9; } .header-section-5.sticky .header-wrap .header-meta .header-search .search-btn { color: #333333; } .header-section-5.sticky .header-wrap .header-meta .header-cart .cart-btn { color: #333333; } .header-section-6 { background: transparent; border-bottom: 1px solid #7972a1; } .header-section-6.sticky { background: #ffffff; border-bottom: 0; } .header-section-6.sticky .header-wrap .header-logo-3 .logo-black { display: block; } .header-section-6.sticky .header-wrap .header-logo-3 .logo-white { display: none; } .header-section-6.sticky .header-wrap .header-menu-2::before { background: #ebebeb; } .header-section-6.sticky .header-wrap .header-menu-2 .main-menu li a { color: #090d2f; } .header-section-6.sticky .header-wrap .header-menu-2 .main-menu li .menu-icon::after { color: #94a0b9; } .header-section-6.sticky .header-wrap .header-meta .header-search .search-btn { color: #333333; } .header-section-6.sticky .header-wrap .header-meta .header-cart .cart-btn { color: #333333; } .header-section-6.sticky .header-wrap .header-meta .header-info::before { background: #ebebeb; } .header-section-6.sticky .header-wrap .header-meta .header-info .info-text span { color: #ababab; } .header-section-6.sticky .header-wrap .header-meta .header-info .info-text .number { color: #333333; } .header-section-6 .header-wrap .header-menu-2::before { background: #7972a1; } .header-section-6 .header-wrap .header-menu-2 .main-menu li a { color: #ffffff; } .header-section-6 .header-wrap .header-menu-2 .main-menu li.active-menu > a { color: #005de0; } .header-section-6 .header-wrap .header-menu-2 .main-menu li.active-menu > .menu-icon::after { color: #005de0; } .header-section-6 .header-wrap .header-menu-2 .main-menu li .menu-icon::after { color: #ffffff; } .header-section-6 .header-wrap .header-menu-2 .main-menu li:hover > .menu-icon::after { color: #005de0; } .header-section-6 .header-wrap .header-menu-2 .main-menu li:hover > a { color: #005de0; } .header-section-6 .header-wrap .header-menu-2 .main-menu li .sub-menu { border-top: 3px solid #005de0; } .header-section-6 .header-wrap .header-menu-2 .main-menu li .sub-menu li a { color: #090d2f; } .header-section-6 .header-wrap .header-menu-2 .main-menu li .sub-menu li a::before { background: #005de0; } .header-section-6 .header-wrap .header-menu-2 .main-menu li .sub-menu li.active > a { color: #005de0; } .header-section-6 .header-wrap .header-menu-2 .main-menu li .sub-menu li:hover > a { color: #005de0; } .header-section-6 .header-wrap .header-meta .header-search { margin-left: 0; } .header-section-6 .header-wrap .header-meta .header-search .search-btn { color: #ffffff; border: none; } .header-section-6 .header-wrap .header-meta .header-search .search-btn:hover { color: #005de0; } .header-section-6 .header-wrap .header-meta .header-cart { margin-left: 0; } .header-section-6 .header-wrap .header-meta .header-cart .cart-btn { color: #ffffff; border: none; } .header-section-6 .header-wrap .header-meta .header-cart .cart-btn .count { position: absolute; top: 0px; right: -2px; } .header-section-6 .header-wrap .header-meta .header-cart .cart-btn:hover { color: #005de0; } .header-section-6 .header-wrap .header-meta .header-info { position: relative; padding-left: 30px; margin-left: 30px; } @media only screen and (max-width: 1399px) { .header-section-6 .header-wrap .header-meta .header-info { padding-left: 20px; margin-left: 20px; } } .header-section-6 .header-wrap .header-meta .header-info::before { background: #6c688e; } .header-section-6 .header-wrap .header-meta .header-info .info-text span { color: #ffffff; } .header-section-6 .header-wrap .header-meta .header-info .info-text .number { color: #ffffff; } .header-section-6 .header-wrap .header-meta .header-btn-2 { margin-left: 30px; } @media only screen and (max-width: 1399px) { .header-section-6 .header-wrap .header-meta .header-btn-2 { margin-left: 20px; } } .header-section-6 .header-wrap .header-meta .header-btn-2 .btn { height: 50px; line-height: 46px; padding: 0 45px; } .header-section-7 .header-wrap .header-menu .main-menu li.active-menu > a { color: #6754e2; } .header-section-7 .header-wrap .header-menu .main-menu li.active-menu > .menu-icon::after { color: #6754e2; } .header-section-7 .header-wrap .header-menu .main-menu li:hover > .menu-icon::after { color: #6754e2; } .header-section-7 .header-wrap .header-menu .main-menu li:hover > a { color: #6754e2; } .header-section-7 .header-wrap .header-menu .main-menu li .sub-menu { border-top: 3px solid #6754e2; } .header-section-7 .header-wrap .header-menu .main-menu li .sub-menu li a::before { background: #6754e2; } .header-section-7 .header-wrap .header-menu .main-menu li .sub-menu li.active > a { color: #6754e2; } .header-section-7 .header-wrap .header-menu .main-menu li .sub-menu li:hover > a { color: #6754e2; } .header-section-7 .header-wrap .header-meta-4 { margin-left: 15px; } .header-section-7 .header-wrap .header-meta-4 .header-search { position: relative; margin-right: 0px; padding-right: 0px; padding-left: 15px; } .header-section-7 .header-wrap .header-meta-4 .header-search::before { right: auto; top: 50%; left: 0; } .header-section-7 .header-wrap .header-meta-4 .header-search .search-btn:hover { color: #6754e2; } .header-section-7 .header-wrap .header-meta-4 .header-btn-2 .btn { background: #6754e2; border: 2px solid #6754e2; } .header-section-7 .header-wrap .header-meta-4 .header-btn-2 .btn:hover { color: #6754e2; } .header-section-8 { background: transparent; } .header-section-8.sticky .header-wrap .header-menu .main-menu li a { color: #090d2f; } .header-section-8.sticky .header-wrap .header-menu .main-menu li .menu-icon::after { color: #94a0b9; } .header-section-8 .header-wrap .header-menu .main-menu > li { padding: 40px 25px; } .header-section-8 .header-wrap .header-menu .main-menu > li > a { color: #ffffff; } .header-section-8 .header-wrap .header-menu .main-menu > li .menu-icon::after { color: #ffffff; } .header-section-8 .header-wrap .header-menu .main-menu > li.active-menu > a { color: #005de0; } .header-section-8 .header-wrap .header-menu .main-menu > li.active-menu > .menu-icon::after { color: #005de0; } .header-section-8 .header-wrap .header-menu .main-menu > li:hover > .menu-icon::after { color: #005de0; } .header-section-8 .header-wrap .header-menu .main-menu > li:hover > a { color: #005de0; } .header-section-8 .header-wrap .header-menu .main-menu > li .sub-menu { border-top: 3px solid #005de0; } .header-section-8 .header-wrap .header-menu .main-menu > li .sub-menu li a::before { background: #005de0; } .header-section-8 .header-wrap .header-menu .main-menu > li .sub-menu li.active > a { color: #005de0; } .header-section-8 .header-wrap .header-menu .main-menu > li .sub-menu li:hover > a { color: #005de0; } .header-section-8 .header-wrap .header-meta-4 .header-search::before { background: #55426a; } .header-section-8 .header-wrap .header-meta-4 .header-search .search-btn { color: #ffffff; } .header-section-8 .header-wrap .header-meta-4 .header-search .search-btn:hover { color: #005de0; } .header-section-8 .header-wrap .header-meta-4 .header-btn-2 .btn { background: #005de0; border: 2px solid #005de0; } .header-section-8 .header-wrap .header-meta-4 .header-btn-2 .btn:hover { color: #005de0; } .sticky { position: fixed; top: 0; box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.07); -webkit-animation: sticky 1s; animation: sticky 1s; } @-webkit-keyframes sticky { 0% { transform: translateY(-100%); } 100% { transform: translateY(0%); } } @keyframes sticky { 0% { transform: translateY(-100%); } 100% { transform: translateY(0%); } } /*-- /* 2.2 - Header Bottom CSS /*----------------------------------------*/ /*-- /* 2.3 - Header Top CSS /*----------------------------------------*/ .offcanvas { background: #000c29; width: 320px; } @media only screen and (max-width: 575px) { .offcanvas { width: 280px; } } .offcanvas-header .close-btn { background: none; border: 0; font-size: 18px; color: #ffffff; transition: all 0.3s linear; } .offcanvas-header .close-btn:hover { transform: rotate(90deg); color: #005de0; } .offcanvas-logo a img { width: 130px; } .offcanvas-menu { padding: 30px 0; } .offcanvas-menu .main-menu li { position: relative; } .offcanvas-menu .main-menu li a { display: block; font-size: 16px; font-weight: 600; font-family: "Manrope", sans-serif; color: #ffffff; padding: 5px 0px; position: relative; } .offcanvas-menu .main-menu li .menu-expand { position: absolute; right: 20px; top: 14px; width: 30px; height: 30px; cursor: pointer; background: rgba(255, 255, 255, 0.1); border-radius: 3px; } .offcanvas-menu .main-menu li .menu-expand::before { position: absolute; content: ''; width: 16px; height: 2px; background-color: #ffffff; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: all 0.3s linear; } .offcanvas-menu .main-menu li .menu-expand::after { position: absolute; content: ''; width: 2px; height: 16px; left: 50%; top: 50%; bottom: 0; background-color: #ffffff; transform: translate(-50%, -50%); transition: all 0.3s linear; } .offcanvas-menu .main-menu li:hover > a { color: #005de0; } .offcanvas-menu .main-menu li.active > .menu-expand::after { height: 0; } .offcanvas-menu .main-menu li ul { padding-left: 6%; display: none; } /*----------------------------------------*/ /* 4.1. Pages CSS (All Page Styles) /*----------------------------------------*/ /*-- /* 03 - Hero CSS /*----------------------------------------*/ .tech-hero-section { height: 1120px; background-repeat: no-repeat; background-size: cover; background-position: center top; position: relative; z-index: 1; } .tech-hero-section .shape-1 { width: 417px; height: 417px; background: linear-gradient(150deg, #035cdd 0%, #4ecdea 100%); opacity: 0.9; border-radius: 50%; position: absolute; top: 115px; left: 50px; z-index: -1; } .tech-hero-section .hero-content { padding-top: 290px; max-width: 520px; } .tech-hero-section .hero-content .sub-title { font-size: 16px; line-height: 30px; font-weight: 800; text-transform: uppercase; letter-spacing: 2px; color: #ffffff; } .tech-hero-section .hero-content .title { font-size: 72px; line-height: 92px; font-weight: 700; color: #ffffff; margin-top: 10px; } .tech-hero-section .hero-content p { font-size: 18px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 600; color: #ffffff; margin-top: 25px; } .tech-hero-section .hero-content .hero-btn { margin-top: 40px; } @media only screen and (max-width: 1399px) { .tech-hero-section { height: 920px; } } @media only screen and (max-width: 1199px) { .tech-hero-section { height: 920px; } .tech-hero-section .shape-1 { width: 350px; height: 350px; top: 115px; left: 170px; } .tech-hero-section .hero-content { padding-top: 250px; } .tech-hero-section .hero-content .title { font-size: 55px; line-height: 72px; } } @media only screen and (max-width: 991px) { .tech-hero-section { height: 780px; } .tech-hero-section .hero-content { padding-top: 170px; } } @media only screen and (max-width: 767px) { .tech-hero-section .shape-1 { width: 250px; height: 250px; left: 30px; } .tech-hero-section .hero-content .title { font-size: 48px; line-height: 62px; } .tech-hero-section .hero-content .hero-btn .btn { padding: 0 45px; } } @media only screen and (max-width: 575px) { .tech-hero-section .hero-content .sub-title { font-size: 14px; line-height: 26px; } .tech-hero-section .hero-content .title { font-size: 36px; line-height: 48px; } .tech-hero-section .hero-content p { font-size: 16px; } } .tech-hero-section-2 { height: 955px; background-repeat: no-repeat; background-size: cover; background-position: center top; position: relative; overflow: hidden; z-index: 1; } .tech-hero-section-2::before { content: ""; position: absolute; left: 0; top: 0; background: #00213a; opacity: 0.4; width: 100%; height: 100%; z-index: -1; } .tech-hero-section-2 .shape-1 { width: 578px; height: 315px; background-image: linear-gradient(290deg, #54d6eb 0%, #035cdd 100%); transform: skewY(15deg); position: absolute; left: 7.5%; top: 25%; z-index: -1; } .tech-hero-section-2 .shape-2 { width: 578px; height: 315px; background-image: linear-gradient(290deg, #54d6eb 0%, #035cdd 100%); transform: skewY(15deg); position: absolute; left: 3.5%; top: 50%; z-index: -1; } .tech-hero-section-2 .shape-3 { width: 578px; height: 315px; background: #ffffff; opacity: 0.2; transform: skewY(15deg); position: absolute; left: 12%; top: 40%; z-index: -1; } .tech-hero-section-2 .shape-4 { width: 578px; height: 315px; background: linear-gradient(90deg, #54d6eb 0%, #035cdd 100%); opacity: 0.8; transform: skewY(15deg); position: absolute; right: -10%; top: 76%; z-index: -1; } .tech-hero-section-2 .shape-5 { width: 358px; height: 195px; background: linear-gradient(280deg, #54d6eb 0%, #035cdd 100%); opacity: 0.8; transform: skewY(15deg); position: absolute; right: -6%; top: 67%; z-index: -1; } .tech-hero-section-2 .hero-content { max-width: 630px; } .tech-hero-section-2 .hero-content .sub-title { font-size: 16px; line-height: 30px; font-weight: 800; text-transform: uppercase; letter-spacing: 2px; color: #ffffff; } .tech-hero-section-2 .hero-content .title { font-size: 60px; line-height: 78px; font-weight: 700; color: #ffffff; margin-top: 10px; } .tech-hero-section-2 .hero-content .hero-btn { margin-top: 40px; } @media only screen and (max-width: 1199px) { .tech-hero-section-2 .shape-1 { width: 450px; height: 250px; } .tech-hero-section-2 .shape-2 { width: 450px; height: 250px; top: 46%; } .tech-hero-section-2 .shape-3 { width: 450px; height: 250px; } .tech-hero-section-2 .shape-4 { width: 450px; height: 250px; top: 81%; } .tech-hero-section-2 .shape-5 { width: 250px; height: 180px; top: 71%; right: -5%; } .tech-hero-section-2 .hero-content .title { font-size: 48px; line-height: 60px; } } @media only screen and (max-width: 991px) { .tech-hero-section-2 { height: 760px; } } @media only screen and (max-width: 767px) { .tech-hero-section-2 { height: 660px; } .tech-hero-section-2 .shape-1 { width: 350px; height: 190px; } .tech-hero-section-2 .shape-2 { width: 350px; height: 190px; top: 46%; } .tech-hero-section-2 .shape-3 { width: 350px; height: 190px; top: 37%; } .tech-hero-section-2 .shape-4 { width: 350px; height: 190px; } .tech-hero-section-2 .shape-5 { width: 220px; height: 150px; top: 71%; right: -5%; } .tech-hero-section-2 .hero-content .sub-title { font-size: 14px; line-height: 28px; } .tech-hero-section-2 .hero-content .title { font-size: 40px; line-height: 52px; } } @media only screen and (max-width: 575px) { .tech-hero-section-2 { height: 660px; } .tech-hero-section-2 .shape-1 { width: 350px; height: 190px; } .tech-hero-section-2 .shape-2 { width: 350px; height: 190px; top: 46%; } .tech-hero-section-2 .shape-3 { width: 350px; height: 190px; top: 37%; } .tech-hero-section-2 .shape-4 { display: none; } .tech-hero-section-2 .shape-5 { display: none; } .tech-hero-section-2 .hero-content .title { font-size: 32px; line-height: 46px; } } .tech-hero-section-3 { padding-top: 240px; padding-bottom: 135px; background-repeat: no-repeat; background-size: cover; background-position: center top; position: relative; overflow: hidden; z-index: 1; } .tech-hero-section-3 .hero-content { max-width: 580px; } .tech-hero-section-3 .hero-content .sub-title { font-size: 16px; line-height: 30px; font-weight: 800; text-transform: uppercase; letter-spacing: 2px; color: #ffffff; } .tech-hero-section-3 .hero-content .title { font-size: 72px; line-height: 92px; font-weight: 700; color: #ffffff; margin-top: 10px; } .tech-hero-section-3 .hero-content .btn { margin-top: 55px; } .tech-hero-section-3 .hero-content .hero-play-btn { margin-top: 80px; } .tech-hero-section-3 .hero-content .hero-play-btn .play-btn i { width: 70px; height: 70px; background: transparent; display: inline-block; line-height: 70px; text-align: center; font-size: 14px; color: #ffffff; border: 1px solid #ffffff; border-radius: 50%; } .tech-hero-section-3 .hero-content .hero-play-btn .play-btn i:hover { color: #ff5538; } .tech-hero-section-3 .hero-content .hero-play-btn .play-btn span { font-size: 22px; font-family: "Manrope", sans-serif; font-weight: 700; color: #ffffff; margin-left: 10px; } .tech-hero-section-3 .hero-form { background: #ffffff; border-radius: 10px; overflow: hidden; max-width: 460px; } .tech-hero-section-3 .hero-form .hero-form-wrap { padding: 45px; box-shadow: 0px 0px 40px 0px rgba(49, 48, 48, 0.81); } .tech-hero-section-3 .hero-form .hero-form-wrap .heading-wrap { margin-bottom: 5px; } .tech-hero-section-3 .hero-form .hero-form-wrap .heading-wrap .title { font-size: 30px; line-height: 36px; color: #3c424c; } .tech-hero-section-3 .hero-form .hero-form-wrap .single-form { margin-top: 20px; } .tech-hero-section-3 .hero-form .hero-form-wrap .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]) { background: #f0f0f0; height: 55px; line-height: 55px; border: 0; padding-left: 15px; } .tech-hero-section-3 .hero-form .hero-form-wrap .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-webkit-input-placeholder { opacity: 0.95; font-size: 14px; color: #686f7a; font-family: "Manrope", sans-serif; font-weight: 600; } .tech-hero-section-3 .hero-form .hero-form-wrap .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-moz-placeholder { opacity: 0.95; font-size: 14px; color: #686f7a; font-family: "Manrope", sans-serif; font-weight: 600; } .tech-hero-section-3 .hero-form .hero-form-wrap .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-moz-placeholder { opacity: 0.95; font-size: 14px; color: #686f7a; font-family: "Manrope", sans-serif; font-weight: 600; } .tech-hero-section-3 .hero-form .hero-form-wrap .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-ms-input-placeholder { opacity: 0.95; font-size: 14px; color: #686f7a; font-family: "Manrope", sans-serif; font-weight: 600; } .tech-hero-section-3 .hero-form .hero-form-wrap .single-form textarea { height: 90px; background: #f0f0f0; border: 0; padding-left: 15px; resize: none; } .tech-hero-section-3 .hero-form .hero-form-wrap .single-form textarea::-webkit-input-placeholder { opacity: 0.95; font-size: 14px; color: #686f7a; font-family: "Manrope", sans-serif; font-weight: 600; } .tech-hero-section-3 .hero-form .hero-form-wrap .single-form textarea:-moz-placeholder { opacity: 0.95; font-size: 14px; color: #686f7a; font-family: "Manrope", sans-serif; font-weight: 600; } .tech-hero-section-3 .hero-form .hero-form-wrap .single-form textarea::-moz-placeholder { opacity: 0.95; font-size: 14px; color: #686f7a; font-family: "Manrope", sans-serif; font-weight: 600; } .tech-hero-section-3 .hero-form .hero-form-wrap .single-form textarea:-ms-input-placeholder { opacity: 0.95; font-size: 14px; color: #686f7a; font-family: "Manrope", sans-serif; font-weight: 600; } .tech-hero-section-3 .hero-form .hero-form-wrap .form-btn { margin-top: 20px; } .tech-hero-section-3 .hero-form .hero-form-wrap .form-btn .btn { font-size: 16px; width: 100%; height: 50px; line-height: 46px; margin-bottom: 20px; } @media only screen and (max-width: 1199px) { .tech-hero-section-3 { padding-top: 210px; padding-bottom: 110px; } .tech-hero-section-3 .hero-content .title { font-size: 55px; line-height: 70px; } } @media only screen and (max-width: 991px) { .tech-hero-section-3 { padding-top: 190px; } .tech-hero-section-3 .hero-content .title { font-size: 48px; line-height: 60px; } .tech-hero-section-3 .hero-form { max-width: 100%; margin-top: 60px; } } @media only screen and (max-width: 767px) { .tech-hero-section-3 { padding-top: 170px; padding-bottom: 80px; } .tech-hero-section-3 .hero-content .sub-title { font-size: 15px; line-height: 28px; } .tech-hero-section-3 .hero-content .hero-play-btn .play-btn i { width: 60px; height: 60px; line-height: 60px; } .tech-hero-section-3 .hero-content .hero-play-btn .play-btn span { font-size: 18px; } .tech-hero-section-3 .hero-form .hero-form-wrap .heading-wrap .title { font-size: 28px; } } @media only screen and (max-width: 575px) { .tech-hero-section-3 .hero-content .title { font-size: 35px; line-height: 48px; } .tech-hero-section-3 .hero-form .hero-form-wrap .heading-wrap .title { font-size: 22px; } .tech-hero-section-3 .hero-form .hero-form-wrap .form-btn .btn { padding: 0 45px; } } .tech-hero-section-4 { padding-top: 85px; overflow: hidden; background-repeat: no-repeat; background-size: cover; background-position: center center; } .tech-hero-section-4 .hero-content { padding-top: 155px; max-width: 550px; } .tech-hero-section-4 .hero-content .sub-title { font-size: 14px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 800; color: #ffffff; text-transform: uppercase; letter-spacing: 1px; height: 40px; line-height: 38px; background: #252239; padding: 0 25px; display: inline-block; border-radius: 35px; margin-bottom: 10px; } .tech-hero-section-4 .hero-content .title { font-size: 72px; line-height: 92px; color: #ffffff; } .tech-hero-section-4 .hero-content p { font-size: 18px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 600; color: #ffffff; margin-top: 25px; } .tech-hero-section-4 .hero-content .btn { margin-top: 50px; } .tech-hero-section-4 .hero-images { padding-top: 50px; text-align: center; position: relative; } .tech-hero-section-4 .hero-images .shape-1 { position: absolute; top: 75px; left: -15px; -webkit-animation: rotate-style 50s linear infinite; animation: rotate-style 50s linear infinite; } .tech-hero-section-4 .hero-images .images { position: relative; bottom: -30px; } @media only screen and (max-width: 1199px) { .tech-hero-section-4 .hero-content .title { font-size: 55px; line-height: 72px; } .tech-hero-section-4 .hero-images .images { padding: 0 35px; } } @media only screen and (max-width: 991px) { .tech-hero-section-4 .hero-content { padding-top: 110px; } .tech-hero-section-4 .hero-content .sub-title { font-size: 12px; padding: 0 20px; } .tech-hero-section-4 .hero-content .title { font-size: 45px; line-height: 60px; } .tech-hero-section-4 .hero-images .images { padding: 0 0px; } } @media only screen and (max-width: 767px) { .tech-hero-section-4 .hero-content { padding-top: 80px; } .tech-hero-section-4 .hero-images .shape-1 { left: 0; } .tech-hero-section-4 .hero-images .images { padding: 0 20px; } } @media only screen and (max-width: 575px) { .tech-hero-section-4 .hero-content .title { font-size: 35px; line-height: 48px; } } .tech-hero-section-5 { height: 960px; background-repeat: no-repeat; background-size: cover; background-position: center top; overflow: hidden; position: relative; z-index: 1; } .tech-hero-section-5 .shape-1 { position: absolute; left: 0; top: 15px; z-index: -1; } .tech-hero-section-5 .shape-2 { position: absolute; right: 0; bottom: 0; z-index: -1; } .tech-hero-section-5 .hero-content { max-width: 880px; margin: 0 auto; padding-top: 60px; } .tech-hero-section-5 .hero-content .sub-title { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 800; color: #ffffff; text-transform: uppercase; letter-spacing: 1px; display: inline-block; margin-bottom: 30px; } .tech-hero-section-5 .hero-content .title { font-size: 72px; line-height: 92px; color: #ffffff; } .tech-hero-section-5 .hero-content p { font-size: 18px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 600; color: #ffffff; margin-top: 25px; } .tech-hero-section-5 .hero-content .btn { margin-top: 45px; } @media only screen and (max-width: 1199px) { .tech-hero-section-5 { height: 860px; } .tech-hero-section-5 .shape-1 img { width: 80%; } .tech-hero-section-5 .shape-2 { right: -140px; } .tech-hero-section-5 .shape-2 img { width: 80%; } .tech-hero-section-5 .hero-content .title { font-size: 55px; line-height: 72px; } } @media only screen and (max-width: 991px) { .tech-hero-section-5 { height: 760px; } .tech-hero-section-5 .hero-content .title { font-size: 45px; line-height: 60px; } } @media only screen and (max-width: 767px) { .tech-hero-section-5 { height: 660px; } .tech-hero-section-5 .shape-1 img { width: 60%; } .tech-hero-section-5 .shape-2 { right: -280px; } .tech-hero-section-5 .shape-2 img { width: 60%; } .tech-hero-section-5 .hero-content .title { font-size: 40px; line-height: 48px; } } @media only screen and (max-width: 575px) { .tech-hero-section-5 .hero-content .sub-title { font-size: 16px; } .tech-hero-section-5 .hero-content .title { font-size: 35px; line-height: 48px; } } .tech-hero-section-6 { padding-top: 85px; overflow: hidden; background-repeat: no-repeat; background-size: cover; background-position: center center; position: relative; z-index: 1; } .tech-hero-section-6::before { content: ""; position: absolute; left: 0; top: 0; background: linear-gradient(-55deg, #54d6eb 0%, #035cdd 100%); opacity: 0.4; width: 100%; height: 100%; z-index: -1; } .tech-hero-section-6 .hero-content { padding-top: 140px; max-width: 620px; } .tech-hero-section-6 .hero-content .sub-title { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 800; color: #ffffff; text-transform: uppercase; letter-spacing: 1px; display: inline-block; margin-bottom: 10px; } .tech-hero-section-6 .hero-content .title { font-size: 72px; line-height: 92px; color: #ffffff; } .tech-hero-section-6 .hero-content p { font-size: 18px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 600; color: #ffffff; margin-top: 25px; padding-right: 35px; } .tech-hero-section-6 .hero-content .btn { margin-top: 50px; } .tech-hero-section-6 .hero-images { padding-top: 125px; text-align: right; position: relative; z-index: 1; } .tech-hero-section-6 .hero-images::before { content: ""; position: absolute; top: 0; left: 0; background-image: linear-gradient(-40deg, #54d6eb 0%, #035cdd 100%); opacity: 0.9; width: 650px; height: 650px; border-radius: 50%; transform: translate(-35px, 40px); z-index: -1; -webkit-animation: animate-02 9s linear infinite; animation: animate-02 9s linear infinite; } @media only screen and (max-width: 1399px) { .tech-hero-section-6 .hero-content .title { font-size: 60px; line-height: 80px; } } @media only screen and (max-width: 1199px) { .tech-hero-section-6 .hero-content { padding-top: 110px; } .tech-hero-section-6 .hero-content .title { font-size: 55px; line-height: 72px; } .tech-hero-section-6 .hero-images::before { width: 480px; height: 480px; transform: translate(-30px, 80px); } } @media only screen and (max-width: 991px) { .tech-hero-section-6 .hero-content { padding-top: 70px; } .tech-hero-section-6 .hero-content .sub-title { font-size: 14px; } .tech-hero-section-6 .hero-content .title { font-size: 40px; line-height: 55px; } .tech-hero-section-6 .hero-content p { font-size: 14px; padding-right: 0; } .tech-hero-section-6 .hero-images::before { width: 380px; height: 380px; transform: translate(-25px, 80px); } } @media only screen and (max-width: 767px) { .tech-hero-section-6 .hero-content p { font-size: 16px; } .tech-hero-section-6 .hero-images::before { width: 430px; height: 430px; transform: translate(5px, 80px); } .tech-hero-section-6 .hero-images .images { padding: 0 50px; } } @media only screen and (max-width: 575px) { .tech-hero-section-6 .hero-content .title { font-size: 35px; line-height: 48px; } } @media only screen and (max-width: 449px) { .tech-hero-section-6 .hero-images { padding-top: 90px; } .tech-hero-section-6 .hero-images::before { width: 350px; height: 350px; transform: translate(-10px, 60px); } .tech-hero-section-6 .hero-images .images { padding: 0 15px; } } .tech-hero-section-7 { height: 980px; background-repeat: no-repeat; background-size: cover; background-position: center center; overflow: hidden; position: relative; z-index: 1; } .tech-hero-section-7 .shape-1 { position: absolute; left: -9%; bottom: -36%; z-index: -1; } .tech-hero-section-7 .hero-content { max-width: 640px; margin: 0 auto; position: relative; padding-top: 80px; z-index: 1; } .tech-hero-section-7 .hero-content::after { content: ""; position: absolute; left: 50%; top: 0; border: 5px solid #ffffff; width: 625px; height: 570px; transform: translateX(-50%); z-index: -1; } .tech-hero-section-7 .hero-content .shape-2 { width: 150px; height: 150px; background: linear-gradient(150deg, #035cdd 0%, #4ecdea 100%); border-radius: 50%; position: absolute; top: -75px; right: -50px; -webkit-animation: zoom-in-out 4s infinite; animation: zoom-in-out 4s infinite; z-index: -1; } .tech-hero-section-7 .hero-content .title { font-size: 110px; line-height: 1; font-weight: 800; color: #ffffff; } .tech-hero-section-7 .hero-content p { font-size: 36px; line-height: 48px; font-family: "Manrope", sans-serif; font-weight: 400; color: #ffffff; margin-top: 25px; } .tech-hero-section-7 .hero-content .btn { margin-top: 45px; } @media only screen and (max-width: 1399px) { .tech-hero-section-7 .shape-1 { left: -38%; bottom: -36%; } } @media only screen and (max-width: 1199px) { .tech-hero-section-7 { height: 880px; } .tech-hero-section-7 .shape-1 { left: -21%; bottom: -28%; } .tech-hero-section-7 .shape-1 img { width: 750px; } .tech-hero-section-7 .hero-content::after { width: 570px; height: 530px; } .tech-hero-section-7 .hero-content .shape-2 { width: 120px; height: 120px; top: -60px; right: -30px; } .tech-hero-section-7 .hero-content .title { font-size: 90px; } .tech-hero-section-7 .hero-content p { font-size: 30px; line-height: 42px; } } @media only screen and (max-width: 991px) { .tech-hero-section-7 { height: 780px; } .tech-hero-section-7 .shape-1 { left: -21%; bottom: -28%; } .tech-hero-section-7 .shape-1 img { width: 620px; } .tech-hero-section-7 .hero-content::after { width: 540px; height: 520px; } } @media only screen and (max-width: 767px) { .tech-hero-section-7 { height: 680px; } .tech-hero-section-7 .hero-content { padding-top: 60px; } .tech-hero-section-7 .hero-content::after { width: 440px; height: 450px; } .tech-hero-section-7 .hero-content .shape-2 { width: 100px; height: 100px; top: -50px; right: -10px; } .tech-hero-section-7 .hero-content .title { font-size: 75px; } .tech-hero-section-7 .hero-content p { font-size: 25px; line-height: 38px; } } @media only screen and (max-width: 575px) { .tech-hero-section-7 { height: 660px; } .tech-hero-section-7 .shape-1 { left: -34%; bottom: -25%; } .tech-hero-section-7 .shape-1 img { width: 510px; } .tech-hero-section-7 .hero-content { padding-top: 45px; } .tech-hero-section-7 .hero-content::after { width: 380px; height: 405px; } .tech-hero-section-7 .hero-content .title { font-size: 65px; } .tech-hero-section-7 .hero-content p { font-size: 25px; line-height: 38px; } } @media only screen and (max-width: 449px) { .tech-hero-section-7 .shape-1 img { width: 460px; } .tech-hero-section-7 .hero-content::after { width: 305px; height: 385px; } .tech-hero-section-7 .hero-content .shape-2 { width: 80px; height: 80px; right: -5px; } .tech-hero-section-7 .hero-content .title { font-size: 55px; } .tech-hero-section-7 .hero-content p { font-size: 20px; line-height: 32px; } } .tech-hero-section-8 { height: 900px; padding-top: 85px; overflow: hidden; position: relative; background-repeat: no-repeat; background-size: cover; background-position: center center; z-index: 1; } .tech-hero-section-8 .shape-4 { position: absolute; right: 8%; top: 3%; z-index: -1; } .tech-hero-section-8 .shape-5 { position: absolute; left: 4%; top: 21%; -webkit-animation: rotate-style 50s linear infinite; animation: rotate-style 50s linear infinite; z-index: -1; } .tech-hero-section-8 .shape-6 { position: absolute; left: -5%; top: 56%; z-index: -1; } .tech-hero-section-8 .hero-content { padding-top: 155px; max-width: 560px; } .tech-hero-section-8 .hero-content .title { font-size: 72px; line-height: 90px; color: #051441; } .tech-hero-section-8 .hero-content .title span { color: #6754e2; } .tech-hero-section-8 .hero-content p { font-size: 18px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #4c4d56; padding-right: 60px; margin-top: 25px; } .tech-hero-section-8 .hero-content .btn { margin-top: 50px; background: #6754e2; border: 2px solid #6754e2; padding: 0 70px; } .tech-hero-section-8 .hero-content .btn:hover { color: #6754e2; } .tech-hero-section-8 .hero-images { position: absolute; top: 0; right: 0; width: 50%; height: 100%; display: flex; justify-content: center; padding-left: 50px; z-index: 1; } .tech-hero-section-8 .hero-images .shape-1 { position: absolute; left: 21%; bottom: 3%; -webkit-animation: up-down 5s infinite; animation: up-down 5s infinite; } .tech-hero-section-8 .hero-images .shape-2 { position: absolute; left: 46%; bottom: 16%; -webkit-animation: round-02 4s linear infinite; animation: round-02 4s linear infinite; } .tech-hero-section-8 .hero-images .shape-3 { position: absolute; left: 12%; top: 21%; -webkit-animation: round-02 4s linear infinite; animation: round-02 4s linear infinite; } .tech-hero-section-8 .hero-images .image { padding-top: 170px; padding-right: 80px; padding-left: 30px; } @media only screen and (max-width: 1399px) { .tech-hero-section-8 { height: 840px; } .tech-hero-section-8 .hero-content .title { font-size: 55px; line-height: 72px; } .tech-hero-section-8 .hero-images { padding-left: 0px; } .tech-hero-section-8 .hero-images .image { padding-right: 50px; padding-left: 0; } } @media only screen and (max-width: 991px) { .tech-hero-section-8 { height: auto; padding-bottom: 240px; } .tech-hero-section-8 .hero-content { padding-top: 60px; } .tech-hero-section-8 .hero-images { position: relative; width: 100%; } .tech-hero-section-8 .hero-images .shape-1 { bottom: -50%; } .tech-hero-section-8 .hero-images .shape-2 { left: 50%; bottom: -35%; } .tech-hero-section-8 .hero-images .image { padding-top: 70px; padding-right: 40px; padding-left: 40px; } } @media only screen and (max-width: 767px) { .tech-hero-section-8 { padding-bottom: 180px; } .tech-hero-section-8 .shape-4 img { width: 180px; } .tech-hero-section-8 .hero-content .title { font-size: 42px; line-height: 58px; } .tech-hero-section-8 .hero-content p { font-size: 16px; padding-right: 0; } .tech-hero-section-8 .hero-images .shape-1 img { width: 140px; } .tech-hero-section-8 .hero-images .shape-2 img { width: 110px; } } @media only screen and (max-width: 575px) { .tech-hero-section-8 .hero-images .image { padding-right: 0; padding-left: 0; } } @media only screen and (max-width: 449px) { .tech-hero-section-8 { padding-bottom: 150px; } .tech-hero-section-8 .hero-content .title { font-size: 35px; line-height: 50px; } .tech-hero-section-8 .hero-images .shape-1 img { width: 110px; } } .tech-hero-section-9 { background: #e4e1fb; padding-top: 85px; overflow: hidden; position: relative; background-repeat: no-repeat; background-size: cover; background-position: center center; z-index: 1; } .tech-hero-section-9 .svg-shape { position: absolute; left: -10%; bottom: -20%; z-index: 2; } .tech-hero-section-9 .svg-shape svg { fill: #ffffff; } .tech-hero-section-9 .shape-1 { position: absolute; left: 5%; top: 16%; -webkit-animation: rotate-style 50s linear infinite; animation: rotate-style 50s linear infinite; z-index: -1; } .tech-hero-section-9 .shape-2 { position: absolute; right: 8%; top: 15%; -webkit-animation: zoom-in-out 4s infinite; animation: zoom-in-out 4s infinite; z-index: -1; } .tech-hero-section-9 .shape-3 { position: absolute; left: 42%; bottom: 33%; -webkit-animation: round-02 4s linear infinite; animation: round-02 4s linear infinite; z-index: -1; } .tech-hero-section-9 .hero-content { padding-top: 155px; max-width: 505px; } .tech-hero-section-9 .hero-content .sub-title { font-size: 12px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 800; text-transform: uppercase; letter-spacing: 1px; color: #005de0; } .tech-hero-section-9 .hero-content .title { font-size: 60px; line-height: 78px; color: #000000; margin-top: 20px; } .tech-hero-section-9 .hero-content p { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 600; color: #4c4d56; margin-top: 30px; } .tech-hero-section-9 .hero-content .btn { margin-top: 50px; } .tech-hero-section-9 .hero-images { padding-top: 115px; padding-bottom: 300px; text-align: center; } .tech-hero-section-9 .hero-images .images { -webkit-animation: up-down 5s infinite; animation: up-down 5s infinite; } @media only screen and (max-width: 1199px) { .tech-hero-section-9 .svg-shape { left: -14%; bottom: -32%; } .tech-hero-section-9 .hero-content .title { font-size: 52px; line-height: 70px; } .tech-hero-section-9 .hero-images { padding-bottom: 220px; } } @media only screen and (max-width: 991px) { .tech-hero-section-9 .svg-shape { left: -71%; bottom: -18%; } .tech-hero-section-9 .shape-1 { top: 7%; } .tech-hero-section-9 .shape-2 { right: 15%; } .tech-hero-section-9 .shape-3 { left: 81%; bottom: 58%; } .tech-hero-section-9 .hero-content { padding-top: 70px; } .tech-hero-section-9 .hero-images { padding-top: 90px; } .tech-hero-section-9 .hero-images .images { padding: 0 80px; } } @media only screen and (max-width: 767px) { .tech-hero-section-9 .svg-shape { left: -94%; bottom: -22%; } .tech-hero-section-9 .shape-2 { top: 11%; } .tech-hero-section-9 .hero-content .title { font-size: 42px; line-height: 58px; } .tech-hero-section-9 .hero-images .images { padding: 0 50px; } } @media only screen and (max-width: 575px) { .tech-hero-section-9 .svg-shape { left: -140%; bottom: -21%; } .tech-hero-section-9 .hero-content .title { font-size: 35px; line-height: 52px; } .tech-hero-section-9 .hero-images .images { padding: 0 0; } } @media only screen and (max-width: 449px) { .tech-hero-section-9 .svg-shape { bottom: -27%; left: -120%; } } .tech-hero-section-10 { background: #0b0f20; padding-top: 85px; overflow: hidden; position: relative; background-repeat: no-repeat; background-position: center top; z-index: 1; } .tech-hero-section-10 .hero-content { padding-top: 165px; max-width: 560px; } .tech-hero-section-10 .hero-content .title { font-size: 70px; line-height: 90px; text-transform: uppercase; color: #ffffff; } .tech-hero-section-10 .hero-content .title span { color: #005de0; } .tech-hero-section-10 .hero-content p { font-size: 18px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #ffffff; padding-right: 60px; margin-top: 25px; } .tech-hero-section-10 .hero-content .btn { margin-top: 50px; background: #005de0; border: 2px solid #005de0; padding: 0 70px; } .tech-hero-section-10 .hero-content .btn:hover { color: #005de0; } .tech-hero-section-10 .hero-images { position: relative; z-index: 1; } .tech-hero-section-10 .hero-images .shape-1 { position: absolute; left: 100px; top: 105px; z-index: 1; } .tech-hero-section-10 .hero-images .shape-2 { position: absolute; left: 130px; top: 0; -webkit-animation: up-down 5s linear infinite; animation: up-down 5s linear infinite; } .tech-hero-section-10 .hero-images .image { padding-top: 75px; padding-bottom: 45px; } @media only screen and (max-width: 1199px) { .tech-hero-section-10 .hero-content { padding-top: 120px; } .tech-hero-section-10 .hero-content .title { font-size: 52px; line-height: 72px; } .tech-hero-section-10 .hero-images .shape-1 { left: 35px; } .tech-hero-section-10 .hero-images .shape-2 { left: 65px; } } @media only screen and (max-width: 991px) { .tech-hero-section-10 .hero-content { padding-top: 70px; } .tech-hero-section-10 .hero-images .shape-1 { left: 100px; } .tech-hero-section-10 .hero-images .shape-2 { left: 130px; } .tech-hero-section-10 .hero-images .image { padding-top: 55px; padding-left: 50px; padding-right: 50px; } } @media only screen and (max-width: 767px) { .tech-hero-section-10 .hero-content .title { font-size: 42px; line-height: 60px; } .tech-hero-section-10 .hero-content p { font-size: 16px; padding-right: 0; } .tech-hero-section-10 .hero-images .shape-1 { width: 310px; } .tech-hero-section-10 .hero-images .shape-2 { width: 270px; } } @media only screen and (max-width: 575px) { .tech-hero-section-10 .hero-content .title { font-size: 36px; line-height: 52px; } .tech-hero-section-10 .hero-images .shape-1 { width: 270px; left: 30px; } .tech-hero-section-10 .hero-images .shape-2 { width: 230px; left: 60px; } .tech-hero-section-10 .hero-images .image { padding-left: 0px; padding-right: 0px; } } @-webkit-keyframes animate-02 { 0%, 100% { border-radius: 50% 50% 50% 50% / 50% 35% 65% 50%; } 34% { border-radius: 50% 50% 35% 65% / 50% 50% 50% 50%; } 50% { border-radius: 50% 50% 50% 50% / 65% 50% 50% 35%; } 67% { border-radius: 35% 65% 50% 50% / 50% 50% 50% 50%; } } @keyframes animate-02 { 0%, 100% { border-radius: 50% 50% 50% 50% / 50% 35% 65% 50%; } 34% { border-radius: 50% 50% 35% 65% / 50% 50% 50% 50%; } 50% { border-radius: 50% 50% 50% 50% / 65% 50% 50% 35%; } 67% { border-radius: 35% 65% 50% 50% / 50% 50% 50% 50%; } } @-webkit-keyframes zoom-in-out { 0% { transform: scale(1); } 50% { transform: scale(0.85); } 100% { transform: scale(1); } } @keyframes zoom-in-out { 0% { transform: scale(1); } 50% { transform: scale(0.85); } 100% { transform: scale(1); } } @-webkit-keyframes up-down { 0% { transform: translateY(25px); } 50% { transform: translateY(0px); } 100% { transform: translateY(25px); } } @keyframes up-down { 0% { transform: translateY(25px); } 50% { transform: translateY(0px); } 100% { transform: translateY(25px); } } @-webkit-keyframes round-02 { 0% { transform: rotate(10deg); } 50% { transform: rotate(0deg); } 100% { transform: rotate(10deg); } } @keyframes round-02 { 0% { transform: rotate(10deg); } 50% { transform: rotate(0deg); } 100% { transform: rotate(10deg); } } /*-- /* 04 - Service CSS /*----------------------------------------*/ .service-section .service-wrap { margin-top: -130px; margin-bottom: -30px; position: relative; z-index: 5; } .service-section .service-wrap .service-item { background: #ffffff; box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.09); padding: 50px 30px; border-radius: 5px; margin-bottom: 30px; overflow: hidden; position: relative; z-index: 1; } @media only screen and (max-width: 1399px) { .service-section .service-wrap .service-item { padding: 50px 25px; } } @media only screen and (max-width: 1199px) { .service-section .service-wrap .service-item { padding: 40px 20px; } } .service-section .service-wrap .service-item::before { content: ""; position: absolute; left: 0; top: 0; background: linear-gradient(148deg, #54d6eb 0%, #055fdd 100%); width: 100%; height: 100%; z-index: -1; opacity: 0; transition: all 0.3s linear; visibility: hidden; } .service-section .service-wrap .service-item .shape-1 { width: 235px; height: 235px; border-radius: 50%; background: rgba(255, 255, 255, 0.1); position: absolute; top: -80px; right: -80px; opacity: 0; transition: all 0.3s linear; visibility: hidden; z-index: -1; } .service-section .service-wrap .service-item .shape-2 { position: absolute; right: -135px; bottom: 55px; opacity: 0; transition: all 0.3s linear; visibility: hidden; z-index: -1; } .service-section .service-wrap .service-item .service-content .title { font-size: 24px; line-height: 30px; font-weight: 700; margin-top: 12px; transition: all 0.3s linear; } .service-section .service-wrap .service-item .service-content .title a { color: #231e32; } @media only screen and (max-width: 1199px) { .service-section .service-wrap .service-item .service-content .title { font-size: 20px; } } .service-section .service-wrap .service-item .service-content p { font-size: 14px; line-height: 26px; font-family: "Manrope", sans-serif; font-weight: 600; color: #4c4d56; margin-top: 20px; transition: all 0.3s linear; } .service-section .service-wrap .service-item:hover::before { opacity: 1; visibility: visible; } .service-section .service-wrap .service-item:hover .shape-1 { opacity: 1; visibility: visible; } .service-section .service-wrap .service-item:hover .shape-2 { opacity: 1; visibility: visible; } .service-section .service-wrap .service-item:hover .service-content .title a { color: #ffffff; } .service-section .service-wrap .service-item:hover .service-content p { color: #ffffff; } .service-section-2 { background: #ffffff; background-repeat: no-repeat; background-size: cover; background-position: center bottom; padding-bottom: 110px; } @media only screen and (max-width: 1199px) { .service-section-2 { padding-bottom: 80px; } } @media only screen and (max-width: 991px) { .service-section-2 { padding-bottom: 60px; } } @media only screen and (max-width: 767px) { .service-section-2 { padding-bottom: 40px; } } .service-section-2 .service-wrap-2 .service-content-wrap-2 { padding-top: 60px; } .service-section-2 .service-wrap-2 .service-content-wrap-2 .service-item .service-img { position: relative; overflow: hidden; border-top-left-radius: 5px; border-top-right-radius: 5px; } .service-section-2 .service-wrap-2 .service-content-wrap-2 .service-item .service-img a { display: block; position: relative; } .service-section-2 .service-wrap-2 .service-content-wrap-2 .service-item .service-img a img { width: 100%; } .service-section-2 .service-wrap-2 .service-content-wrap-2 .service-item .service-img a::before { content: ""; position: absolute; left: 0; top: 0; background: linear-gradient(180deg, #FFFFFF00 0%, #010f31 100%); width: 100%; height: 100%; opacity: 0.8; z-index: 0; } .service-section-2 .service-wrap-2 .service-content-wrap-2 .service-item .service-img .shape-1 { width: 355px; height: 205px; background: linear-gradient(90deg, #54d6eb 0%, #035cdd 100%); transform: skewY(15deg); position: absolute; right: -9%; top: 48%; opacity: 0; visibility: hidden; transition: all 0.3s linear; z-index: 1; } .service-section-2 .service-wrap-2 .service-content-wrap-2 .service-item .service-img .shape-2 { width: 355px; height: 120px; background: linear-gradient(280deg, #54d6eb 0%, #035cdd 100%); transform: skewY(15deg); position: absolute; right: -35%; top: 42%; opacity: 0; visibility: hidden; transition: all 0.3s linear; z-index: 1; } .service-section-2 .service-wrap-2 .service-content-wrap-2 .service-item .service-img .service-img-text { position: absolute; bottom: 0; left: 0; padding: 0 50px; z-index: 1; opacity: 0; visibility: hidden; transition: all 0.3s linear; } @media only screen and (max-width: 1199px) { .service-section-2 .service-wrap-2 .service-content-wrap-2 .service-item .service-img .service-img-text { padding: 0 30px; } } .service-section-2 .service-wrap-2 .service-content-wrap-2 .service-item .service-img .service-img-text p { font-size: 16px; line-height: 30px; color: #ffffff; font-family: "Manrope", sans-serif; font-weight: 400; } .service-section-2 .service-wrap-2 .service-content-wrap-2 .service-item .service-content { display: flex; align-items: center; justify-content: space-between; background: #ffffff; border: 1px solid #ebebeb; border-top: 0; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; padding: 30px 40px 40px 35px; } @media only screen and (max-width: 1399px) { .service-section-2 .service-wrap-2 .service-content-wrap-2 .service-item .service-content { padding: 30px 25px 35px 25px; } } .service-section-2 .service-wrap-2 .service-content-wrap-2 .service-item .service-content .title { font-size: 24px; line-height: 30px; color: #231e32; } @media only screen and (max-width: 1399px) { .service-section-2 .service-wrap-2 .service-content-wrap-2 .service-item .service-content .title { font-size: 20px; } } @media only screen and (max-width: 1199px) { .service-section-2 .service-wrap-2 .service-content-wrap-2 .service-item .service-content .title { font-size: 17px; } } @media only screen and (max-width: 991px) { .service-section-2 .service-wrap-2 .service-content-wrap-2 .service-item .service-content .title { font-size: 20px; } } .service-section-2 .service-wrap-2 .service-content-wrap-2 .service-item .service-content .read-more { width: 40px; height: 40px; line-height: 40px; border-radius: 50%; text-align: center; font-size: 14px; background: #005de0; color: #ffffff; display: inline-block; } .service-section-2 .service-wrap-2 .service-content-wrap-2 .service-item:hover .service-img .shape-1 { opacity: 0.8; visibility: visible; } .service-section-2 .service-wrap-2 .service-content-wrap-2 .service-item:hover .service-img .shape-2 { opacity: 0.8; visibility: visible; } .service-section-2 .service-wrap-2 .service-content-wrap-2 .service-item:hover .service-img .service-img-text { opacity: 1; visibility: visible; transform: translateY(-45px); } .service-2-active .swiper-pagination { position: relative; margin-top: 60px; } .service-2-active .swiper-pagination .swiper-pagination-bullet { width: 10px; height: 10px; background-repeat: 50%; background: #e1e1e1; } .service-2-active .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background: #005de0; } .service-section-3 { background: #fbfaff; background-repeat: no-repeat; background-size: cover; background-position: center center; } .service-section-3 .service-wrap-3 .service-slider-wrap { margin-top: 70px; } @media only screen and (max-width: 991px) { .service-section-3 .service-wrap-3 .service-slider-wrap { margin-top: 50px; } } .service-section-3 .service-wrap-3 .service-slider-wrap .service-item { background: #ffffff; padding: 55px; border-radius: 10px; box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.06); } @media only screen and (max-width: 1199px) { .service-section-3 .service-wrap-3 .service-slider-wrap .service-item { padding: 40px; } } .service-section-3 .service-wrap-3 .service-slider-wrap .service-item .service-content .title { font-size: 22px; line-height: 30px; margin-top: 30px; } @media only screen and (max-width: 1199px) { .service-section-3 .service-wrap-3 .service-slider-wrap .service-item .service-content .title { font-size: 20px; } } .service-section-3 .service-wrap-3 .service-slider-wrap .service-item .service-content .title a { color: #231e32; } .service-section-3 .service-wrap-3 .service-slider-wrap .service-item .service-content .title a:hover { color: #ff5538; } .service-section-3 .service-wrap-3 .service-slider-wrap .service-item .service-content p { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #4c4d56; margin-top: 10px; } .service-section-3 .service-wrap-3 .service-slider-wrap .service-item .service-content .read-more { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 700; color: #ff5538; margin-top: 15px; } .service-section-3 .service-wrap-3 .service-slider-wrap .service-item .service-content .read-more i { position: relative; top: 2px; transform: translateX(10px); transition: all 0.3s linear; } .service-section-3 .service-wrap-3 .service-slider-wrap .service-item .service-content .read-more:hover i { transform: translateX(15px); } .service-3-active.slider-bullet .swiper-pagination { margin-top: 50px; } .service-3-active.slider-bullet .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background: #ff5538; } .service-section-4 .service-wrap-4 .service-left .title { font-size: 42px; line-height: 60px; font-weight: 800; color: #333333; padding-right: 10px; } @media only screen and (max-width: 1399px) { .service-section-4 .service-wrap-4 .service-left .title { font-size: 40px; padding-right: 0; } } @media only screen and (max-width: 1199px) { .service-section-4 .service-wrap-4 .service-left .title { font-size: 36px; line-height: 48px; } } @media only screen and (max-width: 767px) { .service-section-4 .service-wrap-4 .service-left .title { font-size: 28px; line-height: 40px; } } .service-section-4 .service-wrap-4 .service-left .title span { color: #ff5538; } .service-section-4 .service-wrap-4 .service-left .service-list { margin-top: 50px; } .service-section-4 .service-wrap-4 .service-left .service-list li { border-bottom: 1px solid #ebebeb; margin-bottom: 25px; padding-bottom: 25px; } .service-section-4 .service-wrap-4 .service-left .service-list li:last-child { margin-bottom: 0; } .service-section-4 .service-wrap-4 .service-left .service-list li a { font-size: 20px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 700; color: #333333; } @media only screen and (max-width: 575px) { .service-section-4 .service-wrap-4 .service-left .service-list li a { font-size: 18px; } } .service-section-4 .service-wrap-4 .service-left .service-list li a:hover { color: #ff5538; } .service-section-4 .service-wrap-4 .service-left .service-list li a:hover i { transform: translateX(20px); } .service-section-4 .service-wrap-4 .service-left .service-list li a i { transform: translateX(15px); transition: all 0.3s linear; } .service-section-4 .service-wrap-4 .service-right { padding-left: 40px; } @media only screen and (max-width: 1199px) { .service-section-4 .service-wrap-4 .service-right { padding-top: 30px; padding-left: 0; } } @media only screen and (max-width: 1199px) { .service-section-4 .service-wrap-4 .service-right .service-item { margin-top: 30px; } } .service-section-4 .service-wrap-4 .service-right .service-item .service-img { border-radius: 10px; overflow: hidden; } .service-section-4 .service-wrap-4 .service-right .service-item .service-img a { display: block; } .service-section-4 .service-wrap-4 .service-right .service-item .service-img a:hover img { transform: scale(1.1); } .service-section-4 .service-wrap-4 .service-right .service-item .service-img a img { width: 100%; transition: all 0.3s linear; } .service-section-4 .service-wrap-4 .service-right .service-item .service-content .title { font-size: 22px; line-height: 30px; margin-top: 30px; } .service-section-4 .service-wrap-4 .service-right .service-item .service-content .title a { color: #231e32; } .service-section-4 .service-wrap-4 .service-right .service-item .service-content .title a:hover { color: #ff5538; } .service-section-4 .service-wrap-4 .service-right .service-item .service-content p { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #4c4d56; margin-top: 10px; } .service-section-4 .service-wrap-4 .service-right .service-item .service-content .read-more { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 700; color: #ff5538; margin-top: 20px; } .service-section-4 .service-wrap-4 .service-right .service-item .service-content .read-more:hover i { transform: translateX(15px); } .service-section-4 .service-wrap-4 .service-right .service-item .service-content .read-more i { position: relative; top: 2px; transform: translateX(10px); transition: all 0.3s linear; } .service-section-5 .service-wrap { margin-top: 0; margin-bottom: -190px; } .service-section-5 .service-wrap .about-service-item { padding: 50px; margin-top: 30px; margin-bottom: 0; padding-bottom: 70px; } @media only screen and (max-width: 1199px) { .service-section-5 .service-wrap .about-service-item { padding: 40px; } } @media only screen and (max-width: 767px) { .service-section-5 .service-wrap .about-service-item { padding: 40px 22px; } } .service-section-5 .service-wrap .about-service-item .service-icon { height: 135px; width: 135px; background: #e9f1fc; line-height: 130px; border-radius: 50%; margin: 0 auto; margin-bottom: 25px; } .service-section-6 { background: #ffffff; } .service-section-6 .service-wrap-3 .service-slider-wrap { margin-top: -140px; position: relative; z-index: 1; } .service-section-6 .service-wrap-3 .service-slider-wrap .service-item { background: #ffffff; padding: 40px 50px 35px 150px; border-radius: 10px; box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.06); background-repeat: no-repeat; background-position: center left; overflow: hidden; position: relative; z-index: 1; } @media only screen and (max-width: 1399px) { .service-section-6 .service-wrap-3 .service-slider-wrap .service-item { padding: 40px 30px 35px 120px; } } @media only screen and (max-width: 1199px) { .service-section-6 .service-wrap-3 .service-slider-wrap .service-item { padding: 40px 30px 35px 65px; } } @media only screen and (max-width: 767px) { .service-section-6 .service-wrap-3 .service-slider-wrap .service-item { padding: 40px 23px 35px 23px; } } @media only screen and (max-width: 575px) { .service-section-6 .service-wrap-3 .service-slider-wrap .service-item { padding: 40px 30px 35px 70px; } } .service-section-6 .service-wrap-3 .service-slider-wrap .service-item .service-content .title { margin-top: 0; } .service-section-6 .service-wrap-3 .service-slider-wrap .service-item .service-content .title a:hover { color: #005de0; } .service-section-6 .service-wrap-3 .service-slider-wrap .service-item .service-content .read-more { color: #005de0; } .service-6-active.slider-bullet .swiper-pagination { margin-top: 50px; } .service-6-active.slider-bullet .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background: #005de0; } .service-section-7 { background: #110d1b; background-repeat: no-repeat; background-size: cover; background-position: center center; padding-bottom: 120px; } .service-section-7 .service-item { display: flex; align-items: center; justify-content: space-between; background: #1d1927; padding: 35px 40px 45px; margin-top: 30px; } .service-section-7 .service-item .service-content { display: flex; align-items: center; } .service-section-7 .service-item .service-content .title { font-size: 24px; line-height: 30px; color: #ffffff; margin-left: 35px; transition: all 0.3s linear; } .service-section-7 .service-item .service-link-icon i { font-size: 20px; color: #ffffff; transition: all 0.3s linear; } .service-section-7 .service-item:hover .service-content .title { color: #005de0; } .service-section-7 .service-item:hover .service-link-icon i { color: #005de0; } .service-section-7 .service-bottom-text { margin-top: 60px; } .service-section-7 .service-bottom-text p { font-size: 18px; line-height: 30px; font-family: #090d2f; font-weight: 400; color: #ffffff; } .service-section-7 .service-bottom-text p a { font-weight: 700; color: #005de0; position: relative; } .service-section-7 .service-bottom-text p a::before { content: ""; position: absolute; left: 0; bottom: 5px; background: #005de0; width: 100%; height: 1px; } .service-section-7 .service-bottom-text p a:hover { color: #ffffff; } @media only screen and (max-width: 1399px) { .service-section-7 .service-item { padding: 35px 30px 45px; } } .service-section-8 { background-repeat: no-repeat; background-size: cover; background-position: center center; padding-top: 225px; padding-bottom: 120px; } .service-section-8 .service-wrap-4 .service-left { padding-right: 100px; } .service-section-8 .service-wrap-4 .service-left .service-list { margin-top: 0px; } .service-section-8 .service-wrap-4 .service-left .service-list li { border-bottom: 1px solid #cbcccc; } .service-section-8 .service-wrap-4 .service-left .service-list li a i { color: #005de0; } .service-section-8 .service-wrap-4 .service-left .service-list li a:hover { color: #005de0; } .service-section-8 .service-wrap-4 .service-right { padding-left: 0; } .service-section-8 .service-wrap-4 .service-right .section-title2 .title { font-weight: 700; } .service-section-8 .service-wrap-4 .service-right .experience-wrap { display: flex; margin-top: 40px; } .service-section-8 .service-wrap-4 .service-right .experience-wrap .experience { text-align: left; background: linear-gradient(-48deg, #54d6eb 0%, #035cdd 100%); padding: 60px 75px 50px 40px; border-radius: 5px; } .service-section-8 .service-wrap-4 .service-right .experience-wrap .experience .number { font-size: 100px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 800; color: #ffffff; display: block; } .service-section-8 .service-wrap-4 .service-right .experience-wrap .experience .text { font-size: 18px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 600; color: #ffffff; display: block; margin-top: 35px; } .service-section-8 .service-wrap-4 .service-right .experience-wrap .experience-text p { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #4c4d56; margin-top: 10px; margin-left: 50px; padding-right: 65px; } @media only screen and (max-width: 1399px) { .service-section-8 { padding-top: 190px; } .service-section-8 .service-wrap-4 .service-right .experience-wrap .experience-text p { margin-left: 40px; padding-right: 0; } } @media only screen and (max-width: 1199px) { .service-section-8 { padding-bottom: 100px; } .service-section-8 .service-wrap-4 .service-left { padding-right: 0; } .service-section-8 .service-wrap-4 .service-right { padding-top: 60px; } .service-section-8 .service-wrap-4 .service-right .section-title2 { margin: 0; } .service-section-8 .service-wrap-4 .service-right .experience-wrap .experience-text p { margin-left: 50px; padding-right: 65px; } } @media only screen and (max-width: 991px) { .service-section-8 { padding-top: 170px; padding-bottom: 80px; } .service-section-8 .service-wrap-4 .service-right .experience-wrap .experience-text p { padding-right: 0; } } @media only screen and (max-width: 575px) { .service-section-8 .service-wrap-4 .service-right .experience-wrap { flex-direction: column; gap: 20px; } .service-section-8 .service-wrap-4 .service-right .experience-wrap .experience { max-width: 235px; } .service-section-8 .service-wrap-4 .service-right .experience-wrap .experience-text p { margin-left: 0; } } .service-section-9 .service-wrap { margin-top: -30px; } .service-section-9 .service-item { margin-top: 30px; } .service-section-9 .service-item .service-content { padding: 0 35px; } @media only screen and (max-width: 1399px) { .service-section-9 .service-item .service-content { padding: 0; } } .service-section-9 .service-item .service-content .title { font-size: 22px; line-height: 30px; color: #231e32; margin-top: 20px; } .service-section-9 .service-item .service-content p { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #4c4d56; margin-top: 10px; } .service-section-10 { background: #0b0f20; } .service-section-10 .service-wrap .section-title2 .title { text-transform: uppercase; } .service-section-10 .service-wrap .service-content-wrap { padding-top: 50px; } .service-section-10 .service-wrap .service-item { background: linear-gradient(340deg, #54d1e9 -20%, #5d298a 100%); padding: 50px 60px 65px; border-radius: 15px; overflow: hidden; position: relative; transform: translate3d(0, 0, 0); margin-top: 30px; transition: all 0.3s linear; z-index: 1; } .service-section-10 .service-wrap .service-item .shape-1 { position: absolute; right: -86%; top: -19%; z-index: -1; } .service-section-10 .service-wrap .service-item .service-icon img { height: 180px; } .service-section-10 .service-wrap .service-item .service-content { margin-top: 40px; } .service-section-10 .service-wrap .service-item .service-content .title { font-size: 30px; line-height: 40px; font-weight: 700; margin-top: 12px; text-transform: uppercase; transition: all 0.3s linear; } .service-section-10 .service-wrap .service-item .service-content .title a { color: #ffffff; } .service-section-10 .service-wrap .service-item .service-content p { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 600; color: #ffffff; margin-top: 10px; transition: all 0.3s linear; } .service-section-10 .service-wrap .service-item:hover { transform: translateY(-5px) translate3d(0, -5px, 0); } .service-section-10 .service-wrap .service-item:hover .service-content .title a { color: #005de0; } @media only screen and (max-width: 1199px) { .service-section-10 .service-wrap .service-item { padding: 50px 40px 60px; } } @media only screen and (max-width: 991px) { .service-section-10 .service-wrap .service-content-wrap { padding-top: 30px; } } @media only screen and (max-width: 767px) { .service-section-10 .service-wrap .service-item .shape-1 { right: -52%; } } /*-- /* 05 - About CSS /*----------------------------------------*/ .about-section { overflow: hidden; } .about-section .about-wrap .about-thumb-wrap { position: relative; padding-right: 40px; } .about-section .about-wrap .about-thumb-wrap .about-thumb-small { border-radius: 5px; position: absolute; left: 0px; top: 0; } .about-section .about-wrap .about-thumb-wrap .about-thumb-small img { border-radius: 5px; } .about-section .about-wrap .about-thumb-wrap .about-thumb-big { text-align: right; z-index: 1; transform: translateY(135px) translateX(35px); } .about-section .about-wrap .about-thumb-wrap .about-thumb-big img { border-radius: 5px; } .about-section .about-wrap .about-thumb-wrap .about-thumb-shape { position: absolute; top: 235px; left: 65px; z-index: -1; } .about-section .about-wrap .about-thumb-wrap .play-btn { position: absolute; right: -55px; bottom: 8px; } .about-section .about-wrap .about-thumb-wrap .play-btn a { width: 105px; height: 105px; line-height: 105px; font-size: 15px; display: inline-block; text-align: center; border-radius: 50%; background: #005de0; color: #ffffff; transition: all 0.3s linear; } .about-section .about-wrap .about-thumb-wrap .play-btn a::before { content: ""; border: 2px solid #ffffff; position: absolute; z-index: 0; left: 50%; top: 50%; transform: translate(-50%, -50%); display: block; width: 215px; height: 215px; border-radius: 50%; -webkit-animation: zoombig 3.25s linear infinite; animation: zoombig 3.25s linear infinite; -webkit-animation-delay: .8s; animation-delay: .8s; } .about-section .about-wrap .about-thumb-wrap .play-btn a::after { content: ""; border: 2px solid #ffffff; position: absolute; z-index: 0; left: 50%; top: 50%; transform: translate(-50%, -50%); display: block; width: 215px; height: 215px; border-radius: 50%; -webkit-animation: zoombig 3.25s linear infinite; animation: zoombig 3.25s linear infinite; -webkit-animation-delay: 0s; animation-delay: 0s; } .about-section .about-wrap .about-thumb-wrap .play-btn a:hover { background: #ffffff; color: #005de0; box-shadow: 0px 0px 98px 0px rgba(0, 0, 0, 0.07); } .about-section .about-wrap .about-content { padding-left: 120px; } @media only screen and (max-width: 1399px) { .about-section .about-wrap .about-content { padding-left: 80px; } } .about-section .about-wrap .about-content p { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #4c4d56; margin-top: 25px; } .about-section .about-wrap .about-content .about-author-list { display: flex; align-items: center; padding-top: 15px; } .about-section .about-wrap .about-content .about-author-list .about-author { background: #ffffff; box-shadow: 0px 0px 62px 0px rgba(0, 0, 0, 0.08); padding: 35px 30px 35px 45px; border-radius: 5px; margin-right: 40px; margin-top: 25px; position: relative; } .about-section .about-wrap .about-content .about-author-list .about-author::before { content: ""; position: absolute; left: 50%; top: 0; transform: translateX(-50%); background: #005de0; height: 3px; width: calc(100% - 30px); } .about-section .about-wrap .about-content .about-author-list .about-author .name { font-size: 16px; line-height: 20px; font-family: "Manrope", sans-serif; font-weight: 700; color: #090d2f; margin-top: 10px; } .about-section .about-wrap .about-content .about-author-list .about-author .designation { font-size: 12px; line-height: 18px; font-family: "Roboto", sans-serif; font-weight: 400; color: #4c4d56; } .about-section .about-wrap .about-content .about-author-list .about-author .author-img { position: absolute; left: -25px; top: 35px; } .about-section .about-wrap .about-content .about-author-list .about-author .author-img img { border-radius: 50%; } .about-section .about-wrap .about-content .about-author-list .about-list { margin-top: 25px; } .about-section .about-wrap .about-content .about-author-list .about-list ul li { font-size: 16px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 700; color: #090d2f; } .about-section .about-wrap .about-content .about-author-list .about-list ul li + li { margin-top: 15px; } .about-section .about-wrap .about-content .about-author-list .about-list ul li i { color: #005de0; margin-right: 5px; } @media only screen and (max-width: 1199px) { .about-section .about-wrap .about-content { padding-left: 64px; } .about-section .about-wrap .about-content .about-author-list { flex-wrap: wrap; } } @media only screen and (max-width: 991px) { .about-section .about-wrap .about-thumb-wrap .play-btn { right: -40px; } .about-section .about-wrap .about-thumb-wrap .play-btn a { width: 80px; height: 80px; line-height: 80px; } .about-section .about-wrap .about-thumb-wrap .play-btn a::before { width: 180px; height: 180px; } .about-section .about-wrap .about-thumb-wrap .play-btn a::after { width: 180px; height: 180px; } .about-section .about-wrap .about-content { padding-left: 0px; margin-top: 200px; } } @media only screen and (max-width: 575px) { .about-section { padding-bottom: 0; } .about-section .about-wrap .about-thumb-wrap { padding-right: 0; } .about-section .about-wrap .about-thumb-wrap .about-thumb-small { position: inherit; text-align: center; } .about-section .about-wrap .about-thumb-wrap .about-thumb-big { transform: translateY(30px) translateX(0px); text-align: center; } .about-section .about-wrap .about-thumb-wrap .about-thumb-shape { display: none; } .about-section .about-wrap .about-thumb-wrap .play-btn { bottom: -65px; right: 130px; } .about-section .about-wrap .about-content { padding-left: 0px; margin-top: 130px; } .about-section .about-wrap .about-content .about-author-list { display: block; } .about-section .about-wrap .about-content .about-author-list .about-author { margin-right: 25px; margin-left: 25px; } } @-webkit-keyframes zoombig { 0% { transform: translate(-50%, -50%) scale(0.5); opacity: 1; border-width: 3px; } 40% { opacity: .5; border-width: 3px; } 65% { border-width: 2px; } 100% { transform: translate(-50%, -50%) scale(1); opacity: 0; border-width: 2px; } } @keyframes zoombig { 0% { transform: translate(-50%, -50%) scale(0.5); opacity: 1; border-width: 3px; } 40% { opacity: .5; border-width: 3px; } 65% { border-width: 2px; } 100% { transform: translate(-50%, -50%) scale(1); opacity: 0; border-width: 2px; } } .about-section-2 { background: #fafbff; border-radius: 10px; background-repeat: no-repeat; background-size: cover; background-position: center right; } .about-section-2 .about-wrap-2 .about-img { text-align: center; position: relative; margin-top: 35px; } .about-section-2 .about-wrap-2 .about-img img { border-radius: 10px; } .about-section-2 .about-wrap-2 .about-img .about-img-text { text-align: left; background: linear-gradient(-48deg, #54d6eb 0%, #035cdd 100%); position: absolute; left: 0; top: -35px; padding: 90px 60px 65px; border-radius: 10px; background-repeat: no-repeat; background-size: cover; background-position: center center; } .about-section-2 .about-wrap-2 .about-img .about-img-text .number { font-size: 120px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 800; color: #ffffff; display: block; } .about-section-2 .about-wrap-2 .about-img .about-img-text .text { font-size: 24px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #ffffff; display: block; margin-top: 55px; } .about-section-2 .about-wrap-2 .about-content { padding-left: 65px; padding-right: 20px; } .about-section-2 .about-wrap-2 .about-content .section-title2 .title { font-size: 48px; line-height: 60px; font-weight: 700; } .about-section-2 .about-wrap-2 .about-content .about-list { padding-top: 40px; } .about-section-2 .about-wrap-2 .about-content .about-list ul li { display: flex; align-items: flex-start; font-size: 16px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 700; color: #333333; } .about-section-2 .about-wrap-2 .about-content .about-list ul li .about-icon { color: #5149f3; margin-right: 8px; } .about-section-2 .about-wrap-2 .about-content .about-list ul li + li { margin-top: 15px; } .about-section-2 .about-wrap-2 .about-content .about-btn { margin-top: 60px; } @media only screen and (max-width: 1199px) { .about-section-2 .about-wrap-2 .about-img .about-img-text { padding: 75px 55px 55px; } .about-section-2 .about-wrap-2 .about-img .about-img-text .number { font-size: 95px; } .about-section-2 .about-wrap-2 .about-img .about-img-text .text { font-size: 22px; margin-top: 40px; } .about-section-2 .about-wrap-2 .about-content { padding-left: 20px; padding-right: 0px; margin-top: 60px; } .about-section-2 .about-wrap-2 .about-content .section-title2 .title { font-size: 36px; line-height: 48px; } } @media only screen and (max-width: 991px) { .about-section-2 .about-wrap-2 .about-content { padding-left: 0; } } @media only screen and (max-width: 767px) { .about-section-2 .about-wrap-2 .about-content .section-title2 .title { font-size: 28px; line-height: 40px; } } .about-section-3 .about-wrap .about-content-wrap { margin-top: 70px; } .about-section-3 .about-wrap .about-content-wrap .about-thumb-wrap { position: relative; } .about-section-3 .about-wrap .about-content-wrap .about-thumb-wrap .about-thumb-middle { position: relative; top: 75px; } .about-section-3 .about-wrap .about-content-wrap .about-thumb-wrap .about-thumb-middle img { border-radius: 10px; } .about-section-3 .about-wrap .about-content-wrap .about-thumb-wrap .about-thumb-bottom { position: absolute; right: 95px; bottom: -45px; z-index: 1; } .about-section-3 .about-wrap .about-content-wrap .about-thumb-wrap .about-thumb-bottom img { border-radius: 10px; } .about-section-3 .about-wrap .about-content-wrap .about-thumb-wrap .about-thumb-small { position: absolute; top: 0; right: 0; } .about-section-3 .about-wrap .about-content-wrap .about-thumb-wrap .about-thumb-small img { border-radius: 10px; } .about-section-3 .about-wrap .about-content-wrap .about-thumb-wrap .about-thumb-shape { text-align: right; position: relative; top: -65px; right: 5px; z-index: -1; } .about-section-3 .about-wrap .about-content-wrap .about-content { padding-left: 115px; } .about-section-3 .about-wrap .about-content-wrap .about-content .experience { display: flex; } .about-section-3 .about-wrap .about-content-wrap .about-content .experience .number { font-size: 180px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 800; color: #ff5538; margin-right: 10px; } .about-section-3 .about-wrap .about-content-wrap .about-content .experience span { font-size: 18px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 600; color: #333333; margin-top: 5px; } .about-section-3 .about-wrap .about-content-wrap .about-content .title { font-size: 24px; line-height: 36px; color: #333333; margin-top: 40px; } .about-section-3 .about-wrap .about-content-wrap .about-content p { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #4c4d56; margin-top: 35px; } .about-section-3 .about-wrap .about-content-wrap .skill-bar-wrap .skill-item .bar-inner .progress-line { background: #ff5538; } @media only screen and (max-width: 1199px) { .about-section-3 .about-wrap .about-content-wrap .about-content { padding-left: 50px; } .about-section-3 .about-wrap .about-content-wrap .about-content .experience .number { font-size: 150px; } } @media only screen and (max-width: 991px) { .about-section-3 .about-wrap .about-content-wrap .about-thumb-wrap { position: relative; } .about-section-3 .about-wrap .about-content-wrap .about-thumb-wrap .about-thumb-bottom { right: 140px; } .about-section-3 .about-wrap .about-content-wrap .about-thumb-wrap .about-thumb-small { right: 62px; } .about-section-3 .about-wrap .about-content-wrap .about-thumb-wrap .about-thumb-shape { right: 45px; } .about-section-3 .about-wrap .about-content-wrap .about-content { padding-left: 0; margin-top: 140px; } } @media only screen and (max-width: 575px) { .about-section-3 .about-wrap .about-content-wrap { margin-top: 50px; } .about-section-3 .about-wrap .about-content-wrap .about-thumb-wrap .about-thumb-middle { text-align: center; top: 0; } .about-section-3 .about-wrap .about-content-wrap .about-thumb-wrap .about-thumb-middle img { width: 100%; } .about-section-3 .about-wrap .about-content-wrap .about-thumb-wrap .about-thumb-bottom { display: none; } .about-section-3 .about-wrap .about-content-wrap .about-thumb-wrap .about-thumb-small { display: none; } .about-section-3 .about-wrap .about-content-wrap .about-thumb-wrap .about-thumb-shape { display: none; } .about-section-3 .about-wrap .about-content-wrap .about-content { margin-top: 90px; } .about-section-3 .about-wrap .about-content-wrap .about-content .experience .number { font-size: 120px; } .about-section-3 .about-wrap .about-content-wrap .about-content .experience span { font-size: 16px; margin-top: 0; } } .about-section-4 { padding-bottom: 270px; } .about-section-4 .about-wrap .section-title { max-width: 760px; } .about-section-4 .about-wrap .about-content-wrap { margin-top: 65px; } .about-section-4 .about-wrap .about-content-wrap .about-thumb-wrap .about-thumb-middle { top: 0; } .about-section-4 .about-wrap .about-content-wrap .about-thumb-wrap .about-thumb-bottom { bottom: -170px; right: 0; } .about-section-4 .about-wrap .about-content-wrap .about-thumb-wrap .about-thumb-small { top: 35px; right: 14px; } .about-section-4 .about-wrap .about-content-wrap .about-thumb-wrap .about-thumb-shape { top: -170px; right: 60px; } .about-section-4 .about-wrap .about-content-wrap .about-content .about-author-list .about-list { margin-top: 25px; } .about-section-4 .about-wrap .about-content-wrap .about-content .about-author-list .about-list ul li { font-size: 16px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 700; color: #333333; display: flex; } .about-section-4 .about-wrap .about-content-wrap .about-content .about-author-list .about-list ul li + li { margin-top: 15px; } .about-section-4 .about-wrap .about-content-wrap .about-content .about-author-list .about-list ul li i { color: #005de0; margin-right: 10px; position: relative; top: 4px; } .about-section-4 .about-wrap .about-content-wrap .about-content .about-author-list .about-author { border-top: 1px solid #ebebeb; display: flex; margin-top: 45px; padding-top: 30px; } .about-section-4 .about-wrap .about-content-wrap .about-content .about-author-list .about-author .author-text { margin-right: 30px; } .about-section-4 .about-wrap .about-content-wrap .about-content .about-author-list .about-author .author-text .name { color: #333333; } @media only screen and (max-width: 1199px) { .about-section-4 { padding-bottom: 205px; } .about-section-4 .about-wrap .about-content-wrap { margin-top: 10px; } } @media only screen and (max-width: 991px) { .about-section-4 { padding-bottom: 80px; } .about-section-4 .about-wrap .about-content-wrap { margin-top: 50px; } .about-section-4 .about-wrap .about-content-wrap .about-content { margin-top: 220px; } } @media only screen and (max-width: 767px) { .about-section-4 { padding-bottom: 60px; } } @media only screen and (max-width: 575px) { .about-section-4 .about-wrap .about-content-wrap .about-content { margin-top: 0px; } } .about-section-5 { padding-bottom: 320px; background: #09091d; background-repeat: no-repeat; background-size: cover; background-position: center center; } .about-section-5 .about-wrap .about-left { padding-right: 105px; } .about-section-5 .about-wrap .about-left .section-title .sub-title { color: #ffffff; } .about-section-5 .about-wrap .about-left .section-title .title { color: #ffffff; } .about-section-5 .about-wrap .about-right { padding-right: 140px; } .about-section-5 .about-wrap .about-right p { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #ffffff; } .about-section-5 .about-wrap .about-right .about-author { display: flex; margin-top: 50px; } .about-section-5 .about-wrap .about-right .about-author .author-text { margin-left: 40px; } .about-section-5 .about-wrap .about-right .about-author .author-text .name { font-size: 16px; line-height: 24px; color: #ffffff; } .about-section-5 .about-wrap .about-right .about-author .author-text .designation { font-size: 12px; line-height: 18px; font-family: "Manrope", sans-serif; font-weight: 400; color: #ffffff; } @media only screen and (max-width: 1199px) { .about-section-5 { padding-bottom: 235px; } .about-section-5 .about-wrap .about-left { padding-right: 0; } .about-section-5 .about-wrap .about-right { padding-right: 0; } } @media only screen and (max-width: 991px) { .about-section-5 .about-wrap .about-right { margin-top: 35px; } } @media only screen and (max-width: 767px) { .about-section-5 { padding-bottom: 195px; } } .about-section-6 { padding-bottom: 200px; background-repeat: no-repeat; background-size: cover; background-position: center top; } .about-section-6 .about-wrap .about-left { max-width: 460px; } .about-section-6 .about-wrap .about-right { margin-top: 35px; } @media only screen and (max-width: 991px) { .about-section-6 .about-wrap .about-right { margin-top: 65px; } } .about-section-6 .about-wrap .about-right .about-experience-award .single-item { display: flex; border-bottom: 1px solid #e1e1e1; padding-bottom: 40px; } .about-section-6 .about-wrap .about-right .about-experience-award .single-item:last-child { margin-top: 65px; } .about-section-6 .about-wrap .about-right .about-experience-award .single-item .number { font-size: 120px; line-height: 30px; font-weight: 800; color: #005de0; } @media only screen and (max-width: 1199px) { .about-section-6 .about-wrap .about-right .about-experience-award .single-item .number { font-size: 90px; } } .about-section-6 .about-wrap .about-right .about-experience-award .single-item span { font-size: 24px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #333333; margin-left: 25px; } @media only screen and (max-width: 1199px) { .about-section-6 .about-wrap .about-right .about-experience-award .single-item span { font-size: 20px; line-height: 28px; } } .tech-about-section-7 .about-img-wrap { position: relative; } .tech-about-section-7 .about-img-wrap .about-img-big { position: relative; border-radius: 5px; z-index: 1; } .tech-about-section-7 .about-img-wrap .about-img-sm { position: absolute; border: 10px solid #ffffff; box-shadow: 0px 0px 98px 0px rgba(0, 0, 0, 0.06); border-radius: 5px; right: 0; bottom: 6%; z-index: 2; } .tech-about-section-7 .about-img-wrap .about-img-sm .shape-1 { position: absolute; width: 20px; height: 165px; background: #005de0; top: -67%; left: 72%; } .tech-about-section-7 .about-img-wrap .about-img-sm .play-btn { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .tech-about-section-7 .about-img-wrap .about-img-sm .play-btn a { height: 85px; width: 85px; line-height: 85px; font-size: 15px; display: inline-block; text-align: center; border-radius: 50%; background: #ffffff; color: #005de0; } .tech-about-section-7 .about-img-wrap .about-img-sm .play-btn a:hover { background: #005de0; color: #ffffff; } .tech-about-section-7 .about-content { padding-left: 100px; padding-right: 80px; } .tech-about-section-7 .about-content .text { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #4c4d56; margin-top: 40px; } .tech-about-section-7 .about-content .about-list { display: flex; padding-top: 15px; } .tech-about-section-7 .about-content .about-list .about-list-item { display: flex; margin-top: 10px; } .tech-about-section-7 .about-content .about-list .about-list-item .number { font-size: 48px; line-height: 1; font-family: "Manrope", sans-serif; font-weight: 400; color: #4c4d56; } .tech-about-section-7 .about-content .about-list .about-list-item .list-content { margin-left: 15px; padding-right: 40px; } .tech-about-section-7 .about-content .about-list .about-list-item .list-content .title { font-size: 20px; line-height: 30px; color: #333333; } .tech-about-section-7 .about-content .about-list .about-list-item .list-content p { font-size: 14px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 400; color: #4c4d56; } .tech-about-section-7 .about-content .btn { height: 50px; line-height: 45px; padding: 0 45px; font-size: 14px; margin-top: 40px; } @media only screen and (max-width: 1199px) { .tech-about-section-7 .about-img-wrap { text-align: center; } .tech-about-section-7 .about-img-wrap .about-img-sm { right: 14%; } .tech-about-section-7 .about-content { padding-left: 0px; margin-top: 50px; } .tech-about-section-7 .about-content .section-title2 { margin: 0; } } @media only screen and (max-width: 991px) { .tech-about-section-7 .about-img-wrap .about-img-sm { right: 0; } .tech-about-section-7 .about-content { padding-right: 0; } } @media only screen and (max-width: 767px) { .tech-about-section-7 .about-img-wrap .about-img-sm { display: inline-block; position: relative; bottom: 0; margin-top: 30px; } .tech-about-section-7 .about-img-wrap .about-img-sm .shape-1 { display: none; } .tech-about-section-7 .about-content .about-list .about-list-item .list-content { padding-right: 0; } } @media only screen and (max-width: 575px) { .tech-about-section-7 .about-content .about-list { flex-direction: column; gap: 15px; } } .about-section-8 { overflow: hidden; padding-top: 180px; padding-bottom: 140px; } .about-section-8 .about-wrap .about-content-wrap { margin-top: 0; } .about-section-8 .about-wrap .about-content-wrap .about-thumb-wrap { position: relative; padding-left: 100px; z-index: 1; } .about-section-8 .about-wrap .about-content-wrap .about-thumb-wrap .shape-1 { position: absolute; left: -35%; top: -54%; transform: translateX(8%); z-index: -1; } .about-section-8 .about-wrap .about-content-wrap .about-thumb-wrap .about-thumb-middle { top: 0; } .about-section-8 .about-wrap .about-content-wrap .about-thumb-wrap .about-thumb-middle img { border-radius: 15px; } .about-section-8 .about-wrap .about-content-wrap .about-thumb-wrap .about-thumb-bottom { bottom: -75px; right: 20px; } .about-section-8 .about-wrap .about-content-wrap .about-thumb-wrap .about-thumb-bottom img { border-radius: 15px; } .about-section-8 .about-wrap .about-content-wrap .about-content-2 { padding-left: 105px; } .about-section-8 .about-wrap .about-content-wrap .about-content-2 .section-title .title { color: #051441; } .about-section-8 .about-wrap .about-content-wrap .about-content-2 .text { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #4c4d56; margin-top: 30px; } .about-section-8 .about-wrap .about-content-wrap .about-content-2 .about-list .about-list-item { margin-top: 25px; } .about-section-8 .about-wrap .about-content-wrap .about-content-2 .about-list .about-list-item span { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 700; color: #051441; } .about-section-8 .about-wrap .about-content-wrap .about-content-2 .about-list .about-list-item span i { color: #6754e2; margin-right: 15px; } .about-section-8 .about-wrap .about-content-wrap .about-content-2 .about-list .about-list-item .about-text p { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #4c4d56; margin-left: 35px; } @media only screen and (max-width: 1199px) { .about-section-8 { padding-top: 150px; padding-bottom: 100px; } .about-section-8 .about-wrap .about-content-wrap .about-thumb-wrap { padding-left: 50px; } .about-section-8 .about-wrap .about-content-wrap .about-thumb-wrap .shape-1 { top: -42%; } .about-section-8 .about-wrap .about-content-wrap .about-content-2 { padding-left: 50px; } } @media only screen and (max-width: 991px) { .about-section-8 { padding-top: 120px; padding-bottom: 80px; } .about-section-8 .about-wrap .about-content-wrap .about-thumb-wrap { text-align: center; padding-left: 0px; } .about-section-8 .about-wrap .about-content-wrap .about-thumb-wrap .shape-1 { top: -45%; left: -24%; } .about-section-8 .about-wrap .about-content-wrap .about-thumb-wrap .shape-1 img { width: 780px; } .about-section-8 .about-wrap .about-content-wrap .about-content-2 { padding-left: 0; margin-top: 120px; } } @media only screen and (max-width: 767px) { .about-section-8 .about-wrap .about-content-wrap .about-thumb-wrap .shape-1 { top: -38%; left: -40%; } .about-section-8 .about-wrap .about-content-wrap .about-thumb-wrap .shape-1 img { width: 670px; } } @media only screen and (max-width: 575px) { .about-section-8 { padding-top: 80px; } .about-section-8 .about-wrap .about-content-wrap .about-thumb-wrap .shape-1 { top: -33%; } .about-section-8 .about-wrap .about-content-wrap .about-content-2 { margin-top: 60px; } } /*-- /* 09 - Features CSS /*----------------------------------------*/ .features-section { background: #f2f2f2; background-repeat: no-repeat; background-size: cover; background-position: center center; overflow: hidden; position: relative; z-index: 5; } .features-section .features-thumb { position: absolute; left: 70px; width: 45%; height: 100%; } .features-section .features-thumb .shape-1 { position: absolute; left: 150px; top: 85px; padding: 0 20px; z-index: -1; -webkit-animation: rotate-style 50s linear infinite; animation: rotate-style 50s linear infinite; } .features-section .features-wrap { padding-top: 140px; padding-bottom: 145px; } .features-section .features-wrap .features-content-wrap { padding-left: 110px; } .features-section .features-wrap .features-content-wrap .section-title { margin-left: 0; } .features-section .features-wrap .features-content-wrap .features-content { padding-top: 20px; } .features-section .features-wrap .features-content-wrap .features-content ul { display: flex; flex-wrap: wrap; } .features-section .features-wrap .features-content-wrap .features-content ul .features-item { display: flex; width: 50%; margin-top: 35px; } .features-section .features-wrap .features-content-wrap .features-content ul .features-item .features-text { flex: 1; margin-left: 35px; max-width: 220px; } .features-section .features-wrap .features-content-wrap .features-content ul .features-item .features-text .title { font-size: 22px; line-height: 30px; color: #231e32; } .features-section .features-wrap .features-content-wrap .features-content ul .features-item .features-text p { font-size: 16px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 400; color: #4c4d56; margin-top: 10px; } .features-section .features-wrap .features-content-wrap .features-content .features-link p { font-size: 16px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 600; color: #4c4d56; margin-top: 40px; } .features-section .features-wrap .features-content-wrap .features-content .features-link p a { color: #005de0; font-weight: 700; text-decoration: underline; } @media only screen and (max-width: 1399px) { .features-section .features-thumb { left: 25px; } } @media only screen and (max-width: 1399px) and (max-width: 1399px) { .features-section .features-thumb .shape-1 { top: 205px; } } @media only screen and (max-width: 1399px) { .features-section .features-wrap .features-content-wrap { padding-left: 90px; } .features-section .features-wrap .features-content-wrap .features-content ul .features-item .features-text { margin-left: 30px; } } @media only screen and (max-width: 1199px) { .features-section .features-thumb { position: relative; left: 0px; width: 100%; justify-content: center; } .features-section .features-thumb .image { padding-top: 100px; padding-left: 50px; padding-right: 50px; } .features-section .features-thumb .shape-1 { left: 275px; top: 150px; } .features-section .features-wrap { padding-top: 70px; padding-bottom: 100px; } .features-section .features-wrap .features-content-wrap { padding-left: 0px; } } @media only screen and (max-width: 991px) { .features-section .features-thumb .image { padding-top: 100px; } .features-section .features-thumb .shape-1 { left: 225px; top: 150px; } .features-section .features-thumb .shape-1 img { width: 520px; } .features-section .features-wrap { padding-top: 70px; padding-bottom: 80px; } } @media only screen and (max-width: 767px) { .features-section .features-thumb .image { padding-top: 80px; } .features-section .features-thumb .shape-1 { left: 160px; top: 140px; } .features-section .features-thumb .shape-1 img { width: 390px; } .features-section .features-wrap { padding-top: 70px; padding-bottom: 60px; } } @media only screen and (max-width: 575px) { .features-section .features-thumb .image { padding-left: 20px; padding-right: 20px; } .features-section .features-thumb .shape-1 { left: 110px; top: 115px; padding: 0 20px; } .features-section .features-wrap .features-content-wrap .features-content { padding-top: 20px; } .features-section .features-wrap .features-content-wrap .features-content ul .features-item { width: 100%; } .features-section .features-wrap .features-content-wrap .features-content ul .features-item .features-text .title { font-size: 20px; line-height: 30px; color: #231e32; } } @-webkit-keyframes rotate-style { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @keyframes rotate-style { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .features-section-2 .features-wrap-2 { margin-top: -10px; } .features-section-2 .features-wrap-2 .features-item-wrap { border: 3px solid #e1e1e1; border-radius: 10px; padding: 70px 55px; position: relative; display: flex; margin-top: 60px; } .features-section-2 .features-wrap-2 .features-item-wrap::before { content: ""; background: #e1e1e1; width: 80%; margin: auto; height: 1px; position: absolute; left: 0; right: 0; top: 50%; } .features-section-2 .features-wrap-2 .features-item-wrap .features-item-box { border-right: 1px solid #e1e1e1; padding-right: 60px; margin-right: 50px; } .features-section-2 .features-wrap-2 .features-item-wrap .features-item-box.features-box-3 { border-right: 0; padding-right: 0; margin-right: 0; } .features-section-2 .features-wrap-2 .features-item-wrap .features-item-box .features-item { display: flex; } .features-section-2 .features-wrap-2 .features-item-wrap .features-item-box .features-item.features-2, .features-section-2 .features-wrap-2 .features-item-wrap .features-item-box .features-item.features-4, .features-section-2 .features-wrap-2 .features-item-wrap .features-item-box .features-item.features-6 { margin-top: 60px; padding-top: 60px; } .features-section-2 .features-wrap-2 .features-item-wrap .features-item-box .features-item .features-content { flex: 1; margin-left: 14px; } .features-section-2 .features-wrap-2 .features-item-wrap .features-item-box .features-item .features-content .title { font-size: 22px; line-height: 30px; color: #231e32; } .features-section-2 .features-wrap-2 .features-item-wrap .features-item-box .features-item .features-content p { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #4c4d56; margin-top: 10px; } @media only screen and (max-width: 1199px) { .features-section-2 .features-wrap-2 .features-item-wrap { padding: 60px 40px; } .features-section-2 .features-wrap-2 .features-item-wrap .features-item-box { padding-right: 20px; margin-right: 20px; } .features-section-2 .features-wrap-2 .features-item-wrap .features-item-box .features-item .features-content { margin-left: 8px; } .features-section-2 .features-wrap-2 .features-item-wrap .features-item-box .features-item .features-content .title { font-size: 20px; } } @media only screen and (max-width: 991px) { .features-section-2 .features-wrap-2 .features-item-wrap { padding: 50px; display: flex; flex-wrap: wrap; margin-top: 40px; } .features-section-2 .features-wrap-2 .features-item-wrap::before { display: none; } .features-section-2 .features-wrap-2 .features-item-wrap .features-item-box { border-right: 0; padding-right: 0px; margin-right: 0px; } .features-section-2 .features-wrap-2 .features-item-wrap .features-item-box .features-item { display: flex; margin-top: 30px; } .features-section-2 .features-wrap-2 .features-item-wrap .features-item-box .features-item.features-1 { margin-top: 0; } .features-section-2 .features-wrap-2 .features-item-wrap .features-item-box .features-item.features-2, .features-section-2 .features-wrap-2 .features-item-wrap .features-item-box .features-item.features-4, .features-section-2 .features-wrap-2 .features-item-wrap .features-item-box .features-item.features-6 { margin-top: 30px; padding-top: 0px; } } @media only screen and (max-width: 575px) { .features-section-2 .features-wrap-2 .features-item-wrap { padding: 40px; } .features-section-2 .features-wrap-2 .features-item-wrap .features-item-box .features-item { display: block; } .features-section-2 .features-wrap-2 .features-item-wrap .features-item-box .features-item .features-content { margin-top: 10px; margin-left: 0; } .features-section-2 .features-wrap-2 .features-item-wrap .features-item-box .features-item .features-content .title { font-size: 20px; } } .features-section-3 .features-wrap-3 .features-content-wrap { padding-top: 20px; } .features-section-3 .features-wrap-3 .features-content-wrap .single-item { border: 1px solid #ebebeb; padding: 45px; padding-bottom: 65px; border-radius: 10px; margin-top: 30px; } @media only screen and (max-width: 767px) { .features-section-3 .features-wrap-3 .features-content-wrap .single-item { padding: 35px; } } .features-section-3 .features-wrap-3 .features-content-wrap .single-item .features-icon img { height: 50px; } .features-section-3 .features-wrap-3 .features-content-wrap .single-item .features-content .title { font-size: 22px; line-height: 30px; color: #231e32; margin-top: 20px; } .features-section-3 .features-wrap-3 .features-content-wrap .single-item .features-content p { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #4c4d56; margin-top: 10px; } @media only screen and (max-width: 767px) { .features-section-4 .features-wrap-3 .features-content-wrap .single-item { padding: 28px; } } .features-section-4 .features-wrap-3 .features-content-wrap .single-item .features-icon { position: relative; } .features-section-4 .features-wrap-3 .features-content-wrap .single-item .features-icon::before { content: ""; position: absolute; left: -12px; top: 15px; width: 50px; height: 50px; background: #e5eefc; border-radius: 50%; z-index: -1; } .features-section-4 .features-wrap-3 .features-content-wrap .single-item .features-content .title { margin-top: 45px; } @media only screen and (max-width: 767px) { .features-section-4 .features-wrap-3 .features-content-wrap .single-item .features-content .title { font-size: 20px; } } .features-section-5 .features-wrap-5 { margin-bottom: -30px; margin-top: -85px; position: relative; z-index: 1; } .features-section-5 .features-wrap-5 .features-item { display: flex; align-items: center; background-repeat: no-repeat; background-size: cover; background-position: center center; border-radius: 10px; padding: 40px 50px; margin-bottom: 30px; } @media only screen and (max-width: 1199px) { .features-section-5 .features-wrap-5 .features-item { padding: 35px 30px; } } @media only screen and (max-width: 991px) { .features-section-5 .features-wrap-5 .features-item { display: block; } } @media only screen and (max-width: 767px) { .features-section-5 .features-wrap-5 .features-item { text-align: center; } } .features-section-5 .features-wrap-5 .features-item .features-text { flex: 1; margin-left: 25px; } @media only screen and (max-width: 1199px) { .features-section-5 .features-wrap-5 .features-item .features-text { margin-left: 20px; } } @media only screen and (max-width: 991px) { .features-section-5 .features-wrap-5 .features-item .features-text { margin-left: 0; margin-top: 10px; } } .features-section-5 .features-wrap-5 .features-item .features-text .title { font-size: 22px; line-height: 30px; color: #ffffff; } @media only screen and (max-width: 991px) { .features-section-5 .features-wrap-5 .features-item .features-text .title { font-size: 20px; } } .features-section-6 { background-repeat: no-repeat; background-size: cover; background-position: center center; } .features-section-6 .features-wrap-3 .section-title2 { margin: 0; } @media only screen and (max-width: 991px) { .features-section-6 .features-wrap-3 .section-title2 { text-align: center; margin: 0 auto; } } .features-section-6 .features-wrap-3 .features-6-btn { text-align: right; } @media only screen and (max-width: 991px) { .features-section-6 .features-wrap-3 .features-6-btn { text-align: center; } } .features-section-6 .features-wrap-3 .features-6-btn .btn { padding: 0 65px; margin-top: 20px; } .features-section-6 .features-wrap-3 .features-content-wrap { padding-top: 40px; } .features-section-6 .features-wrap-3 .features-content-wrap .single-item { display: flex; padding-bottom: 45px; background: #ffffff; } @media only screen and (max-width: 1399px) { .features-section-6 .features-wrap-3 .features-content-wrap .single-item { padding: 40px; } } @media only screen and (max-width: 1199px) { .features-section-6 .features-wrap-3 .features-content-wrap .single-item { flex-direction: column; gap: 20px; } } .features-section-6 .features-wrap-3 .features-content-wrap .single-item .features-icon::before { z-index: 0; } .features-section-6 .features-wrap-3 .features-content-wrap .single-item .features-icon img { position: relative; z-index: 1; } .features-section-6 .features-wrap-3 .features-content-wrap .single-item .features-content { flex: 1; margin-left: 30px; } @media only screen and (max-width: 1199px) { .features-section-6 .features-wrap-3 .features-content-wrap .single-item .features-content { margin-left: 0; } } .features-section-6 .features-wrap-3 .features-content-wrap .single-item .features-content .title { margin-top: 0; } @media only screen and (max-width: 1399px) { .features-section-6 .features-wrap-3 .features-content-wrap .single-item .features-content .title { font-size: 20px; } } .features-section-7 { padding-bottom: 145px; } .features-section-7 .features-wrap .features-img-wrap { display: flex; } .features-section-7 .features-wrap .features-img-wrap .features-img img { border-radius: 5px; } .features-section-7 .features-wrap .features-img-wrap .features-img:first-child { padding-right: 15px; } .features-section-7 .features-wrap .features-img-wrap .features-img:last-child { padding-left: 15px; margin-top: 25px; } .features-section-7 .features-wrap .features-content { padding-left: 112px; } .features-section-7 .features-wrap .features-content .section-title .title span { color: #005de0; } .features-section-7 .features-wrap .features-content p { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #4c4d56; margin-top: 30px; } .features-section-7 .features-wrap .features-content .features-item-wrap { padding-top: 20px; display: flex; } .features-section-7 .features-wrap .features-content .features-item-wrap .col { position: relative; padding-right: 20px; margin-right: 5px; } .features-section-7 .features-wrap .features-content .features-item-wrap .col:last-child { padding-right: 0px; margin-right: 0px; } .features-section-7 .features-wrap .features-content .features-item-wrap .col:last-child::before { display: none; } .features-section-7 .features-wrap .features-content .features-item-wrap .col::before { content: ""; position: absolute; right: 0; top: 0; height: 110px; width: 1px; background: #ededed; transform: translateY(40px); } .features-section-7 .features-wrap .features-content .features-item-wrap .col .features-item { margin-top: 30px; } .features-section-7 .features-wrap .features-content .features-item-wrap .col .features-item .title { font-size: 18px; line-height: 24px; margin-top: 10px; } @media only screen and (max-width: 1399px) { .features-section-7 .features-wrap .features-content .features-item-wrap .col .features-item .title { font-size: 17px; } } @media only screen and (max-width: 1199px) { .features-section-7 { padding-bottom: 100px; } .features-section-7 .features-wrap .features-content { padding-left: 30px; } } @media only screen and (max-width: 991px) { .features-section-7 { padding-bottom: 80px; } .features-section-7 .features-wrap .features-content { padding-left: 0px; margin-top: 50px; } } @media only screen and (max-width: 767px) { .features-section-7 { padding-bottom: 60px; } } @media only screen and (max-width: 575px) { .features-section-7 .features-wrap .features-img-wrap { flex-direction: column; text-align: center; } .features-section-7 .features-wrap .features-img-wrap .features-img:first-child { padding-right: 0; } .features-section-7 .features-wrap .features-img-wrap .features-img:last-child { padding-left: 0px; } .features-section-7 .features-wrap .features-content .features-item-wrap { flex-direction: column; } .features-section-7 .features-wrap .features-content .features-item-wrap .col { padding-right: 0; margin-right: 0; } .features-section-7 .features-wrap .features-content .features-item-wrap .col::before { display: none; } } .features-section-8 { padding-bottom: 140px; } .features-section-8 .section-title { max-width: 590px; } .features-section-8 .section-title .title { color: #051441; } .features-section-8 .features-item { border: 1px solid #cccccc; border-radius: 15px; padding: 35px 40px 50px; margin-top: 30px; transition: all 0.3s linear; } .features-section-8 .features-item .features-content { max-width: 210px; margin-top: 65px; } .features-section-8 .features-item .features-content .sub-title { font-size: 12px; line-height: 24px; text-transform: uppercase; letter-spacing: 1px; font-family: "Manrope", sans-serif; font-weight: 700; color: #959595; } .features-section-8 .features-item .features-content .title { font-size: 22px; line-height: 34px; font-family: "Manrope", sans-serif; font-weight: 700; color: #051441; } .features-section-8 .features-item .features-content .title:hover a { color: #6754e2; } .features-section-8 .features-item:hover { border: 1px solid #6754e2; } .features-section-8 .features-banner { background: #8349f9; background-repeat: no-repeat; background-position: center center; background-size: cover; border-radius: 15px; padding: 80px 75px; margin-top: 30px; } .features-section-8 .features-banner .features-content { max-width: 390px; } .features-section-8 .features-banner .features-content .title { font-size: 30px; line-height: 36px; color: #ffffff; } .features-section-8 .features-banner .features-content p { font-size: 16px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 400; color: #ffffff; margin-top: 25px; } .features-section-8 .features-banner .features-content .learn-more { font-size: 12px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 600; position: relative; color: #ffffff; margin-top: 10px; } .features-section-8 .features-banner .features-content .learn-more i { margin-left: 2px; transition: all 0.3s linear; } .features-section-8 .features-banner .features-content .learn-more::before { content: ""; position: absolute; left: 0; bottom: 4px; background: #ffffff; width: 100%; height: 1px; } .features-section-8 .features-banner .features-content .learn-more:hover i { margin-left: 5px; } @media only screen and (max-width: 575px) { .features-section-8 .features-banner { padding: 60px 40px; } } .features-section-9 { background-repeat: no-repeat; background-size: cover; background-position: center center; } .features-section-9 .features-wrap-3 { margin-top: -30px; } .features-section-9 .section-title { max-width: 380px; margin: 0; padding-top: 70px; } .features-section-9 .section-title .title { color: #ffffff; } .features-section-9 .features-item { background: rgba(83, 213, 235, 0.1); border-radius: 10px; padding: 50px 50px 60px 60px; margin-top: 30px; transition: all 0.3s linear; } .features-section-9 .features-item .features-icon img { height: 44px; } .features-section-9 .features-item .features-content { margin-top: 35px; } .features-section-9 .features-item .features-content .title { font-size: 24px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 700; color: #ffffff; transition: all 0.3s linear; } .features-section-9 .features-item .features-content .title:hover { color: #005de0; } .features-section-9 .features-item .features-content p { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #ffffff; margin-top: 10px; } @media only screen and (max-width: 1199px) { .features-section-9 .features-item { padding: 50px 35px 50px 40px; } } @media only screen and (max-width: 767px) { .features-section-9 .section-title { text-align: center; margin: 0 auto; padding-top: 40px; padding-bottom: 20px; } } .features-section-10 { background-repeat: no-repeat; background-size: cover; background-position: center center; } .features-section-10 .features-wrap-3 { margin-top: -30px; } .features-section-10 .section-title2 { max-width: 870px; } .features-section-10 .section-title2 .sub-title { letter-spacing: 1px; } .features-section-10 .section-title2 .title { text-transform: uppercase; } .features-section-10 .features-content-wrap { padding-top: 40px; } .features-section-10 .features-item { background: rgba(0, 0, 0, 0.4); border-radius: 10px; padding: 50px 50px 60px; margin-top: 30px; transition: all 0.3s linear; } .features-section-10 .features-item .features-content { margin-top: 35px; } .features-section-10 .features-item .features-content .title { font-size: 22px; line-height: 30px; text-transform: uppercase; font-family: "Manrope", sans-serif; font-weight: 700; color: #ffffff; transition: all 0.3s linear; } .features-section-10 .features-item:hover .title { color: #005de0; } @media only screen and (max-width: 1199px) { .features-section-10 .features-item { padding: 50px 35px 60px; } .features-section-10 .features-item .features-content .title { font-size: 20px; } } @media only screen and (max-width: 991px) { .features-section-10 .features-content-wrap { padding-top: 20px; } } /*-- /* 07 - Counter CSS /*----------------------------------------*/ .counter-section { padding-top: 100px; padding-bottom: 140px; background: #000c29; background-repeat: no-repeat; background-size: cover; background-position: center center; } @media only screen and (max-width: 1199px) { .counter-section { padding-top: 70px; padding-bottom: 100px; } } @media only screen and (max-width: 991px) { .counter-section { padding-top: 50px; padding-bottom: 80px; } } @media only screen and (max-width: 767px) { .counter-section { padding-top: 30px; padding-bottom: 60px; } } .counter-section .counter-wrap .counter-item { margin-top: 30px; } .counter-section .counter-wrap .counter-item .counter-icon { margin-bottom: 30px; } .counter-section .counter-wrap .counter-item .counter-text span { font-size: 50px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 700; color: #ffffff; } @media only screen and (max-width: 767px) { .counter-section .counter-wrap .counter-item .counter-text span { font-size: 40px; } } .counter-section .counter-wrap .counter-item .counter-text p { font-size: 14px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #ffffff; } .counter-section-2 { background: #ff5538; padding-bottom: 100px; } @media only screen and (max-width: 1199px) { .counter-section-2 { padding-bottom: 80px; } } @media only screen and (max-width: 991px) { .counter-section-2 { padding-bottom: 60px; } } @media only screen and (max-width: 767px) { .counter-section-2 { padding-bottom: 40px; } } .counter-section-2 .counter-wrap .counter-item { display: flex; } .counter-section-2 .counter-wrap .counter-item .counter-text { flex: 1; margin-left: 15px; } .counter-section-3 { padding-top: 130px; padding-bottom: 130px; background-repeat: no-repeat; background-size: cover; background-position: center center; } @media only screen and (max-width: 1199px) { .counter-section-3 { padding-top: 100px; padding-bottom: 100px; } } @media only screen and (max-width: 991px) { .counter-section-3 { padding-top: 80px; padding-bottom: 80px; } } @media only screen and (max-width: 767px) { .counter-section-3 { padding-top: 60px; padding-bottom: 60px; } } .counter-section-3 .experience-content { display: flex; align-items: center; } @media only screen and (max-width: 767px) { .counter-section-3 .experience-content { display: block; } } .counter-section-3 .experience-content .experience { margin-top: 20px; } .counter-section-3 .experience-content .experience .number { font-size: 150px; line-height: 30px; color: #005de0; } @media only screen and (max-width: 1399px) { .counter-section-3 .experience-content .experience .number { font-size: 110px; } } @media only screen and (max-width: 767px) { .counter-section-3 .experience-content .experience .number { font-size: 90px; } } .counter-section-3 .experience-content .experience span { font-size: 24px; line-height: 38px; font-family: "Manrope", sans-serif; font-weight: 400; color: #333333; display: block; margin-top: 60px; } @media only screen and (max-width: 1399px) { .counter-section-3 .experience-content .experience span { font-size: 20px; margin-top: 35px; } } .counter-section-3 .experience-content .experience-text { padding-left: 70px; padding-right: 20px; } @media only screen and (max-width: 1199px) { .counter-section-3 .experience-content .experience-text { padding-left: 18px; padding-right: 0; } } @media only screen and (max-width: 767px) { .counter-section-3 .experience-content .experience-text { padding-left: 0; margin-top: 20px; } } .counter-section-3 .experience-content .experience-text .title { font-size: 36px; line-height: 48px; color: #333333; } @media only screen and (max-width: 767px) { .counter-section-3 .experience-content .experience-text .title { font-size: 28px; line-height: 40px; } } .counter-section-3 .experience-content .experience-text .title span { color: #005de0; } @media only screen and (max-width: 991px) { .counter-section-3 .service-content { margin-top: 40px; } } .counter-section-3 .service-content .service-list li { border-bottom: 1px solid #005de0; margin-bottom: 25px; padding-bottom: 25px; } .counter-section-3 .service-content .service-list li:last-child { margin-bottom: 0; } .counter-section-3 .service-content .service-list li a { font-size: 20px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 700; color: #333333; } @media only screen and (max-width: 575px) { .counter-section-3 .service-content .service-list li a { font-size: 18px; } } .counter-section-3 .service-content .service-list li a:hover { color: #005de0; } .counter-section-3 .service-content .service-list li a:hover i { transform: translateX(20px); } .counter-section-3 .service-content .service-list li a i { transform: translateX(15px); transition: all 0.3s linear; } .counter-section-3 .counter-wrap { padding-top: 50px; } .counter-section-3 .counter-wrap .counter-item { background: #ffffff; padding: 29px; padding-bottom: 10px; border-radius: 5px; } @media only screen and (max-width: 1199px) { .counter-section-3 .counter-wrap .counter-item { flex-direction: column; text-align: center; padding-bottom: 30px; } } @media only screen and (max-width: 1199px) { .counter-section-3 .counter-wrap .counter-item .counter-text { margin-left: 0; } } .counter-section-3 .counter-wrap .counter-item .counter-text span { color: #333333; } .counter-section-3 .counter-wrap .counter-item .counter-text p { color: #4c4d56; } .counter-section-7 { background-repeat: no-repeat; background-size: cover; background-position: center center; } .counter-section-7 .counter-wrap { margin-top: -30px; margin-bottom: -90px; position: relative; z-index: 1; } .counter-section-7 .counter-wrap .counter-item { background: #ffffff; box-shadow: 0px 0px 98px 0px rgba(0, 0, 0, 0.04); border-radius: 5px; padding: 55px 80px; margin-top: 30px; } .counter-section-7 .counter-wrap .counter-item .counter-content p { font-size: 14px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 400; color: #333333; position: relative; margin-bottom: 35px; } .counter-section-7 .counter-wrap .counter-item .counter-content p::before { content: ""; position: absolute; left: 50%; bottom: -15px; background: #005de0; width: 40px; height: 2px; transform: translateX(-50%); } .counter-section-7 .counter-wrap .counter-item .counter-content span { display: inline-block; font-size: 48px; line-height: 1; font-family: "Manrope", sans-serif; font-weight: 700; color: #333333; } @media only screen and (max-width: 1199px) { .counter-section-7 .counter-wrap .counter-item { padding: 55px 40px; } } /*-- /* 06 - Skill CSS /*----------------------------------------*/ .skill-section { position: relative; z-index: 1; } .skill-section::before { content: ""; position: absolute; left: 0; top: 0; background: #f2f2f2 url(../images/bg/skill-bg.jpg); background-repeat: no-repeat; background-size: cover; background-position: 100% 100%; width: 44%; height: 100%; z-index: -1; } @media only screen and (max-width: 767px) { .skill-section::before { display: none; } } .skill-section .skill-wrap .skill-content-wrap .skill-content-left { padding-top: 20px; } .skill-section .skill-wrap .skill-content-wrap .skill-content-left .experience .number { font-size: 150px; line-height: 30px; color: #005de0; } @media only screen and (max-width: 1199px) { .skill-section .skill-wrap .skill-content-wrap .skill-content-left .experience .number { font-size: 110px; } } @media only screen and (max-width: 575px) { .skill-section .skill-wrap .skill-content-wrap .skill-content-left .experience .number { font-size: 90px; } } .skill-section .skill-wrap .skill-content-wrap .skill-content-left .experience span { font-size: 24px; line-height: 38px; font-family: "Manrope", sans-serif; font-weight: 400; color: #090d2f; display: block; margin-top: 60px; } @media only screen and (max-width: 1199px) { .skill-section .skill-wrap .skill-content-wrap .skill-content-left .experience span { margin-top: 40px; } } @media only screen and (max-width: 767px) { .skill-section .skill-wrap .skill-content-wrap .skill-content-left .experience span { font-size: 20px; } } .skill-section .skill-wrap .skill-content-wrap .skill-content-left .title { font-size: 40px; line-height: 54px; color: #333333; margin-top: 40px; } @media only screen and (max-width: 1199px) { .skill-section .skill-wrap .skill-content-wrap .skill-content-left .title { font-size: 36px; line-height: 48px; } } @media only screen and (max-width: 767px) { .skill-section .skill-wrap .skill-content-wrap .skill-content-left .title { font-size: 28px; line-height: 40px; } } .skill-section .skill-wrap .skill-content-wrap .skill-content-left .title span { color: #005de0; } /*.skill-section .skill-wrap .skill-img-wrap {*/ /* padding-top: 70px;*/ /*}*/ .skill-section .skill-wrap .skill-img-wrap .skill-img-item { margin-top: 30px; } .skill-section .skill-wrap .skill-img-wrap .skill-img-item .skill-img { overflow: hidden; border-radius: 5px; position: relative; transform: translate3d(0, 0, 0); transition: all 0.3s linear; z-index: 1; } .skill-section .skill-wrap .skill-img-wrap .skill-img-item .skill-img .image { display: block; position: relative; } .skill-section .skill-wrap .skill-img-wrap .skill-img-item .skill-img .image::before { content: ""; position: absolute; left: 0; top: 0; background: linear-gradient(180deg, #FFFFFF00 0%, #010f31 100%); width: 100%; height: 100%; opacity: 0.8; z-index: 0; } .skill-section .skill-wrap .skill-img-wrap .skill-img-item .skill-img .image img { border-radius: 5px; width: 100%; } .skill-section .skill-wrap .skill-img-wrap .skill-img-item .skill-img .skill-img-text { position: absolute; bottom: 45px; left: 30px; } .skill-section .skill-wrap .skill-img-wrap .skill-img-item .skill-img .skill-img-text .title { font-size: 24px; line-height: 30px; color: #ffffff; } @media only screen and (max-width: 767px) { .skill-section .skill-wrap .skill-img-wrap .skill-img-item .skill-img .skill-img-text .title { font-size: 22px; } } .skill-section .skill-wrap .skill-img-wrap .skill-img-item .skill-img .skill-img-text .title a:hover { color: #005de0; } .skill-section .skill-wrap .skill-img-wrap .skill-img-item .skill-img .skill-img-text .skill-btn { font-size: 14px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #005de0; transition: all 0.3s linear; } .skill-section .skill-wrap .skill-img-wrap .skill-img-item .skill-img .skill-img-text .skill-btn i { position: relative; top: 1px; margin-left: 4px; transition: all 0.3s linear; } .skill-section .skill-wrap .skill-img-wrap .skill-img-item .skill-img .skill-img-text .skill-btn:hover { color: #ffffff; } .skill-section .skill-wrap .skill-img-wrap .skill-img-item .skill-img .skill-img-text .skill-btn:hover i { color: #ffffff; } .skill-section .skill-wrap .skill-img-wrap .skill-img-item .skill-img:hover { transform: translateY(-5px) translate3d(0, -5px, 0); } .skill-content-right { padding-left: 150px; } @media only screen and (max-width: 1199px) { .skill-content-right { padding-left: 80px; } } @media only screen and (max-width: 991px) { .skill-content-right { padding-left: 0; padding-top: 50px; } } .skill-content-right .title { font-size: 30px; line-height: 48px; } @media only screen and (max-width: 1199px) { .skill-content-right .title { font-size: 28px; } } @media only screen and (max-width: 767px) { .skill-content-right .title { font-size: 26px; } } .skill-bar-wrap .skill-item { margin-top: 30px; } .skill-bar-wrap .skill-item .skill-header { position: relative; } .skill-bar-wrap .skill-item .skill-header .skill-title { font-size: 14px; line-height: 24px; font-weight: 600; color: #120e1d; } .skill-bar-wrap .skill-item .skill-header .skill-percentage { position: absolute; top: 0; right: 0; } .skill-bar-wrap .skill-item .skill-header .skill-percentage span { font-size: 14px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 400; color: #120e1d; } .skill-bar-wrap .skill-item .bar-inner { width: 100%; height: 10px; border: 1px solid #d7d7d7; margin-top: 5px; position: relative; } .skill-bar-wrap .skill-item .bar-inner .progress-line { height: 6px; position: absolute; width: 0; top: 1px; left: 3px; background: #005de0; transition: 3s; transition-delay: 1s; } .skill-section-2 { padding-top: 350px; padding-bottom: 145px; } @media only screen and (max-width: 1199px) { .skill-section-2 { padding-top: 275px; padding-bottom: 100px; } } @media only screen and (max-width: 991px) { .skill-section-2 { padding-bottom: 80px; } } @media only screen and (max-width: 767px) { .skill-section-2 { padding-top: 255px; padding-bottom: 60px; } } .skill-section-2::before { background: #f2f2f2 url(../images/bg/skill-bg-2.jpg); width: 100%; background-repeat: no-repeat; background-size: contain; background-position: 100% 100%; } .skill-section-3 .skill-wrap .skill-content-wrap .skill-content-left .skill-img { position: relative; } .skill-section-3 .skill-wrap .skill-content-wrap .skill-content-left .skill-img img { width: 100%; border-radius: 10px; } .skill-section-3 .skill-wrap .skill-content-wrap .skill-content-left .skill-img .play-btn { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .skill-section-3 .skill-wrap .skill-content-wrap .skill-content-left .skill-img .play-btn a { width: 105px; height: 105px; line-height: 105px; font-size: 15px; display: inline-block; text-align: center; border-radius: 50%; background: #005de0; color: #ffffff; transition: all 0.3s linear; } @media only screen and (max-width: 767px) { .skill-section-3 .skill-wrap .skill-content-wrap .skill-content-left .skill-img .play-btn a { width: 85px; height: 85px; line-height: 85px; } } .skill-section-3 .skill-wrap .skill-content-wrap .skill-content-left .skill-img .play-btn a:hover { background: #ffffff; color: #005de0; } .skill-section-3 .skill-wrap .skill-content-wrap .skill-content-right { padding-left: 120px; padding-right: 90px; } @media only screen and (max-width: 1199px) { .skill-section-3 .skill-wrap .skill-content-wrap .skill-content-right { padding-left: 40px; padding-right: 0; } } @media only screen and (max-width: 991px) { .skill-section-3 .skill-wrap .skill-content-wrap .skill-content-right { padding-left: 0; } } .skill-section-3 .skill-wrap .skill-content-wrap .skill-content-right .section-title2 .title { font-size: 40px; line-height: 54px; font-weight: 700; } @media only screen and (max-width: 1199px) { .skill-section-3 .skill-wrap .skill-content-wrap .skill-content-right .section-title2 .title { font-size: 36px; line-height: 48px; } } @media only screen and (max-width: 767px) { .skill-section-3 .skill-wrap .skill-content-wrap .skill-content-right .section-title2 .title { font-size: 28px; line-height: 36px; } } .skill-section-4::before { background: #f2f2f2 url(../images/bg/skill-bg-2.jpg); width: 100%; background-repeat: no-repeat; background-size: contain; background-position: 100% 100%; } .skill-section-5::before { display: none; } .skill-section-5 .skill-img-wrap { padding-top: 0px; margin-top: -215px; margin-bottom: -30px; position: relative; z-index: 1; } @media only screen and (max-width: 1199px) { .skill-section-5 .skill-img-wrap { margin-top: -150px; } } .skill-section-5 .skill-img-wrap .skill-img-item { margin-top: 0px; margin-bottom: 30px; } .skill-section-5 .skill-img-wrap .skill-img-item .skill-img { overflow: hidden; border-radius: 5px; position: relative; transform: translate3d(0, 0, 0); transition: all 0.3s linear; z-index: 1; } .skill-section-5 .skill-img-wrap .skill-img-item .skill-img .image { display: block; position: relative; } .skill-section-5 .skill-img-wrap .skill-img-item .skill-img .image::before { content: ""; position: absolute; left: 0; top: 0; background: linear-gradient(180deg, #FFFFFF00 0%, #010f31 100%); width: 100%; height: 100%; opacity: 0.8; z-index: 0; } .skill-section-5 .skill-img-wrap .skill-img-item .skill-img .image img { border-radius: 5px; width: 100%; } .skill-section-5 .skill-img-wrap .skill-img-item .skill-img .skill-img-text { position: absolute; bottom: 45px; left: 0; right: 0; } .skill-section-5 .skill-img-wrap .skill-img-item .skill-img .skill-img-text .title { font-size: 24px; line-height: 30px; color: #ffffff; } @media only screen and (max-width: 767px) { .skill-section-5 .skill-img-wrap .skill-img-item .skill-img .skill-img-text .title { font-size: 22px; } } .skill-section-5 .skill-img-wrap .skill-img-item .skill-img .skill-img-text .title a:hover { color: #005de0; } .skill-section-5 .skill-img-wrap .skill-img-item .skill-img .skill-img-text .skill-btn { font-size: 14px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #005de0; transition: all 0.3s linear; } .skill-section-5 .skill-img-wrap .skill-img-item .skill-img .skill-img-text .skill-btn i { position: relative; top: 1px; margin-left: 4px; transition: all 0.3s linear; } .skill-section-5 .skill-img-wrap .skill-img-item .skill-img .skill-img-text .skill-btn:hover { color: #ffffff; } .skill-section-5 .skill-img-wrap .skill-img-item .skill-img .skill-img-text .skill-btn:hover i { color: #ffffff; } .skill-section-5 .skill-img-wrap .skill-img-item .skill-img:hover { transform: translateY(-5px) translate3d(0, -5px, 0); } /*-- /* 11 - Testimonial CSS /*----------------------------------------*/ .testimonial-section { background: #000c29; background-repeat: no-repeat; background-size: cover; background-position: center center; } @media only screen and (max-width: 1199px) { .testimonial-section .testimonial-wrap .section-title { text-align: center; } } .testimonial-section .testimonial-wrap .section-title .title { color: #ffffff; } .testimonial-section .testimonial-wrap .testimonial-slider-wrap { padding-left: 10px; } @media only screen and (max-width: 1199px) { .testimonial-section .testimonial-wrap .testimonial-slider-wrap { padding-left: 0; padding-top: 50px; } } .testimonial-section .testimonial-wrap .testimonial-slider-wrap .single-testimonial { background: #ffffff; padding: 50px; border-radius: 5px; position: relative; margin: 18px 0; } @media only screen and (max-width: 991px) { .testimonial-section .testimonial-wrap .testimonial-slider-wrap .single-testimonial { padding: 40px; } } @media only screen and (max-width: 575px) { .testimonial-section .testimonial-wrap .testimonial-slider-wrap .single-testimonial { padding: 35px; } } .testimonial-section .testimonial-wrap .testimonial-slider-wrap .single-testimonial::before { content: ""; position: absolute; left: 0; top: 0; background: rgba(255, 255, 255, 0.3); width: 100%; height: 100%; z-index: -1; transform: scaleY(1.1) scaleX(0.85); border-radius: 5px; } .testimonial-section .testimonial-wrap .testimonial-slider-wrap .single-testimonial::after { content: ""; position: absolute; left: 0; top: 0; background: rgba(255, 255, 255, 0.3); width: 100%; height: 100%; z-index: -1; transform: scaleY(1.05) scaleX(0.92); border-radius: 5px; } .testimonial-section .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content { max-width: 285px; } .testimonial-section .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .title { font-size: 22px; line-height: 30px; color: #005de0; } .testimonial-section .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content p { font-size: 18px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; text-decoration: underline; color: #000c29; margin-top: 15px; } .testimonial-section .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-author-wrap { display: flex; justify-content: space-between; margin-top: 40px; } .testimonial-section .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-author-wrap .testimonial-author { display: flex; align-items: center; } .testimonial-section .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-author-wrap .testimonial-author .author-img img { border-radius: 50%; } .testimonial-section .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-author-wrap .testimonial-author .author-text { flex: 1; margin-left: 20px; } .testimonial-section .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-author-wrap .testimonial-author .author-text .name { font-size: 16px; line-height: 20px; color: #231e32; } .testimonial-section .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-author-wrap .testimonial-author .author-text .designation { font-size: 12px; line-height: 20px; font-family: "Manrope", sans-serif; font-weight: 400; display: block; color: #005de0; } .testimonial-active .testimonial-arrow, .testimonial-4-active .testimonial-arrow { width: 45px; height: 45px; line-height: 45px; border-radius: 50%; transform: translateY(-30%); border: 1px solid #005de0; box-shadow: 0px 5px 57px 0px rgba(0, 0, 0, 0.15); color: #005de0; opacity: 0; visibility: hidden; transition: all 0.3s linear; } .testimonial-active .testimonial-arrow.swiper-button-prev, .testimonial-4-active .testimonial-arrow.swiper-button-prev { left: 0; } .testimonial-active .testimonial-arrow.swiper-button-prev::after, .testimonial-4-active .testimonial-arrow.swiper-button-prev::after { content: "\f16d"; font-family: flaticon !important; font-size: 18px; } .testimonial-active .testimonial-arrow.swiper-button-next, .testimonial-4-active .testimonial-arrow.swiper-button-next { right: 0; } .testimonial-active .testimonial-arrow.swiper-button-next::after, .testimonial-4-active .testimonial-arrow.swiper-button-next::after { content: "\f16e"; font-family: flaticon !important; font-size: 18px; } .testimonial-active .testimonial-arrow:hover, .testimonial-4-active .testimonial-arrow:hover { color: #ffffff; background: #005de0; } .testimonial-active:hover .testimonial-arrow, .testimonial-4-active:hover .testimonial-arrow { opacity: 1; visibility: visible; } .testimonial-active:hover .testimonial-arrow.swiper-button-prev, .testimonial-4-active:hover .testimonial-arrow.swiper-button-prev { left: 10px; } .testimonial-active:hover .testimonial-arrow.swiper-button-next, .testimonial-4-active:hover .testimonial-arrow.swiper-button-next { right: 10px; } .testimonial-section-2 { padding-bottom: 100px; } @media only screen and (max-width: 1199px) { .testimonial-section-2 { padding-bottom: 80px; } } @media only screen and (max-width: 991px) { .testimonial-section-2 { padding-bottom: 60px; } } @media only screen and (max-width: 767px) { .testimonial-section-2 { padding-bottom: 40px; } } .testimonial-section-2 .testimonial-2-wrap .testimonial-slider-wrap { max-width: 950px; margin: 0 auto; margin-top: 60px; } .testimonial-section-2 .testimonial-2-wrap .testimonial-slider-wrap .single-testimonial { display: flex; align-items: center; } @media only screen and (max-width: 767px) { .testimonial-section-2 .testimonial-2-wrap .testimonial-slider-wrap .single-testimonial { flex-direction: column; gap: 50px; } } .testimonial-section-2 .testimonial-2-wrap .testimonial-slider-wrap .single-testimonial .testimonial-image img { border-radius: 10px; } .testimonial-section-2 .testimonial-2-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content { flex: 1; margin-left: 90px; position: relative; } @media only screen and (max-width: 991px) { .testimonial-section-2 .testimonial-2-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content { margin-left: 60px; } } @media only screen and (max-width: 767px) { .testimonial-section-2 .testimonial-2-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content { margin-left: 30px; } } .testimonial-section-2 .testimonial-2-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content::before { content: ""; position: absolute; left: -30px; top: -30px; background-image: url(../images/testimonial/quote.png); width: 100%; height: 100%; background-repeat: no-repeat; } .testimonial-section-2 .testimonial-2-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content p { font-size: 30px; line-height: 48px; font-family: "Manrope", sans-serif; font-weight: 600; color: #000c29; } @media only screen and (max-width: 991px) { .testimonial-section-2 .testimonial-2-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content p { font-size: 28px; } } @media only screen and (max-width: 767px) { .testimonial-section-2 .testimonial-2-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content p { font-size: 25px; line-height: 44px; } } .testimonial-section-2 .testimonial-2-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .name { font-size: 16px; line-height: 20px; font-family: "Manrope", sans-serif; font-weight: 700; display: block; color: #231e32; margin-top: 30px; } .testimonial-section-2 .testimonial-2-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .designation { font-size: 12px; line-height: 20px; font-family: "Manrope", sans-serif; font-weight: 400; display: block; color: #5149f3; } .testimonial-2-active .swiper-pagination { margin-top: 50px; } .testimonial-section-3 { background: #fbfaff; } .testimonial-section-3 .testimonial-wrap-3 { margin-bottom: -20px; } .testimonial-section-3 .testimonial-wrap-3 .testimonial-slider-wrap { max-width: 1070px; margin: 0 auto; padding-top: 35px; } .testimonial-section-3 .testimonial-wrap-3 .testimonial-slider-wrap .single-testimonial { display: flex; background: #ffffff; padding: 60px 110px 60px 75px; border-radius: 10px; margin: 15px 0; position: relative; } @media only screen and (max-width: 1199px) { .testimonial-section-3 .testimonial-wrap-3 .testimonial-slider-wrap .single-testimonial { padding: 60px 50px 60px 50px; } } @media only screen and (max-width: 767px) { .testimonial-section-3 .testimonial-wrap-3 .testimonial-slider-wrap .single-testimonial { flex-direction: column; gap: 30px; } } @media only screen and (max-width: 575px) { .testimonial-section-3 .testimonial-wrap-3 .testimonial-slider-wrap .single-testimonial { padding: 45px; } } .testimonial-section-3 .testimonial-wrap-3 .testimonial-slider-wrap .single-testimonial::before { content: ""; position: absolute; left: 50%; bottom: -7px; background: #ff5538; transform: translateX(-50%); width: calc(100% - 45px); height: 100%; z-index: -1; } @media only screen and (max-width: 767px) { .testimonial-section-3 .testimonial-wrap-3 .testimonial-slider-wrap .single-testimonial .testimonial-img { text-align: center; } } .testimonial-section-3 .testimonial-wrap-3 .testimonial-slider-wrap .single-testimonial .testimonial-img img { border-radius: 50%; } .testimonial-section-3 .testimonial-wrap-3 .testimonial-slider-wrap .single-testimonial .testimonial-content { flex: 1; margin-left: 50px; } @media only screen and (max-width: 767px) { .testimonial-section-3 .testimonial-wrap-3 .testimonial-slider-wrap .single-testimonial .testimonial-content { margin-left: 0; } } .testimonial-section-3 .testimonial-wrap-3 .testimonial-slider-wrap .single-testimonial .testimonial-content p { font-size: 30px; line-height: 44px; font-family: "Manrope", sans-serif; font-weight: 400; } @media only screen and (max-width: 1199px) { .testimonial-section-3 .testimonial-wrap-3 .testimonial-slider-wrap .single-testimonial .testimonial-content p { font-size: 28px; } } @media only screen and (max-width: 767px) { .testimonial-section-3 .testimonial-wrap-3 .testimonial-slider-wrap .single-testimonial .testimonial-content p { font-size: 26px; } } .testimonial-section-3 .testimonial-wrap-3 .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-author { display: flex; margin-top: 30px; } .testimonial-section-3 .testimonial-wrap-3 .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-author .author-text .name { font-size: 16px; line-height: 20px; color: #231e32; } .testimonial-section-3 .testimonial-wrap-3 .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-author .author-text .designation { font-size: 16px; font-family: "Manrope", sans-serif; font-weight: 400; line-height: 20px; color: #ff5538; } .testimonial-section-3 .testimonial-wrap-3 .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-author .testimonial-quote { margin-left: 50px; } @media only screen and (max-width: 575px) { .testimonial-section-3 .testimonial-wrap-3 .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-author .testimonial-quote { margin-left: 24px; } } .testimonial-3-active.slider-bullet .swiper-pagination { margin-top: 50px; } .testimonial-3-active.slider-bullet .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background: #ff5538; } .testimonial-section-4 { padding-bottom: 0; } .testimonial-section-4 .testimonial-2-wrap { margin-bottom: -20px; } .testimonial-section-5 { padding-bottom: 120px; } @media only screen and (max-width: 1199px) { .testimonial-section-5 { padding-bottom: 100px; } } @media only screen and (max-width: 991px) { .testimonial-section-5 { padding-bottom: 80px; } } @media only screen and (max-width: 767px) { .testimonial-section-5 { padding-bottom: 60px; } } .testimonial-section-6 { padding-top: 100px; overflow: hidden; } @media only screen and (max-width: 1399px) { .testimonial-section-6 { padding-bottom: 100px; } } @media only screen and (max-width: 991px) { .testimonial-section-6 { padding-top: 80px; padding-bottom: 80px; } } @media only screen and (max-width: 767px) { .testimonial-section-6 { padding-top: 60px; padding-bottom: 60px; } } .testimonial-section-6 .testimonial-wrap { margin-bottom: -80px; } @media only screen and (max-width: 1399px) { .testimonial-section-6 .testimonial-wrap { margin-bottom: 0; } } .testimonial-section-6 .testimonial-wrap .testimonial-img { padding-left: 25px; padding-right: 50px; position: relative; z-index: 1; } @media only screen and (max-width: 1199px) { .testimonial-section-6 .testimonial-wrap .testimonial-img { padding-left: 0; padding-right: 0; text-align: center; } } @media only screen and (max-width: 991px) { .testimonial-section-6 .testimonial-wrap .testimonial-img img { width: 80%; } } @media only screen and (max-width: 575px) { .testimonial-section-6 .testimonial-wrap .testimonial-img img { width: 100%; } } .testimonial-section-6 .testimonial-wrap .testimonial-img::before { content: ""; position: absolute; left: 0; top: 0; width: 430px; height: 430px; background: linear-gradient(-90deg, #54d6eb 0%, #035cdd 100%); border-radius: 50%; transform: translate(80px, 80px); z-index: -1; } @media only screen and (max-width: 1199px) { .testimonial-section-6 .testimonial-wrap .testimonial-img::before { transform: translate(235px, 80px); } } @media only screen and (max-width: 991px) { .testimonial-section-6 .testimonial-wrap .testimonial-img::before { transform: translate(110px, 80px); } } @media only screen and (max-width: 767px) { .testimonial-section-6 .testimonial-wrap .testimonial-img::before { width: 310px; height: 310px; transform: translate(90px, 80px); } } @media only screen and (max-width: 575px) { .testimonial-section-6 .testimonial-wrap .testimonial-img::before { transform: translate(50px, 80px); } } .testimonial-section-6 .testimonial-wrap .testimonial-img::after { content: ""; position: absolute; left: 0; top: 0; width: 430px; height: 430px; background: linear-gradient(-90deg, #54d6eb 0%, #035cdd 100%); opacity: 0.4; border-radius: 50%; transform: translate(80px, 80px) scale(1.23); z-index: -1; } @media only screen and (max-width: 1199px) { .testimonial-section-6 .testimonial-wrap .testimonial-img::after { transform: translate(235px, 80px) scale(1.23); } } @media only screen and (max-width: 991px) { .testimonial-section-6 .testimonial-wrap .testimonial-img::after { transform: translate(110px, 80px) scale(1.23); } } @media only screen and (max-width: 767px) { .testimonial-section-6 .testimonial-wrap .testimonial-img::after { width: 310px; height: 310px; transform: translate(90px, 80px) scale(1.23); } } @media only screen and (max-width: 575px) { .testimonial-section-6 .testimonial-wrap .testimonial-img::after { transform: translate(50px, 80px) scale(1.23); } } .testimonial-section-6 .testimonial-wrap .testimonial-content-wrap { padding-top: 35px; } @media only screen and (max-width: 1199px) { .testimonial-section-6 .testimonial-wrap .testimonial-content-wrap { padding-top: 60px; } } .testimonial-section-6 .testimonial-wrap .testimonial-content-wrap .section-title .title span { color: #005de0; } .testimonial-section-6 .testimonial-wrap .testimonial-content-wrap .testimonial-slider-wrap { background: #ffffff; box-shadow: 0px 0px 111px 0px rgba(0, 0, 0, 0.15); padding: 35px 42px 50px; border-bottom: 7px solid #005de0; border-radius: 10px; margin-top: 50px; } @media only screen and (max-width: 1199px) { .testimonial-section-6 .testimonial-wrap .testimonial-content-wrap .testimonial-slider-wrap .single-testimonial { padding: 0 80px; } } @media only screen and (max-width: 767px) { .testimonial-section-6 .testimonial-wrap .testimonial-content-wrap .testimonial-slider-wrap .single-testimonial { padding: 0 0; } } .testimonial-section-6 .testimonial-wrap .testimonial-content-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content p { font-size: 26px; line-height: 44px; font-family: "Manrope", sans-serif; font-weight: 400; color: #4c4d56; margin-top: 30px; } @media only screen and (max-width: 1399px) { .testimonial-section-6 .testimonial-wrap .testimonial-content-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content p { font-size: 24px; } } .testimonial-section-6 .testimonial-wrap .testimonial-content-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-author { margin-top: 50px; } .testimonial-section-6 .testimonial-wrap .testimonial-content-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-author .name { font-size: 16px; line-height: 20px; color: #231e32; } .testimonial-section-6 .testimonial-wrap .testimonial-content-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-author .designation { font-size: 12px; line-height: 20px; font-family: "Manrope", sans-serif; font-weight: 400; color: #005de0; } .testimonial-section-7 .testimonial-wrap { background-position: 100% 150%; background-size: contain; background-repeat: no-repeat; } .testimonial-section-7 .testimonial-wrap .testimonial-slider-wrap { padding-top: 20px; } @media only screen and (max-width: 991px) { .testimonial-section-7 .testimonial-wrap .testimonial-slider-wrap { padding-top: 0; } } .testimonial-section-7 .testimonial-wrap .testimonial-slider-wrap .single-testimonial { background: #ffffff; box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.11); border-radius: 10px; margin-top: 50px; margin-bottom: 10px; margin-left: 5px; margin-right: 5px; } .testimonial-section-7 .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content { padding: 50px 85px 60px 50px; } @media only screen and (max-width: 1199px) { .testimonial-section-7 .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content { padding: 50px 40px; } } .testimonial-section-7 .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-quote { height: 75px; width: 75px; line-height: 75px; font-size: 45px; text-align: center; border-radius: 50%; color: #005de0; background: #ccdef7; } .testimonial-section-7 .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content p { font-size: 18px; line-height: 32px; font-family: "Manrope", sans-serif; font-weight: 400; color: #000c29; margin-top: 10px; } .testimonial-section-7 .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-author { display: flex; align-items: center; margin-top: 20px; } .testimonial-section-7 .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-author .author-thumb img { border-radius: 50%; } .testimonial-section-7 .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-author .author-text { margin-left: 25px; } .testimonial-section-7 .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-author .author-text .name { display: block; font-size: 16px; line-height: 20px; font-family: "Manrope", sans-serif; font-weight: 700; color: #231e32; } .testimonial-section-7 .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-author .author-text .designation { display: block; font-size: 12px; line-height: 20px; font-family: "Manrope", sans-serif; font-weight: 400; color: #005de0; } .testimonial-section-7 .testimonial-wrap .testimonial-slider-wrap .swiper-slide.swiper-slide-active .single-testimonial { background: linear-gradient(130deg, #54d6eb 0%, #035cdd 100%); } @media only screen and (max-width: 991px) { .testimonial-section-7 .testimonial-wrap .testimonial-slider-wrap .swiper-slide.swiper-slide-active .single-testimonial { background: #ffffff; } } .testimonial-section-7 .testimonial-wrap .testimonial-slider-wrap .swiper-slide.swiper-slide-active .single-testimonial .testimonial-content .testimonial-quote { color: #ffffff; background: #6fd4ee; } @media only screen and (max-width: 991px) { .testimonial-section-7 .testimonial-wrap .testimonial-slider-wrap .swiper-slide.swiper-slide-active .single-testimonial .testimonial-content .testimonial-quote { background: #ccdef7; color: #005de0; } } .testimonial-section-7 .testimonial-wrap .testimonial-slider-wrap .swiper-slide.swiper-slide-active .single-testimonial .testimonial-content p { color: #ffffff; } @media only screen and (max-width: 991px) { .testimonial-section-7 .testimonial-wrap .testimonial-slider-wrap .swiper-slide.swiper-slide-active .single-testimonial .testimonial-content p { color: #000c29; } } .testimonial-section-7 .testimonial-wrap .testimonial-slider-wrap .swiper-slide.swiper-slide-active .single-testimonial .testimonial-content .testimonial-author .author-text .name { color: #ffffff; } @media only screen and (max-width: 991px) { .testimonial-section-7 .testimonial-wrap .testimonial-slider-wrap .swiper-slide.swiper-slide-active .single-testimonial .testimonial-content .testimonial-author .author-text .name { color: #000c29; } } .testimonial-section-7 .testimonial-wrap .testimonial-slider-wrap .swiper-slide.swiper-slide-active .single-testimonial .testimonial-content .testimonial-author .author-text .designation { color: #ffffff; } @media only screen and (max-width: 991px) { .testimonial-section-7 .testimonial-wrap .testimonial-slider-wrap .swiper-slide.swiper-slide-active .single-testimonial .testimonial-content .testimonial-author .author-text .designation { color: #005de0; } } .testimonial-section-8 { border-bottom: 1px solid #ebebeb; } @media only screen and (max-width: 1199px) { .testimonial-section-8 .testimonial-wrap .section-title { text-align: center; } } .testimonial-section-8 .testimonial-wrap .testimonial-slider-wrap { max-width: 640px; margin-left: auto; } @media only screen and (max-width: 1199px) { .testimonial-section-8 .testimonial-wrap .testimonial-slider-wrap { margin: 0 auto; padding-top: 50px; } } .testimonial-section-8 .testimonial-wrap .testimonial-slider-wrap .single-testimonial { display: flex; } @media only screen and (max-width: 575px) { .testimonial-section-8 .testimonial-wrap .testimonial-slider-wrap .single-testimonial { flex-direction: column; gap: 20px; } } @media only screen and (max-width: 767px) { .testimonial-section-8 .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-quote img { width: 120px; } } .testimonial-section-8 .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content { flex: 1; padding-left: 50px; } @media only screen and (max-width: 575px) { .testimonial-section-8 .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content { padding-left: 0; } } .testimonial-section-8 .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content p { font-size: 20px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #000c29; } .testimonial-section-8 .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-author { display: flex; align-items: center; margin-top: 25px; } .testimonial-section-8 .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-author .author-img img { border-radius: 50%; } .testimonial-section-8 .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-author .author-text { flex: 1; margin-left: 20px; } .testimonial-section-8 .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-author .author-text .name { font-size: 16px; line-height: 20px; color: #231e32; } .testimonial-section-8 .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .testimonial-author .author-text .designation { font-size: 12px; line-height: 20px; font-family: "Manrope", sans-serif; font-weight: 400; display: block; color: #005de0; } .testimonial-inner-1 .testimonial-wrap-3 .testimonial-slider-wrap { padding-top: 0; } .testimonial-inner-2 .testimonial-2-wrap .testimonial-slider-wrap { margin-top: 0; } .testimonial-section-9 { background-repeat: no-repeat; background-size: cover; background-position: center center; } .testimonial-section-9 .testimonial-2-wrap .section-title2 .title { color: #051441; } .testimonial-section-9 .testimonial-2-wrap .section-title2 .title span { color: #6754e2; } @media only screen and (max-width: 991px) { .testimonial-section-9 .testimonial-2-wrap .testimonial-slider-wrap .single-testimonial { flex-direction: column; gap: 50px; } } .testimonial-section-9 .testimonial-2-wrap .testimonial-slider-wrap .single-testimonial .testimonial-image img { border-radius: 10px; } .testimonial-section-9 .testimonial-2-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content { margin-left: 0; background: #ffffff; padding: 40px 45px 35px 90px; border-top-right-radius: 15px; border-bottom-right-radius: 15px; } @media only screen and (max-width: 991px) { .testimonial-section-9 .testimonial-2-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content { border-top-left-radius: 15px; border-bottom-left-radius: 15px; } } @media only screen and (max-width: 449px) { .testimonial-section-9 .testimonial-2-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content { padding: 40px 45px 35px 45px; } } .testimonial-section-9 .testimonial-2-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content::before { left: 65px; top: 15px; } @media only screen and (max-width: 449px) { .testimonial-section-9 .testimonial-2-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content::before { left: 30px; } } .testimonial-section-9 .testimonial-2-active .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #6754e2; } .testimonial-section-10 .testimonial-wrap { background-position: center center; background-size: contain; background-repeat: no-repeat; } .testimonial-section-10 .testimonial-wrap .testimonial-img { padding-left: 20px; } @media only screen and (max-width: 1199px) { .testimonial-section-10 .testimonial-wrap .testimonial-img { padding-left: 0; } } @media only screen and (max-width: 1199px) { .testimonial-section-10 .testimonial-wrap .testimonial-slider-wrap { margin-top: 60px; } } .testimonial-section-10 .testimonial-wrap .testimonial-slider-wrap .section-title2 .title { line-height: 60px; } @media only screen and (max-width: 767px) { .testimonial-section-10 .testimonial-wrap .testimonial-slider-wrap .section-title2 .title { line-height: 40px; } } .testimonial-section-10 .testimonial-wrap .testimonial-slider-wrap .single-testimonial { margin-top: 50px; } .testimonial-section-10 .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content p { font-size: 30px; line-height: 48px; font-family: "Manrope", sans-serif; font-weight: 600; color: #000c29; } @media only screen and (max-width: 575px) { .testimonial-section-10 .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content p { font-size: 26px; line-height: 45px; } } .testimonial-section-10 .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .author-text { margin-top: 30px; } .testimonial-section-10 .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .author-text .name { font-size: 16px; line-height: 20px; color: #231e32; } .testimonial-section-10 .testimonial-wrap .testimonial-slider-wrap .single-testimonial .testimonial-content .author-text .designation { font-size: 12px; line-height: 20px; font-family: "Manrope", sans-serif; font-weight: 400; display: block; color: #005de0; } .testimonial-section-10 .testimonial-8-active.slider-bullet .swiper-pagination { text-align: left; margin-top: 30px; } .testimonial-section-10 .testimonial-8-active.slider-bullet .swiper-pagination .swiper-pagination-bullet { margin: 0 6px; } .testimonial-section-10 .testimonial-8-active.slider-bullet .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background: #005de0; } /*-- /* 08. Case Study CSS /*----------------------------------------*/ .case-study-section { overflow: hidden; } .case-study-wrap { margin-top: -10px; } .case-study-slider-wrap { margin-top: 90px; } @media only screen and (max-width: 991px) { .case-study-slider-wrap { margin-top: 60px; } } .case-study-slider-wrap .single-case-study { display: flex; align-items: end; max-width: 1070px; height: 550px; border-radius: 5px; background-repeat: no-repeat; background-size: cover; background-position: center center; margin: 0 auto; overflow: hidden; position: relative; z-index: 1; } .case-study-slider-wrap .single-case-study::before { content: ""; position: absolute; left: 0; top: 0; background: linear-gradient(180deg, #FFFFFF00 0%, #010f31 100%); width: 100%; height: 100%; opacity: 0.7; z-index: -1; } .case-study-slider-wrap .single-case-study::after { content: ""; position: absolute; left: 0; top: 0; background: rgba(0, 0, 0, 0.5); width: 100%; height: 100%; z-index: -1; } @media only screen and (max-width: 991px) { .case-study-slider-wrap .single-case-study { height: 450px; } } .case-study-slider-wrap .single-case-study .case-study-content { display: flex; justify-content: space-between; text-align: left; padding: 90px; gap: 50px; display: none; } @media only screen and (min-width: 1400px) and (max-width: 1599px) { .case-study-slider-wrap .single-case-study .case-study-content { padding: 40px; } } @media only screen and (max-width: 1399px) { .case-study-slider-wrap .single-case-study .case-study-content { flex-direction: column; gap: 30px; padding: 50px; } } .case-study-slider-wrap .single-case-study .case-study-content .case-study-title { flex-shrink: 0; } .case-study-slider-wrap .single-case-study .case-study-content .case-study-title .title { font-size: 30px; line-height: 30px; color: #ffffff; } @media only screen and (max-width: 767px) { .case-study-slider-wrap .single-case-study .case-study-content .case-study-title .title { font-size: 22px; } } .case-study-slider-wrap .single-case-study .case-study-content .case-study-title span { font-size: 18px; line-height: 30px; font-family: "Manrope", sans-serif; font-family: 400; color: #005de0; } @media only screen and (max-width: 767px) { .case-study-slider-wrap .single-case-study .case-study-content .case-study-title span { font-size: 18px; } } .case-study-slider-wrap .single-case-study .case-study-content .case-study-text { flex-grow: 1; } .case-study-slider-wrap .single-case-study .case-study-content .case-study-text p { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-family: 400; color: #ffffff; } .case-study-slider-wrap .single-case-study .case-study-content .case-study-link { text-align: right; flex-grow: 1; } @media only screen and (max-width: 1399px) { .case-study-slider-wrap .single-case-study .case-study-content .case-study-link { text-align: left; } } .case-study-slider-wrap .single-case-study .case-study-content .case-study-link a { width: 50px; height: 50px; line-height: 50px; font-size: 15px; border-radius: 50%; text-align: center; display: inline-block; background: #005de0; color: #ffffff; transition: all 0.3s linear; } .case-study-slider-wrap .single-case-study .case-study-content .case-study-link a:hover { background: #ffffff; color: #005de0; } .case-study-slider-wrap .swiper-slide.swiper-slide-active .single-case-study .case-study-content { display: flex; } .case-study-btn { margin-top: 60px; } .case-study-btn .btn { font-size: 14px; padding: 0 35px; height: 50px; line-height: 46px; } .case-study-active .case-study-arrow { width: 60px; height: 60px; line-height: 60px; border-radius: 50%; transform: translateY(-50%); background: #ffffff; box-shadow: 0px 5px 57px 0px rgba(0, 0, 0, 0.15); color: #005de0; opacity: 0; visibility: hidden; transition: all 0.3s linear; } @media only screen and (max-width: 991px) { .case-study-active .case-study-arrow { width: 50px; height: 50px; line-height: 50px; } } .case-study-active .case-study-arrow.swiper-button-prev { left: 20%; } .case-study-active .case-study-arrow.swiper-button-prev::after { content: "\f16d"; font-family: flaticon !important; font-size: 20px; } .case-study-active .case-study-arrow.swiper-button-next { right: 20%; } .case-study-active .case-study-arrow.swiper-button-next::after { content: "\f16e"; font-family: flaticon !important; font-size: 20px; } .case-study-active .case-study-arrow:hover { color: #ffffff; background: #005de0; } .case-study-active:hover .case-study-arrow { opacity: 1; visibility: visible; } .case-study-active:hover .case-study-arrow.swiper-button-prev { left: 23%; } @media only screen and (max-width: 1199px) { .case-study-active:hover .case-study-arrow.swiper-button-prev { left: 22%; } } @media only screen and (max-width: 991px) { .case-study-active:hover .case-study-arrow.swiper-button-prev { left: 30px; } } .case-study-active:hover .case-study-arrow.swiper-button-next { right: 23%; } @media only screen and (max-width: 1199px) { .case-study-active:hover .case-study-arrow.swiper-button-next { right: 22%; } } @media only screen and (max-width: 991px) { .case-study-active:hover .case-study-arrow.swiper-button-next { right: 30px; } } .case-study-section-2 { background: #fbfbfc; background-repeat: no-repeat; background-size: cover; background-position: center bottom; } .case-study-section-2 .case-study-wrap .case-study-content-wrap { padding-top: 35px; } @media only screen and (max-width: 991px) { .case-study-section-2 .case-study-wrap .case-study-content-wrap { padding-top: 10px; } } .case-study-section-2 .case-study-wrap .case-study-content-wrap .case-study-item { background: #ffffff; box-shadow: 0px 0px 131px 0px rgba(0, 0, 0, 0.09); border-radius: 10px; margin-top: 30px; } .case-study-section-2 .case-study-wrap .case-study-content-wrap .case-study-item .case-study-img { padding: 30px; } @media only screen and (max-width: 1199px) { .case-study-section-2 .case-study-wrap .case-study-content-wrap .case-study-item .case-study-img { padding: 25px; } } .case-study-section-2 .case-study-wrap .case-study-content-wrap .case-study-item .case-study-img a { display: block; } .case-study-section-2 .case-study-wrap .case-study-content-wrap .case-study-item .case-study-img a img { width: 100%; border-radius: 10px; } .case-study-section-2 .case-study-wrap .case-study-content-wrap .case-study-item .case-study-content { padding: 0 30px 35px; margin-top: -10px; } @media only screen and (max-width: 1199px) { .case-study-section-2 .case-study-wrap .case-study-content-wrap .case-study-item .case-study-content { padding: 0 25px 30px; } } .case-study-section-2 .case-study-wrap .case-study-content-wrap .case-study-item .case-study-content .title { font-size: 24px; line-height: 30px; color: #3e3e3e; } .case-study-section-2 .case-study-wrap .case-study-content-wrap .case-study-item .case-study-content span { font-size: 18px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #005de0; } .case-study-section-3 .section-title2 { max-width: 550px; } .case-study-section-3 .section-title2 .title { font-weight: 700; } .case-study-section-3 .section-title2 .sub-title { letter-spacing: 1px; } .case-study-section-3 .case-study-slider-wrap .single-case-study::before { content: ""; position: absolute; left: 0; top: 0; background: rgba(33, 23, 98, 0.7); width: 100%; height: 100%; opacity: 0; visibility: hidden; } .case-study-section-3 .case-study-slider-wrap .single-case-study::after { display: none; } .case-study-section-3 .case-study-slider-wrap .single-case-study .case-study-text { max-width: 310px; position: absolute; left: 110px; bottom: 70px; background: #ffffff; position: relative; padding: 30px 65px 35px 55px; } .case-study-section-3 .case-study-slider-wrap .single-case-study .case-study-text::before { content: ""; position: absolute; left: 0; top: 40px; background: #005de0; width: 20px; height: 70px; } .case-study-section-3 .case-study-slider-wrap .single-case-study .case-study-text .title { font-size: 20px; line-height: 30px; color: #333333; } .case-study-section-3 .case-study-slider-wrap .single-case-study .case-study-text p { font-size: 14px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 400; color: "Roboto", sans-serif; } .case-study-section-3 .case-study-slider-wrap .single-case-study .case-study-text .learn-more { font-size: 12px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 600; color: #333333; margin-top: 5px; } .case-study-section-3 .case-study-slider-wrap .single-case-study .case-study-text .learn-more i { color: #005de0; } .case-study-section-3 .case-study-slider-wrap .single-case-study .case-study-text .learn-more:hover { color: #005de0; } .case-study-section-3 .case-study-slider-wrap .swiper-slide.swiper-slide-active .single-case-study::before { opacity: 1; visibility: visible; } @media only screen and (max-width: 449px) { .case-study-section-3 .case-study-slider-wrap .single-case-study .case-study-text { max-width: 290px; left: 28px; padding: 30px 50px 35px 55px; } } .case-study-section-04 { padding-bottom: 130px; } .case-study-section-04 .section-title .title { color: #051441; } .case-study-section-04 .single-item { margin-top: 40px; } .case-study-section-04 .single-item .case-study-img { overflow: hidden; border-radius: 15px; } .case-study-section-04 .single-item .case-study-img a { display: block; } .case-study-section-04 .single-item .case-study-img a img { width: 100%; } .case-study-section-04 .single-item .case-study-content { margin-top: 40px; } .case-study-section-04 .single-item .case-study-content .sub-title { font-size: 12px; line-height: 24px; text-transform: uppercase; font-family: "Manrope", sans-serif; font-weight: 700; color: #959595; } .case-study-section-04 .single-item .case-study-content .title { font-size: 22px; line-height: 36px; color: #051441; } .case-study-section-04 .single-item .case-study-content .title:hover a { color: #6754e2; } .case-study-section-04 .single-item:hover .case-study-img a img { transform: scale(1.05); } .case-study-section-5 { background: #ffffff; } .case-study-section-5 .section-title { max-width: 750px; } /*-- /* 14 - CTA CSS /*----------------------------------------*/ .cta-section .cta-wrap { background: #005de0; background-repeat: no-repeat; background-size: cover; background-position: center center; border-radius: 5px; padding: 75px 125px 80px 110px; margin-bottom: -110px; position: relative; z-index: 5; } .cta-section .cta-wrap .cta-left .title { font-size: 36px; line-height: 44px; color: #ffffff; } .cta-section .cta-wrap .cta-right { text-align: right; } .cta-section .cta-wrap .cta-right .number { font-size: 22px; font-family: "Manrope", sans-serif; font-weight: 700; color: #ffffff; } .cta-section .cta-wrap .cta-right .btn { padding: 0 35px; margin-left: 20px; } @media only screen and (max-width: 1199px) { .cta-section .cta-wrap { padding: 80px 55px; } .cta-section .cta-wrap .cta-left .title { font-size: 30px; } .cta-section .cta-wrap .cta-right .btn { margin-left: 15px; } } @media only screen and (max-width: 991px) { .cta-section .cta-wrap .cta-left { text-align: center; } .cta-section .cta-wrap .cta-right { text-align: center; margin-top: 40px; } } @media only screen and (max-width: 575px) { .cta-section .cta-wrap .cta-left .title { font-size: 30px; } .cta-section .cta-wrap .cta-right .number { display: block; margin-bottom: 10px; } .cta-section .cta-wrap .cta-right .btn { margin-left: 0px; } } .cta-section-2 { background-image: linear-gradient(-48deg, #54d6eb 0%, #035cdd 100%); background-repeat: no-repeat; background-size: cover; background-position: center center; padding-top: 240px; padding-bottom: 90px; } @media only screen and (max-width: 991px) { .cta-section-2 { padding-top: 220px; padding-bottom: 70px; } } @media only screen and (max-width: 991px) { .cta-section-2 .cta-wrap-2 .cta-content { text-align: center; } } .cta-section-2 .cta-wrap-2 .cta-content .title { font-size: 36px; line-height: 48px; color: #ffffff; } @media only screen and (max-width: 767px) { .cta-section-2 .cta-wrap-2 .cta-content .title { font-size: 30px; } } .cta-section-2 .cta-wrap-2 .cta-btn { text-align: right; } @media only screen and (max-width: 1199px) { .cta-section-2 .cta-wrap-2 .cta-btn { text-align: center; } } @media only screen and (max-width: 991px) { .cta-section-2 .cta-wrap-2 .cta-btn { margin-top: 35px; } } .cta-section-2 .cta-wrap-2 .cta-btn .btn { padding: 0 45px; margin-right: 15px; } @media only screen and (max-width: 1199px) { .cta-section-2 .cta-wrap-2 .cta-btn .btn { padding: 0 35px; font-size: 16px; } } @media only screen and (max-width: 991px) { .cta-section-2 .cta-wrap-2 .cta-btn .btn { margin-top: 15px; } } .cta-section-2 .cta-wrap-2 .cta-btn .btn-white { color: #005de0; margin-right: 0; } .cta-section-2 .cta-wrap-2 .cta-btn .btn-white:hover { color: #ffffff; } .cta-section-3 { background: #0b0820; padding-bottom: 130px; background-repeat: no-repeat; background-size: cover; background-position: center center; } @media only screen and (max-width: 1199px) { .cta-section-3 { padding-bottom: 100px; } } @media only screen and (max-width: 991px) { .cta-section-3 { padding-bottom: 80px; } } @media only screen and (max-width: 767px) { .cta-section-3 { padding-bottom: 60px; } } .cta-section-3 .cta-wrap-3 { margin-top: -10px; } .cta-section-3 .cta-wrap-3 .cta-content .title { font-size: 60px; line-height: 72px; color: #ffffff; } @media only screen and (max-width: 1399px) { .cta-section-3 .cta-wrap-3 .cta-content .title { font-size: 50px; line-height: 60px; } } @media only screen and (max-width: 1199px) { .cta-section-3 .cta-wrap-3 .cta-content .title { font-size: 45px; line-height: 55px; } } @media only screen and (max-width: 767px) { .cta-section-3 .cta-wrap-3 .cta-content .title { font-size: 28px; line-height: 36px; } } .cta-section-3 .cta-wrap-3 .cta-content p { font-size: 16px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 600; color: #ffffff; margin-top: 35px; } @media only screen and (max-width: 767px) { .cta-section-3 .cta-wrap-3 .cta-content p { font-size: 15px; margin-top: 25px; } } .cta-section-3 .cta-wrap-3 .cta-content p a { font-weight: 700; color: #005de0; text-decoration: underline; } .cta-section-4 { background-position: center center; background-size: cover; background-repeat: no-repeat; background: #09091d; padding-bottom: 100px; } @media only screen and (max-width: 991px) { .cta-section-4 { padding-bottom: 80px; } } @media only screen and (max-width: 767px) { .cta-section-4 { padding-bottom: 60px; } } .cta-section-4 .cta-wrap .cta-left { display: flex; padding-right: 65px; } @media only screen and (max-width: 1399px) { .cta-section-4 .cta-wrap .cta-left { padding-right: 0; } } @media only screen and (max-width: 575px) { .cta-section-4 .cta-wrap .cta-left { display: block; text-align: center; } } .cta-section-4 .cta-wrap .cta-left .title { font-size: 36px; line-height: 44px; color: #ffffff; margin-left: 40px; } @media only screen and (max-width: 1199px) { .cta-section-4 .cta-wrap .cta-left .title { font-size: 32px; margin-left: 30px; } } @media only screen and (max-width: 767px) { .cta-section-4 .cta-wrap .cta-left .title { font-size: 28px; line-height: 40px; } } @media only screen and (max-width: 575px) { .cta-section-4 .cta-wrap .cta-left .title { margin-left: 0; margin-top: 20px; } } @media only screen and (max-width: 991px) { .cta-section-4 .cta-wrap .cta-right { margin-top: 40px; } } .cta-section-4 .cta-wrap .cta-right .title { font-size: 22px; color: #ffffff; } .cta-section-4 .cta-wrap .cta-right .btn { margin-top: 10px; } .cta-section-5 .cta-wrap { max-width: 1070px; margin: 0 auto; background: #110d1b; background-repeat: no-repeat; background-size: cover; background-position: center center; border-radius: 5px; padding: 45px 125px 45px 80px; margin-bottom: -10px; position: relative; z-index: 5; } .cta-section-5 .cta-wrap .cta-left .title { font-size: 30px; line-height: 36px; color: #ffffff; padding-right: 140px; } .cta-section-5 .cta-wrap .cta-right { display: flex; } .cta-section-5 .cta-wrap .cta-right .cta-icon span { display: inline-block; width: 65px; height: 65px; line-height: 65px; font-size: 20px; text-align: center; background: #ffffff; border-radius: 50%; position: relative; color: #005de0; } .cta-section-5 .cta-wrap .cta-right .cta-icon span::before { content: ""; position: absolute; left: 50%; top: 50%; background: #292632; width: 84px; height: 84px; border-radius: 50%; transform: translate(-50%, -51%); z-index: -1; } .cta-section-5 .cta-wrap .cta-right .cta-content { flex: 1; text-align: left; margin-left: 55px; } .cta-section-5 .cta-wrap .cta-right .cta-content .text { font-size: 16px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 700; color: #ffffff; } .cta-section-5 .cta-wrap .cta-right .cta-content .number { font-size: 24px; line-height: 36px; font-family: "Manrope", sans-serif; font-weight: 700; color: #ffffff; } @media only screen and (max-width: 1199px) { .cta-section-5 .cta-wrap .cta-left .title { padding-right: 40px; } } @media only screen and (max-width: 991px) { .cta-section-5 .cta-wrap { padding: 45px 45px 45px 55px; } .cta-section-5 .cta-wrap .cta-left .title { padding-right: 0px; } .cta-section-5 .cta-wrap .cta-right .cta-content { margin-left: 40px; } } @media only screen and (max-width: 767px) { .cta-section-5 .cta-wrap .cta-right { margin-top: 40px; } } @media only screen and (max-width: 449px) { .cta-section-5 .cta-wrap { padding: 45px 50px 45px 50px; margin-bottom: 0; } .cta-section-5 .cta-wrap .cta-left { text-align: center; } .cta-section-5 .cta-wrap .cta-right { flex-direction: column; gap: 25px; text-align: center; } .cta-section-5 .cta-wrap .cta-right .cta-content { text-align: center; margin-left: 0; } } .cta-section-6 .cta-wrap { background-repeat: no-repeat; background-size: cover; background-position: center center; border-radius: 15px; padding: 90px 40px 90px 40px; } .cta-section-6 .cta-wrap .cta-content .title { font-size: 48px; line-height: 54px; color: #ffffff; } .cta-section-6 .cta-wrap .cta-content p { font-size: 20px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #ffffff; margin-top: 5px; } .cta-section-6 .cta-wrap .cta-content .btn { font-size: 16px; color: #051441; padding: 0 55px; transition: all 0.3s linear; margin-top: 35px; } .cta-section-6 .cta-wrap .cta-content .btn.btn-white::after { background: #6754e2; } .cta-section-6 .cta-wrap .cta-content .btn:hover { color: #ffffff; } @media only screen and (max-width: 767px) { .cta-section-6 .cta-wrap { padding: 70px 40px 70px 40px; } .cta-section-6 .cta-wrap .cta-content .title { font-size: 36px; line-height: 46px; } } .cta-section-7 .cta-wrap { background: #ebecf7; max-width: 1070px; margin: 0 auto; position: relative; border-radius: 15px; padding: 30px 135px 45px; } .cta-section-7 .cta-wrap .cta-icon { position: absolute; left: 50px; top: -42px; height: 81px; width: 81px; line-height: 81px; text-align: center; background: #ffffff; box-shadow: 0px 20px 43px 0px rgba(0, 0, 0, 0.09); border-radius: 50%; } .cta-section-7 .cta-wrap .cta-content p { font-size: 18px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 600; color: #4c4d56; } .cta-section-7 .cta-wrap .cta-content p span { font-weight: 700; color: #051441; } .cta-section-7 .cta-wrap .cta-content p a { font-weight: 500; color: #005de0; position: relative; margin-left: 15px; } .cta-section-7 .cta-wrap .cta-content p a i { margin-left: 5px; } .cta-section-7 .cta-wrap .cta-content p a::before { content: ""; position: absolute; left: 0; bottom: 5px; background: #005de0; width: 100%; height: 1px; } .cta-section-7 .cta-wrap .cta-content p a:hover { color: #090d2f; } @media only screen and (max-width: 1199px) { .cta-section-7 .cta-wrap { padding: 30px 80px 45px; } .cta-section-7 .cta-wrap .cta-icon { top: -52px; } } @media only screen and (max-width: 449px) { .cta-section-7 .cta-wrap { padding: 30px 40px 45px; } } /*-- /* 12 - Blog CSS /*----------------------------------------*/ .blog-section .blog-wrap { margin-top: -10px; } .blog-section .blog-wrap .blog-content-wrap { padding-top: 35px; } .single-blog { background: #ffffff; box-shadow: 0px 0px 98px 0px rgba(0, 0, 0, 0.07); border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; margin-top: 30px; } .single-blog .blog-img { position: relative; overflow: hidden; border-top-left-radius: 10px; border-top-right-radius: 10px; } .single-blog .blog-img a { display: block; } .single-blog .blog-img a img { width: 100%; transition: all 0.3s linear; } .single-blog .blog-img .top-meta { position: absolute; top: 35px; left: 30px; } .single-blog .blog-img .top-meta .date { width: 65px; height: 65px; line-height: 65px; text-align: center; background-image: linear-gradient(120deg, #54d6eb 0%, #035cdd 100%); color: #fff; font-size: 14px; line-height: 18px; border-radius: 5px; font-family: "Manrope", sans-serif; display: inline-block; text-align: center; line-height: 12px; padding: 10px; } .single-blog .blog-img .top-meta .date span { font-size: 28px; line-height: 18px; font-weight: 500; line-height: 30px; display: block; } .single-blog .blog-content { padding: 40px; } @media only screen and (max-width: 991px) { .single-blog .blog-content { padding: 35px; } } @media only screen and (max-width: 575px) { .single-blog .blog-content { padding: 35px 24px; } } .single-blog .blog-content .blog-meta span { font-size: 14px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 600; color: #999999; margin-right: 15px; } @media only screen and (max-width: 575px) { .single-blog .blog-content .blog-meta span { margin-right: 12px; } } .single-blog .blog-content .blog-meta span i { color: #005de0; margin-right: 5px; } .single-blog .blog-content .title { font-size: 22px; line-height: 30px; color: #333333; padding-right: 15px; margin-top: 15px; } .single-blog .blog-content p { font-size: 14px; line-height: 26px; font-family: "Manrope", sans-serif; font-weight: 400; color: #4c4d56; margin-top: 10px; } .single-blog .blog-btn { border-top: 1px solid #ebebeb; padding: 15px 40px; } .single-blog .blog-btn .blog-btn-link { display: flex; align-items: center; justify-content: space-between; font-size: 14px; font-family: "Manrope", sans-serif; font-weight: 600; color: #005de0; transition: all 0.3s linear; } .single-blog .blog-btn .blog-btn-link i { transition: all 0.3s linear; } .single-blog .blog-btn .blog-btn-link:hover i { transform: translateX(5px); } .single-blog:hover .blog-img a img { transform: scale(1.1); } .blog-section-2 { padding-bottom: 120px; } @media only screen and (max-width: 1199px) { .blog-section-2 { padding-bottom: 100px; } } @media only screen and (max-width: 991px) { .blog-section-2 { padding-bottom: 80px; } } @media only screen and (max-width: 767px) { .blog-section-2 { padding-bottom: 60px; } } .blog-section-2 .blog-wrap .section-title .sub-title { color: #ff5538; } .blog-section-2 .blog-wrap .blog-content-wrap .single-blog .blog-img .top-meta .date { background: #ff5538; } .blog-section-2 .blog-wrap .blog-content-wrap .single-blog .blog-content .blog-meta span a:hover { color: #ff5538; } .blog-section-2 .blog-wrap .blog-content-wrap .single-blog .blog-content .blog-meta span i { color: #ff5538; } .blog-section-2 .blog-wrap .blog-content-wrap .single-blog .blog-content .title a:hover { color: #ff5538; } .blog-section-2 .blog-wrap .blog-content-wrap .single-blog .blog-btn .blog-btn-link { color: #ff5538; } .blog-section-3 .blog-content-wrap .single-blog { position: relative; } .blog-section-3 .blog-content-wrap .single-blog .blog-img { border-radius: 10px; } .blog-section-3 .blog-content-wrap .single-blog .blog-content { background: none; position: absolute; bottom: 0; width: 100%; } @media only screen and (max-width: 1199px) { .blog-section-3 .blog-content-wrap .single-blog .blog-content { padding: 35px 20px; } } @media only screen and (max-width: 767px) { .blog-section-3 .blog-content-wrap .single-blog .blog-content { padding: 40px; } } @media only screen and (max-width: 575px) { .blog-section-3 .blog-content-wrap .single-blog .blog-content { padding: 35px 25px; } } .blog-section-3 .blog-content-wrap .single-blog .blog-content .blog-meta span { color: #ffffff; } .blog-section-3 .blog-content-wrap .single-blog .blog-content .title { color: #ffffff; } .blog-grid-wrap { margin-top: -30px; } .blog-grid-wrap .pagination { margin-top: 70px; } /*-- /* 13 - Brand CSS /*----------------------------------------*/ .brand-title { font-size: 22px; font-weight: 600; font-family: "Manrope", sans-serif; color: #717171; margin-top: -7px; } @media only screen and (max-width: 575px) { .brand-title { font-size: 20px; } } .brand-title span { color: #005de0; font-weight: 700; } .brand-active { max-width: 1070px; width: 100%; margin: 45px auto 0; } .brand-section-2 .brand-wrapper-2 { background: #ffffff; box-shadow: 0px 0px 144px 0px rgba(0, 0, 0, 0.04); border-radius: 10px; padding-top: 80px; padding-bottom: 80px; position: relative; margin-bottom: -150px; z-index: 1; } .brand-section-3 .brand-wrapper { border-bottom: 1px solid #e1e1e1; padding-bottom: 120px; } @media only screen and (max-width: 1199px) { .brand-section-3 .brand-wrapper { padding-bottom: 100px; } } @media only screen and (max-width: 991px) { .brand-section-3 .brand-wrapper { padding-bottom: 80px; } } @media only screen and (max-width: 767px) { .brand-section-3 .brand-wrapper { padding-bottom: 60px; } } .brand-section-3 .brand-wrapper .brand-title span { color: #ff5538; } .brand-section-4 { background: #fbfbfc; } .brand-section-5 .brand-wrapper-2 { margin-bottom: 0; } .brand-section-6 { background: #0b0f20; } .brand-section-6 .section-title2 { margin-bottom: 50px; } .brand-section-6 .section-title2 .title { text-transform: uppercase; } .brand-section-6 .brand-wrap { position: relative; padding-top: 20px; } .brand-section-6 .brand-wrap::before { content: ""; background: #3c3f4d; width: 100%; margin: auto; height: 1px; position: absolute; left: 0; right: 0; top: 50%; } @media only screen and (max-width: 991px) { .brand-section-6 .brand-wrap::before { display: none; } } .brand-section-6 .brand-wrap .brand-item-box { border-right: 1px solid #3c3f4d; } @media only screen and (max-width: 991px) { .brand-section-6 .brand-wrap .brand-item-box { border-right: 0; } } .brand-section-6 .brand-wrap .brand-item-box .brand-logo { padding: 45px 0; } @media only screen and (max-width: 991px) { .brand-section-6 .brand-wrap .brand-item-box .brand-logo { padding: 35px 0; } } .brand-section-6 .brand-wrap .brand-item-box.brand-box-4 { border-right: 0; } /*-- /* 10 - Team CSS /*----------------------------------------*/ .team-section .team-wrap .team-content-wrap { padding-top: 90px; } @media only screen and (max-width: 1199px) { .team-section .team-wrap .team-content-wrap { padding-top: 70px; } } @media only screen and (max-width: 767px) { .team-section .team-wrap .team-content-wrap { padding-top: 50px; } } .team-section .team-wrap .team-content-wrap .single-team .team-img a { display: block; position: relative; } .team-section .team-wrap .team-content-wrap .single-team .team-img a::before { content: ''; position: absolute; bottom: 0; left: 0; width: 90%; height: 430px; background-color: #0071dc; -webkit-clip-path: polygon(0 34%, 0% 100%, 100% 100%); clip-path: polygon(0 34%, 0% 100%, 100% 100%); opacity: 0; visibility: hidden; transition: all 0.3s linear; } .team-section .team-wrap .team-content-wrap .single-team .team-img a::after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 480px; background-color: #0071dc; -webkit-clip-path: polygon(0 34%, 0% 100%, 100% 100%); clip-path: polygon(0 34%, 0% 100%, 100% 100%); opacity: 0; visibility: hidden; transition: all 0.3s linear; } .team-section .team-wrap .team-content-wrap .single-team .team-img a img { border-radius: 5px; width: 100%; } .team-section .team-wrap .team-content-wrap .single-team .team-content { background: #ffffff; padding: 30px; margin-top: -70px; position: relative; width: 290px; z-index: 1; } @media only screen and (max-width: 1199px) { .team-section .team-wrap .team-content-wrap .single-team .team-content { width: 230px; } } @media only screen and (max-width: 991px) { .team-section .team-wrap .team-content-wrap .single-team .team-content { width: 270px; } } .team-section .team-wrap .team-content-wrap .single-team .team-content .team-social { position: absolute; top: 0; left: 25px; transform: translateY(-25px); opacity: 0; visibility: hidden; transition: all 0.3s linear; } .team-section .team-wrap .team-content-wrap .single-team .team-content .team-social .social li { display: inline-block; } .team-section .team-wrap .team-content-wrap .single-team .team-content .team-social .social li + li { margin-left: 10px; } .team-section .team-wrap .team-content-wrap .single-team .team-content .team-social .social li a { font-size: 18px; display: inline-block; color: #ffffff; transform: translate3d(0, 0, 0); transition: all 0.3s linear; } .team-section .team-wrap .team-content-wrap .single-team .team-content .name { font-size: 22px; line-height: 28px; color: #231e32; } .team-section .team-wrap .team-content-wrap .single-team .team-content .designation { font-size: 16px; line-height: 28px; font-family: "Manrope", sans-serif; font-weight: 400; color: #005de0; } .team-section .team-wrap .team-content-wrap .single-team:hover .team-img a::before { opacity: 1; visibility: visible; } .team-section .team-wrap .team-content-wrap .single-team:hover .team-img a::after { opacity: 0.35; visibility: visible; } .team-section .team-wrap .team-content-wrap .single-team:hover .team-content .team-social { opacity: 1; visibility: visible; transform: translateY(-55px); } .team-section .team-wrap .team-content-wrap .single-team:hover .team-content .team-social .social li a:hover { transform: translateY(-5px); } .team-active .swiper-pagination { position: relative; margin-top: 30px; } .team-active .swiper-pagination .swiper-pagination-bullet { width: 10px; height: 10px; background-repeat: 50%; background: #e1e1e1; } .team-active .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background: #005de0; } .our-tem-section .our-team-wrap { margin-top: -30px; } .our-tem-section .our-team-wrap .team-content-wrap { padding-top: 0; } .our-tem-section .our-team-wrap .team-content-wrap .single-team { margin-top: 30px; } .our-tem-section .our-team-wrap .team-content-wrap .single-team .team-content { width: 260px; } @media only screen and (max-width: 1399px) { .our-tem-section .our-team-wrap .team-content-wrap .single-team .team-content { margin-top: -60px; width: 230px; } } @media only screen and (max-width: 991px) { .our-tem-section .our-team-wrap .team-content-wrap .single-team .team-content { width: 270px; margin-top: -70px; } } /*-- /* 15 - Video CSS /*----------------------------------------*/ .video-section { padding-top: 200px; padding-bottom: 200px; background-repeat: no-repeat; background-size: cover; background-position: center center; } @media only screen and (max-width: 1199px) { .video-section { padding-top: 100px; padding-bottom: 100px; } } @media only screen and (max-width: 991px) { .video-section { padding-top: 80px; padding-bottom: 80px; } } @media only screen and (max-width: 767px) { .video-section { padding-top: 60px; padding-bottom: 60px; } } .video-section .video-wrap .video-content .title { font-size: 48px; line-height: 60px; color: #ffffff; } @media only screen and (max-width: 1199px) { .video-section .video-wrap .video-content .title { font-size: 36px; line-height: 48px; } } @media only screen and (max-width: 767px) { .video-section .video-wrap .video-content .title { font-size: 28px; line-height: 40px; } } .video-section .video-wrap .video-content .video-play { margin-top: 40px; } .video-section .video-wrap .video-content .video-play a i { width: 100px; height: 100px; background: #005de0; display: inline-block; line-height: 100px; text-align: center; font-size: 14px; color: #ffffff; border-radius: 50%; transition: all 0.3s linear; } @media only screen and (max-width: 991px) { .video-section .video-wrap .video-content .video-play a i { width: 80px; height: 80px; line-height: 80px; } } .video-section .video-wrap .video-content .video-play a i:hover { background: #ffffff; color: #005de0; } .video-section .video-wrap .video-content .video-play a span { font-size: 22px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 700; color: #ffffff; display: block; margin-top: 15px; } @media only screen and (max-width: 767px) { .video-section .video-wrap .video-content .video-play a span { font-size: 20px; } } .video-section-02 { background: #051543; position: relative; padding-bottom: 120px; z-index: 1; } .video-section-02 .shape-1 { position: absolute; left: 150px; top: 105px; -webkit-animation: round-02 4s linear infinite; animation: round-02 4s linear infinite; z-index: -1; } .video-section-02 .shape-2 { position: absolute; left: 35px; bottom: 120px; -webkit-animation: round-02 4s linear infinite; animation: round-02 4s linear infinite; z-index: -1; } .video-section-02 .shape-3 { position: absolute; top: 80px; right: 50px; -webkit-animation: round-02 4s linear infinite; animation: round-02 4s linear infinite; z-index: -1; } .video-section-02 .video-left { padding-top: 40px; } .video-section-02 .video-left .video-content { padding-right: 135px; } .video-section-02 .video-left .video-content img { margin-top: 35px; } .video-section-02 .video-left .video-content p { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #ffffff; margin-top: 15px; } .video-section-02 .video-left .video-content p span { font-weight: 700; } .video-section-02 .video-left .video-content .learn-more { font-size: 12px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 600; color: #ffffff; margin-top: 20px; } .video-section-02 .video-left .video-content .learn-more i { color: #6754e2; margin-left: 2px; } .video-section-02 .video-left .video-content .learn-more:hover { color: #6754e2; } .video-section-02 .video-right .video-img { position: relative; } .video-section-02 .video-right .video-img img { width: 100%; border-radius: 14px; } .video-section-02 .video-right .video-img .play-btn { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .video-section-02 .video-right .video-img .play-btn a { width: 85px; height: 85px; line-height: 85px; font-size: 15px; display: inline-block; text-align: center; border-radius: 50%; background: #ffffff; color: #6754e2; transition: all 0.3s linear; } @media only screen and (max-width: 767px) { .video-section-02 .video-right .video-img .play-btn a { width: 85px; height: 85px; line-height: 85px; } } .video-section-02 .video-right .video-img .play-btn a:hover { background: #6754e2; color: #ffffff; } @media only screen and (max-width: 1199px) { .video-section-02 .shape-2 { bottom: 50px; } .video-section-02 .video-left .video-content { padding-right: 0px; } } @media only screen and (max-width: 991px) { .video-section-02 .shape-1 { top: 60px; } .video-section-02 .shape-3 { top: 205px; right: 35px; } .video-section-02 .video-right { margin-top: 50px; } } @media only screen and (max-width: 575px) { .video-section-02 .shape-3 { width: 150px; top: 235px; right: 0; } } /*-- /* 16 - Pricing CSS /*----------------------------------------*/ .pricing-section { background: #fafbff; background-repeat: no-repeat; background-size: cover; background-position: center center; } .pricing-section .pricing-wrap .pricing-content-wrap { padding-top: 30px; } .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing { background: #ffffff; border-top: 7px solid #005de0; box-shadow: 0px 0px 144px 0px rgba(0, 0, 0, 0.04); border-radius: 5px; padding: 45px 55px 55px; margin-top: 30px; } @media only screen and (max-width: 1399px) { .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing { padding: 45px 30px 50px; } } .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing .pricing-badge .title { font-size: 30px; font-family: "Manrope", sans-serif; font-weight: 800; color: #333333; } @media only screen and (max-width: 575px) { .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing .pricing-badge .title { font-size: 24px; } } .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing .pricing-badge .recommend { display: inline-block; height: 25px; line-height: 25px; background: #ffd166; font-size: 12px; font-family: "Manrope", sans-serif; font-weight: 800; text-transform: uppercase; padding: 0 20px; border-radius: 35px; color: #ffffff; position: relative; top: -5px; margin-left: 15px; } @media only screen and (max-width: 575px) { .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing .pricing-badge .recommend { padding: 0 18px; margin-left: 10px; } } .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing .pricing-price { display: flex; align-items: center; margin-top: 35px; } .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing .pricing-price .price { font-size: 72px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 700; display: inline-block; color: #005de0; } @media only screen and (max-width: 991px) { .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing .pricing-price .price { font-size: 55px; } } .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing .pricing-price .currency { font-size: 24px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 700; color: #005de0; display: inline-block; position: relative; top: -20px; } .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing .pricing-price p { font-size: 20px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 600; color: #b4b4b4; margin-left: 25px; } .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing .pricing-content { padding-top: 55px; } .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing .pricing-content .pricing-list li { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #666666; } .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing .pricing-content .pricing-list li i { color: #5149f3; margin-right: 20px; } .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing .pricing-content .pricing-list li + li { margin-top: 10px; } .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing .pricing-content .pricing-btn { padding-top: 40px; } .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing .pricing-content .pricing-btn .btn { height: 50px; line-height: 45px; padding: 0 35px; margin-right: 20px; } @media only screen and (max-width: 1399px) { .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing .pricing-content .pricing-btn .btn { margin-right: 15px; } } @media only screen and (max-width: 991px) { .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing .pricing-content .pricing-btn .btn { padding: 0 30px; font-size: 16px; } } .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing .pricing-content .pricing-btn .pricing-contact { font-size: 18px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 700; color: #005de0; text-decoration: underline; } @media only screen and (max-width: 575px) { .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing .pricing-content .pricing-btn .pricing-contact { margin-top: 15px; font-size: 16px; } } .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing .pricing-content .pricing-btn .pricing-contact:hover { color: #5149f3; } .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing.active { border-top: 0; background: linear-gradient(-25deg, #54d6eb 0%, #035cdd 100%); } .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing.active .pricing-badge .title { color: #ffffff; } .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing.active .pricing-price .price { color: #ffffff; } .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing.active .pricing-price .currency { color: #ffffff; } .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing.active .pricing-price p { color: #ffffff; } .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing.active .pricing-content .pricing-list li { color: #ffffff; } .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing.active .pricing-content .pricing-list li i { color: #ffffff; } .pricing-section .pricing-wrap .pricing-content-wrap .single-pricing.active .pricing-content .pricing-btn .pricing-contact { color: #5149f3; } .pricing-section-2 { background: #ffffff; } .pricing-section-3 { background: #0b0f20; } .pricing-section-3 .pricing-wrap .section-title2 { max-width: 870px; } .pricing-section-3 .pricing-wrap .section-title2 .sub-title { letter-spacing: 1px; } .pricing-section-3 .pricing-wrap .section-title2 .title { text-transform: uppercase; } .pricing-section-3 .pricing-wrap .pricing-content-wrap { padding-top: 30px; } .pricing-section-3 .pricing-wrap .pricing-content-wrap .single-pricing { background: #10162e; } .pricing-section-3 .pricing-wrap .pricing-content-wrap .single-pricing .pricing-badge .title { color: #ffffff; } .pricing-section-3 .pricing-wrap .pricing-content-wrap .single-pricing .pricing-price p { color: #ffffff; } .pricing-section-3 .pricing-wrap .pricing-content-wrap .single-pricing .pricing-content { padding-top: 55px; } .pricing-section-3 .pricing-wrap .pricing-content-wrap .single-pricing .pricing-content .pricing-list li { color: #ffffff; } .pricing-section-3 .pricing-wrap .pricing-content-wrap .single-pricing .pricing-content .pricing-list li i { color: #005de0; } .pricing-section-3 .pricing-wrap .pricing-content-wrap .single-pricing .pricing-content .pricing-btn .pricing-contact:hover { color: #ffffff; } .pricing-section-3 .pricing-wrap .pricing-content-wrap .single-pricing.active { background: linear-gradient(340deg, #54d1e9 -20%, #5d298a 100%); } .pricing-section-3 .pricing-wrap .pricing-content-wrap .single-pricing.active .pricing-content .pricing-btn .pricing-contact { color: #005de0; } .pricing-section-3 .pricing-wrap .pricing-content-wrap .single-pricing.active .pricing-content .pricing-btn .pricing-contact:hover { color: #ffffff; } /*-- /* 19 - Contact CSS /*----------------------------------------*/ .contact-section { background: #ff5538; background-repeat: no-repeat; background-size: cover; background-position: center center; } .contact-section .contact-wrap .contact-info { max-width: 410px; } .contact-section .contact-wrap .contact-info .info-title { font-size: 40px; line-height: 54px; color: #ffffff; } @media only screen and (max-width: 1199px) { .contact-section .contact-wrap .contact-info .info-title { font-size: 34px; line-height: 48px; } } @media only screen and (max-width: 575px) { .contact-section .contact-wrap .contact-info .info-title { font-size: 28px; line-height: 40px; } } .contact-section .contact-wrap .contact-info ul { padding-top: 15px; } .contact-section .contact-wrap .contact-info ul li { border-top: 1px solid #ffffff; margin-top: 15px; padding-top: 15px; } .contact-section .contact-wrap .contact-info ul li:first-child { border-top: 0; } .contact-section .contact-wrap .contact-info ul li .contact-info-item .contact-info-icon i { font-size: 50px; color: #ffffff; } @media only screen and (max-width: 575px) { .contact-section .contact-wrap .contact-info ul li .contact-info-item .contact-info-icon i { font-size: 42px; } } .contact-section .contact-wrap .contact-info ul li .contact-info-item .contact-info-text { margin-left: 20px; } .contact-section .contact-wrap .contact-info ul li .contact-info-item .contact-info-text .title { font-size: 20px; line-height: 30px; color: #ffffff; } .contact-section .contact-wrap .contact-info ul li .contact-info-item .contact-info-text p { font-size: 15px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #ffffff; } .contact-section .contact-wrap .contact-form { background: #ffffff; border-radius: 10px; overflow: hidden; margin-left: 110px; } @media only screen and (max-width: 1199px) { .contact-section .contact-wrap .contact-form { margin-left: 15px; } } @media only screen and (max-width: 991px) { .contact-section .contact-wrap .contact-form { margin-left: 0; margin-top: 60px; } } .contact-section .contact-wrap .contact-form .contact-form-wrap { padding: 60px; } @media only screen and (max-width: 1199px) { .contact-section .contact-wrap .contact-form .contact-form-wrap { padding: 40px; } } .contact-section .contact-wrap .contact-form .contact-form-wrap .heading-wrap { margin-bottom: 30px; } .contact-section .contact-wrap .contact-form .contact-form-wrap .heading-wrap .sub-title { font-size: 14px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 800; text-transform: uppercase; color: #ff5538; } .contact-section .contact-wrap .contact-form .contact-form-wrap .heading-wrap .title { font-size: 42px; line-height: 54px; font-family: "Manrope", sans-serif; font-weight: 700; color: #333333; } @media only screen and (max-width: 1199px) { .contact-section .contact-wrap .contact-form .contact-form-wrap .heading-wrap .title { font-size: 32px; line-height: 48px; } } @media only screen and (max-width: 575px) { .contact-section .contact-wrap .contact-form .contact-form-wrap .heading-wrap .title { font-size: 28px; line-height: 40px; } } .contact-section .contact-wrap .contact-form .contact-form-wrap .single-form { margin-top: 25px; } .contact-section .contact-wrap .contact-form .contact-form-wrap .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]) { height: 55px; line-height: 55px; border: 1px solid #ebebeb; padding-left: 15px; } .contact-section .contact-wrap .contact-form .contact-form-wrap .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-webkit-input-placeholder { opacity: 0.95; font-size: 14px; color: #4c4d56; font-family: "Manrope", sans-serif; font-weight: 400; } .contact-section .contact-wrap .contact-form .contact-form-wrap .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-moz-placeholder { opacity: 0.95; font-size: 14px; color: #4c4d56; font-family: "Manrope", sans-serif; font-weight: 400; } .contact-section .contact-wrap .contact-form .contact-form-wrap .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-moz-placeholder { opacity: 0.95; font-size: 14px; color: #4c4d56; font-family: "Manrope", sans-serif; font-weight: 400; } .contact-section .contact-wrap .contact-form .contact-form-wrap .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-ms-input-placeholder { opacity: 0.95; font-size: 14px; color: #4c4d56; font-family: "Manrope", sans-serif; font-weight: 400; } .contact-section .contact-wrap .contact-form .contact-form-wrap .single-form textarea { height: 135px; border: 1px solid #ebebeb; padding-left: 15px; resize: none; } .contact-section .contact-wrap .contact-form .contact-form-wrap .single-form textarea::-webkit-input-placeholder { opacity: 0.95; font-size: 14px; color: #4c4d56; font-family: "Manrope", sans-serif; font-weight: 400; } .contact-section .contact-wrap .contact-form .contact-form-wrap .single-form textarea:-moz-placeholder { opacity: 0.95; font-size: 14px; color: #4c4d56; font-family: "Manrope", sans-serif; font-weight: 400; } .contact-section .contact-wrap .contact-form .contact-form-wrap .single-form textarea::-moz-placeholder { opacity: 0.95; font-size: 14px; color: #4c4d56; font-family: "Manrope", sans-serif; font-weight: 400; } .contact-section .contact-wrap .contact-form .contact-form-wrap .single-form textarea:-ms-input-placeholder { opacity: 0.95; font-size: 14px; color: #4c4d56; font-family: "Manrope", sans-serif; font-weight: 400; } .contact-section .contact-wrap .contact-form .contact-form-wrap .form-btn { margin-top: 25px; } .contact-section .contact-wrap .contact-form .contact-form-wrap .form-btn .btn { font-size: 16px; width: 100%; height: 55px; line-height: 50px; margin-bottom: 10px; } @media only screen and (max-width: 575px) { .contact-section .contact-wrap .contact-form .contact-form-wrap .form-btn .btn { padding: 0 45px; } } .contact-info-section .contact-info-wrap { margin-top: -10px; } @media only screen and (max-width: 1199px) { .contact-info-section .contact-info-wrap { margin-top: -30px; } } .contact-info-section .contact-info-wrap .single-contact-info { background: #ffffff; box-shadow: 0px 0px 100px 0px rgba(0, 0, 0, 0.11); padding: 55px; border-radius: 10px; margin-top: 70px; } @media only screen and (max-width: 1199px) { .contact-info-section .contact-info-wrap .single-contact-info { padding: 40px; } } .contact-info-section .contact-info-wrap .single-contact-info .info-icon { width: 100px; height: 100px; line-height: 103px; background: #005de0; color: #ffffff; border-radius: 50%; margin: 0 auto; margin-top: -115px; } @media only screen and (max-width: 1199px) { .contact-info-section .contact-info-wrap .single-contact-info .info-icon { width: 80px; height: 80px; line-height: 80px; margin-top: -80px; } } .contact-info-section .contact-info-wrap .single-contact-info .info-icon i { font-size: 40px; } @media only screen and (max-width: 1199px) { .contact-info-section .contact-info-wrap .single-contact-info .info-icon i { font-size: 30px; } } .contact-info-section .contact-info-wrap .single-contact-info .info-content .title { font-size: 18px; line-height: 36px; color: #333333; margin-top: 15px; } .contact-info-section .contact-info-wrap .single-contact-info .info-content p { font-size: 22px; line-height: 36px; font-family: "Manrope", sans-serif; font-weight: 700; color: #005de0; text-decoration: underline; -webkit-text-decoration-color: #7faeef; text-decoration-color: #7faeef; } @media only screen and (max-width: 1199px) { .contact-info-section .contact-info-wrap .single-contact-info .info-content p { font-size: 16px; } } @media only screen and (max-width: 991px) { .contact-info-section .contact-info-wrap .single-contact-info .info-content p { font-size: 18px; } } .contact-form-section .contact-wrap { margin-top: -10px; } .contact-form-section .contact-wrap .form-title .title { font-size: 36px; line-height: 48px; font-weight: 600; color: #333333; } @media only screen and (max-width: 991px) { .contact-form-section .contact-wrap .form-title .title { font-size: 30px; line-height: 40px; } } @media only screen and (max-width: 575px) { .contact-form-section .contact-wrap .form-title .title { font-size: 28px; } } .contact-form-section .contact-wrap .contact-form-wrap { padding-top: 30px; } .contact-form-section .contact-wrap .contact-form-wrap .single-form { margin-top: 20px; } .contact-form-section .contact-wrap .contact-form-wrap .single-form .form-control { border: 1px solid transparent; background: #f6f7f9; border-radius: 0; } .contact-form-section .contact-wrap .contact-form-wrap .single-form .form-control::-webkit-input-placeholder { opacity: 0.95; font-size: 14px; font-family: "Manrope", sans-serif; color: #787884; font-weight: 400; } .contact-form-section .contact-wrap .contact-form-wrap .single-form .form-control:-moz-placeholder { opacity: 0.95; font-size: 14px; font-family: "Manrope", sans-serif; color: #787884; font-weight: 400; } .contact-form-section .contact-wrap .contact-form-wrap .single-form .form-control::-moz-placeholder { opacity: 0.95; font-size: 14px; font-family: "Manrope", sans-serif; color: #787884; font-weight: 400; } .contact-form-section .contact-wrap .contact-form-wrap .single-form .form-control:-ms-input-placeholder { opacity: 0.95; font-size: 14px; font-family: "Manrope", sans-serif; color: #787884; font-weight: 400; } .contact-form-section .contact-wrap .contact-form-wrap .single-form .form-control:focus { outline: none; border-color: #005de0; } .contact-form-section .contact-wrap .contact-form-wrap .single-form textarea.form-control { height: 135px; font-size: 13px; color: #415674; font-weight: 600; padding: 10px 25px; padding-top: 15px; resize: none; } .contact-form-section .contact-wrap .contact-form-wrap .single-form textarea.form-control:focus { outline: none; box-shadow: none; } .contact-form-section .contact-wrap .contact-form-wrap .form-btn .btn { height: 45px; line-height: 40px; font-size: 16px; padding: 0 30px; margin-top: 35px; } .contact-map-section .contact-map-wrap { margin-bottom: -7px; } .contact-map-section .contact-map-wrap iframe { height: 550px; width: 100%; filter: brightness(100%) contrast(100%) saturate(0%) blur(0px) hue-rotate(0deg); } .contact-section-2 .contact-wrap .contact-form .contact-form-wrap .heading-wrap .sub-title { color: #005de0; } .contact-section-3 { background: #0b0f20; background-repeat: no-repeat; background-size: cover; background-position: center center; } .contact-section-3 .contact-wrap .contact-info { max-width: 460px; } .contact-section-3 .contact-wrap .contact-info .info-title { font-size: 42px; line-height: 54px; text-transform: uppercase; } @media only screen and (max-width: 767px) { .contact-section-3 .contact-wrap .contact-info .info-title { font-size: 30px; line-height: 42px; } } .contact-section-3 .contact-wrap .contact-info ul li { border-top: 1px solid #41455d; } .contact-section-3 .contact-wrap .contact-info ul li .contact-info-item .contact-info-icon i { color: #005de0; } .contact-section-3 .contact-wrap .contact-form { background: rgba(0, 0, 0, 0.5); } .contact-section-3 .contact-wrap .contact-form .contact-form-wrap .heading-wrap .sub-title { letter-spacing: 1px; color: #005de0; } .contact-section-3 .contact-wrap .contact-form .contact-form-wrap .heading-wrap .title { text-transform: uppercase; color: #ffffff; } /*-- /* 20 - Page Banner CSS /*----------------------------------------*/ .page-banner-section { padding-top: 80px; min-height: 650px; display: flex; align-items: center; background-repeat: no-repeat; background-size: cover; background-position: center center; position: relative; overflow: hidden; z-index: 1; } @media only screen and (max-width: 1199px) { .page-banner-section { min-height: 520px; } } @media only screen and (max-width: 991px) { .page-banner-section { min-height: 450px; } } @media only screen and (max-width: 767px) { .page-banner-section { min-height: 350px; } } .page-banner-section::before { content: ""; position: absolute; left: 0; top: 0; background: #0e2641; opacity: 0.3; width: 100%; height: 100%; z-index: -1; } .page-banner-section .shape-2 { width: 545px; height: 545px; border: 3px solid #005de0; opacity: 0.9; border-radius: 50%; position: absolute; left: -10%; bottom: -40%; } @media only screen and (max-width: 1199px) { .page-banner-section .shape-2 { width: 420px; height: 420px; } } @media only screen and (max-width: 991px) { .page-banner-section .shape-2 { width: 350px; height: 350px; } } @media only screen and (max-width: 767px) { .page-banner-section .shape-2 { left: -25%; } } @media only screen and (max-width: 575px) { .page-banner-section .shape-2 { display: none; } } .page-banner-section .shape-2::before { content: ""; position: absolute; left: 0; top: 0; background: linear-gradient(-48deg, #54d6eb 0%, #035cdd 100%); width: 100%; height: 100%; border-radius: 50%; transform: scale(0.8); } .page-banner .title { font-size: 60px; line-height: 1.25; font-family: "Manrope", sans-serif; display: inline-block; font-weight: 700; color: #ffffff; position: relative; z-index: 1; } .page-banner .title::before { content: ""; width: 75px; height: 75px; border-radius: 50%; background-image: linear-gradient(-48deg, #54d6eb 0%, #035cdd 100%); opacity: 0.9; position: absolute; left: -25px; top: -20px; z-index: -1; } @media only screen and (max-width: 767px) { .page-banner .title::before { width: 60px; height: 60px; } } @media only screen and (max-width: 1199px) { .page-banner .title { font-size: 48px; } } @media only screen and (max-width: 767px) { .page-banner .title { font-size: 30px; } } .page-banner .breadcrumb { margin-bottom: 0; margin-top: 10px; } .page-banner .breadcrumb .breadcrumb-item { color: #ffffff; font-size: 16px; font-family: "Manrope", sans-serif; font-weight: 700; } @media only screen and (max-width: 991px), only screen and (max-width: 767px) { .page-banner .breadcrumb .breadcrumb-item { font-size: 16px; } } .page-banner .breadcrumb .breadcrumb-item + .breadcrumb-item { padding-left: 8px; } .page-banner .breadcrumb .breadcrumb-item + .breadcrumb-item::before { content: "/"; font-family: flaticon !important; font-size: 16px; padding-right: 5px; color: #ffffff; } /*-- /* 17 - Blog Standard CSS /*----------------------------------------*/ .blog-standard-wrap { margin-top: -70px; } .blog-standard-wrap .blog-post-wrap .pagination { margin-top: 55px; } .single-blog-post { margin-top: 70px; } .blog-sidebar { border: 1px solid #ebebeb; border-radius: 5px; padding: 30px; margin-top: 70px; margin-left: 65px; position: sticky; top: 0; } @media only screen and (max-width: 1199px) { .blog-sidebar { margin-left: 15px; } } @media only screen and (max-width: 991px) { .blog-sidebar { margin-left: 0px; } } .blog-sidebar .sidebar-widget-1 { margin-top: 0; } .sidebar-widget { margin-top: 45px; } .sidebar-widget .search-form { position: relative; } .sidebar-widget .search-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]) { width: 100%; height: 50px; margin-bottom: 0; border: 0; padding-right: 35px; background: #f8fafb; color: #415674; font-weight: 700; outline: none; overflow: hidden; } .sidebar-widget .search-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-webkit-input-placeholder { opacity: 0.95; font-size: 14px; font-family: "Manrope", sans-serif; color: #898c94; font-weight: 400; } .sidebar-widget .search-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-moz-placeholder { opacity: 0.95; font-size: 14px; font-family: "Manrope", sans-serif; color: #898c94; font-weight: 400; } .sidebar-widget .search-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-moz-placeholder { opacity: 0.95; font-size: 14px; font-family: "Manrope", sans-serif; color: #898c94; font-weight: 400; } .sidebar-widget .search-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-ms-input-placeholder { opacity: 0.95; font-size: 14px; font-family: "Manrope", sans-serif; color: #898c94; font-weight: 400; } .sidebar-widget .search-form button { position: absolute; top: 50%; transform: translateY(-50%); right: 0; width: 50px; height: 50px; background: transparent; border: 0; border-radius: 5px; font-size: 14px; color: #111111; transition: all 0.3s linear; } .sidebar-widget .search-form button:hover { background: #005de0; color: #ffffff; } .sidebar-widget .widget-title { margin-bottom: 25px; } .sidebar-widget .widget-title .title { font-size: 18px; font-family: "Manrope", sans-serif; font-weight: 700; color: #333333; display: inline-block; } .sidebar-widget .recent-posts ul li { margin-top: 30px; } .sidebar-widget .recent-posts ul li:first-child { margin-top: 0; } .sidebar-widget .recent-posts ul li .post-link { display: flex; align-items: center; } .sidebar-widget .recent-posts ul li .post-link .post-thumb { margin-right: 20px; } .sidebar-widget .recent-posts ul li .post-link .post-thumb img { min-width: 70px; height: 70px; border-radius: 10px; image-rendering: crisp-edges; } .sidebar-widget .recent-posts ul li .post-link .post-text .title { font-size: 14px; line-height: 16px; font-family: "Manrope", sans-serif; font-weight: 600; transition: all 0.3s linear; } .sidebar-widget .recent-posts ul li .post-link .post-text .post-meta { font-size: 12px; font-family: "Manrope", sans-serif; font-weight: 400; line-height: 24px; color: #838383; display: inline-block; margin-top: 5px; } .sidebar-widget .recent-posts ul li .post-link .post-text .post-meta i { color: #005de0; margin-right: 5px; } .sidebar-widget .recent-posts ul li .post-link:hover .post-text .title { color: #005de0; } .sidebar-widget .category .cate-item { margin-top: 15px; } .sidebar-widget .category .cate-item:first-child { margin-top: 0; } .sidebar-widget .category .cate-item a { display: flex; font-size: 14px; font-family: "Manrope", sans-serif; font-weight: 400; color: #29303c; transition: all 0.3s linear; } .sidebar-widget .category .cate-item a i { font-size: 10px; line-height: 24px; color: #005de0; margin-right: 5px; } .sidebar-widget .category .cate-item a .post-count { margin-left: auto; align-items: flex-start; width: 20px; height: 20px; line-height: 20px; text-align: center; border-radius: 50%; background: #e4f2f8; font-size: 14px; font-family: "Manrope", sans-serif; font-weight: 400; color: #005de0; transition: all 0.3s linear; } .sidebar-widget .category .cate-item a:hover { color: #005de0; } .sidebar-widget .category .cate-item a:hover .post-count { background: #005de0; color: #ffffff; } .sidebar-widget .sidebar-tag li { display: inline-block; margin-bottom: 10px; margin-right: 4px; } .sidebar-widget .sidebar-tag li a { display: inline-block; border-radius: 5px; padding: 8px 15px; font-size: 14px; font-family: "Manrope", sans-serif; font-weight: 400; color: #666666; line-height: 18px; background: #f9f9f9; transition: all 0.3s linear; } .sidebar-widget .sidebar-tag li a:hover { background-color: #005de0; color: #ffffff; } /*-- /* 18 - Blog Details CSS /*----------------------------------------*/ .blog-details-section .blog-details-wrap { margin-top: -70px; } .blog-details-post .single-blog { margin-top: 70px; background: none; box-shadow: none; } .blog-details-post .single-blog .blog-content { padding-left: 0; } .blog-details-post .single-blog .blog-content .title { font-size: 24px; color: #333333; } .blog-details-post .single-blog .blog-content p { font-size: 14px; line-height: 30px; } .blog-details-post .blog-details-content .blog-quote { background-color: none; position: relative; } .blog-details-post .blog-details-content .blog-quote::after { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background: #005de0; width: 2px; height: 90px; } @media only screen and (max-width: 575px) { .blog-details-post .blog-details-content .blog-quote::after { display: none; } } .blog-details-post .blog-details-content .blog-quote .blockquote { padding-left: 60px; padding-right: 30px; margin-left: 20px; margin-bottom: 0; position: relative; } @media only screen and (max-width: 575px) { .blog-details-post .blog-details-content .blog-quote .blockquote { padding-right: 0; margin-left: 0; } } .blog-details-post .blog-details-content .blog-quote .blockquote::before { content: '\f158'; font-family: flaticon !important; font-size: 40px; line-height: 1; margin-right: 5px; position: absolute; top: 5px; left: 0; color: #d4e4fa; } .blog-details-post .blog-details-content .blog-quote .blockquote:not(:first-child) { margin-top: 25px; } .blog-details-post .blog-details-content .blog-quote .blockquote:not(:last-child) { margin-bottom: 25px; } .blog-details-post .blog-details-content .blog-quote .blockquote p { display: inline; font-size: 18px; font-family: "Manrope", sans-serif; color: #333333; line-height: 32px; font-weight: 600; margin-top: 0; } .blog-details-post .blog-details-content .blog-inner-img { padding-top: 15px; } .blog-details-post .blog-details-content .blog-inner-img .image { margin-top: 40px; } .blog-details-post .blog-details-content .blog-inner-img .image img { border-radius: 10px; width: 100%; } .blog-details-post .blog-details-content .blog-details-text p { font-size: 14px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #4c4d56; margin-top: 50px; } .blog-details-post .blog-details-content .blog-details-tag-share { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; margin-top: 65px; padding-top: 20px; border-top: 1px solid #e3e3e5; } .blog-details-post .blog-details-content .blog-details-tag-share .blog-details-tag { padding-top: 20px; } .blog-details-post .blog-details-content .blog-details-tag-share .blog-details-tag .sidebar-widget { margin-top: 0; display: flex; align-items: center; } .blog-details-post .blog-details-content .blog-details-tag-share .blog-details-tag .sidebar-widget .label { font-size: 14px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 700; color: #333333; margin-right: 10px; } .blog-details-post .blog-details-content .blog-details-tag-share .blog-details-tag .sidebar-widget .sidebar-tag li { margin-bottom: 0px; } .blog-details-post .blog-details-content .blog-details-tag-share .blog-details-share { display: flex; align-items: center; padding-top: 20px; } .blog-details-post .blog-details-content .blog-details-tag-share .blog-details-share li { display: inline-block; margin-right: 10px; } .blog-details-post .blog-details-content .blog-details-tag-share .blog-details-share li:last-child { margin-right: 0; } .blog-details-post .blog-details-content .blog-details-tag-share .blog-details-share li a { display: inline-block; font-size: 13px; width: 35px; height: 35px; line-height: 35px; text-align: center; color: #ffffff; border-radius: 50%; } .blog-details-post .blog-details-content .blog-details-tag-share .blog-details-share li a.share-twitter { background: #1DA1F2; } .blog-details-post .blog-details-content .blog-details-tag-share .blog-details-share li a.share-facebook { background: #4867AA; } .blog-details-post .blog-details-content .blog-details-tag-share .blog-details-share li a.share-pinterest { background: #BD081B; } .blog-details-post .blog-details-content .blog-details-tag-share .blog-details-share li a.share-linkedin { background: #007BB6; } .blog-details-post .blog-details-content .blog-details-tag-share .blog-details-share li a:hover { opacity: 0.9; } .blog-details-post .blog-details-content .techmax-post-pagination { display: flex; flex-wrap: wrap; background: #ffffff; box-shadow: 0px 0px 70px 0px rgba(0, 0, 0, 0.16); padding: 10px 30px; margin-top: 80px; overflow: hidden; position: relative; } @media only screen and (max-width: 1199px) { .blog-details-post .blog-details-content .techmax-post-pagination { padding: 10px 20px; } } @media only screen and (max-width: 575px) { .blog-details-post .blog-details-content .techmax-post-pagination { padding: 0 10px; } } .blog-details-post .blog-details-content .techmax-post-pagination::before { position: absolute; content: ''; width: 1px; background-color: #e1e1e1; left: 50%; transform: translateX(-50%); top: 30px; bottom: 30px; } @media only screen and (max-width: 767px) { .blog-details-post .blog-details-content .techmax-post-pagination::before { width: auto; height: 1px; left: 30px; right: 30px; top: 50%; transform: translateY(-50%); bottom: auto; } } .blog-details-post .blog-details-content .techmax-post-pagination .previous-post, .blog-details-post .blog-details-content .techmax-post-pagination .next-post { width: 50%; } @media only screen and (max-width: 767px) { .blog-details-post .blog-details-content .techmax-post-pagination .previous-post, .blog-details-post .blog-details-content .techmax-post-pagination .next-post { width: 100%; } } .blog-details-post .blog-details-content .techmax-post-pagination .blog-pagination-post { display: flex; align-items: center; padding: 30px 0; } @media only screen and (max-width: 1199px) { .blog-details-post .blog-details-content .techmax-post-pagination .blog-pagination-post { padding: 20px 0; } } .blog-details-post .blog-details-content .techmax-post-pagination .blog-pagination-post .post-thumb { flex-shrink: 0; } .blog-details-post .blog-details-content .techmax-post-pagination .blog-pagination-post .post-thumb a img { width: 75px; height: 75px; border-radius: 50%; -o-object-position: center; object-position: center; -o-object-fit: cover; object-fit: cover; } .blog-details-post .blog-details-content .techmax-post-pagination .blog-pagination-post .post-thumb a i { font-size: 14px; color: #005de0; padding: 0 10px; } .blog-details-post .blog-details-content .techmax-post-pagination .blog-pagination-post .post-content { flex-grow: 1; padding: 0 20px; } @media only screen and (max-width: 1199px) { .blog-details-post .blog-details-content .techmax-post-pagination .blog-pagination-post .post-content { padding: 0 15px; } } @media only screen and (max-width: 575px) { .blog-details-post .blog-details-content .techmax-post-pagination .blog-pagination-post .post-content { padding: 0 13px; } } .blog-details-post .blog-details-content .techmax-post-pagination .blog-pagination-post .post-content .title { font-size: 16px; line-height: 24px; font-family: "Roboto", sans-serif; font-weight: 600; color: #333333; } @media only screen and (max-width: 1199px) { .blog-details-post .blog-details-content .techmax-post-pagination .blog-pagination-post .post-content .title { font-size: 15px; } } .blog-details-post .blog-details-content .techmax-post-pagination .blog-pagination-post .post-content .date { font-size: 12px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 400; color: #838383; } .blog-details-post .blog-details-content .techmax-post-pagination .blog-pagination-post .post-content .date i { color: #005de0; margin-right: 6px; } .blog-details-post .blog-details-content .comment-wrap .comment-box { margin-top: 50px; } .blog-details-post .blog-details-content .comment-wrap .comment-box .comment-title { font-size: 20px; line-height: 30px; color: #333333; } .blog-details-post .blog-details-content .comment-wrap .comment-box .comment-items li .single-comment { display: flex; padding: 30px 0; border-bottom: 1px solid #e1e1e1; } @media only screen and (max-width: 575px) { .blog-details-post .blog-details-content .comment-wrap .comment-box .comment-items li .single-comment { display: block; } } .blog-details-post .blog-details-content .comment-wrap .comment-box .comment-items li .single-comment .comment-author { flex-shrink: 0; } .blog-details-post .blog-details-content .comment-wrap .comment-box .comment-items li .single-comment .comment-author img { width: 75px; border-radius: 50%; } .blog-details-post .blog-details-content .comment-wrap .comment-box .comment-items li .single-comment .comment-content { flex-grow: 1; padding-left: 30px; } @media only screen and (max-width: 575px) { .blog-details-post .blog-details-content .comment-wrap .comment-box .comment-items li .single-comment .comment-content { padding-left: 0; padding-top: 25px; } } .blog-details-post .blog-details-content .comment-wrap .comment-box .comment-items li .single-comment .comment-content .name { font-size: 16px; font-weight: 700; } .blog-details-post .blog-details-content .comment-wrap .comment-box .comment-items li .single-comment .comment-content p { font-size: 14px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 400; margin-top: 5px; } .blog-details-post .blog-details-content .comment-wrap .comment-box .comment-items li .single-comment .comment-content .meta { margin-top: 10px; font-size: 14px; font-weight: 400; } .blog-details-post .blog-details-content .comment-wrap .comment-box .comment-items li .single-comment .comment-content .meta .date { margin-right: 30px; color: #005de0; } .blog-details-post .blog-details-content .comment-wrap .comment-box .comment-items li .comment-reply { padding-left: 105px; } @media only screen and (max-width: 767px) { .blog-details-post .blog-details-content .comment-wrap .comment-box .comment-items li .comment-reply { padding-left: 0; } } .blog-details-post .blog-details-content .comment-wrap .comment-form { margin-top: 50px; } .blog-details-post .blog-details-content .comment-wrap .comment-form .comment-title { font-size: 20px; line-height: 30px; color: #333333; } .blog-details-post .blog-details-content .comment-wrap .comment-form p { font-size: 14px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #686f7a; } .blog-details-post .blog-details-content .comment-wrap .comment-form .comment-form-wrap { padding-top: 10px; } .blog-details-post .blog-details-content .comment-wrap .comment-form .comment-form-wrap .single-form { margin-top: 20px; } .blog-details-post .blog-details-content .comment-wrap .comment-form .comment-form-wrap .single-form .form-control { border: 1px solid transparent; background: #f6f7f9; border-radius: 0; } .blog-details-post .blog-details-content .comment-wrap .comment-form .comment-form-wrap .single-form .form-control::-webkit-input-placeholder { opacity: 0.95; font-size: 13px; font-family: "Manrope", sans-serif; color: #9d9d9d; font-weight: 400; } .blog-details-post .blog-details-content .comment-wrap .comment-form .comment-form-wrap .single-form .form-control:-moz-placeholder { opacity: 0.95; font-size: 13px; font-family: "Manrope", sans-serif; color: #9d9d9d; font-weight: 400; } .blog-details-post .blog-details-content .comment-wrap .comment-form .comment-form-wrap .single-form .form-control::-moz-placeholder { opacity: 0.95; font-size: 13px; font-family: "Manrope", sans-serif; color: #9d9d9d; font-weight: 400; } .blog-details-post .blog-details-content .comment-wrap .comment-form .comment-form-wrap .single-form .form-control:-ms-input-placeholder { opacity: 0.95; font-size: 13px; font-family: "Manrope", sans-serif; color: #9d9d9d; font-weight: 400; } .blog-details-post .blog-details-content .comment-wrap .comment-form .comment-form-wrap .single-form .form-control:focus { outline: none; border-color: #005de0; } .blog-details-post .blog-details-content .comment-wrap .comment-form .comment-form-wrap .single-form textarea.form-control { height: 135px; padding-top: 15px; font-size: 13px; color: #415674; font-weight: 600; padding: 10px 25px; resize: none; } .blog-details-post .blog-details-content .comment-wrap .comment-form .comment-form-wrap .single-form textarea.form-control:focus { outline: none; box-shadow: none; } .blog-details-post .blog-details-content .comment-wrap .comment-form .comment-form-wrap .form-btn .btn { height: 40px; line-height: 36px; margin-top: 25px; font-size: 16px; padding: 0 40px; } /*-- /* 21 - Subscribe CSS /*----------------------------------------*/ .subscribe-section .subscribe-wrap { background: linear-gradient(-60deg, #54d6eb 0%, #035cdd 100%); background-repeat: no-repeat; background-size: cover; background-position: center center; padding: 115px 50px; border-radius: 10px; position: relative; z-index: 1; margin-bottom: -210px; } @media only screen and (max-width: 1199px) { .subscribe-section .subscribe-wrap { padding: 90px 50px; } } @media only screen and (max-width: 575px) { .subscribe-section .subscribe-wrap { padding: 50px; } } .subscribe-section .subscribe-wrap .subscribe-title { margin-bottom: 40px; } .subscribe-section .subscribe-wrap .subscribe-title .title { font-size: 36px; line-height: 40px; color: #ffffff; } @media only screen and (max-width: 575px) { .subscribe-section .subscribe-wrap .subscribe-title .title { font-size: 30px; } } .subscribe-section .subscribe-wrap .subscribe-title p { font-size: 20px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #ffffff; margin-top: 10px; } @media only screen and (max-width: 575px) { .subscribe-section .subscribe-wrap .subscribe-title p { font-size: 18px; } } .subscribe-section .subscribe-wrap form { position: relative; } .subscribe-section .subscribe-wrap form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]) { height: 60px; line-height: 60px; border: 0; padding-right: 170px; } .subscribe-section .subscribe-wrap form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-webkit-input-placeholder { opacity: 0.95; font-size: 18px; color: #93a1a2; font-family: "Manrope", sans-serif; font-weight: 400; } .subscribe-section .subscribe-wrap form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-moz-placeholder { opacity: 0.95; font-size: 18px; color: #93a1a2; font-family: "Manrope", sans-serif; font-weight: 400; } .subscribe-section .subscribe-wrap form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-moz-placeholder { opacity: 0.95; font-size: 18px; color: #93a1a2; font-family: "Manrope", sans-serif; font-weight: 400; } .subscribe-section .subscribe-wrap form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-ms-input-placeholder { opacity: 0.95; font-size: 18px; color: #93a1a2; font-family: "Manrope", sans-serif; font-weight: 400; } @media only screen and (max-width: 767px) { .subscribe-section .subscribe-wrap form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]) { height: 50px; line-height: 50px; } } @media only screen and (max-width: 575px) { .subscribe-section .subscribe-wrap form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]) { padding-right: 20px; } .subscribe-section .subscribe-wrap form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-webkit-input-placeholder { font-size: 16px; } .subscribe-section .subscribe-wrap form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-moz-placeholder { font-size: 16px; } .subscribe-section .subscribe-wrap form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-moz-placeholder { font-size: 16px; } .subscribe-section .subscribe-wrap form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-ms-input-placeholder { font-size: 16px; } } .subscribe-section .subscribe-wrap form button { height: 60px; position: absolute; right: 0; top: 0; border: 0; background: #005de0; color: #ffffff; padding: 0 40px; font-size: 16px; font-family: "Manrope", sans-serif; font-weight: 700; border-top-right-radius: 4px; border-bottom-right-radius: 4px; } @media only screen and (max-width: 767px) { .subscribe-section .subscribe-wrap form button { height: 50px; line-height: 50px; } } @media only screen and (max-width: 575px) { .subscribe-section .subscribe-wrap form button { position: relative; width: 100%; display: block; margin-top: 15px; border-top-left-radius: 4px; border-bottom-left-radius: 4px; } } /*-- /* 22 - FAQ CSS /*----------------------------------------*/ .faq-section { padding-bottom: 120px; } @media only screen and (max-width: 1199px) { .faq-section { padding-bottom: 100px; } } @media only screen and (max-width: 991px) { .faq-section { padding-bottom: 80px; } } @media only screen and (max-width: 767px) { .faq-section { padding-bottom: 60px; } } .faq-section .faq-wrap .faq-left { display: flex; } .faq-section .faq-wrap .faq-left .title { font-size: 48px; line-height: 60px; max-width: 250px; color: #333333; margin-left: 40px; } @media only screen and (max-width: 1199px) { .faq-section .faq-wrap .faq-left .title { font-size: 40px; line-height: 55px; margin-left: 30px; } } @media only screen and (max-width: 575px) { .faq-section .faq-wrap .faq-left .title { font-size: 30px; line-height: 40px; } } .faq-section .faq-wrap .faq-accordion { padding-left: 85px; } @media only screen and (max-width: 1199px) { .faq-section .faq-wrap .faq-accordion { padding-left: 0; } } @media only screen and (max-width: 991px) { .faq-section .faq-wrap .faq-accordion { margin-top: 50px; } } .faq-section .faq-wrap .faq-accordion .accordion-item { border: 0; margin-bottom: 10px; border-bottom: 1px solid #e5e5e5; } .faq-section .faq-wrap .faq-accordion .accordion-item:first-of-type { border-top-left-radius: 0; border-top-right-radius: 0; } .faq-section .faq-wrap .faq-accordion .accordion-item:first-of-type .accordion-button { border-top-left-radius: 0; border-top-right-radius: 0; } .faq-section .faq-wrap .faq-accordion .accordion-item .accordion-header { padding-top: 20px; padding-bottom: 30px; } .faq-section .faq-wrap .faq-accordion .accordion-item .accordion-header.header-one { padding-top: 0; } .faq-section .faq-wrap .faq-accordion .accordion-item .accordion-header .accordion-button { padding: 0; font-size: 22px; line-height: 30px; font-family: "Manrope", sans-serif; color: #333333; font-weight: 700; padding-right: 45px; position: relative; transition: all 0.3s linear; } .faq-section .faq-wrap .faq-accordion .accordion-item .accordion-header .accordion-button::after { display: none; } .faq-section .faq-wrap .faq-accordion .accordion-item .accordion-header .accordion-button .number { font-size: 18px; font-family: "Manrope", sans-serif; font-weight: 700; color: #333333; width: 40px; height: 40px; line-height: 40px; text-align: center; background: #f2f2f2; border-radius: 50%; margin-right: 20px; } .faq-section .faq-wrap .faq-accordion .accordion-item .accordion-header .accordion-button .faq-button { position: absolute; right: 0; height: 32px; width: 32px; color: #005de0; text-align: center; display: flex; align-items: center; justify-content: center; transform: rotate(90deg); transition: all 0.3s linear; } .faq-section .faq-wrap .faq-accordion .accordion-item .accordion-header .accordion-button .faq-button i { font-size: 15px; } .faq-section .faq-wrap .faq-accordion .accordion-item .accordion-header .accordion-button:focus { border: 0; box-shadow: none; } .faq-section .faq-wrap .faq-accordion .accordion-item .accordion-header .accordion-button:not(.collapsed) { color: #005de0; background: #ffffff; box-shadow: none; } .faq-section .faq-wrap .faq-accordion .accordion-item .accordion-header .accordion-button:not(.collapsed) .faq-button { position: absolute; right: 0; height: 32px; width: 32px; color: #005de0; text-align: center; transform: rotate(-90deg); transition: all 0.3s linear; } .faq-section .faq-wrap .faq-accordion .accordion-item .accordion-header .accordion-button:not(.collapsed) .faq-button i { font-size: 15px; } .faq-section .faq-wrap .faq-accordion .accordion-item .accordion-header .accordion-button:hover { color: #005de0; } .faq-section .faq-wrap .faq-accordion .accordion-item .accordion-body { padding: 0; padding-bottom: 20px; padding-right: 50px; } .faq-section .faq-wrap .faq-accordion .accordion-item .accordion-body p { font-size: 16px; line-height: 30px; color: #4c4d56; } .faq-section .faq-wrap .faq-accordion .accordion-item:hover .accordion-button .faq-button { transform: rotate(-90deg); } .faq-section-2 { background: #f2f2f2; background-repeat: no-repeat; background-size: cover; background-position: center center; } .faq-section-2 .faq-wrap .faq-left-wrap { padding-right: 110px; } .faq-section-2 .faq-wrap .faq-left img { width: 60px; } .faq-section-2 .faq-wrap .faq-left .title { max-width: 100%; margin-left: 30px; } .faq-section-2 .faq-wrap .faq-accordion { padding-left: 0; margin-top: 55px; } .faq-section-2 .faq-wrap .faq-accordion .accordion-item { background: none; border-bottom: 1px solid #c2c2c2; } .faq-section-2 .faq-wrap .faq-accordion .accordion-item .accordion-header .accordion-button { background: none; } .faq-section-2 .faq-wrap .faq-accordion .accordion-item .accordion-header .accordion-button .number { color: #ffffff; background: #005de0; } .faq-section-2 .faq-wrap .faq-accordion .accordion-item .accordion-header .accordion-button:not(.collapsed) { background: none; } .faq-section-2 .faq-wrap .faq-accordion .accordion-item .accordion-body { padding-right: 0; } .faq-section-2 .contact-form { background: #ffffff; border-radius: 10px; overflow: hidden; margin-left: 0; } @media only screen and (max-width: 991px) { .faq-section-2 .contact-form { margin-top: 60px; } } .faq-section-2 .contact-form .contact-form-wrap { padding: 60px; } @media only screen and (max-width: 1199px) { .faq-section-2 .contact-form .contact-form-wrap { padding: 40px; } } .faq-section-2 .contact-form .contact-form-wrap .heading-wrap { margin-bottom: 30px; } .faq-section-2 .contact-form .contact-form-wrap .heading-wrap .sub-title { font-size: 14px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 800; text-transform: uppercase; color: #005de0; } .faq-section-2 .contact-form .contact-form-wrap .heading-wrap .title { font-size: 42px; line-height: 54px; font-family: "Manrope", sans-serif; font-weight: 700; color: #333333; } @media only screen and (max-width: 1199px) { .faq-section-2 .contact-form .contact-form-wrap .heading-wrap .title { font-size: 32px; line-height: 48px; } } @media only screen and (max-width: 575px) { .faq-section-2 .contact-form .contact-form-wrap .heading-wrap .title { font-size: 28px; line-height: 40px; } } .faq-section-2 .contact-form .contact-form-wrap .single-form { margin-top: 25px; } .faq-section-2 .contact-form .contact-form-wrap .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]) { height: 55px; line-height: 55px; border: 1px solid #ebebeb; padding-left: 15px; } .faq-section-2 .contact-form .contact-form-wrap .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-webkit-input-placeholder { opacity: 0.95; font-size: 14px; color: #4c4d56; font-family: "Manrope", sans-serif; font-weight: 400; } .faq-section-2 .contact-form .contact-form-wrap .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-moz-placeholder { opacity: 0.95; font-size: 14px; color: #4c4d56; font-family: "Manrope", sans-serif; font-weight: 400; } .faq-section-2 .contact-form .contact-form-wrap .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-moz-placeholder { opacity: 0.95; font-size: 14px; color: #4c4d56; font-family: "Manrope", sans-serif; font-weight: 400; } .faq-section-2 .contact-form .contact-form-wrap .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-ms-input-placeholder { opacity: 0.95; font-size: 14px; color: #4c4d56; font-family: "Manrope", sans-serif; font-weight: 400; } .faq-section-2 .contact-form .contact-form-wrap .single-form textarea { height: 135px; border: 1px solid #ebebeb; padding-left: 15px; resize: none; } .faq-section-2 .contact-form .contact-form-wrap .single-form textarea::-webkit-input-placeholder { opacity: 0.95; font-size: 14px; color: #4c4d56; font-family: "Manrope", sans-serif; font-weight: 400; } .faq-section-2 .contact-form .contact-form-wrap .single-form textarea:-moz-placeholder { opacity: 0.95; font-size: 14px; color: #4c4d56; font-family: "Manrope", sans-serif; font-weight: 400; } .faq-section-2 .contact-form .contact-form-wrap .single-form textarea::-moz-placeholder { opacity: 0.95; font-size: 14px; color: #4c4d56; font-family: "Manrope", sans-serif; font-weight: 400; } .faq-section-2 .contact-form .contact-form-wrap .single-form textarea:-ms-input-placeholder { opacity: 0.95; font-size: 14px; color: #4c4d56; font-family: "Manrope", sans-serif; font-weight: 400; } .faq-section-2 .contact-form .contact-form-wrap .form-btn { margin-top: 25px; } .faq-section-2 .contact-form .contact-form-wrap .form-btn .btn { font-size: 16px; width: 100%; height: 55px; line-height: 50px; margin-bottom: 10px; } @media only screen and (max-width: 575px) { .faq-section-2 .contact-form .contact-form-wrap .form-btn .btn { padding: 0 45px; } } @media only screen and (max-width: 1199px) { .faq-section-2 .faq-wrap .faq-left-wrap { padding-right: 40px; } } @media only screen and (max-width: 991px) { .faq-section-2 .faq-wrap .faq-left-wrap { padding-right: 0px; } } .faq-section-3 .faq-wrap .faq-accordion { position: relative; padding-left: 120px; } .faq-section-3 .faq-wrap .faq-accordion::before { content: ""; position: absolute; left: 0; top: 0; background: #e1e1e1; width: 1px; height: 100%; } @media only screen and (max-width: 991px) { .faq-section-3 .faq-wrap .faq-accordion { padding-left: 0; } .faq-section-3 .faq-wrap .faq-accordion::before { display: none; } } /*-- /* 23 - Overview CSS /*----------------------------------------*/ .overview-section .overview-wrap .overview-img .image { -webkit-animation: round-01 5s linear infinite; animation: round-01 5s linear infinite; } .overview-section .overview-wrap .overview-content { padding-left: 95px; padding-top: 65px; } @media only screen and (max-width: 1199px) { .overview-section .overview-wrap .overview-content { padding-left: 50px; padding-top: 0; } } @media only screen and (max-width: 991px) { .overview-section .overview-wrap .overview-content { padding-left: 0px; margin-top: 60px; } } .overview-section .overview-wrap .overview-content .section-title .title { font-size: 48px; line-height: 60px; } @media only screen and (max-width: 1199px) { .overview-section .overview-wrap .overview-content .section-title .title { font-size: 36px; line-height: 48px; } } @media only screen and (max-width: 767px) { .overview-section .overview-wrap .overview-content .section-title .title { font-size: 28px; line-height: 40px; } } .overview-section .overview-wrap .overview-content .overview-list { padding-top: 40px; } .overview-section .overview-wrap .overview-content .overview-list ul li { display: flex; align-items: flex-start; font-size: 16px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 700; color: #333333; } .overview-section .overview-wrap .overview-content .overview-list ul li .overview-icon { color: #5149f3; margin-right: 8px; } .overview-section .overview-wrap .overview-content .overview-list ul li + li { margin-top: 15px; } .overview-section .overview-wrap .overview-content .btn { margin-top: 50px; } @-webkit-keyframes round-01 { 0% { transform: rotate(5deg); } 50% { transform: rotate(0deg); } 100% { transform: rotate(5deg); } } @keyframes round-01 { 0% { transform: rotate(5deg); } 50% { transform: rotate(0deg); } 100% { transform: rotate(5deg); } } .overview-section-2 .overview-wrap .overview-content { padding-right: 95px; padding-top: 65px; } @media only screen and (max-width: 1399px) { .overview-section-2 .overview-wrap .overview-content { padding-top: 50px; padding-right: 30px; } } .overview-section-2 .overview-wrap .overview-content .section-title .title { font-size: 48px; line-height: 60px; } .overview-section-2 .overview-wrap .overview-content .text { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #4c4d56; margin-top: 40px; padding-right: 115px; } .overview-section-2 .overview-wrap .overview-content .counter-wrap { display: flex; padding-top: 50px; } .overview-section-2 .overview-wrap .overview-content .counter-wrap .counter-item:last-child { margin-left: 95px; } .overview-section-2 .overview-wrap .overview-content .counter-wrap .counter-item span { font-size: 50px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 700; color: #005de0; } .overview-section-2 .overview-wrap .overview-content .counter-wrap .counter-item p { font-size: 14px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #4c4d56; } .overview-section-2 .overview-wrap .overview-img { padding: 0 25px; position: relative; z-index: 1; } .overview-section-2 .overview-wrap .overview-img .shape { position: absolute; left: 60px; top: 30px; z-index: -1; max-width: 560px; -webkit-animation: round-01 5s linear infinite; animation: round-01 5s linear infinite; } @media only screen and (max-width: 1199px) { .overview-section-2 .overview-wrap .overview-content { padding-top: 0; padding-right: 50px; } .overview-section-2 .overview-wrap .overview-content .section-title .title { font-size: 36px; line-height: 48px; } .overview-section-2 .overview-wrap .overview-content .text { padding-right: 0; } .overview-section-2 .overview-wrap .overview-content .counter-wrap { padding-top: 40px; } .overview-section-2 .overview-wrap .overview-img { padding: 0 10px; } } @media only screen and (max-width: 991px) { .overview-section-2 .overview-wrap .overview-img { padding: 0 40px; margin-top: 60px; } .overview-section-2 .overview-wrap .overview-img .shape { left: 90px; top: 35px; } } @media only screen and (max-width: 767px) { .overview-section-2 .overview-wrap .overview-content .section-title .title { font-size: 28px; line-height: 40px; } } @media only screen and (max-width: 575px) { .overview-section-2 .overview-wrap .overview-img { padding: 0 20px; } } .overview-section-3 .overview-wrap .overview-img { position: relative; z-index: 1; } .overview-section-3 .overview-wrap .overview-img .shape-1 { position: absolute; left: 0; top: 0; z-index: -1; } .overview-section-3 .overview-wrap .overview-img .image { text-align: center; padding-top: 80px; } .overview-section-3 .overview-wrap .overview-content { padding-left: 0; padding-top: 30px; } .overview-section-3 .overview-wrap .overview-content .section-title .title { font-size: 40px; line-height: 54px; color: #333333; } @media only screen and (max-width: 1199px) { .overview-section-3 .overview-wrap .overview-content .section-title .title { font-size: 36px; line-height: 48px; } } @media only screen and (max-width: 575px) { .overview-section-3 .overview-wrap .overview-content .section-title .title { font-size: 30px; line-height: 42px; } } .overview-section-3 .overview-wrap .overview-content .text { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #4c4d56; margin-top: 25px; } .overview-section-3 .overview-wrap .overview-content .overview-list { padding-top: 40px; } .overview-section-3 .overview-wrap .overview-content .overview-list ul li { display: flex; align-items: flex-start; font-size: 16px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 700; color: #333333; } .overview-section-3 .overview-wrap .overview-content .overview-list ul li .overview-icon { color: #005de0; margin-right: 8px; } .overview-section-3 .overview-wrap .overview-content .overview-list ul li + li { margin-top: 15px; } .overview-section-3 .overview-wrap .overview-content .btn { height: 50px; line-height: 45px; font-size: 14px; padding: 0 55px; margin-top: 50px; } @media only screen and (max-width: 991px) { .overview-section-3 .overview-wrap .overview-content { margin-top: 120px; } } @media only screen and (max-width: 767px) { .overview-section-3 .overview-wrap .overview-content { margin-top: 20px; } } @media only screen and (max-width: 449px) { .overview-section-3 .overview-wrap .overview-img .shape-1 { top: 35px; } } .overview-section-4 { padding-top: 70px; padding-bottom: 120px; } .overview-section-4 .overview-wrap .overview-img .image { text-align: right; padding-top: 0; } .overview-section-4 .overview-wrap .overview-content { padding-top: 50px; padding-right: 90px; } @media only screen and (max-width: 1199px) { .overview-section-4 { padding-top: 40px; } .overview-section-4 .overview-wrap .overview-content { padding-right: 0px; } } @media only screen and (max-width: 991px) { .overview-section-4 { padding-top: 0px; } .overview-section-4 .overview-wrap .overview-img .image { text-align: center; margin-top: 65px; } .overview-section-4 .overview-wrap .overview-content { padding-top: 0px; padding-right: 0px; margin-top: 0; } } .overview-section-5 { background: #0b0f20; position: relative; z-index: 1; } .overview-section-5 .overview-wrap .overview-img { position: relative; z-index: 1; } .overview-section-5 .overview-wrap .overview-img .shape-1 { position: absolute; left: 0; bottom: -100px; z-index: -1; } .overview-section-5 .overview-wrap .overview-img .image { padding-left: 75px; -webkit-animation: up-down 5s infinite; animation: up-down 5s infinite; } .overview-section-5 .overview-wrap .overview-content { padding-left: 0; padding-top: 30px; } .overview-section-5 .overview-wrap .overview-content .section-title2 .title { text-transform: uppercase; } .overview-section-5 .overview-wrap .overview-content .text { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #ffffff; margin-top: 25px; } .overview-section-5 .overview-wrap .overview-content .overview-list { padding-top: 10px; } .overview-section-5 .overview-wrap .overview-content .overview-list ul li { display: flex; align-items: flex-start; font-size: 16px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 700; color: #ffffff; margin-top: 20px; } .overview-section-5 .overview-wrap .overview-content .overview-list ul li .overview-icon { width: 28px; height: 28px; line-height: 28px; text-align: center; font-size: 14px; border-radius: 50%; background: #005de0; color: #ffffff; margin-right: 8px; } .overview-section-5 .overview-wrap .overview-content .overview-list ul li + li { margin-top: 15px; } .overview-section-5 .overview-wrap .overview-content .btn { height: 50px; line-height: 45px; font-size: 14px; padding: 0 55px; margin-top: 50px; } @media only screen and (max-width: 991px) { .overview-section-5 .overview-wrap .overview-content { margin-top: 120px; } } @media only screen and (max-width: 767px) { .overview-section-5 .overview-wrap .overview-img .image { padding-left: 30px; } } @media only screen and (max-width: 575px) { .overview-section-5 .overview-wrap .overview-img .shape-1 { bottom: -75px; } .overview-section-5 .overview-wrap .overview-img .image { padding-left: 0px; } .overview-section-5 .overview-wrap .overview-content { margin-top: 100px; } } @media only screen and (max-width: 449px) { .overview-section-5 .overview-wrap .overview-img .shape-1 { bottom: -55px; } .overview-section-5 .overview-wrap .overview-content { margin-top: 70px; } } .overview-section-6 { background: #0b0f20; position: relative; padding-top: 30px; z-index: 1; } .overview-section-6 .shape-1 { position: absolute; left: -4%; bottom: -40%; z-index: -1; } .overview-section-6 .overview-wrap .overview-content { padding-left: 0; padding-top: 90px; } .overview-section-6 .overview-wrap .overview-content .section-title2 .title { text-transform: uppercase; } .overview-section-6 .overview-wrap .overview-content .text { font-size: 16px; line-height: 30px; font-family: "Manrope", sans-serif; font-weight: 400; color: #ffffff; margin-top: 25px; } .overview-section-6 .overview-wrap .overview-content .overview-list { padding-top: 10px; } .overview-section-6 .overview-wrap .overview-content .overview-list ul li { position: relative; font-size: 16px; line-height: 24px; font-family: "Manrope", sans-serif; font-weight: 700; color: #ffffff; margin-top: 20px; padding-left: 25px; } .overview-section-6 .overview-wrap .overview-content .overview-list ul li::before { content: ""; position: absolute; left: 0; top: 50%; background: #005de0; width: 15px; height: 15px; border-radius: 50%; transform: translateY(-50%); } .overview-section-6 .overview-wrap .overview-content .overview-list ul li + li { margin-top: 15px; } .overview-section-6 .overview-wrap .overview-content .btn { height: 50px; line-height: 45px; font-size: 14px; padding: 0 40px; margin-top: 30px; } .overview-section-6 .overview-wrap .overview-img .image { padding-left: 0px; -webkit-animation: round-01 5s linear infinite; animation: round-01 5s linear infinite; } @media only screen and (max-width: 1199px) { .overview-section-6 { padding-bottom: 100px; } .overview-section-6 .shape-1 { width: 620px; left: -12%; } } @media only screen and (max-width: 991px) { .overview-section-6 { padding-top: 0; padding-bottom: 80px; overflow: hidden; } .overview-section-6 .shape-1 { width: 550px; left: -14%; bottom: 22%; } .overview-section-6 .overview-wrap .overview-content { padding-top: 0px; } } @media only screen and (max-width: 767px) { .overview-section-6 { padding-bottom: 60px; } .overview-section-6 .shape-1 { width: 450px; bottom: 30%; } } @media only screen and (max-width: 767px) { .overview-section-6 .shape-1 { width: 390px; } } /*-- /* 24 - Login Register CSS /*----------------------------------------*/ .login-register-section .login-register-wrap { margin-top: -50px; } .login-register-section .login-register-wrap .section-title .title { font-size: 36px; font-weight: 700; color: #333333; line-height: 1.2; margin-top: -8px; } .login-register-section .login-register-wrap .login-register-box { border: 1px solid #ebebeb; padding: 40px; border-radius: 10px; margin-top: 50px; } .login-register-section .login-register-wrap .login-register-box .login-register-form .single-form { margin-top: 20px; } .login-register-section .login-register-wrap .login-register-box .login-register-form .single-form .form-control { border: 1px solid transparent; background: #f6f7f9; border-radius: 0; } .login-register-section .login-register-wrap .login-register-box .login-register-form .single-form .form-control::-webkit-input-placeholder { opacity: 0.95; font-size: 14px; font-family: "Manrope", sans-serif; color: #787884; font-weight: 400; } .login-register-section .login-register-wrap .login-register-box .login-register-form .single-form .form-control:-moz-placeholder { opacity: 0.95; font-size: 14px; font-family: "Manrope", sans-serif; color: #787884; font-weight: 400; } .login-register-section .login-register-wrap .login-register-box .login-register-form .single-form .form-control::-moz-placeholder { opacity: 0.95; font-size: 14px; font-family: "Manrope", sans-serif; color: #787884; font-weight: 400; } .login-register-section .login-register-wrap .login-register-box .login-register-form .single-form .form-control:-ms-input-placeholder { opacity: 0.95; font-size: 14px; font-family: "Manrope", sans-serif; color: #787884; font-weight: 400; } .login-register-section .login-register-wrap .login-register-box .login-register-form .single-form .form-control:focus { outline: none; border-color: #005de0; } .login-register-section .login-register-wrap .login-register-box .login-register-form .single-form textarea.form-control { height: 135px; font-size: 13px; color: #415674; font-weight: 600; padding: 10px 25px; padding-top: 15px; resize: none; } .login-register-section .login-register-wrap .login-register-box .login-register-form .single-form textarea.form-control:focus { outline: none; box-shadow: none; } .login-register-section .login-register-wrap .login-register-box .login-register-form .single-form .form-check-input { margin-right: 8px; margin-top: 5px; } .login-register-section .login-register-wrap .login-register-box .login-register-form .single-form .form-check-input:focus { box-shadow: none; } .login-register-section .login-register-wrap .login-register-box .login-register-form .single-form .form-check-label { display: inline; font-size: 15px; line-height: 22px; margin-bottom: 0; text-transform: none; } .login-register-section .login-register-wrap .login-register-box .login-register-form .form-btn { margin-top: 30px; } .login-register-section .login-register-wrap .login-register-box .login-register-form .form-btn .btn { height: 50px; line-height: 45px; width: 100%; } /*----------------------------------------*/ /* 05. Widget CSS /*----------------------------------------*/ /*-- /* 5.1 - Sidebar Widget CSS /*----------------------------------------*/ .sidebar-wrap { border-left: 1px solid #eeeeee; height: 100%; } @media only screen and (max-width: 991px), only screen and (max-width: 767px) { .sidebar-wrap { border-left: none; height: auto; padding-top: 0; } } .widget { margin-bottom: 40px; color: #4c4d56; } .widget:last-child { margin-bottom: 0; } .widget .widget-title { border-bottom: 1px solid #eeeeee; padding-left: 20px; padding-bottom: 20px; } @media only screen and (max-width: 991px), only screen and (max-width: 767px) { .widget .widget-title { padding-left: 0; } } /*-- /* 25.1 - Footer Widget CSS /*----------------------------------------*/ .footer-widget-wrap { padding-top: 190px; padding-bottom: 70px; } .footer-widget { margin-top: 30px; } .footer-widget.footer-widget-info { background: #1f2428; padding: 40px 30px; border-radius: 5px; } .footer-widget.footer-widget-1 { padding-left: 30px; } @media only screen and (max-width: 1199px) { .footer-widget.footer-widget-1 { padding-left: 60px; } } @media only screen and (max-width: 991px) { .footer-widget.footer-widget-1 { padding-left: 0px; } } .widget-info { padding-top: 20px; } .widget-info ul li { display: flex; align-items: center; flex-wrap: nowrap; margin-top: 10px; } .widget-info ul li .info-icon i { display: inline-block; color: #005de0; font-size: 18px; margin-right: 10px; margin-top: 2px; } .widget-info ul li .info-text { font-size: 16px; line-height: 20px; font-family: "Manrope", sans-serif; font-weight: 600; color: #c4c5c7; } .footer-widget .footer-widget-title { font-size: 20px; font-family: "Manrope", sans-serif; font-weight: 700; color: #ffffff; } .widget-link { padding-top: 22px; } .widget-link .link li { margin-top: 7px; } .widget-link .link li a { font-size: 14px; font-family: "Manrope", sans-serif; font-weight: 400; color: #c4c5c7; transition: all 0.3s linear; } .widget-link .link li a:hover { color: #005de0; padding-left: 10px; } .footer-widget-wrap-2 { padding-top: 80px; } .widget-info-2 ul li .info-icon i { color: #5149f3; } .widget-info-2 ul li .info-text { color: #666666; } .widget-info-2 ul li .info-text a:hover { color: #5149f3; } .footer-widget-2 .footer-widget-title { color: #5149f3; } .footer-widget-2 .widget-link .link li a { color: #666666; } .footer-widget-2 .widget-link .link li a:hover { color: #5149f3; padding-left: 10px; } .footer-widget-wrap-3 { padding-top: 80px; } .widget-info-3 ul li .info-icon i { color: #ff5538; } .widget-info-3 ul li .info-text { color: #666666; } .widget-info-3 ul li .info-text a:hover { color: #ff5538; } .footer-widget-3 .footer-widget-title { color: #ff5538; } .footer-widget-3 .widget-link .link li a { color: #666666; } .footer-widget-3 .widget-link .link li a:hover { color: #ff5538; padding-left: 10px; } .footer-widget-wrap-3 { padding-top: 290px; } @media only screen and (max-width: 767px) { .footer-widget-wrap-3 { padding-top: 270px; } } .widget-info-4 ul li .info-icon i { color: #005de0; } .widget-info-4 ul li .info-text { color: #666666; } .widget-info-4 ul li .info-text a:hover { color: #005de0; } .footer-widget-4 .footer-widget-title { color: #005de0; } .footer-widget-4 .widget-link .link li a { color: #666666; } .footer-widget-4 .widget-link .link li a:hover { color: #005de0; padding-left: 10px; } .footer-widget-5 .widget-link .link li a { color: #ffffff; } .footer-widget-5 .widget-link .link li a:hover { color: #005de0; padding-left: 10px; } /*-- /* 25. Footer CSS /*----------------------------------------*/ .footer-section { background: #000c29; background-repeat: no-repeat; background-size: cover; background-position: center; } .footer-logo { max-width: 170px; } .footer-copyright-area { border-top: 1px solid #1a253f; padding-top: 15px; padding-bottom: 30px; } .copyright-text { margin-top: 15px; } @media only screen and (max-width: 767px) { .copyright-text { text-align: center; } } .copyright-text p { font-size: 14px; font-family: "Manrope", sans-serif; font-weight: 400; color: #c4c5c7; } .copyright-social { text-align: right; } @media only screen and (max-width: 767px) { .copyright-social { text-align: center; } } .copyright-social .social li { display: inline-block; margin-right: 10px; } .copyright-social .social li a { width: 40px; height: 40px; line-height: 40px; border-radius: 50%; text-align: center; background: #15203b; font-size: 18px; color: #ffffff; transition: all 0.3s linear; } .copyright-social .social li a:hover { color: #005de0; } .footer-section-2 { background: #f8f8fb; background-repeat: no-repeat; background-size: cover; background-position: center; } .footer-copyright-2 { border-top: 1px solid #c6c6c9; } .footer-copyright-2 .copyright-text p { color: #666666; } .footer-copyright-2 .copyright-text p a { font-weight: 700; color: #5149f3; } .footer-copyright-2 .copyright-social .social li a { background: #5149f3; color: #ffffff; transition: all 0.3s linear; } .footer-copyright-2 .copyright-social .social li a:hover { background: #005de0; color: #ffffff; } .footer-section-3 { background: #f8f8fb; background-repeat: no-repeat; background-size: cover; background-position: center; } .footer-copyright-3 { border-top: 1px solid #c6c6c9; } .footer-copyright-3 .copyright-text p { color: #666666; } .footer-copyright-3 .copyright-text p a { font-weight: 700; color: #ff5538; } .footer-copyright-3 .copyright-social .social li a { background: #ff5538; color: #ffffff; transition: all 0.3s linear; } .footer-copyright-3 .copyright-social .social li a:hover { color: rgba(255, 255, 255, 0.9); } .footer-section-4 { background: #0a0712; background-repeat: no-repeat; background-size: cover; background-position: center; } .footer-section-5 { background: #ffffff; } .footer-copyright-4 .copyright-text p a { color: #005de0; } .footer-copyright-4 .copyright-social .social li a { background: #005de0; color: #ffffff; transition: all 0.3s linear; } .footer-copyright-4 .copyright-social .social li a:hover { color: rgba(255, 255, 255, 0.9); } .progress-wrap { position: fixed; right: 50px; bottom: 50px; height: 45px; width: 45px; cursor: pointer; display: block; border-radius: 50px; box-shadow: inset 0 0 0 2px rgba(0, 93, 224, 0.2); opacity: 0; visibility: hidden; transform: translateX(130%); z-index: 99; transition: all 200ms linear; } .progress-wrap::after { position: absolute; content: "\f108"; font-family: flaticon !important; text-align: center; line-height: 45px; font-size: 18px; color: #005de0; left: 0; top: 0; height: 46px; width: 46px; transform: rotate(90deg); cursor: pointer; display: block; z-index: 1; } .progress-wrap svg path { fill: none; } .progress-wrap svg.progress-circle path { stroke: #005de0; stroke-width: 4; box-sizing: border-box; } .progress-wrap.active-progress { opacity: 1; visibility: visible; transform: translateX(0); } .progress-wrap-3 { box-shadow: inset 0 0 0 2px rgba(255, 85, 56, 0.2); } .progress-wrap-3::after { color: #ff5538; } .progress-wrap-3 svg.progress-circle path { stroke: #ff5538; } *{ margin: 0; padding: 0; box-sizing: border-box; } #banner { width: 980px; height: 600px; margin: 0 auto; display: flex; overflow: hidden; position: relative; & img { display: block; object-fit: cover; animation: slide 6s cubic-bezier(.86, 0, .07, 1) infinite alternate; } } #banner-heading{ position: absolute; inset: 30% 20%; & h1{ color: #fff; font-size: 80px; } }