Web_F305_Mqtt_Prod/MQTTServerSideAPI/Content/Adaptive.css

.grid {
    list-style: none;
    margin: 0;
    padding: 0;
    border: solid 1px grey;
    border-radius: 5px;
}
a {
    text-decoration: none;
}

/*a:hover {
    color: #ff6a00;
    text-decoration: none;
}*/

@media screen and (min-width: 20em) {
    #cmdminglingsyouyou{
        display:none;
    }
    #modalechart {
        max-height: 30%;
        height: 40vh;
    }
    #glvechart {
        max-height: 30%;
        height: 40vh;
    }
    #myBtn {
        /* display: none; */
        position: fixed;
        bottom: 60px;
        right: 30px;
        z-index: 99;
        background-color: #555;
        color: white;
        cursor: pointer;
        width: 40px;
        text-align: center;
        border-radius: 10px;
    }
    .titles {
        display: inline-block;
        width: 31%;
        font-size: 12px;
    }

    .navsuomac {
        display: inline-block;
        width: 49%;
        font-size: 12px;
    }

    .titlesid {
        display: inline-block;
        width: 12%;
        font-size: 12px;
    }

    .titlestime {
        display: inline-block;
        width: 50%;
        font-size: 12px;
    }

    .titlescmd {
        display: inline-block;
        width: 38%;
        font-size: 12px;
    }

    .RawData {
        display: inline-block;
        width: 100%;
        font-size: 12px;
    }

    .fourginfosim {
        display: inline-block;
        width: 100%;
        font-size: 12px;
    }

    .pirmacginfo {
        display: inline-block;
        width: 20%;
    }

    .fourginfo {
        display: inline-block;
        width: 48%;
        font-size: 12px;
    }

    .analyze {
        display: inline-block;
        width: 31%;
        font-size: 12px;
    }
}

@media screen and (min-width: 70em) {
    #modalechart {
        max-height: 30%;
    }
    #glvechart {
        max-height: 30%;
    }
    #myBtn {
        position: fixed;
        bottom: 60px;
        right: 30px;
        z-index: 99;
        background-color: #555;
        color: white;
        cursor: pointer;
        width: 40px;
        text-align: center;
        border-radius: 10px;
    }
    #cmdminglingsyouyou {
        display: block;
    }
    .titlesid {
        display: inline-block;
        width: 12%;
        font-size: 15px;
    }

    .navsuomac {
        display: inline-block;
        width: 16.6%;
        font-size: 15px;
    }

    .titlestime {
        display: inline-block;
        width: 40%;
        font-size: 15px;
    }

    .titlescmd {
        display: inline-block;
        width: 15%;
        font-size: 15px;
    }

    .titles {
        display: inline-block;
        width: 33%;
        font-size: 15px;
    }

    .fourginfosim {
        display: inline-block;
        width: 28%;
        font-size: 15px;
    }

    .fourginfo {
        display: inline-block;
        width: 21%;
        font-size: 15px;
    }

    .RawData {
        display: inline-block;
        width: 100%;
        font-size: 15px;
    }

    .pirmacginfo {
        display: inline-block;
        width: 20%;
    }

    .analyze {
        display: inline-block;
        width: 16.4%;
        font-size: 15px;
    }
}
/*@media screen and (min-width: 30em) {
    #cmdminglingsyouyou {
        display: none;
    }

    .titles {
        display: inline-block;
        width: 31%;
        font-size: 12px;
    }

    .navsuomac {
        display: inline-block;
        width: 49%;
        font-size: 12px;
    }

    .titlesid {
        display: inline-block;
        width: 12%;
        font-size: 12px;
    }

    .titlestime {
        display: inline-block;
        width: 50%;
        font-size: 12px;
    }

    .titlescmd {
        display: inline-block;
        width: 38%;
        font-size: 12px;
    }

    .RawData {
        display: inline-block;
        width: 100%;
        font-size: 12px;
    }

    .fourginfosim {
        display: inline-block;
        width: 100%;
        font-size: 12px;
    }

    .pirmacginfo {
        display: inline-block;
        width: 20%;
    }

    .fourginfo {
        display: inline-block;
        width: 48%;
        font-size: 12px;
    }

    .analyze {
        display: inline-block;
        width: 31%;
        font-size: 12px;
    }
}*/