/*
 * Dropit v1.1.0
 * http://dev7studios.com/dropit
 *
 * Copyright 2012, Dev7studios
 * Free to use and abuse under the MIT license.
 * http://www.opensource.org/licenses/mit-license.php
 */

/* These styles assume you are using ul and li */
.dropit {
    list-style: none;
	padding: 0;
	margin: 0;
}
.dropit .dropit-trigger { position: relative; }
.dropit .dropit-submenu {
    position: absolute;
    top: 100%;
    left: 0; /* dropdown left or right */
    right: 0;
    z-index: 1000;
    display: none;
    list-style: none;
	padding: 0;
	margin: 0;
}
.dropit .dropit-open .dropit-submenu { display: block; }

.menu.dropit {
	position: absolute;
	top: 0; right: 0;
}

.menu.dropit a {
	font-family: "Montserrat", Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.05em;
	line-height: 30px;
	text-transform: uppercase;
	width: 250px; height: 30px;
	background: url(arrow-down.png) right center no-repeat;
	display: block;
}

.menu.dropit li {
	padding: 0 10px;
}

.menu.dropit li.dropit-open {
	padding: 0 10px 10px 10px;
}

.menu.dropit li.dropit-open a {
	background: url(arrow-up.png) right center no-repeat;
}

.menu.dropit ul.dropit-submenu {
	max-height: 240px;
	overflow: scroll;
}

.menu.dropit ul.dropit-submenu a {
	line-height: 30px;
	width: auto; height: auto;
	background: none;
	border-bottom: none;
	padding: 0 10px;
}

.menu.dropit ul.dropit-submenu li {
	padding: 0;
}

.menu.dropit.dark a {
	color: #d1d1d1;
	border-bottom: 1px solid #d1d1d1;
}

.menu.dropit.dark li.dropit-open {
	background: #474f57;
}

.menu.dropit.dark ul.dropit-submenu {
    background: #474f57;
}

.menu.dropit.dark ul.dropit-submenu a:hover {
	background: #7a888f;
}

.menu.dropit.light a {
	color: #8e7d60;
	border-bottom: 1px solid #acacac;
}

.menu.dropit.light li.dropit-open {
	background: #e5e5e5;
}

.menu.dropit.light ul.dropit-submenu {
    background: #e5e5e5;
}

.menu.dropit.light ul.dropit-submenu a:hover {
	background: #e5e1db;
}


@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { 
	
	.menu.dropit a {
		background: none;
		background-image: url(arrow-down-retina.png);
		background-position: right center;
		background-repeat: no-repeat;
		background-size: 12px 6px;	
	}
	
	.menu.dropit li.dropit-open a {
		background: none;
		background-image: url(arrow-up-retina.png);
		background-position: right center;
		background-repeat: no-repeat;
		background-size: 12px 6px;
	}
	
	.menu.dropit ul.dropit-submenu a {
		background: none;
	}
	
}