Opmaak

#(pagina)-background{
background: url(link) no-repeat center center fixed;
background-size: cover;
overflow: hidden;

VOOR DE ACHTERGROND VAN MIJN WEBSITE.
BACKGROUND-SIZE: COVER WORGT ERVOOR DAT HET DE HELE SCHERM VULT

.login {
width: 24%;
position: absolute;
margin-left: 50%;
margin-right: 50%;
margin-top: 20%;
height: 58%;
transform: translate(-50%,-50%);
font-family: 'Cinzel Decorative', cursive;
background: white;
border-style: none;
opacity: 0.8;
padding: 25px;
border-radius: 5%;
box-shadow: 0 0 20px 2px gray;
}

DE BOX VAN MIJN LOGIN

.table{
border-spacing: 1;
border-collapse: collapse;
background: rgba(255,255,255, 0.8);
overflow: hidden;
min-width: 400px;
width: 40%;
font-size: 110%;
border-Radius: 2%;
margin: 5% 30%;
font-family: 'Cinzel Decorative', cursive;
box-shadow: 100px black;
box-shadow: 0 0 10px 2px rgba(235,183,179, 0.5);
}

DE TABEL VAN MIJN CIJFERLIJST

@media (max-width: 768px){
#sidenav {
width: 100%;
height: 100%;
position: fixed;
right: -100%;
top: 0;
z-index: 2;
transition: 2s;
}

#menuknopje{
width: 40px;
height: 50px;
text-align: center;
position: fixed
top: 30px;
left: 90%;
bottom: 0px;
border-radius: 3px;
z-index: 3;
cursor: pointer;
}

nav ul li
list-style: none;
margin: 20% 0% 0% 0%;
}
}

DE CSS DAT IK HEB GEBRUIKT VOOR MIJN NAVIGATIE.
DE Z-INDEX ZORGT ERVOOR DAT DE NAVIGATIE OVER ALLES HEEN GAAT.

.titels {
font-family: 'Metal Mania', cursive;
-webkit-text-stroke: 1px white;
text-align: center;
color: black;
font-size: 200%;
}

VOOR MIJN TITELS. -WEBKIT-TEXT-STROKE ZORGT ERVOOR
DAT ER EEN LIJN OVER MIJN TEXT KOMT

.snow {
position: absolute;
top: 0;
left: 0;
background: transparent;
}

ZORGT ERVOOR DAT DE SNEEUW MIJN PAGINA BEDEKT

.border-hashiras {
box-shadow: inset 0 0 20px 10px #ccdd76;
width: 18%;
height: 30%;
padding: 1%;
border: 1px none pink;
background: rgba(245,190,205, 0.9);
border-radius: 8%;
text-align: center;
color: white;
display: inline-block;
vertical-align: top;
margin: 2% 3% 2% 3%;

}

BOX VAN DE HASHIRAS. DISPLAY: INLINE-BLOCK ZORGT
ERVOOR DAT ZE NAAST ELKAAR KOMEN TE STAAN.

#divanimation {
padding: 8px;
background:#661e14;
width: 100px;
height: 100px;
transform: rotate(45deg);
margin-left: 32%;
}


#divanimation2 {
padding: 8px;
background:#661e14;
width: 100px;
height: 100px;
border-Radius: 50%;
margin-bottom: -16px;

}

#divanimation3 {
padding: 8px;
background:#661e14;
width: 100px;
height: 100px;
border-Radius: 50%;
}

.circle-placement{
float: left;
margin: -215px 32%;
transform: rotate(90deg);
}

WAT IK HEB GEBRUIKT OM MIJN HARTJE TE MAKEN. DOOR HET
VIERKANTJE TE ROTATEN MAAKTE IK DE ONDERKANT VAN HETR HARTJE.