@font-face {
    font-family: 'Lato-Black';
    src: url('../Fonts/Lato-Black.ttf') format('truetype');
}

@font-face {
    font-family: 'Lato-BlackItalic';
    src: url('../Fonts/Lato-BlackItalic.ttf') format('truetype');
}

@font-face {
    font-family: 'Lato-Bold';
    src: url('../Fonts/Lato-Bold.ttf') format('truetype');
}

@font-face {
    font-family: 'Lato-BoldItalic';
    src: url('../Fonts/Lato-BoldItalic.ttf') format('truetype');
}

@font-face {
    font-family: 'Lato-Italic';
    src: url('../Fonts/Lato-Italic.ttf') format('truetype');
}

@font-face {
    font-family: 'Lato-Light';
    src: url('../Fonts/Lato-Light.ttf') format('truetype');
}

@font-face {
    font-family: 'Lato-LightItalic';
    src: url('../Fonts/Lato-LightItalic.ttf') format('truetype');
}

@font-face {
    font-family: 'Lato-Regular';
    src: url('../Fonts/Lato-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'Lato-ThinItalic';
    src: url('../Fonts/Lato-ThinItalic.ttf') format('truetype');
}

@font-face {
    font-family: 'Lato-Thin';
    src: url('../Fonts/Lato-Thin.ttf') format('truetype');
}
/*Enhance accessibility specifically for users who rely on assistive technologies like screen readers or keyboard navigation.*/
/*Comply with Ontario's Accessibility for Ontarians with Disabilities Act (AODA) and meet the Web Content Accessibility Guidelines (WCAG) 2.0 AA level*/
.skip-link {
    position: absolute;
    top: -40px;
    left: 0;
    background: #002278;
    color: white;
    padding: 8px;
    z-index: 100;
    text-decoration: none;
}

    .skip-link:focus {
        top: 0;
    }

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
/* RESET */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

img {
    max-width: 100%;
    height: auto;
}

/* GLOBAL BACKGROUND COLOR*/
body {
    background-color: #d3dcec;
    font-family: Lato-Regular;
}
/* TOP HEADER */
.TopHeader {
    text-align: center;
    height: 40px;
    background-color: #003774;
    border-bottom: 1px solid #000;
    padding-top: 0px;
    border-top: 1px solid #4d5d88;
    border-bottom: 1px solid #4d5d88;
    color: #5e7ca3;
}
.TopHeaderImage {
    position: relative;
    top: 6px;
}
.TopHeaderCityIcon {
    position: relative;
    top: 0px;
    margin-right: 5px;
}
.TopHeaderTitle {
    font-family: 'Lato-bold';
    font-size: calc(12px + (13 - 12) * ((100vw - 300px) / (1600 - 300)));
    color: #85a6d7;
    text-decoration: none;
    padding-right: 5px;
    padding-left: 5px;
    border-right: 1px solid #557095;
}
.TopHeaderLink {
    font-family: 'Lato-bold';
    font-size: calc(12px + (13 - 12) * ((100vw - 300px) / (1600 - 300)));
    color: #85a6d7;
    text-decoration: none;
    padding-right: 5px;
    padding-left: 5px;
    border-right: 1px solid #557095;
}
    .TopHeaderLink:hover {
        color: #e6f2ff;
    }