:root {
  /* Title, background color of numbering and selected UI elements such as checkboxes and radio buttons */
  --tamaro-primary-color: #7BBE20; // #64971D; //green;
  
  /*  Primary text color */
  --tamaro-text-color: black;
  
  /* Defines the color for links, e.g. change currency */
  --tamaro-primary-color__hover: green;

  --tamaro-bg-color: #FFE;
  
  --tamaro-primary-bg-color: #EFE;
  
  --tamaro-bg-color__hover: #DED; 
 

 /*
   
 
  # Primary background color for selected areas
  --tamaro-primary-bg-color: #EFE;
 
  # Primary text color
  --tamaro-text-color
 
  # Background color for hover
  --tamaro-bg-color__hover
 
  # Primary color for borders
  --tamaro-border-color
 
  # Primary color for input field placeholders
  --tamaro-placeholder-color
 
  # Sets the color for text which are defined within an information container 
  --tamaro-info-text-color
 
  # Sets the color for info icons (e.g. CVV and instructions of credit card)
  --tamaro-info-icon-color
 
  # Sets the color for labels and underlines if an error appears
  --tamaro-error-color
 
  # Colors for default buttons, for instance the cancel button in the recurring dropdown.
  --tamaro-button-color
  --tamaro-button-color__hover
  --tamaro-button-bg-color
  --tamaro-button-bg-color__hover
  --tamaro-button-border-color
  --tamaro-button-border-color__hover
 
  # Colors for primary buttons, for instance the submit button.
  --tamaro-button-primary-color
  --tamaro-button-primary-color__hover
  --tamaro-button-primary-bg-color
  --tamaro-button-primary-bg-color__hover
  --tamaro-button-primary-border-color
  --tamaro-button-primary-border-color__hover

*/
}


/* https://vgt.at/presse/news/2024/bilder/auto/20240612_aktion1.jpg */


#tamaro-widget.tamaro-widget .widget-content .widget-block .widget-block-header .title .position + .text {
  font-family: "Roboto Condensed",helvetica,sans;
  font-weight: 700;
  font-size: 1.8em;
}

#tamaro-widget.tamaro-widget .widget-content .widget-block .widget-block-content {
  font-size: 1.3em;
  font-weight: bolder;
}

#tamaro-widget.tamaro-widget .payment-amounts .amount .main .code {
	font-size: 1.2rem !important;
}

#tamaro-widget.tamaro-widget .payment-amounts .amount.custom-amount .form-block label {
  font-size: 1.3rem !important;
}

#tamaro-widget.tamaro-widget .payment-email-permission-block .footer {
	display: none;
}

#tamaro-widget.tamaro-widget .widget-content .widget-block .widget-block-header {
	overflow: initial !important;
}

#tamaro-widget.tamaro-widget .stored_customer_birthdate .icons-block {
  display: none;
}

#tamaro-widget.tamaro-widget .payment-submit .main button {
  font-size: 1.5rem !important;
}

#tamaro-widget.tamaro-widget.tamaro-bp-sm .payment-payment-methods > .main .payment-methods .payment-method .text {
  font-size: 1.4rem !important;
}

#tamaro-widget.tamaro-widget .payment-download-pdf {
  display: none;
}

#tamaro-widget.tamaro-widget .footer-info > .main button[data-rnw-overlay="data-protection-policy"] {
  display: none;
}

#tamaro-widget.tamaro-widget .payment-payment-method-details > .main .payment-method-details > .header .title .text {
  font-size: 1.6rem !important;
  font-weight: 500 !important;
}

#tamaro-widget.tamaro-widget .payment-status.payment.success > .main {
	display: none;
}

@media screen and (min-width:700px) {
	#form .rnw-widget-container {
		min-width: 700px;	
	}
}

#spendendatenschutz {
  text-align: center;
  margin-bottom: 20px;
}

#form {
  background-color: #FFE;
  padding: 16px 0px;
  margin: 0 0 20px;
  border: 1px solid lightgray;
  border-radius: 10px;
}

#form > .rnw-widget-container {
  /* background-color: #EFE; */
  padding: 8px;
}

#tamaro-widget {
 	padding: 0 8px;
}

#tamaro-widget.tamaro-widget .selected {
  font-weight: bold;
}

#article {
	width:auto;
	max-width:1100px;
	margin:auto;
	padding:0;
	font-size:16px;
	line-height:1.4em;
}

#spgs {
	position:static;
	float:right;
	margin:10px 0 5px 10px;
}
#spgs img {
	width:140px !important;
}
#slider {
	width:100%;
	height:300px;
	background-size:cover;
	background-position:center middle;
	text-align:right;
	overflow:hidden;
}
#slider > a:first-child {
	position:absolute;
	top:10px;
	left:50%;
	margin-left:400px;
	z-index:2;
}
#slider #gross {
	width:100%;
}
#slider > a:first-child img {
  width: auto;
  transition: none;
}
h1 {
	padding-top:1rem;
	font-size:32px;
	line-height:1.1em !important;
}
ol {
	counter-reset:li;
	margin-left:0;
	padding-left:0;
}
ol > li {
	position:relative;
	margin:5px 0 5px 3em;
	padding:4px 0 4px 8px;
	list-style:none;
}
ol > li:before {
	content:counter(li);
	counter-increment:li;
	position:absolute;
	top:5px;
	left:-2em;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
	width:2em;
	margin:0 2em 0 0;
	padding:4px;
	color:#fff;
	background-color:#7bbe20;
	font-weight:700;
	font-family:"Roboto";
	text-align:center;
	border-radius:1.4em;
}
.rand {
	margin:20px 40px 0;
}
div.untereinander > div.sblock > h2:first-child {
	margin-top: 0;
}
#form {
	width:65%;
	display:inline-block;
	vertical-align:top;
	overflow:hidden;
}

.untereinander {
	display:inline-block;
	max-width:330px;
	width:30%;
	vertical-align:top;
	float: left;
	margin-left: 40px;
}
.sblock {
	margin:0 0 2rem;
	padding:0 0 2rem;
}

.sblock:last-child {
	font-size: 13px;
}

#footer {
	margin:auto;
	padding:5px 10px 10px 10px;
	text-align:center;
	background-color:transparent !important;
}


@media screen and (max-width:1099px) {
	#slider > a:first-child {
		left:auto;
		right:0;
		margin-left:0;
	}
}
@media screen and (max-width:1049px) {
	#slider {
		height:200px;
	}
	#form,
	.untereinander,
	.sblock {
		max-width:100% !important;
		width:auto !important;
		display:block;
	}
	.untereinander {
		max-width:640px !important;
		margin:0 40px;
	}
	#footer {
		margin-top:-2rem;
	}
}
@media screen and (max-width:599px) {
	#slider {
		height:150px;
	}
	#slider a:first-child {
		width:99px;
	}
	#slider > a:first-child img {
		width:99px;
	}
	#spgs img {
		width:80px !important;
	}
	#lema-container.lema-container .lema-step-content {
		padding-right:15px !important;
	}
}
@media screen and (max-width:489px) {
	#slider {
		height:auto;
	}
	#form {
		padding-bottom:40px;
	}
}
@media screen and (max-width:400px) {
	#slider {
		height:auto;
	}
	#form {
		padding:0 0 40px 0;
	}
}
