@-ms-viewport { zoom: 1.0; width: device-width; }
@-webkit-viewport { zoom: 1.0; width: device-width; }
@-moz-viewport { zoom: 1.0; width: device-width; }
@-o-viewport { zoom: 1.0; width: device-width; }
@viewport { zoom: 1.0; width: device-width; }

@media screen and (min-width: 900px) {
    #masthead_nav_pane { display: block !important; }
}

@media screen and (max-width: 899px) {
    #masthead_nav_pane { display: none; }
    #masthead_menu_button { display: block; }
	#masthead_phone { font-size: large; }
	#masthead_logo { margin-left: 1em; }

	#masthead ~ #content_pane {
	    margin-top: 113px;
	    margin-top: calc(97px + 1em);
	}

    #masthead_nav_pane {
        border-top: 1px solid #e0e0e0;
        height: auto;
        position: absolute;
        left: 20px;
        top: 70px;
        box-shadow: 4px 4px 10px rgba(0,0,0,.4);
    }

	#nav_menu { margin-left: 0; }
    #nav_menu li {
        float: none;
        text-align: center;
        white-space: nowrap;
        overflow: hidden;
    }
    #nav_menu a {
        color: white;
        font-size: inherit;
        background-color: #277acf;
        padding: 1em 2em 1em 2em;
        display: block;
        margin: 0;
    }

    #nav_menu a.active { color: #b0b0b0; border-bottom:none; }
    #nav_menu a:hover { color: white; border-bottom: none; background-color: #4695e6; }
}

@media screen and (max-width: 790px) {
	#masthead_title { font-size: 2em; }
}

@media screen and (max-width: 680px) {
    #masthead_title { display: none; }
    #masthead_title_abbrev { display: block; }
}

@media screen and (max-width: 560px) {
    #masthead_menu_button_title { display: none; }
    #masthead_menu_button { padding-left: 1.5em; padding-right:1.5em; line-height: 50px; }
}

@media screen and (max-width: 510px) {
	#masthead_phone {
		clear: both;
		float:none;
		height:auto;
		line-height:normal;
		text-align:center;
		width: 100%;
		padding: 0 0 0.5em 0;
		height: auto;
	} 

    #masthead { position: relative; }
    #masthead ~ #content_pane { margin-top: inherit; }
}

@media screen and (max-width: 350px) {
	body, footer { width:350px; }
}

@media screen and (max-height: 700px) {
    #masthead { position: relative; }
    #masthead ~ #content_pane { margin-top: inherit; }
}