:root{
	-ms-overflow-style:-ms-autohiding-scrollbar;
	overflow-y:scroll;
	text-size-adjust:100%
}
i {
  font-style: italic;
}
/* Mobile Youtube */
@media screen and (max-width:767px) {
iframe[src*="youtube"] {
    width: 100% !important;
}
}



 /* Popup container - can be anything you want */
    
    .popup {
      position: relative;
      display: inline-block;
      cursor: pointer;
    }
    /* The actual popup */
    
    .popup .popuptext {
      visibility: hidden;
      width: 320px;
      background-color: #555;
      color: #fff;
      text-align: left;
      font-size: 11px;
      border-radius: 6px;
      padding: 10px 10px;
      position: absolute;
      z-index: 1;
      bottom: 100%;
      left: 0%;
      margin-left: 0px;
user-select: text;
    }
    /* Popup arrow */
    
    .popup .popuptext::after {
      content: "";
      position: absolute;
      top: 100%;
      left: 50%;
      margin-left: -2px;
      border-width: 5px;
      border-style: solid;
      border-color: #555 transparent transparent transparent;
    }
    /* Toggle this class - hide and show the popup */
    
    .popup .show {
      visibility: visible;
      -webkit-animation: fadeIn 2s;
      animation: fadeIn 2s;
    }
    /* Add animation (fade in the popup) */
    
    @-webkit-keyframes fadeIn {
      from {
        opacity: 0;
      }
      to {
        opacity: 1;
      }
    }
    
    @keyframes fadeIn {
      from {
        opacity: 0;
      }
      to {
        opacity: 1;
      }
    }



.white1 { 
         background-color: #FFFFFF;
         color: #222266; 
		 text-align: center;
		 border: none;
		 font-size: 14px;
}

.grey1 { 
         background-color: #CCCCCC;
         color: #222266; 
		 text-align: center;
		 border: none;
		 font-size: 14px;
		
}

.grey1name { 
         background-color: #CCCCCC;
         color: #222266; 
		 text-align: center;
		 border: none;
		 font-size: 16px;
		 font-weight:800;
}



.blue3 {
        background-color: #22225C;
        color: white;
				 border: none;

}

.blue4 {
        background-color: #222266;
        color: white;
		font-size: 14px;
		text-align: center;
				 border: none;
}


a.blue3  { 
         font-family: Arial, Helvetica, sans-serif;
         color: #FFFFFF; 
         text-decoration: bold; 
} 

a.blue3:visited  { 
         font-family: Arial, Helvetica, sans-serif;
         color: #FFFFFF; 
         text-decoration: none; 
		 border: none;
} 



a.white  { 
         font-family: Arial, Helvetica, sans-serif;
         color: #585E94; 
		 font-size: 18px;
         text-decoration: none; 
} 

a.white:visited  { 
         font-family: Arial, Helvetica, sans-serif;
         color: #585E94; 
		 font-size: 18px;
         text-decoration: none; 
} 

a.grey  { 
         font-family: Arial, Helvetica, sans-serif;
         color: #585E94; 
         text-decoration: none; 
} 

a.grey:visited  { 
         font-family: Arial, Helvetica, sans-serif;
         color: #585E94; 
         text-decoration: none; 
} 




.previous {
  background-color: #f1f1f1;
  color: black;
  font-size: 15px;
  padding: 10px 20px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
}

.next {
  background-color: #04AA6D;
  font-size: 15px;
  color: white;
  padding: 10px 20px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
}

.index {
  background-color: #111111;
  font-size: 15px;
  color: white;
  padding: 10px 20px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
}


.colour1 {
  background-color: #f0f1f5;
  font-size: 15px;
  color: black;
  padding: 10px 20px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
}

.colour2 {
  background-color: #d1d6e8;
  font-size: 15px;
  color: black;
  padding: 10px 20px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
}
.colour3 {
  background-color: #a7b3db;
  font-size: 15px;
  color: black;
  padding: 10px 20px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
}
.colour4 {
  background-color: #222222;
  font-size: 15px;
  color: white;
  padding: 10px 20px;
  text-align: center;
  font-weight:700;
  text-decoration: none;
  display: inline-block;
}

.colour5 {
  background-color: #04AA6D;
  font-size: 15px;
  color: white;
  padding: 10px 20px;
  font-weight:700;
  text-align: center;
  text-decoration: none;
  display: inline-block;
}



.round {
  border-radius: 50%;
}


{
	display:block
}
summary{
	display:block
}
pre{
	overflow:auto
}
progress{
	display:inline-block
}
small{
	font-size:75%
}
template{
	display:none
}
textarea{
	overflow:auto
}
[hidden]{
	display:none
}
[unselectable]{
	user-select:none
}
*,*::before,*::after{
	box-sizing:inherit;
	text-decoration:inherit;
	vertical-align:inherit
}
*{
	color:inherit;
	font-family:inherit;
	font-size:inherit;
	font-style:inherit;
	line-height:inherit
}
*,*::before,*::after{
	border-style:solid;
	border-width:0
}
*{
	margin:0;
	padding:0
}
:root{
	box-sizing:border-box;
	cursor:default;
	font-family:sans-serif;
	line-height:1.5;
	text-rendering:optimizeLegibility;
	vertical-align:top
}
button,input,select,textarea{
	background:transparent
}

input{
	min-height:1.5
}
nav ol,nav ul{
	list-style:none
}

select::-ms-expand{
	display:none
}
select::-ms-value{
	color:currentColor
}
table{
	border-collapse:collapse;
	border-spacing:0
}
textarea{
	resize:vertical
}
::selection{
	background-color:#b3d4fc;
	text-shadow:none
}
@media screen{
	[hidden~=screen]{
		display:inherit
}
	[hidden~=screen]:not(:active):not(:focus):not(:target){
		clip:rect(0 0 0 0) !important;
		position:absolute !important
}
}
/*! normalize-opentype.css v0.2.3 | MIT License | kennethormandy.com/journal/normalize-opentype-css */
::selection{
	color:inherit;
	text-shadow:inherit;
	background-color:#accef7
}
html,body,table{
	font-feature-settings: "lnum", "tnum";

}
h1,h2,h3{
	font-feature-settings:"lnum", "tnum";

}
abbr{
	text-transform:uppercase;
	font-feature-settings:"lnum", "tnum";

}

pre,kbd,samp,code{
	font-feature-settings:"lnum", "tnum";

}

input[type=color],input[type=date],input[type=datetime],input[type=datetime-local],input[type=number],input[type=range],input[type=tel],input[type=week]{
	font-feature-settings:"lnum", "tnum";

}
tbody,caption{
	font-feature-settings:"lnum", "tnum";

}




@font-face{
	font-family:"Arial";
	unicode-range:U+0026
}
@font-face{
	font-family:"Arial";

	unicode-range:U+270C
}
.typgr8-zeta,h6,.typgr8-epsilon,h5,.typgr8-delta,h4,.typgr8-gamma,h3,.typgr8-beta,h2,.typgr8-alpha,h1,.typgr8-mega,.typgr8-giga,.typgr8-tera{
	text-rendering:optimizeLegibility;
	line-height:1;
	margin-top:0;
	color:#222
}
blockquote+figcaption cite{
	display:block;
	font-size:inherit;
	text-align:right
}

pre code{
	word-wrap:normal
}
html{
	font:normal 100%/1.0 serif
}
body,table{
	-webkit-hyphens:none;
	-moz-hyphens:none;
	-ms-hyphens:none;
	hyphens:none;
	color:#444
}
@media all and (max-width: 640px){
	.typgr8-tera{
		font-size:68.664px;
		font-size:3.8146666667rem;
		margin-bottom:45.776px;
		margin-bottom:2.5431111111rem
}
}
@media all and (min-width: 640px){
	.typgr8-tera{
		font-size:85.83px;
		font-size:4.7683333333rem;
		margin-bottom:57.22px;
		margin-bottom:3.1788888889rem
}
}
@media all and (max-width: 640px){
	.typgr8-giga{
		font-size:54.9312px;
		font-size:3.0517333333rem;
		margin-bottom:36.6208px;
		margin-bottom:2.0344888889rem
}
}
@media all and (min-width: 640px){
	.typgr8-giga{
		font-size:68.664px;
		font-size:3.8146666667rem;
		margin-bottom:45.776px;
		margin-bottom:2.5431111111rem
}
}
@media all and (max-width: 640px){
	.typgr8-mega{
		font-size:43.9448px;
		font-size:2.4413777778rem;
		margin-bottom:29.2965333333px;
		margin-bottom:1.6275851852rem
}
}
@media all and (min-width: 640px){
	.typgr8-mega{
		font-size:54.931px;
		font-size:3.0517222222rem;
		margin-bottom:36.6206666667px;
		margin-bottom:2.0344814815rem
}
}
@media all and (max-width: 640px){
	.typgr8-alpha,h1{
		font-size:35.156px;
		font-size:1.9531111111rem;
		margin-bottom:23.4373333333px;
		margin-bottom:1.3020740741rem
}
}
@media all and (min-width: 640px){
	.typgr8-alpha,h1{
		font-size:43.945px;
		font-size:2.4413888889rem;
		margin-bottom:29.2966666667px;
		margin-bottom:1.6275925926rem
}
}
@media all and (max-width: 640px){
	.typgr8-beta,h2{
		font-size:28.1248px;
		font-size:1.5624888889rem;
		margin-bottom:18.7498666667px;
		margin-bottom:1.0416592593rem
}
}
@media all and (min-width: 640px){
	.typgr8-beta,h2{
		font-size:35.156px;
		font-size:1.9531111111rem;
		margin-bottom:23.4373333333px;
		margin-bottom:1.3020740741rem
}
}
@media all and (max-width: 640px){
	.typgr8-gamma,h3{
		font-size:22.5px;
		font-size:1.25rem;
		margin-bottom:15px;
		margin-bottom:0.8333333333rem
}
}
@media all and (min-width: 640px){
	.typgr8-gamma,h3{
		font-size:28.125px;
		font-size:1.5625rem;
		margin-bottom:18.75px;
		margin-bottom:1.0416666667rem
}
}
@media all and (max-width: 640px){
	.typgr8-delta,h4{
		font-size:16px;
		font-size:1rem;
		margin-bottom:12px;
		margin-bottom:0.6666666667rem
}
}
@media all and (min-width: 640px){
	.typgr8-delta,h4{
		font-size:22.5px;
		font-size:1.25rem;
		margin-bottom:15px;
		margin-bottom:0.8333333333rem
}
}
@media all and (max-width: 640px){
	.typgr8-epsilon,h5{
		font-size:14.4px;
		font-size:0.8rem;
		margin-bottom:9.6px;
		margin-bottom:0.5333333333rem
}
}
@media all and (min-width: 640px){
	.typgr8-epsilon,h5{
		font-size:16px;
		font-size:1rem;
		margin-bottom:12px;
		margin-bottom:0.6666666667rem
}
}
@media all and (max-width: 640px){
	.typgr8-zeta,h6{
		font-size:11.52px;
		font-size:0.64rem;
		margin-bottom:7.68px;
		margin-bottom:0.4266666667rem
}
}
@media all and (min-width: 640px){
	.typgr8-zeta,h6{
		font-size:14.4px;
		font-size:0.8rem;
		margin-bottom:9.6px;
		margin-bottom:0.5333333333rem
}
}
p{
	margin:auto auto 1.5em
}
small{
	font-size:80%
}
input,abbr,acronym,blockquote,code,kbd,q,samp,var{
	-webkit-hyphens:none;
	-moz-hyphens:none;
	-ms-hyphens:none;
	hyphens:none
}
pre{
	white-space:pre
}

abbr{
	-webkit-font-variant:small-caps;
	-moz-font-variant:small-caps;
	-ms-font-variant:small-caps;
	font-variant:small-caps;
	font-weight:600;
	text-transform:lowercase;
	color:gray
}
abbr[title]:hover{
	cursor:help
}
.typgr8-drop-cap:first-letter{
	float:left;
	margin:-0.8rem 0rem 0 -1rem;
	padding:0 .6rem;
	font-size:6rem;
	font-family:inherit;
	line-height:1;
	text-indent:0;
	background:transparent;
	color:inherit
}
p+.typgr8-drop-cap{
	text-indent:0;
	margin-top:0
}

.inline{
	display:inline
}
.center-text{
	text-align:center
}
.sc,.dropcap::first-line,.post__content>p:first-of-type::first-line{
	-moz-font-feature-settings:"smcp=1";
	-moz-font-feature-settings:"smcp";
	-ms-font-feature-settings:"smcp";
	-webkit-font-feature-settings:"smcp";
	-o-font-feature-settings:"smcp";
	font-feature-settings:"smcp"
}
.cf:before,.cf:after{
	content:" ";
	display:table
}
.cf:after{
	clear:both
}
.cf{
	*zoom:1
}
.m0a{
	margin:0 auto
}
.m0{
	margin:0
}
.p0{
	padding:0
}
.mt0{
	margin-top:0 !important
}
.p1rem{
	padding:1rem
}
.m1rem{
	margin:1rem
}
.full,.full-width{
	width:100%
}
.unstyled-anchor,.unstyled-anchor:hover,.unstyled-anchor:active{
	text-decoration:inherit;
	border:inherit;
	color:inherit
}
.hcenter{
	margin:0 auto;
	width:100%
}
.hidden{
	display:none
}
.sans-serif{
	font-family:"Roboto","Source Sans Pro","Roboto","PT Sans","Helvetica",sans-serif
}

.amp{
	font-style:italic;
	font-weight:400;
	font-family:"Libre Baskerville",Baskerville,"Goudy Old Style",Palatino,"Book Antiqua",serif
}
*,*:before,*:after{
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box
}
*+*{
	margin-top:1rem
}
::-moz-selection,::selection{
	background:#2c3e50;
	color:#fff
}
.page-template{
	padding-top:0
}
.math *+*{
	margin-top:0
}
.math{
	text-align:center;
	font-size:1.65rem;
	padding:.55rem;
	max-width:100%;
	overflow:auto
}
.container{
	margin:0 auto;
	padding:1.25rem;
	max-width:960px
}
@media all and (min-width: 640px){
	.container{
		padding:1.5rem
}
}
.page-template .content,.post-template .content{
	max-width:800px
}
img{
	max-width:100%
}
.jslghtbx-contentwrapper{
	max-height:110vh !important
}
a{
	text-decoration:none
}




hr{
	display:block;
	margin:1.65rem auto;
	padding:0;
	height:1px;
	border:0;
	border-top:#f0e6ce 1px double;
	text-align:center
}
hr:after{
	position:relative;
	top:.28rem;
	display:inline;
	padding:0 1rem;
	content:"* * *";
	font-size:1.954rem;
	line-height:0
}
hr.plain-hr:after{
	display:none
}
.meta-spacer:after{
	color:#f0e6ce;
	content:" • ";
	padding:auto .5rem;
	font-weight:900;
	font-family:"Roboto","Source Sans Pro","Roboto","PT Sans","Helvetica",sans-serif
}
.dropcap:first-letter,.post__content>p:first-of-type:first-letter{
	float:left;
	margin:-0.8rem 0rem 0 -1rem;
	padding:0 .6rem;
	font-size:6rem;
	font-family:inherit;
	line-height:1;
	text-indent:0;
	background:transparent;
	color:inherit
}
.dropcap::first-letter,.post__content>p:first-of-type::first-letter{
	font-weight:900;
	color:#787e84
}
.dropcap::first-line,.post__content>p:first-of-type::first-line{
	text-transform:uppercase
}
_:-moz-tree-row(hover),.dropcap:first-letter,.post__content>p:first-of-type:first-letter{
	margin-top:.25rem
}
.site-footer__navigation .fa-rss,.pagination .fa{
	margin-top:.25rem
}
.site-footer__attribution--ghost img{
	margin-top:.375rem
}
body,table{
	font-family: Arial, Helvetica, sans-serif;
}
@media all and (min-width: 960px){
	body,table{
		font-size:21px
}
}
h1,h2,h5,h6{
	font-family: Arial, Helvetica, sans-serif;
	font-weight:900;
	margin-top:4rem;
	margin-bottom:1.5rem;
	letter-spacing: -2px;
	color:#2c3e50
}

h3{
	font-family: Arial, Helvetica, sans-serif;
	font-weight:500;
	font-size: 19px;
	margin-top:4rem;
	margin-bottom:1.5rem;
	letter-spacing: 0px;
	color:#2d3e91
}

h4{
	font-family: Arial, Helvetica, sans-serif;
	font-weight:700;
	font-size: 22px;
	margin-top:4rem;
	margin-bottom:1.5rem;
	letter-spacing: 0px;
	color:#2c3e50
}


li{
	margin-bottom:2rem
}
li em{
	margin-top:.25rem;
	display:block;
	font-size:0.8rem;
	font-family: Arial, Helvetica, sans-serif
}
li a{
	font-family: Arial, Helvetica, sans-serif;
	font-weight:700;
	letter-spacing: 0;
}


.main-content ol {
    list-style-position: outside;
    padding-inline-start: 1.5rem;
font-family: Arial, Helvetica, sans-serif;
	font-weight:700;
	letter-spacing: 0;

}

h1{
	margin-top:2rem;
	margin-bottom:.5rem
}
h3{
	margin-top:0;
	margin-bottom:0
}
@media all and (min-width: 640px){
	h3{
		margin-bottom:3rem
}
}
h4{
	padding-bottom:.5rem;
	border-bottom:1px solid #f0e6ce
}
h1,h3{
	text-align:center
}
@media all and (min-width: 640px){
	h1,h3{
		text-align:left;
		float:left;
		display:block;
		width:calc(100% - 150px)
}
}



.post-teaser__title a:hover{
	color:#e00
}
p,.content,.content li{
	font-family: Arial, Helvetica, sans-serif
}
a{
	color:#216fa3;
	border-bottom:1px solid #f0e6ce;
	-webkit-transition:color,.6s;
	-o-transition:color,.6s;
	transition:color,.6s
}
a:hover{
	color:#f9690e;
	border-bottom:2px solid #f0e6ce
}
[disabled]{
	color:#a0a8b0
}
footer,aside{
	font-family:"Roboto","Source Sans Pro","Roboto","PT Sans","Helvetica",sans-serif
}
.read-more,hr:after,.post-teaser__meta,.site-footer__attribution,.post__meta,.butler-color{
	color:#a0a8b0
}
body,table,hr:after{
	background-color:#fdfdfd
}


.content>img,p>img{
	margin:1.5rem 0
}
figure:not(.plain-figure){
	margin:1.5rem auto;
	border:4px solid #d0d4d8
}
figure:not(.plain-figure) figcaption{
	background-color:#f0e6ce;
	font-family:"Roboto","Source Sans Pro","Roboto","PT Sans","Helvetica",sans-serif;
	font-size:.8rem;
	line-height:1rem;
	padding:.5rem;
	margin-top:0
}
figure img,.thumb img{
	margin-top:0
}
.thumb,figure.thumb{
	width:100%;
	max-width:225px;
	margin:.5rem 0 .5rem 1rem;
	float:right;
	line-height:1
}
.thumb img.full-img{
	margin:0 auto;
	width:100%
}




blockquote{
	margin:1rem;
	margin-right:0;
	padding:0 1.5rem;
	display:block
}


table{
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	margin:1.5em 0;
	width:100%;
	max-width:100%
}
table th,table td{
	padding:8px;
	line-height:1.5em;
	text-align:left;
	vertical-align:top;
	border-top:#fff 1px solid
}
table th{
	color:#000
}
table caption+thead tr:first-child th,table caption+thead tr:first-child td,table colgroup+thead tr:first-child th,table colgroup+thead tr:first-child td,table thead:first-child tr:first-child th,table thead:first-child tr:first-child td{
	border-top:0
}
table tbody+tbody{
	border-top:#fff 2px solid
}
table table table{
	background-color:#fff
}

table.plain tbody>tr:nth-child(odd)>td,table.plain tbody>tr:nth-child(odd)>th{
	background:transparent
}
iframe,.fluid-width-video-wrapper{
	display:block;
	margin:1.6em 0
}
aside{
	font-family:"Roboto","Source Sans Pro","Roboto","PT Sans","Helvetica",sans-serif;
	font-size:1rem;
	background-color:#fff;
	padding:1rem;
	border:1px solid #a0a8b0
}
@media all and (min-width: 640px){
	aside{
		width:40%;
		float:right;
		margin-right:0;
		margin:1rem;
		position:relative;
		left:.5rem
}
}



.
.main-header{
	background-color:#fff;
	border-bottom:1px solid #f0e6ce;
	box-shadow:0 5px 5px -5px #999;
	padding:1.5rem;
	width:100%;
	position:fixed;
	margin:0 auto;
	z-index:1000;
	top:0;
	left:0;
	text-align:left;
	-webkit-transition-duration:.5s;
	transition-duration:.5s;
	-webkit-transition-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1);
	transition-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1);
	-webkit-transition-property:-webkit-transform;
	transition-property:transform
}
.main-header__logo{
	clear:both;
	float:left;
	padding-right:1rem
}
@media all and (min-width: 960px){
	.main-header__logo{
		padding-right:1.65rem
}
}
.main-header__logo img{
	max-height:5.3rem
}
.main-header__text-container{
	margin-top:0;
	float:left
}
@media all and (min-width: 640px){
	.main-header__text-container{
		margin:0 auto
}
}
.main-header__blog-description{
	font-family: Arial, Helvetica, sans-serif;
	font-weight:400;
	margin-bottom:0;
	color:#2c3e50;
	font-style:italic
}
.main-header__blog-title{
	border-bottom:none;
	margin-bottom:.55rem;
	color:#5e240d;
	font-family:"Roboto","Source Sans Pro","Roboto","PT Sans","Helvetica",sans-serif;
	font-weight:900
}
@media all and (max-width: 640px){
	.main-header__blog-title{
		font-size:1.25rem;
		padding-top:.25rem
}
}
.main-header__menu-container{
	height:auto;
	width:100%;
	display:block;
	clear:both
}
@media all and (min-width: 960px){
	.main-header__menu-container{
		width:auto;
		float:right;
		width:auto;
		clear:none
}
}

.main-header__menu-icon-container{
	float:right;
	font-size:2rem;
	display:inline;
	margin-top:1rem
}
.main-header--hidden{
	-webkit-transform:translateY(-100%);
	-ms-transform:translateY(-100%);
	transform:translateY(-100%)
}
.main-header--narrow{
	padding:.25rem 1rem !important;
	line-height:1
}
@media all and (min-width: 640px){
	.main-header--narrow{
		padding:.5rem 1rem
}
}
.main-header--narrow .main-header__logo{
	display:none
}
@media all and (min-width: 960px){
	.main-header--narrow .main-header__logo{
		display:none
}
}
.main-header--narrow .main-header__blog-description{
	display:none
}
.main-header--narrow .main-header__blog-title{
	margin:0rem;
	font-size:1.25rem;
	text-transform:uppercase;
	font-weight:400;
	letter-spacing:.05rem;
	line-height:2
}
@media all and (min-width: 960px){
	.main-header--narrow .main-header__blog-title{
		font-size:1.5rem;
		margin-top:0rem
}
}
.main-header--narrow li{
	margin-top:0 !important;
	position:relative;
	bottom:.15rem
}
.main-header--narrow .nav-collapse.opened{
	padding-bottom:1rem;
	padding-top:0
}
.main-header--narrow .nav-toggle{
	font-size:1.5rem;
	margin-right:.5rem
}
.main-header--narrow .main-header__menu-icon-container{
	margin-top:.5rem
}
@media all and (max-width: 450px){
	.main-header__logo{
		display:block;
		width:100%;
		text-align:center;
		padding-bottom:.5rem;
		position:relative;
		bottom:.5rem;
		padding-right:0
}
	.main-header{
		padding:1.5em 1rem;
		text-align:center
}
	.main-header__text-container{
		float:none
}
	.main-header__menu-icon-container{
		font-size:2rem;
		margin-top:0;
		display:block;
		width:100%;
		padding-top:0rem;
		position:relative;
		top:1rem
}
	.main-header--narrow .main-header__menu-icon-container{
		top:0;
		margin-top:0rem
}
}







.site-footer{
	text-align:center;
	padding:.5rem 2rem 2rem 2rem;
	border-top:1px solid #f0e6ce
}
.site-footer:before{
	content:"§";
	font-family: Arial, Helvetica, sans-serif;
	display:inline;
	line-height:0;
	margin-top:0;
	height:0;
	position:relative;
	bottom:.65rem;
	color:#f0e6ce;
	background-color:#fdfdfd
}
.site-footer__navigation ul{
	margin-top:0
}
.site-footer__navigation li{
	display:inline
}
.site-footer__navigation li:after{
	content:" // " !important;
	color:#f0e6ce !important
}
.site-footer__attribution span{
	display:block;
	margin-top:.5rem
}
@media all and (min-width: 960px){
	.site-footer__attribution span{
		display:inline;
		margin-top:auto
}
}
.site-footer__attribution .meta-spacer::after{
	content:""
}







.logo{
	float:left;
	max-height:4rem;
	display:inline;
	margin-top:2.25rem;
	margin-right:2rem
}
@media all and (max-width: 640px){
	.logo{
		display:block;
		float:none;
		margin:0 auto
}
}
@media all and (max-width: 640px){
	.header{
		text-align:center;
		margin-bottom:0;
		padding-bottom:0
}
}

h5 { font-size: 36px}





/* ===== SIDEBAR LAYOUT ===== */

.page-layout {
    display: flex;
    max-width: 1400px;
    margin: 0 auto;
}

/* LEFT SIDEBAR */

.sidebar {
    width: 280px;
    min-width: 280px;
    height: 100vh;

    position: sticky;
    top: 0;

    overflow-y: auto;

    padding: 10px 20px;

    background: #f5f5f5;
    border-right: 1px solid #ddd;
}

.sidebar h2 {
    font-size: 24px;
    margin-bottom: 20px;
    letter-spacing: -2px;
}

.sidebar ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.sidebar li {
    margin-bottom: 3px;
line-height: 1;
    
}

.sidebar a {
    text-decoration: none;
    border-bottom: none;
    color: #2c3e50;
    font-weight: 700;
    font-size: 15px;
}

.sidebar a:hover {
    color: #f9690e;
}











/* MAIN CONTENT */

.main-content {
    flex: 1;
    padding: 40px;
    max-width: 1000px;
}



.menu-overlay {
    display: none;
}




/* MOBILE */

/* MOBILE SIDEBAR */

.hamburger {
    display: none;
}

@media (max-width: 900px) {
.menu-overlay {
        display: block;
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,.45);
        z-index: 1999;

        opacity: 0;
        visibility: hidden;
        transition: .3s;
    }

    .menu-overlay.open {
        opacity: 1;
        visibility: visible;
    }

    .page-layout {
        display: block;
    }

    .hamburger {
        display: block;
        position: fixed;
        top: 15px;
        left: 15px;
        z-index: 2001;

        width: 44px;
        height: 44px;

        border: none;
        background: #2c3e50;
        color: white;
        font-size: 24px;
        line-height: 44px;
        text-align: center;
        border-radius: 4px;
        cursor: pointer;
    }

    .sidebar {
        position: fixed;
        top: 0;
        left: -300px;

        width: 280px;
        min-width: 280px;
        height: 100vh;

        z-index: 2000;

        overflow-y: auto;

        background: #f5f5f5;
        border-right: 1px solid #ddd;

        transition: left 0.3s ease;
    }

    .sidebar.open {
        left: 0;
    }

    .main-content {
        padding: 20px;
    }
}


/* submenu hidden by default */
.sub-menu {
  display: none;
  margin: 14px 0 0 0;
  padding-left: 14px; /* slightly tighter indentation */
}


/* show when open */
.has-children.open > .sub-menu {
  display: block;
padding: 10px 0px 0px 15px;

}

/* submenu links should NOT inherit bold */
.sub-menu li a {
  font-size: 14px;
  font-weight: 400;   /* override bold */
  color: #2c3e50;
}

/* optional: make submenu feel clearly "secondary" */
.sub-menu li {
  margin-bottom: 0px;

}


/* Top-level sidebar items */
#sidebar a,
.sidebar a,
.sidenav a,
#mod_sidebar a {
    letter-spacing: -0.4px; /* adjust as needed */
}

/* Submenu / nested items */
#sidebar ul ul a,
.sidebar ul ul a,
.sidenav ul ul a,
#mod_sidebar ul ul a {
    letter-spacing: -0.6px; /* slightly tighter for sub-items */
}


.menu-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 17px;
}


.sidebar .sub-menu li,
.sidebar .sub-menu li + li {
    margin-top: 0;
    margin-bottom: 0;
}


.sub-menu li a {
    display: block;
    font-size: 13px;
    line-height: 1.2;
    padding: 2px 0;
    font-weight: 400;
}




.toggle-btn::before {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;

  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 8px solid #2c3e50;

  transition: transform 0.2s ease;
}


.toggle-btn {
    align-self: flex-start;
    margin-top: 2px;
}



.has-children.open .toggle-btn::before {
  transform: rotate(180deg);
}


.clause {
    margin-left: 40px;
    text-indent: -25px;
}

.sidebar-logo-link {
    display: block;
    text-align: center;
    margin: 10px 0 20px;
    border: none;
}

.sidebar-logo {
    display: block;
    margin: 0 auto;
    max-width: 140px;   /* adjust as desired */
    height: auto;
}

.sidebar-logo-link:hover {
    border-bottom: none;
}


.toggle-btn {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 14px;
  transition: transform 0.2s ease;
}

.has-children.open .toggle-btn {
  transform: rotate(45deg);
}