span.droppable {
   /* padding:2px ;*/ 
    margin-right: 4px;
    margin-left: 4px;
    background-color: #FFECB3; color: #FFECB3 ;
	border-radius: 0.5em 0.5em 0.5em 0.5em;
	cursor:auto;
	display:inline-block;
	height:1.6em;
	position: relative;
    top: 4px!important;
    overflow: visible!important;
    }
@media
(max-device-height :768px) and (max-device-width :1024px){
	span.droppable {
    margin-right: 4px;
    margin-left: 4px;
    background-color: #FFECB3; color: #FFECB3 ;
	border-radius: 0.5em 0.5em 0.5em 0.5em;
	cursor:auto;
	display:inline-block;
	height:1.6em;
	position: relative;
    top: 1px!important;
    overflow: visible!important;
    }
}
div.droppable {
    height: 7px; 
   /* padding:2px ;*/ 
    margin-right: 4px;
    margin-left: 4px;
    background-color: #FFECB3; color: #FFECB3 ;
	border-radius: 0.5em 0.5em 0.5em 0.5em;
	cursor:auto;
	height:1.6em;
    }

.draggable { 
     display: flex;
  align-items: center;
justify-content: center;     
    height: auto; 
    padding: 1px;
    padding-left: 3px;
    padding-right: 3px;
    margin: 2px;
    background: #fde295; color: #222222;
    border-radius: 0.5em 0.5em 0.5em 0.5em;
    border-style: solid;
    border-width:1px;
    border-color: grey;
    flex: 0 0 auto;
    max-height: 1.6em;
    z-index: 1000;
   /*font-weight: bold;*/}

.draggablesort { 
   height: auto; 
  padding-top: 3px;
  padding-bottom: 3px;
  padding-left:5px;padding-right:5px;
   margin: 4px;
    background: #fde295; color: #222222;
    border-radius: 0.5em 0.5em 0.5em 0.5em;
    border-style: solid;
    border-width:1px;
    border-color: grey;
    cursor:row-resize;
   }

#sortable { list-style-type: none; 
				margin: 0; 
				padding: 0; 
				width:100%; }
				
#sortable li span { position: absolute; 
							margin-left: -1.3em; }

input {
	border:none;
		background-color: #ffe699;
		border-radius: 0.2em;
		}

div.draggable{float: left;}

/*#punkte {margin:10px}*/

#feedback {font-weight: bold;/*padding-top: 10px;padding-bottom: 3px;*/}

.red, .feller {color: red;}

.spaltentitel {
		/*width: 50%;*/
		float:left;
		background-color: #FFF7D4;
		padding-left: 4px;
		padding-right:4px;
		/*margin-bottom: 5px;*/
		margin-right: 5px;
	   border-radius: 0.5em 0.5em 0.5em 0.5em;
	   border-style: solid;
	   border-width:1px;
	   border-color: grey;
}

.zeilentitel {
background-color: white;
padding-left: 4px;
padding-right:4px;
margin-bottom: 5px;
margin-right: 5px;
}

#col0, #col1,#col2,#col3,#col4,#col5,#col6,#col7,#col8
 {
 	color:black;
 	height: 100%;
    padding: 5px;
    border-radius: 0.7rem;
    font-size:1rem;
    font-weight: bold;
	}

#buttons button { 
min-width: 12rem;
 height: 2rem; 
 padding:5px ;
 line-height: 0px;
   font-size: 1rem; 
   text-align: center; 
   vertical-align: middle; 
   border-radius: 0.5em 0.5em 0.5em 0.5em;
	margin-left:2rem; }

#buttons button:hover { background-color:#cccccc; }

.space {cursor: url(https://www.pcraum.de/franzoesisch/css/sci.cur) 13 0,progress !important;}
.aig {cursor: url(https://www.pcraum.de/franzoesisch/css/aig.cur) 7 20,progress !important;}
.gra {cursor: url(https://www.pcraum.de/franzoesisch/css/gra.cur) 7 20,progress !important;}
.cir {cursor: url(https://www.pcraum.de/franzoesisch/css/cir.cur) 7 20,progress !important;}

.foundmarker0 {color: magenta;}
.foundmarker1 {color: red;}
.foundmarker2 {color: green;}
.foundmarker3 {color: blue;}
.foundmarker4 {color: firebrick;}

.komplettmarker0 {background: magenta;}
.komplettmarker1 {background: red;}
.komplettmarker2 {background: green;}
.komplettmarker3 {background: blue;}
.komplettmarker4 {background: firebrick;}

.buttonmarker0 {border: 3px solid magenta; }
.buttonmarker1 {border: 3px solid red; }
.buttonmarker2 {border: 3px solid green; }
.buttonmarker3 {border: 3px solid blue; }
.buttonmarker4 {border: 3px solid firebrick; }

#fortschrittsbalken{float: left;width: 200px;height:50px;}
#kategorien{float: left;width:200px}
.kategorie{height: 40px}

.inputfield[contenteditable=true]
 {max-height:30px;
	background-color: #FFEDAB;
	display:inline-block;
	text-align: center;
	border-radius: 0.2em;
	height: 1.9em;
	line-height: 1.9em;
	}

.inputfield.fehler
{
background-color:#ffb3b3;
}

.inputfield[contenteditable=true]:focus
 {
   max-height:28px;
	background-color: #FEE899;
	text-align: left;
	}

.inputfieldfehler[contenteditable=true]
 {
	display:inline-flex;
	border-radius: 0.2em;
	}