* { 
margin: 0;
padding: 0;
}
@font-face {
font-family:'LatoWeb';
src: url('../../../fonts/Lato-Regular.eot'); /* IE9 Compat Modes */
src: url('../../../fonts/Lato-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('../../../fonts/Lato-Regular.woff2') format('woff2'), /* Modern Browsers */
url('../../../fonts/Lato-Regular.woff') format('woff'), /* Modern Browsers */
url('../../../fonts/Lato-Regular.ttf') format('truetype');
font-style: normal;
font-weight: normal;
text-rendering: optimizeLegibility;
}
html body { 
background:#fff;
font-family: 'LatoWeb',Arial,Helvetica,sans-serif;
font-size:13px;
line-height:24px;
color:#000;
}
#mobhome, #mobnav, #moblang, .slicknav_menu {
display:none;
}
.move-up {
display:none;
}
.move-up button {
display:none;
}
.ml50 {
margin-left:0px;
}
hr {
border: 0px;
border-top: solid 3px #000;
color:#000;
border-bottom: transparent;
margin:25px 0 30px 0;
}
#head {
width:100%;
margin:0;
padding:0;
background:transparent;
position:relative;
}
#title {
width:100%;
float:none;
margin:0;
padding:0;
text-align:center;
}
#title h1 {
color:#808080;
font-size:28px;
line-height:34px;
font-weight:normal;
text-align:center;
}
#title h1 a:link, #title h1 a:visited {
color:#808080;
font-size:28px;
line-height:34px;
font-weight:normal;
text-decoration:none;
}
#title h1 a:focus, #title h1 a:hover, #title h1 a:active {
color:#000;
}
nav {
display:none;
}
#lang {
display:none;
}
#container {
clear:both;
width:100%;
margin:0;
padding:0;
background:transparent;
}
#oben {
width:100%;
padding:0;
margin:20px 0 20px 0;
background:transparent;
text-align:center;
}
#oben img {
padding:0 6px 0 0;
margin:0;
}
#oben img.pl190 {
padding-left:0px;
}
#left {
float:none;
width:100%;
min-height:10px;
margin:0;
padding:0;
background:transparent;
}
#content {
float:none;
width:96%;
margin:0;
padding:2%;
background:transparent;
}
#content h1 {
font-size:18px;
line-height:18px;
font-weight:bold;
padding:0 0 15px 0;
margin:0;
}
#content h2 {
font-size:13px;
line-height:24px;
font-weight:bold;
padding:0 0 15px 0;
margin:0;
}
#content p {
padding:0 0 15px 0;
}
#content img {
padding:0 0 5px 0;
}
#content table {
padding:0 0 20px 0;
}
#content td {
padding:0 0 10px 0;
vertical-align:top;
}
#content a:link, #content a:visited {
color:#656565;
text-decoration:none;
}
#content a:focus, #content a:hover, #content a:active {
color:#000;
text-decoration:none;
}
#content ul {
list-style-position:outside;
padding:0;
margin:0 0 0 14px;
}
#content li {
padding:0 0 0 30px;
}
#content .subnav {
padding:0;
margin:0 0 30px 0;
overflow:auto;
}
#content .subnav ul {
list-style-type:none;
margin:0;
padding:0;
}
#content .subnav li {
float:left;
padding:0 20px 0 0;
margin:0;
}
#content .subnav li a:link, #content .subnav li a:visited {
font-size:13px;
line-height:13px;
text-transform:uppercase;
font-weight:normal;
text-decoration:none;
display:block;
}
#content .subnav li a:focus, #content .subnav li a:hover, #content .subnav li a:active {
color:#000;
}
.bildlinks {
float:left;
margin:0 15px 10px 0;
padding:0;
}
.bildrechts {
float:right;
margin:0 0 10px 15px;
padding:0;
}
.clr {
clear:both;
height:1px;
line-height:1px;
font-size:1px;
margin:0;
padding:0;
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ SLIDER ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.accordion {
  width: 100%;
  height: 325px;
  overflow: hidden;
  margin: 0 auto;
}

.accordion ul {
  width: 100%;
  display: table;
  table-layout: fixed;
  margin: 0;
  padding: 0;
}

.accordion ul li {
display: table-cell;
vertical-align: bottom;
position: relative;
width: 6.25%; /* 100 geteilt durch Bilderanazahl */
height: 292px;
background-repeat: no-repeat;
background-position: center center;
transition: all 500ms ease;
}
.accordion ul li div.caption {
display: block;
overflow: visible;
width: 100%;
position:absolute;
top:0px;
left:10px;
height:322px;
}
.accordion ul li div.capleft {
display: block;
overflow: visible;
width: 100%;
position:absolute;
top:0px;
left:10px;
height:322px;
}
.accordion ul li div.capright {
display: block;
overflow: visible;
width: 100%;
position:absolute;
top:0px;
left:0;
height:322px;
}

.accordion ul li div.caption a,
.accordion ul li div.capleft a,
.accordion ul li div.capright a {
  display: block;
  height: 292px;
  width: 100%;
  position:relative;
  z-index: 3;
  vertical-align: bottom;
  padding:0;
  box-sizing: border-box;
  color: #808080;
  text-decoration: none;
  transition: all 200ms ease;
}

.accordion ul li div.caption a *,
.accordion ul li div.capleft a *,
.accordion ul li div.capright a * {
  opacity: 0;
  margin: 0;
  width: 100%;
  position: relative;
  z-index: 5;
  white-space: nowrap;
  -webkit-transform: translateX(-20px);
  transform: translateX(-20px);
  -webkit-transition: all 400ms ease;
  transition: all 400ms ease;
}

.accordion ul li div.caption a h2,
.accordion ul li div.capleft a h2,
.accordion ul li div.capright a h2 {
overflow:visible;
color:#808080;
font-size:13px;
line-height:13px;
font-weight:normal;
text-decoration:none;
padding-top:302px;
}
.accordion ul li:nth-child(1) { background-image: url("http://www.christinaciupke.com/media/slider/christina-ciupke-untitled.jpg"); }
.accordion ul li:nth-child(2) { background-image: url("http://www.christinaciupke.com/media/slider/03_christina-ciupke.jpg"); }
.accordion ul li:nth-child(3) { background-image: url("http://www.christinaciupke.com/media/slider/01_christina-ciupke.jpg"); }
.accordion ul li:nth-child(4) { background-image: url("http://www.christinaciupke.com/media/slider/05_christina-ciupke.jpg"); }
.accordion ul li:nth-child(5) { background-image: url("http://www.christinaciupke.com/media/slider/06_christina-ciupke.jpg"); }
.accordion ul li:nth-child(6) { background-image: url("http://www.christinaciupke.com/media/slider/07_christina-ciupke.jpg"); }
.accordion ul li:nth-child(7) { background-image: url("http://www.christinaciupke.com/media/slider/08_christina-ciupke.jpg"); }
.accordion ul li:nth-child(8) { background-image: url("http://www.christinaciupke.com/media/slider/09_christina-ciupke.jpg"); }
.accordion ul li:nth-child(9) { background-image: url("http://www.christinaciupke.com/media/slider/10_christina-ciupke.jpg"); }
.accordion ul li:nth-child(10) { background-image: url("http://www.christinaciupke.com/media/slider/11_christina-ciupke.jpg"); }
.accordion ul li:nth-child(11) { background-image: url("http://www.christinaciupke.com/media/slider/13_christina-ciupke.jpg"); }
.accordion ul li:nth-child(12) { background-image: url("http://www.christinaciupke.com/media/slider/14_christina-ciupke.jpg"); }
.accordion ul li:nth-child(13) { background-image: url("http://www.christinaciupke.com/media/slider/15_christina-ciupke.jpg"); }
.accordion ul li:nth-child(14) { background-image: url("http://www.christinaciupke.com/media/slider/16_christina-ciupke.jpg"); }
.accordion ul li:nth-child(15) { background-image: url("http://www.christinaciupke.com/media/slider/17_christina-ciupke.jpg"); }
.accordion ul li:nth-child(16) { background-image: url("http://www.christinaciupke.com/media/slider/18_christina-ciupke.jpg"); }

.accordion ul:hover li { width: 10%; } /* Wenn sich die Bilderanzahl ändert */
.accordion ul:hover li:hover { width: 18%; }
.accordion ul:hover li:hover a * {
  opacity: 1;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}
@media screen and (max-width: 800px) {
.accordion ul:hover li:hover { width: 50%; }
}
@media screen and (max-width: 600px) {
.accordion { height: auto; }
.accordion ul li,
.accordion ul li:hover,
.accordion ul:hover li,
.accordion ul:hover li:hover {
  position: relative;
  display: table;
  table-layout: fixed;
  width: 100%;
  -webkit-transition: none;
  transition: none;
}
}