/** ------------------------------------------------------ **/
/** ------------------- standard ------------------------- **/
body {
	font-family: "Montserrat", sans-serif, Arial, Verdana, Helvetica;
	font-size: 1rem;
}

p {
	color: #444444;
	font-size: 1rem;
	margin:0px;
	margin-bottom:16px;
	line-height:2.3em;
	padding:0px;
}

h1{
	color: #860d00;
	font-size: 2rem;
	font-weight: 600;	
	margin:0px;
	margin-bottom:12px;
	padding:0px;
}

h2{
	color: #860d00;
	font-size: 1.5rem;
	font-weight: 600;
	text-decoration:none;
}

h3{
	color: #860d00;
	font-size: 1rem;
	font-weight: 600;	 
}

h4{
	margin:0px;
	padding:0px;
}

a, a:visited {
	color: #860d00;
	text-decoration: underline;
}
a:hover {
	color: #444444;
}
img {
	border: 0px;
}

ul, ol{
	color: #444444;
	
}
ul li, ol li{
	font-size: 1rem;
	line-height:2.6em;
}

.redtext {
	color: #FF0000;
}
.greentext{
	color:#3f6510;
}

.goldtext{
	color:#cc935c;
}

.smalltext {
	font-size: 0.8em;
}

.testimonial-background {
	background-color:#ccc;
}

.contact-button {
	background-color:#5a0f0f;
	color:#ffffff;
	display:inline-block;
	padding:10px 20px;
}

.btn-red {
	background-color: #860d00;
	border-radius: 0.5rem;
	color: #ffffff;
	padding-inline: 1.5rem;
	display: inline-flex;
	align-items: center;
}

.btn-grey {
	background-color: #363636;
	border-radius: 0.5rem;
	color: #ffffff;
	padding-inline: 1.5rem;
	display: inline-flex;
	align-items: center;
}

/* add an after pseudo element to the button to add a right arrow */
span.btn-red::after, span.btn-grey::after {
	content: "";
	background-image: url("/images/button-arrow.png");
	background-size: contain;
	background-repeat: no-repeat;
	display: inline-block;
	width: 10px;
	height: 15px;
	margin-left: 8px;
	vertical-align: middle;
}

.border-radius, span.border-radius img {
	border-radius: 0.75rem;
}

.light-text {
	font-weight: 400;
}
.medium-text {
	font-weight: 500;
}
.semibold-text {
	font-weight: 600;
}
.bold-text {
	font-weight: 700;
}
.d-flex {
	display: flex;
}
.d-inline-flex {
	display: inline-flex;
}
.justify-content-between {
	justify-content: space-between;
}
.justify-content-center {
	justify-content: center;
}
.button-group {
	display: flex;
	gap: 16px;
}

.checklist {
	color: #363636;
}

ul li:has(.checklist) {
	border-bottom: 1px solid #e5e5e5;
	display: block;
	list-style: none;
	padding: 0px;
	margin: 0px;
	width: 100%;
}

ul li span.checklist  {
	color: #363636;
	display: block;
	font-size: 1.2rem;
	font-weight: 500;
	line-height:1.5em;
	padding: 0px;
	padding-inline: 0.75rem;
	padding-block: 1rem;
	margin: 0px;
}

ul li span.checklist::before {
    content: "";
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%23860d00' class='bi bi-check-lg' viewBox='0 0 16 16'><path d='M12.736 3.97a.733.733 0 0 1 1.047 0c.286.289.29.756.01 1.05L7.88 12.01a.733.733 0 0 1-1.065.02L3.217 8.384a.757.757 0 0 1 0-1.06.733.733 0 0 1 1.047 0l3.052 3.093 5.4-6.425z'/></svg>");
    background-size: 2rem 2rem;
    background-repeat: no-repeat;
    display: inline-flex;
    width: 2rem;
    height: 1.5rem;
    margin-right: 0.5rem;
}

/** ------------------------------------------------------ **/
/** ------------------- alignment ------------------------ **/

.alignRight {	
	margin-bottom: 16px;
	margin-left: 20px;
	text-align:right;
}

img.alignRight{
	border: 0px;
	float:right;
	margin-bottom: 16px;
	margin-left: 20px;
}

.alignLeft {
	margin-bottom: 16px;
	margin-right: 20px;
	text-align:left;
}

img.alignLeft{
	border: 0px;
	float:left;
	margin-bottom: 16px;
	margin-right: 20px;
}

.alignCentre {
	border: 0px;
	text-align:center;
	margin-bottom: 16px;
	margin-left:auto;
	margin-right:auto;
	display: block;
  	vertical-align: middle;
} 



/** ------------------------------------------------------ **/
/** ------------------- bespoke -------------------------- **/

table.tableStyleA {
	background-color:#FFFFFF !important;
	margin: 10px 0px 10px 0px;
	border-style:solid;
	border-width: 1px;
	border-color:#000000;
	border-collapse: collapse;
}

table.tableStyleA td, th{
	text-align:left;
	vertical-align:top;
	border-style:solid;
	border-width: 1px;
	border-color:#000000;
	padding: 5px 5px 5px 5px;
}
table.tableStyleB {
	background-color:#EEEEEE !important;
	margin: 10px 0px 10px 0px;
	border-style:solid;
	border-width: 1px;
	border-color:#000000;
	border-collapse: collapse;
}

table.tableStyleB td, th{
	text-align:left;
	vertical-align:top;
	border-style:solid;
	border-width: 1px;
	border-color:#000000;
	padding: 5px 5px 5px 5px;
}

table td p {
	padding: 0px;
	margin: 0px;
}


.TemplateClear {
	clear: both; 
	height: 0px;
}

.Template4colContainer, .Template2colContainer, .TemplateTestimonialsContainer, .Template2colLinksContainer {
	margin-bottom:10px;
	width: 1180px; 
}

.Template4colColumn, .Template2colColumn, .TemplateTestimonialsColumn,  .Template2colColumnLinks {
	float: left; 
	margin-right: 20px;
}
.Template4colColumn {
	width: 280px; 
}
.Template2colColumn, .Template2colColumnLinks {
	width: 580px; 
}
.TemplateTestimonialsColumn {
	background-color:#eeeeee;
	padding-right:2%;
	padding-left:2%;
	width:96%;
}
.last{
	margin-right:0px !important;	
}

/* add a background colour/image to these divs when editing in WYSIWYG editor */ 

.mce-content-body .Template4colContainer, .mce-content-body .Template2colContainer{
	background-color: #ffffff;
}
.mce-content-body .Template4colColumn, .mce-content-body .Template2colColumn{
	background-color: #e1e1e1;
	background-image: url(/admin/images/wysiwyg-template-bg.gif);
	background-repeat: repeat;
}


/** ------------------------------------------------------ **/
/** ------------------- fonts -------------------------- **/

.fontArial {
	font-family: Arial;
}
.fontGeorgia {
	font-family: Georgia;
}