#slogan {
  float: left;
  width: 57%;
  color: #fff;
  font-weight: 400;
  font-size: 31px;
  text-shadow: 1px 3px 3px #202020;
  margin-top: 130px;
}
#slogan b {
  font-weight: 900;
  font-style: italic;
}
#homelayout01 {
  float: left;
  margin-top: 120px;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: space-between;
  margin-bottom: 35px;
}
#homelayout01-1 {
  float: left;
  width: 38.9%;
}
#homelayout01 .ql {
  float: left;
  width: 18%;
  overflow: hidden;
  position: relative;
  margin-bottom: 0;
}
#homelayout01 #ql4::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  background: rgba(255, 255, 255, 0);
  width: 100%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
  transition: ease all 0.3s;
}

#homelayout01 #ql4:hover a,
#homelayout01 #ql4:hover p {
  color: #000 !important;
  text-shadow: none !important;
}
#homelayout01-1 div#ql1 {
  margin-right: 32px;
}
#ql6 {
  width: 38.5%!important;
}
#homelayout01 #ql3,
#homelayout01 #ql4,
#homelayout01 #ql9 {
  float: right;
}
#wrap02 #homelayout01-2 div#ql9 {
  float: right;
}
#homelayout01 .ql .qlbild {
  float: left;
  background: #000;
  position: relative;
  width: 100%;
}
#homelayout01 .ql .qlbild a::after {
  background: transparent;
  content: "";
  height: calc(100% - 34px);
  width: calc(100% - 34px);
  float: left;
  position: absolute;
  left: 17px;
  top: 17px;
  border: 4px solid #fff;
}
#homelayout01 .ql#ql6 .qlbild a::after {
  border: 4px solid #af3c3c;
}
#homelayout01 .ql#ql4 .qlbild a::after {
  border: 4px solid #f8cf12;
}
#homelayout01 .ql#ql5 .qlbild a::after {
  border: 4px solid #5ca742;
}
#homelayout01 .ql#ql9 .qlbild a::after {
  border: 4px solid #3b579d;
}
#homelayout01 .ql img {
  backface-visibility: hidden;
  border: 0 none !important;
  display: block;
  max-width: none;
  min-height: 100%;
  opacity: 1;
  position: relative;
  transform: translate3d(0px, 0px, 0px);
  transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
}
#homelayout01 .ql:hover img {
  opacity: 0.6;
  transform: translate3d(-20px, 0px, 0px);
}
#homelayout01 .ql#ql4:hover img,
#homelayout01 .ql#ql5:hover img,
#homelayout01 .ql#ql9:hover img {
  opacity: 1;
  transform: translate3d(0px, 0px, 0px);
}

#homelayout01 .ql .qltext {
  float: left;
  width: 100%;
  position: absolute;
  transform: translate3d(34px, 223px, 0);
  font-family: "Oswald", sans-serif;
}
#homelayout01 .ql#ql4 .qltext {
  transform: translate3d(34px, 199px, 0);
}
#homelayout01 .ql#ql4:hover .qltext {
  transform: translate3d(34px, 42px, 0);
  text-align: left;
}
#homelayout01 .ql#ql5 .qltext {
  transform: translate3d(34px, 223px, 0);
}
#homelayout01 .ql#ql5:hover .qltext {
  transform: translate3d(34px, 66px, 0);
  text-align: left;
  max-width: 212px;
}
#homelayout01 .ql#ql8 .qltext {
  transform: translate3d(34px, 198px, 0);
}
#homelayout01 .ql#ql8:hover .qltext {
  transform: translate3d(calc(50% - 25px), 91px, 0);
}
#homelayout01 .ql .qltext h4 {
  text-shadow: 0 0 10px #000, 0 0 20px #000;
}
#homelayout01 .ql#ql8 .qltext h4,
#homelayout01 .ql:hover .qltext h4 {
  text-shadow: none;
}
#homelayout01 .ql .qltext h4 a {
  font-size: 24px;
  font-weight: 600;
  text-transform: uppercase;
  color: #fff;
  font-family: "Oswald", sans-serif;
  line-height: 24px;
}
#homelayout01 .ql#ql4 .qltext h4 a,
#homelayout01 .ql#ql5 .qltext h4 a,
#homelayout01 .ql#ql9 .qltext h4 a {
  color: #000;
  text-shadow: none;
  line-height: 24px;
}
#homelayout01 .ql#ql9 .qltext h4 a {
  background: url(../images/fb.png) center right no-repeat;
  padding-right: 38px;
}
#homelayout01 .ql#ql9:hover .qltext h4 a {
  background: none;
  padding: 0;
}
#homelayout01 .ql#ql9:hover .qltext p a {
  background: url(../images/fb.png) center center no-repeat;
  height: 53px;
}
#homelayout01 #ql4.ql .qltext h4,
#homelayout01 #ql5.ql .qltext h4,
#homelayout01 #ql9.ql .qltext h4 {
  margin-bottom: 23px;
  float: left;
  width: 100%;
}
#homelayout01 #ql5.ql .qltext h4 {
  margin-bottom: 14px;
}

#homelayout01 .ql:hover .qltext {
  width: 100%;
  text-align: center;
  transform: translate3d(0, 91px, 0);
  /*transition:  transform 0.35s ease 0s;*/
}
#homelayout01 .ql:hover .qltext p a {
  background: url(../images/qlmehr.png) top center no-repeat;
  float: left;
  width: 100%;
  height: 53px;
}
#homelayout01 .ql#ql4:hover .qltext p a {
  background: none;
  height: auto;
  width: auto;
  margin-bottom: 18px;
}
#homelayout01 #ql4.ql .qltext p,
#homelayout01 #ql5.ql .qltext p {
  display: none;
  line-height: 18px;
  font-size: 15px;
  margin-top: 20px;
}
#homelayout01 #ql5.ql .qltext p {
  margin-top: 10px;
}
#homelayout01 .ql#ql4:hover .qltext p,
#homelayout01 .ql#ql5:hover .qltext p {
  display: block;
}
#homelayout01 .qlklein .ql:hover .qltext {
  width: 100%;
  text-align: center;
  transform: translate3d(calc(50% - 25px), 91px, 0);
  transition: transform 0.35s ease 0s;
  float: none;
  margin: 0 auto;
  max-width: 165px;
  line-height: 27px;
}

#homelayout01 .qlklein {
  float: left;
  width: 100%;
}

#homelayout01-2 {
  float: left;
  width: 38.9%;
  margin: 0 30px;
}

#homelayout01 #ql4.ql .qlbild,
#homelayout01 #ql5.ql .qlbild,
#homelayout01 #ql6.ql .qlbild,
#homelayout01 #ql9.ql .qlbild {
  height: 280px;
  background: url(../images/qlweiss.png) left top repeat;
}
#homenews {
  float: left;
  width: calc(100% - 68px);
  position: absolute;
  left: 34px;
  bottom: 34px;
  top: 30px;
}
/*#homenews .news {
    height: 140px;
}*/
#homenews .news h4 a {
  color: #000;
  cursor: pointer;
  font-family: "Oswald", arial, helvetica, sans-serif;
  font-size: 24px;
  line-height: 30px;
  text-transform: uppercase;
}
.ql #mehr {
  border: 3px solid #af3c3c;
  width: 14px;
  height: 14px;
  float: left;
  background: #af3c3c;
  position: absolute;
  top: 30px;
  left: 106px;
  z-index: 9;
}
.ql #bx-pager {
  position: absolute;
  top: 30px;
  left: 34px;
}
.ql #bx-pager li a {
  border: 3px solid #af3c3c;
  width: 14px;
  height: 14px;
  float: left;
}
#mehr a {
  width: 20px;
  height: 20px;
  float: left;
  position: absolute;
  top: -3px;
  left: -3px;
}
.ql #pfeil {
  background: #fff;
  width: 14px;
  height: 2px;
  position: relative;
  float: left;
  margin-top: 6px;
  margin-left: 0px;
}

.ql #pfeil:before {
  background: #fff;
  content: "";
  width: 2px;
  height: 14px;
  position: absolute;
  top: -6px;
  left: 6px;
}
.ql #bx-pager li a.active {
  background: #af3c3c;
}
.ql #bx-pager li {
  list-style: none;
  float: left;
  margin-right: 4px;
}
.bx-wrapper {
  float: left;
}
#homenews .teaserText {
  float: left;
  width: 100%;
}
#homenews .newsdate {
  float: left;
  background: #af3c3c;
  padding: 5px 0;
  margin-bottom: 10px;
  color: #fff;
  width: 109px;
  text-align: center;
}
#homenews .bx-viewport {
  height: 140px !important;
}
#homelayout01-3 {
  float: left;
  width: 18.2%;
}
#homelayout01-3 .ql {
  width: 100%;
}
.home .alles {
  max-width: 1524px;
}

#homelayout01 .ql .ce-gallery {
  float: left;
  position: relative;
  width: 100%;
  margin-left: 0px !important;
  margin-top: 0;
}
#homelayout01
  #ql4
  .ce-gallery[data-ce-rows="1"]
  .ce-row.ce-gallery[data-ce-columns="1"]
  .ce-row {
  height: 280px;
}

---------------------- #homelayout01 .ql {
  float: left;
  width: 47.3%;
  overflow: hidden;
  height: 279px;
  position: relative;
  margin-bottom: 32px;
}
#homelayout01 .ql .ce-textpic,
#homelayout01 .ql .ce-textpic .ce-row {
  overflow: hidden;
  height: 280px;
  width: 100%;
}
#ql1 h4,
#ql4 h4,
#ql5 h4 {
  float: left;
  position: absolute;
  z-index: 1;
  transform: translate3d(34px, 223px, 0);
  font-family: "Oswald";
  text-shadow: 0 0 10px #000, 0 0 20px #000;
  text-transform: uppercase;
  line-height: 24px;
  font-size: 24px;
  font-weight: 600;
  color: #fff;
}
#ql1 .ce-textpic.ce-center a::after {
  background: transparent;
  content: "";
  height: calc(100% - 54px);
  width: calc(100% - 34px);
  float: left;
  position: absolute;
  left: 17px;
  top: 15px;
  border: 4px solid #fff;
}
#ql1:hover h4 {
  width: 100%;
  text-align: center;
  transform: translate3d(calc(50% - 25px), 91px, 0);
  transition: transform 0.35s ease 0s;
  float: none;
  margin: 0 auto;
  max-width: 165px;
  line-height: 27px;
}

#ql1:hover h4::after {
  content: "";
  background: url(../images/qlmehr.png) top center no-repeat;
  float: left;
  width: 100%;
  height: 53px;
  botom: 10px;
}

#homelayout01 .ql#ql1 a {
  font-family: "Oswald";
  text-shadow: 0 0 10px #000, 0 0 20px #000;
  text-transform: uppercase;
  line-height: 24px;
  font-size: 24px;
  font-weight: 600;
  color: #fff;
}

#homelayout01 .ql .clickenlarge-0 {
  background: #000;
  margin: 0 0 -1px;
}

#homelayout01 .ql#ql4 .clickenlarge-0,
#homelayout01 .ql#ql9 .clickenlarge-0,
#homelayout01 .ql#ql5 .clickenlarge-0,
#homelayout01 .ql#ql7 .clickenlarge-0 {
  background: none;
  margin: 0 0 10px;
}

#ql4:hover h4 {
  width: 100%;
  text-align: center;
  transform: translate3d(calc(50% - 49px), 58px, 0);
  transition: transform 0.35s ease 0s;
  float: none;
  margin: 0 auto;
  max-width: 165px;
  line-height: 27px;
}
#homelayout01 .ql#ql4:hover h4 {
  text-align: left;
  bottom: initial;
  transform: translate3d(calc(50% - 49px), 44px, 0);
}
#homelayout01 .ql#ql4 .ce-bodytext {
  transform: translate3d(34px, 199px, 0);
  line-height: 18px;
  font-size: 15px;
  margin-top: 20px;
  font-family: "Oswald", sans-serif;
  float: left;
  width: 100%;
  position: absolute;
  color: transparent;
}
#homelayout01 .ql#ql4:hover .ce-bodytext {
  transform: translate3d(34px, 91px, 0);
  z-index: 1;
  transition: transform 0.4s ease 0s;
  color: #fff;
  text-shadow: 0 0 10px #000, 0 0 20px #000;
}
#homelayout01 .ql#ql4 h4 {
  color: #000;
  text-shadow: none;
  line-height: 24px;
  width: 78%;
  bottom: 265px;
}
#homelayout01 h4 {
  font-size: 24px;
  font-weight: 600;
  text-transform: uppercase;
  color: #fff;
  font-family: "Oswald", sans-serif;
  line-height: 24px;
}
#homelayout01 .ql#ql4 a {
}
#homelayout01 .ql a::after {
  background: transparent;
  content: "";
  height: calc(100% - 20px);
  width: 100%;
  float: left;
  position: absolute;
  left: 0;
  top: 0;
  text-align: left;
}

#homelayout01 .ql#ql4 .ce-textpic::after {
  background: transparent;
  content: "";
  height: calc(100% - 44px);
  width: calc(100% - 34px);
  float: left;
  position: absolute;
  top: 17px;
  left: 17px;
  border: 4px solid #fff;
  pointer-events: none;
}
#homelayout01 .ql#ql4 a {
  font-family: "Oswald";
  text-transform: uppercase;
  line-height: 24px;
  font-size: 24px;
  font-weight: 600;
  color: #fff;
  text-shadow: 0 0 10px #000, 0 0 20px #000;
}

#homelayout01 .ql#ql4 a.mail {
  color: #fff;
  text-shadow: 0 0 10px #000, 0 0 20px #000;
  font-size: 15px;
  text-transform: none;
  background: none;
  line-height: 24px;
  text-decoration: underline;
  font-weight: 400;
  padding-left: 0px;
  font-family: "Lato", arial, helvetica, sans-serif;
}

#homelayout01 .ql#ql5:hover h4 {
  text-align: left;
  bottom: initial;
  transform: translate3d(calc(50% - 49px), 50px, 0);
}
#homelayout01 .ql#ql5 .ce-bodytext {
  transform: translate3d(34px, 199px, 0);
  line-height: 18px;
  font-size: 15px;
  margin-top: 20px;
  font-family: "Oswald", sans-serif;
  float: left;
  width: 100%;
  position: absolute;
  color: transparent;
}
#homelayout01 .ql#ql5 .ce-bodytext P {
  margin-bottom: -3px;
}
#homelayout01 .ql#ql5:hover .ce-bodytext {
  transform: translate3d(34px, 70px, 0);
  z-index: 1;
  transition: transform 0.4s ease 0s;
  color: #000;
}
#homelayout01 .ql#ql5 h4 {
  color: #000;
  text-shadow: none;
  line-height: 24px;
  width: 78%;
  bottom: 265px;
}

#homelayout01 h4 {
  font-size: 24px;
  font-weight: 600;
  text-transform: uppercase;
  color: #fff;
  font-family: "Oswald", sans-serif;
  line-height: 24px;
}
#homelayout01 .ql#ql5 a {
}

#homelayout01 .ql#ql5 .ce-textpic::after {
  background: transparent;
  content: "";
  height: calc(100% - 44px);
  width: calc(100% - 34px);
  float: left;
  position: absolute;
  top: 17px;
  left: 17px;
  border: 4px solid #5ca742;
}
#homelayout01 .ql#ql5 a {
  font-family: "Oswald";
  text-transform: uppercase;
  line-height: 24px;
  font-size: 24px;
  font-weight: 600;
  color: #000;
}
#homelayout01 .ql#ql5 a.mail {
  color: #000;
  font-size: 13px;
  text-transform: none;
  background: none;
  line-height: 24px;
  padding-left: 0px;
  font-family: "Lato", arial, helvetica, sans-serif;
}

#ql5:hover h4::after {
  content: "";
  float: left;
  width: 100%;
  height: 53px;
  botom: 10px;
}
#homelayout01 .ql#ql5:hover h4 {
  text-align: left;
  bottom: initial;
}

#ql5:hover h4 {
  width: 100%;
  text-align: center;
  transform: translate3d(calc(50% - 49px), 58px, 0);
  transition: transform 0.35s ease 0s;
  float: none;
  margin: 0 auto;
  max-width: 165px;
  line-height: 27px;
}

#ql1 h4,
#ql4 h4,
#ql5 h4,
#ql7 h4,
#ql2 h4,
#ql3 h4,
#ql8 h4,
#ql9 h4 {
  float: left;
  position: absolute;
  z-index: 1;
  transform: translate3d(34px, 223px, 0);
  font-family: "Oswald";
  text-shadow: 0 0 10px #000, 0 0 20px #000;
  text-transform: uppercase;
  line-height: 24px;
  font-size: 24px;
  font-weight: 600;
  width: 78%;
  color: #fff;
  pointer-events: none;
}
#ql7 h4, #ql3 h4 {
  top: -24px;
}
#ql7 .ce-textpic a::after {
  background: transparent;
  content: "";
  height: calc(100% - 54px);
  width: calc(100% - 34px);
  float: left;
  position: absolute;
  left: 17px;
  top: 15px;
  border: 4px solid #fff;
}
#ql7:hover h4 {
  width: 100%;
  text-align: center;
  transform: translate3d(calc(50% - 25px), 91px, 0);
  transition: transform 0.35s ease 0s;
  float: none;
  margin: 0 auto;
  max-width: 165px;
  line-height: 27px;
}
#ql7:hover h4::after {
  content: "";
  background: url(../images/qlmehr.png) top center no-repeat;
  float: left;
  width: 100%;
  height: 53px;
  botom: 10px;
}
#homelayout01 .ql#ql7 a {
  font-family: "Oswald";
  text-shadow: 0 0 10px #000, 0 0 20px #000;
  text-transform: uppercase;
  line-height: 24px;
  font-size: 24px;
  font-weight: 600;
  color: #fff;
}
.ql#ql7 .ce-textpic,
.ce-textpic .ce-row,
ul.ce-uploads li {
  background: none;
}

#ql2 .ce-textpic a::after {
  background: transparent;
  content: "";
  height: calc(100% - 54px);
  width: calc(100% - 34px);
  float: left;
  position: absolute;
  left: 17px;
  top: 15px;
  border: 4px solid #fff;
}
#ql2:hover h4 {
  width: 100%;
  text-align: center;
  transform: translate3d(calc(50% - 25px), 91px, 0);
  transition: transform 0.35s ease 0s;
  float: none;
  margin: 0 auto;
  max-width: 165px;
  line-height: 27px;
}
#ql2:hover h4::after {
  content: "";
  background: url(../images/qlmehr.png) top center no-repeat;
  float: left;
  width: 100%;
  height: 53px;
  botom: 10px;
}
#homelayout01 .ql#ql2 a {
  font-family: "Oswald";
  text-shadow: 0 0 10px #000, 0 0 20px #000;
  text-transform: uppercase;
  line-height: 24px;
  font-size: 24px;
  font-weight: 600;
  color: #fff;
}
.ql#ql2 .ce-textpic,
.ce-textpic .ce-row,
ul.ce-uploads li {
  background: none;
}

#ql3 .ce-textpic a::after {
  background: transparent;
  content: "";
  height: calc(100% - 54px);
  width: calc(100% - 34px);
  float: left;
  position: absolute;
  left: 17px;
  top: 15px;
  border: 4px solid #fff;
}
#ql3:hover h4 {
  width: 100%;
  text-align: center;
  transform: translate3d(calc(50% - 25px), 91px, 0);
  transition: transform 0.35s ease 0s;
  float: none;
  margin: 0 auto;
  max-width: 165px;
  line-height: 27px;
}
#ql3:hover h4::after {
  content: "";
  background: url(../images/qlmehr.png) top center no-repeat;
  float: left;
  width: 100%;
  height: 53px;
  botom: 10px;
}
#homelayout01 .ql#ql3 a {
  font-family: "Oswald";
  text-shadow: 0 0 10px #000, 0 0 20px #000;
  text-transform: uppercase;
  line-height: 24px;
  font-size: 24px;
  font-weight: 600;
  color: #fff;
}
.ql#ql3 .ce-textpic,
.ce-textpic .ce-row,
ul.ce-uploads li {
  background: none;
}

#ql8 .ce-textpic a::after {
  background: transparent;
  content: "";
  height: calc(100% - 54px);
  width: calc(100% - 34px);
  float: left;
  position: absolute;
  left: 17px;
  top: 15px;
  border: 4px solid #fff;
}
#ql8:hover h4 {
  width: 100%;
  text-align: center;
  transform: translate3d(calc(50% - 58px), 91px, 0);
  transition: transform 0.35s ease 0s;
  float: none;
  margin: 0 auto;
  max-width: 198px;
  line-height: 27px;
}
#ql8:hover h4::after {
  content: "";
  background: url(../images/qlmehr.png) top center no-repeat;
  float: left;
  width: 100%;
  height: 53px;
  botom: 10px;
}
#homelayout01 .ql#ql8 a {
  font-family: "Oswald";
  text-shadow: 0 0 10px #000, 0 0 20px #000;
  text-transform: uppercase;
  line-height: 24px;
  font-size: 24px;
  font-weight: 600;
  color: #fff;
}
.ql#ql8 .ce-textpic,
.ce-textpic .ce-row,
ul.ce-uploads li {
  background: none;
}

#ql9 .ce-textpic a::after {
  background: transparent;
  content: "";
  height: calc(100% - 54px);
  width: calc(100% - 34px);
  float: left;
  position: absolute;
  left: 17px;
  top: 15px;
  border: 4px solid #3b579d;
}
#ql9:hover h4 {
  width: 100%;
  text-align: center;
  transform: translate3d(calc(50% - 25px), 91px, 0);
  transition: transform 0.35s ease 0s;
  float: none;
  margin: 0 auto;
  max-width: 165px;
  line-height: 27px;
}
#ql9:hover h4::after {
  content: "";
  background: none;
  float: left;
  width: 100%;
  height: 53px;
  botom: 10px;
}
#homelayout01 .ql#ql9 h4 a {
  font-family: "Oswald";
  text-shadow: none;
  text-transform: uppercase;
  line-height: 24px;
  font-size: 24px;
  font-weight: 600;
  color: #000;
  padding-right: 40px;
  /* background: url(../images/fb.png) right 4px no-repeat; */
}
#homelayout01 .ql#ql9:hover h4 a {
  background-position: bottom center;
  padding-right: 0;
  padding-bottom: 36px;
}
.ql#ql9 .ce-textpic,
.ce-textpic .ce-row,
ul.ce-uploads li {
  background: none;
}
