@charset "utf-8";

/*!
* File: screen.css
*
* @site           http://wagner-unfried-schuele.de
* @copyright      (c) finalart design, Dave Burkhart
* @author         Dave Burkhart
* @link           http://finalart.de
* @version        1.0
* @lastmodified   2014-12-30 11:33
*/
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box
}

html,
body,
div,
h1,
h2,
h3,
p,
ul,
ol {
  margin: 0;
  padding: 0
}

img {
  display: block;
  max-width: 100%;
  vertical-align: middle;
  width: auto;
  height: auto;
  border: 0
}

img::selection {
  background: transparent
}

body,
.normal {
  font: normal 17px/26px "Frutiger Next W01 Light", sans-serif;
  color: #290e28
}

body,
body#rechtsanwaelte,
body#ulrike-wagner,
body#vanessa-unfried,
body#ute-schuele,
body#mitarbeiter,
body#kontakt,
body#impressum {
  background-color: #250d24;
  background-image: url(/img/bg-home.jpg);
  background-repeat: no-repeat;
  background-position: center center;
  background-attachment: fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover
}

body#rechtsanwaelte {
  background-image: url(/img/bg-rechtsanwaelte.jpg)
}

body#ulrike-wagner {
  background-image: url(/img/bg-ulrike-wagner-rechtsanwaeltin.jpg)
}

body#vanessa-unfried {
  background-image: url(/img/bg-vanessa-unfried-rechtsanwaeltin.jpg)
}

body#ute-schuele {
  background-image: url(/img/bg-ute-schuele-rechtsanwaeltin.jpg)
}

body#mitarbeiter {
  background-image: url(/img/bg-mitarbeiter.jpg)
}

body#kontakt {
  background-image: url(/img/bg-kontakt.jpg)
}

body#impressum {
  background-image: url(/img/bg-impressum.jpg)
}

@import url("http://fast.fonts.net/t/1.css?apiType=css&projectid=61f58a1d-ab2e-4b5e-8a52-433eacf29649");

@font-face {
  font-family: "Frutiger Next W01 Light";
  src: url("/fonts/ed851bde-4b1b-45ca-9fbb-9603819932cf.eot?#iefix");
  src: url("/fonts/ed851bde-4b1b-45ca-9fbb-9603819932cf.eot?#iefix") format("eot"), url("/fonts/35288d5e-681e-4b64-a930-438d2b2551d6.woff") format("woff"), url("/fonts/1a22c75e-4022-43cd-a543-70ca36eb92aa.ttf") format("truetype"), url("/fonts/2c937a24-6a4c-47b2-b3f3-28173e19b53d.svg#2c937a24-6a4c-47b2-b3f3-28173e19b53d") format("svg")
}

@font-face {
  font-family: "Frutiger Next W01 Bold";
  src: url("/fonts/ce9ebe9b-6684-4783-8760-f3a20a0c52f0.eot?#iefix");
  src: url("/fonts/ce9ebe9b-6684-4783-8760-f3a20a0c52f0.eot?#iefix") format("eot"), url("/fonts/5f3f5b96-b77d-497d-a916-d483bc9c6c3f.woff") format("woff"), url("/fonts/209c5dbd-a0e8-4fdf-ada6-50628360eefd.ttf") format("truetype"), url("/fonts/44583fec-16e5-46d4-94b5-f779465dc4ec.svg#44583fec-16e5-46d4-94b5-f779465dc4ec") format("svg")
}

h1,
h2,
h3,
strong {
  font: normal 17px/26px "Frutiger Next W01 Bold", sans-serif
}

h1 {
  margin-bottom: 45px
}

p {
  margin: 10px 0
}

a:link,
a:visited,
a:hover {
  color: #290e28;
  text-decoration: none;
  border-bottom: 1px solid #b183aa
}

a:hover {
  border: 0
}

.wrap {
  width: 940px;
  margin: 30px auto
}

.e-mail:before {
  content: attr(data-website) "\0040"attr(data-user);
  unicode-bidi: bidi-override;
  direction: rtl
}

a.logo {
  color: #fff;
  font: normal 17px/26px "Frutiger Next W01 Bold", sans-serif;
  border: none;
}

#header {
  padding-left: 60px
}

.nav {
  list-style: none;
  padding: 25px 0
}

.nav a {
  color: #fff;
  border: 0
}

.nav a:hover,
.nav a.active {
  color: #b183aa
}

.teaser {
  clear: both;
  float: left;
  width: 100%;
  margin: 60px 0 0
}

.teaser img {
  float: left;
  width: 140px;
  margin-right: 30px
}

#main {
  float: right;
  width: 640px;
  margin: 60px 0 0;
  padding: 55px 30px 30px 60px;
  background: #fff
}

.article h2 {
  margin-top: 46px
}

.article-img {
  margin: 51px 0
}

#aside {
  float: left;
  width: 300px;
  height: 900px
}

#aside h2 {
  padding: 115px 0 0
}

.section {
  height: 450px;
  padding: 0 20px 0 60px
}

.section.gray {
  position: relative;
  background: rgba(212, 208, 212, 0.8)
}

.section.purple {
  background: rgba(41, 14, 40, 0.8)
}

.excerpt {
  position: absolute;
  bottom: 13px
}

@media only screen and (min-width:768px) and (max-width:991px) {
  .wrap {
    width: 700px
  }

  #main {
    width: 400px;
    padding: 60px 30px 30px 30px
  }
}

@media only screen and (max-width:767px) {
  .wrap {
    width: 480px
  }

  #header {
    padding-left: 90px
  }

  #main {
    float: left;
    width: auto;
    padding: 60px 30px 30px 30px
  }

  #aside {
    margin-left: 30px
  }

  #footer {
    padding: 60px 0 0 30px
  }
}

@media only screen and (max-width:479px) {
  .wrap {
    width: 320px
  }

  #aside {
    width: 290px
  }

  #aside h2 {
    padding: 120px 0 100px
  }

  .teaser {
    clear: both;
    float: none
  }

  .teaser img {
    float: none
  }

  .section {
    padding: 0 20px 0 60px
  }
}