/* ===== Styles to overwrite foundation framework's Top Bar ==================== */

/* ===== Top Bar menu - 1st Level ==================== */
.contain-to-grid{
	background: none;
}
.menu-wrapper{
	background: rgba(221,221,221,1);
	background: -moz-linear-gradient(top, rgba(221,221,221,1) 0%, rgba(231,231,231,1) 50%, rgba(224,224,224,1) 54%, rgba(229,229,231,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(221,221,221,1)), color-stop(50%, rgba(231,231,231,1)), color-stop(54%, rgba(224,224,224,1)), color-stop(100%, rgba(229,229,231,1)));
	background: -webkit-linear-gradient(top, rgba(221,221,221,1) 0%, rgba(231,231,231,1) 50%, rgba(224,224,224,1) 54%, rgba(229,229,231,1) 100%);
	background: -o-linear-gradient(top, rgba(221,221,221,1) 0%, rgba(231,231,231,1) 50%, rgba(224,224,224,1) 54%, rgba(229,229,231,1) 100%);
	background: -ms-linear-gradient(top, rgba(221,221,221,1) 0%, rgba(231,231,231,1) 50%, rgba(224,224,224,1) 54%, rgba(229,229,231,1) 100%);
	background: linear-gradient(to bottom, rgba(221,221,221,1) 0%, rgba(231,231,231,1) 50%, rgba(224,224,224,1) 54%, rgba(229,229,231,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dddddd', endColorstr='#e5e5e7', GradientType=0 );
	border-top: 1px solid #E0E0E0;	
}
.top-bar.expanded .title-area{
	background: none;
}
li.top-nav.responsive-hide {
	display:none;
}
.top-bar,
.top-bar-section ul,
.top-bar-section ul li > a,
.top-bar-section li a:not(.button),
.top-bar-section li a:hover:not(.button)
{
	background: none;
}
.top-bar-section li a:hover:not(.button){
	background: rgba(0, 0, 0, 0.1);
}
.top-bar-section ul li > a {
    color: #000;
	font-family: 'Varela Round', sans-serif;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	font-size: 18px;
    border-left: 1px solid #fff;
}
.top-bar-section .has-dropdown > a{
	padding-right: 45px !important;
}
.top-bar-section .has-dropdown > a::after{
	border-color: rgb(237, 28, 36) transparent transparent transparent;
	top: 32px;
	margin-right: 25px;
}
.top-bar-section li a:not(.button){
	line-height: 60px;
	padding: 0px 30px;
}
.top-bar-section ul li:last-child > a {
	border-right: 1px solid #fff;
}
.top-bar-section ul li{
	border-left: 1px solid #cdcdcd;
}
.top-bar-section ul li:last-child{
	border-right: 1px solid #cdcdcd;
}
.top-bar-section > ul > li.hover > a,
.top-bar-section > ul > li:hover > a,
.top-bar-section > ul > li > a:active,
.top-bar-section > ul > li > a:hover,
.top-bar-section > ul > li.selected > a {
	background: rgba(0, 0, 0, 0.1);
	box-shadow: none;
	color: #000;
}
.top-bar-section .dropdown li a:hover,
.top-bar-section .dropdown li:hover a {
	background: #fff;
	color: #000;
}
.top-bar-section .dropdown li a {
	color: #000;
}
ul.dropdown li a{
	color: #000;	
}
.top-bar-section .dropdown {
	background: #e6e6e6;
	color: #000;
}
.top-bar-section .dropdown {
	background: #e6e6e6;
	color: #000;
}

/* ===== Top Bar menu - 2nd Level ==================== */
.top-bar-section ul li ul.dropdown li{
	border: none;
}

.top-bar-section ul li ul.dropdown li a{
	border: none;
	background-color: #eee;
    border-bottom: 1px solid #cdcdcd;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: 12px;
    line-height: 40px;
}
.top-bar-section .selected .dropdown li a {
	color: #000 !important;
}
.top-bar-section ul li ul.dropdown li.has-dropdown.not-click > a:after { 	
	border-top: 4px solid transparent;
	border-bottom: 4px solid transparent;
	border-left: 4px solid #5f5f5f;
}
/* ===== Top Bar menu - 3rd Level ==================== */
.top-bar-section ul li ul.dropdown li.has-dropdown.not-click ul li a{
	background-color: #f3f2f4;
}
.top-bar-section ul li ul.dropdown li.has-dropdown.not-click ul li a:hover{
	background-color: #fff;
}
/* ===== Top Bar menu - 4th Level ==================== */
.top-bar-section ul li ul.dropdown li.has-dropdown.not-click ul li ul li a{
	background-color: #fff;
}
.top-bar-section ul li ul.dropdown li.has-dropdown.not-click ul li ul li a:hover{
	background-color: #f2f2ee;
}



@media only screen and (max-width: 58.75em) {
	/* ===== Header ==================== */	
    header{
        background-color: #000;
        position: relative;
    }
    .top-bar,
	.top-bar-section ul,
	.top-bar-section ul li > a,
	.top-bar-section li a:not(.button),
	.top-bar-section li a:hover:not(.button){
		background: #f9f9f9;
	}
    
    li.top-nav.responsive-hide {
    	display: initial;
    }
    .search-bar{
        display: none;
    }
    /* ===== Utility nav ==================== */
    .top-bar {
    	background-color: #fff;
	  	height: 65px;
	  	line-height: 65px;
	}
	.top-bar .name{
		height: 65px;
	}

    .top-bar-section ul{
    }
    .top-bar .toggle-topbar.menu-icon {
        
	}
	.top-bar .toggle-topbar.menu-icon a span {
		-webkit-box-shadow: 0 10px 0 1px #ED1C24, 0 16px 0 1px #ED1C24, 0 22px 0 1px #ED1C24;
		box-shadow: 0 10px 0 1px #ED1C24, 0 16px 0 1px #ED1C24, 0 22px 0 1px #ED1C24;
	}
    .top-bar.expanded {
		background-color: #fff;
		
	}
    .title-area{
        display:block;
    }
    .menu-wrapper{
        background: none;
        border-top: none; 
    }
    h1#logo-replace {
		width: 190px;
		height: 40px;
		background: url(images/morphy-richards-logo-header.png) 10px 0 no-repeat;
		background-size: contain;
		margin: 0px !important;
		top: 25%;
		position: relative;
		z-index: 2000;
  }

    /* ===== Top Bar menu - 1st Level ==================== */
    .top-bar-section {
    }
    .top-bar-section ul li {
        border-left: none;
    }
    .top-bar-section .selected .dropdown li a {
        color: #000 !important;
        background-color: #fff !important;
    }
    .top-bar-section ul li > a {
    	color: #000;
        border-left: none;
        border-bottom: 1px solid #eee;
    }
    .top-bar-section .has-dropdown > a:after { 
    }
    .top-bar-section .dropdown {
        background: #fff;
        color: #000;
    }
    .top-bar-section .dropdown li.title h5 a{
        background: #fff;
        color: #000;
    }
    /* ===== Top Bar menu - 2nd Level ==================== */
    .top-bar-section ul li ul.dropdown li a{
        color: #000;
        background-color: #fff;
        border-bottom: 1px solid #eee;
        font-size: 18px;
  		line-height: 50px;
    }
    
    .top-bar-section ul li ul.dropdown li a:hover{
        color: #000;
        background-color: #eee;
    }
    .top-bar-section .dropdown li.selected a {
        background: #fff !important;
        color: #000;
    }
    /* ===== Top Bar menu - 3rd Level ==================== */
    .top-bar-section ul li ul.dropdown li.has-dropdown.not-click ul li a{
        color: #000;
        background-color: #fff;
    }
    .top-bar-section ul li ul.dropdown li.has-dropdown.not-click ul li a:hover{
        color: #000;
        background-color: #eee;
    }
    /* ===== Top Bar menu - 4th Level ==================== */
    .top-bar-section ul li ul.dropdown li.has-dropdown.not-click ul li ul li a{
        color: #000;
        background-color: #fff;
    }
    .top-bar-section ul li ul.dropdown li.has-dropdown.not-click ul li ul li a:hover{
        color: #000;
        background-color: #eee;
    }

