/* ====== Sans-serif font for navbar and footer text links ======= */
#mainNav .container,
footer ul.footer-links li a,
footer a.privacy-legal {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}

/* =========== Navbars spacing ========== */

#mainNav .container { padding-top: 0; padding-bottom: 0 }
#mainNav .container img { margin-bottom: 0 }

/* =========== Navbar colours ========== */

/* Menu: dark colour */
nav.navbar.navbar-dark.bg-dark { background-color: darkblue !important }

/* Menu: light colour */
nav.navbar.navbar-light.bg-light { background-color: lightblue !important }


/* =========== Hamburger icon  ========== */
#mainNav.navbar-dark.bg-dark i.fas.fa-bars { font-size: xx-large }

/* Icon: dark colour */ 
#mainNav.navbar-dark.bg-dark i.fas.fa-bars { color: #fff }

/* Icon: dark colour */
#mainNav.navbar-light.bg-light i.fas.fa-bars { color: #000 }


/* =========== Navbar menu options ========== */

/* Tablets/Desktops */
@media (min-width: 1200px) { #mainNav li.nav-item { margin-left: 40px } }

/* Mobiles */
@media (max-width: 1199px) { #mainNav li.nav-item { margin-bottom: 20px } }

#mainNav li.nav-item a { font-size: large; font-weight:bold }
#mainNav li.nav-item a.btn { padding: 6px 20px; font-weight: normal }

.navbar-light .navbar-nav .nav-link:link,
.navbar-light .navbar-nav .nav-link:visited { color: #000 }
.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link:active { color: gray }

.navbar-dark .navbar-nav .nav-link:link,
.navbar-dark .navbar-nav .nav-link:visited { color: #fff }
.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:active { color: lightgray }


/* =============== BEGIN FOOTER CSS ================== */

/* Outer footer parent container */
footer { 
    text-align: center; 
    color:#fff;
    background-color:rgb(36,64,84);
}

/* Desktop footer - inside padding  */
@media (min-width:768px) { footer { padding: 4% 8% 4% 8% } }

/* Mobiles footer - inside padding */
@media (max-width:767px) { footer { padding: 8% 8% 12% 8% } }

/* Styles for footer background, text, icons and links */

footer h4, footer h5, 
footer ul.footer-icons li, footer ul.footer-icons li a, 
footer p, footer p a {
   color: #fff
}

/* Footer headings */
footer h4 {
   font-weight: normal;
   font-size: calc(26px + (48 - 26) * ((100vw - 320px)/(1600 - 320)));
   margin: 0 auto 16px 0;
}

footer h5 {
    font-weight: normal;
    font-style:  italic;
    color: #fff;
    margin: 0 auto 36px auto;
    font-size: calc(20px + (32 - 20) * ((100vw - 320px)/(1600 - 320)));
}

/* Footer text links and icon links */
footer ul.footer-links { text-align: center }
footer ul.footer-links { margin-left: 0 }
footer ul.footer-links, footer ul.footer-icons { list-style-type: none }

footer ul.footer-links,
footer ul.footer-icons { margin: 0 auto 48px auto; padding-left: 0 }

footer ul.footer-links li,
footer ul.footer-icons li { display: inline-block; margin: 0 32px 0 0 }

footer ul.footer-links li:last-child,
footer ul.footer-icons li:last-child { margin-right: 0 }

/* Footer text links */
footer ul.footer-links li a {
    color: #fff;
    text-decoration: none;
    border-bottom-style: solid;
    border-bottom-width: 2px;
    padding-bottom:2px;    
    font-size: calc(17px + (20 - 17) * ((100vw - 320px)/(1600 - 320)));
}

footer ul.footer-links li a:link, 
footer ul.footer-links li a:visited  {
   border-bottom-color: transparent;
}

footer ul.footer-links li a:hover, 
footer ul.footer-links li a:active  {
   border-bottom-color: #fff;
}

/* Footer icons */
footer ul.footer-icons li a i {
    text-decoration: none;
    font-size: calc(22px + (28 - 22) * ((100vw - 320px)/(1600 - 320)));
}

footer ul.footer-icons li a:hover, 
footer ul.footer-icons li a:active  { color: #fff1e5 }

/* Privacy and legal link */
footer p a {
    text-decoration: none;
    border-bottom-style: solid;
    border-bottom-width: 2px;
    padding-bottom:2px;  
    color: #fff;  
    font-size: calc(15px + (18 - 15) * ((100vw - 320px)/(1600 - 320)));
}

footer p a:link, 
footer p a:visited  {
    color:#fff;
    border-bottom-color: transparent;
}

footer p a:hover, 
footer p a:active  {
    color:#fff;
    border-bottom-color: #fff;
}

a.privacy-legal {
    font-family: sans-serif;    
    display: inline-block;
    color:#fff;
    text-decoration: none;
    border-bottom-style: solid;
    border-bottom-width: 2px;
    padding-bottom:2px;    
    font-size: calc(14px + (17 - 14) * ((100vw - 320px)/(1600 - 320)));
}

a.privacy-legal:link,
a.privacy-legal:visited {
    border-bottom-color: transparent;
}

a.privacy-legal:active,
a.privacy-legal:hover {
    border-bottom-color: #fff
}

/* == End footer CSS == */