@import url('https://fonts.googleapis.com/css2?family=Fira+Sans&display=swap');

html {
  --text: white;
  --bg: #000010;
  --texthover: #FFD800;
  --textactive: white;

  height: 100%;
  scroll-behavior: smooth;
}

* {
  margin: 0;
  padding: 0;
  font-weight: normal;
}

body {
  color: var(--text);
  background: var(--bg);
  text-align: center;
  font-family: 'Fira Sans';
  margin: 0;
  padding: 0;
}

a {
  text-decoration: none;
  color: inherit;
}

.ptable {
  background: rgba(0, 0, 0, 0.5);
}

.ptablepadding {
  padding-bottom: 150px;
}

.pagecontent {
  padding-top: 250px;
}

#his {
  height: 150px;
}

#container{
  background: rgba(0, 0, 0, 0.5);
  padding-top: 20px;
  padding-bottom: 35px;
  padding-left: 100px;
  padding-right: 100px;
  float: left;
  height: 550px;
  vertical-align: middle;
}

#mainh {
  padding-bottom: 15px;
  font-size: 50px;
}

#mainp {
  text-align: justify;
  vertical-align: middle;
  font-size: 200%;
  width: 75%;
  padding-left: 100px;
  padding-top: 20px;
  padding-bottom: 20px;
}

#lucas {
  max-width: 70%;
  padding-right: 50px;
  float: right;
}

#mainp2 {
  text-align: justify;
  vertical-align: middle;
  font-size: 170%;
  width: 75%;
  padding-right: 100px;
  padding-top: 20px;
  padding-bottom: 20px;
}

#sw {
  max-width: 75%;
  padding-left: 100px;
  padding-right: 20px;
  float: left;
}

@media screen and (max-width: 1500px) {

  img#lucas {
    padding-right: 50px;
  }

}

@media screen and (max-width: 1000px) {

  td#mainp {
    font-size: 150%;
  }

}

@media screen and (max-width: 900px) {

  img#lucas {
    padding-right: 25px;
  }

}

@media screen and (max-width: 700px) {

  img#lucas {
    display: none;
  }

  td#mainp {
    width: inherit;
    padding-left: 50px;
    padding-right: 50px;
    font-size: 100%;
    text-align: inherit;
  }
}