/*
Farben des Logos
gelb : c9a627
rot : f45a39
violet : be679d
grau/schwarz : 231f20
blau/gruen : 4ea78a
*/


@charset "UTF-8";




*{
	box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    vertical-align: baseline
}

html{
	max-width: 100%;
}

body{
	font-family: 'quicksandbook';
	font-size: 1.05em;
}

a{
	text-decoration: none;
	color: #565656;
	border-bottom: 1px dashed #565656;
	
}
a:hover{
	color: #4ea78a;
	}
/*
a::before{
	font-family:  'haa_webfont';
	content:" } ";
	}
*/

li a,
.nonUnderline
{
	border: 0;
}

section{
	width: 100%;
	padding: 44px 0;
	position: relative;
	float: left;
	background: #fff;
}

content{}

.wrapper{
	 width: 960px;
	 height: auto;
	 margin: 0 auto;
	 }


/* HEADER */

header {
  position: relative; float: left; 
  height: 100%;
  width: 100% !important;
-moz-box-shadow: inset 0px 15px 69px rgba(0, 0, 0, 0.2);
 -webkit-box-shadow: inset 0px 0px 69px rgba(0, 0, 0, 0.2);
box-shadow: inset 0px 0px 120px rgba(0, 0, 0, 0.2);
 }

.logo{ 
	background: #fff; 
	height: 360px; 
	width: 360px; 
	border-radius: 50%;  
	box-shadow:8px 8px 20px rgba(000,000,000,.5);
	-moz-box-shadow:8px 8px 20px rgba(000,000,000,.5);
	-webkit-box-shadow:8px 8px 20px rgba(000,000,000,.5);
	text-align: center; 
	padding-top: 114px;
	margin-top: -140px
} 

.logo img{
	width: 314px;
	height: auto;
}



.flex-header {position: absolute ; height:100%; width: 100%; top:0; bottom: 0;}
.flex-header{display:flex ; flex-direction:row ; flex-wrap:wrap ; justify-content:center ; align-items:center ; align-content:center }	


/* HINTERGRUNDBILDER */

.hintergrund{
	position: fixed;
	height: 100%; width: 100%;
	background: url(../img/hg/nouma_queer.jpg) center center;
	background-size: cover;
	z-index: -1;
}
.hintergrund_unten{
	position: fixed;
	height: 100%; 
	width: 100%;
	background: url(../img/hg/nouma_queer.jpg) center center;
	background-size: cover;
	z-index: -1;
}



/* FOOTER */

.hintergrund_unten{
	position: fixed;
	height: 100%; width: 100%;
background: url(../img/hg/hg_unten.jpg) center center;
background-size: cover;
z-index: -2;
/*
-webkit-filter: saturate(50%);
-moz-filter: saturate(50%);
-o-filter: saturate(50%);
-ms-filter: saturate(50%);
*/
}

footer {
  position: relative; float: left; 
  height: 600px;
  width: 100% !important;
-moz-box-shadow: inset 0px 15px 69px #000000;
  -webkit-box-shadow: inset 0px 0px 69px #000000;
  box-shadow: inset 0px 0px 120px rgba(0, 0, 0, 0.2);

 }
 
 
 /* navigation */
 
 nav{
	 position: fixed;
	 margin: 66px 0 0 66px;
	 height: auto; 
	 width: 162px;
	 z-index: 100;
 }


nav img {
	width: 160px;
	margin-bottom: 12px
	}
nav ul{
	margin:0;
	list-style: none;
	text-align: right;
	font-size: 1.2em
	}
	
nav a:hover{
	color: #000;
}	

nav ul ul{
	margin:0;
	list-style: none;
	text-align: right;
	font-size: .78em;
	color: #525252
	
	}

ul li{
	margin-bottom: 4px
}

ul ul li{
	margin-bottom: 0px
}

ul ul li:last-child{
	margin-bottom: 4px
}



 @media only screen and (max-width:1148px){ 
	nav a{display: none}
	nav{
		width: 44px;
	}
	nav img {
		width: 16	0px;
		margin-top: 44px;
		margin-left: -44px;

		-moz-transform: rotate(-90deg);
		-ms-transform: rotate(-90deg);
		-o-transform: rotate(-90deg);
		-webkit-transform: rotate(-90deg);
		transform: rotate(-90deg)
		

		}
		
	}

 @media only screen and (max-width:980px){
	 nav{display: none}
 } 
 
 
/* sections */

.invitation{
/*
	background: rgba(202, 167, 39, 1);
	background: #4ea78a;
*/

	height: auto;
	margin-top: 0px;
	padding: 122px 0;
	text-align: center;
	color: #4ea78a;
	font-size: 1.5em;
	line-height: 1.2;
	font-family: 'quicksandbook';
}

.invitation hr{

border: none; 
border-top: 1px solid #4ea78a;; 
background-color: #4ea78a;; 
height: 1px; 
margin: 16px 188px; 

}


.accueil{
	background: rgba(92, 24, 97, 0.82);
	height: 180px;
	margin-top: -180px;
	padding: 44px;
	text-align: center;
	color: white;
	font-size: 1.6em;
	font-family: 'quicksandbook';
}

#entreprise{
	padding-top: 88px;
}


.abschluss{
	background: rgba(79, 166, 137, 0.73);
	padding: 22px;
	text-align: center;
	color: #fff;
	font-size: .8em;
	font-family: 'quicksandbook';
}


/* TYPO */

i {
	font-family: "quicksandbook_oblique";
	font-size:.7em
}

.kursiv{
	font-family: "quicksandbook_oblique";
}
.versal{
	text-transform: uppercase;
}
p{
	letter-spacing: -0.03em;
	line-height: 1.4;
	margin-bottom: 1em;
	margin-top: .3em
}

h1, h2, h3{
	font-family: 'quicksandbook';
	letter-spacing: -0.02em;
}
h1{
	font-size: 2em;
	color: rgb(138, 35, 145);
	margin: .5em 0;
}

h2{
	font-size: 1.6em;
	margin: 2em 0 0 0;
	text-transform: uppercase;
}

h3{
	font-size: 1.4em;
	margin: 2.2em 0 0 0;
	
}

.auszeichnung{
	font-size: 1.0em;
}

#entreprise h1, #entreprise h2, #entreprise h3, #entreprise .auszeichnung{
	color: #4ea78a;
}

#service h1, 
#service h2, 
#service h3, 
#service .auszeichnung,
#service strong  {
	color: rgb(138, 35, 145)
}

#service h3{
	margin-top: 88px
} 



#contact h1, #contact h2, #contact h3, #contact .auszeichnung {
	color: #c9a627;
}






ul{
	list-style: outside;
	line-height: 1.4em;
	margin: .5em 0 .5em 16px;
/* 	list-style-image: url(../img/elemente/liste-punkt.png); */
}


ul ul {
	list-style-type: circle;
}

ul ul li:last-child{
	margin-bottom: 12px
}


#service .listeOhne{
	list-style: none;
	line-height: 1.0em;
	margin: 0em 0 0em 0px;
list-style-position: inside
}
#service ul ul{
	list-style: outside;
	list-style-type: disc;
	line-height: 1.3em;
	margin: .5em 0 .5em 16px;
/* 	list-style-image: url(../img/elemente/liste-punkt.png); */
}

/*
ul ul{

	list-style-image: url(../img/elemente/liste-strich.png);
}
*/
ul.auszeichnung li{

/* 	font-size: 1.1em; */
	line-height: 1.3em;
}

.azGruen{color: #4ea78a}
.azViolett{color: rgb(138, 35, 145)}
.gross{font-size: 1.2em;}
.klein{font-size: .8em;}



/* EIGENSCHAFTEN */
.sw{color:#000}



/* ---------------------------- < 768 ---------------------------- */


@media only screen and (max-width:768px){ 
	

	
	.desktop{display: none}

	
	.logo{ 
		height: 220px; 
		width: 220px; 
		box-shadow:8px 8px 20px rgba(000,000,000,.5);
		padding-top: 70px;
		margin-top: -140px
} 

	.logo img{
		width: 192px;
		height: auto;
}
	
	.wrapper{
		width: 100%;
	}
	
	section{
		width: 100%;
		padding: 22px 0;
		position: relative;
		float: left;
		background: #fff;
	}
	.accueil{
		min-height: 140px;
		margin-top: -140px;
		padding: 22px;
		text-align: center;
		color: white;
		font-size: 1.2em;
		font-family: 'quicksandbook';
	}
}