@charset "UTF-8";

* {
    border: 0;
    margin: 0;
    padding: 0;
}

ul {
    list-style: none;
}

table { 
    border-spacing: 0;
    border-collapse: collapse;
}

input,
textarea {
    border-radius: 0;
    outline: none;
    -webkit-appearance: none;
}

html {
    height: 100%;
}

body {
    background: #ffffff;
    height: 100%;
    width: 100%;
}

div#header {
    background: #ffffff;
    position: absolute;
    width: 100%;
    z-index: 10000;
}

div#header.fixed {
    position: fixed;
}

div#header div#header-container {
    height: 60px;
    margin: 0 auto 0 auto;
    padding: 35px 40px 35px 40px;
    width: 1000px;
}

div#header.fixed div#header-container {
    height: 40px;
    padding: 15px 40px 15px 40px;
}

a#logo,
a#logo:hover {
    background: transparent url(../images/logo-sprite-retina.png) no-repeat 0 0;
    background-size: 273px 100px;
    display: block;
    float: left;
    height: 60px;
    width: 273px;
}

div#header.fixed a#logo,
div#header.fixed a#logo {
    background: transparent url(../images/logo-sprite-retina.png) no-repeat 0 -60px;
    background-size: 273px 100px;
    height: 40px;
    width: 182px;
}

div#navigation {
    float: right;
    height: 20px;
    padding: 38px 0 0 0;
}

div#header.fixed div#navigation {
    padding: 10px 0 0 0;
}

div#navigation ul li {
    color: #000000;
    float: left;
    font: 700 normal 18px/20px Lato, Arial, Verdana, Tahoma, sans-serif;
    padding: 0 25px 0 0;
    text-transform:  uppercase;
}

div#navigation ul li:last-child {
    padding: 0 0 0 0;
}

div#navigation ul li a,
div#navigation ul li a:hover {
    color: #000000;
    display: block;
    text-decoration: none;
}

div#navigation ul li a:hover {
    color: #9fa51c;
}

div#container {
    padding: 130px 0 0 0;
    min-width: 1080px;
}

div#image-1,
div#image-2,
div#image-3,
div#image-4,
div#image-5 {
    height: 550px;
    width: 100%;
}

div#image-1 {
    background: transparent url(../images/image-1.jpg) no-repeat center center;
    background-size: cover;
    height: 600px;
}

div#image-2 {
    background: transparent url(../images/image-2.jpg) no-repeat center center;
    background-size: cover;
}

div#image-3 {
    background: transparent url(../images/image-3.jpg) no-repeat center center;
    background-size: cover;
}

div#image-4 {
    background: transparent url(../images/image-4.jpg) no-repeat center center;
    background-size: cover;
}

div#image-5 {
    background: transparent url(../images/image-5.jpg) no-repeat center center;
    background-size: cover;
}

div.content {
    width: 100%;
}

div.content.red {
    background: #cd1316 url(../images/content-background-red.png) repeat-y center top;
}

div.content.green {
    background: #9fa51c url(../images/content-background-green.png) repeat-y center top;
}

div.content.brown {
    background: #a66c3e url(../images/content-background-brown.png) repeat-y center top;
}

div.content.grey {
    background: #eeebe5 url(../images/content-background-grey.png) repeat-y center top;
}

div.content div.content-container {
    margin: 0 auto 0 auto;
    padding: 0 40px 0 40px;
    width: 1000px;
}

div.content div.content-left {
    float: left;
    padding: 70px 0 70px 0;
    width: 330px;
}

div.content div.content-left h1,
div.content div.content-left h2,
div.content div.content-left h3,
div.content div.content-left h4,
div.content div.content-left h5,
div.content div.content-left h6 {
    color: #ffffff;
    font: 700 italic 40px/48px Lato, Arial, Verdana, Tahoma, sans-serif;
    padding: 0 0 22px 0;
}

div.content div.content-left p {
    color: #ffffff;
    font: 400 normal 16px/22px Lato, Arial, Verdana, Tahoma, sans-serif;
    padding: 0 0 22px 0;
}

div.content div.content-left p a,
div.content div.content-left p a:hover {
    color: #ffffff;
    text-decoration: underline;
}

div.content div.content-left p a:hover {
    text-decoration: none;
}

div.content div.content-left ul.content-navigation {
    width: 330px;
}

div.content div.content-left ul.content-navigation li {
    color: #ffffff;
    font: 400 normal 18px/24px Lato, Arial, Verdana, Tahoma, sans-serif;
    text-transform: uppercase;
}

div.content div.content-left ul.content-navigation li a,
div.content div.content-left ul.content-navigation li a:hover {
    color: #ffffff;
    display: block;
    padding: 10px 0 10px 0;
    text-decoration: none;
}

div.content div.content-left ul.content-navigation li.active a,
div.content div.content-left ul.content-navigation li a:hover {
    background: url(../images/content-navigation-active.png) repeat-y 0 0;
}

div.content.grey div.content-left h1,
div.content.grey div.content-left h2,
div.content.grey div.content-left h3,
div.content.grey div.content-left h4,
div.content.grey div.content-left h5,
div.content.grey div.content-left h6 {
    color: #000000;
}

div.content.grey div.content-left p {
    color: #000000;
}

div.content.grey div.content-left p a,
div.content.grey div.content-left p a:hover {
    color: #000000;
}

div.content div.content-right {
    float: right;
    padding: 70px 0 48px 80px;
    width: 590px;
}

div.content.red div.content-right {
    background: #b90c0f;
}

div.content.green div.content-right {
    background: #919717;
}

div.content.brown div.content-right {
    background: #9c6437;
}

div.content.grey div.content-right {
    background: #eae6dd;
}

div.content div.content-right p {
    color: #ffffff;
    font: 400 normal 16px/22px Lato, Arial, Verdana, Tahoma, sans-serif;
    padding: 0 0 22px 0;
}

div.content div.content-right p a,
div.content div.content-right p a:hover {
    color: #ffffff;
    text-decoration: underline;
}

div.content div.content-right p a:hover {
    text-decoration: none;
}

div.content.grey div.content-right p {
    color: #000000;
}

div.content.grey div.content-right p a,
div.content.grey div.content-right p a:hover {
    color: #000000;
}

div.content div.content-right table {
    border-bottom: 2px solid #adb151;
    margin: 0 0 22px 0;
    width: 100%;
}

div.content div.content-right table tr {
    border-top: 2px solid #adb151;
    width: 100%;
}

div.content div.content-right table tr td {
    color: #ffffff;
    font: 400 normal 16px/22px Lato, Arial, Verdana, Tahoma, sans-serif;
    padding: 7px 0 7px 0;
}

div.content div.content-right table tr td a,
div.content div.content-right table tr td a:hover {
    color: #ebef9a;
    text-decoration: underline;
}

div.content div.content-right table tr td a:hover {
    text-decoration: none;
}

div.content div.content-right div.content-partner {
    float: left;
    height: 100px;
    margin: 0 0 40px 40px;
    width: 170px;
}

div.content div.content-right div.content-partner.clarins {
    background: url(../images/content-partner-sprite-retina.png) no-repeat 0 0;
    background-size: 170px 600px;
}

div.content div.content-right div.content-partner.lamer {
    background: url(../images/content-partner-sprite-retina.png) no-repeat 0 -100px;
    background-size: 170px 600px;
}

div.content div.content-right div.content-partner.schrammek {
    background: url(../images/content-partner-sprite-retina.png) no-repeat 0 -200px;
    background-size: 170px 600px;
}

div.content div.content-right div.content-partner.artdeco {
    background: url(../images/content-partner-sprite-retina.png) no-repeat 0 -300px;
    background-size: 170px 600px;
}

div.content div.content-right div.content-partner.cnc {
    background: url(../images/content-partner-sprite-retina.png) no-repeat 0 -400px;
    background-size: 170px 600px;
}

div.content div.content-right div.content-partner.gehwol {
    background: url(../images/content-partner-sprite-retina.png) no-repeat 0 -500px;
    background-size: 170px 600px;
}

div.content div.content-right div.content-kontakt-1 {
    float: left;
    width: 300px;
}

div.content div.content-right div.content-kontakt-2 {
    float: left;
    width: 290px;
}

div.content div.content-end {
    clear: both;
}

div#map {
    background: #ffffff;
    height: 550px;
    width: 100%;
}