/* ============================================
   H5P Agamotto — Proportional Scaling
     ============================================ */

:root {
  --agamotto-max-width: 90%; 
}

@media (min-width: 1200px){
.h5p-agamotto {
  width: var(--agamotto-max-width) !important;
  max-width: var(--agamotto-max-width) !important;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}


.h5p-agamotto .h5p-agamotto-wrapper,
.h5p-agamotto .h5p-agamotto-container {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}


.h5p-agamotto img {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  display: block;
}


.h5p-agamotto input[type="range"] {
  width: 100%;
  box-sizing: border-box;
}


.h5p-agamotto .h5p-agamotto-caption,
.h5p-agamotto .h5p-agamotto-label {
  width: 100%;
  box-sizing: border-box;
  /*font-size: 1em; /* σχετικό μέγεθος, κλιμακώνεται αυτόματα */
}


.h5p-agamotto canvas {
  width: 100% !important;
  max-width: 100% !important;
  height: auto;
  display: block;
}


.h5p-agamotto > * {
  box-sizing: border-box;
}
}