:root {
  --color1: #381631;
  --color2: #e21c61;
  --color3: #e26159;
  --color4: #fea85f;
  --color5: #d8dcb4;
  --color6: #5eb6ad;
  --color7: #1b958d;
  --color8: #105390;
}

* {
  font-family: "VT323", monospace;
  font-weight: 500;
  font-style: normal;
  color: var(--color5);
}

body {
  background: var(--color1);
  margin: 0 10px;
  padding-top: 25px;
}

.container {
  font-size: 100px;
  margin-top: 20px;
}

.container ul {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 0px;
  margin: 10px 20px;
  justify-content: center;
}

.container ul li {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--color4);
  border: 3px solid var(--color2);
  padding: 10px;
  border-radius: 20px;
  transition: transform 0.3s ease-in-out;
}

.container ul li:hover {
  transform: scale(1.05);
}

.container ul li img {
  width: 70px;
  height: auto;
  filter: drop-shadow(1px 1px 0 var(--color1))
    drop-shadow(-1px -1px 0 var(--color1)) drop-shadow(1px -1px 0 var(--color1))
    drop-shadow(-1px 1px 0 var(--color1));
}

.main-title {
  font-size: 70px;
  text-align: center;
  color: var(--color5);
}

.subtitle {
  color: var(--color2);
  text-align: center;
  font-size: 50px;
  margin-top: 10px;
}

.small-title{
  color: var(--color4);
  font-size: 40px;
  text-align: center;
}

.important-text {
  color: var(--color6);
}

.contact-text {
  text-align: center;
  font-size: 30px;
}

.contact-icons {
  display: flex;
}

.contact-icons ul {
  width: 100%;
  display: flex;
  gap: 10px;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  list-style: none;
  padding: 0;
  margin: 0;
}

.logos{
 display: flex;
 gap: 10px;
}


@media (min-width: 601px) and (max-width: 800px) {

  body{
    margin-top: 15px;
  }

  .container ul li img {
    width: 60px;
    height: auto;
  }

  .main-title{
    font-size: 50px;
  }

  .subtitle{
    font-size: 40px;
  }

  .small-title{
    font-size: 35px;
  }
}


@media (max-width: 600px) {

  body{
    margin-top: 5px;
  }

  .container ul li img {
    width: 50px;
    height: auto;
  }

  .main-title{
    font-size: 40px;
  }

  .subtitle{
    font-size: 35px;
  }

  .small-title{
    font-size: 30px;
  }
}