@import url('https://fonts.googleapis.com/css2?family=Fira+Code:wght@300..700');
@import url('https://fonts.googleapis.com/css2?family=Fira+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300..900;1,300..900&display=swap');

@keyframes rotation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(-359deg);
  }
}

body {
  background-color: #1a1917;
  /*background-image: url("./testout/FEBack/FEBack.png");
  background-position: center;
  background-repeat: repeat;*/
  background-image: url("./fix/powahirain_rain/powahirain_rain_simple.png");
  background-size: auto 100%;
  image-rendering: crisp-edges;
  background-attachment: fixed;
  color: #c7c4c1;
  font-family: "Figtree", Verdana, sans-serif;
  font-size: 1.1rem;
  line-height: 1.4;
  overflow-x: hidden;
}

.left{
  width:20%;
  height:100%;
  max-height:800px;
  max-width: 400px;
  left: 0;
  bottom: 0;
  position:fixed;
  image-rendering: crisp-edges;
  background-image: url("./oneoff/left.png");
  background-position: top right;
  background-size: auto auto;
  z-index: -50;
}

.right{
  width:20%;
  height:100%;
  max-height:800px;
  max-width: 400px;
  right: 0;
  bottom: 0;
  position:fixed;
  image-rendering: crisp-edges;
  background-image: url("./oneoff/right.png");
  background-position: top left;
  background-size: auto auto;
  z-index: -50;
}

#container {
  margin: 3em auto;
  width: 90%;
	max-width: 706px;
	/*background-color: #1f1f1f;*/
	background-color: #282e38;
	border-radius: 5px;
  /*outline-color: #444444;*/
  outline-style: none;
  /*outline-width: 4px;*/
  outline-offset: 0;
  padding: 10px 5% 20px 5%;
}

code {
  font-family: "Fira Code", "Courier New", Courier, monospace;
  background-color: #171b24;
  font-size: 0.9em;
  padding: 0px 2px 0px 2px;
  border-radius: 4px;
}

a:link{
  color: #24acc4;
}

a:visited{
  color: #bc1fc4;
}

.thumb img{
  max-width: 100%;
}

.pic-wide{
  white-space: nowrap;
  overflow: auto;
}

@media screen and (max-width: 600px) {
  .left, .right {
    display: none;
  }
  #container {
    margin: 2em auto;
  }
}