/*
colour schemes
    background
    primary colour (con buttons) 
    secondary colour (hover con buttons) 

buttons 
    for hidden buttons (none coloured and hovers grey) - w3.button
    for custom button (coloured and hovers colour) - w3.button w3.round con 
    for nav buttons (non coloured and hover colour) - w3.button half 
    for button w hover shadow - w3.btn 
    
*/


/* VARIABLES */
:root {
  --backround:white; 
  /* --primary: #035369; */
  --primary: #1c6e7f;
  --secondary: #177b83;
}


/* COLOURS */
body, #nav, #mySidebar {
    background-color: var(--backround);
}


/* FONTS */
body, h1, h2, h3, h4, h5, h6 {
  font-family: "Montserrat", "Helvetica", sans-serif;
  font-weight: 600;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 800;
}


/* BUTTONS */
.con, .navbar {
    color: white;
    background-color: var(--primary);
    letter-spacing: 2px;
}

.con:hover {
    color: white !important;
    background-color: var(--secondary) !important;
}

.half:hover {
    background-color: var(--backround) !important;
}


/* LOGO */
.brandlogo {
  height: 100px;
  width: 100%;  
  display: block;   
  max-width: 100%; 
  min-width: 100%; 
  object-fit: contain;
  flex-shrink: 0;
}

.custombar {
    height: 130px !important;
}


/* CARDS */
.card-link {
  text-decoration: none;
  color: inherit;
  display: block;
}

.card-link:hover {
  text-decoration: none;
}


@media (max-width:900px) {
    .stack-small {
        flex-direction: column !important;
        justify-content: space-around !important;
    }
} 

.mySlides {display:none}
.w3-left, .w3-right, .w3-badge {cursor:pointer}
.w3-badge {height:13px;width:13px;padding:0}


#mnavbar {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease-in-out;
    display: block !important; /* Overrides W3.CSS hide rules so the transition can work */
}

#mnavbar.open-menu {
    max-height: 500px; /* Adjust this number if your menu content grows longer */
}


html {
  scroll-behavior: smooth;
}

