/*
Theme Name: Spangenberg Medien
Theme URI: ''
Author: Spangenberg Medien
Author URI: https://spangenberg-medien.de
Description: Spangenberg Medien is a specific Theme for Spangenberg Medien.
Version: 1.9
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: as
Sub_Style : Header/Footer;
*/
/****************************************
*******	 LAYOUT *************************
*****************************************/
/**	 11.1 - Header */
.site-header{
	position: fixed;
	z-index: 1000;
	font-size: calc(0.25em + 0.75vw);
	top: 0;
	transition: all 250ms ease-in 0ms, box-shadow 200ms linear 50ms;
	width: 100%;
}
.site-header-main{
	display: block;
	position: relative;
	height: 100%;
}
.site-header-main .content{
	max-width: 94em;
	z-index: 1000;
	position: relative;
}
.site-header-menue-content{
	position: fixed;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	z-index: 3000;
	font-size: calc(0.25em + 0.75vw);
	height: 0;
}
.site-header-menue-wrapper{
	max-width: 18em;
	top: 1.75em;
	right: 0;
	border-radius: 10em;
	font-size: 1em;
	transform-origin: 90% 1.75em;
	background: transparent;
	box-shadow: none;
	transition: all 250ms cubic-bezier(1,.59,.32,1.28) 0ms;
	opacity: 0;
	width: 100%;
	z-index: 3000;
	position: fixed;
}
/** LOGO **/
.logo {
	position: absolute;
	top: 0;
	left: -0.5em;
	width:16em;
	height:16em;
	max-height: 300px;
	max-width: 300px;
	z-index: 1000;
	transition: all 250ms ease-in 0ms, top 0ms linear 0ms;
	right: auto;
	margin: 0 auto 0;
	transform-origin: 75% 0%;
}
.logo-title, .logo a {
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	top: 0;
	margin-bottom: 0 !important;
	cursor: pointer;
}
.logo a {
	z-index: 2000;
	cursor: pointer;
	top: 0;
	height: 100%;
}
.logo a::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	background-image: url("/media/images/logo_mainimg.svg");
	background-repeat: no-repeat;
	background-size: 100% 100%;
	top: 0;
}
.logo a span {
	text-indent:-9999px;
	position:absolute;
}
@media (min-width:2000px){
	.site-header, #main, .site-header-menue-content {
		font-size: 17px !important;
	}
	.site-header-main .content, .site-header-menue-content{
		max-width: 100em;
	}
	.logo {
		left: -0.5em;
	}
	.minav .logo {
		left: -0.5em;
	}
}
@media(max-width:599px){
	.logo {
		width:20em;
		height:20em;
	}
	.menu-toggle {
		top: 2.25vw;
	}
}
/* MENU Toggle Header*/
.no-js .menu-toggle {
	display: block;
}
.menu-toggle:hover,
.menu-toggle:focus,
.menu-toggle:active {
	background-color: transparent;
	border-color: #007acc;
	color: #ffffff;
}
.menu-toggle:focus {
	outline: 0;
}
.menu-toggle.toggled-on:focus {
	outline: thin dotted;
}
.toggled-on .menu-toggle {
	transform: scale(0);
}
.menu-toggle.toggled-on + .site-header-menu .menu-mainmenu-container {
	display: block;
}
.menu-toggle {
	background: transparent none repeat scroll 0 0 !important;
	display: block;
	position: absolute;
	top: 1em;
	margin: -1em 1em 0;
	z-index: 1000;
	padding: 0.5em !important;
	pointer-events: all;
	transition: 250ms ease-in 0ms, top 0ms linear 0ms;
	right: 0;
	line-height:1;
	transform:scale(1);
}
.menu-toggle > span {
	display:none !important;
}
.menu-toggle:hover, .menu-toggle:focus {
	background-color: transparent;
	border-color: transparent;
	color: transparent;
}
.menu-toggle .hamburger {
	margin: auto;
	padding-top: 0.75em;
	padding-bottom: 0.75em;
	overflow:hidden;
}
.menu-toggle .hamburger > div {
	height: 3px;
	background-color: rgb(var(--black));
	margin-bottom: 0.625em;
	width: 3.5em;
}
.hamburger div:last-child {
	margin-bottom: 0;
}
.menu-toggle.circle::before {
	background-color: rgb(var(--mcolor-1-3));
	position: absolute;
	left: -0.75em;
	right: -0.75em;
	border-radius: 50%;
	padding-top: calc(100% + 1.5em);
	z-index: -1;
	top: 0;
	margin-top: 50%;
	transform: translateY(-50%);
	box-shadow: -0.75em 0 0 rgba(var(--mcolor-1-3),0.15), 0.75em 0 0 rgba(var(--mcolor-1-3),0.15);
}
.menu-toggle-main {
	color: rgb(var(--black),0.75);
	position: absolute;
	right: 0;
	font-size: 1.5em;
	padding: 0.5em;
	z-index: 100000;
	display: block;
	text-align: center;
	cursor: pointer;
	top: 0em;
}
/** MAIN-Navigation **/
.main-navigation {
	font-family: var(--font);
}
.main-navigation li {
	display: table-cell;
	position: relative;
	text-align: center;
	vertical-align: middle;
}
.main-navigation a {
	color: rgb(var(--black));
	display: block;
	font-size: 0.625em;
	line-height: 1.25;
	outline-offset: -1px;
	position: relative;
	z-index: 1;
	padding:1em 0.5em;
	margin: 0.5em 0.625em;
	transition: all 0ms ease-in 0ms;
	transform: none;
}
.main-navigation .main-menu li:hover a span {
	scale: 1.5;
}
.main-navigation a:hover,
.main-navigation a:focus{
		opacity: 1;
}
.main-navigation a span {
	display:inline-block;
	font-size: 1.75em;
	font-weight: 900;
	letter-spacing: 0.03em;
	line-height: 1.25em;
}
.main-navigation li.current-menu-item > a,
.main-navigation li.current-page-ancestor > a,
.main-navigation li.current_page_ancestor > a,
.main-navigation li.current_page_parent > a,
.main-navigation li.current-menu-ancestor > a,
.main-navigation li.current-menu-parent > a {
	font-weight: 700;
	color: currentColor;
}
.main-navigation li.current-menu-item > a span,
.main-navigation li.current-page-ancestor > a span,
.main-navigation li.current_page_ancestor > a span,
.main-navigation li.current_page_parent > a span,
.main-navigation li.current-menu-ancestor > a span,
.main-navigation li.current-menu-parent > a span{
	color: rgb(var(--white));
	background-color: rgb(var(--black),0.5);
	font-size: 2em;
	padding: 0;
}
.main-navigation .sub-menu {
	display: none;
	position: absolute;
	text-transform:none;
	letter-spacing:0;
	text-align:left;
	margin: 0 0;
}
.no-js .main-navigation .sub-menu {
	display: block;
}
.main-navigation .sub-menu li {
	float: left;
	width: 100%;
}
.main-navigation .sub-menu li:before {
	content:none;
}
.main-navigation .sub-menu li a {
	box-shadow: none;
	border-bottom: 1px solid;
	border-top: 1px solid rgb(255, 255, 255);
	margin:0;
}
.main-navigation .sub-menu li:first-child a {
	border-top: 1px solid;
}
.main-navigation > .menu-mainmenu-container {
	max-height: calc(100vh - 10rem);
	overflow-y: auto;
}
.toggled-on .main-navigation .main-menu {
	margin: 0;
}
.main-navigation .main-menu > li a span {
	font-size: 1.75em;
	font-weight: 800;
	letter-spacing: 0.05em;
	background-color: rgba(var(--grey));
	padding: 0.15em 0.5em;
	transition: all 100ms ease-in 0ms;
	position: relative;
	line-height: 1.25em;
	white-space: nowrap;
}

.toggled-on .site-header-menue-wrapper {
	transform: scale(1) translateX(-1.5em) rotate(10deg) !important;
	border-radius: 2.5em !important;
	background: rgb(var(--mcolor-1-3)) !important;
	box-shadow: 0 0.125em 0.2em rgba(0,0,0,0.5) !important;
	transition: all 450ms cubic-bezier(.68,-0.55,.27,1.55) 50ms, border-radius 50ms ease-in-out 200ms !important;
	padding-top: 2em;
	opacity: 1 !important;
	position:fixed;
}
.site-header-menu::before {
	content: '\e803';
	height: 100%;
	display: block;
	margin: 0 auto;
	width: 100%;
	padding: 0.25em 0 0.0625em 0;
	font-family: 'web-icon';
	font-size: 4em;
	text-align: center;
	color: rgba(var(--black),1);
	line-height: 1;
}
.minnav .main-navigation a {
	padding-top: 1em;
	padding-bottom: 1em;
	font-size: 0.625em;
	transform: none;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}
.minnav .main-navigation a span {
	font-size: 1.75em;
	font-weight: 900;
	letter-spacing: 0.03em;
	line-height: 1.25em;
}
.main-navigation a span::before,
.minnav .main-navigation a span::before {
	content:none !important;
}
.main-navigation .main-menu {
	border:none;
}
.main-navigation .main-menu li {
	display: block;
	width: 100%;
	border-top: solid 0.0625em rgba(var(--white),0.5);
}
.menu-toggle .hamburger > div {
	height: 4px;
}
/***MINNAV*/
.minnav .site-header {
	position: fixed;
	width: 100%;
	box-shadow: 0 0 0.175em rgba(0,0,0,0.3);
}
.minnav	.site-header-main {
	width: 100%;
}
.minnav .site-header-menue-wrapper .content {
	padding-left: 0;
	max-width: 100%;
}
.minnav .main-navigation .main-menu {
	max-width:1600px;
	border:none;
	min-width: 66%;
}
.minnav .site-header-main .logo {
	top: 0;
	padding-top: 1.5em;
	padding-right: 2.5em;
	transition: all 250ms linear 0ms;
}
.minnav .logo a {
	height: 100%;
}
.minnav .menu-toggle {
	top: 1.125em;
	right: 0.125em;
	font-size: 0.85em;
}
.minnav .menu-toggle .hamburger > div {
	height: 3px;
}
.minnav.toggled-on .site-header-menue-wrapper {
	top: 0;
}
.menu-toggle .hamburger > div{
	display: none!important;
}
@media (max-width: 100em){
	.menu-toggle{
		right:1em;
	}
}
@media(max-width:1000px){
	.toggled-on .site-header-menue-wrapper {
		font-size: 2em;
		top: 0.5em;
		right: -0.5em;
		transform: scale(1) translateX(-1em) rotate(5deg) !important;
	}
}
@media(max-width:1999px) and (min-width:1500px){
	.minnav .site-header, .minnav .top-nav-wrapper, .minnav .site-header-menue-content {
		font-size: calc(0.1em + 0.75vw) !important;
	}
	.site-header-main .content, .top-nav-wrapper, .site-header-menue-content {
		max-width: 100em;
	}
}
@media(min-width:2000px){
	.minnav .site-header, .minnav .top-nav-wrapper, .minnav .site-header-menue-content {
		font-size: 17px !important;
	}
}
@media(min-width:768px){
	.menu-toggle{
		display:none;
	}
}
@media(max-width:820px){
	body.toggled-on {
		overflow: clip;
	}
	.menu-toggle .hamburger > div{
		height: 2px;
	}
}
@media(max-width:600px){
	.menu-toggle {
		top: 2em;
	}
}
@media (max-width: 550px){
	.menu-toggle .hamburger > div{
		height: 2px;
	}
	.minnav .site-header , .site-header {
		position: absolute;
	}
	.minnav .site-header{
		background: none;
		box-shadow: none;
		overflow: visible;
	}
	.minnav .menu-toggle {
		font-size: 1.25em;
		right: -0.875em;
		top: 0.625em;
	}
	.toggled-on .site-header-menue-wrapper {
		font-size: 2.875em;
	}
	.minnav.toggled-on .site-header-menue-wrapper {
		top: -0.5em;
	}
}
@media (max-width: 400px){
	.logo{
		font-size: calc(0.225em + 1.25vw);
	}
}

/**	 11.6 - Footer */
.site-footer {
	clear: both;
	width: 100%;
	padding: 0 0;
	position: relative;
}
.site-footer a {
	text-decoration:none;
	transition:none;
}
.site-footer a:hover,
.site-footer a:focus,
.site-footer a:active {
	color:inherit;
}
.site-footer-box {
	position: relative;
	width: 100%;
}
.site-footer-content {
	position: relative;
	width: 100%;
	max-width: 100em;
	margin: 0 auto;
	padding:0 1rem 1em;
	height: 100%;
}
.site-footer-content-wrapper {
	position: relative;
	width: 100%;
	height: 100%;
}
.site-footer .logo-col {
	font-size: 3em;
	padding-bottom: 0.571429em;
	padding-top: 0.8em;
}
.site-footer .logo-col::before {
	display: block;
	width: 100%;
}
.site-footer .logo-col span {
	display: none;
}
.site-footer-content .footermenu {
	list-style: none;
	margin: 0;
	height: 100%;
}
.site-footer-content .footermenu li {
	display: inline-block;
}
.site-footer .contact a {
	padding: 0.25em 0.5em;
	text-decoration: underline;
	text-underline-offset: 0.15em;
	font-family:var(--font-display);
	font-weight: 500;
}
.site-footer .imp-link {
	padding-top: 1rem;
}
.site-footer .contact .email span::before {
	content: '';
	background: url(/wp-content/themes/as/images/SVG/icon_mail.svg);
	width: 1em;
	height: 1em;
	display: inline-block;
	vertical-align: middle;
	margin-right: 0.5em;
}
.site-footer .contact .phone span::before {
	content: '';
	background: url(/wp-content/themes/as/images/SVG/icon_phone.svg);
	width: 1em;
	height: 1em;
	display: inline-block;
	vertical-align: middle;
	margin-right: 0.5em;
}
.site-footer-bottom {
	clear: both;
	margin: 0 auto;
	text-align: center;
	width: 100%;
	position: relative;
	margin-left: 50%;
	transform: translateX(-50%);
	font-size: 0.9em;
	opacity: 0.6;
	padding-bottom: 1em;
}
.site-footer-bottom .copyright {
	text-transform: lowercase;
	font-family: var(--font-display);
	font-weight: 500;
}
.site-footer-bottom .copyright::before {
	content: '≠¡]“';
	content: '\00a9';
}
.site-footer-bottom .nav-col {
	display: block;
	z-index: 10 !important;
	position: relative;
	padding-bottom: 2.5em;
}
.site-footer-bottom .basic-menu {
	margin: 0em !important;
	clear: both;
}
.site-footer-bottom .basic-menu li {
	display: inline-block;
	padding: 0.375em 0.75em;
}
.site-footer .totop {
	display: inline-block;
	position: relative;
}
.site-footer .totop::before {
	font-size: 3.3333em;
	margin: 0;
}
.site-footer .totop span {
	display: none;
}
@media(max-width:450px){
	.site-footer .contact a{
		display: block;
		position: relative;
		width: 100%;
	}
	.site-footer .contact a + a {
		margin-top: 0.5em;
	}
}

/**SOCIAL**/
.social-wrapper {
	padding-top: 1.5em;
}
.social {
	list-style: none;
	margin: 0;
	white-space: nowrap;
}
.site-footer .social {
	float: right;
	width: 33%;
	text-align: center;
	margin-top: -3.5em;
}
.social ul {
	position: relative;
	margin: 0;
}
.social li {
	display: inline-block;
	position: relative;
	width: 4em;
}
.social ul li a.icon {
	width: 3.25em;
	height: 3.25em;
	position: absolute;
	top: 0;
	transform: translateX(-50%);
}
.social .icon::before{
	content: "";
	position: absolute;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	width: 100%;
	height: 100%;
	left: 0;
}
.icon.Instagram::before {
	background-image: url(/wp-content/themes/sp/images/SVG/icon_social_in.svg);
}
.icon.Facebook::before {
	background-image: url(/wp-content/themes/sp/images/SVG/icon_social_fb.svg);
}
.icon.Linkedin::before {
	background-image: url(/wp-content/themes/sp/images/SVG/icon_social_Linkedin.svg);
}
.social .icon span {
	display: none;
}
@media(max-width:1200px){
	.site-footer .social {
		float: none;
		width: 100%;
		margin-top: 0.75em;
		padding-bottom: 2em;
	}
}
@media(max-width:820px){
	.site-footer-content-wrapper {
		float: none;
		max-width: 35em;
		margin: 0 auto;
		padding: 2em 0;
	}
	.site-footer-content .sub-content {
		display: block;
		padding: 0.625em 0 0.625em 0;
		white-space: normal;
		text-align: center;
		width: auto !important;
		min-height: 0;
	}
	.site-footer-content .sub-content.menu ul li {
		float: none;
		display: inline-block;
	}
	.site-footer-content .sub-content.menu ul li a {
		padding: 0.25em 0.5em 0.25em;
		display: block;
	}
	.site-footer-bottom {
		max-width: 100%;
		padding-bottom:3em;
	}
	.site-footer-bottom .basic-menu {
		line-height: 1;
	}
	.site-footer .social {
		padding-bottom: 0em;
	}
}