Responsive version

tailwind/custom/components/components.css

@@ -62,10 +62,10 @@ header {
 	background-size: cover;
 	background-position: center;
 
-	#site-navigation {
-		img.linkedin {
-			height: 1rem;
-		}
+	img.linkedin {
+		height: 1rem;
+		margin-left: 1rem;
+		margin-top: -0.5rem;
 	}
 
 	.header-cointainer {
@@ -84,6 +84,8 @@ header {
 
 		video {
 			width: 100%;
+			height: 100%;
+			object-fit: cover;
 		}
 	}
 
@@ -116,7 +118,13 @@ footer {
 		top: 15%;
 		z-index: 1000;
 		width: 40vw;
+		min-width: 500px;
 		margin-left: 15vw;
+		@media (max-width: 500px) {
+			width: 90vw;
+			min-width: 0;
+			margin: 5vw;
+		}
 	}
 }
 
@@ -128,13 +136,16 @@ footer {
 		@apply absolute;
 		left: -10vw;
 		top: 10vw;
+		@media (max-width: 500px) {
+			left: 10vw;
+		}
 	}
 }
 
 .overlay-icons {
-	@apply absolute drop-shadow-xl p-5;
+	@apply p-5;
 	width: 40vw;
-
+	min-width: 645px;
 	img {
 		width: 100px;
 	}
@@ -142,4 +153,8 @@ footer {
 	p {
 		width: 250px;
 	}
+
+	@media (min-width: 782px) {
+		@apply drop-shadow-xl absolute;
+	}
 }