/* Nippo Extralight */
@font-face {
  font-family: "Nippo";
  src: url("../fonts/Nippo/Nippo-Extralight.otf");
  font-weight: 200;
  font-style: normal;
}

/* Nippo Light */
@font-face {
  font-family: "Nippo";
  src: url("../fonts/Nippo/Nippo-Light.otf");
  font-weight: 300;
  font-style: normal;
}

/* Nippo Regular */
@font-face {
  font-family: "Nippo";
  src: url("../fonts/Nippo/Nippo-Regular.otf");
  font-weight: 400;
  font-style: normal;
}

/* Nippo Medium */
@font-face {
  font-family: "Nippo";
  src: url("../fonts/Nippo/Nippo-Medium.otf");
  font-weight: 500;
  font-style: normal;
}

/* Nippo Bold */
@font-face {
  font-family: "Nippo";
  src: url("../fonts/Nippo/Nippo-Bold.otf");
  font-weight: 600;
  font-style: normal;
}

/* html {
width: 100vw;
overflow: hidden;
} */

p,
h1,
h2,
h3,
.nav-item {
  font-family: "Nippo", "Arial", serif;
}

h1,
h2,
h3 {
  color: #595959;
  font-weight: 500;
}

h1 {
  width: 60%;
  font-size: 76px;
  line-height: 98.5px;
}

h2 {
  width: 27.5%;
  line-height: 70px;
  font-size: 50px;
}

h3 {
  font-size: 47px;
}

p {
  color: #6e6e6e;
  font-size: 24px;
  width: 57.5%;
  font-weight: 300;
}

body {
  background-color: #ccc;
  box-sizing: border-box;
}

.navbar {
  margin-left: 4.25vw;
  padding: 32px 0;
  background-color: #ccc;
}

.nav-item {
  font-weight: 300;
  font-size: 16px;
  padding: 0 50px;
  cursor: pointer;
}

#home .full-container {
  height: calc(97.5vh - 104px);
  background-color: #ccc;
  align-items: center;
}

.left-container {
  width: 67.5%;
  margin-left: 4.25vw;
}

#home .left-container {
  justify-content: center;
}

#home .right-container {
  justify-content: center;
  align-items: flex-end;
  height: 80%;
}

#arrow {
  transform: rotate(45deg);
}

.fadein,
.fadein2,
.fadein3 {
  opacity: 0;
}

#numbers {
  background-color: #b8b8b8;
}

.numbers-row span,
.numbers-row span p {
  font-family: "Helvectica", "Arial";
}

.numbers-row span {
  font-size: 80px;
  color: #595959;
  font-weight: 600;
}

.numbers-row p {
  font-size: 16px;
  color: rgb(89, 89, 89);
  width: 100%;
}

.video-section {
  margin-bottom: -6px;
}

.video-section p {
  font-size: 18px;
}

.video-text {
  margin-left: 15%;
  margin-top: 300px;
}

.custom-hr {
  background-color: #595959;
  width: 10px;
  height: 5px;
}

.cards-col {
  text-align: left;
}

#copyright {
  text-align: center;
}

#copyright p {
  width: 100%;
  font-size: 16px;
}

.navbar-collapse {
  text-align: center;
}

#footer p {
  font-size: 18px;
}

#network img {
  width: 50px;
}

#network a {
  margin-bottom: 10px;
}

#copyright {
  display: flex;
  align-items: center;
  justify-content: space-around;
}

#footer-nav {
  display: flex;
}

#footer-nav li {
  list-style: none;
}

#languageSelect {
  background-color: #ccc;
}

.select-menu {
  width: 175px;
}
.select-menu .select-btn {
  display: flex;
  height: 55px;
  background-color: #ccc;
  padding: 20px;
  font-size: 14px;
  font-weight: 400;
  border-radius: 8px;
  align-items: center;
  cursor: pointer;
  justify-content: center;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}
.select-btn img {
  width: 20px;
  aspect-ratio: 2/1;
  margin-right: 5px;
}

.select-menu .options {
  position: relative;
  padding: 20px;
  margin-top: 10px;
  border-radius: 8px;
  background-color: #ccc;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
  display: none;
}
.select-menu.active .options {
  display: block;
}
.options .option {
  display: flex;
  height: 55px;
  cursor: pointer;
  padding: 0 16px;
  border-radius: 8px;
  align-items: center;
  background-color: #ccc;
}
.options .option:hover {
  background-color: #ccc;
}
.option img {
  width: 20px;
  aspect-ratio: 2/1;
  margin-right: 12px;
}
.option .option-text {
  font-size: 14px;
  color: #333;
}

.item-hidden {
  visibility: hidden;
  padding: 0 25px;
}

.absolute-menu {
  position: absolute;
  z-index: 10000;
  top: 25px;
  right: 75px;
}

.show ul .item-hidden {
  justify-content: center;
  display: flex;
}

.menu-alter-content {
  display: flex;
  align-items: center;
}

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
  #home {
    margin-left: 10px;
  }

  .left-container {
    width: 100%;
    margin-left: 0;
  }
  h1,
  h3,
  p {
    line-height: unset;
    width: 100%;
  }
  h1 {
    font-size: 44px;
    margin-bottom: 0;
  }
  h3 {
    font-size: 26px;
  }
  p {
    font-size: 28px;
    margin-top: 1rem;
  }
  .numbers-row span {
    font-size: 20px;
  }
  #home .full-container {
    flex-direction: column;
    height: calc(97.5vh - 74px);
  }
  #home .right-container {
    width: 90%;
    height: 30%;
    justify-content: flex-end;
  }
  .video-text {
    margin-left: 15px;
    margin-top: 20px;
  }
}
/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) and (max-width: 768px) {
  h1 {
    font-size: 40px;
    line-height: unset;
  }
}

@media only screen and (min-width: 768px) and (max-width: 1025px) {
  .video-col {
    max-height: unset;
  }
  #footer h3 {
    font-size: 19px;
  }
  #footer p {
    font-size: 12px;
  }
}
/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .video-text {
    margin-left: 0;
  }
}
/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (max-width: 1200px) {
  .fadein,
  .fadein2,
  .fadein3 {
    width: 100% !important;
  }
  #footer-nav {
    flex-direction: column;
  }
  #footer-nav li {
    margin-bottom: 10px;
  }
}
/* Navbar custom select breakpoint */
@media only screen and (max-width: 1370px) {
  .absolute-menu {
    left: 50px;
    top: 100px;
  }

  .item-hidden {
    display: none;
  }
}

@media only screen and (max-width: 1379px) and (min-width: 992px) {
  .last-item {
    padding-right: 0;
  }
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (max-width: 992px) {
  video {
    height: auto;
    width: 100%;
  }
  .margin-responsive {
    margin: 0 !important;
  }
  .margin-responsive p {
    width: 100% !important;
  }
  .video-col {
    padding: 0;
    max-height: 175px;
  }
  .video-text {
    margin-left: 0;
  }
  #numbers .full-container {
    margin: 0 50px !important;
  }
  #numbers .full-container h3 {
    margin-bottom: 0 !important;
  }
  #numbers span {
    font-size: 40px;
  }
  /*  p {
  text-align: center;
  } */
  .cards-col {
    margin-bottom: 10px;
  }
  #cards-section .row {
    padding-bottom: 0 !important;
  }
  #footer p {
    font-size: 16px;
  }
  .item-hidden {
    visibility: visible;
    display: unset;
  }
  .absolute-menu {
    display: none;
  }
}

@media only screen and (width: 1024px) and (height: 1366px) {
  .nav-item {
    padding: 0 10px;
  }

  #footer .margin-responsive {
    margin-left: 5px !important;
    margin-top: 10px !important;
  }
}

@media only screen and (min-width: 1024px) {
  .bottom-card {
    height: 300px;
  }
}