.videoWrapper{
	width: 100%;
  position: fixed;
  inset: 0;          /* statt width/height 100% */
  overflow: hidden;  /* wichtig bei cover */
}
.videoWrapper video{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  opacity: .3;
}
.video_back_col{
  position: absolute;
  inset: 0;
  background: #0057ff;
  opacity: 0.35;               /* z.B. */
  pointer-events: none;       /* blockiert keine Klicks */
}




.start_wrapper{
	width: 100%;
	position: relative;
  height: 80vh;
  display: flex;
  justify-content: center; /* horizontal */
  align-items: center;     /* vertikal */
}




.start_wrapper .inner_box {
	position: absolute;
	width: 900px;
	margin-top: -30px;
	height: 200px;
  z-index: 10;
}

.start_wrapper .inner_box img{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
}

.welcomeText{
	position: absolute;
	bottom: 0;
	height: 80px;
	width: 100%;
}
.welcomeText h1{
	text-align: center;
}

.welcomeText .container{
	text-align: center;
	margin-top: 20px;
}
.welcomeText .container img{
	width: 50px;
}




.wrapperForm_A {
    position: relative;
    float: left;
    width: 100%;
    overflow: hidden;
}

.wrapperForm_A img {
		margin-left: -5%;
		margin-top: 5px;
    width: 110%;
    display: block;   /* wichtig gegen kleine Abstände */
}


.wrapperHeadders_A{
	text-align: center;
	font-size: 30px;
}
.wrapperHeadders_B{
	font-size: 60px;	
	margin-top: -25px;
	text-align: center;
}
.wrapperHeadders_C{
	font-size: 50px;
}
.wrapperHeadders_D{
	font-size: 120px;	
	margin-top: -55px;
	margin-left: 10%;
}
.wrapperHeadders_E{
	font-size: 60px;	
	text-align: center;
}

.wrapperHeadders_F{
	font-size: 80px;	
	margin-top: -35px;
	text-align: center;
}



/*************************** Wrapper Icons **************************/

.wrapper_infoIcons{
	position: relative;
	float: left;
	width: 100%;
	overflow: hidden;
	height: auto;
	background: #FDC300;
	background-color: #ffcd27;
}

.wrapper_infoIcons .col-3{
	position: relative;
	float: left;
	margin-bottom: 80px;
	height: 350px;
}


/* Icons */
.wrapper_infoIcons .inner_box{
	box-sizing: border-box;
	margin: 10px;
}
.wrapper_infoIcons .icon_wrapper{
	position: relative;
	float: left;
	width: 100%;
	height: 170px;
	height: auto;
	padding-bottom: 20px;
	text-align: center
}
.wrapper_infoIcons .icon_wrapper img {
  display: inline-block;
  width: 150px;
  height: 150px;
}
 .specialIconSIze{
    width: 220px !important;
  }

/* Text */
.wrapper_infoIcons .icon_title{
	text-align: center;
	margin-bottom: 20px;
}


.wrapper_infoIcons .icon_text{
	text-align: center;
}



/*************************** Wrapper Our Projects - Teaser **************************/

.wrapper_OurProjectsTeaser{
	position: relative;
	float: left;
	width: 100%;
	height: auto;
	background: #4968A3;
}


/**** arrow *****/
.wrapper_OurProjectsTeaser .container{
	width: 100px;
	height: 80px;
/*	background: red;*/
	margin: 0 auto;
	text-align: center;
}
.wrapper_OurProjectsTeaser .container img{
	position: relative;
	width: 50%;
	padding-top: 10px;
}




/*************************** Wrapper Our Projects  **************************/

.wrapper_OurProjects{
  position: relative;
  float: left;
  width: 100%;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  margin: 0 auto;
	padding-bottom: 100px;


/*	height: auto;
  aspect-ratio: auto;*/
}

.wrapper_OurProjects .container_background_image{
	position: absolute;
  top: -5%;
  width: 120%;
  height: 120%;
  /* BAckground wird per JS reingeladen */
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;	
}
.origin_center{
  left: 0;
}
.origin_right{
	right: 0;
	background-position: right center;
}



.wrapper_OurProjects .container_wrapper{
  position: relative;
  width: 80%;
  margin: 0 auto;
/*  display: flex;
  justify-content: space-between;*/
}

.wrapper_OurProjects .container_left{
	position: relative;
	float: left;
	width: 40%;
	margin-top: 10%;
	margin-bottom: 100px;
	height: 100%;
}
.wrapper_OurProjects .container_right{
	position: relative;
	float: right;
	width: 50%;
	height: auto;
	margin-top: 10%;
}




/**************************** Left *****/
/*****
/*****/
.wrapper_OurProjects .teaser_txt{
	margin-top: 20px;
}
.wrapper_OurProjects .blog_txt{
	margin-top: 20px;
	margin-bottom: 40px;
}
.wrapper_OurProjects .side_line{
	position: absolute;
	width: 3px;
	border-radius: 10px;
	height: 40%;
	left: -20px;
	top: 30%;
}

/***** Right *****/
/*****
/*****/
.wrapper_OurProjects .container_right .image{
  position: relative;
  width: 100%;
  float: right;
  margin-top: 100px;
  margin-bottom: 20px;
}
.wrapper_OurProjects .container_right .image img{
  width: 100%;
  height: auto;
  display: block; /* verhindert whitespace-unten */
}




/*************************** Wrapper Our Projects  **************************/
/****/
/****/
/*************************** SPECIAL PORJEKTE  **************************/



/************ naKlim Heft ************/
/************
/************/

.naKlim_Container{
  position: relative;
  width: 100%;
  float: right;
  margin-bottom: 20px;
 }
 .naKlim_Container .spacer {
  width: 100%;
  visibility: hidden;
}
.naKlim_Container .testA{
  position: absolute;
  width: 70%;
  top: 20%;
  left: 0;
  z-index: 20;
}
.naKlim_Container .testA:hover{
	transform: scale(1.1) !important;
	cursor: pointer;
}
.naKlim_Container .testB{
	position: absolute;
  width: 52%;
  top: -20px;
  left: 50%;
  z-index: 10;
}
.naKlim_Container .testB:hover{
	transform: scale(1.1) !important;
	cursor: pointer;
}
.naKlim_Container .testC{
  position: absolute;
  width: 130%;
  top: 100px;
  left: -15%;
  opacity: 0;
  z-index: 0;
  transform: scale(0.5);
}
.naKlim_Container .testC:hover{
	cursor: pointer;
}
.naKlim_book_imageText{
	margin-top: -50px;
	position: relative;
	float: right;
	width: 70%;
	height: 100px;
	text-align: center; /* <-- wichtig */
}
.naKlim_book_imageText img{
	width: 100%;
  display: inline-block;
}




/************ KlimFan ************/
/************
/************/

.klimFan_iphone_container{
  position: relative;
  width: 100%;
  float: right;
  margin-top: 50px;
  margin-bottom: 20px;
 }
.klimFan_iphone_container .spacer {
  width: 100%;
  visibility: hidden;   /* nimmt Platz ein, ist aber unsichtbar */
}
.klimFan_iphone_container .testA{
    position: absolute;
    width: 44%;
    top: 40px;
    left: 0%;
    transform: rotate(-5deg);
    z-index: 5;
}
.klimFan_iphone_container .testB{
    z-index: 0;
    position: absolute;
    width: 67%;
    top: -26px;
    left: 40%;
    transform: rotate(4deg);
}
.klimFan_iphone_container .testC{
    position: absolute;
    width: 61%;
    top: 62%;
    left: 30%;
}
.klimFan_iphone_container .testC:hover{
		top: 63%;
    left: 34%;
    cursor: pointer;
}
.klimFan_iphone_imageText{
	position: relative;
	float: left;
	width: 70%;
	height: 100px;
	text-align: center; /* <-- wichtig */
}
.klimFan_iphone_imageText img{
	width: 90%;
  display: inline-block;
}



/************ MAP ************/
/************
/************/

.background_grading{
	position: absolute;
	width: 80%;
	height: 100%;
	background: linear-gradient(90deg,rgba(42, 123, 155, 1) 0%, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 47%, rgba(255, 255, 255, 0) 100%);
}
.mapMarker_Container{
  position: relative;
  width: 100%;
  float: right;
  margin-top: 100px;
  margin-bottom: 20px;
 }
.mapMarker_Container .spacer {
  width: 100%;
  visibility: hidden;   /* nimmt Platz ein, ist aber unsichtbar */
}
.mapMarker_Container .testA{
	position: absolute;
  width: 70px;
  top: 40%;
  left: 30%;
}
.mapMarker_Container .testB{
	position: absolute;
  width: 70px;
  top: -10%;
  left: 70%;
}
.mapMarker_Container .testC{
	position: absolute;
  width: 70px;
  top: 80%;
  left: 50%;
}

/************ UNESCO ************/
/************
/************/
.unesco_container{
	position: relative;
  width: 100%;
  float: right;
  margin-top: 20px;
  margin-bottom: 20px;
}
.unesco_container .spacer {
  width: 100%;
  visibility: hidden;   /* nimmt Platz ein, ist aber unsichtbar */
}
.unesco_container .testA{
	position: absolute;
  width: 90%;
  top: 0;
  left: 20%;
}


/************ KlimaKoffer ************/
/************
/************/


.koffer_container{
	position: relative;
  width: 100%;
  float: right;
  margin-top: 100px;
  margin-bottom: 20px;
}
.koffer_container .spacer {
  width: 100%;
  visibility: hidden;   /* nimmt Platz ein, ist aber unsichtbar */
}
.koffer_container .testA{
	position: absolute;
  width: 100%;
  top: 0;
  left: 10%;
}



/************ Handlungsempfehlungen ************/
/************
/************/


.hse{
  position: relative;
  width: 100%;
  float: right;
  margin-top: 100px;
  margin-bottom: 20px;
 }
.hse .spacer {
  width: 100%;
  visibility: hidden;   /* nimmt Platz ein, ist aber unsichtbar */
}
.hse .testA{
	position: absolute;
  width: 90%;
  top: 0;
  left: 20%;
}











/*************************** Wrapper Our Projects - MORE **************************/

.wrapper_MoreProjects{
	position: relative;
	float: left;
	width: 100%;
	overflow: hidden;
	height: auto;
	background: #BACAEA;
}





.wrapper_MoreProjects .projects_wrapper{
	position: relative;
	float: left;
	width: 100%;
	height: auto;
	min-height: 300px;
}

.projects_wrapper .container{
	position: relative;
	width: 85%;
	height: 350px;
	margin: 0 auto;
	margin-bottom: 60px;
}

.projects_wrapper .container:hover{
	scale: 1.1;
	cursor: pointer;
}

/****** IMAGES ******/
.projects_wrapper .image_container{
	position: relative;
	float: left;
	width: 100%;
	height: 200px;
	border-radius: 20px;
	overflow: hidden;
	margin-bottom: 20px;
}
.projects_wrapper .image_container img{
  width: 100%;
  height: 100%;
  object-fit: cover;      /* <-- Zauber */
  object-position: center;/* optional */
  display: block;
}

/****** TEXT ******/

.container h1{
	font-size: 20px;
	padding-bottom: 10px;
	overflow-wrap: break-word;
}

.container p{
  display: -webkit-box;
  -webkit-line-clamp: 4;    /* Anzahl der Zeilen */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}




/*************************** Wrapper - About Us **************************/


.wrapper_aboutUs{
	position: relative;
	float: left;
	width: 100%;
	height: auto;
	background: #4968A3;
	overflow: hidden;
}


.wrapper_aboutUs .container_left{
	position: relative;
	float: left;
	width: 30%;
	height: 500px;
}

.wrapper_aboutUs .container_left p{

	width: 70%;
}

.wrapper_aboutUs .container_left .fnt_flowText p{
	margin-bottom: 30px;
}


.wrapper_aboutUs .container_right{
	position: relative;
	float: right;
	width: 70%;
	height: 500px;
}
.wrapper_aboutUs .image_container{
	position: relative;
	float: right;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;

}

.wrapper_aboutUs .image_container img{
  width: 100%;
  height: 100%;
  object-fit: cover;      /* <-- Zauber */
  object-position: center;/* optional */
  display: block;

  border-radius: 5%;
}


/*************************** Wrapper - Auszeichnungen **************************/


.wrapper_auszeichnung{
	position: relative;
	float: left;
	width: 100%;
	height: auto;
	background: #E3E3E3;
	overflow: hidden;
}

.wrapper_auszeichnung p{
	position: relative;
	margin: 0 auto;
	width: 50%;
	text-align: center;
}

.wrapper_auszeichnung .image_container{
	position: relative;
	width: 30%;
	margin: 0 auto;
	height: auto;
}

.wrapper_auszeichnung .image_container img{
	position: relative;
	width: 100%;
	height: auto;
}


/*************************** Wrapper - Partner **************************/


.wrapper_aboutPartner{
	position: relative;
	float: left;
	width: 100%;
	height: auto;
	background: white;
	overflow: hidden;
}

.wrapper_aboutPartner p{
	position: relative;
	margin: 0 auto;
	width: 50%;
	text-align: center;
}

.wrapper_aboutPartner .wrapper_slider{
  position: relative;
  float: left;
  width: 100%;
  height: 200px;
  overflow: hidden;              /* <- wichtig */
}

.wrapper_aboutPartner .wrapper_slider .slider{
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;

  display: flex;                 /* <- kein Zeilenumbruch */
  flex-wrap: nowrap;
  align-items: center;
  will-change: transform;
}

.wrapper_aboutPartner .wrapper_slider img{
  width: 200px;
  margin-right: 100px;
  /* margin-top raus, weil wir center alignen */
  flex: 0 0 auto;
}

.wrapper_aboutPartner .wrapper_slider img:hover{
	scale: 1.1;
}


/*************************** Wrapper - Contacts **************************/

.wrapper_contacts{
	position: relative;
	float: left;
	width: 100%;
	overflow: hidden;
	height: auto;
	background: #FDC300;
	background-color: #ffcd27;
}


.wrapper_contacts .container{
	position: relative;
	width: 50%;
	height: 300px;
	margin: 0 auto;
}


.wrapper_contacts .container p{
	width: 70%;
	margin: 0 auto;
	text-align: center;
}	


/**** contact buttons ***/
.content_contact{
	position: relative;
	margin: 0 auto;
	width: 50%;
}

.content_contact_icons{
	position: relative;
	margin: 0 auto;
	width: 360px;	
	text-align: center;
	left: -10px;
}

.content_contact_icons img{
	width: 70px;
  margin-bottom: 20px;
  padding: 15px;
}

.content_contact_icons img:hover{
  transform: scale(1.2);
  cursor: pointer;
}



.content_contact_icons p{
  padding: 12px;
}


.content_aboutUs{
	position: relative;
	width: 80%;
	margin: 0 auto;
}

.content_contact_hidebox{
  position: relative;
  float: left;
  width: 100%;
  height: 90px;
  opacity: 0;
}
.content_contact_hidebox h1{
	text-align: center;
}
.content_contact_hidebox h2{
	text-align: center;
}

/*************************** Wrapper - Impressum **************************/

.wrapper_impressum{
	position: relative;
	float: left;
	width: 100%;
	overflow: hidden;
	height: 300px;
	background: #1C2638;
}

/*************************** Wrapper - Footer **************************/

.wrapper_footer{
	position: relative;
	float: left;
	width: 100%;
	background: #111722;
	padding: 30px;
	box-sizing: border-box;
	overflow: hidden;
}

.wrapper_footer a{
	position: relative;
	float: left;
	padding-right: 50px;
	text-align: left;
}
.wrapper_footer a:hover{
	color: #fff;
	opacity: 1;
}

.wrapper_footer p{
	position: relative;
	float: right;
}




/*************************** MORE PAGE **************************/
/****
/****
 * /****
/*************************** Wrapper - More **************************/

/******BANNER
/**/
/**/
.wrapper_moreBanner{
	position: relative;
	float: left;
	width: 100%;
	height: 100px;
	overflow: hidden;
}
.wrapper_moreBanner .logoSmall{
position: absolute;
    width: 300px;
    height: auto;
    left: 50px;
    top: -6px;
}
.wrapper_moreBanner .logoSmall:hover{
	transform: scale(1.05);
}
.wrapper_moreBanner .logoSmall img{
	position: relative;
	float: left;
	width: 100%;

}
.wrapper_moreBanner .bannerImg{
	position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../img/images/banner.png) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;	
  opacity: 0.8;
}


/******BODY
/**/
/**/
.wrapper_moreContainer{
	position: relative;
	float: left;
	width: 100%;
	overflow: hidden;
	padding-top: 100px;
}
.wrapper_moreContainer .left{
	position: relative;
	float: left;
	width: 70%;
	height: auto;
	/*kim*/
	padding-bottom: 100px;
	box-sizing: border-box;
}
.wrapper_moreContainer .singlePage img{
	position: relative;
	width: 100% ;
	height: auto ;
	margin-top: 40px;
	margin-bottom: 40px;
	border-radius: 20px;
}
.wrapper_moreContainer .singlePage h1{
	padding-bottom: 20px;
}
.wrapper_moreContainer .singlePage h2{
	padding-bottom: 20px;
}
.wrapper_moreContainer .singlePage p{
	padding-bottom: 20px;
}

.wrapper_moreContainer .left p{
	padding-bottom: 20px;
}



/******RIGHT
/**/
/**/
.wrapper_moreContainer .right{
	position: relative;
	float: left;
	width: 30%;
	height: auto;
/*	kim*/
/*	background: pink;*/
	padding: 30px;
	padding-top: 100px;
	box-sizing: border-box;
	opacity: .4;
}
.wrapper_moreContainer .right:hover{
	opacity: 1;
}
.wrapper_moreContainer .right h1{
	font-size: 30px;
	line-height: 30px;
	margin-bottom: 30px;
}
.wrapper_moreContainer .verticalLine{
	position: absolute;
	width: 4px;
	height: 80%;
	left: 0;
	border-radius: 2px;
	background: #4968A3;
	opacity: 0.3;
}


.wrapper_moreContainer .teaserContainer{
	width: 100%;
	position: relative;
	float: left;
	height: auto;
	margin-bottom: 30px;
}

.wrapper_moreContainer .teaserContainer:hover{
	cursor: hover;
	transform: scale(1.05);
	color: #4968A3;
}

.wrapper_moreContainer .teaserContainer .image{
	position: relative;
	float: left;
	width: 100%;
	height: 200px;
	overflow: hidden;
	border-radius: 15px;
	margin-bottom: 15px;
}
.wrapper_moreContainer .teaserContainer .image img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.wrapper_moreContainer .teaserContainer h1{
	font-size: 20px;
	position: relative;
	float: left;
	width: 100%;
}




/****** Personalien
/**/
/**/

.persona_container{
	position: relative;
	float: left;
	width: 90%;
	height: auto;
	margin-bottom: 60px;
}
.persona_image_container{
	position: relative;
	float: left;
	width: 40%;
	height: 340px;

  background: url(https://siegmund-se.de/wp-content/themes/siegmund-se/img/images/persona_image.svg) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;	

  border-radius: 10px;

}


.persona_image_container img{
	position: absolute;
	left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 10px;
}

.persona_TXT_container{
	position: relative;
	float: left;
	width: 60%;
	height: auto;
	padding-left: 50px;
	box-sizing: border-box;
}
.persona_Name{
	margin-bottom: 10px;
	font-size: 20px;
}
.persona_genre{
	margin-bottom: 10px;
	font-size: 15px;
}
.persona_info{
	margin-bottom: 20px;
	font-size: 15px;
}
.persona_mail img{
  width: 30px;
  margin-left: 20px;
  margin-top: 0px;
  top: 3px;
  position: relative;
}
.persona_mail:hover img {
    transform: scale(1.3);
}

.persona_List{
	position: relative;
	float: left;
	width: 100%;
  display: flex;
  align-items: center;   /* DAS macht den Text vertikal mittig */
  opacity: .4;
}

.persona_List_txt{
	position: relative;
	float: left;
	width: 80%;
	padding-left: 10px;
	font-size: 14px;
}

.persona_List_image{
	position: relative;
  height: 40px;

  display: flex;
  align-items: center;     /* vertikal */
  justify-content: center; /* horizontal */
}

.persona_List_image img{
	width: 80%;
}


/************************/


.buttonWrapper{
	position: relative;
	width: 100%;
}

.myButton {

	float: left;
	
	font-size: 14px;  
  margin-right: 7px;

  border-radius:28px;
  display:inline-block;
  cursor:pointer;
  
  font-weight:bold;
  padding:10px 30px;
  text-decoration:none;

  margin-bottom: 10px;


      -webkit-transition:  .1s ease;
    -moz-transition:  .1s ease;
    -o-transition:  .1s ease;
    transition:  .1s ease;

}
.myButton:hover{
	cursor:pointer;
}





.button_ImageInstagram{
    width: 30px;
    height: 30px;

    display: flex;
    align-items: center;
    justify-content: center;

    background-image: url("../img/icons/icon_instagram.svg");
    background-repeat: no-repeat;
    background-position: center;
		background-size: 24px 24px;
}

.button_ImageWeb{
    width: 30px;
    height: 30px;

    display: flex;
    align-items: center;
    justify-content: center;

    background-image: url("../img/icons/icon_website.svg");
    background-repeat: no-repeat;
    background-position: center;
		background-size: 24px 24px;
}


.bt_color_unterseite{
	background-color: #4968A3;
	color: #fff;
}
.bt_color_A{
	background-color: #4968A3;
	color: #fff;
}
.bt_color_B{
	background-color: #B1BF70;
	color: #fff;
}
.bt_color_C{
	background-color: #fff;
	color: #768042 ;
}

.bt_color_C:focus{
	color: #768042;
}

.bt_color_D{
	color: #fff;
	background-color: #E6A974;
}
.bt_color_E{
	float: none;
	color: #4968A3;
	background-color: #D2E1FD;
}
.bt_color_F{
	color: #04717E;
	background-color: #81F2FF;
}
.bt_color_G{
	color: #3D4C9F;
	background-color: #AFBBFD;
}



@media (hover: hover) {

.bt_color_A:hover{
	background-color: #6c97e9;
}
.bt_color_B:hover{
	background-color: #8c9757;
	color: #fff;
}
.bt_color_C:hover{
	color: #768042;
	background-color: #f9f69e;
}
.bt_color_D:hover{
	color: #fff;
	background-color: #a7784f;
}
.bt_color_E:hover{
	float: none;
	color: #4968A3;
	background-color: #fff;
}
.bt_color_F:hover{
	color: #04717E;
	background-color: #fff;
}
.bt_color_G:hover{
	color: #3D4C9F;
	background-color: #fff;
}

.bt_color_unterseite:hover {
  background-color:#FDC300;
  scale: 1.05;
}
.bt_color_unterseite:active {
  position:relative;
  top:1px;
}


}


/* Random */

.slider img{
		cursor: pointer;
	   -webkit-transition:  .2s ease;
    -moz-transition:  .2s ease;
    -o-transition:  .2s ease;
    transition:  .2s ease;
}

.scaleBild img{
    -webkit-transition:  .2s ease;
    -moz-transition:  .2s ease;
    -o-transition:  .2s ease;
    transition:  .2s ease;
}

.scaleBild img:hover{
	cursor: pointer;
	transform: scale(1.1);
}