html {
  box-sizing: border-box;
}
*,
*::before,
*::after {
  box-sizing: inherit;
}

body {
  background-color: rgb(25, 14, 14);
  background-image:url("../images/bgstampdarkest.png");
  background-size: 80px;
  margin: 5px;
  background-attachment: fixed;
  color: white;
}

main {
  margin: 30px auto;
  max-width: fit-content;
  width: 500px;
}

header {
  margin-inline: auto;
  max-width: fit-content;
}

footer { 
  margin-inline: auto;
  max-width: fit-content;
}

/*fra gammelt stildoc*/

a:link {
  color:deeppink
}
a:visited {
  color: crimson;
}

/*spafa effekt*/
.spafa span {
    display: none;
}
.spafa:hover span {
    display: inline;

}

img {margin-bottom: 40px;}


#container {
  display: grid;
  gap: 15px;
  width: 800px;
  margin: 2em auto;
  /*specificer grid-template i filen*/
  
}

.flex { /*mine flexrows*/
  display: flex;
  column-gap: 15px;

}


h2 {
  font-size: large;
}

.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 80%;
}

/*comicpages*/
#comicdisplay img {
    max-width: 100%;
}


/* exit button */
#closebutton {
  background-color: sienna;
  border: outset 3px sienna;
  color: bisque;
  position: absolute;
  display: inline-block;
  top: 20px;
  right: 20px;
  height: 20px;
  width: 20px;
  text-decoration: none;
}

#closebutton span {
  position: relative;
  bottom: 10px;
  right: -0.5px;
  font-size: 1.5em;
}

#closebutton:active {
  border: inset sienna;
}


/*fonts*/

@font-face {
  font-family: epilog;
  src: url(../fonts/epilog.ttf);
}
@font-face {
  font-family: codon;
  src: url(../fonts/codon.ttf);
}
@font-face {
  font-family: pinball;
  src: url(../fonts/pinball.ttf);
}
@font-face {
  font-family: technet;
  src: url(../fonts/technet.ttf)
}
@font-face {
  font-family: tommys;
  src: url(../fonts/tommys.ttf)
}
@font-face {
  font-family: atkinson;
  src: url(../fonts/AtkinsonHyperlegible-Regular.ttf)
}
@font-face {
  font-family: lexend;
  src: url(../fonts/Lexend-VariableFont_wght.ttf)
}


* {
  font-family: atkinson, arial;
}

h2, h2 a {
  font-family: lexend, arial;
}


h1 {
  font-family: epilog, codon, arial;
}
