/* Splash Screen Video - Image aligned to bottom */
#bgvid {
	position:absolute;
	bottom: 0%;
    	left: 50%;
    	min-width: 100%;
    	min-height: 100vh;
    	width: auto;
    	height: auto;
    	-ms-transform: translate(-50%, 0%);
    	-moz-transform: translate(-50%, 0%);
    	-webkit-transform: translate(-50%, 0%);
		-o-transform: translate(-50%, 0%);
    	transform: translate(-50%, 0%);
}

@media screen and (max-width: 93.75em) {
	/* Rules when screen resolution is less than 1500px */
	#bgvid {
		position:absolute;
		top: 50%;
		left: 50%;
		min-width: 100%;
		min-height: 100%;
		width: auto;
		height: auto;
		-ms-transform: translate(-50%, -50%);
		-moz-transform: translate(-50%, -50%);
		-webkit-transform: translate(-50%, -50%);
		-o-transform: translate(-50%, -50%);
		transform: translate(-50%,-50%);
	}
}

/* Splash Screen Video - Image aligned to middle */
#bgvid2 {
	position:absolute;
	object-fit: cover;
    object-position: none;
		width: 100%;
		height: 100%;
		left: 50%;
		top: 20%;
		-ms-transform: translate(-50%, -20%);
		-moz-transform: translate(-50%, -20%);
		-webkit-transform: translate(-50%, -20%);
		-o-transform: translate(-50%, -20%);
		transform: translate(-50%, -20%);
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	/* IE only */
	#bgvid2 {
		position:absolute;
		top: 20%;
    	left: 50%;
    	min-width: 100%;
    	min-height: 100vh;
    	width: auto;
    	height: auto;
		-ms-transform: translate(-50%, -20%);
		-moz-transform: translate(-50%, -20%);
		-webkit-transform: translate(-50%, -20%);
		-o-transform: translate(-50%, -20%);
		transform: translate(-50%, -20%);
	}
}

#bgvid3 {
	position: absolute;
    object-fit: cover;
    object-position: center center;
    width: 100%;
    height: 100%;
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	/* IE only */
	#bgvid3 {
		position:absolute;
		top: 50%;
    	left: 50%;
    	min-width: 100%;
    	min-height: 100vh;
    	width: auto;
    	height: auto;
		-ms-transform: translate(-50%, -50%);
		-moz-transform: translate(-50%, -50%);
		-webkit-transform: translate(-50%, -50%);
		-o-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
	}
}

/* Video Player */
.video-display {
	cursor: pointer;
	width:100%;
	height:auto;
}

/* Tiles - B&W */
.container-tile-2a, .container-tile-3a, .container-tile-4a, .container-tile-5a, .container-tile-6a, .container-tile-7a, .container-tile-8a {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}
/* Tiles - Colour */
.container-tile-2a:hover, .container-tile-3a:hover, .container-tile-4a:hover, .container-tile-5a:hover, .container-tile-6a:hover, .container-tile-7a:hover, .container-tile-8a:hover {
    -webkit-filter: grayscale(0%);
    filter: grayscale(0%);
}
.html-element-tile-1 {
	visibility:hidden;
}
#tile-1, #tile-about-1a, #tile-about-2a, #champion-1a, #champion-2a, #champion-3a, #champion-4a, #champion-5a, #champion-6a {
	display:none;
}
@media screen and (min-width: 78.75em) {
	/* Rules when screen resolution is more than 1260px */
	#tap-images-1, #tap-images-2 {
	display:none;
	}
}

/* Slidedown transparent yellow with plus on hover */
.slidedown-yellow-1 {
	width:100%;
	height:100%;
	top:0;
	position:absolute;
}
.cross {
    position: relative;
    width: 100px;
    height: 100px;
	margin:auto;
	top:50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform:translateY(-50%);
}
.cross div {
    position: absolute;
    background: white;
}
.cross-vertical {
    left: 48px;
    width: 4px;
    height: 100%;
}
.cross-horizontal {
    top: 48px;   
    width: 100%;
    height: 4px;
}
.slidedown-code-2 {
	visibility:hidden;
}

/* Random question at the bottom of each page */
.html-element-footer-1 {
  color:rgba(255, 255, 255, 1);
  font-family:'Roboto', sans-serif;
  margin-top:0em;
  margin-bottom:0em;
  font-size:0.875em;
  font-weight:300;
}
a.link-footer-1 {
	color:#ffffff;
	text-decoration: underline;
}
a.link-footer-1:hover {
	color:#afafaf;
	text-decoration: underline;
}
#true-2, #false-2 {
		color:#ffe41e;
}
/* Footer text */
.paragraph-footer-1 {
  color:rgba(255, 255, 255, 1);
  font-family:'Roboto', sans-serif;
  margin-top:0em;
  margin-bottom:0em;
  font-size:0.750em;
  font-weight:300;
}

/* Big numbers that count to value */
.paragraph-big-1 {
	color: #141414;
	font-family:'Roboto', sans-serif;
	font-weight: 300;
	font-size: 6.25em;
	line-height:1.2;
	margin: 7px 0px 12px 0px;
}
@media only screen and (max-width: 950px) {
	.paragraph-big-1 {
		font-size: 5em;
		text-align:center;
	}
}
.paragraph-big-2 {
	color: #aaaaaa;
	font-family:'Roboto', sans-serif;
	font-weight: 300;
	font-size: 9em;
	line-height:1;
	margin: 7px 0px 12px 0px;
}
@media only screen and (max-width: 1260px) {
	.paragraph-big-2 {
		font-size: 7em;
	}
}
@media only screen and (max-width: 950px) {
	.paragraph-big-2 {
		font-size: 8em;
	}
}
@media only screen and (max-width: 600px) {
	.paragraph-big-2 {
		font-size: 5.5em;
	}
}

/* Search Function */
.searching-results {
	position:absolute;
	right:5%;
	top:162px;
	width: 320px;
	display:inline-block;
        text-align:left;
        background-color:white;
        padding:0px 12px;
	z-index:101;
	font-weight:300;
	font-family: 'Roboto', sans-serif;
	line-height:2;
}
@media only screen and (max-width: 1260px) {
.searching-results {	
	top:128px;
	}
}
.searching-results a {
	color: #ff9400;
}
.searching-results a:hover {
	color: #ffae00;
	text-decoration: underline;
}
.form-search {
	float:right;
	margin-top:0px;
	margin-bottom:0px;
}

/* Yellow Boxes */
.container-boxes-1b, .container-boxes-2b, .container-boxes-3b, .container-boxes-4b, .container-boxes-5b, .container-boxes-6b, .container-boxes-7b, .container-boxes-8b, .container-boxes-9b {
	margin-bottom: 300px !important;
}

/* Frequently Asked Questions & Glossary of Terms. Hide answers until question is selected */
.paragraph-faqs-18-1 {
	display:none;
}
.faqsgrey {
	background-color: #d7d7d7 !important;
}
.container-faqs-2 {
	cursor: pointer;
}
.container-glossary-1 {
	cursor: pointer;
}

/* Contact us. Hide details until tile is selected. Used .faqsgrey from above */
.paragraph-contact-20-1 {
	display:none;
}
.container-contact-3 {
	cursor: pointer;
}

/* Embed YouTube */
.html-element-youtube-1 {
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
}
.html-element-youtube-1 iframe, .html-element-youtube-1 object, .html-element-youtube-1 embed {
position: absolute;
border-width: 0px;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

/* Vessel Tracking Map */
.tracking-1 {
  position: absolute;
  top: auto;
  right: auto;
  left: auto;
  bottom: auto;
  z-index: auto;
  display: block;
  float: none;
  clear: none;
  overflow: hidden;
  padding-top:117px;
  min-height: 500px;
  width:100%;
  height: 100vh;
}
@media screen and (max-width: 78.75em) {
	.tracking-1 {
		  padding-top:80px;
	}
}
@media screen and (max-width: 37.5em) {
	.tracking-1 {
		  padding-top:425px;
		  height:1000px;
	}
}

/* Added temporarily because it wasn't working */
#loader {
	display:none;
}

/* Makes background images look ok on iphones & ipads */
@media screen and (max-width: 1024px) {
	body * {background-attachment: scroll !important;}
}

h4.heading-black-28-1 {
  color: #141414;
  font-weight: 300;
  font-size: 28px;
  font-family: 'Roboto', sans-serif;
}
/* Remove Facebook icon from top menu */
a.responsive-picture.picture-link-nav-3 {
  display:none !important;
}