/* CSS Document */
@import 'https://fonts.googleapis.com/css?family=Open+Sans:400,700';

/* General Declartions */
a {color: rgb(76, 144, 218); text-decoration:none;}
a:hover { text-decoration:underline; }
/*a {color:#0088CC;}*/
/*a {color:#0099CC;}*/
ul {margin: 0;padding: 0; margin-left:30px; margin-top:5px;}
img {border: none;}
html, body {
	height:100%;
	width:100%;
	margin:0;
	padding:0;
	background-color: #eeeeee;
	font-size: 17px;
}

h3, h4, h5 {
	color: rgb(72, 68, 68);
}

h1 {
	font-size: 1.75rem;
	font-family: 'Open Sans', sans-serif;
	margin: 0px;
	padding: 30px 0px 20px 0px;
	line-height: 1.1em;
	font-weight: 400;
	letter-spacing: 0.02em;
}

h2 {
	font-size: 1.25rem;
	font-family: 'Open Sans', sans-serif;
	margin: 0px;
	padding: 20px 0px 10px 0px;
	line-height: 1.1em;
	font-weight: 400;
	letter-spacing: 0.02em;
}

h3 {
	font-size: 1.1rem;
	margin: 0px;
	padding: 20px 0px 0px 0px;
	line-height: 1.2em;
	font-weight: 400;
	letter-spacing: 0.02em;
}

p {
	color: rgb(82, 82, 82);
	font-size: 1rem;
	margin: 1.5em 0px;
}

ul {
	color: rgb(82, 82, 82);
}

/* ID's and Class's */
#pageContainer {
	min-height: calc(100vh - 316px);
	position: relative;
	background-color: #eee;
}

/* replaced sgIndex with content, JR 1/13/2010 */	
#sgIndex
	{
	min-width:810px; max-width:944px;
	height:auto;
	margin-bottom:150px; margin-left:auto; margin-right:auto;
	font-family:Arial, Helvetica, sans-serif;
	font-size:0.9em;
	padding:0; padding-left:10px; padding-right:10px;
	}
#content {
	min-width:810px; max-width:944px;
	height:auto;
	margin-left:auto; margin-right:auto;
	font-family: 'Open Sans', Arial, Helvetica, sans-serif;
	font-size: 17px;
	line-height: 1.5em;
	padding: 20px;
	background-color: white;
}

.cent70{font:70% Arial, Helvetica, sans-serif;}
.cent80{font:80% Arial, Helvetica, sans-serif;}
.cent90{font:90% Arial, Helvetica, sans-serif;}
.cent120{font:120% Arial, Helvetica, sans-serif;}

.bgYellow{background-color:#ffe390;color:#003c50;}

.purple {
	color: rgb(118, 32, 126);
}

.orange {
	color: rgb(245, 128, 38);
}

.gray {
	color: rgb(72, 68, 68);
}

.light-gray {
	color: rgb(135, 133, 133);
}
.blue{color:#00a9cc;font-family: 'Open Sans', serif;}
.red{color:#bc0b36;font-family: 'Open Sans', serif;}
.redHeading{color:#bc0b36;font-weight:bold;font-size:1.4em;}
.red2ndHeading{color:#bc0b36;font-size:1.3em;font-family: 'Open Sans', serif;}
.red3rdHeading{color:#bc0b36;font-size:1.2em;}

.subHeading{
	font-weight: bold;
}
.dblUnderline{border-bottom: 4px double #333;}


.halfIndentText{padding-left:10px; height:auto;}
.indentText{padding-left:20px; height:auto;}

.dblIndentText{
	padding: 0px 20px;
	height: auto;
	overflow: hidden;
	transition: max-height 0.5s ease-in;
}

.floatRight{float:right; padding-left: 12px;}
.floatLeft{float:left;}
.center{margin-left:auto;margin-right:auto;text-align:center;}
.bold{font-weight:bold;}

.borderBottom {
	border-bottom-color:#333333;
	border-bottom-style:solid;
	border-bottom-width:thin;
}
.padded { padding:10px; margin:6px; }

.required{color:#CC3300;}

.msgHide
	{
    visibility:hidden;
    display:none;
	}

.msgShow
	{
    visibility:visible;
    display:block;
	}

#hidden
	{
	position:absolute;
	top:-200px;
	left:-200px;
	}
	
.clear {
	clear: both;
}

.clear:after {
    clear: both;
    content: "";
    display: table;
}
	
/* Footer */
#footContainer {
	position:relative;
	margin-right:auto;
	margin-bottom:0;
	margin-left:auto;
	width:100%;
	clear:both;
	z-index:1000;
	background: #eeeeee;
	padding: 20px 0px;
	}
#footMain {
	max-width:964px;
	margin-bottom:0;		
	margin-left:auto;
	margin-right:auto;
	z-index:1001;
	}
#footer { 
	text-align:center;
	font-family: 'Open Sans', Arial, Helvetica, sans-serif;
	font-size: 16px;
	color:#333333;
	z-index:1002;
	}
.footerLink {
	text-align: left;
	padding: 20px 10px 20px 20px;
}
.footerLink a{
	color: #696969;
}
.footerLink a:link {
	text-decoration: none;
	color: #696969;
	font-family: 'Open Sans', Arial, Helvetica, sans-serif;
	font-weight: bold;
	padding: 8px 8px 9px 8px;
	display: block;
	transition: color .35s;
}
.footerLink a:visited {color: #696969;font-family: 'Open Sans', Arial, Helvetica, sans-serif;font-weight:bold;}
.footerLink a:hover{color: #a7a7a7;font-family: 'Open Sans', Helvetica, sans-serif;font-weight:bold;}

.footerBox {
	padding: 20px 0px 20px 28px;
	text-align: left;
	color: #8a8a8a;
}

.footerBoxTitle {
	padding: 8px 0px;
	font-weight: bold;
	text-align: left;
	color: #696969;
}
	
.strikeout {
	text-decoration:line-through;
	}

.dbd-logos .logo-option {
	float:left;
	margin-right:30px;
	}
	
.floatRightMessage {
	float:right;
	width:300px;
	padding:1em 0 1em 1em;
	border:1px solid #f0b310;
	margin: 0 0 0 1em; 	
	}
	.floatRightMessage a {
	text-decoration:none;
	color:#0099CC;
	}
#dvbwidth {
	width:780px;
}

.inward-p {
	padding: 15px 20px;
}

section {
	padding: 20px 0px;
}

aside {
	color: #737373;
	background: rgb(250, 250, 250);
	padding: 10px 10px;
	margin: 10px;
	font-size: 15px;
}

aside.warning {
	color: #b35900;
	background: rgb(254, 248, 221);
}

aside.danger {
	color: #bc0b36;
	background: rgb(253, 245, 247);
}

aside.info {
	color: #25609a;
	background: rgb(223, 235, 249);
}

aside p {
	color: #808080;
}

.center-wrapper {
	text-align: center;
}

.center-item {
	display: inline-block;
	text-align: left
}

.list-no-style {
	list-style: none;
	margin-left: 5px;
}

.dropdown-p {
	padding: 10px;
	cursor: pointer;
	border: rgb(232, 232, 232) solid 2px;
	position: relative;
	margin-top: 50px;
	margin-bottom: 50px;
	transition: border .35s;
}

.dropdown-p:hover {
	border: rgb(142, 142, 142) solid 2px;
}

.dropdown-a:hover {
	text-decoration: none;
}

.dropdown-label {
	font-family: 'Open Sans', sans-serif;
}

.dropdown-text {
	padding: 1.5em 20px;
	margin: 0px;
}

.label-wrapper {
	width: 100%;
	position: absolute;
	display: inline-block;
	top: -13px;
	left: 0px;
	text-align: center;
	cursor: default;
}

.label-wrapper label {
	font-size: 1.25rem;
	background-color: white;
	padding: 0px 10px;
	cursor: pointer;
	letter-spacing: 0.02em;
	color: rgb(76, 144, 218);
}

.label-wrapper label:hover {
	text-decoration: underline;
}

.img-plus {
	padding: 0px 5px 2px 5px;
}

.topic {
	line-height: 2.0em;
	color: rgb(72, 68, 68);
	text-decoration: none;
	display: inline-block;
	width: 100%;
	border-top: 1px #eee solid;
	transition: background .5s;
	padding: 5px 0px;
}

.topic:hover {
	color: black;
	text-decoration: none;
	background: rgb(250, 250, 250);
}

.clickable-logo {
	cursor: pointer;
	opacity: 0.75;
	transition: all .35s;
	
}

.dropdown-p:hover .clickable-logo {
	opacity: 1;
}

.dropdown-link-wrapper:hover {
	text-decoration: none;
}


.collectionItem {
	display: inline-block;
	padding: 15px 10px 15px 15px;
	width: 100%;
	border-top: 1px solid #eee;
	border-right: 1px solid #eee;
	border-left: 1px solid #eee;
}

.collectionItemText {
	display: inline-block;
	padding: 15px 10px 15px 15px;
	width: 100%;
	border-top: 1px solid #eee;
	border-right: 1px solid #eee;
	border-left: 1px solid #eee;
}

.collectionItemDesc {
	color: rgb(82, 82, 82);
	display: inline-block;
	padding: 0px 5px 10px 20px;
	width: 100%;
	border-left: 1px solid #eee;
	border-right: 1px solid #eee;
}

.collectionEndCap {
	display: inline-block;
	width: 100%;
	padding: 5px 12px 5px 15px;
	border-top: 1px solid #eee;
}

/* Social Media Icons */
.socialMediaBar {
    max-width: 964px;
    margin-bottom: 0;
    margin-left: auto;
    margin-right: auto;
    z-index: 1001;
    text-align: center;
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
}

.socialMediaBar-wrapper {
    position: relative;
    margin-right: auto;
    margin-bottom: 0;
    margin-left: auto;
    width: 100%;
    clear: both;
    z-index: 1000;
    padding: 3rem 0 0 0;
}

.socialMediaBar__icon {
    height: 2rem;
    width: 2rem;
    padding: 0 0.5rem;
    opacity: 1;
    transition: opacity 0.1s linear;
    cursor: pointer;
}

.socialMediaBar__icon:hover {
    opacity: 0.5;
}

.a-hover-none {
    text-decoration: none !important;
}

/** jab 2019-05 **/
.hide{
	display:none;
}
#map-9th-street-closures{
	max-width:900px;
	display:block;
	margin:1em auto;
}


/* Media Queries */
@media only screen and (max-width: 944px) {

    .socialMediaBar__icon-wrapper {
        display: block;
        width: 33%;
        margin-bottom: 2rem;
    }



}