@import url("theme.css");

/*****************************
* TECHNICAL
* Styling for the technical page.
*****************************/

main.md-main[data-md-component="main"] {
     background: repeating-linear-gradient(0deg, transparent, transparent 19px, rgba(75, 85, 99, 0.08) 19px, rgba(75, 85, 99, 0.08) 20px, transparent 20px, transparent 39px, rgba(75, 85, 99, 0.08) 39px, rgba(75, 85, 99, 0.08) 40px), repeating-linear-gradient(90deg, transparent, transparent 19px, rgba(75, 85, 99, 0.08) 19px, rgba(75, 85, 99, 0.08) 20px, transparent 20px, transparent 39px, rgba(75, 85, 99, 0.08) 39px, rgba(75, 85, 99, 0.08) 40px), radial-gradient(circle at 20px 20px, rgba(55, 65, 81, 0.12) 2px, transparent 2px), radial-gradient(circle at 40px 40px, rgba(55, 65, 81, 0.12) 2px, transparent 2px) !important
}

.header-menu {
     display: flex;
     justify-content: center;

     .menu-items {
          display: grid;
          grid-template-columns: repeat(3, 1fr);
          gap: 20px;
          align-items: center;

          .current-menu-item {
               width: 80px;
               height: 80px;
               justify-content: center;
               display: flex;
               align-items: center;
               color: var(--light-grey);
          }

          .menu-item {
               width: 65px;
               height: 65px;
               display: flex;
               align-items: center;
               color: transparent;
               overflow: hidden;
               white-space: nowrap;

               &:hover {
                    color: var(--light-grey);
               }
          }
     }
}

footer {
     background: repeating-linear-gradient(0deg, transparent, transparent 19px, rgba(75, 85, 99, 0.08) 19px, rgba(75, 85, 99, 0.08) 20px, transparent 20px, transparent 39px, rgba(75, 85, 99, 0.08) 39px, rgba(75, 85, 99, 0.08) 40px),
          repeating-linear-gradient(90deg, transparent, transparent 19px, rgba(75, 85, 99, 0.08) 19px, rgba(75, 85, 99, 0.08) 20px, transparent 20px, transparent 39px, rgba(75, 85, 99, 0.08) 39px, rgba(75, 85, 99, 0.08) 40px),
          radial-gradient(circle at 20px 20px, rgba(55, 65, 81, 0.12) 2px, transparent 2px),
          radial-gradient(circle at 40px 40px, rgba(55, 65, 81, 0.12) 2px, transparent 2px);
     font-family: var(--general-sans);
}