/*    Reset Default Foundation Styling    */
/*
13px=0.815rem
15px=0.95rem
20px=1.25rem
24px=1.5rem
26px=1.625rem
28px=1.75rem
30px=1.875rem
41px=2.56rem
42px=2.625rem;
75px=4.69rem
 */
body{font-family: 'Lato',sans-serif;}
a {color: #373737;}
a:hover, a:focus {color: #54371e;}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {font-family: 'Lato',sans-serif;}
select{margin: 0}

/*    Header    */
.off-canvas-content {position: relative;padding-top: 75px; }
.sticky-top-bar {box-shadow: 0px 0px 5px #333;width: 100%;background-color: #fefefe;margin-top: 0;position: fixed;top: 0;left: 0;z-index: 50;-webkit-transition: -webkit-transform 0.4s;transition: -webkit-transform 0.4s;transition: transform 0.4s;transition: transform 0.4s, -webkit-transform 0.4s; }

.global-nav {height: 75px;position: relative;display: none; }
.global-nav .dropdown {width: auto; margin: 0; }
.global-nav .dropdown.menu a {color: #2c3840; }

.global-nav .dropdown.menu > li.is-dropdown-submenu-parent > a::after {display: none; }
.global-nav .dropdown.menu > li li a {text-align: left; }
.global-nav .right-side {text-align: right;}
.global-nav .right-side a{ font-weight: bold; color:#59912A; height: 100%; line-height: 75px}
.global-nav .menu a {height: 45px;line-height: 45px !important;padding-bottom: 0 !important;padding-top: 0 !important; }
.global-nav .global-nav-title {opacity: 0.9;-webkit-transition: all 0.25s ease-in-out;transition: all 0.25s ease-in-out; position: relative; height: 75px;}
.global-nav .global-nav-title:hover {opacity: 1;-webkit-transition: all 0.25s ease-in-out;transition: all 0.25s ease-in-out; }

.global-nav-title {line-height: 0;padding-left: 1rem;display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-webkit-flex-direction: column;-ms-flex-direction: column;flex-direction: column;-webkit-box-pack: center;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center;}
.global-nav-title .meya-logo {-webkit-transition: all 0.25s ease-in-out;transition: all 0.25s ease-in-out;min-height: 45px;height: 45px;line-height: 45px !important; }
.global-nav-mobile-wrapper .global-nav-title .meya-logo img{ height: 80%;}

.global-nav-mobile-wrapper {height: 75px;position: relative;display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;vertical-align: middle; }
.global-nav-mobile-wrapper button, .global-nav-mobile-wrapper [type="button"] {
	margin: 15px;
	padding: 9px 10px;
	background-color: transparent;
	background-image: none;
	border: 1px solid #ddd;
	border-radius: 4px;
}

.global-nav-mobile-wrapper .icon-bar {display: block;width: 22px;height: 2px;border-radius: 1px; background-color: #888;}
.global-nav-mobile-wrapper .icon-bar+.icon-bar {
	margin-top: 4px;
}

header{
	position:absolute; 
	top:0; 
	left:0; 
	width: 100%;
	height: 130px;
	background: transparent;
	z-index:99;
}

header .top-bar, header .top-bar ul {
	background-color:transparent;
}

header .top-bar ul li a{ font-size: 1.31rem; color: white; font-weight: bold; line-height: 1.31rem;}
header .top-bar ul li:hover a, header .top-bar ul li.active a{ color: black; background-color: transparent;}



.dropdown.menu li ul{border: 0; min-width: 300px;}
.dropdown.menu>li>a{font-weight: bold; line-height: 75px !important; height: 75px !important}
.dropdown.menu.medium-horizontal>li.is-dropdown-submenu-parent>a::after{border-color: white transparent transparent; right: 15px}

.dropdown.menu>li>a:hover, .dropdown.menu>li.is-active>a{color: white; background-color: #54371e}
.dropdown.menu>li li a:hover{color: #54371e; background-color: #ccc}
.is-dropdown-submenu .is-dropdown-submenu-parent.opens-right>a::after {border-color: transparent transparent transparent #2C3840;}
.menu .is-active > a{ background-color: white}
.is-dropdown-submenu .is-dropdown-submenu-parent.opens-right.is-active>a::after {border-color: transparent transparent transparent #54371e;}

ul.dropdown_box, ul.dropdown_box li ul li{ background-color: transparent;}
ul.dropdown_box li a{border-bottom: 1px solid #cccccc;}
ul.dropdown_box li{ line-height: inherit; width: 100%;}
ul.dropdown_box a {color: #000; display: block; position: relative;}
ul.dropdown_box li.active > a{color: #54371e}
ul.dropdown_box li a.active {color: white; background-color: #54371e}
ul.dropdown_box a.haschild:before{content: "+"; background: none; font-size: 1.5rem; width: auto; height: auto; top: 6px; right: 9px;display: block;position: absolute;}
ul.dropdown_box li ul {display: none;}
ul.dropdown_box ul a.haschild:before{right: 27px;}
ul.dropdown_box li ul li a{padding-left: 2rem}
ul.dropdown_box li ul li ul li a{padding-left: 2.4rem}

.position-left { background-color: white;}

.breadcrumbs li:not(:last-child)::after{ position: initial}
.title-bar{background: #fefefe;color: #0a0a0a;padding: .7rem 1rem;}
.menu-icon::after {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 2px;
	background: #0a0a0a;
	-webkit-box-shadow: 0 7px 0 #0a0a0a, 0 14px 0 #0a0a0a;
	box-shadow: 0 7px 0 #0a0a0a, 0 14px 0 #0a0a0a;
	content: '';
}

/*    HOME    */
.homeslider {
    position: relative;
    background: #EEE url(../../images/ajax-loader.gif) no-repeat center;
	background-size: 100px 100px;
    margin-bottom: 45px;
	height: 640px
}

#header-top .homeslider {
	margin-top: 75px;
}

#header-top{position: absolute;width: 100%; height: 459px; top:0}
#header-top > div{background-position: center;background-repeat: no-repeat;background-size: cover;background-attachment: unset; height: 459px}
header-top > .bx-wrapper{ height: 640px;}

.homeslider .bg{
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 640px
}
/*    MAIN    */
#main, #main-bg {background-color: #FFF; margin-top: 384px; position: relative;}
#main > div.grid-container {padding-top:40px;padding-bottom:40px;}

#main-bg {background: #ffffff url(../images/content-box-bg.jpg) center top repeat-x;padding-bottom:40px; margin-top: 555px; padding-top: 45px}
#main-bg > div.grid-container{padding-top:0px;padding-bottom:0px;}


/*    Footer    */
footer {
	background: #1c1c1c url(../images/footer-bg.jpg) left top repeat;
	color:#FFFFFF;
	position: relative;
}
footer .grid-container:before, footer .grid-container:after {
	content: " ";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 4.25rem;
	border-bottom: 1px solid #3b3b3b;
	background: #191919;
	z-index: 1;
	display: none;
}
footer .grid-container:after{bottom: 0; top:auto; display: block;}
footer .grid-container .grid-x{ position: relative; z-index: 2}
footer p{ font-size: 1.315rem; text-transform: uppercase; font-weight: bold; line-height: 1.9rem; padding: 1.175rem 0;}
footer .menu li a{ font-size: 0.815rem; text-transform: uppercase; color: #888;padding: .5rem 0;}
footer .menu li a:hover, footer .menu li a:focus, footer .menu li.active a{ color:white;}
.menu .active>a{ background-color: transparent;}

footer .copyright{padding: 1.57rem 0.7rem; font-size: 0.7rem; color: #777}

address{ line-height: 1.5; font-size: 0.815rem; color: #777; font-style: normal;}
footer address{ font-size: 0.7rem;color: #777; font-style: normal;line-height: 2.19rem;}
.tel{color: white; font-size: 1.5rem;}
.email{color: #cb8d57;font-size: 0.7rem;}
.tel:hover, .tel:focus, .email:hover, .email:focus{color: black}
.social-icon{color: #888;font-size: 0.815rem;position: relative; line-height: 3rem; display: inline-block; padding-left: 3rem}
.social-icon i{font-size: 3rem; position: absolute; left:0;}
.social-icon:hover, .social-icon:focus{color: white;}
.banner{height:30vh}
.mini-banner > div{ max-height: 300px; overflow: hidden; position: relative;}
.mini-banner img{ width: 100%;}

form#contact button{background: #333;  color: #fff;}
form#contact button:hover, form#contact button:active, form#contact button:focus {background: #54371e;color: #fff;}

.product-list h4.title{ padding: 0.95rem 0 0 0; margin: 0; font-size: 0.815rem; line-height: 1.25rem}
.product-list h4.title b{ font-size: 0.9rem;}
.product-list a{display: block; padding-bottom: 1rem}
.product-list p.sale-price{ font-weight: 400; margin: 0; font-size: 1.625rem; line-height: 1.875rem}

.product-slider{ text-align: center;}
.product-slider .thumbnail{ margin-top: 1rem; max-width: 100%; border: 0}
.bx-wrapper .bx-viewport > div > div{z-index: 2 !important;}
#product-slider-pager{ text-align: center;}
.product-detail{ color:#8a8a8a}
.product-detail .cell .cell{margin-bottom: 1.25rem;}
.product-detail .cell .cell b{color: #191919; font-weight: bold}

.banner-cover{position: absolute; top:1.5rem; left: 1.75rem; height: 100%; width: 70%;color: white;text-transform: uppercase;}
.banner-cover .banner-top{ font-size: 2.56rem; line-height: 2.625rem}

.pagination .current{padding: 0}


@media print, screen and (min-width: 40em){
	.global-nav-title .meya-logo img{ max-height: 45px; height: auto}
	.dropdown.menu>li>a{padding: 1.25rem .5rem;}
	#offCanvasTop{ display: none;}
	footer .footer .cell:first-child{border-left: 1px solid #414141;padding-left: 2.1875rem;}
	footer .footer .cell{border-right: 1px solid #414141; padding: 0 0.3125rem}
	footer .footer .cell:nth-child(3){border-left: 1px solid #414141;padding-left: 2.1875rem;}
	.banner{height:400px}
	.mini-banner > div{ max-height: none}
	.mini-banner img{ height: 100%;}
	.banner-cover{width: 100%}
	.banner-cover .banner-top{ font-size: 1.4rem; line-height: 1.4rem}
	.product-slider .thumbnail{ max-width: 85%;}
}
@media print, screen and (min-width: 64em){

	.global-nav .dropdown {margin: 0 auto;}
	.dropdown.menu>li>a{padding: 1.25rem .75rem;}
	footer .footer .cell:nth-child(3){border-left: 0;padding: 0 0.3125rem}
	footer .footer{min-height: 360px}
	footer {background-repeat:repeat-x;}
	footer .grid-container:before{display: block;}
	#header-top{
		position: fixed;
	}
}
@media screen and (max-width: 1124px) {
	.sticky-top-bar .right-side { display: none;}
}
@media screen and (min-width: 1125px) {
	.sticky-top-bar .right-side { display: block;}
}
@media screen and (max-width: 39.99875em) {
	.sticky-top-bar.mobile-hidden {-webkit-transform: translateY(-100%);-ms-transform: translateY(-100%);transform: translateY(-100%); }
}
@media screen and (min-width: 775px) {
	.global-nav.show-for-smedium {display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex; }
	.global-nav-mobile-wrapper {display: none; }
}
