/**
 * File: basic.css
 *
 * Resets, basic typography, global utility classes
 */



/* =============================================================================
 * Viewport settings for IE10 and Opera Mobile 11+
 *
 * Commented out to prevent Csslint from (incorrectly) reporting a syntax error
============================================================================= */
/*@-ms-viewport {
	width:device-width;
	zoom:1.0;
}
@-o-viewport {
	width:device-width;
	zoom:1.0;
}
@viewport {
	width:device-width;
	zoom:1.0;
}*/



/* =============================================================================
 * Resets and basic typography/colors
============================================================================= */
* {
	margin:0;
	padding:0;
	border:0;
}
body,
html {
	background:#fff;
	color:#000;
}
html {
	font:16px/24px Muli, Arial, Helvetica, sans-serif;
	-webkit-text-size-adjust:100%;
}
address,
dl,
ol,
p,
pre,
table,
ul {
	margin:0 0 25px;
}
img {
	width:100%;
	height:auto;
	border:none;
}

@media only screen and (min-width: 768px) {
	img {
		max-width:100%;
		width:auto;
	}
}

.article .top-image {
	margin-bottom: 10px;
}

/* Lists
----------------------------------------------------------------------------- */
ul,
ol {
	margin-left:0;
	list-style:none;
}
.article ul,
.article ol {
	margin-left:24px;
}
.article ul {
	list-style:none;
}
.lt-ie8 .article ul {
	list-style:disc;
}
.lt-ie8 .article li {
}
.article ul li {
	position:relative;
}
.article ul li:before {
	display:inline-block;
	position:absolute;
	top:6px;
	left:-24px;
	content:"";
}
.article ul ol li:before {
	content:none;
}
.article ul ul {
	margin-left:0;
}
.lt-ie8 .article ul ul {
	margin-left:24px;
}
.article ul ul li:before {
	position:static;
	background:none;
	content:"– ";
}
.svg .article ul ul li:before {
	background:none;
}
.article ol {
	list-style:decimal;
}
.lt-ie8 .article ol {
	padding-left:15px;
}
.article ol ol {
	list-style:lower-latin;
}
.article ol ol,
.article ol ul,
.article ul ol,
.article ul ul {
	margin-bottom:0;
}
.lt-ie8 .article ul,
.lt-ie8 .article ol,
.lt-ie8 .article li {
	behavior:none;
}


/* Blockquotes
----------------------------------------------------------------------------- */
blockquote {
	margin:0;
	font-style:normal;
}


/* Tables
----------------------------------------------------------------------------- */
table {
	width:100%;
	margin-bottom:60px;
	border-spacing:0;
	border-collapse:collapse;
}
td,
th {
	padding:13px;
}
th:first-child,
td:first-child {
	padding-left:0;
}
th {
	font-weight:400;
	text-transform:uppercase;
}
td {
	border-top:1px solid #000;
	font-weight:300;
}
tbody tr:first-child td {
	border-width:2px;
}
.bottom td {
	border-width:2px;
}
td,
th {
	vertical-align:top;
}
caption,
th {
	text-align:left;
}
table .center {
	text-align:center;
}
table .right {
	display:table-cell;
	float:none;
	margin:0;
	text-align:right;
}
table .middle {
	vertical-align:middle;
}



/* Avoid line-height issues caused by default rendering of sub and sup elements
----------------------------------------------------------------------------- */
sub,
sup {
	position:relative;
	height:0;
	line-height:1;
	vertical-align:baseline;
}
sup {
	bottom:1ex;
}
sub {
	top:0.5ex;
}


/* Code
----------------------------------------------------------------------------- */
code,
kbd,
pre {
	font-family:Monaco, Courier, "Courier New", Tahoma;
}


/* Headings
----------------------------------------------------------------------------- */
h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight:300;
}
h1 {
	margin-bottom:14px;
	font-size:36px;
	line-height:42px;
}
h2 {
	font-size:24px;
	line-height:30px;
	text-transform:uppercase;
}
h3 {
	font-size:18px;
	line-height:50px;
}
h4 {
	font-weight:400;
	font-size:16px;
	line-height:24px;
	text-transform:uppercase;
}
h5,
h6 {
	font-weight:400;
	font-size:1em;
	line-height:24px;
}
.article h1,
.article h2,
.article h3,
.article h4,
.article h5,
.article h6 {
	word-wrap:break-word;
	-moz-hyphens:auto;
	-ms-hyphens:auto;
	hyphens:auto;
}

.article h3 {
	font-weight:bold;
	margin-bottom:10px;
}



@media only screen and (min-width: 992px) {
	h1 {
		font-size:42px;
		line-height:50px;
	}
	h2 {
		font-size:24px;
		line-height:40px;
	}
	h3 {
		font-size:18px;
		line-height:30px;
	}
	h4 {
		font-size:16px;
		line-height:24px;
	}
}


/* Links
----------------------------------------------------------------------------- */
a,
a:visited {
	color:#09f;
}
a.external-link:after {
	display:inline-block;
	margin-left:11px;
	content:"";
}
.button.external-link:after {
	display:none;
}
/* Remove external link icon from links in Twitter feed */
.m-twitter a.external-link:after {
	content:none;
}

/* Remove external link icon from links in GWRS footer */
.gwrs-footer a.external-link:after, 
.hydro-left-col a.external-link:after {
	content:none;
}


/* Inline elements
----------------------------------------------------------------------------- */
b,
strong {
	font-weight:bold;
}
i,
em {
	font-style:italic;
}

/* Horizontal ruler
----------------------------------------------------------------------------- */
hr {
	margin-bottom:29px;
	border:1px dashed #a1a1a1;
}


/* Form elements
 * [1] Enable line-wrapping in IE8+
 * [2] Enable line-wrapping in other browsers
 * [3] Declarations repeated in this rule since IE8- ignore selectors that
 *     contain :not()
----------------------------------------------------------------------------- */
form {
	position:relative;
	overflow:hidden;
	margin-bottom:40px;
}
form .heading {
	margin-top:30px;
	margin-bottom:5px;
	font-size:24px;
	line-height:30px;
	text-transform:none;
}
fieldset {
	margin-bottom:10px;
}
legend {
	display:table; /* [1] */
	margin-bottom:0;
	color:#333;
	white-space:normal; /* [2] */
}
label {
	display:block;
}
button,
input,
select,
textarea {
	font:inherit;
	line-height:normal;
}
input[type="text"],
input[type="url"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"],
input[type="search"],
textarea {
	width:100%;
	height:40px;
	margin-bottom:10px;
	padding:10px;
	border:0;
	background:#e3f0fc;
}
input[type="text"]:focus,
input[type="url"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="number"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
textarea:focus {
	outline:0;
	background:#e2e2e2;
}
.input-wrapper {
	position:relative;
	margin-bottom:10px;
	background:#e3f0fc;
}
.input-wrapper input[type="text"],
.input-wrapper input[type="url"],
.input-wrapper input[type="email"],
.input-wrapper input[type="tel"],
.input-wrapper input[type="number"],
.input-wrapper input[type="password"],
.input-wrapper input[type="search"] {
	margin-bottom:0;
	padding-right:20px;
	background:none;
}
select {
	margin-bottom:10px;
}
textarea {
	height:122px;
}
input:not([type]) {
	padding:5px; /* [3] */
	border:1px solid #bbb; /* [3] */
}
form .last-col {
	position:static;
	padding-bottom:60px;
}
form .submit {
	position:absolute;
	right:0;
	bottom:10px;
}
.form-error:before {
	position:absolute;
	top:0;
	right:0;
}
.form-error-message,
.form-success-message {
	padding:2px 10px;
	border:1px solid;
	/*text-align:center;*/
}
.form-error-message {
	border-color:#f00;
	color:#f00;
}
.form-success-message {
	border-color:#2aa030;
	color:#2aa030;
}
.validation-summary-errors {
	margin-top:20px;
	margin-bottom: 20px;
}
form .required {
	color:#f00;
}

form span.help-block {
	color:#767676;
	font-style:italic;
	font-size:14px;
}

.contourNavigation > div {
	margin-top:20px;
}

/*
 * Reset button look in webkit
 */
input[type="reset"],
input[type="button"],
input[type="submit"],
button {
	padding:5px;
	-webkit-appearance:none;
}

/*
 * Reset search and email input look in webkit so we can style it as a normal text input
 */
input[type="search"],
input[type="email"] {
	border-radius:0;
	-webkit-appearance:none;
}
input::-webkit-search-decoration,
input::-webkit-search-cancel-button {
	display:none;
}

/*
 * Placeholder styling for Gecko
 * [1] No semi-transparent text, please
 */
input::-moz-placeholder,
textarea::-moz-placeholder {
	color:#767676;
	opacity:1; /* [1] */
}

/*
 * Placeholder styling for webkit
 */
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
	color:#767676;
}

/*
 * Placeholder styling for IE10
 */
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
	color:#767676;
}

/*
 * Remove extra padding on gecko buttons
 */
button::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner {
	padding:0;
	border:0;
}

/* Custom radio/checkboxes
-------------------------------------------------------------- */
input[type="radio"],
input[type="checkbox"] {
	position:absolute;
	left:-9999px;
}
.lt-ie9 input[type="radio"],
.lt-ie9 input[type="checkbox"] {
	position:static;
}
input[type="checkbox"] + label:before,
input[type="radio"] + label:before {
	display:inline-block;
	width:16px;
	height:16px;
	content:"";
}
input[type="checkbox"] + label:before {
	background-position:0 0;
}
input[type="radio"] + label:before {
	background-position:-100px 0;
}
input[type="radio"] + label:before,
input[type="checkbox"] + label:before,
.select:before {
	background-image:url("/gui/i/sprites/form-sprite.png");
	background-size:220px 25px;
	background-repeat:no-repeat;
}
.svg input[type="radio"] + label:before,
.svg input[type="checkbox"] + label:before,
.svg .select:before {
	background-image:url("/gui/i/sprites/form-sprite.svg");
}
input[type="radio"] + label,
input[type="checkbox"] + label {
	position:relative;
	margin-bottom:5px;
	cursor:pointer;
}
input[type="radio"] + label {
	padding-left:26px;
}
input[type="checkbox"] + label {
	padding-left:28px;
}
input[type="radio"] + label:before,
input[type="checkbox"] + label:before {
	position:absolute;
	top:2px;
	left:0;
}
.ie-8 input[type="radio"] + label,
.ie-8 input[type="checkbox"] + label {
	display:inline-block;
	padding-left:0;
}
.lt-ie8 input[type="radio"] + label,
.lt-ie8 input[type="checkbox"] + label {
	display:inline;
}
.lt-ie9 input[type="radio"] + label:before,
.lt-ie9 input[type="checkbox"] + label:before {
	display:none;
}
input[type="checkbox"] + label:hover:before {
	background-position:-75px 0;
}
input[type="radio"] + label:hover:before {
	background-position:-150px 0;
}
input[type="radio"]:checked + label:before {
	background-position:-175px 0;
}
input[type="radio"]:checked + label:hover:before,
input[type="radio"]:focus + label:before {
	background-position:-125px 0;
}
input[type="checkbox"]:checked + label:before {
	background-position:-25px 0;
}
input[type="checkbox"]:focus + label:before {
	background-position:-75px 0;
}
input[type="checkbox"]:checked + label:hover:before,
input[type="checkbox"]:checked:focus + label:before {
	background-position:-50px 0;
}

/* Custom select
---------------------------------------- */
.custom-select-container {
	position:relative;
	clear:both;
}
select.replaced {
	position:relative;
	z-index:10;
	width:100%;
	height:40px;
	border:0;
	line-height:40px;
	opacity:0;
	filter:alpha(opacity=0);
}
.custom-select {
	display:block;
	position:absolute;
	top:0;
	left:0;
	z-index:1;
	width:100%;
}
.custom-select > span {
	display:block;
	position:relative;
	height:40px;
	padding:0 0 0 10px;
	background:#e3f0fc;
	line-height:40px;
}
.custom-select > span > span {
	display:block;
	margin-right:17px;
}
.custom-select > span > span > span {
	display:block;
	height:40px;
	overflow:hidden;
	margin-right:15px;
	text-overflow:ellipsis;
	white-space:nowrap;
}
.select:before {
	width:14px;
	height:18px;
	background-position:-200px 0;
}
.custom-select .select:before {
	position:absolute;
	top:50%;
	right:6px;
	margin-top:-9px;
}
.custom-select.hover > span {
	border-color:#999;
}
.custom-select.active > span {
	border-color:#f9a229;
}
.disabled .custom-select > span {
	opacity:0.5;
}

/* Reset Umbraco default form styling
---------------------------------------- */
#contour input.text,
#contour input.title,
#contour textarea,
#contour select,
.contour input.text,
.contour input.datepicker,
.contour input.title,
.contour textarea,
.contour select {
	margin:0 0 10px !important;
	border:0 !important;
}

.contour input.datepicker {
	display:block;
	max-width:400px !important;
	width:95%;
	padding:5px;
}

/* =============================================================================
 * Global utility classes
============================================================================= */


/* Easy clearing of floats.
 * See http://www.css-101.org/articles/clearfix/latest-new-clearfix-so-far.php
----------------------------------------------------------------------------- */
.cf:after {
	display:table;
	clear:both;
	content:"";
}
.lt-ie8 .cf {
	zoom:1;
}


/* Structural elements.
 * Not visible when CSS is enabled but visible to screen readers.
----------------------------------------------------------------------------- */
.structural {
	position:absolute;
	width:1px;
	height:1px;
	overflow:hidden;
	clip:rect(1px, 1px, 1px, 1px);
	padding:0;
	border:0;
}


/* Hidden elements. Hidden even for screen readers
----------------------------------------------------------------------------- */
.hidden {
	display:none;
	visibility:hidden;
}


/* Clear elements. Used by content editors in TinyMCE
----------------------------------------------------------------------------- */
.clear {
	clear:both;
}


/* Prevent line breaking, used by content editors in TinyMCE
----------------------------------------------------------------------------- */
.nowrap {
	white-space:nowrap;
}


/* Zebra background on tables
----------------------------------------------------------------------------- */
.zebra tbody tr:nth-child(even) {
	background:#eee;
}


/* Images
----------------------------------------------------------------------------- */
.left,
.right,
.left-dec,
.right-dec {
	display:block;
	max-width:100%;
	width:auto;
	margin:0 0 10px 0;
}
.right,
.right-dec {
	margin:3px 0 10px 0;
}
img.fullwidth,
img.fullwidth-dec,
span.fullwidth img,
span.fullwidth-dec img {
	display:block;
	width:100%;
	margin:0 0 25px;
}
img.dec,
img.left-dec,
img.right-dec,
img.fullwidth-dec,
span.dec img,
span.left-dec img,
span.right-dec img,
span.fullwidth-dec img {
	padding:4px;
	border:1px solid #cfcfcf;
	background:#fff;
}
.caption,
.caption em {
	display:block;
}
.caption em {
	font-style:normal;
	font-size:0.916em;
}
.caption p,
.caption em {
	margin-bottom:0;
}
.caption sup {
	bottom:3px;
}

p.image-caption {
	margin-bottom:20px;
	color:#7d7d7d;
}

@media only screen and (min-width: 600px) {
	.left,
	.right,
	.left-dec,
	.right-dec {
		float:left;
		width:auto;
		margin:0 36px 10px 0;
	}
	.right,
	.right-dec {
		float:right;
		margin:3px 0 10px 36px;
	}
}

@media only screen and (min-width: 992px) {
	img.fullwidth,
	img.fullwidth-dec,
	span.fullwidth img,
	span.fullwidth-dec img {
		margin-bottom:58px;
	}
}