/* Overwriting Bootstrap CSS */


/* 
################################################################################################# 
  general stuff 
################################################################################################# 
  --*/

@media (max-width: 767px) {
  .hidden-mobile {
    display: none;
  }
}

:root {
  
  --bs-link-hover-color-rgb: #0dcaf0;

  --loca-red: rgb(223, 63, 46, 1.0);
  --loca-blue: rgb(53, 69, 97, 1.0);
  --loca-yellow: rgb(235, 177, 80, 1.0);
}


/*   
################################################################################################# 
  overwriting with !important 
#################################################################################################
*/

h1, h2, h3 {
  color: var(--loca-blue) !important;
}


.bg-dark {
  background-color: var(--loca-blue) !important;
}


.icon-link-hover {
  color: var(--bs-cyan);
}

a.list-group-item {
  border: 0;
}



/*
################################################################################################# 
  custom styles
################################################################################################# 
*/

.pinata-red {
  color: var(--loca-red);
}

.pinata-blue {
  color: var(--loca-blue);
}

.pinata-yellow {
  color: var(--loca-yellow);
}


.more-space {
  margin-top: 2.0rem;
  margin-bottom: 0.5rem;
  font-weight: 500;
  line-height: 1.2;
}

.highlight-text {
  font-size: calc(1.375rem + 0.25vw);
}

.logo-text {
  font-size: calc(1.375rem + 3.5vw);
}
@media (min-width: 1200px) {
  .logo-text {
    font-size: 5.0rem;
  }
}


