/*

**********************************************
==============================================
CSS for Aceso
==============================================

+ by MANYFOLD
	- www.wearemanyfold.com
	- hello@wearemanyfold.com
	- @MANYFOLD

+ design by Decker Design
	- www.deckerdesign.com

==============================================
**********************************************

*/

/*
	**********************************************
	Fonts
	**********************************************
 */
/*--------------------------------------------------------------
# GT Walsheim
--------------------------------------------------------------*/

    @font-face {
        font-family: 'GT Walsheim';
        src: url('../fonts/GT-Walsheim-Regular.eot');
        src: url('../fonts/GT-Walsheim-Regular.eot?#iefix') format('embedded-opentype'),
             url('../fonts/GT-Walsheim-Regular.woff') format('woff'),
             url('../fonts/GT-Walsheim-Regular.ttf') format('truetype');
        font-weight: normal;
        font-style: normal;
    }

    @font-face {
        font-family: 'GT Walsheim';
        src: url('../fonts/GT-Walsheim-Regular-Oblique.eot');
        src: url('../fonts/GT-Walsheim-Regular-Oblique.eot?#iefix') format('embedded-opentype'),
             url('../fonts/GT-Walsheim-Regular-Oblique.woff') format('woff'),
             url('../fonts/GT-Walsheim-Regular-Oblique.ttf') format('truetype');
        font-weight: normal;
        font-style: italic;
    }

    @font-face {
        font-family: 'GT Walsheim';
        src: url('../fonts/GT-Walsheim-Medium.eot');
        src: url('../fonts/GT-Walsheim-Medium.eot?#iefix') format('embedded-opentype'),
             url('../fonts/GT-Walsheim-Medium.woff') format('woff'),
             url('../fonts/GT-Walsheim-Medium.ttf') format('truetype');
        font-weight: 500;
        font-style: normal;
    }

    @font-face {
        font-family: 'GT Walsheim';
        src: url('../fonts/GT-Walsheim-Medium-Oblique.eot');
        src: url('../fonts/GT-Walsheim-Medium-Oblique.eot?#iefix') format('embedded-opentype'),
             url('../fonts/GT-Walsheim-Medium-Oblique.woff') format('woff'),
             url('../fonts/GT-Walsheim-Medium-Oblique.ttf') format('truetype');
        font-weight: 500;
        font-style: italic;
    }

    @font-face {
        font-family: 'GT Walsheim';
        src: url('../fonts/GT-Walsheim-Bold.eot');
        src: url('../fonts/GT-Walsheim-Bold.eot?#iefix') format('embedded-opentype'),
             url('../fonts/GT-Walsheim-Bold.woff') format('woff'),
             url('../fonts/GT-Walsheim-Bold.ttf') format('truetype');
        font-weight: bold;
        font-style: normal;
    }


/*
	**********************************************
	Clearfix
	**********************************************
*/

	.cf:before,
	.cf:after {
		content: '.';
		display: block;
		visibility: hidden;
		font-size: 0;
		line-height: 0;
		width: 0;
		height: 0;
	}

	.cf:after { clear: both; }

/*	::selection {}

	::-moz-selection {}

	img::selection,
	img::-moz-selection {
	    background: transparent;
	}
*/

/*
	**********************************************
	Global
	**********************************************
*/

	html,
	body {
		-webkit-font-smoothing: antialiased;
		font-kerning: normal;
	}

	body {
		color: #000;
		background-color: #ffffff;
		font-family: "GT Walsheim", Arial, sans-serif;
		font-weight: normal;
		font-size: 32px;
		line-height: 42px;
	}

	.wrap {
		padding-left: 170px;
		padding-right: 170px;
		max-width: 100%; 
		/* 1596px */
		margin: 0 auto;
		box-sizing: border-box;
	}

	a {
		color: #15B55E;
		padding-bottom: 5px;
		border-bottom: 3px solid #15B55E;
		text-decoration: none;
		transition: .2s ease-in-out opacity;
	}

	a:hover {
		opacity: .5;
	}

	img {
		display: block;
		height: auto;
		max-width: 100%;
	}

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

	iframe { width:100%; }

/*
	**********************************************
	Hero
	**********************************************
*/

	#hero {
		background-size: cover;
		background-repeat: no-repeat;
		background-position: 50% 50%;
		height: 820px;
		position: relative;
		/*background-image:url('../images/hero.jpg');
*/	}

			.main-navigation {
				position:absolute !important;
				float:none;
				width:100%;
			}
			
	#hero-gradient {
		width: 100%;
		height: 280px;
		bottom: 0;
		position: absolute;
		z-index: 1;
		background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.65) 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 ); /* IE6-9 */
	}

	#hero .wrap {
		height: 100%;
/*		padding-top: 70px;
*/		position: relative;
		padding-left: 0;
		padding-right: 0;
	}

	#hero-content {
/*		padding-left: 40px;
		padding-right: 40px;
*/		height: 100%;
		width: 100%;
		box-sizing: border-box;
	}

	#hero h1 {
		width: 727px;
    	margin-left: 170px;
    	height: 570px;
	}


/*
	**********************************************
	Content
	**********************************************
*/

	#content .desktop {
		display: block;
	}

	#content .mobile {
		display: none;
	}

	#content .wrap {
		padding-top: 108px;
		padding-bottom: 108px;
	}

	#content p:not(:last-of-type),
	#content iframe,
	#content ul {
		margin-bottom: 54px;
	}

	#content p.no-margin {
		margin-bottom: 0;
	}

	#content p strong {
		font-family: "GT Walsheim", Arial, sans-serif;
		font-weight: bold;
		color:#15B55E;
	}
	
	#content p.intro strong {
		font-family: "GT Walsheim", Arial, sans-serif;
		font-weight: bold;
		color:#000;
	}
	
	#content em,
	#content ul li {
		font-family: "GT Walsheim", Arial, sans-serif;
		font-weight: bold;
	}

	#content h2 {
		color: #15B55E;
		font-family: "GT Walsheim", Arial, sans-serif;
		font-weight: bold;
	    font-size: 62px;
	    line-height: 72px;
	    bottom: 0;
	    z-index: 10;
	    left: 0;
	    padding: 0 0px 72px 0px;
	}

	#content .white { color:#fff; }
	
	#content .infographic {
		padding: 0 40px;
		margin: 70px 0 80px;
		box-sizing: border-box;
	}

	#content .modalTrigger {
		opacity: 1;
		border-bottom: 0;
		padding-bottom: 0;
	}

	#content .modalDialog {
		position: fixed;
		display: flex;
		align-items: center;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background: #fff;
		z-index: 99999;
		opacity:0;
		-webkit-transition: opacity 400ms ease-in;
		-moz-transition: opacity 400ms ease-in;
		transition: opacity 400ms ease-in;
		pointer-events: none;
		overflow: auto;
	}

	#content .modalDialog strong {
		color: #ff8a27;
	    display: block;
		position: fixed;
		left: 40px;
		top: 20px;
	}

	#content .modalDialog .close {
		color: #ff8a27;
		position: fixed;
	    right: 30px;
	    top: 20px;
	    border-bottom: 0;
	    padding-bottom: 0;
		background-repeat: no-repeat;
		background-position: 50% 50%;
		background-image: url(../images/close.svg);
		background-size: contain;
		display: block;
		text-indent: -9999px;
		width: 24px;
	}

	#content .modalDialog img {
		max-width: inherit;
		width: 300%;
	}

	#content .two-col {
		margin: 70px 0 80px;
	}

	#content .two-col img {
		width: 48%;
	}

	#content .two-col img:first-of-type {
		float: left;
	}

	#content .two-col img:last-of-type {
		float: right;
	}
	
/*
	**********************************************
	Responsive
	**********************************************
*/

	/* Smartphones (portrait and landscape) ----------- */
	@media only screen and (min-width : 320px) and (max-width : 767px) {
		
	    #footer-columns > .wrap { display:flex; flex-direction:column; }

		#footer-columns .col-wrap:first-of-type { display:none !important; }
		
		.site-copyright {
		    padding-top: 0;
		}
		
		 #footer-columns .content-section .col-wrap { display:flex; flex-direction:column; }
		
		.content-section .col-wrap.two-two.eq-col > .col {
		    flex: 1;
		    flex: 1 1 100%;
		    text-align: center;
		    margin: 0px;
		    padding: 0px;
		}
		
		#footer-social p {
		    margin-top: 0;
		}
		
		#footer-columns > .wrap {
		    padding-top: 30px;
		    padding-bottom: 30px;
		}
		
		#footer-columns .content-section .col-wrap:nth-child(2n+2) { 
		
		    display: flex;
		    flex-direction: column;
		    flex-flow: column-reverse;
		
		}
		
		#footer-columns .content-section .col-wrap:nth-child(2n+2) .col:last-child#footer-social {
		    margin-top: 0;
		    min-height: 64px;
		    margin-bottom: 60px;
		}
	
		#footer-columns p {
		    font-size: 16px;
		    line-height: 24px;
		}
		
		#footer-social p {
		    text-align: center;
		}
	
		#footer-social ul {
		    float: inherit;
		    margin: 0 auto;
		    display: flex;
			max-width:60%;
		}
	
		#footer-social li:not(:last-child) {
		    margin: 0px;
		    flex: 1 1 100%;
		}
		#footer-social li:first-child {
		    margin: 0px;
		}
		
		
		.mobile-only { display:block; }
		.desktop-only { display:none; }
	
		iframe {
		    height: 220px;
		    min-height: 220px;
			width:100%;
		}
			
		body {
			font-size: 18px;
			line-height: 24px;
		}

		a {
			padding-bottom: 3px;
			border-bottom: 2px solid #007638;
		}

		#hero {
				/*background-image: url('../images/hero-mobile.jpg');
*/height: 50vh;
			    background-size: cover;
			    min-height: 465px;
		}

		#hero .wrap {
			padding-top: 0px;
		}

		#hero h1 {
			max-width:165px;
			margin-left:0px; 
			margin-top:0px; 
		}

		#content h2 {
			font-size: 30px;
		    line-height: 36px;
		    padding: 0 0px 42px;
		}

		#content .wrap {
			padding-top: 42px;
			padding-bottom: 42px;
			padding-left: 20px;
			padding-right: 20px;
		}

		#content .desktop {
			display: none;
		}

		#content .mobile {
			display: block;
		}

		#content p:not(:last-of-type),
		#content ul {
			margin-bottom: 28px;
		}

		#content p.no-margin {
			margin-bottom: 0;
		}
		
		#content .infographic {
			padding: 0;
			margin-top: 48px;
			margin-bottom: 80px;
		}

		#content .modalTrigger {
			display: block;
		}

		#content .modalDialog:target {
			opacity: 1;
			pointer-events: auto;
		}

		#content .modalEnlarge {
			display: block;
		    text-align: right;
		    color: #0098ff;
			font-family: "GT Walsheim", Arial, sans-serif;
			font-weight: bold;
		    margin-top: 10px;
		    font-size: 20px;
		    background-repeat: no-repeat;
		    background-position: 0 50%;
		    background-image: url(../images/modal-enlarge.svg);
		    background-size: contain;
		    padding-left: 45px;
		    padding-top: 8px;
		    float: right;
		    padding-bottom: 8px;
		}

		#content .two-col {
			margin-top: 0;
			margin-bottom: 28px;
		}

		#content .two-col img {
			width: 100%;
			float: inherit;
		}

		#content .two-col img:first-of-type {
			margin-bottom: 20px;
		}

	}

	/* Smaller Desktops, Tablets ----------- */
	@media only screen and (min-width : 768px) and (max-width : 1024px) and (-webkit-min-device-pixel-ratio: 1) {
		
		.mobile-only { display:none; }
		.desktop-only { display:block; }
		
		
		body {
			font-size: 26px;
			line-height: 34px;
		}

		#hero h1 {
			max-width: 330px;
			margin-left:50px; 
			margin-top:0px; 
		}

		#content h2 {
			font-size: 56px;
			line-height: 60px;
		}

		#content .wrap {
			padding-top: 88px;
			padding-bottom: 88px;
		}

		#content p:not(:last-of-type),
		#content ul {
			margin-bottom: 44px;
		}

		#content p.no-margin {
			margin-bottom: 0;
		}

		#content .two-col {
			margin-top: 0;
			margin-bottom: 44px;
		}

	}

	/* Tablets (portrait) ----------- */
	@media only screen and (min-width : 768px) and (max-width : 1024px) and (-webkit-min-device-pixel-ratio: 1) and (orientation: portrait) {
	}
