* {
  margin: 0;
  padding: 0;
}

/* layout */
html, body {
  height: 100%;
  font: 15px/1.5 Helvetica, Arial, sans-serif;
  color: #4E443C;
  background-color: #666666;
  background-image: url(../../images/tilaalens.svg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

#page {
  margin: 0 auto -10em;
  min-height: 100%;
  width: 67em;
  background-color: #D6D6D6;
  background: linear-gradient(45deg, rgba(255, 255, 255, 0.7582), rgba(255, 255, 255, 0.6928) 65%, rgba(255, 255, 255, 0.7320) 65%, rgba(255, 255, 255, 0.7974));
}

html.msie.lt10 #page {
  margin: 0 auto -2.3em;
}

#header {
  //background-color: #D6D6D6;
  //background: linear-gradient(45deg, rgba(255, 255, 255, 0.7582), rgba(255, 255, 255, 0.6928) 35%, rgba(255, 255, 255, 0.7320) 35%, rgba(255, 255, 255, 0.7974));
}
#header .language-bar {
  padding: 0.5em 1em;
  white-space: nowrap;
  text-align: right;
}
html.msie.lt8 #header .language-bar {
  background-color: #F2F2F2;
}
#header span.worldwide {
  font-size: 1.2em;
  font-family: Impact, HelveticaNeue-CondensedBlack, sans-serif-black;
  font-stretch: condensed;
  vertical-align: top;
}
#header span.worldwide img {
  height: 1.5em;
  width: 1.5em;
}

.ui-widget img.flag {
  width: 2em;
  height: auto;
  margin-right: 0.4em;
}

#header .search-bar {
  float: right;
  margin: 0.3em 1em;
}
#header .search-bar button {
  font-size: 1em;
  font-weight: bold;
  color: #FFFFFF;
  background-color: #0378A7;
  border: none;
  border-radius: 0 0.2em 0.2em 0;
  cursor: pointer;
  vertical-align: top;
  height: 1.76em;
}
#header .search-bar button:hover {
  background-color: #39C6F4;
}
#header .search-bar img {
  width: 1.76em;
  height: 1.76em;
  border: none;
}
#header .search-bar input {
  border-radius: 0.25em 0 0 0.25em;
}

#header .logo {
  padding: 0.5em 1em;
  white-space: nowrap;
  margin-bottom: -2.75em;
}
#header .logo img {
  border: none;
  width: 10em;
}
#header .top-nav {
  padding: 0.5em 1em;
  float: right;
  text-align: right;
}
#header .logo-text {
  font-weight: bold;
  font-family: Georgia, serif;
}
#header .menu {
  min-height: 2.3em;
  background-color: #F2F2F2;
  background: linear-gradient(#FFFFFF, #E6E6E6);
  box-shadow: 0 0 0.6em rgba(127, 127, 127, 0.5);
}
#header ul {
  list-style: none;
}
#header li {
  display: inline-block;
}
html.msie.lt8 #header li {
  display: inline;
  zoom: 1;
}
#header .top-nav li {
  padding: 0 0.3em 0 0.4em;
  border-left: 0.0667em solid grey;
}
#header .top-nav li:first-child {
  border: none;
}
#header .top-nav .server-time {
  font-weight: bold;
}
#header .top-nav a[data-messages]:after {
  content: attr(data-messages);
  background: #D81921;
  color: #FFFFFF;
  font-size: 0.6em;
  font-weight: bold;
  width: 1.2em;
  line-height: 1.2em;
  display: inline-block;
  text-align: center;
  border-radius: 0.6em;
  vertical-align: top;
}
#header .menu li {
  text-align: center;
  margin: 0.4em 0 0.4em 0.6em;
  padding: 0 0.4em;
  border-radius: 0.4em;
}
#header .menu a {
  color: #4E443C;
  white-space: nowrap;
  text-decoration: none;
}
#header .menu a:hover {
  text-shadow: 0.05em 0.05em 0.1em #4E443C;
}
#header .menu li.active {
  background-color: #0378A7;
  background: linear-gradient(#036C96, #036C96, #0385B9);
  box-shadow: inset 0 0 0.6em rgba(127, 127, 127, 0.75);
}
#header .menu li.active a {
  font-weight: bold;
  color: #FFFFFF;
}
#header .menu li.active a:hover {
  text-shadow: none;
}


#main {
  padding: 1em;
}
html.msie.lt8 #main {
  margin-bottom: 2.3em;
}

#main:after {
  display:block;
  content: '';
  height: 3em;
  clear: both;
}

#main > * {
  position: relative;
  z-index: 1;
}

#footer {
  position: relative;
  text-align: center;
  width: 66em;
  margin: 0 auto;
  background: linear-gradient(to bottom right, rgba(218, 218, 218, 0), rgba(208, 208, 208, 0) 65%, rgba(3, 120, 167, 0.50) 65.1%);
}

html.msie.lt12 #footer {
  background: linear-gradient(to bottom right, rgba(218, 218, 218, 0), rgba(208, 208, 208, 0) 55%, rgba(3, 120, 167, 0.50) 55.1%);
}

html.msie.lt10 #footer {
  min-height: 2.3em;
  background-color: #E6E6E6;
  box-shadow: 0 0 0.6em rgba(127, 127, 127, 0.5);
}

#footer > div {
  height: 4em;
  padding: 6em 0 0;
  background: linear-gradient(to bottom left, rgba(208, 208, 208, 0), rgba(218, 218, 218, 0) 50%, rgba(57, 198, 244, 0.50) 50.1%);
}

html.msie.lt10 #footer > div {
  height: 1.5em;
  background: none;
}

#footer span {
  white-space: nowrap;
}

#footer div.content {
  line-height: 1.25em;
  display: inline-block;
  vertical-align: middle;
}

#footer div.spacer {
  height: 100%;
  display: inline-block;
  vertical-align: middle;
}

#footer ul {
  list-style: none;
}
#footer li {
  display: inline-block;
}
html.msie.lt8 #footer li {
  display: inline;
  zoom: 1;
}
#footer .bottom-nav li {
  padding: 0 0.3em 0 0.4em;
  border-left: 0.0667em solid grey;
}
#footer .bottom-nav li:first-child {
  border: none;
}

#footer .bottom-nav a {
  color: #4E443C;
}

#footer img {
  vertical-align: text-top;
}

/* general */
img {
  vertical-align: top;
}

a {
  text-decoration: none;
}
a {
  color: #0378A7;
}
a:hover {
  text-decoration: underline;
}

a > img.icon {
  height: 1em;
  width: auto;
  vertical-align: text-top;
}

hr {
  margin: 0.5em 0;
  border-width: 0.0667em;
}

p {
  margin: 0 0 0.6em;
}

.left {
  text-align: left;
}
img.left {
  float: left;
  margin-right: 0.5em;
}
.right {
  text-align: right;
}
img.right {
  float: right;
  margin-left: 0.5em;
}
.center {
  text-align: center;
}

.hidden {
  display: none;
}

.nowrap {
  white-space: nowrap;
}

.top {
  vertical-align: top;
}

p.tooltip {
  margin: 0;
}

.inline {
  white-space: nowrap;
}

.sticky {
  position: -webkit-sticky;
  position: sticky;
}

/* alerts */
.alert-box {
  display: none;
  border-radius: 0.5em;
  padding: 0.5em 0.5em 0.5em 2em;
  margin-bottom: 1em;
  white-space: normal;
}
.alert-box span {
  font-weight: bold;
  text-transform: uppercase;
}
.alert-box.error {
  background: #FFECEC url(../../images/error.svg) no-repeat 0.5em;
  background-size: 1em 1em;
  border: 0.0667em solid #F5ACA6;
}
html.msie.lt9 .alert-box.error {
  background-image: url(../../images/error.png);
}
.alert-box.success {
  background: #E9FFD9 url(../../images/success.svg) no-repeat 0.5em;
  background-size: 1em 1em;
  border: 0.0667em solid #A6CA8A;
}
html.msie.lt9 .alert-box.success {
  background-image: url(../../images/success.png);
}
.alert-box.warning {
  background: #FFF8C4 url(../../images/warning.svg) no-repeat 0.5em;
  background-size: 1em 1em;
  border: 0.0667em solid #F2C779;
}
html.msie.lt9 .alert-box.warning {
  background-image: url(../../images/warning.png);
}
.alert-box.notice {
  background: #E3F7FC url(../../images/notice.svg) no-repeat 0.5em;
  background-size: 1em 1em;
  border: 0.0667em solid #8ED9F6;
}
html.msie.lt9 .alert-box.notice {
  background-image: url(../../images/notice.png);
  background-size: 1em 1em;
}
.alert-box.double-tint {
  margin-bottom: 0;
}

.alert-box.notification {
  position: fixed;
  bottom: 0;
  right: 1em;
  z-index: 101;
  white-space: nowrap;
}

/* form elements */
input:read-only,
select:disabled,
input:disabled:not([type="button"]) {
  background-color: transparent;
}
option[value=""] {
  font-size: 1.2em;
}
option[value="-"]:disabled {
  background-color: initial;
}

input, select, textarea {
  box-sizing: border-box;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  opacity: 1;
}

input[type="text"],
input[type="number"],
input[type="password"],
input[type="email"],
input[type="file"],
input[type="search"],
select {
  font-size: 0.8em;
  padding: 0.25em;
  height: 2.2em;
  width: 12em;
  color: #555555;
  border: 0.0667em solid #CCCCCC;
  border-radius: 0.25em;
}

html.msie.lt8 input[type="text"],
html.msie.lt8 input[type="number"],
html.msie.lt8 input[type="password"],
html.msie.lt8 input[type="email"],
html.msie.lt8 input[type="search"] {
  height: 1.3em;
}

option[data-disabled] {
  color: #6D6D6D;
}

option[data-disabled]:hover {
  color: #FFFFFF;
  color: #666666;
}

input[type="button"],
input[type="submit"] {
  font-size: 1em;
  font-weight: bold;
  padding: 0.4em 1em;
  color: #FFFFFF;
  background-color: #0378A7;
  border: none;
  border-radius: 0.2em;
  cursor: pointer;
}

input[type="button"].error,
input[type="submit"].error {
  padding: 0.2667em 0.8667em;
}

input[type="radio"],
input[type="checkbox"] {
  font-size: 0.8em;
  height: 1em;
  width: 1em;
}

button.text-button:hover,
button.dt-button:hover,
input[type="button"]:hover,
input[type="submit"]:hover {
  background-color: #39C6F4;
}

button.text-button:disabled,
button.dt-button:disabled,
input[type="button"]:disabled,
input[type="submit"]:disabled {
  background-color: #999999;
}

button.text-button:disabled:hover,
button.dt-button:disabled:hover,
input[type="button"]:disabled:hover,
input[type="submit"]:disabled:hover {
  background-color: #AAAAAA;
}

textarea {
  font-family: Helvetica, Arial, sans-serif;
  font-size: 0.8em;
  height: 4.1406em;
  width: 32.4555em;
  padding: 0.25em;
  color: #4E443C;
  border: 0.0667em solid #CCCCCC;
  border-radius: 0.25em;
}

label[data-confirming]:before {
  display: inline-block;
  content: "";
  background-image: url(../../images/confirming.svg);
  background-size: 0.8em 0.8em;
  background-repeat: no-repeat;
  background-position: left bottom;
  height: 1em;
  width: 1em;
}

html.msie label[data-confirming]:before {
  background-image: url(../../images/confirming.gif);
}

label[data-confirmed]:before {
  display: inline-block;
  content: "✓";
  font-weight: bold;
  height: 1em;
  width: 1em;
  color: #029F56;
}

fieldset {
  border: none;
}

legend {
  font-weight: bold;
  box-sizing: border-box;
  width: 100%;
  padding: 0.5em 1em;
  color: #0378A7;
  background-color: #F2F2F2;
  background: linear-gradient(#FFFFFF, #E6E6E6);
  border: 0.0667em solid #CCCCCC;
  border-bottom: none;
  border-radius: 0.5em 0.5em 0 0;
  box-shadow: 0 0 0.6em rgba(127, 127, 127, 0.5);
}
html.msie.lt8 legend {
  padding: 0.5em 0;
  position: relative;
  left: -23px;
  text-indent: 15px;
}

h4 {
  color: #0378A7;
}

.form-body {
  padding: 0.4em 0.8em;
  background-color: rgba(255, 255, 255, 0.4);
  /* background-color: #E6E6E6; */
  border: 0.0667em solid #CCCCCC;
  box-shadow: 0 0 0.6em rgba(127, 127, 127, 0.5);
  border-radius: 0.5em;
}
fieldset.product .form-body {
  padding: 0.4em 0.8em;
}
fieldset.product .form-body .over-range {
  font-weight: bold;
  color: #D81921;
}
.form-body img {
  width: 14.8em;
}
.form-body .row.inline {
  display: inline-block;
  white-space: normal;
}
html.msie.lt8 .form-body .row.inline {
  display: inline;
  zoom: 1;
}
.form-body .row > input,
.form-body .row > select,
.form-body .row > label {
  display: inline-block;
  margin: 0.2em;
  min-width: 8.6em;
}
.form-body .row > span {
  display: inline-block;
  height: 1.76em;
  margin: 0.16em;
}
html.msie.lt8 .form-body .row > input,
html.msie.lt8 .form-body .row > select,
html.msie.lt8 .form-body .row > label,
html.msie.lt8 .form-body .row > span {
  display: inline;
  zoom: 1;
}
.form-body .inline input {
  margin-left: 0.2em;
}
.form-body .row > div {
  display: inline-block;
  vertical-align: top;
}
html.msie.lt8 .form-body .row > div {
  display: inline;
  zoom: 1;
}
.form-body .row .col {
  display: inline-block;
  text-align: left;
}
html.msie.lt8 .form-body .row .col {
  display: inline;
  zoom: 1;
}
.form-body .row .col.hidden {
  display: none;
}
.form-body .row .col > * {
  display: block;
  margin: 0.2em;
}
.form-body .row .col > span {
  margin: 0.16em;
}

.form-body .row .col > .header {
  margin: 0.376em 0;
  min-width: 4.12em;
  white-space: nowrap;
}

.form-body .row .col label {
  /* text-align: center; */
}
.form-body .row .col label .resize {
  transform-origin: left;
}
.form-body .row .col button{
  font-size: 0.8em;
}

.form-body .row .col.attachments input[type="text"],
.form-body .row input[type="file"] {
  width: 20.85em;
}

.form-body .row .col.short {
  max-width: 5.26em;
}

.form-body .row input[type="text"],
.form-body .row input[type="number"],
.form-body .row input[type="password"],
.form-body .row input[type="email"],
.form-body .row input[type="search"],
.form-body .row select {
  width: 14em;
}
.form-body .row.wide input[type="text"],
.form-body .row.wide input[type="number"],
.form-body .row.wide input[type="password"],
.form-body .row.wide input[type="email"],
.form-body .row.wide input[type="search"],
.form-body .row.wide select {
  width: 40.333em;
}
.form-body .row .col input[type="text"],
.form-body .row .col input[type="number"],
.form-body .row .col input[type="password"],
.form-body .row .col input[type="email"],
.form-body .row .col input[type="search"],
.form-body .row .col select {
  width: 11.663em;
}
.form-body .row .col.extra-wide input[type="text"],
.form-body .row .col.extra-wide input[type="number"],
.form-body .row .col.extra-wide input[type="password"],
.form-body .row .col.extra-wide input[type="email"],
.form-body .row .col.extra-wide input[type="search"],
.form-body .row .col.extra-wide select,
.form-body .row .col.extra-wide textarea {
  width: 28.3em;
}
.form-body .row .col.wide input[type="text"],
.form-body .row .col.wide input[type="number"],
.form-body .row .col.wide input[type="password"],
.form-body .row .col.wide input[type="email"],
.form-body .row .col.wide input[type="search"],
.form-body .row .col.wide select {
  width: 15.856em;
}
.form-body .row .col.medium input[type="text"],
.form-body .row .col.medium input[type="number"],
.form-body .row .col.medium input[type="password"],
.form-body .row .col.medium input[type="email"],
.form-body .row .col.medium input[type="search"],
.form-body .row .col.medium select {
  width: 9.636em;
}
.form-body .row .col.narrow input[type="text"],
.form-body .row .col.narrow input[type="number"],
.form-body .row .col.narrow input[type="password"],
.form-body .row .col.narrow input[type="email"],
.form-body .row .col.narrow input[type="search"],
.form-body .row .col.narrow select {
  width: 7.543em;
}
.form-body .row .col.short input[type="text"],
.form-body .row .col.short input[type="number"],
.form-body .row .col.short input[type="password"],
.form-body .row .col.short input[type="email"],
.form-body .row .col.short input[type="search"],
.form-body .row .col.short select {
  width: 6.18em;
}
.form-body .row .col.extra-short input[type="text"],
.form-body .row .col.extra-short input[type="number"],
.form-body .row .col.extra-short input[type="password"],
.form-body .row .col.extra-short input[type="email"],
.form-body .row .col.extra-short input[type="search"],
.form-body .row .col.extra-short select {
  width: 5.18em;
}

.form-body .buttons {
  margin: 0.4em 0.2em;
}
.form-body .buttons button.right {
  float: right;
}
.form-body .buttons label {
  vertical-align: text-top;
}
.form-body .buttons:after {
  content: '';
  clear: both;
}

.form-footer {
  text-align: center;
  min-height: 1.5em;
}

html.msie.lt10 datalist {
  display: none;
}

/* forms */
#order-form {
  position: relative;
  white-space: nowrap;
}

#order-form fieldset.details {
  display: inline-block;
  margin-right: 1em;
  width: 45em;
}
html.msie #order-form fieldset.details {
  display: inline;
  zoom 1;
}

#order-form fieldset.product {
  display: inline-block;
  top: 0.5em;
  vertical-align: top;
  width: 19em;
  white-space: normal;
}
html.msie #order-form fieldset.product {
  position: static;
}
html.msie.lt8 #order-form fieldset.product {
  display: inline;
  zoom: 1;
}
#order-form fieldset.product tbody[data-type="promotion"] {
  display: none;
}

#view-form fieldset {
  margin-bottom: 1em;
}

#view-form fieldset:last-child {
  margin-bottom: 0;
}

#login-form fieldset {
  width: 22.4em;
  margin: auto;
}

#login-form .form-footer {
  text-align: left;
}
#login-form .form-footer ul {
  list-style: none;
}
#login-form .form-footer li {
  display: inline-block;
  padding: 0 0.3em 0 0.4em;
  border-left: 0.0667em solid grey;
}
html.msie.lt8 #login-form .form-footer li {
  display: inline;
  zoom: 1;
}
#login-form .form-footer li:first-child {
  border: none;
}

#login-form .line-login {
  background-color: #00B900;
}

#login-form .line-login:hover {
  background-color: #008600;
}

#forgot-form fieldset {
  width: 21.3em;
  margin: auto;
}

#email-form textarea,
#contact-form textarea {
  width: 57.4344em;
  height: 28.25em;
}
#contact-form ul {
  list-style-type: none;
  margin-left: 1em;
}

#customer-form textarea,
#register-form textarea {
  width: 28.3em;
}

#page-form .form-body img {
  width: auto;
  max-width: 100%;
}

#howto-form .form-body img {
  width: auto;
  max-width: 50%;
}
#howto-form .form-body ul {
  list-style-type: none;
}
#howto-form .form-body ul ol {
  margin-left: 2em;
}
#howto-form .form-body ol {
  margin-left: 1em;
}

#sitemap-form ul {
  list-style-type: none;
}
#sitemap-form ul ul {
  margin-left: 1em;
}

.frame-list .buttons {
  font-size: 0.9em;
}

#view-page-form .form-body .section {
  display: flex;
}
#view-page-form .form-body .section .column {
  flex: 1;
}
#view-page-form .form-body .section .column:after {
  content: '';
  clear: both;
}

#view-page-form .form-body .section .column img {
  width: auto;
  max-width: 100%;
}

#view-page-form .form-body ol,
#view-page-form .form-body ul {
  margin-left: 1em;
}

#view-page-form .form-body .table-of-contents ol {
  margin-left: 2em;
}

#view-page-form .form-body .table-of-contents ul {
  list-style: none;
}

#view-page-form .form-body > ul {
  margin-left: 0;
  list-style: none;
}

textarea#lab_address {
  width: 20.85em;
  margin: 0.2em;
}

/* tables */
table {
  width: 100%;
  text-align: left;
  border-collapse: collapse;
}
table th, table thead td, td.head {
  font-weight: normal;
  color: #039;
  padding: 0.22em;
  border-bottom: 2px solid #6678b1;
}
table td {
  border-bottom: 1px solid #ccc;
  color: #669;
  padding: 0.4em 0.275em;
}
table tbody {
  font-size: 0.8em;
}
table tbody tr:hover td:not(.head) {
  color: #009;
  background-color: #DDDDDD;
}
table tfoot {
  margin: 0.2em;
  text-align: center;
}
table tfoot td {
  border-bottom: none;
}
table td.qty {
  text-align: center;
}
table td.price {
  white-space: nowrap;
  text-align: right;
}
table td.ccy {
  text-align-last: right;
}
table td.ccy select {
  width: auto;
}
table tbody[data-type="total"] {
  font-weight: bold;
  font-size: 1.1em;
}
table tbody[data-type="total"] td {
  padding: 0.2em;
}
table tbody:last-child td {
  border-bottom: none;
}

table td > input[type="text"] {
  width: 100%;
}

table.dataTable thead th,
table.dataTable thead td {
  padding: 5px 10px;
}

table.fixedHeader-floating,
table.fixedHeader-locked {
  background-color: #E6E6E6;
  background: linear-gradient(45deg, #E9E9E9, #E3E3E3 35%, #E6E6E6 35%, #EDEDED);
  z-index: 1;
}

#status-table td {
  text-align: center;
}

#status-table tbody tr:hover td:not(.head) {
  cursor: pointer;
}

div.dt-buttons {
  clear: both;
}

div.dataTables_length select {
  width: auto;
}
div.dataTables_wrapper input[type="search"] {
  width: 30vw;
}

/* misc */
#print_logo {
  display: none;
  padding: 0.5em 1em;
}
#jobcard_dialog,
#invoice_dialog,
#new_lab_dialog {
  display: none;
}

a.text-button,
button.print-button,
button.cancel-button,
button.reorder-button,
button.image-button,
button.text-button,
button.dt-button {
  cursor: pointer;
  margin: 0.2em;
}
button.print-button img,
button.cancel-button img,
button.reorder-button img,
button.image-button img {
  width: 1.4em;
  height: 1.4em;
}
div.attachments .inline button.add-button,
div.attachments .inline button.delete-button {
  vertical-align: middle;
  border-radius: 0.25em 0 0 0.25em;
  border: 0.0667em solid #CCCCCC;
  height: 2.2em;
  width: 2.2em;
  font-size: 0.8em;
  margin-right: 0;
}
div.attachments .inline input {
  margin-left: 0;
  border-radius: 0 0.25em 0.25em 0;
  border-left: none;
}
a.text-button,
button.text-button,
button.dt-button {
  font-size: 1em;
  font-weight: bold;
  padding: 0.4em 1em;
  color: #FFFFFF;
  background-color: #0378A7;
  border: none;
  border-radius: 0.2em;
}
a.text-button {
  display: inline-block;
  padding: 0.2em 1em;
  text-decoration: none;
}
html.msie.lt8 a.text-button {
  display: inline;
  zoom: 1;
}

a.text-button:hover,
button.text-button:hover,
button.dt-button:hover {
  background-color: #39C6F4;
}

html.msie.lt8 div[role="dialog"] {
  background-color: #ffffff;
  padding: 0.5em;
  border: 0.2667em ridge;
}
html.msie.lt8 div[role="dialog"] button[title="Close"] {
  position: absolute;
  top: 0.3em;
  right: 0.3em;
  width: 5em;
}

#frame_image img,
#frame_shape_preview img,
#calc_dias {
  width: 26.25em;
}
#calc_dias div:last-child {
  float: right;
}
#calc_dias:after {
  content: '';
  clear: both;
}

.form-body img.info {
  cursor: pointer;
  height: 1em;
  width: 1em;
}

img[data-sku] {
  cursor: pointer;
}
#frame_dialog img {
  width: 100%;
}
#frame_dialog button.text-button {
  font-size: 1.2em;
}

.thumbnail {
  display: inline-block;
  margin: 0.25em;
}
.thumbnail img {
  width: 8em;
  vertical-align: middle;
}

.thumbnail.medium img {
  width: 12em;
}

/* JQuery UI overrides */
.ui-tooltip {
  max-width: none;
}

.ui-widget-shadow {
  box-shadow: 0 0 0.6em rgba(127, 127, 127, 0.5);
}

.ui-widget,
.ui-widget input:not([type="submit"]),
.ui-widget select,
.ui-widget textarea,
.ui-widget button {
  font-size: 0.8em;
  font-family: Helvetica, Arial, sans-serif;
}

.ui-selectmenu-button.ui-button {
  background: #FFFFFF;
  font-size: 0.8em;
  height: 1.36em;
  width: 8em;
  padding: 0.4em 0.5em 0.3em;
}

.ui-selectmenu-button.ui-button:hover {
  background: #FFFFFF;
}

.ui-selectmenu-text {
  display: inline;
  margin-right: 1em;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
}

.ui-widget.ui-widget-content,
.ui-widget-content .ui-state-active,
.ui-button,
.ui-button:active,
.ui-button:hover {
  border: 0.0667em solid #CCCCCC;
  color: #4E443C;
}

.ui-corner-all {
  border-radius: 0.25em;
}

.ui-corner-top {
  border-radius: 0.25em 0.25em 0 0;
}

.ui-tabs .ui-tabs-panel {
  padding: 0.5em 0.25em;
}

/* Info Cube */
.cubes {
  position: relative;
  margin-top: 1em;
}
.cubes img {
  display: block;
  width: 100%;
}
.cubes * {
  box-sizing: border-box;
}
.cubes:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}

.cube-wrapper {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  display: block;
  float: left;
  height: 0;
  padding-bottom: 80%;
  -webkit-perspective: 100vw;
  perspective: 100vw;
  position: relative;
  text-align: center;
  width: 100%;
  z-index: 1;
}
.cube-wrapper:hover {
  z-index: 10;
}

.cube {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  display: inline-block;
  height: 100%;
  left: 0;
  position: absolute;
  text-align: center;
  top: 0;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  width: 100%;
}

.cube-side {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  height: 100%;
  overflow: hidden;
  position: absolute;
  width: 100%;
  background: #fff;
  color: #000;
  text-align: center;
  border-radius: 0.5em;
  box-shadow: 0 0 0.6em rgba(127, 127, 127, 0.5);
}

.cube-side.front[data-page] {
  cursor: pointer;
}

.cube-side.second {
  display: none;
}

/* Tags */
/* https://github.com/Pixabay/jQuery-tagEditor */
/* surrounding tag container */
.tag-editor {
  list-style-type: none;
  padding: 0 0.4em 0 0;
  margin: 0;
  overflow: hidden;
  border: none;
}

/* core styles usually need no change */
.tag-editor li {
  display: block;
  float: left;
  overflow: hidden;
  margin: 0.2em 0;
}
.tag-editor div {
  float: left;
  padding: 0 0.2em;
}
.tag-editor .placeholder {
  padding: 0 0.4em;
  color: #bbb;
}
.tag-editor .tag-editor-spacer {
  padding: 0;
  width: 0.4em;
  overflow: hidden;
  color: transparent;
  background: none;
}
.tag-editor input {
    vertical-align: inherit; border: 0; outline: none; padding: 0; margin: 0; cursor: text;
    font-family: inherit; font-weight: inherit; font-style: inherit;
    box-shadow: none; background: none; color: #444; height: initial;
}
/* hide original input field or textarea visually to allow tab navigation */
.tag-editor-hidden-src { position: absolute !important; left: -99999px; }
/* hide IE10 "clear field" X */
.tag-editor ::-ms-clear { display: none; }

/* tag style */
.tag-editor .tag-editor-tag {
    padding-left: 0.3em;
    color: #46799b;
    background: #e0eaf1;
    white-space: nowrap;
    overflow: hidden;
    cursor: pointer;
    border-radius: 0.2em 0 0 0.2em;
    border: 0.0533em solid #ccc;
    border-right: none;
}

/* delete icon */
.tag-editor .tag-editor-delete {
  padding: 0 0.2em;
  background: #e0eaf1;
  cursor: pointer;
  border-radius: 0 0.2em 0.2em 0;
  border: 0.0533em solid #ccc;
  border-left: none;
}
.tag-editor .tag-editor-delete i { display: inline-block; }
.tag-editor .tag-editor-delete i:before { color: #8ba7ba; content: '\d7'; font-style: normal; }
.tag-editor .tag-editor-delete:hover i:before { color: #d65454; }
.tag-editor .tag-editor-tag.active+.tag-editor-delete, .tag-editor .tag-editor-tag.active+.tag-editor-delete i { visibility: hidden; cursor: text; }

.tag-editor .tag-editor-tag.active { background: none !important; }