@charset "UTF-8";
/* CSS Document */


*{
	margin:0;
	padding:0;
	box-sizing:border-box;
}


/*---LINKS---*/


a img { 
	border:none;
}


a:link, a:visited {
	text-decoration:none;
	color:rgb(111,0,255);
}


a:hover {
	color:rgb(0,255,171);
}


/*---LINKS Ende---*/


/*---TYPO---*/


@font-face {
	font-family:PPNeueMontreal-Light;
	src:url(fonts/PP_neue_montreal/PPNeueMontreal-Light.woff);
}


@font-face {
	font-family:PPNeueMontreal-Book;
	src:url(fonts/PP_neue_montreal/PPNeueMontreal-Book.woff);
}


/*---TYPO Ende---*/


/*---MARKIERTER TEXT---*/

::-moz-selection {
	background:rgb(111,0,255);
	color:rgb(0,255,171);
}

::selection {
	background:rgb(111,0,255);
	color:rgb(0,255,171);
}


/*---MARKIERTER TEXT Ende---*/


.row::after {
    content:"";
    clear:both;
    display:table;
}


[class*="col-"] {
    float:left;
    padding:0 5px;
	/*border:1px solid red;*/
}


 /* For mobile phones: */
[class*="col-"] {
    width:100%;
}


@media only screen and (max-width:600px) {
    /* For mobile: */
    .col-m-0 {width:0%;}
    .col-m-1 {width:8.33%;}
    .col-m-2 {width:16.66%;}
    .col-m-3 {width:25%;}
    .col-m-4 {width:33.33%;}
    .col-m-5 {width:41.66%;}
    .col-m-6 {width:50%;}
    .col-m-7 {width:58.33%;}
    .col-m-8 {width:66.66%;}
    .col-m-9 {width:75%;}
    .col-m-10 {width:83.33%;}
    .col-m-11 {width:91.66%;}
    .col-m-12 {width:100%;}
}


@media only screen and (min-width:601px) {
    /* For tablets: */
    .col-t-1 {width:8.33%;}
    .col-t-2 {width:16.66%;}
    .col-t-3 {width:25%;}
    .col-t-4 {width:33.33%;}
    .col-t-5 {width:41.66%;}
    .col-t-6 {width:50%;}
    .col-t-7 {width:58.33%;}
    .col-t-8 {width:66.66%;}
    .col-t-9 {width:75%;}
    .col-t-10 {width:83.33%;}
    .col-t-11 {width:91.66%;}
    .col-t-12 {width:100%;}
}


@media only screen and (min-width:901px) {
    /* For desktop: */
    .col-1 {width:8.33%;}
    .col-2 {width:16.66%;}
    .col-3 {width:25%;}
    .col-4 {width:33.33%;}
    .col-5 {width:41.66%;}
    .col-6 {width:50%;}
    .col-7 {width:58.33%;}
    .col-8 {width:66.66%;}
    .col-9 {width:75%;}
    .col-10 {width:83.33%;}
    .col-11 {width:91.66%;}
    .col-12 {width:100%;}
}


@media only screen and (min-width:1601px) {
    /* Nur Arbeiten: */
    .col-a-1 {width:8.33%;}
    .col-a-2 {width:16.66%;}
    .col-a-3 {width:25%;}
    .col-a-4 {width:33.33%;}
    .col-a-5 {width:41.66%;}
    .col-a-6 {width:50%;}
    .col-a-7 {width:58.33%;}
    .col-a-8 {width:66.66%;}
    .col-a-9 {width:75%;}
    .col-a-10 {width:83.33%;}
    .col-a-11 {width:91.66%;}
    .col-a-12 {width:100%;}
}


/*---BASICS---*/


body {
	font-family:PPNeueMontreal-Light, 'Arial', sans-serif;
	font-size:1.5em;
	line-height:100%;
	letter-spacing:0.03em;
	color:rgb(111,0,255);
	hyphens:auto;
	hyphenate-limit-chars:auto 3;
	hyphenate-limit-lines:2;
	-ms-hyphens:auto;
	-ms-hyphenate-limit-chars:auto 3;
	-ms-hyphenate-limit-lines:2;
	-webkit-hyphens:auto;
	-webkit-hyphenate-limit-chars:auto 3;
	-webkit-hyphenate-limit-lines:2;
	background-color:rgb(23,23,23);
}


@media only screen and (max-width:900px) {
    body {
		font-size:2.64vw;
		font-family:PPNeueMontreal-Book, 'Arial', sans-serif;
	}
}


@media only screen and (max-width:725px) {
    body {
		font-size:1.19em;
    }
}


.black {
	background-color:rgb(23,23,23);
}

.white {
	background-color:rgb(240,240,240);
}


h1 {
	font-size:100%;
	font-weight:200;
	text-transform:uppercase;
}


.h1_bigger {
	font-size:5em;
	line-height:95%;
	hyphens:none;
	-ms-hyphens:none;
	-webkit-hyphens:none;
}


@media only screen and (max-width:900px) {
    .h1_bigger {
		font-family:PPNeueMontreal-Light, 'Arial', sans-serif;
	}
}


@media only screen and (max-width:725px) {
    .h1_bigger {
		font-size:13.2vw;
	}
}


h2 {
	font-size:100%;
	font-weight:200;
	text-transform:uppercase;
}


h3 {
	font-size:100%;
	font-weight:200;
	text-transform:uppercase;
}


.menu {
	margin-top:-2.94vw;
	padding-bottom:50px;
	font-family:PPNeueMontreal-Light, 'Arial', sans-serif;
	font-size:20.5vw;
	font-weight:200;
	line-height:100%;
	text-transform:uppercase;
}


.versal {
	text-transform:uppercase;
}


.nicht_versal {
	text-transform:none;
}


.arbeit_BU {
	font-size:0.75em;
	line-height:105%;
	hyphens:none;
	-ms-hyphens:none;
	-webkit-hyphens:none;
}


.pale_neon_green {
	color:rgb(0,255,171);
}


.sub {
	font-size:2.9em;
	line-height:95%;
	hyphens:none;
	-ms-hyphens:none;
	-webkit-hyphens:none;
}


@media only screen and (max-width:725px) {
    .sub {
		font-size:7.65vw;
	}
}


img.scaled {
	width:100%;
	border-radius:20px;
	position:relative;
	float:left;
}


@media only screen and (max-width:900px) {
    img.scaled {
		border-radius:2vw;
	}
}


@media only screen and (max-width:725px) {
    img.scaled {
		border-radius:14px;
    }
}


img.smiley {
	margin-bottom:-14px;
	height:0.95em;
}


@media only screen and (max-width:900px) {
    img.smiley {
		margin-bottom:-1.6vw;
		height:12.5vw;
    }
}


img.bild {
	width:100%;
	margin-bottom:10px;
	border-radius:20px;
	position:relative;
	float:left;
}


@media only screen and (max-width:900px) {
    img.bild {
		border-radius:2vw;
	}
}


@media only screen and (max-width:725px) {
    img.bild {
		border-radius:14px;
    }
}


img.bild_50_links {
	width:calc(50% - 5px);
	margin-bottom:10px;
	margin-right:10px;
	border-radius:20px;
	position:relative;
	float:left;
}


@media only screen and (max-width:900px) {
    img.bild_50_links {
		border-radius:2vw;
	}
}


@media only screen and (max-width:725px) {
    img.bild_50_links {
		border-radius:14px;
    }
}


@media only screen and (max-width:600px) {
    img.bild_50_links {
		width:100%;
		margin-right:0;
	}
}


img.bild_50_rechts {
	width:calc(50% - 5px);
	margin-bottom:10px;
	border-radius:20px;
	position:relative;
	float:left;
}


@media only screen and (max-width:900px) {
    img.bild_50_rechts {
		border-radius:2vw;
	}
}


@media only screen and (max-width:725px) {
    img.bild_50_rechts {
		border-radius:14px;
    }
}


@media only screen and (max-width:600px) {
    img.bild_50_rechts {
		width:100%;
	}
}


img.booking {
	margin:0 26.75%;
	padding:0;
}


@media only screen and (max-width:900px) {
    img.booking {
		margin:0 33.33%;
	}
}


@media only screen and (max-width:600px) {
    img.booking {
		margin:0 25%;
	}
}


#about {
	width:calc(50% - 10px);
	margin:0 5px;
	padding-top:calc(54% - 10px);
	background-image:url(bilder/about.jpg);
	background-size:cover;
	background-position:top;
	background-repeat:no-repeat;
	border-radius:20px;
	top:0px;
	left:0px;
	float:left;
}


@media only screen and (max-width:900px) {
    #about {
		width:calc(100% - 10px);
		margin-bottom:6.5vh;
		padding-top:calc(59% - 10px);
		background-image:url(bilder/about_kl.jpg);
		background-position:center;
	}
}


#impressum {
	padding-top:-10px;
}


@media only screen and (max-width:600px) {
    #impressum {
		margin-bottom:6.5vh;
	}
}


/*---BASICS ENDE---*/


/*---NAVI---*/


#nav {
	min-height:5px;
	position:fixed;
	top:0;
	float:left;
	z-index:1;
	background:rgb(23,23,23);
}


@media only screen and (max-width:600px) {
    #nav {
    }
}


#logo {
	padding:7px 5px 10px 5px;
}



#menu {
	margin-top:0;
	padding:7px 4px 0 0;
	text-align:right;
}


@media only screen and (max-width:600px) {
    #menu {
		margin-top:-100%;
    }
}



#menu_mobil {
	margin-top:-100%;
	padding:7px 3px 0 0;
	text-align:right;
}


#menu_mobil a {
	cursor:pointer;
}


@media only screen and (max-width:600px) {
    #menu_mobil {
		margin-top:0;
    }
}


/*---NAVI Ende---*/


/*---MENUE---*/


#menu_ausgeklappt {
	height:0%;
	position:fixed;
	top:0;
	right:0;
	background:rgba(23,23,23,1);
	overflow-y:hidden;
	z-index:2;
}


@media screen and (max-height:800px) {
	#menu_ausgeklappt {overflow-y:auto;}
}


@media screen and (max-height:600px) {
	#menu_ausgeklappt {overflow-y:auto;}
}


#menu_schliessen {
	padding:7px 3px 0 0;
	text-align:right;
	z-index:3;
}


#content_menu {
	margin-top:172px;
	min-height:10vh;
	float:none;
}


/*---MENUE ENDE---*/


/*---CONTENT---*/


#content {
	min-height:10vh;
	margin-top:220px;
	background:rgba(255,255,255,0);
}


@media only screen and (max-width:900px) {
    #content {
		margin-top:24.4vw;
	}
}


@media only screen and (max-width:700px) {
    #content {
		margin-top:170px;
	}
}


#text_start {
	margin-top:-3px;
	margin-bottom:6.5vh;
}


@media only screen and (max-width:900px) {
    #text_start {
		margin-top:-0.35vw;
		margin-bottom:7.8vw;
	}
}


#text_arbeiten_start {
	margin-top:6vh;
}


@media only screen and (max-width:1070px) {
    #text_arbeiten_start {
		margin-top:6.7vw;
	}
}


#text {
	margin-top:-3px;
}


#text_kategorien {
	margin-top:-7.5px;
	padding-bottom:6.5vh;
	font-size:0.75em;
	line-height:200%;
	hyphens:none;
	-ms-hyphens:none;
	-webkit-hyphens:none;
}


#text_arbeit {
	margin-top:-3px;
}


@media only screen and (max-width:900px) {
    #text_arbeit {
		margin-top:3vh;
	}
}


#spalten {
	padding:0;
	column-count:3;
	column-gap:10px;
}


@media only screen and (max-width:1070px) {
    #spalten {
		column-count:2;
	}
}


@media only screen and (max-width:600px) {
    #spalten {
		column-count:1;
	}
}


#spalten ul {
	list-style-type:none;
}


.arbeit {
	min-height:10vh;
	margin-bottom:10px;
	text-align:left;
	position:relative;
}


.overlay_arbeit {
	width:calc(100% - 10px);
	margin:0 5px;
	height:0;
	left:0;
	overflow:hidden;
	position:absolute;
	color:rgb(0,255,171);
	background-color:rgba(23,23,23,0.85);
}


.arbeit:hover .overlay_arbeit {
	height:100%;
	padding:9px 10px;
	top:0;
}


#bilder_arbeit {
	min-height:10vh;
	left:41.66%;
	float:right;
}


@media only screen and (max-width:900px) {
    #bilder_arbeit {
		left:0;
		float:left;
	}
}


/*@media only screen and (max-width:1070px) {
    .arbeit:hover .overlay_arbeit {
		height:0;
		padding:0;
	}
}*/


.bild_rahmen {
	padding:7vw;
}


/*---CONTENT ENDE---*/


/*---FOOTER---*/


#footer {
	min-height:10vh;
	padding-top:12vh;
}


@media only screen and (max-width:1070px) {
    #footer {
		padding-top:13.1vw;
	}
}


@media only screen and (max-width:750px) {
    #footer {
		padding-top:8.5vh;
	}
}


#adresse_kontakt {
	min-height:10vh;
	margin-bottom:10px;
	hyphens:none;
	-webkit-hyphens:none;
	-ms-hyphens:none;
	
}


#socials_copyright {
	min-height:10vh;
	margin-bottom:10px;
	text-align:right;
	vertical-align:bottom;
}


/*---FOOTER ENDE---*/