html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1;margin:0}ol,ul,li{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}a{text-decoration:none;outline:none}
html,body{text-rendering:optimizeLegibility; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; z-index:1; font-size:100%; padding:0; margin:0;-webkit-overflow-scrolling:touch}
*::-moz-selection{background-color:#000;color:#FFF}
*::selection{background-color:#000;color:#FFF}
*:active,*:focus{outline:0}
*,*:after,*:before{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box}
::-webkit-scrollbar{display:none}

body{
	background-color:white;
	color:black;
	letter-spacing:0.025em;
	font-family:'Helvetica', 'Arial';
	font-size:22px;
	line-height:26px;
	overflow:hidden;
	height:101%;
	text-rendering:optimizeLegibility; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;

	/* 
	-moz-hyphens:auto;-o-hyphens:auto;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;
	-moz-hyphenate-limit-chars:5;-o-hyphenate-limit-chars:5;-webkit-hyphenate-limit-chars:5;-ms-hyphenate-limit-chars:5;	
	-moz-hyphenate-limit-lines:2;-o-hyphenate-limit-lines:2;-webkit-hyphenate-limit-lines:2;-ms-hyphenate-limit-lines:2
	*/
}

a{
	color:#0000ff;
	-webkit-transition: color 0.1s ease-out;
  	-moz-transition: color 0.1s ease-out;
  	-o-transition: color 0.1s ease-out;
  	transition: color 0.1s ease-out;
}

a:hover{
	color:#0000ff
}



#wrapper{
	width:100%;
	height:100%;
	overflow:hidden
}

header{
	top:0;
	left:0;
	position:absolute;
	background-color: none;
	padding:14px;
	height:72px;
	width:100%;
	z-index:900;
	-webkit-box-shadow:0px 10px 20px 0px rgba(0,0,0,0);
	-moz-box-shadow:0px 10px 20px 0px rgba(0,0,0,0);
	box-shadow:0px 10px 20px 0px rgba(0,0,0,0)
}

header.hide{
	-webkit-box-shadow:none;
	-moz-box-shadow:none;
	box-shadow:none;
	background-color: transparent
}

.black{
	top:0;
	left:0;
	position:absolute;
	padding:14px;
	height:72px;
	width:100%;
	background:black;
	z-index:800
}

.main{
	position:absolute;
	width:100%;
	height:100%;
	overflow:scroll
}

.stop{
	position:fixed;
	width:100%;
	height:100%;
	left:0;
	top:0;
	z-index:100;
	background-color:black;
	display:none
}

.stop.show{
	display:block
}

.wrapper{
	margin:0 0 0 14px
}

.line{
	top:72px;
	left:0px;
	width:100%;
	position:absolute;
	z-index:2000;
	color:#969696
}

.line.hide{
	z-index:1
}

.line_big{
	width:100%;
	padding:0 0px 0 14px;
	float:left
}

.line{
	top:72px;
	left:0px;
	width:100%;
	position:absolute;
	z-index:900
}

.line.hide{
	z-index:1
}

.line_big{
	width:75%;
	padding:0 18px 0 24px;
	float:left
}

.line_small{
	width:25%;
	padding:0 24px 0 6px;
	float:left
}

.line_big p,.line_small p{	
	border-top:1px solid #969696
}


.divide{
	border-top:1px solid #969696;
	padding-top:14px
}

.grid{
	width:100%;
	overflow:scroll;
	list-style:none;
	-webkit-column-count:4;
	-moz-column-count:4;
	column-count:4;
	-webkit-column-gap:0;
	-moz-column-gap:0;
	column-gap:0;
	float:left;
	padding-top:15px;
}

.project{
	-webkit-column-break-inside:avoid;
	column-break-inside:avoid;
	page-break-inside:avoid;
	break-inside:avoid;
	padding-bottom:14px;
}

.linki{
	cursor:pointer;
	list-style-type:circle;
	/* border-top:1px solid #969696;*/
	border-left:0px;
	/*padding-top:14px;*/
	margin-right:14px;
	-webkit-transition: color 0.1s ease-out;
  	-moz-transition: color 0.1s ease-out;
  	-o-transition: color 0.1s ease-out;
  	transition: color 0.1s ease-out;
}

.linki:hover{
	color:#969696;
}


.meta{
	/*font-style:italic;*/
	margin-right:14px;
	font-style: italic;
}

img.arrow{
    float:right
}

.about{
	font-size:22px;
	line-height:26px;
	background-color:#white;
	color: black;
	width:50%;
	padding-top: 9px;
	padding-left: 14px;
	padding-right: 14px;
	overflow: hidden
}


.about_left{
	float:left;
	width:75%;
	padding-right:24px

}

.about_right{
	width:25%;
	float:left;
	padding-right:24px
}



#close{
	position:absolute;
	left:24px;
	right:24px;
	width:16px;
	height:15px;
	-moz-background-size:100% 100%;-webkit-background-size:100% 100%;background-size:100% 100%;
	display:none;
cursor:pointer
}

#close:hover,#close:visited{
	border-bottom-width:0px;
	width:16px
}
	
.thumbnail{
	z-index:999;
	position:absolute;
	display:none;
	opacity:0
}

.thumbnail img{
	background-color:none
}

/* Detail */

.detail{
	top:0;
	width:100vw;
	height:100vh;
	background-color:black;
	position:absolute;
	left:100%;
	z-index:200
}

.frame{
	height:100vh;
	margin: auto;
}

.info{
	position:absolute;
	width:100%;
	height:48px;
	left:24px;
	bottom:0px
}

/* Slider */

.slider{
	position:absolute;
	top:50%;
	left:50%;
	left:50%;
	-webkit-transform:translate(-50%,-50%);
	-moz-transform:translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
	-o-transform:translate(-50%,-50%);
	transform:translate(-50%,-50%);
	max-height:78vh;
	width:100vw
}

.slider img,.item img{
	max-width:100vw;
	max-height:78vh;
	padding-left:24px;
	padding-right:24px
}

.item{
	padding:0 600px;
	opacity:0
}

.kursiv{
	font-style:italic
}

.small{
	font-size: 22px;
	line-height: 26px;
	padding-right: 14px;
}

.contact{
	font-size: 22px;
	line-height: 26px;
	padding-top: 18px
	}

.preview{
	max-width:100%;
    height: auto;
    padding-bottom:6px
}

.text-mobile{
	display: none;
}	

.text-desktop{
	display: static;
}

/* Slick */

.slick-slider{position:relative;display:block;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:transparent}
.slick-list{position:relative;display:block;overflow:hidden;margin:0;padding:0}
.slick-list:focus{outline:none}
.slick-list.dragging{cursor:pointer;cursor:hand}
.slick-slider .slick-track,.slick-slider .slick-list{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
.slick-track{position:relative;top:0;left:0;display:block}
.slick-track:before,.slick-track:after{display:table;content:''}
.slick-track:after{clear:both}
.slick-loading .slick-track{visibility:hidden}
.slick-slide{display:none;float:left;height:100%;min-height:1px}
[dir='rtl'] .slick-slide{float:right}
.slick-slide img{display:block}
.slick-slide.slick-loading img{display:none}
.slick-slide.dragging img{pointer-events:none}
.slick-initialized .slick-slide{display:block}
.slick-loading .slick-slide{visibility:hidden}
.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}
.slick-arrow.slick-hidden{display:none}
	
/* Arrows */

.slick-next,.slick-next:hover{
	font-size:0;
	line-height:0;
	position:absolute;
	top:50%;
	display:block;
	height:100%;
	padding:0;
	margin-top:-10px\9;
	-webkit-transform:translate(0,-50%);-ms-transform:translate(0,-50%);transform:translate(0,-50%);
	cursor:pointer;
	border:none;
	outline:none;
	z-index:8000;
	width:45%;
	background-color:transparent
}

.slick-prev,.slick-prev:hover{
	font-size:0;
	line-height:0;
	position:absolute;
	top:50%;
	display:block;
	height:100%;
	padding:0;
	margin-top:-10px\9;
	-webkit-transform:translate(0,-50%);-ms-transform:translate(0,-50%);transform:translate(0,-50%);
	cursor:pointer;
	border:none;
	outline:none;
	z-index:8000;
	width:45%;
	background-color:transparent
}

.slick-next,.slick-next:hover{
	right:0px;
	cursor:url('assets/arrow_right.png'),pointer
}

.slick-prev,.slick-prev:hover{
	left:0px;
	cursor:url('assets/arrow_left.png'),pointer
}

/* mediaqueries */

@media screen and (max-width:1800px){
	.grid{-webkit-column-count:3;-moz-column-count:3;column-count:3}
	
}

@media screen and (max-width:1200px){
	.grid{-webkit-column-count:2;-moz-column-count:2;column-count:2}

}


@media screen and (max-width:600px){
	.grid{-webkit-column-count:1;-moz-column-count:1;column-count:1}
	.grid{width:100%}
	.linki{padding-right:0}

}

@media only screen and (min-device-width :320px) and (max-device-width :480px){
	body{width:100vw;left:0;overflow-x:hidden;	position:absolute}
	html,body,.main{overflow-x:hidden;font-size:16px; line-height:20px}
	.contact{font-size:16px; line-height:20px}
	.about{font-size:16px; line-height:20px; width:100%}
	.small{font-size:16px; line-height:20px}
	.grid{-webkit-column-count:1; -moz-column-count:1;column-count:1}
	.black{height:72px}
	.break{-webkit-column-break-before:avoid;-webkit-break-before:avoid;-moz-break-before:avoid;break-before:avoid}
	.line:nth-child(4){display:none}
	header a{-moz-hyphens:none;-o-hyphens:none;-webkit-hyphens:none;-ms-hyphens:none}
	.linki{padding-right:0}
	.detail{width:100vw}
	.slick-next,.slick-next:hover,.slick-prev,.slick-prev:hover{display:none;width:0%;background-color:red}
	.sub{display:none}
	.text-mobile{display: static}	
	.text-desktop{display: none;}


}