.IATTable{
    max-width:920px;
    width: 100%;
}

.instr{
   font-size: 70%;
   text-align: center;
   width: 40%;
}
/*Kategorien oben:*/
.demo{
    font-size: 110%;
    text-align: center;
    color: green;
    font-weight: bold;
    width: 40%;
    padding: 2%;
 }

.demodivmobile{
    font-size: 110%;
    text-align: center;
    color: green;
    font-weight: bold;
    width: 100%;
    padding: 2%;
 }
.posneg{
    font-size: 110%;
    text-align: center;
    color: blue;
    font-weight: bold;
    width: 40%;
    padding: 2%;
 }
.posnegdivmobile{
    font-size: 110%;
    text-align: center;
    color: blue;
    font-weight: bold;
    width: 100%;
    padding: 2%;
 }

.oderdivFill{
    font-size: 110%;
    text-align: center;
    color: black;
    width: 100%;
    padding: 2%;
}

/*Das eingeblendete word selbst:*/

.wordCol{
    text-align: center;
    width: 100%;
}

.worddemo{
    font-size: 110%;
    text-align: center;
    color: green;
    font-weight: bold;
    padding: 2%;
    /*width: 50%;*/
 }

.wordposneg{
    font-size: 110%;
    text-align: center;
    color: blue;
    font-weight: bold;
    padding: 2%;
    /*width: 50%;*/
 } 



.MistakeX{
    font-size: 110%;
    text-align: center;    
    color: red;
    font-weight: bold;
    width: 100%;
    padding: 2%;
}

.instr2{
    font-size: 80%;
    text-align: center;
}

.ClickField{
    background-color: lightgray;
    height: 150px;
    height: 100%;
    min-height: 120px;
    width: 40%;
    border-radius: 5%;
    padding: 2%;
}

.ClickedField{
    background-color: rgb(168, 168, 168);
    height: 150px;
    height: 100%;
    min-height: 120px;
    width: 40%;
    border-radius: 5%;
    padding: 2%;
}


@media only screen and (max-width: 670px)  {
    
    /*eingeblendete word:*/
    .worddemo, .wordposneg, .word{
        font-size: 90%;
    }
    /*Kategorien oben:*/
    .posneg, .posnegdivmobile, .demo, .demodivmobile, .oderdivFill{
        font-size: 90%;
    }
    .MistakeX{
        font-size: 90%;
    }
    .instr{
        font-size: 40%;
    }
    .instr2{
        font-size: 40%;
    }
}



@media only screen and (max-width: 400px)  {
    .worddemo, .wordposneg, .word{
        font-size: 80%;
    }
    .posneg, .posnegdivmobile, .demo, .demodivmobile, .oderdivFill{
        font-size: 80%;
    }
    .MistakeX{
        font-size: 80%;
    }
    .instr{
        font-size: 30%;
    }
    .instr2{
        font-size: 20%;
    }
    
}