@font-face {
	font-family: 'Geist';
	src: url('/assets/fonts/Geist-Regular.otf') format('opentype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Geist Mono';
	src: url('/assets/fonts/GeistMonoNerdFont-Regular.otf') format('opentype');
	font-weight: normal;
	font-style: normal;
}

body {
    font-family: Geist, sans-serif;
}

code {
	font-family: Geist Mono, monospace;
}

div.container {
    margin: 0 auto;
}

div.content {
    width: 50%;
    height: auto;
    margin: 0 auto;
    position: relative;
}

@media screen and (max-width: 1440px) {
    div.content {
        width: 60%;
        height: auto;
        margin: 0 auto;
        position: relative;
    }
}

@media screen and (max-width: 1080px) {
    div.content {
        width: 80%;
        height: auto;
        margin: 0 auto;
        position: relative;
    }
}

@media screen and (max-width: 768px) {
    div.content {
        width: 100%;
        height: auto;
        margin: 0 auto;
        position: relative;
    }
}

body {
    //background-color: #242424;
    background-color: #000000;
    color: #E7D7AD;
}

pre {
    background-color:#32302F;
    padding: 10px 10px 10px 10px;
    border-radius: 10px;
    white-space: pre-wrap;
    white-space: pre-wrap;
}

a {
	color: #E7D7AD;
	text-decoration: none;
	border-bottom: 3px solid #FABD2F;
	border-radius: 2px;
}

a:hover {
	color: #000000;
	background: #FABD2F;
	text-decoration: none;
	border-bottom: 3px solid #FABD2F;
	border-radius: 2px;
}

img {
    max-width:70%;
    max-height:100%;
    margin-left: auto;
    margin-right: auto;
    display: block;
}

::selection {
  color: #000000;
  background: #FABD2F;
}

span.growshrink {
  display: inline-block;
  animation-duration: 5s;
  animation-name: grow-shrink;
  animation-iteration-count: infinite;
}

@keyframes grow-shrink {
  25%,
  75% {
    scale: 100%;
  }

  50% {
    scale: 110%;
    color: #FABD2F;
  }
}