/* This directive will remain on the element until the associated Vue instance finishes compilation. */
/* Combined with CSS rules such as [v-cloak] { display: none }, this directive can be used to hide un-compiled mustache bindings until the Vue instance is ready. */
[v-cloak] > * { display:none !important;}
[v-cloak]::before { content: "Loading…" !important; }

.small-text {
	font-size: 0.8em !important;
}

h1, h2, h3, h4, h5, h6 {
	color: #13324d;
	line-height: 1.8;
}

.noc-title {
	color: #13324d !important;
	line-height: 1.8;
}

/* override default link colour */
a {
	color: #4db3e6;
	transition: color 0.2s;
}

a:hover {
	color: #7ac6ec;
	transition: color 0.2s;
}

li {
	line-height: 1.8 !important;
}

/* this style hides any form inputs generated by django. The value for these inputs must be linked via another input field.
This is used for styling purposes. */

input[id^='id_'] {
	/*border: 1px solid red; */
	display: none;
}

.custom-btn-text {
	letter-spacing: normal !important;
	font-size: 1rem !important;
}

.min-height-fullscreen {
	min-height: calc(100vh - 64px);
}

.min-height-30vh {
	min-height: calc(30vh);
}

.noc-color-text {
	color: #222222;
}

.line-height {
	line-height: 1.8;
}

.noc-link {
	color: #4db3e6 !important;
	text-decoration: none;
	transition: color 0.2s;
}

.noc-link:hover {
	color: #7ac6ec !important;
	transition: color 0.2s;
}

.corner-border-override {
	border-radius: 0 !important;
}

.custom-form-button {
	color: white !important;
	height: 57px !important;
}

.custom-contact-table {
	width: 100%;
}

.custom-banner {
	min-height: 30vh;
	background-color: #4db3e6;
	background-image: linear-gradient(to top right, rgba(19, 50, 77, 0.3), rgba(19, 50, 77, 0.5)), url(../img/banner.jpg);
}