* {
	font-family: 'tuitype-light', sans-serif;
}

body {
	font-size:160%;
}

.infoBadge {
	display:inline-block;
}
.infoBadge i {
	color:#70CBF4;
}
.infoBadge section {
	display:none;
	z-index:1000;
	position:absolute;
	background:#FFFFFF;
	border:solid 1px #CCCCCC;
	max-width:400px;
	padding:0.5em;
	font-size:0.9em;
	margin-left:0.5em;
}
.infoBadge:hover section {
	display:inline-block;
}

.selectOff {
	display:inline-block; width:3em; font-size:0.8em; cursor:pointer; padding:0.1em; text-align:center; border:solid 1px #CCCCCC; border-radius:3px; background-color:#FFFFFF; color:#888888;
}
.selectOn {
	display:inline-block; width:3em; font-size:0.8em; cursor:pointer; padding:0.1em; text-align:center; border:solid 1px #CCCCCC; border-radius:3px; background-color:#176599; color:#FFFFFF;
}

.lpHead {
	width:100%; background-color: rgb(194, 230, 250); display:block; color:#666666;
}
.mainHeader {
	
}

.header00 {
	width:100%; max-width:900px; margin: 0 auto; margin-top:1em; font-size:1.3em;
}

.header01 {
	display:inline-block; vertical-align:middle; width:45%; font-size:0.8em; padding-top:5px;
}

.header01_1 {
	font-weight:bold; color:#001E46;
}

.header01_2 {
	
}

	
.header02 {
	display:inline-block; width:20%; padding:0; vertical-align:middle;
}	
	
.header03 {
	display:inline-block; vertical-align:middle; font-size:0.8em; padding:0.5em 0;
}



.voucherAmountA {
	display:inline-block; width:430px;
}
.voucherAmountB {
	display:inline-block;
}
.voucherAmount1 {
	display:inline-block; width:150px;
}
.voucherAmount2 {
	display:inline-block;
}

.voucherTemplateA {
	display:inline-block; width:150px;
}
.voucherTemplateB {
	display:inline-block; max-width:625px; vertical-align:top;
}
.voucherTemplate {
	display:inline-block; padding:0.5em; margin:0 0.5em 0.5em 0; cursor:pointer; background:#FFFFFF; border:solid 2px #FFFFFF;
}
.voucherTemplateActive {
	border:solid 2px #001E46;
}
.voucherTemplate label {
	margin:0; cursor:pointer;
}
.voucherTemplate img {
	width:180px;
}
.voucherTemplate section {
	font-size:0.9em; padding-top:5px;
}
.voucherTemplate input {
	margin-right:0.5em;
}
.voucherTemplate1 {
	margin-bottom:0.5em;
}

.voucherTextA {
	display:inline-block; width:150px; vertical-align:top;
}
.voucherTextB {
	display:inline-block;
}
.voucherTextInfoMobil {
	display:none; color:#EE4444; font-size:0.8em;
}
.textRowInput {
	display:none;
}


.customerIdent {
	width:0px; height:0px; overflow:hidden; }

.customerRow {
	display:flex; gap:1em;
}
.customerRow > div{
	display:flex; gap:5px; align-items:flex-start; flex-grow:1; flex-basis:50%;
}
.customerRow > div > label {
	flex-grow:1;
}

.sepaRow {
	display:flex; gap:0.5em; align-items:center; margin-top:0.5em;
}
.sepaRow > * {
	flex-grow:1; flex-basis:50%;
}
#paymentOther {
	display:none; font-size:1em; color:#092A5E; border:solid 1px #092A5E; background:#FFFFFF; padding:1em;
}




.inputbox {
	display:inline-block; width:40%;
}

.inputbox-remark {
	font-size:0.7em; color:#AAAAAA;
}	

.inputarea {
	display:inline-block; width:100%; padding-left:1em;
}	

.inputarea_field {
	width:80.5%;
}

.inputarea_remark {
	display:inline-block; width:80%; font-size:0.9em; color:#666666;
}

.contactBorder {
	background-color:#C2E6FA;
}
.greyButton {
	
}

.tui-table {
  width: 100%;
  font-size:0.9em;
}

.tui-table thead td {
    font-weight:bold;
	border-bottom:solid 1px #CCCCCC;
}

.tui-table tbody tr:hover {
    background-color: #E2F3FE;
}

@media screen and (max-width:690px) {
	.header00 {
		width:100%; max-width:900px; margin: 0 auto; font-size:1.1em;
	}
	.header01 {
		width:45%; font-size:0.8em;
	}
	.header01_1 {
	word-wrap: break-space; font-size:0.9em;
	}
	.header02 {
		display:none;
	}
	.header03 {
		width:45%; padding-bottom: 15px;
	}
	
	.inputbox {
	display:block; width:100%;
	}
	.inputbox-remark {
		font-size:0.6em;
	}
	.inputarea {
	padding-left:0em;

	}	
	.inputarea_field {
	width:100%;
	}
	.inputarea_remark {
		display:inline-block; width:100%; font-size:0.9em; color:#666666;
	}
	.hideByMobile {
		display:none;
	}
}

@media screen and (max-width:800px) {
	body {
		font-size:140%;
	}
	
	
	
	.voucherAmountA {
		
	}
	.voucherAmountB {
		margin-top:0.5em;
	}
	.voucherAmount1 {
		vertical-align:top;
		margin-bottom:0.7em;
	}
	.voucherAmount2 {
		
	}
	
	.voucherTemplateA {
		display:flex; width:100%;
	}
	.voucherTemplateB {
		width:auto;
	}
	.voucherTemplate1 {
		width:152px; min-width:152px;
	}
	.voucherTemplate2 .selectOn, .voucherTemplate2 .selectOff {
		margin:0 0.2em 0.2em 0;
	}
	.voucherTextInfo {
		display:inline-block;
	}
	
}

@media screen and (max-width:820px) {
	
}

@media screen and (max-width:550px) {
	
	body {
		font-size:130%;
	}
	.tui-btn--sm {
		padding: 2px 4px; line-height: 1.0; font-size: 0.9em; margin:0.2em 0;
		width:70px;
	}
	
	.selectOn {
		font-size:1.2em;
	}
	.selectOff {
		font-size:1.2em;
	}
	
	.voucherAmountA {
		display:block; width:100%;
	}
	.voucherAmountB {
		display:block; width:100%;
	}
	.voucherAmount1 {
		display:block; width:100%;
	}
	.voucherAmount2 {
		display:block; width:100%;
	}
	
	.voucherTemplateA {
		display:block;
	}
	
	.voucherTextInfoMobil {
		display:block;
	}
	.voucherTextB {
		display:block;
	}
	.textBoxInput {
		display:none;
	}
	.textRowInput {
		display:block;
	}
	
	.voucherTemplate img {
		width:140px;
	}
	
	.customerRow {
		display:block;
	}
	
	.sepaRow {
		display:block;
	}
	.sepaRow > div {
		margin:0 0 1em 0;
	}
	.sepaRow > * {
		width:100%;
	}
	
}