@media (max-width: 576px) {
    h1 {
        margin-bottom: 11px;
        font-size: 3.5rem !important;
        left: 38%
    }
    .to-do-container .tasks {display: block;}
    .to-do-container .tasks .no-tasks span {
        font-size: 1.2rem;
    }
    .tasks-control {
        font-size: .9rem;
    }
}

@media (max-width: 300px) {
    h1 {
        font-size: 2.5rem !important;
        left: 34%
    }
}


@media (min-width: 576px) {
    .week {width: 22%}
 }

@media (min-width: 768px) { 
    .week {width: 15%}
 }

@media (min-width: 992px) { 
    .week {width: 13%}
 }

@media (min-width: 1200px) { }