/* =========================================================
   1. FONT
========================================================= */
@font-face{font-family:"Work Sans";src:url("./WorkSans/WorkSans-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}

/* =========================================================
   2. VARIABLES
========================================================= */
:root{--natblaa:#003255;--fdf-blaa:#5F8CB4;--white:#fff;--font-family:"Work Sans",sans-serif;--font-h1:55px;--font-h2:34px;--font-body:21px;--line-height:1.5}

/* =========================================================
   3. RESET / BASE
========================================================= */
*{box-sizing:border-box}
body{margin:0;font-family:var(--font-family);color:var(--natblaa)}

/* =========================================================
   4. TYPOGRAPHY
========================================================= */
h1,h2,h3,h4,h5,h6,p,span,a,label,ul,li,th,td{font-family:var(--font-family);line-height:var(--line-height);color:var(--white)}
h1{font-size:var(--font-h1)}
h2{font-size:var(--font-h2)}
h3,h4,h5,h6{font-size:var(--font-body)}
p,ul,li,a,span,label,th,td{font-size:var(--font-body); color:var(--white) }

.strong{font-size:var(--font-body); color:var(--natblaa) }


/* =========================================================
   5. COLORS / LINKS
========================================================= */
a{text-decoration:none;color:var(--fdf-blaa)}
label{padding:10px;color:var(--fdf-blaa)}
.strong,.fdf_blaa{color:var(--fdf-blaa)}
.natblaa{color:var(--natblaa)}
.white{color:var(--white)}

/* =========================================================
   6. LISTS
========================================================= */
ul{padding-left:0}
ul,li{list-style:none;text-align:left}

/* =========================================================
   7. TABLES
========================================================= */
th,td{text-align:left}

/* =========================================================
   8. HR
========================================================= */
hr{width:100%;height:4px;margin-bottom:20px;border:0;border-radius:2px;background:var(--white)}

/* =========================================================
   9. RESPONSIVE
========================================================= */
@media(min-width:1024px){hr{height:8px;width:auto}}
@media(max-width:1023px){:root{--font-h1:34px;--font-h2:21px;--font-body:13px}ul{padding-left:10px}hr{height:6px;width:auto}}
@media(max-width:767px){hr{width:100%}}