* { margin: 0; }
    html, body { height: 100%; }
    body { background: url('../images/bg.gif') #009dc8; }
    #wrapper { min-height: 100%; margin-bottom: -120px; } 
        #wrapper:after { content: ""; display: block; }
        #wrapper:after { height:120px;  }

#header { display: block; padding-top: 60px; background: #ffffff; overflow: hidden; }
    #header .grid-container { position: relative; height:210px; }
    #mfaa { position: absolute; right: 20px; }
    #phone { position: absolute; right:20px; top:100px;  }
    .menu { position: absolute; bottom: 0; right:20px; }
        .menu li { display: block; float: left; }
        .menu a { display:block; background:#c5e4ec; padding:20px 20px 10px; width:140px; -webkit-border-radius: 10px 10px 0px 0px; border-radius: 10px 10px 0px 0px; -webkit-box-shadow: 0px 7px 14px 0px rgba(0, 0, 0, .3);
box-shadow: 0px 7px 14px 0px rgba(0, 0, 0, .3); }
            .menu .current_page_item a { background:#009dc8; }
            .menu a:hover { background: #005870; padding-bottom: 15px; margin-top: -5px; }
        
#content { padding:25px 0; background: url('../images/content.png') top repeat-x }
        #main, .tile, .testimonial { background: #eaf5f8; display: block; margin-bottom: 20px; -webkit-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: 0px 7px 14px 0px rgba(0, 0, 0, .3);
box-shadow: 0px 7px 14px 0px rgba(0, 0, 0, .3); }
        .mission { min-height: 250px; padding:50px 60px; }
        .testimonial, .tile { background-color: #005870; }
        .tile { background-position: center 110px; background-repeat: no-repeat; padding:200px 20px 60px; min-height: 90px;   }
            .tile:hover { background-color: #ffffff; }
            .tile.home { background-image: url('../images/home.png'); }
            .tile.commercial { background-image: url('../images/commercial.png'); }
            .tile.refinance { background-image: url('../images/refinance.png'); }
            .tile.nonconforming { background-image: url('../images/nonconforming.png'); }
            .tile.car { background-image: url('../images/car.png'); }
            .tile.insurance { background-image: url('../images/insurance.png'); }
        #main { padding:50px; }
        .testimonial { padding:50px 40px; }

#footer { background:#005870 url('../images/footer.gif') top repeat-x; display: block; padding:20px 0; height:80px; }

#cntctfrm_contact_form input.text, #cntctfrm_contact_form textarea, #cntctfrm_contact_message, #cntctfrm_contact_name, #cntctfrm_contact_email, #cntctfrm_contact_subject { width: 100% !important; }
    #cntctfrm_contact_form label { margin:1.5em 0 0.2em; color:#009dc8; display: block;  }
    #cntctfrm_contact_form input[type="submit"] { margin:1.5em 0 0.2em; color:#ffffff; display: block; font-size: 1em; background:#005870; -webkit-border-radius: 10px; border-radius: 10px; padding:0.5em 1em; border:none; }
        #cntctfrm_contact_form input[type="submit"]:hover { background:#009dc8; }
        #cntctfrm_contact_form input[type="submit"]:active { background:#005870; }


/* transitions */

.menu a, .tile {
 -webkit-transition: all 250ms ease-in-out;
-moz-transition: all 250ms ease-in-out;
-ms-transition: all 250ms ease-in-out;
-o-transition: all 250ms ease-in-out;
transition: all 250ms ease-in-out;
    }


@media (max-width: 1010px) {
    #nav a { width:120px; }    
}

@media (max-width: 930px) {
    #nav a { width:100px; }    
}

@media (max-width: 840px) {
    #nav a { width:80px; }    
}
    
@media (max-width: 767px) {
    #header .grid-container { height:270px; }
    #nav { width: 100%; right:0; }
        #nav li { width:25%; }
        #nav a { width:100%; padding-left: 0; padding-right: 0; }
    #phone { position: relative; float: right; top:162px; }
    .mission, .tile { min-height:inherit; }
    .tile { padding: 50px 25% 40px; background-position: 40px center; }
}