/* here's the box... the image is the upper-left corner */
.box, .watermark {
  width: auto;
  height: auto;
  position: relative;
  margin: 1em auto auto auto;
  background: #DCEEC7 url(../img/cnr-tl.gif) no-repeat;
  padding: 0 12px 18px 12px;
}

#contentMain .box a, #contentMain .box a:visited {
	color: #111;
	}

.watermark {
  background: #DCEEC7 url(../img/bg-watermark.gif) no-repeat;
  background-position: 50% 55%;
	}

/* these are the other three spans. classes were used to allow multiuse on a page */
.tl, .tr, .bl, .br {
  position: absolute;
  width: 3px;
  height: 3px;  /* corner images are 40x40 */
  overflow: hidden;
  display: block;
  /*margin-bottom : -1px;*/  /* this is for IE */
}

/* change position and image: top-right */
.tl {
  background: url(../img/cnr-tl.gif) no-repeat;
  top: 0;
  left: 0;
}


/* change position and image: top-right */
.tr {
  background: url(../img/cnr-tr.gif) no-repeat;
  top: 0;
  right: 0;
}

/* change position and image: bottom-left */
.bl {
  background: transparent url(../img/cnr-bl.gif) no-repeat;
  bottom: 0;
  left: 0;
}

/* change position and image: bottom-right */
.br {
  background: transparent url(../img/cnr-br.gif) no-repeat;
  right: 0;
  bottom: 0;
}

ul.services {
	margin: 0;
	padding: 0;
	}

ul.services li {
	position: relative;
	margin-left: 0;
	padding-left: 20px;
	background: transparent url(../img/bg-check-green.gif) no-repeat;
	}
	
.box * {
	color: #222;
	}
	
.box h3 {
	margin-bottom: .6em;
	padding-top: 12px;
	line-height: 1.4em;
	color: #5C9718;
	}	
	
.wrapperPage .box h4 {
	margin-left: 0;
	}	
	
/*--- MENU ----*/

#wrapperMenu.box {
	margin-top: 0;
	width: 200px;
	padding: 0 0 14px 0;
	}