@import url('//fonts.googleapis.com/css?family=Open+Sans:400,700&display=swap');
body { font-family: 'Open Sans', sans-serif; font-size: 14px;}

/*default link colors */
a:link:active { color: #025aa5;}
a:link:hover { color: #025aa5;}
a:link { color: #0275d8;} /* @brand-primary */
a:visited { color: #025aa5;}

#navBar, #navBar a, #navBar .nav-link, .skipnav:focus
{
	background: #1f6a69;
	color: #fffbf8;
}

/* generally #navBar and mobile #leftSidebar are styled the same
 but CSS syntax requires them to be declared separately */
@media (max-width: 767.98px) {
	#leftSidebar, #leftSidebar a
	{
		background: #1f6a69 !important;
		color: #fffbf8 !important;
	}
}

/* this is the desktop view */
#leftSidebar, .tocItem a, #codeHead a
{
	background: #fff;
	color: #000;
}

#cityBanner
{
	display: block;
	margin-left: 15px;
	margin-top:15px;
	font-size: 35px;
	font-variant: small-caps;
	color:#0275d8;
}

#cityBanner img
{
	max-height: 100px;
	max-width: 100%;
}

#topBanner
{
	background: #fffbf8;
	min-height: 130px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

#wrapper, #topBanner, #navBar
{
	width: 100%;
	/* uncomment the following two lines for a fixed-width code */
	/* max-width: 1000px;
	margin: 0 auto; */
}

#mainBody
{
	background: #fff;
}

.btn-primary, .sidebarHeader
{
	color: #fffbf8 !important;
	background-color: #a36821 !important;
	border-color: #a36821 !important;
}

.btn-primary:hover
{
	color: #fffbf8 !important;
	background-color: #1f6a69 !important;
	border-color: #1f6a69 !important;
}

#cityname, #codification, .cpc
{
	color: #a36821;
}

#cityLinks {
	min-width: 100%;
}

#cityLinks a {}

@media (min-width: 768px) {
	body.background-image
	{
		/* background: url('') #ebf3f3; */
		background-attachment: fixed;
		background-position: top center;
		background-repeat: no-repeat;
		background-size: contain;
	}
}

#versionMenu, #versionMenu a
{
	color: #343a40;
}
/* ========================================= */
/* layout you shouldn't need to change */
/* ========================================= */

#wrapper
{
	align-items: flex-start;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
}



/* =============================== */
/* navbar/header styles */

#navBar
{
	position: sticky;
	position: -webkit-sticky;
	left: 0;
	top: 0;
	user-select: none;
	z-index: 900;
}

#navBar > .collapse
{
	flex-direction: row;
	overflow: hidden;
}

#codetabs
{
	width: 250px;
}

#crumbs
{
	font-size: 12px;
	line-height: 1rem;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

#codetabs .nav-item
{
	cursor: default;
	font-size: .9rem;
	line-height: 1rem;
	white-space: nowrap;
}

#document-name
{
	flex: 0 0 260px;
}


#nav-addthis
{
	width: 90px;
}

#nav-addthis .addspan
{
	display: block;
	height: 33px;
	margin: .2rem;
}

#versionMenu select,
#versionMenu .btn-sm
{
	font-size: 12px;
}
#versionMenu
{
	display: flex;
	margin: 15px;
}

#versionMenu label {
	font-weight: bold;
}
#versionMenu select.form-control {
	width: auto;
	padding: 0;
}
/* =============================== */
/* Left Sidebar layout/styles */

#leftSidebar
{
	font-size: .9rem;
	line-height: 1.45;
	min-width: 100%;
}

#leftSidebar.collapsing
{
	-webkit-transition: none;
	transition: none;
	display: none;
}

@media (min-width: 768px)
{
	#leftSidebar,
	#leftSidebar.collapse
	{
		display: block !important;
		flex: 280px 0 0;
		height: calc(100vh - 56px);
		min-width: 0;
		overflow: auto;
		position: sticky;
		position: -webkit-sticky;
		top: 55px;
		z-index: 2;
	}
}

#searchHeader, #tocHeader
{
	font-weight: bold;
	margin-bottom: 0;
	padding: 10px;
	text-align: left;
}

#browseCodeInner, #SearchResultsInner, #SearchForm
{
	padding: 8px 16px;
	max-width: 100vw;
}

.sidebarHeader
{
	border-style: solid;
	border-width: 1px 0;
	font-size: 1em;
	cursor: pointer;
}


/* ============== Search Form ================= */

#AdvancedSearchButton
{
	font-size: .9em;
	font-weight: bold;
}

#AdvancedSearchButton::before, .sidebarHeader::before { content: '- '; }
#AdvancedSearchButton.collapsed::before, .sidebarHeader.collapsed::before { content: '+ ';}
#AdvancedSearchButton:hover { text-decoration: none !important; }
#AdvancedSearch * { font-size: .8rem; }

#AdvancedSearch legend
{
	font-weight: bold;
	margin: 0;
	padding-top: .7rem;
}

#AdvancedSearch select.form-control-sm
{
	height: auto;
	max-width: 100%;
	padding: 0;
}

#formControls
{
	font-size: .9rem;
	margin-left: 0 !important;
}

#savedSearchFieldset { display: none; }


/* ============== Search Results/Nav ================= */

.disabled-link { color: #5c5c5c; cursor: not-allowed;}
input[disabled] { cursor: not-allowed;}
.SearchSubTitle { text-align:center; font-weight: bold; margin-bottom: 0em; }
p.resultLink { padding: 2px; margin:0;}
a.file { display:block; padding: 2px; }
#leftSidebar p.resultLink:hover a { color: #fff }
#leftSidebar a.file:hover { text-decoration:none;}
p.resultLink:hover { background: none repeat scroll 0 0 #5c5c5c;  color: #fff; }
.hit  { background-color: #ff0; font-weight:bold; border:1px solid #ff0; }
.hitHere { border:1px solid #f00; }
#SearchResultsInner { text-align: center; }

.resultPreview b  {color: #f00; }
.resultPreview {
	font-size: 9pt;
	position: absolute;
	z-index: 901;
	color:black;
	background: #eceeef;
	width: 470px;
	overflow: hidden;
	border: 1px solid black;
	padding: 10px;
}

#searchtabs {
	background: #eceeef;
	border-bottom: 1px solid black;
	font-size: .8rem;
	font-weight: bold;
	height: 50px;
	padding: 5px 0;
	position: sticky;
	position: -webkit-sticky;
	text-align: left;
	top: 0;
	white-space: nowrap;
	width:100%;
}

@media (min-width: 768px)
{
	#searchtabs { height: 30px; }
}

#searchtabs  span#hitcount {color:#f00; }
#searchtabs span {
	display: block;
	float: left;
	padding: 0 10px;
	text-align:left;
	color:#000;
	user-select: none;
}

/* =============== TOC ================ */

#leftSidebar p.codeHead
{
	font-size: 1.1rem;
	font-weight: bold;
	line-height: 1.2rem;
	margin: .7rem 0;
}

.tocItem
{
	align-items: baseline;
	display: flex;
	flex-direction: row;
	margin-bottom: .3rem;
	border-bottom: 1px dotted #ccc;
}

.ajx { cursor: pointer; }

.tocItemSpan
{
	display: block;
	flex: 0 0 1rem;
	font-size: 1.15rem;
	font-weight: bold;
	padding-right: .2rem;
}

.tocItemLink
{
	display: block;
	flex: 1 1 50%;
	padding-left: .2rem;
}

@media (max-width: 767.98px) {
	.tocItemSpan
	{
		font-size: 1.35rem;
	}

	.tocItem
	{
		padding: .3rem 0;
	}

	.tocItemInput
	{
		order: 9;
		flex: 0 0 1rem;
		font-size: 1.35rem;
	}
}

#archiveTOC div  { margin-left: 1rem; }

#leftSidebar a, #navBar a  { text-decoration: none; }
#leftSidebar a:hover, #codetabs a:hover, #crumbs a:hover, span.click:hover,
#mainBody p a:link
{
	text-decoration: underline;
}

#searchToggle,
#tocToggle,
.click
{
	cursor: pointer;
}


/* =============== main body ================ */

#mainContent {
	border: solid #000;
	border-width: 1px 0px;
	margin: 1em 15px;
}

#mainBodyInner { min-height: 300px; }
#mainBody { max-width: 100vw; }
#pgFooter { margin-top: 3rem; padding: 0 2rem; }
#pgFooter p { font-size: 0.9em; }
#current { font-weight: bold; }

.Cite {
	margin: 1em -15px;
	vertical-align: baseline;
	background-color: #f7f7f7;
	border-left-color: #8c8c8c;
	border-left-style: solid;
	border-left-width: 0;
	padding: 15px;
	font-size: 1.25em;
	line-height: 1.2;
}
.Cite:after {
	content: '';
	display: table;
	clear: both;
}

@media (min-width: 576px)
{
	.Cite {
		margin: 1em 0;
		border-left-width: 3px;
		padding: 15px;
	}

	#mainContent {
		margin: 1em 2em;
		padding: 1.1em;
	}

}

@media (min-width: 768px)
{
	#mainBody
	{
		flex: 1 1 300px;
		min-width: 0;
	}

	#SearchResultsInner *,
	#AdvancedSearch *,
	#formControls *,
	.tocItem
	{
		font-size: 12px;
	}
}

/* ClueTip CSS */
#cluetip b { color: #f00; }
#cluetip h3 { font-weight:bold }
#cluetip { padding:10px; background:#eceeef; border:1px solid black;}
#cluetip, #cluetip p, #cluetip h3{ color: #000 !important; text-align:left;  }
.cluetip-title {float:right; line-height:1em; margin:5px;}

/* misc */
.revised { color:#00f !important; font-weight:normal; background: #ff0 !important; padding: 0 2px; }
.updated { color:#f00 !important; font-weight:normal; background: #ff0 !important; padding: 0 2px; }
.btn-light { border: 1px solid #ccc; }


/* for the non-js view */
.no-js .tocItemSpan,
.no-js .tocItemInput,
.no-js .navbar-toggler,
.no-js .clearSaveAsForm,
.no-js .prevnextlinks,
.no-js .SearchSubTitle,
.no-js .inline-form,
.no-js .toc-instruct,
.no-js #AdvancedSearchButton,
.no-js #printSubmit,
.no-js #searchHeader,
.no-js #codetabs
{
	display: none !important;
}

.no-js p.resultLink:hover
{
	background: transparent;
}

.no-js #leftSidebar
{
	display: block !important;
	height: auto !important;
	flex: 100% 0 0 !important;
	position: static !important;

}

caption { caption-side: inherit !important; }

caption { caption-side: inherit !important; }

table.hovercraft {
	margin-top: 0px !important;
	margin-bottom: 0px !important;
}
