/*=====================================
                OMU CSS 
======================================*/
.page-header {
    display: none;
}

/*#sp-header,
.sppb-btn {
    display: none;
}*/

@font-face { 
  font-family: 'Quicksand', sans-serif;
  src: url('../fonts/Quicksand-Regular.ttf') 
  format('truetype'); 
}

body {
  font-family: 'Quicksand', sans-serif;
}
 
h1,
h2,
h3 {
    font-family: 'Quicksand', sans-serif;
    text-transform: uppercase !important;
}

.h2, h2 {
    font-size: 1.7rem;
}

.h3, h3 {
    font-size: 1.5rem;
}

.no-box .sppb-carousel-pro-text {
	display: none;
}

@media (max-width: 1200px) {
.h2, h2 {
    font-size: 1.4rem;
}

.h3, h3 {
    font-size: 1.3rem;
}
}

@media (max-width: 767px) {
.h3, h3 {
    font-size: 1.35rem;
}
}

/*=====================================
                Pagebuilder 
======================================*/
.body-innerwrapper {
    position: relative;
}

.sppb-addon .sppb-addon-title {
	margin: 0 !important;
	padding: 15px 0px !important;
}

.no-caption .sppb-carousel-pro-text {
	display: none;
}


.dnb-feature-box {
    color: #4A4A4A;
}

.dnb-feature-box a {
    color: #4A4A4A;
}

.dnb-feature-box img {
    font-size: 40px;
    margin-bottom: 20px;
    border: solid;
    border-radius: 100%;
    width: 90px;
    height: 90px;
    padding: 10px;
    line-height: 82px;
    transition: 0.5s;
    -moz-transition: 0.5s;
    -webkit-transition: 0.5s;
}

.dnb-feature-box img:hover {
    color: #fff;
    background: #cbcbcb;
    border: solid #4A4A4A;
}

.dnb-feature-box-btn {
    color: #4A4A4A;
    border: solid #4A4A4A 3px;
}

.dnb-feature-box-btn:hover {
    color: #fff;
    background: #4A4A4A;
}

/*=====================================
                Header 
======================================*/
#sp-top-bar {
    background: #a54ab3;
    color: #fff;
    padding: 10px 50px 10px 50px;
    font-size: 19px;
}

#sp-top-bar a {
    color: #fff;
}

#sp-top-bar .sp-contact-time .fa-clock-o{
    margin-right: 5px;
}

#sp-logo .row {
	position: relative;
}

#sp-logo {
z-index: 2;
width: 100%;
z-index: 2;
width: 100%;
position: absolute;
top: 25px;
background: rgba(255,255,255,1);
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 50%, rgba(255,255,255,0.8) 75%, rgba(255,255,255,0.6) 100%);
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 50%, rgba(255,255,255,0.8) 75%, rgba(255,255,255,0.6) 100%);
background: linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 50%, rgba(255,255,255,0.8) 75%, rgba(255,255,255,0.6) 100%);
}

.logo-image {
    height: 190px !important;
    margin: 0 auto;
    padding: 25px 0;
    position: relative;
    display: block !important;
}

#sp-header {
    position: absolute;
    width: 100%;
    top: 240px;
    box-shadow: none;
    transition: 0.5s;
	background: rgba(255,255,255,1);
	background: -webkit-linear-gradient(rgba(255,255,255,0.6) 0%, rgba(255,255,255,0.5) 100%);
	background: -o-linear-gradient(rgba(255,255,255,0.6) 0%, rgba(255,255,255,0.5) 100%);
	background: linear-gradient(rgba(255,255,255,0.6) 0%, rgba(255,255,255,0.5) 100%);
}

#sp-header.header-sticky {
    top: 0px;
    background: rgba(255, 255, 255, 0.75);
    left: 0px;
    right: 0px;
}

.sp-contact-info {
    text-align: right;
}

#offcanvas-toggler.offcanvas-toggler-right {
    margin-right: 50px;
}

@media (max-width: 1200px) {
#sp-top-bar {
    font-size: 15px;
}

#sp-logo {
    top: 34px;
}

#sp-header {
    top: 258px;
}
}

@media (max-width: 990px) {

}

@media (max-width: 767px) {
#sp-top-bar {
    text-align: center;
}

.sp-contact-info {
    text-align: center;
}

#sp-logo {
    top: 45px;
}

.logo-image {
    height: 110px !important;
    padding: 15px 0;
}

#sp-header {
    top: 200px;
}
}

@media (max-width: 560px) {
#sp-logo {
    top: 50px;
}

#sp-header {
    top: 210px;
}
}

@media (max-width: 370px) {
#sp-logo {
    top: 65px;
}

#sp-header {
    top: 240px;
}
}
/*=====================================
                Navigation 
======================================*/
.sp-megamenu-parent > li > a {
    color: #424242;
    font-family: 'Quicksand', sans-serif;
    font-size: 22px;
    text-transform: uppercase;
/*    text-shadow: 1px 1px 0px #000;*/
}

.sp-megamenu-parent > li.active > a, 
.sp-megamenu-parent > li.active:hover > a,
.sp-megamenu-parent > li > a:hover, 
.sp-megamenu-parent > li:hover > a {
    color: #a54ab3 !important;
}

#sp-header.header-sticky .sp-megamenu-parent > li > a  {
    color: #000;
    text-shadow: none;
}

#sp-header.header-sticky .sp-megamenu-parent > li.active > a, 
#sp-header.header-sticky .sp-megamenu-parent > li.active:hover > a,
#sp-header.header-sticky .sp-megamenu-parent > li > a:hover, 
#sp-header.header-sticky .sp-megamenu-parent > li:hover > a {
    color: #a54ab3 !important;
    font-family: 'Quicksand', sans-serif;
}

.sp-megamenu-parent {
    float: none;
    position: relative;
    text-align: center;
}

.menu li {
display: block;
float: left;
margin-right: 15px;
}

@media (max-width: 767px) {
.offcanvas-menu .offcanvas-inner .sp-module ul > li {
    width: 100%;
}
}
/*=====================================
            offcanvas Nav
======================================*/

.offcanvas-menu .offcanvas-inner .sp-module ul > li a, 
.offcanvas-menu .offcanvas-inner .sp-module ul > li span {
    margin-top: 6px;
    font-size: 1.4em;
}

.offcanvas-menu .menu > li{
    margin-top: 14px !important;

}

.offcanvas-menu .offcanvas-inner .sp-module ul > li ul {
    margin-left: 15px;
}
.offcanvas-menu .offcanvas-inner .sp-module ul > li ul li a {
    font-size: 1.2em;
}
.offcanvas-menu .offcanvas-inner .menu-child{
    display: block !important;
}

.offcanvas-menu .offcanvas-inner .menu-toggler{
    display: none !important;
}

/*=====================================
                Slideshow Top
======================================*/
.slideshow-top .slideshow {
    position: relative;
}

/*.sppb-carousel-pro-text {
    position: absolute;
	right: 10%;
	left: 60%;
    background: rgba(255, 255, 255, 0.75);
    top: 0;
    padding: 25px 25px;
    color: rgb(66, 66, 66);
}*/

.sppb-carousel-pro-text h2 {
    color: rgb(66, 66, 66);
    margin: 0px 0px 10px 0px;
    font-size: 2.3rem !important;
}

.slideshow-top .sppb-carousel-pro-text .sppb-btn {
    border-radius: 0px;
    border: solid rgb(66, 66, 66) 3px;
    color: rgb(66, 66, 66);
    box-shadow: none;
    margin-top: 25px;	
}

@media (max-width: 1600px) {
.sppb-carousel-pro-text {
	right: 0%;
	left: 55%;
}
}

@media (max-width: 1200px) {
.slideshow-top .sppb-carousel-pro-text h2 {
    font-size: 1.3rem !important;
}
}

@media (max-width: 990px) {
.slideshow-top .sppb-carousel-pro-text {
    display: none;
}
}

@media (max-width: 560px) {
.slideshow-top {
	padding-top: 90px;
}

.sppb-carousel-control {
	display: none;
}
}

/*=====================================
                Slideshow Angebote
======================================*/
.slideshow-angebote .slideshow {
    position: relative;
}

.slideshow-angebote .sppb-carousel-inner > .sppb-item {
    padding: 0px;
}

/*.slideshow-angebote .sppb-carousel-pro-text {
    position: absolute;
	right: 10%;
	left: 50%;
    top: 0;
    padding: 7.5% 50px 0px 100px;
}

.slideshow-angebote .sppb-carousel-pro-text h2 {
    margin: 0px 0px 10px 0px;
    font-size: 30px;
}*/

.slideshow-angebote .sppb-carousel-pro-text .sppb-btn {
    border-radius: 0px;
    box-shadow: none;
    margin-top: 25px;	
	background: none;
}

.slideshow-angebote .sppb-carousel-pro-text .sppb-btn:hover {
    border-radius: 0px;
    box-shadow: none;
    margin-top: 25px;	
	color: #4A4A4A;
	border: solid #fff 3px;
	background: #fff !important;
	text-shadow: none;
}

.slideshow-angebote .sppb-text-right {
	width: 50%;
}

.slideshow-angebote .sppb-text-right img {
	width: 100%;
}

@media (max-width: 767px) {
.slideshow-angebote .sppb-carousel-pro-text {
    display: none;
}
}

/*=====================================
                Buttons 
======================================*/
.sppb-btn {
	border-radius: 0px;
}

.sppb-btn,
.slideshow-top .slideshow-btn,
.btn-dnb,
.slideshow-top .sppb-carousel-pro-text .sppb-btn {
    border-radius: 0px;
    border: solid rgb(66, 66, 66) 3px;
    color: rgb(66, 66, 66);
    box-shadow: none;
    margin-top: 5px;	
}

.overview-col .slideshow-btn,
.btn-dnb-white {
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.7);
    border: solid #fff 3px;
}

.slideshow-top .sppb-carousel-pro-text .sppb-btn:hover,
.slideshow-btn:hover, 
.sppb-carousel-pro-text .sppb-btn:hover,
.btn-dnb:hover,
.btn-dnb-white:hover {
  box-shadow: none;
  margin-top: 5px;	
	color: #fff;
	border: solid #4A4A4A 3px;
	background: #4A4A4A !important;
}


/*=====================================
                Button Down
======================================*/
.demo a {
  position: absolute;
  bottom: 150px;
  left: 50%;
  z-index: 2;
  display: inline-block;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  color: #fff;
  font : normal 400 20px/1 'Josefin Sans', sans-serif;
  letter-spacing: .1em;
  text-decoration: none;
  transition: opacity .3s;
}
.demo a:hover {
  opacity: .5;
}

#section05 a {
  padding-top: 70px;
}
#section05 a span {
  position: absolute;
  top: 0;
  left: 50%;
  width: 24px;
  height: 24px;
  margin-left: -12px;
  border-left: 1px solid #fff;
  border-bottom: 1px solid #fff;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-animation: sdb05 1.5s infinite;
  animation: sdb05 1.5s infinite;
  box-sizing: border-box;
}
@-webkit-keyframes sdb05 {
  0% {
    -webkit-transform: rotate(-45deg) translate(0, 0);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-45deg) translate(-20px, 20px);
    opacity: 0;
  }
}
@keyframes sdb05 {
  0% {
    transform: rotate(-45deg) translate(0, 0);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    transform: rotate(-45deg) translate(-20px, 20px);
    opacity: 0;
  }
}

@media (max-width: 990px) {
.demo {
	display: none;
}
}
/*=====================================
                Startseite 
======================================*/
/*.overview-col {
    padding: 100px 0;
}

.overview-col h2 {
    color: #fff;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.7);
    font-size: 33px;
}*/

.overview-col {
    padding: 0px;
    position: relative;
}

.overview-col .sppb-addon-single-image-container,
.overview-col-img img {
	width: 100%;
}

.overview-col-heading {
    position: absolute;
    top: 33%;
    width: 100%;
    z-index: 3;
}

.overview-col h2 {
    color: #fff;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.7);
}

.overview-col-btn {
    position: absolute;
    top: 75%;
    opacity: 0;
    z-index: 3;
    top: 300px;
	left: 50%;
	transition: 0.5s;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-webkit-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
}

.hovereffect {
	opacity: 1;
	top: 55%;
}

@media (max-width: 767px) {
.overview-col-heading {
    top: 20%;
}

.overview-col-btn {
    top: 55%;
    opacity: 1;
}
}

/*=====================================
                Marken Slider 
======================================*/
.djslider-default ul.djslider-in > li img{
/*    height: auto !important;*/
width: 100% !important;
height: auto !important;
}

.djslider-default ul.djslider-in > li {
    position: relative;
}

@media (max-width: 767px) {
.djslider-default.img-vcenter img.dj-image {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}
}

/* ==========================================================================
                            Onlineshop Einbindung                                   
========================================================================== */
.shopartikel {
	color: #fff;
}

.shopartikel .sppb-feature-box-title {
	padding-top: 15px;
}

.shopartikel a {
	color: #fff;
}

.shopartikel-preis {
    font-size: 25px;
    font-weight: 600;
    color: #fff;
    position: absolute;
    top: 215px;
    right: -10px;
    background: red;
    padding: 0px 15px;
}

.shopartikel .btn-dnb {
	margin-top: 0px;
}

/* ==========================================================================
                            Kategorieseite                                   
========================================================================== */

.cat-row a h2 {
	color: #4A4A4A;
	padding: 100px 50px 0px 0px;
	text-align: left;
}

.three-pic-row .sppb-addon-single-image-container,
.three-pic-row img {
	width: 100%;
}

.bg-grey {
	background: #f6f6f6;
	color: #666;
	padding: 15px;
}

@media (max-width: 990px) {
.cat-row {
	padding: 15px !important;
	margin: 0px !important;
}

.cat-row .sppb-column-addons div{
	margin: 0px !important;
	padding: 0px !important;
}

.cat-row a h2,
.cat-row h2 {
	padding: 25px 0px 0px 0px !important;
}

.cat-row .sppb-col-md-7,
.cat-row .sppb-col-md-5 {
	min-height: 300px;
}
}

@media (max-width: 767px) {
.cat-row .sppb-col-md-7,
.cat-row .sppb-col-md-5 {
	min-height: 200px;
}
}

/* ==========================================================================
                            Single Page                                   
========================================================================== */
.single-page a h2 {
	color: #4A4A4A;
	padding: 100px 50px 0px 0px;
	text-align: left;
}

.three-pic-row .sppb-addon-single-image-container,
.three-pic-row img {
	width: 100%;
}

.bg-grey {
background: #f6f6f6;
color: #666;
}

@media (max-width: 990px) {
.single-page .sppb-container-inner {
	padding: 15px !important;
	margin: 0px !important;
}

.single-page .sppb-section {
	margin: 0px !important;
	padding: 0px !important;
}

.single-page .sppb-column-addons div{
	margin: 0px !important;
	padding: 0px !important;
}

.single-page a h2,
.single-page h2 {
	padding: 25px 0px 0px 0px !important;
}

.single-page .sppb-col-md-7,
.single-page .sppb-col-md-5 {
	min-height: 300px;
}
}

@media (max-width: 767px) {
.single-page .sppb-col-md-7,
.single-page .sppb-col-md-5 {
	min-height: 200px;
}
}

/* ==========================================================================
                            Blog                                   
========================================================================== */
body.view-article,
body.layout-blog {
	background: #424242;
}

.article,
.article-details,
.article-list .article {
    margin-bottom: 30px;
    padding: 20px;
    border: 1px solid #f5f5f5;
    border-radius: 3px;
    background: #fff;
}

.article-details {
    margin-top: 150px;
}

/* ==========================================================================
                            Kontaktseite                                   
========================================================================== */
.contact-details a {
	color: #fff;
}

/* ==========================================================================
                            Social Media Buttons                                   
========================================================================== */
.sidebar-btn1 {
top: 250px;
position: fixed;
z-index: 5;
width: 85px;
height: 45px;
border-radius: 10px;
left: -40px;
color: #252525;
transition: left 0.6s ease 0s;
background: #EFEFEF none repeat scroll 0% 0%;
box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.5) inset, 0px 3px 2px -1px rgba(0, 0, 0, 0.5), 0px 12px 20px -10px #000;
}

.sidebar-btn1 a {
color: #000;
}

.sidebar-btn1:hover {
left: -10px;
color: #096098;
}

.sidebar-btn2 {
top: 305px;
position: fixed;
z-index: 5;
width: 85px;
height: 45px;
border-radius: 10px;
color: #252525;
left: -40px;
transition: left 0.6s ease 0s;
background: #EFEFEF none repeat scroll 0% 0%;
box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.5) inset, 0px 3px 2px -1px rgba(0, 0, 0, 0.5), 0px 12px 20px -10px #000;
}

.sidebar-btn2 a {
color: #000;
}

.sidebar-btn2:hover {
left: -10px;
color: #3A5795;
}

.sidebar-btn3 {
top: 360px;
position: fixed;
z-index: 5;
width: 85px;
height: 45px;
background: #000;
border-radius: 10px;
color: #252525;
left: -40px;
transition: left 0.6s ease 0s;
background: #EFEFEF none repeat scroll 0% 0%;
box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.5) inset, 0px 3px 2px -1px rgba(0, 0, 0, 0.5), 0px 12px 20px -10px #000;
}

.sidebar-btn3 a {
color: #000;
}
.sidebar-btn3:hover {
left: -10px;
color: #55ACEE;
}

.sidebar-btn4 {
top: 415px;
position: fixed;
z-index: 5;
width: 85px;
height: 45px;
background: #000;
border-radius: 10px;
color: #252525;
left: -40px;
transition: left 0.6s ease 0s;
background: #EFEFEF none repeat scroll 0% 0%;
box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.5) inset, 0px 3px 2px -1px rgba(0, 0, 0, 0.5), 0px 12px 20px -10px #000;
}

.sidebar-btn4 a {
color: #000;
}
.sidebar-btn4:hover {
left: -10px;
color: #DD4B39;
}

.sidebar-btn5 {
top: 470px;
position: fixed;
z-index: 5;
width: 85px;
height: 45px;
background: #000;
border-radius: 10px;
color: #252525;
left: -40px;
transition: left 0.6s ease 0s;
background: #EFEFEF none repeat scroll 0% 0%;
box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.5) inset, 0px 3px 2px -1px rgba(0, 0, 0, 0.5), 0px 12px 20px -10px #000;
}

.sidebar-btn5 a {
color: #000;
}
.sidebar-btn5:hover {
left: -10px;
color: #CD2129;
}

.sidebar-btn6 {
top: 525px;
position: fixed;
z-index: 5;
width: 85px;
height: 45px;
background: #000;
border-radius: 10px;
color: #252525;
left: -40px;
transition: left 0.6s ease 0s;
background: #EFEFEF none repeat scroll 0% 0%;
box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.5) inset, 0px 3px 2px -1px rgba(0, 0, 0, 0.5), 0px 12px 20px -10px #000;
}

.sidebar-btn6 a {
color: #000;
}
.sidebar-btn6:hover {
left: -10px;
color: #DD2523;
}

@media (max-width: 767px){
.sidebar-btn1 {
top: 100px;
}
.sidebar-btn2 {
top: 155px;
}
.sidebar-btn3 {
display: none;
}
.sidebar-btn4 {
display: none;
}
.sidebar-btn5 {
display: none;
}
.sidebar-btn6 {
display: none;
}
}

.sidebar-icon {
padding-top: 8px;
padding-right: 10px;
}

/*.sidebar-btn {
  display:none;
}*/

.sidebar-buttons {
  min-height:1px;
}

@media (max-width: 767px) {
  .sidebar-btn1,
  .sidebar-btn2,
  .sidebar-btn3,
  .sidebar-btn4,
  .sidebar-btn5,
  .sidebar-btn6,
  .sidebar-buttons {
    display: none;
  }
}


/*=====================================
                Footer 
======================================*/
#sp-footer {
	padding: 0px;
	margin: 0px;
    text-transform: uppercase;
}

#sp-footer label {
    min-width: 75px;
    margin-bottom: 0px;
}

.greybox1,
.greybox2,
.magenta-box  {
	padding: 50px;
    font-size: 1.4em;
}

.greybox1 h3,
.greybox2 h3,
.magenta-box h3 {
    margin-bottom: 20px;
}

.greybox1 .btn-dnb,
.greybox2 .btn-dnb,
.magenta-box .btn-dnb {
    margin-bottom: 15px;
    border-color: #fff;
    color: #fff !important;
    margin: 5px 0px 0px 0px;
}

.greybox1 {
	background: #424242;
	color: #fff;
}

.greybox2 {
	background: #f4f4f4;
	color: #000;
}

.magenta-box {
	background-color: #a54ab3;
	color: #fff;
}

#sp-footer a, #sp-bottom a {
    color: #a54ab3;
}

#sp-footer a:hover, #sp-bottom a:hover, #sp-footer a:active, #sp-bottom a:active, #sp-footer a:focus, #sp-bottom a:focus {
    color: #000;
}

#sp-credits {
	background: #0e0e0e;
	color: #fff;
	padding: 25px 50px;
}

#sp-credits a {
	color: #fff;
}

@media (max-width: 767px) {
.greybox2:first-child {
	padding: 50px 50px 0px 50px;
}
}
