@font-face {
  font-family: 'Helvetica Neue';
  src: url('font/HelveticaNeueRoman.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Helvetica Neue';
  src: url('font/HelveticaNeueBold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
}

body {
  font-family: 'Helvetica Neue', Helvetica, sans-serif;
}

.base-color{
    color: rgb(5, 49, 66);
}

.bg-base-color{
    background-color: rgb(5, 49, 66);
}

.secondary-color{
    color: rgb(124, 209, 238);
}

.bg-secondary-color{
    background-color: rgb(124, 209, 238);
}

.navbar{
    padding: 20px;
}

.foto-congkoy {
    max-width: 450px;
}

.text-umur {
    margin-top: 20px;
}

.ttl{
  margin-bottom: 10px;
}

/* ============================
   Breakpoint ≥ 576px (sm)
============================ */
@media (min-width: 576px) {
  .foto-congkoy {
      max-width: 600px;
  }
}

/* ============================
   Breakpoint ≥ 768px (md / tablet)
============================ */
@media (min-width: 768px) {
  body {

  }
}

/* ============================
   Breakpoint ≥ 992px (lg / laptop)
============================ */
@media (min-width: 992px) {
  body {

  }
}

/* ============================
   Breakpoint ≥ 1200px (xl / desktop besar)
============================ */
@media (min-width: 1200px) {
  body {

  }
}

/* ============================
   Breakpoint ≥ 1400px (xxl / ultra wide)
============================ */
@media (min-width: 1400px) {
  body {

  }
}