/* Mobile Styles */
@media only screen and (max-width: 500px) {

  	/* Basic Layout */
	body {
		font-size:1.1em;
	}

	p {
		letter-spacing: -0.03rem;
	}

	h1 {
		letter-spacing: -0.14rem;
	}

	h2, h3 {
		letter-spacing: -0.09rem;
	}

	/* Form fields */
	input[type=text], input[type=email] {
	 	width: 100%;
	 	padding: 0.6em 0.6em;
	 	margin: 0 0 0.3em 0;
	}

	input[type=button], input[type=submit], input[type=reset], .button-link {
	 	padding: 0.5em 4em;
	 	margin:0.3em 0 0;
	}

	/* Structure */
	#wrapper {
		margin:2.5vw;
	}
	#logo {
		margin-left:0;
	}

	#stage {
		width:82vw;
		margin-left: 6.5vw;
		margin-top: 9.5vw;
		background-color:#F3CE2A;
	}

	#stage-content {
		width:100%;
		padding-right: 1em;
	}

	#stage-teaser {
		display: none;
	}

	.dots {
		width: 95vw;
		height: 75vw;

		background-color:white;
		background-image: radial-gradient(#F3CE2A 25%, transparent 25%),
		radial-gradient(#F3CE2A 25%, transparent 25%);

		background-size: 13.6vw 13.6vw;
		background-position: 6.8vw 6.8vw, 0px 0px;
	}

	.dots-sub {
		height: 43vw;
	}

	.dots-green {
		background-image: radial-gradient(#2CF2A3 25%, transparent 25%),
		radial-gradient(#2CF2A3 25%, transparent 25%);
	}

	.dots-footer {
		display:none;
	}

	.dots-who {
		width:100%;
		position: relative;
		top:-44.2rem;
		height: 48vw;
		z-index: 0;
	}

	.wide {
		width:95%;
	}

	.indent {
		width:90%;
		margin-left:10%;
	}

	.medium {
		width:100%;
		margin-left:0;
	}

	.slim {
		width:100%;
		margin-left:0;
	}

	.cols {
		display:flex;
		align-items: flex-start;
		justify-content: space-between;
		flex-wrap: wrap;
	}

	.cols > img {
		margin-right:0em;
	}

	.spread {
		justify-content: space-around;
	}

	.boxed {
		display: flex;
		align-items: flex-start;
		flex-direction: column;
		flex-wrap: wrap;
		width:100%;
	}

	.box-odd, .box-even {
		padding-left:0;
	}

	.boxed > .box-img > img {
		width:calc(100%);
	}

	.box-1 > .box-floating > .floating-title { margin-left: 0; }
	.box-2 > .box-floating > .floating-title { margin-right: 0; }
	.box-3 > .box-floating > .floating-title { margin-left: 0; }
	.box-4 > .box-floating > .floating-title { margin-right: 0; }
	.box-5 > .box-floating > .floating-title { margin-left: 0; }

	.box-even > .box-img { order:0; }
	.box-even > .box-floating {	order:1; }

	.floating-content {
		padding-top:0.2em;
		margin-bottom:1em;
	}

	.floating-title {
		margin-top:0.2em;
	}

	.box-floating {
		margin-top: -6.33em;
		margin-left: 1em;
		width: 90%;
	}

	.box-even > .box-floating > .floating-title {
		text-align: left;
	}

	.box-odd > .box-floating > .floating-content {
		padding-left:0;
	}

	.box-even > .box-floating > .floating-content {
		text-align: left;
		padding-right:0;
	}

	.dotted-box {
		width:88%;
		margin-bottom:1.6em;
		border: 8px dotted #2CF2A3;
		padding:1em;
	}

	.offer-item {
		width:100%;
		height:33vh;
		background-position:top left;
	}

	.offer-content {
		width:90%;
		display: flex;
		justify-content: flex-start;
		flex-direction: column;
	}

	.offer-text {
		width:100%;
		padding:0;
	}

	.offer-title {
		width:100%;
		margin:0;
	}

	.offer-item.offer-item1, .offer-item.offer-item3 {
		margin:0 0 2em 5.66em;
	}

	.offer-item.offer-item2, .offer-item.offer-item4 {
		margin:0 5.66em 2em 0;
	}

	.offer-item.offer-item1 > .offer-content, .offer-item.offer-item3 > .offer-content {
		margin-left:-5.66em;
		text-align: right;
		align-items: flex-end;
	}

	.offer-item.offer-item2 > .offer-content, .offer-item.offer-item4 > .offer-content {
		margin-left:calc(10% + 5.66em);
		align-items: flex-start;
	}

	.cases-item {
		width:90%;
		height:200px;
	}
	.cases-title {
		float:left;
		text-align: right;
		left:-40px;
	}
	.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:80%;
		margin-bottom: 1em;
		margin-left: 0.5em;
	}

	#who {
		padding:0;
		top: 2.66rem;
		justify-content: center;
		flex-wrap: wrap;
	}

	.portrait {
		padding: 0;
	}

	.dots-who {
		top:-47.5rem;
	}

	#clients {
		
	}

	.clients {
		justify-content: space-around;
	}

	.client {
		margin: 0;
		padding: 0;
		width: 40%;
		transform: scale(0.8);
	}

	.client > img {
		width: 100%;
	}

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

	.portrait {
		width: 250px;
		margin-bottom: 2em;
	}

	.content {
		width:80%;
	}

	.lead-img {
		display:none;
	}

	.lead {
		padding-left: 0;
	}

	.statement {
		position: relative;
		left:0px;
		top:20px;
		width:100%;
		align-items: center;
		flex-wrap:wrap;
		background-color:#F3CE2A;
		padding:1em;
	}

	.statement {
		position: relative;
		top:-60px;
		width:80%;
		align-items: center;
		flex-wrap:wrap;
		background-color:#F3CE2A;
		padding:1em;
	}

	.facilitator-text {
		width:100%;
		align-items: center;
		margin:0 0 1em 0;
	}

	.signup {
		width:88%;
	}

	.cta {
		width:90%;
		margin:0 0 2em 0;
		padding:1em;
		background-color: #F3CE2A;
	}

	#footer {
		width:100%;
		justify-content: space-around;
		flex-direction: column;
	}

	#location {
		margin: 0 0 0 0;
		width:95%;
		padding:0.3em 0 0.5em 1em;
	}

	#newsletter {
		width:90%;
		margin: 0 0 1em 0;
	}

	#cookie-banner > p {
		font-size: 0.8em;
	}

	#cookie-banner {
		width: 90%;
		position: fixed;
		bottom: -11em;
	}

	.cookie-button {
		display: block;
		width: 80%;
		margin: 0.33em auto;
	}
}

/* Tablet Styles */
@media only screen and (min-width: 601px) and (max-width: 960px) {

  	/* Basic Layout */
	body {
		font-size:1.1em;
	}

	p {
		letter-spacing: -0.03rem;
	}

	h1 {
		letter-spacing: -0.14rem;
	}

	h2, h3 {
		letter-spacing: -0.09rem;
	}

	/* Structure */
	#stage-teaser {
		width: 30vw;
	    height: 30vw;
	}

	.slim {
		width:calc(95% - 80px);
		margin-left:80px;
	}

	.cols {
		display:flex;
		align-items: flex-start;
	}

	.lead {
		padding-left: 0;
	}

	.lead-img {
		width: 40%;
		margin-left:2em;
		margin-top:0.2em;
	}
	.lead-text {
		width: 60%;
	}
	.lead-img > img {
		width: calc(100%);
	}
	.lead-img.left { margin-left:0; margin-right:1em; }

	.stretch {
		align-items: flex-start;
		flex-wrap: wrap;
	}

	.dotted-box {
		width:80%;
		border: 8px dotted #2CF2A3;
		padding:1em;
		margin-bottom: 1em;
	}

	.dotted-box > h3 {
		margin-top:0;
	}

	.dotted-box.even {
		border: 8px dotted #F3CE2A;
	}
	.dotted-box.odd {
		border: 8px dotted #2CF2A3;
	}

	.facilitator-text {
		width:55%;
	}

	.offer-item {
		width:35vw;
		height:35vw;
		background-position:top left;
	}

	.offer-item.offer-item1, .offer-item.offer-item3 { margin-left:0em; }
	.offer-item.offer-item2, .offer-item.offer-item4 { margin-top:4em; margin-right:0; }

	.course {
		width:38%;
		margin-right: 1em;
		border: 8px dotted #2CF2A3;
	}

	#who {
		padding:0;
		top: 2.66rem;
		justify-content: center;
	}

	.clients {
		justify-content: space-around;
	}

	.client {
		margin: 0;
		padding: 0;
		width: 40%;
		transform: scale(0.8);
	}

	.client > img {
		width: 100%;
	}

	.portrait {
		padding: 0;
		width: 45vw;
	}

	.dots-who {
		top:-22.66rem;
	}

	.dots-footer {
		top:-18rem;
	}

	#location {
		width:30%;
		padding:0.3em 0 0.5em 1em;
		margin-top:-4em;
	}

	#newsletter {
		margin-top:3em;
	}

	.box-odd {
		padding-left:0;
	}

	.box-even { margin-left:0; }

	.box-odd > .box-floating { margin-left: 0.33em; }
	.box-even > .box-floating { margin-right: 0.33em; }

	.floating-content {
		width:45vw;
	}

	.boxed > .box-img > img {
		width:calc(100%);
	}

	input[type=text], input[type=email] {
	 	width: 90%;
	 	padding: 0.6em 0.6em;
	 	margin: 0 0 0.3em 0;
	}

	input[type=button], input[type=submit], input[type=reset], .button-link {
	 	padding: 0.5em 4em;
	 	margin:0.3em 0 0;
	}

	#cookie-banner {
		width: 45%;
		position: fixed;
		bottom: -8.66em;
	}

	.cookie-button {
		display: block;
		width: 85%;
	}

}

@media only screen and (min-width: 501px) and (max-width: 600px) {
  	/* Basic Layout */
	body {
		font-size:1.1em;
	}

	p {
		letter-spacing: -0.03rem;
	}

	h1 {
		letter-spacing: -0.14rem;
	}

	h2, h3 {
		letter-spacing: -0.09rem;
	}

	/* Structure */
	#wrapper {
		margin:2.5vw;
	}
	#logo {
		margin-left:0;
	}
	#stage {
		margin-left: 6.5vw;
		margin-top: 8vw;
	}
	#stage-content {
		width: 66%;
	}
	#stage-teaser {
		width: 30vw;
	    height: 30vw;
	}

	#stage-teaser > h2 {
		font-size: 1.1em;
	}
	#stage-teaser > p {
		font-size: 0.9em;
	}


	.dots {
		width: 95vw;
		height: 75vw;

		background-color:white;
		background-image: radial-gradient(#F3CE2A 25%, transparent 25%),
		radial-gradient(#F3CE2A 25%, transparent 25%);

		background-size: 13.6vw 13.6vw;
		background-position: 6.8vw 6.8vw, 0px 0px;
	}

	.dots-sub {
		height: 43vw;
	}

	.dots-green {
		background-image: radial-gradient(#2CF2A3 25%, transparent 25%),
		radial-gradient(#2CF2A3 25%, transparent 25%);
	}

	.dots-footer {
		display:none;
	}

	.dots-who {
		width:100%;
		position: relative;
		top:-44.2rem;
		height: 48vw;
		z-index: 0;
	}

	.wide {
		width:95%;
	}

	.indent {
		width:90%;
		margin-left:10%;
	}

	.medium {
		width:calc(95% - 6vw);
		margin-left:6vw;
	}

	.slim {
		width:calc(95% - 6vw);
		margin-left:6vw;
	}
	.cols {
		display:flex;
		align-items: flex-start;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	.cols > img {
		margin-right:0em;
	}

	.spread {
		justify-content: space-around;
	}


	.lead {
		padding-left: 0;
	}

	.lead-img {
		width: 34%;
		margin-left:1em;
		margin-top:0.2em;
	}
	.lead-text {
		width: 61%;
	}
	.lead-img > img {
		width: calc(100%);
	}
	.lead-img.left { margin-left:0; margin-right:0.33em; }

	.stretch {
		align-items: flex-start;
		flex-wrap: wrap;
	}

	.dotted-box {
		width:80%;
		border: 8px dotted #2CF2A3;
		padding:1em;
		margin-bottom: 1em;
	}

	.dotted-box > h3 {
		margin-top:0;
	}

	.dotted-box.even {
		border: 8px dotted #F3CE2A;
	}
	.dotted-box.odd {
		border: 8px dotted #2CF2A3;
	}

	#who {
		padding:0;
		top: 2.66rem;
		justify-content: center;
		flex-wrap: wrap;
	}

	#clients {
		margin-top: -14em;
		margin-bottom: 6em;
	}

	.clients {
		justify-content: space-around;
	}

	.client {
		margin: 0;
		padding: 0;
		width: 40%;
		transform: scale(0.8);
	}

	.client > img {
		width: 100%;
	}

	.portrait {
		padding: 0;
	}

	.facilitator-text {
		width:55%;
	}

	.offer-item {
		width:100%;
		height:33vh;
		background-position:top left;
	}

	.offer-content {
		width:90%;
		display: flex;
		justify-content: flex-start;
		flex-direction: column;
	}

	.offer-text {
		width:100%;
		padding:0;
	}

	.offer-title {
		width:100%;
		margin:0;
	}

	.offer-item.offer-item1, .offer-item.offer-item3 {
		margin:0 0 2em 30vw;
	}

	.offer-item.offer-item2, .offer-item.offer-item4 {
		margin:0 30vw 2em 0;
	}

	.offer-item.offer-item1 > .offer-content, .offer-item.offer-item3 > .offer-content {
		margin-left:-30vw;
		text-align: right;
		align-items: flex-end;
	}

	.offer-item.offer-item2 > .offer-content, .offer-item.offer-item4 > .offer-content {
		margin-left:30vw;
		align-items: flex-start;
	}

	.course {
		width:80%;
		margin-right: 10%;
		margin-bottom: 1em;
		border: 8px dotted #2CF2A3;
	}

	#who {
		padding:0;
		top: 2.66rem;
		justify-content: center;
	}

	.portrait {
		padding: 0;
		width: 80vw;
		margin-bottom: 2em;
	}

	.dots-who {
		top:-47rem;
	}

	.dots-footer {
		display: none;
	}

	.box-odd {
		padding-left:0;
	}

	.box-even { margin-left:0; }

	.box-odd > .box-floating { margin-left: 0.33em; }
	.box-even > .box-floating { margin-right: 0.33em; }

	.floating-content {
		width:45vw;
	}

	.boxed > .box-img > img {
		width:calc(100%);
	}

	input[type=text], input[type=email] {
	 	width: 90%;
	 	padding: 0.6em 0.6em;
	 	margin: 0 0 0.3em 0;
	}

	input[type=button], input[type=submit], input[type=reset], .button-link {
	 	padding: 0.5em 4em;
	 	margin:0.3em 0 0;
	}

	.signup {
		width:88%;
	}

	.cta {
		width:90%;
		margin:0 0 2em 0;
		padding:1em;
		background-color: #F3CE2A;
	}

	#footer {
		width:100%;
		justify-content: space-around;
		flex-direction: column;
	}

	#location {
		margin-top:0rem;
		width:96%;
		padding:0.3em 0 0.5em 1em;
	}

	#newsletter {
		margin-top:-6rem;
		width:92%;
		margin-bottom:1em;
	}

	#cookie-banner {
		width: 60%;
		position: fixed;
		bottom: -9.5em;
	}

	.cookie-button {
		display: block;
		width: 85%;
	}

}



@media only screen and (max-width: 960px) {
	/* Mobile Navigation */

	/* Navigation */
	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: 75vh;
	}

	nav ul#language {
		display: flex;
		flex-direction: row;
		align-items: flex-start;
		justify-content: center;
		height: 25vh;
	}

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

	nav ul#language li {
		display: inline;
		height: auto;
	}

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

	nav ul#language li a {
		font-size:1.5em;
		font-weight:400;
		margin:0 0.33em 0 0.33em;
		color: white;
	 	text-decoration:none;
	}

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

	#navBtnOpen {
		display:block;
	}

	#navBtnClose {
		display:block;
		position:absolute;
		top:30px;
		right:0.5em;
	}

	.imgNavBtnClose {
		width:55px;
		height:40px;
	}

	.imgNavBtnOpen {
		width:55px;
		height:40px;
	}

	#navSepearator {
		display:none;
	}

	#sticky-subnav {
		display: none;
	}

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

}