* {
 font-family: "Arial", "Helvetica", sans-serif;
}

body {
  display: grid;
  place-items: center;
  background:#000 url(/img/bg/background5.jpg) top center;
  background-attachment:fixed;
  background-size: cover;
  color: #e8eaed;
}

	a {
		-moz-transition: color 0.2s ease-in-out;
		-webkit-transition: color 0.2s ease-in-out;
		-ms-transition: color 0.2s ease-in-out;
		transition: color 0.2s ease-in-out;
		color: #319e29;
		-webkit-scrollbar: #319e29;
		text-decoration: none;
	}

		a:hover {
			color: #69ff24 !important;
		}

			a:hover strong {
				color: inherit;
			}

#taschenrechner {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.4rem;
}

#taschenrechner * {
  color: inherit;
}

#anzeige {
  background-color: #000;
  grid-column: span 4;
  border: 2px solid #0f4200;
  border-radius: 0.5em;
  padding: 0.5em;
  text-align: end;
  display: flex;
  flex-direction: column;
  gap: 0.7em;
}

#eingabefeld {
  background-color: #000;
  border: none;
  font-size: 2rem;
  text-align: inherit;
}

#eingabefeld:focus-visible {
  outline: none;
}

#anzeige:focus-within {
  outline: 3px solid #319e29;
}

.taste {
  background-color: #0f4200;
  border: none;
  font-size: 1.2rem;
  padding: 1em 2em;
  border-radius: 0.25em;
  cursor: pointer;
  transition: background-color 0.5s;
}

.taste:hover {
  background-color: #319e29;
}

#rechenweg-anzeige {
  line-height: 1.2;
  height: 1.2em;
}

#rechenweg-anzeige.fehler {
  color: #ff8080;
}

		
/* Footer */

	#footer .copyright {
		color: #9fa3a6;
		font-size: 0.8em;
	}

		#footer .copyright a {
			color: inherit;
		}
		
/*####----BROWSER SCROLL BAR----####*/
::-webkit-scrollbar {
          background: -webkit-linear-gradient(40deg, #000, #174e13, #000 100%)!important;
          border-left: 1px solid #1A1A1A !important;
}
::-webkit-scrollbar-thumb {
          background-color: #1f6619 !important;
          border-radius: 16px!important;
}

.box2 {
	border-radius: 0.375em;
	border: solid 3px;
	border-color: #ff0000;
	margin-bottom: 2em;
	padding: 1.5em;
	background-color: #000;		
	display: block;
	position: sticky;
	top: 0px;
	z-index: 9;
}

	.box2 > :last-child,
	.box2 > :last-child > :last-child,
	.box2 > :last-child > :last-child > :last-child {
		margin-bottom: 0;
	}

	.box2.alt {
		border: 0;
		border-radius: 0;
		padding: 0;
	}

.ccm-modal--footer {
	background-color: #000 !important;
}
	
.ccm--is-blocking {
	background-color: rgba(0, 8, 2, 0.9) !important;
}
	
.ccm-powered-by a:link, .ccm-powered-by a:visited {
	display: none !important;
}
	
.ccm-modal--footer .ccm-link-container a:link, .ccm-modal--footer .ccm-link-container a:visited {
	text-align: center !important;
}
	
.ccm-modal--footer .ccm-link-container>a:not(:last-child)::after {
	text-align: center !important;
}
	
.ccm-modal--body {
	border-bottom: 1px solid #000 !important;
}
	
.ccm-widget--text .ccm-widget--title {
	text-align: center !important;
}
	
.ccm-root p {
	text-align: center !important;
	margin: 0 0 0 25% !important;
	padding: 1% !important;
	max-width: 50% !important;
}
	
.ccm-details--content--cookie>p {
	text-align: left !important;
}
	
.ccm-settings-summoner--icon {
	display: block !important;
	width: 80% !important;
	height: 80% !important;
	background-color: rgba(255,255,255,0) !important;
}
	
.ccm-modal--footer {
	justify-content: center !important;
}
	
.ccm-widget--buttons {
	-moz-transition: background-color 0.3s ease-in-out !important; 
	-moz-transition: color 0.3s ease-in-out !important;
	-moz-transition: border-radius 0.3s ease-in-out !important;
	-webkit-transition: background-color 0.3s ease-in-out !important;
	-webkit-transition: color 0.3s ease-in-out !important;
	-webkit-transition: border-radius 0.3s ease-in-out !important;
	-ms-transition: background-color 0.3s ease-in-out !important;
	-ms-transition: color 0.3s ease-in-out !important;
	-ms-transition: border-radius 0.3s ease-in-out !important;
	transition: background-color 0.3s ease-in-out !important;
	transition: color 0.3s ease-in-out !important;
	transition: border-radius 0.3s ease-in-out !important;
	justify-content: center !important;
}
	
.ccm-root .ccm-widget--buttons .button, .ccm-root .ccm-widget--buttons button {
	-moz-transition: background-color 0.3s ease-in-out !important; 
	-moz-transition: color 0.3s ease-in-out !important;
	-moz-transition: border-radius 0.3s ease-in-out !important;
	-webkit-transition: background-color 0.3s ease-in-out !important;
	-webkit-transition: color 0.3s ease-in-out !important;
	-webkit-transition: border-radius 0.3s ease-in-out !important;
	-ms-transition: background-color 0.3s ease-in-out !important;
	-ms-transition: color 0.3s ease-in-out !important;
	-ms-transition: border-radius 0.3s ease-in-out !important;
	transition: background-color 0.3s ease-in-out !important;
	transition: color 0.3s ease-in-out !important;
	transition: border-radius 0.3s ease-in-out !important;
	padding: 1em 2em !important;
	margin: 2px !important;
	border-radius: 2.5em 0 !important;
	max-width: 450px !important;
}
	
.ccm--badge, .ccm-root .button, .ccm-root button {
	-moz-transition: background-color 0.3s ease-in-out !important; 
	-moz-transition: color 0.3s ease-in-out !important;
	-moz-transition: border-radius 0.3s ease-in-out !important;
	-webkit-transition: background-color 0.3s ease-in-out !important;
	-webkit-transition: color 0.3s ease-in-out !important;
	-webkit-transition: border-radius 0.3s ease-in-out !important;
	-ms-transition: background-color 0.3s ease-in-out !important;
	-ms-transition: color 0.3s ease-in-out !important;
	-ms-transition: border-radius 0.3s ease-in-out !important;
	transition: background-color 0.3s ease-in-out !important;
	transition: color 0.3s ease-in-out !important;
	transition: border-radius 0.3s ease-in-out !important;
	margin: 2px !important;
	border-radius: 2em !important;
}
	
.ccm-root:hover .ccm-widget--buttons:hover .button:hover, .ccm-root:hover .ccm-widget--buttons:hover button:hover {
	-moz-transition: background-color 0.3s ease-in-out !important; 
	-moz-transition: color 0.3s ease-in-out !important;
	-moz-transition: border-radius 0.3s ease-in-out !important;
	-webkit-transition: background-color 0.3s ease-in-out !important;
	-webkit-transition: color 0.3s ease-in-out !important;
	-webkit-transition: border-radius 0.3s ease-in-out !important;
	-ms-transition: background-color 0.3s ease-in-out !important;
	-ms-transition: color 0.3s ease-in-out !important;
	-ms-transition: border-radius 0.3s ease-in-out !important;
	transition: background-color 0.3s ease-in-out !important;
	transition: color 0.3s ease-in-out !important;
	transition: border-radius 0.3s ease-in-out !important;
	padding: 1em 2em !important;
	margin: 2px !important;
	border-radius: 0 2.5em !important;
	max-width: 450px !important;
	color: #ffffff !important;
}
	
.ccm--badge:hover, .ccm-root:hover .button:hover, .ccm-root button:hover {
	-moz-transition: background-color 0.3s ease-in-out !important; 
	-moz-transition: color 0.3s ease-in-out !important;
	-moz-transition: border-radius 0.3s ease-in-out !important;
	-webkit-transition: background-color 0.3s ease-in-out !important;
	-webkit-transition: color 0.3s ease-in-out !important;
	-webkit-transition: border-radius 0.3s ease-in-out !important;
	-ms-transition: background-color 0.3s ease-in-out !important;
	-ms-transition: color 0.3s ease-in-out !important;
	-ms-transition: border-radius 0.3s ease-in-out !important;
	transition: background-color 0.3s ease-in-out !important;
	transition: color 0.3s ease-in-out !important;
	transition: border-radius 0.3s ease-in-out !important;
	margin: 2px !important;
	border-radius: 2em !important;
	color: #ffffff !important;
	border-color: #00c700 !important;
}