/* Override some colors set in the main CSS file */
:root {
   --color-main-theme: hsl(320, 100%, 50%);
   --color-main-theme-light: hsl(320, 100%, 65%);
   --color-main-theme-dark: hsl(320, 100%, 35%);
   --link-neutral-color: hsl(320, 100%, 30%);
   --link-hover-color: hsl(320, 100%, 40%);

   --pretty-button-color-on: hsl(320, 100%, 50%);
   --pretty-button-color-dim: hsl(320, 50%, 50%);

   --main-content-color: hsl(320, 100%, 98%);
}


#footer-logo-berlinlatinas>svg {
   transform: translate(0px, calc(-1px + var(--footer-logo-offset-vert))) scale(0.8);
}
#footer-logo-berlinlatinas:hover {
   background: hsl(320, 100%, 50%);
}





.section {
   display: flex;
   flex-direction: column;
   margin-bottom: 1em;
}
.section-title {
   font-size: large;
   font-weight: 600;
   line-height: 1;
   width: 100%;
   text-align: center;
}
.section-comment {
   font-size: small;
   color: gray;
   width: 100%;
   text-align: center;
}
.section-content {
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
   text-align: center;
   gap: 6px;
   margin-top: 6px;
}