﻿:root {
	--configuratorBackground: #FFFFFF;
	--mainPlateBackground: #005b8c;
	--plateLength: 100mm;
	--plateHeight: 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;
	--plateSubline1Display: none;
	--plateSubline2Display: none;
	--plateSubline1PaddingBottom: 0px;
	--plateSubline2PaddingBottom: 0px;
	/*--plateSublineTextFontSize: 14px;*/
	--plateSublineTextFontSize: 3mm;
	--houseNumber1Display: none;
	--houseNumber1TextAlignment: center;
	--houseNumber1BorderBottom: thin;
	--houseNumber2Display: none;
	--houseNumber2TextAlignment: center;
	--HouseNumberTextFontSize: 8mm;
	--plateBorderError: none;
	--plateMain1Top: 0mm;
	--plateMain2Top: 0mm;
	--beugelMsgLabelColor: Red;
}

* {
	box-sizing: border-box;
}

.StreetNameBoardCharCount {
	text-align: right;
	font-style: italic;
	font-size: x-small;
}

@font-face {
	font-family: 'rwstdd';
	src: url('/Styles/fonts/RWS/RWSTDD.ttf');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'rwstddx';
	src: url('/Styles/fonts/RWS/RWSTDDX.ttf');
	font-weight: normal;
	font-style: normal;
}


@font-face {
	font-family: 'rwsteex';
	src: url('/Styles/Fonts/RWS/RWSTEEX.ttf');
	font-weight: normal;
	font-style: normal;
}

#plate-configurator input::-ms-clear {
	display: none;
}

#plate-configurator {
	margin: 0 auto;
	background-color: 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);
	height: var(--plateHeight);
}

#PlateBorder {
	border: 5px solid #fff;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	border-color: #FFFFFF;
	height: calc(var(--plateHeight) - var(--plateBlueBorderWidth) - var(--plateBlueBorderWidth));
	margin: 0px;
}

.PlateMainTextWrapper {
	--plateMainTextPaddingVerticalCorrected: calc(var(--plateMainTextPaddingVertical) - 3);
	padding: var(--plateMainTextPaddingVerticalCorrected) var(--plateMainTextPaddingHorizontal) var(--plateMainTextPaddingVertical) var(--plateMainTextPaddingHorizontal);
	margin: 0 auto 0 auto;
}

	.PlateMainTextWrapper input#PlateMain1Text,
	.PlateMainTextWrapper input#PlateMain2Text {
		width: 100%;
		font-size: var(--plateMainFontSize);
		padding: 0;
		color: #FFFFFF;
		text-align: center;
		font-weight: normal;
		background: transparent;
		border: none;
	}

	.PlateMainTextWrapper input#PlateMain1Text {
		position: relative;
		top: var(--plateMain1Top); /*6px;*/
	}

	.PlateMainTextWrapper input#PlateMain2Text {
		position: relative;
		top: var(--plateMain2Top); /*-6px;*/
	}

	.PlateMainTextWrapper input#PlateMain2Text {
		display: var(--plateMain2TextDisplay);
	}

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);
}

#PlateNeighbourhoodNumberWrapper {
	display: var(--plateNeighbourhoodNumberTextDisplay);
}

input#PlateNeighbourhoodNameText {
	font-size: var(--plateNeighbourhoodNameTextFontSize);
	border: none;
	width: 100%;
	padding: var(--plateNeighbourhoodNameTextPaddingVertical) 0mm;
}

#PlateNeighbourhoodNameWrapper {
	display: var(--plateNeighbourhoodNameTextDisplay);
}

.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;
}



.PlateSublineTextWrapper {
	width: 100%;
	background-color: var(--mainPlateBackground);
	padding: 0px 0px 0px 0px;
	border: none;
	margin: 0 auto 0 auto;
}

.PlateSublineText {
	width: 100%;
	color: #FFFFFF;
	border: none;
	text-align: center;
	font-weight: normal;
	font-size: var(--plateSublineTextFontSize);
	background: transparent;
	top: -5px;
}

#PlateSubline1 {
	display: var(--plateSubline1Display);
}

#PlateSubline2 {
	display: var(--plateSubline2Display);
}

#PlateSubline1Text {
	position: relative;
	padding-bottom: var(--plateSubline1PaddingBottom);
}

#PlateSubline2Text {
	position: relative;
	padding-bottom: var(--plateSubline2PaddingBottom);
}

.PlateSubSublineTextWrapper {
	width: 100%;
	background-color: var(--configuratorBackground);
	padding: 2px 0px 0px 0px;
	border-color: black;
	border-style: solid;
	margin: 0 auto 0 auto;
}

.PlateSubSublineText {
	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-rwstdd {
	font-family: 'rwstdd', "courier";
}

#plate-configurator .font-rwstddx {
	font-family: 'rwstddx', "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;
}

.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;
}
