@import url('https://fonts.googleapis.com/css2?family=Monoton&display=swap');
*{
    margin:0;
}

body, html{
    height:100vh;
    position:relative;
}

main{
    background-image:url("../images/skiresort.jpg");
    height:100%;
    background-repeat: no-repeat;
    background-size:cover;
    background-position: center;
}

article{
    
    width:50%;
    height:90vh;
    margin:auto;
    display:flex;
    flex-direction: column;
    justify-content:center;
    align-items:center;
    background: 10px;
    font-family:Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
}

h1{
      font-family: "Monoton", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size:6rem;
  color:white;
  text-shadow: 10px 10px 40px rgba(202, 7, 7, 1);
  border-style: double;
}

small{
    font-size:1.8em;
    color:rgb(255, 255, 255);
    text-shadow: 10px 10px 40px rgba(202, 7, 7, 1);
}

button{
    width:200px;
    height:100px;
    border-radius:5px;
    font-size:1.5em;
    border:none;
    background-color: rgba(255, 255, 255, .5);
    transition-duration: 0.7s;
    color:rgba(202, 7, 7, 1)
}

button:hover{
    width:300px;
    height:150px;
    border-radius:10px;
    font-size:2em;
    border:none;
    background-color: rgba(255, 255, 255, .8);
    transition-duration: 0.7s;
    text-decoration: underline;
}

h2{
    font-size:2.5em;
    color:white;
   text-shadow: 10px 10px 40px rgba(202, 7, 7, 1);
}


h3{
    font-size:2em;
    color:white;
    text-shadow: 10px 10px 40px rgba(202, 7, 7, 1);
}