/*.ui-dialog {
    width: 20% !important;
    min-width: 300px !important;
    left: unset !important;
    right: 0;
}*/

#drupal-off-canvas *, #drupal-off-canvas :not(div){
    font-family: 'Open Sans'!important;
}

#drupal-off-canvas label  {
    font-size: 13px;
    font-weight: bold;
    color: #555;
}
.field--name-field-hoogte, .field--name-field-breedte, .field--name-field-max-width,
.field--name-field-animatie3, .field--name-field-a, .field--name-field-animatie-duur,
.field--name-field-border-dikte, .field--name-field-border-kleur, .field--name-field-border-style {
    width: 30% !important;
    display: inline-block;
}

.paddings div[class^="field--type-string field--name-field-nt-padding"],
.margins div[class^="field--type-string field--name-field-margin"] {
    margin-left: 0;
    margin-right: -1px;
    width: 20% !important;
}

#drupal-off-canvas .paddings div[class^="field--type-string field--name-field-nt-padding"] input,
#drupal-off-canvas .margins div[class^="field--type-string field--name-field-margin"] input {
    width: 100%;
    display: inline-flex;
    border-radius: unset !important;
}

#drupal-off-canvas .paddings div[class^="field--type-string field--name-field-nt-padding"]:first-child input,
#drupal-off-canvas .margins div[class^="field--type-string field--name-field-margin"]:first-child input {
    border-radius: 2px 0 0 2px !important;
}

#drupal-off-canvas .paddings div[class^="field--type-string field--name-field-nt-padding"]:last-child input,
#drupal-off-canvas .margins div[class^="field--type-string field--name-field-margin"]:last-child input {
    border-radius: 0 2px 2px 0 !important;
}

#drupal-off-canvas .paddings div[class^="field--type-string field--name-field-nt-padding"] label,
#drupal-off-canvas .margins div[class^="field--type-string field--name-field-margin"] label {
    color: #ccc;
}

/*sub details*/
#drupal-off-canvas .sub-details summary {
    color: #6917EB;
    display: block;
    border-bottom: solid;
    margin-left: 0;
    padding-left: 0;
    width: 100%;
}

#drupal-off-canvas details.sub-details[open] > summary {
    display:block;
    background-color: unset;
    color: #6917EB;
    text-decoration: unset;
}

#drupal-off-canvas details.sub-details summary::-webkit-details-marker {
    display:none;
}

#drupal-off-canvas details.sub-details summary::marker {

}

#drupal-off-canvas details.sub-details summary::after {
    content: '\25BC';
    float: right;
}

#drupal-off-canvas details.sub-details[open] summary::after {
    content: '\25B2';
}