html, body {
  height: 100%;
  margin: 0;
  padding: 0;
}

body {
  margin: 0;
  padding: 0;
  height: 100vh;
  width : 100vw;
  display : grid;
}

.container {
  background: linear-gradient(90deg, hsla(186, 33%, 94%, 1) 0%, hsla(216, 41%, 79%, 1) 100%);
  height: 100vh;
  width: 100vw;
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

 @media (min-width: 992px) {
        .container {
          max-width: none; /* Override Bootstrap's max-width */
        }
      }
 @media (min-width: 576px) {
        .container {
          max-width: none; /* Override Bootstrap's max-width */
        }
      }
 @media (min-width: 576px) {
          .container {
                max-width: none; /* Override Bootstrap's max-width */
          }
 }


 .btn-primary{
     background-color: deepskyblue;
     border-color : deepskyblue;
     width: 20rem;
     height : 3rem;
     --bs-btn-hover-bg: deepskyblue;
 }