body{background-color: goldenrod;
    font-family: "Tilt Prism", sans-serif;
}
h1{font-style: italic}
h1{color: darkgreen}
h3{font-style: italic}

/* i denne her del kan man ændre på positionen af nav (og self alt det der er en del af nav, så som p, h1 and so forth
flex-direction er om de ting i nav skal være i en row, coloumn and so forth.
 justify content fortæller hvor ting i nav skal postioneres, link to help here "https://css-tricks.com/snippets/css/a-guide-to-flexbox/"
 */

nav{display:flex;
    flex-direction: row;
    justify-content: center;

}


span{color: royalblue;
    font-weight: bolder;

}

/* her har jeg sagt at alle p,divs eller whatever med klassen "fuckgg" at de skal have en deepink farve, sådan opdeler
man hvilke p'er divs også videre skal have hvilken farve eller tekstform
 */

/* der er også noget der hedder id'er, det er det samme som klasse, men kan kun bruges 1 gang så who cares (one time use)

 */

.fuckgg{
    color: deeppink;
    background-color: cadetblue;
}

/* her fortæller ejeg hvad alle elementer med klassen "kræft" skal have en margin på mellem hinanden, leg lidt med den og kig på "jeg hedder niclas" og "ahhh" delen

 */
.kræft{
    margin: 20px;

}
.shit{
    color: beige;
}


/* man kan bruge in (inch) cm (centimeter), % (procenthvis af forældreelementet (tror det er hvilken enhed du bruger med siden)
og px (pixler)
 */

.constans{
    font-size: 1000%;

}

.shiet{
    font-size: 5in;

}


/* dette får alle anchors til at være bold, med en sort farve, og uden noget andet "decoration", og a:hover giver alle anchors
en lilla farve når du hover over anchoret
 */

a{font-weight: bold;
    color: black;
    text-decoration: none;
}

a:hover{
    color: purple;
}

@media screen and (min-width: 400px) {
    background-color: purple;
}

div {
    width: 100px;
    height: 100px;
    background: red;
    position: relative;
    animation: mymove 5s infinite;
}

@keyframes mymove {
    0%   {top: 0;}
    25%  {top: 200px;}
    75%  {top: 50px}
    100% {top: 100px;}
}

section{display: flex;
    position: absolute;
}

h1{
    display: flex;
    justify-content: center;
}

.cancer{background-color: purple}