@font-face {
  font-family: 'TantoFontV2';
  src: url('TantoFontV2.ttf');
}

@media (max-width: 1560px) {
  .screenshots-container a{
    max-width: 95% !important;
  } 
}

@media (max-width: 600px) {
  .left-container, .right-container {
    visibility: hidden;
    width: 0 !important;
  }
  .content-container {
    width: 90% !important;
  }
  .screenshots-container a{
    max-width: 80% !important;
  } 
}

h1, h2, h3 {
  font-weight: normal;
}

.justified{
  text-align: justify;
}

.centered{
  text-align: center;
}

body {
  margin: 0;
  background-image: url("/remisol/assets/title_screen/title_screen_website.gif");
  background-position: bottom;
  background-attachment: fixed;
  background-size: cover;
  background-repeat: no-repeat;
  
  color: white;
  font-family: 'TantoFontV2';

  font-weight: normal;
}

.title-screen{
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  text-shadow: 2px 2px black;
}

.title img{
  width: 780px;
  max-width: 90vw;
  image-rendering: pixelated;
}

.title p{
  text-align: center;
}

.download-container p {
  text-align: center;
  text-shadow: 2px 2px black ;
}

.download-buttons-container{
  display: flex;
  justify-content: space-around;
  min-width: 20vw;
}

button{
  font-family: 'TantoFontV2';
  font-size: 32px;
  color: white;
  padding: 10px;
  background-color: rgba(0, 0, 0, 0.75);
  border: solid white 1px;
}

button:hover{
  cursor: pointer;
  z-index: 10;
}

.main-container{
  display: flex;
  justify-content: space-around;
  /* width: 100vw; */
  background-color: black;
  margin-left: 1%;
  margin-right: 1%;
}

.title-screen {
  height: 100vh;
}

.left-container, .right-container {
  /* position: fixed; */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-evenly;
  height: 100vh;
  width: 15vw;
}

.left-container {
  /* left: 2%; */
}

.right-container {
  /* right: 2%; */
}

.left-container img, .right-container img {
  width: 13vw;
  margin: 0 1vw;
}

nav {
  display: inline-block;
  width: fit-content;
  border: white solid 2px;
  margin: 0;
  padding: 0 2px;
}

nav button {
  font-family: 'TantoFontV2';
  font-size: medium;
  background-color: white;
  margin: 2px 0;
  border: none;
}

nav button:hover{
  color: rgb(47, 0, 255);
}

.content-container {
  position: relative;
  margin-top: 50px;
  width: 55%;
  background-color: black;
  /* text-align: center; */
}

.resume{
  margin-top: 20vh;
}

.screenshots-container{
  display: flex;
  justify-content: space-evenly;
  flex-wrap: wrap;
  width: 100%;
  gap: 10vh;
} 

.screenshots-container a{
  max-width: 45%;
} 

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

.wipwarning{
  text-align: center;
}

.contact-container{
  margin-top: 10vh;
  margin-bottom: 10vh;
}

.email{
  text-align: center;
}

ul {
  display: inline-block;
  text-align: left;
  margin: 0;
  /* width: 30vw; */
  /* list-style-type: none; */
}

li {
  margin-bottom: 15px;
}

li::marker {
  color: white;
}

.blank_container
{
  height: 100vh;
}

.soso-container
{
  display: flex;
  position: absolute;
  bottom: 0px;
  justify-content: center;
  width: 100%;
}

.soso-container img
{
  /* width: 5vw; */
  height: 296px !important;
  image-rendering: pixelated;
}

footer {
  padding: 10px;
  background-color: black;
  border-top: 10px ridge white;
  text-align: center;
}