.sitebodyjs div#preloader {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 999;
    width: 100%;
    height: 100%;
    overflow: visible;
    background: #231f20 url('../img/pre-loader.gif') no-repeat center center;
}

.js #preloader.hidden {
    opacity: 0;
    visibility: hidden;
}

body {
    overflow-y: scroll;
}

/***************************************************/
/*** HEADER ELEMENTS ***/
/***************************************************/
header {
    position: fixed;
    z-index: 101;

    top: 0;
    left: 0;

    width: 100%;
    height: 60px;
    background-color: #231f20;
    /*overflow:hidden;*/
    border-bottom: 1px solid #fff;
}

header > div {
    height: 100%;
    margin: 0 auto;
    /*background-color:#f00;*/
}

#header-logo {
    float: left;
    margin-left: 25px;
    background: url('../img/logo-scout.png') bottom center no-repeat;
    background-size: contain;
}

#header-logo,
#header-logo span {
    display: block;
    width: 116px;
    height: 60px;
}

#header-graywood {
    float: right;
    margin-left: 25px;
    margin-right: 25px;
    background: url('../img/logo-graywood.svg') center center no-repeat;
    background-size: contain;
    background-position: center bottom 13px;
}

#header-graywood,
#header-graywood span {
    display: block;
    width: 110px;
    height: 60px;
}

#header-graywood a {
    display: block;
    line-height: 100%;
}

#header-button,
#header-social {
    float: right;
    height: 100%;
    /*background-color: rgba(255,0,4,0.52);*/
    vertical-align: bottom;
}

#header-button {
    margin: 0 10px;
}

#header-button span span {
    font-family: 'arrrows-regular-webfont';
    text-transform: lowercase;
}

#header-button a:link,
#header-button a:active,
#header-button a:visited {
    display: block;
    font-family: 'InterstateRegularComp';
    font-size: 2em;
    line-height: 100%;
    text-transform: uppercase;
    color: #fff;
    margin-top: 24px; /*30*/
    padding: 0 10px;
}

#header-social a:link,
#header-social a:active,
#header-social a:visted {
    display: block;
    line-height: 100%;
    color: #fff;
}

#header-social a i {
    color: #fff;
}

#header-social span {
    display: block;
    margin-top: 27px;
    padding: 0 5px;
}

#header-button:hover,
#header-button:hover a,
#header-social:hover,
#header-social:hover a i {
    background-color: #b6d6d6;
    color: #231f20;
}

#header-button:hover.btn-alt,
#header-button:hover.btn-alt a {
    background-color: transparent;
    color: #231f20;
}

.btn-alt > a > span {
    background-color: #a6b040;
    padding: 0 5px;
}

/*** NAV TOGGLE ***/

#nav-toggle {
    float: left;
    margin: 24px 0 0 40px;
    width: 36px;
    height: 36px;
    cursor: pointer;
}

#nav-toggle-on,
#nav-toggle-off {
    width: 36px;
    height: 36px;
}

#nav-toggle-off {
    display: none;
    text-align: center;
}

#nav-toggle-off:hover span {
    color: #b6d6d6;
}

#nav-toggle-on span {
    display: block;
    width: 36px;
    height: 2px;
    background-color: #fff;
}
#nav-toggle-on:hover span {
    background-color: #b6d6d6;
}
#nav-toggle-on span:nth-child(1) {
    margin: 10px 0 0 0;
}
#nav-toggle-on span:nth-child(2) {
    margin: 5px 0 5px 0;
}
#nav-toggle-on span:nth-child(3) {
    margin: 0 0 10px 0;
}

#nav-toggle-off span {
    font-family: 'InterstateLight', sans-serif;
    font-size: 2.75em;
    line-height: 100%;
    color: #fff;
}

/*** NAV LAYER ***/
nav {
    display: none;
    position: absolute;
    z-index: 5000;
    float: left;
    margin: 60px 0 0 30px;
    width: 180px;
    text-align: left;
    border: 6px solid #231f20;
    background-color: #fff;
}

nav ul ul {
    display: block;
}

nav ul {
    margin: 0;
    padding: 10px 0px 10px 0px;
    width: 100%;
    list-style: none;
    position: relative;
    display: inline-table;
}

nav ul li {
    padding: 6px 0;
    width: 100%;
}

/*
			nav ul li:hover,
			nav ul li:hover a,
			nav ul li.on,
			nav ul li.on a  {
				background-color: #231f20;
				color: #fff !important;
			}
			
				nav ul ul li:hover,	*/

nav ul li span {
    display: block;
    padding: 4px 18px;
    font-size: 20px;
    color: #231f20;
}

nav ul ul {
    padding: 0;
    margin: 0;
}
nav ul ul li {
    position: relative;
    display: block;
    padding: 0;
    line-height: 100%;
}
nav ul ul li a {
    display: block;
    padding: 2px 12px;
    font-size: 15px;
}

nav ul li:hover,
nav ul li:hover span,
nav ul li:hover ul li a {
    color: #fff;
    background-color: #231f20;
}
nav ul ul li a:hover,
nav ul ul li.on a {
    color: #b6d6d6 !important;
}

.add-to-mobile {
    display: none;
}

.expand {
    display: block !important;
}

.shrink {
    display: none !important;
}

/***************************************************/
/*** MASTHEAD ***/
/***************************************************/

#content-masthead {
    width: 100%;
    height: auto;
    margin: 60px 0 0 0;
    padding: 0;
}

#content-masthead img {
    width: 100%;
    height: auto;
}

.masthead-fade-in {
    -webkit-animation: fade-in 2s ease;
    -moz-animation: fade-in ease-in-out 2s both;
    -ms-animation: fade-in ease-in-out 2s both;
    -o-animation: fade-in ease-in-out 2s both;
    animation: fade-in 2s ease;
    visibility: visible;
    -webkit-backface-visibility: hidden;
}

@-webkit-keyframes masthead-fade-in {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@-moz-keyframes masthead-fade-in {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@-o-keyframes masthead-fade-in {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@keyframes masthead-fade-in {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

/***************************************************/
/*** CONTENT PAGES ***/
/***************************************************/

#content-wrapper {
    margin: 0 auto;
    /*background-color: #ccc;*/
}

#content-wrapper img {
    width: 100%;
    margin: 10px 0;
}

#content-container {
    padding-bottom: 100px;
}

.content-boxed {
    background-color: #231f20;
    padding: 25px 25px;
}

.content-boxed p {
    color: #fff;
}

div.content-boxed + div.content-boxed {
    margin: 25px 0;
}

#content-container.content-lists ul {
    padding-left: 20px;
    margin: 0 0 25px 0;
}

.content-floorplans a {
    display: inline-block;
    margin-bottom: 0.5em;
}
.content-floorplans a:after {
    white-space: pre;
}

.content-floorplans a:hover {
    color: #b6d6d6;
}

.content-floorplans a span {
    font-family: 'InterstateRegularComp';
    font-size: 2em;
    margin-right: 7px;
}

.btn-graywood-mobile {
    display: block;
}

.btn-graywood-mobile span {
    display: block;
    width: 190px;
    height: 75px;
    background: url('../img/logo-graywood.png') center center no-repeat;
    background-size: contain;
}

.grecaptcha-badge {
    display: none;
}

/***************************************************/
/*** HOME PAGE ARTICLES ***/
/***************************************************/

/*** HOME PAGE ARTICLES ***/

/*

#home-news-row-2col {
	clear: both;
	min-height:300px;
	margin-top: 10px;
}	

		#home-news-row-2col article {
			display: block;
			margin-bottom: 35px;
			height:300px;
			overflow: hidden;
		}
		
		#home-news-row-2col article a span {
			display:block;
			width:100%;
			height: 100%;
		}
		
		#home-news-row-2col article:nth-child(1) {
			 position: relative; width:65%; float:left; margin-right: 5%;
		}
		
		#home-news-row-2col article:nth-child(1) h1 {
			position: absolute;
			background: #231f20;
			bottom: 20px;
			margin: 0;
			padding: 2px 40px 40px 2px;
			color: #fff;
		}

	#home-news-row-2col article:nth-child(1) a:hover h1 {
		background: #b6d6d6;
		color: #231f20;
	}


		#home-news-row-2col article:nth-child(2) {
			width:30%; float:left; background: #666; display:table; 
		}	
		
			#home-news-row-2col article .twitter {
				display: table-cell;
				height: 290px;
				background-color: #fff;
				border: 5px solid #231f20;
					
			}
		
			#home-news-row-2col article .twitter h1 {
				font-size: 1.5em;
				margin: 5px;
			}
			
*/

.row-2col {
    position: relative;
    clear: both;
    min-height: 220px;
}

.row-2col article {
    display: block;
    margin-bottom: 35px;
    width: 30%;
    height: 220px;
    float: left;
    overflow: hidden;
}

.row-2col article span {
    display: block;
    width: 100%;
    height: 130px;
}

.row-2col article:not(.panel-social) h1 {
    display: block;
    background: #fff;
    width: 100%;
    height: 85px;
    margin: 0;
    padding: 5px 0 0 2px;
}

.row-2col article a:hover h1 {
    background: #b6d6d6;
}

.row-2col article.article-floorplans h1 {
    position: absolute;
    display: block;
    top: 0;
    height: auto;
    color: #fff;
}

.row-2col article.article-floorplans a:hover span,
.row-2col article.article-floorplans a:hover h1 {
    color: #231f20;
    background: #b6d6d6;
}

.row-2col article.article-media h1 {
    position: absolute;
    display: block;
    top: 0;
    height: auto;
    color: #fff;
}

.row-2col article.article-media a:hover span,
.row-2col article.article-media a:hover h1 {
    color: #231f20;
    background: #b6d6d6;
}

.row-2col article:nth-child(1) {
}

.row-2col article:nth-child(2) {
    margin: 0 5%;
}

.row-2col article.panel-social {
    display: table-cell;
    height: auto;
    background-color: #fff;
    margin-bottom: 0;
}

.row-2col article.panel-social .container-social {
    display: table-cell;
    /*height: 290px;*/
    background-color: #fff;
    border: 5px solid #231f20;
}

.row-2col article.panel-social .container-social h1 {
    font-size: 1.5em;
    margin: 5px !important;
}

.row-2col article.article-contributors {
    position: relative;
    float: left;
    height: 185px;
}

.row-2col article.article-contributors h1 {
    position: absolute;
    display: block;
    top: 0;
    height: auto;
    color: #fff;
}

.row-2col article.article-contributors a:hover span,
.row-2col article.article-contributors a:hover h1 {
    color: #231f20;
    background: #b6d6d6;
}

.panel-social {
    position: absolute;
    right: 0;
    /*width: 210px;*/
}

/*
			
#home-news-row2-2col {
	clear: both;
	height: 410px;
}

	#home-news-row2-2col article {
		display: block;
		margin-bottom:0;
		width: 30%;
		height:250px;
		float: left;
		overflow: hidden;
	}
	
	#home-news-row2-2col article span {
		display: block;
		width:100%;
		height: 160px;
	}	

	#home-news-row2-2col article h1 {
		display: block;
		background: #fff;
		width:100%;
		height: 85px;
		margin: 0;
		padding: 5px 0 0 2px;
	}


	#home-news-row2-2col article a:hover h1 {
		background: #b6d6d6;
	}
	
	
	
		#home-news-row2-2col article.article-contributors h1 {
		position: absolute;
		display: block;
		top: 0;
		height: auto;
		color: #fff;
	}

	#home-news-row2-2col article.article-contributors a:hover span,
	#home-news-row2-2col article.article-contributors a:hover h1{
		color: #231f20;
		background: #b6d6d6;
	}
	
	
	
	
	
	#home-news-row2-2col article:nth-child(1) {
		float: left;
		width:30%;
		height:250px;
	}
	
	#home-news-row2-2col article:nth-child(2) {
		float: right;
		width:65%;
		height:410px;		
	}
		#home-news-row2-2col article:nth-child(2) span {
			height:340px;		
		}

	
	#home-news-row2-2col article:nth-child(3) {
		position: relative;
		float: left;
		height:185px;
	}





#home-news-row3-2col {
	clear: both;
	height: 410px;
}

	#home-news-row3-2col article {
		display: block;
		margin-bottom:0;
		width: 30%;
		height:250px;
		float: left;
		overflow: hidden;
	}
	
	#home-news-row3-2col article span {
		display: block;
		width:100%;
		height: 160px;
	}	

	#home-news-row3-2col article h1 {
		display: block;
		background: #fff;
		width:100%;
		height: 85px;
		margin: 0;
		padding: 5px 0 0 2px;
	}


	#home-news-row3-2col article a:hover h1 {
		background: #b6d6d6;
	}
	
	
	
		#home-news-row3-2col article.article-features h1 {
		position: absolute;
		display: block;
		top: 0;
		height: auto;
		color: #fff;
	}

	#home-news-row3-2col article.article-features a:hover span{
	}
	
	
	
	
	
	#home-news-row3-2col article:nth-child(1) {
		float: left;
		width:65%;
		height:410px;
	}
		#home-news-row3-2col article:nth-child(1) span {
			height:340px;		
		}	
	
	#home-news-row3-2col article:nth-child(2) {
		float: right;
	}


	
	#home-news-row3-2col article:nth-child(3) {
		position: relative;
		float: right;
		height: 185px;
	}



#home-news-row4-3col {
	clear: both;
	height: 250px;
}
	
	#home-news-row4-3col article {
		display: block;
		position: relative;
		margin-bottom:0;
		width: 30%;
		height:250px;
		float: left;
		overflow: hidden;
	}
	
	#home-news-row4-3col article span {
		display: block;
		width:100%;
		height: 160px;
	}

	#home-news-row4-3col article h1 {
		display: block;
		background: #fff;
		width:100%;
		height: 85px;
		margin: 0;
		padding: 5px 0 0 2px;
	}
	
	#home-news-row4-3col article a:hover h1 {
		background: #b6d6d6;
	}

		#home-news-row4-3col article.article-media h1 {
			position: absolute;
			display: block;
			top: 0;
			height: auto;
			color: #fff;
		}
	
		#home-news-row4-3col article.article-media a:hover span,
		#home-news-row4-3col article.article-media a:hover h1{
			color: #231f20;
			background: #b6d6d6;
		}


	#home-news-row4-3col article:nth-child(1) {

	}
	
	#home-news-row4-3col article:nth-child(2) {
		margin:0 5%;
	}
	
	#home-news-row4-3col article:nth-child(3) {
	}



*/

/*** HOME PAGE ARTICLE BACKGROUNDS ***/
.article-smv {
    background: url('../img/architecture/001.jpg') top center no-repeat;
    background-size: cover;
}
.article-smv h1:after {
    content: '"SCOOP IS A COMMUNITY\A ORIENTED DEVELOPMENT..."';
    white-space: pre;
}

.article-space span {
    background: url('../img/interiors/001.jpg') top center no-repeat;
    background-size: cover;
}
.article-space h1:after {
    content: 'Space\A For You';
    white-space: pre;
}

.article-flavour span {
    background: url('../img/neighbourhood/001.jpg') top center no-repeat;
    background-size: cover;
}
.article-flavour h1:after {
    content: 'Neighbourhood\A Flavour';
    white-space: pre;
}

.article-developers span {
    background: url('../img/developers/001.jpg') top center no-repeat;
    background-size: cover;
}
.article-developers h1:after {
    content: 'Meet the\A developers';
    white-space: pre;
}

.article-walk {
    background: url('../img/neighbourhood/slider/015.jpg') -100px -45px
        no-repeat;
    background-size: cover;
}
.article-walk h1:after {
    content: 'Walk the\A block';
    white-space: pre;
}

.article-amenities {
    background: url('../img/amenities/001.jpg') top center no-repeat;
    background-size: cover;
}
.article-amenities h1:after {
    content: '“THERE WAS A DESIRE FOR MODERN.\A BUT MODERN WITH A WARMTH AND CRAFT TO IT.”';
    white-space: pre;
}

.article-gallery span {
    background: url('../img/architecture/002.jpg') top center no-repeat;
    background-size: cover;
}
.article-gallery h1:after {
    content: 'Gallery';
    white-space: pre;
}

.article-floorplans span,
.article-contributors span,
.article-features span,
.article-media span {
    background: #231f20;
}

.article-floorplans h1,
.article-contributors h1,
.article-features h1,
.article-media h1 {
    background: none !important;
}

.article-features a span {
    background: #231f20 url('../img/article-features.png') top left no-repeat;
    background-size: contain;
}
.article-features a:hover span {
    background: #b6d6d6 url('../img/article-features-hover.png') top left
        no-repeat;
    background-size: contain;
}

.article-floorplans h1:after {
    content: 'SUITE DESIGNS.';
    white-space: pre;
}

.article-contributors h1:after {
    content: 'Contributors';
    white-space: pre;
}

.article-media h1:after {
    content: 'In the news.\A Get the SCOOP.';
    white-space: pre;
}

h1.media-header-link:hover a {
    color: #b6d6d6 !important;
}

.media-title {
    margin-top: 1.3em;
}
p.media-copy {
    font-family: 'InterstateRegularLight', sans-serif;
    font-size: 1em;
}

/***************************************************/
/*** FONT AWESOME ***/
/***************************************************/

.fa {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: 1.6em;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.fa-facebook:before {
    content: '\f09a';
}

.fa-twitter:before {
    content: '\f099';
}

.fa-instagram:before {
    content: '\f16d';
}

/***************************************************/
/*** REGISTRATION ***/
/***************************************************/

.site-bg-reg {
    background-color: #231f20;
}

#register-container {
    display: none;
    width: 300px;
    height: 850px;
    top: 100px;
    left: 50%;
    margin-left: 100px;
    position: absolute;
    z-index: 100000;
    background-color: #231f20;
}

#register-container iframe {
    width: 100%;
    height: 100%;
    border: 0;
    background-color: #231f20;
}

#close-regForm {
    text-align: right;
}

#close-regForm a span {
    display: block;
    font-family: 'InterstateLight', sans-serif;
    font-size: 1.5em;
    line-height: 100%;
    padding: 4px;
    color: #fff;
    background: #231f20;
}

#close-regForm a:hover span {
    color: #b6d6d6;
}

/***************************************************/
/*** ACCORDION ***/
/***************************************************/

#scoop-accordion {
}

#scoop-accordion ul li {
    line-height: 1.5em;
}

[data-content] p {
    line-height: 1.25em;
}

/* ----------------------------------------------------------------
	Google Maps
-----------------------------------------------------------------*/

#google-map-wrapper {
    clear: both;
    padding: 50px 0;
}

#google-map {
    position: relative;
    width: 100%;
    height: 450px;
}

.gmap img {
    max-width: none !important;
}

.gm-style .gm-style-iw h3 span {
    font-size: inherit;
    font-family: inherit;
}

#map-overlay {
    position: relative;
    padding: 100px 0;
}

#map-overlay #google-map {
    position: absolute;
    height: 100%;
    top: 0;
    left: 0;
}

/* ----------------------------------------------------------------
	Homepage Registration Panel
-----------------------------------------------------------------*/
.close-panel {
    position: absolute;
    right: 15px;
    margin-top: 10px;
    width: auto;
    height: 30px;
    background: rgba(255, 0, 4, 0);
}

@media (min-width: 960px) {
}

.close-panel div span {
    display: block;
    font-family: 'InterstateRegularComp', sans-serif;
    font-size: 2.5em;
    line-height: 100%;
    text-align: center;
    padding: 0;
    width: auto;
    height: 30px;
    color: #fff;
    cursor: pointer;
}
.close-panel div span em {
    font-size: 1.25rem;
    font-style: normal;
}

.close-panel div:hover span {
    color: #b6d6d6;
}

.screen-wrapper {
    position: fixed;
    overflow: hidden;
    top: 0;
    z-index: 100;
    height: 100vh;

    /*
	max-height: 800px;
	*/

    width: 100%;
    background: #231f20;
    /*	
	background-image: url("../img/promo/private_sales-m.png");
	background-repeat: no-repeat;
	background-position: top 60px center;
	background-size: contain;
*/
    -webkit-transition-property: all;
    -webkit-transition-duration: 0.5s;
    -webkit-transition-timing-function: cubic-bezier(0, 1, 0.5, 1);

    -moz-transition-property: all;
    -moz-transition-duration: 0.5s;
    -moz-transition-timing-function: cubic-bezier(0, 1, 0.5, 1);

    -ms-transition-property: all;
    -ms-transition-duration: 0.5s;
    -ms-transition-timing-function: cubic-bezier(0, 1, 0.5, 1);

    transition-property: all;
    transition-duration: 0.5s;
    transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
}
@media screen and (min-width: 620px) {
    /*	.screen-wrapper {background-image: url("../img/promo/private_sales.png");} */
}

.screen-wrapper img {
    max-width: 100%;
    height: auto;
}

@media screen and (max-height: 1265px) {
    .screen-wrapper img {
        width: auto;
        max-height: 100%;
    }
}

.screen-content {
    /*
	position: absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	pointer-events: none;
	*/
    background-color: rgba(255, 0, 4, 0);

    position: relative;
    margin-right: auto;
    margin-left: auto;
    max-width: 1686px;
    margin-top: 60px;
    height: calc(100vh - 60px);
    /*
	background-image: url("../img/construction.gif");
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
	*/
}
/*
@media (min-width: 768px) {
	.screen-content {max-width: 700px;}	
}
@media (min-width: 992px) {
	.screen-content {max-width: 900px;}	
}
@media (min-width: 1200px) {
	.screen-content {max-width: 1100px;}	
}
@media (min-width: 1600px) {
	.screen-content {max-width: 1500px;}	
}
*/
.screen-wrapper.closed {
    height: 0;
}

/*
.reg-panel-wrapper {
	overflow-y: hidden;
	max-height: 460px;

	-webkit-transition-property: all;
	-webkit-transition-duration: .5s;
	-webkit-transition-timing-function: cubic-bezier(0, 1, 0.5, 1);

	-moz-transition-property: all;
	-moz-transition-duration: .5s;
	-moz-transition-timing-function: cubic-bezier(0, 1, 0.5, 1);

	-ms-transition-property: all;
	-ms-transition-duration: .5s;
	-ms-transition-timing-function: cubic-bezier(0, 1, 0.5, 1);

	transition-property: all;
	transition-duration: .5s;
	transition-timing-function: cubic-bezier(0, 1, 0.5, 1);

	background: #231f20;
	height: 460px; 
	width: 100%;
}

.reg-panel-wrapper.closed {
	max-height: 0;
}

.reg-panel-content {
	color: #fff;
}

.reg-panel-content h1 {
	font-family:'InterstateRegularComp', sans-serif;
	text-transform:uppercase;
	font-size: 3em;
	font-weight: normal;
	margin: 0 25px;
}

.reg-panel-content p {
	font-size: 1.5rem;
	line-height: 1.25em;
	font-weight: normal;
	margin: 0 25px 6rem;
}

.reg-panel-content h1>a>span>em {
	font-size: 4rem;
	line-height: 1.15em;
	color: #a7b241;
	border-bottom: 4px solid #fff;
	font-style: normal;
}


.reg-panel-content h1:nth-child(1) {
	margin-top: .5em;	
	margin-bottom: .25em;
}


.reg-panel-content h1:nth-child(2) {
	color: #a7b342;
}

.reg-panel-content h1>a:link,
.reg-panel-content h1>a:active,
.reg-panel-content h1>a:visited {
	text-decoration:none;
	color: inherit;
}


.reg-panel-content h1>a:hover {
	text-decoration:none;
	color: #fff;
}

.reg-panel-content h1>a:hover>span>em {
	border-bottom: 4px solid #a7b342;
}
*/

a.pdf-dl:link,
a.pdf-dl:active,
a.pdf-dl:visited {
    font-family: 'InterstateRegularComp';
    font-size: 2em;
    line-height: 2em;
}

a.pdf-dl:hover {
    color: #767676;
}

.btn_private-sales {
    position: absolute;
    top: 40%;
    right: 0;
    width: 100%;
    height: 10%;
    display: block;
    margin: 0;
    color: #f00;
    font-size: 2em;
    background-color: rgba(255, 0, 4, 0.38);
}

/* ----------------------------------------------------------------
	Grids
-----------------------------------------------------------------*/

.scout-grid-1 img {
    margin: 0 !important;
}

.scout-grid-1 {
    display: grid;
    width: 100%;
    /*height: auto;*/
    margin: 2em 0;
    grid-gap: 0.75em;
    grid-template-columns: repeat(9, minmax(0, 1fr));
    grid-template-rows: 1fr;
}

.scout-grid-1 .box span {
    display: block;
    width: 100%;
    height: 100%;
    line-height: 100%;
}

.scout-grid-1 .box span > img {
    position: relative;
    display: block;
    max-width: 100%;
    height: auto;
    margin: 0 auto;
    line-height: 100%;
    vertical-align: middle;
}

.scout-grid-1 .box.a {
    grid-column: 1 / span 9;
    grid-row: 1 / span 5;

    background-image: url('../img/home/hero.jpg');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.scout-grid-1 .box.b {
    grid-column: 1 / span 3;
    grid-row: 6 / span 3;
    /*
	border: 2px solid #231f20;
	background-color: #fff;
	*/
    background-color: #a6b140;
}
.scout-grid-1 .box.c {
    grid-column: 4 / span 3;
    grid-row: 6 / span 3;

    background: #ffffff;

    background-image: url('../img/home/news.png');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
}
.scout-grid-1 .box.d {
    grid-column: 7 / span 3;
    grid-row: 6 / span 3;

    background-image: url('../img/home/real-life-stories.jpg');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.scout-grid-1 .box.e {
    /*
	grid-column: 7 / span 3;
	grid-row: 6 / span 3;
*/

    grid-column: 1 / span 3;
    grid-row: 9 / span 4;

    min-height: 300px;

    background: #000000;

    background-image: url('../img/home/makers.png');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
}
.scout-grid-1 .box.f {
    /*	
	grid-column: 1 / span 3;
	grid-row: 9 / span 4;
*/

    grid-column: 4 / span 6;
    grid-row: 9 / span 4;

    background-image: url('../img/home/it-place.jpg');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
@media screen and (max-width: 767px) {
    .scout-grid-1 .box.f span {
        position: relative;
    }
    .scout-grid-1 .box.f span img {
        position: absolute;
        bottom: 0;
    }
}
.scout-grid-1 .box.g {
    /*	
	grid-column: 4 / span 6 ;
	grid-row: 9 / span 4;
*/

    grid-column: 1 / span 9;
    grid-row: 13 / span 4;

    background-image: url('../img/home/feel-good.jpg');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

/* OLD
.scout-grid-1 .box.h {
	grid-column: 1 / span 4;
	grid-row: 17  / span 4;	
	
	background-color: #fff;
}
*/
.scout-grid-1 .box.h {
    grid-column: 1 / span 9;
    grid-row: 17 / span 4;

    background-image: url('../img/home/your-comfort-zone.jpg');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

.scout-grid-1 .box.i {
    /*	
	grid-column: 5 / span 5;
	grid-row: 13  / span 4;
*/

    grid-column: 1 / span 5;
    grid-row: 21 / span 4;

    padding: 1em;
    border: 2px solid #231f20;
    background-color: #fff;
}

.scout-grid-1 .box.j {
    grid-column: 6 / span 4;
    grid-row: 21 / span 2;
    border: 2px solid #231f20;
    background-color: #fff;
}

h1.header-instagram {
    margin-top: 0.15 !important;
}

@media screen and (min-width: 768px) {
    .scout-grid-1 {
        grid-gap: 1.5em;
    }

    .scout-grid-1 {
        grid-template-columns: repeat(9, minmax(0, 1fr));
        grid-template-rows: 1fr;
    }

    .scout-grid-1 .box.a {
        grid-column: 1 / span 6;
        grid-row: 1 / span 4;
    }
    .scout-grid-1 .box.b {
        grid-column: 7 / span 3;
        grid-row: 2 / span 3;
    }
    .scout-grid-1 .box.c {
        grid-column: 1 / span 3;
        grid-row: 5 / span 3;
    }
    .scout-grid-1 .box.d {
        grid-column: 4 / span 3;
        grid-row: 5 / span 3;
    }
    .scout-grid-1 .box.e {
        grid-column: 7 / span 3;
        grid-row: 5 / span 3;
        min-height: auto;
    }
    .scout-grid-1 .box.f {
        grid-column: 1 / span 3;
        grid-row: 8 / span 3;
    }
    .scout-grid-1 .box.g {
        grid-column: 4 / span 6;
        grid-row: 8 / span 4;
    }
    /* OLD
	.scout-grid-1 .box.h {
		grid-column: 3 / span 4;
		grid-row: 12 / span 4;
	}
	*/
    .scout-grid-1 .box.h {
        grid-column: 1 / span 6;
        grid-row: 12 / span 4;
    }
    .scout-grid-1 .box.i {
        grid-column: 7 / span 3;
        grid-row: 12 / span 4;
    }
    .scout-grid-1 .box.j {
        grid-column: 7 / span 3;
        grid-row: 16 / span 3;
    }
}

/* ----------------------------------------------------------------
	Video
-----------------------------------------------------------------*/

.container-video {
    margin-top: 1em;
}

.embed-container {
    position: relative;
    padding-bottom: 56.25%;
    overflow: hidden;
    max-width: 100%;
    height: auto;
    margin-top: 0;
}
.embed-container iframe,
.embed-container object,
.embed-container embed,
.embed-container video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.embed-container.content-video {
    margin-top: 0;
}

.mobile-video {
    display: none;
}

video::-internal-media-controls-download-button {
    display: none;
}

video::-webkit-media-controls-enclosure {
    overflow: hidden;
}

video::-webkit-media-controls-panel {
    width: calc(100% + 30px); /* Adjust as needed */
}

/* ----------------------------------------------------------------
	UNIVERSAL HELPERS
-----------------------------------------------------------------*/

.fp-cols {
    width: 100%;
}
@media screen and (min-width: 600px) {
    .fp-cols {
        width: 33.333333333%;
        float: left;
    }
}

.img-responsive {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 0 auto;
}

.media-desktop {
    display: none;
}
.media-mobile {
    display: block;
}

@media screen and (min-width: 620px) {
    .media-desktop {
        display: block;
    }
    .media-mobile {
        display: none;
    }
}