@media (orientation:landscape) {
    .hide-on-landscape {
        display: none;
    }

    .modal-content {
        background-color: #fefefe;
        margin: 15% auto; /* 50% from the top and centered */
        padding: 20px;
        border: 1px solid #888;
        width: 60%; /* Could be more or less, depending on screen size */
    }

    .details-label {
        margin-top: 20px;
        text-align: center;
    }
}

@media (orientation:portrait) {
    .hide-on-portrait {
        display: none;
    }

    .modal-content {
        background-color: #fefefe;
        margin: 50% auto; /* 50% from the top and centered */
        padding: 20px;
        border: 1px solid #888;
        width: 70%; /* Could be more or less, depending on screen size */
    }

    .details-label {
        margin-top: 20px;
        text-align: left;
    }
}

@media screen and (min-width: 601px) {
    div.title {
        font-size: 36px;
        color: #000000;
    }

    div.subtitle {
        font-size: 20px;
        color: #000000;
    }

    .subtitle {
        font-size: 20px;
        color: #000000;
    }

    div.details-label {
        text-align: left;
        font-size: 18px;
        color: #000000;
    }

    div.details {
        font-size: 14px;
        color: #000000;
    }

    .details {
        font-size: 14px;
        color: #000000;
    }

    td.feature {
        font-size: 18px;
        font-style: italic;
        color: #000000;
    }

    p.details-label {
        font-size: 18px;
        color: #000000;
    }
}

@media screen and (max-width: 600px) {
    div.title {
        font-size: 28px;
        color: #000000;
    }

    div.subtitle {
        font-size: 18px;
        color: #000000;
    }

    .subtitle {
        font-size: 18px;
        color: #000000;
    }

    div.details-label {
        text-align: left;
        font-size: 14px;
        color: #000000;
    }

    div.details {
        font-size: 12px;
        color: #000000;
    }

    .details {
        font-size: 12px;
        color: #000000;
    }

    td.feature {
        font-size: 15px;
        font-style: italic;
        color: #000000;
    }

    p.details-label {
        font-size: 14px;
        color: #000000;
    }
}