html{
	position:relative;
    -webkit-text-size-adjust: none;
	scroll-behavior: smooth;
}
.float {
	position: absolute;
	top:0;
	left: 0;
	width: 100%;
	height: 90px;
	z-index: 2;
}
body {
    margin: 0;
    padding: 0;
    font-family: "Commissioner", Helvetica, Arial, sans-serif;
    font-size: 110%;
	line-height: 1.95rem;
    font-weight: 400;
    color: #2b2b2b;
    -webkit-text-size-adjust: 100%;
    position: relative;
    overflow-x: hidden;
	transition: all .5s;
    transition-delay: .95s;
}
.full-width {
	width: 100% !important;
	max-width: 100% !important;
	left: 0 !important;
	margin-left: 0 !important;
}
.overlay {
	position: absolute;
	width: 100%;
}
.nolist {
	list-style: none;
	margin: 0;
	padding: 0;
}
@-webkit-keyframes  anim-bg {
  0% {background-color: #EEE;}
  25% {background-color: #DDD;}
  50% {background-color: #CCC;}
  75% {background-color: #BBB;}
  100% {background-color: #EEE;}
}
@keyframes anim-bg {
  0% {background-color: #EEE;}
  30% {background-color: #DDD;}
  60% {background-color: #CCC;}
  85% {background-color: #BBB;}
  100% {background-color: #EEE;}
}
h1, .expand_body h2 {
	font-weight: 900;
}
.expand_body h2:first-child {
	margin-top: 0;
}
a:link, a:visited, a:active {
	color: #000;
	text-decoration: underline;
}
a:link:hover, a:link:focus {
	color: #000;
	text-decoration: none;
}
.rop-skip, .skip-navitems {
    position: absolute !important;
}
#skip-nav {
	list-style-type: none;
	margin: 0;
	padding: 0
}
.hide {
	display: none !important;
}
.vanish {
	opacity: 0 !important;
}
.skip-navitems {
	left: 0;
	top: 10px;
	width: 100%;
	text-align: left;
	z-index: 15002;
	display: block
}
.rop-skip {
	padding: 5px;
	clip: rect(1px,1px,1px,1px);
	height: 1px;
	margin: 0;
	width: 1px
}
.rop-skip:hover{
	color:#00498e;
}
.rop-skip:focus {
    clip: rect(auto, auto, auto, auto);
    height: inherit;
    overflow: inherit;
    z-index: 15004;
    border: none;
    background: #ffffff;
    width: auto;
    display: inline-block;
    font-size: .9rem;
    text-align: center;
    outline: 0;
    color: #000;
    box-sizing: border-box;
    font-weight: 400;
    border-radius: 0 5px 5px 0;
    padding: 10px 15px;
}
.mh400{
	min-height: 400px;
}
.margin_top_50 {
	margin-top: 50px;
}
h1 {
    font-size: 3rem;
    line-height: 3.5rem;
}
h2 {
	font-size: 2.25rem;
    line-height: 2.75rem;
}
h1 span {
	display: block;
	font-size: .5rem;
}
p.intro {
    margin-top: 0;
    font-size: 1.35rem;
    line-height: 1.95rem;
}
h1 + p.intro {
	margin-top: -10px;
}
h2 + p {
    margin-top: -1rem;
}
p + h2 {
	margin-top: 3rem;
}
.wedge-left{
	width: 800px;
	height: 800px;
	border-radius: 80px;
	transform: rotate(45deg);
	position: absolute;
	top: -650px;
	left: -370px;
	display: block;
	background-color: #2b2b2b;
}
.responsive{
	width: calc(100% - 40px);
	max-width: 1400px;
	margin: auto;
	position: relative;
}
.logo{
	top: 20px;
	position: relative;
	width: 185px;
	height: 40px;
	display: block;
	background-image: url(/_img/logo-name-dark.svg);
	background-size: 100%;
	background-repeat: no-repeat;
    background-position: left top;
	overflow: hidden;
}
.logo img{
	width: 185px;
	height: 40px;
}
.logotext span{
	font-weight: 600;
}
.logotext{
	position: absolute;
	top: 12px;
	left:50px;
	font-weight: 300;
	font-size: 21.5px;
	color: #2b2b2b;
}

.lbl_container{
	border: 1px solid;
    padding: 20px 0;
    border-color: rgb(0 0 0 / 16%);
    border-width: 1px 0;
}
a.lbl_container {
	text-decoration: none;
	transition: all ease-in-out .125s;
}
a.lbl_container:hover, a.lbl_container:focus {
	/*background-color: rgb(0 0 0 / 30%);*/
	letter-spacing: .5px;
}
.none a.lbl_container:hover, .none a.lbl_container:focus {
	/*background-color: rgb(0 0 0 / 10%);*/
	letter-spacing: .5px;
}
a.lbl_container:after{
	font-family: IcoFont;
	content: "\eaca";
	position: relative;
	left: 5px;
	transition: all ease-in-out .125s;
}
a.lbl_container:hover:after, a.lbl_container:focus:after{
	left: 7px;
}	
.sbold{
	font-weight: 300;
}
.screen-hidden {
	position: absolute;
	top: -1000px;
	left: -10000px;
}
.ux, .digital, .aoda, .ux h1{
    position: absolute;
	font-weight: 200;
    font-size: 2rem;
}
.pos_1{
	top: 110px;
	left: 0;
}
.pos_2{
	top: 200px;
	right: 0;
}
.pos_3{
    left: 50%;
	top: 100px;
    transform: rotate(90deg);
    transform-origin: top left;
	font-weight: 200;
}
ul.button_group {
	list-style: none;
	margin: 0;
	padding: 0;
}
ul.button_group li {
	display: inline-block;
	margin: 1px;
}
a.btn {
    display: inline-block;
    /*background: #daff00;
	background: #a92300; AAA*/
	/* background: #d22b00; /* AA */
    transform: skew(0deg, -5deg);
    padding: 5px 25px;
    text-decoration: none !important;
	transition: all .125s;
	z-index: 1;
	box-sizing: border-box;
	margin: 2.5px;
	font-size: 1.1rem;
	text-align: center;
    border: 2px solid rgb(255 255 255 / 85%);
    color: #FFF !important;
    background: rgb(0 0 0 / 18%);
}
a.btn span {
	transform: skew(0deg, 5deg) rotate(-5deg);
	display: block;
}
a.btn:hover, a.btn:focus {
	background: #000;
	color: #FFF !important;
	z-index: 2;
    /*padding: 5px 29px 5px 24px;*/
	z-index: 100;
	transform: skew(0deg, 0deg);
}
a.btn:hover span, a.btn:focus ispan {
	transform: skew(0deg, 0deg) rotate(0deg);
}
.dark a.btn:hover, .dark a.btn:focus {
	background: #FFF;
	color: #000 !important;
}
.hide {
	display: none !important;
}
.herovideo{
	display: none;
}

/*start animation-----------------------------------*/
.firstload {
    position: absolute;
    z-index: 20;
    opacity: 0;
	text-align:center;
	width:100%;
	box-sizing:border-box;
	animation: cam_loading 3s linear infinite;
}
/*.firstload h1{
	animation: cam_loading 3s linear infinite;
}*/
	
a.bounce {
	animation: bounce 1.25s infinite;
	position:absolute;
	bottom: 20px;
	width: 50px;
	height:40px;
	left:50%;
	margin-left: -25px;
	box-sizing:border-box;
	padding:10px 0 0;
	text-align: center;
	display:block;
	z-index:1000;
	color:#FFF !important;
	font-size:35px;
}
@keyframes  bounce {
  0% {bottom: 20px }
  50% {bottom: 15px; }
  100% {bottom: 20px; }
}
.flyleft {
	animation: anim_left 1.75s linear;
}
@keyframes  anim_left {
  0% {left: 100px; opacity: 0; }
  85% {left: 100px; opacity: 0; }
  95% {left: 0px; opacity: 1; }
  97% {left: 5px; }
  100% {left: 0px; }
}
.flyright {
	animation: anim_right 1.95s linear;
}
@keyframes  anim_right {
  0% {right: 40px; opacity: 0; }
  85% {right: 40px; opacity: 0; }
  90% {right: 0px; opacity: 1; }
  100% {right: 0px; }
}
.flydown{
	animation: anim_down .5s;
	animation-fill-mode: forwards;
	animation-delay: 1s;
	top:-60px;
}
@keyframes  anim_down {
  0% {top: -60px; opacity: 0; filter: blur(3px)}
  60% {top: 30px; opacity: 1; filter: blur(3px)}
  100% {top: 20px; opacity: 1; }
}
.hero_in {
	animation: hero_fadin .75s;
	animation-delay: 3s;
}
@keyframes  hero_fadin {
  0% 	{width: 120%; left: -10%; opacity:0;}
  100% 	{width: 100%; left: 0; opacity:1}
}

.delayout {
	animation: delay_out 3.125s ease-in-out;
	transition:opacity ease-out .3s;
}
@keyframes  delay_out {
  0% {opacity:1;}
  70% {opacity:1;}
  75% {opacity:0;}
  100% {opacity:0;}
}
.disolve {
	opacity: 0;
}
.colour_in{
	animation: col_in 6s linear;
}
@keyframes  col_in {
  0% {filter: grayscale(1); }
  15% {filter: grayscale(1); }
  25% {filter: grayscale(0); }
  100% {filter: grayscale(0); }
}

/* foote bg colours */
#footer-container {
	animation: anim_footer 180s infinite;
}
@-webkit-keyframes  anim_footer {
  0% {background-color: #3e183d;}
  25% {background-color: #844900;}
  50% {background-color: #3C5A12;}
  75% {background-color: #73191a;}
  100% {background-color: #3e183d;}
}
@keyframes anim_footer {
  0% {background-color: #3e183d;}
  30% {background-color: #844900;}
  60% {background-color: #3C5A12;}
  85% {background-color: #73191a;}
  100% {background-color: #3e183d;}
}
.shift-left{
	animation: shift-left .5s;
	animation-fill-mode: forwards;
	animation-delay: .325s;
	animation-timing-function: ease;
	left: 100%;
	position: relative;
}
@keyframes shift-left {
  0% { left: 50%; opacity: 0; }
  100% { left: 0; opacity: 1; }
}
.shift-back{
	animation: shift-back .5s;
	animation-fill-mode: forwards;
	animation-delay: .5s;
	left: -60px;
}
@keyframes shift-back {
  0% { left: -60px; }
  100% { left: 0 }
}
/*animated in-view*/
.move_in {
  opacity: 0;
  transition: all ease-in-out;
}
.fade-up{
	position: relative;
	-webkit-animation-name: toup; /* Safari 4.0 - 8.0 */
	-webkit-animation-duration: .75s; /* Safari 4.0 - 8.0 */
	animation-name: toup;
	animation-duration: .75s;
	animation-fill-mode: forwards;
	transition: all ease-in-out;
	bottom:-75px;
}
@-webkit-keyframes toup {
 0% {bottom:-75px;opacity: 0;}
 100% {bottom: 0px;opacity: 1;}
}
@keyframes toup {
 0% {bottom:-75px; opacity: 0;}
 100% {bottom: 0px; opacity: 1;}
}

.fade-in{
	position: relative;
	-webkit-animation-name: fin; /* Safari 4.0 - 8.0 */
	-webkit-animation-duration: 1.275s; /* Safari 4.0 - 8.0 */
	animation-name: fin;
	animation-duration: 1.275s;
	animation-fill-mode: forwards;
	transition: all ease-in-out;
}
@-webkit-keyframes fin {
 0% {opacity: 0;}
 50% {opacity: 0;}
 100% {opacity: 1;}
}
@keyframes fin {
 0% {opacity: 0;}
 50% {opacity: 0;}
 100% {opacity: 1;}
}
/*end animated in-view*/

/*end animation------------------------------*/

/*box groups*/
.box-group {
	display: flex;
}
.box-group > div {
	position: relative;
	box-sizing: border-box;
	padding: 15px;
}
.box-group > div h2 {
	font-size: 1.5rem;
	margin-top: 5px;
}
.box-group > div {
	background: rgba(0, 0, 0, 0.075);
    flex-basis: calc((100% - 40px) / 3);
    margin: 10px 20px 10px 0;
}
.box-group > div:last-of-type {
	margin-right: 0;
}
a {
	outline: none;
}
a.menu_icon_link {
	right: -10px;
	width: 70px;
	padding: 0;
	z-index: 2005;
	display: inline-block;
	transition: all ease-in-out .125s;
	text-decoration: none !important;
	position: absolute;
	box-sizing: border-box;
	color: #FFF;
	line-height: 0;
	margin-top: -18px;
}

a.menu_icon_link img {
	width: 100%;
}
a.menu_icon_link:hover, a.menu_icon_link:focus {
	padding: 4px;
	background-color: rgb(0 0 0 / 50%);
}

/*slide toc*/
.noscroll {
	overflow-y: hidden;
	width: calc(100vw);
}
.toc_object {
	display: block;
	height: 100vh;
	background: rgba(0, 0, 0, 0);
	transition: all .5s ease-in-out;
	width: 100%;
	z-index: -5;
	overflow: hidden;
	position: fixed;
	top: 0;
	right: 0;
}

.toc_object.expanded {
	background: rgba(0, 0, 0, .46);
	z-index: 11000;
}
.toc_object.expanded.nodark{
	background: none;
}
.toc_object .expand_body {
	display: block;
	background: #d7ff00;
	height: 100vh;
    top: 0;
	right: -100vw;
	width: 430px;
    max-width: calc(100% - 60px);
	padding: 64px 20px 60px;
	box-sizing: border-box;
	transition: all .5s ease-out;
	position: fixed;
	overflow: hidden;
	/* -webkit-box-shadow: -14px 1px 20px 0px rgb(0 0 0 / 10%);
	box-shadow: -14px 1px 20px 0px rgb(0 0 0 / 10%);
	-webkit-box-shadow: -12px 4px 221px 94px rgb(0 0 0 / 72%); 
    box-shadow: -12px 4px 221px 94px rgb(0 0 0 / 72%);*/
}
.toc_object .expand_body.wide {
    width: 960px;
}
.toc_object.expanded .expand_body {
	right: 0;
	opacity: 1;
}
.toc_object.expanded .expand_body ul {
    position: relative;
}


/* colour sets */
.logo img.logoslash {
    width: 185px;
    height: 40px;
    position: absolute;
    top: 0;
    left: -2px;
	/*filter: brightness(0) saturate(100%) invert(78%) sepia(90%) saturate(912%) hue-rotate(14deg) brightness(108%) contrast(101%);*/
	filter: brightness(0) saturate(100%) invert(25%) sepia(60%) saturate(3704%) hue-rotate(1deg) brightness(102%) contrast(105%);
	transition: all .95s;
}
.noscroll .logo img.logoslash {
	filter: brightness(0) saturate(100%) invert(78%) sepia(90%) saturate(912%) hue-rotate(14deg) brightness(108%) contrast(101%);
}
.original img.logoslash {
	filter: brightness(0) saturate(100%) invert(25%) sepia(60%) saturate(3704%) hue-rotate(1deg) brightness(102%) contrast(105%);
}
.original .toc_object.expanded .expand_body.cross {
	background: rgb(255 54 0 / 88%);
}
/* end colour sets */

.original .toc_object.expanded .expand_body li a {
	color: #ff3500;
}
.original .toc_object.expanded .expand_body li a {
	color: #ff3500;
}

a:link, a:visited, a:active {
	color: #2b2b2b;
	text-decoration: none;
}
a:link:hover, a:link:focus {
	color: #2b2b2b;
	text-decoration: underline;
}
.expand_body h4 {
	font-size: 1.5rem;
	color: #2b2b2b;
}

.toc_object .expand_body h4 {
	font-size: 1.15rem;
}

.expand_body li a {
	text-decoration: none;
	position: relative;
	box-sizing: border-box;
	display: block;
}
.expand_body li.nav_home,
.expand_body li.nav_main {
	font-weight: 600;
}

.expand_body li.nav_home a:before {
	/*content: "\f053";
	font-size: 21px;
    top: 0;
    left: -30px;*/
	content: "\f015";
	font-size: 25px;
	top: -2px;
	left: -28px;
}

.expand_body li.nav_home2 {
	position: absolute;
	top: -11px;
	right: 78px;
	z-index: 10;
	line-height: 1rem;
	box-sizing: border-box;
}
.expand_body li.nav_home2 a img{
    width: 33px;
    top: -6px;
    position: relative;
    margin: auto;
}
.expand_body li.nav_home2 a:hover img, .expand_body li.nav_home2 a:focus img{
    filter: invert(1);
}
.expand_body li.nav_home2 a {
	text-decoration: none;
	border: 1px solid;
	border-color: transparent;
	background-color: #000;
	color: #FFF;
	padding: 15px 3px 0;
	width: 41px;
	height: 51px;
	font-size: 24px;
	display: block;
}
.expand_body li.nav_home2 a:before {
	display: none;
}

.expand_body li.nav_main a:before {
	content: "\f10 4";
	font-size: 25px;
	top: -2px;
	left: -28px;
}

.expand_body li.nav_home a:hover:before,
.expand_body li.nav_home a:focus:before,
.expand_body li.nav_main a:hover:before,
.expand_body li.nav_main a:focus:before {
	font-size: 16px;
	top: 3px;
	left: -28px;
}

.expand_body li.nav_home2 a:hover,
.expand_body li.nav_home2 a:focus {
	color: #000;
	background-color: #FFF;
	border: 1px solid #000;
}

.expand_body li.nav_home2 a:hover:before,
.expand_body li.nav_home2 a:focus:before {
	display: none;
}

.arrow_sep {
	position: absolute;
	width: 30px;
	height: 30px;
	background: #FFFFFF;
	transform: rotate(45deg);
	left: 50%;
	margin-left: -15px;
	z-index: 1;
	top: -15px;
}

.arrow_sep.blue {
	background: #003972 !important;
}

.arrow_sep.grey {
	background: #f3f3f3;
}

.arrow_sep.blue.mblue {
	background: #025A9D !important;
}

.arrow_sep.half {
	left: 25%;
}
.content-group.four .content-item {
	width: calc((100% - 60px) / 4);
}

.content-group.three .content-item {
	width: calc((100% - 40px) / 3);
}

.content-group.two .content-item {
	width: calc((100% - 20px) / 2);
}

.content-group.one .content-item {
	width: 100%;
	margin-right: 0;
	padding-top: 20px;
	margin-bottom: 20px;
}

.content-group.one .content-item:first-of-type {
	border-top: 0;
	margin-top: 0;
	padding-top: 0;
}

.content-item h3 {
	font-size: 1.25rem;
	margin: 0 0 22px;
}

.content-item p:first-of-type {
	margin-top: 10px;
}

.content-item a.button_big_blue {
	font-size: .95rem;
	padding: 9px 9px 10px;
}
.content-item img{
	width: 100%
}
.content-group.four .content-item:nth-of-type(4n + 4),
.content-group.three .content-item:nth-of-type(3n + 3),
.content-group.two .content-item:nth-of-type(2n + 2) {
	margin-right: 0;
}

.content-group.four .content-item:nth-of-type(4n + 5),
.content-group.three .content-item:nth-of-type(3n + 4),
.content-group.two .content-item:nth-of-type(2n + 3) {
	clear: both;
}


/*expand content*/

.expand {
	background: rgba(0, 0, 0, .75);
	z-index: 9000 !important;
	height: 100vh;
	width: 100%;
	opacity: 0;
	position: fixed;
	left: -200%;
	top: 0;
	transition: opacity .035s ease-in-out;
}

.expanded {
	opacity: 1;
	left: 0;
}

.expand .expand_body {
	opacity: 0;
	position: fixed;
	height: 0px;
	width: 0px;
	left: 50%;
	top: 50%;
	padding: 0;
	box-sizing: border-box;
	background-color: #FFF;
	transition: all .25s ease-in-out;
	-webkit-box-shadow: 0px 1px 20px 0px rgb(0 0 0 / 56%);
	box-shadow: 0px 1px 20px 0px rgb(0 0 0 / 56%);
}

.expand.expanded .expand_body {
	opacity: 1;
	width: 90%;
	left: 5%;
	top: 5vh;
	overflow-y: auto;
}

@media screen and (max-width: 1060px) {
	.expand.expanded .expand_body div {
		height: revert;
	}
}
.panels .panels.twin{
	background: none;
}
.expand.expanded .expand_body,
.expand .expand_body .panels.twin.textleft > div {
	height: 90vh;
	padding-left: 10px;
}

.expand_body .panels.twin > div {
	overflow-y: auto;
}

.expand.expanded div.panels:first-of-type {
	padding-top: 0 !important;
}

.expanded.collapsed .expand_body {
	opacity: 0;
	width: 0px;
	height: 0px;
	left: 50%;
	top: 50%;
	transition: all .25s ease-in-out;
}

a.closex {
	position: absolute;
	top: -1px;
	right: 20px;
	z-index: 10;
	font-size: 29px;
	display: block;
	padding: 10px 10px 7px;
	text-decoration: none;
	transition: all .1s ease-in-out;
}
a.closex:hover, a.closex:focus, a.closex:active {
	background-color: #000;
}
a.closex img {
	width: 40px;
	filter: invert(1);
}
a.closex:hover img, a.closex:focus img, a.closex:active img {
	filter: none;
}

/* panels */
div.panels {
	padding: 60px 0;
	overflow: hidden;
}
div.panels > h1:first-child, div.panels>  h2:first-child, div.panels > h3:first-child {
	margin-top: 0;
}