/* .containerImageTarget {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}

.ImageTarget {
  max-width: 60%;
  height: auto;
  opacity: 0.75;
}

@media (width>1024px) {
  .ImageTarget {
    max-width: 30%;
    height: auto;
    opacity: 0.75;
  }
} */

body {
  margin: 0;
}

#container {
  width: 100vw;
  height: 100vh;
  position: relative;
  overflow: hidden;
}


#control {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2;
}

.mindar-ui-overlay {
  display: none !important;
  align-items: center;
  justify-content: center;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: transparent;
  z-index: 2;
}


#imageTargetUI {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: transparent;
  z-index: 2;
}

#imageTargetUI img {
  opacity: 0.6;
  width: 90%;
  align-self: center;
}


#imageTargetUI .inner .scanline {
  position: absolute;
  width: 100%;
  height: 10px;
  background: white;
  animation: move 2s linear infinite;
}

#imageTargetUI .inner {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
  background-repeat: no-repeat;
  background-size: 40px 40px;
}

#imageTargetUI.hidden {
  display: none;
}

.imgphoto {
  width: 25%;
  height: auto;
  margin: 230% 0% 0% 60%;
}


.imgswitchcam {
  position: absolute;
  width: 13%;
  height: auto;
  margin: -232% 0% 0% 11%;
}

.imgshare-exp {
  position: absolute;
  width: 50%;
  height: auto;
  margin: -232% 0% 0% 1000%;
}

/* Codigo artuto */

.button-container {
  position: fixed;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 15px;
  background: rgba(0, 0, 0, 0.5);
  padding: 10px;
  border-radius: 30px;
  z-index: 10;
  pointer-events: auto;
}

.button-container button {
  background-color: white;
  border: none;
  padding: 15px;
  border-radius: 50%;
  font-size: 16px;
  cursor: pointer;
}

.preview-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  z-index: 2000;
}

.preview-container img {
  max-width: 80%;
  max-height: 80%;
  border-radius: 10px;
}

.preview-buttons {
  margin-top: 10px;
  display: flex;
  gap: 10px;
}

.preview-buttons button {
  padding: 10px 15px;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  font-size: 16px;
}

.botonpreview {
  cursor: pointer;
  display: inline-block;
  margin: 10px;
  /* Ajusta el margen entre botones */
}

.botonpreview img {
  width: 50px;
  /* Ajusta el tamaño de la imagen según tu necesidad */
  height: auto;
}


.marca-agua-logo1 {

  margin: 20% 0% 0% 90%;

}

.marca-agua-logo2 {
  position: absolute;
  margin: -317% 0% 0% 4%;
}


@media (max-aspect-ratio: 1 / 1) {
  #imageTargetUI.inner {
    width: 60vw;
    height: 80vw;
  }

}

@media (width>1000px) {

  #imageTargetUI .inner {
    width: 30vw;
    height: 40vw;
  }
}


@media (width>=1024px) {

  #imageTargetUI .inner {
    width: 17vw;
    height: 16vw;
  }
}


@media only screen and (max-width: 3460px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 390% 0% 0% 621%;
    border: none;
    width: 70%;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 64%;
    height: 161px;
    margin: 0% 0% 0% 920%;
    position: absolute;
    background: none;
    border: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 80%;
    height: auto;
    margin: -42% 0% 0% -35%;
  }

  #prev {
    position: absolute;
    width: 30%;
    height: auto;
    margin: 200% 0% 0% 450%;
  }

  #next {
    margin: 200% 0% 0% 765%;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 512px;
    margin: 116% 0% 0% 854%;
  }


}

@media only screen and (max-width: 2560px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 406% 0% 0% 473%;
    border: none;
    width: 45%;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 60%;
    height: 161px;
    margin: 26% 0% 0% 537%;
    position: absolute;
    background: none;
    border: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 80%;
    height: auto;
    margin: -42% 0% 0% 480%;
  }

  #prev {
    position: absolute;
    width: 30%;
    height: auto;
    margin: 231% 0% 0% 322%;
  }

  #next {
    margin: 224% 0% 0% 573%;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 512px;
    margin: 150% 0% 0% 700%;
  }

}

@media only screen and (max-width: 1920px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 321% 0% 0% 351%;
    border: none;
    width: 45%;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 60%;
    height: 161px;
    margin: 26% 0% 0% 537%;
    position: absolute;
    background: none;
    border: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 80%;
    height: auto;
    margin: -42% 0% 0% -35%;
  }

  #prev {
    position: absolute;
    width: 30%;
    height: auto;
    margin: 170% 0% 0% 194%;
  }

  #next {
    margin: 170% 0% 0% 446%;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 512px;
    margin: 80% 0% 0% 520%;
  }

}

@media only screen and (max-width: 1600px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 258% 0% 0% 282%;
    border: none;
    width: 45%;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 60%;
    height: 161px;
    margin: 26% 0% 0% 537%;
    position: absolute;
    background: none;
    border: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 80%;
    height: auto;
    margin: -42% 0% 0% -35%;
  }

  #prev {
    position: absolute;
    width: 30%;
    height: auto;
    margin: 128% 0% 0% 200%;
    transform: scale(0.6);
  }

  #next {
    margin: 127% 0% 0% 358%;
    transform: scale(0.6);
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 512px;
    margin: 65% 0% 0% 399%;
  }

}


@media only screen and (max-width: 1512px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 258% 0% 0% 277%;
    border: none;
    width: 35%;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 60%;
    height: 161px;
    margin: 26% 0% 0% 537%;
    position: absolute;
    background: none;
    border: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 70%;
    height: auto;
    margin: -42% 0% 0% -218%;
  }

  #prev {
    position: absolute;
    width: 30%;
    height: auto;
    margin: 142% 0% 0% 182%;
    transform: scale(0.5);
  }

  #next {
    margin: 142% 0% 0% 339%;
    transform: scale(0.5);
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 397px;
    margin: 65% 0% 0% 375%;
  }


}


@media only screen and (max-width: 1440px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 258% 0% 0% 263%;
    border: none;
    width: 35%;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 60%;
    height: 161px;
    margin: 26% 0% 0% 537%;
    position: absolute;
    background: none;
    border: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 70%;
    height: auto;
    margin: -42% 0% 0% -218%;
  }

  #prev {
    position: absolute;
    width: 30%;
    height: auto;
    margin: 127% 0% 0% 168%;
    transform: scale(0.6);
  }

  #next {
    margin: 127% 0% 0% 326%;
    transform: scale(0.6);
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 397px;
    margin: 65% 0% 0% 375%;
  }


}

@media only screen and (max-width: 1422px) {

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 745px 0px 0px 144px;
    position: absolute;
    background: none;
    border: none;
  }

  #take-photo {
    position: absolute;
    background: none;
    margin: 750px 0px 0px 652px;
    width: 75px;
  }

  #prev {
    position: absolute;
    width: 128px;
    height: 128px;
    margin: 355px 0px 0px 415px;
  }

  #next {
    margin: 355px 0px 0px 830px;
    width: 90px;
    height: 121px;
  }

  .imgphoto {
    width: 60px;
    height: auto;
    margin: 10% 0% 0% 0%;
  }

  .imgswitchcam {
    position: absolute;
    width: 13%;
    height: auto;
    margin: -250% 0% 0% 11%;
  }

  .imgshare-exp {
    position: absolute;
    width: 75px;
    height: auto;
    margin: -39% 0% 0% -43%;
  }

  .imgprev {
    position: absolute;
    margin: 0% 0% 0% 0%;
    width: 128px;
  }

  .imgnext {
    position: absolute;
    margin: 0% 0% 0% -14%;
    width: 128px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 310px;
    margin: 780px 0% 0% 1004px;
  }


  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 18px 17px;
    transform: scale(1.3);
    margin: -3% 0% 0% -4%;
  }



}


@media only screen and (max-width: 1366px) {
  #take-photo {
    position: absolute;
    background: none;
    margin: 557px 0px 0px 618px;
    border: none;
    width: 75px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 60px 0px 0px 980px;
    position: absolute;
    background: none;
    border: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 70px;
    height: auto;
    margin: -40% 0% 0% -38%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 345px 0px 0px 349px;
  }

  .imgprev {
    position: absolute;
    margin: -186% 0% 0% 201%;
    width: 180px;
  }

  #next {
    margin: 312px 0px 0px 814px;
  }

  .imgnext {
    position: absolute;
    margin: -186% 0% 0% 344%;
    width: 180px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 256px;
    margin: 350px 0% 0% 911px;
  }


  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 18px 17px;
    transform: scale(1.3);
    margin: -3% 0% 0% -4%;
  }


}

@media only screen and (max-width: 1366px) and (max-height: 1024px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 869px 0px 0px 613px;
    width: 75px;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 865px 0px 0px 97px;
    position: absolute;
    background: none;
    border: none;
  }


  .imgphoto {
    width: 60px;
    height: auto;
    margin: 10% 0% 0% 0%;
  }

  .imgswitchcam {
    position: absolute;
    width: 13%;
    height: auto;
    margin: -250% 0% 0% 11%;
  }

  .imgshare-exp {
    position: absolute;
    width: 75px;
    height: auto;
    margin: -39% 0% 0% -43%;
  }

  #prev {
    position: absolute;
    width: 128px;
    height: 128px;
    margin: 423px 0px 0px 392px;
  }

  #next {
    margin: 421px 0px 0px 817px;
    width: 90px;
    height: 121px;
  }

  .imgprev {
    position: absolute;
    margin: 0% 0% 0% 0%;
    width: 128px;
  }

  .imgnext {
    position: absolute;
    margin: 0% 0% 0% -14%;
    width: 128px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 315px;
    margin: 880px 0px 0px 986px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 18px 17px;
    transform: scale(1.3);
    margin: -3% 0% 0% -4%;
  }


}


@media only screen and (max-width: 1280px) {
  #take-photo {
    position: absolute;
    background: none;
    margin: 565px 0px 0px 579px;
    border: none;
    width: 75px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 60px 0px 0px 980px;
    position: absolute;
    background: none;
    border: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 70px;
    height: auto;
    margin: -40% 0% 0% -38%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 361px 0px 0px 315px;
  }

  .imgprev {
    position: absolute;
    margin: -186% 0% 0% 201%;
    width: 180px;
  }

  #next {
    margin: 327px 0px 0px 773px;
  }

  .imgnext {
    position: absolute;
    margin: -186% 0% 0% 344%;
    width: 180px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 256px;
    margin: 350px 0% 0% 911px;
  }


  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 18px 17px;
    transform: scale(1.3);
    margin: -3% 0% 0% -4%;
  }

}

@media only screen and (max-width: 1280px) and (max-height: 1024px) {
  #take-photo {
    position: absolute;
    background: none;
    margin: 700px 0px 0px 579px;
    border: none;
    width: 75px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 60px 0px 0px 980px;
    position: absolute;
    background: none;
    border: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 70px;
    height: auto;
    margin: -40% 0% 0% -38%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 483px 0px 0px 315px;
  }

  .imgprev {
    position: absolute;
    margin: -186% 0% 0% 201%;
    width: 180px;
  }

  #next {
    margin: 445px 0px 0px 773px;
  }

  .imgnext {
    position: absolute;
    margin: -186% 0% 0% 344%;
    width: 180px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 256px;
    margin: 429px 0% 0% 816px;
  }


  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 18px 17px;
    transform: scale(1.3);
    margin: -3% 0% 0% -4%;
  }


}


@media only screen and (max-width: 1280px) and (max-height: 720px) {
  #take-photo {
    position: absolute;
    background: none;
    margin: 565px 0px 0px 579px;
    border: none;
    width: 75px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 60px 0px 0px 980px;
    position: absolute;
    background: none;
    border: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 70px;
    height: auto;
    margin: -40% 0% 0% -38%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 329px 0px 0px 315px;
  }

  .imgprev {
    position: absolute;
    margin: -186% 0% 0% 201%;
    width: 180px;
  }

  #next {
    margin: 290px 0px 0px 773px;
  }

  .imgnext {
    position: absolute;
    margin: -186% 0% 0% 344%;
    width: 180px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 256px;
    margin: 350px 0% 0% 911px;
  }


  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 18px 17px;
    transform: scale(1.3);
    margin: -3% 0% 0% -4%;
  }


}



@media only screen and (max-width: 1241px) {

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 770px 0px 0px 144px;
    position: absolute;
    background: none;
    border: none;
  }

  #take-photo {
    position: absolute;
    background: none;
    margin: 775px 0px 0px 590px;
    width: 75px;
  }

  #prev {
    position: absolute;
    width: 128px;
    height: 128px;
    margin: 397px 0px 0px 396px;
  }

  #next {
    margin: 380px 0px 0px 775px;
    width: 90px;
    height: 121px;
  }

  .imgphoto {
    width: 60px;
    height: auto;
    margin: 10% 0% 0% 0%;
  }

  .imgswitchcam {
    position: absolute;
    width: 13%;
    height: auto;
    margin: -250% 0% 0% 11%;
  }

  .imgshare-exp {
    position: absolute;
    width: 75px;
    height: auto;
    margin: -39% 0% 0% -43%;
  }

  .imgprev {
    position: absolute;
    margin: 0% 0% 0% 0%;
    width: 128px;
  }

  .imgnext {
    position: absolute;
    margin: 0% 0% 0% -14%;
    width: 128px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 310px;
    margin: 789px 0% 0% 869px;
  }


  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 18px 17px;
    transform: scale(1.3);
    margin: -3% 0% 0% 4%;
  }


}


@media only screen and (max-width: 1194px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 720px 0px 0px 535px;
    width: 75px;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 725px 0px 0px 97px;
    position: absolute;
    background: none;
    border: none;
  }


  .imgphoto {
    width: 60px;
    height: auto;
    margin: 10% 0% 0% 0%;
  }

  .imgswitchcam {
    position: absolute;
    width: 13%;
    height: auto;
    margin: -250% 0% 0% 11%;
  }

  .imgshare-exp {
    position: absolute;
    width: 75px;
    height: auto;
    margin: -39% 0% 0% -43%;
  }

  #prev {
    position: absolute;
    width: 128px;
    height: 128px;
    margin: 347px 0px 0px 322px;
  }

  #next {
    margin: 342px 0px 0px 705px;
    width: 90px;
    height: 121px;
  }

  .imgprev {
    position: absolute;
    margin: 0% 0% 0% 0%;
    width: 128px;
  }

  .imgnext {
    position: absolute;
    margin: 0% 0% 0% -14%;
    width: 128px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 256px;
    margin: 735px 0% 0% 860px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 18px 17px;
    transform: scale(1.3);
    margin: -3% 0% 0% -4%;
  }


}


@media only screen and (max-width: 1024px) {

  .imgphoto {
    width: 21%;
    height: auto;
    margin: 265% 0% 0% 181%;
  }

  .imgswitchcam {
    position: absolute;
    width: 13%;
    height: auto;
    margin: -250% 0% 0% 11%;
  }

  .imgshare-exp {
    position: absolute;
    width: 25%;
    height: auto;
    margin: -273% 0% 0% 321%;
  }

  .imgprev {
    position: absolute;
    margin: -163% 0% 0% 119%;
    width: 25%;
  }

  .imgnext {
    position: absolute;
    margin: -163% 0% 0% 246%;
    width: 25%;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 18px 17px;
    transform: scale(1.3);
    margin: -3% 0% 0% -4%;
  }

}

@media only screen and (max-width: 1024px) and (max-height: 1366px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 1188px 0px 0px 434px;
    border: none;
    width: 90px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 100px;
    height: 100px;
    margin: 1188px 0px 0px 90px;
    position: absolute;
    background: none;
    border: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 70px;
    height: auto;
    margin: -40% 0% 0% -38%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 661px 0px 0px 117px;
  }

  .imgprev {
    position: absolute;
    margin: -186% 0% 0% 201%;
    width: 180px;
  }

  #next {
    margin: 684px 0px 0px 485px;
  }

  .imgnext {
    position: absolute;
    margin: -186% 0% 0% 344%;
    width: 180px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 320px;
    margin: 1196px 0px 0px 647px;
  }


  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 18px 17px;
    transform: scale(2.3);
    margin: -3% 0% 0% -4%;
  }

}

@media only screen and (max-width: 1024px) and (max-height: 768px) {

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 620px 0px 0px 97px;
    position: absolute;
    background: none;
    border: none;
  }

  #take-photo {
    position: absolute;
    background: none;
    margin: 625px 0px 0px 457px;
    width: 75px;
  }

  #prev {
    position: absolute;
    width: 128px;
    height: 128px;
    margin: 310px 0px 0px 274px;
  }

  #next {
    margin: 314px 0px 0px 585px;
    width: 90px;
    height: 121px;
  }

  .imgphoto {
    width: 60px;
    height: auto;
    margin: 10% 0% 0% 0%;
  }

  .imgswitchcam {
    position: absolute;
    width: 13%;
    height: auto;
    margin: -250% 0% 0% 11%;
  }

  .imgshare-exp {
    position: absolute;
    width: 75px;
    height: auto;
    margin: -39% 0% 0% -43%;
  }

  .imgprev {
    position: absolute;
    margin: 0% 0% 0% 0%;
    width: 128px;
  }

  .imgnext {
    position: absolute;
    margin: 0% 0% 0% -14%;
    width: 128px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 256px;
    margin: 645px 0% 0% 703px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 18px 17px;
    transform: scale(1.3);
    margin: -3% 0% 0% -4%;
  }

}


@media only screen and (max-width: 980px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 1421px 0px 0px 370px;
    width: 150px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 140px;
    height: 140px;
    margin: 1672px 0px 0px 44px;
    position: absolute;
    background: none;
    border: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 140px;
    height: auto;
    margin: -52% 0% 0% -50%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 599px 0px 0px 118px;
  }

  .imgprev {
    position: absolute;
    margin: -186% 0% 0% 201%;
    width: 180px;
  }

  #next {
    margin: 630px 0px 0px 415px;
  }

  .imgnext {
    position: absolute;
    margin: -186% 0% 0% 344%;
    width: 180px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 390px;
    margin: 1723px 0px 0px 524px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.4);
  }




}


@media only screen and (max-width: 931px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 1049px 0px 0px 381px;
    border: none;
    width: 95px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 1046px 0px 0px 117px;
    position: absolute;
    background: none;
    border: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 70px;
    height: auto;
    margin: -40% 0% 0% -38%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 599px 0px 0px 118px;
  }

  .imgprev {
    position: absolute;
    margin: -186% 0% 0% 201%;
    width: 180px;
  }

  #next {
    margin: 630px 0px 0px 415px;
  }

  .imgnext {
    position: absolute;
    margin: -186% 0% 0% 344%;
    width: 180px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 295px;
    margin: 1082px 0px 0px 581px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.4);
  }


}

@media only screen and (max-width: 889px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 1260px 0px 0px 356px;
    border: none;
    width: 95px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 1264px 0px 0px 145px;
    position: absolute;
    background: none;
    border: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 70px;
    height: auto;
    margin: -40% 0% 0% -38%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 683px 0px 0px 100px;
  }

  .imgprev {
    position: absolute;
    margin: -186% 0% 0% 201%;
    width: 180px;
  }

  #next {
    margin: 710px 0px 0px 415px;
  }

  .imgnext {
    position: absolute;
    margin: -186% 0% 0% 344%;
    width: 180px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 295px;
    margin: 1274px 0px 0px 513px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.4);
  }


}


@media only screen and (max-width: 834px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 959px 0px 0px 342px;
    border: none;
    width: 90px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 1026px 0px 0px 90px;
    position: absolute;
    background: none;
    border: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 70px;
    height: auto;
    margin: -40% 0% 0% -38%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 585px 0px 0px 60px;
  }

  .imgprev {
    position: absolute;
    margin: -186% 0% 0% 201%;
    width: 180px;
  }

  #next {
    margin: 609px 0px 0px 377px;
  }

  .imgnext {
    position: absolute;
    margin: -186% 0% 0% 344%;
    width: 180px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 256px;
    margin: 1059px 0px 0px 514px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.4);
  }


}


@media only screen and (max-width: 768px) {
  #take-photo {
    position: absolute;
    background: none;
    margin: 810px 0px 0px 323px;
    border: none;
    width: 75px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 900px 0px 0px 70px;
    position: absolute;
    background: none;
    border: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 70px;
    height: auto;
    margin: -40% 0% 0% -38%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 491px 0px 0px 23px;
  }

  .imgprev {
    position: absolute;
    margin: -186% 0% 0% 201%;
    width: 180px;
  }

  #next {
    margin: 531px 0px 0px 333px;
  }

  .imgnext {
    position: absolute;
    margin: -186% 0% 0% 344%;
    width: 180px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 256px;
    margin: 929px 0px 0px 471px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.4);
  }


}

@media only screen and (max-width: 447px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 578px 0px 0px 164px;
    border: none;
    width: 74px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 703px 0px 0px 31px;
    position: absolute;
    background: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 50%;
    height: auto;
    margin: -26% 0% 0% -50%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 393px 0px 0px 13px;

  }

  .imgprev {
    position: absolute;
    margin: -137% 0% 0% 8%;
    width: 100px;
  }

  #next {
    margin: 411px 0px 0px 261px;
  }

  .imgnext {
    position: absolute;
    margin: -137% 0% 0% 111%;
    width: 100px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 180px;
    margin: 733px 0px 0px 230px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.55);
  }



}

@media only screen and (max-width: 432px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 632px 0px 0px 164px;
    border: none;
    width: 74px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 735px 0px 0px 31px;
    position: absolute;
    background: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 50%;
    height: auto;
    margin: -26% 0% 0% -50%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 461px 0px 0px 13px;
  }

  .imgprev {
    position: absolute;
    margin: -137% 0% 0% 8%;
    width: 100px;
  }

  #next {
    margin: 487px 0px 0px 261px;
  }

  .imgnext {
    position: absolute;
    margin: -137% 0% 0% 111%;
    width: 100px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 180px;
    margin: 766px 0px 0px 221px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.6);
  }

}

@media only screen and (max-width: 431px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 585px 0px 0px 177px;
    border: none;
    width: 74px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 670px 0px 0px 50px;
    position: absolute;
    background: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 50%;
    height: auto;
    margin: -26% 0% 0% -50%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 378px 0px 0px 13px;
  }

  .imgprev {
    position: absolute;
    margin: -137% 0% 0% 8%;
    width: 100px;
  }

  #next {
    margin: 397px 0px 0px 261px;
  }

  .imgnext {
    position: absolute;
    margin: -137% 0% 0% 111%;
    width: 100px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 180px;
    margin: 700px 0px 0px 218px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.6);
    margin: -2% 0% 0% 0%;
  }


}


@media only screen and (max-width: 430px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 634px 0px 0px 177px;
    border: none;
    width: 74px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 770px 0px 0px 50px;
    position: absolute;
    background: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 50%;
    height: auto;
    margin: -26% 0% 0% -50%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 444px 0px 0px 13px;
  }

  .imgprev {
    position: absolute;
    margin: -137% 0% 0% 8%;
    width: 100px;
  }

  #next {
    margin: 471px 0px 0px 261px;
  }

  .imgnext {
    position: absolute;
    margin: -137% 0% 0% 111%;
    width: 100px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 180px;
    margin: 802px 0px 0px 218px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.6);
    margin: -2% 0% 0% 0%;
  }


}


@media only screen and (max-width: 428px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 634px 0px 0px 177px;
    border: none;
    width: 74px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 770px 0px 0px 50px;
    position: absolute;
    background: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 50%;
    height: auto;
    margin: -26% 0% 0% -50%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 444px 0px 0px 13px;
  }

  .imgprev {
    position: absolute;
    margin: -137% 0% 0% 8%;
    width: 100px;
  }

  #next {
    margin: 471px 0px 0px 261px;
  }

  .imgnext {
    position: absolute;
    margin: -137% 0% 0% 111%;
    width: 100px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 180px;
    margin: 802px 0px 0px 218px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.6);
    margin: -2% 0% 0% 0%;
  }


}

@media only screen and (max-width: 414px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 636px 0px 0px 165px;
    border: none;
    width: 74px
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 790px 0px 0px 31px;
    position: absolute;
    background: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 50%;
    height: auto;
    margin: -26% 0% 0% -50%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 415px 0px 0px 13px;
  }

  .imgprev {
    position: absolute;
    margin: -137% 0% 0% 8%;
    width: 100px;
  }

  #next {
    margin: 439px 0px 0px 244px;
  }

  .imgnext {
    position: absolute;
    margin: -137% 0% 0% 111%;
    width: 100px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 180px;
    margin: 820px 0px 0px 208px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.6);
    margin: -2% 0% 0% 0%;
  }

}

@media only screen and (max-width: 414px) and (max-height: 846px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 636px 0px 0px 165px;
    border: none;
    width: 74px
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 735px 0px 0px 31px;
    position: absolute;
    background: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 50%;
    height: auto;
    margin: -26% 0% 0% -50%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 415px 0px 0px 13px;
  }

  .imgprev {
    position: absolute;
    margin: -137% 0% 0% 8%;
    width: 100px;
  }

  #next {
    margin: 439px 0px 0px 244px;
  }

  .imgnext {
    position: absolute;
    margin: -137% 0% 0% 111%;
    width: 100px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 180px;
    margin: 766px 0px 0px 208px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.6);
    margin: -2% 0% 0% 0%;
  }


}


@media only screen and (max-width: 414px) and (max-height: 736px) {
  #take-photo {
    position: absolute;
    background: none;
    margin: 528px 0px 0px 163px;
    border: none;
    width: 74px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 615px 0px 0px 31px;
    position: absolute;
    background: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 50%;
    height: auto;
    margin: -26% 0% 0% -50%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 369px 0px 0px 13px;
  }

  .imgprev {
    position: absolute;
    margin: -137% 0% 0% 8%;
    width: 100px;
  }

  #next {
    margin: 394px 0px 0px 247px;
  }

  .imgnext {
    position: absolute;
    margin: -137% 0% 0% 111%;
    width: 100px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 180px;
    margin: 653px 0px 0px 211px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.6);
    margin: -2% 0% 0% 0%;
  }


}


@media only screen and (max-width: 412px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 666px 0px 0px 164px;
    border: none;
    width: 74px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 757px 0px 0px 31px;
    position: absolute;
    background: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 50%;
    height: auto;
    margin: -26% 0% 0% -50%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 461px 0px 0px 13px;
  }

  .imgprev {
    position: absolute;
    margin: -137% 0% 0% 8%;
    width: 100px;
  }

  #next {
    margin: 487px 0px 0px 261px;
  }

  .imgnext {
    position: absolute;
    margin: -137% 0% 0% 111%;
    width: 100px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 180px;
    margin: 785px 0px 0px 211px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.6);
    margin: -2% 0% 0% 0%;
  }


}

@media only screen and (max-width: 412px) and (max-height: 860px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 572px 0px 0px 165px;
    border: none;
    width: 74px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 738px 0px 0px 31px;
    position: absolute;
    background: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 50%;
    height: auto;
    margin: -26% 0% 0% -50%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 415px 0px 0px 13px;
  }

  .imgprev {
    position: absolute;
    margin: -137% 0% 0% 8%;
    width: 100px;
  }

  #next {
    margin: 439px 0px 0px 244px;
  }

  .imgnext {
    position: absolute;
    margin: -137% 0% 0% 111%;
    width: 100px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 180px;
    margin: 765px 0px 0px 208px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.6);
    margin: -10% 0% 0% 0%;
  }

}

@media only screen and (max-width: 412px) and (max-height: 823px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 572px 0px 0px 165px;
    border: none;
    width: 74px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 720px 0px 0px 31px;
    position: absolute;
    background: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 50%;
    height: auto;
    margin: -26% 0% 0% -50%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 415px 0px 0px 13px;
  }

  .imgprev {
    position: absolute;
    margin: -137% 0% 0% 8%;
    width: 100px;
  }

  #next {
    margin: 439px 0px 0px 244px;
  }

  .imgnext {
    position: absolute;
    margin: -137% 0% 0% 111%;
    width: 100px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 180px;
    margin: 740px 0px 0px 208px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.6);
    margin: -10% 0% 0% 0%;
  }

}


@media only screen and (max-width: 412px) and (max-height: 785px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 590px 0px 0px 156px;
    border: none;
    width: 74px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 100px;
    height: 100px;
    margin: 671px 0px 0px 15px;
    position: absolute;
    background: none;
    border: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 50%;
    height: auto;
    margin: -26% 0% 0% -50%;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.55);
    margin: -10% 0% 0% 0%;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 180px;
    margin: 704px 0px 0px 196px;
  }

}

@media only screen and (max-width: 412px) and (max-height: 732px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 522px 0px 0px 165px;
    border: none;
    width: 74px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 622px 0px 0px 31px;
    position: absolute;
    background: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 50%;
    height: auto;
    margin: -26% 0% 0% -50%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 351px 0px 0px 13px;
  }

  .imgprev {
    position: absolute;
    margin: -137% 0% 0% 8%;
    width: 100px;
  }

  #next {
    margin: 375px 0px 0px 244px;
  }

  .imgnext {
    position: absolute;
    margin: -137% 0% 0% 111%;
    width: 100px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 180px;
    margin: 649px 0px 0px 208px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.55);
    margin: -10% 0% 0% 0%;
  }

}

@media only screen and (max-width: 393px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 573px 0px 0px 142px;
    border: none;
    width: 74px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 673px 0px 0px 31px;
    position: absolute;
    background: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 50%;
    height: auto;
    margin: -26% 0% 0% -50%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 372px 0px 0px 13px;
  }

  .imgprev {
    position: absolute;
    margin: -137% 0% 0% 8%;
    width: 100px;
  }

  #next {
    margin: 394px 0px 0px 225px;
  }

  .imgnext {
    position: absolute;
    margin: -137% 0% 0% 111%;
    width: 100px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 180px;
    margin: 700px 0px 0px 190px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.6);
    margin: -16% 0% 0% 0%;
  }


}

@media only screen and (max-width: 392px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 470px 0px 0px 155px;
    border: none;
    width: 74px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 600px 0px 0px 31px;
    position: absolute;
    background: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 50%;
    height: auto;
    margin: -26% 0% 0% -50%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 321px 0px 0px 13px;
  }

  .imgprev {
    position: absolute;
    margin: -137% 0% 0% 8%;
    width: 100px;
  }

  #next {
    margin: 350px 0px 0px 225px;
  }

  .imgnext {
    position: absolute;
    margin: -137% 0% 0% 111%;
    width: 100px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 180px;
    margin: 625px 0px 0px 190px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.55);
    margin: -14% 0% 0% 0%;
  }


}

@media only screen and (max-width: 390px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 523px 0px 0px 155px;
    border: none;
    width: 74px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 735px 0px 0px 31px;
    position: absolute;
    background: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 50%;
    height: auto;
    margin: -26% 0% 0% -50%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 399px 0px 0px 13px;
  }

  .imgprev {
    position: absolute;
    margin: -137% 0% 0% 8%;
    width: 100px;
  }

  #next {
    margin: 425px 0px 0px 225px;
  }

  .imgnext {
    position: absolute;
    margin: -137% 0% 0% 111%;
    width: 100px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 180px;
    margin: 765px 0px 0px 190px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.55);
    margin: -14% 0% 0% 0%;
  }


}


@media only screen and (max-width: 384px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 584px 0px 0px 155px;
    border: none;
    width: 70px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 0px;
    position: absolute;
    background: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 50px;
    height: auto;
    margin: 782% 0% 0% -13%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 405px 0px 0px 13px;
  }

  .imgprev {
    position: absolute;
    margin: -137% 0% 0% 8%;
    width: 100px;
  }

  #next {
    margin: 424px 0px 0px 218px;
  }

  .imgnext {
    position: absolute;
    margin: -137% 0% 0% 111%;
    width: 100px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 174px;
    margin: 756px 0px 0px 183px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.6);
  }



}

@media only screen and (max-width: 375px) {

  .imgphoto {
    width: 25%;
    height: auto;
    margin: 227% 0% 0% 58%;

  }

  .imgswitchcam {
    position: absolute;
    width: 13%;
    height: auto;
    margin: -250% 0% 0% 11%;
  }


  .imgshare-exp {
    position: absolute;
    width: 20%;
    height: auto;
    margin: -251% 0% 0% 120%;
  }


  .imgprev {
    position: absolute;
    margin: -138% 0% 0% 4%;
    width: 20%;
  }

  .imgnext {
    position: absolute;
    margin: -138% 0% 0% 123%;
    width: 20%;
  }



  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.6);
    margin: -10% 0% 0% 0%;
  }



}


@media only screen and (max-width: 375px) and (max-height: 812px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 555px 0px 0px 139px;
    border: none;
    width: 74px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 692px 0px 0px 31px;
    position: absolute;
    background: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 50%;
    height: auto;
    margin: -26% 0% 0% -50%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 396px 0px 0px 13px;
  }

  .imgprev {
    position: absolute;
    margin: -137% 0% 0% 8%;
    width: 100px;
  }

  #next {
    margin: 414px 0px 0px 215px;
  }

  .imgnext {
    position: absolute;
    margin: -137% 0% 0% 111%;
    width: 100px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 180px;
    margin: 717px 0px 0px 173px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.6);
    margin: -10% 0% 0% 0%;
  }



}


@media only screen and (max-width: 375px) and (max-height: 667px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 471px 0px 0px 139px;
    border: none;
    width: 74px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 575px 0px 0px 31px;
    position: absolute;
    background: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 50%;
    height: auto;
    margin: -26% 0% 0% -50%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 315px 0px 0px 13px;
  }

  .imgprev {
    position: absolute;
    margin: -137% 0% 0% 8%;
    width: 100px;
  }

  #next {
    margin: 339px 0px 0px 214px;
  }

  .imgnext {
    position: absolute;
    margin: -137% 0% 0% 111%;
    width: 100px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 180px;
    margin: 602px 0px 0px 170px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.55);
    margin: -10% 0% 0% 0%;
  }



}



@media only screen and (max-width: 360px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: -11px 0px 0px 5px;
    border: none;
    width: 220px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 675px 0px 0px 36px;
    position: absolute;
    background: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 70px;
    height: auto;
    margin: -40% 0% 0% -38%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 295px 0px 0px 13px;
  }

  .imgprev {
    position: absolute;
    margin: -137% 0% 0% 8%;
    width: 100px;
  }

  #next {
    margin: 313px 0px 0px 200px;
  }

  .imgnext {
    position: absolute;
    margin: -137% 0% 0% 111%;
    width: 100px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 140px;
    margin: 145px 0px 0px 201px;
  }


  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.6);
    margin: -10% 0% 0% 0%;
  }


}


@media only screen and (max-width: 360px) and (max-height: 800px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 527px 0px 0px 141px;
    border: none;
    width: 60px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 675px 0px 0px 36px;
    position: absolute;
    background: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 50%;
    height: auto;
    margin: -26% 0% 0% -50%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 389px 0px 0px 4px;
  }

  .imgprev {
    position: absolute;
    margin: -137% 0% 0% 8%;
    width: 100px;
  }

  #next {
    margin: 410px 0px 0px 203px;
  }

  .imgnext {
    position: absolute;
    margin: -137% 0% 0% 111%;
    width: 100px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 140px;
    margin: 709px 0px 0px 191px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.6);
    margin: -10% 0% 0% 0%;
  }

}


@media only screen and (max-width: 360px) and (max-height: 780px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 516px 0px 0px 141px;
    border: none;
    width: 70px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 657px 0px 0px 36px;
    position: absolute;
    background: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 50%;
    height: auto;
    margin: -26% 0% 0% -50%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 378px 0px 0px 13px;
  }

  .imgprev {
    position: absolute;
    margin: -137% 0% 0% 8%;
    width: 100px;
  }

  #next {
    margin: 403px 0px 0px 200px;
  }

  .imgnext {
    position: absolute;
    margin: -137% 0% 0% 111%;
    width: 100px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 174px;
    margin: 686px 0px 0px 164px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.6);
    margin: -10% 0% 0% 0%;
  }

}

@media only screen and (max-width: 360px) and (max-height: 720px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 487px 0px 0px 127px;
    border: none;
    width: 76px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 100px;
    height: 100px;
    margin: 610px 0px 0px 15px;
    position: absolute;
    background: none;
    border: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 50%;
    height: auto;
    margin: -26% 0% 0% -50%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 340px 0px 0px 4px;
  }

  .imgprev {
    position: absolute;
    margin: -137% 0% 0% 8%;
    width: 100px;
  }

  #next {
    margin: 363px 0px 0px 203px;
  }

  .imgnext {
    position: absolute;
    margin: -137% 0% 0% 111%;
    width: 100px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 140px;
    margin: 650px 0px 0px 191px;
  }


  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.6);
    margin: -10% 0% 0% 0%;
  }

}


@media only screen and (max-width: 360px) and (max-height: 693px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: -11px 0px 0px 5px;
    border: none;
    width: 220px;
  }

  .imgphoto {
    width: 20%;
    height: auto;
    margin: 232% 0% 0% 59%;
  }

  #ShareExp {
    width: 100px;
    height: 100px;
    margin: 586px 0px 0px -121px;
    position: absolute;
    background: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 57%;
    height: auto;
    margin: -63% 0% 0% 100%;
  }

  .imgphoto {
    width: 20%;
    height: auto;
    margin: 232% 0% 0% 59%;

  }

  .imgswitchcam {
    position: absolute;
    width: 13%;
    height: auto;
    margin: -250% 0% 0% 11%;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.6);
    margin: -10% 0% 0% 0%;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 180px;
    margin: 595px 0px 0px 151px;
  }

}


@media only screen and (max-width: 360px) and (max-height: 640px) {
  #take-photo {
    position: absolute;
    background: none;
    margin: 504px 0px 0px 141px;
    border: none;
    width: 60px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 546px 0px 0px 36px;
    position: absolute;
    background: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 50%;
    height: auto;
    margin: -26% 0% 0% -50%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 301px 0px 0px 4px;
  }

  .imgprev {
    position: absolute;
    margin: -137% 0% 0% 8%;
    width: 100px;
  }

  #next {
    margin: 324px 0px 0px 203px;
  }

  .imgnext {
    position: absolute;
    margin: -137% 0% 0% 111%;
    width: 100px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 140px;
    margin: 580px 0px 0px 191px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.6);
    margin: -10% 0% 0% 0%;
  }

}



@media only screen and (max-width: 320px) {

  #take-photo {
    position: absolute;
    background: none;
    margin: 422px 0px 0px 128px;
    border: none;
    width: 60px;
  }

  .imgphoto {
    width: 98%;
    height: auto;
    margin: 0% 0% 0% 1%;
  }

  #ShareExp {
    width: 90px;
    height: 90px;
    margin: 473px 0px 0px 31px;
    position: absolute;
    background: none;
  }

  .imgshare-exp {
    position: absolute;
    width: 50%;
    height: auto;
    margin: -26% 0% 0% -50%;
  }

  #prev {
    position: absolute;
    width: 30px;
    height: auto;
    margin: 275px 0px 0px 2px;
  }

  .imgprev {
    position: absolute;
    margin: -137% 0% 0% 8%;
    width: 100px;
  }

  #next {
    margin: 300px 0px 0px 171px;
  }

  .imgnext {
    position: absolute;
    margin: -137% 0% 0% 111%;
    width: 100px;
  }

  .marca-agua-logo1 {
    position: absolute;
    width: 150px;
    margin: 510px 0px 0px 152px;
  }

  #imageTargetUI .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(to right, white 10px, transparent 10px) 0 0, linear-gradient(to right, white 10px, transparent 10px) 0 100%, linear-gradient(to left, white 10px, transparent 10px) 100% 0, linear-gradient(to left, white 10px, transparent 10px) 100% 100%, linear-gradient(to bottom, white 10px, transparent 10px) 0 0, linear-gradient(to bottom, white 10px, transparent 10px) 100% 0, linear-gradient(to top, white 10px, transparent 10px) 0 100%, linear-gradient(to top, white 10px, transparent 10px) 100% 100%;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transform: scale(0.6);
    margin: -10% 0% 0% 0%;
  }



}