* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

/*--------------karte------------------*/
#content
{
  position:relative;
  height:100vh;
  top:160px;
}
body.is_tablet #content{width:100vw;}
body.is_smartphone #content{width:100vw;}

/* ---- isotope ---- */
 .headline {padding-left:12px;}
.projekte {
  background: #EEE;
  max-width: 1000px;
}
/* clear fix */
.projekte:after {
  content: '';
  display: block;
  clear: both;
}
/* color-shape */
#teaser {
  height:100vh;
  width:50vw;
  position:relative;
  left:15px;
  top:200px;
}
.box {
  float: left;
  overflow:hidden;
  padding:15px;
  min-height:400px;
}
.inner-box
{
border:1px solid #aaa;
padding:0px 0px 50px 0px;
height:auto;
height:100%;
background-color:white;
}

div.catconti_1 {position:absolute;top:12px;right:12px;width:auto;text-align:right;padding:8px;z-index:2;color:white;}
div.catconti_2 {position:absolute;top:56px;right:12px;width:auto;text-align:right;padding:8px;z-index:2;color:white;}

.teaser-text
{
  padding:12px;
  float:left;
}


/*--------------teaser------------------*/
.maincontent {
  margin-top:320px;
  min-height:calc(100vh - 500px);
}



/*--------------teaser------------------*/
body.is_tablet  .maincontent,
body.is_smartphone .maincontent {
  top:130px;
}

/*--------------karte------------------*/
#mapid {
  position:fixed;
  width:35vw;
  height: calc(100vh - 175px);
  right:0;
  top:175px;
}

/* --------------- filter ----------------*/
#filter {
  /*display:none;*/
  position:fixed;
  height:140px;
  top:175px;
  padding-left:28px;
  background-color: white;
  z-index:98;
}
#filter h1 {font-size:50px;margin-bottom:0px;margin-top:24px;}
/*.filters {padding-top:15px;}*/
body.is_tablet #filter{position:absolute;top:140px;width:100%;  height:70px; }
/*body.is_tablet .filters
{
padding-top:20px;
}*/
body.is_smartphone #filter{position:absolute;top:110px;width:100%;  height:140px; }
/*body.is_smartphone .filters
{
padding-top:20px;
}*/



/* ---- button-group ---- */
.button-group:after {
  content: '';
  display: block;
  clear: both;
}
.button-group .button {
  float: left;
  border-radius: 0;
  margin-left: 0;
  margin-right: 1px;
}
.button-group .button:first-child { border-radius: 0.5em 0 0 0.5em; }
.button-group .button:last-child { border-radius: 0 0.5em 0.5em 0; }
/* ui group */
.ui-group {
  display: block;
  margin:5px;
}
.ui-group h3 {
  display: block;
  vertical-align: top;
  line-height: 32px;
  margin-right: 0.2em;
  font-size: 16px;
}
.ui-group .button-group {
  display: inline-block;
  margin-right: 20px;
}
.hot-loc {font-weight:600;}
.hot-price {font-weight:600;}
.hot-open {font-weight:600;}


body.is_tablet header,
body.is_smartphone header
{
  /*position:relative;
  width:100%;
  left: 0px;*/
}
body.is_tablet #mapid,
body.is_smartphone #mapid
{
  position:relative;
  width:100%;
  height:400px;
  margin-top:100px;
  z-index:97;
}
body.is_tablet .maincontent,
body.is_smartphone .maincontent
{
  position:relative;
  margin-top:80px;
  width:100%;
  left: 0px;
}
body.is_tablet .flex-container,
body.is_smartphone .flex-container {
    margin-bottom: 130px;
}
/*#content
{
  position:relative;
  width:50vw;
  height:100vh;
  left:15px;
  top:120px;
}
#mapid {
  position:fixed;
  width:45vw;
  height: 100vh;
  right:0;
  top:110px;
}*/
/*popup karte*/
.leaflet-popup-content { font-size:16px;margin:8px 16px 8px 8px !important;}
.leaflet-popup-content p {margin:8px 0px !important;}
.leaflet-popup-content h4 {font-size:22px;}