/*
	Empfehlung: verwenden Sie am besten den Befehl !important am Ende einer jeden Eigenschaft, um sicherzugehen, dass diese von der Anwendung auch genommen wird.
	e.g.: color: #ff2200 !important;

*/


/*** SCHRIFTART IMPORTIERUNG ***/

/* raleway-500 - latin */
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 200;
  src: local(''),
       url('/GoogleFonts/raleway-v28-latin-200.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/GoogleFonts/raleway-v28-latin-200.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}


/* poppins-300 - latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  src: local(''),
       url('/GoogleFonts/poppins-v20-latin-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/GoogleFonts/poppins-v20-latin-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}


/*** SCHRIFTART ZUWEISUNG, GRÖSSE UND FARBE ***/

/* Ãœberschriften */
h1,h2,h3,h4,h5,h6,.title-default, .title-small
{
	font-family: 'Raleway' !important;
	font-weight:200 !important;
	color:#fff !important;
}

h1
{
	font-size:30px !important;
}


h2
{
	font-size:26px !important;
}


h3
{
	font-size:22px !important;
}


h4
{
	font-size:20px !important;
}


h5
{
	font-size:18px !important;
}


h6
{
	font-size:16px !important;
}

/* Überschrift und Sub-Überschrift oberhalb der Hauptfläche (Betriebsname und Seitenname) */
.title-default
{
	font-size: 17px !important;
	color:#fff !important;
}

.title-small
{
	font-size: 13px !important;
	color:#f3f3f3 !important;
	display: none;
}

/* Fließtext */
p, span
{
	font-family: 'Poppins' !important;
	font-weight:300 !important;
	color:#f4f4f4 !important;
	font-size:13px !important;
	line-height: 1.5 !important;
}

/* Formatierungen */
b, strong {
    font-weight: 200;
}


/*** FLÄCHEN STYLING ***/

/* Background Kopfbereich (Betriebsanme und Seitenname) */
ion-menu-button
{
	color:#fff !important;
}

.toolbar-title-small, .toolbar-segment, .toolbar-title-default
{
	--background: #000 !important;
}


/* MAIN CONTENT BACK */
ion-content
{
	--background: no-repeat center/cover url(/media/uipllu4h/istock-517128364.jpg) !important;
}


/* CARD ELEMENTS */
ion-card-content ion-label h1,
ion-card-content ion-label h2,
ion-card-content ion-label h3,
ion-card-content ion-label h4,
ion-card-content ion-label h5,
ion-card-content ion-label h6

{
	color:#333 !important;
}

ion-card
{
	--background: rgba(255,255,255,0.8) !important;
}

ion-card-title
{
	font-weight:200 !important;
}

ion-card-content ion-text h2
{
	font-size: 18px !important;
	font-weight:200 !important;
}

ion-card-content ion-label h3
{
	font-size: 14px !important;
	font-weight:200 !important;
}


/* MENU AND ARTICLE DETAIL ELEMENTS */


.segment-button
{
	--ion-toolbar-segment-indicator-color:#666 !important;
	--indicator-color:#666 !important;
	--indicator-height:6px !important;
}

ion-label, ion-icon
{
	color:#fff !important;
}

/* PRICE in OVERVIEW */
.ion-text-right {    
    color: #fff !important;
	font-size: 16px !important;
}

ion-item, ion-item-divider, ion-toolbar
{
	--background: transparent !important;
	background: transparent !important;
}

.toolbar-searchbar
{
	--background: #333 !important;
	background: #333 !important;
}

ion-footer
{
	--background: #333 !important;
}

ion-footer ion-toolbar, ion-footer
{
	--background: #333 !important;
	background: #333 !important;
}

.list-md, ion-list
{
	background: transparent !important;
	--background: transparent !important;
}

.native-textarea::placeholder, .native-input ::placeholder,
.input-wrapper slot ion-input::placeholder,
.datetime-text
{
  color: #fff !important;  
}

/*** BUTTONS UND LINKS ***/

.button-outline
{
	color:#333 !important;
	border-color:#333 !important;
	--border-color:#333 !important;
}

.button-inner

{

font-weight:bold !important;

}

.btn-order
{
	--ion-toolbar-color: #b0ca0b !important;
	--background:  #b0ca0b !important;
	--color: #fff !important;
	--ion-toolbar-background: #fff !important;
	font-weight:200 !important;
	border:0px solid black !important;
}


::placeholder {
color:#ccc !important;
}


a
{
	color: #b0ca0b !important
}

/*** OLD STUFF ***/
.main-menu .ion-color-light p
{
   padding:10px; background:rgba(0,0,0,0.6);
   color:#fff !important;
}




ion-content {
--background: #121212 url(/media/uipllu4h/istock-517128364.jpg) !important;
}

ion-app{
  --color: #fff !important;
  --ion-color-primary:  #121212 !important;
  --border-color : transparent !important;
  --ion-color-light:  #b0ca0b !important;
  --ion-color-primary-contrast: #fff !important;
  --ion-color-primary-contrast-rgb: #fff !important;
}

.ion-color-success{
  --ion-color-base: #262424 !important;
}
.ion-color-medium{
  --ion-color-base:#262424 !important;
}
.ion-color-primary {
  --ion-color-contrast: #262424 !important
}
ion-ripple-effect{
  color: #b0ca0b !important;
}
.native-textarea.sc-ion-textarea-md{
  color: #fff !important;
}
#open-modal {
  border: 0px solid #b0ca0b !important;
  --background: #b0ca0b !important;
  color: #fff;
}

app-text p,
app-text h2,
app-text h3 {
  color: #cccccc !important;
}

/* Header */
ion-header{
  background: #121212 !important;
  --color: #fff;
}

ion-header ion-buttons {
  color: #b0ca0b !important;
}


icon-header .toolbar-title{
  --color:  #fff  !important;
}



/* CARD */
ion-card-content ion-label h1,
ion-card-content ion-label h2,
ion-card-content ion-label h3,
ion-card-content ion-label h4,
ion-card-content ion-label h5,
ion-card-content ion-label h6 {
  color: #fff !important;
}

ion-card {
  --background: #262424 !important;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 1.5) !important;
}

ion-card-title {
  color: #fff !important;
}

ion-card-subtitle{
  color: #cccccc;
}

ion-card-content ion-text h2,
ion-card-content ion-text h3,
ion-card-content ion-text h4 {
  color: #fff !important;
}

ion-card-content ion-label h3 {
  color: #cccccc;
}

/* articale */
div.label > ion-text {
  color: #b0ca0b !important;
}

div.ion-padding-start > h4 {
  color: #cccccc !important;
}

.segment-button
{
	--ion-toolbar-segment-indicator-color:#262424 !important;
	--indicator-color:#262424 !important;
	--indicator-height:6px !important;
}


ion-label {
  color: #fff !important;
}
ion-icon {
  color: #b0ca0b !important;
}

.button-inner slot ion-icon {
  color: #ffffff !important;

font-weight:bold !important;


}


/* PRICE in OVERVIEW */
.ion-text-right {
  color: #fff !important;
  font-size: 16px !important;
}
.item-detai{
  color: #fff;
}

ion-item, ion-item-divider, ion-toolbar {
  --background: transparent !important;
  background: transparent !important;
 
}

ion-item, ion-textarea {
  color: #ffffff !important;
}

/* search */
ion-searchbar{
  color: #ffffff !important;
  --background: #121212 !important;
}

#maincontent > app-food-menu > ion-header > div > ion-toolbar > ion-searchbar > div > input{
  background-color: #262424 !important;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 1);
}

app-footer ion-footer{
  --background: #121212 !important;
  overflow: hidden;
  --color: #fff !important;
}

  ion-footer ion-toolbar, ion-footer {
    background: #121212 !important;
    color: #fff !important;
  }

.list-md, ion-list {
  background: #121212;
  --background:  #121212;
}
.list-ios{
  background: #121212;
}

ion-buttons > ion-menu-button{
color: #b0ca0b !important;
}
.native-textarea::placeholder, .native-input ::placeholder,
.input-wrapper slot ion-input::placeholder,
.datetime-text {
  color: #fff !important;
}

/*** BUTTONS UND LINKS ***/

.button-outline {
  color:  #fff !important;
  --border-color: #b0ca0b !important;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 1.5);
}

#ion-overlay-10 > ion-button{
  border: 1px solid #b0ca0b !important;
}

ion-button{
  box-shadow: 0 4px 8px rgba(0, 0, 0, 1) !important;
}

/* Food menu */
ion-textarea > div > textarea {
  color:#fff !important;
}
#maincontent > app-food-menu > ion-content > ion-fab > ion-badge{
  color: #fff;
}

/* cart */
#maincontent > app-cart > ion-content > ion-grid{
  color: #fff;
}

.ion-color-danger{
  --ion-color-base: #767676 !important;
}

ion-title {
  color: #fff !important;
}

/* payment selection */
app-payment-providers > ion-content > ion-radio-group > ion-list {
  background-color: #262424 !important;
}
app-payment-providers > ion-content > ion-row> ion-col {
  color: #fff;
}

#btn-payment {
  --background: #b0ca0b !important;
}

ion-footer ion-toolbar div.toolbar-container > div{
  --background: #b0ca0b !important;
}
app-payment-providers > ion-content > ion-row > ion-col > div > ion-item {
  background-color: #262424 !important;
}

.menu, .main-menu, .bg-black {    
    background-color: transparent !important;    
}

.food_header1, .heading { 
    background: rgba(0,0,0,0.8);
}

.food_header1 {    background: transparent;
}

ul,li{

color: #dcdcdc;

}