  <style type="text/css">
        
        
  * {box-sizing:border-box}

/* Slideshow container */
.slideshow-container {
position: absolute;
width:30cm;
height: 20cm;
margin-left:200px;   
top:4cm;   
margin-top:0cm;
padding-left:0px; 
/*border-style: dotted;     */
}

/*
.thumb-container {
    top:16cm;
    float:left;
    
}
*/


.picture {
  
    display:block;
    margin-left: auto;
    margin-right: auto;
    top:3cm;
    
    height:15cm;
/*    width:20cm;*/
    
}

.katalogpic {
  
    display:block;
    margin-left: 2.4cm;
    margin-right: auto;
    top:3cm;
    
    height:15cm;
/*    width:20cm;*/
    
}

.mySlides {
    display: none;
    margin-left: 2cm;
    margin-right:2cm;
}

/* Next & previous buttons */
.prev {
  cursor: pointer;
  position: absolute;
  top: 17.3cm;
 margin-left:8.8cm;    
/*  width: auto;*/
  margin-top: -22px;
  padding: 16px;
/*  left:6cm;    */
  color: black;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 50%;
}

/* Position the "next button" to the right */
/*
.next {
  right: 0;
  border-radius: 50%;
}
*/
.next {
  cursor: pointer;
  position: absolute;
  top: 17.3cm;      
/*  width: auto;*/
/*  right:2cm;    */
  margin-top: -22px;
 margin-left:20cm;
    padding: 16px;
  color: black;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 50%;
}


/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color:#717171;   
}

/* Caption text */
.text {
  color: black;    
  font-size: 15px;
  padding: 0px 0px;    
  position: absolute;
  bottom: 0px;
  width: 100%;
  text-align: left;
}
        
.title {
  color: black;
  width:26cm;    
  font-size: 15px;
/*  padding: 0px 0px;*/
/*  padding-left:8cm;    */
  position: absolute;
  top: 17cm;
/*  left: 0cm;     */
/*  width: 100%;*/
  text-align: center;
  font-family:Futura, "Trebuchet MS", sans-serif;    
}
        
.information {
  color: black;
  width:26cm; 
    font-size: 12px;
/*  padding: 0px 0px;*/
  position: absolute;
/*  top:50%;  */
  top: 17.5cm;
/*  left: 0cm;    */
/*  width: 100%;*/
  text-align: center;
  font-family:Futura, "Trebuchet MS", sans-serif;
}        

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  cursor:pointer;
  height: 30px;
  width: 30px;
  margin: 30px 5px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}        
        
        
.thumbnail {
    margin-right: auto;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 5px;

}


#gallery{
/*    display: inline-block;*/
/*    position: absolute;*/
    text-align:center;
    margin: 2.5cm auto;
    display:none;
    
}


.thumbnail:hover {
    box-shadow: 0 0 1px 1px rgba(0, 140, 186, 0.5);
}        
        </style>     