/* --------------------------------------------------------------

	base.css

	Author: Paul Woods
	Date: May 08

	This is the main stylesheet for PSNI.

-------------------------------------------------------------- */

/* Main Styles
-------------------------------------------------------------- */
body {
	background:#fff top repeat-x url(/images/structure/topbar-bg.gif);
	height:100%;
	font-size: 0.8125em;
	font-family: arial, sans-serif;
	color:#333333;
	margin:0;
}

a {
	color:#4ea0c2;
	text-decoration:underline;
}
a:hover {
	color:#44C5DC;
}

abbr { border:0 }

img { border:0; }

#content p { padding:0 10px; line-height:1.5em; }

/* Structures
-------------------------------------------------------------- */

#header {
	width:100%;
	float:left;
	background:#fff top repeat-x url(/images/structure/header-topbar-bg.gif);
}

#body {
	clear:both;
	padding-top:5px;
	width:1000px;
}

#content {
	margin-left:175px;
	font-size: 0.9em;
}

	/* Foot */

	#foot {
		clear:both;
		margin-top:20px;
		margin-left:175px;
		background-image:url(/images/structure/foot-bg.gif);
		background-repeat:repeat-x
	}

	#foot h2 {
		display:none;
	}

	#foot p {
		padding:24px 120px 36px 5px;
		text-align:right;
		height:36px;
		background-image:url(/images/structure/foot-badge.gif);
		background-repeat:no-repeat;
		background-position:top right;
		font-family:Georgia, serif;
		font-size:0.88em;
		color:#fff;
	}


/* Navigation
-------------------------------------------------------------- */

#nav {
	float:left;
	width:175px;
}

#nav ul.mainnav {
	width:175px;
	margin:0;
	padding:0;
	list-style:none;
	font-size: 0.88em;
}

#nav ul.mainnav li {
	margin: 0 10px;
	font-family:Georgia, serif;
	font-weight:bold;
	text-transform:uppercase;
	border-bottom:1px solid #cdedf4;
}

#nav ul.mainnav li a {
	color:#4ea0c2;
	text-decoration:none;
	display:block;
	padding:5px 5px 5px 15px;
	background-image:url(/images/menu/closed.gif);
	background-repeat:no-repeat;
	background-position:4px;
}

#nav ul.mainnav li.open a {
	background-image:url(/images/menu/open.gif);
	color:#44c5dc;
}

#nav ul.mainnav li a:hover {
	color:#44c5dc;
	background-image:url(/images/menu/closed-hover.gif);
	text-decoration:underline;
}

#nav ul.mainnav li.open a:hover {
	color:#44c5dc;
	background-image:url(/images/menu/open.gif);
}

#nav ul.mainnav ul {
	list-style:none;
	margin: 0;
	padding:0;
}


#nav ul.mainnav ul li {
	font-family:Arial, sans-serif;
	font-weight:bold;
	text-transform:none;
	border-bottom:0;
}

#nav ul.mainnav li.open {
	background-color:#EDF9FB;
}

#nav ul.mainnav li.open li a, #nav ul.mainnav ul li a {
	color:#44c5dc;
	text-decoration:none;
	display:block;
	padding:3px 5px 3px 10px;
	background-image:none;
}

#nav ul.mainnav li.open li a:hover, #nav ul.mainnav ul li a:hover {
	color:#44c5dc;
	background-image:none;
	text-decoration:underline;
}



#nav ul#sec {
	background-image:url(/images/menu/sec-bg.gif);
	background-position:top left;
	background-repeat:no-repeat;
	list-style:none;
	margin:20px 0 0 0;
	padding:30px 0 0 0;
	font-size: 0.88em;
}

#nav ul#sec li a {
	color:#44c5dc;
	font-family:Arial, sans-serif;
	font-weight:bold;
	text-decoration:none;
	display:block;
	padding:3px 5px 3px 30px;
}

#nav ul#sec li a:hover {
	color:#76BE77;
	text-decoration:underline;
}



/* Headings
-------------------------------------------------------------- */

#header h1 {
	float:left;
	background:transparent url(/images/structure/site-title.gif) no-repeat center left;
	margin:0;
	padding:0;
	width:568px;
	height:105px;
}

#header h1 a {
	display:block;
	text-decoration:none;
	width:568px;
	height:105px;
}

#header h1 span { display:none; }

#content h1 {
	background-color:#44c5dc;
	font-size:2.0em;
	color:#fff;
	font-family:'Trebuchet MS', sans-serif;
	text-transform:uppercase;
	margin:0 0 5px 0;
	padding:5px 10px;
}

#content h1.consumers {
	background-color:#76BE77;
}

#content h1.professional {
	background-color:#7eb3c2;
}

h2 {
	font-family:Georgia, serif;
	font-size:2.0em;
	font-weight:normal;
	padding:0 10px;
}

h3 {
	font-size:1.4em;
	padding:0 10px;
}

h4 {
	font-family:Georgia, serif;
	font-size:0.95em;
	letter-spacing:2px;
	text-transform:uppercase;
	padding:0 10px;
	color:#666666;
}

/*Search*/

	/* Main Search */
	#header form {	float:right; width:250px; height:30px; text-align:right; margin:0; background:url(/images/structure/search-corner.gif) no-repeat left #3379b0; }
	#header form fieldset { margin-top:1px; float:left; padding:3px 5px 3px 15px; border:0; }
	#header form input { font-size:0.88em;font-family:Arial, sans-serif; float:left;margin-left:5px; }
	#header form input.searchbox { padding:3px; background:#FFF; border-width:1px; border-style:solid; border-color:#B7B7B7; margin-left:0; }

#header input.button {
	padding: 0 5px;
	background:#44C5DC;
	font-weight:bold;
	font-size:0.95em;
	color:#FFF;
	border:1px solid #FFF;
	text-transform:uppercase;
	cursor:pointer;
}

#header input.button:hover {
	background:#C5EAF2;
  color:#44C5DC;
}

#header input:active.button {
	background:#FFF;
	border:1px solid #FFF;
  color:#44C5DC;
}

#subheader {
	background-repeat:repeat-x;
	background-position:center;
	height:35px;
	border-width:1px 0 0 0;
	border-style:solid;
}

#subheader p {
	padding:10px 30px 5px 10px;
	margin:0;
	font-family:Georgia;
	font-size:0.95em;
	font-weight:bold;
	text-transform:uppercase;
	letter-spacing:2px;
}

div.consumers {
	background-image:url(/sections/consumers/topbar-bg.gif);
	border-color:#a1d8a2;
}

div.professional {
	background-image:url(/sections/professional/topbar-bg.gif);
	border-color:#b9dbe4;
}

div.consumers p {
	color:#76BE77;
}

div.professional p {
	color:#7eb3c2;
}

/* Content
-------------------------------------------------------------- */

.col { float:left; margin:0 5px 10px 0; }
.last { margin-right:0; }
.col h2 { font-size:2.0em; padding:5px 10px 5px 10px; margin:0; }
.gradient { background-repeat:repeat-x; background-position:top; border-width:1px 0 0 0; border-style:solid; border-color:#b9dbe4; }
.gradient h2 { font-size:2.4em; padding:80px 10px 20px 10px;margin:0; background-position:top right; background-repeat:no-repeat; }
.gradient h2 sup em { text-transform:lowercase; }

.half { width:410px; }
.third { width:270px; }
.twothird { width:550px; }
.full { width:825px; margin:0 0 10px 0; }

.green { background-image:url(/images/structure/cols/green-grad.gif); border-color:#b9e4b9; }
.green h2, .green h2 a { color:#479249; }
.green ul.articleList { border-color:#b9e4b9; }

.aqua { background-image:url(/images/structure/cols/aqua-grad.gif); border-color:#b9dbe4; }
.aqua h2, .aqua h2 a { color:#3379b0; }
.aqua ul.articleList { border-color:#b9dbe4; }

.gradient h2 a { text-decoration:none; }
.gradient h2 a:hover { text-decoration:underline;color:#44C5DC; }

	/* Action link */

	a.action { float:right; display:block; width:85px; height:40px; background-repeat:no-repeat; }
	a.action span { display:none; }

	.green a.action { background-image:url(/images/links/enter-bg-green.gif) }
	.aqua a.action { background-image:url(/images/links/enter-bg-aqua.gif) }

	/* Tools */

	a.controltxt { background-position:left top; margin:2px 5px;background-repeat:no-repeat;height:12px;display:block; padding-left:20px; line-height:1em;}
	a.controltxt:hover { background-position:left bottom;}

	/* Feature Item */

	.featureItem {
		background:#DFF4F8;
		padding:5px 0 5px 0;
		height:35px;
		margin-bottom:5px;
		border-width:1px;
		border-style:solid;
		border-color:#c0ebf4 #B2E4EE #85c7d4 #B2E4EE;
	}

	.featureItem:hover {
		background:#e8f7fa;
		border-color:#bff2fc #b1eefa #85d2e1 #b1eefa;
	}

	.featureItem h3 { margin:0; padding:0 10px; }
	.featureItem h3 a { text-decoration:none; }
	.featureItem p { margin:0; padding:0 10px; }
	.featureItem a img { float:left; border-width:0 1px 0 0; border-style:solid; border-color:#85c7d4; margin:-5px 5px 0 0; }
	.featureItem a img:hover { border-color:#85d2e1; }

/* Article
-------------------------------------------------------------- */


	/* Article Media */

	.aMedia { text-align:center; margin:10px 10px 5px 5px; float:right; }
	.aMedia { border:1px solid #999; padding:1px }
	.aMedia p { text-align:left; color:#BBB; margin:0 8px 0 8px;padding:5px; }


/* Article list
-------------------------------------------------------------- */

ul.articleList {
	list-style:none;
	padding:0 10px;
	border-width: 0 0 1px 0;
	border-style: solid;
	border-color:#fff;
}

ul.articleList li {
	margin-bottom:10px;
}

ul.articleList li span {
	font-size:0.95em;
	color:#999999;
	padding-left:10px;
}

.clear-floats { clear: both; font-size: 1px; height: 1px; line-height: 0px; }


/* Election System
-------------------------------------------------------------- */

.electionCandidate { border: 1px solid #ccc; width: 100%; width: 825px; float: left; background: url(/images/structure/gradient-bg.png) repeat-x bottom center; margin-bottom: 5px; }
.electionCandidate.selected { border: 1px solid #a2e2ed; background: url(/images/structure/gradient-bg-selected.png) repeat-x bottom center;  }
.electionCandidate .image { width: 106px; margin-right: 20px; float: left; padding: 10px 0 10px 15px; }
.electionCandidate .image img { border: 3px solid #fff; }
.electionCandidate .details { width: 580px; margin-right: 0; float: left; border-right: 1px solid #ccc; min-height: 120px; padding-top: 10px; }
.electionCandidate .checkbox { width: 100px; float: left; display: block; border-left: 1px solid #fff; min-height: 120px; text-align:center; }
.electionCandidate .checkbox input { margin-top:50px;}
.electionCandidate .checkbox a { background: url(/images/elections/checkbox.png) no-repeat top left; width: 50px; height: 50px; }
.electionCandidate .details h2 { margin: 0; padding: 0;  }
.electionCandidate.selected .details { border-color: #a2e2ed; }

#votecount { float:right; }

.error {
	background: #FFE6E6;
	border: 1px dotted #f3a4a4;
	padding: 12px 12px 12px 34px;
	margin-bottom: 12px;
	}

/* Form styles
-------------------------------------------------------------- */
form.dsForm {  }
form.dsForm table td { width:50%; vertical-align:top; padding:5px;  }

form.dsForm ul.radio-set { list-style:none; padding:0 10px; }
form.dsForm label {  }
form.dsForm p.question { font-size:1.2em; font-weight:bold; }
form.dsForm p.prefix { font-size:1.2em; font-weight:bold; }
form.dsForm p.text { font-size:1.2em; font-style:italic; }

form.dsForm p em { color:#f00; }
form.dsForm p.checkset-element { clear:both; }
form.dsForm p.checkset-element span { float:left; width:20px; }
form.dsForm p.checkset-element label { margin-left:25px; display:block }
form.dsForm div.nav-buttons { background-color:#eee; padding:0.5em 1em; border:1px solid #ccc; clear:both; margin-top:2em;}

p#login-boxes { background-color:#eee; padding:0.5em 1em; text-align:center; border:1px solid #ccc; }
p#login-boxes input { margin: 0 1em; }

form.dsForm textarea { margin:0 10px; }

#login-error
{
    background: url(/images/sitefiles/icons/error.gif) no-repeat 12px 12px #FFE6E6;
    border: 1px dotted #f3a4a4;
    padding: 2px 5px;
    margin-bottom: 12px;
}

h3.error{ color:red; }
fieldset em{ color:red; }
fieldset em.error{ font-weight: bold; font-style: normal; }

.standard-form { }
.standard-form fieldset, fieldset { border: 0; margin: 0; padding: 10px 0; width: 100%; background:#eee;  }
.standard-form dl dt { float: left; width: 20%; text-align: right; margin: 0 15px 7px 0; clear: both; padding: 0; color:#666; }
.standard-form dl dd { float: left; width: 75%; padding: 0; margin: 0 0 7px 0; }
.standard-form dl dd.submission { color:#c00; font-weight:bold; }
.standard-form dl dd textarea { margin-left:0; }


.complete-questionnaire { text-align:center;}

.answer-label { margin-left:20px; font-weight:bold; }
.answer-value { margin-left:40px; color: #f00; }

fieldset#courses-login { background:#EEE; padding:10px; border:1px solid #DDD; }
fieldset#courses-login label { float:left; width:120px; padding-top:5px; }
fieldset#courses-login br { clear:both; margin:8px; }

div.course { margin-bottom:20px; background:#EEE; padding:10px 5px 5px 5px; border:1px solid #DDD; }
div.course h3 { clear:both; font-size:1.8em; margin:0; }
div.course dl { padding:10px 20px 20px 20px; width:600px; float:left; }
div.course dt,
div.dialog dt { float:left; font-weight:bold; width:90px; clear:both; }
div.course dd,
div.dialog dd {  }

div.courses { width: 825px; }

div.course p { text-align:right; clear:both; font-weight:bold; padding-top:10px;  }
div.course p a { padding:2px 5px; background-color:#4ea0c2; color:#fff; text-decoration:none; }
div.course p a:hover { background-color:#44C5DC; }
div.course div.links { float:right; width:auto; margin:11px; }

div.dialog { padding: 10px 20px 5px 0; margin-top:10px; }
div.dialog dt { width:180px; clear:both; margin:10px 0 0 0; }
div.dialog dd { margin:10px 0 0 0; width:500px; float:left;}

.ui-widget-content dl { padding:0 20px; }
.ui-widget-content dt { font-weight:bold; margin-top:10px; }

#content h1.prof-forum{ background-color: #F7A539; }

.float-right { float:right; }

/* --------------------------------------------------------------

    +Buttons

-------------------------------------------------------------- */

input.custom-button, a.custom-button {
	border: 1px solid #999;
	background: url(/images/buttons/grey-bg.png) repeat-x 0 -5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	height: 34px;
	font-size: 1.2em;
	font-family: Arial;
	color: #333;
	font-weight: bold;
	padding-right: 10px;
	padding-left: 10px;
	cursor: pointer;
}

a.custom-button { padding: 9px 10px; text-decoration:none; }

input.custom-button.green, a.custom-button.green {
	background: url(/images/buttons/green-bg.png) repeat-x 0 -5px;
	border-color: #32891d;
	text-shadow: 1px 1px 1px #666;
	color: #fff;
}
input.custom-button.red, a.custom-button.red {
	background: url(/images/buttons/red-bg.png) repeat-x 0 -5px;
	border-color: #a11717;
	text-shadow: 1px 1px 1px #666;
	color: #fff;
}

input.custom-button:hover, a.custom-button:hover { background-position: center center; border-color: #99b9db; }
a.custom-button:hover { text-decoration: none; }
input.custom-button.green:hover, a.custom-button.green:hover { border-color: #32891d; }
input.custom-button.red:hover, a.custom-button.red:hover { border-color: #a11717; }
input.custom-button:focus { background-position: 0 -90px; }