/*
Theme Name: Altruist
Theme URI: http://www.christopherxjjensen.com
Description: A new theme for Chris Jensen.
Version: 1.0
Author: Olivia Hu
Author URI: http://okayolivia.com/
*/

body {
	background: #61b232;
	font: 400 11pt/20pt Roboto;
	color: #282828;
}

header, section, article, footer {display: block;} 

.clearfix:after {
	clear: both;
	display: block;
	content: " ";
	height: 0px;
	visibility: hidden;
}
.clearfix {
	display: inline-block;
}

* {
	margin: 0px;
}

h1 {
	font: 500 23pt/24pt Roboto;
	color: #282828;
}

h1 a {
	color: #282828 !important;
	font-style: normal !important;
}

h1 a:hover {
	color: #444 !important;
}

#page h1 {
	font: 500 23pt Roboto;
	color: #282828;
	text-align: center;
	margin-bottom: 7px;
}

h2 {
	font: 15pt Roboto;
	color: #282828;
	text-align: left;
	<!--margin: 20px 0;-->
	margin-bottom: 7px;
}

h3 {
	color: #282828;
	font-size: 14pt;
	font-weight: 500;
	margin-bottom: 15px;
}

h4 {
	color: #61b232;
	font-size: 14pt;
	font-weight: normal;
	margin-bottom: 15px;
}

#notice {
	width: 100%; padding: 5px 0;
	text-align: center;
	background: #ddd;
	color: #444;
}

a:link, a:visited {
	color: #61b232;
	font-style: none;
	text-decoration: none;
}

a:hover {
	color: #282828;
}

#wrapper {
	width: 100%;
	margin: 15px auto;
	background: #fff; 
	overflow: auto;
}

#search-social {
	width: 990px; margin: 0px auto; padding: 10px 40px;
	color: #61b232;
	border-left: 1px solid #61B232; border-right: 1px solid #61B232;
}

#search {
	float: left;
}

.search {
	vertical-align: middle;
}

.searchbox {
	border: 1px solid #61B232;
	padding: 5px 7px;
	font-size: 10pt;
	color: #888;
	width: 120px;
}

#social {
	float: right;
}

#social .fa {
	font-size: 120%;
	margin-left: 7px;
	vertical-align: middle;
}

/* THIS IS WHERE YOU CHANGE THE HEADER IMAGE. Replace the URL ONLY. */
header {
	background: url(http://www.christopherxjjensen.com/wp-content/themes/summer/images/header.png); background-size: 100%;
	width: 1120px; height: 245px;
	margin: 0px auto;
	text-align: center;
}

#title {
	background: #fff;
	display: inline-block;
	text-transform: uppercase;
	padding: 7px 10px 5px 10px; margin-top: 80px;
}

#title a {
	font: 500 17pt Roboto;
	color: #282828;
}

#subtitle {
	background: #fff;
	display: inline-block;
	font: 500 11pt Roboto;
	padding: 4px 6px;
	margin-top: 5px;
}

#container {
	width: 990px; margin: 0px auto; padding: 0 40px 40px;
	border-left: 1px solid #61B232; border-right: 1px solid #61B232;
	overflow: auto;
	min-height: 600px;
}

#site-navigation.fixed{
	position:fixed;
	z-index: 9999;
	top:0;
	width: 990px;
}

nav {
	margin-bottom: 30px;
}

nav ul ul {
	display: none;
}

nav ul li:hover > ul {
	display: block;
}

nav ul {
	position: relative; width: 100%;
	display: inline-table;
	margin: 0px auto; padding: 0px;
	list-style: none;
	background: #61b232;
	text-align: center;
}

nav li {
	display: inline-block;
	margin-left: 6px;
}

nav li a {
	font: normal 400 10.5pt Roboto; letter-spacing: .5px;
	color: #fff !important; font-style: normal !important;
	text-transform: uppercase;
	text-decoration: none;
	display: block;
	padding: 20px 30px;
}

nav li a:hover {
	color: #222 !important;
}

nav ul ul {
	z-index: 1000;
	background: #fff;
	position: absolute;
	border-bottom: 1px solid #ddd; border-left: 1px solid #ddd; border-right: 1px solid #ddd;
	width: 190px;
	top: 100%; text-align: left;
	margin-left: 5px; padding: 10px 5px;
}

nav ul ul li {
	display: block;
	margin-left: -10px; padding: 0px;
	list-style-type: none;
}

nav ul ul li a {
	color: #61b232 !important;
	font: 11pt Roboto; letter-spacing: 0px;
	text-transform: none;
	padding: 15px 30px;
}	

nav ul ul li a:hover {
	color: #282828 !important;
}

nav ul ul ul {
	z-index: 1000;
	background: #fff;
	position: absolute;
	background: #fff;
	border: 1px solid #ddd;
	width: 200px;
	left: 100%; top: auto;     
	margin-top: -58px; padding: 10px 0; margin-left: 0px;
}

nav ul ul ul li {
	display: block;
	margin-left: -10px; padding: 0px;
	list-style-type: none;
}

nav ul ul ul li a {
	padding: 15px 30px;
}

#content, #page-sidebar {
	float: right;
	width: 700px;
}

#content .fa {
	color: #61b232;
	font-size: 120%;
	vertical-align: -1px;
	margin-right: 5px;
}

#page {
	float: none; margin: 45px auto 0 auto;
	width: 730px;
}

#page p {
	margin: 15px 0px;
}

.post {
	border-bottom: 1px solid #61B232;
	padding: 30px 0;
}

.post:first-child {
	padding-top: 5px;
}

.post p {
	margin: 15px 0;
}

.nav-previous {
	width: 150px; margin-top: 20px;
	float: left; text-align: left;
	font-size: 10pt; letter-spacing: 1px;
	text-transform: uppercase;
}

.nav-next {
	width: 150px; margin-top: 20px;
	float: right; text-align: right;
	font-size: 10pt; letter-spacing: 1px;
	text-transform: uppercase;
}

.nav-previous a, .nav-next a, .nav-previous .fa, .nav-next .fa {
	color: #282828 !important;
}


/* IMAGE CLASSES AND DEFAULTS */

.post p img {
	width: auto;
	float: left;
	margin-right: 15px;
}

#page p img {
	max-width: 730px;
	height: auto;
	float: none;
}

#page-sidebar img {
	float: none;
}

#page img.floatnone, .post img.floatnone {
	float: none;
}

#page img.floatleft, .post img.floatleft {
	float: left;
	margin-right: 15px;
}

#page img.floatright, .post img.floatright {
	float: right;
	margin: 10px 0;
}

#page img.pdficon, .post img.pdficon {
	margin-right: 5px;
	vertical-align: -2px;
	width: 16px; height: 16px;
}

#page img.youtubeicon, .post img.youtubeicon {
	margin-right: 5px;
	vertical-align: -2px;
	width: 23px; height: 16px;
}

#page img.miscicon, .post img.miscicon {
	margin-right: 5px;
	vertical-align: -2px;
	height: 16px;
}
#page img.othericon, .post img.othericon {
	margin-right: 3px;
	margin-left: 3px;
	vertical-align: -2px;
	width: 16px; height: 16px;
}

.personal {
	display: inline-block;
	float: left; margin: 15px 15px 0 0;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	-khtml-border-radius: 50%;
	border: 1px solid #61b232;
}

.personal img  {
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	-khtml-border-radius: 50%;
	vertical-align: middle;
	margin: 3px; width: 140px; height: 140px;
}

#page img.collage, .post img.collage {
	border: 1px solid #61b232; 
	float: left;
	height: 250px;
	margin-right: 30px; margin-top: 6px; margin-bottom: 6px; padding: 3px;
}

#page img.collage2, .post img.collage2 {
	border: 1px solid #61b232; 
	float: left;
	margin-right: 25px; margin-top: 6px; margin-bottom: 6px; padding: 3px;
}


#page img.collage3, .post img.collage3 {
	border: 1px solid #61b232;
	margin: 10px;
	padding: 3px;
}

#page img.collage4, .post img.collage4 {
	border: 1px solid #61b232;
	margin: 10px;
	float: none;
	padding: 3px;
}

#page img.collagefull, .post img.collagefull {
	border: 1px solid #61b232; 
	width: 692px;
	display: block;
	margin: 6px auto 0px auto;
	padding: 3px;
}

#page img.collagecenter, .post img.collagecenter {
	border: 1px solid #61b232; 
	display: block;
	margin: 6px auto 0 auto;
	padding: 3px;
}

#page img.plain, .post img.plain { 
	float: left;
	height: 250px;
	margin-right: 30px; margin-top: 6px; margin-bottom: 6px; padding: 3px;
}

#page img.plaincenter, .post img.plaincenter {
	display: block;
	margin: 6px auto 0 auto;
}

#page img.plainfullcenter, .post img.plainfullcenter {
	width: 692px;
	display: block;
	margin: 6px auto 0 auto;
}

#page img.plaincorner, .post img.plaincorner {
	float: left;
	height: 250px;
	margin-right: 30px; margin-top: 6px; margin-bottom: 6px; padding: 3px;
}

#page .ngg-gallery-thumbnail img, .post .ngg-gallery-thumbnail img {
	border: 1px solid #61b232;
}

img#wpstats {
	display: none;
}

img.currentlyreading {
	border: 1px solid #61b232;
	width: 150px !important;
	height: auto !important;
	margin-bottom: 18px;
	padding: 3px;
}

img.teachingtool {
	border: 1px solid #61b232;
	width: 240px;
	height: auto;
	margin-bottom: 18px;
}


/* END IMAGE CLASSES AND DEFAULTS */

.date {
	display: block;
	font: 600 10pt Roboto;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #777;
	margin: 7px 0 15px;
}

#sidebar {
	float: left;
	width: 240px;
}

#sidebar .textwidget {
	font: 10pt/16pt Roboto;
	margin-bottom: 20px;
}

#sidebar .textwidget img {
	width: 240px; height: auto;
}

#sidebar ul {
	margin-bottom: 20px; padding: 0;
}

#sidebar li {
	list-style-type: none;
}

#sidebar li, li.crpw-item {
	border-bottom: 1px solid #ddd;
	font: 10pt/16pt Roboto;
	list-style-type: none;
	padding: 5px 0;
}

#sidebar li:last-child, li.crpw-item:last-child {
	border-bottom: 0;
}

#sidebar li:first-child, li.crpw-item:first-child {
	padding-top: 0;
}

#sidebar ul#ara_ca_mo2014, #sidebar ul#ara_ca_mo2013, #sidebar ul#ara_ca_mo2012, #sidebar ul#ara_ca_mo2011, #sidebar ul#ara_ca_mo2010, #sidebar ul#ara_ca_mo2009 {
	margin: 5px 0 10px 18px;
}

#sidebar ul#ara_ca_mo2014 li, #sidebar ul#ara_ca_mo2013 li, #sidebar ul#ara_ca_mo2012 li, #sidebar ul#ara_ca_mo2011 li, #sidebar ul#ara_ca_mo2010 li, #sidebar ul#ara_ca_mo2009 li {
	padding: 5px 0;
}

#sidebar select {
	border: 1px solid #61b232;
	font-size: 10pt;
	padding: 7px 10px;
	width: 100%;
}

#sidebar .fa {
	color: #61b232;
	font-size: 8pt;
	margin-right: 10px;
}

#sidebar option {
	font-size: 10pt;
	padding: 5px 10px;
}

.read-more {
	border: 1px solid #61b232;
   	width: 100px; display: block;
	font-weight: bold; letter-spacing: 1px;
	margin: 10px 0 0; padding: 5px 10px;
	text-align: center; text-transform: uppercase;
}

.category {
	display: block;
	font-size: 10pt;
	line-height: 15pt;
	margin: 10px 0;
}

.tags {
	display: block;
	font-size: 9pt;
	letter-spacing: .5px;
}

.tags ul {
	margin: 0; padding: 0;
}

.tags li {
	list-style-type: none; display: inline-block; margin: 0 3px;
}

.tags a {
	background: none repeat scroll 0 0 #888;
	border-radius: 3px;
	color: #fff;
	padding: 5px;
}

#jp-relatedposts .jp-relatedposts-items p {
	border: 1px solid #ddd;
	height: auto;
	margin: 0 10px 0 0 !important;
	padding: 15px;
	width: 220px !important;
}

div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post .jp-relatedposts-post-context {
	font-size: 9pt !important;
	color: #888 !important;
	opacity: 1 !important;
	text-align: left !important;
}

footer {
	background: none repeat scroll 0 0 #f0f0f0;
	height: 180px;
	margin: 0 auto; padding: 30px 60px;
	width: 1000px;
}


#footer-sidebar1 {
	float: left;
	width: 240px;
	margin-right: 40px;
	font: 400 10pt/18pt Roboto;
}

#footer-sidebar1 img {
	float: left;
	width: 106px; height: auto;
	margin-right: 12px;
}

#footer-sidebar2, #footer-sidebar3 {
	float: left;
	width: 210px;
	margin-right: 40px;
	font-size: 10pt; line-height: 17pt;
}

#footer-sidebar2 img {
	width: 20px; height: auto;
	margin-right: 5px;
	vertical-align: -3px;
}

#footer-sidebar2 ul {
	margin: 0; padding: 0;
}

#footer-sidebar2 li {
	font-size: 11pt;
	list-style-type: none;
	margin: 5px 0;
}

#footer-sidebar2 li a {
	color: #282828;
}

#footer-sidebar3 img {
	width: 150px;
	margin-bottom: 10px;
}

#footer-sidebar4 img {
	float: left;
	width: 85px;
	height: auto;
	margin-right: 10px;
}

#footer-sidebar4 {
	float: left;
	width: 185px;
	font: 12pt/18pt Roboto;
}

#footer-sidebar4 a {
	color: #282828;
}

#copyright {
	width: 990px; margin: 0px auto; padding: 10px 40px;
	font: 10.5pt/22pt Roboto;
	border-left: 1px solid #61B232; border-right: 1px solid #61B232;
	text-align: center;
}

hr {
	background: #ddd;
	align: center;
	height: 1px;
	border: 0px;
	margin-bottom: 16px;
}

/* Gradient transparent - color - transparent */
hr.short {
	border: 0;
	height: 1px;
	width: 200px;
	background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
}

#content input, #content textarea, #content select, #content option, #page input, #page textarea, #page select, #page option {
	background-color: #fff; border: 1px solid #61B232;
	padding: 10px; margin: 5px 5px 5px 0;
	color: #888; font-size: 10pt;
	font-family: Roboto;
}

#content textarea, #page textarea {
	width: 70%;
}

#content #submit, #page input[type=submit] {
	color: #fff;
	padding: 10px 15px; margin: 20px 0px;
	border: 0; background: #888;
	font-size: 12pt;
}

.comments {
	background: #f0f0f0;
	padding: 20px;
	margin: 20px auto; 
}

.comments img {
	float: left; margin-right: 15px;
	width: 50px;
}

.author {
	display: block;
	font-size: 12pt;
}

.comment-date {
	display: block;
	color: #888;
	font-size: 10pt;
}

table {
}

th, td {
	padding: 10px;
	border-left: 1px solid #ddd; border-bottom: 1px solid #ddd;
	text-align: center;
}

th:last-child, td:last-child {
	border-right: 1px solid #ddd;
}

td.tableheader {
	background: #61b232;
	color: #fff;
	text-align: left;
	padding-left: 20px;
	font-weight: 600;
}

th.leftaligned, td.leftaligned {
	text-align: left;
}

.navigationpath {
	font-size: 10pt;
}

.childpages {
	border-bottom: 1px solid #ddd;
	border-top: 1px solid #ddd;
	font-size: 9pt;
	padding: 3px 0;
}

.caption {
	font-size: 9pt;
	color: #777;
	padding: 3px 0;
	text-align: center;
	margin-bottom: 12px;
}

.pullquote {
	font-size: 10pt;
	color: #777;
	text-align: left;
	padding-left: 50px;
	padding-right: 50px;
	line-height: 150%;
}

.spacedheader {
	padding-top: 30px;
}