/* BODY ================================================== */
body {
  color: #EEE;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: center;
  background-size: cover;
  background-color: rgba(31, 0, 0, 0.3);
  font-family: "Lucida Bright", serif;
  padding-top:40px;
  padding-bottom:40px;
}
body.werkstatt{
  background-image: url("/img/graphic/background/VLMS9140-1920.jpeg");
}
body.einstieg{
  background-image: url("/img/graphic/background/kacheln-1920.jpeg");
}
body.about{
  background-image: url("/img/graphic/background/kacheln-1920.jpeg");
}
body.vst{
  background-image: url("/img/graphic/background/MadMuni1-1920.jpg");
}
/* TYPOGRAPHY ================================================== */
@font-face {
  font-family: 'Lucida Bright';
  src: url('../fonts/lucida-bright.eot');
  src: url('../fonts/lucida-bright.eot?#iefix') format('embedded-opentype'), url('../fonts/lucida-bright.woff2') format('woff2'), url('../fonts/lucida-bright.woff') format('woff'), url('../fonts/lucida-bright.ttf') format('truetype'), url('../fonts/lucida-bright.svg#lucida-bright') format('svg');
}
h3.left{
	text-align: left;
}
h3.right{
	text-align: right;
}
a, a:link{
	text-decoration: none;;
	color: #EEE;
}
a:visited{
	text-decoration: none;
	color: #DDD;
}
a:hover{
	text-decoration: none;
	color: #FFF;
}
a:active{
	text-decoration: none;
}
.featurette-heading {
  font-weight: 300;
  line-height: 1;
  letter-spacing: -1px;
}
.marketing h2 {
  font-weight: normal;
}
.event{
  padding-top: 10px;
  font-weight: normal;
}
p.event a{
  color: inherit;
}
div.col-md-4 p.lead {
 white-space: nowrap;
}
/* jQUERY PLUGIN STYLING ================================================== */
div.paginatediv{
	 display: none;
}
#infscr-loading, div.message.col-md-12 {
    display: none;
}
/* CONTENT ================================================== */
div.container.marketing, .container.marketing.footer{
	padding-top: 25px;
	background-color: #080707;
	opacity: 0.95;
}
footer.container.marketing{
  padding-left: 15px;
  padding-right: 15px;
}
div.container.marketing.post{
  background-color: #080707;
  opacity: 1;
}
.marketing .col-lg-4 {
  margin-bottom: 20px;
  text-align: center;
}
.marketing .col-lg-4 p, .marketing .col-md-3 p {
  margin-right: 10px;
  margin-left: 10px;
}
.col-md-6, .col-md-4, .col-md-12, .col-md-3{
  margin-bottom: 15px;
  padding-bottom: 15px;
}
.row.featurette{
  margin-top: 25px;
  margin-bottom: 25px;
}

.row.featurette:first-child{
margin-top: 0px;
}
.row.featurette.i{
	display: none;
}
.row.featurette.showthis{
	display: block;
}

 div.col-md-3 p.lead span.text-muted, div.col-md-4 p.lead span.text-muted{
 font-size: 80%
 }

/* Bild oben links in der Detailansicht */
.col-md-5.col-md-pull-7{
  opacity: 0.9;
}
.col-md-5.col-md-pull-7:hover{
  opacity: 1;
  transition: 1s;
}
.firstrow{
  margin-top: 40px;
}
/* @MEDIA ================================================== */
@media only screen
  and (max-device-width: 500px){
    body{
		    background-image: none;
        background-color: rgba(12, 12, 12, 0.6);
	  }
}
/* Page background-image landscape & portrait for iPad 3 */
@media only screen
  and (min-device-width: 768px)
  and (max-device-width: 1024px)
  and (orientation: landscape)
  and (-webkit-min-device-pixel-ratio: 2) {
	  .page-bg {
		    height: 768px;
	  }
}
@media only screen
  and (min-device-width: 768px)
  and (max-device-width: 1024px)
  and (orientation: portrait)
  and (-webkit-min-device-pixel-ratio: 2) {
	  .page-bg {
		    height: 768px;
	  }
}

/*Schrift Portrait grösser */
@media only screen
  and (min-device-width : 250px)
  and (max-device-width : 769px)
  /*and (orientation: portrait)*/{
    p.lead,span.muted,h2.featurette-heading, h2.lead {
      font-size: 150%!important;
  }
/*
iPad container margin&paddings
*/
@media only screen
      and (orientation: portrait)
      and (min-width: 767px)
      and (max-width: 768px){
        div.container.marketing.firstrow, div.container.marketing.post{
          padding-top: 25px;
          margin-top: 0px;
        }

        div.row.featurette.i.showthis{
          margin-top: 0;
          margin-bottom: 0px;
        }
        footer.marketing.container{
          margin-right: 10%;
          padding-top: 0px;
        }

      }

/*
Bis Bildschirmbreite 767px
HOCHKANT Ränder LI&RE
Padding top raus
Hintergrundbilder kleiner
*/
@media only screen
    and (min-width: 1px)
    and (max-width: 767px){
      body.werkstatt{
        background-image: url("/img/graphic/background/VLMS9140-1024.jpeg");
      }
      body.einstieg{
        background-image: url("/img/graphic/background/kacheln-768.jpeg");
      }
      body.about{
        background-image: url("/img/graphic/background/kacheln-768.jpeg");
      }
      body.vst{
        background-image: url("/img/graphic/background/MadMuni1-1024.jpg");
      }
      div.container.marketing.firstrow, div.container.marketing.post{
        padding-top: 25px;
        margin-left: 10%;
        margin-right: 10%;
        margin-top: 0px;
      }

      div.row.featurette.i.showthis{
        margin-top: 0px;
        margin-bottom: 0px;
      }

      footer.marketing.container{
        margin-left: 10%;
        margin-right: 10%;
        padding-top: 0px;
      }
    }
@media only screen
  and (min-width: 1px)
  and (max-width: 667px){
    body.werkstatt{
      background-image: url("/img/graphic/background/VLMS9140-667.jpeg");
    }
    body.einstieg{
      background-image: url("/img/graphic/background/kacheln-667.jpeg");
    }
    body.about{
      background-image: url("/img/graphic/background/kacheln-667.jpeg");
    }
    body.vst{
      background-image: url("/img/graphic/background/MadMuni1-667.jpg");
    }
}