@font-face {
  font-family: Comfortaa;
  src: url('../fonts/Comfortaa/static/Comfortaa-Regular.ttf');
}
body{
  font-family: 'Segoe UI';
  font-weight: 400;
  background: #e8e8e8;
  display:flex;
  flex-direction: column;
  justify-content: center;
	align-items: center;
}
.main-section{
    display:flex;
    align-items: center;
}
@media(min-width:801px){
  .main-section{
    justify-content: space-between;
    width:min(100%,750px);
    height:80vh;
  }
}
@media(max-width:800px){
  body{
    height:max(600px,100vh);
  }
  .main-section{
    flex-direction: column;
    justify-content: space-evenly;
    height:100%;
    width:100%;
    box-sizing: border-box;
  }
}
h2{
  text-align: left;
  font-weight: normal;
  font-size: 24px;
  margin-bottom:40px;
}

.main-section>img{
  width:min(350px,100%);
  padding:20px 0;
}
.logIn{
  background-color:white;
  border-radius:9px;
  color:#2c3038;
  padding: 42px 28px;
  z-index:99;
  box-shadow: 0 2px 10px 0 rgba(0,0,0,.1);
}
.logIn form{
  display:flex;
  flex-direction: column;
	align-items: center;
}
.logIn form input{
  width:min(316px,100%);
  height:36px;
  background-color: #e8f0fe;
  outline:none;
  border: 1px solid #c3c7ce;
  margin:12px 0 20px 0;
  font-size: 18px;
  border-radius: 10px;
  padding-left: 10px;
}
.logIn form input[type=submit]{
  background-color:#1c84c6;
  border: none;
  color:white;
  border-radius: 31px;
  width:100%;
  margin: 25px 0 0 0;
  cursor:pointer;
  font-size:16px;
}
.logIn form label{
  display:block;
  width:100%;
  text-align: left;
  font-size: 16px;
}
#notice{
  position: absolute;
  top:0;
  text-align: center;
  background-color: #ab0021; 
  padding:7px 0;
  max-width: 100%;
  width:100%;
  color:#eee;
}

footer{
  background-color:rgb(51,128,99);
  color:black;
  width:100%;
  overflow:hidden;
  display:flex;
  justify-content: space-evenly;
  align-items: flex-start;
  color:#eee;
}
footer>div{
  border-radius: 34px;
  box-sizing: border-box;
  margin:20px 0;
}
footer p,footer a{
  margin-bottom:10px;
}
h1,h3{ 
  text-align: left;
  margin-bottom:20px;
  color:white
}
@media(min-width:801px){
  footer{
    height: 20vh;
    justify-content: space-evenly;
  }
  footer>div{
    padding: 5px 20px;
  }
  h1,h3{
  font-size: 20px;
  }
  footer p,footer a{
    font-size: 18px;
  }
}
@media(max-width:800px){
  footer{
    justify-content: space-around;
    bottom:0;
    height:180px;
  }
  footer>div{
    padding: 5px 5px;
    margin:10px 0;
  }  
  h1,h3{
    font-size: 16px;
  }  
  footer p,footer a{
    font-size: 14px;
  }
}