Add menu tu wagabunda

wagabunda.net.pl/styles.scss

@@ -349,10 +349,23 @@ body nav.main-nav {
 		display: block !important;
 	}
 
+	@media (max-width: 500px) {
+		.additional-separator {
+			display: none !important;
+		}
+		.header-container {
+			min-height: 36px;
+		}
+	}
 	ul.mega-menu-content {
 		padding-left: 15px;
 		padding-right: 15px;
 
+		@media (max-width: 500px) {
+			display: none;
+			flex-direction: column;
+		}
+
 		> li {
 			.btn-cart,
 			.quick-search {
@@ -361,11 +374,20 @@ body nav.main-nav {
 
 			> a {
 				padding: 13px 14px 14px;
+
+				@media (max-width: 500px) {
+					padding: 5px;
+					min-height: auto !important;
+					text-align: center;
+				}
 			}
 
 			.elem-in-nav {
 				span {
 					font-size: 16px;
+					@media (max-width: 500px) {
+						font-size: 14px;
+					}
 				}
 			}
 
@@ -439,6 +461,28 @@ body nav.main-nav {
 				}
 			}
 
+			&.mm-basket-li {
+				> .btn-cart {
+					@media (max-width: 500px) {
+						margin: 0 auto;
+					}
+				}
+			}
+			&.pull-left {
+				> .quick-search {
+					@media (max-width: 500px) {
+						margin: 0 auto;
+					}
+				}
+				@media (max-width: 500px) {
+					&.visible-panel {
+						.quick-search {
+							bottom: 0;
+						}
+					}
+				}
+			}
+
 			@media (max-width: 820px) {
 				.mobile-menu-item.sub-menu.full-width-sub-menu {
 					width: calc(100% - 30px) !important;
@@ -474,6 +518,9 @@ body nav.main-nav {
 					}
 				}
 			}
+			@media (max-width: 500px) {
+				width: 100%;
+			}
 		}
 	}
 
@@ -486,6 +533,74 @@ body nav.main-nav {
 			}
 		}
 	}
+
+	.mega-menu-hamburger {
+		position: relative;
+		padding: 10px 15px;
+		line-height: 0;
+		text-align: center;
+
+		@media (min-width: 501px) {
+			display: none;
+		}
+
+		.mega-menu-hamburger-btn {
+			position: relative;
+			border: none;
+			width: 36px;
+			height: 36px;
+			background: #fff;
+			padding: 0;
+			margin: 0;
+			border-radius: 3px;
+			overflow: hidden;
+
+			&::before {
+				content: '';
+				position: absolute;
+				top: 8px;
+				left: 5px;
+				width: 25px;
+				height: 2px;
+				background: $cBlue;
+				transition: all 250ms ease-in-out;
+			}
+			&::after {
+				content: '';
+				position: absolute;
+				top: 26px;
+				left: 5px;
+				width: 25px;
+				height: 2px;
+				background: $cBlue;
+				transition: all 250ms ease-in-out;
+			}
+
+			&.active {
+				&::before {
+					top: 18px;
+					transform: rotate(-45deg);
+				}
+				&::after {
+					top: 18px;
+					transform: rotate(45deg);
+				}
+				span {
+					transform: translateX(calc(100% + 10px));
+				}
+			}
+
+			span {
+				position: absolute;
+				top: 17px;
+				left: 5px;
+				width: 25px;
+				height: 2px;
+				background: $cBlue;
+				transition: all 250ms ease-in-out;
+			}
+		}
+	}
 }
 #widget197464156 {
 	.promo-box {