@import url('https://fonts.googleapis.com/css?family=Roboto');

html, body {
	background-color: #0e1d1d;
	color: #0e1d1d;
	font-family: Roboto, sans-serif;
	font-size: 13px;
	font-weight: lighter;
	line-height: 1.4;
	margin:0;
	height:100%;
}
#contentwrapper {
	position: absolute;
	top: 30px;
	right: 0;
	left: 186px;
	background: #f0f0f0;
	padding-bottom: 10px;
	min-height:calc(100% - 40px);
}

.logo {
	display: inline-block;
	border-bottom: 1px solid #FFFFFF;
	padding: 10px 10px 10px 5px;
	width: 171px;
}
.login .logo { width:auto; }

.top_bar {
	left: 186px;
	top: 0;
	right: 0;
	z-index: 3;
	position: fixed;
	background-color: #0e1d1d;
	color: #FFFFFF;
	min-height: 25px;
	padding-top: 5px;
	text-align: center;
	border-left:1px solid
}

.backend {
	display: flex;
	padding: 1%;
	flex-flow: wrap;
}
.panel {
	position: relative;
	background-color: #FFF;
	outline: 1px solid #e1e1e1;
	align-self: stretch;
	padding: 10px;
	margin: 10px 1%;
	box-sizing: border-box;
}
.flexrow {display: flex;}
.panel.half { flex-basis: 48%; }
.fillrow { 	flex-basis: 100%; }

div.login {
	top: 32%;
	left: 37%;
	position: fixed;
	text-align: center;
}
div.login input {
	text-align: center;
	float: none;
}

/* Tables */
table.grid {
	border-collapse: collapse;
}
table.grid caption {
	margin-top: 1em;
}
table.grid td {
	border: 1px solid #000;
	border-left: 0;
}
table.grid td:last-child {
	border-right: 0;
}
table.grid td input[type = text], table.grid td textarea {
	width: 92%; !important;
}
table + table caption { margin-top: 1em }

#variants .prices {
	display: flex;
	flex-flow: column wrap;
	max-height: 200px;
	margin: -2px -6px;
}
#variants .price {
	margin: 1px;
	padding: 0 5px;
}
#variants .price:hover {
	background-color: #eeeeee;
}
#variants .disagio.active time {
	font-weight:bold;
}
#variants .disagio .date_from.future time {
	font-style:italic;
}
#variants .disagio .date_to.past time {
	text-decoration:line-through;
}

.backend #tableform {
	background-color: #FFF;
	border: 1px solid #e1e1e1;
	align-self: stretch;
	flex-basis: 45%;
	display: flex;
	flex-flow: column nowrap;
	padding: 10px;
	margin: 10px;
}

.backend tbody {
	background: #d5d5d5;
}
.backend tfoot th {
	color: #1c1c1c;
	background: #a6a6a6;
}
.backend tfoot td {
	color: #1c1c1c;
	background: #a6a6a6;
}
.backend tbody:nth-of-type(even) {
	background: none;
}
#contentwrapper tbody td {
	padding-left: 5px;
	padding-right: 5px;
}
#contentwrapper tbody tr:hover {
	background: #dfdfdf;
	color: #1c1c1c;
}
table .newdate > td {
	border-top: 2px dashed #606468;
}
#contentwrapper tbody .highlight1 {
	background: #62a6ff;
}
#contentwrapper tbody .highlight2 {
	background: #65ae6b;
}
#contentwrapper tbody .highlight1 a {
	color: #000;
}
th {
	font-weight: bolder;
	text-transform: uppercase;
	padding: 1ex 1em;
	background: #606468;
	color: #fff;
}

.itemlist td { line-height: 1.2; }
.itemlist .date { display: block }
.itemlist ul {
	list-style-position: inside;
	margin: 0.6ex 0;
	padding: 0 0 0 1ex;
}

.countries label { display: none; }

/* Pagination */
.pgntn {
	overflow: auto;
	overflow-y: hidden;
	margin: 5px 0;
}
.pgntn span span { font-weight: bold; }
.pgntn > a {
	float: left;
	font-size: 200%;
	line-height: 0.5;
}
.pgntn .pages {
	float: left;
	margin: 0 1%;
	overflow: auto;
	white-space: nowrap;
	max-width: 88%;
}

.pages > a {
	padding: 0 4px;
}
.pages > a:hover,
.pages > a:focus {
	background: #c2c2c2;
	color: #000;
}

.block { width: 100%; }

/* Navigation */
.naviwrapper {
	position: absolute;
	width: 186px;
	top: 0;
	bottom: 0;
	background-color: #0e1d1d;
}
.naviwrapper li {
	border-bottom: 1px solid #777;
}
.nav_img {
	padding-left: 13px;
	padding-right: 8px;
}

.naviwrapper li:hover {
	background-color: #060c0c;
}
.naviwrapper .current {
	display: block;
	max-height: 200px;
	background-color: rgba(255, 255, 255, 1);
}

.navi {
	padding: 0;
	margin: 0;
	background: #0e1d1d;
}
.navi > li {
	text-transform: capitalize;
	min-width: 100px;
	position: relative;
}
.navi li:hover ul {
	display: block;
}
.navi ul {
	background-color: #6a6a80;
	/*margin: 0;
	padding: 0;
	position: absolute;
	display: none;
	top: 0;
	z-index: 2;
	left: 186px;*/
}
.navi a {
	display: block;
	padding: 7px;
	text-shadow: 0 -1px 0 #444;
}
.navi a:hover, .navi a:focus {
	color: #a8a8a8;
}
.navi ul a {
	color: #ddd;
	white-space: nowrap;
}
.navi ul a:hover {
	color: #333;
}
.nav_current {
	background-color: #0085ba;
}

/* Upload form */
.box__text {
	display: block;
	text-align: center;
	padding-bottom: 4px;
}
.box__file {
	margin-bottom: 20px !important;
	height: 190px;
	position: absolute;
	opacity: 0;
}
.box.has-advanced-upload .box__icon {
	display: block;
	fill: #92b0b3;
	width: 21%;
	margin-left: 41%;
	padding-top:10px;
	text-align: center;
}
.box.has-advanced-upload {
	background-color: #c8dadf;
	font-size: 1.25rem;
	transition: outline-offset 0.15s ease-in-out 0s, background-color 0.15s linear 0s;
	outline: 2px dashed #92b0b3;
	outline-offset: -10px;
	margin-bottom: 10px;
	position: relative;
	height: 190px;
}
.progress {
	width: 100%;
}
.list-group_success  {
	background-color: #dff0d8;
	color: #3c763d;
	padding:5px;
	border-radius: 2px;
}
.badge_alert-success_pull-right {
	float: right;
}
.list-group-item_list-group-item-success{
	list-style: none;
	clear: none;
}


/* Forms */
/* .inputform class is deprecated */
.vertical > label,
.facetfilters > label {
	display:flex;
	flex-wrap:wrap;
	white-space:normal;
	margin-right:0;
}
fieldset {
	margin: 15px 0;
	border: 1px solid #e1e1e1;
}
legend, caption {
	padding: 1px 1ex;
	color: #000;
	font-weight: bold;
	text-transform: uppercase;
}
form > label,
fieldset > label {
	margin-right:15px;
	white-space:nowrap;
}

.blocklabels label {
	float: none;
	display: block;
}
.vertical > label > span,
.facetfilters span,
.inputform label > span {
	min-width: 130px;
}
form > label > span,
fieldset > label > span:first-child,
.facetfilters label > span,
.inputform label {
	line-height: 30px;
	text-align: left;
}
.inputform label[for],
.inputform label > span {
	max-width: 200px;
}
label > span {
	display: inline-block;
	vertical-align:top;
	margin-right:5px;
}
.vertical label + button {
	margin-top: 1em;
}
.inputform label {
	clear: both;
	float: left;
}
.inputform label + input,
.inputform label + button,
.inputform textarea,
.inputform label + select {
	float:left;
}
select:not([size]) {
	padding: 1ex 0;
}
label > span + textarea,
label .expand {
	flex-grow:1;
}
label > span + textarea {
	min-height:4em;
}
label > span + textarea,
label > span ~ select {
	margin-bottom:2px;
}

td .td_elem {
	display: inline-block;
}
td .td_elem input[type=checkbox] {
	display: inline-block;
	margin-right: 15px;
	margin-left: 0;
}

.vertical label input:not([class*=simple]) {
	margin-bottom: 2px;
	vertical-align:top;
}
label + input:not([class*=simple]) button {
	width: 20px;
}

.translate td input, .settings input { width: 96%; box-sizing: border-box; }
.translate td + td { width: 48% }

.paymethods textarea { min-height: 11ex; }

.inputform select, .inputform textarea,
.inputform input[type=number] {
	clear: right;
	width: 48%;
}
input[type="number"], input[type="date"], input[type="time"], input[type="text"],
input[type="search"], input[type="email"], input[type="password"], input:not([type]) {
	line-height: 28px;
	box-sizing: border-box;
	/*min-width:50px;*/
}
input[type='number'][size='2'] { width: 50px }
input[type='number'][size='5'] { width: 70px }
input[type='number'][size='9'] { width: 100px }
input[type='number'][size='15'] { width: 140px }

.design_area {
	float: left;
	margin-bottom: 20px;
}
.current_design {
	border: 1px solid #a6a6a6;
}
.shop_ref {
	float: right;
	padding-right: 20px;
}
div.support_optional {
	display: block;
}
.support_ref {
	padding-left: 20px;
	float: left;
}
#support_form input:not([type="checkbox"]),
#support_form textarea,
.design_editor textarea {
	width: 100%;
	box-sizing: border-box;
}
.support_ref a {
	top: -10px;
	vertical-align: top;
}

.inputform fieldset {
	clear: left;
	border: 0;
	padding: 0;
	margin: 0;
}
.inputform fieldset legend {
	margin: 0; padding: 0;
}
.inputform .radio label,
.inputform label.inline,
.inputform fieldset input[type=radio] {
	float: none;
	vertical-align:middle;
}

fieldset#facets table.fleft,
fieldset#facets form.fleft {
	width: 38%;
}
fieldset#facets .fleft:nth-child(3) {
	width: 23%;
}

fieldset#variants table {
	width: 100%;
}

fieldset#taxes .unused {
	display: none;
}
fieldset#taxes .unused.show {
	display: inline;
}
fieldset#taxes > p { margin-top: 0; }

fieldset#taxes label {
	display: block;
	width: 35%;
	float: left;
	text-align: left;
	margin-left: 1%;
	line-height: 1.8em;
	clear: left;
}
fieldset#taxes input {
	width: 55px;
	float: left;
}
fieldset#taxes span {
	float: left;
}

fieldset#price {
	float: right;
	min-width: 50%;
}

.filter {
	min-width: 320px;
}
.filter label {
	overflow: hidden;
	text-overflow: ellipsis;
}
.facetfilters label.removable span:before {
	content: url("../img/icon_delete.png") ' ';
}
.filter label + select { max-width: 61%; margin-bottom: 2px; }
.filter.inputform input[type="submit"] { display: inline; }

#fcontent {
	height: 50px;
	width: 50%;
}

input[type="submit"], input[type="reset"], button {
	margin-left: 2px;
	min-width: 8%;
	background: none;
	border: 1px solid;
	padding: 4px 5px;
	border-radius: 3px;
	clear: both;
}
form [type="submit"], button.submit, button:not([type]) {
	float: none;
	background-color: #0085ba;
	border-color: #0073aa #006799 #006799;
	color: #fff;
	text-shadow: 0 -1px 1px #006799, 1px 0 1px #006799, 0 1px 1px #006799, -1px 0 1px #006799;
}
.inputform button {
	display: block;
}
form button:hover,
form button[type="submit"]:hover,
form input[type="submit"]:not([class]):hover {
	box-shadow: 0 1px 0 #000;
}
input[type="submit"]:hover,
input[type="reset"]:hover,
button:hover,
input[type="submit"]:focus,
input[type="reset"]:focus,
button:focus {
	text-shadow: 1px 1px 0 rgba(0,0,0,0.15) !important;
	/*padding: 3px 6px 5px 4px;*/
	box-shadow: 0 1px 0;
}
input[onclick], button[onclick] {
	cursor: default;
}
table button {
	box-shadow: none;
}

.nochrome, input.nochrome, button.nochrome {
	background: none;
	border: 0;
	box-shadow: none;
	min-width: 0;
}
input.delete,
button.delete {
	border: 1px solid;
	text-shadow: none;
	box-shadow: none;
	background: none;
}

hr {
	border-style: none none dotted;
	border-width: 0 0 1px;
	color: #e1e1e1;
	padding: 0.5ex 0;
}

.naviwrapper > h1 {
	text-align: left;
	margin: 0;
	padding: 10px 5px;
	border-left: 10px solid #0bc;
	color: #000;
	text-transform: uppercase;
	background: url("../img/bg_headline.png") no-repeat scroll right center #fff;
	letter-spacing: 0.05ex;
}
h1, h2, caption {
	color: #0e1d1d;
	text-align: left;
}
h1 { font-size: 130%; font-weight: bold; }
h2 {
	margin-bottom: 10px;
	font-size: 130%;
	font-weight: normal;
}
legend + h2 { margin-top: 0; }
.panel > h2 {
	margin-top: 0.5ex;
	border-bottom: 1px solid #e1e1e1;
	padding-bottom: 10px;
	margin-bottom: 10px;
	text-indent: 10px;
}
.panel > h3 {
	position: absolute;
	right: 20px;
	top: 0;
}

a img {
	vertical-align: -10%;
	border: none;
}
a {
	color: #fff;
	text-decoration: none;
}
main a {
	color: #0085ba;
}
a:hover, a:focus {
	color: #000;
}
.top_bar a:hover, .top_bar a:focus {
	color: #0085ba;
}

.back-to-top {
	border-radius: 3px;
	background: #0085ba;
	position: fixed;
	bottom: 20px;
	right: 20px;
	padding: 5px;
	min-width: 0;
}

p.clb {
	padding-top: 1em;
}

th a {
	color: #fff;
}
th a[href*="sort"]::after {
	content: "⧎";
	display:inline-block;
	margin-left:1ex;
	transform:rotate(90deg);
}
th a[href*="dir"]::after {
	content: "⏷";
	transform:none;
}
th a[href*="dir"][href$="desc"]::after {
	content: "⏶";
}

#contentwrapper [title] {
	cursor: help;
	text-decoration: underline;
	text-decoration-style: dotted;
}
#contentwrapper select[title],
#contentwrapper .tabLabel {
	text-decoration: none;
}
#contentwrapper .tabLabel {
	cursor: pointer;
}

#form_elem {
	background-color: #ffffff;
	padding: 10px 0 10px 5px;
}

.warnings img,
.errors img,
.notices img {
	vertical-align: middle;
}
.warnings,
.errors,
.notices {
	font-size: 86%;
	padding: 2px 0;
	text-align: center;
	white-space: pre-line;
	color: #000;
	border-top: 1px solid #555;
	margin: 0;
	border-bottom-width: 1px;
	border-bottom-style: solid;
}
.warnings,
.dijitToasterWarnings {
	background-color: #FA4;
	border-bottom-color: #FD0;
}
.notices,
.dijitToasterNotices {
	background-color: #5D5;
	border-bottom-color: #0F0;
}
.errors,
.dijitToasterErrors {
	background-color: #E66;
	border-bottom-color: #FAA;
}

.backend .error:before,
.backend .warning:before,
.backend .notice:before {
	margin: 0 1ex;
}
.backend .error:before {
	content: url("../img/icon_error_color.png");
}
.backend .warning:before {
	content: url("../img/icon_warning_color.png");
}
.backend .notice:before {
	content: url("../img/icon_notice_color.png");
}
.delete, input.delete, button.delete { color: #D33; }
.applied { font-weight: bold; }
.deselect { font-style: italic; background: #eee; }

.fleft { float: left; display: inline; }

.table .fleft {
	padding-top: 0;
	margin-top: 40px;
}

.fright { float: right; display: inline; }
.clb {
	clear: both;
	float: none;
}
.cleft { clear: left; }
.cright { clear: right; }
.txtl { text-align: left; }
.txtz { text-align: center; }
.txtr { text-align: right; }
.jsclick, *[onclick] { cursor: pointer; }
.jsonly { display: none; /* use wisely */ }
.horizontal li { display: inline; }
.vamiddle { display: inline; vertical-align: middle; float: none; }
.nobr { white-space: nowrap; }

.languages {
	margin: 0;
	padding: 0;
	list-style: none;
	white-space: nowrap;
	display:inline-block;
}
.languages li {
	border: 1px solid #A6A6A6;
	margin-right: -1px;
	margin-bottom: 0.5ex;
	display: inline-block;
}
.languages a { padding: 2px 3px; }
.languages li.current a, .languages a:hover {
	background: #0085ba;
	color: #fff;
}
.languages .add {
	line-height: 1.05;
}
#contentwrapper .languages .add a {
	padding: 0 0.5ex;
	text-decoration: none;
}

.number_major .number_minor {
	width: 33%;
	float: right;
}

.coverage {
	display: block;
	white-space: nowrap;
	background: #a8a8a8;
	text-indent: 3px;
}
.count:before {
	content: ": ";
}

.xdebug-error {
	position: relative;
	z-index: 999;
	margin: 0 auto;
}