/* All rights reserved by Harald Dostal, Lorystr. 97/1/33, 1110 Vienna
 * Copyright 2019 / Austria
 *
 */

/* Bilderframe */
#divFrame {
  position:				absolute;
  left:					-2%;
  width: 				60%;
  height: 				80%;
  padding: 				0px;
  margin: 				2%;
  border: 				var(--mnuBorder);
  border-radius: 		var(--RadiusImg); 
  background:			var(--ImgBackGal); 
  overflow:				hidden;
  font-size:			calc(14px * var(--Multi));
}

/* Seitentitel */
.Objekt {
  position:				absolute;
  top: 					3%;
  left: 				3%;
  width: 				80%;
  height: 				2%;
  color: 				var(--TxtGn);
  font-size:			150%;
  font-weight:			bold;
}

/* Text-Installationsart */
.Art {
  position:				absolute;
  top: 					20pt;
  color: 				var(--TxtGn);
  opacity: 				0.4;
  font-size:			80%;
}

/* Links: Anlagenbeschreibung */
#Textfeld{
  position:				absolute;
  left: 				3%;
  top: 					15%;
  width: 				30%;
  height: 				60%;
  float:				left;
  padding: 				0px;
  font-size:			90%;
}

/* Loxone-Gruppe */
.Sparte {
  font-weight:			bold;
  font-size: 			100%;
}

/* Bildgalerie mit Pfeilen */
#Galery {
  position:				absolute;
  top: 					10%; 
  left:					25%;
  width: 				90%;
  height: 				95%;
  padding: 				0px;
}

/* Links/Rechts-Pfeile */
.Arrow {
  width: 				20pt;
  height:				auto;
  cursor: 				pointer;
  margin-top:			24%;
  float:				left;
  padding: 				0px;
}

/* aktuelle Bildwahl */
#Vollbild {
  width: 				70%;
  height: 				85%;
  float:				left; 
  margin: 				1%;
  padding: 				1%;
  cursor:				pointer;
  border: 				1.5pt solid var(--Gruen);
  border-radius: 		8pt; 
}

/* Wasserzeichen in Bildern */
#Wasserzeichen {
  position: 			absolute;
  top: 					40%;
  text-align: 			center;
  font-size: 			100%;
  color: 				black;
  margin-left:			28%;
  padding:				8px 8px;
  background:		 	white;
  border: 				1pt solid trasparent;
  border-radius: 		5pt; 
  opacity: 				0.4; 


  -webkit-animation: zooming 9s linear infinite;
  -moz-animation: zooming 9s linear infinite;
  -ms-animation: zooming 9s linear infinite;
  -o-animation: zooming 9s linear infinite;
  animation: zooming 9s linear infinite;

}

@keyframes zooming {
  0% 
  {
    -ms-transform: scale(0.6); 
    -moz-transform: scale(0.6); 
    -webkit-transform: scale(0.6); 
    -o-transform: scale(0.6); 
    transform: scale(0.6); 
  }
  50% 
  {
    -ms-transform: rscale(0.8);
    -moz-transform: scale(0.8);
    -webkit-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform: scale(0.8);
  }
  100% 
  {
    -ms-transform: scale(0.6);
    -moz-transform: scale(0.6);
    -webkit-transform: scale(0.6);
    -o-transform: scale(0.6);
    transform: scale(0.6);
  }

}

@keyframes rotating1 {
  0% 
  {
    -ms-transform: rotate(-5deg);
    -moz-transform: rotate(-5deg);
    -webkit-transform: rotate(-5deg);
    -o-transform: rotate(-5deg);
    transform: rotate(-5deg);
  }
  25% 
  {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  50% 
  {
    -ms-transform: rotate(5deg);
    -moz-transform: rotate(5deg);
    -webkit-transform: rotate(5deg);
    -o-transform: rotate(5deg);
    transform: rotate(5deg);
  }
  75% 
  {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% 
  {
    -ms-transform: rotate(-5deg);
    -moz-transform: rotate(-5deg);
    -webkit-transform: rotate(-5deg);
    -o-transform: rotate(-5deg);
    transform: rotate(-5deg);
  }
}