File: D:/HostingSpaces/SBogers10/zuiderbos.komma.pro/wwwroot/packages/komma/kms/css/kms.css
/* Bourbon 4.0.2
* http://bourbon.io
* Copyright 2011-2014 thoughtbot, inc.
* MIT License */
/**
* * To use in the `<body>`.
* *
* * Outputs `font-size` and `line-height`.
* *
* * @param {number} $font-size ($sgl-base-font-size) - Base font size
* * @param {Boolean} $rem (false) - Outputs rem units if `true`
* *
* * @example scss
* * body {
* * @include gridlover-body($sgl-base-font-size, true);
* * }
* * @example css
* * body {
* * font-size: 18px;
* * line-height: 22px;
* * font-size: 1.125rem;
* * line-height: 1.375rem;
* * }
* */
/**
* * To use in headings `<h1> - <h4>`.
* *
* * Outputs `font-size`, `line-height`, `margin-bottom` and `margin-top`.
* *
* * @param {number} $step -
* * `<h1>` → `$step: 3`
* *
* * `<h2>` → `$step: 2`
* *
* * `<h3>` → `$step: 1`
* *
* * `<h4>` → `$step: 0`
* *
* * @param {Boolean} $rem (false) - Outputs rem units if `true`
* *
* * @example scss
* * h1 {
* * @include gridlover-heading(3, true);
* * }
* * h2 {
* * @include gridlover-heading(2, true);
* * }
* * h3 {
* * @include gridlover-heading(1, true);
* * }
* * h4 {
* * @include gridlover-heading(0, true);
* * }
* * @example css
* * h1 {
* * font-size: 76px;
* * line-height: 88px;
* * margin-bottom: 22px;
* * margin-top: 44px;
* * font-size: 4.75rem;
* * line-height: 5.5rem;
* * margin-bottom: 1.375rem;
* * margin-top: 2.75rem;
* * }
* *
* * h2 {
* * font-size: 47px;
* * line-height: 66px;
* * margin-bottom: 22px;
* * margin-top: 44px;
* * font-size: 2.9375rem;
* * line-height: 4.125rem;
* * margin-bottom: 1.375rem;
* * margin-top: 2.75rem;
* * }
* *
* * h3 {
* * font-size: 29px;
* * line-height: 44px;
* * margin-bottom: 22px;
* * margin-top: 22px;
* * font-size: 1.8125rem;
* * line-height: 2.75rem;
* * margin-bottom: 1.375rem;
* * margin-top: 1.375rem;
* * }
* *
* * h4 {
* * font-size: 18px;
* * line-height: 22px;
* * margin-bottom: 22px;
* * margin-top: 22px;
* * font-size: 1.125rem;
* * line-height: 1.375rem;
* * margin-bottom: 1.375rem;
* * margin-top: 1.375rem;
* * }
* */
/**
* * To use in `<p>`, `<ul>`, `<ol>`, `<pre>`, `<table>`, `<blockquote>`, etc.
* *
* * Outputs `margin-bottom` and `margin-top`.
* *
* * @param {Boolean} $rem (false) - Outputs rem units if `true`
* *
* * @example scss
* * p, ul, ol, pre, table, blockquote {
* * @include sassy-gridlover-margins(true);
* * }
* * @example css
* * p, ul, ol, pre, table, blockquote {
* * margin-bottom: 22px;
* * margin-top: 22px;
* * margin-bottom: 1.375rem;
* * margin-top: 1.375rem;
* * }
* */
@import "wickedpicker.min.css";
.small-profile {
margin-top: 30px;
height: 90px;
margin-bottom: 30px;
}
.small-profile img.small-profile-image {
border-radius: 100%;
float: left;
margin-right: 30px;
height: 90px;
}
.small-profile p.small-profile-name {
margin-bottom: 10px;
}
.small-profile p.small-profile-description {
font-size: 15px;
line-height: 1.5em;
color: #70778c;
}
.inline {
display: inline;
}
/*! normalize.css v3.0.2 | MIT License | git.io/normalize */
html {
font-family: sans-serif;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
}
body {
margin: 0;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
display: block;
}
audio,
canvas,
progress,
video {
display: inline-block;
vertical-align: baseline;
}
audio:not([controls]) {
display: none;
height: 0;
}
[hidden],
template {
display: none;
}
a {
background-color: transparent;
}
a:active,
a:hover {
outline: 0;
}
abbr[title] {
border-bottom: 1px dotted;
}
b,
strong {
font-weight: bold;
}
dfn {
font-style: italic;
}
h1 {
font-size: 2em;
margin: 0.67em 0;
}
mark {
background: #ff0;
color: #000;
}
small {
font-size: 80%;
}
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -0.5em;
}
sub {
bottom: -0.25em;
}
img {
border: 0;
}
svg:not(:root) {
overflow: hidden;
}
figure {
margin: 1em 40px;
}
hr {
-moz-box-sizing: content-box;
box-sizing: content-box;
height: 0;
}
pre {
overflow: auto;
}
code,
kbd,
pre,
samp {
font-family: monospace, monospace;
font-size: 1em;
}
button,
input,
optgroup,
select,
textarea {
color: inherit;
font: inherit;
margin: 0;
}
button {
overflow: visible;
}
button,
select {
text-transform: none;
}
button,
html input[type=button],
input[type=reset],
input[type=submit] {
cursor: pointer;
-webkit-appearance: button;
}
button[disabled],
html input[disabled] {
cursor: default;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0;
}
input {
line-height: normal;
}
input[type=checkbox],
input[type=radio] {
box-sizing: border-box;
padding: 0;
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
height: auto;
}
input[type=search] {
-webkit-appearance: textfield;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
}
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
-webkit-appearance: none;
}
fieldset {
border: 1px solid #c0c0c0;
margin: 0 2px;
padding: 0.35em 0.625em 0.75em;
}
legend {
border: 0;
padding: 0;
}
textarea {
overflow: auto;
}
optgroup {
font-weight: bold;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
td,
th {
padding: 0;
}
.text-muted {
color: #9ba0ae;
}
.text-primary {
color: #3289ff;
}
.text-success {
color: #3c763d;
}
.text-info {
color: #31708f;
}
.text-warning {
color: #ff8d00;
}
.text-danger {
color: #f2303f;
}
.text-light {
color: #9ba0ae;
font-weight: 300;
}
h1, h2, h3, h4 {
font-weight: 400;
}
h1 {
font-size: 36px;
line-height: 60px;
margin-bottom: 30px;
margin-top: 60px;
}
h2 {
font-size: 27px;
line-height: 30px;
margin-bottom: 30px;
margin-top: 60px;
}
h3 {
font-size: 20px;
line-height: 30px;
margin-bottom: 30px;
margin-top: 30px;
}
h4 {
font-size: 15px;
line-height: 30px;
margin-bottom: 30px;
margin-top: 30px;
}
.btn {
display: inline-block;
padding: 6px 12px;
margin-bottom: 0;
font-size: 15px;
font-weight: 600;
line-height: 2em;
text-align: center;
white-space: nowrap;
vertical-align: middle;
-ms-touch-action: manipulation;
touch-action: manipulation;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-image: none;
border: 1px solid transparent;
border-radius: 4px;
text-decoration: none;
background: -webkit-linear-gradient(top, #c2c5c6 12%, #c2c5c6 50%, #babdc0 51%, #babdc0 100%);
background: linear-gradient(to bottom, #c2c5c6 12%, #c2c5c6 50%, #babdc0 51%, #babdc0 100%);
color: #ffffff;
}
.btn img {
position: relative;
height: 15px;
vertical-align: baseline;
top: 2px;
}
.btn.btn-success-glow {
background: -webkit-linear-gradient(top, #59db81 12%, #59db81 50%, #5bd282 51%, #5bd282 100%);
background: linear-gradient(to bottom, #59db81 12%, #59db81 50%, #5bd282 51%, #5bd282 100%);
}
.btn.btn-warning-glow {
background: -webkit-linear-gradient(top, #fd9825 12%, #fd9825 50%, #fa7a27 51%, #fa7a27 100%);
background: linear-gradient(to bottom, #fd9825 12%, #fd9825 50%, #fa7a27 51%, #fa7a27 100%);
}
.btn.btn-brand-glow {
background: -webkit-linear-gradient(top, #3289ff 12%, #3289ff 50%, #2a7eec 51%, #2a7eec 100%);
background: linear-gradient(to bottom, #3289ff 12%, #3289ff 50%, #2a7eec 51%, #2a7eec 100%);
}
.btn.btn-error-glow {
background: -webkit-linear-gradient(top, #f2303f 12%, #f2303f 50%, #da2e3d 51%, #da2e3d 100%);
background: linear-gradient(to bottom, #f2303f 12%, #f2303f 50%, #da2e3d 51%, #da2e3d 100%);
}
.btn.btn-danger {
background: #f2303f;
}
.btn-save {
width: 160px;
font-weight: bold;
text-transform: uppercase;
}
.btn.btn-trash {
width: 44px;
height: 44px;
background-image: url("../img/structure/icon_trash.svg");
background-repeat: no-repeat;
background-position: 50% 50%;
background-size: 16px 16px;
}
body {
font-size: 15px;
line-height: 30px;
color: #32343a;
font-family: "Titillium Web", sans-serif;
line-height: 2em;
background-color: #d8dae2;
background-image: url("../img/background_home.jpg");
scrollbar-face-color: #3289ff;
scrollbar-track-color: rgba(43, 43, 49, 0.2);
}
::-webkit-scrollbar {
width: 7px;
height: 7px;
}
::-webkit-scrollbar-thumb {
background: #3289ff;
border-radius: 5px;
}
::-webkit-scrollbar-track {
background: rgba(43, 43, 49, 0.2);
}
#sidebar {
position: fixed;
top: 0;
bottom: 0;
left: 0;
height: 100%;
width: 240px;
background-color: #32343a;
}
#main {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 240px;
overflow: auto;
}
a {
color: #32343a;
}
.clear {
clear: both;
}
#sidebar #logo {
height: 110px;
width: 100%;
background-color: #3289ff;
background-image: url("../img/logo_background.svg");
background-size: cover;
-webkit-background-origin: border;
text-align: center;
letter-spacing: 0.05em;
}
#sidebar #logo a {
display: block;
width: 100%;
height: 50px;
padding: 25px 0 20px 0;
color: #ffffff;
text-decoration: none;
}
#sidebar #logo img {
height: 60px;
width: 135px;
border: none;
}
#sidebar #logo h1 {
font-size: 15px;
font-weight: 600;
color: #2b2b31;
margin: 0;
}
.sidebar-scrollable {
overflow: auto;
position: fixed;
top: 140px;
bottom: 60px;
width: 240px;
}
.sidebar-navigation ul {
display: block;
margin: 0;
padding: 0;
list-style: none;
}
.sidebar-navigation ul li {
display: block;
height: 100%;
width: 100%;
min-height: 50px;
font-size: 16px;
}
.sidebar-navigation ul li.empty-item {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
line-height: 30px;
border-bottom: solid 1px #3b3d44;
padding: 15px 15px 14px 20px;
}
.sidebar-navigation ul li a, .sidebar-navigation ul li > p {
display: block;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
height: 100%;
width: 100%;
padding: 15px 15px 14px 20px;
border-bottom: solid 1px #3b3e45;
font-size: 14px;
line-height: 24px;
color: #ffffff;
font-weight: 600;
text-decoration: none;
transition: all 0.3s;
}
.sidebar-navigation ul li a i.fa, .sidebar-navigation ul li > p i.fa {
float: right;
line-height: inherit;
}
.sidebar-navigation ul li a:hover, .sidebar-navigation ul li > p:hover {
background-color: #197aff;
border-color: #197aff;
color: white;
}
.sidebar-navigation ul li.active > a {
background-color: #3289ff;
border-color: #3289ff;
color: white;
}
.sidebar-navigation ul li ul.sub-menu {
display: block;
position: relative;
float: none;
box-shadow: inset 0px 10px 10px -10px rgba(0, 0, 0, 0.7);
background-color: #2b2b31;
border: none;
transition: all 0.3s;
overflow: hidden;
height: 0px;
}
.sidebar-navigation ul li ul.sub-menu .sub-menu {
background-color: #1f1f23;
}
.sidebar-navigation ul li ul.sub-menu .sub-menu li > a {
text-indent: 30px;
}
.sidebar-navigation ul li.active > ul.sub-menu, .sidebar-navigation ul li.open > ul.sub-menu {
height: auto;
}
.sidebar-navigation ul li.toggle-ul.active > a, .sidebar-navigation ul li.toggle-ul:hover > a {
background-color: transparent;
border-color: #3b3e45;
}
.sidebar-navigation ul li.toggle-ul > a {
background-color: transparent;
}
.sidebar-navigation ul li.toggle-ul > a:after {
content: "";
-webkit-transition: -webkit-transform 0.2s;
-moz-transition: -moz-transform 0.2s;
transition: transform 0.2s;
-webkit-transform-origin: 50% 30%;
-moz-transform-origin: 50% 30%;
-ms-transform-origin: 50% 30%;
-o-transform-origin: 50% 30%;
transform-origin: 50% 30%;
background-image: url("/packages/komma/kms/img/structure/icon_triangle_down_grey.svg");
background-size: contain;
background-repeat: no-repeat;
height: 7px;
width: 10px;
display: inline-block;
margin-left: 10px;
}
.sidebar-navigation ul li.toggle-ul.active > a:after {
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
}
.sidebar-navigation ul li.toggle-ul.active-child > a {
background-color: #325f9d;
}
.sidebar-navigation ul li.margin-top {
margin-top: 20px;
}
.sidebar-navigation ul li.open > a, .sidebar-navigation ul li.open > p, .sidebar-navigation ul li.label > a, .sidebar-navigation ul li.label > p {
background-color: transparent;
border-color: #3b3d44;
font-weight: 200;
color: #949494;
font-size: 14px;
cursor: default;
}
.sidebar-navigation ul li.group {
min-height: 0;
}
.sidebar-navigation ul li.label > p {
margin: 20px 0 0;
padding-bottom: 5px;
min-height: 50px;
}
.sidebar-navigation ul li li > a {
text-indent: 15px;
}
.sidebar-navigation ul li.selector {
height: 110px;
padding: 50px 20px 20px;
min-height: 0;
overflow: hidden;
box-sizing: border-box;
transition: all 0.3s;
position: relative;
}
.sidebar-navigation ul li.selector:before {
content: "School";
position: absolute;
top: 30px;
left: 35px;
font-size: 12px;
line-height: 14px;
color: white;
}
.sidebar-navigation ul li.selector p {
background-color: #2b2b31;
margin: 0;
height: 40px;
border-radius: 10px;
position: relative;
z-index: 10;
font-size: 13px;
padding: 9px 15px;
}
.sidebar-navigation ul li.selector p:after {
content: "";
background-image: url("/packages/komma/kms/img/structure/icon_triangle_down_grey.svg");
background-size: contain;
background-repeat: no-repeat;
height: 7px;
width: 10px;
display: inline-block;
position: absolute;
right: 10px;
top: 19px;
transform: rotate(0deg);
transform-origin: 50% 30%;
transition: all 0.3s;
}
.sidebar-navigation ul li.selector ul {
margin-top: -50px;
padding-top: 10px;
background-color: #2b2b31;
border-radius: 0 0 10px 10px;
opacity: 0;
transition: all 0.3s;
}
.sidebar-navigation ul li.selector ul li {
color: #949494;
padding: 10px 15px;
min-height: 0;
height: 20px;
width: 170px;
font-size: 14px;
line-height: 16px;
cursor: pointer;
transition: color 0.3s;
}
.sidebar-navigation ul li.selector ul li:hover {
color: white;
}
.sidebar-navigation ul li.selector.active {
height: 510px;
}
.sidebar-navigation ul li.selector.active p {
border-bottom-color: #3289ff;
}
.sidebar-navigation ul li.selector.active p:after {
transform: rotate(180deg);
}
.sidebar-navigation ul li.selector.active ul {
margin-top: -10px;
opacity: 1;
}
.sidebar-navigation.sidebar-navigation-bottom {
position: absolute;
bottom: 0px;
width: 100%;
background-color: #32343a;
}
.sidebar-navigation.sidebar-navigation-bottom ul li a {
border-bottom: none;
border-top: solid 1px #3b3e45;
}
.entities {
position: absolute;
top: 0;
bottom: 0;
left: 0;
height: 100%;
width: 380px;
margin: 0 10px;
background-color: #ffffff;
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);
}
.entities .entities-header {
height: 180px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding-top: 40px;
border-bottom: 1px solid #e0e6ec;
text-align: center;
}
.entities .entities-header h1 {
font-weight: 400;
color: #3289ff;
margin-bottom: 5px;
margin-top: -8px;
}
.entities .entities-header h2 {
margin-top: 0px;
margin-bottom: 0;
font-size: 16px;
padding-right: 25px;
}
.entities .entities-search {
height: 60px;
border-bottom: 1px solid #e0e6ec;
line-height: 60px;
cursor: text;
background-color: #f4f5f7;
background-image: url("../img/structure/icon_search.svg");
background-repeat: no-repeat;
background-position: 7px center;
}
.entities .entities-search input {
width: 100%;
height: 60px;
padding: 0px;
margin: 0px;
border: 0px;
line-height: 25px;
text-indent: 90px;
background-color: transparent;
-webkit-transition: border-color ease-in-out 0.25s, box-shadow ease-in-out 0.25s;
-moz-transition: border-color ease-in-out 0.25s, box-shadow ease-in-out 0.25s;
transition: border-color ease-in-out 0.25s, box-shadow ease-in-out 0.25s;
}
.entities .entities-search input:focus {
border-color: #3c8bf5;
outline: 0;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), inset 0 0 12px rgba(120, 169, 236, 0.3);
}
.entities .entities-list {
position: absolute;
width: 100%;
top: 303px;
bottom: 45px;
overflow-y: auto;
overflow-x: hidden;
}
.entities .entities-list.no-add {
top: 240px;
}
.entities .entities-list.no-order {
bottom: 0;
}
.entities .entities-order {
position: absolute;
width: 100%;
height: 45px;
line-height: 45px;
bottom: 0;
text-align: center;
border-top: solid 1px #e0e6ec;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.entities .entities-order a {
display: block;
width: 100%;
height: 100%;
text-decoration: none;
color: #3289ff;
font-size: 15px;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
.entities .entities-order a.save {
background: #3289ff;
color: white;
}
.entities .entities-order a.save:before {
background-image: url("../img/structure/icon_save_order.svg");
background-size: contain;
background-repeat: no-repeat;
}
.entities .entities-order a:before {
content: "";
display: inline-block;
width: 19px;
height: 23px;
background-image: url("../img/structure/icon_reorder.svg");
background-size: contain;
background-repeat: no-repeat;
vertical-align: middle;
margin-right: 10px;
}
.entities .entities-list-items > ul {
background-image: -webkit-linear-gradient(#f4f5f7 50%, transparent 50%, transparent);
background-image: linear-gradient(to , transparent 50%, transparent);
background-size: 120px 120px;
margin: 0;
padding: 0;
}
.entities .entities-list-items > ul ul {
margin: 0;
display: none;
}
.entities .entities-list-items > ul .open > ul {
height: auto;
display: block;
}
.entities .entities-list-item {
line-height: 19.5px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
transition: all 0.3s;
cursor: pointer;
margin: 0;
list-style: none;
display: table;
width: 100%;
height: 60px;
white-space: nowrap;
}
.entities .entities-list-item.active > div {
background-color: #348aff;
color: white;
}
.entities .entities-list-item.active > div sub {
color: white;
}
.entities .entities-list-item.entities-new > a:hover {
background-color: #3289ff;
color: #fff;
}
.entities .entities-list-item.entities-new > a:hover .blue {
color: #fff;
font-weight: bold;
}
.entities .entities-list-item .list-entity-title {
display: block;
white-space: normal;
font-size: 17px;
margin-top: 2px;
margin-bottom: 3px;
font-weight: bold;
}
.entities .entities-list-item .list-entity-subtitle {
display: block;
font-size: 14px;
white-space: normal;
}
.entities .entities-list-item .list-entity-subtitle.blue {
color: #3289ff;
}
.entities .entities-list-item .small {
font-size: 14px;
}
.entities .entities-list-item > a {
position: relative;
display: table;
width: 100%;
text-decoration: none;
color: #32343a;
padding: 15px 0;
}
.entities .entities-list-item > a .dropdown-icon {
position: absolute;
display: block;
width: 10px;
height: 5px;
top: 0;
right: 30px;
}
.entities .entities-list-item > a .dropdown-icon img {
position: relative;
top: 5px;
padding: 5px;
}
.entities .entities-list-item > a:hover {
background: #e9eef2;
border-color: #d8dae2;
color: #438eb9;
}
.entities .entities-list-item > a:hover .blue {
color: #438eb9;
font-weight: bold;
}
.entities .entities-list-item.small {
height: 45px;
}
.entities .entities-list-item.small > a {
padding: 9px 0;
}
.entities .entities-list-item.small .entities-item-pre .entities-item-thumb, .entities .entities-list-item.small .entities-item-pre img {
height: 25px;
width: 25px;
line-height: 25px;
font-size: 13px;
}
.entities .entities-list-item.active > a {
color: #ffffff;
background-color: #3289ff;
border-bottom: 1px solid #3289ff;
}
.entities .entities-list-item.active > a .blue {
color: #fff;
font-weight: bold;
}
.entities .entities-list-item.active > a sub {
color: white;
}
.entities li.entities-list-item {
display: block;
padding: 0;
height: auto;
}
.entities li.entities-list-item > a {
position: relative;
display: block;
height: 60px;
width: 100%;
line-height: 60px;
text-decoration: none;
color: #32343a;
padding: 0;
padding-left: 100%;
left: -100%;
}
.entities li.entities-list-item .entities-item-pre {
position: relative;
top: 15px;
}
.entities li.entities-list-item .entities-item-text {
width: auto;
float: none;
display: inline;
}
.entities li.entities-list-item:nth-of-type(even) {
background-color: #f4f5f7;
}
.entities div.entities-list-item:nth-child(odd) {
background-color: #f4f5f7;
}
.entities div.entities-list-item.entities-new {
background-color: #ffffff;
}
.entities .entities-item-text {
display: inline-block;
width: 320px;
margin-top: 5px;
}
.entities .entities-item-text::after {
clear: both;
content: "";
display: table;
}
.entities .entities-item-text sub {
display: block;
margin-top: 6px;
color: #9e9e9e;
}
.entities .entities-item-pre {
display: inline-block;
height: 100%;
width: 60px;
text-align: center;
vertical-align: top;
}
.entities .entities-item-pre .entities-item-thumb, .entities .entities-item-pre img {
display: block;
height: 30px;
width: 30px;
border-radius: 30px;
margin: 0 auto;
background-color: #d8dae2;
line-height: 30px;
font-size: 16px;
font-weight: 700;
color: #9ba0ae;
overflow: hidden;
}
.entities .entities-item-pre .entities-item-plus {
display: block;
height: 30px;
width: 30px;
border-radius: 30px;
border: 1px solid #3289ff;
margin: 0 auto;
background-color: #ffffff;
background-image: url("../img/structure/icon_plus.svg");
background-repeat: no-repeat;
}
.entities .entities-item-pre img {
background-color: transparent;
}
.entities div.entities-new {
height: 60px;
border-bottom: 1px solid #e0e6ec;
color: #3289ff;
background-color: #ffffff;
display: block;
}
.entities div.entities-new img {
border: 1px solid #3289ff;
}
.entities .entities-content-container {
position: absolute;
width: 100%;
top: 180px;
bottom: 0;
overflow: auto;
}
.entities .entities-content {
padding: 60px 30px 30px 30px;
font-size: 16px;
}
.entities .entities-content p {
margin-bottom: 15px;
}
.entities .hidden {
display: none;
}
.entities .angular-ui-tree-handle {
position: relative;
border-bottom: 1px solid #dae2ea;
font-weight: normal;
min-height: 45px;
line-height: 45px;
padding-left: 999px;
margin-left: -999px;
}
.entities .angular-ui-tree-handle .btn {
position: absolute;
right: 0;
top: 0;
height: 45px;
padding: 0 5px;
border-radius: 0;
background: rgba(0, 0, 0, 0.03);
}
.entities .angular-ui-tree-handle .btn .icon {
display: block;
width: 30px;
height: 100%;
}
.entities .angular-ui-tree-handle .btn .icon:before {
content: "";
width: 10px;
height: 100%;
display: inline-block;
background-image: url("../img/structure/icon_triangle_down.svg");
background-position: center center;
background-repeat: no-repeat;
}
.entities .angular-ui-tree-handle .entities-item-thumb {
margin-top: -7px;
}
.entities .angular-ui-tree-handle:hover {
color: #438eb9;
background: #e9eef2;
border-color: #d8dae2;
}
.entities .angular-ui-tree-placeholder {
border: 1px dashed #bed2db;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
margin: 0;
}
.angular-ui-tree-drag .btn, .angular-ui-tree-drag .entities-item-thumb {
display: none;
}
.entities .angular-ui-tree-handle {
cursor: pointer;
}
.entities .sorting .angular-ui-tree-handle {
cursor: move;
}
.entities .sorting li.entities-list-item {
-webkit-animation: shake1 1.5s infinite alternate;
-moz-animation: shake1 1.5s infinite alternate;
animation: shake1 1.5s infinite alternate;
}
.entities .sorting li.entities-list-item:nth-child(odd) {
-webkit-animation: shake2 1.5s infinite alternate;
-moz-animation: shake2 1.5s infinite alternate;
animation: shake2 1.5s infinite alternate;
}
@-webkit-keyframes shake1 {
0% {
-webkit-transform: translate(0.5px, 0.25px);
}
10% {
-webkit-transform: translate(-0.25px, -0.5px);
}
20% {
-webkit-transform: translate(-0.75px, 0px);
}
30% {
-webkit-transform: translate(0px, 0.5px);
}
40% {
-webkit-transform: translate(0.25px, -0.25px);
}
50% {
-webkit-transform: translate(-0.25px, 0.5px);
}
60% {
-webkit-transform: translate(-0.75px, 0.25px);
}
70% {
-webkit-transform: translate(0.5px, 0.25px);
}
80% {
-webkit-transform: translate(-0.25px, -0.25px);
}
90% {
-webkit-transform: translate(0.5px, 0.5px);
}
100% {
-webkit-transform: translate(0.25px, -0.5px);
}
}
@-moz-keyframes shake1 {
0% {
-moz-transform: translate(0.5px, 0.25px);
}
10% {
-moz-transform: translate(-0.25px, -0.5px);
}
20% {
-moz-transform: translate(-0.75px, 0px);
}
30% {
-moz-transform: translate(0px, 0.5px);
}
40% {
-moz-transform: translate(0.25px, -0.25px);
}
50% {
-moz-transform: translate(-0.25px, 0.5px);
}
60% {
-moz-transform: translate(-0.75px, 0.25px);
}
70% {
-moz-transform: translate(0.5px, 0.25px);
}
80% {
-moz-transform: translate(-0.25px, -0.25px);
}
90% {
-moz-transform: translate(0.5px, 0.5px);
}
100% {
-moz-transform: translate(0.25px, -0.5px);
}
}
@keyframes shake1 {
0% {
-webkit-transform: translate(0.5px, 0.25px);
-moz-transform: translate(0.5px, 0.25px);
-ms-transform: translate(0.5px, 0.25px);
-o-transform: translate(0.5px, 0.25px);
transform: translate(0.5px, 0.25px);
}
10% {
-webkit-transform: translate(-0.25px, -0.5px);
-moz-transform: translate(-0.25px, -0.5px);
-ms-transform: translate(-0.25px, -0.5px);
-o-transform: translate(-0.25px, -0.5px);
transform: translate(-0.25px, -0.5px);
}
20% {
-webkit-transform: translate(-0.75px, 0px);
-moz-transform: translate(-0.75px, 0px);
-ms-transform: translate(-0.75px, 0px);
-o-transform: translate(-0.75px, 0px);
transform: translate(-0.75px, 0px);
}
30% {
-webkit-transform: translate(0px, 0.5px);
-moz-transform: translate(0px, 0.5px);
-ms-transform: translate(0px, 0.5px);
-o-transform: translate(0px, 0.5px);
transform: translate(0px, 0.5px);
}
40% {
-webkit-transform: translate(0.25px, -0.25px);
-moz-transform: translate(0.25px, -0.25px);
-ms-transform: translate(0.25px, -0.25px);
-o-transform: translate(0.25px, -0.25px);
transform: translate(0.25px, -0.25px);
}
50% {
-webkit-transform: translate(-0.25px, 0.5px);
-moz-transform: translate(-0.25px, 0.5px);
-ms-transform: translate(-0.25px, 0.5px);
-o-transform: translate(-0.25px, 0.5px);
transform: translate(-0.25px, 0.5px);
}
60% {
-webkit-transform: translate(-0.75px, 0.25px);
-moz-transform: translate(-0.75px, 0.25px);
-ms-transform: translate(-0.75px, 0.25px);
-o-transform: translate(-0.75px, 0.25px);
transform: translate(-0.75px, 0.25px);
}
70% {
-webkit-transform: translate(0.5px, 0.25px);
-moz-transform: translate(0.5px, 0.25px);
-ms-transform: translate(0.5px, 0.25px);
-o-transform: translate(0.5px, 0.25px);
transform: translate(0.5px, 0.25px);
}
80% {
-webkit-transform: translate(-0.25px, -0.25px);
-moz-transform: translate(-0.25px, -0.25px);
-ms-transform: translate(-0.25px, -0.25px);
-o-transform: translate(-0.25px, -0.25px);
transform: translate(-0.25px, -0.25px);
}
90% {
-webkit-transform: translate(0.5px, 0.5px);
-moz-transform: translate(0.5px, 0.5px);
-ms-transform: translate(0.5px, 0.5px);
-o-transform: translate(0.5px, 0.5px);
transform: translate(0.5px, 0.5px);
}
100% {
-webkit-transform: translate(0.25px, -0.5px);
-moz-transform: translate(0.25px, -0.5px);
-ms-transform: translate(0.25px, -0.5px);
-o-transform: translate(0.25px, -0.5px);
transform: translate(0.25px, -0.5px);
}
}
@-webkit-keyframes shake2 {
0% {
-webkit-transform: translate(0.25px, -0.5px);
}
10% {
-webkit-transform: translate(0.5px, 0.5px);
}
20% {
-webkit-transform: translate(-0.25px, -0.25px);
}
30% {
-webkit-transform: translate(0.5px, 0.25px);
}
40% {
-webkit-transform: translate(-0.75px, 0.25px);
}
50% {
-webkit-transform: translate(-0.25px, 0.5px);
}
60% {
-webkit-transform: translate(0.25px, -0.25px);
}
70% {
-webkit-transform: translate(0px, 0.5px);
}
80% {
-webkit-transform: translate(-0.75px, 0px);
}
90% {
-webkit-transform: translate(-0.25px, -0.5px);
}
100% {
-webkit-transform: translate(0.5px, 0.25px);
}
}
@-moz-keyframes shake2 {
0% {
-moz-transform: translate(0.25px, -0.5px);
}
10% {
-moz-transform: translate(0.5px, 0.5px);
}
20% {
-moz-transform: translate(-0.25px, -0.25px);
}
30% {
-moz-transform: translate(0.5px, 0.25px);
}
40% {
-moz-transform: translate(-0.75px, 0.25px);
}
50% {
-moz-transform: translate(-0.25px, 0.5px);
}
60% {
-moz-transform: translate(0.25px, -0.25px);
}
70% {
-moz-transform: translate(0px, 0.5px);
}
80% {
-moz-transform: translate(-0.75px, 0px);
}
90% {
-moz-transform: translate(-0.25px, -0.5px);
}
100% {
-moz-transform: translate(0.5px, 0.25px);
}
}
@keyframes shake2 {
0% {
-webkit-transform: translate(0.25px, -0.5px);
-moz-transform: translate(0.25px, -0.5px);
-ms-transform: translate(0.25px, -0.5px);
-o-transform: translate(0.25px, -0.5px);
transform: translate(0.25px, -0.5px);
}
10% {
-webkit-transform: translate(0.5px, 0.5px);
-moz-transform: translate(0.5px, 0.5px);
-ms-transform: translate(0.5px, 0.5px);
-o-transform: translate(0.5px, 0.5px);
transform: translate(0.5px, 0.5px);
}
20% {
-webkit-transform: translate(-0.25px, -0.25px);
-moz-transform: translate(-0.25px, -0.25px);
-ms-transform: translate(-0.25px, -0.25px);
-o-transform: translate(-0.25px, -0.25px);
transform: translate(-0.25px, -0.25px);
}
30% {
-webkit-transform: translate(0.5px, 0.25px);
-moz-transform: translate(0.5px, 0.25px);
-ms-transform: translate(0.5px, 0.25px);
-o-transform: translate(0.5px, 0.25px);
transform: translate(0.5px, 0.25px);
}
40% {
-webkit-transform: translate(-0.75px, 0.25px);
-moz-transform: translate(-0.75px, 0.25px);
-ms-transform: translate(-0.75px, 0.25px);
-o-transform: translate(-0.75px, 0.25px);
transform: translate(-0.75px, 0.25px);
}
50% {
-webkit-transform: translate(-0.25px, 0.5px);
-moz-transform: translate(-0.25px, 0.5px);
-ms-transform: translate(-0.25px, 0.5px);
-o-transform: translate(-0.25px, 0.5px);
transform: translate(-0.25px, 0.5px);
}
60% {
-webkit-transform: translate(0.25px, -0.25px);
-moz-transform: translate(0.25px, -0.25px);
-ms-transform: translate(0.25px, -0.25px);
-o-transform: translate(0.25px, -0.25px);
transform: translate(0.25px, -0.25px);
}
70% {
-webkit-transform: translate(0px, 0.5px);
-moz-transform: translate(0px, 0.5px);
-ms-transform: translate(0px, 0.5px);
-o-transform: translate(0px, 0.5px);
transform: translate(0px, 0.5px);
}
80% {
-webkit-transform: translate(-0.75px, 0px);
-moz-transform: translate(-0.75px, 0px);
-ms-transform: translate(-0.75px, 0px);
-o-transform: translate(-0.75px, 0px);
transform: translate(-0.75px, 0px);
}
90% {
-webkit-transform: translate(-0.25px, -0.5px);
-moz-transform: translate(-0.25px, -0.5px);
-ms-transform: translate(-0.25px, -0.5px);
-o-transform: translate(-0.25px, -0.5px);
transform: translate(-0.25px, -0.5px);
}
100% {
-webkit-transform: translate(0.5px, 0.25px);
-moz-transform: translate(0.5px, 0.25px);
-ms-transform: translate(0.5px, 0.25px);
-o-transform: translate(0.5px, 0.25px);
transform: translate(0.5px, 0.25px);
}
}
.entity {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 400px;
background-color: #32343a;
}
.entity.full-width {
left: 30px;
}
.entity.no-tabs .entity-tabs, .entity.no-tabs .sub-tabs {
display: none;
}
.entity .entity-header {
height: 180px;
width: 100%;
display: block;
background-color: #2b2b31;
box-shadow: inset 0px -20px 20px -20px rgba(0, 0, 0, 0.5);
}
.entity .entity-header .entity-thumbnail {
position: relative;
height: 100px;
width: 100px;
overflow: hidden;
float: left;
margin-left: 60px;
margin-top: 40px;
border: solid 1px #ffffff;
border-radius: 10px;
background-color: #ccc;
line-height: 100px;
text-align: center;
font-size: 32px;
font-weight: bold;
color: #999;
}
.entity .entity-header .entity-thumbnail img {
height: 100px;
width: 100px;
}
.entity .entity-header .entity-thumbnail:after {
content: "";
position: absolute;
display: block;
height: 90px;
width: 90px;
top: 0;
z-index: 5;
background: -webkit-linear-gradient(135deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0) 51%, rgba(255, 255, 255, 0) 100%);
background: linear-gradient(135deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0) 51%, rgba(255, 255, 255, 0) 100%);
}
.entity .entity-header .entity-title {
position: absolute;
right: 250px;
left: 190px;
display: block;
font-size: 27px;
line-height: 30px;
margin-bottom: 30px;
margin-top: 60px;
color: #ffffff;
}
.entity .entity-header .entity-title sub {
bottom: 0;
opacity: 0.6;
margin-right: 20px;
}
.entity .entity-header .entity-buttons {
position: absolute;
top: 0;
right: 0;
position: absolute;
width: 250px;
padding-top: 100px;
}
.entity .entity-tabs, .entity .sub-tabs {
width: 100%;
height: 60px;
background-color: #32343a;
box-shadow: inset 0px 20px 20px -20px rgba(255, 255, 255, 0.1);
}
.entity .entity-tabs ul, .entity .sub-tabs ul {
margin: 0px;
padding: 0px;
padding-left: 40px;
list-style: none;
}
.entity .entity-tabs ul li, .entity .sub-tabs ul li {
background-color: #999;
float: left;
margin: 20px 5px 0px 5px;
height: 40px;
line-height: 40px;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
}
.entity .entity-tabs ul li a, .entity .sub-tabs ul li a {
display: block;
height: 100%;
width: 100%;
color: #ffffff;
font-weight: 600;
font-size: 15px;
line-height: 40px;
text-transform: uppercase;
text-decoration: none;
padding: 0 20px;
}
.entity .entity-tabs ul li.active, .entity .sub-tabs ul li.active {
background-color: #ffffff;
}
.entity .entity-tabs ul li.active a, .entity .sub-tabs ul li.active a {
color: #32343a;
}
.entity .entity-tabs ul li.error a, .entity .sub-tabs ul li.error a {
color: #f2303f;
}
.entity .sub-tabs {
background-color: #f4f5f7;
box-shadow: inset 0px 15px 15px -15px rgba(0, 0, 0, 0.15);
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.entity-messages {
line-height: 60px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background-color: #f2303f;
}
.entity-messages .label {
position: absolute;
display: block;
width: 200px;
margin-left: 30px;
font-size: 13px;
color: #ffffff;
text-transform: uppercase;
font-weight: 600;
}
.entity-messages .messages {
padding-left: 230px;
width: 100%;
}
.entity-messages .messages ul {
list-style-type: none;
margin: 0;
padding: 15px 0;
line-height: 30px;
}
.entity-messages .messages ul li {
height: 30px;
font-size: 13px;
background-image: url("../img/structure/icon_cross.svg");
background-size: 6px 6px;
background-repeat: no-repeat;
background-position: 0 center;
color: #ffffff;
padding-left: 12px;
font-weight: 600;
}
.tab-content, .sub-tab-content {
display: none;
}
.tab-content:first-child, .sub-tab-content:first-child {
display: block;
}
.tab-content {
padding-bottom: 150px;
}
#tab-content-dynamische-blokken {
padding-bottom: 0;
}
.dashboard {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 400px;
background-color: #32343a;
}
.entity-attributes {
position: absolute;
top: 240px;
bottom: 0;
width: 100%;
overflow: auto;
background-color: #ffffff;
}
.entity-attribute {
position: relative;
min-height: 61px;
border-bottom: 1px solid #e0e6ec;
line-height: 60px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.entity-attribute p {
line-height: 1.4;
}
.entity-attribute label {
position: absolute;
display: block;
width: 200px;
margin-left: 30px;
font-size: 13px;
color: #9ba0ae;
text-transform: uppercase;
font-weight: 600;
}
.entity-attribute.error {
border: 1px solid #f2303f;
}
.entity-attribute.error label {
color: #f2303f;
}
.entity-attribute.hidden {
display: none;
}
.entity-attribute .content {
position: relative;
padding-left: 230px;
padding-right: 15px;
line-height: 30px;
padding-top: 15px;
padding-bottom: 15px -1;
background-color: transparent;
border: 0;
display: block;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.message.error {
color: #f2303f;
}
.entity-attribute-editable-rows table {
border-spacing: 5px;
border-collapse: separate;
}
.entity-attribute-editable-rows table th {
text-align: left;
}
.entity-attribute-editable-rows table td input {
width: 95%;
padding: 0;
border: none;
}
.entity-attribute-editable-rows table td input.new-item-field {
border-bottom: 1px solid #d8dae2;
}
.entity-attribute-file {
padding: 0;
}
.entity-attribute-file input {
display: block;
height: 100%;
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background-color: transparent;
padding-left: 230px;
padding-top: 22.5px;
padding-bottom: 0;
border: none;
line-height: 15px;
-webkit-transition: border-color ease-in-out 0.25s, box-shadow ease-in-out 0.25s;
-moz-transition: border-color ease-in-out 0.25s, box-shadow ease-in-out 0.25s;
transition: border-color ease-in-out 0.25s, box-shadow ease-in-out 0.25s;
}
.entity-attribute-file input:focus {
border-color: #3c8bf5;
outline: 0;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), inset 0 0 12px rgba(120, 169, 236, 0.3);
}
.entity-attribute-files {
height: auto;
box-sizing: border-box;
line-height: 59px;
}
.entity-attribute-files .uploads {
display: none;
}
.entity-attribute-files .file-list {
margin-left: 230px;
box-sizing: border-box;
}
.entity-attribute-files .file-list ul {
width: 400px;
margin: 0;
padding: 0;
padding-top: 15px;
list-style: none;
line-height: 30px;
box-sizing: border-box;
}
.entity-attribute-files .file-list ul::after {
clear: both;
content: "";
display: table;
}
.entity-attribute-files .file-list ul li {
position: relative;
margin-right: 15px;
margin-bottom: 15px;
box-sizing: border-box;
display: block;
overflow: hidden;
border-bottom: 1px #E0E6EC solid;
}
.entity-attribute-files .file-list ul li a {
display: block;
height: 100%;
width: 100%;
line-height: 60px;
text-align: center;
overflow: hidden;
}
.entity-attribute-files .file-list ul li .delete {
position: absolute;
top: 0;
right: 0;
display: block;
width: 30px;
height: 30px;
cursor: pointer;
}
.entity-attribute-files .file-list ul li .delete:hover:after {
background-color: #f2303f;
}
.entity-attribute-files .file-list ul li .delete:after {
position: absolute;
border-radius: 5px;
opacity: 0.9;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
background-color: #2B2B31;
background-image: url(../img/structure/icon_trash.svg);
background-repeat: no-repeat;
background-position: 50% 50%;
background-size: 16px 16px;
}
.entity-attribute-files .file-list ul li img {
height: 100%;
width: 100%;
object-fit: cover;
overflow: hidden;
}
.entity-attribute-files .file-list ul li.new-file {
border: 2px solid #3289ff;
background: url("../img/structure/icon_plus.svg");
height: 30px;
width: 30px;
background-repeat: no-repeat;
background-position: center center;
height: 60px;
width: 60px;
overflow: hidden;
border-radius: 5px;
}
.entity-attribute-files .file-list ul li.new-file:hover:after {
content: none;
}
.entity-attribute-files .file-list ul li.new-file input {
display: block;
height: 100%;
width: 100%;
opacity: 0;
cursor: pointer;
}
.entity-attribute-images {
height: auto;
box-sizing: border-box;
line-height: 59px;
min-height: 120px;
}
.entity-attribute-images ul {
float: left;
}
.entity-attribute-images .image-list-ng {
position: relative;
}
.entity-attribute-images .image-list-ng .placeholder {
padding: 2px;
width: 50px;
height: 20px;
border: 1px solid #333;
background: #EEE;
}
.entity-attribute-images .image-list-ng span.deleteImage, .entity-attribute-images .image-list-ng span.move {
position: absolute;
height: 20px;
width: 20px;
cursor: pointer;
line-height: 10px;
text-align: center;
}
.entity-attribute-images .image-list-ng span.deleteImage {
bottom: -20px;
color: darkred;
right: 0;
font-size: 2em;
}
.entity-attribute-images .image-list-ng span.deleteImage:hover {
color: white;
background-color: darkred;
}
.entity-attribute-images .image-list-ng span.move {
position: absolute;
top: -20px;
width: 45%;
cursor: pointer;
}
.entity-attribute-images .image-list-ng span.move.move-left {
left: 0;
}
.entity-attribute-images .image-list-ng span.move.move-right {
left: auto;
right: 0;
}
.entity-attribute-images .image-list-ng span.move:hover {
color: white;
background-color: #3289ff;
}
.entity-attribute-images .uploads {
display: none;
}
.entity-attribute-images .new-image {
position: relative;
}
.entity-attribute-images .new-image.disabled:hover:after {
opacity: 0;
}
.entity-attribute-images .new-image .disable-overlay {
height: 100%;
z-index: 100;
position: absolute;
background-color: rgba(128, 128, 128, 0.5);
width: 100%;
}
.entity-attribute-images .new-image button {
cursor: pointer;
background: none;
border: none;
cursor: pointer;
height: 100%;
width: 100%;
}
.entity-attribute-images .new-image button.disabled {
backound-color: grey;
}
.entity-attribute-images .image-list {
margin-left: 230px;
box-sizing: border-box;
}
.entity-attribute-images .image-list ul {
margin: 0;
padding: 0;
padding-top: 24px;
list-style: none;
line-height: 58px;
box-sizing: border-box;
}
.entity-attribute-images .image-list ul::after {
clear: both;
content: "";
display: table;
}
.entity-attribute-images .image-list ul.sortableOptions {
padding-bottom: 12px;
float: none;
}
.entity-attribute-images .image-list ul li {
position: relative;
margin-right: 15px;
margin-bottom: 30px;
box-sizing: border-box;
display: block;
float: left;
height: 60px;
width: 60px;
position: relative;
}
.entity-attribute-images .image-list ul li.image-thumb:nth-child(2) span.left.arrow {
display: none;
}
.entity-attribute-images .image-list ul li.image-thumb:last-of-type span.right.arrow {
display: none;
}
.entity-attribute-images .image-list ul li.just-uploaded:hover:after {
position: absolute;
opacity: 0.9;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
background-color: #f2303f;
background-image: url(../img/structure/icon_trash.svg);
background-repeat: no-repeat;
background-position: 50% 50%;
background-size: 16px 16px;
}
.entity-attribute-images .image-list ul li span.image-thumb-li, .entity-attribute-images .image-list ul li span.image-thumb-span {
height: 60px;
width: 60px;
overflow: hidden;
border-radius: 5px;
cursor: pointer;
}
.entity-attribute-images .image-list ul li span.image-thumb-li:hover:after, .entity-attribute-images .image-list ul li span.image-thumb-span:hover:after {
position: absolute;
opacity: 0.9;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
background-color: #f2303f;
background-image: url(../img/structure/icon_trash.svg);
background-repeat: no-repeat;
background-position: 50% 50%;
background-size: 16px 16px;
}
.entity-attribute-images .image-list ul li span.image-thumb-span {
position: absolute;
top: 0;
}
.entity-attribute-images .image-list ul li span.arrow {
position: absolute;
z-index: 9999;
top: -40px;
cursor: pointer;
}
.entity-attribute-images .image-list ul li span.arrow.left {
left: 0;
}
.entity-attribute-images .image-list ul li span.arrow.right {
right: 0;
}
.entity-attribute-images .image-list ul li a {
display: block;
height: 100%;
width: 100%;
line-height: 60px;
text-align: center;
overflow: hidden;
}
.entity-attribute-images .image-list ul li img {
height: 100%;
width: 100%;
object-fit: cover;
overflow: hidden;
cursor: move;
}
.entity-attribute-images .image-list ul li.new-image {
border: 2px solid #3289ff;
background: url("../img/structure/icon_plus.svg");
background-repeat: no-repeat;
background-position: center center;
border-radius: 0;
position: relative;
}
.entity-attribute-images .image-list ul li.new-image input {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
.entity-attribute-images .image-list ul li.new-image:after {
content: "";
background: url("../img/structure/icon_image.svg") #7fb5ff;
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
pointer-events: none;
opacity: 0;
-webkit-transition: opacity 0.3s;
-moz-transition: opacity 0.3s;
transition: opacity 0.3s;
}
.entity-attribute-images .image-list ul li.new-image:hover {
border-color: #7fb5ff;
}
.entity-attribute-images .image-list ul li.new-image:hover:after {
opacity: 1;
}
.entity-attribute-images .image-list ul li.new-image input {
display: block;
height: 100%;
width: 100%;
opacity: 0;
cursor: pointer;
}
.entity-attribute-images .thumb {
width: 24px;
height: 24px;
float: none;
position: relative;
top: 7px;
}
.entity-attribute-images form .progress {
line-height: 15px;
display: inline-block;
width: 100px;
border: 3px groove #CCC;
}
.entity-attribute-images form .progress div {
font-size: smaller;
background: orange;
width: 0;
}
div.fileUploadError, div.fileUploadMessage {
display: block;
color: darkred;
clear: both;
}
div.fileUploadError.fileUploadMessage, div.fileUploadMessage.fileUploadMessage {
color: #006CB0;
}
div.fileUploadError .errorTable, div.fileUploadMessage .errorTable {
border-spacing: 10px;
border-collapse: separate;
line-height: 1em;
}
div.fileUploadError .errorTable th, div.fileUploadMessage .errorTable th {
text-align: left;
}
.entity-attribute-text, .entity-attribute-password {
padding: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.entity-attribute-text a, .entity-attribute-password a {
margin-left: 30px;
color: #3289ff;
}
.entity-attribute-list {
padding: 0;
}
.entity-attribute-list .content {
padding-top: 0;
padding-bottom: 0;
}
.entity-attribute-list ul {
display: block;
height: 100%;
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background-color: transparent;
padding: 0;
margin: 0;
border: none;
line-height: 60px;
list-style: none;
}
.entity-attribute-list ul li {
height: 60px;
line-height: 60px;
}
.entity-attribute-list ul li:nth-child(even) {
background-color: #f4f5f7;
}
.entity-attribute-list ul li a {
display: block;
height: 100%;
width: 100%;
text-decoration: none;
color: #32343a;
white-space: nowrap;
padding-left: 15px;
}
.entity-attribute-list ul li a:hover {
background-color: #3289ff;
}
.entity-attribute-multiselect .content {
padding-top: 11px;
padding-bottom: 11px;
}
.entity-attribute-multiselect .select2-container {
display: block;
}
.entity-attribute-multiselect .select2-container-multi .select2-choices .select2-search-field,
.entity-attribute-multiselect .select2-container-multi .select2-choices .select2-search-field input {
width: 100% !important;
}
.entity-attribute-on-off {
padding: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
line-height: 60px;
}
.entity-attribute-on-off input {
display: inline-block;
margin-top: 15px;
margin-bottom: 15px;
}
.toggle {
position: absolute;
margin-left: -9999px;
visibility: hidden;
}
.toggle + label.toggle-label {
display: inline-block;
position: relative;
cursor: pointer;
outline: none;
margin: 0;
top: 7px;
left: 230px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
/* Outer */
input.toggle-round-flat + label.toggle-label {
padding: 1px;
width: 29px;
height: 20px;
background-color: #dddddd;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
-ms-border-radius: 20px;
-o-border-radius: 20px;
border-radius: 20px;
-webkit-transition: background 0.4s;
-moz-transition: background 0.4s;
-o-transition: background 0.4s;
transition: background 0.4s;
}
input.toggle-round-flat + label.toggle-label:before, input.toggle-round-flat + label.toggle-label:after {
display: block;
position: absolute;
content: "";
}
/* Inner */
input.toggle-round-flat + label.toggle-label:before {
top: 1px;
left: 1px;
bottom: 1px;
right: 1px;
background-color: #dddddd;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
-ms-border-radius: 20px;
-o-border-radius: 20px;
border-radius: 20px;
-webkit-transition: background 0.4s;
-moz-transition: background 0.4s;
-o-transition: background 0.4s;
transition: background 0.4s;
}
/* Circle */
input.toggle-round-flat + label.toggle-label:after {
top: 2px;
left: 2px;
bottom: 2px;
width: 16px;
background-color: #fff;
-webkit-border-radius: 19px;
-moz-border-radius: 19px;
-ms-border-radius: 19px;
-o-border-radius: 19;
border-radius: 19px;
-webkit-transition: margin 0.4s, background 0.4s;
-moz-transition: margin 0.4s, background 0.4s;
-o-transition: margin 0.4s, background 0.4s;
transition: margin 0.4s, background 0.4s;
}
input.toggle-round-flat:checked + label.toggle-label {
background-color: #8ce196;
}
input.toggle-round-flat:checked + label.toggle-label:before {
background-color: #8ce196;
}
input.toggle-round-flat:checked + label.toggle-label:after {
margin-left: 11px;
background-color: #ffffff;
}
.entity-attribute-password .password-enabler {
margin-left: 230px;
}
.entity-attribute-separator {
min-height: 30px;
background: url("../img/background_home.jpg");
}
.entity-attribute-table {
padding: 0;
}
.entity-attribute-table table {
display: table;
height: 100%;
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background-color: transparent;
padding-left: 230px;
margin-bottom: 15px;
border: none;
line-height: 30px;
}
.entity-attribute-table table th {
font-weight: bold;
font-size: 13px;
text-align: left;
color: #9ba0ae;
text-transform: uppercase;
}
.entity-attribute-table table td {
vertical-align: top;
border-top: 1px solid #f4f5f7;
}
.entity-attribute-text, .entity-attribute-password {
padding: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.entity-attribute-text.error + .error, .entity-attribute-password.error + .error {
box-shadow: inset 0 1px 1px rgba(242, 48, 63, 0.075), inset 0 0 1px rgba(224, 117, 125, 0.75);
border: 1px solid #f2303f;
border-top: 0;
}
.entity-attribute-text input, .entity-attribute-password input {
height: 100%;
width: 100%;
min-height: 60px;
background-color: transparent;
text-indent: 230px;
border: 0;
z-index: 99999;
display: block;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: border-color ease-in-out 0.25s, box-shadow ease-in-out 0.25s;
-moz-transition: border-color ease-in-out 0.25s, box-shadow ease-in-out 0.25s;
transition: border-color ease-in-out 0.25s, box-shadow ease-in-out 0.25s;
}
.entity-attribute-text input:focus, .entity-attribute-password input:focus {
border-color: #3c8bf5;
outline: 0;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), inset 0 0 12px rgba(120, 169, 236, 0.3);
}
.entity-attribute-text.error input, .entity-attribute-password.error input {
background-image: url("/packages/komma/kms/img/structure/icon_cross_red.svg");
background-repeat: no-repeat;
background-position: right 20px center;
background-size: 10px 10px;
}
#ui-datepicker-div {
background-color: white;
}
#ui-datepicker-div select {
color: #32343a;
font-family: "Titillium Web", sans-serif;
font-weight: 100;
}
.entity-attribute-text-area {
height: 180px;
padding: 0;
}
.entity-attribute-text-area textarea {
display: block;
height: 100%;
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background-color: transparent;
padding-left: 230px;
padding-top: 15px;
padding-bottom: 15px;
border: none;
line-height: 30px;
-webkit-transition: border-color ease-in-out 0.25s, box-shadow ease-in-out 0.25s;
-moz-transition: border-color ease-in-out 0.25s, box-shadow ease-in-out 0.25s;
transition: border-color ease-in-out 0.25s, box-shadow ease-in-out 0.25s;
}
.entity-attribute-text-area textarea:focus {
border-color: #3c8bf5;
outline: 0;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), inset 0 0 12px rgba(120, 169, 236, 0.3);
}
.entity-attribute-right {
display: block;
height: 100%;
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background-color: transparent;
padding-left: 230px;
padding-top: 15px;
padding-bottom: 15px;
border: none;
line-height: 30px;
}
.entity-attribute-text-editor {
height: auto;
padding: 0;
position: relative;
}
.entity-attribute-text-editor .text-editor-wrapper {
margin-left: 219px;
height: 100%;
}
.entity-attribute-text-editor textarea {
display: block;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding-top: 15px;
padding-bottom: 15px;
border: none;
line-height: 30px;
-webkit-transition: border-color ease-in-out 0.25s, box-shadow ease-in-out 0.25s;
-moz-transition: border-color ease-in-out 0.25s, box-shadow ease-in-out 0.25s;
transition: border-color ease-in-out 0.25s, box-shadow ease-in-out 0.25s;
}
.entity-attribute-text-editor textarea:focus {
border-color: #3c8bf5;
outline: 0;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), inset 0 0 12px rgba(120, 169, 236, 0.3);
}
.entity-attribute-text .ex-tax-info {
position: absolute;
top: 0;
right: 30px;
font-size: 13px;
color: #9ba0ae;
}
input.tax-included-field {
border-bottom: 1px solid #e0e6ec;
}
input.tax-included-field:active, input.tax-included-field:focus {
border-bottom: 1px solid #e0e6ec;
}
.entity-attribute-title {
text-indent: 30px;
color: #3289ff;
font-weight: 600;
text-transform: uppercase;
}
.entity-attribute-checkboxes .label-placeholder {
position: absolute;
display: block;
width: 200px;
margin-left: 30px;
font-size: 13px;
color: #9ba0ae;
text-transform: uppercase;
font-weight: 600;
}
.entity-attribute-checkboxes .checkboxes {
padding-left: 220px;
}
.entity-attribute-checkboxes .checkboxes label {
position: relative;
display: block;
width: auto;
max-width: 500px;
padding-left: 10px;
margin: 0;
color: #32343a;
font-size: 13px;
line-height: 39px;
text-transform: none;
font-weight: 400;
cursor: pointer;
transition: all 0.4s;
}
.entity-attribute-checkboxes .checkboxes label:hover {
border-color: #3c8bf5;
outline: 0;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), inset 0 0 12px rgba(120, 169, 236, 0.3);
}
.entity-attribute-checkboxes .checkboxes label input {
margin-right: 10px;
}
.entity-attribute-dynamic {
background: url("../img/background_home.jpg");
line-height: 1.2;
padding-top: 40px;
}
.entity-attribute-dynamic .inner {
width: 85%;
margin: auto;
}
.entity-attribute-dynamic block {
position: relative;
display: block;
}
.entity-attribute-dynamic block.locked .start .buttons, .entity-attribute-dynamic block.locked .end, .entity-attribute-dynamic block.locked .dynamic-block-status {
display: none;
}
.entity-attribute-dynamic full-image-block .max-images .entity-attribute-images {
border-bottom: none;
}
.entity-attribute-dynamic label {
position: relative;
margin: 0 0 4px 0;
width: 200px;
}
.entity-attribute-dynamic .row {
border-bottom: 1px solid #e0e6ec;
margin-bottom: 30px;
}
.entity-attribute-dynamic .row.no-margin-bottom {
margin-bottom: 0;
}
.entity-attribute-dynamic .row:last-of-type {
border-bottom: none;
margin-bottom: 0;
}
.entity-attribute-dynamic .row.hidden {
display: none;
}
.entity-attribute-dynamic .row label {
position: absolute;
}
.entity-attribute-dynamic .row label.text-label {
line-height: 60px;
}
.entity-attribute-dynamic .row input:not([type=radio]) {
height: 100%;
width: calc(100% + 60px);
position: relative;
left: -30px;
min-height: 60px;
background-color: transparent;
text-indent: 230px;
border: 0;
z-index: 99999;
display: block;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: border-color ease-in-out 0.25s, box-shadow ease-in-out 0.25s;
-moz-transition: border-color ease-in-out 0.25s, box-shadow ease-in-out 0.25s;
transition: border-color ease-in-out 0.25s, box-shadow ease-in-out 0.25s;
}
.entity-attribute-dynamic .row input:not([type=radio]):focus {
border-color: #3c8bf5;
outline: 0;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), inset 0 0 12px rgba(120, 169, 236, 0.3);
}
.entity-attribute-dynamic .row .radio-wrapper {
margin-left: 200px;
padding-bottom: 30px;
}
.entity-attribute-dynamic .row .radio-wrapper label {
position: relative;
width: initial;
text-align: center;
}
.entity-attribute-dynamic .row .radio-wrapper .radio {
text-align: center;
margin-right: 5px;
}
.entity-attribute-dynamic .row .radio-wrapper .radio img {
width: 50px;
margin-bottom: 8px;
}
.entity-attribute-dynamic .row .radio-wrapper .radio input {
margin: auto;
}
.entity-attribute-dynamic .row .text-editor-wrapper {
margin-left: 191px;
}
.entity-attribute-dynamic .row .text-editor-wrapper .mce-toolbar-grp {
margin-top: -25px;
}
.entity-attribute-dynamic .row .clear {
clear: both;
}
.entity-attribute-dynamic .header {
padding-left: 30px;
height: 60px;
line-height: 30px;
border: 1px solid #B3B1B3;
background: #32343a;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-moz-justify-content: space-between;
-ms-justify-content: space-between;
-webkit-justify-content: space-between;
justify-content: space-between;
-moz-align-items: center;
-ms-align-items: center;
-webkit-align-items: center;
align-items: center;
}
.entity-attribute-dynamic .header .btn {
margin: 10px 25px;
}
.entity-attribute-dynamic .header .block-title {
color: #ffffff;
font-weight: 600;
text-transform: uppercase;
display: inline-block;
}
.entity-attribute-dynamic .header input {
display: inline-block;
min-width: 90px;
margin-right: 5px;
font-size: 13px;
cursor: pointer;
}
.entity-attribute-dynamic .header input.remove {
padding: 0;
margin-left: 20px;
height: 16px;
width: 16px;
min-width: 0;
line-height: 10px;
background: #FF5F56;
border-radius: 50%;
border: 1px solid #E0463F;
color: #981005;
font-size: 12px;
font-weight: 700;
text-align: center;
}
.entity-attribute-dynamic .tab-titles {
height: 30px;
height: 50px;
margin-left: -30px;
margin-bottom: 30px;
padding-right: 60px;
width: 100%;
border: 1px solid #b3b1b3;
}
.entity-attribute-dynamic .tab-titles .tab-title {
background-color: #f4f5f7;
-webkit-box-shadow: inset 0px 15px 15px -15px rgba(0, 0, 0, 0.15);
-moz-box-shadow: inset 0px 15px 15px -15px rgba(0, 0, 0, 0.15);
box-shadow: inset 0px 15px 15px -15px rgba(0, 0, 0, 0.15);
display: inline-block;
padding: 16px 30px;
border-left: 1px solid #b3b1b3;
border-right: 1px solid #b3b1b3;
margin-left: -1px;
cursor: pointer;
color: #d3d3d3;
position: relative;
min-width: 50px;
}
.entity-attribute-dynamic .tab-titles .tab-title .move {
position: absolute;
top: -20px;
width: 15px;
}
.entity-attribute-dynamic .tab-titles .tab-title .move.tab-left {
padding-left: 10px;
left: 0;
}
.entity-attribute-dynamic .tab-titles .tab-title .move.tab-right {
right: 0;
padding-right: 10px;
}
.entity-attribute-dynamic .tab-titles .tab-title.add-tab {
background: -webkit-linear-gradient(top, #59db81 12%, #59db81 50%, #5bd282 51%, #5bd282 100%);
background: linear-gradient(to bottom, #59db81 12%, #59db81 50%, #5bd282 51%, #5bd282 100%);
color: white;
border: none;
font-weight: bolder;
}
.entity-attribute-dynamic .tab-titles .tab-title.active {
background-color: #dfdfdf;
color: black;
}
.entity-attribute-dynamic .btn {
float: right;
width: 20px;
height: 30px;
}
.entity-attribute-dynamic .start, .entity-attribute-dynamic .end {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-moz-justify-content: center;
-ms-justify-content: center;
-webkit-justify-content: center;
justify-content: center;
-moz-align-items: center;
-ms-align-items: center;
-webkit-align-items: center;
align-items: center;
}
.entity-attribute-dynamic .buttons {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-moz-justify-content: space-between;
-ms-justify-content: space-between;
-webkit-justify-content: space-between;
justify-content: space-between;
-moz-align-items: center;
-ms-align-items: center;
-webkit-align-items: center;
align-items: center;
width: 50px;
margin-left: 20px;
}
.entity-attribute-dynamic .buttons .position-button {
height: 18px;
width: 18px;
cursor: pointer;
}
.entity-attribute-dynamic .buttons .position-button.up {
background: url("/packages/komma/kms/img/structure/icon_up.svg");
background-repeat: no-repeat;
}
.entity-attribute-dynamic .buttons .position-button.down {
background: url("/packages/komma/kms/img/structure/icon_down.svg");
background-repeat: no-repeat;
}
.entity-attribute-dynamic .add-new-block-row {
padding: 30px 0 100px 0;
width: 85%;
margin: auto;
height: auto;
background: url("../img/background_home.jpg");
}
.entity-attribute-dynamic .add-new-block-row select {
margin-right: 10px;
min-width: 300px;
}
.entity-attribute-dynamic .add-new-block-row input {
cursor: pointer;
}
.entity-attribute-dynamic content-block, .entity-attribute-dynamic page-link-block, .entity-attribute-dynamic image-slider-block, .entity-attribute-dynamic video-block, .entity-attribute-dynamic file-block, .entity-attribute-dynamic two-column-block, .entity-attribute-dynamic multiple-images-block, .entity-attribute-dynamic full-image-block, .entity-attribute-dynamic full-text-block, .entity-attribute-dynamic view-block {
display: block;
padding: 30px;
background: #fff;
border-bottom: 1px solid #E0E6EC;
margin-bottom: 30px;
}
.entity-attribute-dynamic content-block .toggle + label.toggle-label, .entity-attribute-dynamic page-link-block .toggle + label.toggle-label, .entity-attribute-dynamic image-slider-block .toggle + label.toggle-label, .entity-attribute-dynamic video-block .toggle + label.toggle-label, .entity-attribute-dynamic file-block .toggle + label.toggle-label, .entity-attribute-dynamic two-column-block .toggle + label.toggle-label, .entity-attribute-dynamic multiple-images-block .toggle + label.toggle-label, .entity-attribute-dynamic full-image-block .toggle + label.toggle-label, .entity-attribute-dynamic full-text-block .toggle + label.toggle-label, .entity-attribute-dynamic view-block .toggle + label.toggle-label {
left: 0px;
}
.entity-attribute-dynamic content-block .entity-attribute-on-off, .entity-attribute-dynamic page-link-block .entity-attribute-on-off, .entity-attribute-dynamic image-slider-block .entity-attribute-on-off, .entity-attribute-dynamic video-block .entity-attribute-on-off, .entity-attribute-dynamic file-block .entity-attribute-on-off, .entity-attribute-dynamic two-column-block .entity-attribute-on-off, .entity-attribute-dynamic multiple-images-block .entity-attribute-on-off, .entity-attribute-dynamic full-image-block .entity-attribute-on-off, .entity-attribute-dynamic full-text-block .entity-attribute-on-off, .entity-attribute-dynamic view-block .entity-attribute-on-off {
line-height: 0;
}
.entity-attribute-dynamic content-block .radio-wrapper, .entity-attribute-dynamic page-link-block .radio-wrapper, .entity-attribute-dynamic image-slider-block .radio-wrapper, .entity-attribute-dynamic video-block .radio-wrapper, .entity-attribute-dynamic file-block .radio-wrapper, .entity-attribute-dynamic two-column-block .radio-wrapper, .entity-attribute-dynamic multiple-images-block .radio-wrapper, .entity-attribute-dynamic full-image-block .radio-wrapper, .entity-attribute-dynamic full-text-block .radio-wrapper, .entity-attribute-dynamic view-block .radio-wrapper {
display: inline-block;
clear: both;
}
.entity-attribute-dynamic content-block .radio-wrapper .radio, .entity-attribute-dynamic page-link-block .radio-wrapper .radio, .entity-attribute-dynamic image-slider-block .radio-wrapper .radio, .entity-attribute-dynamic video-block .radio-wrapper .radio, .entity-attribute-dynamic file-block .radio-wrapper .radio, .entity-attribute-dynamic two-column-block .radio-wrapper .radio, .entity-attribute-dynamic multiple-images-block .radio-wrapper .radio, .entity-attribute-dynamic full-image-block .radio-wrapper .radio, .entity-attribute-dynamic full-text-block .radio-wrapper .radio, .entity-attribute-dynamic view-block .radio-wrapper .radio {
display: block;
float: left;
width: 70px;
}
.entity-attribute-dynamic content-block .radio-wrapper .radio input, .entity-attribute-dynamic page-link-block .radio-wrapper .radio input, .entity-attribute-dynamic image-slider-block .radio-wrapper .radio input, .entity-attribute-dynamic video-block .radio-wrapper .radio input, .entity-attribute-dynamic file-block .radio-wrapper .radio input, .entity-attribute-dynamic two-column-block .radio-wrapper .radio input, .entity-attribute-dynamic multiple-images-block .radio-wrapper .radio input, .entity-attribute-dynamic full-image-block .radio-wrapper .radio input, .entity-attribute-dynamic full-text-block .radio-wrapper .radio input, .entity-attribute-dynamic view-block .radio-wrapper .radio input {
margin-left: 10px;
}
.entity-attribute-dynamic content-block .video, .entity-attribute-dynamic content-block .status {
margin-top: 30px;
}
.entity-attribute-dynamic file-block span {
display: block;
height: 50px;
width: 50px;
margin-left: 5px;
}
.entity-attribute-dynamic file-block span.pdf-icon {
background: rgba(0, 0, 0, 0) url("../img/pdf-icon.png") repeat scroll 0 0/50px 50px;
}
.entity-attribute-dynamic file-block span.file-icon {
background: rgba(0, 0, 0, 0) url("../img/file-icon.png") repeat scroll 0 0/50px 50px;
}
.entity-attribute-dynamic file-block span.file-icon:hover, .entity-attribute-dynamic file-block span.pdf-icon:hover {
background: #f2303f url("../img/structure/icon_trash.svg") no-repeat 50% 50%/25px 25px;
}
.entity-attribute-dynamic file-block input {
min-width: 300px;
border: 1px solid #E0E6EC;
margin: 0 0 24px 0;
}
.entity-attribute-dynamic file-block .text-editor-wrapper {
border: 1px solid #E0E6EC;
margin: 0 0 24px 0;
}
.entity-attribute-dynamic .entity-attribute-images label {
position: absolute;
line-height: 21px;
padding-top: 15px;
}
.entity-attribute-dynamic .entity-attribute-images .image-list {
margin-left: 200px;
}
.entity-attribute-dynamic .entity-attribute-on-off {
position: absolute;
top: 22px;
right: 120px;
min-height: initial;
border-bottom: none;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-moz-justify-content: space-between;
-ms-justify-content: space-between;
-webkit-justify-content: space-between;
justify-content: space-between;
-moz-align-items: center;
-ms-align-items: center;
-webkit-align-items: center;
align-items: center;
}
.entity-attribute-dynamic .entity-attribute-on-off:first-child {
margin-right: 10px;
}
.entity-attribute-dynamic .entity-attribute-on-off label {
width: 100px;
}
.entity-attribute-dynamic .entity-attribute-on-off .toggle + label.toggle-label {
top: 0;
}
.entity-attribute-dynamic .two-blocks {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-moz-justify-content: flex-start;
-ms-justify-content: flex-start;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-moz-align-items: flex-start;
-ms-align-items: flex-start;
-webkit-align-items: flex-start;
align-items: flex-start;
}
.entity-attribute-dynamic .two-blocks .block-wrapper {
padding-left: 50px;
border-left: 1px solid #E0E6EC;
}
.entity-attribute-dynamic .two-blocks .block-wrapper:first-child {
border-left: none;
padding-left: 0;
}
.entity-attribute-dynamic video-block .video {
height: 175px;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-moz-justify-content: flex-start;
-ms-justify-content: flex-start;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-moz-align-items: center;
-ms-align-items: center;
-webkit-align-items: center;
align-items: center;
}
.entity-attribute-dynamic video-block .video .info {
display: inline-block;
width: 420px;
}
.entity-attribute-dynamic video-block .video .info p {
display: inline-block;
}
.entity-attribute-dynamic video-block .video .preview-image {
display: inline-block;
width: 228px;
}
.entity-attribute-dynamic video-block .video .preview-image img {
width: 100%;
}
.business-logo {
width: 30%;
position: absolute;
left: 35%;
top: 15%;
z-index: 999;
text-align: center;
}
.business-logo img {
max-width: 280px;
}
.login {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: table-cell;
background: url("../img/background.jpg") center center;
text-align: center;
}
.login-aligner {
height: 100%;
display: -moz-inline-box;
display: inline-block;
vertical-align: middle;
position: relative;
}
.login-panel {
width: 300px;
margin: 0 auto;
text-align: left;
display: -moz-inline-box;
display: inline-block;
vertical-align: middle;
}
.login-panel .logo {
text-align: center;
}
.login-panel .logo img {
display: none;
width: 100px;
height: 100px;
}
.login-panel h2 {
margin: 0;
color: #70778c;
}
.login-panel .help-block {
display: none;
}
.login-panel input {
display: block;
width: 100%;
height: 30px;
margin: 8px 0;
border-radius: 4px;
}
.login-panel input.form-input {
text-indent: 10px;
background-color: rgba(255, 255, 255, 0.9);
border: #d8dae2 solid 1px;
-webkit-transition: box-shadow 0.5s;
-moz-transition: box-shadow 0.5s;
transition: box-shadow 0.5s;
}
.login-panel input.form-input:focus {
outline: 0;
box-shadow: rgba(50, 137, 255, 0.75) 0px 0px 10px 0px;
}
.login-panel input.form-submit {
height: 45px;
background-color: #3289ff;
border: none;
color: white;
font-size: 16px;
font-weight: 600;
-webkit-transition: background-color 0.5s;
-moz-transition: background-color 0.5s;
transition: background-color 0.5s;
}
.login-panel input.form-submit:hover {
background-color: #4c98ff;
}
.alert {
display: none;
padding: 7px 12px;
border: 1px solid transparent;
border-radius: 4px;
margin: 8px 0;
}
.alert.alert-danger {
color: #f2303f;
background-color: rgba(254, 235, 237, 0.75);
border-color: #fcd3d6;
}
.alert.alert-warning {
color: #ff8d00;
background-color: rgba(255, 230, 199, 0.75);
border-color: #ffdbad;
}
.alert.has-error {
display: block;
}
#confirmOverlay {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0.5);
z-index: 100000;
}
#confirmBox {
background: #ffffff;
width: 370px;
position: fixed;
left: 50%;
top: 50%;
padding: 20px 30px 30px 30px;
margin: -130px 0 0 -230px;
-moz-box-shadow: 0 0 2px rgba(255, 255, 255, 0.6) inset;
-webkit-box-shadow: 0 0 2px rgba(255, 255, 255, 0.6) inset;
box-shadow: 0 0 2px rgba(255, 255, 255, 0.6) inset;
}
#confirmBox h1, #confirmBox p {
margin: 0;
text-align: center;
}
#confirmBox p {
line-height: 24px;
}
#confirmBox h1 {
color: #3289ff;
}
#confirmButtons {
padding: 15px 0 0;
text-align: center;
}
#confirmButtons .button {
display: inline-block;
margin-right: 15px;
min-width: 100px;
border-radius: 3px;
}
#confirmButtons .button:last-child {
margin-right: 0;
}
#flash-messages {
position: fixed;
top: 0;
right: 0;
z-index: 1000;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-name: fadeInDown;
animation-name: fadeInDown;
}
#flash-messages ul {
list-style: none;
margin: 0;
padding: 0;
}
#flash-messages ul li.flash-message {
display: inline-block;
min-width: 200px;
margin: 15px;
padding: 15px 30px;
line-height: 30px;
background-color: rgba(194, 197, 198, 0.9);
border: 1px solid #c2c5c6;
border-radius: 4px;
color: #ffffff;
font-weight: bold;
box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.1);
}
#flash-messages ul li.flash-message.success {
background-color: rgba(89, 219, 129, 0.9);
border: 1px solid #8ce196;
}
@-webkit-keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
-ms-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
}
.uk-tooltip {
display: none;
position: fixed;
z-index: 1030;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
max-width: 200px;
padding: 5px 8px;
background: #333333;
color: rgba(255, 255, 255, 0.7);
font-size: 14px;
line-height: 20px;
text-align: center;
margin-left: -5px;
}
.uk-tooltip:after {
content: "";
display: block;
position: absolute;
width: 0;
height: 0;
border: 5px dashed #333333;
}
.uk-tooltip-top:after,
.uk-tooltip-top-left:after,
.uk-tooltip-top-right:after {
bottom: -5px;
border-top-style: solid;
border-bottom: none;
border-left-color: transparent;
border-right-color: transparent;
border-top-color: #333333;
}
.uk-tooltip-bottom:after,
.uk-tooltip-bottom-left:after,
.uk-tooltip-bottom-right:after {
top: -5px;
border-bottom-style: solid;
border-top: none;
border-left-color: transparent;
border-right-color: transparent;
border-bottom-color: #333333;
}
.uk-tooltip-top:after,
.uk-tooltip-bottom:after {
left: 50%;
margin-left: -5px;
}
.uk-tooltip-top-left:after,
.uk-tooltip-bottom-left:after {
left: 17px;
}
.uk-tooltip-top-right:after,
.uk-tooltip-bottom-right:after {
right: 17px;
}
.uk-tooltip-left:after {
right: -5px;
top: 50%;
margin-top: -5px;
border-left-style: solid;
border-right: none;
border-top-color: transparent;
border-bottom-color: transparent;
border-left-color: #333333;
}
.uk-tooltip-right:after {
left: -5px;
top: 50%;
margin-top: -5px;
border-right-style: solid;
border-left: none;
border-top-color: transparent;
border-bottom-color: transparent;
border-right-color: #333333;
}
/*# sourceMappingURL=kms.css.map */