/*
Theme Name: mySociety
Theme URI: http://www.mysociety.org/
Description: The theme used on www.mysociety.org and cee.mysociety.org
Author: mySociety
Author URI: http://www.mysociety.org/
*/

/* Main layout */
body {text-align:center;font-family:tahoma, Geneva, sans-serif; font-size:1em; color:#333;}
#divPage {text-align:left; width:48em; margin:0 auto; position:relative;}

/* Header & menu */
#pHeaderDonate {position:absolute; float:left; padding-left:57px;
        font-size:0.7em; height:100px; right:0; top:0;}
#pHeaderDonate #aPiggy {position:absolute; top:-5px; left:0; width:42px; height:56px;background:url(images/piggy.png) 0 0; text-decoration:none;}
#pHeaderDonate #aPiggy:hover {background:url(images/piggy.png) 0 -97px;}
#divMenu {background:url(images/menu.png) left bottom repeat-x; border:solid 1px #dfdfdf;
        height:2em; position:relative;}
#divMenu ul {position:relative; top:0.3em; left:0.8em;width:100%;}
#divMenu ul li a {padding-right:0.6em; padding-left:0.6em; border-left:1px dotted #cccccc;font-size:94%;}
#divMenu ul li.first-child a {padding-left:0; border-left:none;}
#divMenu ul li a, #divMenu ul li a:visited {text-decoration:none; color:#535353;}        
#divMenu ul li a:hover {color:#2c4a9e;}

#divMenu form {position:absolute; right:0.4em; top:0.2em;}
#divMenu label {display:none;}

/* Links */
a {color:#2c4a9e;}
a:visited {color:#445587;}
a.morelink {position:relative; top:0.5em;}

/* Headers */
h1 {font-weight:normal;font-size:1.5em;padding-left:0.4em; padding-bottom:0.3em;}
h2 {font-weight:normal; color:#639F67; padding-bottom:0.5em;}
h3 {font-weight:normal; font-size:1.2em;}

/* Layout blocks */
#divContent {padding-top:1.2em; font-size:0.9em;}
div.contenthalf, div.contentwide, div.contentnarrow {float:left;}
div.contenthalf, div.contentwide, div.contentnarrow, div.contentfull, 
	div.contentnarrowalt, div.contentwidealt {padding:1em;}
div.contenthalf.left, div.contentwide.left, div.contentnarrow.left, div.contentfull.left {margin-right:0.6em;}
div.contenthalf.right, div.contentwide.right, div.contentnarrow.right, div.contentfull.right {margin-left:0.6em;}
div.contenthalf {width:23.9em;}
div.contentwide {width:36em;}
div.contentnarrow {width:12.5em;}
div.contentfull {padding:0 1.3em; min-height: 3em;}

/* dividers */
div.dividertop {border-top:dotted 1px #ccc;}
div.dividerbottom {border-bottom:dotted 1px #ccc;}
div.dividerright {border-bottom:dotted 1px #ccc;}
div.dividerleft {border-left:solid 1px #ccc;}

/* Link buttons */
a.linkbutton {background:url(images/buttonmiddle.png) repeat-x;position:relative;height:44px;display:block; float:left;
	padding:0 14px;text-decoration:none; font-size:1.3em; color:#2c9e2c;}
a.linkbutton span.left {background:url(images/buttonleft.png) top left no-repeat;position:absolute;left:0; top:0;
	display:block;width:8px; height:44px;}
a.linkbutton span.middle {position:relative; top:11px;}
a.linkbutton span.right {background:url(images/buttonright.png) top right no-repeat;position:absolute;right:0; top:0;
		display:block;width:8px; height:44px;}

/* tick list */
ul.ticklist {list-style-type:none;margin:0 0 1.5em 0;padding:0;}
ul.ticklist li {margin:0;padding:0 0 8px 29px; background:url(images/tick.png) no-repeat 2px 2px;}

/* info boxes */
div.infobox img, div.infoboxpurple img {border:none;}
div.infobox {background:#f7eaf8; padding:6px; text-align:center; border:dotted 1px #e4c8e5;}
div.infoboxpurple p, div.infoboxgreen p, div.infoboxblue p {margin-top:0.4em}
div.infoboxpurple h3, div.infoboxgreen h3, div.infoboxblue h3 {font-weight:bold;}
div.infoboxpurple {border:solid 1px #e4c8e5;background:#f1e2f2 url(images/purplefade.png) repeat-x;}
div.infoboxgreen {border:solid 1px #ceead0;background:#e2ffeb url(images/greenfade.png) repeat-x;}
div.infoboxblue {border:solid 1px #c1deff;background:#e9f3fe url(images/bluefade.png) repeat-x; margin-bottom: 0.5em}
span.infobottom {display:block; height:2px!important; overflow:hidden;width:100%; position:absolute; bottom:0; left:0;}
div.infoboxpurple span.infobottom {background:url(images/purplefadebottom.png)}
div.infoboxgreen span.infobottom {background:url(images/greenfadebottom.png); }
div.infoboxblue span.infobottom {background:url(images/bluefadebottom.png); }

div.contentfull.infoboxpurple, div.contentfull.infoboxgreen, div.contentfull.infoboxblue {
    padding-top: 0.6em;
    margin-bottom: 1.2em;
}

/* sidebar */
div.sidebar h4 {color:#1c6f1b; margin-bottom:0.3em;}
div.sidebar a, #divSidebar a:visited {color:#333;text-decoration:none;}
div.sidebar a:hover {color:#2c4a9e!important}
div.sidebar ul {margin-bottom:1.1em;}
div.sidebar ul ul {margin-bottom:0;}

#sidebar_rss {
    margin-bottom: 1em;
    margin-top: 0;
}
#sidebar_rss img {
    padding: 0;
}

/* tech spec boxes */
div.techspec {background:#efefef; font-size:0.8em; border-top:solid 4px #ddd; border-bottom:solid 4px #ddd; color:#333; margin-bottom:1em;}
div.techspec ul {list-style-type:square;margin:0 0 0 1.5em;padding:1%; float:left; width:28%;}

/* citations, quotes etc */
blockquote, quote {font-style:italic;}
blockquote {padding:0 0 0.3em 0;margin:0;}
cite {font-style:normal; font-size:0.9em;}

/* Product pages */
#divProductHeadline a.linkbutton {float:none; margin:0 20px;}
#divProductHeadline p {font-size:1.3em;}
div.productdetail dl {float:left; width:50%;}
div.productdetail dt {font-weight:bold;}

/* Blog */
div.post {margin-bottom:1.5em;}
#divElsewhere {margin-top:1em;}

/* images */
img {border:dotted 1px #ccc; padding:6px;}
ul img {border:none;}

/* highlight */
span.highlight {padding: 0 4px; background:#ffffaa;}

/* Hero section */
#divHero {
    border:solid 1px #e4c8e5;
    position:relative;
    margin-top:1.5em;
    padding: 1.2em 0 1em;
    width:53.2em;
}
#divHero h3 {
    padding-top:0;
}
#divHero h3, #divHero p {
    padding-left:370px;
    padding-right:1em;
}
#divHero p {
    margin-bottom:0;
    margin-top:0.4em;
}
#divHero img {
    position:absolute;
    top:-27px;
    left:3px;
}

/* Projects list */
ul#project_list {
    font-size: 1.1em;
    margin: 0;
    padding: 0;
    list-style-type: none;
}

ul#project_list li {
    margin: 1em 0 1.5em 0;
}

/* Projects page */
div.projects-entry {
    clear: both;
    margin: 1em 0;
    border-bottom: solid 1px #dfdfdf;
}
div.projects-entry:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

div.projects-entry div {
    width: 129px;
}

div.projects-entry h3 {
    font-size: 1.1em;
    margin-top: 0;
}

div.projects-entry h3 img {
    float: left;
    margin: 0 15px 5px 0;
    border:dotted 1px #ccc;
}

/* Footer */
#divFooter {
    font-size: 0.8em;
    border-top: solid 1px #dfdfdf;
    border-bottom: solid 1px #dfdfdf;
}
#divFooter dt {float:left; width:13em; color:#616161;clear:left;font-weight:bold;}
#divFooter dd {float:left; width:50em; padding-bottom:0.5em;}
#divFooter dd ul li {padding-right:0.8em; line-height:1.5em;}
#divFooter p {margin:0;padding:1.5em 0 0 0;color:#616161; position:relative; top:-0.4em; clear: both; }

/* Styles for wordpress elements */
.wp-caption.alignleft { float: left;margin: 0px 15px 5px 0px;}
.wp-caption.alignright { float: right;margin: 0px 0px 5px 15px;}
.wp-caption-text {
    font-size: 83%;
    margin-top: 0;
    text-align: center;
}

/* Call for proposals */
div.proposalsintro {font-size:1.25em;}
div.proposalsintro p {margin-top:0;}
#divProposalForm {padding-top:2em;}


/* Advert */
#divShout {background:#ffffaa; border:solid 1px #ffff00; padding:0.5em; margin-top:1em; text-align:center; font-size:0.8em;}



/* projects/services pages */

#mysoc-projects {
	padding-bottom: 20px;
}

#mysoc-projects .intro {
    padding-bottom: 2em;
}

#mysoc-projects .left-col {
    float: left;
    width: 66%;
    margin:0;
}

#mysoc-projects .right-col {
    /* margin: 0 0 0 68%; */
	-moz-border-radius: 15px;
	border-radius: 15px;
	background-color: #d8e5ab;
	float:right;
	width: 33%;
}

#mysoc-projects .row-of-two {
	clear:both;
}

#mysoc-projects .row-of-three {
    padding-top: 1.5em; /* note: because row-of-three projects have h1 titles protruding 1em above their tops (yes, bodge) */
	clear:both;
}

#mysoc-projects .project-box {
	float: left;
	margin: 0px;
	padding: 0px;
	position: relative; /*  parent of absolutely positioned stickers */
}
#mysoc-projects .row-of-three .project-box { width: 32%; }
#mysoc-projects .row-of-two .project-box   { width: 49%; }

#mysoc-projects .project-box .wrapper {
	margin:8px 12px;
	border: 2px solid #2c9f2a;
	-moz-border-radius: 15px;
	border-radius: 15px;
	background-color: #fff;
}

#mysoc-projects .project-box h1, #mysoc-projects .left-col h1, #mysoc-projects .right-col h1  {
	font-size: 130%;
	text-align: center;
	min-height: 0px; /* IE7 fix to display despite -ve top margin */
	margin:-1em 12px 0.5em 12px;	
	border: 2px solid #2c9f2a;
	text-shadow: #76cc38 -1px -1px 1px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	color: #fff;
	background: #b4e391; /* Old browsers */
	background: -moz-linear-gradient(top, #b4e391 0%, #61c419 70%, #b4e391 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b4e391), color-stop(70%,#61c419), color-stop(100%,#b4e391)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #b4e391 0%,#61c419 70%,#b4e391 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #b4e391 0%,#61c419 70%,#b4e391 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, #b4e391 0%,#61c419 70%,#b4e391 100%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b4e391', endColorstr='#b4e391',GradientType=0 ); /* IE6-9 */
	background: linear-gradient(top, #b4e391 0%,#61c419 70%,#b4e391 100%); /* W3C */
}

#mysoc-projects .project-box h2 {
	font-size: 100%;
	text-align: center;
	font-weight: bold;
	margin-top: 0.666em;
}

#mysoc-projects .project-box h2, #mysoc-projects .project-box h2 a {
	color: #000000;
	text-decoration: none;	  
}
#mysoc-projects .project-box p {
	margin: 8px;
}
#mysoc-projects .project-box p a {
	color: #2c9f2a;
	text-decoration: none;	  
}
#mysoc-projects .project-box p a:hover, #mysoc-projects .project-box h2 a:hover {
	text-decoration: underline;
}

/* 
	project-image should contain a screenshot, 
	specified explictly as a background-image in the style attribute
*/
#mysoc-projects .project-box .project-image {
	width:90%;
	height:100px;
	margin:8px auto;
	background-position: top left;
	background-repeat: no-repeat;
	border: 3px solid #ccea64;
	-moz-border-radius: 6px;
	border-radius: 6px;
	background-size: 100%;
}

#mysoc-projects .more-buttons {
	padding: 8px;
	clear: both;
	text-align: right;
}
#mysoc-projects .more-buttons a {
	display: block;
	float: right;
	clear: both;
	color: #2c9f2a;
	margin: 8px;
	padding: 8px;
	-moz-border-radius: 1em;
	border-radius: 1em;
	line-height: 1.5em;
	height: 1.5em;
	border: 2px solid orange;
	text-decoration: none;
	background: #fefcea;
	background: -moz-linear-gradient(top, #fefcea 13%, #f1da36 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(13%,#fefcea), color-stop(100%,#f1da36));
	background: -webkit-linear-gradient(top, #fefcea 13%,#f1da36 100%);
	background: -o-linear-gradient(top, #fefcea 13%,#f1da36 100%);
	background: -ms-linear-gradient(top, #fefcea 13%,#f1da36 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefcea', endColorstr='#f1da36',GradientType=0 );
	background: linear-gradient(top, #fefcea 13%,#f1da36 100%);	   
}
#mysoc-projects .more-buttons a:hover {
	text-decoration: underline;
	background: #ffc578;
	background: -moz-linear-gradient(top, #ffc578 0%, #fb9d23 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffc578), color-stop(100%,#fb9d23));
	background: -webkit-linear-gradient(top, #ffc578 0%,#fb9d23 100%);
	background: -o-linear-gradient(top, #ffc578 0%,#fb9d23 100%);
	background: -ms-linear-gradient(top, #ffc578 0%,#fb9d23 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffc578', endColorstr='#fb9d23',GradientType=0 );
	background: linear-gradient(top, #ffc578 0%,#fb9d23 100%);
}

#mysoc-projects .project-box .sticker {
    color: #fff;
    text-decoration: none;
    font-weight: bold;
    font-size: 80%;
    text-align: center;
    position: absolute;
    top: 23px;
    right: -20px;
    z-index: 3;
    width: 120px;
    height: 120px;
    background-position: top center;
    display:block;
    background-color: transparent;
}
#mysoc-projects .project-box .sticker:hover {
    background-position: bottom center;    
}

#mysoc-projects .project-box .sticker-council {
    background-image:url(/contimg/project-images/red-council-sticker.png);
}
#mysoc-projects .project-box .sticker-council-charity {
    background-image:url(/contimg/project-images/orange-council-sticker.png);
}
#mysoc-projects .project-box .sticker-business {
    background-image:url(/contimg/project-images/blue-business-sticker.png);
}
#mysoc-projects .project-box .sticker-transport {
    background-image:url(/contimg/project-images/yellow-transport-sticker.png);
}
#mysoc-projects .project-box .sticker-new {
    position: absolute;
    z-index: 2;
    width: 50px;
    height: 50px;
    background-position: top center;
    display:block;
    background-color: transparent;
    background-image:url(/contimg/project-images/green-new-sticker.png);
    top:100px;
    left: 24px;    
}
#mysoc-projects .project-box .nudged { /* small offset to break alignment */
    top: 4px;
    right: -13px;    
}
#mysoc-projects .project-box .nudged-down { /* small offset to break alignment */
    top: 60px;
}
#mysoc-projects .project-box .nudged-low { /* small offset to break alignment */
    top: 110px;
    left: 6px;
}
#mysoc-projects .project-box .nudged-super-low { /* small offset to break alignment */
    top: 140px;
    left: 0px;
}
 /* end of projects/services pages */
