/* a has a 100% height */
header#header .logo a img {
	display: inline-block;
	vertical-align: middle;
}

/* target the main container for mein konto - wider than standard */
body.vt_my-account #main .container, body.vt_checkout #main .container { 
	max-width: 1170px;
	margin: 0 auto;
}

body.vt_my-account .woocommerce-MyAccount-navigation {
	margin-right: 0px;
	margin-left: 0px;
}

/* Centre the footer menu */
#socket .sub_menu_socket {
    float:none;
    
}

#socket .sub_menu_socket div {
    display:flex;
    font-size:14px;   /* TK req */
    padding-top:2px; /* fix clipping*/
    padding-bottom:4px; /* fix clipping */
}

#socket .menu {
    display:inline-block;
    margin: 0 auto;
}

/* Over-ride Mailchimp's !important styling with our btn standards */
.vt_newsletter .entry-content form.mc4wp-form-theme-light input[type='submit'] {
    background-color: #cf1b15 !important;
    color:#fff !important;
    width:24%;
    min-width:193px; /* Same magic number as hardcoded in Enfold for woo! */
    font-size: 20px;  
    border-radius:5px;
    font-family: Helvetica, Arial, sans-serif;
}

/* We always want the border on the footer. */
footer.container_wrap {
    border-width:1px;
}

/* Remove Enfold's defalt border, e.g. after page title and between single product and other products */
.container_wrap {
    border-width:0px;
}
/* Default doesn't work for our 2 col layout */
@media (min-width: 768px) {
	.woocommerce-MyAccount-content {
		width: initial;
		padding-left: 25px !important;
	}
}

/* Stop the search glass overlaying the logo on small screens */
@media only screen and (max-width : 480px) {
   .html_burger_menu #top #avia-menu #menu-item-search {
        display:none;
    }

}

/* Make footer menu useable on smaller devices */
@media only screen and (max-width : 580px) {
    /* Remove borders */
    #socket ul.menu li {
        border-left-style: none;
    }
    /* Increase tap-target */
    #socket ul.menu li a {
        padding:10px;    
        line-height:22px;
	font-size:14px;
    }

}
/* Footer menu tidy layout on smaller screens */

/* 3 columns while there is room */
@media only screen and (max-width: 680px) {

	#socket ul.menu {
		display: grid;
		grid-template-columns: repeat(3, minmax(90px, 1fr));
		gap: 6px;
		justify-content: center;   /* centre the grid */
		width: fit-content;        /* stop it stretching full width */
		max-width: 100%;
		margin: 0 auto;
	}

	#socket ul.menu li {
		border-left: none;
		width: auto;
		clear: none;
	}

	#socket ul.menu li a {
		display: block;
		padding: 10px;
		line-height: 22px;
		font-size: 14px;
		text-align: center;
		box-sizing: border-box;
		min-width: 90px;
	}

	/* This one item is likely making the layout messy */
	#socket ul.menu li .avia-menu-subtext {
		display: none;
	}
}

/* Drop to 2 columns */
@media only screen and (max-width: 420px) {
	#socket ul.menu {
		grid-template-columns: repeat(2, minmax(110px, 1fr));
	}
}

/* Drop to 1 column only when truly narrow */
@media only screen and (max-width: 320px) {
	#socket ul.menu {
		grid-template-columns: 1fr;
	}
	.vt_newsletter .entry-content form.mc4wp-form-theme-light input[type='submit'] {
		font-size:14px;
		min-width:100%;
	}
}
