.header_innerpart { display: flex; align-items: center; justify-content: space-between; padding: 14px 0; } .header_logonew img { filter: invert(1) brightness(10.5); transition: 0.2s all; max-width: 130px; } .header_top { border-bottom: 1px solid #f2f2f242; text-align: end; transition: 0.3s all; background: #f2f2f242; } .headerright_inner { display: flex; align-items: center; } .header-fixed .header_top { margin-top: 0; background: #1A81FF; } .header_top a { font-size: 13px; color: #fff; letter-spacing: 0.5px; font-weight: 600; transition: 0.3s all; position: relative; border-right: 1px solid #f2f2f242; padding: 12px 16px; display: inline-flex; align-items: center; } .main_header { padding: 0; position: fixed; width: 100%; z-index: 999; top: 0; left: 0; right: 0; transition: 0.5s all; } .header-fixed { box-shadow: 0 0 10px #00000024; /* padding: 20px 0; */ background-color: #fff; transition: 0.3s all; } .main_menus { display: flex; align-items: center; } .main_menus .menus_link { color: #fff; font-weight: 600; font-size: 16px; display: flex; position: relative; transition: 0.2s all; align-items: center; padding: 0 20px; } .Header_btns { background-color: #fff; font-weight: 800; font-size: 15px; padding: 12px 18px; display: inline-block; border-radius: 14px; color: #08223a !important; letter-spacing: 0.5px; transition: 0.2s all; box-shadow: 0 0 20px #0000002e; } .header-fixed .Header_btns { background-color: #1A81FF; color: #fff !important; } .header-fixed .header_logonew img { filter: unset; transition: 0.2s all; } .header-fixed .main_menus .menus_link { color: #000; } .animate-button { padding: 8px 15px; } .animate-button::before { box-shadow: 0 0 0 rgb(255 255 255 / 40%); animation: pulso12 2s infinite; transition: .5s; content: ""; width: 100%; height: 100%; position: absolute; left: 0px; border-radius: 10px; top: 0; bottom: 0; margin: auto; } .main_menus li { position: relative; } .main_menus li:hover .dropdown_custom { display: block; visibility: visible; opacity: 1; transition: 0.2s all; background-color: #fff; height: auto; } .dropdown_custom { background: #fff; transition: 0.2s all; transform: scale(0.9); transform-origin: top; display: block; height: 0px; border-radius: 0; visibility: hidden; opacity: 0; position: absolute; width: 100%; left: auto; right: -17px; top: 50px; max-width: 250px; min-width: 250px; box-shadow: 0 30px 20px #0000002e; border-radius: 10px; padding: 10px 0; } .dropdown_menu img { height: 32px; margin-right: 6px; object-fit: contain; } .dropdown_menu { display: flex; align-items: center; font-weight: 700; font-size: 15px; color: #000; padding: 10px 14px; text-transform: capitalize; } .dropdown_menu:hover img { filter: brightness(50); } .dropdown_menu:hover { background-color: #1A81FF; color: #fff; } .menus_link::after { position: absolute; content: ''; top: 0; left: 0; right: 0; bottom: 0; background-color: transparent; height: 51px; width: 100%; } .dropdown_custom::after { content: ""; width: 30px; height: 30px; display: block; position: absolute; right: 20px; left: auto; margin: 0 auto; z-index: -1; top: -10px; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); background: #ffffff; } /* Parent */ .has-submenu { position: relative; } /* Arrow (border based) */ .has-submenu > .menus_link::after { content: ""; display: inline-block; margin-left: 8px; vertical-align: middle; width: 9px; height: 9px; border-right: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(45deg); transition: transform 0.3s ease; position: absolute; right: 2px; left: auto; top: 7px; } /* Rotate arrow on hover */ .has-submenu:hover > .menus_link::after { transform: rotate(-135deg); top: 11px; } /* Submenu */ .has-submenu .submenu { position: absolute; top: 140%; left: 0; min-width: 260px; background: #fff; border-radius: 8px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1); opacity: 0; visibility: hidden; transform: translateY(10px); transition: all 0.3s ease; z-index: 999; padding: 15px 16px; } .has-submenu .submenu li a { color: #000; font-size: 14px; font-weight: 500; display: flex; line-height: 23px; margin-bottom: 10px; } /* Show */ .has-submenu:hover .submenu { opacity: 1; visibility: visible; transform: translateY(0); } .header_logonew img { max-width: 260px !important; } @media (max-width: 767px) { .header_logonew img { max-width: 200px !important; } .header_innerpart { flex-direction: row-reverse; } } .ae_about { margin-top: -30px !important; } .screen-reader-response { display: none !important; } label { display: block !important; } ul { list-style: none !important; } .WeOfferaeinner img { max-width: 55px !important; } ul.tech_logos img { max-width: 100px !important; } .engagementmodelbox span img { max-width: 50px !important; } ol, ul { margin: unset !important; } .processsdesignbox img { max-width: 55px !important; } .service-app-bx img { max-width: 45px !important; } .service-app-bx img { max-width: 45px !important; } .sophisticated-bx ul li .tp-feature-front .tp-feature-front-icon img { max-width: 55px !important; } .ae_expertise_box img { max-width: 60px !important; } .whatmakes_content img { max-width: 70px !important; } .estimation-app-bx ul li img { max-width: 50px !important; } .service-testimonial .testimonial .image img { max-width: 125px !important; } .processsdesignbox ul { list-style: circle !important; } .theapp-choose-bx .choose-bxs img { max-width: 55px !important; } .header-fixed { background-color: #fff !important; } section.page-title h2 { color: #fff; } .page-title { padding: 150px 0 70px !important; } .content-section { text-align: justify; } .popup-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.7); display: none; /* hidden by default */ justify-content: center; align-items: center; z-index: 9999; padding: 20px; /* space for mobile edges */ overflow-y: auto; /* if popup taller than screen */ } .popup-content { display: flex; flex-wrap: wrap; /* stacks on small screens */ max-width: 900px; /* limit overall width */ width: 100%; max-height: 100vh; background: #fff; border-radius: 20px; overflow: hidden; /* contain children */ position: relative; } /* Left section */ .popup-left { flex: 1 1 45%; background: rgb(28 118 188); color: #fff; padding: 40px; min-width: 300px; /* prevent too narrow collapse */ box-sizing: border-box; } /* Right section */ .popup-right { flex: 1 1 55%; background: #fff; padding: 40px; box-sizing: border-box; overflow-y: auto; scrollbar-width: none; } /* Close button */ .popup-close { position: absolute; top: 10px; right: 15px; font-size: 28px; color: #000; cursor: pointer; z-index: 10000; } /* Make mobile-friendly */ @media (max-width: 768px) { .popup-content { flex-direction: column; max-height: 95vh; } .popup-left, .popup-right { min-width: 100%; padding: 20px; } } /* === Left Section === */ .popup-left { flex: 1; background: #0f0f2d; color: #fff; padding: 40px; } .popup-left h2 { font-size: 28px; color: #fff; margin-bottom: 20px; line-height: 1.3; text-align: center; } .popup-left p { font-size: 11px; margin-bottom: 20px; color: #fff; text-align: center; } .popup-left hr { border: 0; height: 1px; background: rgba(255, 255, 255, 0.2); margin: 20px 0; } .popup-left .trusted-text { font-size: 13px; text-transform: uppercase; margin-bottom: 20px; color: #a2a3a6; font-weight: 500; } .logo-grid { display: flex; flex-wrap: wrap; gap: 15px; } .logo-grid img { max-height: 28px; /*filter: invert(25%) sepia(100%) saturate(500%) hue-rotate(180deg);*/ } /*.logo-grid img {*/ /* max-height: 28px;*/ /* filter: invert(25%) sepia(100%) saturate(500%) hue-rotate(180deg);*/ /*}*/ /* === Right Section === */ .popup-right { flex: 1; background: #fff !important; padding: 30px; display: flex; flex-direction: column; } .rating { margin-bottom: 10px; } .badge { background: #fff; padding: 3px 8px; border-radius: 4px; font-weight: bold; margin-right: 5px; } .popup-right h3 { font-size: 24px; margin: 10px 0; text-align: center; } .popup-right p { font-size: 14px; margin-bottom: 8px; } .popup-right .form-row .form-group p { margin-bottom: 0px !important; } .form-row .form-group input.wpcf7-form-control { margin-bottom: 0px !important; } .form-row .form-group { flex: 1; } .wpcf7 input, .wpcf7 textarea { margin-bottom: 0px !important; } /* === Contact Form 7 Styling === */ .popup-right .wpcf7 form { display: flex; flex-direction: column; gap: 13px; } .popup-right .wpcf7 .form-row { display: flex; gap: 15px; margin-bottom: 0px !important; } .wpcf7 form>div, .wpcf7 form>p { margin-bottom: -10px !important; position: relative; } .popup-right .wpcf7 input, .popup-right .wpcf7 select, .popup-right .wpcf7 textarea { flex: 1; padding: 10px; border: 1px solid #ccc; border-radius: 6px; font-size: 14px; width: 100%; } .popup-right .wpcf7 textarea { min-height: 80px; } .popup-right .wpcf7 input[type="submit"] { background: #000; color: #fff; padding: 12px; border-radius: 6px; font-weight: bold; cursor: pointer; border: none; width: 100%; } /* === Close Button === */ .popup-close { position: absolute; top: 15px; right: 20px; font-size: 28px; color: #000; cursor: pointer; } /* === Responsive Fix === */ @media(max-width:768px) { .popup-content { flex-direction: column; max-height: 90%; overflow-y: auto; } .popup-left, .popup-right { flex: unset; width: 100%; } .popup-right .wpcf7 .form-row { flex-direction: column; } } .rating img { width: 70%; } .rating { text-align: center; } .newfooter { background-color: #0d0d0d; color: #fff; padding: 40px 0 20px; font-family: 'Arial', sans-serif; border-top: 1px solid #2b2b2b; /* Top border */ } .footer-left { padding-bottom: 20px; } .footer-logo { max-width: 180px; margin-bottom: 15px; display: block; } .footer-tagline { font-size: 15px; line-height: 1.5; color: #ccc; max-width: 450px; } .footer-badges img.footer-badge { max-height: 100px; margin-left: 12px; background: #fff; border-radius: 6px; padding: 6px; border: 1px solid #ddd; width: 100%; } .certifications .cert-icon { max-height: 75px; margin: 0 12px; /*background: #fff;*/ border-radius: 6px; padding: 6px; /*border: 1px solid #ddd;*/ } .social-row { border-top: 1px solid #2b2b2b; border-bottom: 1px solid #2b2b2b; padding: 20px 0; margin-top: 30px; } .follow-text { font-size: 14px; color: #ccc; margin-right: 10px; display: inline-block; margin-left: 126px; margin-bottom: 15px; } .footer-social a { display: inline-block; margin: 0 6px; } .footer-social img { width: 36px; height: 36px; object-fit: contain; transition: transform 0.3s ease; } .footer-social img:hover { transform: scale(1.1); } .footer-bottom { margin-top: 20px; } .footer-bottom p { font-size: 13px; color: #aaa; margin: 0; } .footer-bottom a { color: #aaa; text-decoration: none; margin: 0 4px; } .footer-bottom a:hover { color: #fff; } .footer-left img.footer-logo { width: 50%; } .certifications-sections { display: flex; justify-content: space-between; border-top: 1px solid #2b2b2b; } .middlebox { text-align: left !important; display: flex; gap: 10px; } .gmblocations { margin-top: -2px; } .social-right .footer-social { text-align: right !important; } .mobileportfoilo_logo div img { max-width: 100% !important; } .portfolio_page { padding: 50px 0 80px !important; } .service-app-bx.common-bg-theme1.newfonts.py-5 h3 { color: aliceblue !important; } .main_partner_bx .slider-bx ul li img { max-width: unset !important; } .popup-right:has(.wpcf7-not-valid-tip) p { margin-bottom: 20px !important; } .popup-right .wpcf7 input[type="submit"] { background: #3373C1 !important; } .award-coman-slider { visibility: hidden; } .award-coman-slider.slick-initialized { visibility: visible; } .slick-slide img { object-fit: cover; display: block; } .inclusive-slider, .aeportfolioslider, .quotes, .award-coman-slider { min-height: 259px; overflow: hidden; } @media(max-width:768px) { .inclusive-slider, .aeportfolioslider { min-height: 220px; } } .award-coman-slider .slider-bx { height: 259px; display: flex; align-items: center; justify-content: center; } .award-coman-slider .slider-bx img { max-height: 100%; width: auto; max-width: 100%; object-fit: contain; display: block; } :root { --primary-purple: #7B3EBF; --accent-pink: #FF69B4; --dark-background: #1A0033; /* Slightly darker than black for depth */ --glass-bg: rgba(255, 255, 255, 0.08); --glass-border: rgba(255, 255, 255, 0.15); --text-color: #E0E0E0; --placeholder-color: #A0A0A0; --input-bg: rgba(255, 255, 255, 0.05); --input-border: rgba(255, 255, 255, 0.1); } @keyframes gradientBackground { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } @keyframes techPattern { 0% { transform: scale(1) rotate(0deg); opacity: 0.6; } 50% { transform: scale(1.1) rotate(5deg); opacity: 0.7; } 100% { transform: scale(1) rotate(0deg); opacity: 0.6; } } .popup-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; z-index: 1000; opacity: 0; visibility: hidden; transition: opacity 0.5s ease; pointer-events: auto; } .popup-overlay::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); z-index: 0; pointer-events: auto; } .popup-overlay.active { opacity: 1; visibility: visible; } .popup-container { position: relative; display: flex; max-width: 1100px; width: 100%; background: rgb(28 118 188); border-radius: 5px; overflow: hidden; box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4); transform: translateY(50px); opacity: 0; transition: transform 0.6s ease-out, opacity 0.6s ease-out; max-height: 485px; pointer-events: auto; z-index: 1; } .popup-overlay.active .popup-container { transform: translateY(0); opacity: 1; } /* Left Side */ .popup-left { flex: 1; padding: 40px; display: flex; flex-direction: column; justify-content: space-around; background: url('https://theappidea.ae/wp-content/themes/astra-child/common/images/home/background-image-popup.png'); color: var(--text-color); background-size: cover; } .popup-left h2 { font-size: 2.5em; margin-bottom: 15px; font-weight: 700; line-height: 1.2; } .popup-left p { font-size: 22px; margin-bottom: 30px; color: #fff; } .popup-left .trusted-logos h3 { font-size: 20px; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 20px; color: #fff; text-align: center; font-weight: 700; margin-top: 15px; } .logo-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; } .logo-item { display: flex; align-items: center; justify-content: center; padding: 5px; /*background: rgba(255, 255, 255, 0.05);*/ border-radius: 10px; /*border: 1px solid var(--input-border);*/ filter: grayscale(100%); transition: filter 0.3s ease, transform 0.3s ease; cursor: pointer; } .logo-item:hover { filter: grayscale(0%); transform: translateY(-3px) scale(1.02); } .logo-item svg { max-height: 30px; width: auto; fill: #fff; transition: fill 0.3s ease; } /*.logo-item:hover svg {*/ /* fill: var(--accent-pink);*/ /*}*/ .logo-item span { margin-left: 10px; color: #fff; font-weight: 600; } .popup-right { flex: 1; padding: 40px; backdrop-filter: blur(15px); border-radius: 0 5px 5px 0; position: relative; color: var(--text-color); box-shadow: inset 0 0 0 1px var(--glass-border), 0 8px 32px 0 rgba(0, 0, 0, 0.3); } .popup-right h2 { font-size: 1.8em; margin-bottom: 5px; font-weight: 600; color: #000; } .popup-right p.subheading { font-size: 0.95em; color: #000; margin-bottom: 30px; } .form-group { position: relative; } .form-group label svg { margin-right: 8px; color: var(--placeholder-color); transition: color 0.2s ease-out; width: 20px; height: 20px; } .form-group input:focus { border-color: var(--primary-purple); box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.3), 0 0 0 3px rgba(123, 62, 191, 0.3); background-color: rgba(255, 255, 255, 0.08); } /* Floating Label Effect */ .form-group input:focus+label, .form-group input:not(:placeholder-shown)+label { top: 0px; left: 10px; font-size: 0.75em; color: var(--accent-pink); background-color: var(--glass-bg); padding: 0 8px; transform: translateY(-50%); border-radius: 5px; z-index: 2; } .form-group input:focus+label svg, .form-group input:not(:placeholder-shown)+label svg { color: var(--accent-pink); } /* Submit Button */ .submit-button, .wpcf7-submit { width: 100% !important; padding: 15px !important; border: none !important; border-radius: 10px !important; background: linear-gradient(90deg, var(--primary-purple), #2b5bde) !important; color: #FFFFFF !important; font-size: 1.1em !important; font-weight: 700 !important; cursor: pointer !important; outline: none !important; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2) !important; transition: transform 0.3s ease, background 0.3s ease, box-shadow 0.3s ease !important; position: relative !important; overflow: hidden !important; z-index: 0 !important; height: auto !important; } .submit-button::before, .wpcf7-submit::before { content: ''; position: absolute !important; top: 0 !important; left: -100% !important; width: 100% !important; height: 100% !important; background: linear-gradient(90deg, var(--accent-pink), var(--primary-purple)) !important; transition: left 0.5s ease !important; z-index: -1 !important; opacity: 0 !important; } .submit-button:hover::before, .wpcf7-submit:hover::before { left: 0 !important; opacity: 1 !important; } .submit-button:hover, .wpcf7-submit:hover { transform: scale(1.02) !important; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3), 0 0 20px #b3d8fc !important; /* Glow effect */ } .close-button { position: absolute; top: 0px; right: 0px; background: none; border: none; font-size: 1.5em; color: var(--placeholder-color); cursor: pointer; transition: color 0.3s ease; z-index: 999999; box-shadow: unset !important; } .close-button:hover { color: #9b9497; background: unset !important; } @media (max-width: 768px) { .popup-container { flex-direction: column; max-width: 95%; border-radius: 15px; } .popup-left, .popup-right { padding: 30px; } .popup-left { border-radius: 15px 15px 0 0; } .popup-right { border-radius: 15px 15px 15px 15px; } .popup-left h2 { font-size: 2em; } .logo-grid { grid-template-columns: 1fr; } } @media (max-width: 480px) { .popup-left h2 { font-size: 1.8em; } .popup-right h2 { font-size: 1.5em; } .form-group input { padding: 10px 15px 10px 40px; } .form-group label { left: 10px; } .form-group label svg { width: 18px; height: 18px; } } .captcha-row { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; } .captcha-label { font-weight: 600; font-size: 15px; } .captcha-input input { width: 80px; text-align: center; } .popup-right br { display: none !important; } .popup-right label { margin-bottom: 6px; } .form-group.captcha-input.math-captchha .wpcf7-text { width: 30%; } .form-group.captcha-input.math-captchha span.wpcf7-not-valid-tip { margin-left: -63px; } #techPopupforce .popup-left { justify-content: space-around !important; } .logo-image { text-align: center; } div#techPopupforce .trusted-logos img { width: 70px; max-height: 70px !important; } div#techPopupforce .logo-item { filter: grayscale(0%) !important; justify-content: flex-start !important; } div#techPopupforce .logo-grid img { filter: unset !important; } div#techPopupforce .logo-desc { display: flex; flex-direction: column; } div#techPopupforce .logo-item span { min-width: 170px; } .logo-image img { width: 140px; } .featured-blog-section { background: radial-gradient(circle, #0c1633, #040b1d); padding: 80px 0; text-align: center; } .featured-blog-slider { position: relative; } .featured-blog-slider .swiper-button-prev { left: -55px; } .featured-blog-slider .swiper-button-next { right: -55px; } .featured-blog-slider .swiper-button-prev, .featured-blog-slider .swiper-button-next { color: #ffffff; width: 44px; height: 44px; } .section-title { color: #fff; font-size: 32px; margin-bottom: 40px; } .blog-card { background: #f1f6ff; border-radius: 14px; overflow: hidden; box-shadow: 0 10px 40px rgba(0, 0, 0, .3); } .blog-thumb img { width: 100%; height: 180px; object-fit: cover; } .blog-content { padding: 18px; text-align: left; } .blog-tag { font-size: 13px; font-weight: 600; color: #2563eb; } .blog-content h3 { font-size: 16px; margin: 10px 0 15px; color: #0f172a; height: 80px; } .blog-footer { display: flex; justify-content: space-between; align-items: center; } .read-more { background: #2563eb; color: #fff; padding: 7px 14px; border-radius: 20px; font-size: 13px; text-decoration: none; } .blog-date { font-size: 12px; color: #475569; } .swiper-button-prev, .swiper-button-next { color: #fff; } a.read-more:hover { color: #fff !important; } .featured-blog-slider .swiper-button-prev, .featured-blog-slider .swiper-button-next { background: rgba(255, 255, 255, 0.15); border-radius: 50%; backdrop-filter: blur(5px); } .featured-blog-slider .swiper-button-prev::after, .featured-blog-slider .swiper-button-next::after { font-size: 18px; } a.read-more:visited { color: #fff !important; } @media (max-width: 768px) { .featured-blog-slider .swiper-button-prev { left: 10px; } .featured-blog-slider .swiper-button-next { right: 10px; } } @media (max-width: 1199px) { .main_menus .menus_link { font-size: 14px; } .main_menus li { margin-right: 20px; } .animate-button { padding: 6px 12px; } .Header_btns { padding: 9px 16px; border-radius: 7px; letter-spacing: 0.5px; font-size: 14px; } } @media (max-width: 1023px) { .header_top { display: none; } .mobile_toggle i:last-child { display: none; } .header_innerpart { padding: 0 !important; } .mobile_toggle.change_icon i:first-child { display: none; } .mobile_toggle.change_icon i:last-child { display: block; } .mobile_menus_main { display: flex; align-items: center; } .header_menuspart { display: none; } .header_logonew { order: 1; } .main_header { padding: 15px 0; background: #f2f2f242; } .header-fixed { background-color: #fff !important; } .header_logonew img { filter: invert(1) brightness(10.5) !important; max-width: 118px; } .mobile_toggle { color: #fff !important; font-size: 24px; display: block; margin-right: 20px; } .menus_inner { position: fixed; left: -100%; top: 69px; height: 100vh; width: 40%; background-color: #f1f1f1; padding: 20px 20px 70px; transition: 0.5s all; overflow-y: auto; z-index: 999999; } .menus_inner.show-menus { position: fixed; left: 0; } .menus_inner_bottom a { display: flex; text-align: center; background-color: #1A81FF; margin: 10px 0; color: #fff; border-radius: 8px; font-weight: 600; align-items: center; justify-content: center; height: 45px; } .menus_inner_top li a { color: #0a113b; font-size: 15px; font-weight: 600; background-color: #ffffff; height: 44px; display: flex; align-items: center; padding: 0 20px; border-radius: 7px; position: relative; box-shadow: 0 11px 20px rgb(149 149 149 / 15%); } .mobile_dropdown .menusmain::after { margin-top: 0px; display: inline-block; width: 0; height: 0; margin-left: auto; vertical-align: initial; content: ""; border-top: 6px solid; border-right: 6px solid transparent; border-bottom: 0; border-left: 6px solid transparent; float: right; margin-right: 0; } .menus_inner_top li { margin-bottom: 15px; } .show_dropdown { display: none; } .show_dropdown.show { display: block; padding: 20px 20px; background-color: #fff; margin: 10px 0; border-radius: 7px; } .dropdown_show .show_dropdown { display: block; padding: 20px 20px; background-color: #fff; margin: 10px 0; border-radius: 7px; } .menus_inner_top li .show_dropdown a { font-size: 13px; font-weight: 600; padding: 10px 17px; border-bottom: 2px solid #fff; background-color: #f2f2f2; margin-bottom: 5px; box-shadow: unset; } .header-fixed .header_logonew img { filter: unset !important; transition: 0.2s all; } .header-fixed .mobile_toggle { color: #000 !important; } } @media (max-width: 767px) { .Header_btns { padding: 6px 12px; border-radius: 7px; letter-spacing: 0.5px; font-size: 14px; } .header_logonew img { max-width: 100px; } .mobile_toggle { color: #fff !important; font-size: 21px; display: block; margin-right: 13px; } .main_header { padding: 12px 0; } .menus_inner { left: -100%; top: 57px; width: 100%; } .menus_inner_top li a { font-size: 14px; } /* submenu default hidden */ .has-submenu .submenu { position: static; opacity: 1; visibility: visible; transform: none; display: none; box-shadow: none; border-radius: 0; } /* active class pe show */ .has-submenu.active .submenu { display: block; } /* arrow rotate on open */ .has-submenu.active > .menus_link::after { transform: rotate(-135deg); } .has-submenu > .menus_link::after { content: ""; display: inline-block; margin-left: 8px; vertical-align: middle; width: 9px; height: 9px; border-right: 2px solid #000; border-bottom: 2px solid #000; right: 22px; left: auto; top: 19px; } .has-submenu .submenu li a { font-size: 14px; font-weight: 500; display: flex; line-height: 23px; margin-bottom: 10px; background-color: transparent; padding: 0; box-shadow: unset; } .has-submenu:hover > .menus_link::after { transform: rotate(-135deg); top: 19px; } }