/*
File: app_index_styles_2019.css
Site: TNT
Date: 08/09/19
Author: KLP
Comments:
Styles for app icons on main index pages for JS, PHP, Processing apps

*/
/*stop putting content before masthead text sub paragraph*/
header #mastheadText p::before {
    content: "";
}

div#heroArea {
    padding: 20px;
    height: 130px;
    background-image: url(../images/redcircuit.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top;
}

div#heroArea h1 {
    font-family: 'Boogaloo', cursive;
    font-size: 40px;
    margin-top: 0px;
    margin-bottom: 10px;
}

div#heroArea p {
    font-size: 25px;
}

main {
    min-height: calc(83vh - 125px);
}

main details summary {
    font-style: italic;
    color: #144C87;
    font-weight: bold;
}

main article div#apps {
    margin-top: 20px;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

main article figure {
    text-align: center;
    cursor: pointer;
    margin-right: 10px;
    margin-bottom: 15px;
}

main article figure figcaption {
    /*proximity: make caption go next to icon in obvious way*/
    margin-top: -5px;
}