:root {
  --primary: #558ddc;
  --primary2: #50c2fc;
  --middle: #77c991;
  --secondhover: #64d995;
  --second: #2fd475;
  --confirmation: #90d42f;
}

.full{
width:100%;
}

div.info{
border: 1px solid blue;
padding: 0.5em;	
margin-top: 1em;
font-weight: bold;
color: blue;
}

.blob_editable {
color: #EEE; 
}


.bb_errorbox{

    padding: 2em;
    min-width: 200px;
    width: 400px;
    max-width: 400px;
    min-height: 200px;
    text-align: center;
    align-items: center;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    border-radius: 6px;
    position: relative;

	padding: 2em;
    background-color: white;
    text-align: center;
    min-height: auto;
    background-color: #d42f2f;
    color: white;
	    border-radius: 6px;
}

.bb_teaser .ce_accordion textarea{
overflow: visible;	
padding: 0.5em;
width: calc(100%);
max-width: 100%;
min-width: 100%;
}


.bb_teaser.used{
background: #555;	
color: white; 
opacity:0.75;
padding: 10px;
width: 100%; 
/*width: calc(1000px + 1em);*/
max-width: 100%;
min-height:0;
margin:0;
padding:0;
display: flex; 
justify-content:flex-start;
padding:10px;
margin:1px;
padding-right: 120px;
}

.bb_teaser i{
display: inline;	
}



.bb_teaser.used > *:not(.ce_accordion) {
	
width:auto;	
}

.bb_teaser.used h6 {
text-align:left;
margin:0;
margin-right:10px;
}

.bb_teaser.used .preis,
.bb_teaser.used .winter{
margin-right:10px;	
}

.bb_teaser .infos{
	display: inline;
}

.bb_teaser.used .zuletzt{
display: inline;	
}

.bb_teaser.used .bb_notit{
	width:auto;
padding:10px;	
position:absolute;
top:0;
right:0;
}

.bb_teaser .toggler{
    position: absolute;
    top: 0;
    left: 0;
    width: auto;
    padding: 5px;
    background: #8d8d8d;
color:white;	
}

.bb_teaser.used .ce_accordion .toggler{
width: auto; 
position: absolute; 
top:0;
right:82px;
left: unset;	
padding: 10px;
background: transparent;
}



.bb_teaser.used .ce_accordion{
width: 100%; 

}


.bb_teaser.used .nxt{
color: #2fd475;	
font-weight: bold;
display: inline; 
border-left: 1px solid white;
margin-left: 10px; 
padding-left: 10px;
}

.pagination{
width:100%;
display: flex;
justify-content:center;
}

.pagination > span{
opacity: 1;
}

.pagination > a{
opacity: 0.5;
}

.pagination > a,
.pagination > span{
padding: 1rem; 
background-color: var(--primary); 
margin: 0.5rem;
color: white;

}

#wrapper #bb_close{
width:auto;
height:auto;
position:absolute;
top: 1rem; 
right: 1rem;
}

#wrapper .bb_widget{
margin-top: 1rem; 
margin-bottom: 1rem;
}

#wrapper #bb_fixedbox button{
text-align: center;
}

.checkbox_container div {
    display: flex;
    gap: 5px;
	width: 100%;
	justify-content:flex-start; 
	text-align:left;
}

.checkbox_container input {
	width: auto;
}


#wrapper .bb_widget > .new label {
margin-top: 1rem;
}

#wrapper .bb_w50{
width: auto;
}

#wrapper .bb_w100{
width: 100%;
}

.new_item.blob > *:not([type="checkbox"]) {
width: 100%;
display: flex; 
justify-content: flex-start;
flex-wrap: nowrap;
align-items: center;
padding-top: 0.2rem; 
padding-bottom: 0.2rem; 
 
}

.new_item.blob > *  > *{
width: auto;
margin-right: 0.2rem;
}

#wrapper .bb_w100 textarea{
width: 100%;
}

#wrapper .bb_widget > *{
text-align: left;
width: auto;
min-width: 300px;
margin-right: 1rem;
}


#wrapper .bb_widget > label{
font-weight: bold;
}



#wrapper .savenew{
margin-top: 2rem;
width: 200px;
}

#wrapper .bb_hidden{
display: none; 
}

#wrapper .bb_visible{
display: block; 
}

#wrapper #bb_fixedbox{

position: fixed; 
width: 100%;
height: 100vh;
background-color: rgb(255, 255, 255,0.7);
left: 0; 
top: 0;
padding: 3rem;
z-index: 20;
}


#wrapper #bb_fixedbox > div{
position: relative;
width: 100%;
height: 90vh;
background-color: white; 
padding: 3rem;
z-index: 20;
border: 1px solid #F0F0F0;
overflow-y: scroll; 
display: flex;
justify-content: flex-start; 
flex-wrap: wrap; 
align-content: flex-start;
}

.new .toggler{
background-color:  var(--confirmation);
color: white; 
font-weight: bold; 
padding:1rem;
font-size: 30px;}

#wrapper #main .bb_stick{
position: fixed;


}

.devmode{
width: 100%;
position: fixed;
bottom:0;
background-color: red;
text-align: center; 
color: white;
padding: 1rem;
z-index: 10;
}

.version{
width: 200px;
position: fixed;
bottom:0;
right:0;
background-color: white;
text-align: center; 
padding: 0.5rem;
margin: 0.5rem;
z-index: 11;
}

.ce_accordion .accordion {
    display:none;
}



.toggler:hover{
cursor: pointer;

}
*{
-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
text-transform: none !Important; 
}

#box_1{
text-transform: uppercase;
}

body #wrapper,
#bbblobedit-overlay{
color: #555;
line-height: normal;
	font-size: 16px;
	font-family: 'Open Sans', sans-serif;
}

body {
background-color: #f1f1f1;

}

.bb_teaser.unpublished{
opacity: 0.6; 
}

#bbtop2pdf{
margin: auto;

}

#save,
#create,
#create-n-save{
background-color: var(--secondhover);
}

body #wrapper .mod_login{
padding-top: 10px;
position: absolute;
right: 260px;
color: #555;
font-size: 11px;
background-color: rgb(255, 255, 255,0.4);
padding: 10px;
}


body #wrapper .mod_login td{
font-size: 11px;
}

#wrapper .mod_login input{
padding: 0.2em;
font-size:11px;
margin-top: 10px;
background-color: #555;
}

.ue_link{
background-color: #555;
color:white;
width: 100%;
padding:20px;
display: block;
text-align: center;
margin-bottom: 10px;
}

#bbinfobox{
width: 100%;
}
.mod_navigation.refresh{
width:100%; 
}


.mod_navigation.refresh a,
.mod_navigation.refresh span{
display: flex;
margin: 1rem;
}


.mod_navigation.refresh ul{

display: flex;
justify-content: center; 
flex-wrap: wrap;
}

.ue_link.nolink{
background-color: #999;
}

body button,
.submit,
.button
{
background-color: var(--primary);
background-image: none;
border: 0; 
color: white;
font-weight: 700;
padding: 1em;
border-radius: 4px;
box-shadow: 0 1px 7px transparent,inset 0 0 0 1px rgba(0,0,0,.20);
}

#bbweidabutton .button{
background-image: none;
border: 0; 
color: white;
font-weight: 700;
padding: 1em;
border-radius: 4px;
box-shadow: 0 1px 7px transparent,inset 0 0 0 1px rgba(0,0,0,.20);
}

button:hover{
cursor: pointer;
background-color:var(--primary2);
}

#wrapper a{
text-decoration: none;
}


/* NAVIGATION START*/ 
.mod_navigation.bbfull {
width: 100%;
padding: 10px;
background: -moz-linear-gradient(top,var(--primary) 0,var(--primary2) 100%);
background: -webkit-linear-gradient(top,var(--primary) 0,var(--primary2) 100%);
background: linear-gradient(to bottom,var(--primary) 0,var(--primary2) 100%);
display: flex;



}

.mod_navigation.bbfull ul {
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
margin: 0;
padding: 0; 
}

.mod_navigation.bbfull ul li {
display: flex;
width: auto;
}

#wrapper .mod_navigation.bbfull ul li a,
#wrapper .mod_navigation.bbfull ul li span{
padding-left: 10px;
padding-right: 10px;
padding-top: 20px;
padding-bottom: 20px;
color:white;
font-weight: 700;
font-size: 25px;
}

body #wrapper .mod_navigation.bbfull .active,
body #wrapper .mod_navigation.bbfull a:hover  {
color: rgba(255, 255, 255, 0.6);

}

/* NAVIGATION END*/ 


#wrapper .confirmation{
padding: 2em; 
background-color: white; 
text-align: center;
min-height: auto;
background-color: var(--confirmation);
color: white;
margin-top: 1rem;
border-radius: 6px;
}

#wrapper .warning{
padding: 2em; 
background-color: white; 
text-align: center;
min-height: auto;
margin: 1em;
background-color: #ff8400;
color: white;
}

.bbleft .confirmation{
width: 100%;
}


.bb_teaser{
background-color: white;
padding: 2em;
min-width: 200px;
width: 400px;
max-width: 400px;
min-height: 200px;
margin: 1em;
text-align:center;
align-items:center;
display: flex;
justify-content: center;
/*box-shadow: 0 1px 7px transparent,inset 0 0 0 1px rgba(0,0,0,.20);*/
flex-wrap:wrap; 
border-radius: 6px;
position: relative;

}


#wrapper .orange{

background-color: #ed9914; 
}

.yellow{

background-color: #9dd55a; 
}

.bb_teaser.cthree > *{
width:auto;
margin:0.4rem;
}

#wrapper .bb_teaser .tptitle{
width: 100%;
}



.bb_teaser.rfive{
min-width: 200px;
width: 200px;
max-width: 200px;
min-height: 200px;

}

.bbright .bb_teaser{
background-color: white;
padding: 2em;
min-width: 200px;
min-height: 200px;
margin-left: 0;
margin-right: 0;

}

.logo{
position: absolute;
    right: 15px;
    top: 15px;
}

.bbright #bb_storage_item li,
#bb_new_getraenkeliste > div > div,
#bb_new_menue > div > div
{
display: block;
margin-top: 20px;
margin-bottom: 20px;
}

#wrapper .bb_teaser.createmenue,
#wrapper .bb_teaser.creategetraenk,
#bbweidabutton,
.submit{
padding:0;
background-color: var(--second);
}

#wrapper .bb_teaser.createmenue a,
#wrapper .bb_teaser.creategetraenk a,
#bbbutton a,
.submit{
height:100%;
color:white;
font-weight: 700;
justify-content: center;
align-items:center; 
align-content:center;
display:flex;
flex-wrap: wrap;
padding: 2em;
padding-left: 0.5em;
padding-right: 0.5em;
}

.bb_weather_box{
text-align:center;	
}

#bbweidabutton a:hover,
.submit:hover{
 background-color: var(--secondhover);
 cursor:pointer;
} 


#wrapper .bb_teaser.createmenue:hover,
#wrapper .bb_teaser.creategetraenk:hover{
background-color:var(--primary2);
}


#wrapper .bb_teaser.createmenue a:after,
#wrapper .bb_teaser.creategetraenk a:after{
content: '+';
color: white;
font-size: 150px;
opacity: 0.5;
width: 100%;
text-align:center;
}


.bb_teaser  *{
width: 100%;
height: auto;
display: block;
overflow: hidden;
}


body .bbconfig{
margin-bottom: 40px;
border-bottom: 1px solid white;
justify-content: center;
}

#bb_content{
margin-top: 20px;
padding-top: 10px;
border-top: 1px solid white;

}

.loading:after{
background-color: white;
position:fixed;
top:0;
content:'';
width:100%;
height:100%;
opacity: 0.8; 
}


#bbshow,
#bb_content,
.bb_xshow,
.bbconfig{
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
margin-bottom: 0;
}

.bb_teaser h6{
font-size: 16px;
}

.gibausdiv > div > div > div:hover,
#bb_storage_item > li:hover{
border: 1px dotted red;
cursor: not-allowed;
}

#main .bb_teaser.active{
border:1px solid #2fd475;
}

#main .bb_teaser.active:after{
position: absolute; 
top:0;
right:0;
content: '✅';
font-size: 20px; 
padding-right: 20px;
padding-top: 10px; 
color: #2fd475;
}

#main .bb_teaser.used.active:after{
content:'';	
}

.bbcontainer{
width: 100%;
max-width: 1800px;
margin:auto;
display: flex;
flex-wrap: wrap-reverse;
justify-content: center;
margin-bottom: 0;
}


.bbajaxmenue{
display: flex;
flex-wrap: wrap-reverse;
justify-content: flex-start;
margin-bottom: 0;
}


.bbright{
width: 400px;

}

#wrapper .center{
justify-content: center;
}

#bb_tg_box > div,
#bb_tm_box > div{
max-height: 20vw; 
overflow-y: scroll; 
}

.mod_article.block{
overflow: visible;
}

body #wrapper .bbright > .sticky{
position: sticky;
top: 1rem;
-webkit-box-sizing: unset;
box-sizing: unset;
}

/*
.bbleft{
width: calc(100% - 440px);
margin-right: 40px; 

}
*/

.left{
width: calc(100% - 440px);
margin-right: 40px; 

}

#SchreibenDoghi,
#nimmananandog,
#bbweidabutton{
height: auto;
min-height: auto;


}

#wrapper img{
width: auto;

}

div.bb_filter{
background-color: white;
padding: 2em;
margin: 1em;
text-align:center;
align-items:center; 
display: flex;
justify-content: center;
box-shadow: 0 1px 7px transparent,inset 0 0 0 1px rgba(0,0,0,.20);
flex-wrap:wrap; 
border-radius: 6px;
position: relative;




}


.hidden{
	display: none;
}


::placeholder{
opacity: 0.5;
color: #FF;
}

#bbSearch{
margin: 15px; 
background-color: white;
padding: 2em;
margin: 1em;
text-align:center;
align-items:center; 
display: flex;
justify-content: center;
flex-wrap:wrap; 
border-radius: 6px;
position: relative;
border: 0;
margin-top: 40px;
margin-bottom: 40px;
height: 50px;
min-width: 300px;
}

div.bb_filter select{
padding:10px;
margin-right:2em;
}

div.bb_filter label{
padding-top:10px;
padding-bottom:10px;
margin-right:1em;
font-weight:600;
}



.warning,
.error{
	background-color:rgba(221,69,71,.1);
	border:1px solid #DD4547;
	border-radius:2px;

	color:#DD4547;
	padding: 1em;
	margin: 1em;
}
.hasteform_BBPrintFORM{
	display: none;
}

#mbImage{
	padding: 0px;
	margin-bottom: 10px;
}

.bbfullsliced,
.hasteform_BBCHANGETMFORM{
	width: 100%;
}
/*
.confirmation{
	background-color:rgba(126,147,8,.1);
	border:1px solid #7E9308;
	border-radius:2px;
	font-size:1.1em;
	color:#7E9308;
}
*/



#bbblobedit-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 1000;

}

#bbblobedit-popup {
  background: #fff;
  margin: 50px auto;
  padding: 2rem;
  width: 80%;
  max-width: 1380px;
  position: relative;
  border-radius: 10px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  overflow: hidden;
    padding-bottom: 5rem;
}


#bbblobedit-popup input{
padding: 0.5rem;	
}

#bbblobedit-content {
  max-height: 400px;
  overflow-y: auto;
  padding: 10px;
}

 #bbblobedit-save, #bbblobedit-add {
  position: absolute;
  bottom: 10px;
  padding: 1rem;
  cursor: pointer;
}

#bbblobedit-close:hover{
	   cursor: pointer;
}


#bbblobedit-close {
		 position: absolute;
  top:0.5rem;
  right: 0.5rem;
  padding:0;
  margin:0;
  background: transparent; 
  color: #666;
  border: 0;
  box-shadow: none;
  font-size: 1.5rem;
   cursor: pointer;
}

#bbblobedit-save {
  right: 2.5rem;
}

#bbblobedit-add {
  left: 2.5rem;
}

#bbblobedit-table {
  width: 100%;
  border-collapse: collapse;
}

#bbblobedit-table th, #bbblobedit-table td {
  border: 1px solid #ddd;
  padding: 8px;
  text-align: left;
}

#bbblobedit-table th {
  background-color: #f4f4f4;
}

#bbblobedit-table button {
  padding: 5px 8px;
  margin: 2px;
  cursor: pointer;
  border: none;
  border-radius: 5px;
  background: #007bff;
  color: white;
}

#bbblobedit-table button:hover {
  background: #0056b3;
}

#bbblobedit-table .deleteRow {
  background: #dc3545;
}

#bbblobedit-table .deleteRow:hover {
  background: #c82333;
}

#bbblobedit-table .addRowBelow {
  background: #28a745;
}

#bbblobedit-table .addRowBelow:hover {
  background: #218838;
}

/* Drag & Drop Platzhalter */
#bbblobedit-table .sortable-placeholder {
  background: #f0f0f0;
  border: 2px dashed #ccc;
  height: 40px;
}