/* roboto-300 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: url('/fonts/roboto-v20-latin-300.eot'); /* IE9 Compat Modes */
  src: local('Roboto Light'), local('Roboto-Light'),
       url('/fonts/roboto-v20-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/roboto-v20-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('/fonts/roboto-v20-latin-300.woff') format('woff'), /* Modern Browsers */
       url('/fonts/roboto-v20-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/fonts/roboto-v20-latin-300.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-regular - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/roboto-v20-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Roboto'), local('Roboto-Regular'),
       url('/fonts/roboto-v20-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/roboto-v20-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('/fonts/roboto-v20-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('/fonts/roboto-v20-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/fonts/roboto-v20-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-700 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: url('/fonts/roboto-v20-latin-700.eot'); /* IE9 Compat Modes */
  src: local('Roboto Bold'), local('Roboto-Bold'),
       url('/fonts/roboto-v20-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/roboto-v20-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('/fonts/roboto-v20-latin-700.woff') format('woff'), /* Modern Browsers */
       url('/fonts/roboto-v20-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/fonts/roboto-v20-latin-700.svg#Roboto') format('svg'); /* Legacy iOS */
}


/* roboto-condensed-regular - latin */
@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/roboto-condensed-v18-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Roboto Condensed'), local('RobotoCondensed-Regular'),
       url('/fonts/roboto-condensed-v18-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/roboto-condensed-v18-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('/fonts/roboto-condensed-v18-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('/fonts/roboto-condensed-v18-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/fonts/roboto-condensed-v18-latin-regular.svg#RobotoCondensed') format('svg'); /* Legacy iOS */
}



BODY {
	margin: 0;padding:0;
	font-family: 'Roboto', sans-serif; font-size:16px;
	background:url(https://verkehr.carl-rieck.info/header-top.png) no-repeat;
	background-size: 1000px auto; background-position:top 30px left; color:#000
}


SELECT { font-size: 0.9em; }

HEADER { text-align: left; display: block }
a, a:hover {color:#bc3f48; text-decoration:none}
.headline {font-weight:bold}

h1,h2 {margin:0}
h1 {margin-top:25px; color:#80a9c0;font-weight:lighter; margin-bottom:20px }
h2 {font-size:18px; font-weight:400; margin-bottom:10px}
h3 {color:#bc3f48; font-weight:lighter; font-size:22px; margin:0}
small, .small {font-size:12px}
input {height:30px; margin-bottom:10px; width:250px; border:1px solid #80a9c0; padding:0 10px; font-family: 'Roboto', sans-serif; }
input[type="checkbox"] {height:auto; width:auto; margin-bottom:0}
input[type="radio"] {height:auto; width:auto; margin-bottom:0}
input:focus {border:1px solid #000}
input.inline {border:0px!important}
.kennz input {width:150px; margin-top:7px}



.hideme { display: none }
.maxwidth { width: 100%; }
.center { text-align: center; }
.droparea {padding: 10px;text-align:left; margin-top: 10px; }

@media (min-width:751px) {
table.faktoren {padding-bottom:20px; width:100%}
table.faktoren tr:first-child {background:#bc3f48; color:#fff}
table.faktoren td {padding:15px 5px!important; text-align:center; border-left:1px solid #e1edf4; width:150px; border-bottom:1px solid #e1edf4;}
table.faktoren td:first-child  {text-align:left; border-left:none; width: calc(100% - 480px);}
}

.wrapper {width:1280px; max-width:100%; margin:auto; background:url(https://verkehr.carl-rieck.info/point.png) no-repeat; background-position:top 30px right}
.errormessage {	background: #e1edf4;border-top: 1px solid #FF0000;	padding: 10px;text-align: center;	color: #000;display: block;	border-radius: 0px;position: fixed;bottom: 0px;width:1260px;max-width: 100%;font-size: 12px; }
.errormessage:before { content: "Bitte folgende Felder ausf\00fcllen: ";}

.logo {max-height:100px; margin-top:15px; margin-bottom:50px}
.daten {width:100%; background:#e1edf4; padding:25px}
table.vermittler td:first-child {border-right:1px solid #e1edf4;padding-right:30px}
table.vermittler .hideme .headline {margin-top:20px}
table.rabatte {padding-top:55px; line-height:35px; width:100%}
table.rabatte td:first-child {border-right:1px solid #e1edf4;padding-right:30px}
table td {vertical-align:top}

.hinweise {background:#e1edf4; padding:25px 40px; font-size:14px;}
.hinweise ul {margin:0; padding:3px 0 15px 15px}
.gesamtbetrag {color:#80a9c0; font-size:20px; line-height:40px;font-weight:bold; }
.zzgl {font-size:12px}
.fzpraemie {background:#e1edf4; padding:20px; font-size:18px; margin-top:35px}
.fzpraemie em {font-style:normal}

.zahlungsweise {margin:8px 0}
.gesamtpraemie span {background:#e1edf4; font-size:40px; padding:8px 0 8px 12px;}

.footer {font-size:14px; padding:30px 0; text-align:center; line-height:22px; margin-bottom:75px}
.footer a {font-size:14px; color:#000; text-decoration:underline}
.rechtliches {text-align:center;padding:0 0 30px; color:#ddd}
.rechtliches a {font-size:16px; text-decoration:none; color:#80a9c0}

ul#fileuploadoutput-listing01  {margin:0; padding:0; list-style:none}

.progressBar p {background:#fff!important}
.link {padding:80px 0}

.link a {
border: 1px solid #fff;
background: #bc3f48;
padding: 15px 25px;
text-align: center;
width: auto!important;
color:#fff;
font-size:24px;
cursor:pointer;
text-decoration:none!important
 }

.select-wrapper { width: 100%; position: relative;}


select {
 -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  border: none;
  width: 100%;
  height: 40px;
  padding-left: 10px;
  background: #e1edf4;
  color: #000;
  font-family: 'Open Sans', sans-serif;
  font-size: 16px;
   cursor: pointer;
}

.select-wrapper.anzahl{
  width: 504px;
  position: relative;
}

select.anzahl {width:254px; height:35px; margin-bottom:10px}

/*
select::-ms-expand {
  display: none;
}
select:focus::-ms-value {
  background-color: transparent;
}
*/
select option {
  color: #666;
}


.select-wrapper:before {
  pointer-events: none;   
  width: 20px;
  content: " - ";
  background-image: url(https://verkehr.carl-rieck.info/arrow.png);
  position: absolute;
  right: 10px;
  top: 10px;
  color:#e1edf4
}


div.button {
	display: inline-block!important;
	border-radius: 0px;
	border: 1px solid #fff;
	background: #bc3f48;
	padding: 15px 25px;
	text-align: center;
	width: auto!important;
	color:#fff;
	font-size:24px;
	transition: background-color 0.5s ease;
	cursor:pointer
}
	
div.button:hover {
	border: 1px solid #fff;
	background: #A63740;
}

div.button1 {
	display: inline-block!important;
	border-radius: 0px;
	border: 1px solid #fff;
	background: #e1edf4;
	padding: 5px 9px;
	text-align: center;
	width: auto!important;
	color:#000;
	font-size:14px;
	transition: background-color 0.5s ease;
	cursor:pointer
}
	
div.button1:hover {
	border: 1px solid #fff;
	background: #e1edf4;
}

.disabled {background:#ebebeb!important; cursor:default!important}


.block {
//	background: #88ff88;
	display: block;
	width: 100%; margin-bottom:35px
}

.container {
	display: inline-block;
	padding: 0;
	border-radius: 10px;
	width: 100%;
}


.filler {
	min-width: 250px;
	display: inline-block;
}

.fillerrisiko {
	min-width: 245px;
	display: inline-block;
}



.right {padding-left:30px; width:50%}



/**
 * Tabs
 */
.tabs {display: flex;flex-wrap: wrap;border:1px solid #80a9c0;}
.tabs label {
	order: 1;
	display: block;
	padding:15px 20px;
	margin-right: 5px;
	cursor: pointer;
  background: #e1edf4;
  transition: background ease 0.2s;
}
.tabs .tab {
  order: 99;
  flex-grow: 1;
	width: 100%;
	display: none;
  background: #fff;
  padding:15px 20px
}
.tabs input[type="radio"] {
	display: none;
}
.tabs input[type="radio"]:checked + label {
	background: #fff;
}
.tabs input[type="radio"]:checked + label + .tab {
	display: block;
}

@media (max-width: 45em) {
  .tabs .tab,
  .tabs label {
    order: initial;
  }
  .tabs label {
    width: 100%;
    margin-right: 0;
    margin-top: 0.2rem;
  }
}




@media (min-width:2500px) {
body {background-size: 1150px auto;background-position:top 20px left }
}


@media (max-width:1800px) {
body {background-size: 800px auto; background-position:top 70px left}
}

@media (max-width:1400px) {
body {background-size: 650px auto;background-position:top 60px left}
.wrapper {width:1000px;}
.errormessage {	width:980px; }

}


@media (max-width:1200px) {
body {background-size: 500px auto;background-position:top 70px left}
.logo {max-height:85px; margin-bottom:35px}
.wrapper {width:90%;}
.errormessage {	width:90%; padding: 10px 0 }
input {width:200px; }
.select-wrapper.anzahl{width: 454px;}
select.anzahl {width:204px;}
}

@media (max-width:1050px) {
input {width:150px; }
.select-wrapper.anzahl{width: 404px;}
select.anzahl {width:154px;}
}


INPUT.subradio {display: inline!important;	}

.anfrageformular {padding-top:25px}
.anfrageformular input {width:150px}
.anfrageformular textarea {width:100%; height:150px;border:1px solid #80a9c0; padding:0 10px; margin-bottom:20px}

.deletebutton {color:#bc3f48;}
.addfz {display:inline-block; padding-top:20px; text-align:right; background:#bc3f48; padding:8px 15px; color:#fff; font-size:14px;float:right}
.addfz:hover {background:#a63740; color:#fff;}
.addfz#plusbutton {cursor:pointer}


.tabheader { height: 32px; }
.tabheader span {
	min-width: 100px;
//	text-align: right;
}
.tabheader > span[node=text] {
	display: inline-block;
	padding: 1px;
	margin-top: 1px;
	font-size: 14px
}
.tabheader > span[node=text] {
	display: inline-block;
}
.tabheader IMG {
	width: 1em;
	height: 1em;
} 
.tabheader > span[node=input] {
	display: none;
}
.tabheader > span[node=input] > INPUT {

	width: auto!important;	
	padding: 0px!important;
	margin: 1px 3px 3px 1px!important;
	height: auto!important;
	font-size: 14px
}


@media (max-width:1000px) {
body {background-size: 400px auto; font-size:14px}
.daten td, .rabatte td,.hinweise table td, .vermittler td {width:100%; display:block; padding:0px!important}
table.rabatte td:first-child, table.vermittler td:first-child {border:none}
.daten td:nth-child(2) {margin-top:25px}
.right {padding-left:0px; width:100%}
input {width:400px; }
.select-wrapper.anzahl{width: 654px;}
select.anzahl {width:404px;}
h1 {margin-bottom: 25px;}
.block {margin-bottom: 20px;}


}





@media (max-width:750px) {
h1 {font-size:20px}
input {width:100%;margin-bottom:20px;}
.select-wrapper.anzahl{width: 100%;}
.select-wrapper.anzahl:before {top: 30px;}
select.anzahl {width:100%;}
.laufzeit input {width:70%}
.laufzeit em {width:30%}
h1 {margin-bottom: 20px;}

table.faktoren {width:800px!important;padding-bottom:20px}
table.faktoren tr:first-child {background:#bc3f48; color:#fff}
table.faktoren td {padding:10px 5px!important; display:inline-block; text-align:center; width:130px}
table.faktoren td:first-child  {text-align:left;width:315px}
.block {margin-bottom: 15px;}
table.rabatte td:first-child,table.vermittler td:first-child { border-right: none;}

.table-scrollable {
  width: 100%;
  overflow-y: auto;
  margin: 0 0 1em;
}

.table-scrollable::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 14px;
  height: 14px;
}

.table-scrollable::-webkit-scrollbar-thumb {
  border-radius: 8px;
  border: 3px solid #fff;
  background-color: rgba(0, 0, 0, .3);
}

.tabs .tab {padding: 0;}
div.small {padding:0 20px}
table.rabatte, table.faktoren {padding: 20px;}
.anfrageformular input {width:250px}
.anfrageformular textarea {width:93%; height:100px;}
}


@media (max-width:500px) {
.logo {max-height:60px;}
h1 {margin-bottom: 0px;}
body {background-size: 80% auto;font-size:14px;}
h2 {font-size:18px}
h3 {font-size:16px}
.gesamtpraemie span {font-size:24px;}
div.button {padding: 8px 14px;	font-size:18px;}
.footer {font-size:12px;padding:10px 0}
.footer {line-height:18px}
.rechtliches a, .footer a {font-size:12px;}
.rechtliches {padding:0 0 15px; }
.rechtliches a {font-size:12px;}
.link {padding:50px 0; margin: auto; width:100%; text-align:center }
.link a {font-size:16px; width:100%}
.hinweise {padding:20px}
.zzgl {font-size:7px}
.fzpraemie { font-size:16px; margin-top:15px}
.fzpraemie em {display:block}
.daten {padding: 20px;}
input {width: 93%;}

}

.mailerfolgreich { background: green!important };
.mailnichterfolgreich { background: red!important };
