:root {
  --df-color-header-item: rgb(3, 22, 51);
}
/* Media query for DESKTOP size devices: */
@media screen and (min-width: 769px) {
  header {
    position: relative;
  }
  #divInformation {
    position: absolute;
    right: 0;
    bottom: -270px;
  }
  .df-header-item {
    background-color: var(--df-color-header-item);
    width: max-content;
    height: max-content;
    transition: transform 0.5s;
  }
  .df-header-item:hover {
    transform: scale(1.05);
  }
  .df-active {
    background-color: var(--df-color-header-item);
    width: max-content;
    height: max-content;
    transform: scale(0.7);
  }
}

/* Media query for MOBILE size devices: */
@media screen and (max-width: 768px) {
  .df-header-item {
    background-color: var(--df-color-header-item);
    width: max-content;
    height: 100px;
    transition: transform 0.5s;
  }
  .df-header-item:hover {
    transform: scale(1.05);
  }
  .df-active {
    background-color: var(--df-color-header-item);
    width: max-content;
    height: 100px;
    transition: transform 0.5s;
    transform: scale(0.7);
  }
}
