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

	grey 75%	#646464
	grey 60%	#878787
	grey 49%	#9e9e9e
	
	lightblue #f0f9fd
	lightblue2 #bfd6EA
		
	grey 18,75%	#dad9da	
	grey 15%	#e6e6e6
*/

/* BASICS------------------------------- */
html, body{
	 font-family: 'Open Sans';
}

body p{
	text-align:left !important;
}
/* LAYOUT------------------------------- */

/* padding: vertical horizontal */ 
/* padding: top right bottom left */ 
.page-wrapper{
	background-image:url('../img/html-bg.jpg');
	background-repeat:repeat-x;
	background-position: top;
	background-color:#e9e9e9;
}

#header,#page-title, #main-navigation-h, #main-navigation-v, #highlighted, #top-container, #main-container,
#footer-menu{
	background: transparent;	
}

#page-title-inner{
	background-color: transparent;
}

h1.page-title {
	font-size:2.6em;
}

#main-container-inner h1.page-title {
	padding:0 16px 0 0;
	}

#page-title-inner h1.page-title {
	padding:0 32px 0;
	/*background-color: #005daaaa;
	color:#fff;*/
	}
	
h1.page-title span{
	background-color: #005daaaa;
	color:#fff;
	padding: 4px 16px;
	line-height: 1.5em;
}


#header-inner{
	background-color: rgba(255, 255, 255, 0.9);
}

.site-logo {

}
.site-name{
	
}

nav.breadcrumb{
	
}

ul.breadcrumb  {
	padding:4px 4px 4px 16px;
}
ul.breadcrumb li {
	background-color:	#f0f9fda6;
	padding:4px 4px 6px  8px;
}



.node__content li{
	margin-bottom: .25em;
	/*border-bottom:4px solid #eee;*/
}


#block-unitracc-w3css-qrcode{
	max-width:500px;
	float:left;
	margin-left:16px;
	/*border:1px solid red;*/	
}


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

	html,
	body {
		font-size: 18px;
	}
	
	h1 {
	  font-size: 2.2em; /* 36px; */
	  	  line-height:1.3 !important;
		  font-weight:300;
	}
	h2 {
	  font-size: 1.75em;/* 30px; */
	  	  line-height:1.3 !important;
		  font-weight:300;
	}
	h3 {
	  font-size: 1.5em; /* 24px; */
	}
	h4 {
	  font-size: 1.3em;/* 20px; */
	}
	h5 {
	  font-size: 1.1em;/* 18px; */
	}
	h6 {
	  font-size: 1.0em;/* 16px; */
	}
	
	w3-jumbo{
		font-size: 3.0em !important; /* 64px / 13,235px = em*/
	}
	w3-xxxlarge{
		font-size: 2.4em!important; /*48px */
	}
	w3-xxlarge{
		font-size: 2.1em !important; /*36px */
	}
	w3-xlarge{
		font-size: 1.6em !important; /*24px */
	}
	w3-large{
		font-size: 1.3em !important; /*18px */
	}
	w3-small{
		font-size: 0.8em !important; /*12px */
	}
	w3-tiny{
		font-size: 0.7em !important; /*10px */
	}

.orange1{color:#BA601D}
.green1{color:#749520}
.green2{color:#cfe68c}
.blue{color:#015daa;}
.blue1{color:#458CC3;}
.blue2{color:#005D9C;}
.blue3{color:#004C80;}


.bg-orange1{color:#fff; background-color:#BA601D;}
.bg-green1{color:#fff; background-color:#749520;}
.bg-green2{color:#fff; background-color:#cfe68c}
.bg-blue{color:#fff; background-color:#015daa;}
.bg-blue1{color:#fff; background-color:#458CC3;}
.bg-blue2{color:#fff; background-color:#005D9C;}
.bg-blue3{color:#fff; background-color:#004C80;}


/* ------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; 
} */

.ckeditor-buttons li .cke-icon-only {
	width: 32px;
}
/* 
 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;
}

/*navigation level 2 upwards*/
.ul-parent li ul.ul-child {
	background: #fff;
}


 /* h5p content input */
body.user-logged-in table#field-h5p-feld-values td,
body.user-logged-in table#field-h5p-feld-values tr{
	display:inline;
	}
body.user-logged-in  .form-item-field-h5p-feld-0-h5p-content-editor{
	width:100%
}

/*div.h5p-image-hotspots-container
button.h5p-image-hotspot*/
div.h5p-image-hotspots-overlay div.h5p-image-hotspot-popup {
	transition:none !important;
}

/*submit buttons animation*/
@keyframes wiggle {
  0%,
  7% {
    transform: rotateZ(0);
  }

  15% {
    transform: rotateZ(-5deg);
  }

  20% {
    transform: rotateZ(2.5deg);
  }

  25% {
    transform: rotateZ(-1deg);
  }

  30% {
    transform: rotateZ(2deg);
  }

  35% {
    transform: rotateZ(-1deg);
  }

  40%,
  100% {
    transform: rotateZ(0);
  }

}
input.button.form-submit{
	background-color:#749520;
	color:#fff;
}
input.button.form-submit:hover {
  color:#fff; background-color:#749520;
  animation: wiggle 0.3s;
  animation: none;
}

.w3-search-block-form .form-actions {
  width: unset;
  min-width:4em;
  float: left;
  color:#fff;
  svg {
  fill: currentColor;
}
}



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

/* Small/Medium Screen Only */
/* Layout */
@media (max-width:992px) {
	html,
	body {
		font-size: 18px;
	}

/*  TYPO Small/Medium Screen------------------------------ */	

	
		
	.node--view-mode-full .w3-container.node__content .field--name-body p {
		padding:0 4px;
	}
	
	.node__content, .w3-row-padding, .w3-col{
		padding:0;
	}

	.block-system-main-block {
		padding: 0;
	}
	
	.w3-row-padding, .w3-row-padding > .w3-half, .w3-row-padding > .w3-third, .w3-row-padding > .w3-twothird, .w3-row-padding > .w3-threequarter, .w3-row-padding > .w3-quarter, .w3-row-padding > .w3-col {
		padding: 0;
	}
	
}/* END  992px Screen*/

/* Small Screen Only */
@media (max-width:600px) {

	html,
	body {
		font-size: 20px;	}
	p {
		font-size: 1em;	}
	h1 {
	  font-size: 1.95em;	}
	h2 {
	  font-size: 1.45em;	}
	h3 {
	  font-size: 1.3em;	}
	h4 {
	  font-size: 1.1em;	}
	h5 {
	  font-size: 1.0em;	}
	h6 {
	  font-size: 1.0em;	}
	
	w3-jumbo{
		font-size: 2.0em !important;
	}                               
	w3-xxxlarge{                     
		font-size: 1.5em!important; 
	}                               
	w3-xxlarge{                      
		font-size: 1.3em !important;
	}                               
	w3-xlarge{                       
		font-size: 1.2em !important;
	}                               
	w3-large{                       
		font-size: 1.1em !important;
	}                               
	w3-small{                       
		font-size: 0.8em !important;
	}                               
	w3-tiny{                        
		font-size: 0.7em !important;
	}
	
}/* END Small Screen Only */