/*
 This is a system css file to define default css rules so that new sites are at least legible.
 The css placed here should be easily over written even with simple css rules for site css.
 Note that the class names could be updated and change often.
 
/* Site Errors */
#buildrr {
	display: none; /* hide links to buildrr.com */
}
.error-message, .error {
	color: #C00;
}
/* Fixes google maps bad formatting of the zoom elements, good anywhere a google map is used */
.gm-style img { max-width: none; }
.gm-style label { width: auto; display: inline; }

pre.prettyprint {
	white-space: pre-wrap;
	white-space: -moz-pre-wrap;
	white-space: -pre-wrap;
	white-space: -o-pre-wrap;
	word-wrap: break-word;
}
img:-moz-broken {
	-moz-force-broken-image-icon: 1;
	width: 24px;
	height: 24px;
}
.toggleClick.toggle:after {
	content: '\25B8 \ ';
	color: #AAAAAA;
	display: inline-block;
	font-size: 0.6em;
	margin: 0 0 0 5px;
	position: relative;
	vertical-align: middle;
}
.toggleClick.toggled:after {
	content: '\25BE \ ';
	color: #AAAAAA;
	display: inline-block;
	font-size: 0.6em;
	margin: 0 0 0 5px;
	position: relative;
	vertical-align: middle;
}
.toggleClick, .toggleHover {
	cursor: pointer;
}

.hide {
	display: none;
}
.show {
	display: block;
}
td.show {
	display: table-cell;
}
.edit input, .edit textarea, .edit select {
	min-width: 0;
}

/* Threaded Blog Comment Layout */
.comment {
	clear: both;
}
.comment .avatar, .comment .full_name, .comment .meta {
	float: left;
}
.comment .avatar img {
	width: 3em;
	height: 3em;
}
.comment .body {
	clear: both;
}
.comments .tree-block li {
	list-style-type: none;
}

/* Very light form styling */
.select .checkbox {
	display: block;
}
input[type=radio], input[type=checkbox] {
	width: auto;
	min-width: 0;
}

/* Specific for invoices /invoices/invoices/add */
.lineTotal {
	text-align: right;
}
.invoiceTotal {
	text-align: right;
}
.invoiceTotal ul, .invoiceTotal li {
	list-style-type: none;
	margin: 0;
	padding: 0;
}
.invoiceTotal input, .invoiceTotal label {
	float: none;
	clear: none;
	display: inline;
	min-width: 5em;
	text-align: right;
	background: #FFF;
}
.invoiceTotal label {
	margin: 0 0.5em 0 0;
	border: none;
}
.invoiceTotal input {
	font-size: 1em;
	margin: 0 0 0.5em 0;
}
.invoiceProjects {
	display: block;
	float: left;
}
.generate .projects {
	clear: both;
}

/* Very light default form formatting to make new sites easier */
label {
	display: block;
	padding: 0.2em 0 0 0;
}
input[type=radio], input[type=checkbox] {
	float: left;
	clear: left;
}

.catalogItemOptions {
	float: left;
	width: 200px;
	clear: none;
}

.richtextarea {
	clear: both;
}

.contextSorter form select option.des:after {
	content: '\25B2 \ ';
}
.contextSorter form select option.asc:after {
	content: '\25BC \ ';
}

.ajaxLoader {
	position: fixed;
	top: 50%;
	left: 50%;
	z-index: 9999999999;
	padding: 3em;
	background-color: rgba(255,255,255,0.8);
	border: 1px solid #999;
	border-radius: 1em;
	margin-top: -5em;
	margin-left: -6em;
	display: none;
}

.preview {
	border: 1px dashed #999;
	padding: 1em;
	margin: 0 0 1em 0;
}
.preview:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

/* user edit profile picture  */
#userEditThumb {
	display: inline-block;
	position: relative;
}
#userEditThumbLink {
	position: absolute;
	bottom: 0;
	right: 0;
	background: #000;
	margin: 0;
	padding: 1px 4px;
	opacity: 0.6;
	color: #EEE;
	font-size: 10px;
}

/* code mirror */
.CodeMirror-lines div {
	display: block !important;
}

/* media browser */
#mediaBrowser .media-container img {
	max-height: 80px;
	border: 1px solid #ccc;
	padding: 1px;
}
#mediaBrowser .media-item {
	float: left;
	width: 22%;
	height: 128px;
	margin: 0 8px 8px 0;
	border: 1px solid #eaeaea;
	padding: 8px;
	overflow: hidden !important;
	font-size: 10px;
	white-space: nowrap;
	border-radius: 3px;
}
#mediaBrowser .media-item.checked {
	border: 2px solid #3276b1;
}
#mediaBrowser .media-container {
	max-height: 380px;
	overflow-y: scroll;
}
#mediaBrowser .media-item .title {
	text-overflow: ellipsis;
	width: 100%;
	white-space: nowrap;
	overflow: hidden;
}
#mediaBrowser .media-item .actions {
	font-size: 1.6em;
	text-align: left;
}
#mediaBrowser .media-item .actions input[name=mediaSelected] {
	visibility: hidden;
}
.media-selected.thumbnail.pull-left {
	margin: 4px 4px 0 0;
}
.media-selected .content {
	text-align: center;
}
.media-selected img {
	height: 48px;
}
.media-selected .content p {
	font-size: 10px;
	color: #777;
	width: 75px;
	margin: 0 auto;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
#mediaBrowserModal .modal-footer {
	border: 0;
	margin: 0;
	padding: 8px;
}

@media (min-width: 768px) {
	#mediaBrowserModal .modal-dialog {
		width: 75%;
	}
}
