/* Welcome to Compass. In this file you should write your main styles. (or centralize your imports) Import this file using the following HTML or equivalent: <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" /> */
html { box-sizing: border-box; }

*, *:before, *:after { box-sizing: inherit; }

body { margin: 0; }

.nav {
    background: #161C31; /* Old browsers */
    background: -moz-linear-gradient(left, #2ec1d8 60%, #161C31 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(60%, #2ec1d8), color-stop(100%, #161C31)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left, #2ec1d8 60%, #161C31 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left, #2ec1d8 60%, #161C31 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left, #2ec1d8 60%, #161C31 100%); /* IE10+ */
    background: linear-gradient(to right, #161C31 60%, #2ec1d8); /* W3C */
    height: 75px;
}
.nav:after { content: ''; }

.right { float: right; }

.left { float: left; }

.nav a.button:hover {
    background: #28B8CE; /* Old browsers */
    background: -moz-linear-gradient(top, #28B8CE 0%, #161C31 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #28B8CE), color-stop(100%, #161C31)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #28B8CE 0%, #161C31 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #28B8CE 0%, #161C31 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #28B8CE 0%, #161C31 100%); /* IE10+ */
    background: linear-gradient(to bottom, #28B8CE 0%, #161C31 100%);
}

.nav a.button:active, .nav a.button.active {
    background: #28B8CE; /* Old browsers */
    background: -moz-linear-gradient(top, #28B8CE 0%, #161C31 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #28B8CE), color-stop(100%, #161C31)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #28B8CE 0%, #161C31 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #28B8CE 0%, #161C31 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #28B8CE 0%, #161C31 100%); /* IE10+ */
    background: linear-gradient(to bottom, #28B8CE 0%, #161C31 100%); /* W3C */
    font-weight: bold;
}

.nav a.button.emissions:active, .nav a.button.emissions.active { -webkit-box-shadow: inset 5px 0px 25px 0px rgba(0, 0, 0, 0.4), inset 0px -10px 0px 0px #cccc00; -moz-box-shadow: inset 5px 0px 25px 0px rgba(0, 0, 0, 0.4), inset 0px -10px 0px 0px #cccc00; box-shadow: inset 5px 0px 25px 0px rgba(0, 0, 0, 0.4), inset 0px -10px 0px 0px #cccc00; }

.nav a.button.chemicals:active, .nav a.button.chemicals.active { -webkit-box-shadow: inset 5px 0px 25px 0px rgba(0, 0, 0, 0.4), inset 0px -10px 0px 0px #009966; -moz-box-shadow: inset 5px 0px 25px 0px rgba(0, 0, 0, 0.4), inset 0px -10px 0px 0px #009966; box-shadow: inset 5px 0px 25px 0px rgba(0, 0, 0, 0.4), inset 0px -10px 0px 0px #009966; }

.nav a.button.air_water:active, .nav a.button.air_water.active { -webkit-box-shadow: inset 5px 0px 25px 0px rgba(0, 0, 0, 0.4), inset 0px -10px 0px 0px #006899; -moz-box-shadow: inset 5px 0px 25px 0px rgba(0, 0, 0, 0.4), inset 0px -10px 0px 0px #006899; box-shadow: inset 5px 0px 25px 0px rgba(0, 0, 0, 0.4), inset 0px -10px 0px 0px #006899; }

.nav a.button.permit_manager:active, .nav a.button.permit_manager.active { -webkit-box-shadow: inset 5px 0px 25px 0px rgba(0, 0, 0, 0.4), inset 0px -10px 0px 0px #cc5500; -moz-box-shadow: inset 5px 0px 25px 0px rgba(0, 0, 0, 0.4), inset 0px -10px 0px 0px #cc5500; box-shadow: inset 5px 0px 25px 0px rgba(0, 0, 0, 0.4), inset 0px -10px 0px 0px #cc5500; }

.nav a.logo, .nav a.button { color: white; font-family: Helvetica, Arial, sans-serif; text-decoration: none; height: 75px; line-height: 75px; text-align: center; width: 150px; font-size:16px; }

/*.nav .rightend { width: 81px; height: 75px; background: url(../images/nav-right-end.png); }*/

.nav a.logo { text-align: left; width: 400px; line-height: 1; }
.nav a.logo img { margin-top: 20px; margin-left: 20px; border: 0; }
.nav a.logo span { font-size: 12px; margin-left: 20px; }

.cf:before, .cf:after { content: " "; display: table; }

.cf:after { clear: both; }

.cf { *zoom: 1; }
