/*
URL: newcastlepower.com
Version: 1.0
Author: Internet Imagineering, LLC
Author URL: https://www.internetimagineering.com/
*/

/*
font-family: 'Open Sans', sans-serif;
font-family: 'PT Sans Narrow', sans-serif;
font-family: 'PT Serif', serif;
*/

:root {
	/* CUSTOM SITE COLORS */
	--nc-blue: #336f87;
	--nc-green: #0bb38c;
    
    /* STANDARD COLORS */
    --white: #ffffff;
    --beige: #FF9900;
    --red: #459939;
    --dkred: #990000;
    --black: #000000;
    --ltblack: #333333;
    --ltgray: #DDDDDD;
    --midgray: #CCCCCC;
    --gray: #999999;
    --dkgray: #666666;

}

body {
	background-color: #fff;
	margin: 0px 0px; 
	padding: 0px;
	font-family: 'Open Sans', trebuchet ms, arial, verdana, sans-serif;
	color: var(--ltblack);
	font-size: 16px;
}

* { box-sizing: border-box; }
.clear { clear: both;}

.separator {border: 0; border-top: 2px dotted var(--midgray); margin: 30px 0;}

/* TEXT */
.textBlue {color: var(--nc-blue);}
.textGreen {color: var(--nc-green);}

/* LINKS */
a.linkGreen {color: var(--nc-green); text-decoration: none;}
a:visited.linkGreen {color: var(--nc-green); text-decoration: none;}
a:hover.linkGreen {color: var(--black); text-decoration: none;}

a.linkWhite {color: var(--white); text-decoration: none;}
a:visited.linkWhite {color: var(--white); text-decoration: none;}
a:hover.linkWhite {color: var(--white); text-decoration: none;}


/* BUTTONS */
button.buttonReport {font-size: .6rem; text-transform: uppercase; letter-spacing: 1px; color: var(--nc-blue); border: 2px solid var(--nc-blue); padding: 5px 10px; background-color: var(--white);}
button.buttonReport:hover {background-color: var(--nc-blue); color: var(--white); cursor: pointer;}


/* HEADINGS */
h1.main1 {margin: 0; padding: 0;}
h1.main2 {font-size: 14px; font-weight: bold; text-transform: uppercase;}

/* HEADER */
.headerSticky {position: fixed; height: 100px; min-height: 100px; width: 100%; background-color: var(--white);}
.headerWrapper {width: 100%; border-bottom: 5px solid var(--nc-green); padding: 20px 0; margin: 0 0 2px 0; background-color: var(--white);}
.headerContainer {width: 90%; max-width: 1440px; margin: 0 auto; display: grid; grid-template-columns: auto auto; align-items: center;}
.headerLogo-Big {font-family: 'PT Sans Narrow', 'Open Sans', trebuchet ms, arial, sans-serif; font-size: 1.6rem; line-height: 1.6rem;}
.headerLogo-Small {font-weight: 300; font-size: 1.2rem;}
.headerLocation {text-align: right; font-size: .8rem; text-transform: uppercase;}

.titlebarWrapper {width: 100%; background-color: var(--nc-blue); padding: 10px 0;}
.titlebarContainer {width: 90%; max-width: 1440px; margin: 0 auto; color: var(--white);}

.sectionpicWrapper {width: 100%; background: var(--white) url('/images/sectionpic-1.jpg') no-repeat center; min-height: 390px; height: 390px; border-top: 145px solid var(--white);}

.homelink {width: 90%; margin: 50px auto 0 auto; max-width: 1440px; font-size: .8rem;}

/* LAYOUT */
.pageLayout {width: 90%; max-width: 1440px; margin: 50px auto 100px auto; display: grid; grid-template-columns: 300px auto; grid-column-gap: 80px;}
.leftnavContainer {border-right: 1px solid var(--ltgray); padding: 0 80px 0 0;}

.leftnav {margin: 20px 0 40px 0; padding: 0;}
.leftnav ul {margin: 0; padding: 0;}
.leftnav ul li {list-style-type: none; margin: 8px 0; padding: 0; color: var(--nc-blue);}
.leftnav ul li a {color: var(--nc-blue); text-decoration: none;}
.leftnav ul li a:visited {color: var(--nc-blue); text-decoration: none;}
.leftnav ul li a:hover {color: var(--black); text-decoration: none;}

.content {line-height: 1.6rem;}

.reportHolder {display: grid; grid-template-columns: 3fr 1fr 1fr; grid-column-gap: 20px; align-items: center; margin: 14px 0; font-size: .8rem;}
.reportButton {text-align: right;}

/* FOOTER */
.footerWrapper {width: 100%; text-align: center; padding: 30px 0; text-transform: uppercase; font-size: .8rem; color: var(--white); background-color: var(--ltblack);}

/* SLIDE OUT NAV */
#sidenav {
 position: fixed; 
 /* switch "right" to "left" to switch sides: */
 left: calc(-100vw - 10px); transition: left 0.5s;
 top:0; bottom: 0;
 width: 100vw; max-width: 500px; /* full screen on small screens */
 z-index: 9999; box-shadow: 0 0 10px #0008;
 background: var(--nc-blue); color: var(--sidenav-fg,white);
 font-size:1.2rem;
 height: 100vh;
 overflow: auto;
}
#sidenav.active { left: 0; } /* switch "right" to "left" */
#sidenav-header { display:grid; grid-template-columns: auto; align-items:center; column-gap: 10px; margin: 10px; }
#sidenav-header img { display: block; width:100%; }
#sidenav ul { 
 /*height: 100vh;*/
 padding: 0; 
 /* add some bottom padding to allow scrolling lower */ 
 padding-bottom: 50px;  
 margin: 0; 
 overflow: auto; 
 border-top: 1px solid #444; 
}
#sidenav li { list-style-type: none; border-bottom: 1px solid #444; margin: 0; padding: 5px 2rem; font-size: .8rem;}
#sidenav a, #sidenav a:visited, #sidenav a.active { color: var(--sidenav-fg,white); text-decoration: none; }
#sidenav-close { 
 /* reposition within the sidenav as needed */
 position: absolute; 
 right: 1rem; top:0.25rem; 
 cursor: pointer; 
 font-size:1.5em;
 transition: all 0.2s; 
}
#sidenav-close:hover, #sidenav-close:active { color: white; text-shadow: 2px 2px 8px #0008; transform: translate(-2px, -2px); }
#sidenav-footer { position:absolute; bottom:0; left:0; right:0; height: 100px; display: flex; justify-content: center; align-items: center; background: var(--sidenav-bg,#777);}


@media screen and (min-width: 0px) and (max-width: 1440px) {

	@media screen and (min-width: 1200px) and (max-width: 1440px) {
	


	}
	
	@media screen and (min-width: 1024px) and (max-width: 1199px) {
	


	}
	
	@media screen and (min-width: 768px) and (max-width: 1023px) {
		
		
		
		@media screen and (min-width: 768px) and (max-width: 1023px) {
			.pageLayout {width: 90%; max-width: 1440px; margin: 50px auto 100px auto; display: grid; grid-template-columns: 240px auto; grid-column-gap: 80px;}
			
			
		}
		
		@media screen and (min-width: 768px) and (max-width: 1023px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {
			.pageLayout {width: 90%; max-width: 1440px; margin: 50px auto 100px auto; display: grid; grid-template-columns: 240px auto; grid-column-gap: 80px;}

		
		}

	}
	
	@media screen and (min-width: 481px) and (max-width: 767px) {
		.leftnavContainer {display: none;}
		.pageLayout {width: 90%; max-width: 1440px; margin: 50px auto 100px auto; display: grid; grid-template-columns: auto; grid-column-gap: 0px;}
		
		
	}
	
	@media screen and (min-width: 0px) and (max-width: 480px) {
		.leftnavContainer {display: none;}
		.pageLayout {width: 90%; max-width: 1440px; margin: 50px auto 100px auto; display: grid; grid-template-columns: auto; grid-column-gap: 0px;}
		
		
	}
	
}

@media screen and (min-width: 1441px) {

	
}