@font-face {
  font-family: Esphimere;
  src: url("../fonts/Esphimere.otf") format("opentype");
}
body {
  color: white;
  background: radial-gradient(circle at center,#ffffff 1%,#ffffff 100%);
}
.logo {
  display: block;
  width: 80%;
  max-width: 280px;
  margin: 2em auto;
}
.panel {
  width: 80%;
  max-width: 400px;
  margin: auto;
  margin-bottom: 2em;
}
p {
  font-family: Esphimere, sans-serif;
  font-size: 1.2em;
  text-align: center;
  color: #060038;
}
.apps {
  display: flex;
}
.app {
  box-shadow: inset 0 0 40px 20px #5c00d8;
  display: inline-flex;
  padding: 0.5em 1em;
  border-radius: 10%;
  cursor: pointer;
  margin: auto;
  width: 2.5em;
  height: 3.5em;
  align-items: center;
}
.app:hover {
  box-shadow: inset 0 0 40px 20px #ad71fc;
}
.app img {
  width: 100%;
}

.container {
  display: flex;
  flex-direction: column;
}

@media only screen and (min-width: 768px) {
  /* For desktop: */
  .container {
    margin: 5em;
    flex-direction: column-reverse;
  }
}