@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

/* Base Styles
�������������������������������������������������� */
/* NOTE
html is set to 62.5% so that all the REM measurements throughout Skeleton
are based on 10px sizing. So basically 1.5rem = 15px :) */
html {
  font-size: 62.5%; }
body {
  font-size: 1.5em; /* currently ems cause chrome bug misinterpreting rems on body element */
  line-height: 1.6;
  font-weight: 400;
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  color: #222;
}

/* Typography
�������������������������������������������������� */
h1, h2, h3, h4, h5, h6 {
  font-weight: 300;
  margin-top: 0;
  margin-bottom: 2rem; }
h1 { font-size: 3.6rem; line-height: 1.2;  letter-spacing: -.1rem;}
h2 { font-size: 2.8rem; line-height: 1.25; letter-spacing: -.1rem; }
h3 { font-size: 2.2rem; line-height: 1.3;  letter-spacing: -.1rem; }
h4 { font-size: 2.0rem; line-height: 1.35; letter-spacing: -.08rem; font-weight:bold; }
h5 { font-size: 1.9rem; line-height: 1.5;  letter-spacing: -.05rem; font-weight:bold; }
h6 { font-size: 1.8rem; line-height: 1.6;  letter-spacing: 0;  font-weight:bold;}

h1 {margin: 0 0 10px; color: #212121; font-weight:700;}
h2 {margin: 15px 0 15px; padding-top:30px; font-weight:bold; color:#595959; border-top:3px #CCCCCC solid;}
h2:first-of-type {border:none; padding-top:0;}
h3 {font-weight:bold; margin:20px 0 10px; color: #B50000;}
h4 {margin: 20px 0 3px;}
p {
    margin: 0 0 6px;
    line-height: 21px;
    overflow-wrap: anywhere;
}
em {
    font-style: normal
}
a {
    color: #b80000;
    text-decoration: none;
    font-weight:600;
}
a:hover {
    color: #d80000
}
table {
    border-collapse: collapse;
    border: 1px solid #d4d4d4;
    border-spacing: 0;
    margin: 0 0 10px;
}
  table tr:nth-child(even) {
      background-color: #ededed
  }
  table tr.even,
  .content table th,
  .content thead td {
      background-color: #ededed
  }
  table td,
  .content table th {
      padding: 2px 5px;
      border: 1px solid #d4d4d4;
      vertical-align: top;
  }
  table th {
      text-align: left;
      font-weight: bold;
  }
table thead td {
    background: #B50000;
    color:#ffffff;
    font-weight: bold;
    padding:7px;
}
p.intro {
    font-family: "CamboRegular", Georgia, "Times New Roman", Times, serif;
    font-size: 150%;
    line-height: 32px;
    margin-bottom: 20px;
    color: #222;
}
/* WYSIWYG EDITOR ALIGNMENT CLASSES 
-------------------------------------------- */
.typography .left {
    text-align: left
}
.typography .center {
    text-align: center
}
.typography .right {
    text-align: right
}
/* IMAGES 
-------------------------------------------- */
.typography img {
    border: none
}
.typography img.right {
    float: right;
    margin-left: 20px;
}
.typography img.left {
    float: left
}
.typography img.leftAlone {
    float: left;
    margin-right: 100%;
}
.typography img.center {
    float: none;
    margin-left: auto;
    margin-right: auto;
    display: block;
}
/* LISTS
-------------------------------------------- */
.typography li {
	list-style-type:disc;
	margin-left:20px;
	line-height:21px;
	margin-bottom:10px;
}

.red {
    color: #B50000;
}
.title1 {
    text-align: center;
    text-transform: uppercase;
    font-size: 25px;
    font-weight: 700;
}
.title2 {
    text-align: center;
    text-transform: uppercase;
    font-size: 20px;
    font-weight: 700;
}
a.button-link {
    background: none;
    color: #ffffff;
    background-color: #98009B;
    border-radius: 10px;
    padding: 10px 20px;
    font-weight: 700;
    margin-top:10px;
    display: inline-block;
    border:none;
}
a.button-link:hover {
    color:#d00000;
}

/**
 * Content block
 */
.content-block {
    background-color: #EBEDF0;
    border:3px solid #708090;
    padding: 25px 35px;
    margin-bottom:30px;
}
.content-block ul {
    display:flex;
    flex-wrap:wrap;
    gap:0 20px;
}
.content-block li {
    flex: 1 0 240px;
    margin-bottom:0;
    font-weight: 600;
}
