/* Fix for Lighthouse 6 complaint "inappropriate image size" on mobile for missing retina images (2-3x)
/* LH ignores imgs with object-fit so this is just a hack */
@media (max-width: 767px) {
	.tops-lh-retina-fix img {
		object-fit: contain;
	}
}

/* Disable Size transition of logo on load IE11 */
#site-logo #site-logo-inner a img {
	-webkit-transition: opacity .3s ease-in-out;
	transition: opacity .3s ease-in-out;
}


/* IE 10 + 11 Fix for Hero Buttons + Divider Widget */
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {  
	.elementor-button-content-wrapper {
		display: inline-block;
	}
	
	.elementor-widget-divider:not(.elementor-widget-divider--view-line_text):not(.elementor-widget-divider--view-line_icon) .elementor-divider-separator {
		border-top: 1px solid #1c4e2a;
	}
}


/* OWP Remove widgets.css (saves 10KB gzip) */
.contact-info-widget {
	list-style: none;
	margin: 0;
	padding: 0;
}

.contact-info-widget li {
	display: inline-block;
	width: 100%;
	margin: 0 0 20px;
	padding: 0;
	border: 0;
}

.contact-info-widget li:last-child {
	margin-bottom: 0;
}

.contact-info-widget .oceanwp-info-wrap,.contact-info-widget span.oceanwp-contact-title,.contact-info-widget span.oceanwp-contact-text {
	display: block;
}

.contact-info-widget span.oceanwp-contact-title {
	font-weight: bold;
	line-height: 1.4;
}

.contact-info-widget span.oceanwp-contact-text {
	line-height: 18px;
}

.contact-info-widget.default i {
	float: left;
	width: 40px;
	height: 40px;
	line-height: 40px;
	border: 1px solid #e9e9e9;
	color: #13aff0;
	margin-right: 15px;
	text-align: center;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
}

.contact-info-widget.default .oceanwp-info-wrap {
	padding-left: 55px;
}


/* Elementor Drop Cap Adjustment */
.elementor-drop-cap {
	font-size: 35px !important;
	margin-top: 3px !important;
}

/* NO JQUERY DROP Caps Version - needed if elementor scripts removed on frontend! */
body:not(.logged-in) .elementor-drop-cap-yes p:first-child::first-letter {
	display: inline-block;
	color: #1c4e2a;
	border: 3px solid;
	line-height: 1em;
	float: left;
	vertical-align: middle;
	padding: 5px 10px 5px 10px;
	margin-right: 10px;
	font-size: 35px;
}

/* Firefox not respecting line-height in Drop Cap*/
@-moz-document url-prefix() {
	body:not(.logged-in) .elementor-drop-cap-yesp:first-child:first-letter {
		padding: 10px !important;
	}
}

/* Zoom effect Images - replace Elementor Animations.css */
.elementor-animation-grow { 
	transition: transform .3s;
}

.elementor-animation-grow:active, .elementor-animation-grow:focus, .elementor-animation-grow:hover {
	transform: scale(1.1);
}

/* RANK MATH BREADCRUMBS */
.site-breadcrumbs.lotte-rank-math {
	width: 100%;
	position: absolute;
	left: 0;
	right: 0;
	top: 60%;
}

/* TEST: Compa with Opera Mini EXTREME Mode */
@supports not (transition: all) {
	.elementor-progress-bar {width: 100% !important;}
	.elementor-invisible {visibility: visible !important;}
	.contact-info-widget.default i {padding-top: 10px;} /* Line Height */
	.widget-image-caption {margin-top: -40px !important; padding-top: 10px; padding-bottom: 10px;} 
}


/* FLEXBOX COMPA FOR UC Browser on Android > 4) */
.elementor-row {
	display: -webkit-inline-flex;
	display: -ms-inline-flexbox;
	display: inline-flex;
}


/* FLEXBOX COMPA FOR IE 10, Safari 6, Android 4.4 - AVOID OVERFLOWING ELEMENTS with 100% width */ 
.elementor-column, .elementor-column-wrap, .elementor-image-box-content, .elementor-icon-list-text {
	-webkit-box-flex: 1;
	-ms-flex: 1 1 auto;
	flex: 1 1 auto;
}
	
.elementor-icon-list-text {
	display: block;
}

/* FLEXBOX COMPA Android 4.1 - AVOID OVERFLOWING ELEMENTS since Elementor 2.5 (new inline flex) */
.elementor:not(.elementor-bc-flex-widget) .elementor-widget-wrap {
	-webkit-box-orient: vertical;
}


/* OLD Browsers - Make all Columns 100% on Mobile */
@media only screen and (max-width: 768px) {
	.elementor-row {
		-webkit-box-orient: vertical;
	}
}

/* OLD Browsers - Make "Leistungen"  Columns 100% on Mobile + Tablet */
@media only screen and (max-width: 1023px) {
	.elementor-element-9d2e782 .elementor-row {
		-webkit-box-orient: vertical;
	}
}

/* Align Page Title + Breadcrumbs center on Android 4.1 */ 
.background-image-page-header {
	-webkit-box-align: center;
}

/* Hide header on scroll script */

#site-header {
	will-change: transform;
	transition: transform 0.4s ease-in-out;
	position: fixed !important;
	top:0;
	left: 0;
}

.header-unpin {
	transform: translate3d(0,-150px,0);
}

.header-pin {
	transform: translate3d(0,0,0);
}

/* Adjust Menu Position if logged in
body.logged-in .header-pin{
  transform: translate3d(0,50px,0);
}*/

/* FIX Lazysizes  width/height calculation/warning since Elementor 2.2.7 (changed block to inline-block) */
/* .elementor-widget-image .elementor-image>a, .elementor-widget-image .elementor-image figure>a {
	display: block;
} */

/* Fix for Elementor V2.2.7 & V3.2.1 (removing class "elementor-widget" and image links to inline-block instead of block) */
.elementor-widget-image a{
	display: block;
}

/* Autoptimize Lazy Load + Spinner */
img.elementor-animation-grow.lazyloaded {
	transition: all .3s;
}

.lazyload {
	opacity:0;
}

.lazyloading {
	opacity: 0.5 !important;
	background: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20stroke%3D%22black%22%20width%3D%2244%22%20height%3D%2244%22%3E%3Cg%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%20stroke-width%3D%222%22%3E%3Ccircle%20cx%3D%2222%22%20cy%3D%2222%22%20r%3D%221%22%3E%3Canimate%20attributeName%3D%22r%22%20begin%3D%220s%22%20calcMode%3D%22spline%22%20dur%3D%221.8s%22%20keySplines%3D%220.165,%200.84,%200.44,%201%22%20keyTimes%3D%220%3B%201%22%20repeatCount%3D%22indefinite%22%20values%3D%221%3B%2020%22%2F%3E%3Canimate%20attributeName%3D%22stroke-opacity%22%20begin%3D%220s%22%20calcMode%3D%22spline%22%20dur%3D%221.8s%22%20keySplines%3D%220.3,%200.61,%200.355,%201%22%20keyTimes%3D%220%3B%201%22%20repeatCount%3D%22indefinite%22%20values%3D%221%3B%200%22%2F%3E%3C%2Fcircle%3E%3Ccircle%20cx%3D%2222%22%20cy%3D%2222%22%20r%3D%221%22%3E%3Canimate%20attributeName%3D%22r%22%20begin%3D%22-0.9s%22%20calcMode%3D%22spline%22%20dur%3D%221.8s%22%20keySplines%3D%220.165,%200.84,%200.44,%201%22%20keyTimes%3D%220%3B%201%22%20repeatCount%3D%22indefinite%22%20values%3D%221%3B%2020%22%2F%3E%3Canimate%20attributeName%3D%22stroke-opacity%22%20begin%3D%22-0.9s%22%20calcMode%3D%22spline%22%20dur%3D%221.8s%22%20keySplines%3D%220.3,%200.61,%200.355,%201%22%20keyTimes%3D%220%3B%201%22%20repeatCount%3D%22indefinite%22%20values%3D%221%3B%200%22%2F%3E%3C%2Fcircle%3E%3C%2Fg%3E%3C%2Fsvg%3E");
	background-repeat: no-repeat;
	background-position: 50%;
}

.lazyloaded { 
	opacity:1;
	transition: opacity 150ms;
}



/* Show Top Bar ONLY if logged-in (all Users) */
body.logged-in #top-bar-wrap {
	position: fixed;
	width: 100%;
	top: 0;
	display: inherit;
	z-index: 10000;
}

@media only screen and (max-width: 360px) {
	body.logged-in #top-bar-wrap {
		position: relative;
	}
}

#top-bar-wrap {
	display: none;
}

/* Adjust Top Positon of Sticky Header if Top Bar is visible 
body.logged-in #transparent-header-wrap {
	top: 50px;
}
*/


/* Ocean WP Login/Out Shortcode Button Styling in Elementor (Top Bar Log-In/Out can be styled in Customizer)*/

.elementor a.oceanwp-login {
	display: none;
}

.elementor a.oceanwp-logout {
	padding: 10px 20px 10px 20px;
	background: green;
	color: white;
	display: inline-block;
}

.elementor a.oceanwp-logout:hover {
	background: lightgreen;
}



/* Pricing Table Format */
.table-1 tr:nth-child(even) {
	background: #f5f5f5;
}

.table-1 tr:nth-child(odd) {
	background: white;
}

.table-1 table th {
	background: green;
	color: white;
	font-size: 15px;
}
.table-1 table tr th:first-child, table tr td:first-child {
	padding-left: 10px;
}

@media only screen and (max-width: 400px) {
	.tabel-1 table th, table td {
		font-size: 12px;
	}
}


/* ELEMENTOR Adjustments */
/* Change Width of Elementor Toggle Widget Title */
div#elementor-tab-title-1371 {
	max-width: 200px;
}

/* Fix Elementor Icon List Icons not 100% aligned - needs careful testing
.elementor-icon-list-icon {
	width: auto !important;
}
*/

/* Lotte ZoomImage Banner (Leistungen Section) */
.lotte-zoomimage {
	overflow: hidden;
	border-radius: 5px 5px 5px 5px;
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
}

.lotte-zoomimage .widget-image-caption {
	position: absolute;
	width: 100%;
	background-color: rgba(0,128,0,0.69);
}

/* Lotte Progress Bar Styling (Class = lotte-progressbar) */
.lotte-progressbar .elementor-progress-wrapper {
	height: 25px;
	line-height: 25px;
}

.lotte-progressbar .elementor-progress-bar {
	background-image: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
	background-image: -o-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
	background-image: linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
	background-size: 40px 40px;
}

/* Disable Progress Animation becasue of high CPU load
@media only screen and (min-width: 1024px) {
		.lotte-progressbar .elementor-progress-bar {
		-webkit-animation: stripes 2s linear infinite;
		-o-animation: stripes 2s linear infinite;
			animation: stripes 2s linear infinite;
		}
}

@-webkit-keyframes stripes {
	from {background-position: 0 0;}
	to {background-position: 40px 0;}
}

@keyframes stripes {
	from {background-position: 0 0;}
	to {background-position: 40px 0;}
}
*/

.lotte-progressbar span.elementor-title:after {
	content: "\f046";
	font-family: FontAwesome;
	float: right;
	color: green;
}

@media only screen and (max-width: 350px) {
	.lotte-progressbar .elementor-title {
		line-height: 30px !important;
		font-size: 11px !important;
	}
}

/* Lotte Dual Heading Element */
.lotte-single .elementor-widget-container {
	display: inline-block;
}

.lotte-dual.elementor-element {
	display: inline-block;
	margin-right: -5px;
	width: auto;
}


/* OCEANWP Adjustments */

.background-image-page-header {
	background-color: #9ebee5;
}

/* Sticky Right Sidebar (Elementor sidebar widget)  */
.lotte-sidebar {
	position: -webkit-sticky;
	position: sticky;
	top: 10px;
	z-index: 1;
}

.sidebar-box {
	margin-bottom: 20px;
}

/* Active Link/Page highlighting with OceanWP Menu Widget (e.g. in sidebar) by stlying class ".current-menu-item" on class ".custom-menu-widget"*/
.custom-menu-widget .current-menu-item {
	background: green;
	padding: 2px 15px 2px 15px;
}

.custom-menu-widget .current-menu-item .menu-link {
	color: white;
}

/* Add Icon to Custom Menu Widget in Sidebar */
.custom-menu-widget .menu-link:before {
	content: "\f138";
	font: normal normal normal 14px/1 FontAwesome;
	font-size: 26px;
	vertical-align: middle;
	margin-right: 15px;
}

.custom-menu-widget .oceanwp-custom-menu>ul>li>a {
	white-space: normal;
	padding-left: 40px !important;
	text-indent: -39px;
	padding: 8px 0;
	font-size: 13px;
	line-height: 20px;
	letter-spacing: .6px;
}

/* Change Sidebar Pic from Round to Square */
.oceanwp-about-me .oceanwp-about-me-avatar img {
	border-radius: 0;
}

h3.oceanwp-about-me-name {
	display: block;
	font-size: 13px;
	font-weight: 600;
	margin: 16px 0 10px;
	text-transform: uppercase;
	clear: none;
	text-align: center;
}

.oceanwp-about-me-text.clr {
	text-align: center;
}

.oceanwp-custom-menu>ul>li {
	float: none;
}


/* SHow Site Logo only on mobile to avoid overlapping */
@media only screen and (min-width: 769px) {
		#site-logo {
		display: none;
	}
}

/* Show Logos in Footer and Sidebar at max-width 200px (WP Image widget) */
.lotte-footer-logo {
	max-width: 200px !important;
}

/* White background for Ocean Hamburger Menue */
.oceanwp-mobile-menu-icon.mobile-right {
	float: right;
	background: rgba(255, 255, 255, 0.3);
	padding: 5px 15px 5px 15px;
	border-radius: 2px;
}

/* Change Transparent header on mobile to background color */
@media only screen and (max-width: 768px) {
	#site-header.transparent-header {
		background-color: rgba(255, 255, 255, 0.8);
		-webkit-box-shadow: 0 3px 18px rgba(0, 0, 0, .35);
		box-shadow: 0 3px 18px rgba(0, 0, 0, .35);
	}
  
	.oceanwp-mobile-menu-icon.mobile-right {
		background: none;
	}
}
  
/* Show Open (Mobile)Fullscreen Submenu */
#mobile-fullscreen ul ul.sub-menu {
	display: block !important;
}

/* Change font size of submenu items on mobile only */
@media only screen and (max-width: 480px) {
	#mobile-fullscreen ul ul.sub-menu li a {
		font-size: 10px;
		padding: 8px 0;
	}
}

/* Move Footer 1 Text Widget up to be inline */
div#text-6 {
	margin-top: -22px;
}

/* Page Content Fade-In - issue with lazysizes if opacity = 0 */
#main {
	-webkit-animation: lottefadein 0.8s;
	animation: lottefadein 0.8s;
}

@-webkit-keyframes lottefadein {
	from {opacity: 0.001;} to {opacity: 1;}
}

@keyframes lottefadein {
	from {opacity: 0.001;} to {opacity: 1;}
}

/* GENERAL FOR ALL PROJECTS */

/* Enable Wordtrennung for german - Elementor only uses hypens: manual (not supported in Chrome!)*/
.elementor {
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	-o-hyphens: auto;
	hyphens: auto;                
}

/* Page Titel view over background image */
.page-header-title, .site-breadcrumbs {
	text-shadow: 1px 1px 10px #000;
}

/* Replace OceanWP Simple Line Icons with Font Awesome(Icomoon) Icons to avoid loading of SLI (saves 40KB) */
.icon-home:before {
	font-family: FontAwesome;
	content: "\f015";
}

/* Replace OceanWP Simple Line Icons with Font Awesome(Icomoon) Icons to avoid loading of SLI (saves 40KB) */
.icon-magnifier:before {
	font-family: FontAwesome;
	content: "\f002";
}

/* Fix Elementor Responsive Pics always 100% */
.elementor img {
	width: 100%;
}

/* Bring Scroll-Up button always to Front */
a#scroll-top {
	z-index: 9999;
}

/* Fix for Elementor/Oceanwp Breakpoint max-width 90% at 959px - this leads to issues with Elementor */
/* Problem is in area between 960 - 1200 as the 90% are not applied in that range if page is 100% Full Width setting in OceanWP */
/* ALWAYS apply Max Content Width of 90% for Full Width Elementor + OWP Canvas (independend from max width settings!) */
.container, .elementor-section.elementor-section-boxed >.elementor-container {
	max-width: 90%;
}

/* For larger screens bigger than 1500px make width 75% instead of 90% */
@media only screen and (min-width: 1500px) {
	.container, .elementor-section.elementor-section-boxed >.elementor-container {
		max-width: 70%;
	}
}

/* Fix for OceanWp too small menu icon between 768 and 959 */
@media only screen and (max-width: 959px) {
	#oceanwp-mobile-menu-icon a {
		font-size: 30px;
	}
}

/* Fix for Fullscreen Menu */
#mobile-fullscreen {
	overflow-y: auto;
}