﻿/*
Theme Name: SF Public Schools
Theme URI: 
Description: A custom Wordpress theme for San Francisco Public Schools 
Author: Steven Aranaga for Citizen Group
Author URI: http://www.citizengroup.com/
version: 1.0
*/

/* basics */

*{margin:0; padding:0;}

body {
	background: #FFF;
	font: normal 11pt Arial, Helvetica, sans-serif;
	color: #666;
	}
	
h1 {font-size: 18pt;}
h2 {font-size: 14pt; margin-top:10px;}
h3 {font-size: 10pt; font-weight: 300;}
h4 {font-size: 9pt;}

/* images and misc. */

img{ border: none; padding: 6px; }
img a{border:none;}

img.left{ float: left; border: none; padding: 6px; }
img.right{ float: right; border: none; padding: 6px; }
img.banner {padding: 15px 0 10px 0;}
img.blogbanner {padding: 5px 0 10px 0;}

blockquote{
	border-left:1px solid #A5ABAB;
	margin:15px;
	padding:0 12px 0 12px;
	}

code{
	margin:10px;
	font-family:"Courier New", Courier, monospace;}

/* links */

a{
	color:#666;
	text-decoration:none;
	border-bottom:none;
	}

a:hover{color:#666;text-decoration: none; border: none;}

/* container */

#container {
	width: 1024px;
	margin: auto;
	padding: 0;
	background:#fff;
	color:#666;
	overflow: hidden;
	font-family: Arial, Helvetica, sans-serif;

	}
	
/* header */

#header {
	width: 1024px; 
	height: 110px;
	color: #666; 
	}
	
#headerimg{
	width: 1024px;
	height: 120px;
	}
	
#headerimg img{
	padding: 0;
	float:left;
	}

img#headerlink {
	margin: 20px 0 0 0;
}

#header h1{
	font-family: Arial, Helvetica, sans-serif;
	font-variant:small-caps;
	font-size: 24pt;
	font-weight: 400;
	margin: 0;	
	padding: 60px 0 0 325px;	
	width: 100%;
	text-align:left;
	color:#666;
	}
	
#header h1 a{color: #666; text-decoration: none;}
#header h1 a:hover{color: #666; text-decoration: none;}


#header h2{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10pt;
	font-weight: 300;
	color: #666;
	letter-spacing: 1px;
	margin: 0;	
	padding: 0;	
	width: 100%;
	text-align: center;	
	}

/* add to any/language selector */

#buttons {
	width: 350px;
	float: right;
	clear: right;
	padding: 0;
	margin: 10px 0 0 0;
	}

.addtoany_share_save_container{
	float:left;
}

#language_lister{
	float: right;
	text-align: center;
	background:#F2F2F2;
}

#language_lister ul{
	list-style: none;
	margin:0;
	padding:0;
}

#language_lister ul li{
	color: #666;
	font-size: 10pt;
	text-decoration:none;
	display:inline;
	padding:0 10px 0 5px;
}

#language_lister ul li.orange{
	background:url(images/language_bg.jpg) repeat-x;
	color: #FFF;
	padding: 0 0 0 5px;
	margin-right: 5px;
}

/* main menu */

/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/final_drop.html
Copyright (c) 2005-2008 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */

.menu {width:1023px; height:40px; position:relative; z-index:100;border-right:1px solid #999; font-family: Arial, Helvetica, sans-serif;}
/* hack to correct IE5.5 faulty box model */
* html .menu {width:1024px; w\idth:1024px;}
/* remove all the bullets, borders and padding from the default list styling */
.menu ul {padding:0;margin:0;list-style-type:none;}
.menu ul ul {width:149px;}
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu li {float:left;width:255.5px;position:relative;}
/* style the links for the top level */
.menu a, .menu a:visited {display:block;font-size:12px;text-decoration:none; text-transform:uppercase; color:#666; width:245.5px; height:40px; border:1px solid #999; border-width:0 1px 0 1px; background:#999 url(images/menu_img.jpg) repeat-x; padding-left:10px; line-height:40px; font-weight:bold; vertical-align:middle; text-align:center;}
/* a hack so that IE5.5 faulty box model is corrected */
* html .menu a, * html .menu a:visited {width:255.5px; w\idth:255.5px;}

/* style the second level background */
.menu ul ul a.drop, .menu ul ul a.drop:visited {background:#999 url(images/menu_img_2nd.jpg) repeat-x;}
/* style the second level hover */
.menu ul ul a.drop:hover{background:#999 url(images/menu_img_2nd.jpg) repeat-x;}
.menu ul ul :hover > a.drop {background:#999 url(images/menu_img_2nd.jpg) repeat-x;}
/* style the third level background */
.menu ul ul ul a, .menu ul ul ul a:visited {background:#999 url(images/menu_img_2nd.jpg) repeat-x;}
/* style the third level hover */
.menu ul ul ul a:hover {background:#999 url(images/menu_img_2nd.jpg) repeat-x;}


/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {visibility:hidden;position:absolute;height:0;top:40px;left:0; width:255.5px;}
/* another hack for IE5.5 */
* html .menu ul ul {top:40px;t\op:40px;}

/* position the third level flyout menu */
.menu ul ul ul{left:255.5px; top:-1px; width:255.5px;}

/* position the third level flyout menu for a left flyout */
.menu ul ul ul.left {left:-149px;}

/* style the table so that it takes no ppart in the layout - required for IE to work */
.menu table {position:absolute; top:0; left:0; border-collapse:collapse;;}

/* style the second level links */
.menu ul ul a, .menu ul ul a:visited {background:#999 url(images/menu_img_2nd.jpg) repeat-x;; color:#666; height:30px; line-height:30px; padding:0; width:256px; border:0px; vertical-align:middle; text-align:center;}
/* yet another hack for IE5.5 */
* html .menu ul ul a, * html .menu ul ul a:visited {width:256px;w\idth:256px;}

/* style the top level hover */
.menu a:hover{color:#666; background:#999 url(images/menu_img.jpg) repeat-x;}
.menu ul ul a:hover{color:#666; background:#999 url(images/menu_img_2nd.jpg) repeat-x;}
.menu :hover > a {color:#666; background:#999 url(images/menu_img.jpg) repeat-x;}
.menu ul ul :hover > a {color:#666; background:#999 url(images/menu_img_2nd.jpg) repeat-x;}

/* make the second level visible when hover on first level list OR link */
.menu ul li:hover ul,
.menu ul a:hover ul{visibility:visible; }
/* keep the third level hidden when you hover on first level list OR link */
.menu ul :hover ul ul{visibility:hidden;}
/* make the third level visible when you hover over second level list OR link */
.menu ul :hover ul :hover ul{ visibility:visible;}

/* homepage image slideshow */

#img-gallery {
	background: #FFFFFF;
	position: relative;
	width: 680px;
	margin: 0 0 36px 0;
	float:left;
	padding: 0 0 0 20px;
}
#img-gallery ul {
	background: #BBB;
	padding: 0;
	list-style: none;
	border: 1px solid #CCC;
	margin: -32px 0 0 10px;
	display: none;
	float:left;
	width:100%;
}
#img-gallery ul li {
	display: inline;
}
#img-gallery ul a {
	display: block;
	padding: 2px 8px;
	text-decoration: none;
	border-bottom: none;
	background: #BBB;
	outline: 0;
	color: #666;
	float:left;
	clear:none;
}
#img-gallery ul a#playstop {
	background: #4a4a4a url(images/play.gif) no-repeat center;
}
#img-gallery ul a#playstop.stop {
	background: #FFF url(images/stop.gif) no-repeat center;
}
#img-gallery ul a.active {
	background: #EEE;
	color: #666;
}
#img-gallery #img-description {
	background: #000;
	color: white;
	font-weight: bold;
	position: absolute;
	display: none;
	width: 100%;
	visibility:hidden;
}
#img-gallery #img-description p {
	padding: 0;
	margin: 0;
}
#img-gallery img {
	border: 1px solid #CCC;
	display: block;
	padding: 5px 10px 36px 10px;
}

/* New Rules slideshow applet */
/*

	GalleryView Stylesheet
	
	Use the CSS rules below to modify the look of your gallery.
	
	To create additional rules, use the markup below as a guide to GalleryView's architecture.
	
	<div class="gallery">
		<div class="panel">
			<img src="path/to/image.jpg" />
			<div class="panel-overlay">
				...overlay content...
			</div>
			<div class="overlay-background"></div>
		</div>
		<ul class="filmstrip">
			<li class="frame current">
				<img src="path/to/thumbnail.jpg" />
				<div class="caption">caption text</div>
			</li>
			<li class="frame">
				<img src="path/to/thumbnail.jpg" />
				<div class="caption">caption text</div>
			</li>
		</ul>
	</div>
		

*/

/* GALLERY LIST */
/* IMPORTANT - Change '#photos' to the ID of your gallery list to prevent a flash of unstyled content */
#rules { visibility: hidden; }

/* GALLERY CONTAINER */
.gallery { background: #FFF; border: none; padding: 0;}

/* LOADING BOX */
.loader { background: url(loader.gif) center center no-repeat #ddd; }

/* GALLERY PANELS */
.panel {}

/* DEFINE HEIGHT OF PANEL OVERLAY */
/* NOTE - It is best to define padding here as well so overlay and background retain identical dimensions */
.panel .panel-overlay,
.panel .overlay-background { height: 60px; padding: 0 1em; }

/* PANEL OVERLAY BACKGROUND */
.panel .overlay-background { background: #222; }

/* PANEL OVERLAY CONTENT */
.panel .panel-overlay { color: white; font-size: 0.7em; }
.panel .panel-overlay a { color: white; text-decoration: underline; font-weight: bold; }

/* FILMSTRIP */
/* 'margin' will define top/bottom margin in completed gallery */
.filmstrip { margin: 5px; }

/* FILMSTRIP FRAMES (contains both images and captions) */
.frame {}

/* WRAPPER FOR FILMSTRIP IMAGES */
.frame .img_wrap { border: 1px solid #CCC; }

/* WRAPPER FOR CURRENT FILMSTRIP IMAGE */
.frame.current .img_wrap { border-color: #666; }

/* FRAME IMAGES */
.frame img { border: none; }

/* FRAME CAPTION */
.frame .caption { font-size: 11px; text-align: center; color: #666; }

/* CURRENT FRAME CAPTION */
.frame.current .caption { color: #666; }

/* POINTER FOR CURRENT FRAME */
.pointer {
	border-color: #000;
}

/* TRANSPARENT BORDER FIX FOR IE6 */
/* NOTE - DO NOT CHANGE THIS RULE */
*html .pointer {
	filter: chroma(color=pink);
}

/* regular static pages */

#staticpage {
	width: 100%;
	overflow: hidden;
	}	

#staticpage .data {
	margin: 0;
	padding:20px 10px 20px 5px;
	line-height: 14pt;
	text-align: center;
	}
	
#staticpage .data img{
	padding: 0;
	margin: 0;
	border: none;
	}
	
.data ul {
	list-style-type:none;
	}

.data li {}

/* home page */

#homepage {
	width: 340px;
	overflow: hidden;
	padding:0;
	margin:20px 0 20px 0;
	float:left;
	}	

#homepage .data {
	margin:0;
	}
	
#homepage img {
	margin: 0;
	padding: 0;
	}

/* lined page */

#linedpage {
	width: 760px;
	overflow: hidden;
	float:left;
	margin:0;
	}	

#linedpage .data {
	margin: 0 10px;
	padding:150px 10px 10px 110px;
	line-height: 73px;
	text-align: left;
	}

#linedpage img {
	padding: 20px 0 103px 0;
	margin: 0;
	}

#linedpage h1 {
	font-weight: normal;
	border: none;
	color: #999;
	font-family:"Comic Sans MS", cursive;
	text-decoration:none;
	font-size: 20px;
	}

#linedpage h1:hover {
	color: #369;
	}

div.hover
{
	background-color: #FFF;
	border: 1px #999 solid;
	width: 400px;
	left: 0;
	top: 0;
	position: absolute;
	text-align: left;
	z-index: 20;
}

div.hover .tipheader {
	background: #F2F2F2;
	width: 340px;
	padding: 10px 30px 10px 30px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: bold;
	color: #C63;
	border-bottom: 1px #cc6633 dotted;
	text-indent: -17px;
	}

div.hover .tipbody {
	padding: 10px 20px 10px 30px;
	width: 350px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #666;
	overflow: auto;
	}

div.hover .tipbody a {
	text-decoration:none;
	border-bottom: none;
	font-weight:bold;
	color: #369;
	}

div.hover .caption {
	background: #F2F2F2;
	color: #666;
	height: 0px;
	padding: 5px 10px 0 0;
	}

/* 2-column pages (What's at Stake and Our Partners) */

#stakepage, #partnerspage {
	width: 100%;
	overflow: hidden;
	padding:0;
	margin:10px 0 10px 0;
	}	

#stakepage .data, #partnerspage .data  {
	margin: 0 10px;
	padding: 0;
	text-align: left;
	font-size: 10pt;
	}
	
#stakepage #leftside, #partnerspage #leftside {
	width: 300px;
	margin: 0;
	padding: 0 30px 0 0;
	float:left;
	clear:none;
	border-right: #BBB 1px dashed;
	}
	
#stakepage #rightside {
	width: 620px;
	margin: 0 0 0 10px;
	padding: 20px;
	float:right;
	clear:none;
	background: #F2F2F2;
	}

#partnerspage #rightside {
	width: 620px;
	margin: 0 0 0 10px;
	padding: 10px 20px;
	float:right;
	clear:none;
	background: #F2F2F2;
	}

#stakepage p.quote {
	font-size:10pt;
	color:#C93;
	padding-bottom: 5px;
	padding-right: 0;
	font-weight:bold;
	line-height: 20px;
	text-indent: -7px;
	}
	
#partnerspage p.quote {
	font-size:10pt;
	color:#DEB935;
	padding-bottom: 5px;
	font-weight:bold;
	line-height: 20px;
	text-indent: -7px;
	}
	
#stakepage p.quoteauthor, #partnerspage p.quoteauthor {
	font-size:10pt;
	font-style:italic;
	padding-bottom: 40px;
	}
	
#stakepage p.quoteauthorlast {
	font-size:10pt;
	font-style:italic;
	padding-bottom: 25px;
	}
	
#partnerspage p.quoteauthorlast {
	font-size:10pt;
	font-style:italic;
	padding-bottom: 152em;
	}
	
#stakepage #rightside h2 {
	font:12pt Arial, Helvetica, sans-serif;
	font-weight:bold;
	color: #C93;
	padding: 0;
	}
	
#stakepage #rightside h3 {
	font:11pt Arial, Helvetica, sans-serif;
	font-weight:bold;
	color: #666;
	padding: 30px 0 5px 0;
	}

#stakepage #rightside h4 {
	font:10pt Arial, Helvetica, sans-serif;
	font-weight:bold;
	color: #666;
	padding: 0 0 5px 0;
	}

#partnerspage #rightside h1 {
	font:13pt Arial, Helvetica, sans-serif;
	font-weight:bold;
	color: #693;
	padding: 0;
	}
	
#partnerspage #rightside h2 {
	font:11pt Arial, Helvetica, sans-serif;
	font-weight:bold;
	color: #666;
	padding-bottom: 10px;
	margin: 0;
	}
	
#partnerspage #rightside h3 {
	font:11pt Arial, Helvetica, sans-serif;
	font-weight:bold;
	color: #693;
	padding: 0;
	}

#partnerspage #rightside h4 {
	font:10pt Arial, Helvetica, sans-serif;
	font-weight:bold;
	color: #666;
	padding-bottom: 10px;
	border-bottom: 1px solid #CCC;
	}

#partnerspage .partnerlogo {
	float: left;
	width: 150px;
	height: 130px;
	padding-top: 10px;
	text-align:center;
	}

#partnerspage .partnerdesc {
	float: left;
	width: 460px;
	height: 140px;
	font-size: 9pt;
	}

#stakepage #rightside p {
	padding: 10px 0 0 0;
	}
	
#partnerspage #rightside p {
	padding: 0;
	}
	
#stakepage #rightside a, #partnerspage #rightside a {
	font-weight:bold;
	color: #369;
	}
	
#partnerspage #rightside a.partner {
	font-weight:bold;
	color: #666;
	}
	
#stakepage p.action {
	text-decoration:none;
	border-bottom: none;
	font-weight:bold;
	color: #369;
	margin-top: 20px;
	}
	
#stakepage #rightside img {
	padding: 0 20px 5px 0;
	margin: 0;
	float:left;
	}

#partnerspage p.desc {
	margin: 10px 0;
	}
	
#partnerspage #rightside img {
	padding: 20px 20px 15px 0px;
	margin: 0;
	float:left;
	clear:both;
	}
	
#partnerspage #rightside img.logo {
	padding: 0;
	margin: 0;
	}
	
#partnerspage #rightside img.join {
	padding: 20px 20px 15px 150px;
	margin: 0;
	}
	
#partnerspage #credits {
	width: 660px;
	margin: 30px 0 0 0;
	float: right;
	clear: both;
	}
	
#partnerspage #credits .green {
	font:10pt Arial, Helvetica, sans-serif;
	font-weight:bold;
	color: #693;
	padding: 0;
	}

#partnerspage #credits .bold {
	font:10pt Arial, Helvetica, sans-serif;
	font-weight:bold;
	color: #666;
	padding: 0;
	}

/* Media Gallery page */

#mediapage {
	width: 100%;
	overflow: hidden;
	padding: 0 0 10px 0;
	}	

#mediapage .data {
	margin: 0 0 100px 0;
	padding:10px 0 0 0;
	line-height: 14pt;
	text-align: center;
	}
	
#mediapage .data img{
	padding: 0 0 40px 30px;
	margin: 0;
	float:left;
	}
	
#mediapage .data img.videobanner {
	padding: 0 0 20px 0;
	margin: 0;
	float:none;
	}
	
#mediapage .data img.podcastbanner, #mediapage .data img.radiobanner {
	padding: 20px 0 20px 0;
	margin: 0;
	float:none;
	}
	
#mediapage .videobg {
	padding: 60px;
	background: #000;
	}
	
#mediapage .audio {
	padding: 10px;
	margin: 0 9px;
	float: left;
	clear: none;
	background: #F2F2F2;
	}
	
.mediapage ul {
	list-style-type:none;
	}


/* Take Action page */

#actionpage {
	width: 100%;
	overflow: hidden;
	}	

#actionpage .data {
	margin: 0;
	padding:10px 10px 10px 5px;
	line-height: 14pt;
	text-align: left;
	font-size: 10pt;
	}
	
#actionpage h2 {
	font:14pt Arial, Helvetica, sans-serif;
	font-weight:bold;
	color: #236680;
	padding: 0;
	margin: 0;
	}
	
#actionpage h3 {
	font:10pt Arial, Helvetica, sans-serif;
	font-weight:bold;
	color: #666;
	padding: 0 0 5px 0;
	}

#actionpage p {
	padding: 20px 0 0 0;
	}

#actionpage p.nopadding {
	padding: 0;
	}

#actionpage a {
	color: #369;
	text-decoration:none;
	padding: 0;
	margin: 0;
	}

#actionpage #fullwidthtop {
	background:#F2F2F2;
	width: 1024px;
	padding: 20px;
	margin: 0 0 15px 0;
	height: 150px;
	}

#actionpage #topleft {
	background:#F2F2F2;
	width: 530px;
	height: 150px;
	float: left;
	clear: none;
	border-right: #666 2px dotted;
	padding: 0 200px 0 0;
	}

#actionpage #topright {
	background:#F2F2F2;
	width: 200px;
	float: left;
	clear: none;
	padding: 0 0 0 30px;
	}

#actionpage #fullwidthmiddle {
	background:#F2F2F2;
	width: 1024px;
	padding: 20px;
	margin: 15px 0;
	height: 170px;
	}

#actionpage #middleleft {
	background:#F2F2F2;
	width: 730px;
	float: left;
	clear: none;
	border-right: #666 2px dotted;
	padding: 0;
	}

#actionpage #middleleft #share {
	background:#F2F2F2;
	width: 650px;
	padding: 0;
	font-weight: bold;
	}

#actionpage #middleleft #message {
	background: #c9d7eb; 
	width: 250px;
	float: left;
	clear: none;
	border: 1px solid #666;
	padding: 10px;
	margin-top: 15px;
	}

#actionpage #middleright {
	background:#F2F2F2;
	width: 200px;
	float: left;
	clear: none;
	padding: 0 30px;
	}

#actionpage #fullwidthbottom {
	background:#F2F2F2;
	width: 1024px;
	padding: 20px;
	margin: 15px 0;
	height: 320px;
	}

#actionpage #bottomfirst {
	background:#F2F2F2;
	width: 200px;
	height: 315px;
	float: left;
	clear: none;
	border-right: #666 2px dotted;
	padding: 0 30px 0 10px;
	}

#actionpage #bottomsecond {
	background:#F2F2F2;
	width: 200px;
	height: 315px;
	float: left;
	clear: none;
	border-right: #666 2px dotted;
	padding: 0 30px;
	}

#actionpage #bottomthird {
	background:#F2F2F2;
	width: 200px;
	height: 315px;
	float: left;
	clear: none;
	border-right: #666 2px dotted;
	padding: 0 30px;
	}

#actionpage #bottomlast {
	background:#F2F2F2;
	width: 200px;
	height: 315px;
	float: left;
	clear: none;
	padding: 0 0 0 30px;
	}

#actionpage img {
	padding: 0 20px 0 0;
	margin: 0;
	float: none;
	}
	
#actionpage img.top {
	float: left;
	}
	
#actionpage img.banner {
	padding: 0;
	margin: 0;
	float: none;
	clear: both;
	}
	
#actionpage img.social {
	float: left;
	padding: 0;
	margin: 50px 0 0 20px;
	}
	
#actionpage img.preview {
	float: none;
	padding: 0;
	margin-top: 20px;
	}
	
/* Send an E-card page */

#ecardpage {
	width: 100%;
	overflow: hidden;
	margin: 0 0 10px 0;
	}	

#ecardpage .data {
	margin: 0;
	padding:10px 10px 20px 5px;
	line-height: 14pt;
	text-align: center;
	}
	
#ecardpage .data img{
	padding: 0;
	margin: 0;
	}
	
#ecardpage #ecardhead {
	padding: 10px 20px 0 20px;
	background: #F2F2F2;
	text-align: left;
	margin: 0 0 15px 0;
	width: 280px;
	float: left;
	clear: none;
	}
	
#ecardpage #ecardhead img {
	float: left;
	padding: 4px 15px 0 0;
	}

#ecardpage #ecardhead h2 {
	font:13pt Arial, Helvetica, sans-serif;
	font-weight:bold;
	color: #C93;
	padding: 0;
	margin: 0;
	}
	
#ecardpage #ecardhead h3 {
	font:10pt Arial, Helvetica, sans-serif;
	font-weight:bold;
	color: #666;
	padding: 0 0 10px 0;
	}

#ecardpage #ecardhead p {
	padding: 0 0 10px 0;
	}
	
#ecardpage .data ul {
	list-style-type:none;
	}

#ecardpage a {
	color: #369;
	font-size: 14pt;
	text-decoration:none;
	padding-top: 5px;
	}

#ecardpage #howto {
	width: 270px;
	padding: 20px 30px 7px 20px;
	background: #F2F2F2;
	text-align: left;
	margin: 0;
	font-size: 9pt;
	float: left;
	clear: left;
	}

#ecardpage #howto h2 {
	font:11pt Arial, Helvetica, sans-serif;
	font-weight:bold;
	color: #C93;
	padding-bottom: 10px;
	margin: 0;
	}
	
#ecardpage #howto p {
	padding: 0 0 10px 0;
	}
	
#ecardpage #howtoinclude {
	border: 2px dotted #CCC;
	padding: 10px;
	margin: 15px 10px;
	}

#ecardpage #ecardlist {
	background: #F2F2F2;
	padding: 12px 20px;
	margin: 0;
	width: 640px;
	float: right;
	clear: none;
	}
#ecardpage #ecardlist img {
	float: left;
	padding: 14px 10px;
	margin: 0;
	border: none;
	width: 300px;
	height: 200px;
	}

/* blog */

#content {
	float: left;
	width: 750px;
	overflow: hidden;
	padding-top:10px;
	}	

#content p {
	padding: 5px 0;
	}	

.post {
	padding:30px 20px 20px 10px;
	background: #F2F2F2;
	}

.post_leftside {
	width:175px;
	padding:0;
	margin:0;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color: #006666;
	float:left;
	}

.post_leftside img {
	float:right;
	border:none;
	padding:0;
	margin:0;
	}

.post_rightside {
	width:530px;
	margin:0;
	padding:0;
	float:right;
	text-align:left;
	font-family: Arial, Helvetica, sans-serif;
	font-size:14px;
	}

.post_rightside h1 {
	padding:0 0 10px 0;
	margin: 0;
	}
	
.post_rightside h1 a{
	font:normal 14pt Arial, Helvetica, sans-serif;
	color: #669933;
	text-decoration: none;
	font-weight:bold;
	padding:0;
	margin: 0;
	border-bottom:none;
	}
	
.post_rightside h2{
	font:normal 11pt Arial, Helvetica, sans-serif;
	color: #666;
	font-weight:bold;
	padding:0;
	margin: 0 0 5px 0;
	}
	
.post_rightside h3 {
	color: #006666;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	padding: 3px 0;
	}
	
.post_rightside a{
	color: #669933;
	text-decoration: none;
	border-bottom:none;
	}
	
.post_rightside .footer {
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color: #006666;
	font-style:italic;
	padding:5px 0 0 0;
	}

.postmetadata{
	font:normal 12pt Arial, Helvetica, sans-serif;
	color: #666;
	font-weight:bold;
	clear: both;
	margin-top: 20px;
	text-align: right;
	}
	
.postmetadata a{
	background: url(images/comments.png) top right no-repeat;
	padding: 0 10px 0 0;	
	border-bottom:none;
	}
	
#content .line {
	margin: 10px;
	border-bottom:#999 dotted 3px;
	}

/*
.navigation {
	font-size:10pt;
	float:left;
	width:100%;
	background: #fff;
	border-top:1px dotted #666;
	letter-spacing: 1px;
	margin: 10px 0 0 0;
	}
	
.navigation a{
	color: #666;
	border-bottom: none;
	}
	
.alignleft {float:left; margin: 8px;}
.alignright {float:right; margin: 8px;}

.notfound{padding: 25px; font-size: 14pt; font-weight: 300;}
*/
/* comments */

#commentssection{
	clear: both;
	padding: 2px 12px;
	margin: 0;
	}
	
#commentssection h3{
	font-family:  Arial, Helvetica, sans-serif;
	font-size: 12pt;
	font-weight: 300;
	font-style: normal;
	color: #666;
	}

#commentform{
	background: #F0F0F0;
	margin: 12px 12px 20px 12px;
	padding:20px;
	}
	
#commentform p{
	color: #666;
	}
	
#commentform a{color: #666; text-decoration: none; border-bottom: 1px dotted #465D71;line-height: 14pt;}
	
#commentform a.blue {
	color: #369;
	border-bottom: none;
}

#commentform h3{
	font-family:  Arial, Helvetica, sans-serif;
	font-size: 10pt;
	font-weight: 300;
	color: #666;
	}
	
#commentbox{
	width:75%;
	min-width:400px;
	margin:5px 5px 0 0;
	}

#author, #email, #url, #commentbox, #submit{
	background: #fff;
	font-family:  Arial, Helvetica, sans-serif;
	font-size: 8pt;
	margin:5px 5px 0 0;
	padding: 6px;
	border: 1px solid #B2B2B2;
	}
	
#submit{margin:5px 5px 0 0;}

	
ol.commentlist {list-style-type: none;}

ol.commentlist li {
	background: #fff;
	margin:10px 0;
	padding:5px 0 5px 10px;
	overflow: hidden;
	}

ol.commentlist li.alt {background: #E5E5E5;}
ol.commentlist li p {margin: 6px 0 6px 0; padding: 0 12px 0 0; line-height: 14pt;}

ol.commentlist a {color:#000;}

cite {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9pt;
	font-weight: bold;
	font-style: normal;
	}
	
cite a{color: #000; text-decoration: none; border-bottom: 1px dotted #465D71;}

/* toolbar - horizontal layout */

.toolbar_horz {
	padding:0px;
	clear:both;
	}
#toolbar_horz {
	padding: 0;
	width:1024px;
	margin:0;
	clear:both;
	}
#toolbar_horz .module1, #toolbar_horz .module2, #toolbar_horz .module3 {
	width:341px;
	overflow:hidden;
	}
#toolbar_horz .modulebox {
	border:1px solid #CCC;
	height:200px;
	padding:5px 5px 0 5px;
	}
#toolbar_horz .top1 {
	height:31px;
	}
#toolbar_horz .sub1 {
	height:27px;
	}
#toolbar_horz .top2 {
	height:31px;
	}
#toolbar_horz .sub2 {
	height:27px;
	}
#toolbar_horz .top3 {
	height:31px;
	}
#toolbar_horz .sub3 {
	height:27px;
	}
#toolbar_horz .module1, #toolbar_horz .module2, #toolbar_horz .module3 {
	float:left;
	}
#toolbar_horz .modulecontent {
	width:320px;
	margin:5px 0 0 5px;
	padding:5px 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size:12px;
	}
#toolbar_horz .video {
	padding:0 0 0 2px;
	margin:0;
	}
#toolbar_horz .socnet {
	float:left;
	width:160px;
	}
#toolbar_horz .socnet img {
	padding:0 5px 5px 0;
	margin:0;
	}
#toolbar_horz .quizlogo {
	float:left;
	padding:0 10px 0 0;
	margin:0;
	}

#toolbar_horz .modulelink {
	text-align:left;
	padding:0 0 5px 0;
	margin:0 0 0 10px;
	}

#toolbar_horz .modulelink a {
	color: #336699;
}

#toolbar_horz .moduledate {
	text-align:right;
	padding:0 10px 5px 0;
	margin:0;
	list-style-type: none;
	font-size: 11px;
	}

#toolbar_horz a.bluelink {
	color: #336699;
}

/* toolbar - vertical layout */

.toolbar_vert {
	padding:0px;
	}
#toolbar_vert {
	padding:20px 0 0 0;
	width:220px;
	margin:0;
	float:right;
	}
#toolbar_vert .module1, #toolbar_vert .module2, #toolbar_vert .module3, #toolbar_vert .module4 {
	width:220px;
	overflow:hidden;
	}
#toolbar_vert .modulebox {
	border:1px solid #CCC;
	height:140px;
	padding:0 3px 0 3px;
	margin-left:23px; 
	}
#toolbar_vert .top1 {
	float:left;
	padding: 0 23px 93px 0;
	}
#toolbar_vert .sub1 {
	height:50px;
	margin-top: 3px;
	}
#toolbar_vert .top1blog {
	float:left;
	padding: 0 23px 93px 0;
	}
#toolbar_vert .sub1blog {
	height:50px;
	margin-top: 3px;
	}
#toolbar_vert .top2 {
	float:left;
	padding: 0 23px 93px 0;
	}
#toolbar_vert .sub2 {
	height:30px;
	margin-top: 3px;
	}
#toolbar_vert .top3 {
	float:left;
	padding: 0 23px 93px 0;
	}
#toolbar_vert .sub3 {
	height:30px;
	margin-top: 3px;
	}
#toolbar_vert .top4 {
	float:left;
	padding: 0 23px 93px 0;
	}
#toolbar_vert .sub4 {
	height:40px;
	margin-top: 3px;
	}
#toolbar_vert .modulecontent {
	margin:0 auto 5px 5px;
	padding:0;
	font-family: Arial, Helvetica, sans-serif;
	font-size:12px;
	}
#toolbar_vert .pencils {
	float:left;
	padding:0 5px 0 0;
	margin:0;
	}
#toolbar_vert .video {
	float:left;
	padding:0 5px 0 0;
	margin:0;
	}
#toolbar_vert .socnet {
	float:left;
	width: 85px;
	padding: 0;
	}
#toolbar_vert .socnet img {
	padding:2px;
	margin:0;
	}
#toolbar_vert .quizlogo {
	float:left;
	padding:0 5px 0 15px;
	margin:0;
	}

/* sidebar */

#sidebar {
	font-family:Arial, Helvetica, sans-serif;
	font-size:10pt;
	width: 240px;
	float:right;
	margin: 20px 0 10px 0;
	padding: 0;
	clear: right;
	}

#sidebar h2{
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal; 
	font-size: 10pt; 
	text-align: left;
	color: #08122E;	
	margin: 0;
	padding: 0 0 5px 5px;
	border-bottom:#666 3px dotted;
}

#sidebar p {margin:0; padding: 0 6px 0 12px;}

#sidebar img {padding: 0; margin: 0;}

#sidebar ul {
	margin:12px;
	padding:0;
	list-style-type: none;
	}

#sidebar ul li {
	margin: 0;
	padding: 0 0 10px 0;
	line-height: 14pt;
	list-style-type: none;
	}

#sidebar ul ul {
	margin: 10px 0 6px 15px;
	padding: 0;
}

#sidebar ul ul li {
	list-style-type: none;
	list-style-position: inside;
	}

#sidebar ul ul ul{
	margin: 0;
	padding: 0;
}

#sidebar ul ul ul li{
	padding: 0 0 0 15px;
	list-style-type: square;
	color: #666;
}

/* footer */

#footer {
	background: #FFF;
	clear: both;
	width: 100%;
	padding: 20px 0 10px 0;
	overflow: hidden;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9pt;
	text-transform:capitalize;
	}
	
#footer .line {
	border-top: 2px #333 solid;
	}

#footer p{
	padding:10px;
	margin:0;
	color:#333;
	text-align:center;
	}

#footer a{
	color:#369;
	text-decoration:none;
	}

#footer a:hover{
	color:#369;
	text-decoration:underline;
	}

#footer table{
	margin-left:auto;
	margin-right:auto;
	}