/* reset */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del,
dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td
{margin:0; padding:0; border:0; font-weight:inherit; font-style:inherit; font-size:100%; font-family:inherit}

/* common */
ul {list-style-type:disc; margin:0 0 10px 20px}
	ul li {list-style-type:disc; margin:0 0 5px 0}
ol {list-style-type:decimal; margin:0 0 10px 20px}

em {font-style:italic}

p {margin:0 0 10px 0}
h1, h2 {font-size:20px; font-weight:normal}
h1.underline {border-bottom:1px solid #fff; position:relative; padding:0 0 3px 0; margin:0 0 20px 0}
	h1.underline a {position:absolute; right:-7px; bottom:-15px}
h1.underline_blue {border-bottom:1px solid #b2c5d8; position:relative; padding:0 0 3px 0; margin:0 0 20px 0}
	h1.underline_blue a {position:absolute; right:-7px; bottom:-15px}
	

/* links */
a {color:#fff; text-decoration:none; outline:none}
a:hover {color:#c3db51}
a.link {color:#c3db51; text-decoration:underline; outline:none}
a img {border:none}

/* forms */
/*input, textarea, select {padding:5px 5px; margin:-3px 0; border:1px solid #6e7c9d; font:14px Arial; color:#c3db51}
*/input, textarea, select {padding:3px 5px; margin:-5px 0; border:1px solid #6e7c9d; font:12px Arial; color:#c3db51}
textarea {overflow-y:scroll}
input.chck {background:none !important; border:none !important; padding:0 !important; margin:0 !important}

.btn {display:inline-block; height:45px; padding:0 10px 0 0; overflow:hidden; background:url(../img/btn-r.png) no-repeat 100% 0}
	.btn input {height:45px; padding:0 10px 15px 20px; font-size:15px; color:#333; margin:0; border:none; cursor:pointer; background:url(../img/btn-l.png) no-repeat 0 0 !important; overflow:visible}
.btn1 {display:inline-block; width:172px; height:54px; overflow:hidden; color:#263c53; text-decoration:underline; text-align:center; font-size:16px; line-height:42px; background:url(../img/btn1.png) no-repeat 0 0}
	.btn1:hover {background-position:0 -54px; color:#263c53}

/* GT. 09.01.11 -- start*/
.btn2 {display:inline-block; width:212px; height:54px; overflow:hidden; color:#263c53; text-decoration:underline; text-align:center; font-size:16px; line-height:42px; background:url(../img/btn2.png) no-repeat 0 0}
	.btn2:hover {background-position:0 -54px; color:#263c53}
/* GT. 09.01.11 -- end*/


/* login */
#content .login {width:245px; margin:auto; position:relative; background:url(../img/bluebox-t.png) no-repeat 0 0; padding:50px 0 3px}
	#content .greenbox.login {background-image:url(../img/greenbox-t.png); padding-top:65px}
	#content .login {text-align:center}
	
	#content .login label, #content .login input {margin:0; padding:0}
	#content .login label {display:block; text-align:left}
	#content .login input {margin:5px 0 20px; padding:5px; font-size: 20px; width:195px}
	#content .greenbox.login input {border-color:#6d9142; background-color:#465a28}
	#content .login .btn input {margin:0; padding:0 10px 15px 20px; font-size:14px; width:auto; overflow:visible}
	
	#content .login p {text-align:left; line-height:130%; margin:-10px 0 20px}
	#content .login p a {color:#8da3bb; border-bottom:1px dashed #8da3bb; font-size:12px}
	#content .login p a:hover {color:#adc7e2; border-bottom:1px dashed #adc7e2}
	
	#content .login .tab {background:none; left:0; width:100%}
	#content .greenbox.login .tab {line-height:75px}
	#content .login > div > div > div {background:none}
	
	#content .login .choice {position:absolute; top:42px; text-align:left; left:-230px; height:50px; line-height:50px; text-indent:15px; color:#fff; font:21px/50px Arial; width:223px; background:url(../img/btn225-Blue.png) no-repeat 0 -50px}
	#content .login .choice + .choice {top:95px}    
	#content .login .choice:hover {background-position:0 -100px}
	#content .login .choice.selected {background-position:0 0; color:#c6de54}

/* main */
html {min-height:100%; overflow-y:auto}
/*html {min-height:100%; overflow-y:auto; background:#fff url(../img/page-top.gif) repeat-x 0 0}*/
body {font:15px Arial; color:#fff; min-height:100%; background:url(../img/page-bottom.gif) repeat-x 0 100%}
/*#body {position:relative; width:978px; padding:10px; margin:auto}*/
#body {position:relative; width:993px; padding:10px; margin:auto}

/* layout style */
.header {position:relative; height:123px; background:url(../img/header.gif) no-repeat 0 0}
	.header .header-content {padding:20px 90px 0 0; text-align:right; font-size:13px}
	.header .logo1login {position:absolute; left:33px; top:33px}
	.header .logo1 {position:absolute; left:33px; top:17px}
	/*.header .logo2 {position:absolute; right:10px; bottom:12px}*/
	.header .logo2 {position:absolute; right:10px; bottom:28px}
	.header .verRef {position:absolute; right:10px; bottom:12px;}

	.header .login {position:absolute; top:10px; right:10px; padding:10px; background:#273d54}
	.header a {color:#b2c5d8}
	.header .login a {color:#c7e352; text-decoration:underline}

#content {height:1%; padding:30px 0}
.leftcol {float:left; width:645px}
.rightcol {float:right; width:320px}
.col200 {width:200px}
.col350 {width:350px}






/* elements style */
.bluebox {position:relative; padding:40px 0 0 0; margin:0 0 20px 0; background:url(../img/bluebox-lt.gif) no-repeat 0 0;
    top: -2px;
    left: 0px;
}
	.bluebox > div {background:url(../img/bluebox-lb.gif) no-repeat 0 100%; height:1%}
	.bluebox > div > div {background:url(../img/bluebox-rb.gif) no-repeat 100% 100%}
	.bluebox > div > div > div {background:url(../img/bluebox-rt.gif) no-repeat 100% 0}
	.bluebox .tab {position:absolute; top:0; left:20px; height:45px; line-height:40px; padding:0 20px 0 0; font-size:20px; background:url(../img/bluebox-tab.gif) no-repeat 100% 0}
	.bluebox .content {padding:20px; height:1%}
	.bluebox .tab .arrow {position:absolute; top:-17px; left:50%; margin-left:-27px}
	
	.bluebox table.grid tr td > div {background:#344e69 url(../img/tr-bg.gif) repeat-x 0 100%; border-top:1px solid #42576f; border-bottom:1px solid #42576f}
	.bluebox table.grid tr td:first-child > div {border-left:1px solid #42576f}
	.bluebox table.grid tr td:last-child > div {border-right:1px solid #42576f}
	.bluebox table.grid tr td.last-child > div {border-right:1px solid #42576f}
	.bluebox table.grid tr:hover td > div, .bluebox table.grid tr.active td > div {border-color:#6e7c9d; background:#344d68 url(../img/grid-item-hov.gif) repeat-x 0 100%}
	.bluebox table.grid tr.active .arr-on-act {background-position:100% 50%}
	.bluebox table.grid tr:hover, .bluebox table.grid tr.active {color:#c3db51; cursor:default}
	.bluebox table.grid tr.dotted td > div {border-style:dashed; border-color:#6e7c9d}
	.bluebox table.grid tr.clean td > div {background-image:none}
	
	.bluebox input, .bluebox textarea, .bluebox select {background:#2d3f52}
	
.greenbox {position:relative; padding:40px 0 0 0; margin:0 0 20px 0; background:url(../img/greenbox-lt.gif) no-repeat 0 0}
	.greenbox > div {background:url(../img/greenbox-lb.gif) no-repeat 0 100%; height:1%}
	.greenbox > div > div {background:url(../img/greenbox-rb.gif) no-repeat 100% 100%}
	.greenbox > div > div > div {background:url(../img/greenbox-rt.gif) no-repeat 100% 0}
	.greenbox .tab {position:absolute; top:0; left:20px; height:45px; line-height:40px; padding:0 20px 0 0; font-size:20px; background:url(../img/greenbox-tab.gif) no-repeat 100% 0}
	.greenbox .content {padding:20px; height:1%}
	
	.greenbox table input, .greenbox table textarea, .greenbox table select {background:#465a28; border:none; padding:7px; margin:-3px 0}

.bluesubbox-top {padding:0 10px 0 0; height:10px; line-height:0; font-size:0; background:url(../img/bluesubbox-rt.gif) no-repeat 100% 0}
	.bluesubbox-top > div {height:10px; line-height:0; font-size:0; background:url(../img/bluesubbox-lt.gif) no-repeat 0 0}
.bluesubbox-bottom {padding:0 10px 0 0; height:10px; line-height:0; font-size:0; background:url(../img/bluesubbox-rb.gif) no-repeat 100% 100%}
	.bluesubbox-bottom > div {height:10px; line-height:0; font-size:0; background:url(../img/bluesubbox-lb.gif) no-repeat 0 100%}
.bluesubbox {background:#2b4157; padding:10px; font-size:12px}
	.bluesubbox-heading {text-align:center}
	.bluesubbox-heading span {display:inline-block; height:48px; padding:8px 10px 0 10px; background:url(../img/bluesubbox-heading.gif) no-repeat 50% 100%; color:#fff; font-weight:bold; font-size:16px}
	
.image-gallery {width:271px; margin:-5px 0; overflow:hidden; position:relative; height:81px}
	.image-gallery .arrow-left {position:absolute; left:0; top:0; z-index:1}
	.image-gallery .arrow-right {position:absolute; right:0; top:0; z-index:1}
	.image-gallery ul, .image-gallery ul li {padding:0; margin:0; list-style:none}
	.image-gallery ul {padding:1px; margin:0 0 0 17px; height:77px; border:1px solid #6e7c9d; left:-78px; position:relative; width:10000px}
	.image-gallery ul li {float:left; margin:0 1px 5px 0}

.total {padding:7px; background:#1e2e3d; color:#b2c5d8; text-align:right; margin:0 0 10px 0}
	.total .text {float:left}

/* tables */
table tr td, table tr th {padding:5px; white-space:nowrap}
table tr td:first-child, table tr th:first-child {padding-left:0}
table tr:first-child td, table tr:first-child th {padding-top:0}
table tr td:last-child, table tr th:last-child {padding-right:0}
table tr td.last-child, table tr th.last-child {padding-right:0}
table tr:first-child td input {margin-top:0}

table.grid {}
	table.grid tr th {font-weight:bold; text-align:left; font-size:13px; padding:0 0 5px 7px; color:#c6de54}
	table.grid tr th:first-child {padding-left:8px}
	table.grid.normal {}
	table.grid.normal tr th {font-weight:normal; color:#b2c5d8; font-size:15px}
	table.grid tr td {padding:0}
	table.grid tr td > div {padding:7px; margin-top:2px}
	table.grid tr:first-child td > div {margin:0}
	table.grid a {display:block}
	table.grid .arr-on-act {display:block; padding:0 20px 0 0; background:url(../img/arrow-green.gif) no-repeat 0 -100px}

table.userinfo {font-size:13px}
	table.userinfo tr {vertical-align:top}
	table.userinfo tr.separator td {padding-bottom:22px; background:url(../img/tr-separator.gif) repeat-x 0 100%}
	table.userinfo tr.separator + tr td {padding-top:22px}
	
.bluesubbox table tr th {font-weight:bold; color:#b2c5d8; font-size:13px; text-align:left; border-bottom:1px solid #3a5065}
.bluesubbox input {margin:0}
.bluesubbox .chck-with-text {display:inline-block; padding:7px 10px; background:#32475d; margin-left:-10px}

/* misc */
.fleft {float:left}
.fright {float:right}
.fclear {clear:both; height:0; font-size:0; line-height:0; overflow:hidden}
.clear {clear:both}
.value {color:#c3db51}
.description {color:#b2c5d8}
.hide {display:none}
.show {display:block !important}


/* water_catchment stuff*/
.questionHint
{
    display:none !important;
}


dl.permissionsCol1{
	float: left;
	width:220px;
	margin-right: 20px;
	overflow:hidden;
	font-size: 15px;
	padding-top: 3px;
}
dl.permissionsCol2{
	float: left;
	width:360px;
	/*line-height:20px;*/
	font-size: 15px;
	padding-top: 3px;
}


.permissionsCol2 dt,
.permissionsCol1 dt{
	float: left;
	clear:left;
	width: 105px;
	height:24px;   /* GT. 29-05-20118*/
	overflow:hidden;
	color: #b8c1cb;
	margin-bottom: 12px;
}
.permissionsCol2 dt{
	width: 185px;
}
.permissionsCol2 dd,
.permissionsCol1 dd{
	float: left;
	width: 110px;
	color: #b2ce53;
	padding:0 0 0 5px;
	margin-bottom: 12px;
	
}
.permissionsCol2 dd{
	width: 170px;
}


.switch{
	clear:both;
	overflow:hidden;
	position:relative;
}
* html .switch{
	height:1%;
}
.selector {
	padding: 0;
	float: left;
	overflow: visible;
	position: relative;
	text-decoration: none;
    margin: 0 20px 0 10px;
}
.switch .active{
	background:url("../img/backgrounds/tip_right_long.gif") no-repeat 100% 0;
	margin:0 20px 0 10px;
}
* html .switch .active{
	margin-left: 3px;
	height: 1%;
}
.selector span{

	margin:0 0 0 -10px;
	padding: 11px 12px 24px;
	display: block;
	color: #ffffff;
	z-index: 2;
	overflow: hidden;
	position: relative;
	float:left;
}
.switch .active span{
	background:url("../img/backgrounds/tip_left.gif") no-repeat 0 0;
}
* html .selector span{
	float: left;
	margin:0 0 0 -6px;
}
.selector strong{
	width:22px;
	height: 11px;
	display:block;
	position: absolute;
	bottom: 0;
	left: 50%;
	margin:0 0 0 -11px;
}
* html .selector strong{
	top: 40px;
}
.switch .active strong{
	background: url("../img/backgrounds/center_tip.gif") no-repeat 0 0;
}


.selector b{
	display:block;
	background: url("../img/backgrounds/select_bul.gif") no-repeat 0 100%;
	height: 18px;
	display:block;
	float: left;
	float:left;
	padding: 0 0 0 22px;
	font-weight: normal;
	color:#ffffff;
}
.switch .active b{
	background-position: 0 0;
	color: #c6de54;
	font-weight:bold;
}

.wide{
	padding: 28px 0 0;
	overflow:hidden;
	clear: both;
	position:inherit;
}
h3.selector{
	font-size: 21px;
}
.switch h3.active span {
	padding: 7px 20px 20px;
	width: 565px;
	text-align:center;
	color: #aac253;
}


.question{
	position:absolute;
	top: 0;
	right: 10px;
	display:block;
	background:url("../img/backgrounds/icon.png") no-repeat 0 0;
	width:20px;
	height:20px;
	text-decoration: none;
	overflow:hidden;
	text-indent: -2000px;
}
.question:hover{
	background-position: 0 -20px;
}
h3.selector .question{
	top: 10px;
}


.columns3 .label{
	width: 230px;
}
.columns3 input{
	width:70px;
}

.columns50 input{
	width:50px;
}

.columns40 input{
	width:40px;
}

.columns3Wide input{
	width:185px;
}

table .blue{
	color:#b2c5d8 !important;
}

table .darkblue{
	color:#798fa6 !important;
}

table .darkgreen{
	color:#849860 !important;
}


.center{
	text-align:left; width: 140px;
	padding:0;
}

.center1{
	text-align:left; width: 65px;
	padding:0;

}

.center2{
	text-align:left; width: 60px;
	padding:0;

}
.transparent input{
	border: 1px solid #30465D;
	background-color:#30465D;
	color: #849860;

	}


.font12{
  font-size:12px;
  text-align:left;
}

/* Tool tips */
.tooltipBox{
	background:url("../img/backgrounds/tool_bot.png") no-repeat 0 100%;
	width: 306px; /*width: 306px;*/
	position:absolute;
	margin:0;
	/*bottom: 0;*/
	left: 0;
	z-index: 500;
  
}
.tooltipBg{
	background:url("../img/backgrounds/tool_top.png") no-repeat 0 0;
	width: 266px; /*width: 266px;*/
	position:relative;
	margin: -32px 0 0;
	padding: 20px 20px 40px;
	min-height:90px;
	color:#474c51;
	font-size: 12px;
	line-height: 19px;
}
.tooltipBg .close{
	width:13px;
	height: 13px;
	display:block;
	position:absolute;
	background:url("../img/backgrounds/close.gif") no-repeat 0 0;
	top: 17px;
	right: 20px;
}
.tooltipBg h3{
	color:#4076af;
	border-bottom:1px solid #d1dde8;
	clear:both;
	padding: 0 0 5px;
	overflow:hidden;
	margin-bottom: 5px;
	font-size: 13px;
}
.questionHint
{
    display:none !important;
}

.bigTooltipInfo{
	
	background:url("../img/backgrounds/tool_bot2.png") no-repeat 0 100%;
	width: 409px; /*width: 409px;*/
	z-index: 500;
}
.bigTooltipInfo .tooltipBg{
	background:url("../img/backgrounds/tool_top2.png") no-repeat 0 0;
	width: 369px; /*width: 369px;*/

}

.bigTooltip{
	
	background:url("../img/backgrounds/tool_bot3.png") no-repeat 0 100%;
	width: 449px; /*width: 449px;*/
	z-index: 500;
}
.bigTooltip .tooltipBg{
	background:url("../img/backgrounds/tool_top3.png") no-repeat 0 0;
	width: 409px; /*width: 409px;*/

}

/* Edit/import */
a.link2{color:#4076af; text-decoration:underline; outline:none;font-size:13px}
.import{color:#333; font-size:13px;}


.w25{width:75%;}

/* Jumper button */
.btn3 {display:inline-block; padding:0 14px 0 0; height:28px; color:#c6de54; text-decoration:none; font-size:12px; line-height:28px; background:url(../img/btn3.png) no-repeat 100% -84px}
.btn3 span {display:inline-block; height:100%; padding:0 5px 0 10px; background:url(../img/btn3.png) no-repeat 0 -56px}
.btn3:hover {background-position: 100% -28px}
.btn3:hover span {background-position: 0 0px}

/* Import button */
.btn4 {display:inline-block; height:28px; padding:0 10px 0 0; overflow:hidden; background:url(../img/btn-r.png) no-repeat 100% 0}
	.btn4 input {height:28px; padding:0 10px 0 20px; font-size:15px; color:#333; margin:0; border:none; cursor:pointer; background:url(../img/btn-l.png) no-repeat 0 0 !important; overflow:visible}

/* Import background */	
.bluebackground {position:relative; background:url(../img/bluebox-lb.gif) no-repeat 0 0}
	.bluebackground > div { padding:10px 10px 10px 10px; background:url(../img/bluebox-lb.gif) no-repeat 0 100%; height:1%}


/* ABC 2018-03-16: New css background color to avoid the use of images (the reason for a new class is to not mess with the old css that might be used elsewhere) */
.tooltipBoxNew {
    background: none;
}

.tooltipBgNew {
    background: #fcfcfc !important;
    width: 665px !important;
    border-radius: 10px !important;
}