Fixes for carousel on narrow screens

Signed-off-by: nicolatimeus <nicola.timeus@eurotech.com>
diff --git a/content/css/style.css b/content/css/style.css
index 9fbb59b..347d55c 100644
--- a/content/css/style.css
+++ b/content/css/style.css
@@ -55,25 +55,34 @@
 /* CAROUSEL */
 
 .carousel-inner .item {
-  height: 500px !important;
   text-align: center !important;
-  overflow: hidden !important;
+  height: 500px !important;
 }
+
 .carousel-inner img {
-  height: 100% !important;
-  width: auto !important;
+  max-height: 100% !important;
+  max-width: 100% !important;
   display: inline !important;
 }
+
+@media (max-aspect-ratio: 1/1) {
+  .carousel-inner .item {
+    height: 56vw !important;
+  }
+}
+
 .carousel {
   background-color: rgb(247,247,247) !important;
   border: solid 1px rgb(203,203,203) !important;
 }
+
 .carousel-control {
   color: black !important;
   background-image: initial !important;
   opacity: 0.8;
   transition: opacity 0.25s;
 }
+
 .carousel-control:hover {
   opacity: 0.6;
 }
diff --git a/content/images/wires_example.png b/content/images/wires_example.png
index 8e37698..0d21025 100644
--- a/content/images/wires_example.png
+++ b/content/images/wires_example.png
Binary files differ