• /* --------- VARIABLES DE COLOR (puedes ajustar aquí) --------- */ :root { --glass-bg: rgba(218, 235, 255, 0.55); /* Tint azul visible */ --glass-bg-hover: rgba(210, 230, 255, 0.65); --border-blue: rgba(0, 115, 255, 0.32); --border-blue-hover: rgba(0, 145, 255, 0.48); --shadow-blue: rgba(0, 82, 204, 0.20); --shadow-blue-hover: rgba(0, 82, 204, 0.30); } /* ====================== 🧊 CARD GLASS ======================= */ body .card { position: relative; display: flex; flex-direction: column; min-width: 0; word-wrap: break-word; /* Glass Azul */ background: rgb(218 222 255 / 11%); backdrop-filter: blur(14px) saturate(185%); -webkit-backdrop-filter: blur(14px) saturate(185%); border: 1px solid var(--border-blue); border-radius: 16px; box-shadow: 0 6px 18px var(--shadow-blue); transition: all 0.28s ease; overflow: visible !important; z-index: 2; } body .card:hover { transform: translateY(-4px); background: var(--glass-bg-hover); box-shadow: 0 12px 28px var(--shadow-blue-hover); border-color: var(--border-blue-hover); } /* ============ Dropdown que se escondía debajo ============== */ .dropdown-menu { z-index: 9999 !important; position: absolute !important; background: #fff; border-radius: 10px; box-shadow: 0 6px 16px rgba(0, 57, 148, 0.18) !important; border: 1px solid rgba(0, 115, 255, 0.25) !important; } /* Forzar que el contenedor no tape el dropdown */ .block, .block-region, .dashboard-card, .card-deck, #page-content, #region-main { overflow: visible !important; } /* ======================== 🧊 INPUT SEARCH ======================= */ .block .form-control, input[type="text"] { background: rgba(255, 255, 255, 0.65) !important; border-radius: 12px !important; border: 1px solid rgba(0, 115, 255, 0.30) !important; backdrop-filter: blur(10px) saturate(150%); -webkit-backdrop-filter: blur(10px) saturate(150%); transition: all 0.25s ease; } .block .form-control:focus, input[type="text"]:focus { background: rgba(240, 248, 255, 0.85) !important; border-color: rgba(0, 145, 255, 0.48) !important; box-shadow: 0 0 0 3px rgba(0, 136, 255, 0.25) !important; } .bg-secondary { background-color: #000000fc !important; } .bg-gray4{ background-color: #e5e5f7 !important; background-image: linear-gradient(135deg, #fafaff 25%, transparent 25%), linear-gradient(225deg, #fafaff 25%, transparent 25%), linear-gradient(45deg, #fafaff 25%, transparent 25%), linear-gradient(315deg, #fafaff 25%, #e5e5f7 25%) !important; background-position: 10px 0, 10px 0, 0 0, 0 0; background-size: 2px 2px !important; background-repeat: repeat !important; } .our-dashbord{ background-color: #e5e5f7 !important; background-size: 4px 4px !important; background-image: repeating-linear-gradient(45deg, #444cf747 0, #44f7de .4px, #e5f7e7 0, #e5e5f7 50%) !important; } .dashbord-banner-area, .bg-secondary { position: relative; background: linear-gradient(135deg, #040051 0%, #124768 40%, #03003c 100%) !important; padding: 70px 0; background-position: center center; background-repeat: no-repeat; background-size: cover; text-align: center; z-index: 1; } .dashbord-banner-area * { position: relative; z-index: 2; } /* Opcional: capa sutil de brillo para efecto premium */ .dashbord-banner-area::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 30% 30%, rgba(255,255,255,0.07), transparent 60%); pointer-events: none; z-index: 1; } /* Tipografía */ .dashbord-banner-area h2 { font-size: clamp(26px, 3vw, 38px); font-weight: 700; margin-bottom: 6px; color: #fff; } .dashbord-banner-area p { font-size: clamp(14px, 1.3vw, 18px); opacity: 0.75; margin: 0; } /* Mobile: reduce densidad para no saturar */ @media (max-width: 600px) { .dashbord-banner-area { padding-bottom: 90px; } .dashbord-banner-area::after { opacity: 0.9; height: 130px; } } .dashbord_nav_list li { height: 50px; line-height: 45px; padding-left: 30px; position: relative; /* transition: all 0.3s ease 0s; */ border-bottom: .5px solid #0a1f4f0d; }
  • Get In Touch
Get Started
VRA
Home
Skip to main content

Villa Real

page-banner
page-banner
VRA

STEAMGroup

  • Somos el primer centro de investigación de educación
    STEAM en Guatemala

Conoce mas de nosotros

Help

Subscribe Now