@charset "ISO-8859-1";
/* Stylesheet fairfruits.de var_images.css 2020-04-12 */

/* Bildcontainer */
div.conpix a, div.conpix a:link, div.conpix:link {border: none;}

/* Bilder */
img {border: none;}
img.var_pix {max-width: 90%; max-height: 90%; vertical-align: middle; background-color: transparent; border: none; -webkit-border-radius: 9px; -moz-border-radius: 9px; -khtml-border-radius: 9px; -o-border-radius: 9px; border-radius: 9px; -webkit-transition: all 0.5s ease-in; -moz-transition: all 0.5s ease-in; -ms-transition: all 0.5s ease-in; -o-transition: all 0.5s ease-in; transition: all 0.5s ease-in; margin: 4px !important; padding: 0 !important; -webkit-transform: scale(1) rotate(-2deg); -moz-transform: scale(1) rotate(-2deg); -ms-transform: scale(1) rotate(-2deg); -o-transform: scale(1) rotate(-2deg); transform: scale(1) rotate(-2deg);}
img.var_pix:link, img.var_pix:visited {background-color: transparent; border: none; margin: 0px;}
img.var_pix:hover, img.var_pix:focus, img.var_pix:active {background-color: rgba(41,41,41,0.7); border: none; -webkit-transform: scale(1.1) rotate(0deg); -moz-transform: scale(1.1) rotate(0deg); -ms-transform: scale(1.1) rotate(0deg); -o-transform: scale(1.1) rotate(0deg); transform: scale(1.1) rotate(0deg);}

img.rev_pix {max-width: 90%; max-height: 90%; vertical-align: middle; background-color: transparent; border: none; -webkit-border-radius: 9px; -moz-border-radius: 9px; -khtml-border-radius: 9px; -o-border-radius: 9px; border-radius: 9px; -webkit-transition: all 0.5s ease-in; -moz-transition: all 0.5s ease-in; -ms-transition: all 0.5s ease-in; -o-transition: all 0.5s ease-in; transition: all 0.5s ease-in; margin: 4px !important; padding: 0 !important; -webkit-transform: scale(1) rotate(2deg); -moz-transform: scale(1) rotate(2deg); -ms-transform: scale(1) rotate(2deg); -o-transform: scale(1) rotate(2deg); transform: scale(1) rotate(2deg);}
img.rev_pix:link, img.rev_pix:visited {background-color: transparent; border: none; margin: 0px;}
img.rev_pix:hover, img.rev_pix:focus, img.rev_pix:active {background-color: rgba(41,41,41,0.7); border: none; -webkit-transform: scale(1.1) rotate(0deg); -moz-transform: scale(1.1) rotate(0deg); -ms-transform: scale(1.1) rotate(0deg); -o-transform: scale(1.1) rotate(0deg); transform: scale(1.1) rotate(0deg);}

img.zer_pix {max-width: 90%; max-height: 90%; vertical-align: middle; background-color: transparent; border: none; -webkit-border-radius: 9px; -moz-border-radius: 9px; -khtml-border-radius: 9px; -o-border-radius: 9px; border-radius: 9px; -webkit-transition: all 0.5s ease-in; -moz-transition: all 0.5s ease-in; -ms-transition: all 0.5s ease-in; -o-transition: all 0.5s ease-in; transition: all 0.5s ease-in; margin: 4px !important; padding: 0 !important; -webkit-transform: scale(1) rotate(0deg); -moz-transform: scale(1) rotate(0deg); -ms-transform: scale(1) rotate(0deg); -o-transform: scale(1) rotate(0deg); transform: scale(1) rotate(0deg);}
img.zer_pix:link, img.zer_pix:visited {background-color: transparent; border: none; margin: 0px;}
img.zer_pix:hover, img.zer_pix:focus, img.zer_pix:active {background-color: rgba(41,41,41,0.7); border: none; -webkit-transform: scale(1.1) rotate(-2deg); -moz-transform: scale(1.1) rotate(-2deg); -ms-transform: scale(1.1) rotate(-2deg); -o-transform: scale(1.1) rotate(-2deg); transform: scale(1.1) rotate(-2deg);}

/* Insite-Bilder Zoom */
.var_pix_zoom {display: none; position: fixed; z-index: 9977; width: 100%; height: 100%; overflow:scroll; text-align: center; top: 0px; left: 0; right: 0; background: rgba(41,41,41,0.8);}
*.scaletimer {-webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;}
.var_pix_zoom img {max-width: 100%; max-height: 100%; margin-top: 2%; margin-bottom: 2%; -webkit-border-radius: 9px; -moz-border-radius: 9px; -khtml-border-radius: 9px; -o-border-radius: 9px; border-radius: 9px;}
.var_pix_zoom:target {outline: none; display: block;}

@keyframes varpix_scaling { 
  from {transform: scale(2); opacity: 0; margin-top: 95%;} 
  to {transform: scale(1); opacity: 1; margin-top: 3%;}}
.var_pix_zoom img {animation: varpix_scaling 1s linear;}

@media only screen and (max-width:56em) {
	.var_pix_zoom img {margin: 0;}}