/*
	Reset :: style.css
	----------------------------------------------------------
	We have learned much from/been inspired by/taken code where offered from:
	
	Eric Meyer					:: http://ericmeyer.com
	HTML5 Doctor				:: http://html5doctor.com
	and the HTML5 Boilerplate	:: http://html5boilerplate.com
	
-------------------------------------------------------------------------------*/

/* Let's default this puppy out
-------------------------------------------------------------------------------*/

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, menu, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}									

article, aside, figure, footer, header, hgroup, nav, section { display: block; }

/* Responsive images and other embedded objects
   Note: keeping IMG here will cause problems if you're using foreground images as sprites.
   If this default setting for images is causing issues, you might want to replace it with a .responsive class instead. */
img,
object,
embed { /*max-width: 100%;*/ }

/* force a vertical scrollbar to prevent a jumpy page */
html { overflow-y: scroll; }

a { margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent; }

del { text-decoration: line-through; }

abbr[title], dfn[title] { border-bottom: 1px dotted #222; cursor: help; }

/* tables still need cellspacing="0" in the markup */
table { border-collapse: collapse; border-spacing: 0; }
th { font-weight: bold; vertical-align: bottom; }
td { font-weight: normal; vertical-align: top; }

hr { display: block; height: 1px; border: 0; border-top: 1px solid #eee; margin: 1em 0; padding: 0; margin-bottom: 20px; }

input, select { vertical-align: middle; }

pre {
	white-space: pre; /* CSS2 */
	white-space: pre-wrap; /* CSS 2.1 */
	white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
	word-wrap: break-word; /* IE */
}

input[type="radio"] { margin: -5px 5px 0px 8px;}
input[type="checkbox"] { vertical-align: bottom; /**vertical-align: baseline;*/ }
.ie6 input { vertical-align: text-bottom; }

select, input, textarea { font: 99% sans-serif; }

table { font-size: inherit; font: 100%; }
 
/* Accessible focus treatment
	people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active { outline: none; }

small { font-size: 85%; }

strong, th { font-weight: bold; }

td, td img { vertical-align: top; }

/* Make sure sup and sub don't screw with your line-heights
	gist.github.com/413930 */
sub, sup { font-size: 75%; line-height: 0; position: relative; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }

/* standardize any monospaced elements */
pre, code, kbd, samp { font-family: monospace, sans-serif; }

/* hand cursor on clickable elements */
.clickable, label, input[type=button], input[type=submit], button { cursor: pointer; }

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea { margin: 0; }

/* make buttons play nice in IE */
button { width: auto; overflow: visible; }
 
/* scale images in IE7 more attractively */
.ie7 img { -ms-interpolation-mode: bicubic; }

/* prevent BG image flicker upon hover */
.ie6 html { filter: expression(document.execCommand("BackgroundImageCache", false, true)); }

/* let's clear some floats */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }  
.clearfix:after { clear: both; }  
/*.clearfix { zoom: 1; }*/ 

/* makes the padding of all elements be applied into the inside rather than default outside */
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }


/* OVERALL TYPOGRAPHY SET-UP.
-------------------------------------------------------------------------------*/

/*--- HEADINGS ---*/

h1, h2, h3, h4 { color: #006778;}

h1 {
	font-size: 24px;
	margin-bottom: 20px;
	line-height: 28px;
}

h2 {
	font-size: 18px;
	margin-bottom: 20px;
	line-height: 24px;
}

h3, .list-title {
	font-size: 14px;
	/*margin-bottom: 20px;*/
	margin: 10px 0px 20px;
	line-height: 18px;
}

h4 {
	font-size: 12px;
	margin-bottom: 10px;
	line-height: 18px;
}

h5 {
	font-weight:bold;
}

h5,
h6 {
	font-size: 16px;
	margin-bottom: 20px;
	line-height: 24px;
}

h3 a:hover {
	text-decoration: none; 
	color: #00B0CA;
	-moz-transition: all linear 0.3s;
	-webkit-transition: all linear 0.3s;
	-o-transition: all linear 0.3s;
	transition: all linear 0.3s;
}

/*--- PARAGRAPHS ---*/
p, address { margin-bottom: 20px; /*color: #006778;*/ color: #6C6f70;}

/*--- FIGURES ---*/
figure { margin-bottom: 20px; }
figure img { display: block; margin-bottom: 0; }
figcaption { font-size: 0.75em; }

/*--- LINKS ---*/
/*
Say no to negative hovers: http://csswizardry.com/2011/05/on-negative-hovers/
A negative hover is one whose appearance is subtracted from on hover rather than added to.
*/
a {	text-decoration: none; }
a:visited { opacity:0.8; /* A bit basic, but it's a bare minumum... */ }
a:hover {	text-decoration:underline; }
p a { font-weight: bold; cursor: pointer;}

/*--- LISTS ---*/
ul, ol { 
	color: #6C6f70;
	margin: 0 0 20px;
	width: 100%;
}

ol li, ol ol li{ padding: 0 0 5px 0px; margin: 0 0 0 20px; list-style-type: decimal;}

ul li, ul ul li{ padding: 0 0 5px 0px; margin: 0 0 0 13px; list-style-image: url(/images/bullet.gif);}

ul ul li { list-style-image: url(/images/sub-bullet.gif); }

ul ul {
	color: #6C6f70;
	margin: 10px 0 5px;
	width: 100%;
}


/*ul ul, ol ol, ul ol, ol ul { margin: 0 0 0 60px; }*/

ul.numbered { list-style: decimal outside; }
dl { margin-bottom: 20px; }
dt {	font-weight: bold; }
dt:after, dt::after {	content:":"; }
dd {	margin-left:60px; }

li.list-title {
	list-style: none;
	padding: 0 0 10px 0;
}

/*--- QUOTES ---*/

blockquote b, blockquote .source {
	/* Mark the source up with either a <b> or another element of your choice with a class of source. */
	display: block;
	text-indent: 0;
}
blockquote, blockquote p { font-style: italic; font-family: Georgia, "Times New Roman", Times, serif; }
blockquote p:before { content: "“"; float: left; text-indent: -7px; }
blockquote p:after { content: "”"; }
blockquote { margin-left: 50px; border-left: 1px solid #eee; }
blockquote p { margin-left: 10px; }

/*--- GENERAL ---*/
q, i, em, cite { font-style: italic; font-weight: inherit; }

b, strong {	font-weight: bold; font-style: inherit; }
s, del { text-decoration: line-through; }
small {	font-size: 0.75em;	line-height: 1; }

/*--- CODE ---*/
pre,
code {
	font-family: monospace;
	font-size: 1em;
}
pre {
	overflow: auto;
	margin-bottom: 20px;
	line-height: 24px;
}
code { line-height: 1; }



/* OVERALL IMAGES SET-UP.
-------------------------------------------------------------------------------*/

img {
	/*max-width: 100%;*/
	height: auto;
	/* Give it some text styles to offset alt text */
	font-style: italic;
	color: #c00;
}
img.left	{ margin:0 20px 0 0; }
img.right	{ margin:0 0 0 20px; }

/*--- FLASH/VIDEO ---*/
object,
embed,
video {
	max-width: 100%;
	height :auto;
}


/*------------------------------------*\
	ODD CLASSES
\*------------------------------------*/
/*
Some not-too-pretty and insemantic classes to do odd jobs.
*/
.left	{ float: left; }
.right { float: right; }
.clear { clear: both; float: none; }

.text-left { text-align: left; }
.text-right	{ text-align: right; }
.text-center, .text-centre { text-align: center; }
.newspaper { columns: 2; -webkit-columns: 2; -moz-columns: 2; }
/*.nomargin { margin: 0px !important;}*/
.nudge { margin: 0px 20px 0px 0px;}


/* FADE IN ELEMENTS ON WEBSITE LOAD GOODIES
-------------------------------------------------------------------------------*/

/*@-webkit-keyframes reset {
	0% { opacity: 0; }
	100% { opacity: 0; }
}
 
@-webkit-keyframes fade-in {
	0% { opacity: 0; }
	60% { opacity: 0; }
	100% { opacity: 1; }
}

.fade-in {
	-webkit-animation-name: reset, fade-in;
	-webkit-animation-duration: 2s;
	-webkit-animation-timing-function: ease-in;
	-webkit-animation-iteration-count: 1;
}
 
.fade-in.one { -webkit-animation-delay: 0, 0; }
.fade-in.two { -webkit-animation-delay: 0, 1s; } 
.fade-in.three { -webkit-animation-delay: 0, 1.5s; }
.fade-in.four { -webkit-animation-delay: 0, 2s; }
.fade-in.five { -webkit-animation-delay: 0, 3s; }*/


/* Ok, this is where the fun starts.
-------------------------------------------------------------------------------*/

/* new Linux- and Windows-friendly sans-serif font stack: http://mky.be/fontstack */
body { font: 13px "Helvetica", Arial, Lucida Grande, sans-serif; font-weight: normal; line-height: 20px; -webkit-font-smoothing: antialiased;}

/* using local fonts? make sure to read up on Paul Irish's 
	Bulletproof @font-face syntax: http://mky.be/font-face/bulletproof/ */

/* we like off-black for text */
body, select, input, textarea { color: #222; }

a { color: #006778; }
a:hover { 
	-moz-transition: all linear 0.3s;
	-webkit-transition: all linear 0.3s;
	-o-transition: all linear 0.3s;
	transition: all linear 0.3s;}

/* Custom text-selection colors (remove any text shadows: twitter.com/miketaylr/status/12228805301) */
::-moz-selection{ background: #90dbe4; color: #fff; text-shadow: none; }
::selection { background: #90dbe4; color: #fff; text-shadow: none; } 

/*	j.mp/webkit-tap-highlight-color */
a:link { -webkit-tap-highlight-color: #fcd700; } 

ins { background-color: #fcd700; color: #000; text-decoration: none; }
mark { background-color: #ffc; color: #000; font-style: italic; font-weight: bold; }



/* HEADER ELEMENTS.
-------------------------------------------------------------------------------*/

header {height: 100px;}

a.logo { background: url(/images/hr-wallingford-logo.gif) no-repeat 0 0; width: 149px; height: 50px; float: left; margin: 25px 0 0;
}

a.logo span {display: none;}


/*ul.sub-menu {float: right; margin: 14px 0 0;}
ul.sub-menu li {float: left; list-style: none; padding: 0 0 0 16px;}
ul.sub-menu li a {color: #006778; font-size: 11px; font-weight: bold;}*/


/*------------- Search menu ----------------*/

#search-menu {float: right; margin: 35px 0 0; background-color: #006778; height: 30px; position: relative; width: auto;}
#search-menu ul {float: right; background-color: #006778; height: 30px;}
#search-menu li {float: left; list-style: none; padding: 4px 10px 0px;}
#search-menu li a {color: #ffffff; font-size: 11px; font-weight: bold;}
#search-menu li a:hover {
	color: #00B0CA;
	text-decoration: none;
	-moz-transition: all linear 0.3s;
	-webkit-transition: all linear 0.3s;
	-o-transition: all linear 0.3s;
	transition: all linear 0.3s;
}

/*------------ Search menu dropdown ----------------*/

ul.search-menu-dropdown,
ul.search-menu-dropdown li,
ul.search-menu-dropdown ul {
 list-style: none;margin: 0;padding: 0;
}

ul.search-menu-dropdown {
 z-index: 597; float: left;
}

ul.search-menu-dropdown li {
min-height: 1px;
}

ul.search-menu-dropdown li.hover,
ul.search-menu-dropdown li:hover {
 position: relative; z-index: 599; cursor: default;
}

ul.search-menu-dropdown ul {
 visibility: hidden; position: absolute; top: 100%; left: 0; z-index: 700; width: 200px !important;
}

ul.search-menu-dropdown ul li {
 float: left !important; border-bottom: 1px solid #648e94; margin: 0 10px 0; border-left: none !important; border-right: none !important; width: 180px !important; padding: 4px 0px 0px !important;
}

ul.dropdown ul li:last-child, ul.search-menu-dropdown ul li:last-child {
 border-bottom: none;
}

ul.search-menu-dropdown ul ul {
 top: 1px; left: 99%;
}

ul.search-menu-dropdown li:hover > ul {
 visibility: visible;
}

ul.search-menu-dropdown ul li a {
 background-image: none !important; padding: 5px 0px 5px 0px !important; float: left !important; display: inline-block; font-size: 11px !important; font-weight: bold;
}

ul.search-menu-dropdown ul li a:after {content: " ›";}

ul.search-menu-dropdown ul li a:hover {
	text-decoration: none; 
	color: #00B0CA;
	-moz-transition: all linear 0.3s;
	-webkit-transition: all linear 0.3s;
	-o-transition: all linear 0.3s;
	transition: all linear 0.3s;
}

ul.search-menu-dropdown ul a, ul.search-menu-dropdown ul {
 background-color: #006778; margin: 0px !important; height: auto !important;
}



.search-box {
	position: relative;
	float: right;
	height: 40px;
	padding: 7px 8px 7px;
	background-color: #00B0CA;
	margin: 30px 0 0;
}

.search-box input {
	 width: 150px;
	 -moz-transition: width 0.5s ease-in-out;
	 -webkit-transition: width 0.5s ease-in-out;
	 transition: width 0.5s ease-in-out;
	 float: right;
	 border: none;
	 height: 26px;
	 padding: 5px;
	 color: #006778;
}

.search-box input:focus {
	 width: 200px;
	 -moz-transition: width 0.5s ease-in-out;
	 -webkit-transition: width 0.5s ease-in-out;
	 transition: width 0.5s ease-in-out;
}

input.button-search {
	float: right;
	width: 75px;
	background: none;
	color: #ffffff;
	padding: 0 0 0 5px;
}

input.button-search:hover {
	color: #006778 !important;
	-moz-transition: all linear 0.3s;
	-webkit-transition: all linear 0.3s;
	-o-transition: all linear 0.3s;
	transition: all linear 0.3s;
}


/*------------------ Main menu CSS -------------------*/

nav {
	background-color: #00B0CA;
	height: 60px;
	padding: 9px 0 0 0;
}

#nav ul {
	width: 940px;
	display: table;
	table-layout: fixed;
	float: left;
	height: 40px;
	}
	
#nav li {
	display: table-cell;
	height: 40px;
	text-align: center;
	border-right: 1px solid #89d8e2;
	vertical-align: middle;
	border-left: 1px solid #1cadc0;
}

#nav li:first-child {
	border-left: none;
}

#nav li:last-child {
	border-right: none;
}
	
#nav li a {
	color: #ffffff;
	font-size: 16px;
	font-weight: bold;
	}

#nav li a:hover{
	text-decoration: none; 
	color: #006778;
	-moz-transition: all linear 0.3s;
	-webkit-transition: all linear 0.3s;
	-o-transition: all linear 0.3s;
	transition: all linear 0.3s;
	}
	
/*------------------ Main menu Dropdown -------------------*/
ul.dropdown,
ul.dropdown li,
ul.dropdown ul {
 list-style: none;margin: 0;padding: 0;
}

ul.dropdown {
 z-index: 597; float: left;
}

ul.dropdown li {
min-height: 1px;
}

ul.dropdown li.hover,
ul.dropdown li:hover {
 position: relative; z-index: 599; cursor: default;
}

ul.dropdown ul {
 visibility: hidden; position: absolute; top: 40px; z-index: 700; width: 200px !important; background-color: #00B0CA;
}

ul.dropdown ul li {
 border-bottom: 1px solid #89d8e2; margin: 0 10px 0; border-left: none !important; border-right: none !important; width: 180px !important; display: block !important; position: relative;
}

ul.dropdown ul ul {
 top: 1px; left: 99%;
}

ul.dropdown li:hover > ul {
 visibility: visible;
}

ul.dropdown ul li a {
 background-image: none !important; padding: 10px 0px 5px 0px !important; display: block; font-size: 12px !important; font-weight: bold; text-align: left; width: 100%; float: left;
}

ul.dropdown ul li a:hover {
	text-decoration: none; 
	color: #006778;
	-moz-transition: all linear 0.3s;
	-webkit-transition: all linear 0.3s;
	-o-transition: all linear 0.3s;
	transition: all linear 0.3s;
}

ul.dropdown ul li a:after {content: " ›";}

ul.dropdown ul a {
 background-color: #00B0CA; margin: 0px !important;
}


/*------------------ Simple Dropdown menu end -------------------*/

.edge-subscribe {
	background-image:url(/images/edge/aside.jpg);
	background-repeat:no-repeat;	
	padding-bottom:10px;
}

.edge-subscribe a {
    padding-top: 164px;
    display: block;
    position: relative!important;
    text-align: right;
}
	
		
	

.slider-link {
	position: absolute;
	bottom: 25px;
	right: 0px;
	}


#mc_embed_signup input[type=checkbox] {
    position: relative;
    top: -4px;
	margin-right:5px;
    /* margin-top: -3px; */
    /* line-height: 20px; */
}

.button {
	background-color: #00B0CA!important;
	display:inline-block!important;
	color:#ffffff!important;
	font-size:14px!important;
	line-height: 18px!important;
	font-weight: bold!important;
	padding: 8px 13px 8px 15px!important;
	text-decoration: none!important;
    border-radius: 0px!important;
    min-width: 187px;
    text-align: center!important;
	float: left!important;
	font-style: normal !important;
	border: none!important;
}

.button:hover, .breadcrumb a:hover{
	color: #006778;
	text-decoration: none;
	-moz-transition: all linear 0.3s;
	-webkit-transition: all linear 0.3s;
	-o-transition: all linear 0.3s;
	transition: all linear 0.3s;
}

.button:after {content: " ›";}

.software-support .button {
   /*border: 1px solid #00b0CA;
   background: -webkit-gradient(linear, left top, left bottom, from(#005172), to(#00B0CA));
   background: -webkit-linear-gradient(top, #d47500, #d47500);
   background: -moz-linear-gradient(top, #d47500, #d47500);
   background: -ms-linear-gradient(top, #d47500, #d47500);
   background: -o-linear-gradient(top, #d47500, #d47500);*/
   padding: 5px 10px 8px 5px;
   /*-webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   /*box-shadow: rgba(0,0,0,1) 0 1px 0;*/
  /* text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: white;
   text-decoration: none;
   vertical-align: middle;*/
   margin-bottom:13px;
}

.software-support .button:after {content: "";}

/*------------------ Breadcrumb -------------------*/

.breadcrumb {
	padding: 20px 0 10px;
	font-size: 11px;
	color: #006778;
}

.breadcrumb a:hover{
	color: #00B0CA;
}
/*------------------ Breadcrumb End -------------------*/


/*------------------ Main list items boxes -------------------*/

.mosaic-block {
	float:left;
	position:relative;
	overflow:hidden;
	width:220px;
	height:268px;
	background: url(/images/progress.gif) no-repeat center center #f3f3f3;
	border-bottom: 5px solid #00B0CA;
	margin-bottom: 59px;
}

.inner .mosaic-block {
	margin-bottom: 20px;
}

.mosaic-block span{
	position: absolute;
	top: 20px;
	left: 0px;
	font-size: 11px;
	display: inline-block;
	padding: 3px 7px 3px;
	background-color: #00B0CA;
	z-index: 101;
	font-weight: bold;
	color: #ffffff;
}



.mosaic-block.newsletter {
	width: 320px;
    border: 1px #ccc solid;
    height: 320px;
    margin-right: 20px;
}


.mosaic-block.newsletter img{
    width: 100%;
	height:auto;
}


.mosaic-block.newsletter span {
    right: 0px;
	left: auto;
}


.mosaic-block.newsletter h4 {
    margin: 0 0 5px;
	display:none;
}

.mosaic-block.newsletter.bar .mosaic-overlay .details {
    width: 100%;
}


.mosaic-block.newsletter.bar .mosaic-overlay {
    bottom: -198px;
    height: 244px;
    z-index: 102;
    bottom: -156px!important;
}


.mosaic-block.newsletter p.more-link img {
    margin-top: 5px;
    /* line-height: 36px; */
    margin-right: 4px;
}

span.projects-label {background-color: #00B0CA;}
span.expertise-label {background-color: #005172;}
span.facilities-label {background-color: #006778;}
span.events-label {background-color: #879637;}
span.people-label {background-color: #857363;}

.inner.People span.people-label,
.inner.Environment span.people-label,
.inner.Equipment span.people-label,
.inner.Energy span.people-label,
.inner.Flood span.people-label,
.inner.Maritime span.people-label,
.inner.Research span.people-label {display: none;}


.mosaic-block .bar:hover .mosaic-block span {display:none;}

.mosaic-block h4 {
	color: #006778;
	font-size: 14px;
	line-height: 16px;
	margin: 0 0 35px;
	}

.mosaic-block p {
	color: #006778;
	font-size: 12px;
	display: block;
}

.mosaic-block a:hover p {
	display: block;
}

.mosaic-block a {
	text-decoration: none;
}

.wrap {
	position: relative;
	float: left;}

.hometitle {
	position: absolute;
	top: -48px;
}

p.more-link {
	color: #006778;
	font-weight: bold;
}

.more-link:hover{
	cursor: pointer;
	text-decoration: underline;
}

.more-link:after {content: " ›";}

.index a.more-link {
	margin-bottom: 59px;
}

.mosaic-backdrop {
	display:none;
	position:absolute;
	top:0;
	height:274px;
	width:100%;
	background-color:#f3f3f3;
}

.mosaic-backdrop img {
	width: 220px;
}
	
.mosaic-overlay {
	display:none;
	z-index:5;
	position:absolute;
	width:100%;
	height: 268px;
	background-color: #f3f3f3;
	  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
	  filter: alpha(opacity=90);
      -moz-opacity: 0.9;
	  -khtml-opacity: 0.9;
	  opacity: 0.9;
}

.bar .mosaic-overlay .details p {
	margin: 0 0 0 0;
}

.bar .mosaic-overlay {
	bottom: -198px;
	height: 268px;
	z-index: 102;
}

.bar .mosaic-overlay .details {
	position: absolute;
	top: 0;
	padding: 15px;
	width: 220px;
}

.mosaic-no-hover {
    float:left;position:relative; width:220px; height:268px;background: #f3f3f3;border-bottom: 5px solid #00B0CA;margin-bottom: 59px;padding:15px;
}
/*------------------ Main list items boxes end -------------------*/


/*------------------ OFF SWITCH -------------------*/

.off {display: none !important;}

/*------------------ OFF SWITCH END -------------------*/


/*------------------ Generic page content -------------------*/

.index section { margin-top: 20px;}

.webapptable {
	border: none !important;
	padding: 0px !important;
	background-color: #FFF  !important;
}

.webapptable tbody{
	padding: none !important;
	float: none !important;  
}

.webapptable tr {
	padding: none !important;
	border: none !important;
	float: none !important; 
	}

.webapptable td {
	display: inline;
	float: left;
	position: relative;
	margin-right: 20px;
	width: 220px;
	padding: 0px !important;
}

.webapptable td:nth-child(3) {
	margin-right: 0px;
}

section table {
	border-bottom: 5px solid #00B0CA;
	background-color: #f3f3f3;
	width: 100%;
	color: #006778;
	margin-bottom: 20px;
}

section tbody {
	padding: 10px;
	float: left;
}

section tr {
	padding: 10px 0px 10px;
	border-top: 2px solid #fff;
}

section tr:first-child {
	border-top: none;
}

section td {
	padding: 10px 10px 10px;
}

/*.inner-col { 
	margin: 0px 0 0 20px;
	float: right;
	width: 220px;
}*/

/*----------- Style training list table -------------------*/
.training-list {background:#FFFFFF;}
.training-list tr td{border: 1px solid #d7d7d7;}
.training-list tr:nth-of-type(even){background:#FFFFFF;}
.training-list tr:nth-of-type(odd){background: #EEF5FA;}
.training-list {border-bottom: 0px;}
/*----------- Style training list table ends -------------------*/

.overlay {
	position: absolute;
	background: url(/images/hrw-playbutton.png) no-repeat 50% 50%;
	width: 220px;
	height: 125px;
}

.pull-quote, .project-contact, .video-content, .contact-details{
	width: 220px;
	background-color: #f3f3f3;
	  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
	  filter: alpha(opacity=90);
      -moz-opacity: 0.9;
	  -khtml-opacity: 0.9;
	  opacity: 0.9;
	border-bottom: 5px solid #00B0CA;
	margin: 0 0 20px;
	float: left;
	position: relative;
}

.quote span.cite {
	color: #006778;
	font-weight: bold;
	font-size: 11px;
	}

.uk-europe .people-details a.link-button,
.asia .people-details a.link-button,
.middle-east .people-details a.link-button,
.africa .people-details a.link-button,
.americas .people-details a.link-button { display: none;}

.contact-details {padding: 10px;}
.contact-details p {margin: 0 0 10px;}
.contact-details p em { font-size: 11px; line-height: 14px !important;}
.contact-details p a { font-weight: normal; font-size: 12px;}

.video-content-container {
	width: 220px;
	height:125px;
	margin: 0 0 40px;
	overflow:hidden;
	}


.quote {
	padding: 10px;
	}

.pull-quote p {
	font-size: 14px;
	color: #006778;
}

.pull-quote img {
	width: 220px;
	margin: 0 0 10px;
}

.people-details {
	float: left;
	width: 120px;
	padding: 10px 5px 10px 7px;
}

.people-details p {
	font-size: 11px;
	line-height: 14px;
	margin-bottom: 4px;
	color: #006778;
}

.people-details p.name {
	font-size: 12px;
	font-weight: bold;
}

.people-details a {
	font-size: 11px;
	line-height: 13px;
	font-weight: bold;
	color: #006778;
	}

.people-details a:hover {
	text-decoration: none;
	color: #006778;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
	  filter: alpha(opacity=50);
      -moz-opacity: 0.5;
	  -khtml-opacity: 0.5;
	  opacity: 0.5;
	}

a.link-button {
	position: absolute;
	bottom: 10px;
	right: 10px;
	font-size: 11px;
	font-weight: bold;
	color: #006778;
	}

a.link-button-2 {
	font-size: 11px;
	font-weight: bold;
	color: #fff;
	float: right;
	padding-bottom: 5px;
}

.widget-twitter {
	background: url(/images/widget-twitter.gif) no-repeat 0px 2px;
	display: block;
	padding: 0px 0px 0px 20px;
}

.widget-linkedin {
	background: url(/images/widget-linkedin.gif) no-repeat 0px 2px;
	display: block;
	padding: 0px 0px 0px 20px;
}

.free-text {
	color: #006778;
	}

.above {
	margin: 10px 0 10px;
}

a.above {
	bottom: 32px;
}

a.link-button:after, a.link-button-2:after {content: " ›";}

a.email:hover, a.link-button:hover, a.download:hover, a.link-button-2:hover{
	text-decoration: none;
	color: #006778;
	}

.project-contact-img {
	float: left;
	width: 100px;
	height: 140px;
	overflow: hidden;
}

.project-contact-img img {
	height: 140px;
	margin-left: -9px;
}

figure {
	position: relative;
	float: left;
	padding: 15px 10px 5px;
	background-color: #00B0CA;
	width: 100%;
	margin: 0px 0px 20px 0px
	}

figure li {
	margin: 0px;
	padding: 0 0 10px;
	list-style: none;
	}

figure li a {
	color: #ffffff;
	font-weight: bold;
	}

figure li a:hover {
	text-decoration: none;
	color: #006778;
	-moz-transition: all linear 0.3s;
	-webkit-transition: all linear 0.3s;
	-o-transition: all linear 0.3s;
	transition: all linear 0.3s;
	}

.timeline-block {
	position: relative;
	display: block;
	background-color: #f3f3f3;
	padding: 10px;
	border-bottom: 5px solid #00B0CA;
	}
	
span.timeline {
	background-color: #00B0CA;
	color: #FFF;
	padding: 3px;
	font-size: 18px;
	margin-bottom: 5px;
	display: inline-block;
}

/*------------------ Utility boxes -------------------*/

aside {
	position: relative;
	float: left;
	padding: 10px 10px 35px 10px;
	background-color: #00B0CA;
	width: 220px;
	color: #ffffff;
	margin: 0px 0px 20px 0px;
	font-size: 12px;
	line-height: 16px;
	}

aside ul, figure ul{
	margin: 0px;
	padding: 0px;
	color: #ffffff;
}

aside li {
	list-style: none;
	color: #ffffff;
	float: left;
	width: 100%;
	padding: 5px 0px 15px;
	margin: 0px;
	font-weight: bold;
}

aside li a, aside a.link-button {
	color: #ffffff;
}

aside li a:hover, aside a.link-button:hover {
	color: #006778;
	text-decoration: none;
}

aside ul li a:after, aside ul li ul li a:after { content: " ›";}

.project-information {}

.project-information li span {
	color: #006778;
	float: left;
	width: 100%;
	font-weight: normal;
}

aside.related-pages, aside.further-links {
	padding: 10px 10px 5px;
}

aside.related-pages ul ul, aside.further-links ul ul{
	border-bottom: 1px solid #89d8e2;
	float: left;
	width: 100%;
	padding: 0 0 5px;
	margin: 0 0 10px;
}

aside.related-pages li, aside.further-links li{
	border-bottom: none;
	padding: 0 0 5px;
}

aside.related-pages li a, aside.further-links li a{
	color: #ffffff;
	margin: 0 0 5px;
	display: inline-block;
}

aside.related-pages li a:hover, aside.further-links li a:hover{
	text-decoration: none;
}

aside.related-pages ul ul li, aside.further-links ul ul li{
	padding: 0px;
	list-style: none;
	width: 185px;
	}

aside.related-pages ul ul li a, aside.further-links ul ul li a{
	/*color: #006778; CEG Edits Sept 13 */
	font-weight: normal;
	}

/*aside.related-pages ul ul li a:before, aside.further-links ul ul li a:before { content: "- ";}*/
	
aside.related-pages ul ul li a:hover, aside.further-links ul ul li a:hover{
	text-decoration: none;
	/*color: #ffffff;* CEG changed color Sept 13 */ 
	color: #006778;
	-moz-transition: all linear 0.3s;
	-webkit-transition: all linear 0.3s;
	-o-transition: all linear 0.3s;
	transition: all linear 0.3s;
}

aside.about-us {
	background-color: #006778;
	height:	268px; 
	}

aside.people-list {
	height:	268px; 
	}

aside.about-us p{
	color: #ffffff;
	font-weight: 500;
	font-size: 14px;
	line-height: 21px;
	}

aside.about-us a:hover{
	color: #00B0CA;
	}

aside.twitter-feed, aside.careers, aside.news {
	//height:	269px;
    height:100%;
	}
	
ol.blogsitesummary {
	margin: 0px;
	position: relative;
	padding: 0px 0px 0px 50px;
	}

ol.blogsitesummary li{
	border-bottom: none;
	float: left;
	position: relative;
	min-height: 65px;
	padding: 0 0 10px 0;
	}
	
ol.blogsitesummary li a{
	color: #ffffff; 
	}
	
ol.blogsitesummary li a:hover{
	text-decoration: none;
	color: #006778;
	-moz-transition: all linear 0.3s;
	-webkit-transition: all linear 0.3s;
	-o-transition: all linear 0.3s;
	transition: all linear 0.3s; 
}
	
.blogsitesummary span.author {
	display: none;}
	
.blogsitesummary span.date {
	background-color: #006778; 
	display: block;
	width: 47px;
	height: 47px;
	float: left;
	text-align: center;
	padding: 5px;
	line-height: 13px;
	margin: 0px 0px 0px -60px;
	position: absolute;
	top: 0px;
	}
.blogsitesummary span.date span {
	font-size: 20px;
	padding-top: 5px;
	display:block;
	}
/*------------------ Utility boxes end -------------------*/

/*------------------ Generic page content end -------------------*/

/*.tel, .email, .download, .fax{
	background: url(/images/phone-icon.gif) no-repeat 0px 0px;
	display: block;
	padding: 2px 0 3px 25px;
	}

.email {
	background: url(/images/email-icon.gif) no-repeat 0px 0px;
	}

.download {
	background: url(/images/download-icon.gif) no-repeat 0px 0px;
	}

.fax {
	background: url(/images/fax-icon.gif) no-repeat 0px 0px;
	}*/
.address-holder {
	width: 100%;
	float: left;
	border-bottom: dashed 1px #00B0CA;
	margin-bottom: 20px;
}

.contact-holder {
	width: 220px;
	float: left;
	}

.top {
	margin: 20px 0 0 !important;}
	
.top-p10 {
	padding-top: 10px;}

.address-details {
	float: left;
	width: 240px;
	padding: 0 20px 0 0;
	margin: 0 0 10px 0;
	font-size: 11px;
	line-height: 18px;
	}

.address-details h4, .directions h4{
	margin: 0px;
	}

.address-details p, .directions p{
	margin: 0px;
	}
	
.address-details .tel {
	padding: 10px 0 0 0;
	}

.directions h3, .international h3{
	margin: 0 0 10px;
	}

.directions p, .international p{
	margin: 0 0 10px;
	}

.directions, .international {
	color: #FFF;
	padding: 20px 20px 11px;
	display: block;
	width: 100%;
	background-color: #f3f3f3;
	margin: 10px 0 10px;
	float: left;
}

.international {
	margin-bottom: 30px;
	border-bottom: 5px solid #00B0CA;
}

.international h3, .international ul li a{
	font-weight: bold;
}

.international ul {
	margin: 0;
	float: left;
	padding: 0 20px 0 0;
	width: 180px;
}

.international ul li {
	list-style: none;
	margin: 0;
}


.address-details a:hover, .directions a:hover, .international a:hover {
	text-decoration: none;
	color: #00B0CA;
	-moz-transition: all linear 0.3s;
	-webkit-transition: all linear 0.3s;
	-o-transition: all linear 0.3s;
	transition: all linear 0.3s; 
} 

	
/*------------------ FOOTER -------------------*/

footer {
	background-color: #00B0CA;
	float: left;
	width: 100%;
	padding: 0 0 30px;
	color: #FFF;
	font-weight: bold;
}

footer ul {
	margin: 0 !important;
	padding: 0 !important;
}

footer li{
	list-style: none !important;
	padding: 0 0 5px !important;
	margin: 0px !important;
}

footer p, footer a, footer li a, footer ul li.main ul li a, footer .contacts p a {
	color: #ffffff;
	font-size: 12px;
	font-weight: normal;
	display: block;
	font-weight: bold;
	padding: 0px;
}
	
footer p {
	padding: 0 0 5px;
	margin: 0px;
}

footer p.international-offices {
	padding: 10px 0 15px;
}

footer ul li.main {
	float: left;
	width: 240px;
	padding: 0px 20px 0px 0px;
}

footer .contacts {
	position: absolute;
	right: 0px;
	padding: 0px 20px 0px 0px;
	width: 220px;
	z-index: 101;
	font-size: 12px;
}
	
footer ul li.research a {
	clear: left;
	width: 240px;
	padding: 20px 20px 15px 0px !important;
	font-size: 16px !important;
	display: inline-block;
	}

footer ul li.main ul li a:after {content: " ›";}

footer ul li.main a, footer .contacts a{
	color: #ffffff;
	font-size: 16px;
	padding: 20px 0 15px;
	display: block;
	}
	
footer ul li.main a:after, footer ul li.main ul li.research a:after {content: "";}

footer a:hover, footer li a:hover, footer ul li.main a:hover, footer ul li.main ul li a:hover, footer .contacts p a:hover{
	color: #006778;
	text-decoration: none;
	-moz-transition: all linear 0.3s;
	-webkit-transition: all linear 0.3s;
	-o-transition: all linear 0.3s;
	transition: all linear 0.3s;
}

ul.social-media li {
	list-style: none;
	float: left;
}

ul.social-media li a{
	width: 20px;
	height: 21px;
	margin: 5px 5px 0 0;
	text-indent: -9999px;
	padding: 0px;
}

footer li.research {
	padding: 0px !important;
	}

.twitter {
	background: url(/images/twitter-footer.png) no-repeat 0px 0px;
	}

.linkedin {
	background: url(/images/linkedin-icon.png) no-repeat 0px 0px;
	}

ul.social-media li a:hover{
	background-position: 0px -21px;
	-moz-transition: none;
	-webkit-transition: none;
	-o-transition: none;
	transition: none;
}

.accreditation {
	float: left;
	display: block;
	padding: 50px 20px 0 0;
}

footer ul.terms {
	bottom: 0px;
	right: 0px;
	position: absolute;
	display: inline-block;
	}

footer ul.terms li {
	float: right;
	text-align: left;
	display: block;
	color: #fff;
	font-weight: bold;
	margin-left: 20px !important;
	padding: 0px !important;
	font-size: 12px;
	}

/*------------------ FOOTER end -------------------*/




/*------------------------ Twitter Elements -----------------------*/

.tweets {
	color: #ffffff;
	font-weight: 500;
	font-size: 12px;
	line-height: 15px;
}

.tweets a {
	color: #ffffff !important;
	text-decoration:none;
}

.tweets a:hover {
	text-decoration:none;
	color: #006778 !important;
}

.tweets .tweet {
	padding: 0 0 10px 0;
}

.tweets .tweets_header {
}

.tweets .tweets_header a {
}

.tweets .tweets_header a:hover {
	text-decoration:underline !important;
}

.tweets_footer {
	padding:6px 12px;
	text-align: center;
}

.tweets .tweet .time {
	display: none;
}

.tweets .tweet .avatar {
	display: none;
}

.mt_header {
}

.mt_screen_name {
}

.mt_header a {
	font-weight:bold;
	color: #ffffff;
	text-decoration:none;
}

.mt_text {
}

.mt_footer {
	color:#ffffff;
	font-size:12px;
	padding-left:60px;
	display: none;
}

.mt_footer .image_r {
	display:inline-block;
	margin-bottom:-2px;
	margin-right:4px;
	background-position: -20px -290px;
	width: 14px;
	height:13px;
	background-color:#999;
}

.mt_footer a{
	color:#ffffff;
}

/*------------------------ Twitter Elements end -----------------------*/



/*==============================================================

BC CSS from the module stylesheets

==============================================================*/


/* @group BASE */

/* @group FRIENDLY SETTINGS */

img, a img { border:0; } /* nobody likes default border around images */

.clear { display: inline-block; }   
.clear:after { content: "."; display: block; height: 0;   clear: both; visibility: hidden; }
* html .clear { height: 1%; }
.clear { display: block; }

/* @end */
/* based on YUI 2.3 base.css */

/* Idioms */

ul.mod {
	list-style-image:none;
	list-style-position: outside;
	list-style-type: none;
	list-style: none;
	margin: 0;
	padding: 0;
}

ul.mod li {
	list-style: none;
}

/* @end */

/* @group Web Form */

ul.form {
	margin: 0;
	padding: 0;
}

ul.form li {
	list-style: none;
	margin: 0 0 18px 0;
}

ul.form li label {
	color: #888;
	display: block;
}

div.form div.item, div.webform div.item {
	padding: 9px;
}

cat_button {}

input.cat_textbox,
textarea.cat_listbox,
select.cat_dropdown,
select.cat_listbox {
	width: 100%;
	padding: 8px;
	border: none;
}

.cat_dropdown_small {
	width: 200px;
}

.cat_dropdown_smaller {
	float: left;
    font-size: 11px;
    height: 20px;
    padding-top: 2px;
    position: relative;
    width: 150px;
}

.cat_textbox_small, .cat_listbox_small {
	width: 200px; /* DON'T TOUCH THIS */
}

.cat_listbox {
	height: 120px;
	width: 300px;
}

#contact-form {
	background-color: #f3f3f3;
	padding: 20px 20px 10px;
	border-bottom: 5px solid #00B0CA;
	float: left;
	color: #006778;
	margin: 0 0 40px;
	width:100%;
}

table.webform,
table.reporting {
	border-collapse:collapse;
	border-spacing:0;
	width: 100%;
}

table.webform td {
	line-height: 24px;
	padding: 6px;
}

table.webform tr {
	width: 200px;
	float: left;
	}

.form label, .webform label {
	position: absolute;
	top: 5px;
}

.item {
	position: relative;
	padding: 10px 0 10px;
	float: left;
	width: 100%;
}

.titles {width: 50%;}

span.req {
	margin: 0px 0px 0px 6px;
	float: right;
	padding: 10px 0 0;
	}


.item label {
	position: absolute;
	top: 16px;
	left: 7px;
	color: #006778;
}

.item label.float {
	position: relative;
	float: left;
	margin: 0px 20px 0px 6px;
	top: 0px;
	left: 0px;
}

.submit {
	width: 100%;
	text-align: center;
	padding: 10px;
}

.submit:hover {
   -moz-box-shadow:    inset 0 0 10px #149fb0;
   -webkit-box-shadow: inset 0 0 10px #149fb0;
   box-shadow:         inset 0 0 10px #149fb0;
}

.form input, .webform input {
}

/* @end */

/* @group System Message */

.system-message, .system-error-message {
	background-color: #f9f9f9;
	border: 1px solid #eee;
	color: #666;
	margin: 18px;
	min-height: 110px;
	height: auto !important;
	height: 110px;
	padding: 36px 36px 36px 180px;
}

/*.system-message {
	background: #f9f9f9 url(/CatalystImages/ok.png) no-repeat 29px 18px;	
}

.system-error-message {
	background: #f9f9f9 url(/CatalystImages/error.png) no-repeat 26px 26px;
}*/

.system-message h1, .system-error-message h1 {
	color: #000;
	margin: 0 0 18px 0;
}

.system-message a:link, .system-error-message a:link {
	color: #1969bc;
}

.ok {
	background: #E9FBE3;
	color: #21A347;
	margin-bottom: 18px;
}

.error {
	background: #FBE3E4;
	color: #D12F19;
	margin-bottom: 18px;
}

/* @end */

/* @group Announcement */

/*.announcement-details ul {
	background-color: #00B0CA;
	padding: 20px;
	float: left;
	overflow: hidden;
	color: #fff;
	font-weight: bold;
	margin: 0 0 20px;
	}

.announcement-details ul li {
	padding: 0 0 5px 0px;
	margin: 0 0 0 10px;
	list-style: disc;
}*/

/*.announcement-list span.date {
	font-size: 10px;
	font-weight: normal;
	margin: 0 0 0 6px;
}

.announcement-details span.date {
	display: block;
	font-size: 10px;
	font-weight: normal;
	margin-bottom: 18px;
}*/

/* @end */

/* @group Blog */

/* NOTE: div.post-list exists in FORUMS as well */


.blog-list {
	background: #f9f9f9;
	border: 1px solid #eee;
	color: #000;
	font-size: 11px;
	margin: 0 0 18px;
	padding: 18px;
}

.blog-list h2 {
	font-size: 18px;
	margin: 0 0 3px 0;
}

.blog-list span {
	color: #888;
}

/*.blog-container h1 {
}*/

.blog-container p a:hover {
	text-decoration: none;
	color: #00B0CA;
	text-decoration: none;
	-moz-transition: all linear 0.3s;
	-webkit-transition: all linear 0.3s;
	-o-transition: all linear 0.3s;
	transition: all linear 0.3s;
}

.blog-post {
	float: left;
}

.blog-post h2.post-title, .announcement-list h2 {
	font-size: 18px;
	margin: 0;
	padding: 0 0 20px 0;
	clear: left;
}

.blog-post .post-details, .blog-post .post-author, .announcement-list span.post-date, .announcement-details span.post-date {
	color: #00B0CA;
	font-size: 11px;
	margin: 0 0 10px 0;
	font-weight: bold;
	padding: 0 10px 0 0;
	display: block;
}

.blog-post .post-details, .blog-post .post-author {
	float: left;
	}

.comment-count {
	float: left;
	font-weight: bold;
	padding: 0 20px 0 0;
	font-size: 11px;
}

.blog-container .post-list {
	float: left;
	width: 69%;	
}

.blog-post .post-body, .announcement-list, .announcement-details{
	margin: 0 0 20px;
	border-bottom: #00B0CA dashed 1px;
	float: left;
	width: 700px;
	padding: 0 0 10px;
}

.blog-post a.back, .grid_9 a.back{
	float: right;
	color: #00B0CA;
	font-size: 11px;
	font-weight: bold;
	cursor: pointer;
	margin: 0 0 30px 0;
}

/* .blog-post .post-body p {
	margin-bottom: 10px;
}*/

.blog-post h2.post-title, .blog-post h2.post-title a, .blog-post .post-body p a {
	color: #006778;
	font-weight: bold;
}

.blog-post h2.post-title a:hover, .blog-post .post-body p a:hover, .blog-post a.back:hover, .announcement-list a:hover{
	text-decoration: none;
	color: #00B0CA;
	text-decoration: none;
	-moz-transition: all linear 0.3s;
	-webkit-transition: all linear 0.3s;
	-o-transition: all linear 0.3s;
	transition: all linear 0.3s;
}

.post-body p img {
	padding: 0 0 20px 0;
	width: 100%;
	}
	

.comment-list {
	background: #f9f9f9;
	border: 1px solid #eee;
	margin-bottom: 36px;
	padding: 18px;
}

.comment-list h5 {
	font-size: 14px;
	margin: 0 0 18px;
}

.comment-list input#Captcha {
	width: 300px;
}

.comment-list textarea.cat_listbox_small {
	height: 120px;
	width: 100%;
}

.blog-comment-container {
	border: 1px solid #e9e9e9;
	margin: 0 0 18px;
}

.blog-comment-container  .comment-details {
	background: #eee;
	font-size: 11px;
	padding: 6px;
}

.blog-comment-container .comment {
	background: #fff;
	padding: 9px;
}

span.flag {
	margin: 0 6px;
	vertical-align: middle;
}

input#fullname, input#website, input#emailaddress {
	width: 300px;
}

textarea.comment {
	height: 160px;
	width: 100%;
}

.forum-registration textarea.comment {
	height: 70px;
	width: 270px;
}

.post-body .links {
	font-size: 11px;
}

.blog-container .side-panel {
	float: right;
	width: 27%;
}

.side-panel h4 {
	font-size: 12px;
	margin: 0 0 9px;
}

.BlogTagCloud {
	margin: 0 0 18px;
}

.BlogRecentPost ul, .BlogTagList ul, .BlogPostArchive ul {
	margin: 0;
	padding: 0;
}

.BlogRecentPost li, .BlogTagList li, .BlogPostArchive li {
	font-size: 11px;
	list-style: none;
	padding: 0 0 5px 0;
}

p.page-nav {
	font-size: 11px;
	float: left;
	width: 700px;
	border-bottom: #00B0CA dashed 1px;
	padding: 0 0 16px 0;
}

.description {
	border-bottom: #00B0CA dashed 1px;
	margin: 0 0 20px;
} 

p.page-nav a {
}

p.page-nav a#previouspage, .pag-prev, a#searchprev {
	background: url(/images/previous.gif) no-repeat 0px 4px;
	height: 15px;
	float: left;
	margin: 0px 10px 0 0;
	padding: 0 0px 0 20px;
	width: 70px;
	}

p.page-nav a#nextpage, .pag-next, a#searchnext {
	background: url(/images/next.gif) no-repeat right 4px;
	width: 45px;
	height: 15px;
	display: block;
	float: right;
	margin: 0 0 0 10px;
	}

a#searchnext {
	margin: 0 0 30px 10px;}

p.page-nav a:hover, a#searchnext:hover, a#searchprev:hover {
	text-decoration: none;
	}

.blog-post dl {
	background: #f9f9f9;
	border: 1px solid #eee;
	margin: 0 0 18px;
	padding: 18px;
}

.blog-post dt {
	color: #000;
}

.blog-post dd {
	margin: 0 0 9px;
}

/* @end */

/* @group Booking */

.booking-list {
	margin: 0 0 9px;
}

.booking-list span.date {
	margin: 0 9px 0 0;
}

.booking-container h1, .form-container h2 {
	margin: 0 0 18px;
}

.booking-container span.date {color:red;width: 100%;}
.form-container {
	background: #f9f9f9;
	border: 1px solid #eee;
	padding: 18px;
}

.form-container input#FirstName,.form-container input#LastName, .form-container input#EmailAddress, .form-container input#Company, .form-container input#WorkPhone, .form-container input#SZUsername{
	width: 260px;
}

.go-back {
	margin: 18px 0;
}

/* @end */

/* @group Calendar */

div.select-month-year {
	padding: 9px 0;
}

table.module-calendar {
	border: 1px solid #888;
	border-collapse: collapse;
	table-layout: fixed;
	width: 100%;
}

table.module-calendar td {
	border: 1px solid #d7d7d7;
	font-size: 11px;
	height: 80px;
	overflow: hidden;
	padding: 0;
	vertical-align: top;
}

table.module-calendar td span {
	background: #f7f7f7;
	color: #333;
	display: block;
	font-size: 11px;
	padding: 0 2px;
	text-align: right;
}

tr.day-of-week td {
	background: #d7d7d7;
	color: #000;
	font-size: 12px;
	font-weight: bold;
	height: 18px;
	text-align: center;
	vertical-align: middle;
}

table.module-calendar td.events span {
	background: #2BABFA;
	color: #fff;
	font-weight: bold;
}

table.module-calendar td.events {
	background: #EEF5FA;
}

table.module-calendar td ul {
	margin: 9px 0;
	padding-left: 24px;
}

table.module-calendar td.last-month {
	background: #eee;
}

table.module-calendar td.next-month {
	background: #eee;
}

/* @end */

/* @group Catalogue and Products */

.shop-catalogue {
	background: #fff;
	border: 1px solid #ccc;
	float: left;
	height: 180px;
	margin: 0 6px 6px 0;
	overflow: hidden;
	width: 180px;
}

.shop-catalogue h4 {
	font-size: 12px;
	height: 27px;
	line-height: 27px;
	margin: 0;
	text-indent: 9px;
}

.shop-catalogue h4 a {
	color: #1969bc;
	text-decoration: none;
}

.shop-catalogue .image {
	/* Image size should be 150px by 120px */
	height: 120px;
	margin: 0 auto;
	overflow: hidden;
	padding: 15px;
	text-align: center;
}

.shop-main {
	margin-top: 18px;
}

.shop-main .header {
	border-bottom: 1px solid #eee;
	height: 27px;
	line-height: 27px;
	margin: 0 0 18px;
}

.shop-main .breadcrumbs {
	float: left;
	width: 40%;
}

.shop-main .cart-summary {
	float: right;
	width: 40%;
}

.shop-main .description ul {
	margin: 0 0 0 18px;
	padding: 0;
}

.shop-main .description li {
	list-style: square;
}

table.cartSummaryTable {
	border-collapse:collapse;
	border-spacing:0;	
	font-size: 12px;
	float: right;
}

td.cartSummaryItem {
	padding: 0;
}

a.cartSummaryLink {
	margin: 0 0 0 18px;
}

.shop-main ul {
	margin: 0;
	padding: 0;
}

.shop-main li {
	list-style: none;
}

table.catalogueTable {
	border-collapse:collapse;
	border-spacing:0;	
	width: 100%;
	margin: 0 0 18px;
}

table.catalogueTable td {
	padding: 0;
}

table.productTable {
	border-collapse:collapse;
	border-spacing:0;	
	table-layout: fixed;
	width: 100%;
}

table.productTable td {
	padding: 3px;
}

.shop-product-small {
	background: #fff;
	border: 1px solid #ddd;
	color: #666;
}

.shop-product-small h5 {
	font-size: 12px;
	font-weight: normal;
	margin: 0;
	min-height: 36px;
	padding: 18px 18px 6px;
}

.shop-product-small h4 a {
	color: #1969bc ;
}

.shop-product-small h5 a {
	text-decoration: none;
}

.shop-product-small ul {
	background: #f9f9f9;
	padding: 18px;
}

.shop-product-small ul li {
	font-size: 11px;
	margin: 0 0 6px;
}

.shop-product-small li.price {
	font-size: 11px;
}

.shop-product-small li.price strong {
	font-size: 14px;
	margin-left: 6px;
}

.shop-product-small li.stock {
	font-size: 11px;
}

.shop-product-small li.stock strong {
	color: #666;
	margin-left: 3px;
}

.shop-product-small .image {
	height: 120px;
	margin: 0 auto 9px;
	overflow: hidden;
	width: 120px;
	text-align: center;
}

.image a, td.actions a {
	border: none !important;
}

.shop-product-small li.quantity {
	line-height: 30px;
}

li.quantity img {
	position: relative;
	top: 8px;
	/* or vertical-align: middle; */
}

.shop-product-small li.quantity input.productTextInput {
	width: 50px;
}

.shop-product-small li.quantity input.productSubmitInput {
}

.shop-product-large {
	background: #fff;
	border: 1px solid #eee;
	color: #666;
	margin: 0 0 18px;
	min-width: 240px;
	overflow: hidden;
}

.shop-product-large h1 {
	color: #000;
	font-size: 14px;
}

.shop-product-large .image {
	margin-left: 36%;
	min-height: 360px;
	height: auto !important; /* for modern browsers */
	height: 360px; /* for IE5.x and IE6 */		
	padding: 18px;
	text-align: center;
}

.shop-product-large .shop-product-small .image {
 	margin: 0;
	min-height: 160px; 
	height: auto !important; /* for modern browsers */
	height: 160px; /* for IE5.x and IE6 */		
	padding: 18px;
	text-align: center;
	width: auto;
}

.shop-product-large .shop-product-small ul {
	padding: 9px;
}

.shop-product-large .shop-product-small ul, .shop-product-large .shop-product-small li  {
	margin: 0;
}

.shop-product-large li.price {
	font-size: 14px;
}

.shop-product-large li.instock {
	font-size: 10px;
}

.shop-product-large li.quantity input.productTextInput {
	width: 50px;
}

td.productItem .comment-form input#Captcha {
	width: 300px;
}

.poplets {
	border-top: 1px solid #eee;
	margin-top: 36px;
	padding: 9px 0;
}

.poplets img {
	border: 1px solid #ddd;
}

table.productPoplets {
	border-collapse:collapse;
	border-spacing:0;	
	margin: 0 auto;
}

.shop-product-large .details {
	background: #f9f9f9;
	float: left;
	min-height: 360px;
	height: auto !important; /* for modern browsers */
	height: 360px; /* for IE5.x and IE6 */	
	padding: 18px;
	width: 30%;
}

.shop-product-large ul {
	margin: 0 0 36px;
	padding: 0;
}

.shop-product-large li {
	margin: 9px 0;
}

.shop-cart .breadcrumbs {
	margin: 0 0 18px;
}

table.cart {
	background: #fff;
	border-collapse:collapse;
	border-spacing:0;	
	border: 1px solid #ddd;
	font-size: 11px;
	width: 100%;
}

table.cart td {
	vertical-align: top; /*to make sure the div stack line up at the top */
}

table.cart a {
	color: #1969bc;
}

table.cart th, table.cart td {
	color: #666;
	padding: 9px;
}

tr.val td {
	border-bottom: 1px solid #eee;
}

tr.shipping td {
	border-bottom: 1px solid #ddd;
}

tr.discount td.quantity, tr.shipping td.quantity {
	text-align: right;
}

td.quantity input.update {
	margin: 0 0 0 3px;
}

table.cart th {
	background: #f9f9f9;
	border-bottom: 1px solid #eee;
	color: #000;
	font-size: 11px;
	font-weight: normal;
	text-align: left;
}

input.cartInputText {
	width: 70px;
}

input#DiscountCode, input#GiftVoucher {
	width: 70px;
}

select.shippingDropDown {
	width: 150px;
}

table.cart th.quantity {
	text-align: right;
}

table.cart td.quantity {
	text-align: right;
}

.productitemcell {
	height: 23px;
	line-height: 20px;
	margin: 0 0 3px 0;
	overflow: hidden;
}

table.cart td.actions {
	text-align: right;
}

table.cart td.actions a {
	font-size: 12px;
	font-weight: bold;
	margin: 0 18px 0 0;
	text-decoration: none;
}

a#catshopclear {
	font-size: 10px;
	font-weight: normal;
}

table.cart strong {
	font-size: 14px;
}

.shop-form {
	margin: 0 0 18px;
}

.shop-form ul.form {
	background: #f9f9f9;
	border: 1px solid #eee;
	padding: 18px;
}

.shop-form label {
	font-size: 11px;
}

.shop-form ul.form li {
	margin: 0;
	padding: 9px 0;
}

.shop-form li.last {
	border-top: 1px solid #eee;
}

/*.shop-form .checkboxes {
	line-height: 27px;
}*/

input.PaymentMethodType {
	margin: 0 6px 0 0;
}

.shop-form ul.form input.cat_textbox,
.shop-form ul.form select.cat_dropdown,
.shop-form ul.form textarea.cat_listbox {
	width: 260px;
}

.shop-form textarea.cat_listbox {
	height: 100px;
}

.shop-receipt, .shop-quote-receipt {
	background: #f9f9f9;
	border: 1px solid #eee;
	margin: 18px;
	padding: 18px;
}

.shop-receipt h1, .shop-quote-receipt h1 {
	border-bottom: 1px solid #ccc;
	padding: 0 0 3px;
}

.shop-receipt h2, .shop-quote-receipt h2 {
	font-size: 12px;
	font-weight: normal;
}

/* @end */

/* @group Customer Cases */

table.case-list {
	border-collapse:collapse;
	border-spacing:0;	
	margin: 0;
	width: 100%;
}

table.case-list td {
	padding: 6px;
}

table.case-list td.subject,
table.case-list td.category {
	width: 40%;
}

table.case-list td.status {
	width: 20%;
}

table.case-details {
	background: #f9f9f9;
	border-collapse:collapse;
	border-spacing:0;	
	border: 1px solid #eee;
	width: 100%;
}

table.case-details td {
	padding: 6px;
}

table.case-details tr.odd td {
	background: #fff;
}

table.case-details td.var {
	color: #888;
	text-align: right;
	width: 130px;
}

table.case-details td.val {
	color: #000;
}

/* @end */

/* @group Customer Orders */

table.border {
	border-collapse:collapse;
	border-spacing:0;	
	border-right: 1px solid #eee;
	border-bottom: 1px solid #eee;
}

table.border td {
	border-top: 1px solid #eee;
	border-left: 1px solid #eee;
}

table.border span { color: #888; }

table.order-list {
	border-collapse:collapse;
	border-spacing:0;	
	width: 100%;
}

table.order-list td {
	border: 1px solid #eee;
}

table.order-list a {
	margin: 0 9px 0 0;
}

table.order-list span.number {
	font-size: 11px;
}

/* @end */

/* @group Comment */

.comment-container {
	background: #f9f9f9;
	border: 1px solid #eee;
	margin: 0 0 18px;
}

.comment-container .header {
	background: #eee;
	font-size: 11px;
	padding: 6px 18px;
}

.comment-container span.name {
	color: #000;
}

.comment-container span.rating {
	margin: 0 9px;
	vertical-align: middle;
}

.comment-container .content {
	padding: 18px;
}

.comment-form {
	background: #f9f9f9;
	border: 1px solid #eee;
	color: #666;
	margin: 0 0 18px;
	padding: 18px;
}

.comment-form h3 {
	font-size: 14px;
	margin: 0 0 18px;
}

.comment-form h5 {
	color: #666;
	font-size: 14px;
	margin: 0 0 18px;
}

/*.comment-form li.rating div {
	font-size: 10px;
}*/

/*.comment-form li.rating div input {
	margin: 0 3px;
}*/

.comment-form input.cat_textbox_small,
.comment-form textarea {
	width: 300px;
}

.comment-form textarea {
	height: 120px;
}

/* @end */

/* @group FAQ */

table.faq-search {
	background: #f9f9f9;
	border-collapse:collapse;
	border-spacing:0;	
	border: 1px solid #eee;
	margin: 0 0 18px 0;
	width: 100%;
}

table.faq-search label {
	color: #888;
}

table.faq-search td {
	border-collapse:collapse;
	border-spacing:0;	
	padding: 9px;
}

table.faqresultstable {
	background: #fff;
	border-collapse:collapse;
	border-spacing:0;	
	border: 1px solid #eee;
	width: 100%;
}

table.faqresultstable td {
	color: #666;
	padding: 9px;
}

table.faqresultstable a {
	color: #1969bc;
}

table.faqresultstable td.faqresultstableinfo {
	background: #f9f9f9;
	color: #888;
	font-size: 10px;
	padding: 3px 18px;
	text-align: right;
}

table.faqresultstable td.faqresultstablecount {
	padding-left: 18px;
	width: 10px;
}

td.faqresultstablehead {
	background: #fff;
	border-collapse:collapse;
	border-spacing:0;	
	border-bottom: 1px solid #eee;	
	color: #000;
	font-weight: bold;
}

/* @end */

/* @group Forums */

/* NOTE: div.post-list exists in BLOG as well */

.forum-container h1 {
	font-size: 24px;
}

table.topic-list, div.forum-posts-container div.post-list, div.forum-registration {
	color: #666;
}

div.forum-posts-container div.post-list a, div.forum-registration a {
	color: #1969bc;
}

div.forum-registration h2 {
	color: #000;
}

table.forum {
	background: #f9f9f9;
	border-collapse:collapse;
	border-spacing:0;	
	border: 1px solid #eee;
	margin: 0;
	width: 100%;	
}

table.forum td {
	font-size: 11px;
	padding: 9px;
	vertical-align: top;
}

table.forum td.topics {
	border-left: 1px solid #eee;
	border-right: 1px solid #eee;
	width: 90px;
}

table.forum td.posts {
	border-right: 1px solid #eee;	
	width: 90px;
}

table.forum td.lastpost {
	border-left: 1px solid #eee;	
	width: 180px;
}

table.forum .icon {
	float: left;
	width: 50px;
}

table.forum .forum {
	margin: 0 0 0 50px;
}

table.forum h3 {
	margin: 0;
}

table.forum h3 a {
	text-decoration: none;
}

ul.cap-top,
ul.cap-bottom {
	font-size: 11px;
	height: 30px;
	margin: 0 0 18px;
	padding: 0;
}

ul.cap-bottom {
	margin: 18px 0 0;
}

ul.cap-top li,
ul.cap-bottom li {
	display: block;	
	line-height: 30px;
	list-style: none;	
}

ul.cap-top li.user,
ul.cap-bottom li.nav-page {
	float: left;
	width: 200px;
}

ul.cap-top li.actions,
ul.cap-bottom li.actions
{
	float: right;
	font-size: 12px;
	text-align: right;
	width: 350px;
}

ul.cap-top li.actions a,
ul.cap-bottom li.actions a{
	float: right;
	margin: 0;
	padding: 0 9px;
}

table.topic-list {
	background: #f9f9f9;
	border-collapse:collapse;
	border-spacing:0;	
	border-left: 1px solid #eee;
	border-right: 1px solid #eee;
	width: 100%;
}

table.topic-list th {
	background: #ddd;
	border: 1px solid #ddd;
	color: #000;
	font-size: 10px;
	padding: 6px;
	text-align: left;
}

table.topic-list .name {
	font-weight: bold;
	width: 60%;
}

table.topic-list .name .icon {
	float: left;
	width: 30px;
}

table.topic-list .replies,
table.topic-list .views {
	font-size: 10px;
	text-align: center;
	width: 10%;
}

table.topic-list .date {
	font-size: 10px;
	text-align: right;
	width: 20%;
}

table.topic-list td {
	padding: 0;
}

table.topic-list a {
	color: #1969bc;
}

table.topic {
	border-collapse:collapse;
	border-spacing:0;	
	border-bottom: 1px solid #eee;;
	margin: 0;
	width: 100%;
}

table.topic td {
	padding: 9px;
}

table.topic td.name,
table.topic td.replies,
table.topic td.views {
	border-right: 1px solid #eee;
	vertical-align: middle;
}

.forum-registration {
	border: 1px solid #eee;
	background: #f9f9f9;
	padding: 18px;
}

.forum-registration input.cat_textbox,
.forum-registration textarea.cat_textbox {
	width: 260px;
}

.forum-registration input.cat_button {
	margin: 0 6px 0 0;
}

.forum-posts-container .breadcrumb {
	font-size: 11px;
	padding: 6px;
}

.forum-posts-container h1 {
	font-size: 18px;
	margin: 18px 0;
}

.forum-posts-container h2 {
	background: #eee;
	border: 1px solid #eee;
	color: #888;
	font-size: 10px;
	font-weight: normal;
	margin: 0;
	padding: 3px 18px;
}

.forum-posts-container table.container {
	border-collapse:collapse;
	border-spacing:0;	
	width: 100%;
}

.forum-posts-container td {
	background: #f9f9f9;	
	border: 1px solid #ddd;
	padding: 18px;
	vertical-align: top;
}

.forum-posts-container td.author {
	font-size: 11px;
	width: 160px;
}

.forum-posts-container h3.name {
	color: #000;
	font-size: 12px;
	font-weight: bold;
}

.forum-posts-container tr.sub td {
	height: 30px;
	padding: 0 18px;
}

.forum-posts-container td.action a {
	float: right;
	line-height: 30px;
}

/* @end */

/* @group Literature */

.literature-container {
	margin: 0 0 10px 0;
	border-bottom: #00B0CA dashed 1px;
	padding: 0 0 15px;
}

.literature-container p {
	margin: 0 0 5px 0;
}

.literature-container img {
	vertical-align: middle;
}

p.literature-container span.icon, p.literature-container span.name {
	margin: 0 3px 0 0;
}


/* @end */

/* @group Secure Zone Markup */

.case-search {
	background: #f9f9f9;
	border: 1px solid #eee;
	margin: 0 0 18px;
	padding: 18px;
}

.secure-lost-password {
	background: #f9f9f9;
	border: 1px solid #eee;	
	padding: 18px;
}

.secure-lost-password input.cat_textbox_small {
	width: 210px;
}

.secure-update-details {
	background: #f9f9f9;
	border: 1px solid #eee;
	margin: 0 0 18px;
	padding: 18px;
}

.secure-update-details input.cat_textbox,
.secure-update-details select.cat_dropdown {
	width: 260px;
}


/* @end */

/* @group Form Modules */

.product-form h3 {
	padding-left: 9px;
}

.secure-login, .newsletter-form {
	/*background: #f9f9f9;
	border: 1px solid #f2f2f2;
	margin-bottom: 18px;*/
	background-color: #f3f3f3;
	padding: 20px 20px 10px;
	border-bottom: 5px solid #00B0CA;
	float: left;
	color: #006778;
	margin: 0 0 40px;
}

.secure-login h3, .newsletter-form h3 {
	background: #eee;
	border-bottom: 1px solid #eee;
	font-size: 14px;
	margin: 0;
	padding: 6px 18px;
}

.secure-login div.form, .newsletter-form div.form {
	padding-left: 9px;
}

/* @end */

/* @group Search */

.search-box input.cat_textbox_small {
	margin: 0 3px 0 0;
}

/* @end */

/* @group Photo Gallery */

#imageContainer img {
	margin: 0;
}

table.photogalleryTable td {
	padding: 9px;
}

/* @end */

/* @group Affiliate Program */

table.affiliate-stats {
	border: 1px solid #d7d7d7;
	border-collapse: collapse;
}

table.affiliate-stats td {
	border: 1px solid #d7d7d7;
	padding: 6px;
}

table.affiliate-stats td.var {
	color: #888;
}

/* @end */

/* @group Tell a Friend */

.tell-a-friend {
	border: 2px solid #333;
	background-color: #fff;
	color: #666;
	padding: 18px;
}

.tell-a-friend form {
	padding: 0 0 0 36px;
}

.tell-a-friend  h1 {
	border-bottom: 1px solid #ccc;
	color: #222;
	font-size: 18px;
	margin: 0;
	padding: 0 0 6px;
}

.tell-a-friend  h2 {
	border-bottom: 1px dotted #ccc;
	color: #222;
	font-size: 12px;
	margin: 18px 0 9px;
}

.tell-a-friend  td.var {
	text-align: right;
	width: 130px;
}

.tell-a-friend td {
	font-size: 11px;
	vertical-align: top;
}

.tell-a-friend  label {
	color: #888;
	font-size: 11px;
}

.tell-a-friend  input.cat_textbox_small {
	height: 21px;
}

.tell-a-friend  input.cat_textbox_small, .tell-a-friend textarea.cat_listbox {
	font-size: 11px;
	width: 300px;
}

/* @end */

/* @group Favourites */

.favourite-registration {
	border: 1px solid #eee;
	background: #f9f9f9;
	padding: 18px;
}

.favourite-registration input.cat_textbox,
.favourite-registration textarea.cat_textbox {
	width: 260px;
}

.favrourite-registration input.cat_button {
	margin: 0 6px 0 0;
}


/* @end */

/* @group eCommerce Browse Panel */

.browse-panel {
	border: 1px solid #d7d7d7;
}

.browse-panel h5 {
	background: #eee url(/CatalystImages/shop_bg-browse-panel.png) repeat-x;
	border-bottom: 1px solid #d7d7d7;
	font-size: 14px;
	margin: 0;
	padding: 9px;
}

.browse-panel h6 {
	background: #f7f7f7;
	font-size: 11px;
	font-weight: bold;
	margin: 0;
	padding: 3px 9px;
}

.browse-panel ol {
	background: #fff;
	border-bottom: 1px solid #e7e7e7;
	margin: 0;
	padding: 9px;
}

.browse-panel ol.browse-catalogue {
	border-bottom: none;
}

.browse-panel li {
	list-style: none;
	padding: 3px 9px;
}

.browse-panel li span {
	display: inline;
	font-weight: bold;
}

/* @end */

/* @group eCommerce Image Zoom Slider */

img.drag {
	position: relative;
	padding: 0.5em;
	/*margin: 0 0 0.5em 1.5em;*/
	margin: 0;
	cursor: move;
}
 
.slidertrack {
    background-color: #d7d7d7;
    color: #333;
    float: left;
    margin: 0;
    line-height: 0px;
    font-size: 0px;
    text-align: left;
    padding: 4px;
    border: 1px solid;
    border-color: #ccc #aaa #aaa #ccc;
}
 
.slidertrack .sliderslit {
    background-color: #333;
    color: #ccc;
    height: 2px;
    margin: 4px 4px 2px 4px;
    line-height: 0px;
    position: absolute;
    z-index: 1;
    border: 1px solid;
    border-color: #999 #ddd #ddd #999;
}
 
.slidertrack .slider {
    width: 16px;
    background-color: #555;
    color: #333;
    position: relative;
    margin: 0;
    height: 8px;
    z-index: 1;
    line-height: 0px;
    font-size: 0px;
    text-align: left;
    border: 2px solid;
    border-color: #999 #222 #222 #999;
}
 
#zoomcontainer{
    overflow: hidden;
    position: relative;
}

#zoomcontainer img{
    position: absolute;
}


/* @end */

/* @group Web Apps */

/*pagination*/
ul.pagination {
	font-size: 11px;
	float: left;
	width: 700px;
	border-top: #00B0CA dashed 1px;
	padding: 10px 0 16px 0;
	margin: 0;
	background: none;
}

ul.pagination li {
	display: inline;
	list-style: none;
	color: #00B0CA;
	margin: 0 3px 0;
}


/* @end */

/*-------------------------------------SWITCHES CSS-------------------------------------*/

/*This is for elements whose default state is to be displayed*/
.visible_1 {display: none!important;}
.visible_0 {display: block!important;}

/*This is for elements whose default state is to be hidden*/
.invisible_0 { display: none!important;}
.invisible_1 { display: block!important;}

.visibleimg_1 {display: none!important;}
.visibleimg_0 {display: block!important;}

.clear {
	clear:both;
	}
.visible_1-grid-wide	{
	width:700px!important;
}
	
#microsite-back {display:none;}

.link-microsite #microsite-back {
	display: block!important;
	width: 940px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom:10px;
	}
	
	.link-microsite nav {
	display:none!important;
	}
.link-microsite #microsite-back a {
	background-color: #00B0CA;
	font-size: 18px;
	color: #FFF;
	display: block;
	width: 100px;
	padding-top: 20px;
	padding-right: 0;
	padding-bottom: 20px;
	padding-left: 0;
	text-align: center;
	}	


.link-microsite #search-menu, .link-microsite .search-box {
	display:none!important;
	}
	
/* Print styles!
-------------------------------------------------------------------------------*/
@media print {

}


/* Media queries!
-------------------------------------------------------------------------------*/

/* Consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/ */
@media screen and (max-device-width: 480px) {
	
		
}

@media all and (orientation: portrait) {
	
}

@media all and (orientation: landscape) {
	
}

