/* ************************* */
* {
	font-family: "Poppins" !important;
	outline: none !important;
}

select option {
    font-family: "Arial" !important;
}

body {
	background: url(dotted-background-white.jpg);
	line-height: 1em; font-size: 13px;
}

html.busy * {
	cursor: wait !important;
}

/* ************************* */
h2 {
    line-height: 1.3em; font-weight: normal; font-size: 1.4em; margin: 4px 0 16px 0; padding: 0;
}

h2 > span {
    display: block; font-size: 0.8em;
}

hr {
    border: none; margin: 0; margin-top: 32px; margin-bottom: 24px;
    border-bottom: 1px solid #fff; border-top: 1px solid #aaa;
}

.no-data {
    color: #333; padding: 12px;
	-webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px;
}

/* ************************* */
.login-dialog {
	position: fixed; width: 450px; left: 50%; margin-left: -225px; top: 40%; margin-top: -200px; background: #fff; overflow: hidden; font-size: 1.1em;
	-moz-box-shadow: 0px 0px 16px #ccc; -webkit-box-shadow: 0px 0px 16px #ccc; -o-box-shadow: 0px 0px 16px #ccc; -ms-box-shadow: 0px 0px 16px #ccc; box-shadow: 0px 0px 16px #ccc;
	-moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px;
}

body.phone .login-dialog {
	width: 100vw; left: 0; margin-left: 0; top: 0; padding-top: 10vh; margin-top: 0px; height: 90vh;
	background: #fff;
}

body.phone .login-dialog.opt-b {
	padding-top: 5vh; height: 95vh;
}

.login-dialog .header {
	text-align: center; margin-top: 25px; margin-bottom: 40px;
}

.login-dialog .header img {
	margin: 0; text-align: center; font-weight: normal;
}

.login-dialog .content {
	padding: 0 32px;
}

.login-dialog .content > p input {
	display: block; width: 100%; height: auto; padding: 8px 8px; font-size: 1em; margin: 0 0 6px 0; border: 1px solid #aaa;
	-moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;
	-moz-box-shadow: inset 0px 2px 2px -3px #888; -webkit-box-shadow: inset 0px 2px 2px -3px #888; -o-box-shadow: inset 0px 2px 2px -3px #888; -ms-box-shadow: inset 0px 2px 2px -3px #888; box-shadow: inset 0px 2px 2px -3px #888;
}

.login-dialog .content > p input:focus {
    -moz-box-shadow: 0px 0px 6px -3px #40b3b0; -webkit-box-shadow: 0px 0px 6px -3px #40b3b0; -o-box-shadow: 0px 0px 6px -3px #40b3b0; -ms-box-shadow: 0px 0px 6px -3px #40b3b0; box-shadow: 0px 0px 6px -3px #40b3b0;
    -moz-border: 1px solid #50c3c0; -webkit-border: 1px solid #50c3c0; -o-border: 1px solid #50c3c0; -ms-border: 1px solid #50c3c0; border: 1px solid #50c3c0;
}

.login-dialog .btn {
   	display: inline-block; font-size: 1em; padding: 8px 32px; margin-right: 4px; min-width: auto; color: #fff; border: none;
	-moz-border-radius: 3px; -o-border-radius: 3px; -webkit-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px;
    background: linear-gradient(#6ac,#47a);
}

.login-dialog .btn:hover {
	background: linear-gradient(#59b,#369);
}

.login-dialog .btn:active {
	background: linear-gradient(#59b,#369);
}

.login-dialog form a {
    display: block; color: #777; font-size: 0.9em; margin-top: 0px; margin-bottom: 8px;
}

.login-dialog form span.right {
    float: right; text-align: right;
}

.login-dialog .footer {
	background: #f7f7f7; padding: 16px 0; margin-top: 16px; color: #777; font-size: 0.8em; letter-spacing: 2px; text-align: center;
}

.login-dialog .footer a {
	color: #444;
}

.login-dialog span.field-error {
	display: block; color: #c00; font-size: 0.9em; margin-top: 4px; margin-bottom: 10px;
}

.login-dialog input.field-error {
    border: 1px solid #faa !important;
}

.login-dialog input.field-error:focus {
	-moz-box-shadow: 0px 0px 6px -3px red !important; -webkit-box-shadow: 0px 0px 6px -3px red !important; -o-box-shadow: 0px 0px 6px -3px red !important; -ms-box-shadow: 0px 0px 6px -3px red !important; box-shadow: 0px 0px 6px -3px red !important;
}

.login-dialog .message.error {
	color: #c00; padding: 12px; margin-bottom: 10px; text-align: center;
	background: #fff0f0;
}

.login-dialog .loading-indicator {
	display: inline-block; vertical-align: middle; width: 16px; height: 16px; margin-left: 5px; background: url(loading-white.gif);
}

.login-dialog .info {
    text-align: center; margin-bottom: 24px;
}

.login-dialog .info img {
	height: 80px;
    -moz-border-radius: 999px; -webkit-border-radius: 999px; -o-border-radius: 999px; -ms-border-radius: 999px; border-radius: 999px;
	vertical-align: middle;
}

.login-dialog .info b {
    display: inline-block; font-weight: normal; margin-top: 0px; margin-bottom: 0px; font-size: 1.3em;
	vertical-align: middle; margin-left: 16px; text-align: left;
}

.login-dialog .info span {
    display: block; margin-top: 4px; font-size: 0.6em; color: #444;
}

/* ************************* */
u.pwd {
    display: inline-block; position: relative;
}

.phone u.pwd {
    display: block;
}

u.pwd > i {
    position: absolute; right: 4px; top: 3px; color: #999; padding: 4px;
}

u.pwd > i:hover {
    cursor: pointer; color: #777;
}

u.pwd > input {
    padding-right: 28px !important;
}

/* ************************* */
.bttn {
	position: relative; display: inline-block; font-size: 1em; padding: 8px 24px; border: none; cursor: pointer; overflow: hidden;
	-moz-border-radius: 3px; -o-border-radius: 3px; -webkit-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px;
    background: #477; color: #fff;
}

.bttn:hover:after {
    position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(255,255,255,0.2); content: "";
}

/* ************************* */
.form {
    display: inline-block; padding: 16px; font-size: 1em; background: #fff;
	-moz-border-radius: 3px; -o-border-radius: 3px; -webkit-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px;
	box-shadow: 0px 0px 8px #aaa;
}

.form p {
    margin: 0; padding: 0; margin-bottom: 8px;
}

.form p label {
    display: inline-block; width: 200px; vertical-align: top; padding-top: 6px;
}

.form p label.required:after {
    content: "*"; color: #faa; font-size: 1.0em; vertical-align: middle; margin-left: 4px;
}

.form p input, .form p textarea, .form p select {
	display: inline-block; min-width: 280px; padding: 5px 8px; font-size: 1em; border: 1px solid #aaa; background: #fff;

	-moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;
	-moz-box-shadow: inset 0px 2px 2px -2px #888; -webkit-box-shadow: inset 0px 2px 2px -2px #888; -o-box-shadow: inset 0px 2px 2px -2px #888; -ms-box-shadow: inset 0px 2px 2px -2px #888; box-shadow: inset 0px 2px 2px -2px #888;
}

.form p input:focus, .form p textarea:focus, .form p select:focus {
    -moz-box-shadow: 0px 0px 6px -3px #40b3b0; -webkit-box-shadow: 0px 0px 6px -3px #40b3b0; -o-box-shadow: 0px 0px 6px -3px #40b3b0; -ms-box-shadow: 0px 0px 6px -3px #40b3b0; box-shadow: 0px 0px 6px -3px #40b3b0;
    -moz-border: 1px solid #50c3c0; -webkit-border: 1px solid #50c3c0; -o-border: 1px solid #50c3c0; -ms-border: 1px solid #50c3c0; border: 1px solid #50c3c0;
}

select.disabled, input.disabled, textarea.disabled {
    pointer-events: none; background: #eee;
}

textarea.large {
    height: 150px; width: 250px;
}

.form .buttons {
	display: block; margin-left: 154px; margin-top: 16px;
}

.form .buttons > * {
	display: inline-block; vertical-align: middle;
}

.form p.last {
    margin-left: 200px; margin-top: 20px;
}

.form p.last input {
	display: inline-block; font-size: 1em; padding: 6px 24px; margin-right: 4px; min-width: auto; color: #fff; border: none;
	-moz-border-radius: 3px; -o-border-radius: 3px; -webkit-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px;
    background: linear-gradient(#6ac,#47a);
}

.form p.last input[type="button"] {
    background: linear-gradient(#aaa,#777);
}

.form span.field-error {
	display: block; color: #c00; font-size: 0.9em; margin-top: 4px; margin-bottom: 10px; margin-left: 204px;
}

.form input.field-error, .form textarea.field-error, .form select.field-error {
    border: 1px solid #faa !important;
}

.form input.field-error:focus {
	-moz-box-shadow: 0px 0px 6px -3px red !important; -webkit-box-shadow: 0px 0px 6px -3px red !important; -o-box-shadow: 0px 0px 6px -3px red !important; -ms-box-shadow: 0px 0px 6px -3px red !important; box-shadow: 0px 0px 6px -3px red !important;
}

.form .message.error {
    color: #c00; padding: 12px; margin-top: 14px; margin-bottom: 14px;
    background: #fff0f0;
}

.form .message.success {
    color: #080; padding: 12px; margin-top: 14px; margin-bottom: 14px;
    background: #f0fff0;
}

.form .message-info {
    color: #008; padding: 12px; margin-top: 14px; margin-bottom: 0px; line-height: 1.4em; background: #f0f0ff; margin-left: 200px; font-size: 0.85em;
}

.form .message-info br {
    margin-bottom: 8px;
}

.form .loading-indicator {
	display: inline-block; vertical-align: middle; width: 16px; height: 16px; margin-left: 12px; background: url(loading-white.gif);
}

.global-loading-indicator {
	display: none; vertical-align: middle; width: 16px; height: 16px; margin-left: 12px; background: url(loading-white.gif);
}

html.busy .global-loading-indicator {
	display: inline-block !important;
}

/* *** */
body.phone .form {
    width: 100%;
    -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

body.phone .form p label, .vlayout p label {
    display: block; margin-bottom: 4px; width: auto;
}

body.phone .form span.field-error, .vlayout p span.field-error {
    margin-left: 0;
}

body.phone .form p input, body.phone .form p textarea, body.phone .form p select {
	min-width: 0; width: 100%;
}

body.phone .form .buttons {
	margin-left: 0;
}

body.phone .form .message-info {
    margin-left: 0;
}

/* ************************* */
.tabs {
    padding: 0px 24px; background: #fff; color: #222;
    font-size: 1.1em; padding-top: 4px;
}

.tabs a {
    display: inline-block; padding: 14px 12px; color: inherit; text-decoration: none; vertical-align: middle;
    border-radius: 9px 9px 0 0;
}

.tabs img {
    display: inline-block; width: 28px; vertical-align: middle; margin-right: 16px;
}

.tabs a:hover {
    cursor: pointer; text-decoration: none;
}

.tabs a.active {
    font-weight: normal; color: #fff; background: #414954;
}

.tabs a img {
    display: inline-block; width: 27px; margin-top: -7px; margin-right: 8px; margin-bottom: -3px;
	-moz-border-radius: 999px; -webkit-border-radius: 999px; -o-border-radius: 999px; -ms-border-radius: 999px; border-radius: 999px;
}

.tabs a.ui {
    padding: 6px 12px; margin-top: 8px;
}

.tabs a.float-right {
    display: inline-block; padding: 12px 12px 4px 12px; margin-top: 2px;
}

.phone .tabs {
    padding: 4px 12px;
}


/* ************************* */
.sub-tabs {
    padding: 0; font-size: 1.10em; margin: -4px 0 24px 0; color: #293134; font-weight: normal; padding: 0px 16px;
    background: #414954; margin-left: -24px; margin-right: -24px; margin-top: -24px;
}

.phone .sub-tabs {
	margin-right: -12px;
}

.sub-tabs a {
	display: inline-block; padding: 14px 8px; margin-right: 0;
	color: #ccc; text-decoration: none;
}

.sub-tabs a:hover {
    cursor: pointer; text-decoration: underline;
}

.sub-tabs a.invisible {
    display: none;
}

.sub-tabs a.active {
    display: inline-block; font-weight: normal; color: #fff; text-decoration: none;
}

/* ************************* */
.sub-sub-tabs {
    display: block; margin-bottom: 16px;
}

.sub-sub-tabs > span {
    display: inline-block; margin-right: 8px; padding: 8px 16px; overflow: hidden; cursor: pointer;
    -moz-border-radius: 3px; -o-border-radius: 3px; -webkit-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px;
    background: #999; color: #000;
}

.sub-sub-tabs > span > em {
    display: inline-block;  font-style: normal; padding: 8px 12px; margin: -8px -16px; margin-left: 16px; float: right;
    background: #777; color: #000;
}

.sub-sub-tabs > span.active {
    background: #209086; color: #fff;
}

.sub-sub-tabs > span.active > em {
    background: #007066; color: #fff;
}


/* ************************* */
.tab-content {
    padding: 24px 24px;
}

.phone .tab-content {
	padding: 24px 12px;
}

/* ************************* */
.filters {
	margin-bottom: 16px;
}

.filters.b {
    display: inline-block; padding: 0; margin-bottom: 14px; margin-top: 8px;
}

.filters a, .btnn {
	display: inline-block; padding: 6px 24px; text-decoration: none; color: #fff;
	-moz-border-radius: 3px; -o-border-radius: 3px; -webkit-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px;
    background: linear-gradient(#6ac,#47a); border: 1px solid #47a;
}

.filters a:hover, .btnn:hover {
	color: #fff; cursor: pointer;
	border: 1px solid #000;
}

.filters a:active, .btnn:active {
	background: linear-gradient(#48a,#258); border: 1px solid #258;
}

.filters a.g {
	background: linear-gradient(#2a5,#083);
    color: #fff; border: 1px solid #083;
    text-shadow: none;
}

/* **** */
.filters > div {
    display: inline-block; margin-right: 8px; font-size: 1em; margin-bottom: 8px;
}

.filters > div > label {
    display: block; margin-bottom: 4px;
}

.filters > div > input, .filters > div > select {
	display: inline-block; min-width: 120px; padding: 4px 8px; font-size: 1em; border: 1px solid #aaa; background: #fff;
	-moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;
	-moz-box-shadow: inset 0px 2px 2px -2px #888; -webkit-box-shadow: inset 0px 2px 2px -2px #888; -o-box-shadow: inset 0px 2px 2px -2px #888; -ms-box-shadow: inset 0px 2px 2px -2px #888; box-shadow: inset 0px 2px 2px -2px #888;
}

.filters > div > select {
	min-width: 170px;
}

.filters > div > input:focus, .filters > div > select:focus {
    -moz-box-shadow: 0px 0px 6px -3px #40b3b0; -webkit-box-shadow: 0px 0px 6px -3px #40b3b0; -o-box-shadow: 0px 0px 6px -3px #40b3b0; -ms-box-shadow: 0px 0px 6px -3px #40b3b0; box-shadow: 0px 0px 6px -3px #40b3b0;
    -moz-border: 1px solid #50c3c0; -webkit-border: 1px solid #50c3c0; -o-border: 1px solid #50c3c0; -ms-border: 1px solid #50c3c0; border: 1px solid #50c3c0;
}

.filters > b {
	display: inline-block; margin: 0px 12px;
}

/* ************************* */
table {
    box-shadow: 0px 0px 8px #aaa;
}

table td, table th {
    border: none; padding: 10px 10px;
    border-bottom: 1px solid #aaa;
}

table th {
    font-weight: normal; background: #677; color: #fff; padding: 10px 10px;
    border-bottom: 2px solid #566;
}

table td {
    background: #fff;
}

table td a {
    display: inline-block; text-decoration: underline; margin: 0 4px;
    color: #2b00d1; line-height: 1.5em;
}

table td a:hover {
    color: #0b00a1; cursor: pointer;
}

/* ********************* */
.checkbox-list {
	display: inline-block; vertical-align: top;
}

.checkbox-list > div {
	margin-top: 6px;
}

.checkbox-list > div > label {
	display: block; margin-bottom: 4px; width: auto;
}

.checkbox-list > div > label:hover span {
	text-decoration: underline; cursor: pointer;
}

.checkbox-list input[type="checkbox"] {
	min-width: auto !important; width: auto !important;
	-moz-box-shadow: none !important; -webkit-box-shadow: none !important; -o-box-shadow: none !important; -ms-box-shadow: none !important; box-shadow: none !important;
}

/* **** */
.upload-field {
    position: relative; display: inline-block; overflow: hidden;
}

.upload-field:after {
	display: inline-block; font-size: 1em; padding: 6px 24px; margin-right: 4px; min-width: auto; color: #fff; border: none;
	-moz-border-radius: 3px; -o-border-radius: 3px; -webkit-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px;
    background: linear-gradient(#6ac,#47a);

    content: attr(title);
}

.upload-field input {
    position: absolute; left: 0; top: 0; font-size: 2em; opacity: 0; cursor: pointer;
}

/* ********** */
.change-picture {
    display: inline-block; background: #fff; text-align: center; padding: 12px;
    -moz-border-radius: 3px; -o-border-radius: 3px; -webkit-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px;
}

.change-picture img {
    margin-bottom: 16px;
    -moz-border-radius: 999px; -webkit-border-radius: 999px; -o-border-radius: 999px; -ms-border-radius: 999px; border-radius: 999px;
}

/* *********** */
.task-desc {
    display: block; background: #fff; padding: 12px; overflow: hidden;
    -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px;
}

.task-desc p {
    font-size: 1.1em; line-height: 1.4em;
}

.task-desc > div {
    background: #f7f7f7; color: #333; text-align: left; margin: -12px -12px 12px -12px; padding: 8px 12px;
}

/* ****** */
.comment {
    display: block; background: #fff; margin: 8px 0; padding: 12px;
	-webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px;
}

.comment > span {
    display: block; position: relative; float: left;
}

.comment > span + a {
    float: right; font-size: 1.1em; color: #2e14e6; text-decoration: underline; cursor: pointer; margin-top: 2px;
}

.comment > span img {
    width: 40px;
    -moz-border-radius: 999px; -webkit-border-radius: 999px; -o-border-radius: 999px; -ms-border-radius: 999px; border-radius: 999px;
}

.comment > span b {
    position: absolute; left: 48px; top: 0px; font-size: 1.1em; white-space: nowrap;
}

.comment > span b span {
    display: inline-block; vertical-align: top; font-weight: normal; color: #888; margin-left: 5px; font-size: 0.9em;
}

.comment > p {
    padding-top: 8px; padding-left: 48px; font-size: 1.1em; line-height: 1.4em; margin-bottom: 0px;
}

/* ~ */
body.phone .comment > p {
    padding-top: 38px; padding-left: 4px; padding-right: 4px;
}

body.phone .comment > span b {
    top: 4px;
}

body.phone .comment > span b span {
    display: block; margin-left: 0; margin-top: 4px;
}

/* **** */
.form-comment {
    display: block; margin-top: 16px;
}

.form-comment textarea {
	display: block; width: 100%; min-height: 70px; padding: 5px 8px; font-size: 1.1em; line-height: 1.5em; border: 1px solid #aaa;

	-moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;
	-moz-box-shadow: inset 0px 2px 2px -2px #888; -webkit-box-shadow: inset 0px 2px 2px -2px #888; -o-box-shadow: inset 0px 2px 2px -2px #888; -ms-box-shadow: inset 0px 2px 2px -2px #888; box-shadow: inset 0px 2px 2px -2px #888;
}

.form-comment textarea:focus {
    -moz-box-shadow: 0px 0px 6px -3px #40b3b0; -webkit-box-shadow: 0px 0px 6px -3px #40b3b0; -o-box-shadow: 0px 0px 6px -3px #40b3b0; -ms-box-shadow: 0px 0px 6px -3px #40b3b0; box-shadow: 0px 0px 6px -3px #40b3b0;
    -moz-border: 1px solid #50c3c0; -webkit-border: 1px solid #50c3c0; -o-border: 1px solid #50c3c0; -ms-border: 1px solid #50c3c0; border: 1px solid #50c3c0;
}

.form-comment .buttons {
    margin-left: 0 !important;
}

/* **** */
.task-item {
    background: #fff; padding: 8px; margin-bottom: 12px;
	-webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px;
}

.task-item > em {
    font-style: normal; padding: 1px 6px; font-size: 0.8em; background: #555; color: #fff; margin-right: 4px;
	-webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px;
}

.task-item > em.t0 { background: #888; }
.task-item > em.t1 { background: #2f9f77; }
.task-item > em.t2 { background: #b44; }
.task-item > em.t00 { background: #999; }

.task-item > span {
    display: inline-block; font-weight: bold; vertical-align: middle;
}

.task-item > span > span {
    margin-left: 6px; color: #888; font-weight: normal;
}

.task-item > a {
    display: block; font-size: 1.1em; line-height: 1.4em; cursor: pointer; padding: 0px 0px; margin-top: 6px; margin-bottom: 0px; color: #e62e14; text-decoration: underline;
}

.task-item > a:hover {
	color: #ff6e54;
}

.task-item > p {
    display: none;
}

.task-item > b {
    font-weight: normal; display: inline-block; vertical-align: middle; margin-left: 3px; color: #888; font-size: 0.9em;
    border-left: 1px solid #aaa; padding-left: 8px;
}

.task-item > b > i {
    margin-left: 8px;
}

.task-item > b > i > span {
    margin-left: 4px; font-size: 0.9em;
}

body.phone .task-item > b {
    display: block; float: right; margin-left: 0; margin-top: 0px; color: #888; font-size: 0.9em;
    border-left: none; padding-left: 0;
}

.task-item > b + span {
    display: block; margin-top: 12px;
}

/* ******* */
.attachment-file-list {
    margin: 16px 0;
}

.attachment-file-list > span {
    display: inline-block; background: #3f4b4e; color: #fff; padding: 4px 8px 4px 10px; margin-right: 4px; margin-bottom: 4px;
    -webkit-border-radius: 999px; -moz-border-radius: 999px; -ms-border-radius: 999px; border-radius: 999px;
}

.attachment-file-list > span > b {
    display: inline-block; background: #111; padding: 2px 8px; margin-left: 6px; font-weight: normal;
	-webkit-border-radius: 999px; -moz-border-radius: 999px; -ms-border-radius: 999px; border-radius: 999px;
}

/* ******* */
/* General phone-class mutators. */

body.phone .phone-align-center { text-align: center; }
body.phone .phone-display-block { display: block; }
body.phone .phone-padding-8-0 { padding: 8px 0; }
body.phone .phone-padding-16-0 { padding: 16px 0 !important; }

/* ******** */

.hidden {
    display: none;
}

.framed {
    border: 1px solid #999; padding: 16px; margin: 16px 0; background: #fff;
    -moz-box-shadow: 0px 0px 8px #aaa; -webkit-box-shadow: 0px 0px 8px #aaa; -o-box-shadow: 0px 0px 8px #aaa; box-shadow: 0px 0px 8px #aaa;
    -moz-border-radius: 3px; -webkit-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px;
}

.framed h2 {
    margin: 0 0 16px 0;
}

.framed form {
    box-shadow: none;
}

/* ************* */
.steps {
    display: flex; flex-flow: row;
    margin-bottom: 32px;
    background: #fff;
    border-radius: 9px 9px 0 0;
}

.steps a {
    flex: 1 1 0; position: relative;
    display: inline-block; padding: 20px 16px 20px 4px;
    text-align: center; text-decoration: none;
    color: #000; font-size: 1.2em;
    border-bottom: 2px solid #1083c7;
}

.steps a.locked {
	pointer-events: none;
}

.steps a:after {
    content: ""; position: absolute; left: 50%; bottom: -6px; margin-left: -6px; width: 12px; height: 12px;
    border-radius: 999px;
    background: #1083c7;
}

.steps a span {
    display: none; margin-top: 4px; font-size: 0.8em;
}

.steps a.active {
    font-weight: bold; color: #36a;
}

.steps a.active:after {
    content: ""; position: absolute; left: 50%; bottom: -12px; margin-left: -12px; width: 24px; height: 24px;
    border-radius: 999px;
    background: #00adde;
}

.steps-content {
    background: #fff; padding: 32px 48px; margin-top: -32px;
}

.steps-content form {
    box-shadow: none;
    display: inline-block;
}

p.info {
    background: #a0d0e3; padding: 12px; line-height: 1.4em;
}

.fontello-icon-attention.red {
    color: #c00; margin-right: -8px;
}

.fontello-icon-ok.green {
    color: #0a0; margin-right: -8px;
}

/* ************ */
.review_item > b {
    background: #844; color: #fff; display: block; padding: 16px; margin-bottom: 16px; margin-top: 16px; font-weight: normal;
	-moz-border-radius: 3px; -webkit-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; line-height: 1.3em;
}

.review_item > b.ok {
    background: #eee; color: #3a5; font-weight: normal; font-size: 1.1em;
}

.review_item table {
    border-collapse: collapse; width: 100%;
}

.review_item th {
	padding: 2px 12px 2px 4px; text-shadow: none; font-size: 1em; font-weight: normal; background: #677; color: #fff; border: 1px solid #566;
    text-align: right; width: 150px;
}

.review_item tr.b th {
	background: #767; color: #fff; border: 1px solid #656;
}

.review_item td {
    border: 1px solid #aaa; box-shadow: none; padding: 2px 4px;
}

.review_item input {
    border: none; padding: 4px 4px; background: none; width: 100%;
    box-sizing: border-box;
    box-shadow: inset 0px 4px 4px -5px #000;
    border: 1px solid #aaa;
}

.review_item td b {
    display: block; padding: 4px;
}

/* ******* */
.btnn.b {
    position: absolute; display: block; right: 0; top: 0; padding: 6px 24px !important;
    font-size: 0.9em; line-height: 1em;
}

.btnn.b.gray {
    background: #ddd; border: 1px solid #aaa; color: #999;
    pointer-events: none;
}

.btnn.b.gray:after {
    position: absolute; content: attr(title);
    width: 180px; text-align: right;
    left: -190px; top: 5px;
    font-size: 0.8em;
    color: #a00;
}

.steps-content > div {
    position: relative;
}

/* ***** */
h6 {
    position: relative; margin: 0 0 16px 0; padding: 12px 8px; background: #e0e0e0; width: 50%; font-size: 1.2em; font-weight: normal;
    -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;
    -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px;
}

.btnn.d {
    position: absolute; display: block; right: 6px; left: auto; top: 6px; padding: 6px 18px !important;
    font-size: 0.8em; line-height: 1em;
}

/* ********* */
.form.hidden {
	display: none;
}

.form.boxed {
    width: 100%; margin-top: 24px;
    border: 1px solid #ccc;
    box-shadow: 0px 0px 8px -4px #000;
    box-sizing: border-box;
    padding: 16px;
}

.form.boxed p.last {
    margin: 0; margin-top: 12px;
}

.form.boxed label {
    display: block; margin-bottom: 4px; width: auto;
}

.form.boxed select, .form.boxed input[type="text"], .form.boxed input[type="file"] {
    min-width: 0;
    width: 100%;
    box-sizing: border-box;
}

/* ******* */
.upload-zip {
    display: inline-block;
    background: linear-gradient(#f65e44,#e62e14);
    color: #fff;
    width: auto;
    padding: 10px 32px;
    border-radius: 999px;
    font-size: 1.1em;
}

.upload-zip-list > div {
    display: block;
    margin: 16px 0;
    background: #fff;
    border: 1px solid #ddd;
    padding: 12px;
    color: #333;
    border-radius: 4px;
    box-shadow: 0px 0px 8px -4px #000;
    overflow: hidden;
}

.upload-zip-list > div > span {
    display: block;
    margin-bottom: 8px;
    font-size: 1.1em; line-height: 1.3em;
}

.upload-zip-list > div > em {
    float: right; margin-top: 3px;
    margin-right: 8px;
    font-style: normal;
}

.upload-zip-list > div > a {
    display: inline-block;
    background: linear-gradient(#f65e44,#e62e14);
    color: #fff;
    padding: 4px 8px;
    margin-right: 8px;
    border-radius: 3px;
    cursor: pointer;
}

.upload-zip-list > div a.c {
    display: none;
}

.upload-zip-list > div.uploading a.c {
    display: inline-block;
}

.upload-zip-list > div.uploading a.u, .upload-zip-list > div.uploading a.r {
    display: none;
}

.upload-zip-list > div > b {
    margin-top: 12px;
    display: none;
    background: #ccc;
    height: 4px;
}

.upload-zip-list > div > b > b {
    display: block;
    background: #33c667;
    height: 4px;
    width: 0;
}

.upload-zip-list > div.uploading > b {
    display: block;
}

.upload-zip-list > div.closed a {
    display: none !important;
}

.upload-zip-list > div i {
    font-style: normal;
    font-weight: normal;
    color: #3a3;
}

.upload-zip-list > div.err i {
    color: #c33; line-height: 1.3em;
}

/* ******** */
form label.inline {
    display: block;
    margin: 0; padding: 0; margin-left: 200px;
    width: auto;
    min-width: auto;
    max-width: auto;
}

form label.inline input {
    width: auto; min-width: auto;
}

form label:hover {
    text-decoration: underline; cursor: pointer;
}

/* ****** */
#mappingElementVariableContent > fieldset {
    margin-bottom: 40px;
}

fieldset {
    padding: 8px;
    border-left: 1px solid #aaa;
    margin: 10px 0;
}

fieldset legend {
    background: #3aa; color: #fff; padding: 4px 16px;
    border-radius: 999px;
}

fieldset fieldset legend {
    background: #444;
}

fieldset {
    margin-left: 12px;
}

fieldset fieldset {
    margin-left: 24px;
}

fieldset fieldset fieldset {
    margin-left: 48px;
}

fieldset input, fieldset select {
    padding: 4px 8px;
}

/* ****** */
.filters > span {
    display: block; margin-top: 12px;
}

.filters > span > p {
    display: inline-block; margin: 0 6px 6px 0;
}

.filters > span > p label {
    display: block; margin-bottom: 2px;
}

.filters > span > p input {
	display: block; width: 100%; height: auto; padding: 4px 8px; font-size: 1em; margin: 0 0 6px 0; border: 1px solid #aaa;
	-moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;
	-moz-box-shadow: inset 0px 2px 2px -3px #888; -webkit-box-shadow: inset 0px 2px 2px -3px #888; -o-box-shadow: inset 0px 2px 2px -3px #888; -ms-box-shadow: inset 0px 2px 2px -3px #888; box-shadow: inset 0px 2px 2px -3px #888;
}

.filters input[type=button] {
	display: inline-block; padding: 4px 24px; text-decoration: none; color: #fff;
	-moz-border-radius: 3px; -o-border-radius: 3px; -webkit-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px;
    background: linear-gradient(#6ac,#47a); border: 1px solid #47a;
}

.filters > span.legend {
    display: inline-block; margin-left: 16px; font-size: 1.2em;
}


/* *** */
input, select {
    background: #fff !important; color: #333 !important; border: 1px solid #bbb !important;
    border-radius: 4px; padding: 0.4rem 0.5rem !important; font-size: 1.1em !important;
    box-shadow: inset 0 4px 4px -3px rgba(0,0,0,0.25) !important;
}

input:focus, select:focus {
    box-shadow: 0 2px 6px -2px #50c3c0 !important;
    border: 1px solid #50c3c0 !important;
}

input[type=submit], input[type=button], .filters > a {
    background: linear-gradient(#65a9cb, #467aac) !important; color: #fff !important;
    box-shadow: none !important;
    border: 1px solid #366a9c !important;
    padding: 0.5rem 1.2rem !important;
    line-height: 1 !important;
    display: inline-block;
}

input[type=submit]:hover, input[type=button]:hover, .filters > a:hover {
    background: linear-gradient(#75b9db, #568abc) !important;
    border: 1px solid #164a7c !important;
}

td small {
    font-weight: 500; color: #8aa; vertical-align: top; margin-left: 0.3rem;
}