*, :after, :before {
	box-sizing: border-box;
}
:root {
	--background-colour:       #000000;
	--text-colour:             #ffffff;
	--alliance-cyan:           #00adef;
	--alliance-magenta:        #e6017f;
	--alliance-yellow:         #ffed01;
	--menu-background:         #002a3a;
	--menu-background-active:  #013a55;
	--menu-background-hover:   #00405e;
	--forms-input-bg-colour:   #cacaca;
	--alliance-gradient:       linear-gradient(to right, var(--alliance-cyan) 0%, var(--alliance-magenta) 100%) left bottom no-repeat;
	--alliance-gradient-hover: linear-gradient(to right, var(--alliance-cyan) 20%, var(--alliance-magenta) 80%) left bottom no-repeat;
	--alliance-arrow-icon:     '\e900';
	--alliance-location-icon:  '\e901';
	--alliance-menu-icon:      '\e902';
	--alliance-phone-icon:     '\e903';
	--alliance-time-icon:      '\e904';
}
@font-face {
	font-family:  "Gilroy Light";
	src:          url("/fonts/Gilroy/Gilroy-Light.woff2") format("woff2"),
	              url("/fonts/Gilroy/Gilroy-Light.woff") format("woff"),
	              url("/fonts/Gilroy/Gilroy-Light.ttf") format("truetype");
	font-weight:  normal;
	font-style:   normal;
	font-display: block;
}
@font-face {
	font-family:  "Gilroy Medium";
	src:          url("/fonts/Gilroy/Gilroy-Medium.woff2") format("woff2"),
	              url("/fonts/Gilroy/Gilroy-Medium.woff") format("woff"),
	              url("/fonts/Gilroy/Gilroy-Medium.ttf") format("truetype");
	font-weight:  normal;
	font-style:   normal;
	font-display: block;
}
@font-face {
	font-family:  "Gilroy Semibold";
	src:          url("/fonts/Gilroy/Gilroy-SemiBold.woff2") format("woff2"),
	              url("/fonts/Gilroy/Gilroy-SemiBold.woff") format("woff"),
	              url("/fonts/Gilroy/Gilroy-SemiBold.ttf") format("truetype");
	font-weight:  normal;
	font-style:   normal;
	font-display: block;
}
@font-face {
	font-family:  "Alliance Print Font";
	src:          url('/fonts/AlliancePrintFont/AlliancePrintFont.woff') format('woff'),
	              url('/fonts/AlliancePrintFont/AlliancePrintFont.ttf') format('truetype'),
	              url('/fonts/AlliancePrintFont/AlliancePrintFont.svg#Alliance') format('svg');
	font-weight:  normal;
	font-style:   normal;
	font-display: block;
}

body {
	background-color: var(--background-colour);
	color:            var(--text-colour);
	display:          grid;
	font-family:      "Gilroy Light", serif;
	margin:           0;
	font-size:        1.6rem;
	line-height:      1.8rem;
}
a {
	color:           inherit;
	text-decoration: none;
}
h1 {
	font-family: "Gilroy Semibold", serif;
	font-size:   4.5rem;
	line-height: 4.6rem;
	color:       var(--text-colour);
}
h2 {
	font-family:  "Gilroy Light", serif;
	font-size:    3rem;
	line-height:  3.2rem;
	font-weight:  400;
	margin-block: 0;
}
h3 {
	font-family:  "Gilroy Light", serif;
	font-weight:  400;
	font-size:    2.2rem;
	line-height:  2.4rem;
	margin-block: .5em;
}
h4 {
	font-family:  "Gilroy Light", serif;
	font-weight:  400;
	font-size:    2rem;
	line-height:  2.1rem;
	margin-block: .5em;
}
p {
	margin-block-start: .5em;
	font-family:        "Gilroy Light", serif;
}
p strong, h2 strong, h3 strong, h4 strong {
	font-family: "Gilroy Semibold", serif;
}
ul li {
	line-height: 2rem;
}
.cyan {
	color: var(--alliance-cyan);
}
.magenta {
	color: var(--alliance-magenta);
}
.yellow {
	color: var(--alliance-yellow);
}
.width100 {
	width: 100%;
}
.arrow-right-before:before {
	font-family: "Alliance Print Font", serif;
	font-size:   1.2rem;
	line-height: 0;
	content:     var(--alliance-arrow-icon) ' ';
	top:         2px;
	position:    relative;
}
.arrow-right-after:after {
	font-family:    "Alliance Print Font", serif;
	font-size:      1.2rem;
	line-height:    0;
	baseline-shift: -0.5em;
	content:        ' ' var(--alliance-arrow-icon);
	top:            2px;
	position:       relative;
}
.underline {
	padding-bottom:  5px;
	background:      var(--alliance-gradient);
	background-size: 100% 2px;
}
.gradient-left, .gradient-right {
	position: relative;
}
.gradient-left:before {
	content:    '';
	position:   absolute;
	background: var(--alliance-gradient);
	width:      calc(50vw - 8%);
	right:      8%;
	height:     160px;
	bottom:     -60px;
	z-index:    -1;
}
.gradient-right:after {
	content:    '';
	position:   absolute;
	background: var(--alliance-gradient);
	width:      calc(45vw - 8%); /* if I can work out how to calculate max width no more than actual screen width */
	left:       8%;
	height:     160px;
	bottom:     -60px;
	z-index:    -1;
}

/***** Header *****/
html:not([data-scroll="0"]) header {
	background-color: rgba(0, 0, 0, 1);
}
header {
	padding:               22px 22px 10px 22px;
	position:              sticky;
	top:                   0;
	display:               grid;
	grid-template-columns: [logo] 320px [blank] 1fr [nav]800px;
	background-color:      rgba(0, 0, 0, 0);
	transition-duration:   1s;
	z-index:               1;
}
header nav {
	grid-column-start: nav;
	justify-self:      end;
	align-self:        center;
}
header ul, footer ul {
	list-style: none;
}
header nav > ul > li {
	display:        inline-block;
	padding:        0 1em;
	vertical-align: middle;
}

/***** Menu *****/
.menu-text {
	text-align: center;
}
.menu {
	font-family: "Alliance Print Font", serif;
	font-size:   120px;
	transition:  0.5s;
	transform:   rotate(0);
}
.menu:hover {
	transform: rotate(-45deg);
}
#side-menu-container {
	position:   absolute;
	top:        0;
	right:      0;
	width:      800px;
	height:     100vh;
	z-index:    -1;
	overflow:   hidden;
	/*display: none;*/ /*This removes he container*/
	visibility: hidden;
}
.topMenu {
	transition:       0.3s;
	position:         absolute;
	top:              0;
	right:            -550px;
	background-color: var(--menu-background);
	padding:          150px 220px 20px 90px;
	z-index:          -1;
}
.topMenu li {
	font-family: "Gilroy Light", serif;
	font-size:   1.5rem;
	line-height: 2.4em;
}
.topMenu li a {
	text-decoration: none;
}
.topMenu li:before {
	font-family: "Alliance Print Font", serif;
	content:     var(--alliance-arrow-icon) ' ';
	color:       var(--alliance-cyan);
}
#menu-icon:hover + #side-menu-container,
#side-menu-container .topMenu:hover {
	visibility: visible;
}
#menu-icon:hover + #side-menu-container .topMenu,
#side-menu-container .topMenu:hover {
	right: 0;
}

/***** Body *****/
._1cols {
	display:               grid;
	grid-template-columns: 1fr;
	justify-items:         center;
}
._2cols {
	display:               grid;
	grid-template-columns: 1fr 1fr;
	justify-items:         center;
}
._2cols.text-left {
	grid-template-columns: 1.4fr 1fr;
}
._2cols.text-right {
	grid-template-columns: 1fr 1.4fr;
}
._2cols img {
	width: 40vw;
}
._3cols {
	display:               grid;
	grid-template-columns: 1fr 1fr 1fr;
	justify-items:         center;
}
._4cols {
	display:               grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	justify-items:         center;
}
._6cols {
	display:               grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
	justify-items:         center;
}
.content-block {
	padding: 3em;
}
.crosshairs {
	border-style:        solid;
	border-width:        50px;
	border-image-source: url(/images/common/crosshairs.png);
	border-image-slice:  50;
	position:            relative;
}
.crosshairs:after {
	position:         absolute;
	content:          '';
	background-image: url(/images/common/colour-bar.jpg);
	bottom:           -40px;
	right:            70px;
	width:            120px;
	height:           29px;
}

/***** Link to contact page *****/
.call-to-action {
	display:               grid;
	grid-template-columns: 1fr 1fr;
	background:            var(--alliance-gradient);
	padding:               1em 3em;
	margin:                3em;
	justify-items:         stretch;
	align-items:           center;
}
.request-quote {
	text-align: right;
}
.call-to-action-block {
	padding: 0;
}

/***** Footer *****/
footer {
	padding:               50px 22px 0 22px;
	display:               grid;
	grid-template-columns: .7fr 1fr 1fr 1fr;
	justify-items:         center;
	background-image:      url(/images/common/footer-bg.png);
	background-repeat:     no-repeat;
	background-position:   top right;
}
footer section {
	padding: 0 3em;
}
footer .quick-links ul {
	padding: 0;
}
footer .quick-links ul li {
	padding-bottom: .5em;
}
footer .quick-links ul ul {
	margin-left: 2em;
}
footer .quick-links li.arrow-right-before:not(.active):before {
	color: var(--alliance-cyan);
}
.contact-details {
	position:       relative;
	display:        flex;
	flex-direction: column;
}
.contact-details div {
	padding: 16px 0 16px 110px;
}
.contact-details div:before {
	font-family: "Alliance Print Font", serif;
	font-size:   60px;
	position:    absolute;
	left:        1.2em;
	padding-top: 10px;
}
.contact-details .phone-icon:before {
	content: var(--alliance-phone-icon);
}
.contact-details .place-icon:before {
	content: var(--alliance-location-icon);
}
.contact-details .time-icon:before {
	content: var(--alliance-time-icon);
}


/****************************/
/********** Pages **********/
/****************************/

/***** Home Page *****/
.home-video-block {
	height: 65vh;
	width:  45vw;
}
.home-video-block video {
	position:        absolute;
	left:            0;
	top:             0;
	object-position: left top;
	max-height:      68vh;
	min-width:       45vw;
}
.home-section-2 {
	grid-template-columns: 1fr 1fr;
}
.home-matrix-block img {
	max-width: 460px;
	width:     auto;
	height:    auto;
}
.home-section-4 {
	padding: 0 2em;
}
.home-section-4 img {
	width:  100%;
	height: auto;
}

/***** About Us Page ******/
.about-blurb3-block ul,
.digital-blurb-2-block ul {
	position:    relative;
	list-style:  none;
	font-family: "Gilroy Light", serif;
	line-height: 1.6em;
}
.about-blurb3-block ul li:before,
.digital-blurb-2-block ul li:before {
	content: '\00A0\2013\00A0\00A0';
}
.about-blurb3-block ul.first-list:before,
.digital-blurb-2-block ul:before {
	content:           '';
	background-image:  url(/images/common/about-bullets.png);
	background-size:   contain;
	background-repeat: no-repeat;
	position:          absolute;
	left:              0;
	width:             40px;
	height:            100%;
}
.about-blurb3-block ul.second-list {
	padding-left: 80px;
}
.about-blurb3-block ul.second-list:before {
	content:           '';
	background-image:  url(/images/common/crosshair-white.svg);
	background-size:   contain;
	background-repeat: no-repeat;
	position:          absolute;
	left:              0;
	width:             80px;
	height:            100%;
}

/***** Team Page *****/
.team-top-image img {
	position: absolute;
	z-index:  -1;
	top:      0;
	left:     0;
	width:    50vw;

}
.team-harold-block, .team-bern-block, .team-james-block {
	background-color: var(--background-colour);
}

/***** Digital *****/
.digital-image-3-block {
	overflow: hidden;
}

/***** Contact Page *****/
.contact-form-block.content-block {
	/* padding: 2em;*/
	width: 100%;
}
.contact-details-block {
	width: 100%;
}
.contact-map-block img {
	width: 40vw;
}
#contactus, #contactus > label {
	display:        flex;
	flex-direction: column;
	margin:         .5em;
}
#contactus label {
	position: relative;
}
#contactus input, #contactus textarea {
	margin-top: .4em;
}
#contactus input, #contactus textarea {
	background-color: var(--forms-input-bg-colour);
	color:            var(--background-colour);
	border:           none;
	border-radius:    5px;
	padding:          1.2em;
	font-family:      "Gilroy Medium", serif;
}
#contactus textarea {
	height: 100px;
}
#contactus button {
	padding:       1em;
	background:    var(--alliance-gradient);
	border:        solid black 1px;
	border-radius: 5px;
	color:         var(--text-colour);
	width:         80%;
	cursor:        pointer;
	margin-left:   0.5em;
}
#contactus button:hover {
	background: var(--alliance-gradient-hover);
	border:     solid white 1px;
}
#contactus button:active {
	background: var(--alliance-yellow);
}

form#contactus label.required:after {
	content:     " *";
	color:       #ff0000;
	font-weight: normal;
	position:    absolute;
	right:       0;
}

#contactus-result {
	padding:               8px 35px 8px 14px;
	margin-bottom:         20px;
	text-shadow:           0 1px 0 rgba(255, 255, 255, 0.5);
	-webkit-border-radius: 4px;
	-moz-border-radius:    4px;
	border-radius:         4px;
}
#contactus-result.success {
	border:           1px solid #d6e9c6;
	color:            #468847;
	background-color: #dff0d8;
}
#contactus-result.error {
	border:           1px solid #eed3d7;
	color:            #b94a48;
	background-color: #f2dede;
}

/** NCR Contact Form **/
.bottom-contact #contactus {
	display:               grid;
	grid-template-columns: 1fr 1fr;
}
.bottom-contact .content-block {
	padding: 0 3em;
}
.bottom-contact .call-to-action-block {
	padding: 0;
}
.bottom-contact #contact_area {
	background-color: rgba(255, 255, 255, .3);
	padding:          0 .5em .5em;
	border-radius:    5px;
}
@media screen and (max-width: 800px) {
	.bottom-contact #contactus {
		display: flex;
	}
}

/***  Magazine Printing **/
.magazines-image-2-block {
	height: 50vh;
	width:  40vw;
}
.magazines-image-2-block video {
	position:        absolute;
	right:           0;
	top:             10vh;
	object-position: left top;
	max-height:      40vh;
	min-width:       45vw;
}


.contact-map-block img {
	width: 34vw;
}
.contact-details-block .contact-details div:before {
	left: .5em;
}

@media screen and (max-width: 800px) {

	header {
		display: block;
	}

	._1cols, ._2cols, ._3cols, ._4cols, ._6cols {
		grid-template-columns: 1fr;
		width:                 100vw;
	}

	._1cols > *, ._2cols > *, ._3cols > *, ._4cols > *, ._6cols > * {
		width:   100vw;
		padding: 1em;
	}

	._2cols.text-right, ._2cols.text-left {
		display: revert;
	}

	._2cols img {
		width: 100%;
	}

	.desktop-only {
		display: none;
	}

	footer {
		grid-template-columns: 1fr;
		grid-template-rows: 1fr 1fr 1fr;
		background-image:      none;
	}

	.home-video-block {
		height: auto;
		width:  100vw;
	}

	.home-video-block video {
		position:   static;
		z-index:    -1;
		object-fit: contain;
		height:     auto;
		width:      100vw;
	}


	.home-matrix-block img {
		max-width: 460px;
		width:     100%;
		height:    auto;
	}

	h1 {
		font-size: 2em;
	}

	.gradient-left:before, .gradient-right:after {
		display: none;
	}


	.team-top-image img {
		position: static;
		width:    100%;
	}

	.contact-map-block img {
		width: 100%;
	}

}
section.fsc {
	display:               grid;
	grid-template-columns: 1fr 115px;
	align-items:           center;
	gap:                   10px;
}

._2cols img.fsclogo {
	width:  115px;
	height: 179px;
}

.partnershipsLogos {
	max-width: 500px;
}

.span.noBreak {
	display: inline-block;
}

.honigtopf, .honigtopf2 {
	display: none;
}
.partnerships_body header img {
	display: none;
}
.partnerships_body ._2cols {
	align-items: center;
}
/*#side-menu-container li:hover:not(:has(ul)),*/
/*#side-menu-container li,*/
/*#side-menu-container .active {*/
/*	background-color: var(--menu-background-active);*/

/*}*/
/*#side-menu-container li:hover:not(:has(ul)),*/
/*#side-menu-container li:has(ul):hover:not(ul li)*/
/*{*/
/*	background-color: var(--menu-background-hover);*/
/*	border-radius: 15px;*/
/*	!*padding: 0 10px;*!*/
/*}*/

ul.topMenu  li:hover {
	background-color: var(--menu-background-hover);
	border-radius:    15px;
}

ul .topMenu .inlevel {
	margin-left: 2em;
}

.topMenu li.active:before {
	color: var(--text-colour);
}

/*ul.topMenu .parent:hover ul li {*/
/*	background-color: var(--menu-background);*/
/*}*/