* {margin: 0; padding: 0;}
html, body {min-height: 101%; height: auto; width: 100%;}
body {padding: 0; font-size: 62.5%; font-family: "Lucida Grande", Geneva, Arial, Verdana, sans-serif; text-align: left;}

h2, h3 {font-size: 1.6em; margin-top: .7em;}
p {margin: .7em 0;}
#columnOne p {}

p, li, td, th {font-size: 1.2em;}
td {vertical-align: top;}
ol li, ul li {margin-left: 3.5em;}
li {padding: .3em 0;}
#columnOne li {padding: 0;}
li li, li p {font-size: 1em;}
li p {margin: 0; padding: .1em 0 .3em;}
td li {font-size: 1.2em;}


a, a:link {color: #006699; text-decoration: underline;}
a:visited {color:#006699;}
a:hover {color:#0099FF;}
a img {border-width: 0;}


#mastheadRepeatBackground {background: #006699; width: 100%; margin: 0 auto; height: 100px; margin-bottom: 20px;}
#masthead {height: 100px; background:url(./masthead_background_luas.jpg) no-repeat left bottom; width: 974px; margin: 0 auto; position: relative;}
.masthead_1 {background-image:url(./masthead_background_1.jpg) !important;}
.masthead_2 {background-image:url(./masthead_background_2.jpg) !important;}
.masthead_3 {background-image:url(./masthead_background_3.jpg) !important;}
.masthead_4 {background-image:url(./masthead_background_4.jpg) !important;}
#masthead h1 {position: absolute; left: -9999em;}
#masthead img.mainGraphic {position: absolute; right: 0; top: 0;}

#mainNavigation {position: absolute; width: 530px; height: 100px; top: 0; right: 0;}
#mainNavigation ul {padding: 0; margin: 0; position: absolute; z-index: 500;}
#mainNavigation ul li {list-style-type: none; float: left; padding: 0; margin: 0;}
#mainNavigation ul li a {text-decoration: none; font-size: 1.1em; color: #FFFFFF; padding: 5px 10px 5px 10px; display: block;}
#mainNavigation ul li a:hover {background: #FFFFFF; color: #006699; text-decoration: none;}
#mainNavigation ul li.currentpage,
#mainNavigation ul li.activeparent a{background: #00B2E9; color: #FFFFFF; text-decoration: none;}

.columnOneRepeatBackground {background:url(./columnOneRepeat.gif) repeat-y bottom; float: left; width: 300px; padding-bottom: 20px; margin-top: 0;}

#contentWrapper {width: 974px; margin: 0 auto;}
#columnOne {background:url(./columnOneGradient.gif) no-repeat;}
#columnOne h2 {color: #006699; border-bottom: 1px solid #006699; font-size: 1.4em;}
#columnOne p {line-height: 1.3em; margin: 6px 0;}
#columnOne .contentWrapper {padding: 0 50px; margin-top: -10px;}

.logos {padding: 10px 50px;}
.logos img {margin-right: 6px; border: 0;}

#contentWrapper #columnTwo {margin-left: 300px;}
#columnTwo h1 {color: #CC0000; font-size: 1.8em;}
#columnTwo h2 {color: #CC0000;}
#columnTwo h3 {color: #CC0000; font-size: 1.4em; margin: 10px 0 0 0;}
#columnTwo h4 {font-size: 1.2em; margin: 4px 0;}
.consultationQuestion h3 {font-size: 1.4em; margin: 8px 0 12px 0; color: #CC0000;}
.consultationQuestion h4 {font-size: 1.3em; margin-top: 20px;}
p.firstParagraph {font-size: 1.4em; font-weight: bold;}
#columnTwo p, #columnTwo li {line-height: 1.4em;}
#columnTwo blockquote p {font-size: 1.2em; margin-left: 30px; line-height: 1.4em;}

.consultationQuestion {position: relative; display: block; margin: 10px 0; padding: 10px; _height: 1%; background: #FFFBE6; border: 1px solid #CFCFCF;}
.objectives-and-measuresPage .consultationQuestion {padding: 10px 10px 20px 20px;}
.consultationQuestion:after {content: "."; display: block; clear: both; visibility: hidden; height:0px;}
.objectives-and-measures .consultationQuestion {/*min-height: 40em;*/}

.consultationQuestion table {border-collapse: collapse; width: 515px;}
.consultationQuestion table td {padding: 6px 6px; border-bottom: 1px solid #FACF62;}
.homePage .consultationQuestion table td {border: 0;}
.consultationQuestion th {border-bottom: 1px solid #FACF62; padding: 10px 6px; text-align: left;}
.consultationQuestion .skipQuestion {font-size: 1em;}
.consultationQuestion .alertBox {padding: 3px 6px; border: 1px solid #990000; color: #990000; background-color: #FFFFFF; display: none;}

input {padding: 2px;}

.widthSmallest {width: 30px;}
.widthSmall {width: 140px;}
.widthMedium {width: 170px;}
.widthLarge {width: 250px;}
.widthMax {width: 400px;}

textarea.heightMedium {height: 80px;}
.button {padding: 0;}
.continueButton {padding-top: 20px; text-align: right;}
.floatRight {float: right; padding-left: 15px; padding-bottom: 15px;}

#footer {clear: both; color: #666666; width: 800px; border-top: 1px dotted #666666; margin: 20px auto; text-align: center;}
#footer p {font-size: 1em;}
#footer a, #footer a:visited {color: #666666;}
#footer a:hover {color: #CC0000;}

.hideMe {display: none;}
.hiddenNote {font-size: 1em;}
option {padding-left: 20px;}
optgroup {padding-top: 10px;}
/*  Nest Design change start  */
select#location optgroup,
select#location option {
  padding: 0;
}
select#location optgroup option {
  padding-left: 20px;
}
/*  Nest Design change end  */
.issuesDIV {font-size: 1em; padding-top: 5px; display: none;}
.productionNote {color: #FF0000;}

#languageBar {background-color: #FFFFFF; border-bottom: 1px solid #CCC; margin: 0 auto;}
#languageWrapper {text-align: right; padding: 4px; width: 974px; margin: 0 auto;}
p.question {font-size: 1.4em;}
p.importantPara {border: 1px solid #CCCCCC; background-color: #F2F9FD; padding: 15px; color: #006699;}
#languageWrapper img {border: 1px solid #CCCCCC; margin-left: 5px;}
.consultationsWrap {margin: 6px 0 20px 0; padding: 1px 3px;/* background: #FFF; */}

/* --------------------- Specific styles for build 2 --------------------- */

#contentWrapper.oneColumn #columnTwo {z-index: 1; margin-left: 0;}
#contentWrapper.oneColumn #columnTwo h1 {margin-bottom: 5px;}
.oneColumn #sliders {position: relative; z-index: 110; width: 320px; float: left;}

ul.sliders {margin: 0; padding: 0; list-style: none; margin-top: 10px;}
ul.sliders li {margin: 0; padding: 0px 0; list-style-position: outside; line-height: 1.2em;}
ul.sliders li p.objectiveHeading {font-weight: bold; margin-bottom: -5px; margin-top: 10px;}
ul.sliders li ol {list-style: none;}
ul.sliders li ol li {margin-left:22px; padding: 3px 0;}
ul.sliders li ol li span {display: block;}
ul.sliders li ol li.c1 span {font-size: 1.0em;}
ul.sliders li ol li.c2 span {font-size: 1.2em;}
ul.sliders li ol li.c3 span {font-size: 1.4em;}

.sliderGroup {margin-top: 10px;}
.sliderGroup:after {content: "."; display:block; clear:both; visibility:hidden; height:0px;}
.sliderGroup p {margin: 4px 0;}
.sliderGroup .sliderBox {position: relative; height: 29px; background:url(./slider.png) no-repeat 0 6px; display: block; float: left; width: 265px; margin-right: 10px;}
.sliderGroup .sliderBox .handleBox {position: absolute; width: 16px; height: 29px; background:url(./slider-handle.png) no-repeat 0 0;}
.sliderGroup .sliderBox .range {position: absolute; width: 1px; height:18px; margin-top:6px; background-color: #efae00; opacity: 0.4;}
.sliderGroup .measures {position: absolute; left: -9999em; width: 590px; min-height:23em; padding: 15px 15px 20px 15px; border: 1px solid #CCC; background: #FFFFFF; z-index: 999; top: 10px;}
.sliderGroup .show {position: absolute; left: 330px;}
.sliderGroup .measures .arrow {display: block; position: absolute; left: -26px; width: 26px; height: 32px; background: transparenturl(./measure-arrow.gif) top left no-repeat;}
.sliderGroup .measures #arr1 {top: 45px;}
.sliderGroup .measures #arr2 {top: 100px;}
.sliderGroup .measures #arr3 {top: 157px;}
.sliderGroup .measures #arr4 {top: 213px;}
.sliderGroup .measures #arr5 {top: 270px;}

/* Your views button */
.yourViews a {text-indent: -9999px; display: block; width: 198px; height: 37px; background: url(uploads/images/btn_tell-us-your-views.jpg) no-repeat top left;}
.yourViews a:hover {background: url(uploads/images/btn_tell-us-your-views.jpg) no-repeat bottom left;}
.yourViews a {}

.totalPercent {font-size: 160%; color: #CC0000; font-weight: bold; height: 23px; display: block; padding-top: 6px;}

#wordCoudWrapper {float: right; width: 57em; height: 43.5em; margin: 0 20px 0 0; padding: 0 10px 10px 10px; z-index: 100;}

#previewGuide p {padding: 70px 0 0 60px;}
p.previewGuide {margin-right:4.5em; padding: .5em 0 1em;text-align: center;}
p.helpGuide, .helpGuide {margin:10px 0; padding:10px; border:1px solid #CFCFCF; background: #E2F9E3;}
#submit, #add {padding: 0;}

#submitPreview {position: relative; bottom: 0; width: 570px; left: 0; text-align: right;}

#wordCloud {width: 100%; padding: 5px 10px; border: 1px solid #666666;}
#wordCloud ul {margin: 0; padding: 0;}
#wordCloud ul li {list-style-type: none; margin: 0; padding: 4px; display: block; line-height: 1.8em;}
#wordCloud ul li .measureName {}
#wordCloud ul li .measureDesc {position: absolute; top: .5em; left: -9999em; z-index: 999; width: 25em; padding: 15px 15px 20px 15px; border: 1px solid #CCC; background: #FFFFFF; color: #000;}
#wordCloud ul li ul {display: none; position: absolute; top: 3px; left: -358px; width: 320px; height: 380px; padding: 5px; background: #FFFFFF; border: 1px solid #CCCCCC; font-size: 13px; font-weight: normal;}
#wordCloud ul li:hover {color: red;}
#wordCloud ul li:hover .measureDesc {left: .7em;}
#wordCloud ul li:hover ul {display: block; color: #000000}

/*.fontSize0 .measureName {font-size: 110%;}
.fontSize1 .measureName {font-size: 120%;}
.fontSize2 .measureName {font-size: 130%;}
.fontSize3 .measureName {font-size: 140%;}
.fontSize4 .measureName {font-size: 150%;}
p.fontSize5, .fontSize5 .measureName {font-size: 160%;}
.fontSize6 .measureName {font-size: 170%;}
.fontSize7 .measureName {font-size: 180%;}
.fontSize8 .measureName {font-size: 190%;}
.fontSize9 .measureName {font-size: 200%;}
.fontSize10 .measureName {font-size: 210%; font-weight: bold;}*/
/* Uncomment this to get colouring based on number of influences
 * #wordCloud ul li.ref1 .measureName {color: #000;}
 * #wordCloud ul li.ref2 .measureName {color: #3f1717;}
 * #wordCloud ul li.ref3 .measureName {color: #5f1212;}
 * #wordCloud ul li.ref4 .measureName {color: #7f0000;}
 */

#formMeasureCommentsList, #formAddedCommentsList {margin: 0; padding: 0;}
#formMeasureCommentsList li, #formAddedCommentsList li {position: relative;}
#formAddedCommentsList li {list-style-type: none;}
#formMeasureCommentsList li label, #formAddedCommentsList li label {font-weight: bold;}
#formMeasureCommentsList li p.commentField {position: absolute; left: -9999em; width: 99%;}
#formMeasureCommentsList li p.commentField:after {content: "."; display: block; clear: both; visibility: hidden; height:0px;}

.measureComment, .measureCommentAdded {width: 550px; height: 50px;}
.consultationQuestion.three ol {margin-top: 15px;}
.characterCounter {float: right; margin-right: 100px; font-size: .9em;}
p.additionalMeasureMenu {margin-top: 30px; margin-bottom: 20px; padding: 5px;}

p.additionalMeasureMenu {border: 1px solid #CCC; padding: 10px 0px; padding-left: 15px;}
.additionalMeasureMenu label {display: block;}
.additionalMeasureMenu #addMeasure {padding: 0px;} 

.measuresTable {border: 0px;}
.measuresTable a {border: 0px; text-decoration: none;}
.measuresTable td {text-align: center; padding: 0 0 10px 0;}

.measuresForm {margin-top: 20px;}
.measuresForm label {font-size: 1.2em; float: left; width: 600px;	}
.measuresForm div {margin: 2px 0px; display: block; padding: 2px 0px;}
.measuresForm .submit {margin-top: 20px;}
.measuresForm fieldset {padding: 5px 10px; border: 1px solid #E3E3E3; margin-bottom: 20px;}
.measuresForm legend {font-size: 1.1em; color: #CC0000;}
.measuresForm textarea {width: 100%; height: 100px; border: 1px solid #E3E3E3; margin-top: 5px; padding: 3px; border-top-color: #999; border-right-color: #999;}

/* Overlay styles for Measures form */
.overlay {position: absolute; z-index 1; width:60%;  display:none; background: #FFFFFF; border:4px solid #CCC; margin-bottom: 20px; padding: 10px 50px 15px 50px; overflow-y:auto; overflow-x:hidden; min-height: 580px;} 
.overlay div.close {background:url(../../cms/uploads/images/close.gif) no-repeat; position:absolute; top:10px; right:15px; width:35px; height:35px; cursor:pointer; z-index: 1;} 
.overlay div.content {margin: 40px 50px;}
.overlay label {display: block; font-size: 1.2em; margin: 4px 0px;}
.overlay h3 {margin-top: 20px;}
.overlay ul {margin: 15px 10px; }
.overlay h2 span.counter {font-size: 80%; color: #999;}
.overlay textarea {display: block; height: 5em; width: 300px; margin-bottom: 20px;}
table.overlayTable {width: 100%; border-collapse: collapse; margin-top: 10px;}
table.overlayTable td {width: 50%; font-size: 100%; vertical-align: top;}
table.overlayTable td input#button {display: block; margin-top: 10px;}
table.overlayTable td ul {margin: 0; padding: 0; width: 90%;}
table.overlayTable td ul li {margin-left: 1.5em; line-height: 0; padding: 2px 0;}
#columnTwo table.overlayTable td h3 {margin: 0 0 10px 0;}
.overlay ul.measuresList li {z-index: 1;}
.overlay ul.measuresList li.hover {position: relative;}
.overlay ul.measuresList li .measureTog {color: #006699; text-decoration: underline; cursor: pointer;}
.overlay ul.measuresList li .measureDesc {display: block; position: absolute; top: 5px; left: -9999em; z-index: 100; width: 180px; padding: 10px; background-color: #fffbe6; border:3px solid #cfcfcf;}
.overlay ul.measuresList li.hover .measureTog {z-index: 1; color: #000; text-decoration: none;}
.overlay ul.measuresList li.hover .measureDesc {left: 22em; top: 7px; z-index: 110;}
.measuresViewForm a.add-like, .measuresViewForm a.add-dislike {display: block; padding: 5px 0 6px;}
.measuresViewForm .add-pref option.disabled {color: #bbb;}

/* Measures List */
ul#selectMeasures {margin: 0px; padding: 0px; height: 185px;}
ul#selectMeasures:after {content: "."; display: block; clear: both; visibility: hidden; height:0px;}
ul#selectMeasures li {float: left; margin: 0px; margin-right: 10px; padding: 0px; list-style-type: none;}
ul#selectMeasures li a {width: 99px; height: 145px; display: block; float:left; border: 1px solid #CCC; position: relative; text-decoration: none; color: #000;}
ul#selectMeasures li a:hover {text-decoration:none; color: #000;}
ul#selectMeasures li a span {position: absolute; margin-top: 150px; font-size: .9em;}

ul#selectMeasures li a.public-services {background: url(uploads/required/measures-01.jpg) no-repeat top left;}
ul#selectMeasures li a.public-services:hover {background: url(uploads/required/measures-01.jpg) no-repeat bottom left;}

ul#selectMeasures li a.informing-promoting {background: url(uploads/required/measures-05.jpg) no-repeat top left;}
ul#selectMeasures li a.informing-promoting:hover {background: url(uploads/required/measures-05.jpg) no-repeat bottom left;}

ul#selectMeasures li a.planning-land-use {background: url(uploads/required/measures-02.jpg) no-repeat top left;}
ul#selectMeasures li a.planning-land-use:hover {background: url(uploads/required/measures-02.jpg) no-repeat bottom left;}

ul#selectMeasures li a.managing-traffic {background: url(uploads/required/measures-03.jpg) no-repeat top left;}
ul#selectMeasures li a.managing-traffic:hover {background: url(uploads/required/measures-03.jpg) no-repeat bottom left;}

ul#selectMeasures li a.managing-demand {background: url(uploads/required/measures-04.jpg) no-repeat top left;}
ul#selectMeasures li a.managing-demand:hover {background: url(uploads/required/measures-04.jpg) no-repeat bottom left;}

ul#selectMeasures li a.providing-capacity {background: url(uploads/required/measures-06.jpg) no-repeat top left;}
ul#selectMeasures li a.providing-capacity:hover {background: url(uploads/required/measures-06.jpg) no-repeat bottom left;}

/* Special effects */
.handle {cursor:move; position:absolute; top:0; z-index:100;}

/* some additional functional styles which we'll use a lot */
.center {text-align: center;}
.hidden {position: absolute; left: -9999em;}
.clear {clear: both;}
.spacer {display: block; clear: both;}

div.debug {padding: .8em 1.5em 1.2em; font-size: 1.2em;}
div.debug *, div.debug div.debug  {font-size: 1em;}
div.debug ul {list-style-type: none;}
div.debug ul li ul {list-style-type: circle;}

