/*******************************/
/*   MAIN TEMPLATE STYLESHEET  */
/*******************************/

html, body {
	margin:0;
	padding:0;
}

html {
	font-size:17px;
}

body {
	font-size:1rem;
	font-family: Arial, Helvetica, sans-serif;
	color: #222;
	background-color:#fff;
	line-height:1.2em;
	position:relative;
}

#main-wrapper {
   margin-left: auto;
   margin-right: auto;
   max-width: 800px;
   background-color:#FFF;
}


/****************************/
/*     HEADER + NAV MENU    */
/****************************/

header {
   display:block;
   max-width:800px;
   height:0;
   padding-bottom:38.38%;
   background-image:url('/CIT3_Sharp.jpg');
   background-repeat:no-repeat;
   background-attachment:top;
   background-size:cover;
}

header nav {
	text-align:center;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size: 18px;
	position:relative;
	top:192px;
	width:100%;
	text-align:center;
}


header nav ul  {
	margin:0;
	padding:0;
}

header nav ul li {
	list-style: none;
	display:inline-block;
	margin:0 6px;
}

header nav ul li a {
	padding:5px 12px 5px 12px;
	margin:0;
	text-decoration:none;
	transition:color 0.4s;
	border:none;
	font-weight: normal;
}


header nav a:link, 
header nav a:visited {
	color:white;
}

header nav a:active,
header nav a:hover {
	color: #aaa;
}

header nav ul li a.highlighted,
header nav ul li a.highlighted:active,
header nav ul li a.highlighted:hover {
	color:red;
}

header nav .menu-button-div {
	display:none;
}

header nav .menu-button {
	cursor:pointer;
	float:right;
	margin:0 10px 0 0;
	padding:0px 5px;
	font-size:1.8rem;
	color:white;
	z-index:10;
}


/****************************/
/*    article#content AREA  */
/****************************/

#content {
   /* width:750px; (already implicit) */
   padding:0 25px 25px 25px;
   background-color:#FFF;
   margin-top:20px;
   min-height:520px;
}


.sectionhead {
	font-weight:bold;
	margin-bottom:30px;
}
.sectionhead a {
	color:#000;
	text-decoration:underline;
	/* border-bottom:2px solid #000; */
}

h1 {
	font-family:'Roboto Condensed', Arial, Helvetica, sans-serif;
	font-size:1.5rem;
	color:#000;
	display:block;
	margin-top:0px;
	margin-bottom:5px;
	line-height:110%;
}

h1 a:link , h1 a:visited, h1 a:hover, h1 a:active {
	color:#000;
}

h2 {
	font-family:'Roboto Condensed', Arial, Helvetica, sans-serif;
	font-size:1.3rem; /* 115 with arial */
	color:#000;
	display:block;
	margin-top:0px;
	margin-bottom:20px;
	font-weight:bold;
	line-height:110%;
}

h3 {
	font-family:'Roboto Condensed', Arial, Helvetica, sans-serif;
	font-size:1.3rem; /* 115 with Arial */
	color:#000;
	display:block;
	margin-top:20px;
	margin-bottom:5px;
	padding-bottom:3px;
	width:100%; 
	border-bottom:1px #888 solid;
	font-weight:bold;
	line-height:110%;
}

h4 {
	font-size:80%;
	display:inline;
}

h6 {
	font-size:0.85rem;
	color:#aaa;
	font-weight:normal;
	margin:0;
}


/**************************/
/*     HELPER CLASSES     */
/**************************/

.fixpmargins p:first-of-type {
	margin-top:0;
}

.fixpmargins p:last-of-type {
	margin-bottom:0;
}


/******************************
/*       SPECIAL PAGES       */
/******************************/

/*-------- NEWS ITEM -----------*/

.news-item article {
	margin:0;
	width:74%;
	float:right;
	overflow:hidden;
	font-size:16px
}

.news-item img {
	max-width:100%;
}


.news-item .news-item-sidebar {
	float:left;
	width:19%;
	margin-top:0px;
	background-color:#ddd;
	border-radius:20px;
	padding:8px 15px;
}


.news-item .news-item-sidebar h2 {
	font-family:"Roboto Condensed";
	font-size:1.1rem;
	text-align:center;
	margin:0 0 8px;
	padding:3px;
}

/* Button */
.news-item .news-item-sidebar a.button {
	display:block;
	padding-top:8px;
	padding-bottom:8px;
	margin-top:20px;
	text-align:center;
}

.news-item .news-item-sidebar a.button:link,
.news-item .news-item-sidebar a.button:visited {
	color:red;
}


.news-item .news-item-small {
	font-size:0.7rem;
	line-height:1.3em;
	margin-top:0;
	margin-bottom:0px;
}

/* ------- NEWS SECTION FRONT -------- */

.news-list-item {
	padding-bottom:30px;
	border-bottom:1px solid #aaa;
	margin-bottom:10px;
	font-size:16px;
}

.news-list-item:nth-of-type(n+2) {
	padding-top:30px;
}

.news-list-item h1 {
	font-size:1.5rem;
}


/********************************
/*        MEDIA QUERIES        */
/*******************************/

@media screen and (max-width:810px) {
	header {
		padding-bottom:23%;
		position:relative;
		margin-bottom:70px;
	}
	header nav {
		position:absolute;
		top:100%;
		background-color:#000;
		padding:5px 0;
	}
	header nav ul li {
		margin:0 2px;
	}
	header nav ul li a {
		padding:5px 10px;
	}
	.news-item .news-item-sidebar {
		display:none;
	}
	.news-item article {
		margin:0 auto;
		width:90%;
		float:none;
	}
}

/***************************/
/*   MENU BUTTON <=640px   */
/***************************/
@media screen and (max-width:640px) {
	header nav {
		padding:0;
		z-index:10;
	}
	header nav ul {
		display:none;
		margin:0;
		background-color:#000;
	}
	header nav ul li { 
		display:block;
	}
	header nav ul li a {
		display:block;
		padding:15px 0;
		border-top:1px solid #444;
		color:#aaa;
		font-family:"Roboto Condensed";
		font-size:17px;
	}
	header nav ul li a.highlighted,
	header nav ul li a.highlighted:active,
	header nav ul li a.highlighted:hover {
		color:#fff;
	}
	header nav ul li a.highlighted:hover {
		color:#aaa;
	}

	header nav ul.nav-expanded {
		display:block;
	}
	header nav .menu-button-div {
		display:block;
		padding:5px;
	}
}

/*************************/
/*     MOBILE <=540px    */
/*************************/
@media screen and (max-width:540px) {
	html {
		font-size:16px;
	}
	figure.fig-left,
	figure.fig-right {
		max-width:90%;
		margin:15px auto;
		padding-bottom:8px;
		float:none
	}
	.mobile-hide {
		display:none;
	}
}