.fixed-top { padding: 10px 0; border-bottom: 1px solid #1c498033; } .who-we .items-ser { position: relative; } span.mobile-nav { font-size: 42px; position: fixed; top: 0; right: 0; display: none; line-height: 0; background: var(--bg-blue); } .bi-x { display: none !important; -webkit-transition: all .4s; transition: all .4s; } span.mobile-nav.open .bi-list { display: none; } span.mobile-nav.open .bi-x { display: block !important; } /*menu*/ .headmenu { background: var(--bg-white); margin-top: 0; } ul.navigation { display: flex; flex-wrap: wrap; } .nav ul { margin: 0; padding: 0; list-style-type: none; } .headmenu .nav ul li a { padding: 10px; position: relative; font-weight: 600; color: #000; text-transform: capitalize; background: none; font-size: 16px; display: block; text-decoration: none; } .headmenu .nav li.current_page_item a { color: var(--bg-blue); } .headmenu .nav ul li { padding: 0px 1px; position: relative; z-index: 1; } .navigation ul { position: absolute; padding: 20px; top: 40px; opacity: 0; left: 0; background-color: var(--bg-white); min-width: 220px; transition: 0.3s; padding-top: 15px; padding-bottom: 15px; border-radius: 3px; box-shadow: 2px 20px 20px 0px #0c08081f; height: 0; overflow: hidden; } .headmenu nav ul li>ul.subNav li a { color: #000; padding: 10px 0; border-bottom: 1px solid #eee; font-size: 14px; } .headmenu nav ul li:hover>ul.subNav { opacity: 1; transition: .3s; height: auto; } a.mobile-nav-trigger.open { position: fixed; right: 0; z-index: 99999; width: 49px; background: var(--bg-yellow); top: 0; left: auto; color: var(--bg-white) !important; } a.mobile-nav-trigger.open .bi-list { display: none; } a.mobile-nav-trigger .bi-x { display: none; -webkit-transition: all .4s; transition: all .4s; } a.mobile-nav-trigger.open .bi-x { display: none; } .mobileApp { position: relative; } .mobileApp .container { position: relative; } @supports (animation-timeline: view()) { .webDev { --index0: calc(var(--index) - 1); /* 0-based index */ --reverse-index: calc(var(--numcards) - var(--index0)); /* reverse index */ --reverse-index0: calc(var(--reverse-index) - 1); /* 0-based reverse index */ } @keyframes scale { to { transform: scale(calc(1.1 - calc(0.1 * var(--reverse-index)))); } } #cards { --numcards: 4; view-timeline-name: --cards-element-scrolls-in-body; } .card__content { --start-range: calc(var(--index0) / var(--numcards) * 100%); --end-range: calc((var(--index)) / var(--numcards) * 100%); animation: linear scale forwards; animation-timeline: --cards-element-scrolls-in-body; animation-range: exit-crossing var(--start-range) exit-crossing var(--end-range); } } #cards { padding-bottom: calc(var(--numcards) * var(--card-top-offset)); margin-bottom: var(--card-margin); } #card_1 { --index: 1; } #card_2 { --index: 2; } #card_3 { --index: 3; } #card_4 { --index: 4; } .hiring_update .accordion-button::after { display: none; } .hiring_update button.accordion-button.collapsed { box-shadow: 0px 10px 40px 0px rgba(24, 26.000000000000007, 32, 0.08); } .for_required span { font-weight: 500; font-size: 18px; } .hiring_update .accordion-button:focus { box-shadow: none; } .more-details a { background-color: var(--darkColor); display: inline-block; padding: 12px 18px; border-radius: 4px; color: #fff; } button.accordion-button { box-shadow: 0px 10px 40px 0px rgba(24, 26.000000000000007, 32, 0.08) !important; } .hiring_update .accordion-button:not(.collapsed) { color: #212529 !important; } .hiring_update .accordion-item { border: none; } .heading_qaute { font-size: 2rem; } hr.hr-item { margin: 0 0 40px; } /* wait */ .callBox { display: block; justify-content: end; position: fixed; align-items: center; top: 150px; right: -175px; background: #131b5f; color: #fff; padding: 10px; border-radius: 5px 0 0 5px; transition: 1s; } .callBox a { color: #fff; display: block; padding-left: 8px; } .call-icon { position: absolute; background: #fff; left: -66px; top: 0; display: flex; align-items: center; font-size: 41px; width: 68px; height: 80px; justify-content: center; border-radius: 50px 0 0 50px; border-right: 1px solid #edf2fa; box-shadow: 0px 0px 40px 0px rgba(0, 0, 0, 0.10196078431372549); } .callBox:hover { right: 0; } .iCon i { font-size: 23px; color: #004aad; } .iCon { display: flex; gap: 8px; } .web-logo { /* text-align: center; */ /* margin: auto; */ justify-content: center; display: flex; /* background-color: #fff; */ } .web-logo img { max-width: 180px; background-color: #fff; padding: 10px 12px; border-radius: 4px; } @media (max-width: 767.98px) { .toggle-icon { cursor: pointer; font-size: 18px; margin-left: auto; color: #fff; } } @media screen and (min-width:200px) and (max-width:991px) { ul.navigation { display: block; } .headmenu nav.nav.mobile-menu { position: fixed; left: 0; background: var(--bg-blue); overflow: auto; top: 0; display: block; margin: 0; bottom: 0; max-width: 75%; width: 350px; z-index: 9999; left: -75%; -webkit-transition: all .4s; transition: all .4s; padding-top: 20px; } .headmenu.open nav.nav.mobile-menu { left: 0; } span.mobile-nav { display: block; } .headmenu .nav li.current_page_item a { color: #fff; } .headmenu .nav ul li a { color: #fff; } .navigation ul { position: relative; height: auto; opacity: 1; top: 0; padding: 15px; left: 13px; } .call-us { margin-right: 0px; } img.icon-left { top: -48px; max-width: 50px; left: 0; } img.icon-right { bottom: -28px; left: auto; max-width: 50px; right: 0; } } @media screen and (min-width:100px) and (max-width:575px) { ul.privacy-menu span { display: none; } .header .item-right a { font-size: 28px !important; color: #004aad !important; font-weight: 600 !important; margin-left: 0 !important; } .v-center { padding: 7px } } @media screen and (min-width:576px) and (max-width:767px) { .section-service-detail .element-item { width: 50%; } } @media screen and (min-width:768px) and (max-width:1199px) { .section-service-detail .element-item { width: 33%; } } @media screen and (min-width:100px) and (max-width:479px) { .stycky-phone { display: block; background: var(--bg-yellow); color: var(--bg-black); text-align: center; padding: 5px; justify-content: center; padding-top: 0; gap: 10px; font-size: 24px; font-weight: bold; } .stycky-phone a { color: var(--bg-white); font-size: 20px; } .fixed-top .container .btn { display: none; } a.logo.m-0 { display: flex; justify-content: center; width: 100%; } .fixed-top { padding: 0; } .call-us { display: none !important; } a.logo.m-0 { justify-content: start; } .fixed-top { padding: 10px 0; } span.mobile-nav { color: #fff; top: 10px; } .itembox { display: block; text-align: center; padding: 15px; } .itembox .icon-item { margin-bottom: 10px; } } @media screen and (min-width:100px) and (max-width:767px) { .view-all-service { flex-wrap: wrap; } .service-items.colum { flex-direction: column; } .service-items .text-areas { min-height: auto; padding: 10px; } .service-info { display: block; text-align: center; margin-bottom: 25px; } .service-items-img { width: 300px; height: 300px; min-width: 300px; margin: auto; margin-bottom: 12px; } .C-page { top: 0 !important; } div#cards .list-items { display: block; text-align: center; } .coTact-bx { display: block; text-align: center; } } @media screen and (min-width:480px) and (max-width:991px) { .stycky-phone { display: none; } span.mobile-nav { color: var(--bg-white); top: 8px; } a.logo img { max-width: 150px; } .fixed-top .container .btn { padding: 0; background: transparent; border: 0; color: var(--bg-yellow); font-size: 24px; font-weight: bold; margin-right: 40px; } } /*header css start*/ :before, :after { box-sizing: border-box; } ul.square { list-style: none; margin: 0; padding: 0; } ul.square li { position: relative; margin-bottom: 5px; } ul.square li:before { display: inline-block; content: "\F2EF"; font-size: 14px; font-family: "bootstrap-icons"; margin-right: 5px; } .seo-card { box-shadow: 0 0 10px #00000030; padding: 30px; border-radius: 20px; } .v-center { align-items: center; position: relative; } ul.menu-main { padding: 0; margin: 0; } a { text-decoration: none; } /* header */ .header { display: block; width: 100%; position: relative; z-index: 99; padding: 0; } .header .item-left { max-width: 200px; } .header .logo a { font-size: 30px; color: #000000; font-weight: 700; text-decoration: none; } .header .item-center { width: auto; margin: auto; } .header .item-right { display: flex; justify-content: end; position: relative; align-items: center; } .header .item-right a { text-decoration: none; font-size: 16px; color: #ffb300; display: inline-block; margin-left: 10px; transition: color 0.3s ease; } .header .menu>ul>li { display: inline-block; line-height: 35px; margin-left: 17px; } .header .menu>ul>li>a { font-size: 15px; position: relative; transition: color 0.3s ease; display: inline-block; padding: 15px 10px; color: var(--darkColor); background: transparent; text-transform: uppercase; font-weight: 500; } .header .menu>ul>li .sub-menu { position: absolute; z-index: 500; background-color: #ffffff; box-shadow: -2px 15px 42px -25px rgba(0, 0, 0, 0.3); padding: 20px 30px; transition: all 0.5s ease; margin-top: 25px; visibility: hidden; top: -999px; z-index: -1; } .zoom-in-zoom-out { animation: zoom-in-zoom-out 2s ease-out infinite; } @keyframes zoom-in-zoom-out { 0% { transform: scale(1, 1); } 50% { transform: scale(1.5, 1.5); } 100% { transform: scale(1, 1); } } @media(min-width: 992px) { .header .menu>ul>li.menu-item-has-children:hover .sub-menu { margin-top: 0; visibility: visible; top: 65px; } } .header .menu>ul>li .sub-menu>ul>li { line-height: 1; } .header .menu>ul>li .sub-menu>ul>li>a { display: inline-block; padding: 10px 0; font-size: 15px; color: #555555; transition: color 0.3s ease; text-decoration: none; text-transform: capitalize; } .header .menu>ul>li .single-column-menu { min-width: 280px; max-width: 350px; } .header .menu>ul>li .sub-menu.mega-menu>.list-item>ul>li { line-height: 1; display: block; } .header .menu>ul>li .sub-menu.mega-menu>.list-item>ul>li>a { padding: 10px 0; display: inline-block; font-size: 15px; color: #555555; transition: color 0.3s ease; } .header .menu>ul>li .sub-menu.mega-menu { left: 50%; transform: translateX(-50%); } .header .menu>ul>li .sub-menu.mega-menu-column-4 { max-width: 100%; width: 100%; display: flex; flex-wrap: wrap; padding: 20px 15px; border-radius: 0 0 12px 12px; } .header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item .title { font-size: 16px; color: #ea4636; font-weight: 500; line-height: 1; padding: 10px 0 0; margin-bottom: 6px; } .header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item img { max-width: 60px; width: 60px; vertical-align: middle; margin-top: 0; height: 60px; } .header .menu>ul>li .sub-menu.mega-menu>.list-item>ul>li>a:hover, .header .menu>ul>li .sub-menu>ul>li>a:hover, .header .item-right a:hover, .header .menu>ul>li:hover>a { color: var(--yellowcolor); } .mobile-menu-head, .mobile-menu-trigger { display: none; } .fixed-top { padding: 0; border-bottom: 0px solid #1c498033; } header.header { position: relative; background: #f4f6fc; } .d-flex-bx { gap: 10px; background: #e5b56238; padding: 8px; border-radius: 12px; border: 1px solid #eee; width: 100%; } .d-flex-bx:hover { background: #0f3026; color: #fff; } .d-flex-bx:hover .service_detials h4.title a { color: #fff; } .d-flex-bx:hover .service_detials p { background: #0f3026; color: #fff; } .service_detials p { line-height: 24px; font-size: 14px; } header { background-color: #fff; } /*responsive*/ .header .menu>ul>li span.in-mobile { display: none; } @media(max-width: 991px) { .header { padding: 0; } .header .item-center { order: 3; flex: 0 0 100%; } .v-center { justify-content: space-between; } .mobile-menu-trigger { display: flex; height: 20px; width: 30px; margin-left: 15px; cursor: pointer; align-items: center; justify-content: center; position: absolute; right: 15px; top: 13px; z-index: 99999999; border-top: 3px solid var(--darkColor); border-bottom: 3px solid var(--darkColor); } .mobile-menu-trigger span { display: block; height: 3px; background-color: var(--darkColor); width: 100%; position: relative; } .header .item-right { align-items: center; } .header .menu { position: fixed; width: 300px; background-color: #ffffff; left: 0; top: 0; height: 100%; overflow: hidden; transform: translate(-100%); transition: all 0.5s ease; z-index: 1099; } .header .menu.active { transform: translate(0%); } .header .menu>ul>li { line-height: 1; display: block; } .header .menu>ul>li>a { line-height: 33px; height: 50px; padding: 0 50px 0 15px; display: block; border-bottom: 1px solid rgba(0, 0, 0, 0.1); padding: 9px 0; } .header .menu>ul>li>a i { position: absolute; height: 50px; width: 50px; top: 0; right: 0; text-align: center; line-height: 50px; transform: rotate(-90deg); } .header .menu .mobile-menu-head { display: flex; height: 50px; border-bottom: 1px solid rgba(0, 0, 0, 0.1); justify-content: space-between; align-items: center; position: relative; z-index: 501; position: sticky; background-color: #ffffff; top: 0; } .header .menu .mobile-menu-head .go-back { height: 50px; width: 50px; border-right: 1px solid rgba(0, 0, 0, 0.1); cursor: pointer; line-height: 50px; text-align: center; color: #000000; font-size: 16px; display: none; } .header .menu .mobile-menu-head.active .go-back { display: block; } .header .menu .mobile-menu-head .current-menu-title { font-size: 15px; font-weight: 500; color: #000000; } .header .menu .mobile-menu-head .mobile-menu-close { height: 50px; width: 50px; border-left: 1px solid rgba(0, 0, 0, 0.1); cursor: pointer; line-height: 50px; text-align: center; color: #000000; font-size: 25px; } .header .menu .menu-main { height: 100%; overflow-x: hidden; overflow-y: auto; } .header .menu>ul>li .sub-menu.mega-menu, .header .menu>ul>li .sub-menu { visibility: visible; opacity: 1; position: fixed; box-shadow: none; margin: 0; padding: 15px; top: 0; left: 0; width: 100%; height: 100%; padding-top: 65px; max-width: none; min-width: auto; display: none; transform: translateX(0%); overflow-y: auto; z-index: 99; } .header .menu>ul>li .sub-menu.active { display: block; } .header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item img { margin-top: 0; } .header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item.text-center .title { margin-bottom: 20px; } .header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item.text-center:last-child .title { margin-bottom: 0px; } .header .menu>ul>li .sub-menu>ul>li>a, .header .menu>ul>li .sub-menu.mega-menu>.list-item>ul>li>a { display: block; } .header .menu>ul>li .sub-menu.mega-menu>.list-item>ul { margin-bottom: 15px; } .menu-overlay { position: fixed; background-color: rgba(0, 0, 0, 0.5); left: 0; top: 0; width: 100%; height: 100%; z-index: 1098; visibility: hidden; opacity: 0; transition: all 0.5s ease; } .menu-overlay.active { visibility: visible; opacity: 1; } .header .menu>ul>li span.in-mobile { line-height: 33px; height: 50px; padding: 0 50px 0 15px; display: block; border-bottom: 1px solid rgba(0, 0, 0, 0.1); padding: 9px 0; display: block !important; } .header-item.item-left .logo img { max-width: 100px !important; } .breadcrumb-career { padding-top: 95px; } a.all-service-btn { transition: .5s; font-weight: 500; color: #fff; padding: 10px 20px; display: table; background: var(--bg-blue); border-radius: 50px; font-size: 18px; display: block; margin-top: 20px !important; } span.in-mobile i.fa.fa-angle-down { position: absolute; right: 15px; } .header-item.item-left { position: relative; z-index: 9; } .header .menu>ul>li>a { position: relative; z-index: 2; } h4.title { margin: 0; font-size: 20px; } .service_detials.w-60 p { margin: 0; font-size: 13px; line-height: 20px; } a.in-desktop { display: none !important; } .header .menu>ul>li>a { color: #000; } .header .item-right { justify-content: start; } .header .item-right a:last-child { display: none; } .part1 { display: block; } .client-info { margin: 15px; } .client-info img { width: 100px; } .review-bg { background: #edf2fa; } } @media screen and (min-width:1366px) and (max-width:2000px) { .container { max-width: 1300px; } } @media screen and (min-width:200px) and (max-width:991px) {} @media screen and (min-width:992px) and (max-width:1199px) { .header .item-right { max-width: 420px; position: absolute; width: auto; right: 0; top: 81px; background: #000000; padding: 10px; } .header .menu>ul>li { margin-left: 10px; } .header .item-right a { color: #fff; } } @media screen and (min-width:1200px) and (max-width:1365px) { .header .menu>ul>li { margin-left: 10px; } } .dg.ac { display: none; } @media screen and (min-width: 1700px) { .bgImg { background-size: cover; } }