@CHARSET "ISO-8859-1";
/* Reset CSS
 * --------------------------------------- */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,
form,fieldset,input,textarea,p,blockquote,th,td {
    padding: 0;
    margin: 0;
}
table {
    border-spacing: 0;
}
fieldset,img {
    border: 0;
}
address,caption,cite,code,dfn,em,strong,th,var {
    font-weight: normal;
    font-style: normal;
}
strong{
	font-weight: bold;
}
caption,th {
    text-align: left;

}
q:before,q:after {
    content:'';
}
abbr,acronym { border: 0;
}









/* General */
/* ------------------------------------------------------------------------------------ */

/* Body */
/* ---- */
body, 
html {
	font: 16px/28px 'proxima-nova', Helvetica, sans-serif;
	font: 1.35vw/2.35vw 'proxima-nova', Helvetica, sans-serif;
}

html {
	font-size: 100%;
	-webkit-text-size-adjust: 100%;
	font-variant-ligatures: none;
	-webkit-font-variant-ligatures: none;
	text-rendering: optimizeLegibility;
	-moz-osx-font-smoothing: grayscale;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
	text-shadow: rgba(0, 0, 0, .01) 0 0 1px;
}


/* Headings */
/* -------- */
h1, 
h2, 
h3, 
h4, 
h5, 
h6 {
    color: #444;
    font-size: 100%;
    font-weight: normal;
    margin: 0;
    padding: 0;
}

h1 {
	font-size: 4em;
	font-size: 4.5vw;
	font-weight: 100;
	line-height: 5.45em;
	line-height: 5.45vw;
}

h2 {
	margin: 0 0 1em;
	font-size: 2em;
	font-size: 2.5vw;
}

h3 {
	margin: 0 0 1em;
	font-size: 46px;
	/* font-size: 2.5vw; */
	font-weight: 300;
	line-height: 48px;
}

h1.with-margins {
	margin-bottom: 2vw;
	margin-top: 3vw;
}

/* delete these ??? */
h1 {
	color: #fff;
}
h2 {
	color: #888;
}

.small+h2 {
	margin: 0.2em 0 1em !important;
}


.intro p {
	color: #fff;
}
.small {
	color: rgba(118, 119, 115, 0.45);
}
.summary {
	color: #767773;
}
.section {
	position: relative;
}
.default-w-quote {
	background: #ffffff;
}
.white {
	color: #ffffff;
}
.mobile-overlay {
	display: none;
}
.add-margin-top {
	margin-top: 120vh;
}


.add-margin-bottom {
	margin-bottom: 8vh;
}

.margin-bottom {
	margin-bottom: 22vh;
}
/* delete these ??? */



/* Paragraphs and Lists */
/* -------------------- */
p {
	margin: 0 0 1.5em;
	font-size: 21px;
	font-size: 1.35vw;
	font-weight: 400;
	line-height: 28px;
	line-height: 2.35vw;
}

.small {
	margin: 0;
	font-size: 0.75em;
	font-size: 1vw;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	line-height: 1.8em;
}
.summary {
	width: 15em;
	text-align: left;
	line-height: 2vw;
}
.large {
	margin-bottom: 2.5vw;
	font-size: 5em;
	font-size: 5.5vw;
	font-weight: 300;
}
.caps {
	text-transform: uppercase;
}
.text-left {
	text-align: left;
}
.text-right {
	text-align: right;
}
.text-center {
	text-align: center;
}

ol,ul {
    list-style: none;
    margin:0;
    padding:0;
}


/* Links and Buttons */
/* ----------------- */
a {
	text-decoration:none;
}

.button {
	display: inline-block;
	font-size: 0.75em;
	font-weight: 800;
	letter-spacing: 0.1em;
	line-height: 1em;
	margin-top: 4em;
	padding: 1.6em 2em;
	text-transform: uppercase;
	-webkit-transition: all 200ms ease-in-out;
	-moz-transition: all 200ms ease-in-out;
	-ms-transition: all 200ms ease-in-out;
	-o-transition: all 200ms ease-in-out;
	transition: all 200ms ease-in-out;
}

.button.button-one {
	color: #ffffff;
	background: rgba(0, 0, 0, 0.2);
	border-radius: 4em;
}

.button.button-one:hover, 
.button.button-one:focus {
	background: rgba(0, 0, 0, 0.25);
}

.button-one.quiport {
	background: #c3d65a;
	border: 2px solid #c3d65a;
}

.button-one.quiport:hover {
	color: #c3d65a;
	background: #ffffff;
	border: 2px solid #c3d65a;
}

.button-one.meii {
	background: #8176a9;
	border: 2px solid #8176a9;
}

.button-one.meii:hover {
	color: #8176a9;
	background: #ffffff;
	border: 2px solid #8176a9;
}

.button-one.alistair {
	background: #75beb8;
	border: 2px solid #75beb8;
}

.button-one.alistair:hover {
	background: #ffffff;
	border: 2px solid #75beb8;
	color: #75beb8;
}

.button.button-two {
	color: #40688a;
	background: transparent;
	border: 2px solid #40688a;
	border-radius: 3em;
}

.button.button-two:hover {
	color: #ffffff;
	background: #40688a;
}




















.grid-container {
	width: 100vw;
	height: 100vh;
	position: absolute;
	top: 0;
	left: 0;
}
.grid-1-3 {
	width: 34vw;
	height: 100vh;
	display: block;
	float: left;
}
.grid-2-3 {
	width: 66vw;
	height: 100vh;
	display: block;
	float: left;
}
.grid-1-3-split {
	width: 100%;
	height: 50vh;
	display: block;
	float: left;
}
.grid-1-3-quarter {
	width: 100%;
	height: 25vh;
	display: block;
	float: left;
}
.fluid-grid-split-1-2 {
	width: 50%;
	height: 50vh;
	display: block;
	float: left;
}
.fluid-grid-quarter-1-1 {
	width: 100%;
	height: 25vh;
	display: block;
	float: left;
}
/* percents */
.grid-1-3-pct {
	width: 33.333333vw;
	height: 100%;
	display: block;
	float: left;
}
.grid-2-3-pct {
	width: 66.666666vw;
	height: 100%;
	display: block;
	float: left;
}
.grid-1-3-full-pct {
	width: 100%;
	height: 100%;
	display: block;
	float: left;
}
.grid-1-3-split-pct {
	width: 100%;
	height: 50%;
	display: block;
	float: left;
}
.grid-1-3-quarter-pct {
	width: 100%;
	height: 25%;
	display: block;
	float: left;
}
.grid-1-3-three-quarters-pct {
	width: 100%;
	height: 75%;
	display: block;
	float: left;
}
.fluid-grid-split-1-2-pct {
	width: 50%;
	height: 50%;
	display: block;
	float: left;
}
.fluid-grid-quarter-1-1-pct {
	width: 100%;
	height: 25%;
	display: block;
	float: left;
}


/* Homepage */
/* ------------------------------------------------------------------------------------ */


/* Landing (Section 1) */
/* ------------------- */
.landing {
	background: #155485;
}

/* Landing: Logo */
.landing .logo {
	background: url('../images/opic__logo_sm.png') center top no-repeat transparent;
	background: url('../images/svg/svg_logo__white.svg') center top no-repeat transparent;
	background-size: 100% auto;
	height: 140px;
	left: 50%;
	margin-left: -75px;
	position: absolute;
	text-indent: -9999px;
	top: 10vh;
	width: 140px;
	z-index: 1;
}

/* blue */
.cls-1 {
	fill:#004e7d;
}

/* green */
.cls-2 { 
	fill:#dce246;
}



/* Landing: Menu */
.landing-menu li {
	display: inline-block;
}

.landing-menu li a {
	color: #ffffff;
	font-size: 0.75em;
	font-size: 1vw;
	font-weight: 800;
	letter-spacing: 0.1em;
	padding: 1vw;
	text-transform: uppercase;
}

.landing-menu li a:hover {
	border-bottom: 4px solid #c3d65a;
}

.landing-menu li a:focus {
}

.landing .scroll {
	display: none;
}
	
	
/* Landing: Mosaic */
.mosaic {
	left: 0;
	position: absolute;
	top: 0;
	z-index: 0;
}

.landing .mosaic {
	background: #1476b4;
}

.landing .mosaic .mosaic-tile.first {
	background: url('../images/landing/grid/topleft.jpg') center center no-repeat;
	background-size: cover;
}

.landing .mosaic .mosaic-tile.second {
	background: url('../images/landing/grid/topright.jpg') center center no-repeat;
	background-size: cover;
}

.landing .mosaic .mosaic-tile.third {
	background: url('../images/landing/grid/middleleft.jpg') center center no-repeat;
	background-size: cover;
}

.landing .mosaic .mosaic-tile.fourth {
	background: url('../images/landing/grid/bottomleft.jpg') center center no-repeat;
	background-size: cover;
}

.landing .mosaic .mosaic-tile.fifth {
	background: url('../images/landing/grid/bottomcenter.jpg') center center no-repeat;
	background-size: cover;
}

.landing .mosaic .mosaic-tile.sixth {
	background: url('../images/landing/grid/bottomright.jpg') center center no-repeat;
	background-size: cover;
}


/* All Projects (2, 3, 4) */
/* ------------------- */
.home-section .content-area {
	padding: 0 12vw;
}

.home-section .content-area .inner {
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

.home-section .content-area h1 {
	color: #40688a;
}

.home-section .content-area .small, 
.home-section .content-area .summary, 
.home-section .content-area .button-one {
	margin-left: 6vw;
}

.home-section .content-area .small {
	margin-bottom: 1vw;
	margin-top: 3em;
}

.home-section .infographic {
	background: #c3d65a;
	overflow: hidden;
}

.home-section .infographic img {
	height: auto;
	width: 100%;
}


/* Quiport (Section 2) */
/* ------------------- */
.home .section.quiport {
	background: #ffffff;
}

.home .section.quiport .media {
	background: #ffffff;
}

.home .section.quiport .media .image-1 {
	background: url('../images/landing/quiport/q-1.jpg') center center no-repeat;
	background-size: cover;
}

.home .section.quiport .media .image-2 {
	background: #c3d65a;
}

.home .section.quiport .media .image-2 .inner-bg {
	background: url('../images/landing/quiport/q-2.jpg') center center no-repeat;
	background-size: cover;
	display: block;
	height: 100%;
	opacity: 0.25;
	-moz-opacity: 0.25;
	width: 100%;
}

.home .section.quiport .infographic {
	background: #c3d65a;
}


/* MEII (Section 3) */
/* ---------------- */
.home .section.meii {
	background: #f3f3f3;
}

.home .section.meii .content-area {
	background: #f3f3f3;
}

.home .section.meii .media {
	background: #f3f3f3;
}

.home .section.meii .image-1 {
	background: url('../images/landing/meii/m-1.jpg') center center no-repeat;
	background-size: cover;
}

.home .section.meii .image-2 {
	background: #8176a9;
}

.home .section.meii .image-2 .inner-bg {
	width: 100%;
	height: 100%;
	display: block;
	background: url('../images/landing/meii/m-2.jpg') center center no-repeat;
	background-size: cover;
	-moz-opacity: 0.2;
	opacity: 0.2;
}

.home .section.meii .infographic {
	background: #8176a9;
}


/* Alistair (Section 4) */
/* -------------------- */
.home .section.alistair {
	background: #ffffff;
}

.home .section.alistair .media {
	background: #ffffff;
}

.home .section.alistair .image-1 {
	background: url('../images/landing/alistair/a-1.jpg') center center no-repeat;
	background-size: cover;
}

.home .section.alistair .image-2 {
	background: #75beb8;
}

.home .section.alistair .image-2 .inner-bg {
	background: url('../images/landing/alistair/a-2.jpg') center center no-repeat;
	background-size: cover;
	display: block;
	height: 100%;
	-moz-opacity: 0.33;
	opacity: 0.33;
	width: 100%;
}

.home .section.alistair .infographic {
	background: #75beb8;
}







/* All Pages */
/* ------------------------------------------------------------------------------------ */

/* Social Icons */
/* ------------ */
.social-menu {
	display: block;
	height: 270px;
	position: absolute;
	right: 2vw;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	margin-top: -126px;
	z-index: 1000;
}

.social-menu .social-link {
	cursor: pointer;
	height: 3em;
	background-size: 3em;
	margin: 0.5em auto;
	text-indent: -9999px;
	width: 3em;
}

.social-menu a {
	display: block;
	height: 100%;
	width: 100%;
}

.social-menu .tw {
	background: url('../images/icon__twitter.png') center center no-repeat transparent;
	background: url('../images2/share/twitter.svg') center center no-repeat transparent;
	background-size: 3em;
}

.social-menu .fb {
	background: url('../images/icon__facebook.png') center center no-repeat transparent;
	background: url('../images2/share/facebook.svg') center center no-repeat transparent;
	background-size: 3em;
}

.social-menu .gp {
	background: url('../images/icon__googleplus.png') center center no-repeat transparent;
	background: url('../images2/share/google.svg') center center no-repeat transparent;
	background-size: 3em;
}

.social-menu .em {
	background: url('../images/icon__email.png') center center no-repeat transparent;
	background: url('../images2/share/mail.svg') center center no-repeat transparent;
	background-size: 3em;
}

.social-menu .menu-text {
	color: #ffffff;
	text-align: center;
	text-transform: lowercase;
}


/* Footer */
/* ------ */
.footer {
	padding: 4.25em 0 2.75em;
}

.footer .logo {
	background: url('../images/opic__logo_sm.png') center top no-repeat transparent;
	background-size: 100% auto;
	height: 110px;
	margin: 0 auto;
	text-indent: -9999px;
	width: 110px;
}

.footer .menu {
	font-size: 0.8125em;
	font-weight: 500;
}

.footer .menu li {
	display: inline-block;
}

.footer .menu li a {
	color: #767773;
}

.footer .copyright {
	color: #767773;
	font-size: 0.8125em;
	font-weight: 500;
}



/* merge with above !!! */
.footer {
	width: 100% !important;
	padding: 4.25em 6vw 2.75em;
	display: block;
	float: left;
	position: relative;
	background: #f3f3f3;
}
.footer .logo {
	width: 140px;
	height: 140px;
	margin: 0;
	position: relative;
	top: auto !important;
	left: auto;
	background: url('../images/opic__logo_sm_color.png') center top no-repeat transparent;
	background: url('../images/svg/svg_logo__color.svg') center top no-repeat transparent;
	background-size: 100% auto;
	text-indent: -9999px;
}
.footer .button-container {
	text-align: center;
}
.footer .button {
	margin-top: 0.5em;
}
.footer h2 {
	font-size: 1.5em;
	letter-spacing: -0.025em;
}
.footer .footer-message {
	margin-bottom: 10vh;
}
.footer .footer-message p {
	font-family: "proxima-nova", Helvetica, sans-serif;
	font-size: 16px;
	font-weight: 500;
	line-height: 28px;
}
.footer .copyright {
	color: #767773;
	font-size: 0.8125em;
	font-weight: 500;
}
.footer .site-credit {
	color: #767773;
	font-size: 0.8125em;
	font-weight: 500;
}


.footer .menu {
	margin-left: -1vw;
	font-size: 0.8125em;
	font-weight: 500;
	line-height: 1.4em;
}
.footer .menu li {
	display: inline-block;
}
.footer .menu li:after {
	content: '|';
	font-weight: 600;
}
.footer .menu li:last-child:after {
	display: none;
}
.footer .menu li a, .footer .menu li span {
	padding: 0 1vw;
	color: #767773;
}


.footer .social-footer {
	padding-bottom: 2em;
}

.footer .social-footer .menu {
	float: right;
}

.footer .social-footer .menu li {
	width: 26px;
	height: 26px;
	margin: 0 0.5vw;
	text-indent: -9999px;
}

.footer .social-footer .menu li:after {
	display: none;
}

.footer .social-footer .menu li div {
	width: 26px;
	height: 26px;
}

.footer .social-footer .menu li a {
	width: 100%;
	height: 100%;
	padding: 0;
	display: block;
}

.footer .social-footer .menu li .fb {
	background: url('../images/footer__facebook.png') center center no-repeat;
	background-size: 100% auto;
}

.footer .social-footer .menu li .tw {
	background: url('../images/footer__twitter.png') center center no-repeat;
	background-size: 100% auto;
}

.footer .social-footer .menu li .li {
	background: url('../images/footer__linkedin.png') center center no-repeat;
	background-size: 100% auto;
}

.footer .social-footer .menu li .yt {
	background: url('../images/footer__youtube.png') center center no-repeat;
	background-size: 100% auto;
}

.footer .social-footer .menu li .ig {
	background: url('../images/footer__instagram.png') center center no-repeat;
	background-size: 100% auto;
}
/* merge with above !!! */



















/* Layout and Sections */
/* ------------------------------------------------------------------------------------ */

.main-content {
	display: block;
	float: left;
	width: 100% !important;
}

aside {
	width: 100%;
	display: block;
	float: left;
}

.section {
	overflow: hidden;
}

.section-content {
	position: relative;
	z-index: 1;
}


/* Container padding */
/* ----------------- */
section.remove-container-padding .container-fluid {
	padding: 0;
}

section.remove-container-padding .container-fluid > .row {
	margin: 0;
}

section.remove-container-padding .container-fluid > .row > [class*="col"] {
	padding: 0;
}




/* Section padding */
/* --------------- */
.section.add-padding {
	padding-top: 22vh;
	padding-bottom: 22vh;
}

.section.pad-bottom {
	padding-bottom: 22vh;
}



/* Content padding */
/* --------------- */
.content-padding {
	padding: 0 6vw !important;
	position: relative;
	/* 
-webkit-transform-style: preserve-3d; 
	-moz-transform-style: preserve-3d; 
	transform-style: preserve-3d;
 */
}
.content-padding .content-inner {
	position: relative;
	top: 10vh;
	/* 
top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
 */
}

/* Top align first section content with image */
.section.first .content-padding .content-inner {
	top: 1vw;
	-webkit-transform: none;
	-ms-transform: none;
	transform: none;
}

.content-image {
	/*  overflow: hidden;  */
}

.content-image img {
	width: 100%;
	height: auto;
}

.content-image.quote {
	overflow: hidden;
}

.content-image.quote img {
	width: 100%;
	height: 100%;
}



/* Overlays */
/* --------------- */
.dark-overlay {
	background: rgba(0, 0, 0, 0.4);
	display: block;
	height: 340vh;
	position: absolute;
	width: 100%;
	z-index: 1;
}
.darker-overlay {
	background: rgba(0, 0, 0, 0.5);
	display: block;
	height: 400vh;
	position: absolute;
	z-index: 1;
	width: 100%;
}
.slide-overlay {
	background: rgba(0, 0, 0, 0.6);
	display: block;
	height: 100%;
	position: absolute;
	width: 100%;
	z-index: 1;
}






/* All Stories */
/* ------------------------------------------------------------------------------------ */

/* Story: Header */
/* ------------- */
.story .header {
	background: rgba(0, 0, 0, 0.3);
	height: 68vh;
	overflow: hidden;
	position: relative;
}

.story .header .inner {
	padding-top: 3em;
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	z-index: 20;
}

.story .header .header-content {
	padding: 1em 6vw 0;
}

.story .header .header-content a.return-link {
	position: absolute;
	top: 0;
	color: #ffffff;
	font-size: 12px;
	font-weight: 900;
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

.story .header .header-content a.return-link:before {
	content: '< ';
}

.story .header h1 {
	margin-bottom: 0.25em;
	font-size: 62px;
	line-height: 82px;
}

.story .header p.summary {
	width: 32vw;
	font-size: 21px;
	line-height: 32px;
}

.story .header .mosaic {
	height: 100%;
}










.story h2 {
	margin-top: 0;
	color: #40688a;
	font-size: 24px;
	font-size: 3.75vh;
	font-weight: 500;
	text-transform: uppercase;
	line-height: 28px;
	line-height: 4vh;
}




/* Story: Highlighted */
/* ------------------ */
.story .highlighted {
	height: 84vh;
}

.story .highlighted > .container-fluid {
	height: 100%;
}

.story .highlighted > .container-fluid>.row {
	height: 100%;
}

.story .highlighted h2 {
	color: #ffffff;
}

.story .highlighted p {
	color: #ffffff;
}

.story .highlighted .call-out-wrapper {
	position: relative;
}

.story .highlighted .call-out-wrapper .call-out {
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}






.full-image .text-area, .full-image .text-area-2, .full-image .text-area-3 {
	width: 100%;
	position: relative;
	z-index: 2;
}



/* Story: Related Posts */
/* -------------------- */
.related-posts {
	height: 84vh;
	position: relative;
	background: #ffffff;
	color: #ffffff;
}

.related-posts h3 {
	color: #ffffff;
}

.related-posts p {
	color: #ffffff;
}

.related-posts .button.button-one {
	background: #ffffff;
}

.related-posts>.container-fluid {
	height: 100%;
}

.related-posts>.container-fluid>.row {
	height: 100%;
}

.related-posts>.container-fluid>.row>[class*="col"]>.row {
	height: 100%;
}

.related-posts .bg-image {
	background: rgba(0, 0, 0, 0.2);
}

.related-posts .quiport {
	background: #c3d65a;
}

.related-posts .quiport .bg-image {
	background: url('../images/related/related__quiport.png') center center no-repeat;
	background-size: cover;
}

.related-posts .quiport .button.button-one {
	color: #c3d65a;
}

.related-posts .west-bank {
	background: #8176a9;
}

.related-posts .west-bank .bg-image {
	background: url('../images/related/related__west_bank.jpg') center center no-repeat;
	background-size: cover;
}

.related-posts .west-bank .button.button-one {
	color: #8176a9;
}

.related-posts .alistair {
	background: #75beb8;
}

.related-posts .alistair .bg-image {
	background: url('../images/related/related__alistair.jpg') center center no-repeat;
	background-size: cover;
}

.related-posts .alistair .button.button-one {
	color: #75beb8;
}









/* Story: Related Posts */
/* -------------------- */
.related-posts {
	height: 84vh;
	position: relative;
	background: #ffffff;
	color: #ffffff;
}

.related-posts h3 {
	color: #ffffff;
}

.related-posts p {
	color: #ffffff;
}

.related-posts .button.button-one {
	background: #ffffff;
}

.related-posts>.container-fluid {
	height: 100%;
}

.related-posts>.container-fluid>.row {
	height: 100%;
}

.related-posts>.container-fluid>.row>[class*="col"]>.row {
	height: 100%;
}

.related-posts .bg-image {
	background: rgba(0, 0, 0, 0.2);
}

.related-posts .quiport {
	background: #c3d65a;
}

.related-posts .quiport .bg-image {
	background: url('../images/related/related__quiport.png') center center no-repeat;
	background-size: cover;
}

.related-posts .quiport .button.button-one {
	color: #c3d65a;
}

.related-posts .west-bank {
	background: #8176a9;
}

.related-posts .west-bank .bg-image {
	background: url('../images/related/related__west_bank.jpg') center center no-repeat;
	background-size: cover;
}

.related-posts .west-bank .button.button-one {
	color: #8176a9;
}

.related-posts .alistair {
	background: #75beb8;
}

.related-posts .alistair .bg-image {
	background: url('../images/related/related__alistair.jpg') center center no-repeat;
	background-size: cover;
}

.related-posts .alistair .button.button-one {
	color: #75beb8;
}


/* Stories: Quiport */
/* ------------------------------------------------------------------------------------ */

/* Quiport: Header */
/* --------------- */
.quiport .header .mosaic .mosaic-tile.first {
	background: url('../images2/quiport/grid/lefttop.jpg') center center no-repeat;
	background-size: cover;
}

.quiport .header .mosaic .mosaic-tile.second {
	background: url('../images2/quiport/grid/leftbottom.jpg') center center no-repeat;
	background-size: cover;
}

.quiport .header .mosaic .mosaic-tile.third {
	background: url('../images2/quiport/grid/center.jpg') center center no-repeat;
	background-size: cover;
}

.quiport .header .mosaic .mosaic-tile.fourth {
	background: url('../images2/quiport/grid/right.jpg') center center no-repeat;
	background-size: cover;
}

.quiport .header {
	background: #c3d65a;
}

.quiport .header h2 {
	color: #ffffff;
}

.quiport .header p {
	color: #ffffff;
}

.quiport .header .summary {
	width: auto;
}

.quiport .highlighted {
	position: relative;
	background: #c3d65a;
}


/* slider */
.slider-wrapper {
	height: 100vh;
	position: relative;
}

.slider-wrapper .bx-wrapper,
.slider-wrapper .bx-viewport,
.slider-wrapper ul,
.slider-wrapper li {
	height: 100%;
}

.slider-wrapper .bx-wrapper {
    border: 0;
	-moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    width: 100%;
}

.slider-wrapper .bx-wrapper .bx-pager {
	bottom: 4em;
	margin-left: -5px;
	padding: 2em 6vw 0;
	text-align: left;
}
.slider-wrapper .bx-wrapper .bx-pager.bx-default-pager a {
	background: rgba(255,255,255,0.8);
}
.slider-wrapper .bx-wrapper .bx-pager.bx-default-pager a.active, 
.slider-wrapper .bx-wrapper .bx-pager.bx-default-pager a:focus, 
.slider-wrapper .bx-wrapper .bx-pager.bx-default-pager a:hover {
	background: #c3d65a;
}

.slider-wrapper .bx-wrapper .bx-controls-direction a { 
	width: 20px; 
	height: 35px; 
}
.slider-wrapper .bx-wrapper .bx-prev,
.slider-wrapper .bx-wrapper .bx-prev:hover,
.slider-wrapper .bx-wrapper .bx-prev:focus { 
	background: url('./slider/images/arrow_l.png') center center no-repeat; 
	background-size: auto 100%; 
	left: 30px; 
}
.slider-wrapper .bx-wrapper .bx-next,
.slider-wrapper .bx-wrapper .bx-next:hover,
.slider-wrapper .bx-wrapper .bx-next:focus { 
	background: url('./slider/images/arrow_r.png') center center no-repeat; 
	background-size: auto 100%; 
	right: 30px; 
}



.quiport .full-image.w-text {
	height: 100vh;
	position: relative;
	/* 
background: url('../images2/quiport/q-slide1-1-v2.jpg') center center no-repeat;
	background-size: cover;
	-webkit-transition: background 400ms linear;
	-moz-transition: background 400ms linear;
	-ms-transition: background 400ms linear;
	-o-transition: background 400ms linear;
	transition: background 400ms linear;
 */
}

/* 
.quiport .full-image.w-text.bg-2 {
	height: 100vh;
	position: relative;
	background: url('../images2/quiport/q-slide1-2-v2.jpg') center center no-repeat;
	background-size: cover;
}

.quiport .full-image.w-text.bg-3 {
	height: 100vh;
	position: relative;
	background: url('../images2/quiport/q-slide1-3.jpg') center center no-repeat;
	background-size: cover;
}
 */

.quiport .full-image.w-text .text-area {
	position: absolute;
	bottom: 6em;
}

.quiport .full-image.w-text h2, .quiport .full-image.w-text p {
	color: #ffffff;
}

.quiport .full-image.centered-quote .text-area {
	width: 100%;
	position: absolute;
	top: 50%;
	bottom: auto !important;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

.quiport .full-image.centered-quote {
	height: 112vh;
	margin-bottom: 22vh;
	position: relative;
	background: url('../images2/alistair/a-3-slide1.jpg') center center no-repeat;
	background-size: cover;
	-webkit-transition: background 400ms linear;
	-moz-transition: background 400ms linear;
	-ms-transition: background 400ms linear;
	-o-transition: background 400ms linear;
	transition: background 400ms linear;
}

.quiport .full-image.centered-quote .text-area {
	position: absolute;
	bottom: 4vw;
}

.quiport .full-image.centered-quote h2, .quiport .full-image.centered-quote p {
	color: #ffffff;
}

.quiport .full-image.no-text {
	height: 84vh;
	position: relative;
	background: #ffffff;
}

.quiport .full-image.no-text .fill-bg {
	width: 100%;
	height: 100%;
	display: block;
	background: url('../images2/quiport/q-9.jpg') center center no-repeat #ffffff;
	background-size: cover;
}

.quiport .highlighted .bg-image {
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	background: url('../images2/quiport/q-6.jpg') center center no-repeat;
	background-size: cover;
	opacity: 0.2;
}

.quiport .highlighted .call-out {
	position: relative;
	z-index: 2;
}

.quiport .highlighted .button.button-one {
	background: #ffffff;
	color: #c3d65a;
}

.quiport .full-image.no-text.quiport-full-img {
	height: 104vh;
	position: relative;
	background: #ffffff;
}

.quiport .full-image.no-text.quiport-full-img .fill-bg {
	width: 100%;
	height: 100%;
	display: block;
	background: url('../images2/quiport/q-9-v2.png') center center no-repeat #ffffff;
	background-size: cover;
}


.quiport .full-image.no-text.section-nine-a {
	width: 100%;
	height: 63vh;
	display: block;
	margin-bottom: 16vh;
	background: url('../images2/quiport/q-extra-1.jpg') center center no-repeat #ffffff;
	background-size: 100%;
}













/* Stories: MEII */
/* ------------------------------------------------------------------------------------ */

/* MEII: Header */
/* ------------ */
.meii .header .mosaic .mosaic-tile.first {
	background: url('../images2/meii/grid/topleft.jpg') center center no-repeat;
	background-size: cover;
}

.meii .header .mosaic .mosaic-tile.second {
	background: url('../images2/meii/grid/bottomleft.jpg') center center no-repeat;
	background-size: cover;
}

.meii .header .mosaic .mosaic-tile.third {
	background: url('../images2/meii/grid/center.jpg') center center no-repeat;
	background-size: cover;
}

.meii .header .mosaic .mosaic-tile.fourth {
	background: url('../images2/meii/grid/right.jpg') center center no-repeat;
	background-size: cover;
}

.meii .header {
	background: #8177a7;
}

.meii .header h2 {
	color: #ffffff;
}

.meii .header p {
	color: #ffffff;
}

.meii .header .summary {
	width: auto;
}

.meii .highlighted {
	background: #8177a7;
}

.meii .full-image.w-text {
	height: 84vh;
	position: relative;
	background: url('../images2/meii/m-3-slide1-v2.jpg') center center no-repeat;
	background-size: cover;
	-webkit-transition: background 400ms linear;
	-moz-transition: background 400ms linear;
	-ms-transition: background 400ms linear;
	-o-transition: background 400ms linear;
	transition: background 400ms linear;
}

.meii .full-image.w-text .text-area {
	position: absolute;
	bottom: 4vw;
}

.meii .full-image.w-text h2, .meii .full-image.no-text p,
.meii .full-image.w-text h2, .meii .full-image.w-text p {
	color: #ffffff;
}

.meii .full-image.section-zero {
	height: 84vh;
	position: relative;
	background: url('../images2/meii/m-0-v1.jpg') center center no-repeat;
	background-size: cover;
}

.meii .full-image.section-zero.centered-quote .text-area,
.meii .full-image.section-nine.centered-quote .text-area {
	width: 100%;
	position: absolute;
	top: 50%;
	bottom: auto !important;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

.meii .full-image.w-text.image-2 {
	height: 84vh;
	position: relative;
	background: url('../images2/meii/m-3-slide2-v2.jpg') center center no-repeat;
	background-size: cover;
}

.meii .full-image.no-text {
	height: 84vh;
	background: url('../images2/meii/m-5-v2.jpg') center center no-repeat;
	background-size: cover;
}

.meii .full-image.no-text.image-3 {
	height: 84vh;
	background: url('../images2/meii/m-9-v2.jpg') center center no-repeat;
	background-size: cover;
}

.meii .highlighted .bg-image {
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	background: url('../images2/meii/m-6.jpg') center center no-repeat;
	background-size: cover;
	opacity: 0.4;
}

.meii .highlighted .call-out {
	position: relative;
	z-index: 2;
}

.meii .highlighted .button.button-one {
	background: #ffffff;
	color: #8176a9;
}



/* Stories: Alistair */
/* ------------------------------------------------------------------------------------ */

/* Alistair: Header */
/* ---------------- */
.alistair .header .mosaic .mosaic-tile.first {
	background: url('../images2/alistair/grid/topleft.jpg') center center no-repeat;
	background-size: cover;
}

.alistair .header .mosaic .mosaic-tile.second {
	background: url('../images2/alistair/grid/bottomleft.jpg') center center no-repeat;
	background-size: cover;
}

.alistair .header .mosaic .mosaic-tile.third {
	background: url('../images2/alistair/grid/center.jpg') center center no-repeat;
	background-size: cover;
}

.alistair .header .mosaic .mosaic-tile.fourth {
	background: url('../images2/alistair/grid/right.jpg') center center no-repeat;
	background-size: cover;
}

.alistair .header {
	background: #75beb8;
}

.alistair .header h2 {
	color: #ffffff;
}

.alistair .header p {
	color: #ffffff;
}

.alistair .header .summary {
	width: auto;
}

.alistair .highlighted {
	background: #75beb8;
}

.alistair .full-image.w-text {
	height: 84vh;
	position: relative;
	background: url('../images2/alistair/a-3-slide1.jpg') center center no-repeat;
	background-size: cover;
	-webkit-transition: background 400ms linear;
	-moz-transition: background 400ms linear;
	-ms-transition: background 400ms linear;
	-o-transition: background 400ms linear;
	transition: background 400ms linear;
}

.alistair .full-image.w-text .text-area {
	position: absolute;
	bottom: 4vw;
}

.alistair .full-image.w-text h2, .alistair .full-image.w-text p {
	color: #ffffff;
}

.alistair .full-image.w-text.centered-quote .text-area {
	width: 100%;
	position: absolute;
	top: 50%;
	bottom: auto !important;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

.centered-quote blockquote p {
	margin: 0 0 2vw;
	font-size: 4em;
	font-size: 4.5vw;
	font-style: italic;
	font-weight: 300;
	line-height: 5vw;
}

.centered-quote blockquote footer {
	color: rgba(255, 255, 255, 0.5);
	font-size: 1em;
	font-size: 1.5vw;
	font-style: normal;
	font-weight: 400;
	text-transform: uppercase;
}

.alistair .full-image.w-text.quote .text-area {
	width: 100%;
	position: absolute;
	top: 50%;
	bottom: auto !important;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

.full-image.w-text.quote blockquote p {
	margin: 0 0 2vw;
	font-size: 2em;
	font-size: 2.5vw;
	font-style: italic;
	font-weight: 300;
	line-height: 3vw;
}

.full-image.w-text.quote blockquote footer {
	color: rgba(255, 255, 255, 0.5);
	font-size: 0.8em;
	font-size: 1.2vw;
	font-style: normal;
	font-weight: 400;
	text-transform: uppercase;
}

.content-image.quote blockquote {
	width: 75%;
	position: absolute;
	bottom: 4vw;
	left: 4vw;
	z-index: 1;
}

.content-image.quote blockquote p {
	margin: 0 0 2vw;
	color: #ffffff;
	font-size: 2em;
	font-size: 2.5vw;
	font-style: italic;
	font-weight: 300;
	line-height: 3vw;
}

.content-image.quote blockquote footer {
	color: rgba(255, 255, 255, 0.5);
	font-size: 0.8em;
	font-size: 1.2vw;
	font-style: normal;
	font-weight: 400;
	text-transform: uppercase;
}

.alistair .full-image.w-text.full-2 {
	height: 84vh;
	position: relative;
	background: url('../images2/alistair/a-4.jpg') center center no-repeat;
	background-size: cover;
}

.alistair .full-image.w-text.full-2 .text-area {
	position: absolute;
	bottom: 4vw;
}

.alistair .full-image.w-text.full-2 h2, .alistair .full-image.w-text.full-2 p {
	color: #ffffff;
}

.alistair .full-image.w-text.full-3 {
	height: 84vh;
	position: relative;
	background: url('../images2/alistair/a-10.jpg') center center no-repeat;
	background-size: cover;
}

.alistair .full-image.w-text.full-3 .text-area {
	position: absolute;
	bottom: 4vw;
}

.alistair .full-image.w-text.full-3 h2, .alistair .full-image.w-text.full-3 p {
	color: #ffffff;
}

.alistair .full-image.w-text.full-4 {
	height: 84vh;
	position: relative;
	background: url('../images2/alistair/a-13.jpg') center center no-repeat;
	background-size: cover;
}

.alistair .full-image.w-text.full-4 .text-area {
	position: absolute;
	bottom: 4vw;
}

.alistair .full-image.w-text.full-4 h2, .alistair .full-image.w-text.full-4 p {
	color: #ffffff;
}

.alistair .full-image.no-text {
	height: 84vh;
	background: url('../images/alistair/alistair__image_108.png') center center no-repeat;
	background-size: cover;
}

.alistair .highlighted .bg-image {
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	background: url('../images2/alistair/a-7.jpg') center center no-repeat;
	background-size: cover;
	opacity: 0.2;
}

.alistair .highlighted .call-out {
	position: relative;
	z-index: 2;
}

.alistair .highlighted .button.button-one {
	background: #ffffff;
	color: #75beb8;
}














/* landing animation */

.moveDown .content-area .inner {
	position: absolute;
	z-index: 1;
	display: block;
	-webkit-transition: all 0.8s ease-out;
	-moz-transition: all 0.8s ease-out;
	-o-transition: all 0.8s ease-out;
	transition: all 0.8s ease-out;
	transition-delay: 0.15s;
}
.moveDown.moveUp .content-area .inner {
	top: 50%;
	opacity: 1;
}
.moveDown.moveDown .content-area .inner {
	top: 90%;
	opacity: 0;
}
.moveDown.active .content-area .inner {
	top: 50%;
	opacity: 1;
}
.quiport.moveDown .media-block-1 {
	display: block;
	position: relative;
	z-index: 1;
	-webkit-transition: all 0.7s ease-out;
	-moz-transition: all 0.7s ease-out;
	-o-transition: all 0.7s ease-out;
	transition: all 0.7s ease-out;
}
.quiport.moveDown.moveUp .media-block-1 {
	left: 0%;
	opacity: 1;
}
.quiport.moveDown.moveDown .media-block-1 {
	left: 100%;
	opacity: 0;
}
.quiport.moveDown.active .media-block-1 {
	left: 0%;
	opacity: 1;
}
.quiport.moveUp.active .media-block-1 {
	left: 0%;
	opacity: 1;
}
.quiport.moveDown .media-block-2 {
	display: block;
	position: relative;
	z-index: 1;
	-webkit-transition: all 0.8s ease-out;
	-moz-transition: all 0.8s ease-out;
	-o-transition: all 0.8s ease-out;
	transition: all 0.8s ease-out;
}
.quiport.moveDown.moveUp .media-block-2 {
	left: 0%;
	opacity: 1;
}
.quiport.moveDown.moveDown .media-block-2 {
	left: -100%;
	opacity: 0;
}
.quiport.moveDown.active .media-block-2 {
	left: 0%;
	opacity: 1;
}
.quiport.moveUp.active .media-block-2 {
	left: 0%;
	opacity: 1;
}
.quiport.moveDown .media-block-3 {
	display: block;
	position: relative;
	z-index: 1;
	-webkit-transition: all 0.7s ease-out;
	-moz-transition: all 0.7s ease-out;
	-o-transition: all 0.7s ease-out;
	transition: all 0.7s ease-out;
}
.quiport.moveDown.moveUp .media-block-3 {
	top: 0%;
	opacity: 1;
}
.quiport.moveDown.moveDown .media-block-3 {
	top: 100%;
	opacity: 0;
}
.quiport.moveDown.active .media-block-3 {
	top: 0%;
	opacity: 1;
}
.quiport.moveUp.active .media-block-3 {
	top: 0%;
	opacity: 1;
}
.meii.moveDown .media-block-1 {
	display: block;
	position: relative;
	z-index: 1;
	-webkit-transition: all 0.7s ease-out;
	-moz-transition: all 0.7s ease-out;
	-o-transition: all 0.7s ease-out;
	transition: all 0.7s ease-out;
}
.meii.moveDown.moveUp .media-block-1 {
	left: 0%;
	opacity: 1;
}
.meii.moveDown.moveDown .media-block-1 {
	left: -100%;
	opacity: 0;
}
.meii.moveDown.active .media-block-1 {
	left: 0%;
	opacity: 1;
}
.meii.moveUp.active .media-block-1 {
	left: 0%;
	opacity: 1;
}
.meii.moveDown .media-block-2 {
	display: block;
	position: relative;
	z-index: 1;
	-webkit-transition: all 0.8s ease-out;
	-moz-transition: all 0.8s ease-out;
	-o-transition: all 0.8s ease-out;
	transition: all 0.8s ease-out;
}
.meii.moveDown.moveUp .media-block-2 {
	top: 0%;
	opacity: 1;
}
.meii.moveDown.moveDown .media-block-2 {
	top: -100%;
	opacity: 0;
}
.meii.moveDown.active .media-block-2 {
	top: 0%;
	opacity: 1;
}
.meii.moveUp.active .media-block-2 {
	top: 0%;
	opacity: 1;
}
.meii.moveDown .media-block-3 {
	display: block;
	position: relative;
	z-index: 1;
	-webkit-transition: all 0.7s ease-out;
	-moz-transition: all 0.7s ease-out;
	-o-transition: all 0.7s ease-out;
	transition: all 0.7s ease-out;
}
.meii.moveDown.moveUp .media-block-3 {
	bottom: 0%;
	opacity: 1;
}
.meii.moveDown.moveDown .media-block-3 {
	bottom: -100%;
	opacity: 0;
}
.meii.moveDown.active .media-block-3 {
	bottom: 0%;
	opacity: 1;
}
.meii.moveUp.active .media-block-3 {
	bottom: 0%;
	opacity: 1;
}
.alistair.moveDown .media-block-1 {
	display: block;
	position: relative;
	z-index: 1;
	-webkit-transition: all 0.7s ease-out;
	-moz-transition: all 0.7s ease-out;
	-o-transition: all 0.7s ease-out;
	transition: all 0.7s ease-out;
}
.alistair.moveDown.moveUp .media-block-1 {
	left: 0%;
	opacity: 1;
}
.alistair.moveDown.moveDown .media-block-1 {
	left: -100%;
	opacity: 0;
}
.alistair.moveDown.active .media-block-1 {
	left: 0%;
	opacity: 1;
}
.alistair.moveUp.active .media-block-1 {
	left: 0%;
	opacity: 1;
}
.alistair.moveDown .media-block-2 {
	display: block;
	position: relative;
	z-index: 1;
	-webkit-transition: all 0.8s ease-out;
	-moz-transition: all 0.8s ease-out;
	-o-transition: all 0.8s ease-out;
	transition: all 0.8s ease-out;
}
.alistair.moveDown.moveUp .media-block-2 {
	top: 0%;
	opacity: 1;
}
.alistair.moveDown.moveDown .media-block-2 {
	top: -100%;
	opacity: 0;
}
.alistair.moveDown.active .media-block-2 {
	top: 0%;
	opacity: 1;
}
.alistair.moveUp.active .media-block-2 {
	top: 0%;
	opacity: 1;
}
.alistair.moveDown .media-block-3 {
	display: block;
	position: relative;
	z-index: 1;
	-webkit-transition: all 0.7s ease-out;
	-moz-transition: all 0.7s ease-out;
	-o-transition: all 0.7s ease-out;
	transition: all 0.7s ease-out;
}
.alistair.moveDown.moveUp .media-block-3 {
	left: 0%;
	opacity: 1;
}
.alistair.moveDown.moveDown .media-block-3 {
	left: 100%;
	opacity: 0;
}
.alistair.moveDown.active .media-block-3 {
	left: 0%;
	opacity: 1;
}
.alistair.moveUp.active .media-block-3 {
	left: 0%;
	opacity: 1;
}
/* landing animation */

/* make keyframes that tell the start state and the end state of our object */

@-webkit-keyframes fadeIn {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}
@-moz-keyframes fadeIn {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}
@keyframes fadeIn {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}
.fade-in {
	opacity: 0;
	/* make things invisible upon start */
	-webkit-animation: fadeIn ease-in 1;
	/* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
	-moz-animation: fadeIn ease-in 1;
	animation: fadeIn ease-in 1;
	-webkit-animation-fill-mode: forwards;
	/* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
	-moz-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
	-webkit-animation-duration: 1s;
	-moz-animation-duration: 1s;
	animation-duration: 1s;
}
.fade-in.one {
	-webkit-animation-delay: 0.2s;
	-moz-animation-delay: 0.2s;
	animation-delay: 0.2s;
}
.fade-in.two {
	-webkit-animation-delay: 0.5s;
	-moz-animation-delay: 0.5s;
	animation-delay: 0.5s;
}
.fade-in.three {
	-webkit-animation-delay: 0.7s;
	-moz-animation-delay: 0.7s;
	animation-delay: 0.7s;
}
/*---make a basic box ---*/

.box {
	width: 200px;
	height: 200px;
	position: relative;
	margin: 10px;
	float: left;
	border: 1px solid #333;
	background: #999;
}
/* make keyframes that tell the start state and the end state of our object */

@-webkit-keyframes fadeInGrid {
	from {
		opacity: 0;
	}
	to {
		opacity: 0.1;
	}
}
@-moz-keyframes fadeInGrid {
	from {
		opacity: 0;
	}
	to {
		opacity: 0.1;
	}
}
@keyframes fadeInGrid {
	from {
		opacity: 0;
	}
	to {
		opacity: 0.1;
	}
}
@-webkit-keyframes fadeInGrid2 {
	from {
		opacity: 0;
	}
	to {
		opacity: 0.2;
	}
}
@-moz-keyframes fadeInGrid2 {
	from {
		opacity: 0;
	}
	to {
		opacity: 0.2;
	}
}
@keyframes fadeInGrid2 {
	from {
		opacity: 0;
	}
	to {
		opacity: 0.2;
	}
}
@-webkit-keyframes fadeIn {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}
@-moz-keyframes fadeIn {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}
@keyframes fadeIn {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}
.fade-in-grid {
	opacity: 0;
	/* make things invisible upon start */
	-webkit-animation: fadeInGrid ease-in 1;
	/* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
	-moz-animation: fadeInGrid ease-in 1;
	animation: fadeInGrid ease-in 1;
	-webkit-animation-fill-mode: forwards;
	/* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
	-moz-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
	-webkit-animation-duration: 1s;
	-moz-animation-duration: 1s;
	animation-duration: 1s;
}
.fade-in-grid.one {
	-webkit-animation-delay: 0.2s;
	-moz-animation-delay: 0.2s;
	animation-delay: 0.2s;
}
.fade-in-grid.two {
	-webkit-animation-delay: 0.4s;
	-moz-animation-delay: 0.4s;
	animation-delay: 0.4s;
}
.fade-in-grid.three {
	-webkit-animation-delay: 0.65s;
	-moz-animation-delay: 0.65s;
	animation-delay: 0.65s;
}
.fade-in-grid.four {
	-webkit-animation-delay: 0.8s;
	-moz-animation-delay: 0.8s;
	animation-delay: 0.8s;
}
.fade-in-grid.five {
	-webkit-animation-delay: 1s;
	-moz-animation-delay: 1s;
	animation-delay: 1s;
}
.fade-in {
	opacity: 0;
	/* make things invisible upon start */
	-webkit-animation: fadeIn ease-in 1;
	/* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
	-moz-animation: fadeIn ease-in 1;
	animation: fadeIn ease-in 1;
	-webkit-animation-fill-mode: forwards;
	/* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
	-moz-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
	-webkit-animation-duration: 1s;
	-moz-animation-duration: 1s;
	animation-duration: 1s;
}
.animation-target {
	-webkit-animation: animation 2000ms linear both;
	animation: animation 2000ms linear both;
	animation-delay: 0.2s;
}
.animation-target-2 {
	-webkit-animation: animation 2500ms linear both;
	animation: animation 2500ms linear both;
	animation-delay: 1.5s;
}
.animation-target-2b {
	-webkit-animation: animation 2000ms linear both;
	animation: animation 2000ms linear both;
	animation-delay: 1.8s;
}
/* social slide */

.animation-target-3 {
	-webkit-animation: socialslide 4000ms linear both;
	animation: socialslide 4000ms linear both;
	animation-delay: 2.5s;
}
.animation-target-4 {
	-webkit-animation: animation 2000ms linear both;
	animation: animation 2000ms linear both;
	animation-delay: 2.6s;
}
.animation-target-5 {
	-webkit-animation: socialslidehome 2000ms linear both;
	animation: socialslidehome 2000ms linear both;
	animation-delay: 1.75s;
}
.animation-target-6 {
	-webkit-animation: animation 2000ms linear both;
	animation: animation 2000ms linear both;
	animation-delay: 1.85s;
}
.anim-story-title {
	-webkit-animation: animation 1000ms linear both;
	animation: animation 1000ms linear both;
	animation-delay: 0.1s;
}
.anim-story-return {
	-webkit-animation: animation 1200ms linear both;
	animation: animation 1200ms linear both;
	animation-delay: 0.3s;
}
.anim-story-summary {
	-webkit-animation: animation 1000ms linear both;
	animation: animation 1000ms linear both;
	animation-delay: 0.2s;
}
.anim-story-share {
	-webkit-animation: socialslide 2000ms linear both;
	animation: socialslide 2000ms linear both;
	animation-delay: 0.4s;
}
.anim-story-first-slide {
	-webkit-animation: animation 1500ms linear both;
	animation: animation 1500ms linear both;
	animation-delay: 0.2s;
}
@-webkit-keyframes animation {
	0% {
		opacity: 0;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 200, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 200, 0, 1);
	}
	2.6% {
		opacity: 0.026;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 144.572, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 144.572, 0, 1);
	}
	5.21% {
		opacity: 0.052;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 102.918, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 102.918, 0, 1);
	}
	10.31% {
		opacity: 0.1;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 50.377, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 50.377, 0, 1);
	}
	15.52% {
		opacity: 0.15;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 22.496, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 22.496, 0, 1);
	}
	20.62% {
		opacity: 0.2;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 9.15, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 9.15, 0, 1);
	}
	30.93% {
		opacity: 0.3;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0.522, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0.522, 0, 1);
	}
	41.24% {
		opacity: 0.4;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, -0.479, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, -0.479, 0, 1);
	}
	100% {
		opacity: 1;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
	}
}
@keyframes animation {
	0% {
		opacity: 0;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 200, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 200, 0, 1);
	}
	2.6% {
		opacity: 0.026;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 144.572, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 144.572, 0, 1);
	}
	5.21% {
		opacity: 0.052;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 102.918, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 102.918, 0, 1);
	}
	10.31% {
		opacity: 0.1;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 50.377, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 50.377, 0, 1);
	}
	15.52% {
		opacity: 0.15;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 22.496, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 22.496, 0, 1);
	}
	20.62% {
		opacity: 0.2;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 9.15, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 9.15, 0, 1);
	}
	30.93% {
		opacity: 0.3;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0.522, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0.522, 0, 1);
	}
	41.24% {
		opacity: 0.4;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, -0.479, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, -0.479, 0, 1);
	}
	100% {
		opacity: 1;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
	}
}
/* Generated with Bounce.js. Edit at https://goo.gl/jWekZU */

@-webkit-keyframes socialslide {
	0% {
		opacity: 0;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 0, 0, 1);
	}
	2.6% {
		opacity: 0.026;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 72.286, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 72.286, 0, 0, 1);
	}
	5.21% {
		opacity: 0.052;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 51.459, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 51.459, 0, 0, 1);
	}
	10.31% {
		opacity: 0.1;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 25.188, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 25.188, 0, 0, 1);
	}
	15.52% {
		opacity: 0.15;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 11.248, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 11.248, 0, 0, 1);
	}
	20.62% {
		opacity: 0.2;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 4.575, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 4.575, 0, 0, 1);
	}
	30.93% {
		opacity: 0.3;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.261, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.261, 0, 0, 1);
	}
	41.24% {
		opacity: 0.4;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.24, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.24, 0, 0, 1);
	}
	100% {
		opacity: 1;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
	}
}
@keyframes socialslide {
	0% {
		opacity: 0;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 0, 0, 1);
	}
	2.6% {
		opacity: 0.026;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 72.286, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 72.286, 0, 0, 1);
	}
	5.21% {
		opacity: 0.052;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 51.459, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 51.459, 0, 0, 1);
	}
	10.31% {
		opacity: 0.1;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 25.188, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 25.188, 0, 0, 1);
	}
	15.52% {
		opacity: 0.15;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 11.248, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 11.248, 0, 0, 1);
	}
	20.62% {
		opacity: 0.2;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 4.575, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 4.575, 0, 0, 1);
	}
	30.93% {
		opacity: 0.3;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.261, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.261, 0, 0, 1);
	}
	41.24% {
		opacity: 0.4;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.24, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.24, 0, 0, 1);
	}
	100% {
		opacity: 1;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
	}
}
@-webkit-keyframes socialslidehome {
	0% {
		opacity: 0;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 0, 0, 1);
	}
	2.6% {
		opacity: 0.026;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 72.286, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 72.286, 0, 0, 1);
	}
	5.21% {
		opacity: 0.052;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 51.459, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 51.459, 0, 0, 1);
	}
	10.31% {
		opacity: 0.1;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 25.188, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 25.188, 0, 0, 1);
	}
	15.52% {
		opacity: 0.15;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 11.248, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 11.248, 0, 0, 1);
	}
	20.62% {
		opacity: 0.2;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 4.575, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 4.575, 0, 0, 1);
	}
	30.93% {
		opacity: 0.3;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.261, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.261, 0, 0, 1);
	}
	41.24% {
		opacity: 0.4;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.24, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.24, 0, 0, 1);
	}
	100% {
		opacity: 1;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
	}
}
@keyframes socialslidehome {
	0% {
		opacity: 0;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 0, 0, 1);
	}
	2.6% {
		opacity: 0.026;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 72.286, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 72.286, 0, 0, 1);
	}
	5.21% {
		opacity: 0.052;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 51.459, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 51.459, 0, 0, 1);
	}
	10.31% {
		opacity: 0.1;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 25.188, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 25.188, 0, 0, 1);
	}
	15.52% {
		opacity: 0.15;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 11.248, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 11.248, 0, 0, 1);
	}
	20.62% {
		opacity: 0.2;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 4.575, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 4.575, 0, 0, 1);
	}
	30.93% {
		opacity: 0.3;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.261, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.261, 0, 0, 1);
	}
	41.24% {
		opacity: 0.4;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.24, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.24, 0, 0, 1);
	}
	100% {
		opacity: 1;
		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
		transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
	}
}
.come-in {
	transform: translateY(150px);
	animation: come-in 0.8s ease forwards;
}
.come-in:nth-child(odd) {
	animation-duration: 0.6s;
}
.already-visible {
	transform: translateY(0);
	animation: none;
}
@keyframes come-in {
	to {
		transform: translateY(0);
	}
}
.stuck {
	position: fixed;
	top: 0;
}
progress {
	/* Positioning */
	z-index: 1000;
	/* Dimensions */
	width: 100%;
	height: 11px;
	float: left;
	/* Reset the apperance */
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	/* Get rid of the default border in Firefox/Opera. */
	border: none;
	/* For Firefox/IE10+ */
	background-color: #e8e8e2;
	/* For IE10+, color of the progress bar */
	color: red;
}
progress::-webkit-progress-bar {
	background-color: transparent;
}
.progress-container {
	width: 100%;
	background-color: transparent;
	position: fixed;
	top: 0;
	left: 0;
	height: .25em;
	display: block;
}
.quiport .progress-bar {
	width: 50%;
	height: inherit;
	display: block;
	background-color: #c3d65a;
	color: #c3d65a !important;
}
.quiport .flat::-webkit-progress-value {
	background-color: #c3d65a;
}
.quiport .flat::-moz-progress-bar {
	background-color: #c3d65a;
}
.quiport progress {
	color: #c3d65a !important;
}
.meii .progress-bar {
	width: 50%;
	height: inherit;
	display: block;
	background-color: #8177a7;
	color: #8177a7 !important;
}
.meii .flat::-webkit-progress-value {
	background-color: #8177a7;
}
.meii .flat::-moz-progress-bar {
	background-color: #8177a7;
}
.meii progress {
	color: #8177a7 !important;
}
.alistair .progress-bar {
	width: 50%;
	height: inherit;
	display: block;
	background-color: #75beb8;
	color: #75beb8 !important;
}
.alistair .flat::-webkit-progress-value {
	background-color: #75beb8;
}
.alistair .flat::-moz-progress-bar {
	background-color: #75beb8;
}
.alistair progress {
	color: #75beb8 !important;
}
.quiport .full-image.w-text.stuck {
	position: fixed;
	width: 100%;
	overflow: scroll;
	-webkit-overflow-scrolling: touch;
}
.quiport .full-image.w-text.stop {
	position: relative;
	overflow: hidden;
	margin-top: 6vh;
}
.quiport .full-image.w-text {
	/*  margin-bottom: 50vh;  */
}
.quiport .full-image.w-text .text-area-2 {
	width: 100%;
	position: relative;
	top: 200vh;
}
.quiport .full-image.w-text .text-area-3 {
	width: 100%;
	position: relative;
	top: 300vh;
	margin-bottom: 10vh;
}
.white-bg {
	position: relative;
	background: #ffffff;
}
#overlap {
	margin-top: 10vh;
}
#skrollr-wrapper {
	/* make sure the boxes stay in place while you scroll by wrapping them in this fixed div: */
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	z-index: 1;
	overflow: hidden;
}
#skrollr-wrapper div {
	position: absolute;
	overflow: hidden;
	text-align: center;
}
#box1 {
	background: blue;
	margin: auto;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}
#box2 {
	background: url('../images2/quiport/q-before.jpg') center center no-repeat;
	background-size: cover;
	height: 100%;
	width: 100%;
	margin-top: 0px;
}
#box2:after {
	content: 'Before';
	position: absolute;
	top: 1vw;
	right: 2vw;
	z-index: 2;
	margin: 0;
	color: #ffffff;
	font-size: 0.75em;
	font-size: 1vw;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	line-height: 1.2em;
}
.after-image img {
	height: 100%;
}
.after-image:after {
	content: 'After';
	position: absolute;
	top: 1vw;
	right: 2vw;
	z-index: 0;
	margin: 0;
	color: #ffffff;
	font-size: 0.75em;
	font-size: 1vw;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	line-height: 1.2em;
}
/*
@media screen and (max-width: 900px) {
	
	.grid-container { width: 100vw; height: 100vh; position: absolute; top: 0; left: 0; }

	.grid-1-3 { width: 34vw; height: 100vh; display: block; float: left; }
	.grid-2-3 { width: 66vw; height: 100vh; display: block; float: left; }

	.grid-1-3-split { width: 100%; height: 50vh; display: block; float: left; }
	.grid-1-3-quarter { width: 100%; height: 25vh; display: block; float: left; }

	.fluid-grid-split-1-2 { width: 50%; height: 50vh; display: block; float: left; }
	.fluid-grid-quarter-1-1 { width: 100%; height: 25vh; display: block; float: left; }


}
*/

/* Extra Small Devices, Phones */

.menu-container { display: none; }


@media only screen and (max-width: 480px) {
	body, html {
		height: auto;
		overflow: scroll !important;
		-webkit-overflow-scrolling: touch;
	}
	.home .logo {
		width: 30vw;
		height: 30vw;
		margin-left: -15vw;
		top: 16vh;
	}
	h1 {
		font-size: 12vw;
		letter-spacing: -1px;
		line-height: 11vw;
	}
	p {
		font-size: 4vw;
		line-height: 6vw;
	}
	.small {
		padding-top: 8px;
		font-size: 2.5vw;
		line-height: 3vw;
	}
	.large {
		margin-bottom: 8.5vw;
		font-size: 15.5vw;
	}
	.summary {
		width: 60vw;
		line-height: 5vw;
	}
	.caps {
		font-weight: 500;
	}
	.button {
		margin-top: 0.6em;
		padding: 1.1em 2em;
		font-size: 1.75em;
		font-weight: 800;
		text-transform: uppercase;
		letter-spacing: 0.1em;
		line-height: 1em;
	}
	
	
	
	.menu-container { 
		display: block;
		right: 6vw;
		position: fixed;
		top: 6vw; 
		z-index: 100;
	}
	
	.landing .intro h1 {
		margin-bottom: 8vw;
		font-size: 15vw;
		line-height: 15vw;
	}
	.landing-menu li a {
		padding: 3vw;
		font-size: 3.25vw;
	}
	.landing .landing-menu {
		display: none;
	}
	
	.content-padding {
		padding: 0 6vw 8vh !important;
	}
	.content-padding p:last-child {
		margin-bottom: 0;
	}
	
	.content-image.quote blockquote p,
	.centered-quote blockquote p {
		font-size: 4.5vw; 
		line-height: 5vw;
		
		margin: 0 0 4vw;
		font-size: 7.5vw;
		line-height: 7vw;
	}
	
	.content-image.quote blockquote footer,
	.centered-quote blockquote footer {
		font-size: 2.25vw;
		line-height: 4vw;
		
		font-size: 3.5vw;
		line-height: 4vw;
	}
	
	
	.content-padding .content-inner {
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}
	
	.quiport .section-one-a .content-image.quote {
		height: 68vh;
	}
	.quiport .section-one-a.default-w-quote .content-image.quote {
		height: auto;
	}
	
	.quiport .content-area, .meii .content-area, .alistair .content-area {
		padding: 0 10vw;
		position: relative;
	}
	.grid-container {
		width: 100vw;
		height: auto;
	}
	.grid-1-3 {
		width: 100vw;
		height: 50vh;
	}
	.grid-2-3 {
		width: 100vw;
		height: 50vh;
	}
	.grid-1-3-split {
		width: 100%;
		height: 25vh;
	}
	.grid-1-3-quarter {
		width: 100%;
		height: 12.5vh;
	}
	.fluid-grid-split-1-2 {
		width: 50%;
		height: 25vh;
	}
	.fluid-grid-quarter-1-1 {
		width: 100%;
		height: 12.5vh;
	}
	.section.add-padding {
		padding-top: 8vh;
		padding-bottom: 8vh;
	}
	.section.pad-bottom {
		padding-bottom: 8vh;
	}
	.meii {
		background: #ffffff;
	}
	.meii .content-area {
		position: relative;
		top: -50vh;
		background: #ffffff;
	}
	.meii .media {
		position: relative;
		top: 50vh;
	}
	.quiport .quiport-infographic, .meii .meii-infographic, .alistair .alistair-infographic {
		padding-top: 0;
	}
	.quiport .quiport-infographic svg, .meii .meii-infographic svg, .alistair .alistair-infographic svg {
		display: none;
	}
	.footer {
		width: 100%;
		padding: 4.25em 6vw 1.25em;
	}
	.footer .text-left {
		text-align: center;
	}
	.footer .logo {
		width: 110px;
		height: 110px;
		margin-bottom: 0vh;
		margin-left: 0;
		display: inline-block;
	}
	.footer .footer-message {
		margin-bottom: 0vh;
	}
	.footer .button {
		margin-bottom: 7vh;
		padding: 1.1em 1.5em;
	}
	.footer .social-footer .menu {
		width: 100%;
		margin-top: 1em;
		text-align: center;
	}
	.footer .social-footer .menu li div {
		width: 22px;
		height: 22px;
	}
	
	.slider-wrapper .bx-wrapper, .slider-wrapper .bx-viewport, .slider-wrapper ul, .slider-wrapper li {
		height: 100% !important;
	}
	
	
	/* 

	.quiport .content-area .inner,
	.meii .content-area .inner,
	.alistair .content-area .inner { position: relative; top: auto; -webkit-transform: none; -ms-transform: none; transform: none; }
	
 */
	.quiport .content-area, .meii .content-area, .alistair .content-area {
		padding: 0 5vw;
		position: relative;
	}
	.quiport .content-area .small, .meii .content-area .small, .alistair .content-area .small {
		margin-top: 2em;
		margin-bottom: 1vw;
	}
	.quiport .content-area .small, .quiport .content-area .summary, .quiport .content-area .button-one {
		margin-left: 10vw;
	}
	.quiport .quiport-infographic {
		background: #c3d65a;
	}
	.meii .meii-infographic {
		position: relative;
		top: -25vh;
		background: #8176a9;
	}
	.alistair .alistair-infographic {
		position: relative;
		top: -25vh;
		background: #75beb8;
	}
	.meii.moveDown.active .media-block-2 {
		top: 50%;
	}
	.meii.moveDown.active .media-block-2 {
		top: 50%;
		bottom: -50%;
	}
	.meii.moveUp.active .media-block-2 {
		top: 50%;
	}
	.home .section.meii .image-1 {
		width: 50vw;
		height: 25vh;
		position: relative;
		top: 25vh;
		display: block;
		float: left;
	}
	.home .section.meii .image-2 {
		width: 50vw;
		height: 25vh;
		position: relative;
		top: -25vh;
		left: 50vw;
		display: block;
		float: left;
	}
	.alistair .alistair-images {
		position: relative;
		top: 25vh;
	}
	.quiport .quiport-infographic>div, .meii .meii-infographic>div, .alistair .alistair-infographic>div {
		position: relative;
		top: 50%;
		-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		transform: translateY(-50%);
	}


	#progressBar {
		display: none;
	}
	.story .header {
		height: 52vh;
	}
	.story .header .header-content {
		padding: 1em 18vw 0 6vw;
	}
	.story .header h1 {
		font-size: 48px;
		line-height: 52px;
		font-size: 10vw;
    line-height: 1em;
	}
	.story .header p.summary {
		width: 70vw;
		font-size: 4vw;
		line-height: 5.25vw;
	}
	.story .header .header-content a.return-link {
		font-size: 10px;
		top: -20px;
	}
	.story h2 {
		font-size: 3.25vh;
		line-height: 3.5vh;
	}
	.dark-overlay {
		height: 100%;
	}
	.even-darker-overlay {
		background: rgba(0, 0, 0, 0.75);
	}
	.quiport .full-image.w-text.bg-3 {
		height: 110vh;
	}
	.after-image img {
		height: 40vh;
		position: relative;
		top: 40vh;
	}
	.after-image:after {
		left: 6vw;
		right: auto;
		top: 42.5vh;
		font-size: 2vw;
	}
	
	#overlap {
		margin-top: 0vh;
	}
	
	#skrollr-wrapper {
		height: 40vh;
		position: relative;
		top: -40vh;
	}
	#box2:after {
		left: 6vw;
		right: auto;
		top: 2vh;
		font-size: 2vw;
	}
	.quiport .full-image.w-text.section-three {
		height: 60vh;
	}
	
	.quiport .highlighted {
		margin-bottom: 8vh;
	}
	/* 
.quiport .full-image.w-text.section-three .text-area {
		width: 100%;
		height: 72vh;
		position: relative;
		bottom: auto;
		background: url('../images2/quiport/q-slide1-1.jpg') center center no-repeat;
		background-size: cover;
	}
	.quiport .full-image.w-text.section-three .text-area-2 {
		width: 100%;
		height: 72vh;
		top: 0;
		background: url('../images2/quiport/q-slide1-2-v2.jpg') center center no-repeat;
		background-size: cover;
	}
	.quiport .full-image.w-text.section-three .text-area-3 {
		width: 100%;
		height: 72vh;
		margin-bottom: 0;
		top: 0;
		background: url('../images2/quiport/q-slide1-3.jpg') center center no-repeat;
		background-size: cover;
	}
 */
	.quiport .full-image.w-text.section-three .content-padding {
		padding: 6vh 6vw 6vh !important;
		z-index: 2;
	}
	.mobile-overlay {
		width: 100%;
		height: 100%;
		display: none;
		position: absolute;
		z-index: 1;
		background: rgba(0, 0, 0, 0.5);
	}
	
	.meii .mobile-overlay {
		display: block;
	}
	
	.quiport .section-eight, .quiport .section-ten {
		padding-bottom: 0;
	}
	.quiport .section-five .content-image img, .quiport .section-ten .content-image img {
		vertical-align: bottom;
	}
	.quiport .full-image.no-text.section-nine-a,
	.quiport .full-image.no-text.section-nine {
		height: 27vh;
		margin-bottom: 10vh;
	}
	.meii .section-five {
		padding-bottom: 0;
	}
	.meii .section-five .content-image img, .meii .section-eight .content-image img, .meii .section-ten .content-image img {
		vertical-align: bottom;
	}
	.meii .full-image.no-text.section-nine {
		height: 52vh;
	}
	.meii .full-image.section-zero.centered-quote .text-area, .meii .full-image.section-nine.centered-quote .text-area {
		top: 60%;
	}
	.meii .full-image.section-zero {
		height: 52vh;
		margin-bottom: 0;
	}
	.meii .full-image.w-text.section-three {
		height: 72vh;
	}
	.meii .full-image.w-text.section-three .text-area {
		width: 100%;
		height: 72vh;
		position: relative;
		bottom: auto;
		background: url('../images2/meii/m-3-slide1.jpg') center center no-repeat;
		background-size: cover;
	}
	.meii .full-image.w-text.section-three .content-padding {
		padding: 6vh 6vw 6vh !important;
		z-index: 2;
	}
	.alistair .section-two, .alistair .section-six, .alistair .section-eight, .alistair .section-nine, .alistair .section-eleven, .alistair .section-twelve, .alistair .section-fourteen {
		padding-bottom: 0;
	}
	.alistair .section-two .content-image img, .alistair .section-nine .content-image img, .alistair .section-twelve .content-image img, .alistair .section-fourteen .content-image img {
		vertical-align: bottom;
	}
	.alistair .full-image.w-text.section-three, .alistair .full-image.w-text.section-ten, .alistair .full-image.w-text.section-thirteen {
		height: 70vh;
	}
	.alistair .full-image.w-text.section-three .darker-overlay, .alistair .full-image.w-text.section-ten .darker-overlay {
		background: rgba(0, 0, 0, 0.65);
	}
	.alistair .centered-quote blockquote p {
		margin: 0 0 4vw;
		font-size: 10.5vw;
		line-height: 9vw;
	}
	.alistair .quote blockquote p {
		margin: 0 0 4vw;
		font-size: 10.5vw;
		line-height: 9vw;
	}
	.alistair .quote blockquote footer {
		font-size: 3.5vw;
	}
	.alistair .section-six .quote blockquote p, .alistair .section-eight .quote blockquote p {
		margin: 0 0 3vw;
		font-size: 6.5vw;
		line-height: 6vw;
	}
	.alistair .section-four>div>div>.content-padding {
		padding-bottom: 0vh !important;
	}
	.alistair .full-image.w-text.full-2.section-five {
		height: 70vh;
	}
	.alistair .full-image.w-text.full-2.section-five .darker-overlay {
		background: rgba(0, 0, 0, 0.65);
	}
	.alistair .full-image.w-text.quote blockquote p {
		margin: 0 0 4vw;
		font-size: 9.5vw;
		line-height: 9vw;
	}
	.alistair .full-image.w-text.quote blockquote footer {
		font-size: 3.5vw;
		line-height: 4vw;
	}
	.alistair .highlighted {
		height: 72vh !important;
	}
	.centered-quote blockquote footer {
		font-size: 3.5vw;
		line-height: 4vw;
	}
	.story .highlighted {
		height: 112vh;
	}
	.story .highlighted .content-padding {
		height: 50%;
		padding: 0 6vw 0vh !important;
	}
	.story .highlighted .call-out-wrapper {
		height: 50%;
	}
	.related-posts {
		height: 112vh;
	}
	.related-posts p.summary {
		width: 50vw;
		font-size: 4vw;
		line-height: 5.25vw;
	}
	.related-posts h3 {
		margin-bottom: 2vw;
		font-size: 10vw;
		letter-spacing: -1px;
		line-height: 9vw;
	}
	.related-posts .small {
		width: 50vw;
		margin-bottom: 1vw;
	}
	.footer .footer-message p {
		margin-bottom: 0.5em;
		font-size: 3.5vw;
		line-height: 5.5vw;
	}
	
	.footer .menu {
	    font-size: 1.75em;
	}
	
	.footer .menu li {
		line-height: 1.4em;
	}
	.footer .menu li:nth-of-type(1):after {
		content: '';
	}
	.footer .site-credit {
	    font-size: 1.75em;
		margin-top: 0.5em;
	}
	.social-menu {
		height: 270px;
		margin-top: -100px;
	}
	.social-menu .menu-text {
		font-size: 3.5vw;
		font-weight: 500;
		margin-bottom: 0.5em;
	}
	.social-menu li {}
	.social-menu li .social-link {
		height: 6.5em;
		margin: 0.5em 0.5em;
		width: 6.5em;
	}
	.social-menu li .social-link.tw {
		background: url('../images2/share/twitter.svg') center center no-repeat transparent;
		background-size: 6.5em;
	}
	.social-menu li .social-link.fb {
		background: url('../images2/share/facebook.svg') center center no-repeat transparent;
		background-size: 6.5em;
	}
	.social-menu li .social-link.gp {
		background: url('../images2/share/google.svg') center center no-repeat transparent;
		background-size: 6.5em;
	}
	.social-menu li .social-link.em {
		background: url('../images2/share/mail.svg') center center no-repeat transparent;
		background-size: 6.5em;
	}
	.landing .social-menu {
		width: 60vw;
		height: 80px;
		margin-top: 0;
		margin-left: -30vw;
		display: block;
		top: auto;
		left: 50%;
		bottom: 25vh;
		-webkit-transform: none;
		-ms-transform: none;
		transform: none;
	}
	
	.landing .scroll {
		width: 30vw;
		height: 80px;
		margin-top: 0;
		margin-left: -15vw;
		display: block;
		position: absolute;
		top: auto;
		left: 50%;
		bottom: -5px;
		-webkit-transform: none;
		-ms-transform: none;
		transform: none;
		z-index: 1;
	}
	
	.landing .scroll a {
		display: block;
		height: 100%;
		width: 100%;
	}
	
	.mouse-icon {
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 100px;
    margin-left: -50px;
    z-index: 100;
  	text-align: center;
	}

	.scroll-more__line {
			height: 45px;
			width: 2px;
			display: inline-block;
			bottom: 0;
			background: linear-gradient(180deg, rgba(255,255,255,0) 0px, rgba(255,255,255,0) 32px, #fff 33px, #fff 64px);
			background-size: 200% auto;
			background-position: 0 100%;
			-webkit-animation: scrollGradientAnimation 1.4s ease-in-out infinite;
			animation: scrollGradientAnimation 1.4s ease-in-out infinite;
	}
	
	
	@-webkit-keyframes scrollGradientAnimation{0%{background-position:0 0}100%{background-position:0 -200%}}@keyframes scrollGradientAnimation{0%{background-position:0 0}100%{background-position:0 -200%}}

	
	.landing .social-menu .menu li {
		display: inline-block;
	}
	
	.story .menu-container {
		z-index: 10000;
	}
	.story .menu-container.purple .menu-button span { 
		background: #8176a9; 
	}
	
	
	
	.quiport .section-one-a.default-w-quote {
		padding-bottom: 0;
	}
	
	
	/* 


.fp-viewing-quiport .menu-fill { fill: #c3d65a; }
.fp-viewing-meii .menu-fill { fill: #8176a9; }
.fp-viewing-alistair .menu-fill { fill: #75beb8; }
.fp-viewing-info .menu-fill { fill: #ffffff; }
 */



	
	.story .menu-container {
		position: absolute;
	}

	
	.story .social-menu {
    display: block;
    height: auto;
    position: absolute;
    right: auto;
    top: auto;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    margin-top: 0;
    z-index: 1000;
    bottom: 3vh;
    width: 60vw;
    left: 6vw;
	}
	.story .social-menu .menu li {
		display: inline-block;
	}
	.story .social-menu .menu-text {
		padding-left: 1vw;
		text-align: left;
	}
	
}

























/* GENERAL CSS
=========================================*/
.mobile-nav,
.mobile-nav *,
.mobile-nav *:focus{
	box-sizing: border-box;
	z-index: 10000;
	outline: none;
	-webkit-tap-highlight-color: transparent;
}
.mobile-nav {
	position: fixed;
	width: 100%;
	height: 100%;
	padding: 0;
	top: 0;
	left: 0;
	display: none;
	background-color: rgba(0, 0, 0, 0.95);
}

/* CONTENT WRAPPER
=========================================*/
.mobile-nav-content{
	width: 100%;
	height: 100%;
	padding: 0;
	position: relative;
	z-index: 1;
	color: #f0f0f0;
	display: block;
	overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

/* CLOSE BUTTON
=========================================*/
.mobile-nav-close {
	width: 32px;
	height: 32px;
	display: block;
	position: fixed;
	right: 6vw;
	top: 6vw;
	z-index: 100001;
	cursor: pointer;
	-webkit-transition: all .2s linear;
	transition: all .2s linear;
}
.mobile-nav-close:hover {
	-webkit-transform: scale(1.2, 1.2);
	transform: scale(1.2, 1.2);
}
.mobile-nav-close:before, 
.mobile-nav-close:after {
	position: absolute;
	left: 15px;
	content: ' ';
	height: 33px;
	width: 2px;
	background-color: #fff;
	z-index: 100001;
}
.mobile-nav-close:before {
	-ms-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
.mobile-nav-close:after {
	-ms-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}


/* MENU OF BOXES
=========================================*/
.mobile-nav-projects{
	margin: 0;
	padding: 0;
	list-style: none;
	text-align: left;
	display: -webkit-flex;
    display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: center;
	justify-content: center;
}
.mobile-nav-projects li{
	width: 100%;
	height: 33.33333vh;
	display: block;
	float: left;
	clear: both;
	text-align: left;
	overflow: hidden;
}
/* 

.mobile-nav-projects li a{
	width: 100%;
	height: 100%;
	margin: 0;
	display: inline-block;
	font-size: 14px;
	color: #999;
	text-decoration: none;
	line-height: 60px;
	background-color: rgba(51, 51, 51, 0.8);
	-webkit-transition: all .2s linear;
	transition: all .2s linear;
}
.mobile-nav-projects li a i{
	width: 100%;
	margin: 30px 0 0;
	text-align: center;
	font-size: 60px;
	float: left;
}

.mobile-nav-projects:hover a{
	opacity: 0.7;
}
.mobile-nav-projects li:hover a{
	opacity: 1;
	color: #fff;
}
 */



#menu-icon { height: 40px; margin-top: 0.5em; -webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
    transition-delay: 0.12s; }
.menu-fill { fill: #FFFFFF; -webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
    transition-delay: 0.12s; }

.fp-viewing-quiport .menu-fill { fill: #c3d65a; }
.fp-viewing-meii .menu-fill { fill: #8176a9; }
.fp-viewing-alistair .menu-fill { fill: #75beb8; }
.fp-viewing-info .menu-fill { fill: #ffffff; }

.menu-button {
	padding: 6px 0 6px 6px;
}

.menu-button span { 
	background: #fff;
	clear: both;
	display: block;
	float: right;
	height: 2px;
	margin: 0 0 8px;
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-ms-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
    transition-delay: 0.12s;
}

.menu-button span:nth-of-type(1),
.menu-button span:nth-of-type(3) {
	width: 28px;  
}

.menu-button span:nth-of-type(2) {
	width: 38px;  
}


.fp-viewing-quiport .menu-button span { background: #c3d65a; }
.fp-viewing-meii .menu-button span { background: #8176a9; }
.fp-viewing-alistair .menu-button span { background: #75beb8; }
.fp-viewing-info .menu-button span { background: #ffffff; }

/*
Full Screen Navigation
Yellow color scheme
*/

/* GENERAL
=========================================*/
.mobile-nav{
	background-color: #fff;
}


/* MENU OF BOXES
=========================================*/
.mobile-nav-projects li a{
	color: #75beb8;
	background-color: rgba(0, 0, 0, 0.8);
}
.mobile-nav-projects li:hover a{
	color: #f00;
}



/* Story: Related Posts */
/* -------------------- */
.mobile-nav-stories {
	position: relative;
	background: #ffffff;
	color: #ffffff;
}

.mobile-nav-stories .row {
	height: 100%;
}

.mobile-nav-stories .content-padding {
	padding: 0 6vw !important; 
}

.mobile-nav-stories h3 {
	color: #ffffff;
	text-align: left;
	font-size: 6em;
    line-height: 1em;
    margin-bottom: 0.35em;
}

.mobile-nav-stories p {
	color: #ffffff;
	font-size: 3.5vw;
    line-height: 4.5vw;
	margin-bottom: 0.75em;
	text-align: left;
}

.mobile-nav-stories .button.button-one {
	background: #ffffff;
}

.mobile-nav-stories>.container-fluid {
	height: 100%;
}

.mobile-nav-stories>.container-fluid>.row {
	height: 100%;
}

.mobile-nav-stories>.container-fluid>.row>[class*="col"]>.row {
	height: 100%;
}

.mobile-nav-stories .bg-image {
	background: rgba(0, 0, 0, 0.2);
}

.mobile-nav-stories .quiport {
	background: #c3d65a;
}

.mobile-nav-stories .quiport .bg-image {
	background: url('../images/related/related__quiport.png') center center no-repeat;
	background-size: cover;
}

.mobile-nav-stories .quiport .button.button-one {
	color: #c3d65a;
}

.mobile-nav-stories .west-bank {
	background: #8176a9;
}

.mobile-nav-stories .west-bank .bg-image {
	background: url('../images/related/related__west_bank.jpg') center center no-repeat;
	background-size: cover;
}

.mobile-nav-stories .west-bank .button.button-one {
	color: #8176a9;
}

.mobile-nav-stories .alistair {
	background: #75beb8;
}

.mobile-nav-stories .alistair .bg-image {
	background: url('../images/related/related__alistair.jpg') center center no-repeat;
	background-size: cover;
}

.mobile-nav-stories .alistair .button.button-one {
	color: #75beb8;
}



/* ANIMATIONS
=========================================*/
.dropdown{
	animation-name: dropdown;
	animation-duration: .3s;
	animation-iteration-count: 1;
	animation-timing-function: ease;
	animation-fill-mode: forwards;

	-webkit-animation-name: dropdown;
	-webkit-animation-duration: .3s;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: ease;
	-webkit-animation-fill-mode: forwards;

	-moz-animation-name: dropdown;
	-moz-animation-duration: .3s;
	-moz-animation-iteration-count: 1;
	-moz-animation-timing-function: ease;
	-moz-animation-fill-mode: forwards;
}
@keyframes dropdown{
	from{ 
		top: auto;
		bottom: -200px;
	}
	to{ 
		top: auto;
		bottom: 0;
	}
}
@-webkit-keyframes dropdown{
	from{ 
		top: auto;
		bottom: -200px;
	}
	to{ 
		top: auto;
		bottom: 0;
	}
}