/* accessibility */
/* menu links accesskeys */
span.accesskey {
	text-decoration: none;
}
/* accessibility divs are hidden by default, text, screenreaders and such will show these */
.accessibility, hr {
/* position set so the rest can be set out side of visual browser viewport */
	position: absolute;
/* takes it out top side */
	top: -999em;
/* takes it out left side */
	left: -999em;
}
/* definition tags are also hidden, these are also used for accessibility menu links */
dfn {
	position: absolute;
	left: -1000px;
	top: -1000px;
	width: 0;
	height: 0;
	overflow: hidden;
	display: inline;
}
/* end accessibility */
/* wiki style external links */
/* external links will have "(external link)" text added, lets hide it */
a.external span {
	position: absolute;
	left: -5000px;
	width: 4000px;
}
a.external {
/* make some room for the image, css shorthand rules, read: first top padding 0 then right padding 12px then bottom then right */
	padding: 0 12px 0 0;
}
/* colors for external links */
a.external:link {
	color: #18507C;
/* background image for the link to show wiki style arrow */
	background: url(https://www.esandaengineering.com/uploads/NCleanBlue/external.gif) no-repeat 100% -100px;
}
a.external:visited {
	color: #18507C;
/* a different color can be used for visited external links */
/* Set the last 0 to -100px to use that part of the external.gif image for different color for active links external.gif is actually 300px tall, we can use different positions of the image to simulate rollover image changes.*/
	background: url(https://www.esandaengineering.com/uploads/NCleanBlue/external.gif) no-repeat 100% -100px;
}
a.external:hover {
	color: #18507C;
/* Set the last 0 to -200px to use that part of the external.gif image for different color on hover */
	background: url(https://www.esandaengineering.com/uploads/NCleanBlue/external.gif) no-repeat 100% 0;
	background-color: inherit;
}
/* end wiki style external links */
/* clearing */
/* clearfix is a hack for divs that hold floated elements. it will force the holding div to span all the way down to last floated item. We strongly recommend against using this as it is a hack and might not render correctly but it is included here for convenience. Do not edit if you dont know what you are doing*/
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clear {
	height: 0;
	clear: both;
	width: 90%;
	visibility: hidden;
}
#main .clear {
	height: 0;
	clear: right;
	width: 90%;
	visibility: hidden;
}
* html>body .clearfix {
	display: inline-block;
	width: 100%;
}
* html .clear {
/* Hides from IE-mac \*/
	height: 1%;
	clear: right;
	width: 90%;
/* End hide from IE-mac */
}
/* end clearing */
/* Stylesheet: Accessibility and cross-browser tools Modified On 2009-05-13 10:42:54 */
/***********  Esanda - layout stylesheet ***********/

/* reset */

* {
	margin: 0;
	padding: 0;
}

/*Set initial font styles*/

body {
	text-align: left;
	font-family: Arial, Helvetica, Geneva, sans-serif;
	font-size: 75.01%;
	line-height: 1em;
}

/*set font size for all divs, this overrides some body rules*/

div {
	font-size: 1em;
}

/*if img is inside "a" it would have borders, we don't want that*/

img {
	border: 0;
}

img.piclistimg {float:left; }

/*default link styles*/

/* set all links to have underline and bluish color */

a, a:link a:active {
	text-decoration: none;
	background-color: inherit;
	color: #006874;
}
a:visited {
	text-decoration: underline;
	background-color: inherit;
	color: #04a0dd;
}

/* remove underline on hover and change color */

a:hover {
	text-decoration: underline;
	background-color: inherit;
}

/*****************basic layout *****************/

body {
	margin: 0;
	padding: 0;
	color: #333;
	background: #eaf5f8;
}

div#pagewrapper {
        width: 972px;
	margin: 0 auto;
	background-color: #fefefe;
	color: black;
        padding: 10px 25px 0px 25px;
}

div#header {
	height: 130px;
	margin: 20px 0 0 0;
	padding: 0;
	background: url(https://www.esandaengineering.com/images/layout/header-bg.png) repeat-x 0 0;
}

div#header h1 a {
	display: block;
	height: 72px;
        width: 309px;
	text-indent: -999em;
	text-decoration: none;	
        background:  url(https://www.esandaengineering.com/images/layout/esanda-logo.png) no-repeat 0 0;
}

div#header h1 {
	margin: 0;
	padding: 0;
	line-height: 0;
	font-size: 0;
        background: url(https://www.esandaengineering.com/images/layout/esanda-logo.png) no-repeat 0 0;
}

div#strap{
        float: left; margin: -50px 0 0 5px;
width: 640px;
height: 44px; display: inline;
font-size: 1.4em;
font-style: italic;
color: #006874;
}

div#telno ul{list-style-type: none;
}

div#telno ul li {
        float: left;
	margin: 0px;
	padding: 0px;
}

div#telno ul li a img{
	margin: 5px 10px 0px 0px;
}


div#breadcrumbs {
	padding: 15px 0 10px 10px;
	font-size: 95%;
	margin: 0;
border-bottom: 1px dotted #ddd;
color: #777;
}

div#breadcrumbs.nocrumbs { display: none;}

div#breadcrumbs span.lastitem {
	font-weight: bold;
}

div#search {
	float: right;
	width: 194px;
	text-align: right;
	padding: 0.5em 0 0.3em 0;
	margin: -126px 0 0 0;
background: transparent url(https://www.esandaengineering.com/images/layout/search-bg.png) no-repeat right 2px;
border: 0px solid blue;
display: inline; position: relative;
z-index: 1;
}


div#search label {display: none;}

div#search input.search-input{background: none; color:#333; width: 157px; margin-right: 4px; border: none;}

input.search-button {
	height: 20px;
	width: 20px;
	padding: 0px;
	cursor: pointer;
	background: transparent;
        color: #fff;
margin-right: 3px;
border: none;

}

div#corporate {float: right; margin: -200px 270px 0 0;}
div#basket {float: right; margin: 10px;}
div#newsletter {float: right; margin: 12px 14px; color: #ccc;}

div#content {
	margin: 0.5em auto 2em 0;
	padding: 0px;
}


div#main {
	margin-left: 220px; 
        margin-right: 15px;  
	/* padding: 10px 20px 10px 10px; */
}

div#main.homeMain {
	width: 962px;
	padding: 0;
        margin: 10px 0 0 0;
	
}

div#main.main460 {
	width: 460px;
	margin-left: 20px; 
        margin-right: 0px;  
	/* padding: 10px 20px 10px 10px; */
float:left; display: inline;
}

div#main.main460center {
	width: 460px;
	margin-left: 20px; 
        margin-right: 0px;  
	/* padding: 10px 20px 10px 10px; */
float:left; display: inline;
}

div#contentleftcol {width: 430px; float: left; display: inline;}
div#contentrightcol {width: 204px; float: right; display: inline; border: 0px solid red;  padding: 0px 0px 0 10px; margin: 0 10px 0 10px;}

div#contentrightcol h2.bg {background: transparent url(https://www.esandaengineering.com/images/layout/h2-bg.png) repeat-x 0 0; padding: 0 20px 0 10px; margin-left: -10px;}

div#contentquotes {width: 194px; float: right; display: inline; border: 0px solid blue; margin-left: 10px; background: #bce3f6; padding: 0 15px 0 15px;}
div#contentquotesleft {width: 194px; float: left; display: inline; border: 0px solid blue; margin-left: 10px; background: #bce3f6; padding: 0 15px 0 15px;}
div#contentquotestopimage {height: 44px; background: #fff url(https://www.esandaengineering.com/images/layout/quotes-top2.png) no-repeat /*-15px 0px */ 0 0; margin-left: -15px; padding-left: 15px; width:194px;}
div#contentquotesbottomimage {height: 44px; background: transparent url(https://www.esandaengineering.com/images/layout/quotes-bottom.png) no-repeat -15px 0px; width: 200px;}  

div.quoteauthor {font-style:italic; color: #333;}

div#content div#main div#sliderWrapper {
	width: 972px;
        padding: 0px 0 0 0px;
        margin: -10px 0 0 0;
        height: 262px;
	background: #006874;
display: block;
border-top: 1px solid white;
}


div#sliderWrapper.landing {
        height: 262px;
	background: #004F58;
}


div#sliderText{
	width: 275px;
        padding: 0px 0 0 0;
        margin: 22px 13px 0 12px;
        height: 262px;
        color: #fff;
float: right;
display: inline;
font-size: 135%;
line-height: 240%;
}

div#sliderText.landing{
	width: 300px;
        height: 262px;
        color: #fff;
}

div#sliderText a{
        color: #fff;
font-style: italic;
text-decoration: none;
}

div#sliderText p{
line-height: 160%;
margin-bottom: 1em;
}

div#sliderImage{
	width: 654px;
        padding: 0;
        margin:0;
        height: 262px;
        color: #000;
float: left;
display: inline;
background: #e6e6e6;
}

div#sliderImage.landing{
	width: 654px;
        height: 262px;
        margin:0 0;
}

div#main div#sliderImage ul li {margin: 0; padding: 0; list-style: none;}

div#content div#sliderImage li.simplesliderImage span.bottom h3{color: #000; margin: 0; padding: 0; line-height: 0.5em; border: 0; font-size: 1.3em;}
li.simplesliderImage span.bottom {font-size: 140%; color: #000;}
a.slidelink {color: #000; text-decoration: none;}

div#content div#sliderText h2{
margin-bottom:20px;
color: white;
text-decoration: none;
border: none;
}


#homeBoxWrapper{
width: 972px;
}



div.homeBox {
       width: 306px;
       margin-right: 20px;
       float: left;
      display: inline;
       border: 0px solid red;
}

div#homeBox3.homeBox, div#homeBox6.homeBox {
       margin-right: 7px;
      margin-left: 0px;
padding: 0;
       float: right;
      display: inline;
}



div#content #homeBoxWrapper .homeBox h2{
margin-bottom: 20px;
}

#homeBox3.homeBox h3 a{
/* color: #222; */
}


#courselist {background-color: rgb(210,237,243); padding: 2%; height: 100%;}
#content #courselist h3 {margin-bottom: 15px;  border-bottom: 1px solid white; padding-bottom: 5px; padding-left:2%;}
#courselist2 {float:right; }
.courselist  {width:44%; display: inline-block;  padding: 0% 2% 0% 2%; border: 0px solid red;clear:left;}


div#footer {
	padding: 0px;
	color: #888888;
        height:50px;
clear: both;
margin-top: 15px;

background:  url(https://www.esandaengineering.com/images/layout/footer-bg.png) no-repeat 0 0;
}

div#footer p {
	padding: 0px;
        margin: 0;
}

#footer-address{
	width:330px;
	float:left;
display: inline;
margin: 13px 0px 10px 10px;
border: 0px solid red;
padding: 0;
text-align: left;
}

div#footer #footer-address p{
line-height: 200%;

}

#footer-paypal{
	width:136px;
	float:left;
display: inline;
margin: 8px 0 0 14px;
border: 0px solid red;
padding: 0;
text-align: center;
}

#footer-links{
text-align:right;
float: right;
width: 350px;
display:inline;
margin-top: 65px;
}

#footer-links a{
margin: 0;
padding: 0;
color: #00b3ff;
text-decoration: none;
}


#copyright{

	padding-top:5px;
        width: 70%;
float: left; 
display: inline;
color: #777;
border: 0px solid red;
margin: 3px 0 0 5px;
}

div#copyright p{
	padding:0px;
	margin:0px;
}

#website-design{ 
	padding-top:5px;
float: right; display: inline;
        width: 20%;
color: #777;
margin: 3px 5px 0 0;
border: 0px solid red;
text-align: right;
}


/* as we hid all hr for accessibility we create new hr with div class="hr" element */

div.hr {
	height: 1px;
	padding: 1em;
	border-bottom: 1px dotted black;
	margin: 1em;
}

div.divider {
        height: 1px;
	padding: 2px 0 2px 0;
	margin: 0 0 5px 0;
border-top: 1px dotted #ccc;

}

div.left49 {
	width: 70%;
       display: none;
}
div.right49 {
	float: right;
	width: 29%;
	text-align: right;
       display: none;
}

/********************COLUMN LAYOUT*********************/
.col-1-4, .col-1-3 {float: left; display: inline-block; margin-bottom: 10px;}
.col-1-4 {width: 25%; }
.col-1-3 {width: 33.33%;}
.caption h4 {padding:5px 5px 5px 2px; white-space:normal;}

.thumbnail {display:block;line-height:1.42857143;background-color:#fff;}

.thumbnail a>img,.thumbnail>img {padding: 2px; border:1px solid #ddd;}
.thumbnail a>img:hover, .thumbnail>img:hover {border-color:#04a0dd}


/********************CONTENT STYLING*********************/
/* HEADINGS */
div#content h1 {
	font-size: 2em;
	line-height: 1em;
	margin: 0;
}
div#content h2 {
	color: #333;
	font-size: 1.6em;
	text-align: left;
        line-height: 1.5em;
	margin: 0 0 0.5em 0;
        border-bottom:0px solid #bbb;
	font-weight:normal;
}

div#content div.homeBox h2, div#content div.abouthomeBox h2{
	font-weight:normal;
	padding-bottom:5px;
	/* color:#0070b1; */
	border-bottom:0px solid #bbb;
	font-size: 1.5em;

}

div#content div.homeBox h2{
margin-bottom: 0px;

}

div#content div.homeBox h2 a{
       text-decoration: none;
color: inherit;
}

div#content div.homeBox h2 a:hover{
       text-decoration: underline;
}


div#content h2 div.homeBox {font-size: 1.5em; }


div#content h3 {
	color: #333;
	font-size: 1.4em;
	line-height: 1.3em;
	margin: 0 0 0.5em 0;
        border-bottom: 0px solid #ccc;
	font-weight:normal;

}

div#content h3 a {
       text-decoration: none;
}

div#content h3 a:hover {
       text-decoration: underline;
}

div#sliderText h3 {
	color: #fff;
        border: 0;
}

p.infoBox {margin-left: 10px; margin-bottom: 8px;}

div#content h4 {
	color: #333;
	font-size: 1em;
	line-height: 1.3em;
	margin: 0 0 0.25em 0;
}
div#content h5 {
	color: #333;
	font-size: 1.1em;
	line-height: 1.3em;
	margin: 0 0 0.25em 0;
}
h6 {
	color: #333;
	font-size: 1em;
	line-height: 1.3em;
	margin: 0 0 0.25em 0;
}
/* END HEADINGS */
/* TEXT */
p {
/* default p font size, this is set different in some other divs */
	font-size: 1em;
/* some air around p elements */
	margin: 0 0 1.5em 0;
	line-height: 1.6em;
	padding: 0;
}
blockquote {
	border-left: 0px solid #ddd;
	margin-left: 20px;
}
strong, b {
/* explicit setting for these */
	font-weight: bold;
}
em, i {
/* explicit setting for these */
	font-style: italic;
}

/* Separating the divs on the template explanation page */
div.templatecode {
	margin: 0 0 2.5em;
}
/* END TEXT */
/* LISTS */
/* lists in content need some margins to look nice */
div#main ul,
div#main ol,
div#main dl {
	font-size: 1.0em;
	line-height: 1.4em;
	margin: 0 0 1.5em 0;
}
div#main ul li,
div#main ol li {
   margin: 0 0 0.25em 10px;
   list-style-type: none;
   background: url(https://www.esandaengineering.com/images/layout/list-picon.png) no-repeat left 4px;
   padding-left: 16px;

}

/* END LISTS */

/* CONTACT FORM */

table.contactform {margin: 10px 0px 10px 0px; width: 240px;}

.contactform fieldset {padding: 10px 0 10px 0; background-color: transparent; border: 0;} 
.contactform fieldset legend {font-weight: bold; display: none;} 
.contactform div , .booking_form div {width: 460px; padding: 0.25em 0 0.25em 0;} 
.contactform div label {display: block; width: 240px; text-align: right; float: left; margin-right: 8px; height: 22px; line-height: 22px;} 
.contactform div.required , .booking_form div.required {color: #111;} 
.contactform div.required input, textarea , .booking_form div.required input,{width: 230px;} 
.contactform div.submit { 
   margin: 0px 0px 10px 120px;
   padding: 10px 0px 10px 0px;
   width: 220px; 
text-align: right;

} 



.contactform div.opt-out {margin-top: 12px;}

.contactform div.opt-out label {display: inline; float: left; text-align: left; width: 390px;   line-height: 22px; height: 50px; margin-left: 10px;} 

.contactform div.opt-out input {float: left; display: inline; line-height: 22px; margin-top: 5px;} 

/*** membership radio buttons ***/

.contactform div.membership-selection div {display: block; width: 80%; clear: both; margin-left: 100px; margin-bottom: 5px;}

.contactform div.membership-selection div label {display: inline; text-align: left; width: 160px; } 

.contactform div.membership-selection div input {display: inline; line-height: 22px; width: 10px; margin-top: 3px;} 

/*** membership radio buttons ***/

.contactform div.marketing label {display: block; width: 190px; text-align: right; float: left; margin-right: 8px; height: 22px; line-height: 22px; } 

div.error_message, div.fb_invalid {color:red; weight: bold; }

div.CurrentMembership, div.marketing, div.agegroup {margin-bottom: 10px;}


/* END CONTACT FORM */

div.productListDivider { height: 1px; background:url(/images/layout/dividing-dots.png) repeat-x; margin: 1px 0 10px 0; clear:left;}
span.shopPrice {font-size: 120%; color: #d10000; }
span.shopPriceDetail {font-size: 150%; color: #d10000; }

/* TABLES */

#coursetable table.coursedates {width: 100%; margin-bottom: 10px; border: 0px solid red; padding: 0px; border-collapse:collapse;}

#coursetable table td {border-top: none; border-right: none; border-bottom: 1px solid #ccc; padding: 10px; }

#coursetable table th {border-bottom: 1px solid #76CEDD; font-weight: bold; padding: 10px;}
#coursetable table thead td {border-bottom: 1px solid #76CEDD; font-weight: bold; padding: 10px;}

/* BOOKING FORM */

.booking_form div {width: 460px; padding: 0.25em 0 0.25em 0;} 
.booking_form div.required {color: #111;} 

.booking_form .hiddenfield {display: none;}
.booking_form h3 {display: block; background-color: #d2edf3; clear: both;}

.booking_form div.required.paymentradio label, 
.booking_form div.required.course-selection label{display: block; line-height: 22px;} 
.booking_form div.required.paymentradio input, .booking_form div.required.course-selection input  {line-height: 22px; margin-top: 4px;} 

.booking_form fieldset {padding: 10px 0 10px 0; background-color: transparent; border: 0;} 

.booking_form div label {display: block; width: 225px; text-align: right; float: left; margin-right: 8px; height: 22px; line-height: 22px;}

.booking_form div.courseterms label {display: block; width: 400px; text-align: left; float: right; margin-right: 8px; height: 22px; line-height: 22px; }

.booking_form div.courseterms input {margin-left: 30px; margin-top: 4px;}

.booking_form div.submit { 
   display: block;
clear: both;
text-align: center;
margin-top: 40px;

} 

/***********  BS buttons ***********/

{
  box-sizing: border-box;
}

/* Line 5 */
button, input, optgroup, select, textarea
{
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  font-family: inherit;
  font-style: inherit;
  font-weight: inherit;
  font-size: inherit;
  line-height: inherit;
  font-size-adjust: inherit;
  font-stretch: inherit;
  font-feature-settings: inherit;
  font-language-override: inherit;
  font-kerning: inherit;
  font-synthesis: inherit;
  font-variant-alternates: inherit;
  font-variant-caps: inherit;
  font-variant-east-asian: inherit;
  font-variant-ligatures: inherit;
  font-variant-numeric: inherit;
  font-variant-position: inherit;
  color: inherit;
}

/* Line 5 */
button
{
  overflow-x: visible;
  overflow-y: visible;
}

/* Line 5 */
button, select
{
  text-transform: none;
}

/* Line 5 */
button, html input[type="button"], input[type="reset"], input[type="submit"]
{
  cursor: pointer;
}

/* Line 5 */
input, button, select, textarea
{
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

/* Line 5 */
.btn
{
  display: inline-block;
  padding-top: 6px;
  padding-right: 12px;
  padding-bottom: 6px;
  padding-left: 12px;
  margin-bottom: 0px;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.42857;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  cursor: pointer;
  background-image: none;
  border-top-width: 1px;
  border-right-width-value: 1px;
  border-bottom-width: 1px;
  border-left-width-value: 1px;
  border-top-style: solid;
  border-right-style-value: solid;
  border-bottom-style: solid;
  border-left-style-value: solid;
  border-top-color: transparent;
  border-right-color-value: transparent;
  border-bottom-color: transparent;
  border-left-color-value: transparent;
  border-image-source: none;
  border-image-slice: 100% 100% 100% 100%;
  border-image-width: 1 1 1 1;
  border-image-outset: 0 0 0 0;
  border-image-repeat: stretch stretch;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
}

/* Line 5 */
.btn-info
{
  color: #ffffff;
  background-color: #5bc0de;
  border-top-color: #46b8da;
  border-right-color-value: #46b8da;
  border-bottom-color: #46b8da;
  border-left-color-value: #46b8da;
border: 0;
}

/* Line 5 */
.btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn.focus:active, .btn.active.focus
{
  outline-width: thin;
  outline-style: dotted;
  outline-offset: -2px;
border: 0;
}

/* Line 5 */
.btn:hover, .btn:focus, .btn.focus
{
  color: #333333;
  text-decoration-line: none;
  text-decoration-style: solid;
}

/* Line 5 */
.btn:hover, .btn:focus, .btn.focus
{
  color: #333333;
  text-decoration-line: none;
  text-decoration-style: solid;
}

/* Line 5 */
.btn-info:hover, .btn-info:focus, .btn-info.focus, .btn-info:active, .btn-info.active, .open > .dropdown-toggle.btn-info
{
  color: #ffffff;
  background-color: #31b0d5;
  border-top-color: #269abc;
  border-right-color-value: #269abc;
  border-bottom-color: #269abc;
  border-left-color-value: #269abc;
border: 0;
}

/* Line 5 */
.btn-info:hover, .btn-info:focus, .btn-info.focus, .btn-info:active, .btn-info.active, .open > .dropdown-toggle.btn-info
{
  color: #ffffff;
  background-color: #31b0d5;
  border-top-color: #269abc;
  border-right-color-value: #269abc;
  border-bottom-color: #269abc;
  border-left-color-value: #269abc;
border: 0;
}
.center.width640  {text-align: center; margin: 10px auto; max-width: 640px;}
#main .center.width640 h2  {text-align: center; max-width: 640px;}
.btn-info.full-width {width: 100%; margin: 10px auto;}


/* Stylesheet: esanda : layout Modified On 2016-06-29 17:26:40 */
/********************
      Side MENU
*********************/

div#sidebar {
	float: left;
	width: 210px;
	display: inline;
	margin: 0px 0px 0px 0px;
	padding: 0px;
}

div#sidebar div#menu {
	margin: 29px 0 0 0px;
	padding: 0;
width: 210px;
}


/* menu li block */
#menu li, .navi li {
   list-style: none;
   margin: 0;
   border-bottom: 0px solid #c0c0c0;
   display: block;
font-size: 100%;
 line-height: 1.2em;
}

#menu ul ul li {
   border: none;
}

/** fix stupid ie bug with display:block; **/
* html #menu li a { height: 1%; } 
* html #menu li hr { height: 1%; }
/** end fix **/


#menu ul{
   border: none;
padding:0px;
margin-top:0px;
margin-left:0px;


}

/* first level links */
div#menu a {
	text-decoration: none;
	color: #333;
        background-color: #f1f1f1;
	display: block;
	margin: 0;
	padding: 10px 2px 10px 10px;
font-weight: normal;
border-bottom: 1px solid #fff;
}


/* menuactive */
div#menu ul li.menuactive a.menuactive{
	color: #999;
        background-color: #f1f1f1;
}

/* 
active parent, that is the first-level parent 
of a child page that is the current page 
*/
div#menu li a.activeparent {

}

div#menu li.currentpage a.active {
	color:#ED008C;
}


/* hover state for all links */
div#menu a:hover,
div#menu li a.activeparent:hover, 
div#menu li.currentpage a.active:hover, div#menu>ul.menu.menuitem.accordion>li.sectionheader-accmenu>a:hover  {
	color: white;
        background-color: #006874;
}

div#menu a.activeparent:hover{
	color:white;
	background:#16b5ec;
}


/* section header */
div#menu li.sectionheader{
   border-right: none;
   border-bottom:1px solid white;
   font-size: 100%;
   font-weight: bold;
   padding: 1.2em 0 1.2em .60em;
   background-color: #76cedd;
   line-height: 1em;
   margin: 20px 0 0 0;
   text-align: left;
}

/* section header */
div#menu>ul.menu.menuitem.accordion>li.sectionheader-accmenu>a {
   background-color: #76cedd;
   border-bottom:1px solid white;
}


/* separator */
div#menu li.separator {
   height: 1px !important;
   margin-top: -1px;
   margin-bottom: 0;
   padding:2px 0 2px 0;
   background-color: #000;
   overflow:hidden !important;
   line-height:1px !important;
   font-size:1px; /* for ie */
}

div#menu li.separator hr {
   display: none; /* this is for accessibility */
}

#menu a.menuhead {
	padding-right: 0px; 
	display: block; 
	font-weight: bold; 
	margin: 0px; 
	color: #631829; 
	background: #E3CDD3;
	padding: 2px 5px 2px 20px;
	border-bottom: #ffffff 1px solid; 
	text-decoration: none; 
       /*voice-family: inherit;*/
}
#menu a.menuhead:hover {
	color:white;
	background-color:#ED008C;
}






/* Stylesheet: esanda : sidenav Modified On 2016-03-21 00:37:20 */
/* by Alexander Endresen and mark and Nuno */

#otherNav{
float:right; display:inline;
	margin: -195px 0px 0px 0px;
}

#otherNav.menu_horiz li{
	float: left;
	margin: 0px;
	padding: 0px;
}

#otherNav.menu_horiz li a{
	font-size: .8em;
	font-weight: normal;
	color: #777;
	padding: 10px  ;
	display: block;
	text-decoration: none;
}

#otherNav.menu_horiz li.lastone a{
	padding: 10px 0px 10px 10px ;
}

#otherNav.menu_horiz li a:hover{
	color: #333;
	text-decoration: underline;
}

.menu_horiz {
	margin: auto auto;
	padding: 0;
text-align:center;
font-family: Tahoma, Arial, Verdana, sans-serif;
}

#menu_horiz {
	margin: auto auto;
	padding: 0;
text-align:center;
font-family: Tahoma, Arial, Verdana, sans-serif;
}
.clearb {
/* needed for some browsers */
	clear: both;
}
#menuwrapper {

/* IE6 Hack */
height: 1%;
width: auto;
margin: 0;
	padding: 0 0 0 0;
background: #d2edf3 url(/images/layout/topnav-bg6.png) repeat-x 0 0; 
}
ul#primary-nav, ul#primary-nav ul, #otherNav.menu_horiz ul{
/* remove any default bullets */
	list-style-type: none;
	margin: 0;
	padding: 0;
}
ul#primary-nav {
        padding-top: 0px;
	padding-left: 0px;
background: #d2edf3;
}
ul#primary-nav ul {
/* make the ul stay in place so when we hover it lets the drops go over the content below else it will push everything below out of the way */
	position: absolute;
/* top being the bottom of the li it comes out of */
	top: auto;
/* keeps it hidden till hover event */
	display: none;
/* same size but different color for each border */
	border-top: 0px solid #C8D3D7;
	border-right: 0px solid #C8D3D7;
	border-bottom: 0px solid #ADC0C7;
	border-left: 0px solid #A5B9C0;
}
ul#primary-nav ul ul {
/* now we move the next level ul down from the top a little for distinction */
	margin-top: 1px;
/* pull it in on the left, helps us not lose the hover effect when going to next level */
	margin-left: -1px;
/* keeps the left side of this ul on the right side of the one it came out of */
	left: 100%;
/* sets the top of it inline with the li it came out of */
	top: 0px;
}
ul#primary-nav li{
	float: left;
	margin: 0px;
	padding: 0px;
}




/* coloured nav items : #18bed2 #58c7d9 #76cedd #8dd5e2 #a4dce9 #bbe4ee d2edf3 */

ul#primary-nav li#menuid15  {background: #18bed2;} /* 1 home */
ul#primary-nav li#menuid57  {background: #58c7d9;} /* 2 about */
ul#primary-nav li#menuid59  {background: #76cedd;} /* 3 training */
ul#primary-nav li#menuid60  {background: #8dd5e2} /* 4 clients */
ul#primary-nav li#menuid61  {background: #a4dce9;} /* 5 partners */
ul#primary-nav li#menuid83  {background: #bbe4ee;} /* 6 contact */
ul#primary-nav li#menuid83 a { } /* 6 contact */


#primary-nav li li {
/* Set the width of the menu elements at second level. Leaving first level flexible. */
	width: 220px;
/* removes any left margin it may have picked up from the first li */
	margin-left: 0px;
/* keeps them tight to the one above, no missed hovers */
	margin-top: -1px;
/* removes the left float set in first li so these will stack from top down */
	float: none;
/* relative to the ul they are in */
	position: relative;
}
/* set the "a" link look here */
ul#primary-nav li a {
	font-size: 1em;
	font-weight: bold;
	color: #004f5a;
	padding: 10px 37px 12px 37px  ;
	display: block;
	text-decoration: none;
}

ul#primary-nav li li a {
        text-shadow: 0px 0px 0px #000;
}
ul#primary-nav li a:hover {
/* kind of obvious */
	background: #ddd;
	color: #111;
}
ul#primary-nav li li a:hover {
	color: #FFF;
}
ul#primary-nav li a.menuactive {
	background: #006874;
	color: #fff;
	font-weight: bold;


}
ul#primary-nav li a.menuactive:hover {
	color: #fff;
/* keep it the same */
	font-weight: bold;
}
#primary-nav li li a.menuparent span {
/* makes it hold a shape */
	display: block;
/* set your image here, right arrow, 98% over from the left, 100% or 'right' puts it to far */
	background:  url(https://www.esandaengineering.com/uploads/ngrey/parent.png) no-repeat 98% center;
}
/* gif for IE6, as it can't handle transparent png */
* html #primary-nav li li a.menuparent span {
/* set your image here, right arrow, 98% over from the left, 100% or 'right' puts it to far */
	background:  url(https://www.esandaengineering.com/uploads/ngrey/parent.gif) no-repeat 98% center;
}
ul#primary-nav li ul a {
/* insures alignment */
	text-align: left;
	margin: 0px;
/* keeps it relative to it's container */
	position: relative;
/* less padding than first level no need for large links here */
	padding: 6px 3px 6px 15px;
/* if first level is set to bold this will reset this level */
	font-weight: normal;
/* first level is #FFF/white, we need black to contrast with light background */
	color: #000;
	border-top: 0 none;
	border-right: 0 none;
	border-left: 0 none;
}
ul#primary-nav li ul {
/* very lite grey color, by now you should know what the rest mean */
	background: #F3F5F5;
	margin: 0px;
	padding: 0px;
	position: absolute;
	width: auto;
	height: auto;
	display: none;
	position: absolute;
	z-index: 999;
	border-top: 1px solid #FFFFFF;
	border-bottom: 1px solid #374B51;

}
ul#primary-nav li ul ul {

}
/* Styling the appearance of menu items on hover */
#primary-nav li:hover,
#primary-nav li.menuh,
#primary-nav li.menuparenth,
#primary-nav li.menuactiveh {
	color: #01bfff;
}
/* The magic - set to work for up to a 3 level menu, but can be increased unlimited, for fourth level add
#primary-nav li:hover ul ul ul,
#primary-nav li.menuparenth ul ul ul,
*/
#primary-nav ul,
#primary-nav li:hover ul,
#primary-nav li:hover ul ul,
#primary-nav li.menuparenth ul,
#primary-nav li.menuparenth ul ul {
	display: none;
}
/* for fourth level add
#primary-nav ul ul ul li:hover ul,
#primary-nav ul ul ul li.menuparenth ul,
*/
#primary-nav li:hover ul,
#primary-nav ul li:hover ul,
#primary-nav ul ul li:hover ul,
#primary-nav li.menuparenth ul,
#primary-nav ul li.menuparenth ul,
#primary-nav ul ul li.menuparenth ul {
	display: block;
}
/* IE6 Hacks */
#primary-nav li li {
	float: left;
	clear: both;
}
#primary-nav li li a {
	height: 1%;
}
/* Stylesheet: esanda : topnav Modified On 2014-02-16 19:51:58 */
