/* Dev Bar Divices Display Test  */
.devbar { 
  display: none;  margin: 20px 0; text-align: center;
}
@media (min-width: 768px) {
	.devbar { display: block; }
}

/* -----------------------------------------------------------------------------
*  [ Defaults (Body, Header (Navbar, Carousel), Content, Footer ]
* ----------------------------------------------------------------------------*/

html {
  position: relative;
  min-height: 100%;
  /* HTML5 input required, scroll to input with fixed navbar on submit */
  scroll-padding-top: 100px;
}

body > .container {
  /* padding: 60px 15px 0; Orig. */ /* Nur bei Fixed Navbar und wenn einziger Container */
  margin-bottom: 30px;
}
body > .container h1,
body > .container h2 {
  font-size: 28px;
}

body {
  background-color: #E9EEF6; /* Basisfarbe: 8EB0CF (8) - Orig: #fff */
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.content {
  flex: 1;
  margin-bottom: 20px;
  min-height: 400px;
}
.footer {
  margin-top: auto;
  width: 100%;
  background-color: #D4DEEC; /* Basisfarbe: 8EB0CF (7) - Orig: #f5f5f5 */
}

/* -----------------------------------------------------------------------------
*  [ Allegmeine Defaults ]
* ----------------------------------------------------------------------------*/

.bold { font-weight: bold; }
.rot { color: Red; }
.hellrot { color: #C75B24; }
.orange { color: #f0ad4e; }
.gruen { color: green; }
.kursiv { font-style: italic; }
.center { text-align: center; }
.rechts { text-align: right; }

.sg1 { font-size: 1.1em; }
.sg2 { font-size: 1.2em; }

.t10 { margin-top: 10px }
.t15 { margin-top: 15px; }
.t20 { margin-top: 20px; }
.ctop { margin-top: 35px }

.b10 { margin-bottom: 10px; }
.b15 { margin-bottom: 15px; }
.b20 { margin-bottom: 20px; }


a {
  color: #337ab7; /* Orig. #337ab7 */
  text-decoration: none;
}
a:hover,
a:focus {
  color: #23527c; /* Orig. #23527c */
  text-decoration: underline;
}


/* -----------------------------------------------------------------------------
*  [ Header Topbar ]
* ----------------------------------------------------------------------------*/

.affix {
  top: 0;
  width: 100%;
  z-index: 9999 !important;
}
.affix + .topbar, .affix + .header, .affix + .content {
  padding-top: 50px;
}

.topbar {
  width: 100%;
  min-height: 50px;
  /* Bei Änderung muss auch der Wert in der navbar angepasst werden bei data-offset-top
  sowie der Padding-Wert bei .header > .container */
  background-color: #D4DEEC;
  color: #0A467A;
}
.topbar-title, .topbar-slogan {
  position: relative;
  font-size: 28px;
  margin: 7px 0;
}
.topbar-slogan small, .topbar-title small {
  font-weight: 500;
  font-size: 65%;
}
.topbar-title small {
  color: #777;
}
.topbar-slogan {
  color: #C75B24; /* Basisfarbe: 0A467A (7) - Orig: #C75B24 */
  text-align: right;
}

@media (max-width: 767px) {
  .topbar-slogan {
    text-align: left;
    width: 100%;
    display: none;
  }
}
@media (max-width: 480px) {
  .topbar-title {
    width: 300px;
  }
}


/* -----------------------------------------------------------------------------
*  [ Sonstiges unsortiert ]
* ----------------------------------------------------------------------------*/

img.alignright { float: right; margin: 0.5em 0 1em 1em }

.imgalign .clearfix {
  overflow: auto;
}
.imgalign .thumbimg {
  float: right;
}

.breadcrumb {
  padding: 8px 15px;
  margin-bottom: 10px;
  list-style: none;
  background: none !important;
}

/* - - - - - | Bild Urheberkennzeichnungen | - - - - - */
.copyright_links, .copyright_rechts { position: relative; }
.copyright_links img, .copyright_rechts img { display: block; }
.copyright_links span, .copyright_rechts span { position: absolute; width: 100%; font-size: 0.7em; color: #858585; }
.copyright_rechts span { text-align: right; }
@media (max-width: 992px) {
  .copyright_rechts span { padding-right: 20px; }
}
@media (max-width: 767px) {
  .copyright_rechts span { padding-right: 0; }
}


/* -----------------------------------------------------------------------------
*  [ Header Navbar, Branding, Dropdown Menu (Individual Styles) ]
* ----------------------------------------------------------------------------*/


/* Header Navbar > Individual Brand (Logo und Text)
-------------------------------------------------- */
.navbar-brand {
  display: inline-block;
  padding-top: .3rem;     /* Nur bei Brand mit Logo erforderlich */
  padding-bottom: .3rem;  /* Nur bei Brand mit Logo erforderlich */
  /*margin-right: 2rem;*/
  font-size: 24px;
  font-weight: 500;
}

.navbar-brand img {
  display: inline-block;
  margin-right: .3rem;
  vertical-align: middle;
}

.navbar-brand .orange {
  color: #ee8602;
}
.navbar-brand .gruen {
  color: #42a1ab;
}


/* Header Navbar > Dropdown Sub-Menu (Paddings)
-------------------------------------------------- */
.navbar .dropdown-menu {
  padding: 0; /* padding: 5px 0; Orig */
}
.navbar .dropdown-menu > li > a {
  padding: 10px 20px !important;
}


/* Header Navbar > Individual Menu Colors (Backgrounds, Dropdown, Hover/Active)
-------------------------------------------------- */

/* Bootstrap 3 Menu Generatoren - http://bootstrap3-menu.codedorigin.com
   oder alternativ - https://work.smarchal.com/twbscolor/3.3.7/scss/d4deece7e7e7333333ee86021
   Default background: #F5F5F5
   Hover/Active background: #e7e7e7
   Default Text color: #333333
   Hover/Active Text color: #ee8602
*/

/* Navbar (Default Background, Text und Border color) */
.navbar { 
  margin-bottom: 0;
  background-image: none;
  background-color: #D4DEEC; /* Basisfarbe: 8EB0CF (7) - Orig: #f5f5f5 */
  color: #333333;
  border-color: #e7e7e7;
  border-top: 0px solid transparent;
}

/* Navbar Standard Brand (Default/Hover Text color) */
.navbar .navbar-brand { color: #333333; }
.navbar .navbar-brand:hover { color: #ee8602; }

/* Dropdown Sub-Menu (Background Color) */
.navbar .dropdown-menu { background-color: #D4DEEC; } /* Basisfarbe: 8EB0CF (7) - Orig: #f5f5f5 */

/* Navbar (Default Text Link color) */
.navbar .navbar-nav > li > a, 
.navbar .dropdown-menu > li > a {
  color: #333333;
}

/* Navbar (Hover/Focus Text color) */
.navbar .navbar-nav > li > a:hover, .navbar .navbar-nav > li > a:focus, 
.navbar .dropdown-menu > li > a:hover, .navbar .dropdown-menu > li > a:focus {
  color: #ee8602 !important;
}

/* Navbar (Hover/Focus Background color) */
.navbar .navbar-nav > li > a:hover, .navbar .navbar-nav > li > a:focus, 
.navbar .dropdown-menu > li > a:hover, .navbar .dropdown-menu > li > a:focus {
  background-image: none;
  background-color: #e7e7e7 !important;
}

/* Navbar (Active Background / Text color) */
.navbar .navbar-nav > .active > a, .navbar .navbar-nav > .active > a:hover, .navbar .navbar-nav > .active > a:focus, 
.navbar .dropdown-menu > .active > a, .navbar .dropdown-menu > .active > a:hover, .navbar .dropdown-menu > .active > a:focus {
  background-color: #e7e7e7 !important;
  color: #ee8602 !important;
}

/* Navbar (Dropdown caret Border color) */
.navbar .navbar-nav > .dropdown > a .caret { border-top-color: #333333; border-bottom-color: #333333; }
.navbar .navbar-nav > .dropdown > a:hover .caret { border-top-color: #ee8602; border-bottom-color: #ee8602; }

/* Navbar (Open Background / Text color) */
.navbar .navbar-nav > .open > a, .navbar .navbar-nav > .open > a:hover, .navbar .navbar-nav > .open > a:focus {
  background-color: #e7e7e7;
  color: #ee8602;
}

/* Individuelles Navbar Toggle
-------------------------------------------------- */

.navbar-toggle {
  margin-right: 10px; /* Orig. 15px */
  margin-top: 5px; /* Orig. 8px */
  margin-bottom: 5px; /* Orig. 8px */
}
.navbar-toggle .icon-bar {
  width: 28px; /* Orig. 22px */
  height: 3px; /* Orig. 2px */
}
.navbar-toggle .icon-bar + .icon-bar {
  margin-top: 6px; /* Orig. 4px */
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
  background-color: transparent; /* Orig. #ddd */
}
.navbar-default .navbar-toggle .icon-bar {
  background-color: #ec971f; /* Orig. #888 */
}
.navbar-default .navbar-toggle:hover .icon-bar {
  background-color: #4b8cc7; /* Orig. #888 */
}


/* Header Navbar > 24 Std. Hotline (Icon und Text)
-------------------------------------------------- */

.navbar .btn-default {
  color: #0a467a;
  background-color: #fff;
  border-color: #ccc;
  font-size: 1.5rem;
}
.navbar .btn-default:hover {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad;
}

@media (max-width: 992px) {
  .navbar span.hotline-tel {
    display: none;
  }
}


/* -----------------------------------------------------------------------------
*  [ Header Content ]
* ----------------------------------------------------------------------------*/

.header {
  width: 100%;
  background-color: #BECEE3; /* Standard BG-Basisfarbe: 8EB0CF (6) - Orig: #f5f5f5 */
}
.header.kurier { background-color: #c1eda9; /* BG-Farbe Kurierdienste und Transporte */ }
.header.messe { background-color: #aaeded; /* BG-Farbe Messe- und Präsentationsstände */ }
.header.events { background-color: #ededaa; /* BG-Farbe Events, Tagungen und Promotion */ }
.header.pos { background-color: #efd4e3; /* BG-Farbe Produktpräsentationen (POS) */ }
.header.error, .jumbotron.error { background-color: #EDCAB9; /* BG-Farbe Fehlermeldung */ }


.header > .container {
  padding: 15px 15px 0px; /* ohne topbar padding: 65px 15px 0px; */
}
.header > .container h1,
.header > .container h2 {
  font-size: 28px;
  margin-top: 10px;
  margin-bottom: 20px;
  color: #0A467A; /* Basisfarbe: 0A467A (4) - Orig: #f5f5f5 */
}

.header-title {
  
}
.header-slogan {
  position: relative;
  text-align: right;
}
.header-slogan small {
  color: #C77A00; /* Basisfarbe: 0A467A (7) - Orig: #C75B24 */
  font-weight: 500;
  font-size: 65%;
}
@media (max-width: 992px) {

  .header-slogan {
    text-align: left;
    width: 100%;
    /*display: none;*/
  }
  .header > .container h1,
  .header > .container h2 {
    font-size: 26px;
  }
  .header > .container h1 {
    margin-top: 0px;
    margin-bottom: 0px;
  }
  .header > .container h2 {
    margin-top: 0px;
    margin-bottom: 15px;
  }
}


/* -----------------------------------------------------------------------------
*  [ Header Slider ]
* ----------------------------------------------------------------------------*/

.slider {
  width: 100%;
  /*background-color: #77A0D3;*/ /* Basisfarbe: 4C8BC7 (5) - Orig: #f5f5f5 */
  background-color: #BECEE3; /* Standard BG-Basisfarbe: 8EB0CF (6) - Orig: #f5f5f5 */
  color: #fff; /* Orig: #333333 */
}
.slider > .container {
  /* Text-Slider*/
  /*padding: 15px 15px;*/
  /* Row Container-Slider*/
  padding: 30px 15px 0; /* padding: 15px 15px 0; */
  /*padding: 65px 15px 15px;*/ /* Wenn ohne Header Container */
}
.slider > .container h1 {
  font-size: 28px;
  margin-top: 10px;
  margin-bottom: 10px;
}

@media (max-width: 767px) {
  /* Container auf 100% Breite bringen */
  .productslider .slideimg_3 {
    display: none;
  }
}

@media (max-width: 567px) {
  .productslider .slideimg_1 {
    display: none;
  }
  /* Container auf 100% Breite bringen */
  .productslider .divbox100 {
    width: 100%;
  }
  
  .bildklickhinweis {
    display: none;
  }
}


/* -----------------------------------------------------------------------------
*  [ Site Content ]
* ----------------------------------------------------------------------------*/

.wartungshinweis {
  margin-top: 25px;
  margin-bottom: 0;
}

.page-header {
  padding-bottom: 9px;
  margin: 35px 0 20px; /* margin: 40px 0 20px; */
  border-bottom: 1px solid #BFCEEA; /* Basisfarbe: 4C8BC7 (7) - Orig: #f5f5f5 */
}
.page-header.mt15 {
  margin: 20px 0 20px;
}

.content > .container h1,
.content > .container h2 {
  font-size: 26px;
}
.container .text-muted {
  margin: 20px 0;
}


/* Original CSS
.container .jumbotron {
  padding-right: 15px;
  padding-left: 15px;
  border-radius: 6px;
}
.jumbotron {
  padding-top: 30px;
  padding-bottom: 30px;
  margin-bottom: 30px;
  color: inherit;
  background-color: #eee;
}
*/

.jumbotron p {
  margin-bottom: 15px;
  font-size: 17px;
  font-weight: 400;
}

@media screen and (min-width: 768px) {
  .container .jumbotron {
    padding-right: 30px;
    padding-left: 30px;
  }
}
.container .jumbotron {
  padding-right: 15px;
  padding-left: 15px;
  border-radius: 6px;
}

@media screen and (min-width: 768px) {
  .jumbotron {
    padding-top: 48px;
    padding-bottom: 48px;
  }
  .jumbotron p {
    margin-bottom: 15px;
    font-size: 21px;
  }
}
.jumbotron {
  padding-top: 10px;
  padding-bottom: 5px;
  margin-bottom: 0px;
  background-color: #D4DEEC;
}


code {
  font-size: 80%;
}


/* Liststyle Formatierungen
-------------------------------------------------- */

.content .hpoint::before { font-family: "Font Awesome 5 Free"; font-weight: 600; content: "\f0c8"; color: #f0ad4e; margin-right: 15px; display: inline-block; }

.content ul { list-style-type: none; margin-left: 2.5em; padding-left: 0; margin-bottom: 15px; }
.content ul li { position: relative; margin-bottom: 5px; }
.content ul li:before {
  position: absolute;
  left: -2em;
  font-family: "Font Awesome 5 Free";
  font-weight: 600;
	content: "\f0c8";
  color: #f0ad4e;
  font-size: 0.8em;
  margin-top: 3px; /* Nur wenn font-size: 0.7em; */
}
.content ul ul { list-style-type: none; margin-left: 2em; padding-left: 0; margin-bottom: 15px; }
.content ul ul li { position: relative; margin-bottom: 5px; }
.content ul ul li:before {
  position: absolute;
  left: -2em;
  font-family: "Font Awesome 5 Free";
  font-weight: 500;
	content: "\f111";
  color: #f0ad4e;
  font-size: 0.8em;
  margin-top: 3px; /* Nur wenn font-size: 0.7em; */
}

/* Produktspezifischen Icon-Styles
-------------------------------------------------- */
.content .hpoint_telefon::before { font-family: "Font Awesome 5 Free"; font-weight: 600; content: "\f095"; color: #f0ad4e; margin-right: 10px; display: inline-block; }
.content .hpoint_email::before { font-family: "Font Awesome 5 Free"; font-weight: 500; content: "\f0e0"; color: #f0ad4e; margin-right: 10px; display: inline-block; }
.content .hpoint_klick::before { font-family: "Font Awesome 5 Free"; font-weight: 500; content: "\f245"; color: #f0ad4e; margin-right: 10px; display: inline-block; transform: scale(-1, 1); }

.content .hpoint_kurier::before { font-family: "Font Awesome 5 Free"; font-weight: 600; content: "\f48b"; color: #f0ad4e; margin-right: 15px; display: inline-block; }

.content .hpoint_direktfahrten::before { font-family: "Font Awesome 5 Free"; font-weight: 600; content: "\f018"; color: #f0ad4e; margin-right: 15px; display: inline-block; }
.content .hpoint_terminfahrten::before { font-family: "Font Awesome 5 Free"; font-weight: 600; content: "\f1da"; color: #f0ad4e; margin-right: 15px; display: inline-block; transform: scale(-1, 1); }
.content .hpoint_ausliefertouren::before { font-family: "Font Awesome 5 Free"; font-weight: 600; content: "\f472"; color: #f0ad4e; margin-right: 15px; display: inline-block; }

.content .hpoint_messe::before { font-family: "Font Awesome 5 Free"; font-weight: 600; content: "\f065"; color: #f0ad4e; margin-right: 15px; display: inline-block; }
.content .hpoint_events::before { font-family: "Font Awesome 5 Free"; font-weight: 500; content: "\f073"; color: #f0ad4e; margin-right: 15px; display: inline-block; }
.content .hpoint_pos::before { font-family: "Font Awesome 5 Free"; font-weight: 500; content: "\f192"; color: #f0ad4e; margin-right: 15px; display: inline-block; }

.content .hpoint_unternehmen::before { font-family: "Font Awesome 5 Free"; font-weight: 500; content: "\f2c2"; color: #f0ad4e; margin-right: 15px; display: inline-block; }
.content .hpoint_fahrzeugpool::before { font-family: "Font Awesome 5 Free"; font-weight: 600; content: "\f0d1"; color: #f0ad4e; margin-right: 15px; display: inline-block; }
.content .hpoint_referenzen::before { font-family: "Font Awesome 5 Free"; font-weight: 500; content: "\f007"; color: #f0ad4e; margin-right: 15px; display: inline-block; }
.content .hpoint_portfolioauszug::before { font-family: "Font Awesome 5 Free"; font-weight: 500; content: "\f03e"; color: #f0ad4e; margin-right: 15px; display: inline-block; }


/* Produkt Default
-------------------------------------------------- */

.products .caption {
  /*height: 150px;
  overflow: hidden;*/
}
.products .caption {
  /*padding: 5px 15px 0;*/
  padding: 5px 15px 15px;
}
.products .caption h4 {
  /* white-space: nowrap; bewirkt, dass die Zeile nicht Responsive umbricht */
  /*white-space: nowrap;*/
}
.products .thumbnail img {
  width: 100%;
}
.products .thumbnail {
  padding: 0;
}
.products .thumbnail .caption-full {
  padding: 9px;
  color: #333;
}
@media (max-width: 567px) {
  /* Container auf 100% Breite bringen */
  .products .divbox100 {
    width: 100%;
  }
}

@media (max-width: 400px) {
  /* Container auf 100% Breite bringen bei einer 4er Gallery */
  .products .divgall100 {
    width: 100%;
  }
}

.gallery .caption {
  padding: 5px 10px;
}


/* Thumbnail Box Default
-------------------------------------------------- */

.thumbnailbox .caption {
  /*height: 150px;
  overflow: hidden;*/
}
.thumbnailbox .caption {
  /*padding: 5px 15px 0;*/
  padding: 5px 15px 15px;
}
.thumbnailbox .caption h4 {
  white-space: nowrap;
}
.thumbnailbox .thumbnail img {
  width: 100%;
}
.thumbnailbox .thumbnail {
  padding: 0;
}
.thumbnailbox .thumbnail .caption-full {
  padding: 9px;
  color: #333;
}
@media (max-width: 567px) {
  /* Container auf 100% Breite bringen */
  .thumbnailbox .divbox100 {
    width: 100%;
  }
}


/* Bild-Hover Effekte mit purem CSS
-------------------------------------------------- */
/* Referenz: https://w3bits.com/css-image-hover-zoom
   Beispiele: https://w3bits.com/labs/css-image-hover-zoom  */
/* [1] Der Bild-Container Beispiel: <div class="imghover imghover--xyz"><img src="/path/to/image/" alt=""></div> */
/* [1.1] Höhe des Bild-Containers, je nach den jeweiligen Bedürfnissen */
/* [1.2] Durch "overflow: hidden;" für den Container vermeidet, dass das Bild bei der Transformation nach außen fließt.
   Referenz: https://developer.mozilla.org/en-US/docs/Web/CSS/overflow  */
/* [2] Übergangseigenschaft für die Transformation.
   Referenz: https://developer.mozilla.org/en-US/docs/Web/CSS/transition */
/* [3] Art der Tranformation, wenn Bild-Container hovered.
   Referenz: https://developer.mozilla.org/en-US/docs/Web/CSS/transform */

/* [1] Bild-Container */
.imghover {
  height: 100%;       /* [1.1] */
  overflow: hidden;   /* [1.2] */
}

/* [2] Übergangseigenschaft (Basic-Zoom) */
.imghover--basiczoom img {
  transition: transform 1s ease;
}
/* [3] Art der Tranformation (Basic-Zoom) */
.imghover--basiczoom:hover img {
  transform: scale(1.5);
}

/* [2] Übergangseigenschaft (Quick-Zoom) */
.imghover--quickzoom img {
  transform-origin: 0 0;
  transition: transform .25s, visibility .25s ease-in;
}
/* [3] Art der Tranformation (Quick-Zoom) */
.imghover--quickzoom:hover img {
  transform: scale(2);
}

/* [2] Übergangseigenschaft (Point-Zoom) */
.imghover--pointzoom img {
  transform-origin: 65% 75%;
  transition: transform 2s, filter .5s ease-out;
}
/* [3] Art der Tranformation (Point-Zoom) */
.imghover--pointzoom:hover img {
  transform: scale(5);
}

/* [2] Übergangseigenschaft (Rotations-Zoom) */
.imghover--rotatezoom img {
  transition: transform .5s ease-in-out;
}
/* [3] Art der Tranformation (Rotations-Zoom) */
.imghover--rotatezoom:hover img {
  transform: scale(2) rotate(25deg);
}

/* [2] Übergangseigenschaft (Slowmo Zoom) */
.imghover--slowmozoom img {
  transform-origin: 50% 65%;
  transition: transform 5s, filter 3s ease-in-out;
  filter: brightness(150%);
}
/* [3] Art der Tranformation (Slowmo-Zoom) */
.imghover--slowmozoom:hover img {
  filter: brightness(100%);
  transform: scale(3);
}

/* [2] Übergangseigenschaft (Brightness Zoom) */
.imghover--brightnesszoom img {
  transition: transform 2s, filter 1.5s ease-in-out;
  transform-origin: center center;
  filter: brightness(50%);
}
/* [3] Art der Tranformation (Brightness Zoom) */
.imghover--brightnesszoom:hover img {
  filter: brightness(100%);
  transform: scale(1.3);
}

/* [2] Übergangseigenschaft (Horizontal Zoom) */
.imghover--horizontalzoom img {
  transition: transform .5s ease-in-out;
  transform: scale(1.5);
  transform-origin: 100% 0;
}
/* [3] Art der Tranformation (Horizontal Zoom) */
.imghover--horizontalzoom:hover img {
  transform: scale(1.5) translateX(30%)
}

/* [2] Übergangseigenschaft (Vertical Zoom) */
.imghover--verticalzoom img {
  transition: transform .5s ease-in-out;
  transform: scale(1.4);
  transform-origin: 0 0;
}
/* [3] Art der Tranformation (Vertical Zoom) */
.imghover--verticalzoom:hover img {
  transform: scale(1.25) translateY(-20%);
}

/* [2] Übergangseigenschaft (Blur-out Zoom) */
.imghover--bluroutzoom img {
  transition: transform 1s, filter 2s ease-in-out;
  filter: blur(2px);
  transform: scale(1.2);
}
/* [3] Art der Tranformation (Blur-out Zoom) */
.imghover--bluroutzoom:hover img {
  filter: blur(0);
  transform: scale(1);
}


/* Panel Default
-------------------------------------------------- */

.panel-default {
  border-color: #ddd;
}
.panel-default > .panel-heading {
  color: #fff; /* Orig: #333333 */
  background-color: #77A0D3; /* Basisfarbe: 4C8BC7 (5) - Orig: #f5f5f5 */
  border-color: #ddd;
}
.panel-default > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #ddd;
}
.panel-default > .panel-heading .badge {
  color: #f5f5f5;
  background-color: #333333;
}
.panel-default > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #ddd;
}


/* Button Default
-------------------------------------------------- */

.btn-default {
  color: #333;
  background-color: #fff;
  border-color: #ccc;
}
.btn-default:focus,
.btn-default.focus {
  color: #333;
  background-color: #e6e6e6;
  border-color: #8c8c8c;
}
.btn-default:hover {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad;
}
.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
  color: #333;
  background-color: #e6e6e6;
  background-image: none;
  border-color: #adadad;
}
.btn-default:active:hover,
.btn-default.active:hover,
.open > .dropdown-toggle.btn-default:hover,
.btn-default:active:focus,
.btn-default.active:focus,
.open > .dropdown-toggle.btn-default:focus,
.btn-default:active.focus,
.btn-default.active.focus,
.open > .dropdown-toggle.btn-default.focus {
  color: #333;
  background-color: #d4d4d4;
  border-color: #8c8c8c;
}
.btn-default.disabled:hover,
.btn-default[disabled]:hover,
fieldset[disabled] .btn-default:hover,
.btn-default.disabled:focus,
.btn-default[disabled]:focus,
fieldset[disabled] .btn-default:focus,
.btn-default.disabled.focus,
.btn-default[disabled].focus,
fieldset[disabled] .btn-default.focus {
  background-color: #fff;
  border-color: #ccc;
}
.btn-default .badge {
  color: #fff;
  background-color: #333;
}


/* Button primary
-------------------------------------------------- */

.btn-primary {
  color: #fff;
  background-color: #337ab7;
  border-color: #2e6da4;
}
.btn-primary:focus,
.btn-primary.focus {
  color: #fff;
  background-color: #286090;
  border-color: #122b40;
}
.btn-primary:hover {
  color: #fff;
  background-color: #286090;
  border-color: #204d74;
}
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
  color: #fff;
  background-color: #286090;
  background-image: none;
  border-color: #204d74;
}
.btn-primary:active:hover,
.btn-primary.active:hover,
.open > .dropdown-toggle.btn-primary:hover,
.btn-primary:active:focus,
.btn-primary.active:focus,
.open > .dropdown-toggle.btn-primary:focus,
.btn-primary:active.focus,
.btn-primary.active.focus,
.open > .dropdown-toggle.btn-primary.focus {
  color: #fff;
  background-color: #204d74;
  border-color: #122b40;
}
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled.focus,
.btn-primary[disabled].focus,
fieldset[disabled] .btn-primary.focus {
  background-color: #337ab7;
  border-color: #2e6da4;
}
.btn-primary .badge {
  color: #337ab7;
  background-color: #fff;
}


/* -----------------------------------------------------------------------------
*  [ Kontakt Formular Seite ]
* ----------------------------------------------------------------------------*/

span.pflichtfeld { color: Red; }
span.hilfetext { color: #009500; }

input[type="text"] {
  height: 34px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
  -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
  -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
  -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
  transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
  transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
  transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
}

input[type="text"]:required,
input[type="checkbox"]:required,
input[type="email"]:required,
textarea:required,
select:required {
  background: #fffbf0;
  border: Solid 1px #7A7A7A;
}

input[type="text"]:valid,
input[type="checkbox"]:valid,
input[type="email"]:valid,
textarea:valid,
select:valid {
  background: #FFFFFF;
  border: Solid 1px #7A7A7A;
}

@media (max-width: 992px) {
  .sidebar-adress {
    display: none;
  }
}


/* -----------------------------------------------------------------------------
*  [ Sitefooter ]
* ----------------------------------------------------------------------------*/

.sitefooter {
  
}

.callbutton {
  margin: auto;
  width: 100%;
  height: 100%;
}


/* Bootstrap-Spalten auf die gleiche Höhe bringen
Quelle: https://www.it-swarm.dev/de/css/wie-kann-ich-bootstrap-spalten-auf-die-gleiche-hoehe-bringen/1043413444/ und https://www.codeply.com/go/bp/127827 */
.equal {
  display: flex;
  display: -webkit-flex;
  flex-wrap: wrap;
}

@media (min-width: 768px) {
  .row.equal {
    display: flex;
    flex-wrap: wrap;
  }
}
    
/* add this for full height column content 
.equal > div[class*='col-'] {  
  display: flex;
  flex-direction: column;
}
*/


/*--------------------------------------------------------------
# Footer Section
--------------------------------------------------------------*/

.footer > .container {
  padding-top: 15px;
  padding-right: 15px;
  padding-left: 15px;
}

.footer-contact i {
  padding-right: 2px;
  color: #0A467A;
  font-size: 15px;
  line-height: 1;
}

.footer-links i, .footer-links-last i {
  padding-right: 2px;
  color: #ec971f;
  font-size: 12px;
  line-height: 1;
}

@media (max-width: 767px) {
  .footer-adress, .footer-contact, .footer-links {
    display: block;
    margin: 0px 0 20px;
    border-bottom: 1px solid #9DB6DE;
  }
}

.webdesign {
  text-align: left;
  font-size: 85%;
  color: #6A6A6A;
}
.webdesign a {
  color: #6A6A6A;
}


/*--------------------------------------------------------------
# Back to top button
--------------------------------------------------------------*/

.back-to-top {
  position: fixed;
  display: none;
  right: 15px;
  bottom: 15px;
  z-index: 9999;
}
.back-to-top i {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 40px;
  width: 40px;
  height: 40px;
  border-radius: 4px;
  background: #f0ad4e;
  color: #fff;
  transition: all 0.4s;
}
.back-to-top i:hover {
  background: #4b8cc7;
  color: #fff;
}

