/* styles specific to interior pages in phone size  */

@media only screen and (max-width: 767px) {
	
	body.active #content { margin-right: -80%; }
	body.active #masthead_small { margin-right: -70%; }	
		
	#content{
		width: 96%;
	}
	
	#mainContentLeftColumn, #mainContentRightColumn  {
		width: 98%;
	}
	
	#mainContentTop ul, #mainContentLeftColumn ul, #mainContentRightColumn ul {
		padding: 0 0.25em 1em 0.25em;
	}
	
	#sideNav{
		float:right;
		width: 98%;
	}
	
	/*show on phones*/
	#sideNav #sideNavBackToTop{
		position: relative;
		left: 0;
		width: 37.37%;
		height: auto;
		overflow:hidden;	
		background-color:rgba(255,204,0,0.5);
		padding: 0.75em 0.5em;
		margin: 1em 0 1em 0;	
		text-align:center;
	}
	#sideNav #sideNavBackToTop a{
		color: #555;
		font-weight: bold;
		font-size: 1em;
		display: block;
		width: 100%;
		text-decoration: none;
	}
		
	/* show on phones? 
	#content h2{
		position: relative;
		left: 0;
		width: auto;
		height: auto;
		overflow:hidden;
		font-style: italic;
		padding: 0 0 1em 0;	 	
		font-size: 1.2em;
	}
	*/
	
	/* show on phones */
	#content #sectionMenuAnchor{
		position: relative;
		left: 0;
		width: 37.37%;
		height: auto;
		overflow:hidden;	
		background-color:rgba(255,204,0,0.5);
		padding: 0.75em 0.5em;
		margin: 0 0 1em 0;	
		text-align:center;
        box-sizing: content-box !important;
	}
	
	#content #sectionMenuAnchor .hamburgericon{
		font-size: 1.0em;	
	}
	
	#content #sectionMenuAnchor a{
		color: #555;
		font-weight: bold;
		font-size: 1em;
		display: block;
		width: 100%;
	}
	
		
	#content h3{
		font-size: 1.4em;
	}	
	
	#content h4{
		font-size: 1.2em;
	}
	
	/* decrease padding */
	#content ol li ol, #content ol li ol li ol{
		padding: 0;	
	}
	
	/* decrease margin */
	#content ol li, #content ol li ol li, #content ol li ol li ol li{
		margin-left: 1em;	
	}
	
		
	/* slightly larger font size for tablets */
	#sideNav{
		font-size: 1em;
	}
	
	/* return to default */
	#sideNav ul li{
		direction: ltr;
	}
	
	/* extra padding around the + and - signs on phones */
	#sideNav ul li a{
		padding: 0 0 0 6em;	
	}
	
	/* extra padding around the + and - signs on phones */
	#sideNav li.more a.nav_more, #sideNav li.more.active a.nav_more{
		width: 6em;
	}
	
	
	/* get rid of bg color */
	#container #breadCrumb{
		background: white !important;	
	}
	
	/* display as block, bigger font, left alignment */	
	#container #breadCrumb > h2:first-of-type{
		width: 100%;	
		font-size: 1.1em;
		display: block;
		background: white;
		text-align: left;
		vertical-align: baseline;
		padding: 0.5em 0;
		font-style: italic;
	}
	
	/* don't display breadcrumb links at all */
	#container #breadCrumb p {
		display: none !important;
	}
	
	/* specialty classes */
	/* clear both and disable floating when viewed on phones */
	#content .phoneclear{
		clear: both !important;
		float: none !important;
		display: block; 
		margin: 1% auto !important;
	}
	
	/* clear both and disable floating when viewed on phones, display at 100% width of container */
	#content .phoneclear-max{
		clear: both !important;
		float: none !important;
		display: block; 
		margin: 1% auto !important;
		width: 100% !important;
	}
	
	/* completely hide images when viewed on phones, used for decorative images */
	#content img.phonehide{
		display: none !important;
	}
	.requestinfo{
		margin-right:6px;
	}

} /*  end of @media screen and (max-width: 768px) */