/*
Theme Name: SPJ Blog 2014
Version: 2014
Author: billyok
*/

* {padding: 0; margin: 0;}

body {font-size: 14pt; font-family: 'Roboto','trebuchet ms', Georgia, Verdana, Trebuchet MS, Trebuchet, Arial; font-weight:300; text-align: left; width: auto; margin: 0 0 0 0; padding: 0;}

b, strong {font-weight:700;}

#headlineimg {width:1000px; height:250px;}


#page {margin: 0px auto; padding: 20px 20px 20px 20px; width: 960px; line-height:1.7em; min-height: 550px; overflow: auto;}

#wrapper {width: 1000px; height:250px; margin-top:0; margin-bottom:0; margin-left:auto; margin-right:auto; padding: 0px;}

#header {margin: 0; height: 10px; width: 960px;}

.header-container {position: relative; float: left; width: 960px; height: 10px;}

.header-transparent-box {position: absolute; top: 0; bottom: 0; left: 0; width: 100%; height: 10px;}

.header-content-box {position: relative; width: 960px; height: 111px;}

#slimmenu {width: 960px; height: 36px; margin-bottom: 20px;}

.slim-container {position: relative; float: left; width: 960px;}

.slim-transparent-box {position: absolute; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; filter: alpha(opacity=0); -khtml-opacity: 0; -moz-opacity: 0; opacity: 0;}

/* ie6 fix */
* html .slim-transparent-box {height: expression(this.parentNode.offsetHeight + 'px');}

.slim-content-box {position: relative; width: 960px; margin-bottom:0px;}

#slimmenu ul {margin: 0; padding: 0; height: 36px; list-style: none;}

#slimmenu li {display: inline;}

#slimmenu a {float: left; height: 13px; padding: 12px 11px 10px 11px;}

#slimmenu #rss a {float: left;}

#content {font-size: 1em;}

#content p, #content ul {font-size: 1em; letter-spacing: .1px; margin: 15px 0px;}

.narrowcolumn .postmetadata {text-align: right; font-family: 'Roboto','trebuchet ms', sans-serif; font-size:1em;}

.alt {border-top: 1px solid; border-bottom: 1px solid;}

small {font-weight:normal; font-size: 1em;}

h2, h3, h4 {font-family: 'Signika Negative', sans-serif; font-weight:400; line-height:1em; text-align: left;}
h5 {font-family: 'Signika Negative', sans-serif; font-weight:300; line-height:1em; text-align: left;}

#morefoot h3, #sidebar h2 {font-family: 'Roboto','trebuchet ms', sans-serif; text-transform:uppercase;}

h1, h1 a, h1 a:visited {font-size: 4em; padding: 20px 0 0 0;}

h2 {font-size: 3em;}

h2.pagetitle {font-size: 3em;}

h3 {font-size: 2.5em;}

h2, h2 a, h2 a:visited, h3, h3 a, h3 a:visited {}

.commentlist li, #commentform input, #commentform textarea {font-family: 'Open Sans', Georgia, Arial, Sans-Serif;}

.commentlist li {font-weight: bold;}

.commentlist li .avatar {float: right; border: 1px solid; padding: 2px;}

.commentlist cite, .commentlist cite a {font-weight: bold; font-style: normal; font-size: 1em;}

.commentlist p {font-weight: normal; text-transform: none;}

#commentform p {font-family: 'Roboto','trebuchet ms', sans-serif;}

.commentmetadata {font-weight: normal;}

#sidebar {float: right; font-family: 'Roboto','trebuchet ms', sans-serif; font-size:11pt; line-height:1.5em; width: 260px; min-height:575px; padding-left:15px; margin-bottom:10px; border-left:1px dotted;}

#sidebar ul ul li, #sidebar ul ol li, blockquote, strike {font-family: 'Signika Negative', sans-serif; font-size:1em; font-weight:300;}

.postmetadata, small, .nocomments {font-family: 'Roboto', 'trebuchet ms', sans-serif; font-size:1em; font-weight:300;}


p.byline {font-family: 'Signika Negative','trebuchet ms', sans-serif; font-weight:400 !important; font-size:1.4em !important; line-height:1.4em; margin:1em 0 1em 0 !important;}

h4 {font-family: 'Signika Negative', sans-serif; font-weight:400 !important; font-size:1.6em !important; line-height:1.4em;}

h5 {font-family: 'Signika Negative', sans-serif; font-weight:100 !important; font-size:1.2em !important; line-height:1.4em;}


.uppercase {text-transform:uppercase !important;}

code {font: 1.1em 'Courier New', Courier, Fixed;}

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

a {text-decoration: none !important; font-weight:none;}

#wp-calendar #prev a, #wp-calendar #next a {font-size: 1em;}

#wp-calendar caption {font-family: 'Roboto','trebuchet ms', sans-serif; text-align: center;}

#wp-calendar th {font-style: normal; text-transform: capitalize;}

.narrowcolumn, .widecolumn {float: left; padding: 0 0 0 0; margin: 0px; width: 630px;}

.post {margin: 0 0 40px; text-align: left;}

.post hr {display: block;}

.widecolumn .post {margin: 0;}

.narrowcolumn .postmetadata {padding-top: 5px;}

.widecolumn .postmetadata {margin: 30px 0;}

.widecolumn .smallattachment {text-align: center; float: left; width: 128px; margin: 5px 5px 5px 0px;}

.widecolumn .attachment {text-align: center; margin: 5px 0px;}

.postmetadata {clear: both;}

.clear {clear: both;}

h2 {margin: 14px 0 12px 0;}

h2.pagetitle {margin-top: 30px; text-align: left;}

#sidebar h2 {margin: 8px 0; padding: 0; font-size: 1.5em; font-weight:normal;}

h3 {padding: 0; margin: 30px 0 0;}

h3.comments {padding: 0; margin: 40px auto 20px;}

p img {padding: 0; max-width: 100%;}

img.centered {display: block; margin-left: auto; margin-right: auto;}

img.alignright {padding: 4px; margin: 0 0 -18px -44px; display: inline; position: relative; right: -50px; top: -20px;}

img.alignleft {padding: 4px; margin: 10px; float: left; display: inline;}

.alignright {float: right;}

.alignleft {float: left;}

.entry ol {padding: 0 0 0 35px; margin: 0;}

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

.postmetadata ul, .postmetadata li {display: inline; list-style-type: none; list-style-image: none;}

.container {position: relative; float: left; width: 260px; margin-bottom: 0px;}

.transparent-box {position: absolute; top: 0; bottom: 0; left: 0; width: 100%; height: 100%;}

/* ie6 fix */
* html .transparent-box {height: expression(this.parentNode.offsetHeight + 'px');}

.content-box {border-bottom:1px dotted; position: relative; width: 260px;}

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

#sidebar ul li {list-style-type: none; list-style-image: none; padding: 8px;}

#sidebar ul p, #sidebar ul select {margin: 5px 0 8px;}

#sidebar ul ul, #sidebar ul ol {margin: 5px 0 0 0; border: none;}

#sidebar ul ul ul, #sidebar ul ol {margin: 0 0 0 10px;}

ol li, #sidebar ul ol li {}

#sidebar ul ul li, #sidebar ul ol li {margin: 0 0 5 0px; padding: 0px 0; font-size: 1.15em; border: none;}

#searchform {margin: 0px auto; padding: 5px 3px; padding-left:0px; text-align: left;}

#sidebar #searchform #s {width: 108px; padding: 2px; font-size: 1em; border:1px dotted; height: 16px;}

#sidebar #searchsubmit {}

.entry form {text-align: center;}

select {width: 130px;}

#commentform input {width: 170px; padding: 2px; border:1px dotted; margin: 5px 5px 1px 0;}

#commentform textarea {width: 100%; padding: 2px; border:1px dotted;}

#commentform #submit {margin: 0; float: right;}

.alt {margin: 0; padding: 10px;}

.commentlist {padding: 0; text-align: justify;}

.commentlist li {margin: 15px 0 3px; padding: 5px 10px 3px; list-style: none;}

.commentlist p {margin: 10px 5px 10px 0;}

#commentform p {margin: 5px 0;}

.nocomments {text-align: left; margin: 0; padding: 0;}

.commentmetadata {margin: 0; display: block;}

/* End Comments */
/* Begin Sidebar */
#sidebar form {margin: 0;}

/* End Sidebar */
/* Begin Calendar */
#wp-calendar {empty-cells: show; margin: 10px auto 0; width: 155px;}

#wp-calendar #next a {padding-right: 10px; text-align: right;}

#wp-calendar #prev a {padding-left: 10px; text-align: left;}

#wp-calendar a {display: block;}

#wp-calendar caption {text-align: center; width: 100%;}

#wp-calendar td {padding: 3px 0; text-align: center;}

/* End Calendar */
/* Begin Various Tags & Classes */
acronym, abbr, span.caps {cursor: help;}

.entry ul {padding-left:2em;}

acronym, abbr {border-bottom: 1px dashed;}

blockquote {margin: 15px 30px 0 10px; padding-left: 20px; border-left: 5px solid;}

blockquote cite {margin: 5px 0 0; display: block;}

.center {text-align: center;}

.hidden {display: none;}

hr, hr.minor { display:block; border-style: dotted;  border-width: 1px 0 0;  margin: 20px 0 20px;  height: 0;}

a img {border: none;}

.navigation {display: block; text-align: center; margin-top: 10px; margin-bottom: 60px;}

.aligncenter, div.aligncenter {display: block; margin-left: auto; margin-right: auto;}

.wp-caption {border: 1px solid; text-align: center; padding-top: 4px; margin: 10px;}

.wp-caption img {margin: 0; padding: 0; border: 0 none;}

.wp-caption p.wp-caption-text {font-size: 1em; padding: 0 4px 5px; margin: 0;}

#morefoot {	width:960px; 	margin-left:auto; margin-right:auto; padding:0;}

#morefoot100 {width:100%; border: 0px solid; padding:25px 0 15px 0; margin:0;}

#morefoot p {margin: 5px 0; padding: 5px 0;}

#morefoot ul {list-style-type: none; margin-top: 5px;}

#morefoot ul li, #morefoot p {font-size: 1em;}

#morefoot h3 {font-size: 1.5em; font-weight: normal; letter-spacing: .3 px; margin: 0; padding: 0 0 2px 0;}

#morefoot #searchbox {padding: 1px; width: 180px;}

#morefoot .col1 {font-family: 'Roboto','trebuchet ms', sans-serif; 
float: left; width: 352px;}

#morefoot .col2 {font-family: 'Roboto','trebuchet ms', sans-serif; padding:0 20px; 0 20px; border-left:1px dotted; border-right:1px dotted; margin: 0 25px;}

#morefoot .col2, #morefoot .col3 {font-family: 'Roboto','trebuchet ms', sans-serif; 
float: left; width: 240px;}

#morefoot li {padding-left: 0px; margin-bottom: 5px;}

i {font-weight:100 !important;}

#footer hr {display:block !important;}

#footer {clear: both; font-family: 'Roboto','trebuchet ms', sans-serif; border: 0px solid; padding: 15px 15px 10px 15px;}

#footer p {font-size: 1em; font-family: 'Roboto','trebuchet ms', sans-serif; padding: 0;}

#footerleft {float: left; width: 500px;}

#footerright {float: right; width: 300px; text-align: right;}

.cleared {
margin: 0; padding: 0; clear: both;}

.search {font-family: 'Roboto','trebuchet ms', sans-serif; font-size:9.5pt; text-transform:uppercase; margin-top:-4px;}

.searchicon {background:url('http://blogs.spjnetwork.org/includes/magglassicon.png') no-repeat; cursor:pointer; width: 16px; height: 16px; background-size:100%; border: none; margin-left:4px; margin-top:4px;}

ul li a.rsswidget:before {  content: "— ";}

h2 a.rsswidget:before {  content: "" !important;}

.topconversation {line-height:1.4em !important;}
.topconvdate {font-size:.8em; line-height:1.4em !important;}
#spjmap {line-height:1.4em;}

.footer-socialicon {width:60px; height:60px; opacity:.6; margin-top:4px; margin-right:3px;}

#ssba {text-align:right; margin-top:1.5em;}
.ssba {margin:0 !important; padding:0 !important; padding-right:3px !important; opacity:.5;}
.ssba:hover {opacity:1;}


/* ====================== News Feed ===================== */
/* mini */

#newsWidget-mini, #feedsidebar{color:#ddd;font-family:'Source Sans Pro', Georgia, sans-serif; font-size:11pt;font-weight:normal; line-height:1em; text-align:left; margin:0}

#newsWidget-mini {text-align:left;margin:0; padding:0; width:auto;border:0; color:#333;}
#newsWidget-mini ul{margin:0;padding:0;list-style:none}
#newsWidget-mini ul li{border-bottom:1px dashed #aaa;margin:0 0 8px;padding:0 0 8px;display:block;position:relative}
#newsWidget-mini h4{font-size:1em;color:#ddd;margin:0;padding:2px 0 0;line-height:1.1em;display:block; font-weight:normal; margin-bottom:5px;}
#newsWidget-mini .date{color:#aaa;font-size:.9em; line-height:1em;clear:both; font-family: 'Signika Negative', sans-serif; text-transform:uppercase;}
#newsWidget-mini a:link,#newsWidget-mini a:active,#newsWidget-mini a:visited{color:#ddd;text-decoration:none}
#newsWidget-mini a:hover{color:red;}
#newsWidget .spacer{clear:both;height:1px;display:block}
#newsWidget hr.mini { border-color: #ccc;  border-style: dashed;  border-width: 1px 0 0;  margin: 20px 0 20px 0;  height: 0;}
#newsWidget-mini .icon {float:left; width:28px; height:28px; margin-right:10px; margin-bottom:10px; border-radius:0px; background-size:28px 28px; margin-top:5px;}
#newsWidget-mini h4 {font-size:1em;color:#ddd;margin:0;padding:2px 0 0;line-height:1.1em;display:block; font-weight:normal; font-family: 'Signika Negative', sans-serif; margin-bottom:10px;}
#feedsidebar h3 {font-size:2.4em;color:#ddd;margin:0;padding:2px 0 0;line-height:1.1em;display:block; font-weight:normal; font-family: 'Signika Negative', sans-serif; text-transform:uppercase;}

#feedsidebar h4 {font-size:1.3em !important; line-height:1.15em;}

#newsWidget-mini h5.mini{font-size:1em;color:#ddd;margin:0;padding:2px 0 0;line-height:1.1em;display:block; font-weight:normal; font-family: 'Signika Negative', sans-serif; text-transform:uppercase;}

#feedsidebar .cutline {line-height:1.2em; margin-bottom:20px;}




/* ======================== Main Menu ===================== */
.menuwrapper1 {width:100%; background:#333; box-shadow:0 0 5px #000;}
.menuwrapper2 {width:1000px; margin-left:auto; margin-right:auto; height:35px;}
.mainmenu-all {width:100%; background:#333;}

.ddsmoothmenu{font: 10px Georgia; font-weight:none; background: none; /*background of menu bar (default state)*/
width: 100%;}

li.mainmenu {font-family: 'Signika Negative', sans-serif; font-size:11pt; text-transform:uppercase; text-align:left;}

.ddsmoothmenu ul{z-index:100; margin: 0; padding: 0; list-style-type: none;}

/*Top level list items*/
.ddsmoothmenu ul li{position: relative; display: inline; float: left;}

/*Top level menu link items style*/
.ddsmoothmenu ul li a{display: block; background: #333; /*background of menu items (default state)*/
color: #ffffff; padding: 8px 10px; border-right: 0px solid #444; color: #2d2b2b; opacity:.98;}

* html .ddsmoothmenu ul li a{/*IE6 hack to get sub menu links to behave correctly*/
display: inline-block;}

.ddsmoothmenu ul li a:link, .ddsmoothmenu ul li a:visited{color: #ffffff;}

.ddsmoothmenu ul li a.selected{/*CSS class that's dynamically added to the currently active menu items' LI A element*/
background: black; 
color: #ffffff;}

.ddsmoothmenu ul li a:hover{background: black; /*background of menu items during onmouseover (hover state)*/
color: #ffffff;}
	
/*1st sub level menu*/
.ddsmoothmenu ul li ul{position: absolute; left: 0; display: none; /*collapse all sub menus to begin with*/
visibility: hidden; box-shadow:0 10px 10px #333;}

/*Sub level menu list items (undo style from Top level List Items)*/
.ddsmoothmenu ul li ul li{display: list-item; float: none;}

/*All subsequent sub menu levels vertical offset after 1st level sub menu */
.ddsmoothmenu ul li ul li ul{top: 0;}

/* Sub level menu links style */
.ddsmoothmenu ul li ul li a{font-family: 'Signika Negative', sans-serif; font-size:11pt; width: 160px; /*width of sub menus*/
padding: 5px; padding-left:10px; padding-right:10px; margin: 5; border-top-width: 0; border-bottom: 0px solid #333;}

/* Holly Hack for IE \*/
* html .ddsmoothmenu{height: 1%;} /*Holly Hack for IE7 and below*/

/* ######### CSS classes applied to down and right arrow images  ######### */

.downarrowclass{position: absolute; top: 12px; right: 7px;}

.rightarrowclass{position: absolute; top: 6px; right: 5px;}

/* ######### CSS for shadow added to sub menus  ######### */

.ddshadow{position: absolute; left: 0; top: 0; width: 0; height: 0; background: silver;}

.toplevelshadow{/*shadow opacity. Doesn't work in IE*/
opacity: 0.0;}






/* =================== GOOGLE CALENDAR EVENTS ====================== */
/* PAGE GRID */
.gce-page-grid .gce-calendar .gce-caption{ /* Caption at top of calendar */ color:#333333;}
.gce-page-grid .gce-calendar{ /* Main calendar table */ width:100%; border-collapse:collapse; border:1px solid #CCCCCC; color:#CCCCCC; line-height:10em;}
.gce-page-grid .gce-calendar th{ /* Day headings (S, M etc.) */ border:1px solid #CCCCCC; text-align:center; width:14.29%; padding:0 !important;}
.gce-page-grid .gce-calendar td{ /* Day table cells */ border:1px solid #CCCCCC; text-align:center; height:90px; vertical-align:middle;}
.gce-page-grid .gce-calendar .gce-has-events{ /* Table cells with events */ color:#333333; cursor:pointer;}
.gce-page-grid .gce-calendar .gce-event-info{ /* Event information */ display:none; /* Important! */}
.gce-page-grid .gce-calendar .gce-day-number{ /* Day number span */ font-size:2em;}
.gce-page-grid .gce-calendar .gce-today{ /* Table cell that represents today */ background-color:#DDDDDD;}
.gce-page-grid .gce-calendar .gce-next,
.gce-page-grid .gce-calendar .gce-prev{ /* Previous and next month links */ cursor:pointer; display:inline-block; width:3%;}
.gce-page-grid .gce-calendar .gce-month-title{ /* Month title */ display:inline-block; width:90%;}
.gce-page-grid .gce-calendar th abbr{ /* Day letter abbreviation */ border-bottom:none !important;}

/* PAGE LIST */
.gce-page-list .gce-list{ /* The list itself */ margin-top:0px;}
div.gce-list {padding-left:10px;}
.gce-page-list .gce-list li{ /* Each event in the list */ margin-top:5px; content:none; }
.gce-page-list .gce-list p{ /* Each piece of information in the list */ margin:0 !important;}
.gce-page-list .gce-list p span{ /* The text displayed before each piece of info, 'Starts:' for example */ color:#999999;}
.gce-page-list .gce-list .gce-list-event{ /* The event title */ background-color:#DDDDDD;}
.gce-page-list .gce-list .gce-list-title{ /* The title (not the same as event title) */ font-weight:bold;}
.gce-page-list .gce-list ul{ margin:0 !important; padding:0 !important;}

/* Also available: .gce-list-start, .gce-list-end, .gce-list-loc, .gce-list-desc, .gce-list-link */
.gce-list-link {padding-bottom:8px; border-bottom:1px dotted #aaa;}

/* WIDGET GRID */
.gce-widget-grid .gce-calendar .gce-caption{ margin:10px 0 5px 0;}
.gce-widget-grid .gce-calendar{ /* Main calendar table */ text-align:center; width:100%; border:1px solid #CCCCCC; border-collapse:collapse;}
.gce-widget-grid .gce-calendar th{ /* Day headings (S, M etc.) */ width:14.29%; border:1px solid #CCCCCC;}
.gce-widget-grid .gce-calendar td{ /* Day table cells */ color:#CCCCCC; width:14.29%; border:1px solid #CCCCCC;}
.gce-widget-grid .gce-calendar .gce-has-events{ /* Table cells with events */ cursor:pointer; color:#666666;}
.gce-widget-grid .gce-calendar .gce-today{ /* Table cell that represents today */ background-color:#fff;}
.gce-widget-grid  .gce-calendar .gce-event-info{ /* Event information */ display:none; /* Important! */}
.gce-widget-grid  .gce-calendar .gce-next,
.gce-widget-grid  .gce-calendar .gce-prev{ /* Prev and next month links */ cursor:pointer; display:inline-block; width:5%;}
.gce-widget-grid .gce-calendar .gce-month-title{ /* Month title in caption at top of table */ display:inline-block; width:80%;}
.gce-widget-grid .gce-calendar th abbr{ /* Day name abbreviations */ border-bottom:none !important;}

/* WIDGET LIST */
.gce-widget-list .gce-list{ /* The list itself */ margin:-10px 0 0 0;}
.gce-widget-list .gce-list li{ /* Each event in the list */ margin:0px 0 0 0; 	list-style-type:none;}
.gce-widget-list .gce-list p{ /* Each piece of information in the list */ margin:0; color:#444; 	font-family:'Roboto','trebuchet ms', Arial, Helvetica, sans-serif; line-height:1.3em; font-size:9pt; }
.gce-widget-list .gce-list p span{ /* The text displayed before each piece of info, 'Starts:' for example */ color:#444; font-family:'Roboto','trebuchet ms', Arial, Helvetica, sans-serif;
font-size:10pt;
font-weight:bold;}
.gce-widget-list .gce-list .gce-list-event{ /* The event title CORRECT */  background-color:#fff;
font-family:'Roboto','trebuchet ms', Arial, Helvetica, sans-serif;
font-size:10.5pt;
margin-top:10px;}
.gce-widget-list .gce-list .gce-list-title{ /* The title (not the same as event title) */
font-family:'Roboto','trebuchet ms', Arial, Helvetica, sans-serif; font-weight:bold; color:#444; font-size:11pt; padding-top:8px;}
.gce-widget-list .gce-list ul{ list-style-type:none; margin:0 !important; padding:0 !important;}
/* Also available: .gce-list-start, .gce-list-end, .gce-list-loc, .gce-list-desc, .gce-list-link */

/* TOOLTIP */
.gce-event-info{ /* Tooltip container */ background-color:#FFFFFF; border:1px solid #333333; text-align:left; max-width:300px;}
.gce-event-info .gce-tooltip-title{ /* 'Events on...' text */ margin:5px !important; font-weight:bold; font-size:1.2em;}
.gce-event-info ul{ /* Events list */ padding:0 !important; margin:0px !important; list-style-type:none !important;}
.gce-event-info ul li{ /* Event list item */ margin:10px 0 0 0;}
.gce-event-info ul li p{ /* Each piece of information */ margin:0;}
.gce-event-info ul li p span{ /* The text displayed before each piece of info, 'Starts:' for example */ color:#999999;}
.gce-event-info .gce-tooltip-event{ /* The event title */ background-color:#DDDDDD; font-weight:bold;}
/* Also available: .gce-tooltip-start, .gce-tooltip-end, .gce-tooltip-loc, .gce-tooltip-desc, .gce-tooltip-link */

/* Sort of fixes weird list stuff in old default theme */
.entry .gce-page-list li:before, #sidebar .gce-widget-list ul li:before { content:none;}