/*
Theme Name: BRENNE - 2.4
Theme URI: http://www.brenne-architekten.de
Author: carola plappert graphic design // offo.studio
Author URI: http://www.caropla.de
Description: BRENNE ARCHITEKTEN
Version: 2.4
License: Copyright Brenne Architekten 2026
*/


/* ========================================================================== RESET */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
	-webkit-text-size-adjust: 100%; 
	text-transform: none;
}
html {
	overflow-y: scroll;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}


/* ========================================================================== TYPO */

/* Fonts: Bold + Light

 * @license
 * MyFonts Webfont Build ID 2958471, 2015-01-23T05:46:57-0500
 * 
 * The fonts listed in this notice are subject to the End User License
 * Agreement(s) entered into by the website owner. All other parties are 
 * explicitly restricted from using the Licensed Webfonts(s).
 * 
 * You may obtain a valid license at the URLs below.
 * 
 * Webfont: ZurichBT-Light by Bitstream
 * URL: http://www.myfonts.com/fonts/bitstream/zurich/light/
 * 
 * Webfont: ZurichBT-Bold by Bitstream
 * URL: http://www.myfonts.com/fonts/bitstream/zurich/bold/
 * 
 * 
 * License: http://www.myfonts.com/viewlicense?type=web&buildid=2958471
 * Licensed pageviews: 10,000
 * Webfonts copyright: Copyright 1990-2003 Bitstream Inc. All rights reserved.
 * 
 * © 2015 MyFonts Inc
*/
@import url("//hello.myfonts.net/count/2d2487");
@font-face {
    font-family: 'ZurichBT-Bold';
    src: url('fonts/2D2487_1_0.eot');
    src: url('fonts/2D2487_1_0.eot?#iefix') format('embedded-opentype'),
        url('fonts/2D2487_1_0.woff2') format('woff2'),
        url('fonts/2D2487_1_0.woff') format('woff'),
        url('fonts/2D2487_1_0.ttf') format('truetype');
	font-weight: 700;
	font-style: normal;}
 
 
/* Fonts: Regular

 * @license
 * MyFonts Webfont Build ID 2962898, 2015-01-30T10:48:59-0500
 * 
 * The fonts listed in this notice are subject to the End User License
 * Agreement(s) entered into by the website owner. All other parties are 
 * explicitly restricted from using the Licensed Webfonts(s).
 * 
 * You may obtain a valid license at the URLs below.
 * 
 * Webfont: ZurichBT-Roman by Bitstream
 * URL: http://www.myfonts.com/fonts/bitstream/zurich/zurich/
 * Copyright: Copyright 1990-2003 Bitstream Inc. All rights reserved.
 * Licensed pageviews: 10,000
 * 
 * 
 * License: http://www.myfonts.com/viewlicense?type=web&buildid=2962898
 * 
 * © 2015 MyFonts Inc
*/

/* @import must be at top of file, otherwise CSS will not work */
@import url("//hello.myfonts.net/count/2d35d2");
@font-face {font-family: 'ZurichBT-Roman';
    src: url('fonts/2D35D2_0_0.eot');
    src: url('fonts/2D35D2_0_0.eot?#iefix') format('embedded-opentype'),
        url('fonts/2D35D2_0_0.woff2') format('woff2'),
        url('fonts/2D35D2_0_0.woff') format('woff'),
        url('fonts/2D35D2_0_0.ttf') format('truetype');
	font-weight: 400;
	font-style: normal;}

@font-face {
	font-family: 'themify';
	src:url('fonts/themify.eot?-fvbane');
	src:url('fonts/themify.eot?#iefix-fvbane') format('embedded-opentype'),
		url('fonts/themify.woff?-fvbane') format('woff'),
		url('fonts/themify.ttf?-fvbane') format('truetype'),
		url('fonts/themify.svg?-fvbane#themify') format('svg');
	font-weight: 400;
	font-style: normal;
}

::selection {
    background: #000;
    color: #fff;
}
::-moz-selection {
    background: #000;
    color: #fff;
}
h1, h2, h3, h4, b, strong, .strong { 
	font-family: 'ZurichBT-Bold', sans-serif;
    font-size: 11px;
    line-height: 1.25em;
	font-style: normal;
	font-weight: 700;
	color: #000;
}
p {    
	padding-bottom: 16px;
}
em {
	text-decoration: none; 
	font-style: normal;
	font-weight: 400;
	border-bottom: 1px solid #000;
	padding-bottom: 1px;
}
a {
	outline: none;
	font-style: normal;
	font-weight: 400;
	color: #31539d;
	text-decoration: none;
	border-bottom: 1px solid #fff;
	padding-bottom: 0px;
}
a:hover {
	color: #31539d;
	border-bottom: 1px solid #31539d;
}


/* ========================================================================== BASIC */
 
body {
	font-family: 'ZurichBT-Roman', sans-serif;
    font-size:  11px;
	font-style: normal;
	font-weight: 400;
    line-height: 1.5em;
	letter-spacing: 0em;
	color: #000;
	background-color: #fff;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;	  
} 
#page {
	padding-right: 12px;	
	padding-left: 12px;
    margin-bottom: 48px;
}
#masthead {
	padding-top: 24px;
	height: 168px;
}
#logo {
	font-family: 'ZurichBT-Bold', sans-serif;
    font-weight: 700;
    font-size:  12px;
	width: 25%;
	float: left;
	padding-left: 4px;
	padding-right: 4px;
	box-sizing: border-box;
}
#logo a {
	border-bottom: none;
	text-transform: uppercase;
	color: #31539d;
	font-weight: 400;
}
#logo a:hover {
	border-bottom: none;
}
#logo-bar {
	width: 32px;
	height: 10px;
	background-color: #31539d;
	position: absolute;
	right: 0;
}
.cf::before,
.cf::after {
  content: " ";
  display: table;
} 
.cf::after {
  clear: both;
}
.cf {
  *zoom: 1;
}

#intro {
    display: none;
}


/* ========================================================================== NAVIGATION */

.mobile-navigation { display: none;}

.main-navigation {
	width: 75%;
	height: auto;
	float: left;
	text-align: left;
	box-sizing: border-box;
	line-height: 12px;	 
    position: relative;
}
.main-navigation a {
	color: #000;
	font-weight: 400;  
}
.main-navigation a:hover {
	color: #000;
}
.main-navigation ul li {
	display: inline-block;
	width: 33%;
	float: left;
    box-sizing: border-box;
    padding-left: 4px;
    padding-right: 4px;
}
.main-navigation ul li a {
	border-bottom: 1px solid #fff;
	color: #000;
	text-transform: none;
 	line-height: 12px; 
	text-decoration: none; 
	margin-bottom: 4px;
	display: inline-table;
	white-space: nowrap;
}
.main-navigation ul li a:hover {
	color: #000;
	border-bottom: 1px solid #000;
	width: auto;
}
.main-navigation ul li ul li{
	width: 100%;
	margin: 0;
	padding: 0;	
}
.main-navigation .current-menu-item > a,
.main-navigation .current-menu-ancestor > a,
.main-navigation .current_page_item > a,
.main-navigation .current_page_item a:hover, 
.main-navigation .current_page_ancestor > a {
	color: #000;
	border-bottom: 1px solid #000;
}
.main-navigation .current-post-ancestor > a   {
	color: #000;
	border-bottom: 1px solid #000;
 	width: auto;
} 
.main-navigation .sub-menu {
	display: none; 
}	
.main-navigation li.current-menu-item ul, 		
.main-navigation li.current_page_item ul, 
.main-navigation li.current-page-ancestor ul, 
.main-navigation li.current-menu-ancestor ul, 
.main-navigation li.current-menu-parent ul, 
.main-navigation li.current-page-parent ul, 
.main-navigation li.current_page_parent ul {
	display: block !important;
}



/** ========================================================================== BASIC */

article {
	box-sizing: border-box;
}
article.w_25 {
	margin-bottom: 8px;
	padding-right: 4px;
	padding-left: 4px;
}
.wrapper {
	margin: 0 auto;
	box-sizing: border-box;
}
.w_100 {
    width: 1048px;
}
.w_75 {
	width: 75%;
    float: left;
}
.w_50 {
	width: 50%;
    float: left;
}
.w_50 p {
	padding-right: 25%;
}

.w_25 {
	width: 25%;
    float: left;
}
.w_25:nth-child(4n+1) { 
	clear: both;
}

.w_25 .image { 
	overflow: hidden;		
	height: 165px;	
	width: 100%;
	margin-bottom: 8px;
	background-color: #31539d;
}
.w_25 .title {
	padding-bottom: 0;
}
.w_25 .text {
	margin-top: 0;
	padding-top: 0;
}
.w_25.v2 { 
	height: auto;
}
.w_25.v2 .image { 
	overflow: hidden;		
	width: 50%;
	background: #fff;
	position: relative;
}
.w_25.v2 p { 
	padding-bottom: 0 !important;
}

.col.left {
    float: left;
}
.col.left .inner {
    padding-left: 0;
    padding-right: 4px;
}
.col.right {
    float: right;
}
.col.right .inner {
    padding-right: 0;
    padding-left: 4px;
}

.text.cols  {
	text-align: left;
	width: auto;
	height: auto;
	margin-top: 16px;	
	padding-top: 0px;
	-webkit-column-count: 4; 
    -moz-column-count: 4; 
    column-count: 4;
	-webkit-column-gap: 8px;
	-moz-column-gap: 8px;
	column-gap: 8px;
}
.text.cols ul li {
	-webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
	padding-top: 4px;
	padding-bottom: 16px;
	list-style: none;
}
.text.cols ul li ul li{
	padding-top: 11px;
	padding-bottom: 0px;
	list-style: none;
	border-top: none;
}
.text.cols ul li img {
	heigth: auto;
	padding-top: 8px;
	padding-bottom: 0;
}
.w_50 .text.cols {
	-webkit-column-count: 2; 
    -moz-column-count: 2; 
    column-count: 2;
} 

.image img {
	width: 100%;
	height: auto;
	max-width: 100%;
}
.title {
	padding-bottom: 8px;
}
.text {
	margin-top: 16px;	
	padding-top: 4px;
	padding-right: 16px;
	padding-bottom: 16px;
	color: #000;
}

.caption {
	padding-bottom: 8px;
	text-align: left;
}
.intro .caption {
	padding-top: 8px;
}


.overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.05);
}

.bar {
	height: 8px;
	border-top: solid 1px #000;
}



/** ========================================================================== FOOTER */

.footer-text {
	color: #000;
	width: 25%;
	float: left;
}
.footer-navigation  {
	width: 75%;
	float: left;
}
.footer-navigation li {
	display: inline-table;
	width: 25%;
	margin-left: -4px;
	padding-left: 8px;
	padding-right: 0;
	padding-bottom: 0px;
	float: left
}
.footer-navigation a {
	color: #000;
	border-bottom: 1px solid #fff;	
}
.footer-navigation a:hover, .footer-navigation .current-menu-item > a {
	color: #000;
	border-bottom: 1px solid #000;	
	padding-bottom: 1px;
}


/** ========================================================================== IMAGES */

img,
a img {
	border: none !important;
}
p img {
	max-width: 100%;
}
.entry-content img,
.comment-content img,
.widget img {
	max-width: 100%; 
}
img[class*="align"],
img[class*="wp-image-"],
img[class*="attachment-"] {
	height: auto; 
}
img.size-full,
img.size-large,
img.header-image,
img.wp-post-image {
	width: 100%;
	height: auto; 
}
embed,
iframe,
object,
video {
	max-width: 100%;
}
.gallery-item {
	width: 100% !important;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	 
}
.alignleft  {
	width: 50% !important;
	height: auto;
	margin-top: 0;	
	margin-left: 0;	
	margin-right: 16px;	
	padding-top: 8px;
	box-sizing: border-box;
	float: left;
}
.alignright {
	width: 50% !important;
	height: auto;
	margin-top: 0;	
	margin-left: 16px;	
	margin-right: 0;	
	padding-top: 8px;
	box-sizing: border-box;
	float: right;
}
.aligncenter {
	width: 100% !important;
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.alignleft img,
.alignright img,
.aligncenter img {	
	width: 100% !important;
} 


/* ========================================================================== OFFOGALLERY */

.ogallery {
	width: 100%;
	overflow: hidden;
	box-sizing: border-box;
} 
.ogallery a {
	border: none;
}
.ogallery img {
	width: auto;
	height: auto;
	max-width: 100%;
	padding: 0px;
	box-sizing: border-box;
} 
.ogallery img.landscape {
	width: 100%;	
} 
.ogallery img.portrait {
	width: 100%;
}  
.ogallery .caption {
	color: #000;
	margin-bottom: 24px;
}
#rocketwrapper {
	position: fixed;
	bottom: 0;
	width: 100%;
	background: #fff;
	display: none;
}
#rocketwrapper.relative {
	position: relative;
}
.rocketbtn {
	width: 48px;
	height: 48px;
	float: right;
	font-size: 16px;
	line-height: 40px;
	text-align: right;
	color: #000;
	cursor: pointer;
    padding-right: 12px;
}
.rocketbtn:before {	
	font-family: 'themify'; 
	content: "\e648";
}
.rocketbtn:hover,
.rocketbtn:active {
    opacity: 1;
	color: #31539d;
	background: none;
}
#rocketwrapper.relative .rocketbtn {
    padding-right: 0;
}

/** ========================================================================== THICKBOX */

#TB_overlay {
	background: #fff !important;
	opacity: 0.9 !important;
}
#TB_window {
	box-shadow: 0 1px 30px rgba(0, 0, 0, .25);
	background-color: #000 !important;
	width: 1px !important;
}
#TB_window a, #TB_window a:hover {
	text-decoration: none !important;
	border: none !important; 
}
#TB_Image {
	border: 1px solid #000 !important;
	margin: 0 !important;
}
.screen-reader-text {
	display: none !important;
}
.tb-close-icon{
	color: #33ccff !important;
	display: none !important;
}
.tb-close-icon:hover{
	color: #fff !important;
}
.tb-close-icon:before {
	font: 12px 'FontAwesome' !important;
	font-weight: normal !important;
	content: '\33ccffd' !important;
	padding-left: 16px !important;
}
#TB_caption {
	display: none !important;
}
#TB_load {
	position: fixed;
	display: none !important;
}
#TB_load:before { 
	width: 200px !important;
	height: 200px !important;
	background-color: #000 !important;
	content: '\e646' !important;
	font: normal 20px/29px 'FontAwesome' !important;
	display: none !important;
}
#TB_closeWindow {
	display: none !important;
}

/** ========================================================================== CMPLZ COOKIE INFO */

#cmplz-manage-consent {display: none !important;}


/* ========================================================================== RESPONSIVE */
		
@media only screen and (min-width: 761px) and (max-width: 1040px) { 
.mobile-navigation { display: none;}

    #logo {
        width: 33.3334%;
    }
    .main-navigation {
        width: 66.6667%;
    }
    .main-navigation ul li {
        width: 33.3334%;
        box-sizing: border-box;
    }
    .w_100  {
        width: 792px;
    }
    .w_25 {
        width: 33.3334%;
    }
    .w_25:nth-child(4n+1) { 
        clear: none;
    }
    .w_25:nth-child(3n+1) { 
        clear: both;
    }
    .col.w_25 {
        width: 33.3334%;
    }
    /*.col.w_50,*/
    .col.w_75 {
        width: 66.6667%;
    }
    .col.w_75.l {
        width: 75%;
    }
    .w_100 .text.cols  {
        -webkit-column-count: 3; 
        -moz-column-count: 3; 
        column-count: 3;
    }
    .w_50 .text.cols  {
        -webkit-column-count: 2; 
        -moz-column-count: 2; 
        column-count: 2;
    }
    .w_50 p {
	padding-right: 0;
    }
    .w_50.t1 p {
	padding-right: 50%;
    }
    .w_50.t1,
    .w_50.t2 {
        width: 100%;
    }
    .w_50.t1 .text.cols,
    .w_50.t2 .text.cols  {
        -webkit-column-count: 3; 
        -moz-column-count: 3; 
        column-count: 3;
    }
    .footer-text {
        width: 33.3334%;
    }
    .footer-navigation  {
        width: 66.6667%;
    }

}


@media only screen and (min-width: 761px) and (max-width: 1040px) and (orientation:portrait) { 

    .mobile-navigation { display: none;}

    #masthead {
        margin-bottom: 32px;	
    }
    .main-navigation {
        width: 100%;
        clear: both;
        margin-top: 16px; 
    }
    .w_100 {
        width: 536px;
    }
    .col.w_25,
    .col.w_50,
    .col.w_75,
    .col.w_75.l {
        width: 100%;
    }
    .w_100 .text.cols {
        -webkit-column-count: 2; 
        -moz-column-count: 2; 
        column-count: 2;
        -webkit-column-gap: 8px;
        -moz-column-gap: 8px;
        column-gap: 8px;
    }

    .w_50.t1 {
        width: 100%;
    }
    .w_50 p,
    .w_50.t1 p {
	padding-right: 0;
    }
    .w_50.t2 {
        width: 100%;
    }
    .w_50.t1 .text.cols  {
        -webkit-column-count: 2; 
        -moz-column-count: 2; 
        column-count: 2;
    }

    .w_25 {
        width: 50%;
    }
    .w_25:nth-child(3n+1) { 
        clear: none;
    }
    .w_25:nth-child(2n+1) { 
        clear: both;
    }

}

@media only screen and (max-width: 760px)  {

    #masthead {
        height: 60px;
        width: 100%;
        position: fixed;
        top: 0;
        z-index: 999999;
        background: #fff;
    }
    #main {
        margin-top: 80px;
    }
    .main-navigation,
    #logo-bar {
        display: none;
    }
    #logo{
        width: 70%;
    }
    .w_100  {
        width: 100%;
    }
    .col.w_25,
    .col.w_50,
    .col.w_75 {
        width: 100%;
    }
    .col.w_75.l {
        width: 100%;
        padding-left: 0;
    }
    .w_100 .text.cols {
        -webkit-column-count: 1; 
        -moz-column-count: 1; 
        column-count: 1;
        -webkit-column-gap: 0;
        -moz-column-gap: 0;
        column-gap: 0;
        margin-left: 0;
        margin-right: 0;
    }

    .w_50.t1,
    .w_50.t2 {
        width: 100%;
    }
    .w_50.t1 .text.cols,
    .w_50.t2 .text.cols  {
        -webkit-column-count: 1; 
        -moz-column-count: 1; 
        column-count: 1;
    }
    .w_50 p {
	padding-right: 0;
    }
    .w_25 {
        width: 100%;
        height: auto;
    }
    .w_25:nth-child(2n+1) { 
        clear: none;
    }
    .w_25 .image,
    .w_25.v2 .image  {
        width: 100%;
        height: auto;
        background: #fff;
    }
    .rocketbtn {
        float: none;
        margin: 0 auto;
        padding: 0;
        text-align: center;
    }

} 

@media only screen and (max-width: 760px) and (orientation:landscape) { 

    #masthead {
        position: relative;
    }
    #main {
        margin-top: 20px;
    }
    .offnav-btn { 
        position: relative !important;
        float: right;
    }
    .w_100 {
        width: 100%;
    }

    .w_25,
    .col.w_25,
    .col.w_75 {
        width: 50%;
    }
    .col.w_75.l,
    .w_100 .text.cols {
        width: 75%;
        padding-left: 0;
    }
    .w_25:nth-child(2n+1) { 
        clear: both;
    }

}