/* reset css */
body{margin: 0; font-family: 'robotoregular'; font-weight: normal; font-size: 14px; color: #333; background: #FFF; cursor: default;}
input, select, fieldset, textarea, button{font-family: 'open_sansregular'; font-weight: normal; font-size: 14px; border: 0; outline: 0; resize: none; color: #333; transition: all 0.5s;}
p{margin: 0; padding: 2px 0; font-weight: normal; font-size: 14px; font-family: 'robotoregular'; color: #333;}
img{border: none; outline: none;}
a{display: inline-block; text-decoration: none; outline: none; cursor: pointer; transition: all 0.4s;}
ul, ol, li{padding: 0; margin: 0; list-style: none; font-family: 'robotoregular';}
.clear{clear: both;}
/* -- heading -- */
h1, h2, h3, h4, h5, h6{margin: 0; font-family: 'ralewayregular';}
h1{font-size: 24px;}
h2{font-size: 20px;}
h3{font-size: 16px;}
/* --under-line-- */
.under-line{margin: 4px 0; width: 100%; height: 1px; overflow: hidden; border-bottom: 1px dashed #ccc;}
/* --fix-wrapper-- */
.fix-wrapper{margin: 0 auto; width: 1000px;}
@media screen and (max-width: 1000px){
    .wrapper .top-cntr{width: 1000px;}
    .wrapper .hdr-cntr{width: 1000px;}
    .wrapper .nav-cntr{width: 1000px;}
    .wrapper .sdr-cntr{width: 1000px;}
    .wrapper .txt-cntr{width: 1000px;}
    .wrapper .ftr-cntr{width: 1000px;}
    .wrapper .sdr-cntr-inn{width: 1000px;}
    .wrapper .txt-cntr-inn{width: 1000px;}
    .wrapper .contno-cntr{width: 1000px;}
    .wrapper .cont-cntr{width: 1000px;}    
}
/* --fonts-- */
@font-face {
	font-family: 'open_sansregular';
	src: url('../fonts/opensans-regular-webfont.eot');
	src: url('../fonts/opensans-regular-webfont.eot?#iefix') format('embedded-opentype'),
	 url('../fonts/opensans-regular-webfont.woff2') format('woff2'),
	 url('../fonts/opensans-regular-webfont.woff') format('woff'),
	 url('../fonts/opensans-regular-webfont.svg#open_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'ralewayregular';
    src: url('../fonts/Raleway-Regular-webfont.eot');
    src: url('../fonts/Raleway-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Raleway-Regular-webfont.woff2') format('woff2'),
         url('../fonts/Raleway-Regular-webfont.woff') format('woff'),
         url('../fonts/Raleway-Regular-webfont.svg#ralewayregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'robotoregular';
    src: url('../fonts/Roboto-Regular-webfont.eot');
    src: url('../fonts/Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Roboto-Regular-webfont.woff') format('woff'),
         url('../fonts/Roboto-Regular-webfont.svg#robotoregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
/*--------------------------------------------index page css--------------------------------------------*/
/*--------------------------nav-cntr---------------------*/
.nav-cntr{width: 100%; background-color: #86ceda; border-top: 2px solid #FDFDFD;}
	/*----------------------nav-Box----------------------*/
	.nav-Box{padding: 0px 0 10px; display: block;}
    .nav-Box ul{padding-left: 2px;}
    .nav-Box li{padding: 0 2px; float: left;}
    .nav-Box li a{padding: 14px 0; width: 138px; color: #FFF; background-color: #69c2d2; text-align: center; text-transform: uppercase; border-radius: 0 0 10px 10px;}
    .nav-Box li a:hover, .nav-Box li a.active{padding-top: 20px; color: #339999; background-color: #FDFDFD;}
/*--------------------------sdr-cntr---------------------*/
.sdr-cntr{width: 100%; background-color: #86ceda;}
	/*----------------------sdr-Box----------------------*/
	.sdr-Box{padding-top: 10px; display: block;}
    .sdr-lft{padding: 14px 0px 0; width: 264px; float: left; text-align: center;}
    .sdr-rgt{margin-right: 10px; width: 700px; height: 280px; float: right; position: relative;}
    .sdr-lft a{color: #FFF; font-size: 34px; text-transform: uppercase; text-shadow: 0 2px 2px #339999;}
    .sdr-rgt .verticalslider{position: absolute;}
    ul.sdr-item{padding: 10px 0 0 60px;position: absolute; display: block; top: 0; left: 0; z-index: 9999;}
    ul.sdr-item li{padding: 10px 0 10px 35px; height: auto !important; display: block; position: static; background: url(../img/tick.png) no-repeat left center; font-size: 18px; text-transform: uppercase; font-family: 'ralewayregular'; color: #666;}
    p.sdr-para{margin-left: -40px; padding-bottom: 10px; font-size: 20px; text-transform: uppercase; color: #339999;}
/*----------------------txt-cntr----------------------*/
.txt-cntr{padding: 7px 0 22px; width: 100%; border-bottom: 1px solid #f5f5f5;}
	/*----------------------txt-Box----------------------*/
	.txt-Box{display: block;}
    .txt-lft{width: 280px; float: left;}
    .txt-lft h3{text-transform: uppercase;}
    .txt-lft li{padding: 1px 0; background-color: #f2f2f2;}
    .txt-lft li:first-child{padding: 0px 0 1px;}
    .txt-lft li a{padding: 6px 10px 6px 45px; display: block; color: #666; background: url(../img/arrow.png) no-repeat 20px center #f9f9f9;}
    .txt-lft li a:hover{background-position: 26px center; color: #339999; background-color: #f3f3f3;}
    .txt-rgt{margin-bottom: 2px; padding-top: 64px; width: 700px; float: right;}
	.txt-rgt h2{margin-bottom: 20px; font-size: 24px; color: #339999; line-height: 22px; text-transform: uppercase; font-weight: normal; font-family: 'open_sansregular';}
	.txt-rgt p{padding: 5px 0; text-align: justify;}
	.txt-rgt a{float: right; padding: 5px 20px; margin-top: 16px; background-color: #eaeaea; color: #339999; border-radius: 2px; box-shadow: inset 0 0 2px #999;}
	.txt-rgt a:hover{background-color: #339999; color: #FFF; box-shadow: none;}
/*----------------------txt-cntr----------------------*/
.txt-btm-cntr{padding: 20px 0; width: 100%; background: #fbfbfb;}
	/*----------------------txt-Box----------------------*/
	.txt-btm-Box{display: block;}
    .txt-btm-Box li{padding: 0 16px; float: left;}
    .txt-tile{padding-bottom: 5px; width: 300px; display: block; text-align: center; overflow: hidden;}
    .txt-btm-Box li .txt-tile h2{margin-bottom: 15px; padding-bottom: 2px; border-bottom: 2px solid #99cc33; font-weight: normal; text-transform: uppercase; font-family: 'robotoregular'; color: #777; text-align: left; transition: all 0.5s;}
    .txt-btm-Box li:nth-child(2) .txt-tile h2{border-bottom: 2px solid #ffcc33;}
    .txt-btm-Box li:nth-child(3) .txt-tile h2{border-bottom: 2px solid #ff6633;} 
    .txt-tile img{margin-bottom: 15px; width: 296px; box-shadow: 0 0 2px #999; border-radius: 4px; overflow: hidden; transition: all 0.5s;}
    .txt-tile p{padding-bottom: 20px; color: #555; text-align: left;}
    .txt-tile a{float: right; margin-right: 2px; padding: 5px 20px; background: #399; color: #FFF; border-radius: 14px; box-shadow: 0 2px 0px #DDD;}
    .txt-tile a:hover{background: #86ceda; color: #399; box-shadow: none;}
    .txt-btm-Box li:hover .txt-tile h2{border-bottom: 2px solid #399; color: #399;}
    .txt-tile:hover img{box-shadow: 0 0 2px #399;} 
    .txt-tile input{margin-bottom: 5px; padding: 5px 10px; width: 276px; border-radius: 3px; border: 1px solid #EEE; color: #999; background: #f8f8f8;}
    .txt-tile textarea{margin-bottom: 23px; padding: 4px 10px; width: 276px; height: 150px; border-radius: 3px; border: 1px solid #EEE; color: #999; background: #f8f8f8;}
    .txt-tile button{float: right; margin-right: 2px; padding: 4px 26px; background: #399; color: #FFF; border-radius: 14px; box-shadow: 0 2px 0px #DDD; cursor: pointer;}
    .txt-tile button:hover{background: #86ceda; color: #399; box-shadow: none;}
    .txt-tile input:focus{border-color: #86ceda; color: #333; background: #FFF;}
    .txt-tile textarea:focus{border-color: #86ceda; color: #333; background: #FFF;}
/* ------------------------------ftr-cntr------------------------------ */
.ftr-cntr{width: 100%; background: #333; text-shadow: 0px 1px 0px #222; border-top: 2px solid #399;}
	/* ---------------------ftr-Box--------------------- */
    .ftr-Box{display: block; padding-bottom: 10px; background: #333; font-size: 12px;}
    .ftr-Box h2{padding: 10px 0 7px 5px; margin-bottom: 5px; font-size: 16px; font-weight: normal; color: #888; border-bottom: 1px solid #666;}
    .ftr-Box p{color: #399; font-size: 12px; text-align: right;}
    .ftr-Box p a{color: #399; transition: all 0.5s;}
    .ftr-Box p a:hover{color: #86ceda;}
    .ftr-Box li{padding-left:2%; width: 235px; float: left; transition: all 0.5s;}
    .ftr-Box li:first-child{padding: 0;}
    .footer-nav li{clear: both;}
    .footer-nav li:first-child{padding: 0 0 0 4px;}
    .footer-nav li a{padding: 0 2px 0 16px; color: #399; background: url(../img/arrow1.png) no-repeat 0 4px; transition: all 0.5s;}
    .footer-nav li a:hover{color: #86ceda; background: url(../img/arrow.png) no-repeat 4px 4px;}
    .black{color: #888;}
    .social-base ul{text-shadow: 0px 1px 0px #000;}
    .social-base li{padding: 4px 0; width: 162px; margin-left: 37px;}
    .social-base li:first-child{padding: 4px 0;}
    .social-base li:nth-child(1) a{background-image: url(../img/social1.png); background-repeat: no-repeat; background-position: 10px  center;}
    .social-base li:nth-child(2) a{background-image: url(../img/social3.png); background-repeat: no-repeat; background-position: 10px  center;}
    .social-base li:nth-child(3) a{background-image: url(../img/social4.png); background-repeat: no-repeat; background-position: 10px  center;}
    .social-base li:nth-child(4) a{background-image: url(../img/social2.png); background-repeat: no-repeat; background-position: 10px  center;}
    .social-base li a{padding: 5px 2px 5px 10px; color: #399; width: 150px; background-color: #222; text-align: center; display: block; border-radius: 3px; transition: all 0.5s;}
    .social-base li a:hover{background-color: rgba(0,0,0,0.1); color: #86ceda; box-shadow: inset 0 0 2px #000;}
    .ftr-cntr-btm{width: 100%; background: #111; text-shadow: 0px 1px 0px #000;}
    .ftr-btm-Box{display: block; background: #111;}
    .ftr-btm-Box p{padding: 4px 0; text-align: center; font-size: 12px; color: #666;}
    .ftr-btm-Box p a{color: #666; transition: all 0.5s;}
    .ftr-btm-Box p a:hover{color: #399;}
/*--------------------------------------------inner page css--------------------------------------------*/
.sdr-cntr-inn{padding-bottom: 10px; width: 100%; background-color: #86ceda; border-bottom: 1px solid #339999;}
	.sdr-Box-inn{text-align: center;}
    .sdr-Box-inn a{padding: 10px 0 0 0; margin: 0 8px; float: left;}
    .sdr-Box-inn p{padding-top: 25px; }
    .sdr-Box-inn a{color: #FFF; font-size: 38px; text-transform: uppercase; text-shadow: 0 2px 2px #339999;}
.txt-cntr-inn{padding: 25px 0; width: 100%;}
	.txt-Box-inn{display: block; min-height: 300px;}
    .txt-lft-inn{width: 280px; float: left;}
	.txt-Box-inn h2{margin-bottom: 10px; padding: 0 10px 2px; font-weight: normal; color: #339999; border-bottom: 1px dashed #86ceda; text-transform: uppercase;}
	.txt-Box-inn p{padding: 0 10px 6px 10px; text-align: justify;}
    .txt-lft-inn h3{text-transform: uppercase;}
    .txt-lft-inn li{padding: 1px 0; background-color: #f2f2f2;}
    .txt-lft-inn li:first-child{padding: 0px 0 1px;}
    .txt-lft-inn li a{padding: 6px 10px 6px 45px; display: block; color: #666; background: url(../img/arrow.png) no-repeat 20px center #f9f9f9;}
    .txt-lft-inn li a:hover{background-position: 26px center; color: #339999; background-color: #f3f3f3;}
    .txt-rgt-inn{width: 700px; float: right;}
	.txt-rgt-inn h2{margin-bottom: 10px; padding: 0 10px 2px; font-weight: normal; color: #339999; border-bottom: 1px dashed #86ceda; text-transform: uppercase;}
	.txt-rgt-inn p{padding: 0 10px 6px 10px; text-align: justify;}
    .bold{font-weight: bold; font-family: "Arial Black", Gadget, sans-serif;}
    .txt-rgt-inn li{padding: 10px 10px; float: left;}
    .prod-tile{width: 213px; display: block; overflow: hidden; text-align: center; border-radius: 4px; background-color: #f8f8f8; box-shadow: 0 0 2px #86ceda; transition: all 0.3s;}
    .prod-tile h3{padding: 10px 0; font-weight: normal;}
    .prod-tile img{margin: 2px; width: 209px; height: 200px; display: block; box-shadow: 0 0 1px #CCC; border-radius: 4px; transition: all 0.3s;}
    .interest{float: left; padding: 10px 0; width: 213px; background-color: #86ceda; color: #FFF; text-shadow: 0 1px 1px #399; transition: all 0.3s;}
    .contact{float: left; padding: 10px 0; width: 213px; background-color: #399; color: #FFF; text-shadow: 0 1px 1px #666;}
    .prod-tile a{width: 426px; overflow: hidden; text-transform: uppercase;}
    .prod-tile:hover a .interest{margin-left: -213px;}
    .prod-tile:hover h3{color: #399;}
    .prod-tile:hover{box-shadow: 0 0 2px #399;}
    .prod-tile:hover img{transform: scale(1.04); box-shadow: none;}
    .serv-img{margin: 20px 24px 0;}
    img.serv-img{border-radius: 5px; box-shadow: 0 0 3px #999;}

/*------------------------------------contact enquiry pages------------------------------------*/
.cont-cntr{padding: 25px 0; width: 100%;}
	.cont-Box{padding: 0 40px; display: block;}
	.cont-Box .lft-cntr{width: 300px; min-height: 260px; background: url(../img/img-shadow.png) no-repeat center bottom; float: left;}
	.cont-Box .rgt-cntr{width: 580px; float: right;}
	.cont-Box .lft-cntr h2{padding-left: 2px; padding-bottom: 4px; font-weight: normal; color: #339999; border-bottom: 1px dashed #86ceda; text-transform: uppercase;}
	.cont-Box .rgt-cntr h2{margin-bottom: 15px; padding-bottom: 4px; padding-left: 2px; font-weight: normal; color: #339999; border-bottom: 1px dashed #86ceda; text-transform: uppercase;}
    .cont-Box .rgt-cntr iframe{width: 576px; height: 200px; float: right; border: 1px solid #DDD;}
	/*------------------form-Box------------------*/
	.form-Box{width:662px; display: block; margin: 0 auto;}
	.form-Box h2{margin-bottom: 15px; padding-bottom: 4px; font-weight: normal; color: #339999; border-bottom: 1px dashed #86ceda; text-transform: uppercase;}
	.text-field{display: block; margin-bottom: 5px;}
	.form-Box input[type="text"]{padding: 10px 10px; width: 640px; height: 16px; border-radius: 2px; border: 1px solid #D4D4D4; background: #fff;}
	.form-Box input[type="email"]{padding: 10px 10px; width: 640px; height: 16px; border-radius: 2px; border: 1px solid #D4D4D4; background: #fff;}
	.form-Box input[type="tel"]{padding: 10px 10px; width: 640px; height: 16px; border-radius: 2px; border: 1px solid #D4D4D4; background: #fff;}
	.form-Box textarea{padding: 10px 10px; margin-bottom: 10px; width: 640px; height: 100px; font-size: 14px; border-radius: 2px; border: 1px solid #D4D4D4; background: #fff;}
	.form-Box input[type="button"]{padding: 6px 40px; float: right; cursor: pointer; color: #FFF; transition: all 0.5s; border-radius: 2px; background: #339999; border: 1px solid transparent;}
	.form-Box input[type="button"]:hover{background: #86ceda;}
	.form-Box input:focus{border: 1px solid #86ceda;}
	.form-Box textarea:focus{border: 1px solid #86ceda;}
	/*------------------add-Box------------------*/
	.adrs-Box{display: block;}
	.adrs-detail{display: block;}
	.adrs-info{margin: 10px 0; display: block;}
	.adrs-lft{float: left; width: 90px; text-align: right;}
	.adrs-rgt{float: right; width: 200px;}
	.adrs-rgt li{padding: 0; font-size: 14px; background-image: none;}
	.adrs-rgt li:hover{color: inherit;}
	.adrs-lft .bg-tel{padding: 0px 0 5px 5px; font-size: 14px;}
	.adrs-lft .bg-email{padding: 0px 0 5px 5px; font-size: 14px;}
	.adrs-lft .bg-add{padding: 0px 0 5px 5px; font-size: 14px;}
	.adrs-rgt li a{display: inline-block; color: #339999;}
	.adrs-rgt li a:hover{color: #333;}
    #cssmenu ul,
#cssmenu li,
#cssmenu a {
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
  font-weight: normal;
  text-decoration: none;
  line-height: 1;
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  position: relative;
}
#cssmenu a {
  line-height: 1.3;
}
#cssmenu {
  width:100%;
  background: #fff;
}
#cssmenu > ul > li {
  margin: 0 0 2px 0;
}
#cssmenu > ul > li:last-child {
  margin: 0;
}
#cssmenu > ul > li > a {
  font-size: 16px;
  display: block;
  color: #fff;
  background: #339999;
  font-family: 'ralewayregular';
  text-transform:uppercase;
  font-weight:normal;
  outline:none;
}
#cssmenu > ul > li > a > span {
  display: block;
  padding: 10px 10px;
}
#cssmenu > ul > li > a:hover {
  text-decoration: none;
}
#cssmenu > ul > li.active {
  border-bottom: none;
}
#cssmenu > ul > li.active > a {
  background: #339999;
  color: #fff;
}
#cssmenu > ul > li.active > a span {
 
}
#cssmenu > ul > li.has-sub > a span {
  background: url(../img/icon_plus.png) 98% center no-repeat;
}
#cssmenu > ul > li.has-sub.active > a span {
  background: url(../img/icon_minus.png) 98% center no-repeat;
}
/* Sub menu */
#cssmenu ul ul {
  display: none;
}
#cssmenu ul ul li {
 background:#f2f2f2;
}
#cssmenu ul ul a {
  display: block;
  color: #595959;
  padding: 10px 10px 10px 45px;
  font-size: 13px;
  font-weight: bold;
}
#cssmenu ul ul a:hover {
  color: #339999;
}