/*
	Theme Name: Hozjan-Theme
	Theme URI: https://www.hozjan.net/
	Description: Willkommen zum Hozjan-Theme – die perfekte Grundlage für dein Webprojekt! Entwickelt und bereitgestellt von Hozjan Artwork, bietet dieses Theme eine Auswahl an durchdachten Features, die deine Arbeit mit Wordpress noch effizienter und kreativer machen.
	Author: Benny Hozjan
	Author URI: https://www.hozjan.net/
	Template: Divi
	Version: 1.0.0
	Tags: Ready-to-go Child Theme, Hozjan Artwork 
	License: GNU General Public License v2 or later
	License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/*	BASIC CSS
============================================================================== */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  font-size: 62.5%; /* 1rem = 10px */ 
  }

a[href^="#"] {
  cursor: pointer!important;
}

.mce-panel .mce-stack-layout-item.mce-first {
  position: sticky!important;
  top: 0;
}

:root {
/*	GLOBAL COLORS
============================================================================== */
  --green: 		#4CA87A;
  --lightgreen:	#E6F2EC;
  --dark: 		#1F3D36;
  --lightbrown: #EADFC8;
  --brown:		#7A6A4F;
  --white: 		#ffffff;
  --black: 		#000000;

/*	TRANSITIONS
============================================================================== */
  --tra-3s: all .3s ease-in-out;
  --tra-5s: all .5s ease-in-out;
  --tra-7s: all .7s ease-in-out;

/*	FLUID RANGE: min viewport: 360px / max viewport: 1920px 
============================================================================== */
  --fluid: clamp(0, calc((100vw - 36rem) / 156rem), 1); /* 156rem = Differenz von 192rem-36rem)*/
  
/*	FONT SIZES 
============================================================================== */
  --fs-body: 1.6rem; /* 16px – bewusst stabil */

  --fs-small: calc(1.2rem + 0.2rem * var(--fluid)); /* 12px → 14px */
  --fs-foot:  calc(1rem + 0.2rem * var(--fluid)); /* 10px → 12px */
  --fs-btn:   calc(1.4rem + 0.1rem * var(--fluid)); /* 13px → 14px */
  --fs-lead:  calc(1.7rem + 0.3rem * var(--fluid)); /* 17px → 20px */

  --fs-h5:    calc(1.8rem + 0.4rem * var(--fluid)); /* 18px → 22px */
  --fs-h4:    calc(2.2rem + 0.6rem * var(--fluid)); /* 22px → 28px */
  --fs-h3:    calc(2.6rem + 1.0rem * var(--fluid)); /* 26px → 36px */ 
  --fs-h2:    calc(3.2rem + 1.6rem * var(--fluid)); /* 32px → 48px */ 
  --fs-h1:    calc(3.4rem + 2.6rem * var(--fluid)); /* 40px → 64px */ 

/*	FONT WEIGHTS
============================================================================== */  
  --fw-200: 200; /* fein */
  --fw-400: 400; /* normal */
  --fw-600:	600; /* bold */
  --fw-800: 800; /* bolder */

/*	LINE HEIGHTS
============================================================================== */
  --lh-body:    1.50;
  --lh-lead:    1.45;
  --lh-small:   1.30;

  --lh-h1:      1.10;
  --lh-h2:      1.20;
  --lh-h3:      1.25;
  --lh-h4:      1.30;
  --lh-h5:      1.35;

/*	SPACING FLUID
============================================================================== */
  --space-xs:  calc(0.8rem + 0.4rem * var(--fluid)); /*  8 → 12px */
  --space-s:   calc(1.2rem + 0.8rem * var(--fluid)); /* 12 → 20px */
  --space-m:   calc(2.0rem + 1.2rem * var(--fluid)); /* 20 → 32px */
  --space-l:   calc(3.2rem + 1.6rem * var(--fluid)); /* 32 → 48px */
  --space-xl:  calc(4.8rem + 2.4rem * var(--fluid)); /* 48 → 72px */
  --space-xxl: calc(7.2rem + 3.6rem * var(--fluid)); /* 72 → 108px */
  
  --btn-p-t-b: calc(1.4rem + 0.3rem * var(--fluid)); /* 14 → 18px */
  --btn-p-l-r: calc(2.8rem + 0.3rem * var(--fluid)); /* 28 → 32px */
}


/*  PADDING CLASSES
============================================================================== */
.p-xs  { padding: var(--space-xs); }
.p-s   { padding: var(--space-s); }
.p-m   { padding: var(--space-m); }
.p-l   { padding: var(--space-l); }
.p-xl  { padding: var(--space-xl); }
.p-xxl { padding: var(--space-xxl); }


/*	MOBILE MENU CSS
============================================================================== */
/*change hamburger icon to x when mobile menu is open*/
#et_mobile_nav_menu .mobile_nav.opened .mobile_menu_bar::before,
.et_pb_module.et_pb_menu .et_mobile_nav_menu .mobile_nav.opened .mobile_menu_bar::before {
	content: '\4d';
}

/*adjust the new toggle element which is added via jQuery*/
ul.et_mobile_menu li.menu-item-has-children .mobile-toggle,
ul.et_mobile_menu li.page_item_has_children .mobile-toggle,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle,
.et-db #et-boc .et-l ul.et_mobile_menu li.page_item_has_children .mobile-toggle {
	width: 50px;
	height: 100%;
	padding: 0px !important;
	max-height: 50px;
	border: none;
	position: absolute;
	right: 10px;
	top: 0px;
	z-index: 999;
	background-color: transparent;
}

/*some code to keep everyting positioned properly*/
ul.et_mobile_menu>li.menu-item-has-children,
ul.et_mobile_menu>li.page_item_has_children,
ul.et_mobile_menu>li.menu-item-has-children .sub-menu li.menu-item-has-children,
.et-db #et-boc .et-l ul.et_mobile_menu>li.menu-item-has-children,
.et-db #et-boc .et-l ul.et_mobile_menu>li.page_item_has_children,
.et-db #et-boc .et-l ul.et_mobile_menu>li.menu-item-has-children .sub-menu li.menu-item-has-children {
	position: relative;
}

/*remove default background color from menu items that have children*/
.et_mobile_menu .menu-item-has-children>a,
.et-db #et-boc .et-l .et_mobile_menu .menu-item-has-children>a {
	background-color: transparent;
}


/*hide the submenu by default*/
ul.et_mobile_menu .menu-item-has-children .sub-menu,
#main-header ul.et_mobile_menu .menu-item-has-children .sub-menu,
.et-db #et-boc .et-l ul.et_mobile_menu .menu-item-has-children .sub-menu,
.et-db #main-header ul.et_mobile_menu .menu-item-has-children .sub-menu {
	display: none !important;
	visibility: hidden !important;
}


/*show the submenu when toggled open*/
ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
#main-header ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
.et-db #et-boc .et-l ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
.et-db #main-header ul.et_mobile_menu .menu-item-has-children .sub-menu.visible {
	display: block !important;
	visibility: visible !important;
}


/*adjust the toggle icon position and transparency*/
ul.et_mobile_menu li.menu-item-has-children .mobile-toggle,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle {
	text-align: center;
	opacity: 1;
}


/*submenu toggle icon when closed*/
ul.et_mobile_menu li.menu-item-has-children .mobile-toggle::after,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle::after {
	top: 10px;
	position: relative;
	font-family: "ETModules";
	content: '\33';
	color: var(--dark);
}


/*submenu toggle icon when open*/
ul.et_mobile_menu li.menu-item-has-children.dt-open>.mobile-toggle::after,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children.dt-open>.mobile-toggle::after {
	content: '\32';
}

@media (max-width: 1094px) {
	.et_pb_module .et_mobile_menu {
	    width: calc(100% + 10rem);
	    left: -5rem;
	    margin-top: 1rem;
	    border-top-left-radius: 0;
	    border-top-right-radius: 0;
	    border-bottom-left-radius: 2rem;
	    border-bottom-right-radius: 2rem;
	    box-shadow: 0 20px 30px -6px rgba(112,111,111,.15)
	}
	
	.et_pb_menu .et_mobile_menu li a {
	    font-size: 1.8rem !important;
	    font-weight: 300 !important;
	    line-height: 3rem;
	    text-align: left;
	}
	
	.mobile_nav.opened .mobile_menu_bar:before {
	    content: '\4d';
	}
	
	.mobile_menu_bar:before {
		transition: all .4s ease;
		transform: rotate(0deg);
		display: block;
	}
	/*rotate the Divi Menu icon on click*/
	.mobile_nav.opened .mobile_menu_bar::before {
		transition: all .4s ease;
		transform: rotate(90deg);
		display: block;
	}
	
	.et_pb_menu .et_mobile_menu, 
	.et_pb_menu .et_mobile_menu ul {
		list-style: none;
		text-align: left;
	}
	.et_pb_menu .et_mobile_menu {
        top: 100%;
        padding: 5%;
    }
}

@media only screen and ( min-width: 1095px ) {
	
	.et_pb_menu ul li > a {
		color: var(--lightgreen)!important;
		}
	.et_pb_menu ul li.current-menu-item > a{
		color:var(--green)!important
		}
	.et_pb_menu ul li.current-menu-item::after {
		content:"";
		display:block;
		position:absolute;
		bottom:20px;
		align-items: center;
		width:6px;
		height:6px;
		left: calc(50% - 5px);
		background:var(--green);
		}
	
	.et_pb_menu .et_pb_menu__menu>nav>ul>li {
		align-items:center;
		}
		
	.et_pb_menu .et_pb_menu__menu>nav>ul>li:hover::after {
	  	content:"";
	  	display:block;
	  	position:absolute;
	  	bottom:20px;
	  	align-items: center;
	  	width:6px;
	  	height:6px;
	  	left: calc(50% - 5px);
	  	background:var(--green);
		}
}

.et-db #et-boc .et-l #bh_header {
  background: none!important;
  transition: all 0.5s ease;
}

.et-db #et-boc .et-l #bh_header.hide-header {
    opacity: 0;
    margin-top: -150px!important;
    transition: all 0.5s ease;
  }
.et-db #et-boc .et-l #bh_header.show-header {
    opacity: 1;
    margin-top: 0px!important;
    transition: all 0.5s ease;
	background: rgba( 31, 61, 54, 1)!important;
  }
  
.et_pb_menu .et_pb_menu__menu>nav>ul>li>a:hover {
	opacity: 1!important;
}
.et_pb_menu .et_pb_menu__menu>nav>ul>li {
	padding-left:9px;
	padding-right:9px;
}

@media (max-width: 1095px) {
  .et_pb_menu .et_pb_menu__menu {
    display: none;
  }
  .et_pb_menu .et_mobile_nav_menu {
    display: block;
  }
}

@media (min-width: 1096px) {
  .et_pb_menu .et_mobile_nav_menu {
    display: none;
  }
}

/*	BOOK NOW CSS
============================================================================== */
@media only screen and (min-width: 1095px) {
	li.book-now a {
		padding: 0!important;
		border-radius: 3px;
		transition: var(--tra-3s);
		background-color: var(--green)!important; /* change the color of the background */
		color: white!important; /* change the color of the button text */
		padding: 12px 15px 12px 15px!important;
		align-items: center!important;
		}
		
	/* Divi call to action button hover state */ 
	li.book-now a:hover {
		background-color: var(--brown)!important; /* change the color of the hover background */
		}
}
@media (max-width: 1094px) {
.et_pb_menu .et_mobile_menu li.book-now a {
	padding: 0!important;
	border-radius: 5px;
	transition: var(--tra-3s);
	background-color: var(--green)!important; /* change the color of the background */
	color: white!important; /* change the color of the button text */
	padding: 10px 15px 10px 15px!important;
	align-items: center!important;
	text-align: center
	}
		
	/* Divi call to action button hover state */ 
		
.et_pb_menu .et_mobile_menu li.book-now a:hover {
	background-color: var(--brown)!important; /* change the color of the hover background */
	}
}

/*	BUTTON CSS
============================================================================== */

.et_pb_button,
.et_pb_button.submit {
  font-size: var(--fs-btn);
  font-weight:var(--fw-600);
  text-transform: uppercase;
  padding: var(--btn-p-t-b) var(--btn-p-l-r)!important;
  border: none!important;
  transition: var(--tra-3s);
}

.et_pb_button:hover,
.et_pb_button.submit:hover {
  font-size: var(--fs-btn)!important;
  text-transform: uppercase;
  padding: var(--btn-p-t-b) var(--btn-p-l-r)!important;
  border: none;
  background:var(--dark)!important;
  color:var(--white)!important;
}

.et_pb_button::after {
	display:none
}

.et_pb_button.green {
	background:var(--green);
	color:var(--white)!important;
}
.et_pb_button.brown {
	background:var(--brown);
	color:var(--white)!important;
}


/*	AKKORDEON CSS Styling
============================================================================== */

.et_pb_accordion .et_pb_toggle_close .et_pb_toggle_title::before {
  content: "\33"!important;
  font-size: 20px;
}

.et_pb_accordion .et_pb_toggle_open .et_pb_toggle_title::before {
  display: block;
  content: "\32"!important;
  font-size: 20px;
}

/*	GALLERY CSS
============================================================================== */
@media only screen and (max-width: 980px
)  {
    .et_pb_gallery_grid .et_pb_gallery_item img {
        width:100%;
    }
}

.et_pb_gallery .et_pb_gallery_item {
  border: 3px solid #f9f5f2;
}

.et_pb_gallery .et_overlay {
  background: #121416;
}

.et_pb_gallery_image:before,
.et_pb_gallery_image:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: var(--tra-5s);
  transition: var(--tra-5s);
}

.et_pb_gallery_image:before,
.et_pb_gallery_image:after {
  content: '';
  background-color: var(--white);
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 50%;
  opacity: 0;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: 99;
}

.et_pb_gallery_image:before {
  width: 60px;
  height: 1px;
  left: 100%;
}

.et_pb_gallery_image:after {
  height: 60px;
  width: 1px;
  top: 0%;
}

.et_pb_gallery_item:hover .et_overlay {
  zoom: 1;
  filter: alpha(opacity=70);
  -webkit-opacity: 0.7;
  opacity: 0.7;
}

.et_pb_gallery_image:hover:before,
.et_pb_gallery_image:hover:after {
  opacity: 1;
  top: 50%;
  left: 50%;
}

.et_pb_inline_icon:before,
.et_overlay.et_pb_inline_icon:before {
  content: '';
}

.mfp-title {display:none}

/*	SLIDE BG STYLES
============================================================================== */
.bg-slider{
  position: relative;
  min-height: 65vh;
  overflow: hidden;
}

.bg-slider::before,
.bg-slider::after{
  content: "";
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  transition: transform 1.2s ease;
  z-index: 0;
}

.bg-slider::before{
  background-image: var(--bg-current);
  transform: translateX(0);
}

.bg-slider::after{
  background-image: var(--bg-next);
  transform: translateX(100%);
}

.bg-slider.is-sliding::before{ transform: translateX(-100%); }
.bg-slider.is-sliding::after{  transform: translateX(0); }

.bg-slider.is-reset::before,
.bg-slider.is-reset::after{
  transition: none !important;
}

.bg-slider > *{
  position: relative;
  z-index: 1;
}

/*	FONT STYLES
============================================================================== */

.et_pb_module.et_pb_text h1,
.et_pb_module.et_pb_heading h1 {
  font-size: var(--fs-h1);
  line-height: var(--lh-h1);
  font-weight: var(--fw-800);
  letter-spacing: -1px;
}

.et_pb_module.et_pb_text h2,
.et_pb_module.et_pb_heading h2 {
  font-size: var(--fs-h2);
  line-height: var(--lh-h2);
  letter-spacing: -1px;
}

.et_pb_module.et_pb_text h3,
.et_pb_module.et_pb_heading h3 {
  font-size: var(--fs-h3);
  line-height: var(--lh-h3);
  font-weight: var(--fw-200)
}

.et_pb_module.et_pb_text h4,
.et_pb_module.et_pb_heading h4,
h3.et_pb_toggle_title {
  font-size: var(--fs-h4);
  line-height: var(--lh-h4);
}

.et_pb_module.et_pb_text h5,
.et_pb_module.et_pb_heading h5 {
  font-size: var(--fs-h5);
  line-height: var(--lh-h5);
}

.et_pb_module.et_pb_text p,
.et_pb_blurb .et_pb_blurb_description p,
.et_pb_module .et_pb_toggle_content p {
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  font-weight: var(--fw-400);
}

/* Optional Lead Text */
.bh-lead,
.et_pb_text.lead p {
  font-size: var(--fs-lead);
  line-height: var(--lh-lead);
}

.et_pb_text.small p {
  font-size: var(--fs-small);
  line-height: var(--lh-small);
  font-weight: var(--fw-600);
  display:inline-table;
  font-style: italic
}

.et_pb_module.et_pb_text ol li,
.et_pb_module.et_pb_text ul li {
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  padding-bottom: var(--space-s);
}

/*	FOOTER CSS
============================================================================== */
.bh_footer-1-row .et_pb_module.et_pb_heading h4 {
  font-size: var(--fs-lead);
  line-height: var(--lh-lead);
  font-weight: var(--fw-800);
  color: var(--white)
}

.bh_footer-1-row .bh_footer_menu_liste ul {
	list-style:none;
}

.bh_footer-1-row .bh_footer_menu_liste ul li {
	padding: 5px 0!important;
}

.bh_footer-1-row .bh_footer_menu_liste ul li a::before {
	content: "\35";
	font-family: ETmodules;
	margin-right: 5px;
	margin-left: -6px;
	color: var(--dark)!important;
	transition: var(--tra-3s);
}
.bh_footer-1-row .bh_footer_menu_liste ul li a:hover::before {
	margin-left: -10px;
	margin-right: 9px;
}

.bh_footer-2-row .bh_credit p,
.bh_footer-2-row .bh_footer_menu ul li a {
	color:var(--white);
	font-size: var(--fs-foot)!important;
	line-height: var(--lh-small)!important;
	text-transform: uppercase!important;
}

.bh_footer-2-row .bh_footer_menu ul {
	list-style: none;
	display:flex;
	column-gap:20px;
}

.bh_footer-2-row .bh_footer_menu ul li {
	-webkit-font-smoothing: antialiased;
	text-transform: uppercase;
	margin:0 10px;
	}

.bh_footer-1-row .bh_footer_menu_liste ul li a,
.bh_footer-2-row .bh_footer_menu ul li a,
.bh_footer-1-row .et_pb_text a,
.bh_footer-2-row .et_pb_text a  {
	color:var(--white);
	transition: var(--tra-3s);
	}

.bh_footer-1-row .bh_footer_menu_liste ul li a:hover,
.bh_footer-2-row .bh_footer_menu ul li a:hover,
.bh_footer-1-row .et_pb_text a:hover,
.bh_footer-2-row .et_pb_text a:hover {
	color:var(--dark)
	}
	
/*	Janolaw CSS
============================================================================== */
.janolaw-paragraph {
  font-size:var(--fs-h4);
  margin-bottom:20px;
}