/* Eigenes CSS für Burgleben.de - Schlossvilla Derenburg */
body {background-color: #0a362c;}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
	font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";
    font-weight: bold;
    font-style: normal;
	color: #d7b36b;
}

#sp-logo-centered {
    background-color: #05342b;
}


#sp-header {
    background-color: #d7b36b;
    color: #101319;
	box-shadow: 0 2px 3px rgba(0, 0, 0, 0.5);
	z-index: 5;
}
#sp-header #sp-menu .sp-megamenu-parent >li >a, #sp-header #sp-menu .sp-megamenu-parent >li.sp-has-child>a {
	border-Top: 2px solid #d7b36b;
}

#sp-header #sp-menu .sp-megamenu-parent >li >a:hover, #sp-header #sp-menu .sp-megamenu-parent >li.sp-has-child>a.hover {
	background-color: #0a362c;	
	border-Top: 2px solid #d7b36b;
	transition: color 1000ms border 1000ms;
}
#sp-header #sp-menu .sp-megamenu-parent >li.current-item>a, #sp-header #sp-menu .sp-megamenu-parent >li.sp-has-child>a {
	background-color: #234d3f;	
	border-Top: 2px solid #d7b36b;
}

#sp-header #sp-menu .sp-megamenu-parent >li.current-item.active>a, #sp-header #sp-menu .sp-megamenu-parent >li.sp-has-child.active>a {
	background-color: #234d3f;
	color: #efefef;
	border-Top: 2px solid #d7b36b;
	transition: color 1000ms border 1000ms;
	
}
#sp-header #sp-menu .sp-megamenu-parent >li.current-item.active>a:hover, #sp-header #sp-menu .sp-megamenu-parent >li.sp-has-child.active>a:hover {
	background-color: #0a362c;
	color: #fefefe;	
	border-Top: 2px solid #234d3f;
	transition: color 1000ms;
	
}




.sticky .sticky__wrapper {
    background-color: rgba(215, 179, 107, 0.75);
}

#offcanvas-toggler .js-menu-toggle span.lines, #offcanvas-toggler .js-menu-toggle span.lines:before, #offcanvas-toggler .js-menu-toggle span.lines:after {
    background-color: #0a362c;
}

.close-offcanvas {
	background-color: #234d2f;
    position: absolute;
    top: 15px;
    right: 15px;
    z-index: 1;
    color: rgb(215,179,107);
    width: 44px;
    height: 44px;
    line-height: 42px;
    text-align: center;
    font-size: 22px;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(10,54,44);
    border-image: initial;
    border-radius: 10%;
	box-shadow: 0 2px 3px rgba(0, 0, 0, 0.5);
    transition: border 300ms, color 300ms;
}

.offcanvas-menu {
    width: 320px;
    height: 100vh;
    background: #234d2f;
    box-shadow: -1px 0 10px rgba(0, 0, 0, 0.15);
    color: #777;
    position: fixed;
    top: 0;
    right: 0;
    -webkit-transform: translateX(320px);
    transform: translateX(320px);
    visibility: hidden;
    overflow-y: scroll;
    -webkit-transition: .5s cubic-bezier(0.5, 0, 0.3, 1);
    -moz-transition: .5s cubic-bezier(0.5,0,0.3,1);
    -o-transition: .5s cubic-bezier(0.5,0,0.3,1);
    transition: .5s cubic-bezier(0.5, 0, 0.3, 1);
    z-index: 1007;
}
.offcanvas-menu .offcanvas-inner .sp-module ul > li {
	width: 100%;
	display: flex;
	flex-direction: row;
    border: none;
	border-bottom: 1px solid #d7b36b;
    position: relative;
}
.offcanvas-menu .offcanvas-inner .sp-module ul > li:hover {
	background-color: #0a362c;
	border-bottom: 1px solid #fff;
}
.offcanvas-menu .offcanvas-inner .sp-module ul > li.nav-item.active {
	background-color: #d7b36b;
	border-bottom: 1px solid #fff;
}

.offcanvas .offcanvas-overlay {
	background-color: rgba(215, 179, 107, 0.75);
    visibility: visible;
    opacity: 0.9;
	    -webkit-transform: translate3d(0, 0, 0);
    -webkit-animation-name: fade-in-down;
    animation-name: fade-in-down;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    background-color: rgba(39, 39, 39, 0.75);
    -webkit-backdrop-filter: blur(7px);
    backdrop-filter: blur(7px);
}

#sp-main-body {
    padding: 10px 0;
	box-shadow: 0 2px 3px rgba(0, 0, 0, 0.5);
}

#sp-bottom {
	
	padding: 10px 0px;
    background-color: #234d3f;
	opacity: 0.8;
	background: radial-gradient(circle, transparent 20%, #234d3f 20%, #234d3f 80%, transparent 80%, transparent), radial-gradient(circle, transparent 20%, #234d3f 20%, #234d3f 80%, transparent 80%, transparent) 12.5px 12.5px, linear-gradient(#d7b36b 1px, transparent 1px) 0 -0.5px, linear-gradient(90deg, #d7b36b 1px, #234d3f 1px) -0.5px 0;
	background-size: 25px 25px, 25px 25px, 12.5px 12.5px, 12.5px 12.5px;
	
	box-shadow: 0 2px 3px rgba(0, 0, 0, 0.5);
}

#sp-footer {
    background-color: #d7b36b;
	color: #101010;
}
#sp-footer a {
	color: #234d3f;
}#sp-footer a:hover {
	color: #0a362c;
}