@import 'opensans';
@import 'utils';

/* generalities */

html, body {
	margin: 0;
	font-family: "Open Sans", sans-serif;
	font-size: 12px;
	background: #f2f2f2;
	color: #3c3c33;
}

html {
	min-height: 100%;
	position: relative;
}

body {
	height: 100%;
}

a {
	color: #0066cc;
	text-decoration: none;
	border-width: 0;
	border-bottom: 1px dotted #ff9900;
	@include vendor-prefix('transition', 'color 200ms ease-out');
	&:hover {
		color: #003388;
		border-style: solid;
	}
	img {
		border: 0;
	}
	&.disabled {
		color: #aaa;
		border: none;
		cursor: default;
	}
}

dl dt {
	margin : 0;
	padding : 0 0 0 0;
}

dl dd {
	margin : 0.3em 0 1.5em 10px;
}

span.error-message {
	color: #e00;
	font-weight: bold;
}

span.warning {
	background-color: orange;
}

.clear {
	clear: both;
}


/* from top to bottom */

/* top bar */

div#top {
	color: #eee;
	height: 0px;
}

div#top a {
	color: #aaa;
	font-weight: normal;
	border: 0;
	&:hover {
		color: #888;
	}
}

ul.user-info {
	margin: 0;
	padding: 0;
	padding-right: 3em;
	font-size: 85%;
	font-weight: bold;
	position: absolute;
	top: 0px;
	right: 0px;
	z-index: 10;
	background: #23282d url(texture.png);
	height: 40px;
	line-height: 40px;
	li {
		display: inline;
		padding-left: 3em;
	}
}

/* header */

$header-height: 40px;

div#header {
	background: #C2D1CC url(header-03.jpeg);
	background-size: 100% 500px;
	padding-left: 0px;
	border-bottom: 1px solid #888;
	position: relative;
	height: $header-height;
}

div#header h1 {
	height: $header-height;
	line-height: $header-height;
	padding: 0 ($header-height + 1px) 0 20px;
	margin: 0;
	font-weight: normal;
	color: black;
	text-shadow: 0 0 2px white;
	display: inline-block;
	z-index: 100;
	max-width: 80%;
	width: 80%;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	@include vendor-prefix('transition', 'all ease 200ms');
	opacity: 0.5;

	a {
		color: inherit;
		border-bottom: none;
		display: inline-block;
		padding: 0 11px;
		position: relative;
		margin-left: -5px;
		padding-left: 20px;
		&:first-child {
			padding-left: 0;
		}
	}

	&:hover {
		opacity: 0.7;
	}

	a:hover {
		opacity: 1;
		text-shadow: 0 0 0px #333;
	}
}

div#header h1.breadcrumbs {
	a:last-child {
		/* hide last breadcrumb item (== current page) */
		display: none;
	}

	span.separator {
		display: none;
	}

	a::after {
		content: "";
		height: 42px;
		width: 42px;
		@include vendor-prefix('transform', 'scale(0.4, 0.707) rotate(45deg)');
		display: inline-block;
		position: absolute;
		top: 0px;
		right: -21px;
		box-shadow: 1px -1px 0px 1px #bbb, 2px -2px 0px 2px white;
		z-index: 100;
		border-width: 1px 1px 0 0;
	}
}

body[data-environment-label] span#applabel {
	background-image: repeating-linear-gradient(-45deg, #333, black 14px, #ffe761 15px, #ffe761 29px, black 30px);
	color: white;
	text-shadow: 0 0 1px black;
}

/* notifications */

ul.messages {
	padding: 0;
	margin: 0;
	list-style-type: none;
	max-width: 100ex;
	position: relative;

	li {
		font-size: 110%;
		background: #fafafa;
		margin: 1ex 0;
		padding: 1ex;
		border: 1px solid transparent;
		border-left-width: 25px;
		&:before {
			position: absolute;
			left: 0;
			width: 25px;
			display: inline-block;
			text-align: center;
			font-family: FontAwesome;
			color: white;
		}
		&.success {
			&:before { content: "\f058"; } /* check-circle */
			border-color: #0b0b0b;
		}
		&.info {
			&:before { content: "\f05a"; } /* info-circle */
			border-color: #00b000;
		}
		&.warning {
			&:before { content: "\f06a"; } /* exclamation-circle */
			border-color: #ffb000;
		}
		&.error {
			&:before { content: "\f071"; } /* exclamation-triangle */
			border-color: #b00000;
		}
		.close {
			float: right;
			cursor: pointer;
			font-weight: bold;
			border: none;
			color: inherit;
		}
	}
}

/* main content */

div#main-content {
	width: 100%;
	margin-left: 0;
	padding: 1em 6px 0 16px;
	border: 1px solid #ccc;
	border-width: 0 1px 1px 0;
	background: white;
	float: left;
	position: relative;
	overflow-x: auto;
	overflow-y: hidden;
	box-sizing: border-box;
}

div#main-content h2 {
	font-weight: normal;
}

/* breadcrumb */

div#more-user-links {
	font-size: 110%;
}

div#more-user-links a,
div#more-user-links a:after {
	background: #ccc;
	text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
	border: 1px solid #bbb;
	@include vendor-prefix('transition', 'background 0.5s');
}

div#more-user-links a {
	box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
	padding: 4px 12px;
	border-radius: 2px;
	text-decoration: none;
	font-size: 90%;
	color: black;
}

span#breadcrumb {
	display: inline-block;
	margin: 1ex 0;
}

span#breadcrumb a {
	display: inline-block;
	padding-left: 20px;
	position: relative;
	height: 14px;
	margin-left: -4px;
}

span#breadcrumb a:first-child {
	margin-left: 0;
	padding-left: 16px;
}

span#breadcrumb a:after {
	content: "";
	height: 22px;
	width: 22px;
	@include vendor-prefix('transform', 'scale(0.4, 0.707) rotate(45deg)');
	display: inline-block;
	position: absolute;
	top: 0px;
	right: -11px;
	box-shadow: 1px -1px 0px 1px #bbb, 2px -2px 0px 2px white;
	z-index: 100;
	border-width: 1px 1px 0 0;
}

div#more-user-links a:hover,
div#more-user-links a:hover:after {
	text-decoration: underline;
	background: #aaa;
}

/* page content */

div#content {
	margin: 0 1ex 1em 0;
	padding: 0px;
	position: relative;
}

div#main-content > h2,
div#appbar > h2,
div#main-content .top-title h2,
div#content h2 {
	margin-top: 0;
	font-weight: normal;
	color: #656551;
	font-size: 200%;
	letter-spacing: -1px;
	line-height: 25px;
	margin-bottom: 20px;
	padding: 0 0 10px 0px;
	position: relative;
	top: 4px;
	border-bottom: 1px dotted #d8d8d8;
}

div#appbar > a {
	position: relative;
	top: -45px;
	float: right;
	margin-left: 2em;
}

table.main {
	width: 100%;
	border: 1px solid #bcbcbc;
	border-collapse: collapse;
}

table.main th {
	font-weight: normal;
	padding: 1em 1ex;
	border-bottom: 1px solid #bcbcbc;
	background: #f0f0f0;
}

table.main td {
	text-align: center;
	padding: 1em 1ex;
	border-bottom: 1px solid #bcbcbc;
}

table.main tr td.checkbox {
	width: 1em;
}

table.main tr:nth-child(even) td {
	background: #f5f5f5;
}

table.main tr:hover td {
	background: #ccc;
	cursor: pointer;
}

table.main tr.active td {
	background: #bbf;
}

td.price {
	text-align: right;
}

/* zone selection */

ul.apps {
	margin-top: 2em;
	margin-bottom: 2em;
	padding: 0;
}

ul.apps li {
	display: table;
	float: left;
	margin-right: 1em;
	margin-bottom: 1em;
}

ul.apps li a {
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: 50% 50%;
	display: table-cell;
	vertical-align: bottom;
	width: 120px;
	height: 100px;
	padding-top: 10px;
	padding-bottom: 10px;
	font-weight: bold;
	text-align: center;
	border: 1px solid #ccc;
	text-decoration: none;
	@include vendor-prefix('transition', 'all .2s ease-in-out');
	color: #FF7800;
	border-radius: 15px;
}

ul.apps li a:hover {
	border: 1px solid #333;
	color: #FF7800;
	border-radius: 25px;
}

/* footer */

div#footer {
	clear: both;
	margin-left: 2%;
	font-size: 60%;
	width: 96%;
}

/* icons */

[class^="icon-"]:after, [class*=" icon-"]:after,
[class^="icon-"]:before, [class*=" icon-"]:before {
	font-family: FontAwesome;
	font-weight: normal;
	font-style: normal;
	display: inline-block;
	text-decoration: none;
}
a[class^="icon-"], a[class*=" icon-"] {
	display: inline-block;
	text-decoration: none;
	border: none;
	color: #FF7800;
}

.icon-home-space:before           { content: "\f015\00a0\00a0"; }
.icon-remove-sign:before          { content: "\f057"; }
.icon-add-sign:before             { content: "\f067"; }
.icon-minus-sign:before             { content: "\f068"; }

/* misc */

div#content div.bo-block {
	margin-left: 0;
}

div.bo-block {
	border: 1px solid #e4e4e4;
	background: #fcfcfc;
	color: #505050;
	margin: 1em 0;
	padding: 1ex;
}

div.bo-block h2 {
	margin: 0;
	border-bottom: 1px solid #bcbcbc;
	color: #474747;
}

div.dimmed-block h2 {
	color: #808080;
}

div.bo-block ul {
	padding-left: 2em;
	padding-bottom: 1ex;
}

div.big-msg-info {
	background: transparent url(../images/info-icon.png) 5px 5px no-repeat;
	width: 30em;
	padding-left: 90px;
	margin: 3em auto;
	min-height: 90px;
	padding-top: 20px;
}

p.paginator {
	margin: 4ex 0;
}

p.paginator *:first-child {
	border-radius: 3px 0 0 3px;
}

p.paginator *:last-child {
	border-radius: 0 3px 3px 0;
}

p.paginator a,
p.paginator span {
	padding: 1.5ex 1.7ex 1ex 1.7ex;
	border: 1px solid #BCBCBC;
	margin: 0 0 0 -1px;
}

p.paginator span.this-page {
	background: #0066CC;
	border-color: #0066CC;
	color: white;
}

p.paginator span.this-page + a {
	border-left-color: #0066CC;
}

p.paginator a:hover {
	background: #eee;
}

ul.objects-list {
	margin: 1em 0;
	padding: 0;
}

ul.objects-list li {
	list-style: none;
	margin: 0 0 -1px 0;
	padding: 0 0.5ex 0 2ex;
	border: 1px solid #aaa;
	clear: both;
	position: relative;
	min-height: 2.5em;
	line-height: 2.5em;
}

ul.objects-list.single-links li {
	padding: 0;
}

ul.objects-list li:hover {
	background: #eee;
}

ul.objects-list.single-links li a {
	display: block;
	border: none;
	padding: 0 0.5ex 0 2ex;
}

ul.objects-list li span.badge {
	position: absolute;
	right: 1ex;
	top: 0.25em;
	height: 2em;
	box-sizing: border-box;
	border-radius: 1ex;
	padding: 0 1ex;
	background: #ad7c6d;
	color: white;
	line-height: 2em;
}

/* widgets & dialogs */

input[type="submit"][name="submit"] {
	background: #283c54;
	background-image: linear-gradient(to bottom, #1cabe7, #1999cd);
	color: white;
	border-color: #267dae;
}

input[type=submit]:hover {
	border-color: #666;
}

#sidepage {
	position: absolute;
	top: 0px;
	z-index: 100;
	width: 36px;
	height: 2em;
	text-align: left;
	@include vendor-prefix('transition', 'all 0ms ease-in');
	height: 100%;
	overflow: initial;
	background: #23282d url(texture.png);
}

body[data-has-sidebar] #main {
	margin-left: 36px;
}

body #main.sidepage-expanded {
	margin-left: 30ex;
}

#main.enable-transitions,
#main.enable-transitions div#header h1,
#sidepage.enable-transitions ul#sidepage-menu,
#sidepage.enable-transitions span#applabel,
#sidepage.enable-transitions {
	@include vendor-prefix('transition-duration', '400ms');
}

#sidepage.sidepage-expanded {
	height: 100%;
	overflow: initial;
	width: 30ex;
}

#sidepage ul#sidepage-menu {
	transform: scale(1);
}

#main {
	@include vendor-prefix('transition', 'margin-left 0ms ease-in');
	position: relative;
}

#sidepage span#applabel {
	visibility: hidden; /* will be turned visible by publik.js */

	padding-left: 0.5rem;
	font-weight: bold;
	cursor: pointer;
	display: block;
	position: relative;
	overflow: hidden;
	@include vendor-prefix('transition', 'max-width 0ms ease-in');
	height: 40px;
	line-height: 40px;
	font-weight: normal;
	font-size: 20px;
	border-bottom: 1px solid #666;

	&:hover {
		color: #fff;
	}
}

#sidepage span#applabel::before {
	font-family: FontAwesome;
	content: "\f18e"; /* fa-arrow-circle-o-right */
	padding-left: 2px;
	padding-right: 12px;
}

#sidepage.sidepage-expanded span#applabel::before {
	content: "\f190"; /* fa-arrow-circle-o-left */
}

#sidepage.sidepage-expanded span#applabel {
	overflow: hidden;
	max-width: 100%;
}

#sidepage ul#sidepage-menu {
	list-style: none;
	padding: 0;
	padding-top: 1em;
	margin: 0;
	background: #23282d url(texture.png);
	min-height: 100%;
	min-height: calc(100% - 41px); /* #top 40px + border 1px */
	box-sizing: border-box;
	@include vendor-prefix('transition', 'all 0ms ease');
}

#sidepage ul#sidepage-menu a {
	border: none;
	display: block;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

#sidepage ul#sidepage-menu li {
	position: relative;
	line-height: 24px;
}

ul#sidepage-menu li a {
	background: transparent no-repeat 7px 50%;
	padding: 5px 0 5px 37px;
}

#sidepage ul#sidepage-menu .active a {
	color: #eee;
}

#sidepage ul#sidepage-menu li.active,
#sidepage ul#sidepage-menu li.active:hover {
	background: #215D9C;
}

#sidepage ul#sidepage-menu li:after {
	background: rgba(0, 0, 0, 0.3);
	content: "";
	position: absolute;
	z-index: -1;
	@include vendor-prefix('transition', 'all 0.2s ease');
	box-sizing: border-box;
	width: 0;
	width: 0%; height: 100%; top: 0; left: 0;
}

#sidepage ul#sidepage-menu li:hover:after {
	width: 100%;
	height: 100%;
}

#sidepage ul#sidepage-menu li.active:after {
	content: "";
	position: absolute;
	display: block;
	top: 0;
	background: white;
	z-index: 5;
	right: -17px;
	left: auto;
	width: 34px;
	height: 34px;
	@include vendor-prefix('transform', 'scale(0.2, 0.2) rotate(45deg)');
}

#gadjo-ajax-error {
	position: fixed;
	right: 1em;
	bottom: 1em;
	max-width: 30em;
	background: rgb(255, 34, 34) none repeat scroll 0% 0%;
	padding: 1ex;
	font-weight: bold;
	color: white;
	border: 1px solid red;
	box-shadow: 0px 0px 4px red;
	border-radius: 2px;
}

div.old-ie-warning {
	background: #ffd800;
	padding: 1em;
}

div.old-ie-warning p {
	margin: 0;
	line-height: 150%;
}

ul#sidepage-menu li a.icon-add { background-image: url(icons/add.small.png); }
ul#sidepage-menu li a.icon-book { background-image: url(icons/book.small.png); }
ul#sidepage-menu li a.icon-calendar { background-image: url(icons/calendar.small.png); }
ul#sidepage-menu li a.icon-categories { background-image: url(icons/categories.small.png); }
ul#sidepage-menu li a.icon-clock { background-image: url(icons/clock.small.png); }
ul#sidepage-menu li a.icon-connector { background-image: url(icons/connector.small.png); }
ul#sidepage-menu li a.icon-counter { background-image: url(icons/counter.small.png); }
ul#sidepage-menu li a.icon-facturier { background-image: url(icons/facturier.small.png); }
ul#sidepage-menu li a.icon-forms { background-image: url(icons/forms.small.png); }
ul#sidepage-menu li a.icon-gis { background-image: url(icons/gis.small.png); }
ul#sidepage-menu li a.icon-grid { background-image: url(icons/grid.small.png); }
ul#sidepage-menu li a.icon-home { background-image: url(icons/home.small.png); }
ul#sidepage-menu li a.icon-mail { background-image: url(icons/mail.small.png); }
ul#sidepage-menu li a.icon-management { background-image: url(icons/management.small.png); }
ul#sidepage-menu li a.icon-organizational-units { background-image: url(icons/organizational-units.small.png); }
ul#sidepage-menu li a.icon-password { background-image: url(icons/password.small.png); }
ul#sidepage-menu li a.icon-phone { background-image: url(icons/phone.small.png); }
ul#sidepage-menu li a.icon-portal { background-image: url(icons/portal.small.png); }
ul#sidepage-menu li a.icon-porte-doc { background-image: url(icons/porte-doc.small.png); }
ul#sidepage-menu li a.icon-roles { background-image: url(icons/roles.small.png); }
ul#sidepage-menu li a.icon-security { background-image: url(icons/security.small.png); }
ul#sidepage-menu li a.icon-services { background-image: url(icons/services.small.png); }
ul#sidepage-menu li a.icon-settings { background-image: url(icons/settings.small.png); }
ul#sidepage-menu li a.icon-statistics { background-image: url(icons/statistics.small.png); }
ul#sidepage-menu li a.icon-submission { background-image: url(icons/submission.small.png); }
ul#sidepage-menu li a.icon-system { background-image: url(icons/system.small.png); }
ul#sidepage-menu li a.icon-texts { background-image: url(icons/texts.small.png); }
ul#sidepage-menu li a.icon-theme { background-image: url(icons/theme.small.png); }
ul#sidepage-menu li a.icon-users { background-image: url(icons/users.small.png); }
ul#sidepage-menu li a.icon-workflows { background-image: url(icons/workflows.small.png); }
ul#sidepage-menu li a.icon-announces { background-image: url(icons/announces.small.png); }
ul.apps li.icon-add a { background-image: url(icons/add.large.png); }
ul.apps li.icon-add a:hover { background-image: url(icons/add.large-hover.png); }
ul.apps li.icon-book a { background-image: url(icons/book.large.png); }
ul.apps li.icon-book a:hover { background-image: url(icons/book.large-hover.png); }
ul.apps li.icon-calendar a { background-image: url(icons/calendar.large.png); }
ul.apps li.icon-calendar a:hover { background-image: url(icons/calendar.large-hover.png); }
ul.apps li.icon-categories a { background-image: url(icons/categories.large.png); }
ul.apps li.icon-categories a:hover { background-image: url(icons/categories.large-hover.png); }
ul.apps li.icon-clock a { background-image: url(icons/clock.large.png); }
ul.apps li.icon-clock a:hover { background-image: url(icons/clock.large-hover.png); }
ul.apps li.icon-connector a { background-image: url(icons/connector.large.png); }
ul.apps li.icon-connector a:hover { background-image: url(icons/connector.large-hover.png); }
ul.apps li.icon-counter a { background-image: url(icons/counter.large.png); }
ul.apps li.icon-counter a:hover { background-image: url(icons/counter.large-hover.png); }
ul.apps li.icon-facturier a { background-image: url(icons/facturier.large.png); }
ul.apps li.icon-facturier a:hover { background-image: url(icons/facturier.large-hover.png); }
ul.apps li.icon-forms a { background-image: url(icons/forms.large.png); }
ul.apps li.icon-forms a:hover { background-image: url(icons/forms.large-hover.png); }
ul.apps li.icon-gis a { background-image: url(icons/gis.large.png); }
ul.apps li.icon-gis a:hover { background-image: url(icons/gis.large-hover.png); }
ul.apps li.icon-grid a { background-image: url(icons/grid.large.png); }
ul.apps li.icon-grid a:hover { background-image: url(icons/grid.large-hover.png); }
ul.apps li.icon-home a { background-image: url(icons/home.large.png); }
ul.apps li.icon-home a:hover { background-image: url(icons/home.large-hover.png); }
ul.apps li.icon-mail a { background-image: url(icons/mail.large.png); }
ul.apps li.icon-mail a:hover { background-image: url(icons/mail.large-hover.png); }
ul.apps li.icon-management a { background-image: url(icons/management.large.png); }
ul.apps li.icon-management a:hover { background-image: url(icons/management.large-hover.png); }
ul.apps li.icon-organizational-units a { background-image: url(icons/organizational-units.large.png); }
ul.apps li.icon-organizational-units a:hover { background-image: url(icons/organizational-units.large-hover.png); }
ul.apps li.icon-password a { background-image: url(icons/password.large.png); }
ul.apps li.icon-password a:hover { background-image: url(icons/password.large-hover.png); }
ul.apps li.icon-phone a { background-image: url(icons/phone.large.png); }
ul.apps li.icon-phone a:hover { background-image: url(icons/phone.large-hover.png); }
ul.apps li.icon-portal a { background-image: url(icons/portal.large.png); }
ul.apps li.icon-portal a:hover { background-image: url(icons/portal.large-hover.png); }
ul.apps li.icon-porte-doc a { background-image: url(icons/porte-doc.large.png); }
ul.apps li.icon-porte-doc a:hover { background-image: url(icons/porte-doc.large-hover.png); }
ul.apps li.icon-roles a { background-image: url(icons/roles.large.png); }
ul.apps li.icon-roles a:hover { background-image: url(icons/roles.large-hover.png); }
ul.apps li.icon-security a { background-image: url(icons/security.large.png); }
ul.apps li.icon-security a:hover { background-image: url(icons/security.large-hover.png); }
ul.apps li.icon-services a { background-image: url(icons/services.large.png); }
ul.apps li.icon-services a:hover { background-image: url(icons/services.large-hover.png); }
ul.apps li.icon-settings a { background-image: url(icons/settings.large.png); }
ul.apps li.icon-settings a:hover { background-image: url(icons/settings.large-hover.png); }
ul.apps li.icon-statistics a { background-image: url(icons/statistics.large.png); }
ul.apps li.icon-statistics a:hover { background-image: url(icons/statistics.large-hover.png); }
ul.apps li.icon-submission a { background-image: url(icons/submission.large.png); }
ul.apps li.icon-submission a:hover { background-image: url(icons/submission.large-hover.png); }
ul.apps li.icon-system a { background-image: url(icons/system.large.png); }
ul.apps li.icon-system a:hover { background-image: url(icons/system.large-hover.png); }
ul.apps li.icon-texts a { background-image: url(icons/texts.large.png); }
ul.apps li.icon-texts a:hover { background-image: url(icons/texts.large-hover.png); }
ul.apps li.icon-theme a { background-image: url(icons/theme.large.png); }
ul.apps li.icon-theme a:hover { background-image: url(icons/theme.large-hover.png); }
ul.apps li.icon-services a { background-image: url(icons/services.large.png); }
ul.apps li.icon-users a { background-image: url(icons/users.large.png); }
ul.apps li.icon-users a:hover { background-image: url(icons/users.large-hover.png); }
ul.apps li.icon-workflows a { background-image: url(icons/workflows.large.png); }
ul.apps li.icon-workflows a:hover { background-image: url(icons/workflows.large-hover.png); }
ul.apps li.icon-announces a { background-image: url(icons/announces.large.png); }
ul.apps li.icon-announces a:hover { background-image: url(icons/announces.large-hover.png); }

@media print {
	div#top,
	span#breadcrumb,
	div#header,
	#sidepage-menu {
		display: none;
	}
	body #main.sidepage-expanded { margin: 0; }

	div#header h1 {
		text-shadow: none;
	}
}

#appbar {
	.extra-actions-menu-opener {
		border: none;
		&::before {
			cursor: pointer;
			content: "\f142"; /* ellipsis-v */
			font-family: FontAwesome;
			font-size: 140%;
			padding: 2px 1ex;
			margin-right: -0.5ex;
			border: 1px solid transparent;
			border-bottom: 0;
			position: relative;
			z-index: 200;
			top: 2px;
		}
		&.open::before {
			background: #fafafa;
			border-color: #d0d0d0;
		}
	}
	.extra-actions-menu {
		background: white;
		padding: 0px;
		list-style: none;
		position: absolute;
		right: -7px;
		margin-top: -24px;
		border: 1px solid #d0d0d0;
		background: #fafafa;
		box-shadow: 0px 1px 1px 2px rgba(0, 0, 0, 0.04);
		z-index: 100;
		display: none;
		min-width: 12em;
		&.open {
			display: block;
		}
		li {
			margin: 0;
			a {
				float: none;
				display: block;
				margin: 0;
				padding: 5px 10px;
				border: none;
				&:hover {
					background: #ccc;
				}
			}
		}
	}
}

@import 'grid';
@import 'jqueryui';
@import 'forms';
