/* ===========================================

  1.  Basic
  2.  Grid 16 Prozent
  3.  Layout
  4.  Navigation
  5.  Footer
  6.  Logo / Kontakt
  7.  Abstände oben / unten
  7.	Spalten
  8.  Startseite
  9.  Unterseiten
  10. Überschriften
  11. Buttons
  12. Tabellen
  13. Accordions
  14. Listen
  15. Bilder
  16. Galerie
  17. Formulare
  18. Social
  19. Google Map
  20. News
  20. Blog
  21. Download
  22. Back to Top
  23. Sprachwechsler
  23. Isotope
  24. Slider Rocksolid
  25. Slider Contao
  25. Headerbild
  26. Animations
  27. Tabs

  Media Responsive

  @media only screen and (min-width:1100px) and (max-width: 1280px)
  @media only screen and (min-width:768px) and (max-width:1024px)
  @media only screen and (min-width:768px) and (max-width:830px)
  @media only screen and (max-width: 767px)
  @media only screen and (max-width: 600px)
  @media only screen and (max-width: 450px)
  @media only screen and (max-width: 384px)
  @media only screen and (max-width: 320px)


  ======================================== */


/* ===========================================
 * Schriften
 * ======================================== */


/* lora-regular - latin */

@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../../website/fonts/lora-v12-latin-regular.eot');
  /* IE9 Compat Modes */
  src: local('Lora Regular'), local('Lora-Regular'), url('../../website/fonts/lora-v12-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('../../website/fonts/lora-v12-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
  url('../../website/fonts/lora-v12-latin-regular.woff') format('woff'), /* Modern Browsers */
  url('../../website/fonts/lora-v12-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
  url('../../website/fonts/lora-v12-latin-regular.svg#Lora') format('svg');
  /* Legacy iOS */
}

/* lora-italic - latin */

@font-face {
  font-family: 'Lora';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('../../website/fonts/lora-v12-latin-italic.eot');
  /* IE9 Compat Modes */
  src: local('Lora Italic'), local('Lora-Italic'), url('../../website/fonts/lora-v12-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('../../website/fonts/lora-v12-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
  url('../../website/fonts/lora-v12-latin-italic.woff') format('woff'), /* Modern Browsers */
  url('../../website/fonts/lora-v12-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
  url('../../website/fonts/lora-v12-latin-italic.svg#Lora') format('svg');
  /* Legacy iOS */
}

/* lora-700 - latin */

@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../../website/fonts/lora-v12-latin-700.eot');
  /* IE9 Compat Modes */
  src: local('Lora Bold'), local('Lora-Bold'), url('../../website/fonts/lora-v12-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('../../website/fonts/lora-v12-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
  url('../../website/fonts/lora-v12-latin-700.woff') format('woff'), /* Modern Browsers */
  url('../../website/fonts/lora-v12-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
  url('../../website/fonts/lora-v12-latin-700.svg#Lora') format('svg');
  /* Legacy iOS */
}

/* lora-700italic - latin */

@font-face {
  font-family: 'Lora';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url('../../website/fonts/lora-v12-latin-700italic.eot');
  /* IE9 Compat Modes */
  src: local('Lora Bold Italic'), local('Lora-BoldItalic'), url('../../website/fonts/lora-v12-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('../../website/fonts/lora-v12-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
  url('../../website/fonts/lora-v12-latin-700italic.woff') format('woff'), /* Modern Browsers */
  url('../../website/fonts/lora-v12-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
  url('../../website/fonts/lora-v12-latin-700italic.svg#Lora') format('svg');
  /* Legacy iOS */
}

/* ===========================================
 * Basic
 * ======================================== */

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  background-repeat: no-repeat;
}
html {
  -webkit-text-size-adjust: none;
  overflow-y: scroll;
  -webkit-text-rendering: optimizelegibility;
}
body {
  background-color: #ffffff;
  font: 19px/1.5 'Lora', 'Lora', 'Droid Serif', sans-serif;
  font-weight: normal;
  color: #5d5d5d;
  font-weight: 300;
  overflow-x: hidden;
}
p, pre, blockquote, table, ol, ul, form {
  margin-bottom: 15px
}
section, figure {
  margin: 0;
  padding: 0
}
a {
  color: #000033;
  font-weight: 400;
}
a:hover {
  color: #000033
}
i {
  margin-right: 4px
}
ul li {
  list-style-type: none
}
p.back a, p.more a {
  padding: 10px 14px;
  background-color: #000033;
  text-decoration: none;
  color: #fff;
}
hr {
  border: 1px dotted #5d5d5d;
}
strong {
  font-weight: 700;
}

/* ===========================================
 * Grid 1% Zwischenabstand
 * ======================================== */

*[class*="grid"] {
  float: left;
  display: inline;
  margin-right: 1%;
  margin-left: 0%;
}

/**
 * Grid column widths
 */

.grid1 {
  width: 5.3125%
}
.grid2 {
  width: 11.625%
}
.grid3 {
  width: 17.9375%
}
.grid33 {
  width: 32.6667%
}
.grid4 {
  width: 24.25%
}
.grid5 {
  width: 30.5625%
}
.grid55 {
  width: 31.1%
}
.grid6 {
  width: 36.875%
}
.grid7 {
  width: 43.1875%
}
.grid8 {
  width: 49.5%
}
.grid9 {
  width: 55.1825%
}
.grid10 {
  width: 62.125%
}
.grid11 {
  width: 68.4375%
}
.grid12 {
  width: 74.75%
}
.grid13 {
  width: 81.0625%
}
.grid14 {
  width: 87.375%
}
.grid15 {
  width: 93.6875%
}
.grid16 {
  width: 100%;
  margin-right: 0%
}

/**
 * Grid column last
 */

*[class*="grid"].last {
  margin-right: 0%;
}

/* ===========================================
 * Grid 2% Zwischenabstand
 * ======================================== */

*[class*="grid02"] {
  float: left;
  display: inline;
  margin-right: 2%;
  margin-left: 0%;
}

/**
 * Grid column widths
 */

.grid02-1 {
  width: 4.375%
}
.grid02-2 {
  width: 10.75%
}
.grid02-3 {
  width: 17.125%
}
.grid02-33 {
  width: 32%
}
.grid02-4 {
  width: 23.5%
}
.grid02-5 {
  width: 29.875%
}
.grid02-6 {
  width: 36.25%
}
.grid02-7 {
  width: 42.625%
}
.grid02-8 {
  width: 49%
}
.grid02-9 {
  width: 55.375%
}
.grid02-10 {
  width: 61.75%
}
.grid02-11 {
  width: 68.125%
}
.grid02-12 {
  width: 74.5%
}
.grid02-13 {
  width: 80.875%
}
.grid02-14 {
  width: 87.25%
}
.grid02-15 {
  width: 93.625%
}
.grid02-16 {
  width: 100%;
  margin-right: 0%
}

/**
 * Grid column last
 */

*[class*="grid"].last {
  margin-right: 0%;
}

/* ===========================================
 * Grid 3% Zwischenabstand
 * ======================================== */

*[class*="grid03"] {
  float: left;
  display: inline;
  margin-right: 3%;
  margin-left: 0%;
}

/**
 * Grid column widths
 */

.grid03-1 {
  width: 3.4375%
}
.grid03-2 {
  width: 9.875%
}
.grid03-3 {
  width: 16.3125%
}
.grid03-33 {
  width: 31.33333%
}
.grid03-4 {
  width: 22.75%
}
.grid03-5 {
  width: 29.1875%
}
.grid03-55 {
  width: 17.6%
}
.grid03-6 {
  width: 35.625%
}
.grid03-7 {
  width: 42.0625%
}
.grid03-8 {
  width: 48.5%
}
.grid03-9 {
  width: 54.9375%
}
.grid03-10 {
  width: 61.375%
}
.grid03-11 {
  width: 67.8125%
}
.grid03-12 {
  width: 74.25%
}
.grid03-13 {
  width: 80.6875%
}
.grid03-14 {
  width: 87.125%
}
.grid03-15 {
  width: 93.5625%
}
.grid03-16 {
  width: 100%;
  margin-right: 0%
}

/**
 * Grid column last
 */

*[class*="grid"].last {
  margin-right: 0%;
}

/**
 * Default offset widths
 */

.offset1 {
  margin-left: 7.25% !important
}
.offset2 {
  margin-left: 13.5% !important
}
.offset3 {
  margin-left: 19.75% !important
}
.offset4 {
  margin-left: 26% !important
}
.offset5 {
  margin-left: 32.25% !important
}
.offset6 {
  margin-left: 38.5% !important
}
.offset7 {
  margin-left: 44.75% !important
}
.offset8 {
  margin-left: 51% !important
}
.offset9 {
  margin-left: 57.25% !important
}
.offset10 {
  margin-left: 63.5% !important
}
.offset11 {
  margin-left: 69.75% !important
}
.offset12 {
  margin-left: 76% !important
}
.offset13 {
  margin-left: 82.25% !important
}
.offset14 {
  margin-left: 88.5% !important
}
.offset15 {
  margin-left: 94.75% !important
}

/* ===========================================
 * Layout
 * ======================================== */

#wrapper {
  background-color: #ffffff
}
#header {
  position: relative;
  background-color: #ffffff;
}
.navi-section {
  width: 100%;
  position: relative;
  background-color: #000033;
  -webkit-transition: all 600ms ease-in-out;
  -moz-transition: all 600ms ease-in-out;
  transition: all 600ms ease-in-out;
  z-index: 9999 !important;
}
.navi-section .inside {
  width: 100%;
  overflow: visible;
  margin-right: auto;
  margin-left: auto;
  -webkit-transition: all 600ms ease-in-out;
  -moz-transition: all 600ms ease-in-out;
  transition: all 600ms ease-in-out;
  z-index: 999;
}
#afterheader, #afterheader02, #afterheader03 {
  display: block;
  margin: 0px 0 0;
  padding: 0;
  background-color: #EEEEF1;
  background-position: 100px 100%;
  background-repeat: no-repeat;
}
.unterseiten #afterheader {
  background-color: #fff8f0;
}
#afterheader .inside {
  margin-right: auto;
  margin-left: auto;
  max-width: 3000px;
}
#afterheader02 .inside {
  margin-right: auto;
  margin-left: auto;
  margin-top: 20px;
  max-width: 1140px;
}
#afterheader03 .inside {
  margin-right: auto;
  margin-left: auto;
  max-width: 1160px;
}
.unterseiten #afterheader .inside {
  margin-right: auto;
  margin-left: auto;
}
#container {
  max-width: 100%;
  margin-right: auto;
  margin-left: auto;
  padding-bottom: 0px;
  background-color: #ffffff;
}
.linke-spalte #container {
  max-width: 1160px;
}
.rechte-spalte #container {
  max-width: 1160px;
}
#main .inside {
  padding-left: 0;
  padding-right: 0;
  padding-top: 0px;
  padding-bottom: 30px;
}
.home #main .inside {
  padding-bottom: 0px;
}
#main .inside .mod_article .inside {
  max-width: 1160px;
  margin: 0 auto;
  padding: 45px 30px 40px 30px;
}
#left .inside {
  padding: 50px 20px 20px
}
#right .inside {
  padding: 55px 30px 20px
}
#footer {
  width: 100%;
  position: relative;
  display: block;
  background-color: #000033;
  color: #ffffff;
}
#footer .inside {
  max-width: 1160px;
  margin-right: auto;
  margin-left: auto;
  padding: 50px 30px;
}

/* ===========================================
 * Navigation
 * ======================================== */

.mod_quicknav.mobileselect {
  display: none
}
.dk_menu {
  display: none
}

/* Hauptnavigation */

#mainmenu {
  /*width:1080px;*/
  padding: 15px 10px 10px 0px;
  margin: 0 auto;
  text-align: center;
  /*font-family: "Lora",sans-serif;*/
}
#mainmenu ul {
  margin-bottom: 0;
  display: inline-block;
}
#mainmenu ul li {
  float: left;
  margin-right: 10px;
  text-align: left;
}
#mainmenu ul li.last {
  float: left;
  margin-right: 0;
}
#mainmenu .level_1 li:hover a {
  color: #ffffff;
}
#mainmenu ul li a, #mainmenu ul li strong {
  position: relative;
  float: none;
  display: block;
  padding: 3px 16px;
  font-size: 18px;
  text-transform: uppercase;
  line-height: 1.6;
  text-decoration: none;
  letter-spacing: 1px;
  -webkit-transition: All 0.25s ease;
  -moz-transition: All 0.25s ease;
  -o-transition: All 0.25s ease;
  -ms-transition: All 0.25s ease;
  transition: All 0.25s ease;
  z-index: 10;
}
#mainmenu ul li.submenu a:after, #mainmenu ul li.submenu strong:after {
  margin-left: 5px;
  font: 16px/1 FontAwesome;
  text-decoration: none;
  content: "\f107";
}
#mainmenu ul li ul li a:after, #mainmenu ul li ul li strong:after {
  display: none
}
#mainmenu ul li:hover a:after {
  height: 100%;
  z-index: -1
}
#mainmenu ul ul li a:after {
  display: none
}
#mainmenu a {
  text-decoration: none;
  color: #ffffff;
  font-weight: 400;
  -webkit-transition: All 0.25s ease;
  -moz-transition: All 0.25s ease;
  -o-transition: All 0.25s ease;
  -ms-transition: All 0.25s ease;
  transition: All 0.25s ease
}
#mainmenu a:hover {
  background-color: #1A1A47;
}
#mainmenu a.trail, #mainmenu strong.trail {
  background-color: #1A1A47;
}
#mainmenu ul li a:hover {
  color: #1A1A47;
}
#mainmenu ul li strong {
  color: #ffffff;
  font-weight: 400;
}
#mainmenu ul li a::before {
  width: 0%;
  height: 2px;
  left: 0;
  top: 0;
  position: absolute;
  margin-left: 12px;
  background-color: #1A1A47;
  content: "";
  -webkit-transition: All 0.55s ease;
  -moz-transition: All 0.55s ease;
  -o-transition: All 0.25s ease;
  -ms-transition: All 0.55s ease;
  transition: All 0.55s ease
}
#mainmenu ul ul li a:hover::before, #mainmenu ul ul li strong:before, #mainmenu ul ul li a.trail::before {
  display: none;
  content: ""
}
#mainmenu ul:after {
  clear: both;
  display: block;
  content: ""
}
#mainmenu ul ul li:after {
  display: none
}
#mainmenu ul ul {
  width: 300px;
  top: 60px;
  position: absolute;
  display: none;
  padding: 0;
  background-color: rgba(0, 0, 171, .95);
  -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, .3);
  box-shadow: 0 0 3px rgba(0, 0, 0, .3);
  behavior: url('assets/css3pie/1.0.0/PIE.htc');
  opacity: 0;
  -webkit-transition: All 0.55s ease;
  -moz-transition: All 0.55s ease;
  -o-transition: All 0.25s ease;
  -ms-transition: All 0.55s ease;
  transition: All 0.55s ease
}
#mainmenu ul li:hover>ul {
  top: auto;
  display: block;
  opacity: 1
}
#mainmenu ul ul li {
  width: 100%;
  border-bottom: 1px solid #FFFFFF;
}
#mainmenu ul ul li a {
  display: block;
  padding: 10px 14px;
  text-align: left;
  line-height: 1.5;
  text-transform: none;
  background: #1A1A47;
  font-size: 15px;
}
#mainmenu ul ul li a:hover {
  background-color: #000033;
}
#mainmenu ul ul strong, #mainmenu ul ul a.trail {
  display: block;
  padding: 10px 14px 10px 18px;
  font-size: 15px;
  line-height: 1.5;
  text-transform: none;
  letter-spacing: 1px;
  background: #1A1A47;
}
#mainmenu ul ul strong.first, #mainmenu ul ul li.first a.trail, #mainmenu ul ul li.first a:hover {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  behavior: url('assets/css3pie/1.0.0/PIE.htc')
}
#mainmenu ul ul ul {
  left: 100%;
  top: auto;
  position: absolute;
  margin-top: -41px;
  padding-top: 0
}
#mainmenu .active {
  background: #1A1A47;
  color: #ffffff;
}
#mainmenu ul ul .active {
  background: #000033;
  color: #ffffff;
}

/* Menu right */

#mainmenu ul li.last ul {
  right: 0
}

/* Menu right */

#mainmenu ul.level_1 li.submenu.last ul.level_2 {
  right: 0
}

/* Menu right */

#mainmenu>ul>li.submenu.last>ul>li.submenu>ul, #mainmenu>ul>li.submenu.last>ul>li.submenu>ul>li.submenu.last>ul {
  left: auto;
  right: 100%
}

/* Unternavigation links */

#submenu {
  margin-bottom: 20px;
  background-color: #000033;
}
#submenu h3 {
  padding-bottom: 10px;
  padding-left: 10px;
  border-bottom: 1px solid #000033;
  font-size: 1.2em;
  font-weight: 400
}
#submenu ul {
  margin-bottom: 0px;
}
#submenu li {
  /*margin-bottom:10px*/
  border-bottom: 1px solid #ffffff;
}
#submenu .level_1 a {
  display: block;
  color: #ffffff;
  margin-bottom: 0;
  padding: 10px 20px 10px 16px;
  line-height: 2;
  text-decoration: none;
  font-weight: 400;
  font-size: 16px;
  -webkit-transition: All 0.5s ease;
  -moz-transition: All 0.5s ease;
  -o-transition: All 0.5s ease;
  -ms-transition: All 0.5s ease;
  transition: All 0.5s ease
}
#submenu .level_1 a:hover {
  background-color: #000033;
}
#submenu .level_2 a {
  display: block;
  color: #ffffff;
  margin-bottom: 0;
  padding: 10px 10px 10px 35px;
  border: 0px solid #f4f4f4;
  line-height: 1;
  text-decoration: none;
  font-weight: 400;
  font-size: 16px;
  -webkit-transition: All 0.5s ease;
  -moz-transition: All 0.5s ease;
  -o-transition: All 0.5s ease;
  -ms-transition: All 0.5s ease;
  transition: All 0.5s ease;
  background-color: #7f99b0;
}
#submenu a:before {
  display: inline-block;
  padding-right: 6px;
  font: 12px/2 FontAwesome;
  text-decoration: none;
  color: #ffffff;
  content: "\f105"
}
#submenu strong:before, #submenu a:hover:before {
  display: inline-block;
  padding-right: 6px;
  font: 12px/2 FontAwesome;
  color: #ffffff;
  content: "\f105"
}
#submenu .level_1 a.active, #submenu .level_1 a:hover, #submenu .level_1 strong {
  display: block;
  margin-bottom: 0;
  padding: 10px 20px 10px 16px;
  background-color: #000033;
  /*border:1px solid #000033;*/
  line-height: 2;
  text-decoration: none;
  color: #ffffff;
  font-weight: 400;
  font-size: 16px;
}
#submenu .level_2 a.active, #submenu .level_2 a:hover, #submenu .level_2 strong {
  display: block;
  margin-bottom: 0;
  padding: 10px 10px 10px 25px;
  border: 0px solid #ffffff;
  font-size: 16px;
  line-height: 1;
  text-decoration: none;
  color: #ffffff;
  font-weight: 400;
}

/* Breadcrumb */

.mod_breadcrumb {
  float: left;
  display: block;
  margin-left: 1%;
  font-size: 11px;
  line-height: 38px
}
#main .mod_breadcrumb {
  float: none;
  display: block;
  margin-left: 0;
  font-size: 11px;
  line-height: 30px
}
.mod_breadcrumb ul li {
  float: left
}
.mod_breadcrumb ul li:before {
  margin-right: 6px;
  margin-left: 6px;
  font-family: FontAwesome;
  content: "\f105"
}
.mod_breadcrumb ul li.first:before {
  display: none
}
.mod_breadcrumb ul li a {
  text-decoration: none
}

/* Galerie Navigation */

#galeriemenu {
  margin-bottom: 30px;
}
#galeriemenu ul {
  margin-bottom: 0;
}
#galeriemenu ul li {
  float: left;
  margin-right: 10px;
}
#galeriemenu ul li.last {
  float: left;
  margin-right: 0;
}
#galeriemenu .level_1 li:hover a {
  color: #000033;
}
#galeriemenu ul li a, #galeriemenu ul li span {
  position: relative;
  float: none;
  display: block;
  padding: 3px 16px;
  font-size: 22px;
  line-height: 1.6;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 1px;
  -webkit-transition: All 0.25s ease;
  -moz-transition: All 0.25s ease;
  -o-transition: All 0.25s ease;
  -ms-transition: All 0.25s ease;
  transition: All 0.25s ease;
  z-index: 10;
}
#galeriemenu ul li.submenu a:after, #galeriemenu ul li.submenu span:after {
  margin-left: 5px;
  font: 12px/1 FontAwesome;
  text-decoration: none;
  content: "\f107";
}
#galeriemenu ul li ul li a:after, #galeriemenu ul li ul li span:after {
  display: none
}
#galeriemenu ul li:hover a:after {
  height: 100%;
  z-index: -1
}
#galeriemenu ul ul li a:after {
  display: none
}
#galeriemenu a {
  text-decoration: none;
  color: #000033;
  -webkit-transition: All 0.25s ease;
  -moz-transition: All 0.25s ease;
  -o-transition: All 0.25s ease;
  -ms-transition: All 0.25s ease;
  transition: All 0.25s ease
}
#galeriemenu a.trail {
  color: #ffffff;
  background-color: rgba(255, 255, 255, 0.1);
}
#galeriemenu ul li a:hover {
  color: #ffffff;
  background-color: rgba(255, 255, 255, 0.1);
}
#galeriemenu ul li span {
  color: #ffffff;
}
#galeriemenu ul li a::before {
  width: 0%;
  height: 2px;
  left: 0;
  top: 0;
  position: absolute;
  margin-left: 12px;
  background-color: #000033;
  content: "";
  -webkit-transition: All 0.55s ease;
  -moz-transition: All 0.55s ease;
  -o-transition: All 0.25s ease;
  -ms-transition: All 0.55s ease;
  transition: All 0.55s ease
}
#galeriemenu ul ul li a:hover::before, #galeriemenu ul ul li span:before, #galeriemenu ul ul li a.trail::before {
  display: none;
  content: ""
}
#galeriemenu ul:after {
  clear: both;
  display: block;
  content: ""
}
#galeriemenu ul ul li:after {
  display: none
}
#galeriemenu ul ul {
  width: 350px;
  top: 60px;
  position: absolute;
  display: none;
  padding: 0;
  background-color: rgba(0, 0, 171, .95);
  -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, .3);
  box-shadow: 0 0 3px rgba(0, 0, 0, .3);
  behavior: url('assets/css3pie/1.0.0/PIE.htc');
  opacity: 0;
  -webkit-transition: All 0.55s ease;
  -moz-transition: All 0.55s ease;
  -o-transition: All 0.25s ease;
  -ms-transition: All 0.55s ease;
  transition: All 0.55s ease
}
#galeriemenu ul li:hover>ul {
  top: auto;
  display: block;
  opacity: 1
}
#galeriemenu ul ul li {
  width: 100%;
  border-bottom: 1px solid #FFFFFF;
}
#galeriemenu ul ul li a {
  display: block;
  padding: 10px 14px;
  text-align: left;
  line-height: 1.5;
  text-transform: none;
  text-transform: uppercase;
  background: #000033 !important;
  font-size: 15px;
}
#galeriemenu ul ul span, #galeriemenu ul ul a.trail, #galeriemenu ul ul li a:hover {
  display: block;
  padding: 10px 14px 10px 18px;
  font-size: 15px;
  line-height: 1.5;
  text-transform: none;
  letter-spacing: 1px;
  text-transform: uppercase;
  background: #000033 !important;
}
#galeriemenu ul ul span.first, #galeriemenu ul ul li.first a.trail, #galeriemenu ul ul li.first a:hover {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  behavior: url('assets/css3pie/1.0.0/PIE.htc')
}
#galeriemenu ul ul ul {
  left: 100%;
  top: auto;
  position: absolute;
  margin-top: -41px;
  padding-top: 0
}
#galeriemenu .active {
  background: #000033 !important
}

/* Menu right */

#galeriemenu ul li.last ul {
  right: 0
}

/* Menu right */

#galeriemenu ul.level_1 li.submenu.last ul.level_2 {
  right: 0
}

/* Menu right */

#galeriemenu>ul>li.submenu.last>ul>li.submenu>ul, #galeriemenu>ul>li.submenu.last>ul>li.submenu>ul>li.submenu.last>ul {
  left: auto;
  right: 100%
}

/* ===========================================
 * Scroll-to fix Navigation
 * ======================================== */

.nav--slide_in.nav--is-fixed {
  left: 0;
  top: 0;
  -webkit-transition: all 600ms ease-in-out;
  -moz-transition: all 600ms ease-in-out;
  transition: all 600ms ease-in-out;
  position: fixed !important;
}

/*.nav--slide_in.nav--is-fixed{
  left:0;
  top:0;
  background-color:rgba(255,255,255,1);
  -webkit-box-shadow:0 2px 2px rgba(0,0,0,0.2);
  box-shadow:0 2px 2px rgba(0,0,0,0.2);behavior:url('assets/css3pie/1.0.0/PIE.htc');
  -webkit-animation: slide_in 1.3s;
  -moz-animation: slide_in .3s;
  -o-animation: slide_in .3s;
  animation: slide_in 1.3s;
  }

.nav--slide_in.nav--is-fixed .inside{
  padding-top:25spx;
  padding-bottom:25spx;
  -webkit-transition: all 600ms ease-in-out;
  -moz-transition: all 600ms ease-in-out;
  transition: all 600ms ease-in-out;
  background-color: #000033;
  }

.nav--slide_in.nav--fade-out{
  webkit-animation: slide_out 1.3s;
  -moz-animation: fade_out .3s;
  -o-animation: fade_out .3s;
  animation: slide_out 1.3s;
  top: 0px;
  }	*/


/* ===========================================
 * Footer
 * ======================================== */

#footer .inside {
  color: #ffffff
}
#footer .inside h4 {
  padding-bottom: 16px;
  margin-bottom: 24px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  font-size: 22px;
  color: #ffffff
}
#footer .inside a {
  text-decoration: none;
  color: #ffffff
}
#footer .inside a:hover {
  text-decoration: underline
}
#footer .inside .footermenu {
  margin-top: 30px;
  padding-top: 12px;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  font-size: 12px;
}
#footer .inside .newsletter.button02 p a {
  background-color: #ccca15;
  border: 1px solid #ccca15;
  margin-top: 10px;
}

/* ===========================================
 * Header - Logo / Kontakt
 * ======================================== */


/* Header oben01 */

#logo {
  background-image: url("../../website/layout/logo-horn-und-engel.png");
  background-position: left center;
  background-repeat: no-repeat;
  background-size: contain;
  margin: 30px 0 30px 20px;
  height: 100px;
  width: 400px;
  float: left;
}
#logo a {
  width: 100%;
  height: 100%;
  display: block;
}
.wrapper-logo-contact {
  margin-left: auto;
  margin-right: auto;
}
.fa-phone::before {
  content: "\f095";
}
.fa-envelope::before {
  content: "\f0e0";
}
.kontaktdaten_oben {
  float: right;
  padding: 40px 5.5% 40px 10px;
}
.kontaktdaten_oben p {
  margin-bottom: 3px;
}
.kontaktdaten_oben .tel a, .kontaktdaten_oben .email a {
  text-decoration: none;
  font-size: 18px;
  color: #000033;
  font-family: "Lora", sans-serif;
}
.kontaktdaten_oben .tel::before {
  font: 25px FontAwesome;
  margin-right: 6px;
  color: #000033;
}
.kontaktdaten_oben .email::before {
  font: 18px FontAwesome;
  margin-right: 6px;
  color: #000033;
}

/* Header oben02*/

.wrapper-logo-contact02 {
  margin-left: auto;
  margin-right: auto;
  max-width: 1140px;
}
.kontaktdaten_oben02 {
  float: right;
  padding: 15px 0% 10px 0px;
  color: #000033;
  width: 100%;
  max-width: 390px;
  margin-right: 20px;
}
.kontaktbox {
  max-width: 420px;
}
.kontaktbox-mobile {
  display: none;
}
.kontaktdaten_oben02 .fa-envelope, .kontaktdaten_oben02 .fa-phone {
  display: inline-block;
  font: 16px/1.46 "Lora", "Lora", "Droid Serif", sans-serif;
  font-weight: 300;
  font-feature-settings: normal;
  font-kerning: auto;
  font-language-override: normal;
  font-size: 16px;
  font-size-adjust: none;
  font-stretch: normal;
  font-style: normal;
  font-synthesis: weight style;
  font-variant: normal;
  font-weight: normal;
  line-height: 1;
  text-rendering: auto;
  transition: all 0.3s ease 0s;
  color: #5d5d5d;
  text-decoration: none;
}
.kontaktdaten_oben02 a.tel::before, .kontaktdaten_oben02 a.email::before {
  font-family: FontAwesome;
  margin-right: 10px;
}

/* Kontakt mobile oben */

.kontaktbox-mobile {
  text-align: center;
  margin-bottom: 40px;
  color: #000033;
}
.kontaktbox-mobile .tel:before {
  margin-right: 6px;
  font-family: FontAwesome;
  content: "\f095";
}
.kontaktbox-mobile .tel span.type {
  display: none;
}
.kontaktbox-mobile .phonefax {
  margin-top: 0px;
}
.kontaktbox-mobile .tel.fax:before {
  margin-right: 6px;
  font-family: FontAwesome;
  content: "\f1ac";
}
.kontaktbox-mobile .tel.mobil:before {
  width: 14px;
  display: inline-block;
  margin-right: 6px;
  text-align: center;
  font-family: FontAwesome;
  content: "\f10b";
}
.kontaktbox-mobile .email:before {
  margin-right: 6px;
  font-family: FontAwesome;
  content: "\f0e0";
}
.kontaktbox-mobile a {
  font-weight: 300;
  text-decoration: none;
}
.kontaktbox-mobile .zeit:before {
  margin-right: 6px;
  font-family: FontAwesome;
  content: "\f017";
}

/* Kontakt unten */

.kontaktdaten_unten .org {
  font-size: 17px;
}
.kontaktdaten_unten .vcard div {
  margin-right: 0;
  margin-left: 0;
}
.kontaktdaten_unten .tel:before {
  margin-right: 6px;
  font-family: FontAwesome;
  content: "\f095";
}
.kontaktdaten_unten .tel span.type {
  display: none;
}
.kontaktdaten_unten .phonefax {
  margin-top: 30px;
  margin-bottom: 30px;
}
.kontaktdaten_unten .tel.fax:before {
  margin-right: 6px;
  font-family: FontAwesome;
  content: "\f1ac";
}
.kontaktdaten_unten .tel.mobil:before {
  width: 14px;
  display: inline-block;
  margin-right: 6px;
  text-align: center;
  font-family: FontAwesome;
  content: "\f10b";
}
.kontaktdaten_unten a.email:before {
  margin-right: 6px;
  font-family: FontAwesome;
  content: "\f0e0";
}
.kontaktdaten_unten .zeit:before {
  margin-right: 6px;
  font-family: FontAwesome;
  content: "\f017";
}
.kontaktdaten_unten .footer-anfahrt {
  margin-bottom: 30px;
}

/* ===========================================
 * Abstände / Hilfreiche Klassen
 * ======================================== */

.desktop_nein {
  display: none
}
.mobile_nein {
  display: none
}
.clear, #clear {
  clear: both;
}
.center {
  text-align: center;
}
.left {
  text-align: left;
}
.float-left {
  float: left;
}
.float-right {
  float: right;
}
.rund img {
  border-radius: 100%;
}
.top10 {
  margin-top: 10px;
}
.bottom10 {
  margin-bottom: 10px;
}
.top15 {
  margin-top: 15px;
}
.bottom15 {
  margin-bottom: 15px;
}
.top20 {
  margin-top: 20px;
}
.bottom20 {
  margin-bottom: 20px;
}
.top30 {
  margin-top: 30px;
}
.bottom30 {
  margin-bottom: 30px;
}
.top35 {
  margin-top: 35px;
}
.bottom35 {
  margin-bottom: 35px;
}
.top40 {
  margin-top: 40px;
}
.bottom40 {
  margin-bottom: 40px;
}
.spruch01 {
  color: #000033;
  font: 40px/1 "Tangerine", sans-serif;
  font-style: italic;
  padding-top: 7%;
  font-weight: 500;
}
.spruch02 {
  color: #000033;
  font: 50px/1 "Tangerine", sans-serif;
  font-style: italic;
  padding-top: 7%;
  font-weight: 500;
}
.spruch03 {
  color: #000033;
  font: 60px/1 "Tangerine", sans-serif;
  font-style: italic;
  padding-top: 7%;
  font-weight: 500;
}
.spalte2 {
  -webkit-column-count: 2;
  /* Chrome, Safari, Opera */
  -moz-column-count: 2;
  /* Firefox */
  column-count: 2;
  -webkit-column-gap: 40px;
  /* Chrome, Safari, Opera */
  -moz-column-gap: 40px;
  /* Firefox */
  column-gap: 40px;
}
.spalte3 {
  -webkit-column-count: 3;
  /* Chrome, Safari, Opera */
  -moz-column-count: 3;
  /* Firefox */
  column-count: 3;
  -webkit-column-gap: 40px;
  /* Chrome, Safari, Opera */
  -moz-column-gap: 40px;
  /* Firefox */
  column-gap: 40px;
}

/* ===========================================
 * Startseite
 * ======================================== */


/* Segment01 mit Text */

.mod_article.segment01 {
  background-color: #ffffff;
  color: #5d5d5d;
  text-align: center;
}
#main .inside .mod_article.segment01 .inside {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  padding: 60px 30px 40px 30px;
}
.mod_article.segment01 h1 {
  color: #000033;
}
.mod_article.segment01 h2 {
  color: #000033;
}
.mod_article.segment01 h3 {
  color: #000033;
}
.mod_article.segment01 h1.celine::after, .mod_article.segment01 .celine h1:after, .mod_article.segment01 h2.celine::after, .mod_article.segment01 .celine h2:after {
  border-bottom: 3px solid #000033;
}
.mod_article.segment01 .image_container.float_left {
  margin-top: 8px;
  margin-bottom: 30px;
  margin-right: 3%;
}
.mod_article.segment01 .image_container.float_right {
  margin-top: 8px;
  margin-bottom: 30px;
  margin-left: 3%;
}

/* Segment02 Text u. Bild links */

.mod_article.segment02 {
  background-color: #5d5d5d;
  color: #ffffff;
  text-align: center;
}
#main .inside .mod_article.segment02 .inside {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  padding: 60px 30px 40px 30px;
}
.mod_article.segment02 h1 {
  color: #ffffff;
}
.mod_article.segment02 h2 {
  color: #ffffff;
}
.mod_article.segment02 h3 {
  color: #ffffff;
}
.mod_article.segment02 h1.celine::after, .mod_article.segment02 .celine h1:after, .mod_article.segment02 h2.celine::after, .mod_article.segment02 .celine h2:after {
  border-bottom: 3px solid #ffffff;
}

/* Segment03 Text u. Bild rechts */

.mod_article.segment03 {
  background-color: #000033;
  color: #ffffff;
  text-align: center;
}
#main .inside .mod_article.segment03 .inside {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  padding: 60px 30px 40px 30px;
}
.mod_article.segment03 h1 {
  color: #ffffff;
}
.mod_article.segment03 h2 {
  color: #ffffff;
}
.mod_article.segment03 h3 {
  color: #ffffff;
}
.mod_article.segment03 h1.celine::after, .mod_article.segment03 .celine h1:after, .mod_article.segment03 h2.celine::after, .mod_article.segment03 .celine h2:after {
  border-bottom: 3px solid #ffffff;
}

/* Segment04 Teaserboxen mit Bild*/

.mod_article.segment04 {
  background-color: #000033;
  background-position: 100px 0%;
  background-repeat: repeat;
  color: #ffffff;
  text-align: center;
}
#main .inside .mod_article.segment04 .inside {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  padding: 60px 30px 40px 30px;
}
.mod_article.segment04 h2 {
  font: 38px/1.0 'Lora', sans-serif;
  padding-bottom: 20px;
  text-align: center;
  color: #ffffff;
}
.mod_article.segment04 h3 {
  font-size: 28px;
  padding: 20px 20px 10px 10px;
  text-align: center;
  text-transform: none;
  font-weight: 500;
  font-family: "Lora", sans-serif;
  color: #ffffff;
}
.mod_article.segment04 h1.celine::after, .mod_article.segment04 .celine h1:after {
  border-bottom: 3px solid #ffffff;
}
.mod_article.segment04 .intro p {
  font-size: 22px;
  line-height: 1.6;
  padding-bottom: 30px;
}

/* Segment05 mit Text - einfache Überschrift */

.mod_article.segment05 {
  background-color: #ffffff;
  color: #5d5d5d;
  text-align: center;
}
#main .inside .mod_article.segment05 .inside {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  padding: 60px 30px 40px 30px;
}
.mod_article.segment05 h2 {
  font: 18px/1.0 'Lora', sans-serif;
  font-size: 38px;
  padding-bottom: 20px;
  text-align: center;
  color: #000033;
}
.mod_article.segment05 h3 {
  color: #000033;
}
.mod_article.segment05 .image_container.float_left {
  margin-top: 8px;
  margin-bottom: 30px;
  margin-right: 3%;
}
.mod_article.segment05 .image_container.float_right {
  margin-top: 8px;
  margin-bottom: 30px;
  margin-left: 3%;
}

/* Segment06 mit Text linksbündig / Bild rechts - 2 Überschriften */

.mod_article.segment06 {
  background-color: #ffffff;
  color: #5d5d5d;
}
#main .inside .mod_article.segment06 .inside {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  padding: 60px 30px 40px 30px;
}
.mod_article.segment06 h2 {
  font: 18px/1.0 'Lora', sans-serif;
  font-size: 28px;
  padding-bottom: 12px;
  color: #000033;
}
.mod_article.segment06 h3 {
  color: #000033;
  font-size: 38px;
  margin-bottom: 20px;
}
.mod_article.segment06 .image_container.float_left {
  margin-top: 0px;
  margin-bottom: 30px;
  margin-right: 6%;
}
.mod_article.segment06 .image_container.float_right {
  margin-top: 0px;
  margin-bottom: 30px;
  margin-left: 6%;
}
.mod_article.segment06 .button02 p {
  margin-top: 10px;
}

/* Segment07 mit Text linksbündig / Bild links - 2 Überschriften */

.mod_article.segment07 {
  background-color: #ffffff;
  color: #5d5d5d;
}
#main .inside .mod_article.segment07 .inside {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  padding: 60px 30px 40px 30px;
}
.mod_article.segment07 h2 {
  font: 18px/1.0 'Lora', sans-serif;
  font-size: 24px;
  padding-bottom: 5px;
  text-transform: uppercase;
  color: #000033;
}
.mod_article.segment07 h3 {
  color: #000033;
  font-size: 38px;
  margin-bottom: 20px;
}
.mod_article.segment07 .image_container.float_left {
  margin-top: 70px;
  margin-bottom: 30px;
  margin-right: 6%;
}
.mod_article.segment07 .image_container.float_right {
  margin-top: 70px;
  margin-bottom: 30px;
  margin-left: 6%;
}
.mod_article.segment07 .button02 p {
  margin-top: 10px;
}

/* Segment08 mit Textzeile u. Button */

.mod_article.segment08 {
  background-color: #1DA1F6;
  color: #ffffff;
}
#main .inside .mod_article.segment08 .inside {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  padding: 30px 30px 20px 30px;
}
.mod_article.segment08 h2 {
  font: 38px/1.0 'Lora', sans-serif;
  padding-bottom: 5px;
  text-transform: uppercase;
  color: #5d5d5d;
  text-align: center;
}
.mod_article.segment08 p {
  font: 20px/1.6 "Lora", sans-serif;
  font-style: italic;
  font-weight: 300;
}
.mod_article.segment08 a {
  background-color: #000033;
  border: 1px solid #ffffff;
}
.mod_article.segment08 a:hover {
  background-color: #1A1A47;
  border: 1px solid #ffffff;
}

/* Segment09  Kompetenzen */

.mod_article.segment09 {
  background-color: #000033;
  color: #ffffff;
}
#main .inside .mod_article.segment09 .inside {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  padding: 20px 30px 5px 30px;
}
.mod_article.segment09 h2 {
  font: 22px/1.0 'Lora', sans-serif;
  padding-top: 5px;
  color: #ffffff;
  text-align: center;
}
.mod_article.segment09 p {
  font: 20px/1.6 "Lora", sans-serif;
  font-weight: 300;
}
.mod_article.segment09 a {
  background-color: #000033;
  border: 1px solid #ffffff;
  color: #ffffff;
}
.mod_article.segment09 a:hover {
  background-color: #1A1A47;
  border: 1px solid #ffffff;
}

/* Segment10 Contaoslider*/

.mod_article.segment10 {
  background-color: #000033;
  color: #ffffff;
}
#main .inside .mod_article.segment10 .inside {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  padding: 60px 30px 40px 30px;
}
.mod_article.segment10 h2 {
  font: 38px/1 "Lora", sans-serif;
  padding-bottom: 40px;
  color: #ffffff;
  text-align: center;
}
.mod_article.segment10 h3 {
  font: 22px/1 "Lora", sans-serif;
  color: #ffffff;
}
.mod_article.segment10 h4 {
  font: 25px/1 "Lora", sans-serif;
}
.mod_article.segment10 p {}

/* Segment11 Vorteile */

.mod_article.segment11 {
  background-color: #ffffff;
  color: #5d5d5d;
}
#main .inside .mod_article.segment11 .inside {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  padding: 60px 30px 10px 30px;
}
.mod_article.segment11 h2 {
  font: 18px/1.0 'Lora', sans-serif;
  font-size: 38px;
  padding-bottom: 5px;
  text-transform: uppercase;
  color: #5d5d5d;
  text-align: center;
  padding-bottom: 20px;
}
.mod_article.segment11 h3 {
  color: #000033;
  font-size: 26px;
}
.mod_article.segment11 .ce_text {
  margin-bottom: 30px;
}

/* Segment12 Tabelle */

.mod_article.segment12 {
  background-color: #ffffff;
  color: #5d5d5d;
  text-align: center;
}
#main .inside .mod_article.segment12 .inside {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  padding: 60px 30px 40px 30px;
}
.mod_article.segment12 h2 {
  font: 18px/1.0 'Lora', sans-serif;
  font-size: 38px;
  padding-bottom: 20px;
  text-align: center;
  color: #000033;
}

/* Segment13 FAQ */

.mod_article.segment13 {
  background-color: #ffffff;
  color: #5d5d5d;
}
#main .inside .mod_article.segment13 .inside {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  padding: 60px 30px 40px 30px;
}
.mod_article.segment13 h2 {
  font: 18px/1.0 'Lora', sans-serif;
  font-size: 38px;
  padding-bottom: 20px;
  text-align: center;
  color: #000033;
}

/* Segment14 mit Textzeile u. Telefonnummer */

.mod_article.segment14 {
  background-color: #000033;
  color: #ffffff;
}
#main .inside .mod_article.segment14 .inside {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  padding: 30px 30px 20px 30px;
}
.mod_article.segment14 h2 {
  font: 38px/1.0 'Lora', sans-serif;
  padding-bottom: 5px;
  text-transform: uppercase;
  color: #5d5d5d;
  text-align: center;
}
.mod_article.segment14 p {
  font: 20px/1.6 "Lora", sans-serif;
  font-style: italic;
  font-weight: 300;
}
.mod_article.segment14 .tel:before {
  margin-right: 12px;
  font-family: FontAwesome;
  content: "\f095";
  font-size: 40px;
}
.mod_article.segment14 a {
  font-style: italic;
  background-color: #000033;
  border: 1px solid #ffffff;
}
.mod_article.segment14 a:hover {
  background-color: #7B1517;
  border: 1px solid #ffffff;
}

/* Segment15 Teaserboxen mit Icon */

.mod_article.segment15 {
  background-color: #000033;
  background-position: 100px 0%;
  background-repeat: repeat;
  color: #ffffff;
  text-align: center;
}
#main .inside .mod_article.segment15 .inside {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  padding: 60px 30px 40px 30px;
}
.mod_article.segment15 h2 {
  font: 38px/1.0 'Lora', sans-serif;
  padding-bottom: 20px;
  text-align: center;
  color: #ffffff;
}
.mod_article.segment15 h3 {
  font-size: 28px;
  padding: 20px 20px 10px 10px;
  text-align: center;
  text-transform: none;
  font-weight: 500;
  font-family: "Lora", sans-serif;
  color: #ffffff;
}
.mod_article.segment15 h1.celine::after, .mod_article.segment15 .celine h1:after {
  border-bottom: 3px solid #ffffff;
}
.mod_article.segment15 .intro p {
  font-size: 22px;
  line-height: 1.6;
  padding-bottom: 30px;
}
.mod_article.segment15 .fa-contao, .mod_article.segment15 .fa-briefcase, .mod_article.segment15 .fa-adjust, .mod_article.segment15 .fa-book {
  display: inline-block;
  font-family: FontAwesome;
  font-feature-settings: normal;
  font-kerning: auto;
  font-language-override: normal;
  font-size: 60px;
  font-size-adjust: none;
  font-stretch: normal;
  font-style: normal;
  font-synthesis: weight style;
  font-variant: normal;
  font-weight: normal;
  line-height: 1;
  text-rendering: auto;
  transition: all 0.3s ease 0s;
  color: #00a5cb;
}
.mod_article.segment15 i {
  margin-left: 8px;
}

/* Segment16 Teaserboxen02 mit Bild*/

.mod_article.segment16 {
  background-color: #EEEEF1;
  background-position: 100px 0%;
  background-repeat: repeat;
  color: #ffffff;
}
#main .inside .mod_article.segment16 .inside {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  padding: 60px 30px 60px 30px;
}
.mod_article.segment16 h2 {
  font: 28px/1.0 'Lora', sans-serif;
  padding-bottom: 20px;
  text-align: center;
  color: #000033;
}
.mod_article.segment16 h3 {
  font-size: 18px;
  padding: 30px 20px 10px 10px;
  text-align: center;
  text-transform: none;
  font-weight: 400;
  font-family: "Montserrrat", sans-serif;
  color: #000033;
}
.mod_article.segment16 h1.celine::after, .mod_article.segment16 .celine h1:after {
  border-bottom: 3px solid #ffffff;
}
.mod_article.segment16 .intro p {
  font-size: 20px;
  line-height: 1.6;
  padding-bottom: 30px;
}
.mod_article.segment16 .image_container {
  margin: 0px;
}
.mod_article.segment16 .teaserbox h3 {
  font-size: 23px;
  padding: 30px 20px 10px 10px;
  text-align: center;
  text-transform: none;
  font-weight: 400;
  font-family: "Lora", sans-serif;
  color: #ffffff;
}
.mod_article.segment16 .ce_text.teaserbox {
  background-color: #000033;
  color: #ffffff;
  padding-bottom: 20px;
}
.mod_article.segment16 .ce_text.teaserbox p {
  padding: 0 24px 0 24px;
}
.mod_article.segment16 .ce_text.teaserbox ul {
  padding-left: 33%;
  text-align: left;
}
.mod_article.segment16 .button03.teaserbox p a {
  background-color: #000033;
  border: 1px solid #ffffff;
  text-decoration: none;
  color: #ffffff;
  font-style: normal;
  margin-top: 10px;
  font-size: 17px;
}
.mod_article.segment16 .button03.teaserbox p a:hover {
  background-color: #1A1A47;
  border: 1px solid #ffffff;
  text-decoration: none;
  color: #ffffff;
}
.mod_article.segment16 .button03 p a {
  background-color: #ffffff;
  border: 1px solid #000033;
  text-decoration: none;
  color: #000033;
  font-style: normal;
  margin-top: 10px;
  font-size: 18px;
}
.mod_article.segment16 .button03 p a:hover {
  background-color: #1A1A47;
  border: 1px solid #ffffff;
  text-decoration: none;
  color: #ffffff;
}

/* Segment18 Spruch */

.mod_article.segment18 {
  background-color: #000033;
  color: #ffffff;
  text-align: center;
}
#main .inside .mod_article.segment18 .inside {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  padding: 60px 30px 40px 30px;
}
.mod_article.segment18 p {
  font: 30px/1.6 'Lora', sans-serif;
  font-style: italic;
  text-align: center;
  font-weight: 500;
}

/* Segment19 Intro */

.mod_article.segment19 {
  background-color: #ffffff;
  background-position: 100px 0%;
  background-repeat: repeat;
  color: #5d5d5d;
  text-align: center;
}
#main .inside .mod_article.segment19 .inside {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  padding: 60px 30px 40px 30px;
}
.mod_article.segment19 h2 {
  font: 22px/1.0 'Lora', sans-serif;
  padding-bottom: 20px;
  text-align: center;
  color: #000033;
  margin-top: 15px;
}
.mod_article.segment19 h3 {
  font-size: 22px;
  padding: 20px 0px 10px 0px;
  text-align: center;
  text-transform: none;
  font-weight: 500;
  font-family: "Lora", sans-serif;
  color: #ffffff;
}
.mod_article.segment19 h2.celine::after, .mod_article.segment19 .celine h2:after {
  border-bottom: 3px solid #000033;
}
.mod_article.segment19 .intro p {
  font-size: 19px;
  line-height: 1.5;
}
.mod_article.segment19 p {
  font-size: 18px;
}
.mod_article.segment19 .button03 {
  margin-top: 20px;
}
.mod_article.segment19 .button03 p a {
  border: 1px solid #000033;
  text-decoration: none;
  color: #000033;
}
.mod_article.segment19 .button03 p a:hover {
  background-color: #1A1A47;
  border: 1px solid #000033;
  text-decoration: none;
  color: #ffffff;
}

/* Segment20 3 Icons mit Text quer*/

.mod_article.segment20 {
  background-color: #000033;
  color: #ffffff;
}
#main .inside .mod_article.segment20 .inside {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  padding: 30px 30px 20px 30px;
}
.mod_article.segment20 h2 {
  font: 38px/1.0 'Lora', sans-serif;
  padding-bottom: 5px;
  text-transform: uppercase;
  color: #5d5d5d;
  text-align: center;
}
.mod_article.segment20 p {
  font: 20px/1.6 "Lora", sans-serif;
  font-style: italic;
  font-weight: 300;
  float: right;
}
.mod_article.segment20 a {
  font-style: italic;
  background-color: #000033;
  border: 1px solid #ffffff;
}
.mod_article.segment20 a:hover {
  background-color: #7B1517;
  border: 1px solid #ffffff;
}
.mod_article.segment20 .fa-envelope, .mod_article.segment20 .fa-map-marker, .mod_article.segment20 .fa-phone {
  display: inline-block;
  font-family: FontAwesome;
  font-feature-settings: normal;
  font-kerning: auto;
  font-language-override: normal;
  font-size: 60px;
  font-size-adjust: none;
  font-stretch: normal;
  font-style: normal;
  font-synthesis: weight style;
  font-variant: normal;
  font-weight: normal;
  line-height: 1;
  text-rendering: auto;
  transition: all 0.3s ease 0s;
  color: #00a5cb;
}
.mod_article.segment20 .inline {
  display: inline-block;
}

/* Segment21 3 Galerie volle Breite*/

#main .inside .mod_article.segment21 .inside {
  max-width: 100%;
  padding: 0px;
}
.mod_article.segment21 .ce_gallery {
  margin-bottom: 0px;
}
.mod_article.segment21 .ce_gallery ul li {
  margin-bottom: 0%;
}
.mod_article.segment21 .ce_gallery ul.cols_1 li {
  margin-bottom: 0%;
}
.mod_article.segment21 .ce_gallery ul.cols_2 li {
  width: 50%;
  margin-right: 0%;
  margin-left: 0%;
}
.mod_article.segment21 .ce_gallery ul.cols_3 li {
  width: 33.33%;
  margin-right: 0%;
  margin-left: 0%;
}
.mod_article.segment21 .ce_gallery ul.cols_4 li {
  width: 25%;
  margin-right: 0%;
  margin-left: 0%;
}
.mod_article.segment21 .ce_gallery ul.cols_5 li {
  width: 20%;
  margin-right: 0%;
  margin-left: 0%;
}

/* Segment22 News*/

.mod_article.segment22 h2.blog-ueberschrift {
  font: 38px/1.0 'Lora', sans-serif;
  padding-bottom: 20px;
  text-align: center;
  color: #000033;
}
.mod_article.segment22 .mod_newslist .layout_latest {
  border-bottom: 0px;
}
.mod_article.segment22 .mod_newslist h2 {
  font-size: 26px;
}

/* ===========================================
 * Unterseiten
 * ======================================== */

#cboxCurrent {
  display: none !important;
}

/* Video*/

.unterseiten .ce_youtube {
  max-width: 480px;
  max-height: 270px;
  margin: 0 auto;
  margin-bottom: 40px;
}

/* ===========================================
 * Überschriften / Unterstriche
 * ======================================== */

h1, h2, h3, h4, h5, h6 {
  position: relative;
  margin-top: 0;
  line-height: 1.2;
  font-weight: 400;
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
  font-weight: inherit
}
h1 {
  font-size: 38px;
  font-weight: 400;
  line-height: 1.2;
  font-family: 'Lora', sans-serif;
  color: #000033;
}
.unterseiten h1 {
  margin-top: 12px;
  margin-bottom: 15px;
  font-size: 28px;
}
.unterseiten h1.abstand {
  margin-bottom: -15px;
}
.home h1 {
  color: #000033;
  font-size: 38px;
  font-weight: 400;
}
h2 {
  font-size: 22px;
  font-weight: 400;
  line-height: 1.2;
  font-family: 'Lora', sans-serif;
  color: #000033;
}
.unterseiten h2 {
  color: #000033;
  font-size: 25px;
  margin-top: 25px;
}
h3 {
  font-size: 18px;
  font-weight: 400;
  line-height: 1.2;
  font-family: 'Lora', sans-serif;
  color: #000033;
}
.unterseiten h3 {
  color: #000033;
  margin-top: 15px;
  font-size: 22px;
}
.datenschutzerklärung h2 {
  font-size: 30px;
  margin-bottom: 30px;
  margin-top: 20px;
}
.datenschutzerklärung h3 {
  font-size: 22px;
  margin-top: 20px;
}
aside h3 {
  padding-bottom: 6px;
  border-bottom: 1px solid #000033;
  font-size: 1.2em;
}
h4 {
  font-size: 19px;
  font-weight: 400;
  line-height: 1.2;
  font-family: 'Lora', sans-serif;
  color: #000033;
}
.unterseiten h4 {
  color: #000033;
  margin-top: 12px;
  font-size: 19px;
}
h5 {
  font-size: 15px;
  font-weight: 400;
  line-height: 1.2;
  font-family: 'Lora', sans-serif;
  color: #000033;
}
h6 {
  font-size: 12px;
  font-weight: 400;
  line-height: 1.2;
  font-family: 'Lora', sans-serif;
  color: #000033;
}
.celine h1, .celine h2, .celine h3, .celine h4, .celine h5, .celine h6 {
  margin-bottom: 40px;
  padding-bottom: 16px;
  text-align: center;
  border-bottom: 1px solid #E9E9E9;
}
h1.celine, h2.celine, h3.celine, h4.celine, h5.celine, h6.celine {
  margin-bottom: 40px;
  padding-bottom: 16px;
  border-bottom: 1px solid #E9E9E9;
}
.celine h1:after, .celine h2:after, .celine h3:after, .celine h4:after, .celine h5:after, .celine h6:after {
  width: 48%;
  right: 26%;
  position: absolute;
  border-bottom: 3px solid #000033;
  bottom: -2px;
  content: "";
}
h1.celine:after, h2.celine:after, h3.celine:after, h4.celine:after, h5.celine:after, h6.celine:after {
  width: 4%;
  bottom: -2px;
  left: 48%;
  position: absolute;
  display: block;
  border-bottom: 3px solid #ffffff;
  content: "";
}
.leftline h1, .leftline h2, .leftline h3, .leftline h4, .leftline h5, .leftline h6 {
  margin-bottom: 25px;
  padding-bottom: 10px;
  border-bottom: 3px solid #000033;
  display: inline-block;
}

/*.leftline h1:after,.leftline h2:after,.leftline h3:after,.leftline h4:after,.leftline h5:after,.leftline h6:after{
  width:440px;
  bottom:-2px;
  left:0;
  position:absolute;
  display:block;
  border-bottom:3px solid #000033;
  content:"";
  }*/

h1.leftline, h2.leftline, h3.leftline, h4.leftline, h5.leftline, h6.leftline {
  clear: both;
  margin-bottom: 25px;
  padding-bottom: 10px;
  border-bottom: 3px solid #000033;
  display: inline-block;
}

/*h1.leftline:after,h2.leftline:after,h3.leftline:after,h4.leftline:after,h5.leftline:after,h6.leftline:after{
  width:440px;
  bottom:-2px;
  left:0;
  position:absolute;
  display:block;
  border-bottom:3px solid #000033;
  content:"";
  }*/

hr.centerline {
  width: 98%;
  height: 1px;
  position: relative;
  display: block;
  margin: 40px auto 60px;
  background-color: #E9E9E9;
}
hr.centerline:before {
  width: 48%;
  height: 3px;
  right: 26%;
  position: absolute;
  display: block;
  background-color: #000033;
  content: "";
  bottom: -1px;
}
hr.leftline {
  width: 98%;
  height: 1px;
  position: relative;
  display: block;
  margin: 40px auto 60px;
  background-color: #E9E9E9;
}
hr.leftline:before {
  width: 31.33333%;
  height: 3px;
  left: 0;
  position: absolute;
  display: block;
  background-color: #000033;
  content: "";
  bottom: -1px;
}
hr.invisible_hr {
  width: 100%;
  height: 1px;
  position: relative;
  display: block;
  margin: 40px auto;
  background: transparent;
}
hr.segment {
  width: 100%;
  height: 1px;
  position: relative;
  display: block;
  margin-bottom: 1.8em;
  background-color: #E9E9E9;
}

/* ===========================================
 * Buttons
 * ======================================== */


/* Runder Button*/

.button p a:after {
  display: inline-block;
  margin-left: 10px;
  font-family: FontAwesome;
  text-decoration: none;
  content: '\f105';
}
.button p a {
  display: inline-block;
  padding: 6px 20px;
  border: 1px solid #000033;
  background-color: #000033;
  text-decoration: none;
  color: #fff;
  text-transform: uppercase;
  border-radius: 40px;
  font-style: italic;
}
.button p a:hover {
  display: inline-block;
  background-color: #0173BA;
  border: 1px solid #0173BA;
  text-decoration: none;
  color: #fff;
}

/* Eckiger Button*/

.button02 p a:after {
  display: inline-block;
  margin-left: 10px;
  font-family: FontAwesome;
  text-decoration: none;
  content: '\f105';
}
.button02 p a {
  display: inline-block;
  padding: 8px 20px;
  border: 1px solid #000033;
  text-decoration: none;
  color: #000033;
  text-transform: uppercase;
  border-radius: 5px;
  font-size: 18px;
}
.button02 p a:hover {
  display: inline-block;
  background-color: #000033;
  border: 1px solid #000033;
  text-decoration: none;
  color: #fff;
}

/* Eckiger Button nur Rahmen*/

.button03 p a:after {
  display: inline-block;
  margin-left: 10px;
  font-family: FontAwesome;
  text-decoration: none;
  content: '\f105';
}
.button03 p a {
  display: inline-block;
  padding: 8px 20px;
  border: 1px solid #000033;
  text-decoration: none;
  color: #000033;
  text-transform: uppercase;
  border-radius: 5px;
}
.button03 p a:hover {
  display: inline-block;
  background-color: #000033;
  border: 1px solid #000033;
  text-decoration: none;
  color: #fff;
}

/* ===========================================
 * Tabellen
 * ======================================== */

table {
  width: 100%;
  margin-bottom: 10px;
  white-space: nowrap;
  border-bottom: 1px solid #e3e3e3;
}
.ce_table {
  overflow: auto;
}
.ce_table table th, .ce_table table tfoot td {
  text-align: left;
  background-color: #ffffff;
  border-top: 1px solid #e3e3e3;
}
table th {
  padding: .5em;
  color: #000033;
}
table td {
  padding: .5em;
  border-top: 1px solid #e3e3e3;
}
table td.col_1 {
  width: 200px;
}
.zubehoer table th.head_0 {
  width: 80%;
}
.zubehoer table th.head_1 {
  width: 200%;
}
.ce_table.striped tr.even {
  background-color: #f8f8f8;
}

/* ===========================================
 * Accordion
 * ======================================== */

.ce_accordion .accordion {
  padding: 20px;
  border: 0;
  background: none;
}
.ce_accordion .accordion>div {
  padding: 0;
}
.ce_accordion .toggler {
  padding: 7px 0;
  background-image: none;
  border: 1px solid #e9e9e9;
  line-height: 30px;
  font-weight: 500;
  color: #000033;
  cursor: pointer;
  -webkit-transition: All 0.3s ease;
  -moz-transition: All 0.3s ease;
  -o-transition: All 0.3s ease;
  -ms-transition: All 0.3s ease;
  transition: All 0.3s ease;
}
.ce_accordion .toggler:hover {
  border: 1px solid #000033;
  color: #000033;
  -webkit-transition: All 0.3s ease;
  -moz-transition: All 0.3s ease;
  -o-transition: All 0.3s ease;
  -ms-transition: All 0.3s ease;
  transition: All 0.3s ease;
}
.ce_accordion .toggler:before {
  width: 25px;
  height: 25px;
  float: left;
  clear: both;
  display: inline-block;
  margin-top: 3px;
  margin-right: 15px;
  margin-left: 15px;
  padding: 0;
  text-align: center;
  border-radius: 3px;
  font: 1.3em/28px FontAwesome;
  font-weight: normal;
  color: #000033;
  behavior: url('assets/css3pie/1.0.0/PIE.htc');
  content: '\f0d7';
}
.ce_accordion .ui-accordion-header-active {
  border: 1px solid #000033;
  color: #000033;
}
.ce_accordion .toggler.ui-state-active:before {
  font-family: FontAwesome;
  content: '\f0d8';
}
.ce_accordion .toggler:after {
  display: none;
}

/* ===========================================
 * Listen
 * ======================================== */

.ce_list ul, .ce_text ul {
  padding-left: 1.8em;
}
.ce_list ol, .ce_text ol {
  padding-left: 1.8em;
}
.ce_list ul li {
  list-style-type: disc;
  list-style-position: outside;
}
.ce_text ul li {
  list-style-type: disc;
  list-style-position: outside;
  margin-bottom: 3px;
}
.ce_list.circle ul li {
  list-style-type: circle;
  list-style-position: outside;
}
.ce_list.square ul li {
  list-style-type: square;
  list-style-position: outside;
}
.ce_list ol li {
  list-style-type: decimal;
  list-style-position: outside;
}
.ce_list.upper-alpha ol li {
  list-style-type: upper-alpha;
  list-style-position: outside;
}
.ce_list[class^="symlist"] ul, .ce_list[class*="symlist"] ul {
  margin-left: 12px;
  padding-left: 0;
  list-style-type: none;
}
.ce_list[class^="symlist"] ul li, .ce_list[class*="symlist"] ul li {
  margin-left: 12px;
  padding-left: 0;
  list-style-type: none;
}
.ce_list.symlist1 ul li:before {
  width: 1em;
  display: inline-block;
  margin-right: .5em;
  margin-left: -1.55em;
  font-family: FontAwesome;
  list-style-type: none;
  content: "\f105";
}
.ce_list.symlist2 ul li:before {
  width: 1em;
  display: inline-block;
  margin-right: .5em;
  margin-left: -1.55em;
  font-family: FontAwesome;
  list-style-type: none;
  content: "\f101";
}

/* ===========================================
 * Bilder
 * ======================================== */

.image_container {
  position: relative;
  overflow: hidden;
  line-height: 0;
}
.image_container a img {
  transform: scale(1, 1);
  transition: all 300ms ease-out;
}

/*.image_container a:hover img{
  transform:scale(1.1,1.1);
  transition:all 300ms ease-out
  }*/

.image_container.float_left {
  margin-right: 3%;
  margin-bottom: 1%;
  margin-top: 8px;
}
.image_container.float_right {
  margin-bottom: 1%;
  margin-left: 3%;
  margin-top: 8px;
}
.image_container.float_above {
  margin-bottom: 8px;
}
.image_container.float_below {
  margin-top: 8px;
}
.image_container .caption {
  bottom: 0;
  left: 0;
  padding: 13px;
  background-color: rgba(255, 255, 255, .95);
  border: 1px solid #f4f4f4;
  font-size: .8em;
  line-height: 1.5;
  margin: 0 auto;
  max-width: 400px;
  text-align: center;
}
.bild-rechts .image_container img {
  float: right;
}
.bild-rechts .p {
  clear: both;
}
.bild-mittig .image_container img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/* Galerie Unterseiten
.unterseiten .image_container a:hover::before, .unterseiten .image_container a:focus::before {
    background: rgba(255, 255, 255, 0.3) none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
}
.unterseiten .image_container a:hover::after, .unterseiten .image_container a:focus::after {

  content: "\f00e";
    display: inline-block;
    font-family: "FontAwesome";
  color:#ffffff;
    font-size: 30px;
    left: 50%;
    margin: -0.5em;
    position: absolute;
    text-indent: 0;
    text-rendering: geometricprecision;
    text-shadow: 0 0 2px rgba(0, 0, 0, 0.35);
    top: 50%;
    z-index: 2;
}
.unterseiten .image_container a:hover img, .unterseiten .image_container a:focus img {
    filter: blur(2px);
    transform: scale(1.05);
}
.unterseiten .image_container figcaption, .unterseiten .image_container .caption {
    color: #525663;
    font-size: 0.875em;
    padding: 0.42857em 0 0;
    width: 100% !important;
}*/


/* ===========================================
 * Galerie
 * ======================================== */

.ce_gallery {
  margin-bottom: 20px;
}
.ce_gallery ul {
  overflow: hidden;
}
.ce_gallery.gallery_bg {
  overflow: hidden;
  padding-top: 15px;
  padding-right: 15px;
  padding-left: 15px;
  background-color: #f2f2f2;
}
.ce_text .ce_gallery ul {
  padding-left: 0;
}
.ce_gallery ul li {
  position: relative;
  float: left;
  margin-bottom: 2%;
}
.ce_text .ce_gallery ul li {
  list-style-type: none;
}

/* gallery-neu.css */

.ce_gallery ul.cols_1 li {
  position: relative;
  float: left;
  margin-right: 0;
  margin-bottom: 2%;
  margin-left: 0;
}
.ce_gallery ul.cols_2 li {
  width: 49%;
  margin-right: 1%;
  margin-left: 1%;
}
.ce_gallery ul.cols_3 li {
  width: 32%;
  margin-right: 1%;
  margin-left: 1%;
}
.ce_gallery ul.cols_4 li {
  width: 23.4%;
  margin-right: 1%;
  margin-left: 1%;
}
.ce_gallery ul.cols_5 li {
  width: 18.3%;
  margin-right: 1%;
  margin-left: 1%;
}
.ce_gallery ul.cols_6 li {
  width: 15%;
  margin-right: 1%;
  margin-left: 1%
}
.ce_gallery ul.cols_8 li {
  width: 10.75%;
  margin-right: 1%;
  margin-left: 1%;
}
.ce_gallery.gallery1 ul li {
  position: relative;
  float: left;
  margin-right: 0;
  margin-bottom: 2%;
  margin-left: 0
}
.ce_gallery ul li.col_first {
  margin-left: 0;
}
.ce_gallery ul li.col_last {
  margin-right: 0;
}

/* ===========================================
 * Formulare
 * ======================================== */

.kontaktformular {
  max-width: 500px;
}
.onlinefragebogen {
  max-width: 100%;
}
input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], input:not([type]), textarea {
  padding: 8px;
  background-color: #E4E6E9;
  border: 1px solid #E4E6E9;
  border-radius: 0;
  behavior: url('assets/css3pie/1.0.0/PIE.htc');
  box-shadow: none;
  transition: all 0.15s linear 0s
}
input[type="text"]:focus, input[type="password"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="time"]:focus, input[type="url"]:focus, input:focus:not([type]), textarea:focus {
  background-color: #C9CDD3;
  border: 1px solid #000033;
  border-radius: 0;
  behavior: url('assets/css3pie/1.0.0/PIE.htc');
  box-shadow: none
}
input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 1000px #fff inset !important
}
button.submit[type="submit"] {
  position: relative;
  display: block;
  padding: 10px 8px;
  font-size: 14px;
  color: #fff;
  background-color: #000033;
  border: 0 !important;
  cursor: pointer;
  transition: all 0.2s ease-out 0s
}
input[type="submit"]:hover {
  opacity: 0.8 !important
}
form div {
  margin-bottom: 30px
}
form div label[class*="grid"], form div input[class*="grid"], form div textarea[class*="grid"], form div select[class*="grid"], form div fieldset {
  width: 100%;
  float: none;
  margin-right: 0;
  margin-left: 0
}
p.error {
  width: 100%;
  display: inline-block;
  font-size: 12px;
  color: #f00
}
form fieldset, div.widget-upload {
  padding: 10px;
  border: 1px solid #E9E9E9
}
form fieldset[class*="grid"] {
  width: 100%
}
form fieldset legend {
  width: auto;
  padding-right: 10px;
  padding-left: 10px;
  background-color: #ffffff;
  color: #000033;
}
form select {
  padding: 10px;
  border: 1px solid #E9E9E9
}
.ce_form form select {
  display: inline-block;
  padding: 10px;
  background-color: #fff;
  border: 1px solid #E9E9E9;
}
.ce_form form select.multiselect {
  background-image: none
}
form select option {
  padding-right: 10px;
  padding-left: 10px
}
form select.multiselect option {
  padding-right: 0;
  padding-left: 0
}
.checkbox_container.vertical span, .radio_container.vertical span {
  display: block
}
.radio_container label, .checkbox_container label {
  margin-left: 6px
}
.checkbox_container span, .radio_container span {
  margin-right: 12px
}
span.mandatory {
  color: #f00
}

/* ===========================================
 * Social
 * ======================================== */

.socialbuttons {
  overflow: hidden;
  float: right;
  line-height: 0;
  margin-top: 30px;
  margin-right: 1%
}
.socialbuttons ul {
  margin-bottom: 0
}
.socialbuttons li {
  overflow: hidden;
  display: inline-block;
  margin-left: 6px
}
.socialbuttons li[class*="fa-"]:before, .socialbuttons li[class^="fa-"]:before {
  display: none
}
.socialbuttons a {
  font-size: 0;
  line-height: 0
}
.socialbuttons a:hover {
  text-decoration: none
}
.socialbuttons a:before {
  width: 27px;
  height: 27px;
  overflow: hidden;
  display: inline-block;
  text-align: center;
  border: 1px solid #ffffff;
  font: 18px/28px FontAwesome;
  color: #ffffff
}
.socialbuttons a.fa-facebook:before {
  content: "\f09a"
}
.socialbuttons a.fa-facebook:hover:before {
  background-color: #0d6eac;
  border: 1px solid #0d6eac;
  text-decoration: none;
  color: #fff;
  content: "\f09a"
}
.socialbuttons a.fa-twitter:before {
  content: "\f099"
}
.socialbuttons a.fa-twitter:hover:before {
  background-color: #55ACEE;
  border-color: #55ACEE;
  color: #fff;
  content: "\f099"
}
.socialbuttons a.fa-google-plus:before {
  content: "\f0d5"
}
.socialbuttons a.fa-google-plus:hover:before {
  background-color: #E43D2B;
  border: 1px solid #E43D2B;
  color: #fff;
  content: "\f0d5"
}
.socialbuttons a.fa-xing:before {
  content: "\f168"
}
.socialbuttons a.fa-xing:hover:before {
  background-color: #006464;
  border-color: #006464;
  color: #fff;
  content: "\f168"
}
.socialbuttons a.fa-linkedin:before {
  content: "\f0e1"
}
.socialbuttons a.fa-linkedin:hover:before {
  background-color: #069;
  border-color: #069;
  color: #fff;
  content: "\f0e1"
}
.socialbuttons a.fa-youtube:before {
  content: "\f167"
}
.socialbuttons a.fa-youtube:hover:before {
  background-color: #cc181e;
  border-color: #cc181e;
  color: #fff;
  content: "\f167"
}

/* ===========================================
 * Google Map
 * ======================================== */

.ce_dlh_googlemaps {
  /*width:100%;*/
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.ce_dlh_googlemaps .dlh_googlemap {
  width: 100% !important;
}
#dlh_googlemap_1>div>div:nth-child(1)>div:nth-child(3)>div:nth-child(4)>div>div.gm-style-iw>div>div>div>div>form>button.submit {
  display: inline-block;
  padding-top: 8px;
  padding-bottom: 9px;
}
#confirm-googlemaps {
  color: #525252;
  background-image: url("../../website/layout/map.gif");
  background-position: left top;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 20px;
  font-size: 14px;
}

/* ===========================================
 * News
 * ======================================== */

.mod_newslist p.info, .mod_newsreader p.info {
  border: 1px solid #f4f4f4;
  color: #5d5d5d;
  font-size: 12px;
  max-width: 130px;
  padding: 6px 12px;
}
.mod_newslist .layout_latest {
  margin-bottom: 16px;
  padding-bottom: 10px;
}
.mod_newslist .layout_latest.last {
  border-bottom: 0 solid #e9e9e9;
  margin-bottom: 16px;
  padding-bottom: 10px;
}
.mod_newsreader .grid02-33 {
  width: 100%;
}
.pagination {
  border-top: 1px solid #ddd;
  clear: both;
  margin-top: 10px;
  padding-top: 8px;
  white-space: nowrap;
}
.pagination p {
  display: block;
  float: left;
  margin-bottom: 0;
}
.pagination ul {
  float: right;
  margin-bottom: 0;
}
.pagination ul li {
  float: left;
}
.pagination ul li span.current {
  background-color: #ccca15;
  color: #fff;
}
.pagination ul li a, .pagination ul li span {
  display: block;
  margin-right: 2px;
  padding: 4px 12px;
  text-decoration: none;
}

/* ===========================================
 * Blog
 * ======================================== */

.mod_newslist p.info, .mod_newsreader p.info {
  border: 1px solid #f4f4f4;
  color: #5d5d5d;
  font-size: 12px;
  max-width: 130px;
  padding: 6px 12px;
}
.mod_newslist .layout_latest {
  margin-bottom: 16px;
  padding-bottom: 10px;
}
.mod_newslist .layout_latest.last {
  border-bottom: 0 solid #e9e9e9;
  margin-bottom: 16px;
  padding-bottom: 10px;
}
.mod_newslist .layout_latest {
  float: left;
  margin-right: 1.3%;
  width: 32%;
}
.mod_newslist .layout_latest:nth-child(3n+1) {
  clear: both;
}
.mod_newsreader .grid02-33 {
  width: 100%;
}
.pagination {
  border-top: 1px solid #ddd;
  clear: both;
  margin-top: 10px;
  padding-top: 8px;
  white-space: nowrap;
}
.pagination p {
  display: block;
  float: left;
  margin-bottom: 0;
}
.pagination ul {
  float: right;
  margin-bottom: 0;
}
.pagination ul li {
  float: left;
}
.pagination ul li span.current {
  background-color: #ccca15;
  color: #fff;
}
.pagination ul li a, .pagination ul li span {
  display: block;
  margin-right: 2px;
  padding: 4px 12px;
  text-decoration: none;
}

/* Blog Detail */

.blog .pdf_link {
  margin-bottom: 20px;
}

/* Blog Detail rechts*/

#right .mod_newslist h2 {
  font-size: 18px;
  margin-top: 0px;
}
.mod_newslist .layout_latest.top3-news {
  float: none;
  margin-right: 0px;
  width: 100%;
}
.mod_newslist .layout_latest.top3-news {
  margin-bottom: 10px;
  padding-bottom: 0px;
}

/* Kommentare*/

#ctrl_website {
  display: none;
}
.mod_newsreader .ce_comments p.info {
  border: 0px solid #f4f4f4;
  color: #000033;
  font-size: 14px;
  max-width: 100%;
  padding: 12px 0px 0px 0px;
}
.ce_comments .reply {
  margin-left: 60px;
  font-weight: 500;
}
.ce_comments .formbody {
  margin-top: 60px;
}

/* ===========================================
 * Download
 * ======================================== */

.ce_download img.mime_icon, .ce_downloads img.mime_icon {
  vertical-align: middle
}
.ce_download a, .ce_downloads a {
  text-decoration: none
}
.ce_download a span.size, .ce_downloads a span.size {
  font-size: 12px;
  font-style: italic;
  text-decoration: none
}
.ce_downloads li {
  margin-bottom: 6px;
  padding-bottom: 6px;
  vertical-align: middle;
  border-bottom: 1px solid #E9E9E9
}

/* ===========================================
 * Back to Top
 * ======================================== */

#backtotop {
  height: auto;
  bottom: 30px;
  right: 30px;
  position: fixed;
  display: none;
  z-index: 30;
}
#backtotop ul {
  padding-top: 15px;
  padding-bottom: 15px;
}
#backtotop ul li a:before {
  width: 30px;
  height: 30px;
  top: -15px;
  position: relative;
  float: right;
  display: block;
  text-align: center;
  font: 20px/30px FontAwesome;
  color: #fff;
  content: "\f077";
}
#backtotop ul li a {
  width: 30px;
  height: 30px;
  bottom: 30px;
  right: 30px;
  float: right;
  display: block;
  padding-top: 15px;
  padding-bottom: 15px;
  background-color: #000033;
  font-size: 0;
}
#backtotop ul li a:hover {
  background-color: #aaa;
}

/* ===========================================
 * Sprachwechsler
 * ======================================== */

.mod_langswitcher {
  float: right;
  position: absolute;
  top: 20px;
  right: 20px;
  z-index: 3000;
}
.mod_langswitcher .mod_langswitcher_inside {
  border: 1px solid #000033;
  border-radius: 5px;
  cursor: pointer;
  display: inline-block;
  line-height: 0;
  padding: 10px 15px;
}
.mod_langswitcher .mod_langswitcher_inside:after {
  content: "\f0d7";
  display: inline-block;
  font-family: "FontAwesome";
  color: #000033;
  font-size: 10px;
  margin-left: 10px;
  position: relative;
  top: -4px;
}
.mod_langswitcher .mod_langswitcher_inside i {
  margin-right: 5px;
}
.mod_langswitcher img {
  height: 15px;
  width: 20px;
}
.mod_langswitcher ul {
  background: rgba(255, 255, 255, 0.8) none repeat scroll 0 0;
  box-shadow: 0 2px 2px 1px rgba(0, 0, 0, 0.1);
  display: none;
  left: 0;
  margin-top: 16px;
  position: absolute;
  text-align: center;
  top: 50%;
  width: 71px;
}
.mod_langswitcher ul li a {
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  display: block;
  line-height: 15px;
  padding: 6px 15px;
  transition: all 0.5s ease 0s;
}
.mod_langswitcher ul li a img {
  border: 1px solid rgb(200, 200, 200);
}
.mod_langswitcher ul li a:hover {
  background: rgba(0, 0, 0, 0.05) none repeat scroll 0 0;
}
.mod_langswitcher ul li:last-of-type a {
  border-bottom: 0 none;
}
.mod_langswitcher .mod_langswitcher_inside:hover ul {
  display: block;
}
.mod_langswitcher:hover .mod_langswitcher_inside {
  border-radius: 5px 5px 0 0;
}

/* ===========================================
 * Isotope / Masonary
 * ======================================== */

#filters.button-group {
  margin-bottom: 20px;
  text-align: center;
}
#filters.button-group button {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  border: 1px solid #f4f4f4;
  color: #5e6366;
  margin-left: 5px;
  margin-right: 5px;
  padding: 10px 18px;
  text-align: center;
}
#filters.button-group button:hover {
  border: 1px solid #00a5cb;
  color: #00a5cb;
  cursor: pointer;
}
#filters.button-group button.is-checked {
  border: 1px solid #00a5cb;
  color: #00a5cb;
  cursor: default;
}
.isotope-item .image_container.float_above {
  float: none;
  margin: 0;
  padding: 0;
  width: 100%;
}
.fullwidth #main .inside #portfolio-wrapper {
  padding-left: 0;
  padding-right: 0;
}
.mod_article .portfolioRegular {
  margin-left: 0;
  margin-right: 0;
}
.isotope-item {
  margin-bottom: 20px;
  z-index: 2;
}
.isotope-hidden.isotope-item {
  pointer-events: none;
  z-index: 1;
}
.bx-wrapper .ce_text {
  margin-bottom: 0;
  margin-left: 0;
}
.bx-wrapper ul.gallery_slider li {
  margin-bottom: 0;
  margin-left: 0;
}
.teaser_content {
  overflow: hidden;
  position: relative;
  width: 100%;
}
.teaser_content div.more {
  background-color: rgba(0, 165, 203, 1);
  bottom: 0;
  height: 100%;
  left: 0;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  right: 0;
  text-align: center;
  top: 0;
  transition: all 300ms ease-out 0s;
  vertical-align: middle;
  visibility: hidden;
  width: 100%;
  z-index: 2;
}
.isotope-item:hover .teaser_content div.more {
  opacity: 1;
  transition: all 300ms ease-out 0s;
  visibility: visible;
  z-index: 2;
}
.teaser_content div.more span {
  display: table;
  height: 100%;
  text-align: center;
  vertical-align: middle;
  width: 100%;
}
.teaser_content div.more span a {
  color: #fff;
  display: table-cell;
  text-decoration: none;
  text-transform: uppercase;
  vertical-align: middle;
}
.teaser_content div.more span a::before {
  color: #fff;
  content: "";
  display: block;
  font: 30px FontAwesome;
  text-decoration: none;
}
.mod_newslist .isotope-item img {
  transform: scale(1, 1);
  transition: all 300ms ease-out 0s;
}
.mod_newslist .isotope-item:hover img {
  opacity: 0.7;
  transform: scale(1.1, 1.1);
  transition: all 300ms ease-out 0s;
}
.isotope-item .meta_box {
  border-bottom: 1px solid #00a5cb;
  margin-bottom: 0;
}
.isotope-item .meta_box .info, .isotope-item .meta_box .info_author {
  display: block;
  width: 100%;
}
.isotope-item .teaser_content {
  background-color: #f4f4f4;
  padding: 1em 1.5em 0.5em;
}
.isotope-item .teaser_content h2 {
  font-size: 1.4em;
}
.mod_newslist.portfoliolist {
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.mod_newslist.portfoliolist .pagination {
  margin-left: 1%;
  margin-right: 1%;
}
.layout_full_cts.grid4, .layout_full_cts.grid33, .layout_full_cts.grid8 {
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100%;
}
.isotope-item .ceport_content {
  background-color: rgba(0, 165, 203, 0.7);
  bottom: 0;
  display: block;
  height: 100%;
  left: 0;
  opacity: 0;
  position: absolute;
  right: 0;
  top: 0;
  transform: scale(0);
  transition: all 0.5s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
  width: 100%;
}
.isotope-item:hover .ceport_content {
  opacity: 1;
  transform: scale(1);
}
.isotope-item .ceport_cell {
  bottom: 20px;
  display: block;
  left: 20px;
  position: absolute;
  right: 20px;
  top: 20px;
}
.isotope-item .ceport_cell h2, .isotope-item .ceport_cell p {
  color: #fff;
}
.isotope-item .ceport_cell p a {
  border: 1px solid #fff;
  bottom: 20px;
  color: #fff;
  cursor: pointer;
  display: block;
  padding: 6px 12px;
  position: absolute;
  right: 20px;
  text-decoration: none;
  vertical-align: middle;
}
.isotope-item .ceport_cell p a:hover {
  background-color: rgba(255, 255, 255, 0.3);
}

/* ===========================================
 * Rocksolid Slider
 * ======================================== */

.mod_rocksolid_slider, .mod_rocksolid_slider .ce_image {
  margin-right: 0% !important;
  margin-left: 0% !important;
}
.main-slider {
  /* height: calc(100vh - 200px); */
}
.rsts-skin-liquid .rsts-nav-bullets a:hover, .rsts-skin-liquid .rsts-nav-bullets a.active {
  background-color: #000033;
}
.slide01 .videoinfo {
  position: absolute;
  top: 22%;
  right: 9%;
  z-index: 2000;
  width: 600px;
  border: 8px solid #ffffff;
}
.slide01 .videoinfo02 {
  position: absolute;
  top: 20%;
  right: 6%;
  color: #000033;
  font-size: 24px;
  font-weight: 500;
  background-color: #CBDFF5;
  padding: 2% 2.5% 2% 2.5%;
  opacity: 0.8;
}
.slide01 .videoinfo03 {
  position: absolute;
  top: 20%;
  right: 6%;
  color: #ffffff;
  font-size: 35px;
  font-weight: 500;
}
.slide01 .videoinfo04 {
  position: absolute;
  top: 30%;
  margin: 0 auto;
  width: 100%;
}
.slide01 .videoinfo04 h1 {
  opacity: 0.7;
  width: 100%;
  color: #CBDFF5;
  font-size: 46px;
  font-weight: 500;
}
.slide01 .videoinfo05 {
  position: absolute;
  top: 40%;
  color: #ffffff;
  font-size: 35px;
  font-weight: 500;
  margin: 0 auto;
  opacity: 0.7;
  width: 100%;
}
.slide01 .button {
  position: absolute;
  top: 75%;
  right: 18%;
  z-index: 2000;
}
.slide01 .button p a::after {
  content: "";
  display: inline-block;
  font-family: FontAwesome;
  margin-left: 10px;
  text-decoration: none;
}
.slide01 .button p a {
  background-color: #000033;
  border: 1px solid #000033;
  border-radius: 40px;
  color: #fff;
  display: inline-block;
  font-style: italic;
  padding: 6px 20px;
  text-decoration: none;
  text-transform: uppercase;
}

/* ===========================================
 * Contao Slider
 * ======================================== */

.slider-control {
  height: 0 !important;
  position: static !important;
}
.slider-control a {
  font-size: 0;
  margin-top: -35px;
  opacity: 0.7;
  text-decoration: none;
  top: 30%;
}
.slider-control a:hover {
  opacity: 1;
}
.slider-menu {
  bottom: 15px;
  font-family: Arial, sans-serif;
  top: auto !important;
}
.slider-menu b {
  margin: 0 2px !important;
}
.slider-control .slider-menu b.active {
  color: #ccca05;
}
.slider-control .slider-menu b {
  color: #ffffff;
}
.slider-control .slider-menu {
  left: 80%;
  margin-left: -40%;
  width: 20%;
}
#header .ce_sliderStart, #header .slider-wrapper .ce_image, #header .ce_sliderStart, #header .slider-wrapper .ce_text {
  margin-bottom: 0;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-top: 0;
  position: relative;
}
#main .slider-wrapper .ce_image, #main .slider-wrapper .ce_text {
  margin-bottom: 0;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-top: 0;
  position: relative;
}
.home .slider-wrapper p {
  margin: 0 auto !important;
  max-width: 700px;
}
.home .slider-wrapper .ce_image img {
  margin-left: 0 !important;
  margin-right: 0 !important;
  position: relative;
}
.home .slider-wrapper .image_container.float_above {
  margin-bottom: 0;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-top: 0;
  position: relative;
}
.ce_sliderStart {
  position: relative !important;
  max-height: 300px;
}
.slider-next {
  background: rgba(160, 160, 160, 0.0) none repeat scroll 0 0;
  border-radius: 10px;
  color: #5d5d5d;
  height: 70px;
  right: 0;
  width: 50px;
  z-index: 100;
}
.slider-next::before {
  color: #ffffff;
  content: "";
  display: block;
  font: 30px/26px FontAwesome;
  margin-top: -12px;
  position: relative;
  text-align: center;
  top: 50%;
}
.slider-prev {
  background-color: rgba(160, 160, 160, 0.0);
  border-radius: 10px;
  color: #5d5d5d;
  height: 70px;
  width: 50px;
  z-index: 100;
}
.slider-prev::before {
  color: #ffffff;
  content: "";
  display: block;
  font: 30px/26px FontAwesome;
  margin-top: -12px;
  position: relative;
  text-align: center;
  top: 50%;
}
.ce_sliderStart .caption {
  display: none;
}
.mod_article.textslider {
  position: relative;
}
.mod_article.textslider .ce_sliderStart {
  height: 100%;
  left: 0;
  position: absolute !important;
  top: 0;
  width: 100%;
}
.mod_article.textslider .ce_sliderStart .content-slider, .mod_article.textslider .ce_sliderStart .slider-wrapper {
  height: 100%;
  width: 100%;
}
.mod_article.textslider .ce_text {
  height: 100%;
}
.mod_article.textslider .ce_image, .mod_article.textslider .ce_video-container {
  margin: 0;
  position: relative;
}
.mod_article.textslider.bgvideo .ce_text {
  height: 100%;
  left: 0;
  position: absolute !important;
  top: 0;
  width: 100%;
}
.mod_article.textslider .textbox {
  display: table;
  height: 100%;
  left: 0;
  position: relative;
  top: 0;
  width: 100%;
}
.slider_text {
  bottom: 0;
  display: table-cell;
  left: 0;
  padding: 30px 56px;
  text-align: center;
  vertical-align: middle;
  width: 75%;
}
.bottom .slider_text {
  bottom: 0;
  display: table-cell;
  left: 0;
  padding: 30px 56px;
  text-align: left;
  vertical-align: bottom;
  width: 75%;
}
.left .slider_text {
  text-align: left;
}

/* ===========================================
 * Headerbild
 * ======================================== */

#afterheader .ce_image {
  margin-right: 0%;
  margin-left: 0%;
}

/* ===========================================
 * Animations
 * ======================================== */

.animated-05 {
  -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.animated-1 {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.animated-2 {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.animated-3 {
  -webkit-animation-duration: 3s;
  animation-duration: 3s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.animated-4 {
  -webkit-animation-duration: 4s;
  animation-duration: 4s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.animated-5 {
  -webkit-animation-duration: 4s;
  animation-duration: 4s;
  animation-delay: 3s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.animated-6 {
  -webkit-animation-duration: 4s;
  animation-duration: 4s;
  animation-delay: 6s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.animated-7 {
  -webkit-animation-duration: 4s;
  animation-duration: 4s;
  animation-delay: 7s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.animated-8 {
  -webkit-animation-duration: 4s;
  animation-duration: 4s;
  animation-delay: 8s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
@-webkit-keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }
  50% {
    opacity: 1;
  }
}
@keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }
  50% {
    opacity: 1;
  }
}
.zoomIn {
  -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}
@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}
@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}
@-webkit-keyframes rotateIn {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }
  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}
@keyframes rotateIn {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }
  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}
.rotateIn {
  -webkit-animation-name: rotateIn;
  animation-name: rotateIn;
}
.lightSpeedIn {
  -webkit-animation-name: lightSpeedIn;
  animation-name: lightSpeedIn;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
}
@-webkit-keyframes lightSpeedOut {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}
@keyframes lightSpeedOut {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}
.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}
@-webkit-keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

/***** Hover Effekte *****/

.codedrops {
  list-style: outside none none;
  max-width: 1000px;
  position: relative;
  text-align: center;
}
.codedrops figure.image_container {
  cursor: pointer;
  float: left;
  overflow: hidden;
  position: relative;
  text-align: center;
}
.codedrops figure img {
  display: block;
  max-width: 100%;
  opacity: 0.9;
  position: relative;
}
.codedrops figure.image_container a::before, .codedrops figure.image_container a:hover::after {
  display: none;
}
.codedrops figure.image_container figcaption.caption {
  backface-visibility: hidden;
  background-color: transparent;
  color: #fff;
  font-size: 1.25em;
  padding: 2em;
  text-transform: uppercase;
  width: 100% !important;
}
.codedrops figure figcaption::before, .codedrops figure figcaption::after {
  pointer-events: none;
}
.codedrops figure figcaption, .codedrops figure figcaption>a {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}
.codedrops figure figcaption.caption>a {
  font-size: 0;
  opacity: 0;
  text-decoration: none;
  text-indent: 200%;
  white-space: nowrap;
  z-index: 1000;
}
.codedrops figure h2 {
  color: rgba(255, 255, 255, 0.8);
  font-weight: 400;
  text-decoration: none;
  word-spacing: -0.15em;
}
.codedrops figure a {
  text-decoration: none;
}
.codedrops figure h2 span {
  font-weight: 800;
}
.codedrops figure h2, .codedrops figure p {
  margin: 0;
}
.codedrops figure p {
  font-size: 68.5%;
  letter-spacing: 1px;
}
figure.effect-sadie figcaption::before {
  background: rgba(0, 0, 0, 0) linear-gradient(to bottom, rgba(72, 76, 97, 0) 0%, rgba(72, 76, 97, 0.8) 75%) repeat scroll 0 0;
  content: "";
  height: 100%;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
  transform: translate3d(0px, 50%, 0px);
  width: 100%;
}
figure.effect-sadie h2 {
  color: #484c61;
  left: 0;
  position: absolute;
  top: 50%;
  transform: translate3d(0px, -50%, 0px);
  transition: transform 0.35s ease 0s, color 0.35s ease 0s;
  width: 100%;
}
figure.effect-sadie figcaption::before, figure.effect-sadie p {
  transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
}
figure.effect-sadie p {
  bottom: 0;
  left: 0;
  opacity: 0;
  padding: 2em;
  position: absolute;
  transform: translate3d(0px, 10px, 0px);
  width: 100%;
}
figure.effect-sadie:hover h2 {
  color: #fff;
  transform: translate3d(0px, -50%, 0px) translate3d(0px, -40px, 0px);
}
figure.effect-sadie:hover figcaption::before, figure.effect-sadie:hover p {
  opacity: 1;
  transform: translate3d(0px, 0px, 0px);
}
figure.effect-julia {
  background: #2f3238 none repeat scroll 0 0;
}
figure.effect-julia img {
  backface-visibility: hidden;
  max-width: none;
  transition: opacity 1s ease 0s, transform 1s ease 0s;
}
figure.effect-julia figcaption {
  text-align: left;
}
figure.effect-julia h2 {
  padding: 0.5em 0;
  position: relative;
}
figure.effect-julia p {
  background: rgba(255, 255, 255, 0.9) none repeat scroll 0 0;
  color: #2f3238;
  display: inline-block;
  font-size: 75%;
  font-weight: 500;
  margin: 0 0 0.25em;
  padding: 0.4em 1em;
  text-transform: none;
  transform: translate3d(-360px, 0px, 0px);
  transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
}
figure.effect-julia p:first-child {
  transition-delay: 0.15s;
}
figure.effect-julia p:nth-of-type(2) {
  transition-delay: 0.1s;
}
figure.effect-julia p:nth-of-type(3) {
  transition-delay: 0.05s;
}
figure.effect-julia:hover p:first-child {
  transition-delay: 0s;
}
figure.effect-julia:hover p:nth-of-type(2) {
  transition-delay: 0.05s;
}
figure.effect-julia:hover p:nth-of-type(3) {
  transition-delay: 0.1s;
}
figure.effect-julia:hover img {
  opacity: 0.4;
  transform: scale3d(1.1, 1.1, 1);
}
figure.effect-julia:hover p {
  opacity: 1;
  transform: translate3d(0px, 0px, 0px);
}
figure.effect-goliath {
  background: #df4e4e none repeat scroll 0 0;
}
figure.effect-goliath img, figure.effect-goliath h2 {
  transition: transform 0.35s ease 0s;
}
figure.effect-goliath img {
  backface-visibility: hidden;
}
figure.effect-goliath h2, figure.effect-goliath p {
  bottom: 0;
  left: 0;
  padding: 30px;
  position: absolute;
}
figure.effect-goliath p {
  font-size: 90%;
  opacity: 0;
  text-transform: none;
  transform: translate3d(0px, 50px, 0px);
  transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
}
figure.effect-goliath:hover img {
  transform: translate3d(0px, -100px, 0px);
}
figure.effect-goliath:hover h2 {
  transform: translate3d(0px, -100px, 0px);
}
figure.effect-goliath:hover p {
  opacity: 1;
  transform: translate3d(0px, 0px, 0px);
}
figure.effect-hera {
  background: #303fa9 none repeat scroll 0 0;
}
figure.effect-hera h2 {
  font-size: 158.75%;
}
figure.effect-hera h2, figure.effect-hera p {
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate3d(-50%, -50%, 0px);
  transform-origin: 50% 50% 0;
  transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
}
figure.effect-hera figcaption::before {
  border: 2px solid #fff;
  content: "";
  height: 200px;
  left: 50%;
  opacity: 0;
  position: absolute;
  top: 50%;
  transform: translate3d(-50%, -50%, 0px) rotate3d(0, 0, 1, -45deg) scale3d(0, 0, 1);
  transform-origin: 50% 50% 0;
  transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
  width: 200px;
}
figure.effect-hera p {
  font-size: 121%;
  line-height: 2;
  text-transform: none;
  width: 100px;
}
figure.effect-hera p a {
  color: #fff;
}
figure.effect-hera p a:hover, figure.effect-hera p a:focus {
  opacity: 0.6;
}
figure.effect-hera p a i {
  opacity: 0;
  transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
}
figure.effect-hera p a:first-child i {
  transform: translate3d(-60px, -60px, 0px);
}
figure.effect-hera p a:nth-child(2) i {
  transform: translate3d(60px, -60px, 0px);
}
figure.effect-hera p a:nth-child(3) i {
  transform: translate3d(-60px, 60px, 0px);
}
figure.effect-hera p a:nth-child(4) i {
  transform: translate3d(60px, 60px, 0px);
}
figure.effect-hera:hover figcaption::before {
  opacity: 1;
  transform: translate3d(-50%, -50%, 0px) rotate3d(0, 0, 1, -45deg) scale3d(1, 1, 1);
}
figure.effect-hera:hover h2 {
  opacity: 0;
  transform: translate3d(-50%, -50%, 0px) scale3d(0.8, 0.8, 1);
}
figure.effect-hera:hover p i:empty {
  opacity: 1;
  transform: translate3d(0px, 0px, 0px);
}
figure.effect-winston {
  background: #162633 none repeat scroll 0 0;
  text-align: left;
}
figure.effect-winston img {
  backface-visibility: hidden;
  transition: opacity 0.45s ease 0s;
}
figure.effect-winston figcaption::before {
  /*background: rgba(0, 0, 0, 0) url("../../files/theme/img/triangle.svg") no-repeat scroll center center / 100% 100%;*/
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  transform: rotate3d(0, 0, 1, 45deg);
  transform-origin: 0 100% 0;
  transition: opacity 0.45s ease 0s, transform 0.45s ease 0s;
  width: 100%;
}
figure.effect-winston h2 {
  transform: translate3d(0px, 20px, 0px);
  transition: transform 0.35s ease 0s;
}
figure.effect-winston p {
  bottom: 0;
  padding: 0 1.5em 7% 0;
  position: absolute;
  right: 0;
}
figure.effect-winston a {
  color: #5d504f;
  font-size: 170%;
  margin: 0 10px;
}
figure.effect-winston a:hover, figure.effect-winston a:focus {
  color: #cc6055;
}
figure.effect-winston p a i {
  opacity: 0;
  transform: translate3d(0px, 50px, 0px);
  transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
}
figure.effect-winston:hover img {
  opacity: 0.6;
}
figure.effect-winston:hover h2 {
  transform: translate3d(0px, 0px, 0px);
}
figure.effect-winston:hover figcaption::before {
  opacity: 0.7;
  transform: rotate3d(0, 0, 1, 20deg);
}
figure.effect-winston:hover p i {
  opacity: 1;
  transform: translate3d(0px, 0px, 0px);
}
figure.effect-winston:hover p a:nth-child(3) i {
  transition-delay: 0.05s;
}
figure.effect-winston:hover p a:nth-child(2) i {
  transition-delay: 0.1s;
}
figure.effect-winston:hover p a:first-child i {
  transition-delay: 0.15s;
}
figure.effect-selena {
  background: #fff none repeat scroll 0 0;
}
figure.effect-selena img {
  opacity: 0.95;
  transform-origin: 50% 50% 0;
  transition: transform 0.35s ease 0s;
}
figure.effect-selena:hover img {
  transform: scale3d(0.95, 0.95, 1);
}
figure.effect-selena h2 {
  transform: translate3d(0px, 20px, 0px);
  transition: transform 0.35s ease 0s;
}
figure.effect-selena p {
  opacity: 0;
  transform: perspective(1000px) rotate3d(1, 0, 0, 90deg);
  transform-origin: 50% 0 0;
  transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
}
figure.effect-selena:hover h2 {
  transform: translate3d(0px, 0px, 0px);
}
figure.effect-selena:hover p {
  opacity: 1;
  transform: perspective(1000px) rotate3d(1, 0, 0, 0deg);
}
figure.effect-terry {
  background: #34495e none repeat scroll 0 0;
}
figure.effect-terry figcaption {
  padding: 1em;
}
figure.effect-terry figcaption::before, figure.effect-terry figcaption::after {
  border-color: #101010;
  border-style: solid;
  content: "";
  height: 200%;
  position: absolute;
  transition: transform 0.35s ease 0s;
  width: 200%;
}
figure.effect-terry figcaption::before {
  border-width: 0 70px 60px 0;
  bottom: 0;
  right: 0;
  transform: translate3d(70px, 60px, 0px);
}
figure.effect-terry figcaption::after {
  border-width: 15px 0 0 15px;
  left: 0;
  top: 0;
  transform: translate3d(-15px, -15px, 0px);
}
figure.effect-terry img, figure.effect-terry p a {
  transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
}
figure.effect-terry img {
  opacity: 0.85;
}
figure.effect-terry h2 {
  bottom: 0;
  left: 0;
  padding: 0.4em 10px;
  position: absolute;
  transform: translate3d(100%, 0px, 0px);
  transition: transform 0.35s ease 0s;
  width: 50%;
}
@media screen and (max-width: 920px) {
  figure.effect-terry h2 {
    font-size: 120%;
    padding: 0.75em 10px;
  }
}
figure.effect-terry p {
  clear: both;
  float: right;
  font-size: 111%;
  text-align: left;
  text-transform: none;
}
figure.effect-terry p a {
  color: #fff;
  display: block;
  margin-bottom: 1em;
  opacity: 0;
  transform: translate3d(90px, 0px, 0px);
}
figure.effect-terry p a:hover, figure.effect-terry p a:focus {
  color: #f3cf3f;
}
figure.effect-terry:hover figcaption::before, figure.effect-terry:hover figcaption::after {
  transform: translate3d(0px, 0px, 0px);
}
figure.effect-terry:hover img {
  opacity: 0.6;
}
figure.effect-terry:hover h2, figure.effect-terry:hover p a {
  transform: translate3d(0px, 0px, 0px);
}
figure.effect-terry:hover p a {
  opacity: 1;
}
figure.effect-terry:hover p a:first-child {
  transition-delay: 0.025s;
}
figure.effect-terry:hover p a:nth-child(2) {
  transition-delay: 0.05s;
}
figure.effect-terry:hover p a:nth-child(3) {
  transition-delay: 0.075s;
}
figure.effect-terry:hover p a:nth-child(4) {
  transition-delay: 0.1s;
}
figure.effect-phoebe {
  background: #675983 none repeat scroll 0 0;
}
figure.effect-phoebe img {
  opacity: 0.85;
  transition: opacity 0.35s ease 0s;
}
figure.effect-phoebe:hover img {
  opacity: 0.6;
}
figure.effect-phoebe figcaption::before {
  /*background: rgba(0, 0, 0, 0) url("../../files/theme/img/triangle2.svg") no-repeat scroll center center / 100% 100%;*/
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  transform: scale3d(5, 2.5, 1);
  transform-origin: 50% 50% 0;
  transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
  width: 100%;
}
figure.effect-phoebe:hover figcaption::before {
  opacity: 0.6;
  transform: scale3d(1, 1, 1);
}
figure.effect-phoebe h2 {
  margin-top: 1em;
  transform: translate3d(0px, 40px, 0px);
  transition: transform 0.35s ease 0s;
}
figure.effect-phoebe:hover h2 {
  transform: translate3d(0px, 0px, 0px);
}
figure.effect-phoebe p a {
  color: #fff;
  display: inline-block;
  font-size: 140%;
  opacity: 0;
  position: relative;
  transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
}
figure.effect-phoebe p a:first-child {
  transform: translate3d(-60px, -60px, 0px);
}
figure.effect-phoebe p a:nth-child(2) {
  transform: translate3d(0px, 60px, 0px);
}
figure.effect-phoebe p a:nth-child(3) {
  transform: translate3d(60px, -60px, 0px);
}
figure.effect-phoebe:hover p a {
  opacity: 1;
  transform: translate3d(0px, 0px, 0px);
}
figure.effect-apollo {
  background: #3498db none repeat scroll 0 0;
}
figure.effect-apollo img {
  opacity: 0.95;
  transform: scale3d(1.05, 1.05, 1);
  transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
}
figure.effect-apollo figcaption::before {
  background: rgba(255, 255, 255, 0.5) none repeat scroll 0 0;
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, 45deg) translate3d(0px, -100%, 0px);
  transition: transform 0.6s ease 0s;
  width: 100%;
}
figure.effect-apollo p {
  border-right: 4px solid #fff;
  bottom: 0;
  margin: 3em;
  max-width: 150px;
  opacity: 0;
  padding: 0 1em;
  position: absolute;
  right: 0;
  text-align: right;
  transition: opacity 0.35s ease 0s;
}
figure.effect-apollo h2 {
  text-align: left;
}
figure.effect-apollo:hover img {
  opacity: 0.6;
  transform: scale3d(1, 1, 1);
}
figure.effect-apollo:hover figcaption::before {
  transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, 45deg) translate3d(0px, 100%, 0px);
}
figure.effect-apollo:hover p {
  opacity: 1;
  transition-delay: 0.1s;
}
figure.effect-kira {
  background: #fff none repeat scroll 0 0;
  text-align: left;
}
figure.effect-kira img {
  transition: opacity 0.35s ease 0s;
}
figure.effect-kira figcaption {
  z-index: 1;
}
figure.effect-kira p {
  font-size: 100%;
  font-weight: 600;
  line-height: 1.5;
  opacity: 0;
  padding: 2.25em 0.5em;
  transform: translate3d(0px, -10px, 0px);
  transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
}
figure.effect-kira p a {
  color: #101010;
  margin: 0 0.5em;
}
figure.effect-kira p a:hover, figure.effect-kira p a:focus {
  opacity: 0.6;
}
figure.effect-kira figcaption::before {
  background: #fff none repeat scroll 0 0;
  content: "";
  height: 3.5em;
  left: 2em;
  position: absolute;
  right: 2em;
  top: 0;
  transform: translate3d(0px, 4em, 0px) scale3d(1, 0.023, 1);
  transform-origin: 50% 0 0;
  transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
  z-index: -1;
}
figure.effect-kira:hover img {
  opacity: 0.5;
}
figure.effect-kira:hover p {
  opacity: 1;
  transform: translate3d(0px, 0px, 0px);
}
figure.effect-kira:hover figcaption::before {
  opacity: 0.7;
  transform: translate3d(0px, 5em, 0px) scale3d(1, 1, 1);
}
figure.effect-steve {
  background: #000 none repeat scroll 0 0;
  overflow: visible;
  z-index: auto;
}
figure.effect-steve::before, figure.effect-steve h2::before {
  background: #000 none repeat scroll 0 0;
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  transition: opacity 0.35s ease 0s;
  width: 100%;
  z-index: -1;
}
figure.effect-steve::before {
  box-shadow: 0 3px 30px rgba(0, 0, 0, 0.8);
  opacity: 0;
}
figure.effect-steve figcaption {
  z-index: 1;
}
figure.effect-steve img {
  opacity: 1;
  transform: perspective(1000px) translate3d(0px, 0px, 0px);
  transition: transform 0.35s ease 0s;
}
figure.effect-steve h2, figure.effect-steve p {
  background: #fff none repeat scroll 0 0;
  color: #2d434e;
}
figure.effect-steve h2 {
  margin-top: 2em;
  padding: 0.25em;
  position: relative;
}
figure.effect-steve h2::before {
  box-shadow: 0 1px 10px rgba(0, 0, 0, 0.5);
}
figure.effect-steve p {
  font-weight: 800;
  margin-top: 1em;
  opacity: 0;
  padding: 0.5em;
  transform: scale3d(0.9, 0.9, 1);
  transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
}
figure.effect-steve:hover::before {
  opacity: 1;
}
figure.effect-steve:hover img {
  transform: perspective(1000px) translate3d(0px, 0px, 21px);
}
figure.effect-steve:hover h2::before {
  opacity: 0;
}
figure.effect-steve:hover p {
  opacity: 1;
  transform: scale3d(1, 1, 1);
}
figure.effect-moses {
  background: rgba(0, 0, 0, 0) linear-gradient(-45deg, #ec65b7 0%, #05e0d8 100%) repeat scroll 0 0;
}
figure.effect-moses img {
  opacity: 0.85;
  transition: opacity 0.35s ease 0s;
}
figure.effect-moses h2, figure.effect-moses p {
  border: 2px solid #fff;
  height: 50%;
  padding: 20px;
  width: 50%;
}
figure.effect-moses h2 {
  height: 50%;
  padding: 20px;
  text-align: left;
  transform: translate3d(10px, 10px, 0px);
  transition: transform 0.35s ease 0s;
  width: 50%;
}
figure.effect-moses p {
  float: right;
  opacity: 0;
  padding: 20px;
  text-align: right;
  transform: translate3d(-50%, -50%, 0px);
  transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
}
figure.effect-moses:hover h2 {
  transform: translate3d(0px, 0px, 0px);
}
figure.effect-moses:hover p {
  opacity: 1;
  transform: translate3d(0px, 0px, 0px);
}
figure.effect-moses:hover img {
  opacity: 0.6;
}
figure.effect-jazz {
  background: rgba(0, 0, 0, 0) linear-gradient(-45deg, #f3cf3f 0%, #f33f58 100%) repeat scroll 0 0;
}
figure.effect-jazz img {
  opacity: 0.9;
}
figure.effect-jazz figcaption::after, figure.effect-jazz img, figure.effect-jazz p {
  transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
}
figure.effect-jazz figcaption::after {
  border-bottom: 1px solid #fff;
  border-top: 1px solid #fff;
  content: "";
  height: 100%;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
  transform: rotate3d(0, 0, 1, 45deg) scale3d(1, 0, 1);
  transform-origin: 50% 50% 0;
  width: 100%;
}
figure.effect-jazz h2, figure.effect-jazz p {
  opacity: 1;
  transform: scale3d(0.8, 0.8, 1);
}
figure.effect-jazz h2 {
  padding-top: 26%;
  transition: transform 0.35s ease 0s;
}
figure.effect-jazz p {
  font-size: 0.85em;
  opacity: 0;
  padding: 0.5em 2em;
  text-transform: none;
}
figure.effect-jazz:hover img {
  opacity: 0.7;
  transform: scale3d(1.05, 1.05, 1);
}
figure.effect-jazz:hover figcaption::after {
  opacity: 1;
  transform: rotate3d(0, 0, 1, 45deg) scale3d(1, 1, 1);
}
figure.effect-jazz:hover h2, figure.effect-jazz:hover p {
  opacity: 1;
  transform: scale3d(1, 1, 1);
}
figure.effect-ming {
  background: #030c17 none repeat scroll 0 0;
}
figure.effect-ming img {
  opacity: 0.9;
  transition: opacity 0.35s ease 0s;
}
figure.effect-ming figcaption::before {
  border: 2px solid #fff;
  bottom: 30px;
  box-shadow: 0 0 0 30px rgba(255, 255, 255, 0.2);
  content: "";
  left: 30px;
  opacity: 0;
  position: absolute;
  right: 30px;
  top: 30px;
  transform: scale3d(1.4, 1.4, 1);
  transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
}
figure.effect-ming h2 {
  margin: 11% 0 10px;
  transition: transform 0.35s ease 0s;
}
figure.effect-ming p {
  opacity: 0;
  padding: 1em;
  transform: scale(1.5);
  transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
}
figure.effect-ming:hover h2 {
  transform: scale(0.9);
}
figure.effect-ming:hover figcaption::before, figure.effect-ming:hover p {
  opacity: 1;
  transform: scale3d(1, 1, 1);
}
figure.effect-ming:hover figcaption {
  background-color: rgba(58, 52, 42, 0);
}
figure.effect-ming:hover img {
  opacity: 0.4;
}
figure.effect-lexi {
  background: rgba(0, 0, 0, 0) linear-gradient(-45deg, #000 0%, #fff 100%) repeat scroll 0 0;
}
figure.effect-lexi img {
  backface-visibility: hidden;
  margin: -10px 0 0 -10px;
  max-width: none;
  opacity: 0.9;
  transform: translate3d(10px, 10px, 0px);
  transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
  width: calc(100% + 10px);
}
figure.effect-lexi figcaption::before, figure.effect-lexi p {
  transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
}
figure.effect-lexi figcaption::before {
  border: 2px solid #fff;
  border-radius: 50%;
  bottom: -100px;
  box-shadow: 0 0 0 900px rgba(255, 255, 255, 0.2);
  content: "";
  height: 300px;
  opacity: 0;
  position: absolute;
  right: -100px;
  transform: scale3d(0.5, 0.5, 1);
  transform-origin: 50% 50% 0;
  width: 300px;
}
figure.effect-lexi:hover img {
  opacity: 0.6;
  transform: translate3d(0px, 0px, 0px);
}
figure.effect-lexi h2 {
  text-align: left;
  transform: translate3d(5px, 5px, 0px);
  transition: transform 0.35s ease 0s;
}
figure.effect-lexi p {
  bottom: 0;
  opacity: 0;
  padding: 0 1.5em 1.5em 0;
  position: absolute;
  right: 0;
  text-align: right;
  transform: translate3d(20px, 20px, 0px);
  width: 140px;
}
figure.effect-lexi:hover figcaption::before {
  opacity: 1;
  transform: scale3d(1, 1, 1);
}
figure.effect-lexi:hover h2, figure.effect-lexi:hover p {
  opacity: 1;
  transform: translate3d(0px, 0px, 0px);
}
figure.effect-duke {
  background: rgba(0, 0, 0, 0) linear-gradient(-45deg, #34495e 0%, #cc6055 100%) repeat scroll 0 0;
}
figure.effect-duke img, figure.effect-duke p {
  transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
}
figure.effect-duke:hover img {
  opacity: 0.1;
  transform: scale3d(2, 2, 1);
}
figure.effect-duke h2 {
  transform: scale3d(0.8, 0.8, 1);
  transform-origin: 50% 100% 0;
  transition: transform 0.35s ease 0s;
}
figure.effect-duke p {
  border: 2px solid #fff;
  bottom: 0;
  font-size: 90%;
  left: 0;
  margin: 20px;
  opacity: 0;
  padding: 30px;
  position: absolute;
  text-transform: none;
  transform: scale3d(0.8, 0.8, 1);
  transform-origin: 50% -100% 0;
}
figure.effect-duke:hover h2, figure.effect-duke:hover p {
  opacity: 1;
  transform: scale3d(1, 1, 1);
}
figure.effect-dexter {
  background: rgba(0, 0, 0, 0) linear-gradient(to bottom, rgba(37, 141, 200, 1) 0%, rgba(104, 60, 19, 1) 100%) repeat scroll 0 0;
}
figure.effect-dexter img {
  transition: opacity 0.35s ease 0s;
}
figure.effect-dexter:hover img {
  opacity: 0.4;
}
figure.effect-dexter figcaption::after {
  border: 7px solid #fff;
  bottom: 30px;
  content: "";
  height: calc(50% - 30px);
  left: 30px;
  position: absolute;
  right: 30px;
  transform: translate3d(0px, -100%, 0px);
  transition: transform 0.35s ease 0s;
}
figure.effect-dexter:hover figcaption::after {
  transform: translate3d(0px, 0px, 0px);
}
figure.effect-dexter figcaption {
  padding: 3em;
  text-align: left;
}
figure.effect-dexter p {
  bottom: 60px;
  left: 60px;
  opacity: 0;
  position: absolute;
  right: 60px;
  transform: translate3d(0px, -100px, 0px);
  transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
}
figure.effect-dexter:hover p {
  opacity: 1;
  transform: translate3d(0px, 0px, 0px);
}

/* ===========================================
 * Tabs
 * ======================================== */

.tabs.grid16 {
  margin-left: 0%;
  margin-right: 0%;
}
.tabs ul.horizontal {
  display: inline-block;
  margin-bottom: 0;
}
.tabs ul.horizontal li.active {
  background-color: #fff;
  border-left: 1px solid #e4e4e4;
  border-radius: 2px;
}
.tabs ul.horizontal li {
  cursor: pointer;
  float: left;
  line-height: 38px;
  list-style-type: none;
  margin: 0;
  padding: 0 16px;
  position: relative;
}
.tabs ul li a::before {
  font-family: FontAwesome;
  margin-right: 8px;
}
.tabs ul.horizontal li a {
  display: block;
  list-style-type: none;
  position: relative;
  text-decoration: none;
}
.tabs ul li a {
  cursor: pointer;
  color: #ffffff;
}
.tabs ul li.active a {
  color: #000033;
}
.tabs ul.horizontal li {
  background-color: #000033;
  border-left: 1px solid #e4e4e4;
  border-top: 1px solid #e4e4e4;
  cursor: pointer;
  float: left;
  line-height: 38px;
  list-style-type: none;
  margin: 0;
  padding: 0 16px;
  position: relative;
}
.tabs>DIV {
  background-color: #fff;
  border: 1px solid #e4e4e4;
  margin: -9px 0 0 !important;
  padding: 30px 30px 20px;
}

/* ===========================================
 * Mobile Navigation
 * ======================================== */


/*
  jQuery.mmenu themes extension CSS
*/

html.mm-opened.mm-light .mm-page {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}
.mm-list {
  font: 22px/1.46 'Lora';
  font-weight: 400;
}
.mm-menu.mm-light {
  background: #000033;
  color: #ffffff;
}
.mm-menu.mm-light .mm-list>li:after {
  border-color: rgba(0, 0, 0, 0.1);
}
.mm-menu.mm-light .mm-list>li>a.mm-subclose {
  background: rgba(255, 255, 255, 0.6);
  color: rgba(0, 0, 0, 0.3);
}
.mm-menu.mm-light .mm-list>li>a.mm-subopen:after, .mm-menu.mm-light .mm-list>li>a.mm-subclose:before {
  border-color: rgba(0, 0, 0, 0.3);
}
.mm-menu.mm-light .mm-list>li>a.mm-subopen:before {
  border-color: rgba(0, 0, 0, 0.1);
}
.mm-menu.mm-light .mm-list>li.mm-selected>a:not(.mm-subopen), .mm-menu.mm-light .mm-list>li.mm-selected>span {
  background: #000033;
}
.mm-menu.mm-light .mm-list>li.mm-label {
  background: rgba(0, 0, 0, 0.03);
}
.mm-menu.mm-light.mm-vertical .mm-list li.mm-opened>a.mm-subopen, .mm-menu.mm-light.mm-vertical .mm-list li.mm-opened>ul {
  background: rgba(0, 0, 0, 0.03);
}
.mm-menu.mm-light .mm-buttonbar {
  border-color: rgba(0, 0, 0, 0.6);
  background: #000033;
}
.mm-menu.mm-light .mm-buttonbar>* {
  border-color: rgba(0, 0, 0, 0.6);
}
.mm-menu.mm-light .mm-buttonbar>input:checked+label {
  background: rgba(0, 0, 0, 0.6);
  color: #000033;
}
.mm-menu.mm-light label.mm-check:before {
  border-color: rgba(0, 0, 0, 0.6);
}
.mm-menu.mm-light em.mm-counter {
  color: rgba(0, 0, 0, 0.3);
}
.mm-menu.mm-light .mm-footer {
  border-color: rgba(0, 0, 0, 0.1);
  color: rgba(0, 0, 0, 0.3);
}
.mm-menu.mm-light .mm-header {
  border-color: rgba(0, 0, 0, 0.1);
  color: rgba(0, 0, 0, 0.3);
}
.mm-menu.mm-light .mm-header .mm-prev:before, .mm-menu.mm-light .mm-header .mm-next:after, .mm-menu.mm-light .mm-header .mm-close:after {
  border-color: rgba(0, 0, 0, 0.3);
}
.mm-menu.mm-light .mm-list li.mm-label>div>div {
  background: rgba(0, 0, 0, 0.03);
}
.mm-menu.mm-light .mm-search input {
  background: rgba(0, 0, 0, 0.1);
  color: rgba(0, 0, 0, 0.6);
}
.mm-menu.mm-light .mm-noresultsmsg {
  color: rgba(0, 0, 0, 0.3);
}
.mm-menu.mm-light label.mm-toggle {
  background: rgba(0, 0, 0, 0.1);
}
.mm-menu.mm-light label.mm-toggle:before {
  background: #000033;
}
.mm-menu.mm-light input.mm-toggle:checked~label.mm-toggle {
  background: #4bd963;
}

/* ===========================================
 * @media only screen and (max-width: 1160px)
 * ======================================== */

@media only screen and (max-width: 1160px) {
  /* Segment16*/
  .mod_article.segment16 .ce_text.teaserbox {
    min-height: 620px;
  }
}

/* ===========================================
 * @media only screen and (max-width: 1024px)
 * ======================================== */

@media only screen and (max-width: 1024px) {
  #left {
    margin-left: 0;
    right: 0;
  }
  #main, #left, #right {
    float: none;
    width: 100%;
  }
  #main, #left, #right {
    position: relative;
  }
  #container {
    padding-left: 0;
    padding-right: 0;
  }
  #mainmenu {
    display: none;
  }
  /* Header01 */
  #logo {
    margin: 5% auto 0% auto;
    float: none;
  }
  /* Kontaktdaten */
  .kontaktdaten_oben02 {
    display: none;
  }
  .kontaktbox-mobile {
    display: block;
  }
  /* dk_mmenu */
  .dk_menu {
    display: table-cell;
    text-align: right;
    vertical-align: middle;
    padding-left: 10px;
  }
  .dk_menu i {
    margin-right: 0
  }
  .dk_menu a.dk_mobilmenu {
    width: 44px;
    height: 44px;
    float: right;
    display: block;
    text-align: center;
    background-color: #$color;
    font-size: 26px;
    line-height: 44px;
    text-decoration: none;
    color: #fff
  }
  /* Videoplayer Header*/
  .slide01 .videoinfo {
    width: 440px;
    height: 254px;
    right: 8%;
    top: 12%;
    border: 5px solid #ffffff;
  }
  .slide01 .button {
    top: 70%;
    right: 19%;
  }
  .slide01 .button p a {
    font-size: 15px;
  }
}

/* ===========================================
 * @media only screen and (max-width: 887px)
 * ======================================== */

@media only screen and (max-width: 887px) {
  /* Segment16*/
  .mod_article.segment16 .ce_text.teaserbox {
    min-height: 650px;
  }
}

/* ===========================================
 * @media only screen and (max-width: 768px)
 * ======================================== */

@media only screen and (max-width: 768px) {
  /* Basic */
  .mobil_no {
    display: none !important
  }
  .home .mod_article {
    text-align: center;
  }
  /* Grid */
  *[class*="grid"] {
    float: none !important;
    display: block !important;
    width: auto !important
  }
  *[class*="offset"] {
    margin-left: 1% !important
  }
  /* Layout */
  #wrapper {
    width: 100%
  }
  #footer .inside {
    padding-right: 30px;
    padding-left: 30px
  }
  .mod_article *[class*="ce_"], .mod_article *[class*="mod_"] {
    margin-right: 0;
    margin-left: 0
  }
  #left .inside {
    margin-left: 0;
    padding-right: 30px;
    padding-left: 30px;
  }
  #right .inside {
    margin-right: 0;
    margin-left: 0;
    padding-right: 30px;
    padding-left: 30px
  }
  #mainmenu {
    display: none
  }
  * {
    -moz-text-size-adjust: none;
    background-repeat: no-repeat;
    border: 0 none;
    box-sizing: border-box;
    margin: 0;
    outline: 0 none;
    padding: 0;
  }
  *::-moz-selection {
    background-color: #00a5cb;
    color: #fff;
  }
  i {
    margin-right: 4px;
  }
  * {
    background-repeat: no-repeat;
    border: 0 none;
    box-sizing: border-box;
    outline: 0 none;
    padding: 0;
  }
  html {
    -moz-text-size-adjust: none;
  }
  /* dk_mmenu */
  .nav-mobile {
    position: fixed;
    top: 0px;
  }
  .wrapper-logo-contact02 {
    margin-top: 60px;
  }
  .kontaktbox-mobile {
    margin-bottom: 20px;
  }
  /* Videoplayer Header*/
  .slide01 .videoinfo {
    width: 320px;
    height: 185px;
    right: 8%;
    top: 12%;
    border: 3px solid #ffffff;
  }
  .slide01 .button {
    top: 68%;
    right: 19%;
  }
  .slide01 .button p a {
    font-size: 14px;
  }
  /* Tabs */
  .tabs ul.horizontal {
    width: 100%;
    display: block
  }
  .tabs ul.horizontal li {
    float: none;
    margin: 0 0 6px
  }
  .tabs>DIV {
    margin-top: 0 !important
  }
  .tabs.horizontal.tab2 li, .tabs.horizontal.tab3 li, .tabs.horizontal.tab4 li {
    width: 100%
  }
  .tabs.vertical ul.vertical {
    width: 100%;
    float: none
  }
  .tabs.vertical ul.vertical li {
    border-right: 1px solid #e4e4e4
  }
  /* Breadcrumb Navigation */
  .mod_breadcrumb, #main .mod_breadcrumb {
    display: none
  }
  /* Bilder */
  .image_container.float_left, .image_container.float_right {
    float: none;
    margin-right: 0;
    margin-left: 0;
    margin-bottom: 20px;
    float: none !important;
  }
  .image_container img {
    /*width:100%;*/
    height: auto;
    /*max-width:100%;*/
    vertical-align: middle;
  }
  .boxen-start .image_container img {
    width: 100%;
    max-width: 100%;
  }
  /* Formular */
  button.submit[type="submit"] {
    background: -moz-linear-gradient(top, #$color, #$color);
    background: -webkit-linear-gradient(top, #$color, #$color);
    background: -o-linear-gradient(top, #$color, #$color);
    background: -ms-linear-gradient(top, #$color, #$color);
    background: linear-gradient(to bottom, #$color, #$color);
    -pie-background: linear-gradient(top, #$color, #$color);
    behavior: url('assets/css3pie/1.0.0/PIE.htc')
  }
  .ce_form [class*="grid"] {
    width: 100%
  }
  .ce_form [class*="grid"] input[class*="grid"], .ce_form [class*="grid"] select[class*="grid"], .ce_form [class*="grid"] textarea[class*="grid"] {
    width: 100% !important
  }
  /* Blog*/
  .mod_newslist .layout_latest {
    width: 100%;
  }
  /* Segment04*/
  .mod_article.segment04.button a {
    margin-bottom: 20px;
  }
  #main .inside .mod_article.segment04 .inside {
    padding-bottom: 20px;
  }
  /* Segment06*/
  .mod_article.segment06 .float-left {
    float: none;
  }
  .mod_article.segment06 .image_container.float_right {
    margin-top: 0px;
    margin-left: 0%;
  }
  .mod_article.segment06 .button02 p {
    margin-right: 0px;
  }
  /* Segment07*/
  .mod_article.segment07 .float-left {
    float: none;
  }
  .mod_article.segment07 .image_container.float_left {
    margin-top: 0px;
    margin-right: 0%;
  }
  .mod_article.segment07 .button02 p {
    margin-right: 0px;
  }
  /* Segment13*/
  .mod_article.segment13 {
    text-align: left;
  }
  /* Segment15*/
  .mod_article.segment15.button a {
    margin-bottom: 40px;
  }
  #main .inside .mod_article.segment15 .inside {
    padding-bottom: 0px;
  }
  /* Segment16*/
  .mod_article.segment16 .ce_text.teaserbox {
    margin-bottom: 30px;
    min-height: 100px;
  }
  .mod_article.segment16 .ce_text.last.teaserbox {
    margin-bottom: 0px;
  }
  /* Segment22*/
  #main .inside .mod_article.segment22 .mod_newslist p.info, #main .inside .mod_article.segment22 .mod_newsreader p.info {
    margin: 20px auto;
  }
  .mod_article.segment22 .mod_newslist .layout_latest {
    border-bottom: 1px solid #e9e9e9;
  }
}

/* ===========================================
 * @media only screen and (max-width: 736px)
 * ======================================== */

@media only screen and (max-width: 736px) {
  /* Button */
  .button-anmeldung {
    margin-top: 20px;
  }
  /* Accordion */
  .ce_accordion .toggler::before {
    height: 12px;
    margin-left: 5px;
    margin-right: 5px;
    width: 12px;
  }
  .ce_accordion .toggler {
    font-size: 12px;
  }
}

/* ===========================================
 * @media only screen and (max-width: 666px)
 * ======================================== */

@media only screen and (max-width: 666px) {
  .kontaktdaten_oben {
    padding-top: 0px;
  }
  .leftline h1:after, .leftline h2:after, .leftline h3:after, .leftline h4:after, .leftline h5:after, .leftline h6:after {
    width: 90%;
  }
  h1.leftline:after, h2.leftline:after, h3.leftline:after, h4.leftline:after, h5.leftline:after, h6.leftline:after {
    width: 90%;
  }
  /* Videoplayer Header*/
  .slide01 .videoinfo {
    width: 200px;
    height: 115px;
    right: 8%;
    top: 12%;
    border: 3px solid #ffffff;
  }
  .slide01 .button {
    display: none
  }
}

/* ===========================================
 * @media only screen and (max-width: 550px)
 * ======================================== */

@media only screen and (max-width: 550px) {
  /* Logo */
  #logo {
    width: 90%;
  }
}

/* ===========================================
 * @media only screen and (max-width: 450px)
 * ======================================== */

@media only screen and (max-width: 450px) {
  .mod_rocksolid_slider .rsts-prev, .mod_rocksolid_slider .rsts-next, .mod_rocksolid_slider .rsts-nav {
    display: none;
  }
  .home h1 {
    font-size: 30px !important;
  }
  .home h2 {
    font: 21px/1.4 'Lora', sans-serif!important;
  }
  .home h3 {
    font-size: 20px !important;
  }
  #main .inside .mod_article.segment19 .inside {
    padding-top: 30px;
  }
}

/* ===========================================
 * @media only screen and (max-width: 320px)
 * ======================================== */

@media only screen and (max-width: 320px) {
  .slide01 .button {
    display: none
  }
}
.map {
  max-width: 550px;
}
