/**
 * @file
 * Styles are organized using the SMACSS technique. @see http://smacss.com/book/
 *
 * When you turn on CSS aggregation at admin/config/development/performance, all
 * of these @include files will be combined into a single file.
 */

/* HTML element (SMACSS base) rules */
@import "normalize.css";

/* Layout rules */
@import "layouts/responsive.css";

/* Component (SMACSS module) rules */
@import "components/misc.css";
/* Optionally, add your own components here. */
@import "print.css";

/* SMACSS theme rules */
/* @import "theme-A.css"; */
/* @import "theme-B.css"; */



@font-face {
  font-family: 'italianno';
  src: url('../fonts/italianno/italianno-regular-otf-webfont.eot');
  src: url('../fonts/italianno/italianno-regular-otf-webfont.eot?iefix') format('eot'),
    url('../fonts/italianno/italianno-regular-otf-webfont.woff') format('woff'),
    url('../fonts/italianno/italianno-regular-otf-webfont.ttf') format('truetype'),
    url('../fonts/italianno/italianno-regular-otf-webfont.svg#webfontOkOndcij') format('svg');
  font-weight: normal;
  font-style: normal;
}



html {
    /*background: #383838;*/
    background: #000;
   /* height: 100%;*/
    overflow-y: scroll;
}

#page {
    background: #000 none repeat scroll 0 0;
    margin: 0 auto 0;
    max-width: 939px;
    min-height: 25em;
    position: relative;
    right: 1em;
    -webkit-box-shadow: 0px 2px 3px 2px rgba(56,56,56,1);
    -moz-box-shadow: 0px 2px 3px 2px rgba(56,56,56,1);
    box-shadow: 0px 2px 3px 2px rgba(56,56,56,1);
}

.page-node-46 #page {
    -webkit-box-shadow: unset;
    -moz-box-shadow: unset;
    box-shadow: unset;
  
}

.page-node-46 a {
  text-decoration:none;
  color:red;
  font-weight:bold;  
}

.page-node-46 a:hover {
  text-decoration:underline;
}

#header,
#page {
  color:#f2f2f2;
}

#header,
#header_top,
#header_top_center,
.header__name-and-slogan,
#site-name {
    max-height: 160px;
}


#header_top {
    background: #000;
    left: 0;
    margin: auto;
    max-width: 955px;
    padding: 1em 0 0;
    position:fixed;
    position: expression(fixed);
    right: 2em;
    width: 100%;
    z-index: 51;
}

#header_top_center {
    display: block;
    margin: auto;
    max-width: 960px;    
}


#site-name {
    font-family: italianno;
    font-size: 850%;
    font-weight: inherit;
    position: relative;
    top: -30px;
}


.header__name-and-slogan {
    display: inline-block;
    text-align: center;
    width: 80%;
}

.header__logo {
      bottom: 6px;    
    position:relative;
}

#site-name a {
    color: red;
    display: block;
    float: left;
    max-height: 100px;
    width: 100%;
}

#site-name a:hover {
  text-decoration:none;
}

#site-slogan {
    bottom: 0;
    display: block;
    font-size: 90%;
    position: relative;
    text-align: center;
}

#navigation-container {
    height: 4em;
    left: 0;
    margin: 9.5em auto 0;
    position:fixed;
    position: expression(fixed);
    right: 0;
    text-align: center;
    width: 1100px;
}

#navigation {
    display: block;
    height: 2em;
    margin: auto;
    max-width: 960px;
    position: relative;
    top: 0;
}


#navigation .links li, #navigation .menu li {
    padding: 0.15em 1.2em 0 0;
}

#main {
    font-size: 87%;
    line-height: 1.5em;
    padding-top:15em;
}


#navigation-start, #navigation, #navigation-end {
    background-color: #e02c2c;
    background-image: -webkit-gradient(linear, 100% 0%, 0% 100%,
        from(transparent), color-stop(0.25, transparent),
        color-stop(0.25, hsla(0,0%,0%,.15)), color-stop(0.50, hsla(0,0%,0%,.15)),
        color-stop(0.50, transparent), color-stop(0.75, transparent),
        color-stop(0.75, hsla(0,0%,0%,.15)), to(hsla(0,0%,0%,.15)));
    background-image: -webkit-linear-gradient(right top,
        transparent 0%, transparent 25%,
        hsla(0,0%,0%,.15) 25%, hsla(0,0%,0%,.15) 50%,
        transparent 50%, transparent 75%,
        hsla(0,0%,0%,.15) 75%, hsla(0,0%,0%,.15) 100%);
    background-image:
        -moz-linear-gradient(left bottom,
        transparent 0%, transparent 25%,
        hsla(0,0%,0%,.15) 25%, hsla(0,0%,0%,.15) 50%,
        transparent 50%, transparent 75%,
        hsla(0,0%,0%,.15) 75%, hsla(0,0%,0%,.15) 100%);
    background-image:
        -ms-linear-gradient(right bottom,
        transparent 0%, transparent 25%,
        hsla(0,0%,0%,.15) 25%, hsla(0,0%,0%,.15) 50%,
        transparent 50%, transparent 75%,
        hsla(0,0%,0%,.15) 75%, hsla(0,0%,0%,.15) 100%);
    background-image:
        -o-linear-gradient(right bottom,
        transparent 0%, transparent 25%,
        hsla(0,0%,0%,.15) 25%, hsla(0,0%,0%,.15) 50%,
        transparent 50%, transparent 75%,
        hsla(0,0%,0%,.15) 75%, hsla(0,0%,0%,.15) 100%);
    background-image:
        linear-gradient(right bottom,
        transparent 0%, transparent 25%,
        hsla(0,0%,0%,.15) 25%, hsla(0,0%,0%,.15) 50%,
        transparent 50%, transparent 75%,
        hsla(0,0%,0%,.15) 75%, hsla(0,0%,0%,.15) 100%);
    -webkit-background-size: 3px 3px;
       -moz-background-size: 3px 3px;
        -ms-background-size: 3px 3px;
         -o-background-size: 3px 3px;
            background-size: 3px 3px;
}
#navigation-start, #navigation-end {
    height: 50px;
    float: left;    
    width: 75px;
    position:fixed;
    position: expression(fixed);
}

#navigation-start {
    display: block;
    left: 0;
    margin: auto;
    max-width: 960px;
    right: 9em;
    top: 11em;
    width: 100%;
}

#navigation-end {
    display: block;
    right: 0;
    margin: auto;
    max-width: 960px;
    left: 5em;
    top: 11em;
    width: 100%;
}

#navigation {
    height: 50px;
    float: left;
    position: relative;
    width: 75px;
}

#navigation-start, #navigation-end {
    overflow: hidden;
}
#navigation-start {
    -webkit-box-shadow: inset 0 -25px 25px hsla(0,0%,0%,.2),
                        inset 0 0 0 2px hsla(0,0%,100%,.25),
                        inset 0 0 0 1px hsla(0,0%,0%,.75),
                        17px 1px 2px hsla(0,0%,0%,.4);
       -moz-box-shadow: inset 0 -25px 25px hsla(0,0%,0%,.2),
                        inset 0 0 0 2px hsla(0,0%,100%,.25),
                        inset 0 0 0 1px hsla(0,0%,0%,.75),
                        17px 1px 2px hsla(0,0%,0%,.4);
            box-shadow: inset 0 -25px 25px hsla(0,0%,0%,.2),
                        inset 0 0 0 2px hsla(0,0%,100%,.25),
                        inset 0 0 0 1px hsla(0,0%,0%,.75),
                        17px 1px 2px hsla(0,0%,0%,.25);
}
#navigation-end {
    -webkit-box-shadow: inset 0 -25px 25px hsla(0,0%,0%,.2),
                        inset 0 0 0 2px hsla(0,0%,100%,.25),
                        inset 0 0 0 1px hsla(0,0%,0%,.75),
                        -17px 1px 2px hsla(0,0%,0%,.4);
       -moz-box-shadow: inset 0 -25px 25px hsla(0,0%,0%,.2),
                        inset 0 0 0 2px hsla(0,0%,100%,.25),
                        inset 0 0 0 1px hsla(0,0%,0%,.75),
                        -17px 1px 2px hsla(0,0%,0%,.4);
            box-shadow: inset 0 -25px 25px hsla(0,0%,0%,.2),
                        inset 0 0 0 2px hsla(0,0%,100%,.25),
                        inset 0 0 0 1px hsla(0,0%,0%,.75),
                        -17px 1px 2px hsla(0,0%,0%,.25);
}
#navigation {
    font-size: 90%;
    left: 0;
    margin: auto;
    position:fixed;    
    position: expression(fixed);
    right: 2em;
    top: 10em;
    width: 90%;
    z-index:200;
    -webkit-box-shadow: inset 0 -25px 25px hsla(0,0%,0%,.2),
                        inset 0 0 0 2px hsla(0,0%,100%,.25),
                        inset 0 0 0 1px hsla(0,0%,0%,.75),
                        0 2px 5px hsla(0,0%,0%,.4);
       -moz-box-shadow: inset 0 -25px 25px hsla(0,0%,0%,.2),
                        inset 0 0 0 2px hsla(0,0%,100%,.25),
                        inset 0 0 0 1px hsla(0,0%,0%,.75),
                        0 2px 5px hsla(0,0%,0%,.4);
            box-shadow: inset 0 -25px 25px hsla(0,0%,0%,.2),
                        inset 0 0 0 2px hsla(0,0%,100%,.25),
                        inset 0 0 0 1px hsla(0,0%,0%,.75),
                        0 2px 5px hsla(0,0%,0%,.25);
}
#navigation:after, #navigation:before {
    border-top: 5px solid hsla(0,0%,0%,.5);
    bottom: -5px;
    content: '';
    height: 0;
    position: absolute;
    width: 0;
}
#navigation:after {
    border-left: 10px solid transparent;
    left: 0;
}
#navigation:before {
    border-right: 10px solid transparent;
    right: 0;
}
#navigation-start:after, #navigation-start:before, #navigation-end:after, #navigation-end:before {
    content: '';
    height: 50px;
    position: absolute;
    top: 0;
    width: 50px;
    -webkit-transform: rotate(45deg);
       -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
         -o-transform: rotate(45deg);
            transform: rotate(45deg);
}
#navigation-start:after, #navigation-end:after {
  /*background: #383838;*/
  background: #000;  
}
#navigation-start:after {
    left: -20px;
}
#navigation-end:after {
    right: -20px;
}
#navigation-start:before, #navigation-end:before {
    background: hsla(0,0%,0%,.5);
}
#navigation-start:before {
    left: -19px;
}
#navigation-end:before {
    right: -19px;
}
#navigation ul, #navigation li {
    list-style: none;
    margin: 0;
    padding: 0;
}
#navigation a {
    color: #f6f6f6;
    display: block;
    float: left;
    font: 1em/48px georgia, serif;
    text-align: center;
    text-decoration: none;
    text-shadow: 0 1px 1px hsla(0,0%,0%,.25);
    padding: 0 1em;
}
#navigation a:hover, #navigation a:focus {
    text-shadow: 0 1px 1px hsla(0,0%,0%,.25),
                 0 0 5px hsla(0,0%,100%,.5);
}
#navigation a:active {
    position: relative;
    top: 1px;
}




.view-mieterinnen {
    display: block;
    margin: auto;
    max-width: 840px;
}
.view-mieterinnen .views-row {
    border: 1px solid #c7c7c7;
    border-radius: 4px;
    display: inline-block;
    margin: 0.25em;
    max-width: 130px;
    padding: 0.5em 0.7em;
    text-align: center;
    width: 25%;
}

.view-mieterinnen .views-row:hover {
    border: 1px solid red;
}

.view-mieterinnen a {
  color:#fff;
  text-decoration:none;
}

.view-mieterinnen a:hover {
  color:#fff;
  text-decoration:underline;
}



.footer ul {
  margin: 0;
}


.footer_content {
    background: #383838 none repeat scroll 0 0;
    display: block;
    margin: auto;
    max-width: 939px;
    position: relative;
    right: 1em;
    /*border-radius:3px;*/
    -webkit-box-shadow: 0px 2px 3px 2px rgba(56,56,56,1);
    -moz-box-shadow: 0px 2px 3px 2px rgba(56,56,56,1);
    box-shadow: 0px 2px 3px 2px rgba(56,56,56,1);
    /*border-bottom-right-radius:3px;*/
}

.footer_content a {
  color:#fff;
  text-decoration:none;
}

.footer_content a:hover {
  text-decoration:underline;
}


#block-menu-menu-footer {
    font-size: 80%;
    padding: 0 0.5em 0 0;
    text-align: right;
}

#block-menu-menu-footer li {
    display: inline;
    list-style: outside none none;
}



.node-mieter .field-name-field-bilder {
    float: left;
    width: 50%;
}

.node-mieter .field-name-field-bilder .field-items .field-item {
    display: inline-block;
    margin: 0 0.5em 0 0;
}
.node-mieter .field-name-body {
    float: right;
    text-align: left;
    width: 49%;
}

.field-name-field-franzoesisch-abschluesse,
.field-name-field-verkehr,
.field-name-field-finger-und-dildospiele,
.field-name-field-massagen,
.field-name-field-bizarre-spiele,
.field-name-field-ns,
.field-name-field-sonstiges,
.field-name-field-kuessen {
    margin: 0 0 1em 0;
    width:49%;
}

.field-name-field-preise {
  float:right;
}


.field-type-taxonomy-term-reference .field-item {
    display: inline-block;
    margin: 0 0.5em 0 0;
}



.node-mieter .group-details {
    display: block;
    float: left;
    width: 25%;
}

.node-mieter .field-name-field-erreichbarkeit {
    float: left;
}

.node-mieter .field-name-body { 
    display: block;
    float: left;
    margin: 3em 0 2em;
    text-align: left;
    width: 100%;
}



.view-footer,
#block-block-1 {
    font-size: 80%;
    line-height: 1.4em;
    padding: 2em 5em 1em;
}



@media all and (max-width:1099px) {

#site-name {
    font-size: 620%;
}
  
#site-slogan {
    font-size: 80%;
}  
  

.footer_content {
    display: block;
    left: 0;
    right: 0;
    width: 100%;
}
  
	#navigation-start,
	#navigation-end {

	  display:none;
	
	} 

      #navigation {
	  display: block;
	  left: 0;
	  margin: auto;
	  position:fixed;
	  position: expression(fixed);	  
	  right: 0;
	  top: 10em;
	  width: 100%;
      }
	
	

      #header_top_center {
	  max-width: 900px;
      }

      .header__name-and-slogan {
	  width: 79%;
      }

      #header_top,
      #navigation-container, 
      #page {
	  max-width: 1000px;
      }

      #header_top,
      #navigation-container, 
      #page {
	  display: block;
	  margin: auto;
      }
      

      #navigation .links li, #navigation .menu li {
	  padding: 0.15em 0.25em 0;
      }
      
      #page {
	  left: 0;
	  max-width: 896px;
	  right: 0;
      }
  
}




@media all and (max-width:801px) {
  
  .header__name-and-slogan {
    display:none;
  }
}


@media all and (max-width:640px) {

#header_top {
    padding: 0.5em;
    border-bottom:1px solid gray;
    position: expression(fixed);
    position:fixed;
}

.header__logo img {
 max-height:95px;
}

.header__name-and-slogan {
 display:none;
 height:0;
 width:0;
 line-height:0;
}


#navigation-container {
    height: 150px;
    position: expression(fixed);
    position:fixed;
    z-index: 499;
}

#navigation-start,
#navigation-end {
  display:none;  
}

#navigation:after,
#navigation:before,
#navigation-start:before,
#navigation-end:before {
  display:none;
  border-right:none;
  border-left:none;
}
  
#navigation {
    box-shadow: none;
    box-sizing: unset;
    float: right;
    left: auto;
    margin: 0;
    max-width: 350px;
    padding-left: 0;
    padding-right: 0;
    position: expression(fixed);
    position:fixed;
    right: 0;
    top: 0;
    width: 60%;
    word-wrap: unset;
    z-index: 600;
}



#main-menu {
    background: #000 none repeat scroll 0 0;
    float: right;
    margin: 0;
    max-height: 111px;
    min-width: 320px;
    right: 0;
}

#navigation a {
    font: 1em/32px georgia,serif;
    padding: 0 0.5em;
}  


#navigation .links li, #navigation .menu li {
    background: red none repeat scroll 0 0;
    border-radius: 3px;
    float: right;
    margin: 0 0.25em 0.25em 0;
    padding: 0.15em 0.2em 0;
}

#main {
    line-height: 1.5em;
    padding: 11em 0 1em;
}

.view-mieterinnen .views-row {
    margin: 0.1em;
    max-width: 100px;
    padding: 0.1em;
    width: 30%;
}

.node-mieter .group-details,
.node-mieter .field-name-field-erreichbarkeit,
.node-mieter .field-name-field-franzoesisch-abschluesse,
.node-mieter .field-name-field-finger-und-dildospiele,
.node-mieter .field-name-field-verkehr,
.node-mieter .field-name-field-massagen,
.node-mieter .field-name-field-bizarre-spiele,
.node-mieter .field-name-field-ns,
.node-mieter .field-name-field-kuessen,
.node-mieter .field-name-field-sonstiges {
  width:40%;
  margin: 0 0 1em 1em;
  float:left;
}

.node-mieter .field-name-field-erreichbarkeit {
  margin: 0 0 0 1em;
}

}