p {
    /*
    word-break: normal;
     word-break: break-word;

    -webkit-hyphens: auto;
       -moz-hyphens: auto;
        -ms-hyphens: auto;
            hyphens: auto;
            */
    color: #777;
}


#banner {
    min-height: 350px;
    background-image: linear-gradient(rgba(44,52,80,0.5), rgba(44,62,80,0.5));
    background-image: linear-gradient(rgba(44,52,80,0.5), rgba(44,62,80,0.5)), url('/theme/images/Niagara_Rainbow.jpg');
    background-position: 0;
    background-size: cover;
    transition: opacity 0.5s ease;
}

#banner h1 {
    font-size: 11rem;
    font-family: "League Gothic", sans;
    font-weight: 400;
    margin-right: 1rem;
}

#banner .intro {
    margin: 2rem 0;
    margin: 0.5rem 0;
}

#banner .intro img {
    display: inline;
    margin: 0;
    height: 200px;
    width: 200px;
    transform: translate(0, 15%);
}

#banner .intro a {
    text-decoration: none;
    color: white;
}

#banner .introInfo {
    display: inline-block;
    color: white;
    font-family: Ostrich Sans Rounded, sans;
    margin-top: -2rem;
}

.introInfo span {
    display: table-row;
}

span#gFirst {
    font-size: 4rem;
    line-height: 1rem;
    line-height: 2rem;
    font-size: 4.5rem;
    font-size: 4.25rem;
    text-align: left;
}

span#gSecond {
    font-size: 2.5rem;
    line-height: 3rem;
}

span#gThird span {
    display: inline;
}

#DLButton {
    font-family: League Gothic, sans;
    font-size: 1.5rem;
    /* border: solid 2px white; */
    background-color: #e74c3c;
    padding: 0 0.7rem;
    float: left;
    color: white;
    border-radius: 3px;
}

#ver {
    font-family: League Gothic, Ostrich Sans Rounded, sans;
}

#ReleaseButton {
    font-size: 1.5rem;
    /* border: solid 1px white; */
    background-color: #2c3e50;
    padding:0 0.7rem;
    padding-top: 0.3rem;
    line-height: 1.95rem;
    float: right;
    margin-left: 1rem;
    letter-spacing: 0.03rem;
    border-radius: 3px;
}

#introduction{
    text-align: left;
    background-image: linear-gradient( to right, rgba(255,255,255,1) 50%, rgba(255,255,255,0.75)), url('/theme/images/oldfrontsplash.jpg');
    background-size: cover;
    background-position: 100%;
    padding-top: 2rem;
}

#introduction h1,
#introduction h2,
#introduction h3,
#introduction h4,
#introduction h5,
#introduction h6 {
    max-width: 30rem;
    margin: 0 auto;
}

section#extensible {
    padding-bottom: 0;
}

#blocks {
    margin-top: 2rem;
    width: 400px;
    margin-left: auto;
    margin-right: auto;
}

section#introduction h2 {
    margin-bottom: 1rem;
}

section#introduction p {
    margin-bottom: 0.3rem;
}

section#introduction .container {
    max-width: none;
}

nav#menu li#gimp-home {
    /*display: none;
     */
}


nav#menu li {
    white-space: nowrap;
}

#cap-photos {
    background-color: #0e2426;
    background-image: linear-gradient(
                        rgba(0,0,0,0),
                        rgba(0,0,0,0),
                        rgba(0,0,0,0.9)),
                        url('/images/frontpage/dot.jpg');
    background-size: cover;
    background-position: 20% 50%;
    color: white;
}

#cap-photos .column.third {
    height: 300px;
    max-height: 30vh;
}

.cap {
    max-height: 100vh;
    border-top: solid 1px #555;
}

.cap h2 {
    display: inline-block;
    border-bottom: solid 1px #aaa;
    margin-bottom: 1rem;
    font-size: 1.4rem;
}

.cap p {
    text-align: left;
}

#cap-photos p, #cap-painting p {
    color: whitesmoke;
}

#cap-algorithms p {
    text-align: left;
}

#cap-algorithms {
    background-image: linear-gradient(
                    rgba( 255, 255, 255, 1 ),
                    rgba( 255,255,255,1),
                    rgba( 255,255,255,0.5 ) ),
                    url('/images/frontpage/gimplayer.png');
    background-position: 0 0;
    background-repeat: no-repeat;
}

#cap-algorithms .column.third {
    height: 100px;
}

#cap-painting {
    background-color: #0e2426;
    background-image:linear-gradient(
                        rgba(0,0,0,0.9),
                        rgba(0,0,0,0.4),
                        rgba(0,0,0,0)), 
                        url('/images/frontpage/2010-01-dragon-revoy.jpg');
    background-size: cover;
    background-position: 82% 100%;
    color: white;
}

#cap-painting .column.third {
    height: 300px;
    max-height: 30vh;
}

#cap-graphics {
    /*
    background-image: linear-gradient(
                        rgba(255,255,255,0),
                        rgba(255,255,255,1) 60%,
                        white ),
                        url('/images/frontpage/graphic-elements.png');
                        */
    background-image: linear-gradient(
                        rgba(0,0,0,0),
                        rgba(0,0,0,0),
                        rgba(0,0,0,0.9)),
                        url('/images/frontpage/gwi_5.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-color: #0e2426;
    color: white;
}

#cap-graphics p {
    color: white;
}

#cap-graphics .column.third {
    height: 250px;
    max-height: 30vh;
}

#component {
    /*box-shadow: inset 0 12px 12px -12px #ddd;
     */
    border-top: double 4px #eee;
}

#component img {
    width: 200px;
    margin:0 auto;
}

#component p, #extensible p {
    text-align: left;
}

#component h2, #extensible h2,
#component h3, #extensible h3 {
    display: inline-block;
    border-bottom: solid 1px #ccc;
    margin-bottom: 1rem;
}

#banner h1 {
    margin-right: 0;
    margin-top: -2rem;
    font-size: 10rem;
}

#banner .introInfo {
    margin-top: -3rem;
}

span#gFirst {
    text-align: center;
}


@media (min-width: 40rem) {
    #banner h1 {
        margin-right: 1rem;
        margin-top: 0;
        font-size: 11rem;
    }

    #cap-photos {
        background-image: url('/images/frontpage/dot.jpg');
    }
    
    #cap-painting {
        background-image: url('/images/frontpage/2010-01-dragon-revoy.jpg');
    }

    #cap-algorithms {
        background-image: linear-gradient(
            to right,
            rgba( 255, 255, 255, 1 ),
            rgba( 255,255,255,1),
            rgba( 255,255,255,0.5 ) ),
            url('/images/frontpage/gimplayer.png');
        background-position: 100% 0;
    }

    #cap-graphics {
        background-image: url('/images/frontpage/gwi_5.jpg');
        background-position: 0 75%;
    }

    span#gFirst, span#gSecond {
        text-align: left;
    }
    #banner .introInfo {
        margin-top: -3rem;
    }
}

@media (min-width: 64rem) {
}

@media (max-width: 40rem) {
    #banner .intro img {
        height: 120px;
        width: auto;
        transform: translate(0);
    }

    #introduction {
    background-image: linear-gradient( to right, rgba(255,255,255,1) 50%, rgba(255,255,255,0.90)), url('/theme/images/oldfrontsplash.jpg');
    }

    #twenty-banner {
        top: 46px;
    }

}

/* Testing reflowing sections to use wider screens better */
/* Originally tried this at 1650px, now trying at 1366px wide */
@media (min-width: 1367px){
    .cap {
        width: 50%;
        float: left;
    }
    
    #component {
        clear: both;
    }
}


/* News Items styling
 */
.news-item {
    margin-bottom: 1rem;
}

.news-item abbr {
}

.news-item abbr.news-published {
    font-size: 0.8rem;
    display: block;
    color: #888;
    border-bottom: none;
}

h2#recent-news {
    margin-left: 0;
}

.news-more {
    float: right;
    font-size: 0.85rem;
}

#attribution {
    font-size: 0.75rem;
    padding: 1rem 0;
}

#attribution .column {
    margin-bottom: 0;
    text-align: left;
}


#twenty-banner {
    position: absolute;
    left: 0;
    width: 250px;
    height: 250px;
    display: none;
}
#banner { background-image: linear-gradient(rgba(44,52,80,0.5), rgba(44,62,80,0.5)), url('/images/frontpage/headers/Niagara_Rainbow.jpg'); }