/*
	(c)2020 - visuallizard.com

	Base Styles
*/


/*
	COLOURS:
		#ffd41c		yellow light 	[buttons]
		#001135		navy 			[nav links]
		#f2f2f2		grey 			[nav hover bg, form inputs]

	FONTS:
		[Proxima Nova: "proxima-nova"]
		Thin 		100
		Light 		300		kit
		Regular 	400 	kit
		Medium 		500
		Semibold 	600 			*use bold instead*
		Bold 		700 	kit
		Extrabold 	800		kit		used [nav, buttons ]
		Black 		900
*/

	::-moz-selection {
		background: #c0c0c0;
		text-shadow: none;
	}
	::selection {
		background: #c0c0c0;
		text-shadow: none;
	}

	html {
		box-sizing: border-box;
		font-size: 100%;
		overflow-y: scroll;
		-webkit-text-size-adjust: 100%;
		-ms-text-size-adjust: 100%;
		height: 100%;
		scroll-behavior: smooth;
	}
	body {
		font: 400 16px/1.5 'Helvetica Neue', sans-serif;
		color: #333;

		position: relative;
		min-height: 100%;
		margin: 0;
	}
	@supports (display:flex) {
		body {
			display: flex;
			flex-direction: column;
		}
		main {
			flex-grow: 1;
		}
	}


	*, *:before, *:after {
		box-sizing: inherit;
	}


/* !Typography ============================== */
	h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
		font-weight: 400;
		margin-top: .5em;
	}
	h1 a, .h1 a, h2 a, .h2 a, h3 a, .h3 a, h4 a, .h4 a, h5 a, .h5 a, h6 a, .h6 a {
		font-weight: inherit;
/* 		color: inherit; */
		text-decoration: none;
	}

	h1, .h1 { font-size: 3.00em; line-height: 1.0; margin-bottom: .5em; }
	h2, .h2 { font-size: 2.50em; line-height: 1.3; margin-bottom: .5em; font-weight: normal; }
	h3, .h3 { font-size: 1.25em; line-height: 1.3; margin-bottom: .25em; margin-top: 1rem; }
	h4, .h4 { font-size: 1.20em; line-height: 1.3; margin-bottom: 0; font-weight: bold;}
	h5, .h5 { font-size: 1.00em; line-height: 1.3; }
	h6, .h6 { font-size: 1.00em; line-height: 1.3; }

	h2 + h3 {
		margin-top: -.5em;
	}

	p { margin: 0 0 1em 0; }
	main img { margin: 0; max-width: 100%; height: auto !important; }
	p.lead { font-size: 21px; line-height: 1.25;  }

	i, em { font-style: italic; }
	b, strong { font-weight: bold; }
	small { font-size: 80%; }

/*	Blockquotes  */
	blockquote { font-size: 1.2em; color: #001135; margin: 1em 0; }
	blockquote cite { display: block; font-size: 1em; text-align: right;}
	blockquote cite:before { content: "\2014 \0020"; }
	blockquote cite a, blockquote cite a:visited, blockquote cite a:visited { color: #666; }



/* !Links */
	a		{ color: #001135; outline: 0; text-decoration: underline; text-decoration-color: #ffd41c; /* text-decoration-style: double; */ }
	a:hover	{ color: #001135; outline: 0; text-decoration: none; background-color: #ffd41c; }
	a:focus	{ color: #000; outline: thin dotted; }
	a:active { outline: 0; }

	p a { line-height: inherit; }


/* !Lists */
	ul, ol { margin: 0 0 1em 1em; padding-left: 2rem; }
	ul ul, ul ol, ol ol, ol ul { margin-bottom: 0; }
	ul ul { list-style: circle; }
	ul { list-style: disc; }
	ol { list-style: decimal; }
	li { line-height: inherit; }
	ul.unstyled { list-style: none; margin-left: 0; }


	dl { margin-bottom: 1em; }
	dl dt, dl dd { line-height: inherit; }
	dl dt { font-weight: bold; }
	dl dd { margin-left: 1em; }

	dd:after {
		/* http://lea.verou.me/2012/02/flexible-multiline-definition-lists-with-2-lines-of-css/ */
		content: '\D\A';
		white-space: pre;
	}

/* !Images */
	img {
		border: 0;
		-ms-interpolation-mode: bicubic;
	}
	img.scale-with-grid {
		max-width: 100%;
		height: auto;
	}
	.img_left {
		float: left;
		margin: 0 2em 2em 0;
	}
	.img_right {
		float: right;
		margin: 0 0 2em 2em;
	}

	.svg-icon,
	.icon-svg,
	svg.icon {
		width: 100%;
		height: 100%;
	}
	i.icon {
		width: 1em;
		height: 1em;
		display: inline-block;
		vertical-align: middle;
	}

	figure { margin: 0; }

/* !Other */
	code, pre {
		padding: 0 3px 2px;
		font-family: Monaco, Andale Mono, Courier New, monospace;
		font-size: 12px;
		border-radius: 3px;
		border: 1px solid rgba(0, 0, 0, 0.15);
	}
	code {
		background-color: #eee;
		color: rgba(0, 0, 0, 0.75);
		padding: 1px 3px;
	}
	pre {
		background-color: #f5f5f5;
		display: block;
		padding: 8.5px;

		border: 1px solid #ddd;
		white-space: pre;
		white-space: pre-wrap;
		word-wrap: break-word;
	}

	hr {
		clear: both;
		height: 0;
		margin: 1em 0;
		border: 0;
		border-bottom: 1px solid #ddd;
	}

	address {
		display: block;
		line-height: 18px;
		margin-bottom: 18px;
	}

	.lower { text-transform: lowercase; }
	.upper { text-transform: uppercase; }


	sub, sup {
		/* Specified in % so that the sup/sup is the
		 right size relative to the surrounding text */
		font-size: 75%;

		/* Zero out the line-height so that it doesn't
		 interfere with the positioning that follows */
		line-height: 0;

		/* Where the magic happens: makes all browsers position
		 the sup/sup properly, relative to the surrounding text */
		position: relative;

		/* Note that if you're using Eric Meyer's reset.css, this
		 is already set and you can remove this rule */
		vertical-align: baseline;
	}
	sup {
		/* Move the superscripted text up */
		top: -0.5em;
	}
	sub {
		/* Move the subscripted text down, but only
		 half as far down as the superscript moved up */
		bottom: -0.25em;
	}

/* ! Helper classes  */
	.hidden {
		display: none !important;
		visibility: hidden;
	}
	.visuallyhidden {
		border: 0;
		clip: rect(0 0 0 0);
		height: 1px;
		margin: -1px;
		overflow: hidden;
		padding: 0;
		position: absolute;
		width: 1px;
	}
	.visuallyhidden.focusable:active,
	.visuallyhidden.focusable:focus {
		clip: auto;
		height: auto;
		margin: 0;
		overflow: visible;
		position: static;
		width: auto;
	}
	.invisible {
		visibility: hidden;
	}
	.clearfix:after {
		content: "";
		display: table;
		clear: both;
	}


/* ! Buttons ============================== */
	button,
	.button {
		display: inline-block;
		vertical-align: middle;
		padding: .9em 1em .8em;
		padding: .5em .75em .3em;

		color: #001135;
		background-color: ;
		background-color: #ffd41c;
		background-repeat: no-repeat;
		background-repeat: repeat-x;
		background-origin: border-box;

		text-align: center;
		text-decoration: none;
		text-transform: uppercase;
		letter-spacing: 0.01em;

/* 		font-family:  sans-serif; */
		font-size: 14px;
		font-weight: 600;
		line-height: 1;

		border: 1px solid    rgba(0, 0, 0, .05);
		border-bottom-color: rgba(0, 0, 0, .07);
/* 		border-radius: 2px; */

		-webkit-appearance: none;
		   -moz-appearance: none;
		        appearance: none;

		cursor: pointer;
		transition: 0.1s linear all;

		min-height: 32px;
	}
	button:hover,
	.button:hover {
		background-color: #001135;
		color: #fff;
		text-decoration: none;
	}
	button:active,
	.button:active,
	.button.active {
		border-color: #b3d4fc;
	}
	button:focus,
	.button:focus {
		outline: 1px dotted #666;
		outline-offset: 1px;
	}
	button.disabled,
	button[disabled],
	.button.disabled,
	.button[disabled] {
		cursor: default;
		background-image: none;
		opacity: 0.65;
		box-shadow: none;
	}

/* ! FORMS ============================== */
	form {
		margin-bottom: 2em;
	}
	fieldset {
		margin-bottom: 2em;
	}
	label {
		display: block;
/* 		margin-bottom: .5rem; */
		font-size: .875rem;
		font-weight: 400;
	}

	.required > label:after {
		content: " *";
	}
	form .error-message {
		font-size: 75%;
		padding: .5em .5em .4em;
	}

	input,
	select,
	textarea {
		display: inline-block;
		vertical-align: middle;
		border: 1px solid rgba(0,17,53, .1);
		padding: .3em .5em .3em;
/* 		outline: none; */
		border-radius: 0;
		font: 400 16px/1.25 "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
		color: #666;
		color: #000;
		margin: 0;
		max-width: 100%;
		min-width: 80px; /* ensure the input fields (such as with class .w5) are not too small when on narrow breakpoints  */
		background: #f2f2f2;
		background: rgba(0,17,53, .075);
/* 		-webkit-appearance: none; */
	}
	input:focus,
	select:focus,
	textarea:focus {
		border-color: rgba(0,17,53, .5);
	}
	input[disabled],
	select[disabled],
	textarea[disabled] {
		cursor: default;
		background-image: none;
		opacity: 0.5;
		box-shadow: none;
	}

	[type="checkbox"],
	[type="radio"] {
		margin-right: 0.5em;
	}
	select {
		/* padding: initial; */

		/* for custom selects: */
/* 		padding: .4em .5em .45em; */
		padding-right: 1.5em;
/* 		border-radius: 2px; */
		min-width: 10em;

		-webkit-appearance: none;
		   -moz-appearance: none;
		        appearance: none;

/* 		background-color: #f2f2f2; */
		background-repeat: no-repeat;
		background-size: auto 35%;
		background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpolygon fill='%23001135' points='0,10 50,90 100,10'/%3E%3C/svg%3E");
		background-position: 95% center;
		background-position: right .5em top 55%;

		cursor: pointer;
	}

	[class^='input-'] {
		margin-bottom: 1rem;
	}

	[type="checkbox"],
	[type="radio"] {
		width: 1.5rem;
		height: 1.5rem;
		min-width: 0;
		padding: 0;
		margin: 2px 5px 0 0;

		line-height: initial;
/* 		border: none; */
		display: inline-block;
		vertical-align: text-top;
	}
	.input-checkbox label,
	.input-radio    label {
		margin-right: 1em;
		display: inline-block;
		vertical-align: text-top;
		max-width: 90%; /*  to avoid dropping into new lines on narrow breakpoints. */
		font-weight: normal;
	}

	/* 	Multiple sets */
	.fm-checkbox > label:first-child,
	.fm-radio > label:first-child {
		display: block;
		font-weight: bolder;
	}

	.input-check-option,
	.input-radio-option {
		display: block;
		margin-bottom: 0;

		/* Spread options into three columns */
		display: inline-block;
		vertical-align: text-top;
		width: 33%;
		min-width: 200px;
	}
	.input-check-option input,
	.input-radio-option input {
		float: left;
	}
	.input-check-option label,
	.input-radio-option label {
		display: block;
		margin: 0 1.5em;
		font-weight: normal;
	}


	/* 	Form Module Block */
	.form-block {
		max-width: 600px;
	}
	.form-block [type="text"],
	.form-block [type="password"],
	.form-block [type="email"],
	.form-block [type="url"],
	.form-block select,
	.form-block textarea {
		width: 100%;
	}

	.g-recaptcha {
		margin-bottom: 1rem;
	}

/* ! Content module columns */
	.cke > .c2,
	.cke > .c3,
	.cke > .c4,
	.cke > .c5,
	.cke > .c6 { float: left;            margin-left: 2%; }

	.cke > .c2 { width: 49%;   width: calc((100% - (2% * 1)) / 2); }
	.cke > .c3 { width: 32%;   width: calc((100% - (2% * 2)) / 3); }
	.cke > .c4 { width: 23.5%; width: calc((100% - (2% * 3)) / 4); }
	.cke > .c5 { width: 18.4%; width: calc((100% - (2% * 4)) / 5); }
	.cke > .c6 { width: 15%;   width: calc((100% - (2% * 5)) / 6); }

	.cke > .c1,
	.cke > .c-first {
		clear: both;
		margin-left: 0;
	}

/* ! CSS columns */
	.columns-2 { columns: 2 500px; column-gap: 3em; }
	.columns-3 { columns: 3 250px; column-gap: 3em; }
	.columns-4 { columns: 4 250px; column-gap: 3em; }


.center {
		text-align: center;
		max-width: 600px;
		margin-left: auto;
		margin-right: auto;
	}

	.flex-cols {
		display: flex;
		flex-direction: row;
	}
	.flex-cols .main {
		margin-right: 5%;
	}
	.flex-cols .main + div {
		min-width: 200px;
	}


/* ! Pagination Links */
.pagination-links {
	list-style: none;
	text-align: center;
	margin: 2em auto;
	padding: 0;
	position: relative;
	z-index: 1;
}
	.pagination-links > li {
		display: inline-block;
	}
	.pagination-links > li + li  {
		margin-left: .25em;
	}
	.pagination-links > li > a {
		display: block;
		padding: .5em .5em .5em;
		border: 1px solid;
		border-color: currentColor;
		min-width: 2.5em;

		text-decoration: none;
		font-weight: bold;
		text-align: center;
		font-size: .75rem;
		letter-spacing: .05em;
		line-height: 1;
		color: inherit;
	}
	.pagination-links > li:hover > a {
		color: #001135;
		border-color: currentColor;
	}
	.pagination-links > li.active > a {
		color: #001135;
		border-color: currentColor;
		background-color: #eee;
	}
	.pagination-links > li.disabled > a {
		pointer-events: none;
		color: inherit;
		opacity: .75;
		border-color: currentColor;
	}



/* ! Slick Slider default styles ============================== */
	.slick-slider {
		position: relative;
		display: block;
		-moz-box-sizing: border-box;
			 box-sizing: border-box;

		-webkit-user-select: none;
		   -moz-user-select: none;
			-ms-user-select: none;
				user-select: none;

		-webkit-touch-callout: none;
		-khtml-user-select: none;
		-ms-touch-action: pan-y;
			touch-action: pan-y;
		-webkit-tap-highlight-color: transparent;
	}
	.slick-list {
		position: relative;
		display: block;
		overflow: hidden;
		margin: 0;
		padding: 0;
	}
	.slick-list:focus {
		outline: none;
	}
	.slick-list.dragging {
		cursor: pointer;
		cursor: hand;
	}
	.slick-slider .slick-track,
	.slick-slider .slick-list {
/*
		-webkit-transform: translate3d(0, 0, 0);
		   -moz-transform: translate3d(0, 0, 0);
			-ms-transform: translate3d(0, 0, 0);
			 -o-transform: translate3d(0, 0, 0);
				transform: translate3d(0, 0, 0);
*/
	}
	.slick-track {
		position: relative;
		top: 0;
		left: 0;
		display: block;
		margin-left: auto;
		margin-right: auto;
	}
	.slick-track:before,
	.slick-track:after {
		display: table;
		content: '';
	}
	.slick-track:after {
		clear: both;
	}
	.slick-loading .slick-track {
		visibility: hidden;
	}
	.slick-slide {
		display: none;
		float: left;

		height: 100%;
		min-height: 1px;
	}
	[dir="rtl"] .slick-slide {
		float: right;
	}
	.slick-slide img {
		display: block;
	}
	.slick-slide.slick-loading img {
		display: none;
	}
	.slick-slide.dragging img {
		pointer-events: none;
	}
	.slick-initialized .slick-slide {
		display: block;
	}
	.slick-loading .slick-slide {
		visibility: hidden;
	}
	.slick-vertical .slick-slide {
		display: block;
		height: auto;
		border: 1px solid transparent;
	}
	.slick-arrow.slick-hidden {
		display: none;
	}

	/* Slick Slider additional project specific styles */
	.slick-arrow {
		position: absolute;
		top: 50%;
		width: 50px;
		height: 50px;
		padding: 10px;
		min-width: 0;
		transform: translateY(-50%);
		text-indent: -20em;
		overflow: hidden;
		border: none;
		color: #eee;
		background-color: rgba(255,255,255,0);
		background-position: center center;
		background-repeat: no-repeat;
		background-size: 20% auto;
		transition: all .2s;
		opacity: .75;
		cursor: pointer;
		z-index: 100;
	}
	.slick-arrow:hover {
		background-color: rgba(255,255,255,.5);
		background-position: center center;
	}
	.slick-prev { left: 0;  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 100"><polygon fill="%23ffffff" points="50,14.4 14.4,50 50,85.6 50,100 0,50 0,50 50,0"/></svg>'); }
	.slick-next { right: 0; background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 100"><polygon fill="%23ffffff" points="0,14.4 35.6,50 0,85.6 0,100 50,50 50,50 0,0"/></svg>'); }
	.slick-disabled { opacity: 0; }
	/* Banner dots */
	.slick-dots {
		list-style: none;
		position: absolute;
		bottom: 5%;
		margin: 0 auto;
		text-align: center;
		width: 100%;
		left: 0; right: 0;
		line-height: 1;
	}
		.slick-dots > li {
			display: inline-block;
			margin: 0 .25em;
			text-align: center;
		}
		.slick-dots > li > button {
			display: block;
			border: 1px solid rgba(255, 255, 255, .75);
			border-radius: 100%;
			background: none;
			text-indent: -10em;
			overflow: hidden;
			margin: 0;
			padding: 0;
			width: 15px;
			height: 15px;
			min-width: 0;
			cursor: pointer;
		}
		.slick-dots > li:hover > button,
		.slick-dots > li.slick-active > button {
			background-color: rgba(255, 255, 255, .75);
		}

/* ! Cards items */
	.cards {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
		width: 103%;
		margin: 1em -1.5% 0;
		padding: 0;
		list-style-type: none;
	}
	.card {
		width: 30%;
		margin: .8em 1.5%;
		padding: 0 1em 1em;
		background-color: white;
		box-shadow: 0 0 2px 2px rgba(0,0,0,0.05);

		display: flex;
		flex-direction: column;
	}
		.card .more {
			margin-top: auto; /* to push item to the end of flex axis */
			margin-bottom: 0;
			flex-grow: 0;
		}
	.card-img {
		display: block;
		width: 100%;
		margin: 0;
		transition: all .5s ease;
	}
	.card-link {
		display: block;
		width: calc(100% + 2em);
		margin: 0 -1em 1em;
		overflow: hidden;
	}
	.card-link:hover .card-img {
		transform: scale(1.1);
	}

	/* 	for 4, 8, 12, 4n… */
	.card:nth-last-child(2):first-child,
	.card:nth-last-child(2):first-child ~ .card,
	.card:nth-last-child(4n):first-child,
	.card:nth-last-child(4n):first-child ~ .card {
		width: 45%;
		margin-left: 2%;
		margin-right: 2%;
	}


/* !Tables  ============================== */
	.table-wrap {
		max-width: 100%;
		overflow-x: auto;
		-ms-overflow-style: none;
	}
	table {
		width: 100%;
		margin-bottom: 1rem;
		padding: 0;
		font-size: 14px;
		border-collapse: collapse;
	}
	table.fixed {
		table-layout: fixed;
	}
	table th,
	table td {
		padding: 10px 10px 9px;
		line-height: 18px;
		text-align: left;
	}
	table th {
		padding-top: 9px;
		font-weight: bold;
		vertical-align: middle;
	}
	table td {
		vertical-align: top;
		border-top: 1px solid #ddd;
	}
	table tbody th {
		border-top: 1px solid #ddd;
		vertical-align: top;
	}

	/* 	table types: .condensed-table  and .bordered-table */
	.condensed th,
	.condensed td {
		padding: 5px 5px 4px;
	}
	.bordered {
		border: 1px solid #ddd;
		border-collapse: separate;
		border-radius: 4px;
	}
	.bordered th + th,
	.bordered-table td + td,
	.bordered th + td {
		border-left: 1px solid #ddd;
	}
	.bordered thead tr:first-child th:first-child,
	.bordered tbody tr:first-child td:first-child {
		border-radius: 4px 0 0 0;
	}
	.bordered thead tr:first-child th:last-child,
	.bordered tbody tr:first-child td:last-child {
		border-radius: 0 4px 0 0;
	}
	.bordered tbody tr:last-child td:first-child {
		border-radius: 0 0 0 4px;
	}
	.bordered tbody tr:last-child td:last-child {
		border-radius: 0 0 4px 0;
	}


/* !Error, Warning and Success messages ============== */
	.message,
	.error-message,
	.warning-message,
	.notice-message,
	.success-message {
		position: relative;
        padding: .5em 1em .4em;
        margin: 1rem 0;
        font-size: 16px;
        letter-spacing: 0.01em;
        border-left: 6px solid currentColor;
	}
		.error-message   *:last-child,
		.warning-message *:last-child,
		.notice-message  *:last-child,
		.success-message *:last-child {
			margin-bottom: 0;
		}
		.message a,
		.error-message a,
		.warning-message a,
		.notice-message a,
		.success-message a {
			color: inherit;
		}
	.error-message,
	.error.message {	/* RED */
		background-color: #fcc;
		color: #900;
	}
	.warning-message,
	.warning.message {	/* YELLOW */
		background-color: #fff3cd;
		color: #856404;
	}
	.notice-message,
	.notice.message {	/* BLUE */
		background-color: #cef;
		color: #069;

		background-color: #001135;
		color: #fff;
		border-color: #ffd41c;
	}
	.success-message,
	.success.message {	/* GREEN */
		background-color: #cfc;
		color: #393;
	}

	td.error {
		color: #900;
	}

	/* Modifier classes (should always be the last) */
.w5   { width: 5%;  }
.w10  { width: 10%; }
.w15  { width: 15%; }
.w20  { width: 20%; }
.w25  { width: 25%; }
.w30  { width: 30%; }
.w33  { width: 33.33%; }
.w35  { width: 35%; }
.w40  { width: 40%; }
.w45  { width: 45%; }
.w50  { width: 50%; }
.w55  { width: 55%; }
.w60  { width: 60%; }
.w65  { width: 65%; }
.w66  { width: 66.66%; }
.w70  { width: 70%; }
.w75  { width: 75%; }
.w80  { width: 80%; }
.w85  { width: 85%; }
.w90  { width: 90%; }
.w95  { width: 95%; }
.w100 { width: 100%; }

.wgrow   { width: 0; flex-grow: 1; }
.wgrow-2 { width: 0; flex-grow: 2; }

.o0  { opacity: 0;   }
.o10 { opacity: 0.1; }
.o20 { opacity: 0.2; }
.o30 { opacity: 0.3; }
.o40 { opacity: 0.4; }
.o50 { opacity: 0.5; }
.o60 { opacity: 0.6; }
.o70 { opacity: 0.7; }
.o80 { opacity: 0.8; }
.o90 { opacity: 0.9; }
.o100 { opacity: 1.0; }

.v-center,
.v-centre {
	display: flex;
	flex-direction: column;
	justify-content: center;
}



	body::before {
		position: fixed;
		top: -99px;
		display: inline-block;
		padding: 0 .5em;
		color: #ccc;
		background: #333;
		z-index: 1000;
		font-size: 10px;
	}
