/*******************************************************************************
*  OXFORD PUBLISHING CONSULTANCY started July 2010
* ------------------------------------------------------------------------------
*******************************************************************************/

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}


body {
color: #000;
background:#274c82;
margin: 20px;
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 100.1%;
padding: 0;
text-align: center;
}

html p {
margin-top: 0px;
padding-top: 0px;
margin-bottom: 3px;
padding-bottom: 6px;
}

img {
border: 0;
display: block;
}


/*-----*/

main {
	text-align: left;
	max-width: 900px;
	/* min-width: 756px; */
	margin: 0 auto;
	padding: 0;
}


header {
background: #68a4ab;
text-align: left;
/*max-width: 900px;
min-width: 745px;*/
height: 198px;
margin: 0 auto;
padding: 0;
padding-left: 0px;
/* border-bottom: 1px solid #36727B; */
border-left: 1px solid gray;
border-right: 1px solid gray;	
}

header h1 {
position: absolute;
left: -9999px;
} /* HIDE TEXT */

/*div#banner img {
display: inline;
}*/

div#marque {
width: 180px;
font-size: .9em;
/*height: 140px;*/
/*border: 1px solid black;*/
/*display:inline;*/
float:right;
color: white;
margin: 80px 20px 0 0;
text-align: right;
/*border: 1px solid green;*/
}

div#marque img {
margin-left: 12px;
/* border: 1px solid green; */
/*display:inline;*/
}

#logo {
	width: 528px;
}

#logo img {
	width:100%;
}

header img {
float:left;
}

div#page {
background: #E4F4F1;
padding-top: 18px;
margin: 0;
border-left: 1px solid gray;
border-right: 1px solid gray;
border-bottom: 1px solid gray;
}


/*typography*/

h1, h2, h3, h4, h5 {
/*font-family: Georgia,'Times New Roman',Times,'Bookman Old Style','Hoefler Text',Serif;*/
margin-bottom: 2px;
padding-bottom: 0;
}

#content h1 {
margin: 0 2px 7px 0;
padding-bottom: 3px;
color: #191970;
background: transparent;
font-size: 1.4em;
line-height: 1.2em;
border-bottom: 8px solid #F1F3F9;
}

#content h2 strong {
font-weight: bold;
}

#content h2.information {
	font-weight: normal;
	color: #296E95;
	font-size: 1.4em;
	padding-top: 18px;
	line-height: 1.5em;
}

#content h3 strong {

font-weight: bold;
}

h2 {
font-size: 1.3em;
margin: 0 0 4px 0;
padding-bottom: 2px;
color: #2B4F61;
background: transparent;
/*border-bottom: 2px solid #ECEFEF;*/
}

h3 {
font-size: 1.1em;
margin: 3px 0 5px 0;
color:#0F3D39;
background: transparent;
font-weight: normal;
}

em {
font-style: italic;
}

/* standard links */
	
/* a  {
color:#57847C;
text-decoration: none;
background-color: transparent;
border-bottom: 1px dotted #9579C0;
}

a:visited   {
color: #663333;
text-decoration: none;
background-color: transparent;
}

a:hover   {
color: #4C5CC5;
text-decoration: none;
background-color: transparent
}

a:active   {
color: #9E292B;
text-decoration: none;
background-color: transparent;
} */

h2 a, h3 a {
color: #3E5D57;
border-bottom: 0px solid #9579C0;
padding-right: 20px;
background: transparent url("../images/ui/youarehere.gif") no-repeat right center;
border: 0px solid #9579C0;
}

#content {
/*float: right;*/
margin-top: 0px;
padding: 0 10px 30px 0;
margin-left: 28px;
margin-right: 18px;
/*border: 1px solid green;*/
font-size: 0.9em;
line-height: 1.4em;
/*margin-right: 220px;*/
}


#content p.postdetails {
font-size: 0.7em;
color: gray;
}

body.journals #content p.postdetails {
clear: right;
}


#page_end {
background: transparent;
clear: both;
font-size: 0.7em;
text-align: right;
/*border-top: 1px solid #F8FAF6;*/
/* width: 745px; */
margin: 0 auto;
padding: 4px 6px;
}

#page_end p {
padding: 0 4px;
margin: 2px;
}

footer {
clear: both;
text-align: left;
background:#F8FAF2 url(../images/ui/footerback.jpg) repeat-x top center;
/*max-width: 900px;
min-width: 745px;*/
margin: 0 auto;
padding-left: 4px;
font-size: 0.8em;
line-height: 3em;
clear: both;
border-left: 1px solid gray;
border-right: 1px solid gray;
}

  



/* something to hide */

.hidethis {
display: none;
}



/* form and input stuff */

form {
border: 0;
margin: 0;
}

fieldset {
border: 1px solid #ddd;
margin: 17px 0 ; 
padding: 2px 5px;
line-height: 2em;
width: auto;
clear:right;
}

.quickselector {
background: #fafbff;
border: 1px solid #ddd;
margin: 4px 0 8px 0; 
padding: 8px;
line-height: 0em;
width: auto;
clear:none;
}

legend {
background: transparent;
font-size: .7em;
margin-bottom: 1px;
padding: 0.5em;
font-weight: bold;
}

label {
font-weight: bold;
}

.input {
background: #fff;
border: 1px solid #ccc;
color: #555;
/*font-family: Arial, Helvetica, sans-serif;*/
font-size: 1.1em;
line-height: 1.4em;
vertical-align: middle;
padding: 2px 1px;
visibility: visible;
width: 76%;
}



input.button {
width: auto;
color: #000066; 
font-size: 1.0em;
line-height: 1.8em;
font-weight: bold;
margin-right: 6px;
padding: 3px;
border: 1px solid silver;
background:#DBDDED url(../images/ui/menu_head.jpg) repeat-x top center;
}

input.radio {
width: auto;
}

input.checkbox {
margin-right: 6px;
width: auto;
border: none;
background: transparent;
}


textarea {
background: #fff;
margin: 0px 8px 3px 0px;
padding: 0px;
border: 1px solid #ccc;
color: #555;
/*font-family: Arial, Helvetica, sans-serif;*/
font-size: 1.1em;
width: 95%;
text-align: left;
}


textarea:focus, input:focus {
background: #F0F0F9;
border: 1px solid #55517B;
}


select, .select {
background-color: #fff;
border: 1px solid #ccc;
color: #000;
vertical-align: top;
width: auto;
font-size: .9em;
}

a.stronglink {
background: #F3F9F8;
padding: 2px 6px;
border: none;
font-size: .9em;
}

/*bullets in the content*/

/* 	list items in content area will be in Verdana */

#content li {
line-height: 1.4em;
/* font-family: Verdana, Arial, Helvetica, sans-serif; */
background-color: transparent;
margin: 0 4px 4px 4px;
padding-right: 8px;
}

#content li ul {
list-style-type: square;
font-size: .9em;
line-height: 1.3em;
/* font-family: Verdana, Arial, Helvetica, sans-serif; */
background-color: transparent;
margin-left: 3px;
padding: 0;
}

#content ul {
font-size: .9em;
list-style-type: disc;
margin-top: 0px;
padding: 2px 6px;
}

#content ol {
font-size: .8em;
margin-top: 0px;
padding: 2px 6px;
}

#content li {
margin-left: 2em;
}

div.feature {
font-size: .7em;
border: 1px solid #D4DFED;
background: white;
padding: 6px;
margin: 2em 2px 0 0;
}

.entry {
border-bottom: 1px solid #EEF6F5;
padding: 4px 0;
margin-bottom: 4px;
}

.entryalt1 {
background:#f9fcff;
border: 1px solid #EEF6F5;
padding: 7px;
margin-bottom: 6px;
}

.entryalt2 {
background:transparent;
margin-bottom: 4px;
padding: 4px 7px 4px 0;
border-bottom: 1px solid #EEF6F5;
}

/* 	search hilite */

.marker { 
background-color: #d2fcf5;
font-weight: bold;
}


/* 	contents list */

ul#contentsbox {
border: 1px solid #d6ddff;
float: right;
width: 170px;
background: #eff2ff;
font-size: .7em;
line-height: 1em;
margin-left: 4px;
}


ul#contentsbox li {
list-style: none; 
margin: 2px;
padding: 4px 4px;
background: transparent;
}


ul#contentsbox li:hover {
background: #FCFCFE;
text-decoration: none;
cursor:auto;
}

ul#contentsbox li.heading {
font-weight:bold;
border-bottom: 1px solid #d3daff;
}

ul#contentsbox li.heading:hover {
font-weight:bold;
background: transparent;
}


ul#contentsbox li a:hover  /* Insert for IE's sake */ {
text-decoration: none;
}

ul#contentsbox li a {
display: block; 
text-decoration: none;
border: 0;
}

/* +++++++++++++++++++++++ */

nav {
  /* width: 100%; */
  padding:0;
  margin: 0 auto;
  line-height: 20px;
  clear: both;
display: block;
padding: 0 0 0 8px;
background: transparent;
font-size:.8em;
/* line-height:20px; */
/*width: 50%;*/
}

nav ul {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin: 0 auto;
  padding: 0;
  list-style:none;
  line-height: 23px; 
}

nav ul li {
  flex: 0 0 8rem; /*the same as flex-grow, flex-shrink, flex-basis */
  text-align: center;
  display:inline;
  margin: 0;
  padding:0;
}

/* we turn off the underline and set the padding and the color O */

nav ul li a {
width: 8em;
/* display: block; */
float: left;
/*line-height: 26px;*/
margin: 0px 12px 0 0;
text-align: center;
color: white;
/* background:#2B4F61; */
text-decoration:none;
/* border: 1px solid white; */
/* border-bottom: 0px solid #36727B; */
text-align: center;
color: white;
background:#2B4F61;
border-left: 1px solid white;
border-right: 1px solid white;
border-top: 1px solid white;
}

/* feedback for the user with a background when hovering hover */

/* nav ul li:hover {
  background-color: #1d61a5;
} */

nav ul li a:hover {
  background: #117166;
background-image: none;
color: white;
}


/* light up where we are */

body.home nav li#home a, body.about nav li#about a, body.contact nav li#contact a {
background: #E4F4F1;
color: #042353;
font-weight: bold;
border-bottom: 2px solid #E4F4F1;
line-height: 23px;
}


/* now for the smaller displays */

/* @media screen and (max-width: 900px) {
  nav ul {
    flex-direction: column;
  }

  li ul {
    position: static;
  }

  nav ul li {
    flex: 0 0 auto; 
    width: 100%;
  }

} */



input[type="checkbox"] {
  display: none;
}

.hamburger {
  display: none;
  font-size: 2rem;
  color: white;
  margin-right: 0.8em;
  position: fixed;
    top:40px;
	right: 20px;
}

/* So when the display is small we can use our media query to hide the menu but reveal the hamburger */

@media screen and (max-width: 900px) {

main {
	max-width: 100%;
	min-width: 100%;
	width:100%;
}



footer {
	text-align: center;
}


  nav ul {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  padding: 0;
  list-style:none;
  line-height: 23px; 
}

nav ul li {
  flex: 0 0 5rem; /*the same as flex-grow, flex-shrink, flex-basis */
  text-align: center;
  display:inline;
  margin: 0;
  padding:0;
}

/* we turn off the underline and set the padding and the color O */

nav ul li a {
width: 8em;
font-size: 85%;
margin: 0px 10px 0 0;
text-align: center;
color: white;
/* background:#2B4F61; */
text-decoration:none;
/* border: 1px solid white; */
/* border-bottom: 0px solid #36727B; */
text-align: center;
color: white;
background:#2B4F61;
border-left: 1px solid white;
border-right: 1px solid white;
border-top: 1px solid white;
}

  #logo {
	width: 100%;
	max-width: 528px;
	width: 350px;
  }

  header {
	height: auto;
  }


}


@media screen and (max-width: 600px) {

  /* #marque {
	display:none;
  } */

div#marque {
width: 180px;
font-size: .8em;
/*height: 140px;*/
/*border: 1px solid black;*/
/*display:inline;*/
float:right;
color: white;
margin: 20px 20px 0 0;
text-align: right;
/*border: 1px solid green;*/
}

  body {
background:white;
margin: 0;
}

}

@media screen and (max-width: 600px) {

  #marque {
	display:none;
  }
}
	/* to display the message as it was entered */
	
pre {
	background-color: white;
	color: #173558;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: .7em;
	line-height:1.3em;
	margin: 0;
	padding: 0.5em 0.5em 0.5em 0em;
	padding: 3px;
white-space: pre; /* CSS2 */
white-space: -moz-pre-wrap; /* Mozilla */
white-space: -hp-pre-wrap; /* HP printers */
white-space: -o-pre-wrap; /* Opera 7 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: pre-wrap; /* CSS 2.1 */
white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
word-wrap: break-word; /* IE */
border: 1px solid silver;
}

/* ready for accordion */


	
	.accordion_content {
/* 	padding-bottom: .9em; */
	margin: 0;
 	padding: 8px 29px; 
	font-weight: normal;
	line-height: 1.6em;
	 border-bottom: 1px dotted #68828F;
	border-left: 1px dotted #68828F;
	border-right: 1px dotted #68828F;
	background: #EBF4F3;
	}
	
	.accordion_content a, .accordion_content a:link {
	display: block;
/* 	padding: 8px; */
	padding: 4px 7px 6px 16px;
	margin: 0;
	text-align: left;
	color: black;
	background: transparent;
	background-image: url(images/ui/expand.gif);
	background-repeat: no-repeat;
	background-position: 3px center;
	text-decoration:none;
	/* height: 1.3em; */
	border: none;
	}

	.accordion_content a:hover {
	background: #00549F;
	color: white;
	} 
	
	/*
		Vertical Accordions
	*/
	#vertical_container h2 {
	color: #3A5681;
	line-height: 1.7em;
	background: transparent;
	    font-weight: normal;
	}
	
	
	#vertical_container .accordion_toggle {		
    cursor: pointer;
/*    font-weight: bold;*/
	padding: 4px 8px 5px 22px;
	margin: 0;
	text-align: left;
/*	color: #3A5681;*/
/*	background: #EDF3F8;*/
	background-image: url(../images/ui/expand.gif);
	background-repeat: no-repeat;
	background-position: 1px 15px;
	text-decoration:none;
	border: none;
	}
		
	#vertical_container .accordion_toggle_active {
	background: #2B4F61;
	color: white;
	font-size: 1.1em;
	background-image: url(../images/ui/contract.gif);
	background-repeat: no-repeat;
	background-position: 6px 13px;
	padding: 4px 8px 5px 30px;
	margin-top: 12px;
/* 	border-bottom: 1px solid #f68263; */
	}
	
	.accordion_content {
/*		background-color: #ffffff;*/
/*		color: #444444;*/
		overflow: hidden;
	}
			
	.vertical_accordion_toggle {
	cursor: pointer;
/*    font-weight: bold;*/
	padding: 0px 16px 0px 16px;
	margin: 0;
	text-align: left;
	color: black;
	background: transparent;
	background-image: url(images/ui/expand.gif);
	background-repeat: no-repeat;
	background-position: 3px center;
	text-decoration:none;
	border: none;	}

	.vertical_accordion_toggle_active {
/*	background: #0060BF;*/
	color: white;
	font-size: 1.1em;
	border-bottom: 1px solid #f68263;
	}

	.vertical_accordion_content {
/*		background-color: #ffffff;*/
/*		color: #444444;*/
		overflow: hidden;
	}


