/*@import url('https://fonts.googleapis.com/css2?family=Quicksand&display=swap'); @import url('https://fonts.googleapis.com/css?family=Comfortaa:400,700,300');*/ .voicebutton { position: relative; border-radius: 50%; padding: 0px; width: 40px; height: 40px; margin: 0 auto !important; display: none; } .radzen-popup { display: none; position: absolute; overflow: hidden; height: 360px; width: 600px; border: var(--rz-panel-border); background-color: var(--rz-panel-background-color); box-shadow: var(--rz-panel-shadow); border-radius: var(--rz-border-radius); background-color: #0a4261; /*background-color: #396586;*/ /*background-color: #608aad;*/ color: #87b1d6; /*background-color: #b0daff;*/ } .radzen-popup p { color: #fff } .rz-panel { --rz-panel-padding: 0.6rem !important; } .rz-accordion .rz-accordion-header > a { --rz-accordion-item-padding-block: 0.6rem !important; } ._poweredBy_1f9vw_251 { display: none !important; } /* Hint styling */ .floating-hint { position: absolute; background: #fff9c4; color: #333; padding: 6px 12px; margin: 10px; border-radius: 15px; box-shadow: 0 2px 6px rgba(0,0,0,0.2); font-size: 0.9rem; white-space: nowrap; z-index: 1000; animation: float 0.6s ease-in-out infinite; pointer-events: none; opacity: 0; transition: opacity 0.3s; } .floating { animation: float 5s ease-in-out infinite; } @keyframes float { 0% { box-shadow: 0 5px 15px 0px rgba(0,0,0,0.6); transform: translatey(0px); } 50% { box-shadow: 0 25px 15px 0px rgba(0,0,0,0.2); transform: translatey(-20px); } 100% { box-shadow: 0 5px 15px 0px rgba(0,0,0,0.6); transform: translatey(0px); } } .upload-image-container { cursor: pointer; overflow: hidden; position: relative; width: 100%; /* Ensures responsiveness */ padding-top: 100%; /* Aspect ratio 1:1 */ } .square-thumbnail { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; /* Ensures the image fills the container */ } .footer { margin-bottom: 0px !important; } /*Search2*/ .searchBox { position: relative; width: 60px; background: rgba(255, 255, 255, 0.3); height: 60px; border-radius: 40px; padding: 10px; margin: 0 auto; transition: 0.8s; overflow: hidden; animation: fadeInUp; animation-duration: 2s; backdrop-filter: blur(5px); } .searchInput:active > .searchBox{ width:100% } .searchInput:focus > .searchBox { width: 100% } .searchBox:hover { width: 100%; } .searchBox:hover > .searchInput { width: calc(100% - 120px); padding: 0 6px; } .searchBox:hover > .searchButton { background: white; color: #2f3640; } .searchBox:hover > .voicebutton { display: unset; } .searchButton { color: white; float: right; width: 40px; height: 40px; border-radius: 50%; background-color: #e493d0; background-image: radial-gradient(closest-side, rgba(235, 105, 78, 1), rgba(235, 105, 78, 0)), radial-gradient(closest-side, rgba(243, 11, 164, 1), rgba(243, 11, 164, 0)), radial-gradient(closest-side, rgba(254, 234, 131, 1), rgba(254, 234, 131, 0)), radial-gradient(closest-side, rgba(170, 142, 245, 1), rgba(170, 142, 245, 0)), radial-gradient(closest-side, rgba(248, 192, 147, 1), rgba(248, 192, 147, 0)); background-size: 130vmax 130vmax, 80vmax 80vmax, 90vmax 90vmax, 110vmax 110vmax, 90vmax 90vmax; background-position: -80vmax -80vmax, 60vmax -30vmax, 10vmax 10vmax, -30vmax -10vmax, 50vmax 50vmax; background-repeat: no-repeat; animation: 1s movement linear infinite; display: flex; justify-content: center; align-items: center; z-index: 100; } .searchInput { border: none; background: none; outline: none; font-size: 1.3em !important; color: #0d2840 !important; float: left; padding: 0; color: white; font-size: 16px; transition: 0.4s; line-height: 40px; width: 0px; } /*Search2*/ .event { border-radius: 20px !important; background-color: rgba(255, 255, 255, 0.2) !important; backdrop-filter: blur(20px); border: 0; box-shadow: 0 2px 20px rgba(0, 0, 0, 0.06), 0 2px 4px rgba(0, 0, 0, 0.07); transition: all 0.15s ease; } .show { color: red; } .navbar > .container-fluid { margin-bottom: 0px; padding-bottom: 0px; padding-top: 0px; } .navbar-toggler-icon { /*background-image: var(--bs-navbar-toggler-icon-bg);*/ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%2833, 37, 41, 0.75%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e;"); z-index: 10; } .navbar-brand { font-size: 1.7rem; color: aqua; text-transform: capitalize; } .form-select { background-color: rgba(255, 255, 255, 0.2); border-radius: 55px; } .form-select > option { background-color: rgba(255, 255, 255, 0.2) } .form-group { margin-bottom: 5px; } .contactform-overlay { position: fixed; z-index: 100; height: 100vh; width: 100%; padding: 100px; top: 0px; left: 0px; /* padding-top: 10vh; */ backdrop-filter: blur(20px); /* background-color: rgba(1, 1, 1, .4); */ } .form-control { background-color: rgba(255,255,255,0.4); } .contactform-close-overlay { position: relative; height: 10vh; } .contactform-popup-content { height: 80vh; margin: 0px; padding: 0px; } .contactform-popup-close { position: relative; height: 10vh; z-index: 80; } .calendly-overlay { position: absolute; z-index: 100; height: 100vh; width: 100%; top: 0px; /* padding-top: 10vh; */ backdrop-filter: blur(20px); /* background-color: rgba(1, 1, 1, .4); */ } .calendly-close-overlay { position: relative; height: 10vh; } .calendly-popup-content { height: 80vh; margin: 0px; padding: 0px; } .calendly-popup-close { position: relative; height: 10vh; z-index: 80; } #myVideo { position: fixed; right: 0; bottom: 0; min-width: 100%; min-height: 100%; } .table { color: #fff !important; } .navbar-toggler .navbar-toggler:hover .navbar-toggler:active .navbar-toggler:focus .navbar-toggler:focus-visible { outline: unset; box-shadow: unset !important; } .navbar-toggler:focus { outline: unset; box-shadow: unset !important; } .nav-link { cursor: pointer; } .text-justify { text-align: justify !important; } ul { list-style-type: none; } h1 { font-weight: 700; font-size: 2.5rem; padding-top: 30px; padding-bottom: 10px; } h2 { font-weight: 500; font-size: 2rem; padding-top: 15px; padding-bottom: 10px; } h3 { font-weight: 400; font-size: 1.6rem; padding-top: 10px; padding-bottom: 10px; } p { color: #fff; font-size: 1.1rem; } /* Mobile Responsiveness */ @media (max-width: 768px) { h1 { font-size: 2rem; } h2 { font-size: 1.6rem; } h3 { font-size: 1.4rem; } p, li { font-size: 1rem; } .navbar-collapse .nav-link { font-size: 0.6rem; } p { text-align: justify; } } @media (max-width: 480px) { h1 { font-size: 1.6rem; } h2 { font-size: 1.3rem; } h3 { font-size: 1.1rem; } p, li { font-size: 0.95rem; } .navbar-collapse .nav-link { font-size: 0.6rem; } p { text-align: justify; } }