@import url('https://static.vyang.org/style/common.css');

/* --- www-specific headings --- */
h2 {
    max-width: 65%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 5%;
    margin-bottom: 1.5%;
    text-align: left;
    font-size: 700%;
    font-style: normal;
    font-family: var(--main-font);
    font-weight: 100;
}

/* --- Back/navigation links --- */
a:link.go_back {
    display: block;
    font-size: 125%;
    font-style: normal;
    font-family: var(--main-font);
    margin-top: 0;
    text-decoration: none;
    text-align: center;
    color: black;
}

a:hover.go_back {
    display: block;
    font-size: 125%;
    font-style: normal;
    font-family: var(--main-font);
    margin-top: 0;
    text-decoration: underline;
    text-align: center;
}

a:visited.go_back {
    display: block;
    font-size: 125%;
    font-style: normal;
    font-family: var(--main-font);
    margin-top: 0;
    text-decoration: underline;
    color: rgb(0, 0, 233);
    text-align: center;
}

/* --- Prominent page link buttons --- */
.web,
.web:link,
.web:visited {
    display: block;
    font-size: 2.38rem;
    font-style: normal;
    font-family: var(--main-font);
    margin-top: 0;
    text-decoration: none;
    text-align: center;
    opacity: 0.75;
}

.web:hover,
.web:focus {
    text-decoration: underline;
    opacity: 1;
}

.web-link-github          { color: rgba(0,   0,   0,   0.9); }
.web-link-github:hover,
.web-link-github:focus    { color: rgba(0,   0,   0,   1.0); }

.web-link-youtube         { color: rgba(241, 22,  22,  0.9); }
.web-link-youtube:hover,
.web-link-youtube:focus   { color: rgba(241, 22,  22,  1.0); }

.web-link-jetphotos       { color: rgba(19,  132, 230, 0.9); }
.web-link-jetphotos:hover,
.web-link-jetphotos:focus { color: rgba(19,  132, 230, 1.0); }

.web-link-default         { color: rgba(0,   0,   0,   0.9); }
.web-link-default:hover,
.web-link-default:focus   { color: rgba(0,   0,   0,   1.0); }

.web-link-coding          { color: rgba(0,   102, 204, 0.9); }
.web-link-coding:hover,
.web-link-coding:focus    { color: rgba(0,   102, 204, 1.0); }

.web-link-mcart           { color: rgba(34,  139, 34,  0.9); }
.web-link-mcart:hover,
.web-link-mcart:focus     { color: rgba(34,  139, 34,  1.0); }

.web-link-books           { color: rgba(139, 69,  19,  0.9); }
.web-link-books:hover,
.web-link-books:focus     { color: rgba(139, 69,  19,  1.0); }

@media (max-width: 900px) {
    h2 {
        max-width: 92%;
        margin: 1rem auto 0.7rem;
        font-size: clamp(2rem, 8.5vw, 3rem);
        line-height: 1.15;
    }

    .web,
    .web:link,
    .web:visited {
        font-size: clamp(1.45rem, 6vw, 2rem);
        padding: 0 0.75rem;
    }

    p.click_for,
    a.go_back,
    a:link.go_back,
    a:visited.go_back,
    a:hover.go_back {
        font-size: clamp(1rem, 4.2vw, 1.2rem);
    }
}
