:root{
	--bgcolor-blue: #002b48;
	--bgcolor-dblue:#000b2d;
	--bgcolor-green: #081e08;
	--bgcolor-red: #2d0c01;
	--bgcolor-grey: #2c2c2c;
	--color-blue: #0099ff;
	--color-green: #339933;
	--color-red: #ff6633;
	--color-grey: #999999;
	--color-dblue: #0033cc;
	--bgcolor-blue: #002b48;
}

html {
  height:101%;
}

body {
  background:var(--bgcolor-blue);
  background-image:url("../img/fassade_sw_cropped07.svg");
  background-repeat:no-repeat;
  background-size:cover;
  background-position: center top;
  background-attachment:fixed;
  color:#333;
  font-family:Mulish, "Century Gothic", verdana, arial, helvetica, sans-serif;
  margin:auto;
  padding-top:3em;
  vertical-align:middle;
  font-size:1em;
}

#wrapper {
	width:90vw;
	max-width:1200px;
	background-color:#fefefe;
	margin:0 auto;
	padding-top:1em
}

header {
	margin:1em 0;
	border-top:1px solid #333;
	border-bottom:1px solid #333;
	padding:0em;
}
.mmheader,
header .inside {
  padding: 0 2.2em 0 2.2em;
  display:flex;
  justify-content: space-between;
  box-sizin:border-box;
}


#corners1, #corners2, #corners3 {
	display:block;
	height:25px;
	padding:10px;
	content:" ";
	clear:both;
}

#corners1{
	margin-top:-23px;	
}

#corners2 {
	margin-bottom:-23px;
}

#corners3{
  margin-top: -11px;
  padding: 0 10px;
}

#corners1:before {
	background-image:url("../img/ecke_lo.gif");
	width:25px;
	height:25px;
	display: inline-block;
	content:"";
	float:left;
}

#corners1:after {
	background-image:url("../img/ecke_ro.gif");
	width:25px;
	height:25px;
	display: inline-block;
	content:"";
	float:right
}


#corners2:before, #corners3:before {
	background-image:url("../img/ecke_lu.gif");
	width:25px;
	height:25px;
	display: inline-block;
	content:"";
	float:left;
}

#corners2:after, #corners3:after {
	background-image:url("../img/ecke_ru.gif");
	width:25px;
	height:25px;
	display: inline-block;
	content:"";
	float:right
}

#container {
	display:flex;
}



#main {
	padding-left:2.5em;
	box-sizing: border-box;
	flex-basis: calc(100% - 18em);
	width:calc(100% - 18em);
 height:100%;
  background:#fefefe;
  margin-top:1em;
  margin-bottom:2em;
}


#main_wide {
  width:978px;
  height:110%;
  background:#fefefe;
  margin-right:auto;
  margin-left:auto;
  margin-top:10px;
  margin-bottom:20px;

}


footer {
	border-top:1px solid #333;
	margin-top:1em;
	font-size:0.8em;
	

}
footer .inside {
	padding: 0 15px 5px 15px;
}

footer p {
	text-align:center;
}

.logo {
flex-basis: 25em;
  height: auto;
  float: right;
  text-align: right;
  align-self:center;
}


.logo figure {
	line-height: 1;
}


.logo img {
	width:100%;
	height:auto;
	display: block;
}


header .content-gallery{
	float: left;
  flex-basis: calc(100% - 25em);
  width: calc(100% - 25em);
}

header .content-gallery ul li {
	margin-right:0.5em;
}




#right {
	flex-basis: 18em;
  display: flex;
  justify-content: stretch;
  box-sizing: border-box;
}


#right .inside {
padding-right: 22px;
  border-left: 1px dotted #333;
  margin-left: 2.5em;
  padding-left: 0;
  width: 15.5em;
  box-sizing: border-box;
}


.mod_mobile_menu {
  display: none;
}
.menu{
	 width:auto;
	 min-height:340px;
	 height:100%;
	float:right;	 
	border-right: 1px solid var(--color-grey);
	text-align:right;
    overflow:visible;
    margin-top:0.5em;
 }
 
 
 .menu .level_2 {
 	font-size:0.9em;
 	display:none;
 }
.trail>.level_2, .active>.level_2 {
	display:block;
}
.menu a, .menu strong{
	 display: block;
  font-size: 1.1em;
  padding: 0 1em 0.15em 0;
  color: #666;
  text-decoration: none;
  margin-right: -7px;
  background-repeat: no-repeat;
  background-position: right center;
  line-height: 2;
 }
 
 
 .menu .level_2 a, .menu .level_2 strong{
	 background-repeat:no-repeat;
	 background-position:right center;
	 background-size: 11px 11px; 
	 margin-right:-6px;
 }
 
.menu a:hover, .menu a:active, .menu a.active, .menu strong {
	 background-image:url(../img/kasterl_grau.gif);
	 color:#666;
	 display:block;
	 margin-right:-7px;
 }
 
 .menu .level_2 a, .menu .level_2 strong{
	 background-repeat:no-repeat;
	 background-position:right center;
	 background-size: 11px 11px; 
	 margin-right:-6px;
 }
 
.menu .architekt a:hover, 
.menu .architekt strong, 
.menu .architekt a.trail, 
.menu .architekt a:active {
	 background-image:url(../img/kasterl_orange.gif);
	 color:#f63;
 }
 
.menu .phil a:hover, 
.menu .phil strong, 
.menu .phil a.trail, 
.menu .phil a:active {
	 background-image:url(../img/kasterl_blau.gif);
	 color:var(--color-dblue);
 }
.menu .kundmann a:hover, 
.menu .kundmann strong, 
.menu .kundmann a.trail, 
.menu .kundmann a:active  {
	 background-image:url(../img/kasterl_gruen.gif);
	 color:#393;
 }
.menu .kontakt a:hover, 
.menu .kontakt strong, 
.menu .kontakt a.trail, 
.menu .kontakt a:active {
	 background-image:url(../img/kasterl_blau.gif);
	 color:#03c;
 }
 
.menu .bilder a:hover, 
.menu .bilder strong, 
.menu .bilder a.trail, 
.menu .bilder a:active {
	 background-image:url(../img/kasterl_hblau.gif);
	 color:var(--color-blue);
 }
 
.menu .trail {
	font-weight:600;
}

a {
	font-weight:normal;
	text-decoration:none;
	color:var(--color-blue);
}

a img{
	border:0;
}

div{
	border:0;
	padding:0;
	margin:0;
	border-spacing:0;
	border-collapse:collapse;
}


h1 {
	font-size:1.2em;
	color:#666;

	margin:0;
	padding:0px 0px 20px 0px;
	text-transform:uppercase;
	
}

h1.bilder, .bilder h1 {

	color: var(--color-blue);

	margin:0;
	padding:0px 0px 10px 0px;
	text-transform:uppercase;
	
}

h2 {
	font-size:1.1em;
	color:#666;

	margin:0px 0px 15px 0px;
	padding:0px 0px 7px 0px;
	text-transform:uppercase;
	padding-bottom:5px;
	border-bottom:1px solid #666;
	
	
}

h3{
	
	font-size:1.05em;
	color:#666;

	margin:0;
	padding:0px 0px 3px 0px;
	text-transform:uppercase;
}

.architekt h1 {
	color:#f63;
}

.phil h1 {
	/* color:#6cf; */
	color:var(--color-dblue);
}

.kundmann h1 {
	/* color:#6cf; */
	color:#393;
}

h1.details_kund {
	/* color:#6cf; */
	color:#393;
	margin-left:180px;
}

.kundmann h2 {
	/* color:#6cf; */
	color:#393;
}

h2.details_kund {
	/* color:#6cf; */
	
	color:#03c;
}

.architekt h2{
	color:#f63;
}

h3.details{
	padding-bottom:5px;
	border-bottom:1px solid #666;
	margin:10px 0px 10px 0px;
}

h3.details_hblau{
	padding-bottom:5px;
	border-bottom:1px solid #666;
	color: #09f;
	margin:10px 0px 10px 0px;
}

h3.details_hgruen{
	padding-bottom:5px;
	border-bottom:1px solid #666;
	color: #6c9;
	margin:10px 0px 10px 0px;
}

h3.details_dgruen{
	padding-bottom:5px;
	border-bottom:1px solid #666;
	color:#099;
	margin:10px 0px 10px 0px;
}

h3.details_gruen{
	padding-bottom:5px;
	border-bottom:1px solid #666;
	color:#396;
	margin:10px 0px 10px 0px;
}

h3.details_tuerkis {
	padding-bottom:5px;
	border-bottom:1px solid #666;
	color:#0c6;
	margin:10px 0px 10px 0px;
}

h4 {
	font-size:1em;
	color:#666;

	margin:0;
	padding:0px 0px 3px 0px;
	text-transform:uppercase;
}

/*img {
	width:100%;
	height:auto;
}*/

p {
	text-align:justify;
	color:#333;
	margin:0;
	padding:0px 0px 12px 0px;
	line-height:140%;
}

p.subtable {
	margin-left:80px;
	vertical-align:middle;
}

p.subtable img {
	
	vertical-align:middle;
}

#maintext_details p , #maintext_details li{
	color:#333;
}


ul {
	list-style-type:none;
	padding:5px 0px 25px 16px;
	margin:0;
	color:#333;
}

ul.gruen {
	list-style-image:url(../img/kasterl_gruenmin.gif);
	color:#333;
}

ul.dgruen {
	list-style-image:url(../img/kasterl_dgruenmin.gif);
	color:#333;
}

ul.hblau {
	list-style-image:url(../img/kasterl_hblaumin.gif);
	color:#333;
}

ul.blau {
	list-style-image:url(../img/kasterl_blaumin.gif);
	color:#333;
}

li {
	line-height:160%;
	padding:0;
	margin:0;
}

ul.blau li{
	
}

ul.dgruen li{
	
}
.right{
	float:right;
}

.left{
	float:left;
}


.clear_right{
	clear:right;
}




#headertop, #headerbottom, #bottom {
 background:#fefefe;
 background-image:url(../img/pixel_grau.gif);
 background-repeat:repeat-x;
 background-position: left 20px;
 height:40px;
 width:800px;
 margin:0;
 padding:0; 
 border:0;
}

/*#header{
margin:0;
	border:0;
	padding:0px 45px 0px 60px;

}


#logo {
	float:right;
	margin-top:38px;
	margin-left:40px;
}


#header img {
	padding:0px 7px 0px 0px;
}

*/
.cornerleft {
	float:left;
	margin-top:9px;
	margin-left:20px;
}

.cornerright {
	float:right;	
	margin-top:9px;
	margin-right:20px;
}


#content {
	width:800px;
	min-height:340px;
	height:100%;
	
}

#content_wide {
	width:978px;
	min-height:340px;
	height:100%;
	
}

#content img.right{
	float:right;
	margin-left:10px;
}

#maintext {
	width:498px;
	min-height:340px;
	height:100%;
	margin:0;
	padding:5px 30px 0px 60px;
	border-right:1px dotted #999;
}

#maintext_wide {
	width:677px;
	min-height:340px;
	height:100%;
	margin:0;
	padding:5px 30px 0px 60px;
	border-right:1px dotted #999;
}



#maintext_details {
	width:498px;
	min-height:340px;
	height:100%;
	margin:0;
	padding:5px 30px 0px 60px;
	border-right:1px dotted #999;
	font-size:11px;
	color:#333;
}


table.impressum td{
	border:0;
	border-spacing:0;
	margin:0;
	padding:2px;
	color:#333;
	vertical-align:top;
	/* font-family:arial,vedana,helvetica, sans-serif; */
	line-height:160%;
	hyphens:auto;
}

table.impressum tr td:first-child{
	padding-right:8px;
	color:#09f;
	width:140px;
	
}

table.impressum a{

	color:#666;
	font-weight:normal;
	text-decoration:none;
	
}


 
 #subkund {
	 padding:0px 0px 10px 0px;
 }
 
 
 #subkund a:link, #subkund a:visited {
	 padding:0px 50px 2px 0px;
	 color:#999;
	 font-size:11px;
 }
 
 #subkund a:hover, #subkund a:active, #subkund a.active, #subkund a.active:visited, #subkund a.active:active {
	 padding:0px 50px 2px 0px;
	 background-image:url(../img/kasterl_gruenkl.gif);
	 background-repeat:no-repeat;
	 background-position:168px center;
	 color:#393;
	 font-size:11px;
 }
 
 
 
#adress {
	 
	 padding:80px 35px 0px 0px;
	 vertical-align:bottom;
	 font-size:10px;
 }
 
#adress p{
	 text-align:center;
 }
 
.dblau {
	color: #036;
}

.hblau {
	color: #09f;
}

.blau {
	color: #03c;
}

.dgruen {
	color:#099;
}

.gruen {
	color:#396 ;
}

.hgruen {
	color: #6c9;
}

.hhgruen {
	color: #9c0;
}

.lila {
	color: #939;
}

.orange {
	color:#f63;
}

.rot {
	color:#f33;
}
.tuerkis {
	color:#0ff;
}




table.uebersicht_wide {
	font-size:11px;

	border-spacing:0;
	border-collapse:collapse;
	color:#333;
	container-name: tops;
	container-type: inline-size;
	display:block;
	width:100%;
	border:0;
}

@container tops (width<600px) {
	td:nth-of-type(3), th:nth-of-type(3)  {
		display:none;
	}
}


@container tops (width<480px) {
	td:nth-of-type(5), th:nth-of-type(5),
	td:nth-of-type(6), th:nth-of-type(6),
	td:nth-of-type(7), th:nth-of-type(7),
	td:nth-of-type(8), th:nth-of-type(8){
		display:none;
	}
}

table.uebersicht td {
	border:1px solid #666;
	border-spacing:0;
	border-collapse:collapse;
	padding:2px 6px 2px 6px;
	color:#333;
}

table.uebersicht td a{
	font-weight:bold;
	color:#333;
	text-decoration:underline;
}

table.uebersicht th {
	font-weight:normal;
	border-spacing:0;
	border-collapse:collapse;
	vertical-align:top;
	padding:2px;
	
}


table.uebersicht tr.vergeben td a{
    font-weight:normal;
	color:#999;
}


table.uebersicht_wide {
	font-size:12px;
	border-spacing:0;
	border-collapse:collapse;
	color:#333;
	width:100%;
	margin-top:10px;
	
}

table.uebersicht_wide tr {
	height:2em;
}



table.uebersicht_wide td {
	border:1px solid #666;
	border-spacing:0;
	border-collapse:collapse;
	padding:2px 6px 2px 6px;
	color:#333;
	text-align:center;
}

table.uebersicht_wide td.top_name {
	text-align:left;
}


table.uebersicht_wide td a{
	font-weight:bold;
	color:#333;
	text-decoration:underline;
}

table.uebersicht_wide th {
	font-weight:normal;
	border-spacing:0;
	border-collapse:collapse;
	vertical-align:top;
	padding:2px;
	border:1px solid #666;
	
}

table.uebersicht_wide th, table.uebersicht_wide td {
	min-width:5%;
}

table.uebersicht_wide th.top_name {
	text-align:left;
	width:15%;
}

table.uebersicht_wide th.empty {
	font-weight:normal;
	border:0;
	border-spacing:0;
	border-collapse:collapse;
	vertical-align:top;
	padding:2px;
	
}

table.uebersicht_wide tr.vergeben td {
	/* text-decoration:line-through; */
	background:#dedede;
	color:#999;
}

table.uebersicht_wide tr.vergeben td.etage {
	/* text-decoration:line-through; */
	background:#fefefe;
	color:#333;
}

table.uebersicht_wide tr.vergeben td a{
    font-weight:normal;
	color:#999;
}


.topnr {
	float:right;
	margin:88px 20px 20px 0px;
}

.topnr h1{
	font-size:10px;
	text-transform:none;
	line-height:95%;
	
}

#grundriss  {
    text-align:left;
}

#grundriss h3 {

	padding-left:65px;
}

#grundriss a {
    text-decoration:underline;
	font-weight:normal;
	padding:0px 20px 0px 65px;
}

#grundriss a.back{
    text-decoration:underline;
	font-weight:bold;
	padding:0px 35px 0px 0px;
	color:#666;
	float:right;
}

#grundriss img {
    
	padding:10px 10px 0px 15px;
}

.top_number{
	background-color:#fc0;
	font-weight:bold;
}

td.top_name{
	background-color:#ff9;
	font-weight:bold;
	font-style:italic;

}

.top_single{
	background-color:#9c0;
}

.top_buero{
	background-color:#f90;
}

.top_plan{
	background-color:#0ff;
}

.top_details{
	background-color:#09f;
}
table.details_kurz {
	margin:0px 0px 15px 0px;
	
}

table.details_kurz td{
	padding:1px 18px 1px 0px;
	color:#333;
	vertical-align:bottom;
	line-height:130%;
}

.zur_uebers {
	float:right;

	font-size:11px;
}

.phppgmainbox {
	text-align:center;
	width:100%;
	padding-bottom:10px;
	
}

.phppgimagebox {
	margin-bottom:20px;
}

.phppgimagetag {
	padding:1px;
}

.imgtopframe {
	width:100%;
	height:13px;
}
.phppgimgframe {
	padding:0;
	margin:0;
	border:0;
	width:100%;
	
}


.imgcornerleft {
	float:left;
}

.imgcornerright {
	float:right;
}


.phppggifbox {
	margin-left:20px;
}

.none {
}


.media--right figure{
	margin:0.5em 0 1em 2em;
}

.media--left figure{
	margin:0.5em 2em 1em 0;
}

.content-downloads ul {
  display: flex;
  flex-flow: row wrap;
  container-name: downloads;
  container-type:inline-size;
  padding:0.5em;
}
.swiper-button-next, .swiper-button-prev, .swiper-pagination {
	display:none
}

@container downloads (min-width: 430px) {
	.download-element {
		flex-basis: calc(50% - 1em);
	padding-right:1em;
	padding-bottom:1em;
}
}




@container downloads (max-width: 429px) {
	.download-element {
		flex-basis: 100%;
}
}



/*#crossfade {
	position:relative;
}
#crossfade img{
	position:absolute;
	top:0;
	left:0;
}

#crossfade img:nth-child(2){
	animation: pulse 12s ease-in-out infinite;
	
}

@keyframes pulse {
  0% {
    opacity:0;
  }

  18% {
    opacity:0;
  }
  33% {
    opacity:1;
  }

  67% {
    opacity:1;
  }
  85% {
    opacity:0;
  }
  100% {
    opacity:0;
  }
}

*/

.vienneva {
	font-size:0.85em;
	color:#92a3ae;
	display:inline-block;
	margin-top:1em;
	background-color:var(--bgcolor-blue);
	padding:0 0.2em;
}
.vienneva a{
	color:#92a3ae;
}

/*.vienneva:before {
	border-top:1px dotted #666;
	content:" ";
	line-height:1px;
	margin:0.5em 0;
	
}*/