/* 
	NARROW CSS 
	phones etc
*/

#sidebar
{
	display: none;
}

#mainContent
{
	min-height: 800px;
	margin: 0.5em;
	padding: 11vh 24px 48px 36px;
	font-size: 48px;
	line-height: 64px;
}

#mainContent H1 {
	font-size: 64px;
	margin-left: 0;
}

#mainContent H2 {
	font-size: 60px;
	margin-left: 0;
	line-height: 1.2em;
}

#mainContent  LI,
#mainConent DD
{
	margin-bottom: 1em;
}

#siteHeader
{
	z-index:2;
	margin: auto;
	/* padding: 0em 0 0em 5%; */
	padding: 0;
	/* background: rgba(255,255,255,0.0); /* #E8E4D9; */
	background: rgba(232,228,217,0.85); /* #E8E4D9; */
	/* min-height: 150px; */
	height: 12vh;
	min-height: 5%;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	box-shadow: none;
	/* box-shadow: 0px 6px 6px 0px #787878; */
}

#siteHeader a {
	margin: 0;
	/* background: rgba(255,255,255,0.5); /* #E8E4D9; */
}

#siteHeader a #pciLogo {
	float: left;
	padding: 2vh 3vh;
	height: 8vh;
	width: 10vh;
	/* width: 20%; */
	border-radius: 0 0 12px 0;
	/* background: rgba(255,255,255,0.5); /* #E8E4D9; */
}

#siteHeader .headerContact
{
	display: none;
}

#siteFooter
{
	clear: both;
	margin: auto auto 40px auto;
	padding: 1em 0 2em 5%;
	background: #E8E4D9;
	min-height: 110px;
}

#siteFooter .footerSection
{
	/* display: inline-block;, */
	/* width: 30%; */
	vertical-align: top;
}

#siteFooter #footerAbout,
#siteFooter #footerSignup
{
	display: none;
}

#siteFooter #footerContact
{
	margin: auto 10%;
	font-size: 32px;
	line-height: 48px;
	text-align: center;
}


#siteFooter .footerSection H3 {
	color: #333;
}


#siteFooter .footerSection .pciSocial a
{
	display: inline-block;
	text-align: center;
	font-size: 56px;
	min-width: 56px;
	padding: 24px;
	margin: auto 6px auto auto;
	/* background: rgba(255,255,255,0.25); */
	border: 1px solid #ccc;
	border-radius: 6px;
}

#siteFooter #footerContact #footerLogo
{
	width: 50%;
	margin: 24px 25%;
}

#siteFooter .footerSection UL
{
	list-style: none;
	margin-left: -2.5em;
}

#siteFooter .copyright
{
	margin: 4em auto 10px auto;
	text-align: center;
	font-size: 24px;
	color: #666;
}


/* 
	-----------------------
	SITE MENU
	-----------------------
*/

#pciMainMenuMobile
{
	display: block;
	/* this is the icon */
	float: right;
	/* font-size: 64px; */
	padding: 0 18px;
	margin: 36px 64px;
}

#pciMainMenuMobile {
	/* height: 110px; */
	padding: 3vh 3.5vh;
	border-radius: 0 0 0 12px;
}

#pciMainMenuMobile IMG {
	height: 5vh;
}

#pciMobileMenu
{
	z-index:10;
	width: 100%;
	top: 10vh; /* 130px; */
	position: absolute;
	list-style: none;
	padding: 36px 0 96px 24px;
    font-family: "Trebuchet MS",Helvetica,sans-serif;
	background: #279989; /*rgba(39,153,137,0.95);*/
}

#pciMobileMenu LI
{
	font-size: 50px;
	line-height: 52px;
	/*background: rgba(255,255,255,0.5);*/
	margin: auto 1em auto 0em;
	padding: 36px 24px;
	border-bottom: 4px solid rgba(255,255,255,0.5);
}

#pciMobileMenu LI UL
{
	margin: 0.5em auto;
	list-style: none;
}

#pciMobileMenu LI UL LI
{
	padding: 24px;
	border: none;
}

#pciMobileMenu A 
{
	color: white;
	text-decoration: none;
}

#pciMobileMenu A:hover
{
	background: rgba(255,255,255,0.5);
}

#pciMainMenu
{
	display: none;
    font-size: 12px;
    list-style: none;
    font-family: "Trebuchet MS",Helvetica,sans-serif;
    font-weight: normal;
	margin-top: 18px;
    margin-bottom: 10px;
    margin-right: 5%;
    float: left; /* Clear floats */
    /* width: 75%; */
    /* Bring the nav above everything else--uncomment if needed.
    position:relative;
    z-index:5;
    */
}

#pciMainMenu LI
{
    float: left;
    margin-right: 24px;
    position: relative;
}

#pciMainMenu A
{
    display: block;
    padding: 6px;
    color: #666;
    font-weight: normal;
    /* background: #DDD; */
    text-decoration: none;
}

#pciMainMenu A:hover
{
    color: #fff;
    background: #A08873; /*#6b0c36; */
    text-decoration: none;
}

/*--- DROPDOWN ---*/
#pciMainMenu UL
{
    background: #C2B095; /* Adding a background makes the dropdown work properly in IE7+. Make this as close to your page's background as possible (i.e. white page == white background). */
    background: rgba(232,228,217,0.0); /* But! Let's make the background fully transparent where we can, we don't actually want to see it if we can help it... */
    list-style: none;
    position: absolute;
    margin-left: -2.5em;
    left: -9999px; /* Hide off-screen when not needed (this is more accessible than display:none;) */
}

#pciMainMenu UL LI 
{
    background: #C2B095;
	/* margin: 8px auto; */
    padding: 8px; /* Introducing a padding between the li and the a give the illusion spaced items */
    float: none;
}

#pciMainMenu UL A
{
    white-space: nowrap; /* Stop text wrapping and creating multi-line dropdown items */
}

#pciMainMenu LI:hover UL 
{ 
	/* Display the dropdown on hover */
    left: 0; /* Bring back on-screen when needed */
}

#pciMainMenu LI:hover A
{
	/* These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list. */
    /* background: #C2B095; */
    text-decoration: none;
}

#pciMainMenu LI:hover UL A 
{ 
	/* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */
    text-decoration: none;
}

#pciMainMenu LI:hover UL LI A:hover
{
	/* Here we define the most explicit hover states--what happens when you hover each individual link. */
    background: rgba(0,0,0,0.25);
}



.accentBox
{
	font-size: 3vh;
	margin: 1em -1em;
	border: 1px solid #666;
	border-radius: 24px;
	background: rgba(232,228,217,0.85); /* #E8E4D9; */
	/* background: rgba(255,255,255,0.75); */
	box-shadow: 3px 3px 3px 0px #ccc;
	padding: 1em;
}

.applyToday .title
{
	font-size: 7vh;
	font-weight: bold;
	margin: auto auto 0.66em auto;
}

.articleImage
{
	float: right;
	width: 33%;
	margin: 1em 0 0 1em;
}

.articleImage IMG
{
	border: 1px solid rgba(0,0,0,0.25);
	box-shadow: 3px 3px 3px 0px #ccc;
}

.articleAuthor
{
	font-style: italic;
	font-size: 0.9em;
	line-height: 1.2em;
	margin-bottom: 2em;
}

BLOCKQUOTE
{
	margin-right: 3em;
	color: #555;
}

.articleFooter
{
	border-top: 1px #ccc solid;
	padding-top: 2em;
	font-size: 0.9em;
	margin-top: 2em;
	color: #555;
	line-height: 1.2em;
}