@charset "windows-1252";

/* reset browser inconsistencies */

@import url('http://yui.yahooapis.com/3.0.0/build/cssreset/reset.css');

@import url('http://yui.yahooapis.com/3.0.0/build/cssbase/base.css');

@import url('http://yui.yahooapis.com/3.0.0/build/cssfonts/fonts.css');

@import url('css/hacks.css');

/*

Document   : main

=====================

Created on : 25-Feb-2010, 13:20:36

Author: John Phillips

Email: john.phillips[at]soapboxcommunications.co.uk

Description: Main styling for VoteMatch app.

NOTE: Parties at line 260 will need tweaking

*/

/* -------------------------------- layout ---------------------------------- */

html

{overflow-x: hidden;/* hide horizontal scroll bar */ ;

background-color:#f5f5f5}



#sb-body{

font-family:calibri, helvetica, arial, sans-serif;

font-size:80%;}

#wrap{

padding:15px;position:relative;

min-height:400px;

padding-top:10px;

background-image:url('images/css/tile.jpg');

background-repeat:repeat-y;

width:353px;

text-align:left;

margin:0 auto

}

#banner,#footer{position:absolute;width:100%; background-repeat:no-repeat;left:0;}

#banner{

top:0;

height:60px;

background-image:url('images/css/banner.jpg');}

#footer{

bottom:0;

height:18px;

background-image:url('images/css/bottom.jpg');}

/* ----------------------------------nav ------------------------------------ */

#topnav{

background-image:url('images/css/button-bar-off.jpg');

background-position:bottom left;

background-repeat:repeat-x;

margin-top:50px;

*margin-top:60px; /*IE hack*/

}

#topnav button,#topnav button span{

padding:0;

margin:0;

min-height:40px;}

#topnav button{

background:none;

float:left;

border:none;

display:inline;

width:70px;

overflow:visible;/* removes extra side padding in IE */ }

#topnav button span{

display:block;

white-space:nowrap;

padding-top:5px;

width:100%;

background-repeat:no-repeat}

/* styles */

#topnav button.nav span{

background-color:#e5e5e5;

background-image:url('images/css/nav-off.jpg');

background-position:top left;

background-repeat:no-repeat;

margin-bottom:18px}

#topnav button.nav.navselect span{

background-color:#601d56;

color:#fff;

background-image:url('images/css/nav-on.jpg')!important;}

#topnav button.nav{

background-image:url('images/css/button-bar-off.jpg');

background-position:bottom left;

background-repeat:no-repeat;color:#5f2e58;}

#topnav button.nav.navselect{

background-image:url('images/css/button-bar-on.jpg');

width:73px}

#topnav button[disabled="disabled"].nav/* IE will degrade to default disabled style */

{color:#5f2e58;cursor:default!important}

/* ------------------------------- postcode --------------------------------- */

#postcodeform label{padding-right:5px}

#postcodeform form input[type="text"]{width:100px}

#postcodeform form input[type="text"],#postcodeform form label{float:left;}

#postcodeform form p

{width:150px;float:right;color:#c5c5c5}

#remind,#skip-reminder,input.go-button,input.submit-button,input.confirm-button

{background-color:#9e005d;color:#fff;margin:5px 0;border:none;display:block;background-repeat:no-repeat}

#remind,#skip-reminder,input.submit-button,input.confirm-button

{width:90px;height:45px;padding:5px;float:right;background-image:url('images/css/skin/submit-button.jpg');cursor:pointer}

input.go-button

{width:45px;height:23px;padding:3px;background-image:url('images/css/skin/go-button.jpg');cursor:pointer}

#remind:hover,#skip-reminder:hover,input.submit-button:hover,input.confirm-button:hover

{background-position:-89px }

input.go-button:hover

{background-position:-45px }

input.go-button

{clear:left;margin-top:10px;}

input.confirm-button

{clear:both;}

input[type='text'],.textbox

{border:1px solid #999;background-image:url('images/css/skin/text-input-tile.jpg');background-position: 0 -5px}

input.invalid

{border: 2px #f00 inset}

p.emailalert

{color: #f00;clear:both;font-weight:bold;}

/* -------------------------------- statements ------------------------------ */

#postcodeform

{padding:10px 5px}

#header, #statement h1, #statementheader h1

{padding:5px;color:#fff;font-weight:bold;background-color:#2ca89e;background-image:url('images/css/header-tile.jpg');background-repeat:repeat-x}

#header a, #statementheader a

{color:#fff}

#header *,#statement *, #statementheader *

{margin:0;}

#statement h1,#statement p,#header h1, #header p,#statementheader h1, #statementheader p

{font-size:1.2em;}

#statementtext,#party-comments

{padding:10px 20px;}

#statementtext p, #party-comments p

{padding:36px 10px 10px 10px;font-weight:bold;

width:293px;/* set explicit width because IE is not hot on inherited percentages */

color:#fff;background-color:#9e005d;background-position:top left;background-repeat:no-repeat;background-image:url('images/css/skin/statement-left.gif');position:relative;padding-bottom:30px;

height:100%/* IE6 hasLayout issue*/ }

span.statement-bottom

{display:block;

width:320px;/* again, set explicit width because IE forgets to inherit stuff */

height:30px;position:absolute;left:0;bottom:0;

background-image:url('images/css/skin/statement-bottom.jpg');

background-position:bottom left;background-repeat:no-repeat}

#party-comments p

{background-image:url('images/css/skin/statement-right.jpg');}

#party-comments a /*Need to Add (amend accordingly to Telegraph*/

{color:#fff}


#statementnav

{width:80%;text-align:center}

#statementnav button

{color:#ff982a}

#statementnav button[disabled="disabled"]

{color:#666}

/* -------------------- Nation buttons and answerbuttons ---------------------*/

#nationbuttons button,#answerbuttons button

{cursor:pointer;border:1px solid #fff;color:#666}

#nationbuttons button:hover,#nationbuttons button:active,#answerbuttons button:hover,#answerbuttons button:active

{border:1px solid #ccc;color:#ff982a}

#nationbuttons button,#answerbuttons button{

background-repeat:no-repeat;

float:left;

display:inline;

margin:0 5px;

background-position:50% 3px}

/* -------------------------statement navigation -----------------------------*/

#navstatements

{clear:both;margin-top:5px}

#previousbutton button,#nextbutton button

{position:relative;height:32px;width:30px;}

#previousbutton button img,#nextbutton button img

{position:absolute;top:0;left:0}

#statementnav button

{width:20px;}

#back a

{display:block;height:32px;color:#666 ;background-image:url('images/css/prev.jpg');line-height:2;background-repeat:no-repeat;background-position:left center;padding-left:35px;}

#back a:hover

{color:#9e005d}

/* -------------- Important and unimportant issues and parties ---------------*/

.custom-checkbox{ position: relative;float:left;display:inline;margin:2px}

/* input, label positioning */

.custom-checkbox input

{position: absolute;left: 2px;top: 3px;margin: 0;z-index: 0;}

.custom-checkbox label

{display: block;width:80px;position: relative;z-index: 1;padding-top:80px;line-height: 1;margin: 0 0 .3em;padding-bottom:3px;cursor: pointer;}

#issues-submit,#parties-submit{display:block;clear:both}

/* -------------------------Background images --------------------------------*/

#nationbuttons button span,#answerbuttons button span

{padding-top:75px;width:72px;}

#england

{background-image:url('images/css/nations/emblem_england.jpg')}

#scotland

{background-image:url('images/css/nations/emblem_scotland.jpg')}

#ni

{background-image:url('images/css/nations/emblem_ireland.jpg')}

#wales

{background-image:url('images/css/nations/emblem_wales.jpg')}

/* Opinions */

#agree
{background-image:url('images/css/emblems/emblem_agree_unselected.jpg')}
#disagree
{background-image:url('images/css/emblems/emblem_disagree_unselected.jpg')}
#open-minded
{background-image:url('images/css/emblems/emblem_open_minded.jpg')}
#skip
{background-image:url('images/css/emblems/emblem_skip.jpg')}
#answerbuttons dt span.open-minded		  /*changed for new results pages */
{background-image:url('images/css/emblems/emblem_open_minded.jpg')}
#answerbuttons dt span.agree			  /*changed for new results pages */
{background-image:url('images/css/emblems/emblem_agree_unselected.jpg')}
#answerbuttons dt span.disagree			  /*changed for new results pages */
{background-image:url('images/css/emblems/emblem_disagree_unselected.jpg')}
#answerbuttons dt span.none				  /*changed for new results pages */
{background-image:url('images/css/emblems/emblem_skip.jpg')}
#answerbuttons dt span.agree-confirm,#agree.curans	 /*changed for new results pages */
{background-image:url('images/css/emblems/emblem_agree_selected.jpg')}
#answerbuttons dt span.disagree-confirm,#disagree.curans   /*changed for new results pages */
{background-image:url('images/css/emblems/emblem_disagree_selected.jpg')}
#answerbuttons dt span.open-minded-confirm, #open-minded.curans	 /*changed for new results pages */
    {background-image: url('images/css/emblems/emblem_open_minded_selected.jpg')}
#answerbuttons dt span.none, #skip.curans  /*changed for new results pages */
    {background-image: url('images/css/emblems/emblem_skip_selected.jpg')}

/* Themes */

#answerbuttons dt span.theme

{background-position:-180px 0}/* show the green sprite */

#l-constitutional-affairs,#answerbuttons dt span.constitutional-affairs

{background-image: url(images/css/issues/constitution.gif)}

#l-crime-and-justice,#answerbuttons dt span.crime-and-justice

{background-image: url(images/css/issues/security.gif)}

#l-defence-and-foreign-affairs,#answerbuttons dt span.defence-and-foreign-affairs

{background-image: url(images/css/issues/defence.gif)}

#l-employment#answerbuttons dt span.employment

{background-image: url(images/css/issues/employment.gif)}

#l-economy,#answerbuttons dt span.economy

{background-image: url(images/css/issues/economy.gif)}
#l-education,#answerbuttons dt span.education

{background-image: url(images/css/issues/education.gif)}
#l-employment-and-equal-opps,#answerbuttons dt span.employment-and-equal-opps

{background-image: url(images/css/issues/employment.gif)}

#l-environment,#answerbuttons dt span.environment

{background-image: url(images/css/issues/international.gif)}

#l-immigration-and-asylum,#answerbuttons dt span.immigration-and-asylum

{background-image: url(images/css/issues/immigration.gif)}

#l-parliamentary-reform,#answerbuttons dt span.parliamentary-reform

{background-image: url(images/css/issues/parliament.gif)}

#l-health,#answerbuttons dt span.health

{background-image: url(images/css/issues/health.gif)}

#l-pensions-and-retirement,#answerbuttons dt span.pensions-and-retirement

{background-image: url(images/css/issues/retirement.gif)}

#l-sovereignty-and-devolution,#answerbuttons dt span.sovereignty-and-devolution

{background-image: url(images/css/issues/constitution.gif)}

#l-justice-and-security,#answerbuttons dt span.justice-and-security

{background-image: url(images/css/issues/security.gif)}

#l-rural-affairs,#answerbuttons dt span.rural-affairs

{background-image: url(images/css/issues/rural.gif)}

#l-tax,#answerbuttons dt span.tax

{background-image: url(images/css/issues/tax.gif)}

#l-retirement,#answerbuttons dt span.retirement

{background-image: url(images/css/issues/retirement.gif)}

/* TODO: parties

Some of these will need adjusting...

*/

#answerbuttons dt span.partyLOGO,.custom-checkbox label

{background-image:url('images/css/emblems/emblem.jpg')}/* default style if no icon is found */

#l-alliance,#answerbuttons dt span.alliance

{background-image:url('images/parties/parties_alliance.gif')}

#l-british-national,#answerbuttons dt span.british-national

{background-image:url('images/parties/parties_british-national.gif')}

#l-conservative,#answerbuttons dt span.conservative

{background-image:url('images/parties/parties_conservative.gif')}

#l-democratic-unionist,#answerbuttons dt span.democratic-unionist

{background-image:url('images/parties/parties_democratic-unionist.gif')}

#l-green,#answerbuttons dt span.green

{background-image:url('images/parties/parties_green.gif')}

#l-green-northern-ireland,#answerbuttons dt span.green-northern-ireland /* ? */

{background-image:url('images/parties/parties_green-northern-ireland.gif')}/* ? */

#l-health-concern,#answerbuttons dt span.health-concern /* ? */

{background-image:url('images/parties/parties_health-concern.gif')}/* ? */

#l-labour,#answerbuttons dt span.labour

{background-image:url('images/parties/parties_labour.gif')}

#l-liberal-democrats,#answerbuttons dt span.liberal-democrats

{background-image:url('images/parties/parties_liberal-democrats.gif')}

#l-peoples-voice,#answerbuttons dt span.peoples-voice

{background-image:url('images/parties/parties_peoples-voice.gif')}

#l-plaid-cymru,#answerbuttons dt span.plaid-cymru

{background-image:url('images/parties/parties_plaid-cymru.gif')}

#l-respect,#answerbuttons dt span.respect

{background-image:url('images/parties/parties_respect.gif')}

#l-scottish-national,#answerbuttons dt span.scottish-national

{background-image:url('images/parties/parties_scottish-national.gif')}

#l-scottish-green,#answerbuttons dt span.scottish-green

{background-image:url('images/parties/parties_scottish-green.gif')}

#l-sinn-fein,#answerbuttons dt span.sinn-fein

{background-image:url('images/parties/parties_sinn-fein.gif')}

#l-social-democratic-and-labour,#answerbuttons dt span.social-democratic-and-labour

{background-image:url('images/parties/parties_social-democratic-and-labour.gif')}

#l-tup,#answerbuttons dt span.tup /* ? */

{background-image:url('images/parties/parties_tup.jpg')} /* ? */

#l-uk-independence,#answerbuttons dt span.uk-independence

{background-image:url('images/parties/parties_uk-independence.gif')}

#l-ulster-unionist,#answerbuttons dt span.ulster-unionist

{background-image:url('images/parties/parties_ulster-unionist.gif')}

/* ------------------label and checkbox manipulation------------------------- */

.custom-checkbox label

{background-repeat:no-repeat;text-align:center}

/* states

image sprites are separated by 90px on the x-axis. There is a 6px LH margin too.

#impissues/#unimpissues sprites are:

- grey: -270px 0 [disabled]

- green: -180px 0 [default] : #21837d

- orange: -95px 0 [hover 1] : #f35e2a

- purple: -6px 0 [hover 2] :  #9e005d

*/

.custom-checkbox label

{border:1px solid #fff;}

/* Default */

#impissues span.clearfloat,#partiesselect span.clearfloat,#unimpissues span.clearfloat

{width:100%!important}

#impissues .custom-checkbox label,#unimpissues .custom-checkbox label

{background-position: -180px 0;color:#21837d}



/* Hover, focus */

.custom-checkbox label.hover,.custom-checkbox label.focus

{border:1px solid #ccc}



/* checked */

#impissues .custom-checkbox label.checked,#answerbuttons dt span.important

{background-position: -95px 0; color:#f35e2a}

#unimpissues .custom-checkbox label.checked,#answerbuttons dt span.unimportant

{background-position: -6px 0; color:#9e005d}



/* checked + hover, checked + focus */

.custom-checkbox label.checkedHover,.custom-checkbox label.checkedFocus

{border:1px solid #ccc}

#partiesselect .custom-checkbox label.checked

{color:#f35e2a}



/* disabled */

#unimpissues .custom-checkbox label.disabled

{background-position: -360px 0;color:#fcc591;border:none}



#setreminder fieldset

{border:1px solid #ccc;margin:10px 0;padding:5px}

#setreminder .custom-checkbox label

{width:300px;text-align:left;padding-right: 1em;line-height: 1;padding: 0 0 0 30px;margin: 0 0 .3em;}

#setreminder .custom-checkbox label

{background: url(images/css/skin/checkbox.gif) no-repeat;}

#setreminder .custom-checkbox label

{background-position: -10px -14px; border:none;}

#setreminder .custom-checkbox label.hover,#setreminder .custom-checkbox label.focus

{background-position: -10px -114px;}

#setreminder .custom-checkbox label.checked

{background-position: -10px -214px;}

#setreminder .custom-checkbox label.checkedHover,#setreminder .custom-checkbox label.checkedFocus

{background-position: -10px -314px;}

#setreminder .custom-checkbox label.focus

{outline: 1px dotted #ccc;}



#email-label

{display:block;width:150px;float:right}

#emailtextbox

{float:left}



/* -----------------------------RESULTS pages-------------------------------- */

.telegraph-exclusive /*.not-telegraph*/
{ display:none;}

#party-results h2,#more h2,#answerbuttons h2,#party-comments h2,#selectpartyform h2,#party-results-links h2

{font-size:1em;background-repeat:repeat-x;margin:0;padding:3px}

#party-results h2,#more h2,#party-results-links h2

{color:#fff;}

#party-comments h2,#selectpartyform h2,#more a, #party-results a,#party-results-links a

{color:#666}

#more a:hover, #party-results a:hover,#answerbuttons h2 a, #party-results-links a:hover

{color:#9e005d}

#more h2,#party-results-links h2

{background-color:#9e005d;}

#more ul,#party-results-links ul

{margin:0}

#more li,#party-results-links li

{list-style-type:none;margin:0;display:block;padding:5px 0;background-image:url('images/css/skin/next-small.jpg');background-position:center right;background-repeat:no-repeat;border-top:1px solid #ccc}

#more li a,#party-results-links li a

{margin: 0 23px 0 3px;display:block}

#party-results h2

{background-color:#2ca89e;background-image:url('images/css/header-tile.jpg');}

#party-results,#more

{margin:10px 0;}

#party-results *,#more *

{margin:5px}

#party-results div,#more div

{border:1px solid #ccc}

#partyscores

{float:left;width:60%}

#partyscores dt a

{margin:0}

#partyscores dt,#partyscores dd,#partyscores dd div

{padding:0;margin:0;}

#partyscores dd

{display:inline}

#partyscores .bar,#partyscores strong

{float:left}

#partyscores .bar

{background-image:url('images/css/skin/bar.jpg');background-repeat:repeat-y;margin:0;background-color:#f4652f;background-position:right}

#partyscores dt

{display:block;width:200px;clear:left}

#partylogo

{float:right;width:30%}

#partylogo a

{display:block;margin:0}

#partylogo img

{width:80px;margin:0 12px}

#share, #credits, #links

{display:inline}

#share, #credits

{float:left;width:40%}

#links

{float:right;width:50%}

/* -----------------statements results and answer buttons---------------------*/

#answerbuttons,#party-comments,#selectpartyform,#party-results-links

{border:1px solid #ccc;margin:5px 0}

#answerbuttons,#selectpartyform

{padding:5px;}

#selectpartyform

{color:#666}

#selectpartyform label

{float:left;display:inline}

#selectpartyform select

{float:right;}

#answerbuttons dl,#answerbuttons dd,#answerbuttons dd dt

{padding:0;margin:0}

#answerbuttons dt

{position:relative; padding:5px }

#answerbuttons dt span

{position:absolute;width:100%;height:100%;background-repeat:no-repeat;}

#answerbuttons dd dt

{height:80px;width:80px;}

#answerbuttons dd dd

{text-align:center;font-size:.8em}

#answerbuttons dd dl

{width:25%;display:block;float:left;

*width:24.9%/* IE can't add up */

}



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



/* Utility classes*/

.right,.left{display:inline}

.right{float:right}

.left{float:left}

.accessibility{position:absolute!important;left:-1000em!important}

.clearfloat:after {content:".";display:block;height:0;clear:both;visibility:hidden;}.clearfloat{display:inline-block;}/* Hides from IE-mac \*/ * html .clearfloat{ height: 1%;}.clearfloat{display: block;}/* End hide from IE-mac */

.round{-moz-border-radius-topleft :6px;-webkit-border-top-left-radius:6px;-moz-border-radius-topright:6px;-webkit-border-top-right-radius:6px;-moz-border-radius-bottomleft :6px;-webkit-border-bottom-left-radius:6px;-moz-border-radius-bottomright :6px;-webkit-border-bottom-right-radius:6px;}