/*  IMPORT FONTS  ============================================================================= */

@font-face {
    font-family: 'roboto_condensedbold';   
    src: url('assets/font/RobotoCondensed-Bold-webfont.woff') format('woff'),
         url('assets/font/RobotoCondensed-Bold-webfont.ttf') format('truetype'); 
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'roboto_condensedregular';   
    src: url('assets/font/RobotoCondensed-Regular-webfont.woff') format('woff'),
         url('assets/font/RobotoCondensed-Regular-webfont.ttf') format('truetype');  
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: 'roboto_condensedlight';   
    src: url('assets/font/RobotoCondensed-Light-webfont.woff') format('woff'),
         url('assets/font/RobotoCondensed-Light-webfont.ttf') format('truetype');  
    font-weight: normal;
    font-style: normal;
}


/* FARBEN Orange #ff7231 grau #d6e2dc ------------------------------------------------------- */


/* ALLGEMEIN -------------------------------------------------*/

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, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, textarea,
table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-style: inherit;
	font-weight: inherit;
	outline: 0;
	padding: 0;
	margin:0;
}

html {	width:100%;
}

body {
	width:100%;
	background: #fff;
	outline: 0;
	padding: 0;
	border: 0;	
}

img {
	border:none;
	margin:0;
	padding:0;
	outline: 0;
}

a{
	text-decoration:none;
	color:#222;
}

a:hover{
	color:#222;
}

a:visited {
	color:#222;
}

a:active {
	color:#222;
}


/* ---- TEXTFORMATE --------------------------------------------------*/

html {	vertical-align: baseline;
	font: 100% "roboto_condensedregular", times, sans-serif;
	color : #222;
	text-align:left;
}

h1, h2, h3, h4 {
	font-family:"roboto_condensedbold", arial, sans-serif;
}

h1 {
	display:none;
}

.linksbuendig {
	text-align:left;
}

.rechtsbuendig {
	text-align:right;
}

.mittig {
	text-align:center;
}

#menu {
	letter-spacing:0.1em;
}

.b {
	font-family:"roboto_condensedbold", arial, sans-serif;
}

.linkimtext {
	font-family:"roboto_condensedbold", arial, sans-serif;
	text-decoration:underline;
}

.pfeilrechts {
	margin-right:0.5em;
	width:20px;
	height:20px

}


/* ---- BILDER --------------------------------------------------*/

.bildimtext {
	width: 75%;
	height:75%;
	text-align:center;
}


/* ---- GERUEST --------------------------------------------------*/

#startdiv{
	display:none;
	position:fixed;
	width:100%;
	height:100%;
	background:#fff;
	opacity:1.0;
	z-index:10000 !important; 
	transition: ease 0.25s;
	-moz-transition:    0.25s ease;
	-ms-transition:     250ms ease;
	-o-transition:       250ms ease;
	-webkit-transition:  250ms ease;
}

#home {
	width:100%;
	/*max-width:1280px;*/
	margin:0 auto 0 auto;
	background:#fff;
}

#start {
	width:100%;
	background:#f9f;
	/*height:600px;*/
	font-family:"roboto_condensedlight", arial, sans-serif;
	
	background:url('assets/images/bg_startbild.jpg') #fff;
	background-position:bottom center;
	background-repeat:no-repeat;
	background-size:cover;	
}

#header {
	/*z-index:500!important;*/
	width:100%;
	background:transparent;
	/*height:40%;*/
	padding:0 0 0 0;
}

#header img {
	padding:25px 0 0 0;
}

#logodiv {
	width:200px;
	position:absolute;
	top:90px;
	left:2%;
}

#logoimg {
	width:100%;
}

.headertext {
	color:#ff7231;
	text-align:left;
	margin:0;
	font-size:2.7em;
	line-height:1.25em;	
}

.headertext br {
	display:inline;	
}

#ht_o {
	padding:13% 0 30px 0;
	background:#fff;
}

#ht_u {
	padding:30px 0 20px 0;
	background:transparent;	
}

#ht_o div, #ht_u div {
	margin-left:28%;
}

#pfeil_start {
	display:block;
	z-index:2000;
	margin:15px 0 0 28%;
}

.anker {
	height:80px;
}

.ankerstrich {
	width:72px;
	height:36px;
	border-bottom:solid 8px #222;
}

.anker a {	
	font-size:0;
	line-height:0;
}

#maincontent {
	font-family:"roboto_condensedregular", arial, sans-serif;
	font-size:1.5em;	
}

.contentdiv {
	padding:3% 3% 0 3%;
	min-height:480px;
}

.contentdiv h2 {
	font-size:1.5em;
	letter-spacing:0.08em;
	margin:0;padding:0;
	
}

.contentcontainer {
	max-width:1060px;
	width:100%;
	margin:0 auto 0 auto;
}

.contentcontainer a {
	text-decoration:underline;
}

.contentdiv h3, .h3 {
	font-size:1.25em;
	letter-spacing:0.02em;
	margin:0 0 0 0;
	padding:0;
}

.h3 a{
	margin:0 1em 5px 0;
	text-decoration:underline;
}


.contentdiv p{	
	padding:0 0 0 0;
	margin:15px 0 0 0;
}

.hidden {
	display:block;
}

#footer a:hover {
	font-weight:600;
}

#a_imprint {
	/*text-decoration:underline;*/
}

.clearfloat{
	height:0;
	clear:both;
}


.rabeimtext {

	width:20%;
	margin:25px 0 10px 0;

}


/* ---- MENU --------------------------------------------------*/

#buttons {
	width:37px;
	background:transparent;
	position:fixed;
	right:2%;
	top:125px;
}

#buttons ul {
	width:100%;
	list-style:none;	
}

#buttons li {
	padding:5px 0 0 0;
	border-bottom:solid 2px transparent;
	width:100%;
}

#buttons li:hover {
	border-bottom:solid 2px #222;
}

#buttons img {
	width:100%;
}


#menubutton{
	display:none;
	width:45px;
	height:45px;
	cursor:pointer;
	position:fixed;
	top:10px;
	right:2%;
}

#menubutton img{
	width:100%;
}

#menu {
	/*position:fixed;*/
	background:#fff;
	/*width:100%;*/
	margin:0 0 0 28%;
	min-height:48px;
	position:relative;
	font-family:"roboto_condensedbold", arial, sans-serif;
	font-size:1em;
	/*line-height:1.25em;*/
	text-align:left;
}

.menu_item {
	display:inline-block;
	margin:0 0.7% 5px 0.7%;
	vertical-align: baseline;
	border-top:solid 7px transparent;
	padding-top:16px;
	background:#fff;
}

.menu_item:hover {
	border-top:solid 7px #222;
	transition:  ease 0.25s;
	-moz-transition:    0.25s ease;
	-ms-transition:     250ms ease;
	-o-transition:       250ms ease;
	-webkit-transition:  250ms ease;
}






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


.datum {
	font-size:0.9em;
	margin:25px 0 0 0;
}

.mehrlesen {
	text-decoration:underline;
	color:#222;
	line-height:4em;
}

.abst_posts {
	height:1em;
}


#ueberuns {
	background:transparent;
	padding-top:0;
}

#content05, #aktuelles {
	background:#ff7231;
}

#content10, #supervision {
	background:#fff;
}

#content20, #coaching {
	background:#cad8d1;
}

#content30, #organisationsberatung {
	background:#fff;
}

#content40, #mediation {
	background:#fcc300;
}

#content50, #traumaarbeit {
	background:#fff;
}

#content60, #gesundheit {
	background:#81ccdc;
}

#content70, #team {
	background:#fff;
}

#content80 {
	padding-bottom:20px;
}

#content80, #kontakt {
	background:#a6acaa;
	padding-bottom:15px;
}

#content85 {
	background:#fff;
}

#content90, #karte {
	background:#c9f19a;
}

#content100, #impressum {
	background:#fff;
}

#content110 {
	background:#fff;
	min-height:250px;
	padding-bottom:100px;
}


.team-items, .kontakt-items{
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
}


.person {
	margin:30px 0 0 6%;
	//float:left;
	width:33%;
	padding:0 0 0 0;
	text-align:center;
}

.person h4, .kontakt h4 .prf, #content85 h4{
	margin:20px 0 0 0;
}

.person img {
	width:65%;
}

.person p {
	display:none;
}

.person .mehrlesen {
	line-height:1.5em;
}

#zeilentrenner {
	display:block;
}

#profile {
	display:block;
	height:0px;
}

#profile span, .person span {
	font-family:"roboto_condensedbold", arial, sans-serif;
}

.prf_schalter {
	/*float:right;*/
	margin:0 0 25px 0;
}

.prf_koennen {
	margin:0 0 50px 0;
}

.prf_kontakt {
	margin:50px 0 40px 0;
}

.pdflink{
	display:inline;
	margin-right:8px;
}

.kontakt {
	margin:60px 10% 0 0;
	float:left;
	width:30%;
}

.kontakt p{
	margin:0;
}
	
.kontakt br {
	display:inline;
}

.kontakt span {
	/*display:none;*/
}

.yophone {
	display:none;
}
.nophone {
	display:inline;
}


.infofenster {
	font-size:1.0em;
}

.infofenster a {
	text-decoration:underline;
}


#karte_osm { 

	width:80%;
	height:600px;
	margin:3% 0 0 0;
	background-Color:#fff;
	text-align:center;
}




#impr{
	display:block;
}

#impr a {
	text-decoration:underline;
}


/* LIQUIDE  ------------------------------------*/

@media only screen and (max-width:1350px) and (min-width:1250px) {

	#menu {
		font-size:0.9em;
		margin:0 0 0 28%;
	}
}

@media only screen and (max-width:1249px) and (min-width:1025px) {

	#menu {
		font-size:0.9em;
		margin:0 20px 0 2%;
		text-align:right;
	
	}
	.headertext {
		font-size:2.7em;
		line-height:1.25em;		
	}
		
}

@media only screen and (max-width:1350px) and (min-width:1025px) {

	#menubutton{
		display:none;
	}
	
	.contentdiv {
		padding:3% 8% 0 3%;
	}
	
	.anker{
		padding:0 8% 0 3%;
	}

	
}


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

	.kontakt{
		width:45%;
	}
	
	#karte_osm { 
		width:100%;
		height:400px;
	}
		
}


@media only screen and (max-width:1024px) and (min-width:913px){

	#menubutton{
		display:none;
	}

	#menu {
		margin:0 20px 0 2%;
		font-size:0.9em;
		text-align:right;
	}
	
	#logodiv {
		width:18%;
	}
	
	.headertext {
		font-size:2.1em;
		line-height:1.25em;
		margin:0;		
	}
	
	#ht_o div, #ht_u div {
		margin-left:27%;
	}

	#buttons{
		width:34px;
	}
		
	.contentdiv {
		padding:4% 11% 0 5%;
	}
	
	.anker{
		padding:0 11% 0 5%;
	}
	
	.person{
		/*height:200px;*/
	}	


}

@media only screen and (max-width:912px) and (min-width:801px){

	#menubutton{
		display:none;
	}

	#maincontent{
		font-size:1.2em;
	}
	
	#menu {
		margin:0 15px 0 2%;
		font-size:0.8em;
		text-align:right;
	}
	
	#buttons {
		width:30px;
		right:1.5%;
		top:105px;
	}
	
	#logodiv {
		width:18%;
	}
	
	#start {
		background-size:cover;	
	}
	
	.headertext {
		font-size:1.8em;
		line-height:1.20em;
		margin:0;	
	}

	.contentdiv {
		padding:4% 11% 0 5%;
		min-height:300px;
	}	

	.anker{
		padding:0 11% 0 5%;
	}

}


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

	#pfeil_start {
		display:none;
	}

	#start{
		overflow:hidden;
	}
	
	#maincontent{
		width:100%;
		font-size:1.0em;
		overflow:hidden;
	}

	#menu {	
		display:none;
		position:fixed;
		z-index:9000!important;
		/*max-width:90%;*/
		width:auto;
		margin:0;
		padding:10px 0 0 0;
		font-size:0.9em;
		box-shadow:0px 0px 4px 4px rgba(128,128,128,0.4);
		opacity:1.0;
		transition:  ease 0.25s;
		-moz-transition:    0.25s ease;
		-ms-transition:     250ms ease;
		-o-transition:       250ms ease;
		-webkit-transition:  250ms ease;
	}
	
	.menu_item {
		display:block;
		margin:0;
		vertical-align: baseline;
		border:none;
		padding:10px 10px 15px 10px;
		background:#fff;
		overflow:hidden;
	}
	
	.menu_item:hover {
		border-top:none;
	}

	#buttons {
		width:32px;
		right:1.5%;
		top:105px;
	}
	
	#menubutton{
		display:block;
		width:36px;
		height:36px;
		top:10px;
		right:1.5%;
	}
	
	#logodiv {
		width:22%;
		top:50px;
		left:2%;
	}
	
	
	.headertext {
		font-size:1.4em;
		line-height:1.25em;	
	}

	#ht_o {
		padding:13% 0 30px 0;
		background:#fff;
	}

	#ht_u {
		padding:30px 0 20px 0;
		background:transparent;	
	}

	#ht_o div, #ht_u div {
		margin-left:29%;
		margin-right:48px;
	}
	
	.contentdiv {
		padding:3% 15% 0 3%;
		min-height:300px;
	}
		
	.anker{
		height:60px;
		padding:0 8% 0 3%;
	}
	
	.ankerstrich{
		height:26px;		
	}

 
	.person {
		width:49.9%;
		margin:30px 0 0 0;
	}
	
	.person p {
		display:none;
	}
	
	.person h4, .kontakt h4, #content85 h4 {
		margin:20px 0 0 0;
	}
	
	.person img {	
		width:65%;
	}
	
	.person .mehrlesen {
		line-height:2.5em;
	}
	
	#zeilentrenner {
		display:none;
	}
	
	.kontakt {
		margin:35px 3% 0 0;
		float:none;
		width:100%;
	}
	
	.kontakt p{
		margin:0;
	}
	
	.kontakt br {
		/*display:none;*/
	}
	.kontakt span {
		/*display:inline;*/
	}
	
	.rabeimtext {
		width:25%;
	}
	
}
 
@media only screen and (max-width:640px) {
 
	#start {
		background-image:url('assets/images/bg_startbild_phone.jpg');
 		background-size:contain;	
	}

 	.headertext br {
 		display:none;	
	}

	.contentdiv {
		padding:5% 15% 0 5%;
		min-height:300px;
	}
	
	.anker{
		height:60px;
		padding:0 8% 0 5%;
	}
	
	.person {
		height:0px;
		width:49.9%;
		margin:25px 0 0 0;
		padding:0 0 60% 0;
	}
	
	.person img {	 	
		width:65%;
	}
	
	.rabeimtext {
		width:30%;
	}
	
	.bildimtext {
		width: 100%;
		height:100%;
		text-align:center;
}
	
	#karte_osm { 
		height:300px;
	}
 	
}

@media only screen and (max-width:480px) {
	
	#logodiv {
		position:relative;
		width:150px;
		top:15px;
		left:5%;
	}
	
	#ht_o div, #ht_u div {
		margin-left:5%;
		margin-right:42px;
	}	
	
	.yophone {
		display:inline;
		}
	.nophone {
		display:none;
		}
	
	.person h4, kontakt h4 {
		margin:0;
	}
	
	.person {
		margin:50px 0 0 0;
		float:none;
		width:100%;
		height:100px;
		padding:0 0 0 0;
		text-align:left;
	}
	
	.person img {	
		float:left;
		 width:36%;
	}

	.person div {	
		padding:5% 0 0 43%
		
	}
	
	.pdflink{
		display:none;
	}
	
	.rabeimtext {
		width:40%;
	}
	

}