/* COLORS */
:root {
--black: #1D1D27;
--teal: #BFD6C4;
--tan: #EDC18C;
--beige: #F7F0DE;
--purple: #9487A3;
--orange: #FBB981;
--burgundy: #6B383F;
--white: #ffffff;
--bg-blue: #b9d1d6;
}

/* RESET */
* {
    box-sizing: border-box !important;
}

html,
body {
  padding: 0 !important;
  margin: 0 !important;
}

/* PAGE FLEXBOX */
/* stretches content to fill full page without making the credit placement weird*/
#allrecords {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: calc(100vh - 70px); /* makes content fill full page (if shorter) and accounts for tilda label)*/
}

/* UNIVERSAL BLOCKS */
/* Make all blocks have a transaprent background */
.t-records {
    background-color: transparent !important;
}

/* Style links (but exlcude header) */
.t396 a, .t051 a {
    color: black !important;
    background-color: rgba(247, 240, 222, 0.5);
    padding: 0 5px;
    border-radius: 5px;
    margin: 0 -5px;
    box-decoration-break: clone;
    border-bottom: 0px solid !important ;
    -webkit-box-shadow: inset 0px 0px 0px 0px !important;
    transition: background-color 0.2s 0s ease-in-out, color 0.2s 0s ease-in-out !important;
}

.t396 a:hover, .t051 a:hover {
    color: black !important;
    background-color: rgba(251, 185, 129, 1);
    padding: 0 5px;
    border-radius: 5px;
    margin: 0 -5px;
    box-decoration-break: clone;
    border-bottom: 0px solid !important ;
    -webkit-box-shadow: inset 0px 0px 0px 0px !important;
}

/* NAVIGATION */
/* Flexbox layout */
/* change height of parent container so nav has soolid background */
.t456 {
height: auto;
}

/* add padding to the main navigation container (this allows the logo image size to be adjusted base don width) */
.t456__maincontainer.t456__c12collumns {
    padding: 25px;
    display: flex;
    justify-content: space-between;
    flex-direction: row;
    align-items: center;
    height: auto;
    gap: 25px; /* minimum space between logo and buttons */
}

/* Flexbox layout for buttons */
ul.t456__list.t-menu__list {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    gap: calc((0.5rem + 0.25svw) / 2);
}

/* LOGO */
/* Removing padding from parent containers that will interfere with flexbox */
/* Setting the minimum width to fit content for logo */
.t456__leftwrapper {
    padding: 0 !important;
    min-width: fit-content !important;
    width: unset !important;
}

nav.t456__rightwrapper.t456__menualign_right {
    padding: 0 !important;
    width: unset !important;
}

/* Set the width of the logo's parent container */
.t456__logowrapper {
    width: 150px;
}

/* Logo image: remove max width restriction, allow image to fill full width of parent container + remove right margin */
img.t456__imglogo.t456__imglogomobile {
    max-width: unset !important;
    width: 100% !important;
    margin-right: 0;
}

/* NAVIGATION BUTTONS */
/* Remove padding from button */
li.t456__list_item {
    padding: 0 !important;
}

/* Styling buttons - include how transition */
.t-menu__link-item {
    display: block;
    background-color: var(--beige) !important;
    color: var(--black) !important;
    padding: 0.4rem 1rem !important;
    border-radius: 10px;
    border: 2px solid var(--black);
    transition: background-color 0.2s 0s ease-in-out, color 0.2s 0s ease-in-out;
        font-size: 17px;
    text-transform: uppercase;
    letter-spacing: 0.75px;
}

/* HOVER */
a.t-menu__link-item:hover {
    color: var(--black) !important;
    background-color: var(--orange) !important;
    border: 2px solid var(--black);
}

/* ACTIVE */
/* Change background and text color, make colors stay same on hover*/
.t-menu__link-item.t-active, .t-menu__link-item.t-active:hover {
    color: var(--white) !important;
    background-color: var(--purple) !important;
    border: 2px solid var(--black);
    opacity: 1;
}


/* SCREEN SMALLER THAN 980PX */
@media screen and (max-width: 980px) {
    /* change button alignment to center */
    ul.t456__list.t-menu__list {
    justify-content: center;
    }
    
    /* remove padding from buttons */
    .t456 .t456__list_item {
        padding: 0 !important;
    }
    
    /* hide logo image so it doesn't interfere with flex box (different image for mobile logo) */
        .t456__leftwrapper {
display: none;
}

/* resize mobile logo image */
    img.tmenu-mobile__imglogo {
    height: 65px !important;
    width: auto !important;
}

/* move position of dropdown menu so it doesn't cover the logo */
 #rec830298539 .tmenu-mobile__menucontent_fixed {
    top: 105px !important;
  }
}

/* For small screen but not specifically in media viewport */
/* fixing weird spacing with mobile nav */
.tmenu-mobile__container {
        margin-right: 20px !important;
    padding: 20px 0 20px 20px !important;
}

}