﻿@charset "utf-8";
/* CSS Document */

/* BEGIN Typography ______________________________ */

h1, h2, h3, h4, h5, h6, p, ol, ul, li, pre, code, address, variable, form, fieldset, blockquote, nav, table {
	padding: 0;
	margin: 0;
	font-weight: normal;
	font-style: normal;
	font-size: 1em;
	line-height: 1.15em;
	font-family: Arial, Helvetica, sans-serif;
	-webkit-text-size-adjust: none;
	–ms-text-size-adjust: none;
	word-break: hyphenate;
	-ms-hyphens: hyphenate;
}

p, table {
	font-size: .85em;
	line-height: 1.35em;
	margin: .3em 1.5em 1.3em;
	padding: 0;
}

h1 {
	font-weight: bold;
	font-size: 1.5em;
	line-height: 1.4em;
}

h2 {
	clear: both;
	line-height: 1.3em;
	font-weight: bold;
	margin: .75em 1em .4em;
	padding: 0;
	border-bottom: solid 1px #DEDEDE;
}

article h2 {
	font-size: 1.25em;
}

h2 a {
	text-decoration: none;
}

h3, h4, h5, h6 {
	line-height: 1.3em;
	font-weight: bold;
	margin: .3em 1.3em;
}

h3 {
	margin-top: 1.4em;
	color: #003F5F;
}

h4 {
}

h5 {
	text-decoration: underline;
}

h6 {
	font-style: italic;
	text-decoration: underline;
}

blockquote {
	border-left: 1px solid #CCC;
	margin-left: 1.4em;
	margin-bottom: 7px;
	padding-left: 2%;
	padding-bottom: 2px;
}

address {
	font-size: .85em;
	line-height: 1.35em;
	margin: .3em 1.5em 1em;
}

hr {
	margin-left: 1em;
	margin-right: 1em;
}

ol, ul {
	margin: 0 1em 1.6em 2.6em;
	font-size: .85em;
}

aside ol, aside ul {
	margin: 0 .7em 1.6em 2.3em;
}

ul ul, ol ol, ul ol, ol ul {
	font-size: 1em;
}

ul {
	list-style-image: url(http://www.dot.state.mn.us/images/10templates/icon_bullet.gif);
}

ul li, ol li, ul ul li, ol ol li {
	margin: 0 1em .3em 0;
	line-height: 1.25em;
}

li p {
	font-size: 1em;
}
	
ul, li {
	clear: none;
}

ul li ul, ol li ol, ol li ul, ul li ol {
	margin-left: 2em;
	margin-top: .4em;
	font-size: 1em;
}

aside nav li {
	margin: .2em 0 .3em;
	padding: 0;
	line-height: 1.1em;
}

a:link, a:visited {
	font-size: 1em;
	color: #003f5f;
}

a:hover, a:active {
	color: #D0420A;
}

nav #general-links span a:link {
	display: block;
	position: absolute;
	left: -999px;
}

.white-link {
	color: #FFF;
}

.white-link a:link, .white-link a:visited{
	color: #FFF;
	padding: 0 1px;
	text-decoration: none;
}

.white-link a:hover {
	text-decoration: underline;
}

.hidden {
	position: absolute;
	left: 0;
	top: -1000px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

aside address {
	margin: 1em 1em;
	line-height: 1.1em;
	font-size: .85em;
}

.clear {
	clear: both;
	padding-top: 17px;
}

image.clear, figure.clear {
	clear: right;
	padding-top: 0;
	margin-top: 17px;
}

/* END Typography ______________________________ */

form {
	margin: .5em .5em .5em .5em;
}
table {
	margin: .1em .1em .1em .1em;
}
/* BEGIN Graphics ______________________________ */

img {
	border: 0;
	margin: .2em 1em 1em;
	padding: 0;
	max-width: 100% !important;
	height: auto !important;
}

p img {
	border: 0;
	margin: .2em 1em 1em 0;
	padding: 0;
	max-width: 100% !important;
	height: auto !important;
}

img a {
	text-decoration: none;
}

figure {
	float: right;
	display: block;
	width: auto;
	padding: 0;
	margin: .3em 1.25em 1.5em;
	border: solid 1px #CCC;
	border-bottom: solid 2px #CCC;
	background-color: #EEE;
	clear: right;
	overflow: hidden;
}

figure img {
	display: block;
	border: 0;
	margin: 0;
	padding: 0;
	max-width: 100% !important;
	height: auto !important;
}

figure a:link, figure a:visited {
	font-size: 1em;
}

figcaption {	
	color: #4E4E4E;
	display: block;
	margin: 0;
	padding: .7em .6em .4em;
	font-size: .75em;
	line-height: 1.4em;
	font-family: Arial, Helvetica, sans-serif;
}

figcaption p {
	font-size: 1em;
	margin: 0;
	padding: 0;
}

.figure-left {
	float: left;
	clear: left;
}

.no-margin {
	margin: 0;
}

image.no-margin {
	margin: .5em 0;
}

figure.no-margin {
	margin: .3em 0 1.5em;
}

figure.no-margin figcaption {
}

/* END Graphics ______________________________ */

/* BEGIN Page Structure ______________________________ */

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section { 
    display: block;
}

body {
	background-color:#212121;
	margin: 0 auto;
	padding: 0;
	width: 960px;
}

body#fullscreen {
	width: 100%;
	margin: 0;
}

header {
	width: 100%;
	margin: 0;
	padding: 0;
	float: left;
	background-color: #fff;
	background-image: url(http://www.dot.state.mn.us/images/12templates/header.png);
	background-repeat: no-repeat;
}

#content {
	width: 100%;
	margin: 0;
	padding: 0 0 12px;
	float: left;
	background-color: #E7E7E7;
}

section {
	margin: 19px 0 0 2%;
	padding: 0;
	float: left;
	display: inline;
}

section.side-main-content {
	width: 73%;
}

section.half-main-content {
	width: 47%;
}

section.one-column {
	width: 96%;
}

article {
	float:left;
	width: 100%;
	padding: 0;
	margin: 0 0 10px;
	background-color: #FFF;
	overflow: hidden;
	border-bottom: 2px solid #CCC;
	min-height:350px;
}

aside {
	width: 20%;
	margin: 19px 0 20px 2%;
	padding: 0;
	display: inline;
	float: left;
}

article aside {
	float: right;
	width: 46%;
	margin: .3em .8em 1.3em;
	padding: 0;
	background-color: #EEE;
	border-bottom: 2px solid #CCC;
	clear: right;
	overflow: hidden;
}

.aside-right 
{
	float: right;
	margin: 19px 0 20px 2%;
    padding-right: 19px
}

aside div {
	width: 100%;
	margin-bottom: 10px;
	padding: 0;
	float: left;
	border-bottom: 2px solid #CCC;
	background-color: #FFF;
	overflow: hidden;
}

aside div div {
	width: auto;
	margin-bottom: 0;
	padding: 0;
	float: none;
	border: none;
	background-color: none;
	overflow: hidden;
}

.adjustedZIndex {
    z-index: 1;
}

/* END Page Structure ______________________________ */

/* BEGIN Content Design ________________________________*/

/* BEGIN Emergency Info ________________________________*/

.emergency {
	color: #C62B20;
	font-weight: bold;
}

.emergency a:link, .emergency a:visited {
	color: #C62B20;
}

.emergency a:active, .emergency a:hover {
	color: #666;
}

aside h2.emergency, aside h3.emergency, aside h4.emergency, aside h5.emergency, aside h6.emergency, figcaption.emergency {
	color: #FFF;
	background-color: #C62B20;
}

/* END Emergency Info ________________________________*/

#mndot {
	float: left;
	width: 320px;
}

#mndot a:link, #mndot a:visited {
	color: #FFF;
	display: block;
	width: 320px;
	height: 85px;
	background-image: url(http://www.dot.state.mn.us/images/12templates/mndotlogo.png);
	background-repeat: no-repeat;
	background-position: left;
	background-size: auto;
}

#mndot a span {
	display: none;
}

#traffic-info {
	float: right;
	width: 90px;
}

/* 511 travel info */

#traffic-info a:link, #traffic-info a:visited {
	display: block;
	width: 90px;
	height: 60px;
	padding: 0;
	background-position: -5px;
	margin: 0;
	zoom: 1;
	float: left;
	font-weight: normal;
	font-family: Arial, Helvetica, sans-serif;
	text-align: center;
	font-size: .85em;
	line-height: 1.6em;
	font-weight: bold;
	text-decoration: none;
	background-image: url(http://www.dot.state.mn.us/images/511_logo.png);
	background-repeat: no-repeat;
}

#current-traffic {
	width: 45%;
	display: block;
	background-color: #FFF;
	border-left: 1px solid #CCC;
	margin-top: 5px; 
	margin-bottom: 5px;
	padding: 120px 0 10px 2%;
	background-image: url(http://www.dot.state.mn.us/images/12templates/metro-travel-info.png);
	background-repeat: no-repeat;
	background-position: top;
	font-size: .85em;
}

#traffic-info a:hover, #traffic-info a:active {
	background-color: #fff;
}

#traffic-info a span {
	display: none;
}

/* END 511 travel info */

p.description {
	font-size: .85em;
}

section#local-offices {
	display: block;
	width: 170px;
	margin: 0 auto 3px;
}

article aside div#local-offices {
	width: 100%;
	border: none;
	background-color: #EEE;
}

/* BEGIN Social ________________________________*/

p.twitter, p.email, p.facebook, p.youtube, p.linkedin, p.survey {
	margin: .3em 1.2em .8em;
}

p.twitter a, p.email a, p.facebook a, p.youtube a, p.linkedin a {
	display: block;
	width: 100% -37px;
	margin: 0;
	padding: 5px 0 5px 37px;
	text-align: left;
	font-size: 1em;
	text-decoration: none;
	background-repeat: no-repeat;
	background-position: left;
}

p.survey a {
	display: block;
	width: 100% -45px;
	margin: 0;
	padding: 9px 0 9px 45px;
	text-align: left;
	font-size: 1em;
	text-decoration: none;
	background-repeat: no-repeat;
	background-position: left;
}

p.survey a:link, p.survey a:visited {
	background-image: url(http://www.dot.state.mn.us/images/12templates/survey.png);
}

p.survey a:hover, p.survey a:active {
	background-image: url(http://www.dot.state.mn.us/images/12templates/survey-h.png);
}

p.email a:link, p.email a:visited {
	background-image: url(http://www.dot.state.mn.us/images/12templates/social-media/email.png);
}

p.email a:hover, p.email a:active {
	background-image: url(http://www.dot.state.mn.us/images/12templates/social-media/email-o.png);
}

p.facebook a:link, p.facebook a:visited {
	background-image: url(http://www.dot.state.mn.us/images/12templates/social-media/facebook.png);
}

p.facebook a:hover, p.facebook a:active {
	background-image: url(http://www.dot.state.mn.us/images/12templates/social-media/facebook-o.png);
}

p.youtube a:link, p.youtube a:visited {
	background-image: url(http://www.dot.state.mn.us/images/12templates/social-media/youtube.png);
}

p.youtube a:hover, p.youtube a:active {
	background-image: url(http://www.dot.state.mn.us/images/12templates/social-media/youtube-o.png);
}

p.twitter a:link, p.twitter a:visited {
	background-image: url(http://www.dot.state.mn.us/images/12templates/social-media/twitter.png);
}

p.twitter a:active, p.twitter a:hover {
	background-image: url(http://www.dot.state.mn.us/images/12templates/social-media/twitter-o.png);
}

p.linkedin a:link, p.linkedin a:visited {
	background-image: url(http://www.dot.state.mn.us/images/12templates/social-media/linkedin.png);
}

p.linkedin a:active, p.linkedin a:hover {
	background-image: url(http://www.dot.state.mn.us/images/12templates/social-media/linkedin-o.png);
}

/* END Social ________________________________*/

nav, nav ul, nav ol {
	margin: 0;
	padding: 0;
}

header nav {
	float: right; 
	display: block;
	clear: right;
	width: 500px;
	padding: 0;
	margin: 0;
	text-align: right;
	color: #FFF;
	border: none;
}

header nav a:link, header nav a:visited {
	color: #FFF;
	text-decoration: none;
}

header nav p {
	color: #FFF;
	padding: 0;
	margin: 0;
	font-size: .9em;
}

/* #general-links controls the links in the header (MnDOT A to Z, Contacts, Simple Search and Advanced Search) */

header nav #general-links ul {
	margin: 0;
	padding: 0;
}

nav #general-links li {
	list-style: none;
	list-style-image: none;
	list-style-type: none;
}

nav #general-links li a {
	padding: 4px 4px;
	margin: 0;
	font-size: .9em;
}

nav #general-links li a:hover, nav #general-links li a:active {
	text-decoration: underline;
}

span.skip {
	position: absolute;
	left: -9999px;
}

/* #topic-wrapper contains the page title, subtitle and small image in the header. When the page width is less than 960px the #topic_wrapper figure element is hidden to save space on smaller screens. */

#topic_wrapper {
	height: 100%;
	width: 100%;
	float: left;
	padding: 0;
	margin: 0;
	background-image: url(http://www.dot.state.mn.us/images/12templates/gradient_bkgd.png);
	background-repeat: repeat-x;
	background-position: bottom;
	background-color: #F3F3F3;
	color: #000;
}

#page-title {
	width: 65%;
	float: left;
	margin: 14px 0 6px 2%;
}

#topic_wrapper h1 {
	line-height: 1.2em;
}

#topic_wrapper p {
	line-height: 1em;
	margin: .3em 0;
	color: #003f5f;
}

#topic_wrapper figure {
	width: auto;
	height: 74px;
	padding: 0;
	margin: 0;
	background-color: #F3F3F3;
	background-image: url(http://www.dot.state.mn.us/images/12templates/gradient_bkgd.png);
	background-repeat: repeat-x;
	background-position: bottom;
	border: 0;
}

#topic_wrapper figure img {
	float: right;
	margin: 0;
	padding: 0;
}

/* #main-nav is the main navigation for each page. The MnDOT homepage is the only page that doesn't use the #main-nav element for main navigation. */

nav#main-nav {
	float: left;
	width: 96%;
	margin: 0;
	padding: 4px 2%;
	background-color: #D0D0D0;
	border-bottom: solid 1px #8B8B8B;
	clear: both;
}

nav#main-nav ul {
	width: 100%;
	margin: 0;
	padding: 0;
	clear: both;
	list-style: none;
	list-style-image:none;
	list-style-type: none;
}

nav#main-nav li {
	margin: 0 .2em;
	padding: 0;
	display: inline;
	list-style-image: none;
}

nav#main-nav a:link, nav#main-nav a:visited {
	padding: 0 .4em;
	font-size: .9em;
	font-weight: bold;
	color: #003F5F;
	font: Arial, Helvetica, sans-serif;
}

nav#main-nav a:hover, nav#main-nav a:active {
	color: #CA5727;
}

nav#main-nav p {
	margin: 0 .4em;
	padding: 0;
	line-height: 1.25em;
}

nav#main-nav p a:link, nav#main-nav p a:visited {
	padding: 0 .6em;
}

.button a, a.button {
	font-size: 1em;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	display: block;
	margin: 5px 0 0;
	padding: 7px;
	background-color:  #E9E9E9;
	border-bottom: 1px solid #003F5F;
	-webkit-border-radius: 7px;
	-moz-border-radius: 7px;
	border-radius: 7px;
	overflow: hidden;
}

.button a:hover, a.button:hover {
	color: white;
	background-color: #F55D23;
}

.hide-link {
	display: none;
}

.mobile-only {
	display: none;
}


/* END Content Design ______________________________ */

/* BEGIN Footer ______________________________ */

footer {
	width: 100%;
	padding: 0;
	margin: 0;
	clear: both;
}

footer#main-footer {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: .5em 0 0;
	float: left;
	background-color: #818181;
	background-image: url(http://www.dot.state.mn.us/images/footer_bkgd.png);
	background-repeat: no-repeat;
	background-position: top;
}

footer #footer-contact {
	font-family:Arial, Helvetica, sans-serif;
	color: #FFF;
	font-size: .9em;
	line-height: 1.3em; 
	width: 46%; 
	float: left;
	padding: .3em 0 0;
}

#main-footer nav  {
	width: 46%; 
	padding: .4em .8em 0;
	float: right; 
	font-size: .9em;
	text-align: right;
	line-height: 1.3em;
	font-family:Arial, Helvetica, sans-serif;
	color: #fff;
	overflow: hidden;
}

#main-footer nav ul {
	list-style: none;
	list-style-type: none;
	list-style-image: none;
	overflow: hidden;
}

#main-footer nav li {
	margin: .1em 0;
	padding: 0 .8em;
	float: right;
	font-weight: normal;
	list-style-image: none;
	border-right: solid #9B9B9B 1px;
}

#main-footer nav li:first-child {
	border-right: none;
	padding-right: .6em;
}

#main-footer nav a:link, #main-footer nav a:visited, #main-footer p a {
	text-decoration: none;
	color: #fff;
}

#main-footer nav a:hover, #main-footer p a:hover {
	text-decoration: underline;
}

/* END Footer ______________________________ */

/* Homepage styling */

/* BEGIN Page Structure ______________________________ */

header#homepage {
	background-color: #003f5f;
	background-image: none;
	border-bottom: 3px solid #CCC;
}

header#homepage #topic-wrapper {
	padding: 0;
	overflow: hidden;
	clear: both;
	background-image: url(http://www.dot.state.mn.us/images/12templates/gradient_bkgd.png);
	background-repeat: repeat-x;
	background-position: bottom;
	color: #000;
}

section.homepage-main-content {
	width: 50%;
}

/* END Page Structure ______________________________ */



/* BEGIN Splash Content ______________________________ */


#splash-image {
	width:100%; 
	height: auto;
	margin: 0;
	padding: 0;
	background-repeat: no-repeat; 
	background-position: center;
	border-bottom: solid 1px #D6D6D6;
	background-color: #45A8DE;
	overflow: hidden;
}


#splash-image.511app {
	margin: 0;
}

#splash-image.scc {
	border-top: solid 10px #6797C7;
}

#splash-text {
	width: 33%; 
	margin: 0;
	padding: 42px 2% 42px 5%;
	overflow: hidden;
}

#splash-text.black {
	background-image: url(/images/splash-text-bkgd_black.png);
	color: #FFF;
}

#splash-text.white {
	background-image: url(/images/splash-text-bkgd_white.png);
	color: #003F5F;
}

#splash-text.green {
	background-image: url(/images/splash-text-bkgd_green.png);
	color: #FFF;
}

#splash-text.blue {
	background-image: url(/images/splash-text-bkgd_blue.png);
	color: #FFF;
}

#splash-text.blue2 {
	background-image: url(/images/splash-text-bkgd_blue2.png);
	color: #FFF;
}

#splash-text.fourth {
	background-image: url(/images/splash-text-image-fourth.png);
	background-repeat: no-repeat;
	color: #FFF;
}

#splash-text.511app {
	width: 26%; 
	background-image: url(/images/511-app-background.png);
	color: #FFF;
}

.scc #splash-text {
	width: 38%; 
	background-image: url(/images/splash-text-gradient2.png);
	color: #000;
}

#splash-text p {
	margin-left: 0;
	font-size: 1em;
	line-height: 1.5em;
}

#splash-text .emergency {
	color: #C62B20;
}

#splash-text h2 {
	margin: .25em 0 .6em;
	padding: 0;
	font-size: 2em;
	line-height: 1.1em;
	font-weight: normal;
	border-bottom: none;
}

.scc #splash-text h2 {
	color: #33577C;
}

#splash-text h2.emergency {
}

#splash-text p.emergency a:link, #splash-text p.emergency a:visited {
	color: #003F5F;
}

#splash-text p.emergency a:active, #splash-text p.emergency a:hover {
	color: #D0420A;
}

#splash-text p a:link, #splash-text p a:visited {
	color: #FFFFFF;
}

#splash-text.black p a:active, #splash-text.black p a:hover, #splash-text.blue p a:active, #splash-text.blue p a:hover,
#splash-text.fourth p a:active, #splash-text.fourth p a:hover{
	color: #F6D9CE;
}

.scc #splash-text p a:link, .scc #splash-text p a:visited, #splash-text.white p a:link, #splash-text.white p a:visited {
	color: #33577C;
}

.scc #splash-text p a:active, .scc #splash-text p a:hover, #splash-text.white p a:active, #splash-text.white p a:hover {
	color: #D0420A;
}

/* END Splash Content ________________________________*/



/* BEGIN Content Design ________________________________*/

#homepage #mndot a:link, #homepage #mndot a:visited {
	background-image: url(http://www.dot.state.mn.us/images/12templates/mndot-white.png);
	height: 64px;
}

/* 511 travel info */

#homepage #traffic-info {
	width: 21%;
	margin: 0 0 0 1%;
	padding: 0;
	float: left;
}

#homepage #traffic-info a:link, #homepage #traffic-info a:visited {
	display: block;
	width: 210px;
	padding: 56px .3em 1px .3em;
	margin: 0;
	height: auto;
	font-size: .85em;
	line-height: 1.6em;
	background-position: center 6px;
}

#traffic-info a:hover, #traffic-info a:active {
	background-color: #fff;
}

#traffic-info a span {
	display: none;
}

/* END 511 travel info */

#your-destination {
	width: 356px;
	height: 40px;
	margin: 14px 8px 0 0;
	padding: 0 0 6px;
	float: right;
	background-image: url(http://www.dot.state.mn.us/images/12templates/your_destination-white.png);
	background-repeat: no-repeat;
	background-position: right;
	overflow: visible;
}

#your-destination a span {
	display: none;
}

#current-traffic {
	width: 45%;
	display: block;
	background-color: #FFF;
	border-left: 1px solid #CCC;
	padding: 120px 0 10px 2%;
	background-image: url(http://www.dot.state.mn.us/images/12templates/metro-travel-info.png);
	background-repeat: no-repeat;
	background-position: top;
	font-size: .85em;
}

p.description {
	font-size: .85em;
}

/* BEGIN Social ________________________________*/

p.twitter-alt {
	display: block;
	margin: 0;
}

p.twitter-alt a:link, p.twitter-alt a:visited {
	background-color: #003F5F;
	color: #FFF;
	display: block;
	margin: 0;
	padding: 5px 20px 30px;
	background-image: url(http://www.dot.state.mn.us/images/12templates/twitter-widget-logo.png);
	background-repeat: no-repeat;
	background-position: 50% 85%;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
}

p.twitter-alt a:hover, p.twitter-alt a:active {
	background-color: #1178AC;
}

p.mnpass {
	float: left;
	display: block;
	width: 21%;
	margin: 0 2%;
	font-size: 1.1em;
	font-weight: normal;
	line-height: 1.4em;
	text-align: center;
}

p.mnpass a:link, p.mnpass a:visited { 
	display: block;
	float: left;
	width: 100%;
	overflow: visible;
	margin: 0;
	padding: 0;
	text-decoration: none;
}

p.mnpass a:hover {
	text-decoration: underline;
}

/* END Social ________________________________*/

/* #general-links controls the links in the header (MnDOT A to Z, Contacts, Simple Search and Advanced Search) */

header nav #general-links ul {
	margin: 0 12px 0 0;
	padding: 0;
	font-size: .85em;
}

nav #general-links li {
	display: inline;
	text-align: right;
	margin: 0;
	padding: 0;
	list-style: none;
	list-style-image: none;
	list-style-type: none;
}

nav #general-links li a {
	display: block;
	float: right;
	padding: 4px 8px;
	margin: 0;
}

nav #general-links li a:hover, nav #general-links li a:active {
	text-decoration: underline;
}

#homepage nav #general-links li a:hover, #homepage nav #general-links li a:active {
	background-color: #1178ac;
	text-decoration: none;
}

span.skip {
	position: absolute;
	left: -9999px;
}

/* Homepage main navigation (Topics A to Z, Doing Business, Safety and Contact MnDOT) */

dl#homepage-nav  {
	margin: 0;
	padding: 0;
	overflow: hidden;
}

dl#homepage-nav a {
	display: block; 
	width: 100%;
	text-decoration: none;
	margin-bottom: 10px;
	background-color: #FFF;
	border-bottom: solid 1px #CCC;
}

dl#homepage-nav dt {
	font-size: 1em;
	font-weight: bold;
	text-align: center;
	margin: 0;
	padding: 0;
	border-bottom: none;
}

dl#homepage-nav dd {
	line-height: 1.5em;
	font-size: .75em;
	margin: 0.5em;
}

dl#homepage-nav a:link dt, dl#homepage-nav a:visited dt {
	color: #fff;
	display: block;
	background-color: #003f5f;
	padding: 4px;
	text-decoration: none;
}

dl#homepage-nav a:hover dt {
	background-color: #1178ac;
}

dl#homepage-nav a:link dt#orange, dl#homepage-nav a:visited dt#orange {
	background-color: #F55D23;
}

dl#homepage-nav a:hover dt#orange {
	background-color: #1178ac;
}

dl#homepage-nav a:link dd, dl#homepage-nav a:visited dd {
	color: #000;
	text-decoration: none;
}

dl#homepage-nav a:hover dd {
}

dl#homepage-nav a.mobile-only {
	display: none;
}

/* END Homepage main navigation */


/* END Content Design ______________________________ */

/* BEGIN Footer ______________________________ */

/* #links-footer is only shown on the MnDOT homepage. It acts as a quick links section and should not be used on any other page. */

footer#links-footer {
	float:left;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 20px 0;
	background-color: #fff;
	color: #979797;
	overflow: hidden;
}

footer#links-footer h2 {
	font-size: .85em;
	font-weight: bold;
	color: #434343;
}

#links-footer nav {
	width: 73%;
	margin: 0 2% 0 0;
	padding: 0;
	float: right;
}

#links-footer a:link, #links-footer a:visited {
	color: #003F5F;
	font-size: 0.85em;
	line-height: 1.3em;
}

#links-footer a:hover, #links-footer a:active {
	color: #F55D23;
}

.links {
	width: 29%;
	margin-left: 4%;
	float: left;
}

.links ul {
	margin: 0 1em 12px 1em;
	padding: 0;
	list-style: none;
	list-style-image: none;
}

.links ul li {
	margin: 4px 0 7px;
	padding: 0;
	line-height: .85em;
}

/* END #links-footer */

/* END Footer ______________________________ */

/* BEGIN Mode Buttons ________________________________*/

#mode-icons {
	width: 75%;
	display: inline;
	float: right;
	padding: 0;
	margin: 0 1.5% 0 0;
}

#mode-icons li {
	display: inline;
	float: left;
	padding: 0;
	margin: 0;
	width: auto;
}

#mode-icons li a:link, #mode-icons li a:visited {
	color: #003F5F;
	display: inline;
	float: left;
	padding: 48px 0 1px;
	margin: 7px 0 0;
	width: 90px;
	text-align: center;
	font-size: .85em;
	line-height: 1.7em;
	text-decoration: none;
	font-family: Arial, Helvetica, sans-serif;
	zoom: 1;
	background-position: center 4px;
	background-repeat: no-repeat;
}

#mode-icons li a:hover {
	color: #D0420A;
	background-color: #FFF;
}

#mode-icons li#auto a:link, #mode-icons li#auto a:visited {
	background-image: url(http://www.dot.state.mn.us/images/12templates/auto.png);
}

#mode-icons li#truck a:link, #mode-icons li#truck a:visited {
	background-image: url(http://www.dot.state.mn.us/images/12templates/truck.png);
}

#mode-icons li#transit a:link, #mode-icons li#transit a:visited {
	background-image: url(http://www.dot.state.mn.us/images/12templates/transit.png);
}

#mode-icons li#train a:link, #mode-icons li#train a:visited {
	background-image: url(http://www.dot.state.mn.us/images/12templates/train.png);
}

#mode-icons li#plane a:link, #mode-icons li#plane a:visited {
	background-image: url(http://www.dot.state.mn.us/images/12templates/plane.png);
}

#mode-icons li#bike a:link, #mode-icons li#bike a:visited {
	background-image: url(http://www.dot.state.mn.us/images/12templates/bike.png);
}

#mode-icons li#ped a:link, #mode-icons li#ped a:visited {
	background-image: url(http://www.dot.state.mn.us/images/12templates/ped.png);
}

#mode-icons li#ship a:link, #mode-icons li#ship a:visited {
	background-image: url(http://www.dot.state.mn.us/images/12templates/ship.png);
}

/* END Mode Buttons ________________________________*/

@media all and (max-width:959px) {
	
body {
	width: 100%;
	float: left;
	padding: 0;
	margin: 0;
}

#topic_wrapper figure {
	display: none;
}

#page-title {
	width: 90%;
}

figure {
	max-width: 100% !important;
}

.desktop-only {
	display: none;
}

.mobile-only {
	display: inherit;
}

/* Homepage styling */

#mode-icons li {
	width: 12.3%;
}

#mode-icons li a:link, #mode-icons li a:visited {
	float: left;
	padding: 47px 0 0;
	background-size: auto;
	width: 100%;
}

footer#links-footer {
	float: left;
	clear: both;
	width: 100%;
	padding: 12px 0 22px;
	margin: 0;
	border-top: none;
}

}

@media all and (min-width:821px) {	

p.mnpass a {
	background-size: 100%;
}

}

@media all and (max-width: 820px) {

h1 {
	line-height: 1.3em;
	font-size: 1em;
	font-variant: normal;
	font-weight: 600;
}

#topic_wrapper p {
	line-height: 1.5em;
}
	
header {
	background-image: none;
	background-color: #003F5F;
}

#mndot {
	width: 250px;
}
	
#mndot a:link, #mndot a:visited {
	width: 250px;
	height: 50px;
	background-image: url(http://www.dot.state.mn.us/images/12templates/mndot-white.png);
	background-repeat: no-repeat;
	background-position: left;
	background-size: 250px 50px;
}

#mndot a span {
	display: none;
}

#traffic-info {
	margin: 0;
	padding: 0;
	width: 126px;
}

#traffic-info h1 {
	line-height: 1.3em;
	font-size: 1em;
	font-style: italic;
	font-weight: 600;
}

#traffic-info a:link, #traffic-info a:visited {
	width: 110px;
	height: auto;
	padding: 7px 0 7px;
	margin: 10px 6px 0;
	color: #FFFFFF;
	background-color: #003f5f;
	display: block;
	background-image: none;
	text-decoration: none;
	text-align: right;
}

#traffic-info a:active, #traffic-info a:hover {
	text-decoration: underline;
}

#traffic-info a span {
	display: inline;
}

nav #general-links ul li {
	display: none;
}

nav#main-nav p {
	line-height: 1.85em;
	text-align: center;
}

nav#main-nav ul {
	text-align: center;
}

nav#main-nav li {
	line-height: 1.85em;
}

/* Homepage styling */
	
#homepage #mndot a:link, #homepage #mndot a:visited {
	width: 250px;
	height: 50px;
	background-image: url(http://www.dot.state.mn.us/images/12templates/mndot-white.png);
	background-repeat: no-repeat;
	background-position: left;
	background-size: 250px 50px;
}

#your-destination {
	width: 45%;
	margin-top: 5px;
	background-position: right;
	background-size: auto 40px;
	height: 40px;
}

#homepage #traffic-info h1 {
	line-height: 1.3em;
	font-size: 1em;
	font-style: italic;
	font-weight: 600;
}

#homepage #traffic-info {
	margin: 0;
	padding: 0;
	width: 20%;
}

#homepage #traffic-info a:link, #homepage #traffic-info a:visited {
	width: 100%;
	height: 100%;
	padding: 16px 0;
	margin: 0;
	color: #003F5F;
	display: block;
	background-image: url(http://www.dot.state.mn.us/images/12templates/gradient_bkgd.png);
	background-repeat: repeat-x;
	background-position: bottom;
	text-decoration: none;
	text-align: center;
}

#homepage #traffic-info a:active, #homepage #traffic-info a:hover {
	background-position: top;
	color: #F55D23;
}

nav#mode-icons {
	width: 80%;
	padding: 0;
	margin: 0;
}

nav#mode-icons li {
	display: inline-block;
	width: 25%;
	float: left;
	margin: 0;
	padding: 0;
	clear: none;
}

#mode-icons li a:link, #mode-icons li a:visited {
	width: 100%;
	padding: 3px 0;
	margin: 0;
	text-align: center;
	background-position: -9999px;
}

}

@media all and (max-width:720px) {

article h2 {
	font-size: 1em;
}

img {
	max-width: 100%;
	margin: 0 auto;
	float: none !important;
}

figure {
	max-width: 96% !important;
}

figure img {
	margin: 0;
	padding: 0;
	width: 100%;
	height: auto;
}

p.description {
	display: none;
}

.web-survey {
	position: absolute;
	left: 0;
	top: -1000px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}


.web-survey h2 {
	display: none;
}

.web-survey p {
	display: none;
}

/* START Layout ________________________________*/

#content {
	width: 100%;
	margin: 0;
	padding: 0 0 12px;
	float: left;
	background-color: #EEE;
}

section, section.side-main-content, section.half-main-content, section.one-column, aside {
	width: 100%;
	margin: 0;
	padding: 0;
	float: none;
	clear: both;
}

article, aside div {
	width: 96%;
	padding: 0;
	margin: 12px auto 0;
	float: none;
	clear: both;
}

article aside {
	float: right;
	width: 98%;
	margin: .3em 1% 1.3em;
	padding: 0;
	background-color: #EEE;
	clear: right;
	overflow: hidden;
}

/* END Layout ________________________________*/

#local-offices {
	width: auto;
	margin: 0 auto 3px;
	float: none;
	clear: both;
}

.sidebar-link {
	display: compact;
}

#current-traffic {
	float: none;
	overflow: hidden;
	width: 95% -127px;
	padding: 37px 5% 44px 127px;
	margin: 0 0 10px;
	border-left: none;
	background-position:  -20px center;
}

#current-traffic a {
	font-size: 1.15em;
}

/* BEGIN Footer ______________________________ */

footer#main-footer nav {
	width: 90%;
	float: none;
	clear: both;
}

#main-footer nav li {
	float: left;
}

#main-footer nav li:first-child {
	border-right: solid #B4B4B4 1px;
	padding-right: .8em;
	padding-left: .6em;
}

#main-footer nav li:last-child {
	border-right: none;
}

footer #footer-contact {
	width: 90%;
	margin-top: .3em;
	margin-bottom: 1.6em;
	float: none;
	clear: both;
}

/* END Footer ______________________________  */

/* Homepage styling */

#your-destination {
	display: none;
}


/* BEGIN Splash Content ______________________________ */

#splash-text {
	width: 80% !important; 
	margin: 0 0 12px; 
	padding: 22px 10% 2px;
}

/* END Splash Content ______________________________ */


dl#homepage-nav {
	margin: 10px 2% 10px;
	font-size: 1em;
	background-color: #003f5f;
	overflow: hidden;
}

dl#homepage-nav a, dl#homepage-nav a dt {
	margin: 0;
	border: none;
	text-align: left;
	line-height: 1.2em;
	margin-right: 0;
	overflow: hidden;
}

dl#homepage-nav a {	
	border-bottom: 1px solid #3C5774;
}

dl#homepage-nav a dt {
	padding-left: 5px;
	background-image: url(http://www.dot.state.mn.us/images/12templates/link-arrow.png);
	background-position: right;
	background-repeat: no-repeat;
}

dl#homepage-nav a.mobile-only {
	display: inherit;
}

dl#homepage-nav a dd {
	display: none;
}

/* START Layout ________________________________*/

section.homepage-main-content {
	width: 100%;
	float: none;
	clear: both;
}

/* END Layout ________________________________*/

/* BEGIN Footer ______________________________ */

#links-footer nav {
	clear: both;
	width: auto;
	float: none;
	display: block;
	overflow: hidden;
	margin: 22px 8px;
}

.links {
	margin: 0 2%;
}

.links h2 {
	margin-top: 12px;
}

p.mnpass {
	margin: 0 auto;
	width: 80%;
	float: none;
	clear: both;
	overflow: hidden;
}

/* END Footer ______________________________  */

}

@media all and (max-width:540px) {
	
ul, li {
	clear: both;
}

img {
	margin: .5em 0;
}

figure {
	float: none;
	display: block;
	padding: 0;
	max-width: 94% !important;
	height: auto;
	margin: 10px 3%;
	clear: both;
	overflow: hidden;
}


article aside {
	float: right;
	width: 96%;
	margin: .3em 2% 1.3em;
	padding: 0;
	background-color: #EEE;
	clear: right;
	overflow: hidden;
}

#content aside article, #content aside nav {
	width: auto;
	margin: 0 0 8px;
}

nav#main-nav li {
	clear: none;
}

#local-offices {
	width: auto;
	display: block;
	margin: 0 10% 3px;
}

p.twitter, p.email, p.facebook, p.youtube {
	width: auto;
	display: block;
}

#main-footer nav li {
	clear: none;
}

/* Homepage styling */

.links {
	width: 46%;
	float: left;
}

#homepage #traffic-info {
	width: 100%;
}


#homepage #traffic-info a:link, #homepage #traffic-info a:visited {
	padding: 7px 0;
}

nav#mode-icons {
	width: 100%;
}

}

@media all and (max-width:420px) {

#traffic-info {
	margin: 0;
	padding: 0;
	width: 100%;
}

#traffic-info a:link, #traffic-info a:visited {
	width: 100%;
	height: 100%;
	padding: 7px 0 7px;
	margin: 0;
	color: #003F5F;
	display: block;
	background-image: url(http://www.dot.state.mn.us/images/12templates/gradient_bkgd.png);
	background-repeat: repeat-x;
	background-position: bottom;
	text-decoration: none;
	text-align: center;
}

#traffic-info a:active, #traffic-info a:hover {
	background-position: top;
	color: #F55D23;
}
	
}

@media all and (max-width:320px) {

article, aside div {
	width: 100%;
	padding: 0;
	margin: 0 0 12px;
}

article aside {
	float: right;
	width: 94%;
	margin: .3em 3% 1.3em;
	padding: 0;
	background-color: #EEE;
	clear: right;
	overflow: hidden;
}

#main-footer nav li, #main-footer nav li:first-child {
	clear: both;
	border-right: none;
	padding-left: .6em;
}
	
}
