:root {
    --configuratorBackground: peachpuff;
    --mainPlateBackground: #005b8c;
    --mainPlateTextColor: Blue;
    --plateLength: 100mm;
    --plateHeight: 15mm;
    --plateInnerHeight: 15mm;
    --plateBlueBorderWidth: 1mm;
    --plateMainFontSize: 32px;
    --plateMainTextPaddingVertical: 3.5mm;
    --plateMainTextPaddingHorizontal: 5.5mm;
    --plateMain2TextDisplay: none;
    /*--plateNeighbourhoodNumberTextDisplay: none;
	--plateNeighbourhoodNumberTextFontSize: 24px;
	--plateNeighbourhoodNumberTextPaddingVertical: 5mm;
	--plateNeighbourhoodNameTextDisplay: none;
	--plateNeighbourhoodNameTextFontSize: 24px;
	--plateNeighbourhoodNameTextPaddingVertical: 5mm;*/
    --plateGemeente1Display: none;
    --plateGemeente2Display: none;
    --plateGemeente1PaddingBottom: 0px;
    --plateGemeente2PaddingBottom: 0px;
    /*--plateGemeenteTextFontSize: 14px;*/
    --plateGemeenteTextFontSize: 3mm;
    /*--houseNumber1Display: none;
	--houseNumber1TextAlignment: center;
	--houseNumber1BorderBottom: thin;
	--houseNumber2Display: none;
	--houseNumber2TextAlignment: center;
	--HouseNumberTextFontSize: 8mm;*/
    --plateBorderError: none;
    --plateMain1Top: 0mm;
    --plateMain2Top: 0mm;
    --plateFontType: rwstcc;
    --beugelMsgLabelColor: Red;
    --endLineDisplay: none;
    --plateMainLine1Height: 0mm;
    --plateMainLine2Height: 0mm;
    --plateGemeente1Height: 0mm;
    --plateGemeente2Height: 0mm;
}

* {
    box-sizing: border-box;
}

.KomBordCharCount {
    text-align: right;
    font-style: italic;
    font-size: x-small;
}

@font-face {
    font-family: 'rwsccvl';
    src: url('/Styles/fonts/RWS/RWS.ttf');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'rwseevl';
    src: url('/Styles/fonts/RWS/RWS_1.ttf');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'rwsccxvl';
    src: url('/Styles/Fonts/RWS/RWS_CCX.ttf');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'rwseexvl';
    src: url('/Styles/Fonts/RWS/RWS_EEX.ttf');
    font-weight: normal;
    font-style: normal;
}
/*@font-face {
    font-family: 'rwstcc';
    src: url('/Styles/fonts/RWS/RWSTCC.ttf');
    font-weight: normal;
    font-style: normal;
}*/

/*@font-face {
    font-family: 'rwstdd';
    src: url('/Styles/fonts/RWS/RWSTDD.ttf');
    font-weight: normal;
    font-style: normal;
}*/

/*@font-face {
    font-family: 'rwsddxvl';
    src: url('/Styles/fonts/RWS/RWS_DDX.ttf');
    font-weight: normal;
    font-style: normal;
}*/

/*@font-face {
    font-family: 'rwstee';
    src: url('/Styles/fonts/RWS/RWSTEE.ttf');
    font-weight: normal;
    font-style: normal;
}*/

#EndLine {
    display: var(--endLineDisplay);
    transform-origin: 0 100%;
    height: 20px; /* Line width of 10 */
    background: red; /*#000;*/ /* Black fill */
    /*border-color: white;*/
    border-top-color: white;
    border-bottom-color: white;
    -webkit-border-radius: 9px;
    -moz-border-radius: 9px;
    border-radius: 9px;
    /*border-width: 3px;*/
    border-top-width: 3px;
    border-bottom-width: 3px;
    border-style: solid;
    z-index: 2;
    position: absolute;
}

.PlateLayoutGroup {
    background-color: var(--configuratorBackground);
}

#plate-configurator input::-ms-clear {
    display: none;
}

#plate-configurator {
    margin: 0 auto;
    /*background-color: purple;*/ /*var(--configuratorBackground);*/
    width: var(--plateLength);
    border: var(--plateBorderError);
    border-color: red;
}


#jsGrid, #jsGridFixation {
    /*min-width: 270px;*/
    font-size: 8px;
}

.top-rounded {
    border: 1px thin;
    -webkit-border-top-left-radius: 12px;
    -webkit-border-top-right-radius: 12px;
    -moz-border-radius-topleft: 12px;
    -moz-border-radius-topright: 12px;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
}

.bottom-rounded {
    border: 1px thin;
    -webkit-border-bottom-left-radius: 12px;
    -webkit-border-bottom-right-radius: 12px;
    -moz-border-radius-bottomleft: 12px;
    -moz-border-radius-bottomright: 12px;
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
}


.plate {
    position: relative;
    padding: var(--plateBlueBorderWidth);
    background-color: var(--mainPlateBackground);
    color: var(--mainPlateTextColor);
    height: var(--plateHeight);
    display: table;
}

#PlateBorder {
    position: relative;
    border: 0px solid #fff;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    border-radius: 12px;
    /*border-color: #FFFFFF;*/
    /*border-color: var(--mainPlateTextColor);*/
    height: calc(var(--plateHeight) - var(--plateBlueBorderWidth) - var(--plateBlueBorderWidth));
    margin: 0px;
    /*z-index: 20;*/
    display: table-cell;
    vertical-align: middle;
}

#PlateBorderOverlay {
    position: absolute;
    background-color: transparent;
    border: 5px solid #fff;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    border-radius: 12px;
    /*border-color: #FFFFFF;*/
    border-color: var(--mainPlateTextColor);
    height: calc(var(--plateHeight) - var(--plateBlueBorderWidth) - var(--plateBlueBorderWidth));
    margin: 0px;
    /*margin-top: -100px;  calc(var(--plateHeight) - var(--plateBlueBorderWidth) - var(--plateBlueBorderWidth));*/
    z-index: 20;
    display: block;
}

.PlateMainTextWrapper {
    /*--plateMainTextPaddingVerticalCorrected: calc(var(--plateMainTextPaddingVertical) - 3);*/
    padding: var(--plateMainTextPaddingVertical) var(--plateMainTextPaddingHorizontal) var(--plateMainTextPaddingVertical) var(--plateMainTextPaddingHorizontal);
    /*margin: 0 auto 0 auto;*/
    margin: auto;
    position: relative;
    z-index: 0;
}

    .PlateMainTextWrapper input#PlateMain1Text,
    .PlateMainTextWrapper input#PlateMain2Text {
        width: 100%;
        font-size: var(--plateMainFontSize);
        color: var(--mainPlateTextColor);
        text-align: center;
        font-weight: normal;
        background: transparent;
        border: none;
        font-family: var(--plateFontType);
        position: relative;
        z-index: 0;
        margin: auto;
        padding: 0;
    }
.PlateMainTextWrapper input#PlateMain1Text {
    position: relative;
    top: var(--plateMain1Top); /*6px;*/
    height: var(--plateMainLine1Height);
}

.PlateMainTextWrapper input#PlateMain2Text {
    position: relative;
    top: var(--plateMain2Top); /*-6px;*/
    height: var(--plateMainLine2Height);
    display: var(--plateMain2TextDisplay);
}

#Plate : placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: var(--mainPlateTextColor);
    opacity: 1; /* Firefox */
}

#Plate :-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: var(--mainPlateTextColor);
}

#Plate ::-ms-input-placeholder { /* Microsoft Edge */
    color: var(--mainPlateTextColor);
}
/*#FFFFFF;*/

/*input#PlateNeighbourhoodNumberText {
	font-size: var(--plateNeighbourhoodNumberTextFontSize);
	border: solid;
	margin: 0px auto 0px auto;
	width: 55%;
width: 100%; padding: 0; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
display: inline-block !important;
<p style = "display : inline; border : solid 1px black"> test </p>
width: 100%;
height: 34px; color: #000000; text-align: center; font-weight: normal; background: transparent; padding: var(--plateNeighbourhoodNumberTextPaddingVertical) 0mm;
}

*/ 
#measure {
    font-family: 'rwstddx', "courier";
    font-size: var(--plateNeighbourhoodNumberTextFontSize);
}

.PlateSuperLineWrapper {
    padding: 2px 5px 2px 5px;
    border-width: thin thin 0px;
    border-color: black;
    border-style: solid;
    /*font-size: 33px;*/
    text-align: center;
}

.PlateExtraLineText {
    height: 34px;
    color: #000000;
    text-align: center;
    font-weight: normal;
    background: transparent;
}

.PlateGemeenteTextWrapper {
    width: 100%;
    background-color: var(--mainPlateBackground);
    padding: 0px 0px 0px 0px;
    border: none;
    margin: 0 auto 0 auto;
}

.PlateGemeenteText {
    width: 100%;
    color: var(--mainPlateTextColor);
    border: none;
    text-align: center;
    font-weight: normal;
    font-size: var(--plateGemeenteTextFontSize);
    background: transparent;
    top: -5px;
    font-family: var(--plateFontType);
}

#PlateGemeente1 {
    display: var(--plateGemeente1Display);
}

#PlateGemeente2 {
    display: var(--plateGemeente2Display);
}

#PlateGemeente1Text {
    position: relative;
    padding-bottom: var(--plateGemeente1PaddingBottom);
    height: var(--plateGemeente1Height);
}

#PlateGemeente2Text {
    position: relative;
    padding-bottom: var(--plateGemeente2PaddingBottom);
    height: var(--plateGemeente2Height);
}

.PlateSubGemeenteTextWrapper {
    width: 100%;
    background-color: var(--mainPlateBackground);
    padding: 2px 0px 0px 0px;
    border-color: black;
    border-style: solid;
    margin: 0 auto 0 auto;
}

.PlateSubGemeenteText {
    width: 100%;
    color: black;
    border: none;
    font-weight: 400;
    font-size: var(--HouseNumberTextFontSize);
    background: transparent;
    padding-left: var(--plateMainTextPaddingHorizontal);
    padding-right: var(--plateMainTextPaddingHorizontal);
}

/*#HouseNumber1 {
	display: var(--houseNumber1Display);
	border-width: 0px thin var(--houseNumber1BorderBottom) thin;
}

#HouseNumber1Text {
	text-align: var(--houseNumber1TextAlignment);
}

#HouseNumber2 {
	display: var(--houseNumber2Display);
	border-width: var(--houseNumber1BorderBottom) thin thin thin;
}

#HouseNumber2Text {
	text-align: var(--houseNumber2TextAlignment);
}*/



/*#HouseNumberSeparationband {
	display: var(--houseNumber2Display);
	border-width: 0px thin;
	border-color: black;
	border-style: solid;
	width: 100%;
}

#HouseNumberSeparationbandLine {
	display: var(--houseNumber2Display);
	border-width: 1mm 0px 0px 0px;
	border-color: black;
	border-style: solid;
	width: 95%;
	margin: auto;
}*/


/*font-family: 'anwbbold';*/
#plate-configurator .plate .font-anwb {
    font-family: "courier", "arial";
}
/*#plate-configurator .plate .font-rwstdd {*/
#plate-configurator .font-rwstcc {
    font-family: 'rwstcc', "courier";
}

#plate-configurator .font-rwstdd {
    font-family: 'rwstdd', "courier";
}

#plate-configurator .font-rwstddx {
    font-family: 'rwstddx', "courier";
}

#plate-configurator .font-rwstee {
    font-family: 'rwstee', "courier";
}

#plate-configurator .font-rwsteex {
    font-family: 'rwsteex', "courier";
}

#plate-configurator .plate .font-birch_stdregular {
    font-family: 'birch_stdregular';
    letter-spacing: 3px;
}

#plate-plate-configurator .plate .font-times {
    font-family: 'Times New Roman';
}

.PlateTotalHeightLabel {
    text-align: center;
    font-style: italic;
    font-size: x-small;
    background-color: var(--configuratorBackground);
}

.textDimensionCalculation {
    position: absolute;
    visibility: hidden;
    height: auto;
    width: auto;
    white-space: nowrap;
    font-size: 60pt !important;
}

/*Product List*/
tr.highlight td.jsgrid-cell {
    background-color: lightskyblue;
}

tr.highlight td.jsGridFixation-cell {
    background-color: lightskyblue;
}

.ProductCount {
    text-align: right;
    font-style: italic;
    font-size: x-small;
    padding-top: -5px;
    margin-top: -5px;
}

.BeugelMsgLabel {
    color: var(--beugelMsgLabelColor);
    font-weight: normal;
}

.OrderPlateLabel {
    color: darkblue;
    font-weight: normal;
}

.OrderPlateAttention {
    font-weight: bold;
}

.OrderMsg {
    color: darkblue;
    font-weight: bold;
}
/*.OrderPlateButton{
	color: darkblue;
	font-weight: bold;
}*/

/*For text-width calculation*/
#measure {
    position: absolute;
    left: -10000px;
    top: 0px;
}

/*Overrides color-profile DevExpress css classes*/
.dxeRadioButtonList {
    border: none;
}

.dxflGroupBoxCaption {
    font-weight: bold;
    color: black;
}

#PlateLayoutGroup .dxflGroupBox {
    border-color: red;
}

.jsgrid-nodata-row {
    color: red;
    font-weight: bold;
}