body
{
    background:#00316a;
}

div#mainContent
{
    margin-top:50px;
    margin-bottom:50px;
    padding:20px;
    background:#bfcddcb3;
}

div#mainContent h1
{
    margin-bottom:20px;
    font-family:'Raleway',sans-serif;
    font-weight:500;
}

div#mainContent p
{
    font-size:3em;
    font-family:'Raleway',sans-serif;
    font-weight:300;
}

div.flex-box
{
    display:flex;
}

p.flex-left-half
{
    display:flex;
}

p.flex-right-half
{
    display:flex;
    margin-left:20px;
}

input, textarea
{
    font-family:'Raleway',sans-serif;
    font-weight:200;
}

textarea
{
    resize:vertical;
}

label
{
    display:none;
}

img.photo
{
    height:10em;
}


.help-block
{
    font-size:1em;
}

#submitButton
{
    background:#333;
    border:none;
    font-family:'Raleway',sans-serif;
    font-weight:200;
}

#submitButton:hover
{
    background:#f15123;
}

div#mainContent p.recaptcha-info
{
    font-size:1em;
    font-style:italic;
    padding-top:10px;
}

hr.bottom
{
    margin-bottom:10px;    
}

footer
{
    padding: 10px 0 0 0;
    min-height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-style:italic;
    text-align: center;
    font-family:'Raleway',sans-serif;
    font-weight:200;
}




@media (min-width:320px)  
{ 
    /* smartphones, iPhone, portrait 480x320 phones */ 
    div#mainContent
    {
        width:90%;
        margin-left:5%;
        margin-top:20px;
        margin-bottom:20px;
    }
    
    div#mainContent h1
    {
        font-size:3em;
    }

    div.flex-box
    {
        flex-direction:column;
        align-items:center;
    }
    
    .form-control
    {
        font-size:1.5em;
        height:2.5em;
    }

    div#mainContent p
    {
        font-size:1.4em;
    }

    #submitButton
    {
        padding:0.5em 2em;
        font-size:1.4em;
    }

    div#mainContent p.recaptcha-info
    {
        font-size:1em;
    }
    
    footer
    {
        font-size:1em;
    }
}
@media (min-width:481px)  
{ 
    /* portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide. */
    
}
@media (min-width:641px)  
{ 
    /* portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones */ 
    
}
@media (min-width:961px)  
{ 
    /* tablet, landscape iPad, lo-res laptops ands desktops */ 
}
@media (min-width:1025px) 
{ 
    /* big landscape tablets, laptops, and desktops */ 
    div#mainContent
    {
        width:50%;
        margin-left:25%;
    }
    
    .form-control
    {
        font-size:1.5em;
        height:2.5em;
    }

    div#mainContent h1
    {
        font-size:4em;
    }

    div.flex-box
    {
        flex-direction:row;
        align-items:initial;
    }

    div#mainContent p
    {
        font-size:1.5em;
    }

    #submitButton
    {
        padding:0.5em 2em;
        font-size:1.4em;
    }

    div#mainContent p.recaptcha-info
    {
        font-size:1em;
    }
    
    footer
    {
        font-size:1em;
    }
    
}
@media (min-width:1281px) 
{ 
    /* hi-res laptops and desktops */ 
    
}