@media only screen and (max-width : 1024px) {

	header nav a {
		color: #FFF;
	}

	.rex-current a,
	header.sticky nav a:hover,
	.navigation a:hover {
		color: #000;
	}

	header {
		background-color: rgba(0,102,82,0.8);;
	}

	.navigation ul {
		background-color: #006652;
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
	}

	header {
		padding-top: 0;
	}

	header .logo {
		top: 3px;
		width: 145px;
		height: 145px;
		background-color: transparent;
	}

	.container {
		padding-left: 30px;
		padding-right: 30px;
	}

	.mobile-element {
		display: block;
	}

	.navigation {
		margin: 0;
		right: -100%;
		width: 50%;
		position: fixed;
		top: 0;
		bottom: 0;
	}

	.navigation .seperator {
		display: none;
	}

	.navigation ul {
		padding: 75px 30px 30px 30px;
	}

	.navigation li {
		width: 100%;
		margin-bottom: 20px;
	}

	.navigation a {
		line-height: 2em;
	}

	.show-navigation .navigation {
		right: 0;
	}

	.show-navigation section.contents,
	.show-navigation footer {
		opacity: 0.3;
	}

	.slideshow .arrow.next {
		right: 30px;
	}
	
	.slideshow .arrow.previous {
		left: 30px;
	}

	.teaser-box h2 {
		font-size: 25px;
	}
}

@media only screen and (max-width : 1024px) and (orientation: portrait), (max-width : 736px) {

	.slideshow .text {
		position: relative;
	}

}

@media only screen and (max-width : 736px) {

	.logo {
		margin-left: -5px;
	}

	.col-4 {
		width: 50%;
	}

	.col-4.last-row.third {
		display: none;
	}

	footer nav .col-4 {
		width: 100%;
	}

	footer nav .col-4.second .inner,
	footer nav .col-4.first .inner {
		padding-bottom: 0;
	}
}

@media only screen and (max-width : 480px) {

	.col-4 {
		width: 100%;
	}

	.col-4.last-row.second {
		display: none;
	}

	
}