﻿body
{
	font-family:NexaRegular;
}
.slide-container
{
	position:absolute;
	top:0px;
	bottom:0px;
	right:0px;
	left:0px;
	
	overflow:hidden;
}
.slide
{
	width:100%;
	height:100%;
	
	display:table;
	border-collapse:collapse;
	
	position:relative;
}

.header-row, .content-row, .next-row
{
	display: table-row;
}
.header-row, .next-row
{
	height:0px;
}
.content-cell
{
	vertical-align:middle;
	text-align:center;
}
.header-cell, .content-cell, .next-cell
{
	display: table-cell;
	padding: 36px;
}

.content-cell
{
	height:100%;
}

a
{
	text-decoration:none;	
	color:inherit;
}

a:hover,a:active
{
	color:white;
}


.content
{
/*	width: 50%;
	height: 50%;*/
}


.next a
{
	margin: 0px auto;
	background-repeat:no-repeat;
	width:54px;
	height:64px;
	display:block;
}

.dark .next a
{
	background-image:url('icon/next-light.png');
}
.light .next a
{
	background-image:url('icon/next-dark.png');
}
.next a:active, .next a:hover
{
	background-image:url('icon/next-white.png');
}


a[href="[NEXT]"]
{
	visibility:hidden;
}


.light
{
	background-color: #00CCFF;
	color:#330033;
}

.dark
{
	background-color:#330033;
	color: #00CCFF;
}


.header .name
{
	font-size:18px;
	letter-spacing:0.2em;
	margin-left:15px;
	margin-right:0px;
	
	position: relative;
	top: 2px;
}

.header
{
	text-align:center;
}

.header a
{
	display:inline-block;
	
}

.header .icon-group
{
	display:inline-block;
}

a#contact
{
	width:30px;
	height:20px;
	
	margin-left:30px;
	vertical-align:middle;

}

.dark a#contact
{
	background-image:url('icon/contact-light.png');	
}
.light a#contact
{
	background-image:url('icon/contact-dark.png');	
}
a#contact:active, a#contact:hover
{
	background-image:url('icon/contact-white.png');	
}




a#fb,
a#legal
{
	
	background-repeat:no-repeat;

	height:16px;
	margin-bottom:2px;
	margin-top:2px;
	
	
	vertical-align:middle;
}

a#fb
{
	width:9px;
	margin-left:15px;
}

.dark a#fb
{
	background-image:url('icon/fb-light.png');
}
.light a#fb
{
	background-image:url('icon/fb-dark.png');
}

a#fb:active,a#fb:hover
{
	background-image:url('icon/fb-white.png');
}


a#legal
{
	width:12px;
	margin-left:16px;
}

.dark a#legal
{
	background-image:url('icon/legal-light.png');
}
.light a#legal
{
	background-image:url('icon/legal-dark.png');
}
a#legal:active,a#legal:hover
{
	background-image:url('icon/legal-white.png');
}

/********
SLIDE ELEMENTS
********/
span.important
{
	color:white;
}
.start-text
{
	font-size:60px;
	line-height: 72px;
	letter-spacing: 0.1em;
}
.about-text, .contact-text, .legal-text, .clients-text
{
	font-size:30px;
	line-height:48px;
	letter-spacing: 0.05em;
}

.clients-text
{
	letter-spacing: 0.15em;
}

.portfolio-text
{
	font-size:72px;
	color:white;
	line-height:86px;
	letter-spacing:0.1em;
}

.portfolio-text a:before
{
	content:"\2198";
	font-size:140px;
}

.client-slide
{
	background-size:  cover;
	background-repeat:no-repeat;
	background-position: center;
}




.client-axelspringer
{
	background-image:url('clients/bild.png');
}

.client-bombardier
{
	background-image:url('clients/bombardier.png');
}

.client-caprisonne
{
	background-image:url('clients/caprisonne.png');
}

.client-drgerwerk
{
	background-image:url('clients/draeger.png');
}
.client-ergo
{
	background-image:url('clients/ergo.png');
}
.client-grothbau
{
	background-image:url('clients/groth.png');
}
.client-hamburgtourismus
{
	background-image:url('clients/hamburg.png');
}
.client-stgobainecophon
{
	background-image:url('clients/ecophon.png');
}
.client-stiftungmensch
{
	background-image:url('clients/stiftung.png');
}
.client-miks
{
	background-image:url('clients/miks.png');
}
.client-molda
{
	background-image:url('clients/molda.png');
}

.client.current
{
	color:white;
}

.strange-header
{
	display:none;
}
.normal-header
{
	display:block;
}

a.download
{
	width: 161px;
	height: 170px;
	display: block;
	background-image: url('icon/pdf.png');
	margin: 0px auto;
}


/*SMALL SCREEN*/
@media all and (max-width: 480px) 
{
	.header-cell, .content-cell, .next-cell
	{
		padding: 18px;
	}
	
	.dark .next a
	{
		background-image:url('icon/next-small-light.png');
	}
	.light .next a
	{
		background-image:url('icon/next-small-dark.png');
	}
	.next a:active, .next a:hover
	{
		background-image:url('icon/next-small-white.png');
	}
	
	.next a
	{
		margin: 0px auto;
		background-repeat:no-repeat;
		width:27px;
		height:32px;
		display:block;
	}

}

@media all and (max-width: 1024px) 
{
	.start-text
	{
		font-size:48px;
		line-height: 60px;
	}
}

@media all and (max-width: 515px), (max-height: 452px)
{
	.start-text
	{
		font-size:36px;
		line-height: 48px;
	}
}

@media all and (max-width: 368px), (max-height: 305px)
{
	.start-text
	{
		font-size:30px;
		line-height: 38px;
	}
}

@media all and (max-width: 314px), (max-height: 336px)
{
	.start-text
	{
		font-size:18px;
		line-height: 22px;
		letter-spacing:0.2em;
	}
}

@media all and (max-width: 1024px),(max-height:574px)
{
	.about-text
	{
		font-size: 24px;
		line-height: 38px;
	}	
}

@media all and (max-width: 373px),(max-height:407px)
{
	.about-text
	{
		font-size:18px;
		letter-spacing: 0.150em;
		line-height: 30px;
	}
}

@media all and (max-width: 321px),(max-height:359px)
{
	.about-text
	{
		font-size:11px;
		letter-spacing: 0.2em;
		line-height: 14px;
	}
}

@media all and (max-width:1024px),(max-height:643px)
{
	.clients-text
	{
		font-size:24px;
		line-height:38px;	
	}
}
@media all and (max-width:381px),(max-height:487px)
{
	.clients-text
	{
		font-size:18px;
		line-height:30px;	
	}
}
@media all and (max-width:310px),(max-height:419px)
{
	.clients-text
	{
		font-size:11px;
		line-height:14px;	
		letter-spacing:0.2em;
	}
}

@media all and (max-width:1024px),(max-height:422px)
{
	.portfolio-text
	{
		font-size:60px;
		line-height:72px;
	}
	.portfolio-text a:before
	{
		font-size:120px;
	}

}

@media all and (max-width:811px),(max-height:394px)
{
	.portfolio-text
	{
		font-size:60px;
		line-height:72px;
	}
	.portfolio-text a:before
	{
		font-size:120px;
	}

}

@media all and (max-width:351px),(max-height:379px)
{
	.portfolio-text
	{
		font-size:30px;
		line-height:36px;
	}
	.portfolio-text a:before
	{
		font-size:60px;
	}

}

@media all and (max-width:1024px),(max-height:643px)
{
	.contact-text, .legal-text
	{
		font-size:24px;
		line-height:38px;	
	}
}

@media all and (max-width:369px),(max-height:471px)
{
	.contact-text, .legal-text
	{
		font-size:18px;
		line-height:30px;	
		letter-spacing:0.15em;
	}
}

@media all and (max-width:286px),(max-height:421px)
{
	.contact-text, .legal-text
	{
		font-size:11px;
		line-height:14px;	
		letter-spacing:0.2em;
	}
}





@media all and (max-width: 400px) 
{
	.strange-header
	{
		display:block;
	}
	.normal-header
	{
		display: none;
	}
	
	.strange-header .icon-group
	{
		margin-bottom:18px;
	}
	.strange-header .name
	{
		display:block;
	}
	.strange-header #contact
	{
		margin-left:0px;
	}
}









	


