@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@700&family=Open+Sans:ital,wght@1,300&display=swap');

body {
    margin: 0;
    padding: 0;
    background: black;
}

/* HEADER */

.header {
    display:flex;
    justify-content: space-evenly;
    align-items: center;
    color:white;
}

.title {
    cursor: pointer;
    font-family: 'Open Sans', sans-serif;
    transition: opacity 0.3s;
    opacity: 70%;
}

.title:hover {
    opacity: 100%;
}

.header a {
    cursor: pointer;
    font-family: 'Open Sans', sans-serif;
    opacity: 70%;
    transition: font-size 0.3s, opacity 0.3s;
}

.header a:hover {
    font-size: 20px;
    opacity: 100%;
}

/* LANDING BLOCK */

.landingblock {
    height:800px;
    text-align: center;
    width:100%;
    position:absolute;
    z-index: 2;
    color: white;
    margin: 200px 0 0 0;
}

.landingblock h1 {
    font-family: 'Open Sans', sans-serif;
    font-size: 20px;
}

.landingblock a {
    color: white;
    font-family: 'Open Sans', sans-serif;
    background-color: rgb(97, 97, 224);
    padding: 10px 20px;
    border-radius: 10px;
    cursor: pointer;
    text-decoration: none;
    transition: padding 0.3s;
}

.landingblock a:hover {
    padding: 15px 30px;
}

.landingblock .highlighted {
    color:rgb(255, 255, 255);
    margin: -20px 0 40px 0;
    font-family: 'Dancing Script', cursive;
    font-size: 100px;
}

.landingimage {
    width: 100%;
    position: absolute;
    z-index: 1;
    height:600px;
}