:root {
	--colour-dark-navy: #043673;
	--colour-dark-navy-2: #0e478e;
	--colour-gold: #d0a379;
	--colour-gold-2: #bc936d;
}

.nav-button-grid {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
}

.nav-button-grid.buttons-stacked {
	flex-wrap: wrap;
	flex-direction: column;
}

.nav-button-grid.button-grid-h-align-left {
	justify-content: flex-start;
}

.nav-button-grid.button-grid-h-align-center {
	justify-content: center;
}

.nav-button-grid.button-grid-h-align-right {
	justify-content: flex-end;
}

.nav-button-grid.buttons-stacked.button-grid-h-align-left {
	align-items: flex-start;
}

.nav-button-grid.buttons-stacked.button-grid-h-align-center {
	align-items: center;
}

.nav-button-grid.buttons-stacked.button-grid-h-align-right {
	align-items: flex-end;
}

.nav-button-grid .icitbtn {
	margin-top: 8px;
	margin-bottom: 8px;
}

.nav-button-grid:not(.buttons-stacked) .icitbtn {
	margin-left: 8px;
	margin-right: 8px;
}


.nav-button-grid.h-spacing-sm:not(.buttons-stacked) .icitbtn {
	margin-left: 4px;
	margin-right: 4px;
}

.nav-button-grid.h-spacing-lg:not(.buttons-stacked) .icitbtn {
	margin-left: 12px;
	margin-right: 12px;
}

.nav-button-grid.v-spacing-sm .icitbtn {
	margin-top: 4px;
	margin-bottom: 4px;
}

.nav-button-grid.v-spacing-lg .icitbtn {
	margin-top: 12px;
	margin-bottom: 12px;
}

.nav-button-grid .icitbtn i {
	margin-right: 8px;
}

.nav-button-grid .icitbtn.icon-after i {
	margin-left: 8px;
	margin-right: 0;
}

/* START: Button styling */
.icitbtn {
	display: inline-block;
	padding: 0.375em 1.3em;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	border: 1px solid transparent;
	font-size: 1em;
	line-height: 1.5;
	transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
	border-radius: 0;
	font-weight: 600;
}

.icitbtn.btn-sm {
	font-size: .8em;
	padding: 0.375em 1.3em;
	border-radius: 0;
	font-weight: 600;
}

.icitbtn.btn-lg {
	font-size: 1.3em;
	padding: 0.375em 1.3em;
	border-radius: 0;
	font-weight: 600;
}

.icitbtn.btn-primary.focus,
.icitbtn.btn-primary:focus,
.icitbtn.btn-primary:not(:disabled):not(.disabled).active:focus,
.icitbtn.btn-primary:not(:disabled):not(.disabled):active:focus {
	box-shadow: none;
}

.icitbtn.btn-primary,
a.icitbtn.btn-primary:visited {
	color: #fff;
	background-color: var(--colour-gold);
	border-color: var(--colour-gold);
}

.icitbtn.btn-primary:hover,
a.icitbtn.btn-primary:hover {
	color: #fff;
	background-color: var(--colour-dark-navy);
	border-color: var(--colour-dark-navy);
	text-decoration: none;
}

.icitbtn.btn-primary:focus,
a.icitbtn.btn-primary.focus {
	color: #fff;
	background-color: var(--colour-dark-navy-2);
	border-color: var(--colour-dark-navy-2);
	outline: none;
	text-decoration: none;
}

.icitbtn.btn-primary:active,
a.icitbtn.btn-primary.active {
	color: #fff;
	background-color: var(--colour-dark-navy-2);
	border-color: var(--colour-dark-navy-2);
	text-decoration: none;
}

.icitbtn.btn-primary:active:hover,
a.icitbtn.btn-primary.active:hover
.icitbtn.btn-primary:active:focus,
a.icitbtn.btn-primary.active:focus
.icitbtn.btn-primary:active.focus,
a.icitbtn.btn-primary.active.focus
.icitbtn.btn-primary:not(:disabled):not(.disabled).active,
.icitbtn.btn-primary:not(:disabled):not(.disabled):active {
	color: #fff;
	background-color: var(--colour-dark-navy-2);
	border-color: var(--colour-dark-navy-2);
	outline: none;
	text-decoration: none;
}

.icitbtn.btn-secondary.focus,
.icitbtn.btn-primary:focus,
.icitbtn.btn-secondary:not(:disabled):not(.disabled).active:focus,
.icitbtn.btn-secondary:not(:disabled):not(.disabled):active:focus {
	box-shadow: none;
	text-decoration: none;
}

.icitbtn.btn-secondary,
a.icitbtn.btn-secondary:visited {
	color: #fff;
	background-color: var(--colour-dark-navy);
	border-color: var(--colour-dark-navy);
	text-decoration: none;
}

.icitbtn.btn-secondary:hover,
a.icitbtn.btn-secondary:hover {
	/*color: var(--colour-dark-navy);*/
	color: white;
	background-color: var(--colour-gold);
	border-color: var(--colour-gold);
	text-decoration: none;
}

.icitbtn.btn-secondary:focus,
a.icitbtn.btn-secondary.focus,
.icitbtn.btn-secondary:active,
a.icitbtn.btn-secondary.active {
	/*color: var(--colour-dark-navy);*/
	color: white;
	background-color: #bc936d;
	border-color: #bc936d;
	outline: none;
	text-decoration: none;
}

.icitbtn.btn-secondary:active:hover,
a.icitbtn.btn-secondary.active:hover
.icitbtn.btn-secondary:active:focus,
a.icitbtn.btn-secondary.active:focus
.icitbtn.btn-secondary:active.focus,
a.icitbtn.btn-secondary.active.focus
.icitbtn.btn-secondary:not(:disabled):not(.disabled).active,
.icitbtn.btn-secondary:not(:disabled):not(.disabled):active {
	color: var(--colour-dark-navy);
	background-color: #bc936d;
	border-color: #bc936d;
	outline: none;
	text-decoration: none;
}
/* END: Button styling */

@media screen and (max-width: 480px) {
	.nav-button-grid.hideinmobileviews {
		display: none;
	}
}

@media screen and (max-width: 459px) {
	.nav-button-grid:not(.buttons-stacked) .icitbtn {
		margin-left: 5px;
		margin-right: 5px;
	}

	.icitbtn.btn-lg {
		font-size: 1.15em;
	}
}