/*
	www.w3schools.com/w3css/w3css_grid.asp
	www.w3schools.com/cssref/css_selectors.asp



	new-logo blue: #1f3e78
	old-blue:	#2162A0; 
	grey 75%	#646464
	grey 60%	#878787
	grey 49%	#9e9e9e
	
	lightblue #f0f9fd
	lightblue2 #bfd6EA
		
	grey 18,75%	#dad9da	
	grey 15%	#e6e6e6

	standard -> Raleway22/32 -> schwarz 75% -> Abstand unten 16px
	info -> Raleway Italic 22/32 -> schwarz60%
	Sub -> Droid Serif 22/32 -> Abstand danach 16 px
	• liste -> Raleway22/32 -> Abstand unten 4px -> Einzugl links +-16px
		• liste1
		• liste2
		• liste3 asdasd asda sasdcasdasds
	standard tabelle -> Raleway22/32-> Abstand unten 0px
	H1 -> Raleway ExtraLite60/64
	H1 Subheading Raleway32/48
	H2 Raleway Lite34/48
	H3 Raleway 26/32
	H4 -> schwarz 49% -> Raleway Bold Italic 20/32

*/

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

html, body {
    font-family: 'Raleway', 'Roboto', Helvetica, Arial, sans-serif;
    font-size: 20px;
}

/* LAYOUT------------------------------- */

/* padding: vertical horizontal */ 
/* padding: top right bottom left */ 
.page-wrapper{
	padding:0 ; 
}

.page-title-inner, .main-container-inner{
	max-width:100%;
}

.site-logo {
	padding:8px;
	margin:8px;
	width:280px;
}

#block-stein-w3css-page-title {
	width: 100% !important;
	margin: 0;
}

#block-breadcrumbs .breadcrumbs > h1.page-title{
padding:0;
}


.node__content{
	padding:0 1.0em 0;
}


.main-navigation-inner-h {
	/* erzeugt einen versatz um das logo (Textmarke) bei breitem Bildschirm am Text auszurichten */
	max-width: 1210px;
}

#main-container-inner {
	/* max-width: 1600px; */ 
	margin: 0 0 !important; 
	padding: 0;
}

.w3-row-padding{
	padding:0 4px 0 0;
}

/*custom class for content*/
.center {
	max-width: 1200px;
	margin: 0 auto !important;
	padding: 0;
}

.space-right	{
	padding-right:32px;
}

.space-left	{
	padding-left:32px;
}

.block-system-breadcrumb-block {
	padding: 0 1.0em;
}

ul.breadcrumb {
    padding: 8px 0;
}


.w3-content {
	/* the main editor panel in the admin backend gets this class, it´s usally to small */
	max-width:100%;
}

/* TYPO ------------------------------- */
.node--view-mode-full .w3-container.node__content .field--name-body p {
	text-align: left;
}


.view-content p {
    text-align:left; 
	/*justify;*/
}

h1,h2,h3,h4,h5,h6{
	color:#2162A0;
	font-family: 'Raleway', 'Roboto', Helvetica, Arial, sans-serif;
	margin: 0.8em 0 0.025em;
}

h1 {
	font-size: 2.72em;
	font-weight: 300;
	line-height:1.2;
	margin: 0.6em 0 0.4em 0;
}
.node__content p, 
.node__content h1,
.node__content h2,
.node__content h3,
.node__content ul {
	max-width:840px;
	
}

.node__content em ,
.node__content .info,
.node__content dt {
	font-style:normal;
	font-weight:600;
	color:#2162A0;
}

h1 > em {
	/* E > F: so wird das Element F nur dann angesprochen, wenn es ein Kindelement eines E-Elements ist. */ 
	font-weight: 500;
	font-family: 'Droid Serif', 'Georgia', 'Times new Roman', serif;
}

.w3-xxlarge {
	font-size: 2.2em !important;
	line-height: 1.5em;
}

dt {
	margin-top: 0.25em;
}

dd{
	margin-bottom: 0.25em;
}

li, dd, dt{
	/* margin-bottom: 0.182em */ 
	margin-bottom: 1.0em;
}
.node__content li {
	border-bottom:4px solid #eee;
}

.textgrey{
	color:#dad9da;
	font-weight:500;
}

.textblue{
	color:#2162A0;
}
.indent{ margin-left:100px;}
.grey{
	background-color: #dad9da !important; 
	padding:2px;
}

.lightgrey{
	background-color: #eee !important; 
	padding:4px;
}

.lightblue{
	background-color: #f0f9fd !important; 
	padding:4px;
}

.lightblue2{
	background-color: #bfd6EA !important; 
	padding:2px;
}


.blue{
	background-color: #2162A0 !important; 
	color:#fff !important;
	padding:2px;
}

.lightblue li{
	border-color:#bfd6EA;
	border-width: 3px;
}
.lightblue1 li{
	border-color:#fff;
	border-width: 3px;
}
.lightgrey  li{
	border-color:#ccc;
	border-width: 3px;
}

/* CUSTOM ------------------------------- */
#superMegaHeader{	
	width:100%;
	margin:0 auto  !important;
	display:inline;
}

#page-title-inner {
	width:100% ;
}

/*
	developer.mozilla.org/en-US/docs/Web/CSS/position
	developer.mozilla.org/en-US/docs/Web/CSS/display
*/

/*The Logo and Slogan are inside this section */
.block-system-branding-block{
	/*display:block;
	float:left;*/
}
a.site-logo{
	/*the logo*/
}


.main-navigation-wrapper,
.close-nav,
.mobile-nav {
  /*background-color: inherit !important;*/
  background-color: #fff !important;
  /*color: inherit !important;*/
  color: #646464 !important;
}

/* --Language---------------------------------------- */ 
.language-switcher-language-url {
     /*display: inline-block;*/
   width: 6em;
    float: right;
    /*position: relative;
    top: -3.0em;*/
    height: 1.25em;
	/*padding:20px 0;*/
}

.language-switcher-language-url h2, 
.language-switcher-language-url li {
	font-size:inherit;
	font-size:0.7em;
	color:inherit;
	margin:0;
	padding:0;
	/*display:inline;*/
}

.language-switcher-language-url li{
	margin:4px 4px;
	display:inline;
}


.view-header {
	padding: 0 0;
}

/* -- page-title ---------------------------------------- */ 
h1.page-title{
	padding-left:0;
}

.block-system-breadcrumb-block{
	margin-bottom: -24px;
}

/* page-title over main image */ 
.block-page-title-block > h1.page-title{
	/* display:inline; */ 
	position:relative;
	top: 32px;
	left: 8px;
	height:0;
	
	font-size:3.6em !important;
	line-height:1.5;
	font-weight:600;
	padding: 0px 0px;
}

.block-page-title-block > h1.page-title > span{
	color:#fff;
	padding: 0.125em 0.5em;
	background-color:#2162A0dd;
}

#block-breadcrumbs > h1.page-title{
	padding-left:0;
}


/* page-title */ 
/* element1~element2 	p ~ ul 	Selects every <ul> element that are preceded by a <p> element */ 
/*#superMegaHeader ~ .page-title { */
	/* select every page-title that is preceded by a superMegaHeader */ 
	/*width: 100%;
	font-size: 2.72em !important;
}*/



/*--- Karriere view---------------*/
ul.stellenanzeigen {
	list-style-type: none;
	padding: 0;
	margin: 0;
}

ul.stellenanzeigen li{
	padding:16px 0px  8px;
	font-size: 120%;
	border-bottom:1px solid #bbb;
}

ul.stellenanzeigen li >.blue{
	padding:8px;
	margin-bottom:8px;
}

/* References*/
.views-field-field-reference-picture{
	text-align: center;
}

.reference-padding{
	border: 20px solid #FFF;
}

.views-field-field-reference-services{
	padding-bottom: 10px;
}

.views-field-field-reference-title{
	padding-top: 10px;
	font-weight: 700;
}

.reference-custom-text{
	font-weight: 700;
	padding-top: 20px;
}

/*Die Navigation der Referenzen soll nur über die Bilder funktionieren*/
/*Der Standardfilter wird versteckt*/
#views-exposed-form-referenceproject-page-1{
	display:none;
}



/*Innoline List*/

.view-innolines-list table {
	border: none;
	}
	
.view-innolines-list thead th{
background-color:#eee;
	border:none;
	}
	

.view-innolines-list td {
background-color:#fff;
	border-bottom:4px solid #eee;
	padding:10px;
	}



/*geschaeftsfuehrung_praesentation*/
.block-views-blockgeschaeftsfuhrung-presentation-block-1 {
	padding-top:24px;
}


.views-field views-field-field-portrait{
	text-align:center;
}

.image-style-gv-9x16{
	padding-top:10px;
}

.view-geschaeftsfuhrung-presentation{
	border-bottom: 4px solid #eee;
}


/* ------Slider slick slider override startpage --------------------*/ 
.slidertext {
	position:relative;
	font-size:300% !important;
	/* line-height:1.2 !important; */ 
	font-weight:600 !important;
	top: -240px;
	left: 16px;
	height:0;
	Max-width:100% !important;
	color:#fff!important;
}

.slidertext > span {
	/* padding: 0.125em 0.5em; */ 
	line-height:1.5 !important;
	padding: 0.125em;
	background-color:#2162A0dd;
}

ul.slick-dots{
	max-width:100% !important;
	/* sonst sind die dots beim Startslider als superMegaHeader vertikal angeordnet oben links */
	position: initial !important;
}
ul.slick-dots li{
	border-bottom:none !important;
}

ul.linklist > li{
	 list-style-image: url('../img/symbol-link.svg');
}


/* link symbol nonbreakingspace */

p>a:before {
	content: "\f0c1 \00A0";
	font-family: 'Font Awesome 5 Free';
	color:#2162A0; 
}
/* paperclip symbol nonbreakingspace */
.file a:before{
	content: "\f0c6 \00A0";
	font-family: 'Font Awesome 5 Free';
	font-size:120%;
	color:#2162A0; 
}

/**/
/* button animation  */



/* D10 menu font-sizes */

.ul-parent a {
  /*font-size: 16px !important;*/
  font-size: inherit !important;
}

/*Drupal10 w3csss v2 footer colums all centered*/
.w3-col, .w3-half, .w3-third, .w3-twothird, .w3-threequarter, .w3-quarter,
.w3-col.s1, .w3-col.s2, .w3-col.s3, .w3-col.s4, .w3-col.s5, .w3-col.s6,  .w3-col.s7,  .w3-col.s8,  .w3-col.s9,  .w3-col.s10,  .w3-col.s11,  .w3-col.s12,
.w3-col.m1, .w3-col.m2, .w3-col.m3, .w3-col.m4, .w3-col.m5, .w3-col.m6,  .w3-col.m7,  .w3-col.m8,  .w3-col.m9,  .w3-col.m10,  .w3-col.m11,  .w3-col.m12,
.w3-col.l1, .w3-col.l2, .w3-col.l3, .w3-col.l4, .w3-col.l5, .w3-col.l6,  .w3-col.l7,  .w3-col.l8,  .w3-col.l9,  .w3-col.l10,  .w3-col.l11,  .w3-col.l12 {
  text-align: left;
}


/*
 www.drupal.org/project/d8w3css/issues/2945001 
*/
.mobile-nav:hover,
ul li.li-expanded > a:hover {
  cursor: pointer!important;
}

ul li.li-expanded > a:hover {
  cursor: pointer!important;
}


/*----Views Filter -----------------------------------------*/
/*----Filter in Views sollen nicht die ganze Breite einnehmen */
.view-filters .w3-section {
	display: inline-block;
	/*width: 50%;*/
	margin-right: 10px;
}

.views-field-operations a{ 
	font-size:60%;
	display:block;
	margin-bottom:0.25em
	}
	
.views-field-operations a:hover{ 
	color:#f00;
}

/* Blendet den globalen "Alle Dienste umschalten"-Eintrag im Klaro-Modal aus */
.klaro li.cm-toggle-all {
    display: none !important;
}


/* RESPONSIVE --------------------------------------------------- */

/* Small/Medium Screen Only */
/* Layout */
@media (max-width:992px) {
	
	body {
		font-size: 85% !important;
		line-height:1.55;
	}
	
	.page-wrapper{
		/*padding:0 8px !important;*/
	}
	
	.site-logo {
		padding: 4px 8px !important;
		margin:4px !important;
		width:220px;
	}
	
	.block-page-title-block {
		width:100%;

	}
	
	.block-page-title-block > h1.page-title{
	 font-size: 2.4em !important;
	top: 24px;
	left: 8px;
	}
	

	.block-system-breadcrumb-block {
		padding: 0 0.6em;
		margin-bottom: -24px;
	}
	.space-right {
    padding-right: 0.5em;
	}

}/* END  992px Screen*/

/* Small Screen Only */
@media (max-width:600px) {
	
body {
		font-size: 70% !important;
		line-height:1.65;
	}
	
.w3-container{
		padding:0.25em;
	}
	
p {
		/* font-size: inherit !important; */ 
		padding: inherit !important;
		margin: 0;
	}
	
.node__content p{
	margin:0.4em 0;
}
	
.page-wrapper{
		/*padding:0 !important;*/
	}

div.d8-fade .w3-mobile, div.main-box .w3css-content, div.node__content{
  padding: 0;
}

.site-logo {
	width:55%;
	}

 .mobile-nav {
 width:40%;
	 height:30px;
	 padding:10px;
	 float:right;
}

.language-switcher-language-url {
   width: unset;
	position: relative;
	top:-20px;
	margin-bottom:0px;
	padding:0;
}

	.slidertext{
		font-size:140% !important;
	top: -4em;
	left: 0.25em;
	}
	
.slidertext > span {
	font-weight:600 !important;
}

h1{
	font-weight:500;
	font-size:150%;
}

	.block-page-title-block {
		width:100%;
		font-size: 100% !important;
		}
		
	.block-page-title-block > h1.page-title{
		font-size: 1.6em !important;
		top: 16px;
		left: 8px;

	}
	
	.block-system-breadcrumb-block {
		padding:8px 0;
		margin-bottom: -4px;
	}
		
	.space-right {
		padding-right: 0.2em;
	}
		
}/* END Small Screen Only */