textarea, input {
  outline: none; }

#modalCallback.reveal-modal {
  border-radius: 3px;
  display: none;
  position: absolute;
  top: 0;
  visibility: hidden;
  width: 100%;
  z-index: 1010;
  left: 0;
  background-color: transparent;
  padding: 0 10px;
  border: solid 1px transparent;
  box-shadow: none;
  margin-top: 40px; }

#modalCallback.open ~ .reveal-modal-bg {
  background: rgba(0, 0, 0, 0.6); }

#modalCallback * {
  font-size: 14px; }

#modalCallback .regular {
  font-family: "DIN Pro Regular", Helvetica, Roboto, Arial, sans-serif; }

#modalCallback .bold,
#modalCallback label,
#modalCallback p.h2 {
  font-family: "DIN Pro Medium", Helvetica, Roboto, Arial, sans-serif;
  font-weight: normal !important; }

#modalCallback > * {
  max-width: 765px; }

#modalCallback p {
  line-height: 1.2em;
  margin: 0;
  padding: 0; }

#modalCallback .close-reveal-modal {
  position: absolute;
  right: 3%;
  top: 8%;
  color: #ffffff;
  width: 37px;
  height: 37px;
  z-index: 20;
  font-size: 20px; }

#modalCallback .callback-header {
  position: relative;
  background-color: #6db42a;
  overflow: hidden;
  max-height: 550px; }

#modalCallback .callback-header > img {
  position: absolute;
  right: 60px;
  bottom: -3px;
  width: 23%; }

#modalCallback .h1 {
  font-size: 32px;
  color: #ffffff;
  font-family: "DIN Pro Medium", Helvetica, Roboto, Arial, sans-serif;
  letter-spacing: -1.6px;
  margin-bottom: 10px; }

#modalCallback p.infotext.white-color {
  font-size: 15px;
  letter-spacing: -0.6px; }

.infobox {
  margin: 13px 0px 8px 45px; }

#modalCallback .tnumber, .tnumber b {
  font-size: 20px !important;
  font-family: "DIN Pro Light", Helvetica, Roboto, Arial, sans-serif;
  line-height: 1em;
  margin: 10px 0;
  letter-spacing: -1.6px; }

#modalCallback .tnumber b {
  font-family: "DIN Pro Medium", Helvetica, Roboto, Arial, sans-serif;
  font-weight: normal !important; }

#modalCallback .notice {
  font-size: 11px;
  margin-bottom: 5px; }

/*#modalCallback form {*/
#modalCallbackFormWrapper {
  background-color: #ffffff;
  padding: 30px 45px 30px; }

#modalCallback input,
#modalCallback textarea,
#modalCallback .ui-selectmenu-text,
#modalCallback .ui-selectmenu-open li {
  width: 100%;
  font-family: "DIN Pro Regular", Helvetica, Roboto, Arial, sans-serif; }

#modalCallback label {
  font-family: "DIN Medium", Helvetica, Roboto, Arial, sans-serif;
  letter-spacing: -0.6px;
  color: #6c6c6c; }

#modalCallback .ui-selectmenu-button {
  font-family: "DIN Pro Regular", Helvetica, Roboto, Arial, sans-serif;
  color: #6c6c6c;
  letter-spacing: -0.6px; }

#modalCallback textarea,
#modalCallback input,
#modalCallback .ui-selectmenu-button,
#modalCallback .ui-selectmenu-open > ul {
  border: 1px solid #6b6b6b;
  padding: 6px 10px 8px;
  background-color: #ffffff;
  outline: none; }

#modalCallback .ui-selectmenu-button {
  background-color: #eff0ed; }

#modalCallback textarea,
#modalCallback input,
#modalCallback .ui-selectmenu-button {
  height: 2.5em; }

#modalCallback input {
  margin-bottom: 20px; }

#modalCallback .select > li {
  padding-left: 20px; }

#modalCallback .select > li a {
  line-height: 1.3em;
  padding: 4px 0; }

#modalCallback .f3-form-error {
  background-color: #fdf2f2;
  border-color: #de2d0f; }

#modalCallback .h2 {
  color: #74B23A;
  font-size: 24px;
  margin-bottom: 15px;
  letter-spacing: -1.6px; }

#modalCallback label {
  margin-bottom: 5px; }

#modalCallback textarea {
  height: 80px;
  line-height: 1em;
  overflow: hidden;
  resize: none; }

#modalCallback .submit {
  text-align: center;
  width: auto; }

#modalCallback .submit input {
  background-color: #008e48;
  color: #ffffff;
  font-size: 15px;
  font-family: "DIN Medium", Helvetica, Roboto, Arial, sans-serif;
  line-height: 17.5px;
  margin-top: 10px;
  padding: 6px 55px;
  vertical-align: middle;
  width: auto;
  min-width: 200px;
  min-height: 48px; }

#modalCallbackForm div.submitForm {
  font-family: "DIN Pro Medium", Helvetica, Roboto, Arial, sans-serif;
  display: inline-block;
  position: static;
  margin-bottom: 20px;
  background-color: #008e48;
  color: #ffffff;
  font-size: 16px;
  margin-top: 10px;
  vertical-align: middle;
  transition: background-color 1s;
  line-height: 50px;
  padding: 0px 16px 5px;
  letter-spacing: -0.3px;
  min-width: 180px; }

#modalCallbackForm div.submitForm span.dsbuttonspan {
  color: #ffffff;
  font-size: 160%; }

#modalCallbackForm div.submitForm:hover {
  cursor: pointer;
  background-color: #01793e; }

@media only screen and (max-width: 33.5rem) {
  #modalCallbackFormWrapper {
    padding-left: 5px;
    padding-right: 5px; }
  #modalCallbackForm div.submitForm {
    width: 100%; } }

#modalCallback .policy,
#modalCallback .policy a {
  font-size: 13px;
  margin-bottom: 10px;
  color: #6c6c6c; }

#modalCallback .policy a.primary-color {
  color: #008e48;
  transition: color 1s;
  text-decoration: underline; }

#modalCallback .policy a.primary-color:hover {
  color: #7fbc19; }

#modalCallback .error {
  bottom: 0;
  display: block;
  position: absolute;
  color: red;
  font-size: 13px; }

#modalCallback .ui-front {
  z-index: 1010;
  margin-bottom: 10px; }

#modalCallback .ui-selectmenu-button {
  width: 100% !important; }

#modalCallback #topic-menu {
  width: 97% !important; }

#modalCallback .ui-selectmenu-button span.ui-selectmenu-text {
  line-height: 1.5em;
  padding: 0; }

#modalCallback .ui-menu .ui-state-focus,
#modalCallback .ui-menu .ui-state-active {
  margin: 0; }

#modalCallback .ui-menu li {
  line-height: 1.2em; }

#modalCallback .ui-menu li:hover {
  color: #74B23A; }

#modalCallback .ui-selectmenu-text {
  width: 94%; }

#modalCallback .modalHeight {
  margin: 40px 0; }

#modalCallback #topic-button {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeD0iMTJweCIgeT0iMHB4IiB3aWR0aD0iMjRweCIgaGVpZ2h0PSIzcHgiIHZpZXdCb3g9IjAgMCA2IDMiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDYgMyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHBvbHlnb24gcG9pbnRzPSI1Ljk5MiwwIDIuOTkyLDMgLTAuMDA4LDAgIi8+PC9zdmc+");
  background-size: 15%;
  background-position: 100% center;
  background-repeat: no-repeat; }

.small-youtube-size {
  overflow: hidden !important; }

.flex-video {
  position: relative !important;
  display: block !important;
  margin-top: 80px !important; }

.font-uppercase {
  text-transform: uppercase;
  color: white;
  margin-top: 15px; }

.matop {
  height: 100px;
  width: 300px; }

.youtube_play {
  width: 120px;
  text-align: center;
  left: 50%;
  margin-left: -60px;
  vertical-align: middle;
  position: relative;
  padding-left: -35px !important; }

.hideYouTubeIcon {
  display: none !important;
  visibility: hidden !important; }

.yt_no_left {
  left: 0 !important;
  margin-left: 0 !important; }

.youtube_play_teaser {
  width: 120px !important;
  text-align: center;
  left: 50%;
  margin-left: -60px;
  vertical-align: middle;
  position: absolute;
  top: 50%;
  margin-top: -60px; }

.youtube_play_teaser_pos-1 {
  left: 85%;
  top: 10%; }

.youtube_play_teaser_pos-2 {
  left: 15%;
  top: 10%; }

.youtube_play_teaser_pos-8 {
  top: 89%; }

.youtube_play_teaser_pos-9 {
  top: 89% !important;
  left: 60% !important; }

.youtube_play_teaser_pos-10 {
  top: 89%;
  left: 15%; }

#modalCallback .breaker {
  font-size: 20px !important;
  line-height: 1em; }

@media (max-width: 767px) {
  .infobox {
    margin: -10px 0px 0px 0px; }
  #modalCallback .submit {
    width: 100%; }
  #modalCallback .breaker {
    display: block;
    visibility: hidden;
    height: 5px;
    margin: 0; }
  #modalCallback .h2, #modalCallback .h1 {
    font-size: 20px; }
  .youtube_play_teaser_pos-8 {
    top: 82%; }
  .youtube_play_teaser_pos-9 {
    top: 82% !important; }
  .youtube_play_teaser_pos-10 {
    top: 82%; } }

.youtube_play_teaser_pos-17 {
  left: 85%; }

.youtube_play_teaser_pos-18 {
  left: 15%; }

.yt-hover-effect {
  transition: 1s; }

.yt-hover-effect:hover {
  cursor: pointer;
  opacity: 0.9; }

.youtube-close {
  visibility: hidden;
  display: none; }

.bo5 {
  bottom: 5%;
  position: absolute; }

@media (max-width: 800px) and (orientation: landscape) {
  .landscapefix {
    margin-right: 100%; }
  .flex-video {
    padding-left: 75px !important;
    padding-right: 75px !important;
    margin-top: 40px !important; } }

@media (min-width: 1200px) {
  .flex-video {
    padding-left: 250px !important;
    padding-right: 250px !important; } }

@media (min-width: 64em) {
  .flex-video {
    padding-left: 150px;
    padding-right: 150px; }
  .matop {
    height: 200px; } }

.yt-close-x {
  right: 2% !important;
  top: 10px !important; }

/*
*   Callback-Button
*/
#feedback {
  position: fixed;
  bottom: 20%; }

.contact-btn {
  cursor: pointer;
  z-index: 900;
  left: 0;
  bottom: 35px;
  padding: 0;
  background-color: #6db42a;
  height: 52px; }

.contact-btn .text-container {
  float: left;
  height: 52px;
  max-width: 0;
  overflow: hidden;
  -webkit-transition: max-width .4s ease-in-out 0s;
  -moz-transition: max-width .4s ease-in-out 0s;
  -ms-transition: max-width .4s ease-in-out 0s;
  -o-transition: max-width .4s ease-in-out 0s;
  transition: max-width .4s ease-in-out 0s;
  margin-right: 52px;
  position: relative;
  width: auto; }

.contact-btn .text-container .text-wrap {
  color: #ffffff;
  font-weight: bold;
  line-height: 15px;
  padding: 11px 10px 0 12px;
  display: inline-block;
  max-width: 98px; }

.contact-btn .icon-container {
  height: 52px;
  width: 52px;
  position: absolute;
  right: 0;
  top: 0;
  transition: background-color 1s; }

.contact-btn.text-container:hover > .icon-container {
  background-color: #5fa51c; }

.icon-container:hover {
  background-color: #5fa51c; }

#feedback .icon-wrap {
  position: relative; }

.contact-btn .icon-container .icon-wrap svg {
  position: absolute;
  left: 8px;
  top: 10px;
  width: 32px !important;
  height: 32px !important; }

.icon {
  fill: #6d6765; }

.contact-btn .icon-container .icon-wrap .icon {
  position: absolute;
  top: 10px;
  left: 8px;
  width: 32px;
  height: 32px; }

.contact-btn .icon-container .icon-wrap .interface-feedback {
  display: block;
  outline: none; }

.contact-btn .icon-container .icon-wrap .interface-feedback_hover {
  display: none;
  outline: none; }

.contact-btn:hover .text-container {
  max-width: 200px; }

.contact-btn:hover .icon-wrap .interface-feedback {
  display: none; }

.contact-btn:hover .icon-wrap .interface-feedback_hover {
  display: block; }

#modalCallbackFormWrapper .modal-loader {
  background-color: #000000;
  color: #ffffff;
  height: 100%;
  opacity: 0.5;
  width: 100%; }

#modalCallbackFormError, #modalCallbackFormThanks {
  display: none; }

#modalCallback .bubble-right {
  background: #ffffff;
  border-radius: 25px;
  height: 180px;
  width: 53%;
  padding: 25px 25px;
  margin: 4%; }

#modalCallback .bubble-right::after {
  content: "";
  position: relative;
  bottom: -15px;
  border-style: solid;
  border-color: #ffffff transparent;
  display: block;
  width: 0;
  top: -56px;
  left: 107%;
  bottom: auto;
  border-width: 20px 0px 20px 30px;
  border-color: transparent #ffffff; }

#modalCallback .bubble-right {
  margin-right: 50px; }

#modalCallback .callback-header .ff-img {
  width: 34%; }

@media screen and (max-width: 767px) and (orientation: portrait) {
  #modalCallback .bubble-right {
    background: #ffffff;
    border-radius: 25px;
    height: 180px;
    width: 96%;
    padding: 25px 25px;
    margin-top: 20%;
    margin-left: 2%;
    margin-bottom: 85%; }
  #modalCallback .bubble-right::after {
    content: "";
    position: relative;
    top: 37%;
    left: 30%;
    border-width: 27px 20px 0;
    border-style: solid;
    border-color: #ffffff transparent;
    display: block;
    width: 0; }
  #modalCallback .callback-header .ff-img {
    width: 450px;
    left: 29%; }
  #modalCallback .close-reveal-modal {
    top: 8%; }
  .youtube_play {
    width: 30px; } }

@media screen and (max-width: 600px) and (orientation: landscape) {
  #modalCallback .callback-header .ff-img {
    width: 43%;
    right: 30px; } }

@media screen and (max-width: 767px) {
  #modalCallback.reveal-modal {
    padding: 0;
    overflow-y: scroll;
    position: fixed;
    top: 0 !important;
    height: auto;
    max-height: 100%; } }

@media (min-width: 53em) {
  #modalCallback.reveal-modal {
    width: 53em;
    left: 0;
    right: 0;
    margin: auto; } }

#modalCallback .tx-powermail {
  background-color: #fff; }

#modalCallbackFormWrapper {
  padding: 40px !important; }