@CHARSET "UTF-8";
@media screen and (max-width: 1024px) {
	.avia-menu .av-main-nav .my-nav-menu-search{
		padding-right: 260px !important;
        min-width: 200px;
	}
	.avia-menu .av-main-nav .my-nav-menu-search button{
	display:none;
	}
	.avia-menu .av-main-nav .my-nav-menu-search .search-field{
	width:135px !important;
	}
}
@media screen and (max-width: 900px) {
	.avia-menu .av-main-nav .my-nav-menu-search{
		padding-right: 200px !important;
	}
}
/* my-nav-menu-search menu item created in functions.php. Move it way over to the right */
.avia-menu .av-main-nav .my-nav-menu-search {
    float: right;
    padding-right:260px; /* 340px */
}
.navbar .nav {
    width: 100%;
}

/* The "Search for" text is needed for screen readers, but we move it off screen, so we won't see it */
.my-nav-menu-search .search-form .screen-reader-text {
    position: absolute;
    left: -9999px;
    overflow: hidden;
}

.woocommerce-product-search{border-right: 1px solid #e1e1e1;}
.woocommerce-product-search .search-field{float:left;font-style:italic}
.woocommerce-product-search button{border: 0; background: transparent; margin-top: 14px}

/* Add a magnifying glass background and style the search input textbox */
.my-nav-menu-search .search-field {
	
    background-color: transparent;
    /* CHANGE THIS LINK TO POINT TO YOUR SEARCH ICON */
    background-image: url(icon_search.png);
    background-repeat: no-repeat;
    background-position: 5px center;
    -webkit-background-size:    18px 18px;
    background-size:            18px 18px;
    border: none;
    -webkit-box-shadow:    none;
    -moz-box-shadow:       none;
    box-shadow:            none;
    cursor: pointer;
    padding: 17px 15px !important;
    position: relative;
    -webkit-transition:    width 400ms ease, background 400ms ease;
    -moz-transition:       width 400ms ease, background 400ms ease;
    -o-transition:         width 400ms ease, background 400ms ease;
    transition:            width 400ms ease, background 400ms ease;
    width: 80% !important;
}

.my-nav-menu-search .search-field:active,
.my-nav-menu-search .search-field:focus {
    background-color: #fafafa;
    color: #5a5a5a;
    /* swap the two colours above if you are working with a dark navbar background */
    border: 2px solid #c3c0ab;
    cursor: text;
    outline: 0;
    width: 70px;
    -webkit-box-shadow:	none;
    -moz-box-shadow: 	none;
    box-shadow:         none;
    margin: 0;
}

/* Reset nav width and search floating for mobile menu */
@media (max-width: 979px){
    .navbar .nav .my-nav-menu-search {
        float: none;
    }
    .navbar .nav {
        width: auto;
    }
}