/*! Tableiste */

@media all and (max-width: 899px) {
  .content-with-side-menu > .all-content {
    margin-left: 0; } }
.ff-tabs {
  display: flex;
  flex-wrap: wrap; }

.ff-tab-label {
  order: 1;
  display: block;
  padding: 5px 14px;
  cursor: pointer;
  font-family: 'Open Sans', Arial, sans-serif;
  font-size:1em;
  border:1px solid #333;
  border-bottom:none;
  /* text-transform:uppercase; */
  font-weight: lighter;
margin:1px;
  /*   color: #cccccc; */
border-radius: 0.5em 0.5em 0em 0em; 
 /* background: linear-gradient(to right bottom, #175ba2, #A8CAF3);  */
  opacity: 0.64; }

.ff-tab-content {
  display: none;
  width: 100%;
  order: 99;
  flex-grow: 1;
  padding: 16px;
  border-top: 1px solid #cccccc; 
  }

.ff-tab-select {
  display: none; }

.ff-tab-label:hover {
  color: #cccccc;
  /* background-color:#cccccc; */

  opacity: 0.64; }

.ff-tab-select:checked + .ff-tab-label {
  color: #cccccc;
 /*  background-color:#eeeeee; */

  opacity: 1; }

.ff-tab-select:checked + .ff-tab-label + .ff-tab-content {
  display: block; }

@media all and (max-width: 599px) {
  .ff-tabs .ff-tab-content,
  .ff-tabs .ff-tab-label {
    order: initial; }

  .ff-tab-content {
/*    border-bottom: 1px solid #f2f2f2; */
}

  .ff-tabs .ff-tab-label {
    width: 100%;
    margin-right: 0;
    margin-top: 16px; } }

/*! Slider */

.slider-bg {margin-bottom:20px; padding:0; background:#fff;}
div.slider {padding:0; margin:0 auto; max-width:100%; overflow: hidden;}
div.slider ul {width:1000%; height:auto; position:relative; list-style:none; left:0; margin:0; padding:0; -webkit-animation: next 12s infinite; -moz-animation: next 12s infinite;}
div.slider ul:hover {-moz-animation-play-state: paused; -webkit-animation-play-state: paused;}
div.slider li {width: 10%; list-style: none; float: left; margin: 0; padding: 0;}
div.slider img {max-width:100%;}
@-webkit-keyframes next {
0% {opacity:0;}
1% {left:0; opacity:1;}
18% {left:0; opacity:1;}
19% {opacity: 0.6;}
20% {left: -100%; opacity: 1;}
58% {left: -100%; opacity: 1;}
59% {opacity: 0.6;}
60% {left: -200%; opacity:1;}
98% {left: -200%; opacity:1;}
99% {opacity:0.3;}
100% {left:0; opacity:0;}
}
@-moz-keyframes next {
0% {opacity:0;}
1% {left:0; opacity:1;}
18% {left:0; opacity:1;}
19% {opacity: 0.6;}
20% {left: -100%; opacity: 1;}
58% {left: -100%; opacity: 1;}
59% {opacity: 0.6;}
60% {left: -200%; opacity:1;}
98% {left: -200%; opacity:1;}
99% {opacity:0.3;}
100% {left:0; opacity:0;}
}

/*! Galerie */

.pictures {
text-align: center;
float:left;
margin-bottom:30px;
}

.thumbnail {
border: 1px solid #d3d1d1;
cursor: pointer;
display: inline-block;
height: 63px;
line-height: 63px;
margin-top: 12px;
margin-right:0px;
text-align: center;
text-transform: uppercase;
width: 63px;
overflow:hidden;
position:relative;
top:500px;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
overflow:hidden;
transition: all .2s ease-in-out;
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-ms-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
}

#picture_1_start { display:table;}

.thumbnail img {
max-width: 100%;
max-height: 100%;
width: auto;
height: auto;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
}

.thumbnail:hover {
border:1px solid #333;
z-index:200;
}

.thumbnail:hover ~ #picture_1_start { display:none; }
#img_thumb_1:hover ~ #picture_1 { display:table; }
#img_thumb_2:hover ~ #picture_2 { display:table; }
#img_thumb_3:hover ~ #picture_3 { display:table; }
#img_thumb_4:hover ~ #picture_4 { display:table; }
#img_thumb_5:hover ~ #picture_5 { display:table; }
#img_thumb_6:hover ~ #picture_6 { display:table; }
#img_thumb_7:hover ~ #picture_7 { display:table; }
#img_thumb_8:hover ~ #picture_8 { display:table; }

.zoom_pic {
display: none;
width:100%;
height:483px;
float:left;
position:relative;
bottom:71px;
margin-top: -3px;
border:1px solid #ccc;
}

.zoom_pic div {
max-width: 100%;
max-height: 100%;
display: table-cell;
vertical-align: middle;
text-align: center;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
background:#fff;
}

.zoom_pic img {
max-width: 483px;
max-height: 483px;
vertical-align: middle;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
}
