body {
    background-color:#373737; 
    margin: 0; 
    padding: 0;}
#H1 {
    padding:10px;
    text-align: center; 
    font-size: 25px; 
    color: #f8f9e5;  
    text-shadow: -2px 0 #373737, 0 2px #373737, 2px 0 #373737, 0 -2px #373737, 3px 3px 3px black;
    font-weight: 700;
    margin: 15px; 
    }

@media(min-width:750px){
    #imgDiv{margin-top:180px;}}/*ab 750px mehr Abstand von oben*/
h3 {font-size: 20px;}

#head {    
    padding: 15px;
   
    background-image: url(img/green.jpg); 
    box-shadow: 8px 8px 7px black; 
    border-radius: 5px;
    margin: 7px;}
.nav li {
    background-color: #ffffcc;
    border-radius: 5px;
    font-size: 20px;   
    border: 1px solid black;
    }
.nav-pills a {
    color: darkslateblue;
   }

#dropdownMenu1 {
    border: 1px solid black;}

.dropdown-menu { 
    padding: 0; 
    margin: 0;}
.dropdown {
    margin-top: 25px; 
    margin-left: 15px; 
    margin-right: 10px;}
.dropdown.open {
    height: 80%;}
.caret {
    margin-right: 5px;
}
#checkP {
    margin-right: 30px; 
    margin-left: 10px;}

#H3 {
    margin-bottom: 10px;}
#start {
    margin-bottom: 10px; 
    margin-left: 10px; 
    margin-top: 5px;}
#hamburger {
    height: 25%; 
    width: 25%;}
.H4{
    color: #ffff66;
    border: 1px solid white; 
    border-radius: 1%;
    background-color: #595959}
#gesucht,#gesucht2 {
    font-size: 25px;
    margin-left: 10px;}
#accordBtn, #accordBtn2, #accordBtn3 {
    margin-bottom: 10px; 
    margin-left: 10px;
    }
#uebung1Div {
    padding: 10px 0 0 10px;
    border: 1px solid white;
    border-radius: 5px;
    box-shadow: 3px 3px 3px grey;}    
#accordion {
    margin-top: 30px;}
#accordion .ui-accordion-header.ui-state-active { 
    background: #ffff66;
    box-shadow: 4px 4px 4px black; 
    border: 3px solid #ffff99;}
/*#accordion .ui-accordion-header { background: #fff; } für s Einfärben des accordeon-headers allgemein*/
#uebung1Div {
    background-color: #333333;
    padding-bottom: 20px; }
.none {
    opacity: 0; 
    margin-left: 15px; 
    background-color: #373737;
    color: white;
       /*float: right; nur so und auch ohne flex bleibt diese span-class am rechten Rand*/
      }
.col-form-label {
    font-size: 140%; 
    margin-left: 10px;}
/*#container {display: flex;justify-content: space-around;}*/
.container-fluid{
    background-color: #373737; 
    color: white;    
    margin-top: 15px;}

    
    
#nummer{
    width:80px; 
    height:31px;
    margin-left: 20px;}
#table{
    display: flex;
    justify-content: flex-start;
    background-color: #373737; 
    color: white;
    margin-top: 15px; 
    margin-left: 30px; 
    font-size: 115%;}
td, tr, th:hover{
    background-color: #373737; }
th {
    font-weight: 400;}
#loesung{
    display: none;}
#loesungHaupt{
    display: none;}

#check{
    height: 31px; }
.para {
    margin-left: 10px;}
td:hover .none {
    opacity: 1; 
    background-color: #373737;
    font-weight: 500;}
#Haupt li {
    font-size: 17px;
    word-wrap: nowrap; 
    min-width: 208px;}
#sortableHaupt li {
    cursor: pointer;
    font-size: 17px;}
#hauptstaedte {
    margin: 10px 0px 10px 180px;}
@media(min-width:1490px){
    #uebung3Div{
        margin-left:150px;}}/*ab 1490px Liste mehr Abstand von links*/
#sortable li span { 
    position: absolute; 
    margin-left: -1.0em; }
#sortable li {  
    padding-left: 5px;
    font-size: 18px;
    width: 50%;
    cursor: pointer; 
    border: 1px solid grey;
			}
.invisible {
    opacity: 0;}
#fuellDiv{
    background-color: #373737;}
#checkOl{
    margin-left: 50px; 
    margin-bottom: 4px;
    margin-top: 10px;}
#feedback {
    margin-left: 10px;}
#feedbackHaupt {
    margin-left: 50px;}
#feedbackUebung2 {
    margin-left: 40px;}