/* 
Copyright 2016 Alle Rechte vorbehalten (©) DOGENDORF ® 
Markennamen:           DOGENDORF ®
Author:                Walter Dogendorf
URL:                   https://dogendorf.de  
Version:               1.0.0
Time:                  06:32
Date:                  05.01.2017
Die Hinweise!          "(©) DOGENDORF ®" im Quelltext, dürfen nicht entfernt werden.
        
Beachten Sie bei dem Umgang, mit den ihnen durch unsere zur Verfügung gestellte/n Vorlage/n dass sämtliche Daten und Grafiken dem Copyright unterligen.
Das Kopieren im Ganzen oder in Teilen ohne unsere vorherige ausdrückliche schriftliche Zustimmung ist untersagt. Jegliche Zuwiderhandlungen werden juristisch verfolgt.
 */
.cap-box-poza {
padding:0 auto;
height: 61.5%;
margin-top:0px;
}
.dogendorf-poza {
padding:0px !important;
}
#poza-mica {
overflow: scroll;
overflow-y:hidden;
}
.mic {
z-index: 1;
width: 95px;
height: 80px;
top: 500px;
margin-top: 5px;
margin-right: 5px;
line-height: 110px;
background: #FFF;
text-align: center;
border: 1px solid #E9E9E9;
border-radius: 0 !important;
position: relative;
overflow: hidden;
cursor: pointer;
display: inline-block;
text-transform: uppercase;
vertical-align:bottom; 
-webkit-transition: all 0.5s ease;
transition: all 0.5s ease;
-webkit-box-shadow: 3px 3px 5px 0px rgba(176,174,176,1);
-moz-box-shadow: 3px 3px 5px 0px rgba(176,174,176,1);
box-shadow: 3px 3px 5px 0px rgba(176,174,176,1);
}
.mic img {
max-width: 100%;
max-height: 100%;
padding: 3px 3px 3px 3px;
width: auto;
height: auto;
}
.mic:hover {
z-index:2;
-webkit-transform:scale(0.9);
transform:scale(0.9);
}
.mic:hover ~ #mare_unu { 
display:none; 
}
#mic_1 {
border-top:1px solid #E9E9E9;
border-left:1px solid #E9E9E9;
border-right:1px solid #E9E9E9;
border-bottom:1px solid #E9E9E9;
}
#mic_1:hover ~ #mare_1 { 
display:table; 
}
#mic_2:hover ~ #mare_2 { 
display:table; 
}
#mic_3:hover ~ #mare_3 { 
display:table; 
}
#mic_4:hover ~ #mare_4 { 
display:table; 
}
#mic_5:hover ~ #mare_5 { 
display:table; 
}
#mic_6:hover ~ #mare_6 { 
display:table; 
}
#mic_7:hover ~ #mare_7 { 
display:table; 
}
#mic_8:hover ~ #mare_8 { 
display:table; 
}
#mic_9:hover ~ #mare_9 { 
display:table; 
}
#mic_10:hover ~ #mare_10 { 
display:table; 
}
.mare {
width:98%;
height:500px;
margin-top: 5px;
padding-top: 8px!important;
padding-left: 8px!important;
padding-right: 8px!important;
bottom:105px;
position:relative;
display: none;
}
.mare div {
max-width: 100%;
max-height: 100%; 
background:#FFF;
border:1px solid #E9E9E9;
display:table-cell;
vertical-align:middle;
text-align: center;
}
.mare img {
max-width: 500px;
max-height: 475px;
vertical-align: middle;
text-align: center;
}
#mare_unu {
margin-top: 5px;
padding-top: 8px!important;
padding-left: 8px!important;
padding-right: 8px!important;
display:table; 
text-align:center;
}
#dogendorf-sup-poza {
padding:12% 0 12% 0;
}
@media only screen and (min-width: 1024px) {
}
@media screen and (max-width: 1200px) {
.cap-box-poza {
text-align: left;
margin-top: 0px;
margin-bottom: 5px;
}
.mare {
height:330px!important;
bottom:70px!important;
}
.mare img {
max-width: 350px!important;
max-height: 300px!important;
}
.mic {
height: 51px!important;
line-height: 51px!important;
width: 61px!important;
top:330px!important;
}
}
@media screen and (max-width: 992px) {
.cap-box-poza {
text-align: left;
margin-top: 0px;
margin-bottom: 5px;
}
.mare {
height:500px!important;
bottom:120px!important;
}
.mare img {
max-width: 530px!important;
max-height: 500px!important;
}
.mic {
height: 90px!important;
line-height: 90px!important;
width: 100px!important;
top:490px!important;
}
}
@media screen and (max-width: 768px) {
.cap-box-poza {
padding:0 auto;
height: 560px!important;
}
.mare {
height:420px!important;
bottom:120px!important;
}
.mare img {
max-width: 500px!important;
max-height: 400px!important;
}
.mic {
height: 90px!important;
line-height: 90px!important;
width: 100px!important;
top:415px!important;
}
#dogendorf-sup-poza {
padding:0 0 0 0;
}
}
@media screen and (max-width: 600px) {
.cap-box-poza {
padding:0 auto;
height: 420px!important;
}
.mare {
height:350px!important;
bottom:90px!important;
}
.mare img {
max-width: 345px !important;
max-height: 320px !important;
}
.mic {
height: 50px!important;
line-height: 50px!important;
width: 63px!important;
top:330px!important;
}
}
@media screen and (max-width: 414px) {
.cap-box-poza {
padding:0 auto;
height: 305px!important;
}
.mare {
height:250px!important;
bottom:75px!important;
}
.mare img {
max-width: 250px !important;
max-height: 240px !important;
}
.mic {
height: 33px!important;
line-height: 33px!important;
width: 43px!important;
top:220px!important;
}
}
@media screen and (max-width: 320px) {
.cap-box-poza {
padding:0 auto;
height: 275px!important;
}
.mare {
height:220px!important;
bottom:55px!important;
}
.mare img {
max-width: 220px !important;
max-height: 200px !important;
}
.mic {
height: 25px!important;
line-height: 25px!important;
width: 35px!important;
top:200px!important;
}
}