@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap");
* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

body {
    font-family: "montserrat", sans-serif;
    background: transparent;
    height: 100vh;
    position: relative;

}
.container {
  width: 100%;
  height: 100vh;
  display: flex;
  justify-content:center;
  align-items: center;
  background: rgb(23,148,177);
background: linear-gradient(326deg, rgba(23,148,177,1) 0%, rgba(255,255,255,1) 48%, rgba(238,66,9,1) 100%);
}
.container_login {
    width: 400px;
    height: 400px;
    border-radius: 10px;
    background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.9585084033613446) 1%,
    #0888af 95%
  );
    display: flex;
    justify-content:start;
    align-items: center;
    flex-direction: column;
    margin: 0px 20px 0px 20px;
    padding: 5px;
    box-shadow: 0 0 10px #000;
}
img {
    height: 150px;
    margin: 20px 0px 40px 0px;
  }

.row {
    width: 100%;
    display: flex;
    justify-content:center;
    flex-direction: row;
    align-items:space-around; 

}
.col {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content:space-around;
    align-items:center;
    text-align:center;

}
.col-100 {
    width: 100%;
}
.col-95 {
  width: 95%;
}
.col-90 {
  width: 90%;
}
.col-85 {
  width: 85%;
} 
.col-80 {
  width: 80%;
} 
.col-75 {
    width: 75%;
  
}
.col-70 {
    width: 70%;
   
}
.col-65 {
    width: 65%;
   
}
.col-60 {
    width: 60%;
   
}
.col-55 {
    width: 55%;
   
}
.col-50 {
    width: 50%;
   
}
.col-45 {
    width: 45%;
   
}
.col-40 {
    width: 40%;
   
}
.col-35 {
    width: 35%;
   
}
.col-30 {
    width: 33%;
   
}
.col-25 {
    width: 25%;
   
}
.col-20 {
    width: 20%;
   
}
.col-15 {
    width: 15%;
   
}
.col-10 {
    width: 10%;
}
.col-5 {
    width: 5%;
}
.col-3 {
    width: 3%;
}
#loginForm {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}
input {
  
    width: 100%;
    height: 40px;
    font-family: "montserrat", sans-serif;
    color: #feffff;
    outline: 0;
    border: 0;
    margin:10px;
    padding: 5px;
    font-size: 16px;
    border-bottom:dotted 1px #ffffff;  
    display: flex;
    justify-content:center;
    align-items: center;
    text-align: center;
    background: transparent;
 

}
::placeholder {
    color: #ffffff;
}
.btn {
    display: flex;
    justify-content: center;
    align-items: center;
      width: 100%;
      height: 40px;
      background-color: #0798c4;
      border: none;
      border-radius: 10px;
      font-family: "montserrat", sans-serif;
      text-align: center;
      font-style: normal;
      font-weight: 500;
      color: rgb(255, 255, 255);
      font-size: 16px;
      cursor: pointer;
      padding: 10px 20px 10px 20px;
      margin:10px;
      box-shadow: #5f6368 1px 1px 5px;
  }
  
  .btn:hover {
      background-color: #0bb7eb;
  }