/* @override 
	http://www.villavillanola.com/demos/wp-content/themes/skimmedmilk/style.css
	http://www.villavillanola.com/demos/wp-content/themes/skimmedmilk1.2%20pure/style.css
	http://www.villavillanola.com/demos/wp-content/plugins/contact-form-7/styles.css?ver=2.4.2
*/

body {
	background-color: #fff;	
	color: #000;
	font-size: 14px;
	font-family: "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	line-height: 1.4;
	margin: 0;
	padding: 0;
	}
	
	#tweets li{
	float: right;
	list-style-type: none;
	list-style-image: none;
	color: #007c7d;
	text-align: right;
	margin-top: -20px;
	font: 11px;
}

li.ff a font{
	color: #c4008e;
}

/*	Links in orange. Background explicitly specified just to keep css validator happy */
a {
	background-color: inherit;	
	color: black;
	text-decoration: none;
}

/*	Show green when mousing over a link */
a:hover {
	background-color: black;	
	color: white;
	}
	
a:visited {
}

.current-cat a, a:active{
	color: #4b00ff;
	
}



/*	Most headers use the thinner Trebuchet font */
h1, h2, h3, h4, h5 {
	font-family: 'Trebuchet MS', 'Lucida Grande', Verdana, Arial, Sans-Serif;
	font-weight: bold;
	line-height: normal;
	margin: 0;
	padding: 0;
	}

/*	Blog title in header */
h1 {
	
	line-height: 1em;
	}

/*	Page title at top of content, and post titles in index and single */
h2 {
	font: Verdana, "Lucida Grande", Lucida, sans-serif;
	color: black;
}

/*	Post titles in archive and search, certain headers in comments */
h3 {
	
	}

/*	For user use */
h4 {
		margin: 0 0 0.5em 0;
	}

h5 {
	
	margin: 0 0 0.3em 0;
	}

/*	Paragraphs have some space below */
p {
	margin: 0 0 1.1em 0;
	}

#topmenu{
	margin-top: 25px;
	display: inline;
}

#topmenu div.tm a:hover {
	background-color: white;
}

#topmenu li{
	
	border-width: 0;
	list-style-image: none;
	list-style-type: none;
	display: inline;
	
}

#topmenu .sto li{
		}

div.tm  {
	margin-top: 11px;
	margin-left: 17px;
}

/*	The page contains everything, it centres itself horizontally within the browser*/
#page {
	width: 75em;
	min-width: 24em;
	max-width: 98%;
	text-align: left;
	margin: 0 auto 0 auto;
	
}

/*	The side bar contains the menu of useful links on the left
	Padding added just to stop Firefox overflowing this column when click and hold link */
#sidebar {
	width: 25%;
	float: left;
	text-align: right;
	overflow: visible;
	margin: 3em 1em 1em 0;
	padding: 0 1px 1px 0;
	
	text-transform: uppercase;
}

/*	The main column contains everything except the side bar, and sits against the right
	of the page */
#header, #content, #footer {
	width: 70%;
	float: right;
	}

/*	The main headers within the side bar are in upper case & in the wider font */
#sidebar h2 {
	font-family: "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	
	text-transform: uppercase;
	margin: 0;
	padding: 0.5em 0 0.4em 0;
	}
	
	h2.widgettitle{
	color: black;
}

/*	We don't want bullets drawn in our lists */
#sidebar ul {
	list-style-type: none;
	padding: 0;
	margin-bottom: 1px;
	margin-left: 1px;
	margin-right: 1px;
}
	
	ul.children{
	font-size: 9px;
	color: #000;
	font-style: italic;
}

li#paypal_donations-3.widget_paypal_donations{
	margin-top: 20px;
}

.dc-download-code {
	text-transform: uppercase;
	color: #cc0f10;
	font: bold 20px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}

.dc-download-code form p input{
	font: bold 25px "Courier New", Courier, mono;
	color: #fff;
	background-color: #4b00ff;
	border-color: #6700ff;
	border-width: 8px;
	-moz-border-radius: 10px;
border-radius: 10px;
}



/*	Some space below each sublist, separating it from the next h2 header */
#sidebar ul ul {
	margin: 0 0 1em 0;
	}

/*	This places right guillemot glyph before list items and
	similarly before the search submit link
	(fails in IE) */
#sidebar ul ul li:before, #searchform p:before {
	content: "\00BB  ";
	}

/*	A touch of space to separate links */
#sidebar ul ul li {
	margin: 0 0 0.24em 0;
	}

/*	Tighten up around sub-page & sub-category lists */
#sidebar ul ul ul {
	margin: 0;
	}

/*	Sub-pages & sub-categories don't get a smaller guillemot thingie (not IE) */
#sidebar ul ul ul li:before {
	content: "\203a  ";
	}

/*	Sub-sub-pages & sub-sub-categories and sub-sub-sub-etc don't get any blips */
#sidebar ul ul ul ul li:before {
	content: "";
	}
	
/*	The text box of the search form has space above it, and a little below too
	Can't say font: inherit as IE don't get it */
#searchform .s {
	font: 1em 'Lucida Grande', Verdana, Arial, Sans-Serif;
	width: 7em;
	margin: 2em 0 0.24em 0;
	padding: 0;
	}

/*	The header guards its white space */
#newsheader {
	background: url(http://www.villavillanola.com/random_splash/rotate.php) no-repeat;
	width: 635px;
	height: 235px;
	text-align: center;
	margin-left: 50px;
	margin-bottom: 10px;
}

#paperheader{
	background: url(http://www.villavillanola.com/images/paper_header.jpg) no-repeat;
	width: 635px;
	height: 235px;
	text-align: center;
	margin-left: 50px;
	margin-bottom: 10px;
}
	
#header a img{
	margin-left: -350px;
	margin-bottom: 30px;
	margin-top: -15px;
}
#header #header img{
	margin-left: -153px;
	margin-bottom: 30px;
}

/*	The footer resides below both the main column and the side bar
	Arial preferred over Verdana  to keep text narrow enough for wayward browsers */
#footer {
	clear: both;
	margin: 4em 0 1em 0;
	padding: 0.2em 0 0 0;
	
	font-family: 'Lucida Grande', Arial, Verdana, Sans-Serif;
	/*[*border: 1px solid orange; /*border]*/
	}
	
	#footer a{
	color: #4b00ff;
}

/*	content includes everything between the header and the footer. Body text dark gray */
#content {
	background-color: inherit;	
	color: #000;
	margin-top: 50px;
}

#content div.navigation a{
	
}

div.formcontainer form.contact-form fieldset {
	border-style: none;
	color: #4b00ff;
	font-size: 10px;
}

/*	Used for Archive & Search page headers as well as the top of 'Pages' */
h2.pagetitle {
	color: inherit;
	padding: 0.3em 0 0.3em 0.2em;
	margin: 0 0 2em 0;
	display: none;
}

h2.pagetitleH {
	background-color: #ffffff;
	color: black;
	font-size: 12px;
	padding-right: 0;
	padding-top: 0.1em;
	padding-bottom: 0.2em;
}

/*	This class holds the next posts/previous posts links
	1px lower padding just required to get Opera to honour margin setting (!) */
.navigation, .navigation a {
	margin: 0 0 12px;
	padding: 0 0 1px 0;
	text-transform: uppercase;
	color: black;
	font: 10px/10px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}
.navigation a {background-color: white;
	
}

.navigation a:hover{
	color: #f4f7fe;
	background-color: #8cfce1;
}

.alignright {
	float: right;
	}
	
.alignleft {
	float: left;
	}

/*
	Blocks containing only floating child elements seem to have no height. This hack allows
	an empty, non-floating, div to be appended to give the container its true height.
	Used in #page and .navigation */
.snap-to-fit {
	clear: both;
	visibility: hidden;
	}

/*	Each post has a some space below it */
.post {
	margin-right: 1em;
	margin-left: 0;
}


/*	Post titles on the index and single pages use h2 with a line above
	(Post titles in searches and archives use unadorned h3)
	Only posts following other posts (ie all but the first) have a line above
 	Not understood (so ignored) by WinIE */
.post+.post h2 {
	padding: 60px 0 0;
	border-top: 4px dotted #f7f7f7;
}
 
 
/*	Post titles are also links but are shown in normal text colour.
	Have to give text colour explicitly (rather than inherit) for IE */ 
.post h2 a, .post h3 a {
	background-color: inherit;	
	 color: black;
	text-transform: uppercase;
}

/*	..so we highlight them in orange as they are moused over */
.post h2 a:hover, .post h3 a:hover {
	background-color: inherit;	
	color: #000;
	}

/*	This sizes the main body text of posts.
	The overflow declaration stops oversized items such as images from bursting out of the
	page bounds; a local scroll bar is provided on demand instead
	Width 100% required by WinIE else it just lets the overflow occur
*/
.entry {
	width: 100%;
	
	margin: 10px 0 0 0;
	overflow: visible;
	}

.entry a:visited, .commentlist p a:visited {
	background-color: inherit;	
	color: #4b00ff;
}

/*	small is used for: blog tag line, the time below post titles, the footer text,
	and in comments for: form labels and comment metadata
*/
small, .postmetadata, blockquote, strike {
	font-size: 1em;
	line-height: 1.5em;
	color: #888;
	background-color: inherit;	
	}

/*	A little space above & below post metadata */	
.postmetadata {
	margin: 0.3em 0 1em 0;
}

/*	Both postmetadata on single, and alternate comments use this light backwash 
	but comment padding & margin is set separately below */
.alt {
	background-color: #f9f9f9;
	color: inherit;	
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	padding: 0.5em 1em 0.5em 1em;
	margin: 0;
	}
	
/* 	Used to hold phrases such as "Read more >>" together */
.nowrap {
	white-space: nowrap;
}

/*	For Number-of-Comments and Leave-a-Comment headers below single post */
h3.comments {
	margin: 2em 0 1em 0;
	}

/*	Contains all the comments, and gives them a neat right margin by justifying the text */
.commentlist {
	padding: 0;
	text-align: justify;
	}

/*	Each comment is a list item in an ordered list; could be numbered but we choose not */
.commentlist li {
	margin: 1.6em 0 0.4em 0;
	padding: 0.6em 1em 0.4em 1em;
	list-style: none;
	font-weight: normal;
	/*[*border: 1px solid red; /*border]*/
	}

/*	Can't say font: inherit; as IE don't get it */
 #commentform input, #commentform textarea {
	font: bold 2em "Courier New", Courier, mono;
	-moz-border-radius: 5px;
border-radius: 5px;
background-color: #0000af;
	border: 4px solid #80f;
	color: #fffffe;
}

.commentlist li{font: 17px "Courier New", Courier, mono;
	-moz-border-radius: 5px;
border-radius: 5px;
background-color: #8effd8;
	border: 4px solid #a30095;
	color: #ff5900;
	
}

#submitcomment, #submitcomment a {
	background-color: #f8711e;
	padding: 10px;
	color: #fffeff;
	font: bold 18px "Courier New", Courier, mono;
	text-transform: uppercase;
	-moz-border-radius: 5px;
border-radius: 5px;


}

#submitcomment{border: 4px solid #fada2c;

}

/*	Comment paragraphs are indented by 0.6em */
.commentlist p {
	margin: 1em 0.6em 1em 0;
	font-weight: normal;
	line-height: 1.5em;
	text-transform: none;
	}

/*	The name of the commenter is cited a little larger */
.commentlist cite {
	font-weight: bold;
	font-style: normal;
	font-size: 1.2em;
	}

/*	Spaces text in the form area */
#commentform p {
	margin: 0.6em 0;
	}

/*	Gives the name/mail/web text input boxes their width & spacing */
#commentform input {
	width: 16em;
	padding: 0.25em;
	margin: 0.6em 0.6em 0 0;
	}

/*	The main comment entry box fills the width of the content column */
#commentform textarea {
	width: 100%;
	margin: 0.6em 0 0 0;
	background-color: #edf3dd;
	border: 4px solid #00ffd6;
	color: #f73a61;
}

/*	The text of the "Submit Comment" link should be on the right */
#commentform #submitcomment {
	margin: 0;
	float: right;
	}

/*	I've added this to highlight a comment in limbo.. */
.awaitingmoderation {
	border: 1px solid #f00;
}

/*	..and this for 404 page titles */
.problem {
	color: #f00;
	background-color: inherit;	
}

hr {
	margin: 0;
	padding: 0;
}

/*	Image defaults
	Safari bug squishes image out of aspect when shrinking for max-width: 100% here
	But current Web-kit builds seem to have fixed this so next release might be OK
	Removing the max-width line allows large images to be full size: scroll to see all
*/
img {
	max-width: 100%;
	padding: 0;
	margin: 0;
	}

a img {
	border: none;
	}

/*	Using these classes with img elements is preferable to align="..." attribute */
img.centered {
	display: block;
	margin: 0.6em auto 0.6em auto;
	}

/*	The actual alignment is done by the general .alignleft rule above
	Typical usage would be for a leading  small picture with text flowing past its right edge */
img.alignleft {
	margin: 0.6em 0.9em 0.6em 0;
}

img.alignright {
	margin: 0.6em 0 0.6em 0.9em;
}

/*	Lists inside posts
	The html>body prefix is not understood by IE which therefore doesn't read these rules
	as the stylized bullets don't work in IE anyway */
html>body .entry ul {
	margin: 0;
	padding: 0 0 0 2em;
	list-style: none;
	text-indent: -1em;
	}

html>body .entry li {
	margin: 0.8em 0 0.9em 1.1em;
	}

.entry ul li:before {
	content: "\00BB  ";
	}

.entry ol {
	padding: 0 0 0 2em;
	margin: 0;
	}

.entry ol li {
	margin: 0;
	padding: 0;
	}

ol li {
	list-style: decimal outside;
	}

/*	Code should be used for just a few words.. */
code {
	font: 1.1em 'Courier New', Courier, Monospace;
	}
	
/*	..and the pre tag works better for whole code excerpts */
pre {
	background-color: #f9f9f9;
	color: black;
	padding: 0.6em 0 0.6em 0.6em;
	margin: 0 0 1em 0;
	font: 1.1em 'Courier New', Courier, Monospace;
	white-space: pre;
	overflow: auto;
	border: 1px solid #ddd;
}

/*	Horrible hack to try to stop IE overflowing on long lines in pre elements.
	IE needs a width to turn on overflow, but 100% here with padding leads to the
	overflow scroller itself causing the entry to overflow in turn. Nasty.
	So this just truncates the pre block. Also nasty, but slightly less ugly.
	(The * html prefix selects IE out of all browsers as its the only one to think
	there is a super-element surrounding the html one)
*/
* html pre {
	width: 30em;
}

acronym, abbr, span.caps {
	font-size: 1em;
	letter-spacing: .08em;
	cursor: help;
	}

acronym, abbr {
	border-bottom: 0.2em solid #ddd;
	}

blockquote {
	margin: 1.6em 2.8em 0 1.4em;
	padding: 0 0 0 2em;
	border-left: 0.6em solid #ddd;
	}

strong, b {
	font-weight: bold;
	}

em, i {
	font-style:italic;
	}
	
div.sociable ul li, div.sociable ul {
	display: inline;
	list-style-type: none;
	opacity: 1;
	list-style-image: none;
	text-align: left;
}

div.sociable { margin: 16px 0;
	text-align: left;
}

span.sociable_tagline { position: relative; }
span.sociable_tagline span { display: none; width: 14em; }
span.sociable_tagline:hover span {
	position: absolute;
	display: block;
	top: -5em;
	background: #ffe;
	border: 1px solid #ccc;
	color: black;
	
}
.sociable span {
	display: block;
}
.sociable ul {
	display: inline;
	margin: 0 !important;
	padding: 0 !important;
}
.sociable ul li {
	background: none;
	display: inline !important;
	list-style-type: none;
	margin: 0;
	
}
.sociable ul li:before { content: ""; }
.sociable img {
	float: none;
	
	border: 0;
	margin: 0;
	padding: 0;
}

.sociable-hovers {
	opacity: .9;
	-moz-opacity: .4;
	filter: alpha(opacity=70);
}
.sociable-hovers:hover {
	opacity: 1;
	-moz-opacity: 1;
	filter: alpha(opacity=100);
}

.widget_global_translator{
	
	padding-top: 15px;
	padding-bottom: 5px;
}

.widget_global_translator h2{
	display: none;
}

