.elementor-3873 .elementor-element.elementor-element-48f6c5a{--display:flex;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-3873 .elementor-element.elementor-element-48f6c5a.e-con{--align-self:center;}.elementor-3873 .elementor-element.elementor-element-785321b{background-color:#FFFFFF;border-style:none;border-radius:10px 10px 10px 10px;}/* Start custom CSS for html, class: .elementor-element-785321b */.mega-menu, .mega-menu ul { margin: 0; padding: 0; box-sizing: border-box; } .mega-menu { background: #fff; border-top: none; border-bottom: 0px solid #2c3e50; padding: 15px 15px 15px 0; max-width: 100%; font-family: bakh; font-weight: 400; box-sizing: border-box; } .mega-menu .sub-menu li a { font-size: 12px; font-weight: 400; font-family: bakh; } .mega-menu .menu { display: grid; grid-template-columns: repeat(6, 1fr); column-gap: 40px; row-gap: 20px; list-style: none; margin: 0; padding: 0; } .mega-menu .menu > li:nth-child(odd) { grid-row: 1; } .mega-menu .menu > li:nth-child(even) { grid-row: 2; } .mega-menu h4 { font-size: 14px; font-weight: bold; margin-bottom: 10px; border-bottom: 1px solid #3f5260; padding-bottom: 5px; } .mega-menu ul { direction: rtl; } .mega-menu ul li { position: relative; } .mega-menu ul li a { display: block; font-size: 14px; color: #222; text-decoration: none; transition: color 0.3s; } .mega-menu ul li a:hover { color: #3f5260; } .has-sub > a::after { content: " ▼"; font-size: 12px; } .sub-menu { position: absolute; right: 0; top: 100%; background: #fff; border: 1px solid #ccc; min-width: 300px; list-style: none; padding: 15px; margin: 0; z-index: 10; display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px 20px; opacity: 0; visibility: hidden; transform: translateY(10px); transition: opacity 0.3s ease, transform 0.3s ease; will-change: opacity, transform; } .has-sub:hover > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0); } .sub-menu li { margin: 4px 0; } .sub-menu li a { background: #f5f5f5; color: #3f5260;display: inline-block; font-size: 13px; color: #222; text-decoration: none; padding: 6px 10px; transition: color 0.3s; white-space: nowrap; border-radius: 4px; } .sub-menu li a:hover { background: #f5f5f5; color: #3f5260; } @media (max-width: 1200px) { .mega-menu .menu { grid-template-columns: repeat(3, 1fr); column-gap: 15px; row-gap: 25px; } .mega-menu .menu > li:nth-child(odd), .mega-menu .menu > li:nth-child(even) { grid-row: auto; } }/* End custom CSS */