@import url(https://cdn.jsdelivr.net/gh/tonsky/FiraCode@1.207/distr/fira_code.css);

body {
  background-color: #292929;;
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
}
.image {
  vertical-align: bottom;
  height: 50vw;
  width: 67.1vw;
  background-image: url('background.png');
  background-size: 100% 100%;
  position: relative;
}

.contact {
  position: relative;
  margin-left: auto;
  margin-top: 33vw;
  margin-right: 3vw;
  padding-bottom: calc(50px + 5vw);
  width: 35%;
  height: 13%;
  color: #E5E5E5;
}

#title {
  margin: auto 0;
  float: left;
  width: 20%;
  position: relative;
  text-align: left;
  font-family: 'Fira Code';
  font-weight: 500;
  font-size: 1.75vw;
}

#text {
  float: right;
  width: 80%;
  position: relative;
  text-align: right;
  font-family: 'Fira Code';
  font-weight: 400;
  font-size: 1vw;
}

a {
  color: #EFDD81;
}

@media screen and (max-width: 780px) {
  .image {
    width: 100vw;
    height: 500vw;
    background-image: url('background_mobile.png');
    background-size: 100% 100%;
    position: relative;
  }
  .contact {
    margin: 430vw auto auto auto;
    width: 80%;
  }

  #title {
    font-size: calc(20px + 4vw);
  }

  #text {
    font-size: calc(12px + 2vw);
    width: 100%;
  }
}

@media (max-width: 350px) {
  #text {
    word-break: break-all;
  }
}
