@media (min-width: 320px) and (max-width: 1024px) {

	body {
		font-size:1.3em;
	}
	p, li {
		font-size:2.1em;
	}
	p.big {
		font-size:2.7em;
		}
	h1 {
		font-size:3.3em;
	}
	h2 {
	    font-size:3em;
	}

	nav {
		position: fixed;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		background: rgba(45,242,164,0.95);
		overflow-y:scroll;
		z-index: 100;
	}
	nav ul {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		height: 100%;
	}

	nav ul li {
		display: block;
		height: 4em;
	}

	nav ul li a {
		font-size:2.5em;
		font-weight: bold;
		color: white;
	 	text-decoration:none;
	}

	nav ul li a:hover,
	nav ul li a:focus {
		color: white;
	}

	#navBtnOpen {
		display:inline;
	}

	.imgNavBtnClose {
		width:150px;
		height:150px;
	}

	.imgNavBtnOpen {
		width:150px;
		height:110px;
	}

	#navBtnClose {
		display:block;
		position:absolute;
		top:20px;
		right:20px;
	}

	.content {
		top:0px;
	}

	#top {
		margin-top:2em;
		height:150px;
		align-items: flex-start;
	}
	#logo {
		height:150px;
	}
	#img-logo {
		width:320px;
		height:110px;
	}

	#stage {
		width:80%;
		top:-20px;
	}

	#stage-teaser {
		display: none;
	}

	#dots-home {
		height:67.5%;
		top:180px;

		background-image: radial-gradient(#F3CE2A 30%, transparent 30%),
		radial-gradient(#F3CE2A 30%, transparent 30%);
		background-size: 160px 160px;
		background-position: -80px -80px, 0px 0px;
	}

	#offering {
		width:80%;
		margin:2em 0 0 15%;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}

	.mt-item {
		width:750px;
		height:750px;
	}

	.mt-item.mt-item1, .mt-item.mt-item2, .mt-item.mt-item3, .mt-item.mt-item4 { margin:0 0 2em 0 }

	.mt-content {
		width:450px;
		top:50px;
		border:16px dotted white;
	}
	.mt-title {
		left:-100px;
		width:850px;
	}
	.mt-text {
		
	}

	.cases-item {
		width:80%;
		height:430px;
	}
	.cases-title {
		top:240px;
		width:800px;
		float:left;
		text-align: right;
		left:0px;
	}
	.cases-content {
		padding:0.2em;
	}

	.cases-item.item1, .cases-item.item2, .cases-item.item3, .cases-item.item4 {
		margin:0 0 2em 0.5em;
	}

	.course {
		width:90%;
		margin-bottom:3em;
	}

	.circle-portrait {
		width: 500px;
		height: 500px;
	}

	.portrait {
		width: 500px;
	}

	.dots-green { display: none }
	.dots-yellow { display: none }


	#location {
		margin-top:5em;
		width:90%;
		top:0px;
		float:left;
		margin-right:0;
		padding:0.3em 0 0.5em 1em;
	}

	#newsletter {
		width:90%;
		float:left;
		margin-bottom:5em;
	}

	.toggleDisplayBlock {
		display:none;
	}
	.toggleDisplayInline {
		display:none;
	}

}