html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}

.umeet-landing {
    overflow:hidden;
}


.hero {

    background:
    linear-gradient(
        135deg,
        #f8fbff,
        #ffffff
    );

}



.min-vh-75 {

    min-height:75vh;

}



.meeting-window {

    background:#111;

    border-radius:24px;

    overflow:hidden;

}



.meeting-topbar {

    padding:15px;

    color:white;

    background:#181818;

    font-weight:600;

}



.online-dot {

    display:inline-block;

    width:10px;

    height:10px;

    background:#20c997;

    border-radius:50%;

    margin-right:8px;

}



.video-area {

    height:420px;

    position:relative;

    background:
    linear-gradient(
        135deg,
        #202020,
        #454545
    );

}



.participant {

    position:absolute;

    display:flex;

    flex-direction:column;

    align-items:center;

    color:white;

}



.participant i {

    font-size:90px;

}



.participant.large {

    top:90px;

    left:50%;

    transform:translateX(-50%);

}



.participant.small {

    right:25px;

    bottom:25px;

}



.participant.small i {

    font-size:45px;

}



.controls {

    padding:15px;

    display:flex;

    justify-content:center;

    gap:15px;

}



.controls button {

    border:0;

    width:48px;

    height:48px;

    border-radius:50%;

}



.controls .end {

    background:#dc3545;

    color:white;

}



.feature-card {

    background:white;

    padding:35px;

    border-radius:18px;

    height:100%;

    box-shadow:
    0 10px 30px rgba(0,0,0,.08);

}



.feature-card i {

    font-size:40px;

    color:#0d6efd;

    margin-bottom:20px;

}