/* 
Made by Kumaclick. Apolgy for bad code...
If you are reading this thanks because 
this css took me a while to get right.
*/
@import url('https://fonts.googleapis.com/css2?family=Sawarabi+Gothic&display=swap');

body {
  background-size: 30px 30px;
  background-color:rgb(173,216,230);
  background-image:
    linear-gradient(to right, white 1px, transparent 1px),
    linear-gradient(to bottom, white 1px, transparent 1px);
  background-attachment:fixed;
    font-family: 'Sawarabi Gothic', sans-serif;
}

aside {
	position: top;
width: 50%;
  margin: 0 auto;
  overflow: auto
}

nav {
    text-decoration: none;
    font-size: 15px;
	float:left;
	padding: 10px;
	text-align: center;
}

.icon {
    width: 64px;
    image-rendering: crisp-edges;
    image-rendering: pixelated;
}

main {
    width: 50%;
  margin: 0 auto;
clear: left;
}

article {
    padding-bottom: 100px;
    border: solid 2px black;
    padding: 15px;
    box-shadow: 2px 2px;
    background: rgba(255, 255, 255);
overflow: auto;
}

h1 {
    font-size: 16px;
    padding-top: 5px;
    padding-bottom: 5px;
    text-align: center;
    margin: -15px;
    border-bottom: solid 2px black;
    background-color: rgb(173,216,230);
    background-image: linear-gradient(transparent 50%, rgb(255, 255, 255) 50%);
    background-size: 2px 2px;
}

button {
    border: dashed 2px rgb(173,216,230);
    padding: 5px;
    text-decoration: none;
    background: white;
    border-radius: 5px;
}

a {
    text-decoration: none;
    color: #005B9A;
    font-size: 16px;
}
a:hover {
  color: rgb(173,216,230);
  }

p {
    padding-top: 5px;
}

span {
    background: white;
    padding: 4px;
}

mark {
    background: white;
	padding-left: 5px;
	padding-right: 5px;
}


.link {
         width: 64px;
    image-rendering: crisp-edges;
image-rendering: pixelated;
        display: block;
    }    
.crop img {
        height: 50px;
        border: solid 1px black;
    }