/*
 Theme Name:     Schilderueberwachungsverein Child
 Theme URI:      http://www.elegantthemes.com
 Description:  	 Schilderueberwachungsverein Child Theme
 Author:         aceArt
 Author URI:     https://aceart.de
 Template:       Divi
 Version:        1.0.0
*/


@font-face {
  font-family: "Open Sans Light";
  src: url("/wp-content/themes/child-theme/Open_Sans/OpenSans-Light.ttf") format("truetype");
}

h1 {
    font-family: "Open Sans Light";
}

.light {
    font-family: "Open Sans Light";
}

a {
	text-decoration: underline;
	color:#000;
}
.widgettitle{
	font-size: 18px;
    color: #404040;
    line-height: 36px;
    margin-bottom: 8px;
    font-weight: bold;
}

#main-footer .container {
	display: none;
}

#footer-bottom {
	display: none;
}

#et-footer-nav .container {
	display: block;
}

#et-footer-nav {
	background: #1D1D1B;
}

.impressum-rechts{
	float:right;
}

.et_pb_text_1_tb_footer a{
	color:#fff;
	font-size:14px;
	text-decoration: none;
}

.wpcf7 input[type="text"],
.wpcf7 input[type="email"]
{
    background-color: #fff;
    color: #000;    
	max-width: 300px;
    height: 45px;
    margin-right: 20px;
    width: 100%;
}

.wpcf7 textarea{
    background-color: #fff;
    color: #000;
    max-width: 625px;
    height: 140px;
    width: 100%;

}

.wpcf7-form-control.wpcf7-submit{
	border: none;
    background: #404040;
    color: #fff;
    width: 120px;
    height: 45px; 
}

.wpcf7-not-valid-tip {
	font-size:14px;
}

.blogseite p{
	line-height: 24px;
	font-size:14px;
}

.column.size-1of3 .entry-title{
	font-weight: bold;

}

.wpcf7-form-control.wpcf7-acceptance{
	font-size:14px;
}

.wpcf7-form-control.wpcf7-acceptance .wpcf7-list-item{
	margin: 0px;
}

/* Divi Vertical Tabs 5 */

.vertical-tabs5 .et_pb_all_tabs {
    background-color: #FBD500;
    opacity: 0.9;
}

.vertical-tabs5 {
    border: none;
}

.vertical-tabs5 ul.et_pb_tabs_controls {
    float: right;
    width: 30%;
    margin-left: 3%;
    background: transparent;
}

.vertical-tabs5 ul.et_pb_tabs_controls:after {
    content: none;
}

.vertical-tabs5 .et_pb_tabs_controls li {
    width: 100%;
    border-right: none;
    border: 2px solid transparent;
    background: #F2F2F0;
    height:50px !important;
}

.vertical-tabs5 .et_pb_tabs_controls li.et_pb_tab_active {
    border: 2px solid #FBD500;
    background: #FBD500;
}

.vertical-tabs5 .et_pb_tabs_controls li.et_pb_tab_active:before {
    top: 50%;
    left: -42px;
    border: solid transparent;
    content: " ";
    position: absolute;
    border-color: transparent;
    border-right-color: #FBD500;
    border-width: 20px;
    margin-top: -20px;
}

.vertical-tabs5 .et_pb_tabs_controls li.et_pb_tab_active a {
    color: #000 !important;
}

.vertical-tabs5 .et_pb_tab {
    padding: 0;
}

.vertical-tabs5 .et_pb_tab_content {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    flex-direction: column;
    padding-top: 30px;
}

.vertical-tabs5 .et_pb_tab_content p{
	line-height: 60px;
    padding-left: 40px;
    padding-bottom: 0;
}

.vertical-tabs5 p a {
	font-size:14px;
	text-decoration: underline;
}

#top-menu li{
    padding:30px 10px;
}

.menu-schild{
    background-color:#404040;
}

.menu-schild a{
    color:#fff !important;
}

.et_pb_blog_grid article:hover {
    background-color: #F8D500;
    transition: 0.5s;
}

.bg {
    background:#F8D500;
    padding:10px; 
}

footer {
	color: #fff;
}
footer a {
	color: #fff;
    text-decoration: none;
    font-size:14px;
}

@media (max-width: 980px) {
    .et_non_fixed_nav.et_transparent_nav #main-header, .et_non_fixed_nav.et_transparent_nav #top-header, .et_fixed_nav #main-header, .et_fixed_nav #top-header {

    position: fixed;
     
    } 
}
 
.et_mobile_menu {
    overflow: scroll !important;
    max-height: 83vh; 
}

@media(min-width:980px) {    
    .et_header_style_left .et-fixed-header #et-top-navigation nav>ul>li>a,
    .et_header_style_left #et-top-navigation nav>ul>li>a{
        padding-bottom:0px !important;
    }
    .et_header_style_left .et-fixed-header #et-top-navigation,
    .et_header_style_left #et-top-navigation{
        padding-top:0px !important;
    }

    .sub-menu{
        margin-top:30px;
    }

    #top-menu>li:last-child{
        padding-right:10px !important;
    }
}

@media (max-width:980px){

    #main-header,
    .container.clearfix.et_menu_container {
        height:60px;
    }

    .et_header_style_left #et-top-navigation{
        padding-top: 16px !important;
    }
    .et_header_style_left #et-top-navigation .mobile_menu_bar{
        padding-top: 0px;
    }

    .et_header_style_left #et-top-navigation .mobile_menu_bar, .et_header_style_split #et-top-navigation .mobile_menu_bar{
        padding-bottom:12px;
    }
}
@media(max-width:767px) {    
    .vertical-tabs5 ul.et_pb_tabs_controls {
        width: 100%;
        margin-bottom: 30px;
        margin-right: 0;
    }
    
    .vertical-tabs5 .et_pb_tabs_controls li {
        border-bottom: none;
    }
    
    .vertical-tabs5 .et_pb_tab {
        padding: 0;
    }
  
    .vertical-tabs5 .et_pb_tab_content {
        display: block;
    }    
}

@media (max-width:554px) {
    h1 {
        font-size:34px !important;
        line-height: 40px !important
    }
}


/* Google maps preview */
.gmp_MapPreview {
	background-image: url('/wp-content/uploads/2022/11/suv-preview.jpg');
	background-size: cover;
	position: relative;
	display: flex;
	cursor: pointer;
}
.gmp_MapPreview::after {
    content: "Google Maps Inhalte laden";
    display: flex;
    justify-content: center;
    padding: 4px;
    min-width: 30%;
    border-radius: 4px;
    background-color: #000;
    color: #fff;
    margin: auto;
}

/* ============================================
   BARRIEREFREIHEIT (WCAG 2.1 AA)
   ============================================ */

/* Screen-Reader-Only Klasse (visuell versteckt, fuer Screenreader zugaenglich) */
.sr-only,
.screen-reader-text {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

/* Skip-Link: nur bei Fokus sichtbar (WCAG 2.4.1) */
.suev-skip-link {
	position: fixed;
	top: -100%;
	left: 50%;
	transform: translateX(-50%);
	z-index: 999999;
	background: #000;
	color: #fff !important;
	padding: 12px 24px;
	font-size: 16px;
	font-weight: bold;
	text-decoration: none !important;
	border: 3px solid #FBD500;
	border-radius: 4px;
	transition: top 0.2s ease;
}
.suev-skip-link:focus {
	top: 10px;
	outline: 3px solid #FBD500;
	outline-offset: 2px;
}

/* Fokus-Styles fuer alle interaktiven Elemente (WCAG 2.4.7) */
a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus,
[tabindex]:focus,
[role="button"]:focus {
	outline: 2px solid #000;
	outline-offset: 2px;
}

/* Fokus-visible: nur bei Tastaturnavigation sichtbar (verbesserte UX) */
a:focus:not(:focus-visible),
button:focus:not(:focus-visible) {
	outline: none;
}
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible,
[role="button"]:focus-visible {
	outline: 2px solid #000;
	outline-offset: 2px;
}

/* Dropdown-Menue per Tastatur bedienbar */
li:focus-within > ul {
	opacity: 1;
	visibility: visible;
}
.menu-item li a:focus {
	display: block;
}

/* Google Maps Preview: Fokus-Indikator (WCAG 2.4.7) */
.gmp_MapPreview:focus {
	outline: 3px solid #000;
	outline-offset: 2px;
}
.gmp_MapPreview:focus-visible {
	outline: 3px solid #000;
	outline-offset: 2px;
}

/* Link-Styles */
a {
	font-weight: bold;
}

/* Reduzierte Bewegung respektieren (WCAG 2.3.1) */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
	.suev-skip-link {
		transition: none;
	}
}

/* Hoher Kontrast / Forced Colors Mode */
@media (forced-colors: active) {
	a:focus,
	button:focus,
	[tabindex]:focus {
		outline: 3px solid LinkText;
	}
	.suev-skip-link:focus {
		border-color: LinkText;
	}
}

.full-col{
	display:flex;	
}

.half-col p{
	display:flex;
	flex-direction:column;
}

@media(max-width:980px){
	.full-col{
	display:flex;
		flex-direction:column;
}
}