/*
COLOR PALETTE - Sunrise

TEXT DARK: #292831
TEXT LIGHT: #fbbbad
BACKGROUND DARK BLUE: #333f58
BACKGROUND LIGHT BLUE: #4a7a96 
BACKGROUND PINK: #ee8695
*/

/*
COLOR PALETTE - Hofner Dawn
TEXT DARK: #2b2823
TEXT LIGHT: #dff788
BG1: #43375c
BG2: #664761
BG3: #50617a
BG4: #767869
BG5: #85625d
BG6: #518f7a
BG7: #ad9e7d
BG8: #a8c9a1
*/

body{

    /*full colors*/
    --fullDark: #222222;
    --fullMidDark: #3b3b3b;
    --fullMidLight: #bababa;
    --fullLight: #dcdcdc;

    /*cormacs colors*/
    --cormacsmaroon: #701001;
    --cormacsorange: #f85f41;
    --cormacsbabypowder: #FFFFFA;
    --cormacsblack: #080705;

    --textDark: #160F29;
    --textLight: #F3DFC1;
    --bgDarkBlue: #246A73;
    --bgLightBlue: #368F8B;
    --bgPink: #DDBEA8;

    background-color: var(--fullDark);
    color: var(--fullLight);
    font-family: "Courier New", "Monospace", serif;
    font-size: 20px;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    margin: 0px;
}

.intro{
    padding:40px;
    display: flex;
    width: 100%;
    justify-content: center;
    text-align: center;
    font-size: 35px;
    color:var(--fullLight);
}

/*
.introText{
    font-size: 35px;
    color:var(--fullLight);
    text-align: center;
    width: 100%;
}
    */

.introSubText{
    margin-top: 30px;
    font-size: 30px;
}

.gameSectionLight{
    border-radius: 10px;
    display: flex;
    margin: 10px;
    margin-bottom: 5px;
    margin-top: 5px;
    padding: 10px;

    background-color: var(--fullMidLight);
    color: var(--fullDark);
    fill: var(--fullDark);
}

.gameSectionDark{
    border-radius: 10px;
    display: flex;
    margin: 10px;
    margin-bottom: 5px;
    margin-top: 5px;
    padding: 10px;

    background-color: var(--fullMidDark);
    color:var(--fullLight);
    fill: var(--fullLight);
}

.gameImage{
    border-radius: 10px;
}

.columnContentRight{
    width: calc(50% - 10px);
    float:right;
}

.columnContentLeft{
    width: calc(50% - 10px);
    float:left;
}

@media screen and (max-width: 1000px) 
{
    .columnContentRight{
        width: 100%;
        float: right;
    }

    .columnContentLeft{
        width: 100%;
        float: left;
    }
}

/*
@media screen and (width: 320px)
{
    .column1{
        width: 100%;
        padding: 10px;
        display: flex;
        flex-direction: row;
    }

    .column2{
        width: 100%;
        padding: 10px;
        display: flex;
        flex-direction: row;
    }
}
    */

/* in order they appear on the page */
/*
#spellforge{
    background-color: var(--fullMidLight);
    color: var(--fullDark);
}

#cormacsinferno{
    background-color: var(--fullMidDark);
    color:var(--fullLight);
}

#cormacs-inferno-footer{
    background-color: var(--fullMidDark);
    color:var(--fullLight);
    fill:var(--fullLight);
}

#cormacs-inferno-footer:hover{
    background-color: var(--fullMidLight);
    color:var(--fullDark);
    fill:var(--fullDark);
}

#shattersword{
    background-color: var(--fullMidLight);
    color: var(--fullDark);
}

#freefloating{
    background-color:var(--fullMidDark);
    color:var(--fullLight);
}

#ineedtoleave{
    background-color: var(--fullMidLight);
    color:var(--fullDark);
}

#gordongrapple{
    background-color: var(--fullMidDark);
    color:var(--fullLight);
}

/*things below this don't appear on the page */

/*
#soulsword{
    background-color:var(--bgDarkBlue);
    color:var(--textLight);
}

#spartasoftstudio{
    background-color:var(--bgPink);
    color:var(--textDark);
}

#currentwork{
    background-color:var(--bgDarkBlue);
    color:var(--textLight);
}
*/

/* Game Section Headers */

.gameName{
    text-align: center;
    border-radius: 10px;
    float: left;
}

.gameSectionHeader{
    width: 100%;
    height: 50px;
    font-size: 30px;
}

.gameSectionFooter{
    margin-top: auto;
    display: flex;
    border-radius: 10px;
    float: right;
}

.gameSectionFooter:hover{
    background-color: var(--fullMidDark);
    color: var(--fullLight);
    fill: var(--fullLight);
    
}

.gameSectionFooterText{
    margin-right: auto;
    margin-left: 10px;
}

.gameSectionArrow{
    float: right;
    margin-left:auto;
    margin-right:10px;
    margin-top: 3px;
    margin-left: 5px;
    height: 2vw;
}

.smallText{
    font-size: 20px;
}
/* Text Formatting */

.subheader{
    font-size: 15px;
}

/* space formatting */

.break{
    margin-top: 10px;
}

.breakLong{
    margin-top: 30px;
}

.itchEmbed{
    margin-top: 10px;
    border-radius: 10px;
}

.gameSectionText{
    word-wrap: break-word;
}

.a:active{
    color: var(--textDark);
}

.a:focus{
    color: var(--textDark);
}

.a:link{
    color:var(--textDark);
}

.a:visited{
    color:var(--textDark);
}

.a{
    color: var(--textDark);
    text-decoration: none;
}

/*Devblog Link*/

.devBlogTitle{
    font-size: 30px;
}

.devBlogSection{
    border-radius: 10px;
    display: flex;
    margin: 10px;
    margin-bottom: 5px;
    margin-top: 5px;
    padding: 10px;

    background-color: var(--fullMidDark);
    color:var(--fullLight);
    fill: var(--fullLight);
}

.devBlogSection:hover{
    border-radius: 10px;
    display: flex;
    margin: 10px;
    margin-bottom: 5px;
    margin-top: 5px;
    padding: 10px;

    background-color: var(--fullMidLight);
    color:var(--fullDark);
    fill: var(--fullDark);
}

/* Itch Embed Management */