/*
.col-sm-12 {
    border: 1px solid blue;
}
*/
@media (min-width: 0px) {
    #user_input, #display {
        height: 260px;
    }
    .options {
        height: 340px;
        margin-bottom: 15px;
    }
    .radio {
        font-size: 40px;
        margin: 10px 20px 25px 0;
    }
    .cipher {
        color:white;
        font-size: 50px;
        text-align: center;
        margin: 0.6vh 0 0 0;
    }
    .form-control {
        font-size: 33px;
    }
    .my-row-upper {
        height: 3vh;
    }
}

@media (min-width: 768px) {
    #user_input, #display {
        height: 300px;
    }
    .options {
        height: 300px;
    }
    .radio {
        font-size: 35px;
    }
    .cipher {
        color: white;
        font-size: 45px;
        text-align: center;
        margin: 0.6vh 0 0 0;
    }
    .form-control {
        font-size: 24px;
    }
    .my-row-upper {
        height: 17vh;
    }
}

@media (min-width: 1200px) {
    #user_input, #display {
        height: 270px;
    }
    .options {
        height: 270px;
    }
    .radio {
        font-size: 30px;
    }
    .cipher {
        color:white;
        font-size: 36px;
        text-align: center;
        margin: 0.6vh 0 0 0;
    }
    .form-control {
        font-size: 22px;
    }
}

@media (min-width: 1400px) {
    #user_input, #display {
        height: 290px;
    }
    .options {
        height: 290px;
    }
    .radio {
        font-size: 33px;
    }
    .cipher {
        color:white;
        font-size: 43px;
        text-align: center;
        margin: 0.6vh 0 0 0;
    }
    .form-control {
        font-size: 24px;
    }
}

@media (min-width: 1600px) {
    .my-row-upper {
        height: 22vh;
    }
}