@charset "utf-8";

/* using html5 tags rather that divs */
header, footer, section {
	display: block;
}
body{
	background:#EFEFFC;
}

/* Mobile Layout: 480px and below. */

header {
	color: #FFFFFF;
	text-decoration:none;
	height: 4.8em;
	margin: 0em 0em 0.5em 0em;
	background: -moz-linear-gradient(left, #009, #003); 
	background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0.00, #009),color-stop(1.00, #03C));
   	/* IE code - note GradientType=1 means horizontal */
	filter: progid:DXImageTransform.Microsoft.gradient(enabled='true', startColorstr='#009', endColorstr='#03C', GradientType=1);
	background: linear-gradient(left, #009, #003);
}
#headertext{
	float: left;
	width: 23em;
	margin:0;
	padding:0em 0em 0em 0.4em;
}
#headertext #emed {
	color: #FFF;
	text-decoration: none;
	font-size: 4em;
	font-weight: bold;
	margin:0;
	width:2.8em;
	float:left;
}
#headertext #handbook {
	font-size:1.8em;
	font-weight:bold;
	vertical-align:text-top;
	width:5em;
	float:left;
	margin:0;
	padding: 0.6em 0em 0em 0em;
	color:#F00;
	display:inline-block;
}
#headertext #cork{
	color:#FFF;
	font-size:0.7em;
	font-weight:bold;
	text-decoration:none;
}
header #searchform {
	margin-left:-999px;
	display:block;
}
footer {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	padding-top: 0.3em;
	padding-bottom: 0.5em;
	bottom: auto;
	background: -moz-linear-gradient(left, #009, #003); 
	background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0.00, #009),color-stop(1.00, #03C));
   	/* IE code - note GradientType=1 means horizontal */
	filter: progid:DXImageTransform.Microsoft.gradient(enabled='true', startColorstr=#009, endColorstr=#03C, GradientType=1);
	background: linear-gradient(left, #009, #003);
}
footer, footer a:link, footer a:visited {
	color:#FFF;
	height:1.5em;
	padding:0 0.2em;
}
#copyright {
	float:left;
}
#emailme {
	float:right;
}
.slides {
	text-align:center;
}

/*----------     phone fonts     ----------*/

h1, h1 a	{
	margin: 0.4em 0em 0em 0em;
	font-family: Tahoma, Geneva, sans-serif;
	font-size: 150%;
	line-height: 1em;
	font-weight: bold;
	left: auto;
}
h2, h2 a{
	color: #9d0a0e;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-weight:bold;
	font-variant:small-caps;
	letter-spacing: 0.02em;
	padding: 0.4em 0em;
	margin: 0px;
}
h3, h3 a{ 
	font-family: Verdana, Arial, Helvetica, sans-serif;
	line-height: 100%;
	font-size: 100%;
	font-weight:bold;
	color:#000077;
	padding: 0px;
	margin: 0.5em 0em 0.5em;
}
h4, h4 a {/* Boxout Headings */
	font-family: Verdana, Arial, Helvetica, sans-serif;
	line-height: 100%;
	font-weight: bold;
	font-size: 100%;
}
ul 	{ 
	margin-bottom: 1em; 
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 1.1em; 
	line-height: 1.3em;
	margin: 0;
    padding: 0;
    border: none;
}
ul li 	{
	list-style-position:inside;
	list-style-type:square;
	margin-left: 5px;
}

li ul li {
	font-size: 1em;
	line-height: 1.2em;
}

ol 	{
	margin-bottom: 1em; 
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 1.1em; 
	line-height: 1.3em;
	margin: 0;
    padding: 0;
    border: none;
}
ol li 	{
	list-style-position:inside;
	list-style-type:upper-alpha;
	margin-left: 10px;
}
p	{
	font-size: 1.1em;
	line-height:1.3em;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	margin-top: 0.4em;
	margin-bottom: 0.5em;
	color: #000000;
}
p.contentby {
	font-size:0.6em;
}
.floatrclear {
	float:right;
	margin:0.2%;
	clear:right;
}
th {
	text-align:left;
}
.columns {
	-webkit-column-width: 300px;
	-moz-column-width: 300px;
	column-width: 300px;
	-webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */
    page-break-inside: avoid; /* Firefox */
    break-inside: avoid; /* IE 10+ */
}
.columns table tr td, .columns table tr th {
	-webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */
    page-break-inside: avoid; /* Firefox */
    break-inside: avoid; /* IE 10+ */
}
figure {
	background-color:#fff; padding:5px; font-size:0.875em; display:table;
}
figure img{
	display:block; max-width:100%;
}
figcaption {
	display:table-caption; caption-side:bottom; background:#fff; padding:0 5px 5px;
}

table.stripes {
  overflow: hidden;
}

table.stripes tr:hover {
  background-color: #ffa;
}

table.stripes td, table.stripes th {
  position: relative;
}
table.stripes td:hover::after, table.stripes th:hover::after {
  content: "";
  position: absolute;
  background-color: #ffa;
  left: 0;
  top: -5000px;
  height: 10000px;
  width: 100%;
  z-index: -1;
}

/*----------     phone navigation      ----------*/

#chapnav {
	width:90%;
	padding:12px, 10px;
	margin: auto;
}
#chapnav a:link, #chapnav a:visited {
	background-color:#009;
	border-bottom:1px solid #666;
	color:#FFF;
	display:block;
	padding:10px;
	text-align:center;
	text-decoration:none;
	font: bold 20px Helvetica;
}
#chapnav a:first-child{
	-webkit-border-top-left-radius:8px;
	-webkit-border-top-right-radius:8px;
}
#chapnav a:last-child{
	-webkit-border-bottom-left-radius:8px;
	-webkit-border-bottom-right-radius:8px;
}
#chapnav a:hover {
	background:#003;
}
#pagenav {
	width:90%;
	padding: 12px, 10px;
	margin:auto;
}
#pagenav a:link, #pagenav a:visited {
	background: #00a9e4;
	border-bottom:1px solid #666;
	color:#FFF;
	display:block;
	padding:10px;
	text-align:center;
	text-decoration:none;
	font: bold 1em Helvetica;
}
#pagenav a:first-child{
	-webkit-border-top-left-radius:8px;
	-webkit-border-top-right-radius:8px;
}
#pagenav a:last-child{
	-webkit-border-bottom-left-radius:8px;
	-webkit-border-bottom-right-radius:8px;
}
.floatl {
	float:left;
	margin: 0.5%;
}
.floatr {
	float:right;
	margin: 0.5%;
}
.greyboxright {
	width: 96%;
	background-color: #CCCCCC;
	clear: both;
	/* curved corners - &Iacute;omhar */
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px;
	margin: auto;
	padding: 2px;
}
.greyboxright ol {
	margin:0px 0px 5px 5px;	
}
.centretext{
	text-align:center;
	margin:auto;
}
.centreimage{
    display: block;
    margin-left: auto;
    margin-right: auto }
figure{
	text-align:center;
	font-size:0.8em;
}
.svg-container{
	display: inline-block;
	position: relative;
	width: 90%;
	padding-bottom: 100%; 
	vertical-align: middle; 
	overflow: hidden;
}
.svg-content{
	display: inline-block;
	position: absolute;
	top: 0;
	left: 0;
}

/* -------          phone forms ---------- */

fieldset {
	border: none;
	position: relative;
	padding: 10px 0 0;
}
fieldset div {
	margin: 0 0 15px 15px;
}

/* -------          phone rollover ---------- */

ul.enlarge{
list-style-type:none; /*remove the bullet point*/
margin-left:0;
}
ul.enlarge li{
display:inline-block; /*places the images in a line*/
position: relative;
z-index: 0; /*resets the stack order of the list items - later we'll increase this*/
margin:10px 40px 0 20px;
}
ul.enlarge img{
background-color:#eae9d4;
padding: 1px;
-webkit-border-radius: 4px; 
-moz-border-radius: 4px; 
border-radius: 4px; 
}
ul.enlarge span{
position:absolute;
left: -9999px;
background-color:#eae9d4;
padding: 1px;
-webkit-border-radius: 8px; 
-moz-border-radius: 8px; 
border-radius:8px;
}
ul.enlarge li:hover{
z-index: 50;
cursor:pointer;
}
ul.enlarge span img{
padding:2px;
background:#ccc;
}
ul.enlarge li:hover span{ 
top: -100px; /*the distance from the bottom of the thumbnail to the top of the popup image*/
left: -20px; /*distance from the left of the thumbnail to the left of the popup image*/
}
/**IE Hacks - see http://css3pie.com/ for more info on how to use CS3Pie and to download the latest version**/
ul.enlarge img, ul.enlarge span{
behavior: url(pie/PIE.htc); 
}


/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */

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

/*--------     tablet header footer     --------*/
form {
	border: solid #009 1px;
}
header {
	color: #FFFFFF;
	height: 6.8em;
}
header #headertext{
	float: left;
	display:block;
	width: 50%;
	margin:0;
	padding:0em 0em 0em 0.4em;
	font-weight:bold;
}
header #headertext #emed {
	color: #FFF;
	font-size: 5em;
	text-decoration: none;
	width:3em;
	margin:0;
	float:left;
}
header #headertext #handbook {
	color:#F00;
	font-size:2em;
	vertical-align:text-top;
	width:5em;
	float:left;
	margin:0;
	padding: 0.7em 0em 0em 0em;	
}
header #headertext #cork{
	color:#FFF;
	font-size:1.2em;
	vertical-align:text-bottom;
	width:20em;
	padding:2em 0em 0em 10em;
}
footer {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	padding-top: 0.3em;
	padding-bottom: 0.5em;
	bottom: auto;
}
footer, footer a:link, footer a:visited {
	color:#FFF;
	height:1.5em;
	padding:0 0.2em;
}
#copyright {
	float:left;
}
#emailme {
	float:right;
}

/*--------     tablet navigation     --------*/


#chapnav {
	margin: 0em 0em 1.5em 0em;
}
#chapnav a:link, #chapnav a:visited {
	width:18%;
	margin-top:0.5em;
	margin-right:0.5em;
}
.chapnav {
	margin-bottom:1.5em
}
#pagenav {
	margin-bottom:10px;
}
.pagenav a:link, .pagenav a:visited {
	font: bold 1em Arial, Helvetica, sans-serif;
	text-decoration:none;
	text-align:center;
	color:#FFF;

	padding:5px;
	line-height:1em;
	width: 200px;
	float:left;
	background: #00a9e4;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	border-radius:3px;
	border: 1px solid #000;
	text-shadow:-1px -1px 1px rgba(0,0,0,.3);
	-webkit-box-shadow:2px 2px 4px rgba(0,0,0,.3);
	-moz-box-shadow:2px 2px 4px rgba(0,0,0,.3);
	box-shadow:2px 2px 4px rgba(0,0,0,.3);
	background-image:-webkit-gradient(linear, 0 45%, 0 55%, from (rgba(255,255,255,.4)),to(rgba(255, 255, 255,0)));
	background-image:-moz-linear-gradient(270deg,rgba(255,255,255,.4) 45%,rgba(255,255,255,.0)55%);
	margin-top:0.5em;
	margin-right:0.5em;
}


/*----------     tablet fonts     ----------*/

h1 {/* Page Topic Header */
	text-transform: uppercase;
	margin-top: 0.2em;
	margin-bottom: 5px;
	letter-spacing: 0.1em;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 1.4em;
	line-height: 1em;
	font-weight: bold;
	left: auto;
	text-align: left;
}
h2 {
	color: #9d0a0e;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 110%;
	font-variant:small-caps;
	letter-spacing: 0.02em;
	padding: 0.4em 0em;
	margin: 0px;
}
h3 	{ 
	font-family: Verdana, Arial, Helvetica, sans-serif;
	line-height: 100%;
	font-weight: bold;
	font-size: 100%;
	color:#000077;
	padding: 0px;
	margin: 0.5em 0em 0.5em;
}
h4 	{/* Boxout Headings */
	font-family: Verdana, Arial, Helvetica, sans-serif;
	line-height: 110%;
	font-weight: bold;
	font-size: 100%;
}
ul 	{ 
	margin-bottom: 1em; 
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 100%; 
	line-height: 130%;
	margin: 0;
    padding: 0;
    border: none;}

ul li 	{
	list-style-position:inside;
	list-style-type:square;
	margin-left: 10px;}

ol {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	list-style-position: outside;
	list-style-type: decimal;
	font-size: 100%;
	line-height: 130%;
	margin: 0px 5px 10px 40px;}

p	{
	font-size: 1em;
	line-height:1.3em;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	margin-top: 0.4em;
	margin-bottom: 0.5em;
	color: #000000;
}
.greyboxright {
	width: 30%;
	background-color: #CCCCCC;
	clear: both;
	/* curved corners - &Iacute;omhar */
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px;
	margin: auto;
	padding: 2px;
}
.greyboxright ol {
	margin:0px 0px 5px 5px;	
}
}

/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */

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

header {
	height: 6em;
}
#headertext{
	float: left;
	display:block;
	width: 30em;
	margin:0;
	padding:0em 0em 0em 0.4em;
	font-weight:bold;
}
#headertext #emed {
	color: #FFF;
	font-size: 5em;
	text-decoration: none;
	width:3em;
	margin:0;
	float:left;
}
#headertext #handbook {
	color:#F00;
	font-size:2em;
	vertical-align:text-top;
	width:5em;
	float:left;
	margin:0;
	padding: 0.7em 0em 0em 0em;
	
}
#headertext #cork{
	color:#FFF;
	font-size:1em;
	vertical-align:text-bottom;
	width:20em;
	padding:2em 0em 0em 10em;
}
header #searchform {
	width:30%;
	float:right;
	margin: 2em .05em 0em 0em;
}
footer {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	padding-top: 0.3em;
	padding-bottom: 0.5em;
	bottom: auto;
}
footer, footer a:link, footer a:visited {
	color:#FFF;
	height:1.5em;
	padding:0 0.2em;
}
#copyright {
	float:left;
}
#emailme {
	float:right;
}

/*--------     desktop navigation     -------*/

#chapnav {
	width:98%;
	padding:12px, 10px;
	margin-bottom: 0em 0.5em;
}
#chapnav a:link, #chapnav a:visited {
	background-color:#009;
	border-bottom:1px solid #666;
	color:#FFF;
	display:inline-block;
	width: 26%;
	margin:0.2em 0em 0em 0.5em;
	padding:10px;
	line-height:1em;
	text-align:center;
	text-decoration:none;
	font: normal 20px Helvetica;
}
#chapnav a:first-child{
	-webkit-border-top-left-radius:0px;
	-webkit-border-top-right-radius:0px;
}
#chapnav a:last-child{
	-webkit-border-bottom-left-radius:0px;
	-webkit-border-bottom-right-radius:0px;
}
#chapnav a:hover {
	background:#003;
}
#pagenav {
	width:98%;
	padding: 12px, 10px;
	margin:auto;
}
#pagenav a:link, #pagenav a:visited {
	background: #00a9e4;
	border-bottom:1px solid #666;
	color:#FFF;
	display:inline-block;
	width: 20%;
	margin:0.2em 0em 0em 0.5em;
	padding:10px;
	line-height:1em;
	text-align:center;
	text-decoration:none;
	font: bold 1em Helvetica;
}
#pagenav a:first-child{
	-webkit-border-top-left-radius:0px;
	-webkit-border-top-right-radius:0px;
}
#pagenav a:last-child{
	-webkit-border-bottom-left-radius:0px;
	-webkit-border-bottom-right-radius:0px;
}
}

/*----------     desktop fonts     ----------*/

h1 {/* Page Topic Header */
	text-transform: capitalize;
	margin-top: 0.5em;
	margin-bottom: 5px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 2em;
	line-height: 1em;
	font-weight: bold;
	left: auto;
	text-align: left;
}
h2	{
	color: #9d0a0e;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 110%;
	font-variant:small-caps;
	letter-spacing: 0.02em;
	padding: 0.4em 0em;
	margin: 0px;
}
h3	{ 
	font-family: Verdana, Arial, Helvetica, sans-serif;
	line-height: 100%;
	font-weight: bold;
	font-size: 100%;
	color:#000077;
	padding: 0px;
	margin: 0.5em 0em 0.5em;
}
h4 {/* Boxout Headings */
	font-family: Verdana, Arial, Helvetica, sans-serif;
	line-height: 110%;
	font-weight: bold;
	font-size: 100%;
}
ul 	{ 
	margin-bottom: 1em; 
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 100%; 
	line-height: 130%;
	margin: 0;
    padding: 0;
    border: none;
}
ul li 	{
	list-style-position:inside;
	list-style-type:square;
	margin-left: 10px;
}
ol {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	list-style-position: outside;
	list-style-type: decimal;
	font-size: 100%;
	line-height: 130%;
	margin: 0px 5px 10px 10px;
}
p	{
	font-size: 1em;
	line-height:1.3em;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	margin-top: 0.4em;
	margin-bottom: 0.5em;
	color: #000000;
}

.greyboxright {
	width: 40%;
	background-color: #CCCCCC;
	float:right;
	clear:right;
	/* curved corners - &Iacute;omhar */
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px;
	margin: auto;
	padding: 2px;
}
.greyboxright ol {
	margin:0px 0px 5px 5px;	
}


.whiteonblack {
	color: #FFF;
	background-color: #000;
}
.blackonyellow {
	background-color: #FF0;
}
.blackonred {
	background-color: #F00;
}
.blackongreen {
	background-color: #0F0;
}

td.enlarge {
	display: inline-block;
	position:relative;
	z-index:0;
	margin: 10px 40px 0 20px;
}

/*
 * Let's target IE to respect aspect ratios and sizes for img tags containing SVG files
 *
 * [1] IE9
 * [2] IE10+
 */
/* 1 */
.ie9 img[src*=".svg"] {
  width: 100%; 
}
/* 2 */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  img[src*=".svg"] {
    width: 100%; 
  }
}

/* image-grid */

.image-grid {
  display: flex;
  flex-wrap: wrap; 
}

.image-grid a {
  font-size: 1.2em;
  text-decoration:none;
  color:#000;
  display: inline-block;
  margin-bottom: 8px;
  width: calc(50% - 4px);
  margin-right: 8px;
}

.image-grid a:nth-of-type(2n) {
  margin-right: 0;
}

@media screen and (min-width: 50em) {
.image-grid a {
    width: calc(25% - 6px);
  }

.image-grid a:nth-of-type(2n) {
    margin-right: 8px;
  }

.image-grid a:nth-of-type(4n) {
    margin-right: 0;
  }
}

/* end image-grid */

/* accordion */

/* end accordion */

/* image swap on hover */
.swap-x400-img img:last-child{display:none}
.swap-x400-img:hover img:first-child{display:none}
.swap-x400-img:hover img:last-child{display:inline-block}
/* end image swap on hover */