/*
 Theme Name:   Wohndomizil Template 2025
 Author:       WEBKOMMUNIKATION24
 Author URI:   https://webkommunikation24.de
 Version:      1.4.0
 Text Domain:  wohndomizil-2025
*/

/*==== B A S I S ==============================================*/

* { box-sizing: inherit; background-repeat: no-repeat; }
html { box-sizing: border-box; scroll-behavior: smooth;-ms-hyphens: none; -webkit-hyphens: none; hyphens: none;}

body { font-family: 'Roboto', sans-serif; color: var(--fontcolor); background:var(--bg); text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }

.breite { width: 90%; max-width: 1520px; margin: 0 auto; }

.label { display: inline-block; min-width: 5em; }
.center { text-align: center; }
.upper { text-transform: uppercase; letter-spacing: 0.02em; }
.italic { font-style: italic; }
.hiddenmobile { display: none; }

iframe { border: 0; }
.wk-overlay .content{width: 90%; height: 90%;}

input, textarea, select { font-size: 1em; }
input[type="submit"], .wk-button, .cookie input.accept[type="submit"], .cn-button{ background-color: var(--btnbg)!important; color: var(--white); transition: all 500ms ease; }
input[type="submit"]:hover, input[type="submit"]:active, .wk-button:hover, .wk-button:active, .cookie input.accept[type="submit"]:hover, .cookie input.accept[type="submit"]:active, .cn-button:hover{ background-color: var(--btnbghover)!important; }

#cookie-notice{background-color: rgba(22, 25, 28, 0.9) !important; color: var(--white); font-family: 'Lato', sans-serif!important; font-size: 0.9em!important;}
#cookie-notice .cn-link{ color: inherit; }
.cn-button.wp-default, .cn-button.bootstrap{font-size: 0.9em!important;}
.sitemap ul { padding: 0; }

/* Farben */
:root {
    --white: #ffffff;
    --gray:#bdbdbd;
    --btnbg: #c71617;
    --btnbghover:#c71617;
    --fontcolor: #ffffff;
    --primcolor:#c71617;
    --seccolor:#262626;
    --bordercolor:#eaeaea;
    --boxbg:#efefef;
    --bg:#414140;
    }

/*==== H E A D E R ============================================*/
header{background: url(img/headerparallax.jpg) center/cover no-repeat;}
header .breite { padding: 5% 5% 15% 0; color:var(--white); text-transform: uppercase; letter-spacing: 0.02em; font-size:1.25em; font-weight:700;}
header .breite .red{background:var(--primcolor); display: inline-block; padding: 0 0.25em; margin-bottom: 0.25em;}

#menueToggle { background: #cecece url(img/symbols.svg) center top/60px 180px no-repeat; position: fixed; top: 10px; right: 10px; width: 60px; height: 60px; z-index: 1000; cursor: pointer; }
#menueToggle.close { background: url(img/symbols.svg) center/60px 180px no-repeat; }

/*==== C O N T E N T ==========================================*/

main .breite { padding: 3em 0 4em; }
main a{color:var(--primcolor); text-decoration: none;}
main a:hover{text-decoration: underline;}

h1{text-transform: uppercase; letter-spacing: 0.02em; font-size:2em; font-weight:700;}
h1 .red{background:var(--primcolor); display: inline-block; padding: 0 0.25em; margin-bottom:0.25em;}
h1 small{font-size:75%; display:block;}
h2{color:var(--white); font-size:1.8em; font-weight:700; margin:1em 0 1em;}
h2 .red{background:var(--primcolor); display: inline-block; padding: 0 0.25em;}

main ul{list-style-type:none; padding-left:1.3em;}
main ul li{position:relative;}
main ul li:before{position: absolute; top: 0.4em; left:-1.3em; display: inline-block; width: 9px; height: 9px; background: var(--primcolor); content: "";}


.wk-table{border: 1px solid var(--bg); font-size: 0.85em;}
.wk-table td, .wk-table th{border-left: 1px solid var(--bg); text-align: center;}
.wk-table th{background:var(--primcolor); color:var(--white);}
.wk-table-striped tr:nth-child(2n-1) td {background-color: var(--seccolor);}

.wk-form{margin-top:1.5em;}
.wk-form label span.lab {width: 100%;float: left;}
.wk-form label span.wpcf7-form-control-wrap {width: 95%; float: left;}
.wk-form label:after {display: block; clear: both; content: "";}
.wk-form label br {display: none;}
.wk-form input[type="text"], .wk-form input[type="email"], .wk-form select, .wk-form textarea { box-shadow: none; border: 1px solid #d4d3d3; border-radius: 0; background: #e1e1e1; width: 100%;}
.wk-form input:focus,.wk-form input[type=text]:focus,.wk-form textarea:focus,.wk-form select:focus,.wk-form select:active, .wk-form input[type=text]:active, .wk-form input:active, 
.wk-form textarea:active{background: #ffffff; border: 1px solid #d4d3d3;}
.wk-form span.wpcf7-list-item label br {display: block;}
.wk-form span.wpcf7-list-item{margin:0 0;}
.wk-form .wpcf7-submit{font-size:1em;}


/*==== F O O T E R ============================================*/
footer{background:var(--seccolor); text-align:center;}
footer .breite { padding: 2em 0 2em; }
footer a { color: inherit; text-decoration: none;}
footer a:hover{text-decoration: underline;}

footer nav ul { padding: 0; font-size: 0.9em;}
footer nav ul li { display: inline-block; margin-right: .7em; }
footer nav ul li:last-of-type { margin-right: 0; }
footer nav ul li a { text-decoration: none; }

/* GoTop-Link */
#gotop { opacity: 1; transition: opacity 500ms ease; position: fixed; bottom: 10px; right: 10px; z-index: 1000; width: 40px; height: 40px; background: var(--seccolor) url(img/symbols.svg) center bottom/40px 120px no-repeat;}
#gotop.hide { z-index: -1; opacity: 0; }


/* ==== M E D I A  Q U E R I E S ==============================*/
@media only screen and (min-width: 768px){
    header .breite {font-size:1.7em;}
    #menueToggle { display: none; }
    .hiddenmobile { display: block; }

    h1{line-height: 1.6em;}
    h1 .red{margin-bottom:0;}
    .wk-table{font-size: 0.9em;}

    figure.left { float: left; margin: 0 1.5em 0 0; max-width: 40%; }
    figure.right { float: right; margin: 0 0 0 1.5em; max-width: 40%; }

}

@media only screen and (min-width: 1024px){
    header{background-attachment: fixed!important;}
    header .breite {padding: 5% 15% 15% 0; font-size:1.7em;}

    footer .breite{display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: space-between;}
    footer .breite nav{flex: 1 1 50%; text-align: left;}
    footer .breite nav ul{margin:0 0;}
    footer .breite .down{flex: 1 1 50%; text-align: right;}
}

@media only screen and (min-width: 1280px){
    header .breite {padding: 5% 33% 15% 0;}

    .wk-form label span.lab {width: 30%;}
    .wk-form label span.wpcf7-form-control-wrap, .wk-form span.wpcf7-list-item {width: 70%;}
	.wk-form div.wpcf7-form-control-wrap, .wk-form span.wpcf7-form-control-wrap.acceptance-140, .wk-form input[type="submit"]{margin-left: 30%;}
    .wk-form span.wpcf7-form-control-wrap.recaptcha span.wpcf7-recaptcha{margin-left: 30%; display:block;}
    .wk-form span.wpcf7-list-item{margin: 0 0 1em 30%!important;}
}
