@font-face {
  font-family: 'Triforce';
  src: url('fonts/Triforce.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

html {
  height: 100%;
}

body {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100svh;
  margin: 0;
}

h1 {
  margin: 0;
  padding-left: 16px;
  padding-right: 16px;
  text-wrap: pretty;
  text-wrap: balance;
}

.centered {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  height: 100%;
  max-width: 100%;
}

#services {
  width: 100vw;
  min-height: 100svh;
  height: 100svh;
  background: #ffffff;
}

#chat-service-container,
#memo-service-container {
  display: inline-block;
}

.service-image-desktop {
  max-width: 200px;
  max-height: 200px;
  width: auto;
  height: auto;
  object-fit: contain;
  margin: 20px;
}

.centered-text {
  text-align: center;
  font-size: xx-large;
}

.service-link-text {
  text-transform: uppercase;
  font-family: "Triforce";
  font-size: 44px;
  color: #000000;
}

#services a {
  text-decoration: none;
}

.no-margin {
  margin: 0;
}

.no-padding {
  padding: 0;
}

.mb-10 {
  margin-bottom: 10px !important;
}

.unselectable {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.hidden {
  display: none !important;
}

h2 {
  margin: 0;
  margin-top: 8px;
  margin-left: 20px;
  text-transform: uppercase;
  font-family: "Triforce";
  font-size: 64px;
}

.spacer {
  height: 8px;
  background-color: rgb(152, 188, 255);
}

.image-with-subtext-container {
  display: flex;
  flex-direction: column;
  width: 300px;
  align-items: center;
}

.h-box {
  display: flex;
  flex-direction: row;
}

.vertically-aligned-items {
  align-items: center;
}

#services-mobile {
  display: flex;
  flex-direction: column;
}

.service-image-mobile {
  max-width: 40px;
  max-height: 40px;
  width: auto;
  height: auto;
  object-fit: contain;
  margin: 10px;
}

.horizontally-aligned-items {
  align-items: center;
}