@media screen and (min-width: 200px) and (max-width: 300px) {
    #title{ 
        font-size: 7.5em;
    }

    #clock > p {
        font-size: 2em;
    }

    #clock {
        width: 200px;
        height: 100px;
    }
}

@media screen and (min-width: 300px) and (max-width: 400px) {
    #title {
        font-size: 10.3em;
    }

    #clock > p {
        font-size: 2.5em;
    }
}

@media screen and (min-width: 400px) and (max-width: 500px) {
    #title {
        font-size: 11.5em;
    }

    #clock > p {
        font-size: 2.5em;
    }
}

@media screen and (min-width: 700px) and (max-width: 1024px) {
    #title {
        font-size: 20em;
    }

    #clock > p {
        font-size: 3.5em;
    }

    #clock {
        width: 350px;
        height: 120px;
    }
}

@media screen and (min-width: 1024px) and (max-width: 1300px) {
    #title {
        font-size: 14em;
    }

    #clock > p {
        font-size: 2.5em;
    }

    #clock {
        width: 300px;
        height: 100px;
    }
}

@media screen and (min-width: 1400px) and (max-width: 1920px) {
    #title {
        font-size: 17em;
    }

    #clock > p {
        font-size: 3.4em;
    }

    #clock {
        width: 350px;
        height: 120px;
    }
}