body {
    background-image: url("../images/Background.jpg");
    justify-content: center;
}

h1 {
    font-size: 8em;
    text-align: center;
    background: -webkit-linear-gradient(#08363c, #444);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-family: 'Passion One', cursive;
}

h3 {
    padding-top: 2px;
}

.img-div {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: center;
}

.row {
    height: 20%;
    padding: 1%;
    border: 1px solid #08363c;
}

.column {
    border: 1px solid #08363c;
    text-align: center;
}

span {
    font-size: 5em;
}

p, h3, span {
    font-family: 'Domine', serif;

}

p {
    padding: 1%;
    font-size: 1em;
}

.main-container  {
    background-color: #ddf0ea;
    opacity: 0.7;
}

.rules {
    background-color: #ddf0ea;
    opacity: 0.5;
}

.crystals {
    height: 125px;
    width: 125px;
    
}

.crystal {
    justify-content: space-evenly;
    align-items: center;
    display: flex;
    width: 100%;

}

.loader {
    width: 100%;
    height: 100vh;
    background: #006266;

}

.page-title {
    padding-top: 100px;
    padding-bottom: 100px;
} 


.loader .page-title h1 {
    font-size: 10em;
    background: -webkit-linear-gradient(#08363c, #444);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    top: 50%;
    left: 50%;
    font-family: 'Passion One', cursive;
    position: fixed;
    transform: translate(-50%, -50%);
}