/****************************/
/**** mobile navigation  ****/
/****************************/
/* all resolutions up to 850px wide */
.white_navigation {
	color: #afbac5;
	float: right;
	font-family:"Lato", "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
}


/* first level navigation */
.white_navigation > ul.main { list-style: none;margin-top: 2px;text-align: right; }
.white_navigation > ul.main > li {
    display: inline-block;
    position: relative;
    width: auto;
}
.white_navigation > ul.main > li > span.menu_ico {
    width: 48px;
    height: 48px;
    background: url('../../images/icons/menu_ico-hover.png') no-repeat center;
    display: block;
}
.white_navigation > ul.main > li:hover > ul.drop { display: block; }
.white_navigation > ul.main > li:hover > span.menu_ico { background: url('../../images/icons/menu_ico.png') no-repeat center; }


/* second level navigation */
.white_navigation > ul.main > li > ul.drop {
     list-style: none;
     display: none;
    position: absolute;
    width: 300px;
    right: 0;
    background-color: black;
}

.white_navigation > ul.main > li > ul.drop > li { 
	display: inline-block;
	cursor: pointer;
	background: #000;
	color: #afbac5;
    width: 100%;
}
.white_navigation > ul.main > li > ul.drop > li:hover {
	color: #e2eaf3;
	border-bottom: 1px solid #899aae;
}
.white_navigation > ul.main > li > ul.drop > li > a {
	display: block;
	padding: 15px 30px;
	color: #afbac5 !important;
    font-size: 16px;
    text-decoration: none;
    text-align: center;
}
.white_navigation > ul.main > li > ul.drop > li:hover > a {
	color: #e2eaf3 !important;
}
.white_navigation > ul.main > li > ul.drop > li.login { position: relative; }
.white_navigation > ul.main > li > ul.drop > li.login > a { padding: 15px 30px 15px 40px; }
.white_navigation > ul.main > li > ul.drop > li.login > a > span.ico { width: 20px;height: 20px;position: absolute;left: 15px;top: 12px;display: inline;background: url('../../images/icons/login-icon.png') no-repeat top left; }


@media only screen and (min-width: 1010px) {
    .white_navigation { width: 80%; }
    .white_navigation > ul.main { padding: 0;margin: 0; }
    .white_navigation > ul.main > li { width: 100%;padding: 0;margin: 0; }
    .white_navigation > ul.main > li > span.menu_ico { display: none; }
    .white_navigation > ul.main > li > ul.drop { display: block;width: auto;position: relative; }
    .white_navigation > ul.main > li > ul.drop > li { float: right;width: auto;background: transparent; }
    .white_navigation > ul.main > li > ul.drop > li:last-child:after { clear: both; }
    .white_navigation > ul.main > li > ul.drop > li > a {
        padding: 15px 15px;
        font-size: 14px;
    }
}