/* Default styles for large screens */
.college-logo {
    width: 12vh; /* proportional to viewport height */
    max-width: 100%; /* never overflows parent */
    height: auto;
    margin: 0;
}

.siteTitle.custom-sitetitle {
    font-size: 2rem;
    line-height: 1.2;
}

/* Medium screens (tablets, 700px and below) */
@media (max-width: 700px) {
    .college-logo {
        width: 10vh;
        margin-left: 20px; /* optional */
    }

    .siteTitle.custom-sitetitle {
        font-size: 1.5rem;
    }
}

/* Small screens (phones, 400px and below) */
@media (max-width: 400px) {
    .college-logo {
        width: 8vh;
        margin-left: 10px; /* optional */
    }

    .siteTitle.custom-sitetitle {
        font-size: 1.2rem;
    }
}