body{
    background-color: white;
}

#app {
	transition: var(--transition);
	padding-top: 200px;
	position: relative;
	z-index: 10;
	display: flex;
	min-height: 100vh;
	flex-direction: column;    
}

.app_bg{
    position: fixed;
    top:0;
    left:0;
    width:100vw;
    height: 100vh;
    z-index: 0;
    background-attachment:  fixed;
    background-size: cover;
    background-color: var(--dark);
}

.container{
    max-width: 1400px;
    margin:auto;
    padding:0 1rem;
}

header {
	position: fixed;
	width: 100%;
	top: 0;
    z-index: 100;
}

#maincontent{
    padding-bottom: 2rem;
    flex:1;
    width:100%;
}


@media(min-width: 768px ){

    .content-grid, 
    .title-grid{
        display: grid;
        width: 100%;
        gap:1rem;
        grid-template-columns: 60px 0.55fr 0.45fr;
    }

    .title-grid{
        grid-template-columns: 60px 1fr; 
    }

    /* old safari doesn't support flexbox gap */
    @supports (-webkit-min-device-pixel-ratio:0) and (not(translate: none)){

        .rp-layout{
            display: grid;
            grid-template-columns: 16% 16% 66%;
            width: 100%;
            grid-gap:1rem;
            gap:1rem;
        }
    
    }

    .corp-nav-layout{
        flex-direction: row-reverse;
    }

    .rp-col-1{
        flex:1;
    }
    
    .rp-col-2{
        display: block;
        flex:1;
    }
    
    .rp-col-3{
        flex:4;
    }
    
    .rp-home-col-1{
        flex:2;
    }
    
    .rp-home-col-2{
        flex:4;
    }
    
}

footer{
    background-color: var(--grey-dark);
    border-top:10px solid var(--theme);
    padding:0;
}


footer a{
    text-decoration: none;
}

footer a:hover{
    text-decoration: underline;
}

.footer-nav-section{
    border-left:1px solid white;
    padding:0.5rem 1rem;
}

.footer-nav-section-link,
.footer-nav-child-link{
    display: block;
    margin-bottom: 0.25rem;
    color:var(--accent);
}

.footer-nav-child-link{
    font-size: 0.875rem;
    
    color:white;
}

.css-corpse{
    background-color: var(--dark);
}

.css-corpse a{
    color:white;
}

.osborne-link {
	display: flex;
	align-items: center;
	/* margin: auto; */
	justify-content: center;
	padding: 1rem;
    font-size: 0.875rem
}

.corp-gubbins {
	color: white;
	padding: 10px 0;
	font-size: 0.77rem
}

.awards{
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: white;
    padding:2rem 1rem;
    margin-bottom:2rem;
}

.awards_grid{
    display: grid;
    gap: 1rem;
    grid-template-columns: 1fr 1fr;
    max-width: 1400px;
}

@media(min-width: 768px ){
    .awards_grid{
        display: flex;
        gap: 1rem;
        margin:auto;
        flex-wrap: wrap;
    }
}

.award_link {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
    padding:1rem;
}

.award_logo {
	/* max-height: 8rem; */
	width: auto;
	height: 60px;
}