/* Copyright UX Amp - www.ux-amp.de

- custom.css -

________________________________________________________________________________
custom styles
*/

/* colors */
:root {--brand:/*#763517;*/#654642;}
:root {--brand-bg:#f7f6f4;}
:root {--dark:#383d3f;}
:root {--grey:/*#f5f3ef;*/#f9f7ef;}
:root {--border:#e3e0dc;}

.grecaptcha-badge {visibility:hidden !important;}
body.scrollpoint .grecaptcha-badge {visibility:visible !important;}

.max_width, form {max-width:1400px !important;}
.box_small {padding:20px;}
.img_teaser_box {height:300px;}
.img_bg_dark {background:rgba(0,0,0,.5);}
.img_bg_dark_light {background:rgba(0,0,0,.3);}

.text_content ul li:before {top:2px;}

/* custom elements */
.img_cover, .img_cover img {/*padding:50px 20px;*/}
/*
 .grey_color, .grey_color a, .grey_color a:hover {color:var(--grey) !important;}
*/
 body, .white_bg {color:var(--brand) !important;}
/*
.img_radius {position:relative !important;}
.img_radius img {border-radius:40px;}
*/
#app_footer #sitemap .wp-block-columns > div img {width:75%;}
.content-layer {bottom: 150px;}
.nav-ui {bottom: 80px;}

/* important info */
.important_info {position:fixed; top:130px; right:80px; z-index:30; border-radius:10px; overflow:hidden; width:400px; box-shadow: 0 0 20px rgba(0, 0, 0, .2);}
.important_info_content {padding-bottom:20px; }
.important_info .white_bg {background:rgba(255,255,255,.9); backdrop-filter: blur(10px);}

.sticky_logo img {height: 50px; top: 14px;}
.m_t_normal_important {margin-top:20px !important;}

#app_footer .brand_bg nav li a {color:#fff !important;}
.custom_img_min_height {height:70vh;}

/*
________________________________________________________________________________
responsive design
*/
@media (min-width: 1800px) {
	.box {padding:200px 80px;}

}

@media (min-width: 1100px) {
/* nav */
/*dark navigation for desktop
#app_nav {background:var(--dark); color:#fff !important;}
.menu_list > li > a, .nav_info a {padding:23px;}
.menu_list li > a, .menu_list > li > span, .nav_info a {color:#fff !important; border-color:var(--dark);}
.menu_list li > a:hover, .menu_list > li > span:hover, .nav_info a:hover, .nav_info a:focus, .nav_info a:active {color:var(--dark);}
.drop_menu li a:hover, .drop_menu li a:focus, .drop_menu li a.active {color:var(--dark) !important;}
.single_menu_item .nav_info a:hover {color:#fff !important;}
.nav_info {border-color:#777; padding-left:33px;}
.menu_list.dropdown_menu_item > ul > li:hover {background:#111 !important;}
.menu_list.dropdown_menu_item > ul > a:hover {color:#fff !important;}
.menu_list.single_menu_item li:hover {color:#fff !important; background:#111 !important;}
.nav_info .h3.brand_color {color:#fff !important;}
.drop_menu {background:rgba(0,0,0,.8); backdrop-filter: blur(9px);}
.drop_menu_sub li a:hover {color:var(--dark) !important;}
.drop_menu_sub li a {border-right: solid 2px #777;}
.plus_icon span.lines {background:#777;}
.logo, .custom-logo {height:45px !important; top:15px;}
*/
	#app_nav {position:absolute; width:100vw; background:none; z-index:10; top:30px;}
	.menu_list li > a, .menu_list > li > span, .nav_info a {border-color:transparent;}
	.nav_info .brand_color {color:#fff !important;}
	.menu_list li > a, .menu_list > li > span, .nav_info a {color:#fff !important;}
	.menu_list .drop_menu li > a {color:var(--dark) !important;}
	.menu_list.dropdown_menu_item > ul > li:hover, .menu_list.single_menu_item li:hover {background:none}
	
	.custom-logo, .logo {height:200px !important; top:16px;}
	.top_contrast {position:absolute; top:0; left:0; right:0; height:200px; background:linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.5) 100%); z-index:3;}
	.bottom_contrast {position:absolute; bottom:0; left:0; right:0; height:100px; background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.3) 100%); z-index:3;}
	.wrapper_headline {right:auto; left:80px; top:auto; bottom:71px; text-align:left; z-index:5;}
	.ux-home .wrapper_headline {bottom:150px;}
	.krug_headline .wrapper_headline {bottom:195px;}
	
	body.desktop.scrollpoint #app_nav .float_right {position:fixed; right:300px; top:0; z-index:101;}
	body.desktop.scrollpoint #app_nav .float_right .menu_list li > a {color:var(--dark) !important;}
	body.desktop.scrollpoint #app_nav .float_right .nav_info {display:none;}
	body.desktop.scrollpoint #app_nav .float_right .single_menu_item.float_right {position:static;}

}
@media (max-width: 1300px) {
	.menu_list li > a, .menu_list > li > span, .nav_info a {padding: 23px 5px;}
	.custom-logo, .logo {
        height: 120px !important;
        top: 26px;
    }
	.sticky_logo img {
    height: 40px;
    top: 17px;
}

}
@media (max-width: 1100px) {
	#app_content, #app_footer {position:relative; right:0;}
	body.show_app_menu #app_content, body.show_app_menu #app_footer {right:-30vw;}
	
	small, .small_font {line-height:35px;}
	h1 small, h2 small {margin-top:10px;}
	
	.top_bg {background:#fff;}
	.menu_icon.active span.lines, .menu_icon span.lines {background:var(--brand) !important;}
	.logo, .custom-logo {height: 40px !important; top: 20px;}
	.sticky_box {background:#fff;}
	.sticky_box .btn {left:0; right:0; width:200px; margin:auto !important; border-left:none !important;}
.ux-home .sticky_box .btn_brand a {background:#fff !important; color:var(--dark) !important; border: solid 1.5px #fff !important;}
	
	.important_info {width:100%; left:auto; right:auto; margin:auto; border-radius:0; top:80px;}
	.important_info .btn a {padding-left:20px !important; padding-right:20px !important;}
	.lock_screen {position:fixed; z-index:29; background:rgba(0,0,0,.7); height:100vh; width:100vw; top:0; left:0;}

  }
@media (max-width: 880px) {
	.overdrive_2 {font-size:60px !important; line-height:40px;}
	
	
  }
@media (max-width: 680px) {
	.overdrive_2 {font-size:32px !important; line-height:20px;}
	
  }