/* 
- Name: megamenu.js - style.css
- Version: 1.0
- Latest update: 29.01.2016.
- Author: Mario Loncarek
- Author web site: http://marioloncarek.com
*/

/* ––––––––––––––––––––––––––––––––––––––––––––––––––
Screen style's
–––––––––––––––––––––––––––––––––––––––––––––––––– */

/*.menu-container {
	clear: both;
	width: auto;
	margin: 0 auto 20px;
	background: #fff;
}*/
.menu-mobile { display: none; padding: 20px; background: url(../img/menu-mobile.png) no-repeat right top; position: absolute; top: 20px; right: 20px; width: 50px; height: 50px; }
/*.menu-mobile:after {
    content: "\f394";
    font-family: "Ionicons";
    font-size: 2.5rem;
    padding: 0;
    float: right;
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-25%);
    -ms-transform: translateY(-25%);
    transform: translateY(-25%);
}*/
.menu-dropdown-icon:before { content: "\f489"; font-family: "Ionicons"; display: none; cursor: pointer; float: right; /*background: #fff;*/
color: #333; font-size: 1.2rem; padding: .8em 1.2em; line-height: 1; }
.menu > ul { margin: 0 auto; width: 100%; list-style: none; padding: 0; position: relative; box-sizing: border-box; }
.menu > ul:before, .menu > ul:after { content: ""; display: table; }
.menu > ul:after { clear: both; }
.menu > ul > li > ul { display: none; /*background: #fff;*/
padding: 0; position: absolute; z-index: 999; left: 0; margin: 0; list-style: none; box-sizing: border-box; width: auto; opacity: 1; }
.menu > ul > li:hover { opacity: 1; }
.menu > ul > li > ul > li { margin: 0; padding: 0; list-style: none; font-size: 93%; float: none; line-height: 1; height: auto; z-index: 501; width: auto; }
.menu > ul > li#recycle > ul > li { min-width: 17em; }
.menu > ul > li > ul > li a { padding: 15px 20px; color: #5ba14d; background-color: #fff !important; display: block; opacity: 1 !important; }
.menu > ul > li > ul > li a:hover { color: #fff; background-color: #5ba14d !important; opacity: 1 !important; }
.menu .pc { display: block; }
.menu .sh { display: none; }

/* ––––––––––––––––––––––––––––––––––––––––––––––––––
Mobile style's
–––––––––––––––––––––––––––––––––––––––––––––––––– */

@media only screen and (max-width: 460px) {
.menu-container { width: 100%; margin-bottom: 0; }
.menu-mobile { display: inline-block; }
.menu-dropdown-icon:before { display: block; cursor: pointer; }
.menu > ul { display: none; }
.menu > ul > li { width: 100%; float: none; display: block; }
.menu > ul > li a { padding: 1em; width: 100%; display: block; background: #fff url(../img/icon-arrow.png) 90% 50% no-repeat; font-size: 4vw; }
.menu > ul > li a:hover { color: #000;background: #f0eae0 url(../img/icon-arrow.png) 90% 50% no-repeat; }
.menu > ul > li > ul { position: relative; }
.menu > ul > li > ul { width: 100%; background: #eee; padding: 0; left: 0; margin: 0; list-style: none; box-sizing: border-box; }
.menu > ul > li > ul > li { margin: 0; padding: 0; list-style: none; font-size: 100%; float: none; line-height: 1; height: auto; }
	
/*.menu > ul > li.sh a { background-image: none; text-align: center; font-size: 125%;}
.menu > ul > li.sh a:hover {background-image: none; }*/
/*.menu-dropdown-icon:before {
    content: "\f489";
    font-family: "Ionicons";
    display: none;
    cursor: pointer;
    float: right;
    background: #fff;
    color: #333;font-size: 1.3rem;padding: .8em 1.2em;box-sizing: border-box; 
}*/
.menu > ul > li > ul > li a { padding: 20px 15px; color: #fff; background-color: #5ba14d !important; display: block; opacity: 1 !important; }
.menu > ul > li > ul > li a:hover { color: #fff; background-color: #92c687 !important; opacity: 1 !important; }
.menu .show-on-mobile { display: block; }
.menu .pc { display: none; }
.menu .sh { display: block; }
}