/* Fonts */
@font-face {
    font-family: 'Sitka Display Bold';
    src: url('../fonts/sitka.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/* Base Styles */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: Arial, sans-serif;
  color: #333;
  background-color: #f5f5f5;
}

/* -------- Mobile Styles (default) -------- */
#main-header {
  width: 100%;
  height: 80px;
  background-color: #02075d;
}

#header-logo-text {
  font-family: 'Sitka Display', sans-serif;
  color: #f5f5f5;
  font-size: 1.8em;
  display: flex;
  justify-content: center; /* Horizontal centering */
  align-items: center;     /* Vertical centering */
  height: 80px;           /* Set a height to vertically center */
  text-align: center;      /* Center-align text within the flex item */
}

/* -------- Tablet Styles -------- */
@media (min-width: 768px) {

}

/* -------- Desktop Styles -------- */
@media (min-width: 1024px) {

  #main-header {
    width: 100%;
    height: 60px;
    background-color: #02075d;
  }

  #header-logo-text {
    font-family: 'Sitka Display', sans-serif;
    color: #f5f5f5;
    font-size: 1.5em;
    display: flex;
    justify-content: center; /* Horizontal centering */
    align-items: center;     /* Vertical centering */
    height: 60px;           /* Set a height to vertically center */
    text-align: center;      /* Center-align text within the flex item */
  }


}