/*===========================================
	FONTS
===========================================*/
@font-face {
	font-family: 'theme-font-thin';
	src: url("/assets/fonts/Manrope-Light.ttf") format('truetype');
	font-weight: 300;
	font-display: swap;
}

@font-face {
	font-family: 'theme-font-regular';
	src: url("/assets/fonts/Manrope-Regular.ttf") format('truetype');
	font-weight: 400;
	font-display: swap;
}

@font-face {
	font-family: 'theme-font-bold';
	src: url("/assets/fonts/Manrope-Bold.ttf") format('truetype');
	font-weight: 700;
	font-display: swap;
}

@font-face {
	font-family: 'bebas-neue';
	src: url("/assets/fonts/BebasNeue-Regular.ttf") format('truetype');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'font-awesome-regular';
	src: url("/assets/icons/font-awesome-webfonts/fa-regular-400.ttf") format('truetype');
	font-weight: 400;
	font-display: swap;
}

@font-face {
	font-family: 'font-awesome-solid';
	src: url("/assets/icons/font-awesome-webfonts/fa-solid-900.ttf") format('truetype');
	font-weight: 400;
	font-display: swap;
}


/*===========================================
	STANDARD ELEMENTS
===========================================*/
* {
	margin: 0; 
	padding: 0;
}

body {
	font-family: 'theme-font-regular';
	margin: 0;
	padding: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    color: #6b6b6b;
    background-color: #fff;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
}

html, body {
	height: 100%;
}

img {
	max-width: 100%;
	height: auto;
}
div {
	outline: none;
}

.bullet-list ul {
	margin-left: 30px;
	list-style: none;
}
	.bullet-list ul li {
		list-style-type: disc;
		padding-bottom: 1em;
	}


/*===========================================
	HEADERS
===========================================*/
h1, h2, h3, h4, h5, h6 {
	font-family: 'theme-font-bold';
    font-weight: 700;
	margin: 0;
	padding: 0;
	color: #231f20;
}
	h1 {
		font-size: 40px;
		line-height: 50px;
	}

	h2 {
		font-size: 40px;
		line-height: 50px;
		margin-bottom: 30px;
	}

	h3 {
		font-size: 22px;
		line-height: 30px;
		margin-bottom: 15px;
	}
	h4 {
		font-size: 16px;
		margin-bottom: 0;
	}
	h5 {
	}
	
	
/*===========================================
	HYPERLINKS
===========================================*/
a:link, a:active, a:visited {
	text-decoration: none;
	color: #646464;
	transition: color 0.3s linear;
	-webkit-transition: color 0.3s linear;
	-moz-transition: color 0.3s linear;
}
	a:hover {
		text-decoration: underline;
		color: #454545;
	}
	
	
/*===========================================
	IMAGES
===========================================*/
img {
	max-width: 100%;
	height: auto;
}
div {
	outline: none;
}
header, footer, section, figure {
	display: block;
}



/*===========================================
	BULLET LISTS
===========================================*/
ul.fa-ul {
	list-style-type: none;
	padding-left: 10px;
	padding-bottom: 20px;
}
	ul.fa-ul li {
		position: relative;
		padding-left: 10px;
		margin-bottom: 10px;
	}
		ul.fa-ul li:last-child {
			margin-bottom: 0;
		}
		ul.fa-ul li:before {
			position: absolute;
			top: -4px;
			left: 0;
			margin-left: -20px;
			font-family: font-awesome-solid;
			content: "\f058";
			font-size: 1.5em;
			color: #00aeef;
		}


ul.fa-ul-centered {
	list-style-type: none;
	padding-left: 0;
	padding-bottom: 20px;
}
	ul.fa-ul-centered.no-padding {
		padding-bottom: 0;
	}
	ul.fa-ul-centered li {
		position: relative;
		padding-left: 10px;
		margin-bottom: 10px;
	}
		ul.fa-ul-centered li:last-child {
			margin-bottom: 0;
		}
		ul.fa-ul-centered li:before {
			position: absolute;
			top: -4px;
			margin-left: -25px;
			font-family: font-awesome-solid;
			content: "\f058";
			font-size: 1.5em;
			color: #00aeef;
		}



/*===========================================
	ALIGNMET
===========================================*/		
.text-left {
	text-align: left;
}
.text-center {
	text-align: center;
}
.text-right {
	text-align: right;
}
.small-text {
	font-size: 0.8em;
}	


/*===========================================
	SPACING
===========================================*/
.margin-top-50 {
	margin-top: 50px;
}
.margin-top-100 {
	margin-top: 100px;
}
.margin-top-bottom-50 {
	margin: 50px 0;
}
.margin-top-bottom-100 {
	margin: 100px 0;
}
.margin-bottom-30 {
	margin-bottom: 30px;
}
.margin-bottom-50 {
	margin-bottom: 50px;
}
.margin-bottom-20 {
	margin-bottom: 20px;
}
.padding-top-bottom-50 {
	padding: 50px 0;
}
.padding-top-bottom-100 {
	padding: 100px 0;
}

.padding-top-50 {
	padding-top: 50px;
}
.padding-bottom-50 {
	padding-bottom: 50px;
}
.padding-top-100 {
	padding-top: 100px;
}
.padding-bottom-100 {
	padding-bottom: 100px;
}

.hr-bottom-100 {
	border-bottom: 1px solid #CCC;
	padding-bottom: 50px;
	margin-bottom: 50px;
}


/*===========================================
	CLEAR FIXES
===========================================*/
.clearfix:before, .clearfix:after {content: ""; display: table;}
.clearfix:after {clear: both;}
.clearfix {*zoom: 1;}


/*===========================================
	HIDDEN
===========================================*/
.hidden-section {display: none;}



/*===========================================
	COLOURS
===========================================*/
.blue-text {color: #00aeef;}
.blue-color {color: #00aeef;}


.oxford-blue-background {background: #00aeef;}
.oxford-blue-trans-background {background: rgba(59, 72, 86, 0.8);}

.brandy-punch-background {background: #ca872e;}
.gold-sand-background {background: #e2c487;}
.teak-background {background: #231f20;}

.oxford-blue-color {color: #3b4856;}
.brandy-punch-color {color: #ca872e;}
.gold-sand-color {color: #e2c487;}
.teak-color {color: #ad9067;}
.white-color {color: #FFF;}


.wild-sand-background {background: #f6f6f6}
.spanish-white-background {background: #F9F3E7}



.green80-background {background: rgba(23, 78, 83, 0.8)}
.alabaster-background-left-no-border {
	background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.dev/svgjs' width='2500' height='1000' preserveAspectRatio='none' viewBox='0 0 2500 1000'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1028%26quot%3b)' fill='none'%3e%3cpath d='M2500 0L1662.49 0L2500 304.66z' fill='rgba(255%2c 255%2c 255%2c .1)'%3e%3c/path%3e%3cpath d='M1662.49 0L2500 304.66L2500 340.91L1523.18 0z' fill='rgba(255%2c 255%2c 255%2c .075)'%3e%3c/path%3e%3cpath d='M1523.18 0L2500 340.91L2500 513.62L1326.89 0z' fill='rgba(255%2c 255%2c 255%2c .05)'%3e%3c/path%3e%3cpath d='M1326.89 0L2500 513.62L2500 628.42L987.4200000000001 0z' fill='rgba(255%2c 255%2c 255%2c .025)'%3e%3c/path%3e%3cpath d='M0 1000L767.95 1000L0 672.56z' fill='rgba(0%2c 0%2c 0%2c .1)'%3e%3c/path%3e%3cpath d='M0 672.56L767.95 1000L1434.13 1000L0 519.43z' fill='rgba(0%2c 0%2c 0%2c .075)'%3e%3c/path%3e%3cpath d='M0 519.4300000000001L1434.13 1000L1588.89 1000L0 200.81000000000006z' fill='rgba(0%2c 0%2c 0%2c .05)'%3e%3c/path%3e%3cpath d='M0 200.80999999999995L1588.89 1000L1786.8600000000001 1000L0 106.95999999999995z' fill='rgba(0%2c 0%2c 0%2c .025)'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1028'%3e%3crect width='2500' height='1000' fill='white'%3e%3c/rect%3e%3c/mask%3e%3c/defs%3e%3c/svg%3e") no-repeat bottom left;
}
.alabaster-background-left {
	border-top: 1px solid #F1F1F1;
	border-bottom: 1px solid #F1F1F1;
	background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.dev/svgjs' width='2500' height='1000' preserveAspectRatio='none' viewBox='0 0 2500 1000'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1028%26quot%3b)' fill='none'%3e%3cpath d='M2500 0L1662.49 0L2500 304.66z' fill='rgba(255%2c 255%2c 255%2c .1)'%3e%3c/path%3e%3cpath d='M1662.49 0L2500 304.66L2500 340.91L1523.18 0z' fill='rgba(255%2c 255%2c 255%2c .075)'%3e%3c/path%3e%3cpath d='M1523.18 0L2500 340.91L2500 513.62L1326.89 0z' fill='rgba(255%2c 255%2c 255%2c .05)'%3e%3c/path%3e%3cpath d='M1326.89 0L2500 513.62L2500 628.42L987.4200000000001 0z' fill='rgba(255%2c 255%2c 255%2c .025)'%3e%3c/path%3e%3cpath d='M0 1000L767.95 1000L0 672.56z' fill='rgba(0%2c 0%2c 0%2c .1)'%3e%3c/path%3e%3cpath d='M0 672.56L767.95 1000L1434.13 1000L0 519.43z' fill='rgba(0%2c 0%2c 0%2c .075)'%3e%3c/path%3e%3cpath d='M0 519.4300000000001L1434.13 1000L1588.89 1000L0 200.81000000000006z' fill='rgba(0%2c 0%2c 0%2c .05)'%3e%3c/path%3e%3cpath d='M0 200.80999999999995L1588.89 1000L1786.8600000000001 1000L0 106.95999999999995z' fill='rgba(0%2c 0%2c 0%2c .025)'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1028'%3e%3crect width='2500' height='1000' fill='white'%3e%3c/rect%3e%3c/mask%3e%3c/defs%3e%3c/svg%3e") no-repeat bottom left;
}
.alabaster-background-right {
	background: #d5d7db url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.dev/svgjs' width='2500' height='1000' preserveAspectRatio='none' viewBox='0 0 2500 1000'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1027%26quot%3b)' fill='none'%3e%3cpath d='M0 0L357.83 0L0 316.52z' fill='rgba(255%2c 255%2c 255%2c .1)'%3e%3c/path%3e%3cpath d='M0 316.52L357.83 0L1027.28 0L0 370.09999999999997z' fill='rgba(255%2c 255%2c 255%2c .075)'%3e%3c/path%3e%3cpath d='M0 370.09999999999997L1027.28 0L1102.1399999999999 0L0 580.49z' fill='rgba(255%2c 255%2c 255%2c .05)'%3e%3c/path%3e%3cpath d='M0 580.49L1102.1399999999999 0L1987.33 0L0 726.7z' fill='rgba(255%2c 255%2c 255%2c .025)'%3e%3c/path%3e%3cpath d='M2500 1000L2149.9 1000L2500 531.0799999999999z' fill='rgba(0%2c 0%2c 0%2c .1)'%3e%3c/path%3e%3cpath d='M2500 531.0799999999999L2149.9 1000L1647.21 1000L2500 433.7899999999999z' fill='rgba(0%2c 0%2c 0%2c .075)'%3e%3c/path%3e%3cpath d='M2500 433.78999999999996L1647.21 1000L958.22 1000L2500 354.59999999999997z' fill='rgba(0%2c 0%2c 0%2c .05)'%3e%3c/path%3e%3cpath d='M2500 354.5999999999999L958.22 1000L462.77000000000004 1000L2500 134.61999999999992z' fill='rgba(0%2c 0%2c 0%2c .025)'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1027'%3e%3crect width='2500' height='1000' fill='white'%3e%3c/rect%3e%3c/mask%3e%3c/defs%3e%3c/svg%3e") no-repeat bottom right;
}


/*===========================================
	BUTTONS
===========================================*/
a.two-colour-oval-button,
span.two-colour-oval-button {
	display: flex;
    -webkit-transition: background .2s ease;
    transition: background .2s ease;
    color: #FFF !important;
	text-decoration: none;
	cursor: pointer;
}
	.two-colour-oval-button .button-name {
		width: calc(100% - 50px);
		padding: 0 20px;
		border-radius: 3px 0 0 3px;
		display: flex;
		justify-content: left;
		align-items: center;
		text-transform: uppercase;
		background: #00aeef;	
	}
	.two-colour-oval-button .button-icon {
		display: flex;
		justify-content: center;
		align-items: center;
		border-radius: 0 3px 3px 0;
		width: 40px;
		padding: 10px;
		background: #231f20;
		-webkit-transition: background .2s ease;
		transition: background .2s ease;	
	}
		.two-colour-oval-button .button-icon i {
			font-size: 1.5em;
		}
		
		a.two-colour-oval-button:hover .button-icon,
		span.two-colour-oval-button:hover .button-icon {
			background: #000;
			cursor: pointer;
		}
		
		
/* TEAK VERSION */		
.two-colour-oval-button.teak .button-name {
	background: #00EFB8;
}
.two-colour-oval-button.teak .button-icon {
	background: #FFF;
}
	.two-colour-oval-button.teak .button-icon i {
		font-size: 1.5em;
		color: #231f20;
	}
	
	a.two-colour-oval-button.teak:hover .button-icon {
		background: #DEDEDE;	
	}	

	
/*===========================================
	NUMBER IN CIRCLE
===========================================*/
.number-circle {
    margin: 0 auto;
    margin-bottom:20px;
	border-radius: 50%;
    width: 36px;
    height: 36px;
    padding: 8px;

    background: #00aeef;
    color: #FFF;
    text-align: center;
	
    font-size: 32px;
	line-height: 32px;
	
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.3);
}

	
/*===========================================
	UNDER CONSTRUCTION
===========================================*/
.feature-round-icon {
	width: 90px;
	height: 90px;
	border-radius: 100%;
	background: #00aeef;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0 auto 30px;
	box-shadow: 0px 10px 30px 2px rgb(0 0 0 / 12%);
	transition: 0.3s;
	overflow: hidden;
	position: relative;
	top: 0;
	transition: top ease 0.5s;
}
.feature-round-icon i {
	font-size: 50px;
	color: #fff;
	z-index: 1;
}


.our-services .flex-container .flex-one-third-margin:hover .feature-round-icon {
	top: -10px;
}


/*===========================================
	UNDER CONSTRUCTION
===========================================*/
.under-construction {
	margin: 0 auto;
	margin-top: 100px;
	width: 500px;
	color: #000;
	position: relative;
	text-align: left;
	overflow: auto;
	z-index: 2;	
}
.under-construction img{
	margin-bottom: 50px;
}
.under-construction h2 {
	text-align: center;
	margin-bottom: 10px;
}
.under-construction p {
	text-align: center;
	margin-bottom: 10px;
}
	.under-construction a:link, .under-construction a:active, .under-construction a:visited {
		text-decoration: none;
		color: #000;
	}
	.under-construction a:hover {
		text-decoration: underline;
	}


/*===========================================
	FRAME CONTAINERS
===========================================*/
.max-frame {
	max-width: calc(100% - 120px);
	padding: 0 60px;
}
.center-container-max {
	position: relative;
	margin: 0 auto;
}
.center-container {
	position: relative;
	margin: 0 auto;
	max-width: 1130px;
	padding: 0 10px;
}
	.center-container.max-width {
		max-width: calc(100% - 120px);
		padding: 0 60px;
	}
	.center-container.semi-narrow {
		max-width: 960px;
		padding: 0 10px;
	}
	.center-container.narrow {
		max-width: 480px;
		padding: 0 10px;
	}
.center-container-vmiddle {
	margin: auto;
	display: flex;
	justify-content: center;
	flex-direction: column;			
	height: 100%;
	text-align: left;
	width: 100%;
}
	.center-container-vmiddle.center-content {
		align-items: center;
	}


.side-content-container {
	padding-right: 30px;
}
.main-content-container {
	padding: 30px;
}
.block-image-background {
	padding: 100px 0;
}
	
	
/*===========================================
	FLEX CONTAINERS
===========================================*/
.flex-container {
	display: flex;
	flex-wrap: wrap;		
}

	/*	HALFS 	*/
	.flex-container .one-half-flex {
		width: 50%;
	}
	.flex-container .one-half-flex-margin {
		width: 49%;
		margin: 0 2% 50px 0;
	}
		.flex-container .one-half-flex-margin:nth-child(2n), 
		.flex-container .one-half-flex-margin:last-child {
			margin-right: 0;
		}
		
	.flex-container .one-half-flex-wide-margin {
		width: 44%;
		margin-right: 12%;
	}
		.flex-container .one-half-flex-wide-margin:nth-child(2n), 
		.flex-container .one-half-flex-wide-margin:last-child {
			margin-right: 0;
		}
	
	
	/*	THIRDS 	*/
	.flex-container .flex-one-third-margin {
		width: 31%;
		margin: 0 3.5% 50px 0;
	}
		.flex-container .flex-one-third-margin:nth-child(3n), 
		.flex-container .flex-one-third-margin:last-child {
			margin-right: 0;
		}
		
		.flex-container .flex-two-thirds {
			width: 65.5%;
		}
	
	
	/*	QUARTERS 	*/
	.flex-container .flex-one-quarter {
		width: 25%;
	}
		.flex-container .flex-one-quarter-margin {
			width: 23.5%;
			margin: 0 2% 50px 0;
		}
			.flex-container .flex-one-quarter-margin:nth-child(4n), 
			.flex-container .flex-one-quarter-margin:last-child {
				margin-right: 0;
			}
	
	
	/*	FIFTHS 	*/
	.flex-container .flex-one-fifth {
		width: 20%;
	}
		.flex-container .flex-one-fifth-margin {
			width: 18.4%;
			margin: 0 2% 0 0;
		}
			.flex-container .flex-one-fifth-margin:nth-child(5n), 
			.flex-container .flex-one-fifth-margin:last-child {
				margin-right: 0;
			}
	

/*===========================================
	PAGE HEADER MANAGEMENT
===========================================*/
.PageContentManagement {
	background: #24170e;
	padding: 4px 0;
	width: 100%;
}
	.PageContentManagement ul {
		float: right;
	}
		.PageContentManagement ul li {
			float: left;
			margin-right: 15px;
		}
			.PageContentManagement ul li:last-child {
				margin-right: 0px;
			}
			.PageContentManagement ul li a {
				font-size: 0.8em;
				color: #FFF;
			}
				.PageContentManagement ul li a i {
					padding-right: 5px;
				}
				
				
				
/*===========================================
	HEADER
===========================================*/
.header {
	height: 72px;
	background: #FFF;
	z-index: 1;
	padding: 10px 0;
	border: 1px solid #dde3f0;
}
	.header .company-logo {
		height: 72px;
		display: flex;
		justify-content: left;
		align-items: center;
		width: 250px;
		margin-right: 20px;
	}
		.header .company-logo img {
			width: 250px;
		}


/*===========================================
	PAGE IMAGE CONTAINER
===========================================*/
.hero-image-container {
	position: absolute;
	top: 0;
	left: 0;
	width:calc(50% - 300px);
	margin: 50px 150px;
	height: calc(100% - 100px);
}
	.hero-image-container .hero-image-content {
	}
		.hero-image-container .hero-image-content h1 {
			max-width: 450px;
			margin-bottom: 30px;
			color: #FFF;
		}
		.hero-image-container .hero-image-content p {
			font-size: 16px;
			color: #FFF;
		}
		
	.header-title-shaped-background {
		padding: 0px;
		transform-origin: 50% 50%;
		width: 275px;
		height: 35px;
		display: block;
		visibility: visible; 
		background: url('/assets/images/general/header-title-background_231f20.png') 50% 50% / cover no-repeat transparent;
		margin-bottom: 25px;
	}
		.header-title-content {
			display: flex;
			justify-content: left;
			align-items: center;
			height: 100%;
			padding: 0 10px;
			font-family: 'theme-font-bold';
			color: #FFFFFF;
		}
	
	.hero-image-container .hero-image-content a.two-colour-oval-button {
		width: 300px;
	}
				
				
/*===========================================
	PAGE HEADER CONTAINER
===========================================*/
.page-header-container {
	text-align: center;
	padding: 75px;
	background: #231f20;
}
	.page-header-container h1 {
		font-family: 'bebas-neue';
		font-size: 4em;
		color: #FFF;
	}
	.page-header-container h1 span {
		color: #00aeef;
	}
	
				
/*===========================================
	BOXED CONTENT
===========================================*/
.boxed-content {
	padding: 50px 30px;
	text-align: center;
}
	.boxed-content img {
		margin-bottom: 15px;
		text-align: center;
	}
	.boxed-content h4 {
		margin-bottom: 15px;
		text-align: center;
	}
	.boxed-content p {
		text-align: center;
	}
	
				
/*===========================================
	BREADCRUMB
===========================================*/
.breadcrumb-background {
	padding: 0px;
	width: 200px;
	height: 35px;
	display: block;
	visibility: visible; 
	background: url('/assets/images/general/header-title-background_00aeef.png') 100% 50% / cover no-repeat transparent;
	margin-bottom: 25px;
}
	.breadcrumb-background.wide {
		width: 250px;
	}
	.breadcrumb-content {
		display: flex;
		justify-content: left;
		align-items: center;
		height: 100%;
		padding: 0 10px;
		font-family: 'theme-font-bold';
		color: #FFF;
	}	


/*===========================================
	COUNTER BOX
===========================================*/
.counter-box {
	display: flex;
	flex-wrap: wrap;
}
	.counter-box .icon-holder {
		width: 100px;
		height: 100px;
		display: flex;
		justify-content: center;
		align-items: center;
		background: #FFF;
		border-radius: 30px 0px;
	}
	.counter-box .text-holder {
		width: calc(100% - 110px);
		margin-left: 10px;
	}
		.counter-box .text-holder h4 {
			color: #00aeef;
			margin: 0 10px 0 0;
		}
		.counter-box .text-holder p {
			color: #FFF;
			margin: 0 10px 0 0;
		}
			
	.who-we-serve .flex-container .one-half-flex {
		margin: 0 0 50px 0;
	}	
		.who-we-serve .flex-container .one-half-flex:nth-child(4),
		.who-we-serve .flex-container .one-half-flex:nth-child(5) {
			/*margin: 0;*/
		}
			

/*===========================================
	HOMEPAGE
===========================================*/
.our-services .flex-container .flex-one-third-margin,
.our-services .flex-container .flex-one-quarter-margin {
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	background: #FFF;
}
	.our-services .flex-container .flex-one-third-margin:hover,
	.our-services .flex-container .flex-one-quarter-margin:hover {
		box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.3);
		background: #F8F8F8;
	}


/*===========================================
	ABOUT
===========================================*/
.company-difference .boxed-content {
	padding: 50px 30px;
	text-align: center;
}
	.company-difference .boxed-content img {
		margin-bottom: 15px;
		text-align: center;
	}
	.company-difference .boxed-content p {
		text-align: left;
	}
	.company-difference .boxed-content ul,
	.company-difference .boxed-content ul li {
		text-align: left;
	}


/*===========================================
	SERVICES
===========================================*/
.our-services .boxed-content ul.fa-ul-centered {
	padding-bottom: 15px;
}
	.our-services .boxed-content ul.fa-ul-centered li:before {
		top: -2px;
		margin-left: -25px;
		font-size: 1.25em;
		font-family: font-awesome-solid;
		content: "\f138";
	}
	
	



/*===========================================
	TABLE LAYOUT
===========================================*/
table {
	border-collapse: collapse;
	padding: 5px;
	width: 100%;
}
	
	/*	TABLE HEADER	*/
	table th {
		border-bottom: 2px solid #00aeef;
		font-family: 'theme-font-bold';
		color: #FFF;
		padding: 10px 6px;
		text-align: left;
		vertical-align: middle;
	}		
	
	/*	TABLE ROWS	*/
	table tr {
		font-weight: normal;
		border-bottom: 1px solid #555;
	}	
	 
	
	/*	TABLE CELLS	*/
	table td {
		color: #FFF;
		padding: 6px 6px;
		vertical-align: middle;
	}
			
	/*	Font Awesome 	*/
	table td i {
		color: #00aeef;
		margin-right: 5px;
	}
	
	.DefaultTable td a i.fa-edit,
	.DefaultTable td i.fa-chevron-up {
		color: #70ad47;
	}





/*.captcha-information {
	
}
	.captcha-information .captcha-details {
		width: calc(100% - 510px);
		margin-right: 50px;
	}
		.captcha-information .captcha-details h2 {
			margin-bottom: 5px;
		}
		.captcha-information .captcha-details h5 {
			margin-bottom: 15px;
		}
	.captcha-information .captcha-form {
		width: 460px;
	}
		.captcha-information .captcha-form form {
			padding: 20px;
			border-radius: 10px;
			border: 2px solid #ccc;
		}
			.captcha-information .captcha-form form lable {
				color: #000;
				font-size: 1rem;
				display: block;
			}
			.captcha-information .captcha-form form input {
				color: #000;
				font-size: 1rem;
				display: block;
			}
			.captcha-information .captcha-form form a.two-colour-oval-button {
				margin-top: 20px;
			}
			

.options-at-glance {
}
	.options-at-glance h2 {
	}
	.options-at-glance .flex-container {
		margin-top: 50px;
	}
	.options-at-glance .two-colour-oval-button {
		max-width: 300px;
	}



.begin-your-journey .join-now {
	width: 250px;
	margin-right: 100px;
}
	.begin-your-journey .join-now p {
		padding-bottom: 5px;
	}
.begin-your-journey .bullet-list-items {
	width: calc(100% - 350px);
}

.begin-your-journey ul li {
	display: flex;
	margin-bottom: 30px;
}
	.begin-your-journey ul li:last-child {
		margin-bottom: 0;
	}
.begin-your-journey .number {
	width: 60px;
}
	.begin-your-journey .number span {
		width: 60px;
		height: 60px;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 1.2rem;
		color: #fff;
		background: #3b4856;
		border-radius: 100%;
		text-align: center;
	}
.begin-your-journey .item-description {
	width: calc(100% - 80px);
	margin-left: 20px;
}
	.begin-your-journey .item-description p {
		font-size: 1.25em;
		padding-bottom: 5px;
	}
	.begin-your-journey .item-description p.small-text {
		font-size: 0.8em;
		padding-bottom: 0;
	}


.diversify-your-portfolio .teak-background,
.diversify-your-portfolio .oxford-blue-background {
	color: #FFF;
}

.fscs-protection {
	text-align: center;
}
	.fscs-protection img {
		margin-bottom: 20px;
	}
	.fscs-protection h2 {
		text-align: left;
		margin-bottom: 20px;
	}*/


		

/*===========================================
	ARTICLE
===========================================*/
.article-display {
	
}	
	.article-display .article-date {
		color: #FFF;
	}
	.article-display .article-sub-header {
		font-size: 0.9em;
	}
	.article-display img {
		margin-bottom: 20px;
	}
	
	.article-display h1 {
		margin-bottom: 20px;
	}
	
	.article-display h5 {
		margin-bottom: 20px;
	}
	.article-display .article-sdate-published {
		margin-bottom: 20px;
	}
	.article-display ul {
		margin-left: 30px;
		list-style: none;
	}
		.article-display ul li {
			list-style-type: disc;
			padding-bottom: 1em;
		}



	/*
	<div class='article-header'>Are fixed-rate bonds safe, and how do high-interest savings accounts compare?</div>
				<div class='article-sub-header'>Fixed-rate bonds promise a predictable return for cautious investors, but how safe are they as an investment? In this article, learn how secure fixed-rate bonds are and how they compare to savings accounts.</div>
				<div class='article-sdate-published'>Date published: 30 January 2025</div>
	*/

/*===========================================
	ICONED ITEM
===========================================*/
.iconed-item {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 40px;
}
	.iconed-item .icon-display {
		width: 40px;
		margin-right: 10px;
	}
		.iconed-item .icon-display .lnrprm {
			font-size: 2em;
			color: #174e53;
		}
	.iconed-item .content-display {
		width: calc(100% - 50px);
	}
		.iconed-item .content-display h3 {
			color: #174e53;
			margin-bottom: 8px;
		}
		.iconed-item .content-display p {
			
		}
	

/*===========================================
	POLICY
===========================================*/
.policy {
	font-size: 1em;
}
	.policy h2 {
		font-size: 24px;
		line-height: 36px;
		margin-bottom: 0;
	}
	.policy ul {
		padding-bottom: 20px;
	}
		.policy ul li {
			font-family: 'theme-font-regular';
			padding: 0 0 0 1em;
			border-bottom: 0;
		}
			.policy ul li:last-child {
				padding-bottom: 0;
		}


/*===========================================
	FORM
===========================================*/
label {
	margin-top: 20px;
    margin-bottom: 6px;
    display: block;
    font-weight: normal;
    font-size: 1em;
}
	label span {
		color: #FF0000;
	}
	
input, select, textarea {
	width: 100%;
    padding: 6px 4px;
    margin: 2px 0 5px 0;
    min-height: 35px;
    box-sizing: border-box;
    border: 0;
    border: 1px solid #CCC;
	line-height: 24px;
    color: #555;
	background: #FFF;
	font-family: inherit;
    font-size: inherit;
    letter-spacing: normal;
   transition: border-color 0.2s ease;
	border-radius: 3px;
}
	input:focus, select:focus {
		border-color: #e2c487;
	}
	
/*textarea {
	font-family: inherit;
    font-size: inherit;
	height: 100px;
	line-height: 24px;
	background: #f6f6f6;
	border: 0;
    border-bottom: 2px solid #e0e0e0;
	resize: none;
}
	textarea:focus {
		border-bottom: 2px solid #103556;
	}*/
	input.validate-error,
	textarea.validate-error {
		border-color: #FF0000;
	}
	
.send-message-button {
	display: inline-block;
	padding: 8px 20px;
    background: #174e53;
    opacity: 1;
    border-radius: 5px;
    color: #FFF;
	margin-top: 20px;
	cursor: pointer;
}	
	.send-message-button:hover {
		background: #144448;
	}
			

/*===========================================
	RATES TABLE
===========================================*/
.table-container {
	padding: 20px;
	margin-bottom: 50px;
}
	.table-container .saving-rates {
		background: #FFF;
		margin-bottom: 20px;
	}
		.table-container .saving-rates:last-child {
			margin-bottom: 0;
		}
		.table-container .term-header {
			position: relative;
			width: 40px;
			background: #3b4856;
			color: #ad9067;
		}
			.table-container .term-header span {
				text-transform: uppercase;
				transform: rotate(270deg);
				position: absolute;
				bottom: 40%;
				left: 5px;
			}
		.table-container .investment,
		.table-container .coupon,
		.table-container .interest {
			width: calc(33.33% - 100px);
			font-weight: 600;
			font-size: 2rem;
			background: #FFF;
			border-right: 1px solid #DEDEDE;
			margin: 10px 0;
			padding: 10px 30px;
		}
			.table-container .interest {
				border-right: 0;
			}
			.table-container lable {
				display: block;
				font-size: 10px;
			}
		
		.table-container .fscs-logo {
			width: 50px;
		}
			

/*===========================================
	RESPONSIVE RATES
===========================================*/
.display-responsive-saving-rates {
	display: none;
}

.responsive-saving-rates {
	background: #FFF;
	margin-bottom: 20px;
}
	.responsive-saving-rates .responsive-term-header {
		position: relative;
		background: #3b4856;
		color: #ad9067;
		padding: 10px;
		text-align: center;
		text-transform: uppercase;
	}
	.responsive-saving-rates .responsive-investment,
	.responsive-saving-rates .responsive-coupon,
	.responsive-saving-rates .responsive-interest {
		color: #3b4856;
		padding: 10px;
		font-weight: 600;
		font-size: 1.25rem;
	}
	
	.responsive-saving-rates .responsive-interest {
		width: calc(100% - 90px);
		margin-right: 10px;
	}
	.responsive-saving-rates .responsive-fscs-logo {
		width: 50px;
	}



/*===========================================
	FOOTER
===========================================*/
.footer {
	background: #231f20;
	padding: 25px 0 25px 0;
}
	.footer p,
	.footer li,
	.footer li a {
		color: #FFF;
		text-align: left;
		text-decoration: none;
	}
	.footer li a:hover {
		color: #00aeef;
	}
	.footer h2 {
		font-size: 1.25em;
		margin-bottom: 10px;
		color: #00aeef;
		text-align: left;
	}
	.footer h4 {
		font-size: 1.5625rem;
		font-weight: 500;
		margin-bottom: 2rem;
		line-height: 1.2;
	}
	
	.footer .branding img {
		width: 250px;
		padding-bottom: 30px;
	}
	.footer .branding p {
		padding-right: 30px;
	}
	
	.footer .contact-disclaimer {
		border-top: 1px solid #00aeef;
		padding-top: 20px;
	}
		.footer .contact-disclaimer p {
			font-size: 0.7em;
			line-height: 1.35em;
			padding-bottom: 0.7em;
			text-align: left;
			color: #CCC;
		}		
			.footer .contact-disclaimer p:last-child {
				padding-bottom: 0;
		}


/*===========================================
	MAIN NAVIGATION
===========================================*/
.main-navigation {
	width: calc(100% - 540px);
	margin-right: 20px;
}


/*===========================================
	HEADER BUTTONS
===========================================*/
.header-buttons {
	width: 250px;
	display: flex;
	justify-content: right;
	align-items: center;
}
	.header-buttons ul {
		text-align: right;
		z-index: 99998;
	}
		.header-buttons li {
			display: inline-block;
			background: none;
			margin-right: 10px;
		}
		.header-buttons li:last-child {
			margin-right: 0;
		}
			
			.header-buttons li a {
				display: block;
				font-size: 1em;
				text-transform: uppercase;
				text-decoration: none;
			}
				.header-buttons li a.client-login {
					padding: 12px 30px;
					opacity: 1;
					border-radius: 5px;
					color: #FFF;
					text-decoration: none;
				}


/*===========================================
	NAVIGATION
===========================================*/
.navigation-bar {
	
}	
.navigation {
	height: 65px;
	display: flex;
	justify-content: center;
	align-items: center;
}
	.navigation ul {
		text-align: center;
		list-style: inside;
		z-index: 99998;
	}
		.navigation li {
			display: inline-block;
			background: none;
		}
			.navigation li a {
				display: block;
				font-size: 16px;
				line-height: 65px;
				color: #000;
				text-decoration: none;
				padding: 0 20px;
			}
				.navigation li a:hover  {
					color: #ad9067;
				}
				
				.navigation li a i  {
					padding-left: 8px;
					font-size: 10px;
				}

				.navigation li.current a {
					opacity: 1;
				}


/*===========================================
	SUB navigation
===========================================*/
/* Doesn't work in IE */
.navigation ul li:hover { 
	position: relative; 
}

/*	LEVEL TWO	*/
.navigation ul ul { 
	width: 235px;
	padding: 0;
	visibility: hidden; 
	position: absolute; 
	top: 100%;
	left: 0;
	margin: 0;
	background: #FFF;
	border: 1px solid #CCC;
	text-align: left;
	border-radius: 5px;
}
	.navigation ul ul li {
		width: 100%;
		display: block;
		font-weight: normal;
		border: none;
		padding: 0;
		border-radius: 0px;
		line-height: 1em;
		font-size: 1em;
		color: #000;
	}
		.navigation ul ul li:first-child  {
			border-left: 0;					
		}
		.navigation ul ul li:Last-child {
			float: left;
			padding: 0px;
		}
		
		.navigation ul ul li a {
			display: block;
			border: none;
			padding: 8px 10px;
			margin-right: 0px;
			line-height: 1.45em;
		}
			.navigation ul li:hover li a, 
			.navigation ul li.current li a {
				color: #000;
			}
			.navigation ul ul li a:hover {
				text-decoration: none;
				transition: background-color 0.3s linear;
				-webkit-transition: background-color 0.3s linear;
				-moz-transition: background-color 0.3s linear;
				background: #DEDEDE;
			}
			.navigation ul ul li.current a {
				background: none;
			}
			
		.navigation ul ul li.IndentItem a {
			padding: 5px 10px 5px 20px;
		}
			.navigation ul ul li.IndentItem a i {
				padding-right: 8px;
				color: #19bfc0;
			}
			
	/*	LEVEL THREE	*/
	.navigation ul ul ul { 
		left: 100%; 
		top: 0; 
	}
	.navigation ul li:hover > ul { 
		visibility: visible; 
	}
	


/*===========================================
	RESPONSIVE NAVIGATION
===========================================*/
.responsive-navigation {
	display: none;
	margin: 0;
	padding: 0;
	border: 0;
	list-style: none;
	line-height: 1;
	position: relative;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.responsive-navigation ul, .responsive-navigation ul li, .responsive-navigation ul li a {
	margin: 0;
	padding: 0;
	border: 0;
	list-style: none;
	line-height: 1;
	display: block;
	position: relative;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.responsive-navigation {
	width: 100%;
	color: #ffffff;;
}
.responsive-navigation ul ul {
	display: none;
}
.align-right {
	float: right;
}
.responsive-navigation > ul > li > a {
	padding: 15px 20px;
	cursor: pointer;
	z-index: 2;
	font-size: 14px;
	font-weight: normal;
	text-decoration: none;
	color: #ffffff;
}
.responsive-navigation > ul > li > a:hover, .responsive-navigation > ul > li.active > a, .responsive-navigation > ul > li.open > a {
	color: #FFF;
	background: #00aeef;
}
.responsive-navigation > ul > li.open > a {

}
.responsive-navigation > ul > li:last-child > a, .responsive-navigation > ul > li.last > a {

}
.holder {
	width: 0;
	height: 0;
	position: absolute;
	top: 0;
	right: 0;
}
.holder::after, .holder::before {
	display: block;
	position: absolute;
	content: "";
	width: 6px;
	height: 6px;
	right: 20px;
	z-index: 10;
	-webkit-transform: rotate(-135deg);
	-moz-transform: rotate(-135deg);
	-ms-transform: rotate(-135deg);
	-o-transform: rotate(-135deg);
	transform: rotate(-135deg);
}
.holder::after {
	top: 17px;
	border-top: 2px solid #ffffff;
	border-left: 2px solid #ffffff;
}
.responsive-navigation > ul > li > a:hover > span::after, .responsive-navigation > ul > li.active > a > span::after, .responsive-navigation > ul > li.open > a > span::after {
	border-color: #FFF;
}
.holder::before {
	top: 18px;
	border-top: 2px solid;
	border-left: 2px solid;
	border-top-color: inherit;
	border-left-color: inherit;
}
.responsive-navigation ul ul li a {
	cursor: pointer;
	padding: 10px 20px;
	z-index: 1;
	text-decoration: none;
	font-size: 13px;
	font-weight: normal;
	color: #0e2338;
	background: #e5e5e5;
	border-top: 1px solid #FFF;
}
.responsive-navigation ul ul li:hover > a, .responsive-navigation ul ul li.open > a, .responsive-navigation ul ul li.active > a {
	background: #231f20;
	color: #FFF;
	transition: background-color 0.3s linear;
	-webkit-transition: background-color 0.3s linear;
	-moz-transition: background-color 0.3s linear;
}
.responsive-navigation ul ul li:first-child > a {
	box-shadow: none;
}
.responsive-navigation ul ul ul li:first-child > a {
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.responsive-navigation ul ul ul li a {
	padding-left: 30px;
}
.responsive-navigation > ul > li > ul > li:last-child > a, .responsive-navigation > ul > li > ul > li.last > a {
	border-bottom: 0;
}
.responsive-navigation > ul > li > ul > li.open:last-child > a, .responsive-navigation > ul > li > ul > li.last.open > a {
	border-bottom: 1px solid #32373e;
}
.responsive-navigation > ul > li > ul > li.open:last-child > ul > li:last-child > a {
	border-bottom: 0;
}
.responsive-navigation ul ul li.has-sub > a::after {
	display: block;
	position: absolute;
	content: "";
	width: 5px;
	height: 5px;
	right: 20px;
	z-index: 10;
	top: 11.5px;
	border-top: 2px solid #0e2338;
	border-left: 2px solid #0e2338;
	-webkit-transform: rotate(-135deg);
	-moz-transform: rotate(-135deg);
	-ms-transform: rotate(-135deg);
	-o-transform: rotate(-135deg);
	transform: rotate(-135deg);
}
.responsive-navigation ul ul li.active > a::after, .responsive-navigation ul ul li.open > a::after, .responsive-navigation ul ul li > a:hover::after {
	border-color: #ffffff;
}


/*===========================================
	MODAL POPUP
===========================================*/
.modal-popup {
	z-index: 99999;
	position: fixed;
	left: 0;
	right: 0%;
	width: 100%;
	height: 100%;
	display: block;
	background-color: rgba(0, 0, 0, 0.7);
}

	.modal-popup .modal-banner-popup {
		position: fixed;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: 572px;
		padding: 30px;
		display: block;
		align-items: center;
		justify-content: space-between;
		background-color: #FFF;
		border-radius: 8px;
		box-shadow: 0 16px 32px 0 rgba(27, 7, 58, .1);
	}
		.modal-popup .modal-banner-popup h2 {
			font-family: 'theme-font-regular';
			color: #1b073a;
			margin-bottom: 30px;
		}
		.modal-popup .modal-banner-popup p {
			color: #222;
		}
		
		.modal-popup .modal-banner-popup .button-holder {
			display: -webkit-flex;
			display: flex;
			-webkit-justify-content: space-between;
			justify-content: space-between;
			
			border-bottom: 1px solid #d6d6d6;
			padding-bottom: 32px;
			margin-bottom: 32px;
		}
		
			.modal-popup .modal-banner-popup .button-holder a {
				display: inline-block;
				color: #174e53;
				border: 1px solid #174e53;
				background: #FFF;
				padding: 5px 20px;
				border-radius: 4px;
				transition: all .3s;
				text-decoration: none;
			}
				.modal-popup .modal-banner-popup .button-holder a:hover {
					color: #FFF;
					background: #389755;
					border: 1px solid #389755;
					
				}
				
				.modal-popup .modal-banner-popup .button-holder a.active {
					color: #FFF;
					background: #174e53;
				}
					.modal-popup .modal-banner-popup .button-holder a.active:hover {
						color: #FFF;
						background: #123a3e;
						border: 1px solid #123a3e;
					}
		
		.modal-popup .modal-banner-popup .footer-button {
			text-align: center;
		}
			.modal-popup .modal-banner-popup .footer-button a {
				color: #222;
				text-decoration: underline;
			}