html *{
    font-family: Arial !important;
}

#body {
    background-color: #E5E5E5;
}

#Beschreibung {
    margin: 3vw 20vw 3vw 23vw;
    text-align: center;
    font-size: 2vw;
    font-weight: bold;
    color: #444;
    border: none;
    border-radius: 10vw;
    background-color: #aaa;
    width: 50vw;
}

.Beschreibung {
    text-align: center;
    font-size: 2vw;
    font-weight: bold;
    color: #444;
    border: none;
    border-radius: 10vw;
    background-color: #aaa;
    width: 50vw;
}

.Beschreibung_Button{
    width: 30vw; 
    height: 5vw; 
    position: relative; 
    left: -7vw;
    bottom: 1.5vw;
}

.inputButtonPos{
    left: -4vw;
}

.logicOutputStyle{
    position: relative;
    bottom: 0.5vw; 
    left: 3vw;
}

table, th, td {
    border: 3px solid black;
    border-collapse: collapse;
    font-size: x-large;
}

.inputFieldBoolean {
    text-align: center;
    color: red;
    width: 10vw;
    height: 5vw;
    font-size: x-large;
    margin-left: 3vw;
}

    .inputFieldBoolean:hover {
        background-color: #ff6a00;
        border-style: none;
    }

.buttonCalculateLogic {
    text-align: center;
    font-size: larger;
    width: 10vw;
    height: 5vw;
    background-color: #575757;
    border-style: hidden;
    border
}

    .buttonCalculateLogic:hover {
        /*  color: #ff6a00;*/
        background-color: #ff6a00;
    }

.outputLabel{
    border-width: 3px;
    border-style: double;
    font-size: x-large;
    color: white;
    margin-left:3vw;
}



.binaryButton {
    border: none;
    outline: none;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 15px;
    font-family: arial, helvetica, sans-serif;
    text-decoration: none;
    display: inline-block;
    text-shadow: -1px -1px 0 rgba(0,0,0,0.3);
    font-weight: bold;
    background-color: rgba(0,0,0,0.3);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#424242), to(rgba(0,0,0,0.3)));
    background-image: -webkit-linear-gradient(top, #012555, rgba(0,0,0,0.3));
    background-image: -moz-linear-gradient(top, #424242, rgba(0,0,0,0.3));
    background-image: -ms-linear-gradient(top, #424242, rgba(0,0,0,0.3));
    background-image: -o-linear-gradient(top, #424242, rgba(0,0,0,0.3));
    background-image: linear-gradient(to bottom, #424242, rgba(90,90,90,0.3));
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#424242, endColorstr=#000000);
    
    position: relative;
    bottom: 0.4vw;
    text-align: center;
    color: red;
    width: 10vw;
    height: 5vw;
    font-size: 3vw;
    margin-left: 1vw;
}

    .binaryButton:hover {
        background-color: #424242;
        background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,0.3)), to(#424242));
        background-image: -webkit-linear-gradient(top, rgba(0,0,0,0.3), #424242);
        background-image: -moz-linear-gradient(top, rgba(0,0,0,0.3), #424242);
        background-image: -ms-linear-gradient(top, rgba(0,0,0,0.3), #424242);
        background-image: -o-linear-gradient(top, rgba(0,0,0,0.3), #424242);
        background-image: linear-gradient(to bottom, rgba(0,0,0,0.3), #424242);
        filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#424242, endColorstr=#rgba(0,0,0,0.3));
    }


.decimalButton {
    margin-left: 0vw;
    border: none;
    outline: none;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 15px;
    font-family: arial, helvetica, sans-serif;
    text-decoration: none;
    display: inline-block;
    text-shadow: -1px -1px 0 rgba(0,0,0,0.3);
    font-weight: bold;
    
    text-align: center;
    color: grey;
    background-color: #aaa;
    width: 10vw;
    height: 5vw;
    font-size: 3vw;
    bottom: 0.9vw;
    padding-top: 0.5vw;
    
}

.logic_gate {
    margin-left: 3vw;
}

.logicGatePicture{
    margin-left: 3vw; 
    background-color: #E5E5E5; 
    position: relative; 
    top: 0.75vw;
}

.row{
    border-style: solid; 
    border-color: black; 
    margin-left: 3vw;
}