:root{
    /* v1 Palette can be found here: https://rosepinetheme.com/palette/ */
}

html{
    background-color:#232136;
    color:#e0def4;
    font-family:monospace;
}

body{
    margin:0;
}

.container{
    display:flex;
    flex-direction:column;
    align-items:center;
    position:fixed;

    width:100vw;
    height:100vh;
    margin:0;
}

.centre{
    justify-content:center;
}

div{
    margin:1%;
}

.buttons{
    display:flex;
    flex-direction:row;
    width:40vw;
    justify-content:space-evenly;
}

.primary{
    color:#eb6f92;
}
.secondary{
    color:#3e8fb0;
}

.tertiary{
    color:#c4a7e7;
}

.active-game{
    color:#ea9a97;
}

.return-arrow{
    position:absolute;
    margin-left:1%;
    z-index:1;
}

button, input[type="submit"], input[type="reset"], a {
	background: none;
	color: inherit;
	border: none;
	padding: 0;
	font: inherit;
	cursor: pointer;
	outline: inherit;
    text-decoration:none;
}

.game-selection{
    display:flex;
    flex-direction:row;
    justify-content:space-evenly;
    width:80vw;
    margin-top:0%;
    margin-bottom:2%;
}

h1{
    font-weight:800;
    font-size:4em;
    text-align:center;
}
h2{
    font-weight:600;
    font-size:3em;
    text-align:center;
}
h3{
    font-weight:400;
    font-size:2em;
    text-align:center;
}
h4{
    font-weight:300;
    font-size:1.75em;
    text-align:center;
}
h5{
    font-weight:200;
    font-size:1.25em;
    text-align:center;
}

.no-margin{
    margin:0;
}