*, *:after, *:before {
    box-sizing:border-box;
}

html, body {
  height: 100%;
}

html {
  -ms-text-size-adjust: none;
  -webkit-text-size-adjust: none;
}

body {
	margin:0;
	padding:0;
	background-color:#111;
  background-image: url(bg.jpg);
  background-size: cover;
  background-position: center center;
	font-size:100%;
	font-family: 'Merriweather',  Arial, Helvetica, serif;
	line-height:1.5;
  background-attachment: fixed;

  }


  	 @media only screen and (max-width:48em) {
     body {font-size:85%;}
	}


  #page  {
  max-width: 700px;
  color: #fff;
  margin: 0 auto;
  text-align: center;
  padding: 2em 1em;
 }

p {
  display: block;
  margin: 0 auto;
  max-width: 600px;
  text-align: left;
  font-weight: 300;
  line-height: 170%;
}
 h1 {
   font-size: 3.5em;
   margin: 0;
   padding: 0;
   font-weight: 400;
 }
 h2{
   font-size: 1.5em;
   margin: 0 0 3em 0;
   padding: 0;
   font-weight: 300;
   font-style: italic;
 }

 .sortiment {
   background: rgba(255,255,255, .2);
   padding: 1em;
   border-radius: 10px;
   text-align: left;
   font-size: 1em;
 }

 .kontakt {
   background: rgba(0,0,0, .2);
   padding: 1em .5em;
   border-radius: 10px;
   text-align: center;
   font-size: 1.25em;
   margin: 3em 0;
   font-weight: 300;
   line-height: 200%;

 }

 ul {

 }
 li {
   font-size: 0.9em;
   margin-bottom: 10px;
 }
hr {
  border-bottom: 0px;
  opacity: .5;
  margin: 4em 0;
}

  	 @media only screen and (max-width:48em) {
     hr {margin: 2em 0;}
	}

a {
  color: #fff;
  text-decoration: underline;
}

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