/* === HEADER GRID ITEMS === */
#header-item-txt {
  grid-area: header-item-txt;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  background:#D66F10;
  border-right: 5px solid #fff;
}

  #header-item-img {
    grid-area: header-item-img;
    height: 100%;
    background: url('/media/index/header/header-wide.jpg') 50% / cover no-repeat;
  }

  /* === HEADER TEXT CONTENT === */
  #header-txt {
    width: auto;
    text-align: center;
  }

  #header-txt h1 {
    font-size: 3.8rem;
    margin-bottom: 0.4em;
    font-weight:600;
    color:#fff;
  }

  #header-txt h2 {
    font-size: 1.5rem;
    line-height: 1.5;
    margin-top: 0;
    margin-bottom: 1em;
    font-weight:500;
    color:#fff;
  }

    #header-txt ul {
      display:flex;
      justify-content:center;
      flex-wrap:wrap;
      align-items:center;
      list-style: none;
      padding:0;
      
    }

      #header-txt li {
        width:100%;
        line-height: 2.2rem;
        margin-bottom: 0.5rem;
      color:#fff;
      }



/* === RESPONSIVE === */
@media screen and (max-width: 1290px) {

  #header-txt h1 {
    font-size: 2.2rem;
  }
  
  #header-txt h2 {
    font-size: 1.4rem;
  }
}

@media screen and (max-width: 800px) {

  #header-item-txt {
    border-top:5px solid #fff;
    border-right:none;
  } 
  
  #header-txt {
    padding: 2rem 1rem;
  }
  
  #header-txt ul {
    padding: 15px;
  }  
  
  #header-txt h1 {
    font-size: 1.6rem;
  }
  
  #header-txt h2 {
    font-size: 1.1rem;
  }
}

@media screen and (max-width: 600px) {

  
  #header-txt li {
    font-size: var(--font-size-normal);
  }
  
}
