@charset "UTF-8";

/* Name: Quartz UI
 * Version: 2
 * Author: Joshua Smith
 */

html, body { position: relative; width: 100%; height: 100%; }

.ui-sample { border: 1px solid #d6d6d6; border-radius: 5px; }
.ui-action-unstyled { border-color: transparent !important; background: transparent !important; box-shadow: none !important; }

.ui-app, .ui-header, .ui-container, .ui-footer, .ui-nav, .ui-aside, .ui-content, .ui-page, .ui-app-preview { position: absolute; width: 100%; height: 100%; top: 0; left: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.ui-app { overflow: hidden; position: relative; width: auto; }
.ui-app-preview { width: 50%; left: auto; float: right; position: relative; }
.ui-app .ui-header { z-index: 3; height: 3.5em; }
.ui-app .ui-footer { z-index: 3; width: 100%; position: absolute; top: auto; bottom: 0; background: #eee; border-top: 1px solid #ddd; height: 3em; }
.ui-app .ui-container { overflow: hidden; }
.ui-app .ui-header ~ .ui-container { padding-top: 3.5em; }
.ui-app .ui-footer ~ .ui-container { padding-bottom: 3em; }
.ui-app .ui-container .ui-body { width: 100%; height: 100%; position: relative; }
.ui-app .ui-container .ui-body .ui-nav { z-index: 2; overflow: auto; width: 20%; }
.ui-app .ui-container .ui-body .ui-aside { z-index: 2; overflow: auto; left: auto; right: 0; width: 25%; }
.ui-app .ui-container .ui-body .ui-content { z-index: 1; overflow: hidden; top: 0; left: 0; }	
.ui-app .ui-container .ui-body .ui-nav ~ .ui-content { padding-left: 20%; }
.ui-app .ui-container .ui-body .ui-aside ~ .ui-content { padding-right: 25%; }
.ui-app .ui-container .ui-body .ui-nav ~ .ui-aside ~ .ui-content { }
.ui-app .ui-container .ui-body .ui-content .ui-page { overflow: auto; position: relative; height: 100%; }

.ui-header { border-bottom: 1px solid #ddd; background: #eee; }
.ui-header h5 { float: left; padding: .95em; margin: 0; font-size: 1em; color: #bbb; }
.ui-header h5 a { color: #aaa; padding: .95em; margin: -.95em; display: block; }
.ui-header .ui-header-buttons { margin: 0 .5em; float: left; }
.ui-header .ui-header-mobile-buttons { display: none; }
.ui-header .ui-header-mobile-buttons a { position: absolute; top: 0; margin: 0 .25em; }
.ui-header .ui-header-mobile-buttons a[ui-action="toggle-header"] { right: 0; }
.ui-header .ui-header-mobile-buttons a[ui-action="toggle-nav"] { left: 0; }
.ui-header .ui-header-links {  }
.ui-header .ui-header-links ul { margin: 0; float: right; }
.ui-header .ui-header-links ul:first-child { float: left; }
.ui-header .ui-header-links ul li { margin: 0; list-style-type: none; float: left; }
.ui-header .ui-header-mobile-buttons a,
.ui-header .ui-header-links ul li a,
.ui-header .ui-header-links ul li span { display: block; color: #555; padding: 1em; }
.ui-header .ui-header-links ul li .ui-selected { background: #ddd; color: #222; background: rgba(0,0,0,.07); }
.ui-header form { width: 11em; margin: 0; float: left; }
.ui-header button, .ui-header input[type="text"], .ui-header input[type="search"], .ui-header input[type="password"], .ui-header input[type="color"], .ui-header input[type="date"], .ui-header input[type="datetime"], .ui-header input[type="datetime-local"], .ui-header input[type="email"], .ui-header input[type="month"], .ui-header input[type="number"], .ui-header input[type="tel"], .ui-header input[type="time"], .ui-header input[type="url"], .ui-header input[type="week"], .ui-header input[type="reset"], .ui-header input[type="submit"], .ui-header .ui-action, .ui-header .ui-file, .ui-header textarea { margin: .333333em 0; }
.ui-header form input[type="search"] { background-position: 10px .5em; padding-left: 32px; }

.ui-app-preview { background: white; border-left: 1px solid #ccc; }

.ui-nav { background: #eef7fe; border-right: 1px solid #ddd; }
.ui-nav > *:first-child { margin-top: 10px; }
.ui-nav h6 { color: #a4c0d8; text-transform: uppercase; font-size: .8em; padding: 1em 15px .75em; margin: 0; }
.ui-nav ul { margin: 0 0 1em; padding: 0; }
.ui-nav ul li { margin: 0; list-style-type: none; }
.ui-nav ul li a { display: block; padding: .35em 15px; white-space: nowrap; }
.ui-nav ul li a.ui-selected { color: white; background: #09f; }

.ui-aside { background: #eef7fe; border-left: 1px solid #cdd2d9; border-color: rgba(0,0,0,.15); }
.ui-aside:after { content: ''; display: block; width: 4px; height: 100%; background: transparent; position: absolute; top: 0; left: 0; }

.ui-table { border-width: 0; border-collapse: collapse; border-spacing: 0; margin: 0; }
.ui-table thead {  }
.ui-table thead tr {  }
.ui-table thead tr th { font-weight: normal; color: #aaa; border-color: #ccc; background: #eee; }
.ui-table thead tr th:after { content: ''; display: block; height: 4px; width: 100%; background: transparent; position: absolute; bottom: -5px; left: 0; }
.ui-table tr {  }
.ui-table tr td { border-top-color: #e0ebf8; border-width: 0; }
.ui-table tr:nth-child(even) td { background-color: #eef7fe; }
.ui-table .ui-table-checkbox { width: 18px; }
.ui-table .ui-table-checkbox + td, .ui-table .ui-table-checkbox + th { padding-left: 0; }
.ui-table .ui-table-checkbox input { margin-right: 0; }
.ui-table  tr.ui-selected td { color: white; border-color: #09d; background: #09f; }

.ui-tabs { position: relative; border-bottom: 1px solid #eee; position: relative; }
.ui-tabs:after { content: ' '; display: table; clear: both; }
.ui-tabs ul { margin: 0; padding: .75em 1.25em 0; }
.ui-tabs ul li { margin: 0; float: left; list-style-type: none; }
.ui-tabs ul li a { display: inline-block; padding: .5em 0 .65em; border-bottom: 1px solid transparent; margin: 0 .75em -1px .75em; }
.ui-tabs ul li a.ui-selected { background: white; color: #222; border-bottom-color: rgba(0,0,0,.5); }

.ui-pills { padding: .55em 2.25em; position: relative; border-bottom: 1px solid #d6d6d6; color: #aaa; background: #eee; }
.ui-pills:after { content: ' '; display: table; clear: both; }
.ui-pills ul { margin: 0; }
.ui-pills ul li { margin: 0; float: left; list-style-type: none; }
.ui-pills ul li a { display: block; padding: .25em .75em; margin: .2em 0; position: relative; border-radius: 1.1em; }
.ui-pills ul li a.ui-selected { color: white; background: #09f; }

.ui-breadcrumbs { padding: .35em 2em; border-bottom: 1px solid #d6d6d6; color: #aaa; background: #eee; }
.ui-breadcrumbs:after { content: ' '; display: table; clear: both; }
.ui-breadcrumbs ul { margin: 0; }
.ui-breadcrumbs ul li { margin: 0; list-style-type: none; float: left; padding: .4em .5em; }
.ui-breadcrumbs ul li:after { content: '/'; color: #ccc; margin-left: .85em; }
.ui-breadcrumbs ul li:last-of-type:after { content: none; }

.ui-actionrow { display: inline-block; }
.ui-actionrow:after { content: ' '; display: table; clear: both; }
.ui-actionrow ul { display: inline-block; margin: 0; }
.ui-right .ui-actionrow ul { margin: 0 0 0 .5em; }
.ui-actionrow ul li { list-style-type: none; margin: 0; padding: 0; float: left; }
.ui-actionrow ul li .ui-action { border-radius: 0; margin-right: 0; }
.ui-actionrow ul li .ui-action.ui-selected { color: white; background: #09f; }
.ui-actionrow ul li .ui-action:hover,
.ui-actionrow ul li .ui-action.ui-selected,
.ui-actionrow ul li .ui-action-main { z-index: 2; }
.ui-actionrow ul li:first-of-type .ui-action { border-top-left-radius: 4px; border-bottom-left-radius: 4px; }
.ui-actionrow ul li:last-of-type .ui-action { border-top-right-radius: 4px; border-bottom-right-radius: 4px; }

.ui-menu { z-index: 5; position: absolute; display: none; background: white; border: 1px solid #aaa; border-color: rgba(0,0,0,.15); width: 180px; box-shadow: 0 3px 10px rgba(0,0,0,.1); border-radius: 5px; }
.ui-menu, .ui-menu:before { -moz-background-clip: padding; -webkit-background-clip: padding; background-clip: padding-box; }
.ui-menu:before { content: ''; display: block; position: absolute; height: 10px; width: 10px; top: -6px; left: 15px; background: white; border: 1px solid rgba(0,0,0,.25); border-width: 1px 0 0 1px; border-radius: 3px 0 0 0; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }
.ui-menu ul { margin: 0; padding: .5em 0 !important; float: none !important; border-top: 1px solid #ddd; display: block; }
.ui-menu ul:first-child { border-top-width: 0; }
.ui-menu ul li { margin: 0; padding: 0; list-style-type: none; float: none !important; }
.ui-menu ul li:after { display: none; }
.ui-menu ul li a { color: #333 !important; border-width: 0; display: block; padding: .3em 12px !important; margin: 0; border-radius: 0; box-shadow: none; }
.ui-menu ul li a:hover { text-decoration: none; color: white !important; border-color: #09d; border-top-color: #07d; background: #09f; }
*:hover > .ui-menu { display: block; }

*[class*="ui-icon"] { font-style: normal; }
.ui-icon-arrow:after { content: '▾'; }
.ui-icon-close:after { content: '✕'; }
.ui-icon-right:after { content: '▸'; }
.ui-icon-menu:after { content: '☰'; }

.ui-message, .ui-messagebar { color: #777; padding: .5em 1em .6em; margin-bottom: 20px; border: 1px solid #ccc; border-radius: 3px; background: #eee; }
.ui-messagebar { padding: .75em 2em 1em; margin: 0; border-width: 0 0 1px 0; border-radius: 0; }
.ui-message h1, .ui-message h2, .ui-message h3, .ui-message h4, .ui-message h5, .ui-message h6, .ui-message p, .ui-message ol, .ui-message ul, .ui-messagebar h1, .ui-messagebar h2, .ui-messagebar h3, .ui-messagebar h4, .ui-messagebar h5, .ui-messagebar h6, .ui-messagebar p, .ui-messagebar ol, .ui-messagebar ul { margin: 5px; }
.ui-message a, .ui-messagebar a { text-decoration: underline; }
.ui-message-success, .ui-messagebar-success { border-color: #cdc; color: #595; background-color: #dfc; }
.ui-message-info, .ui-messagebar-info { border-color: #bdd; color: #49b; background-color: #def; }
.ui-message-warning, .ui-messagebar-warning { border-color: #dc8; color: #a86; background-color: #fea; }
.ui-message-error, .ui-messagebar-error { border-color: #dcc; color: #c55; background-color: #fdd; }
.ui-message-actions, .ui-messagebar-actions { float: right; }

.ui-progress { margin: 10px 0; background: #eee; padding: 0; }
.ui-progress strong { display: block; height: 2px; width: 100%; background: #09f; }
.ui-progress strong em { display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url(../img/progress.gif); opacity: .1; }

.ui-spinner { margin: 10px 0; text-align: center; }
.ui-spinner strong { display: block; left: 50%; margin-left: -10px; height: 20px; width: 20px; border-radius: 50%; background: #09f; }
.ui-spinner strong:after { content: ''; position: absolute; background: white; width: 16px; height: 16px; top: 2px; left: 2px; border-radius: 50%; }
.ui-spinner strong em { display: block; position: absolute; left: 0; top: 0; border-radius: 50%; width: 100%; height: 100%; background: transparent url(../img/spinner.gif) no-repeat 50% 50%; opacity: .2; }

.ui-window { background: white; border: 1px solid #ccc; border-color: rgba(0,0,0,.15);  -moz-background-clip: padding; -webkit-background-clip: padding; background-clip: padding-box; border-radius: 5px; }
.ui-window form { margin: 0; }
.ui-window .ui-window-header { padding: 0 2em; z-index: 2; top: 0; left: 0; border-bottom: 1px solid #ddd; height: 3.5em; background: #eee; border-top-left-radius: 4px; border-top-right-radius: 4px; }
.ui-window .ui-window-header h1,
.ui-window .ui-window-header h2,
.ui-window .ui-window-header h3,
.ui-window .ui-window-header h4,
.ui-window .ui-window-header h5,
.ui-window .ui-window-header h6 { float: left; padding: .8em 0; margin: 0; font-size: 1.15em; font-weight: 400; }

.ui-window .ui-window-footer { padding: 5px 2em; z-index: 2; bottom: 0; border-top: 1px solid #ddd; height: 3.75em; background: #eee; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; text-align: right; }
.ui-window .ui-window-body { overflow: auto; max-height: 320px; }
.ui-window .ui-window-close { display: block; position: absolute; width: 1.6em; height: 1.6em; z-index: 3; top: -.85em; right: -.85em; border-width: 1px; border-style: solid; border-color: #09d; border-top-color: #07d; border-radius: 50%; background: #09f; }
.ui-window .ui-window-close:hover { text-decoration: none; }
.ui-window .ui-window-close .ui-icon-close { display: block; margin: .07em 0; color: white; text-align: center; }
.ui-window .ui-window-header ~ .ui-window-close { top: .75em; right: 1em; background: transparent; border-color: transparent; box-shadow: none; }
.ui-window .ui-window-header ~ .ui-window-close .ui-icon-close { color: #999; }

.ui-overlay { position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 10; background: transparent; }
.ui-overlay:before { content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.2	);  }
.ui-overlay .ui-window { max-width: 720px; min-width: 480px; width: 60%; margin: 7.5% auto; border-width: 0; }

.ui-tooltip { z-index: 5; top: 100%; margin-top: 10px; margin-left: -1px; position: absolute; display: none; background: white; border: 1px solid rgba(0,0,0,.15); width: 150px; padding: 10px 15px; box-shadow: 0 3px 10px rgba(0,0,0,.1); border-radius: 5px; color: #555; left: 0; line-height: 1.53846154; text-decoration: none; font-style: normal; font-weight: normal; }
.ui-tooltip, .ui-tooltip:before { -moz-background-clip: padding; -webkit-background-clip: padding; background-clip: padding-box; }
.ui-tooltip:before { content: ''; display: block; position: absolute; height: 10px; width: 10px; top: -6px; left: 15px; background: white; border: 1px solid rgba(0,0,0,.25); border-width: 1px 0 0 1px; border-radius: 3px 0 0 0; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }
*:hover > .ui-tooltip { display: inline-block; }

.ui-banner { padding: 1em 2em; }

.ui-login { width: 40%; min-width: 310px; margin: 7.5% auto; }

.ui-form-row { padding-left: 30%; width: 70%; }
.ui-form-row:after { content: ' '; display: table; clear: both; }
.ui-form-row > label { float: left; width: 42.85714%; margin-left: -42.85714%; }
.ui-form-row label + * label { float: left; margin-right: 1em; }

.ui-background { position: fixed; top: -50%; left: -50%; width: 200%; height: 200%; }
.ui-background img { position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto;  min-width: 50%; min-height: 50%; }

@media only screen and (max-width: 800px) {
	.ui-app .ui-container .ui-body .ui-aside { display: none; }
	.ui-app .ui-container .ui-body .ui-aside ~ .ui-content { padding-right: 0; }
}

@media only screen and (max-width: 640px) {
	html, body { min-width: 0; }
	.ui-banner { padding: 1em; }
	.ui-tabs ul, .ui-breadcrumbs ul, .ui-breadcrumbs ul,
	.ui-messagebar { padding-left: 20px; padding-right: 20px; }

	.ui-header { position: fixed; }
	.ui-header h5 { float: none; text-align: center; color: #555; font-size: 1.25em; padding: .6em; margin: 0 2em; }
	.ui-header h5 a { display: inline; padding: 0; }
	.ui-header .ui-header-mobile-buttons { display: block; }
	.ui-header .ui-header-links { display: none; position: fixed; height: 100%; background: #222; float: none; width: 100%; padding: 10px 0; font-size: 1.125em; }
	.ui-header .ui-header-links-visible { display: block;  }
	.ui-header .ui-header-links ul { display: block; padding: 0 0; }
	.ui-header .ui-header-links ul,
	.ui-header .ui-header-links ul li { float: none; }
	.ui-header .ui-header-links ul li a,
	.ui-header .ui-header-links ul li span { border-width: 0; background: transparent; color: white; padding: 0; padding: .6666666em 20px; color: white; }
	.ui-header .ui-header-links ul li a:hover,
	.ui-header .ui-header-links ul li span:hover { box-shadow: none; }
	.ui-header .ui-header-links ul li > form { width: auto; }
	.ui-header .ui-header-links ul li a.ui-selected { background: transparent; color: #fff; box-shadow: none; }
	.ui-header .ui-header-links .ui-actionrow ul li a { border-width: 0; background: transparent; color: white; padding: 0; }
	.ui-header .ui-left, .ui-header .ui-right { float: none; }
	
	.ui-app { height: auto; min-height: 100%; position: static; }
	.ui-app .ui-container { height: auto; position: relative; }
	.ui-app .ui-container .ui-body { height: auto; position: relative; }
	.ui-app .ui-container .ui-body .ui-content { height: auto; position: relative; }
	.ui-app .ui-container .ui-body .ui-content .ui-page { height: auto; }
	.ui-app .ui-container .ui-body .ui-content .ui-page .ui-header { position: absolute; }
	
	.ui-app .ui-container .ui-body .ui-nav { display: none; }
	.ui-app .ui-container .ui-body .ui-nav ~ .ui-content { padding-left: 0; }
	.ui-app .ui-container .ui-body .ui-nav-visible { display: block; position: fixed; top: auto; height: 100%; background: #222; float: none; padding-top: .5em; padding-bottom: .5em; width: 100%;  left: 0; border-right: 0; }
	.ui-app .ui-container .ui-body .ui-nav ul li a { color: white; }
	.ui-app .ui-container .ui-body .ui-nav ul li a.ui-selected { background: none; }
	.ui-app .ui-container .ui-body .ui-nav h6 { color: white; opacity: .5; }

	.ui-app-preview { position: absolute; width: 100%; z-index: 4; }
	.ui-overlay .ui-window { min-width: 0; width: auto; margin: 0; border-width: 0; height: 100%; }
	.ui-overlay .ui-window .ui-window-content { max-height: 240px; }
}