/* == BASICS ================================================================ */

:root {
    --body-back: #FF7F50;   /* coral */
    --light: #F5F5DC;       /* beige */
    --dark: #FF7F50;        /* coral */
    --text: #3F3F3F;
    --lines: #DEB887;       /* burlywood */
}

h3 {
    color: var(--body-back);
}

.mailto:after {
    content: "tomas.svoboda\40 alfaomega.cz"; 
}

/* == EFFECTS ============================================================== */

#references, #act, #contact {
    animation: fadein 1s;
}

/* == BLOCKS ================================================================ */

#header {
    border-bottom: 1em solid var(--lines);
}

#content {
    padding: 1em 1em 2em 1em;
}

#footer {
    border-top: 1em solid var(--lines);
}

.ref {
    padding: 0 0 1em 0;
}

.ref .thumbs {
    padding: 1em 0 1em 0;
}

.ref .thumbs img {
    border: 1px solid var(--lines);
    margin: 0 1em 1em 0;
    width: 200px;
}

#act tr {
    height: 1.8em;
}

#act .icon {
    width: 1.5em;
    vertical-align: middle;
}

#act .link {
    width: 8em;
    vertical-align: middle;
}

#act img {
    width: 16px;
}

#act .strava-badge- { display: inline-block; height: 16px; margin-top: 8px; }
#act .strava-badge- img { visibility: hidden; height: 16px; }
#act .strava-badge-:hover { background-position: 0 -31px; }
#act .strava-badge-follow { height: 16px; width: 16px; background: url(//badges.strava.com/echelon-sprite-16.png) no-repeat 0 0; }


/* == RESPONSIVE ============================================================ */

/* PC */
@media only screen and (min-width: 801px) {

    .ref .thumbs .thumb {
        transition-duration: 0.5s;
        transition-timing-function: ease;
    }
    
    .ref .thumbs .thumb:hover {
        /* zoom */
        transform: scale(1.05);
        transition-duration: 0.5s;
        transition-timing-function: ease;
    } 

}

/* MOBILE */
@media only screen and (max-width: 800px) {

    .ref .thumbs img {
        margin: 0 0.5em 1em 0.5em;
    }

    #act {
        margin-left:auto; 
        margin-right:auto;
        text-align: left;
    }

}