/* CSS Variables */
:root {
  --pri: rgb(95, 77, 133);
  --pri-trans1: rgba(95, 77, 133, 0.92);
  --pri-trans2: rgba(95, 77, 133, 0.90);
  --sec: rgb(255, 212, 0);
  --text-dark: rgb(29, 29, 29);
  --background: rgb(230, 226, 241);
	--text-light:rgb(255, 255, 255);
}

.masthead, .comment_count span {
    background: rgb(154, 51, 51);
}
.head {
    background: var(--pri-trans1);;
    border-bottom: 1px solid rgba(255, 255, 255, 0.38);
}
.topnav li a:hover, .topnav .on a { color: var(--sec);
border-bottom: 6px solid var(--sec);
}
.topnav li a {
    color: var(--text-light)
}
.head-overlay h2 {
  color: var(--sec);
}
.head-overlay > * {
  color: var(--text-light);
}
.grid-parent div.head-overlay {
  background-color: var(--pri-trans2);
  border-right: 4px solid rgba(95, 77, 132, 1);
  box-shadow: -4px 4px 4px 2px rgba(99, 82, 136, 0.12);
}
.sub-menu li a:hover, .sub-menu li.on a{
  color: var(--pri);
  border-bottom: 1px solid var(--sec);
  font-weight: bold;
  font-size: 89.6%;
}
i[class] {
  color: var(--pri);
}
a, a:visited, ul.sub-menu li a:hover, ul.sub-menu li a:focus, ul.sub-menu li li a:hover, ul.sub-menu li li a:focus, ul.sub-menu li li li a:hover, ul.sub-menu li li li a:focus, ul.sub-menu li .currentpage, ul.sub-menu li li .currentpage, ul.sub-menu li li li .currentpage, figure.staff-profile h3 span, h1 a:hover, h1 a:focus, h2 a:hover, h2 a:focus, h3 a:hover, h3 a:focus {
    color: var(--pri);
}
.chart span ,.logo-circle, a.button, button, a.donate, .responsive-buttons ul li a, .c-colour:hover, input[type=button], input[type=submit], input[type=reset], button[type=button], button[type=submit], button[type=reset], thead tr th, .box .top, .lSSlideOuter .lSPager.lSpg>li.active a, .lSSlideOuter .lSPager.lSpg>li:hover a{ background: rgb(86, 99, 113); color: rgb(237,237,224); background: rgb(154, 51, 51));}
input[type=button]:disabled, input[type=submit]:disabled, input[type=reset]:disabled, button[type=button]:disabled, button[type=submit]:disabled, button[type=reset]:disabled {
    background: rgba(154, 51, 51));
    cursor: default;
}

/* Buttons Colours */
.button {
  background: rgb(255, 212, 0);
  margin-top: 16px;
  padding: 12px 10px;
  border-radius: 3px;
  color: rgb(95, 77, 133);
  display: inline-block;
  font-weight: bold;
}

/*Hover Colours */

a:hover, a:focus {
    color: rgb(69, 69, 69);
}
a.button:hover, button:hover, .top:hover, a.donate:hover, input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover, button[type=button]:hover, button[type=submit]:hover, button[type=reset]:hover {
    background: rgb(69, 69, 69);
    color: rgb(255, 255, 255);
}