/*
Theme Name: Social-Graphics
Theme URI: Social-Graphics.com
Description: Theme social graphics
Version: 1.0
Author: Marco Rabelink
Author URI: http://www.nextdawn.nl
*/

/*
orange color: #F78D03;
Gmail blue: #C3D9FF;
Form blue: #f9f9f9;
*/
body{background:#FFF; color:#333; font-family: arial,verdana,sans-serif; font-size:72.5%; line-height:1.4; text-align:left; margin:0; padding:0;}
/*---Page Layout Section---*/
#page {margin-left: auto; margin-right: auto; width: 960px; background:#FFF;}
#titleimage {float: left;}
#wrapper{display: inline; position: relative; clear: left;}
#content{clear: left; float: left; margin-left: 5px; margin-right: 5px; width: 630px; font-size: 1.2em;}
#sidebar{float: left; margin-left: 5px; margin-right: 5px; width: 310px; font-size:1.1em;}
#home-content{float: left; margin-left: 40px; margin-right: 5px; width: 940px; font-size: 1.2em; color: #F78D03;}
#home-content2{float: left; height: 400px; width: 940px;}
#home-content3{float: left; height: 500px; width: 940px;}
#footer{clear:both;font-family: arial,verdana,sans-serif; color:#ACACAC; font-size: 1em; text-align:center; padding:1em; border-top: 1px solid #C3D9FF;}
/*---General Style Section---*/
a {text-decoration: none; color: #3F65A6; font-weight: bold; background: transparent;}
a:hover {text-decoration: underline; color: #C3D9FF;}
small {text-align: right; margin: 1em 0;}
h1 {font-size: 1.4em;}
h2, h3, h4 {font-size: 1.2em;}
p img {padding: 0;}
.boxedup {border: 1px solid #CBD8F3; padding: 0.5em; margin: 0.5em; background-color: #F1F5FC; font-size: 0.9em;}
.boxedup  strong {color: #F78D03;}
.boxedin {border-top: 1px solid #CBD8F3; padding: 0 1em; margin: 0 120px 0 0.5em; text-align: right;}
.post-info { height: 22px; float: left; border: 1px solid #0c58a6; color: #fff; padding: 4px 10px; }
textarea {border: 1px solid #CBD8F3; font-size: 1em;}
.codes {clear:both;}
.codestext{color: #F78D03; font-weight:bold; width:95px; text-align:right; padding-right: 5px; padding-bottom: 4px;}
.codesembedtext{width:250px; border:1px solid #A7C2D5; background-color:#EBEBE3;}
#page_nav a {font-size:0.8em; display: block; color: #4969A2; padding: 5px; border: 1px solid #CBD8F3; background: #CBD8F3;}
#page_nav a:hover {color: #4969A2; border: 1px solid #CBD8F3; background: #FFF;}
.alignright {float: right; padding-right: 145px;}
.alignleft {float: left; padding-left: 30px;}
/*---Page Style Section---*/
#content p {margin: 0.4em; line-height: 1.4em; text-align: justify; font-size: 1em;}
#content h1, #content h2, #content h3 { display: block; color: #000000; font-family: arial,verdana,sans-serif; padding: 5px 0; margin: 0.5em 0; text-align: left;}
#content h1.firstheading  a {display: block; font-size: 1.2em; color: #000000;}
#content h2 {padding-left: 13px; font-size: 1.2em; color: #000; margin-right: 125px;}
#content h2.firstheading {padding-left: 13px; margin-right: 125px;}
#content h2 a {color: #3F65A6;}
#content h2 a:hover {color: #666;}
#content ul, #content ol {margin: 0.5em; padding: 0.5em;}
#content ul li {margin: 0 1em; padding: 0.2em; list-style: square inside;}
#content ol li {margin: 0 3em; padding: 0.2em; list-style: decimal outside;}
#content blockquote {margin: 15px; padding: 0 0 10px 30px; font-style: italic; background: url('images/blockquote.png') 0 0 no-repeat;}
#content blockquote p {margin: 1em 2em 0 0;}
#content p.details {clear:both; color: #808080; margin:-0.25em 0 1.0em 0; line-height:1.0em; font-size:110%;}
img.imagequote {padding: 5px; border-top: 1px solid #ddd; border-left: 1px solid #ddd; border-bottom: 1px solid #c0c0c0; border-right: 1px solid #c0c0c0; display:block; margin-left:auto; margin-right:auto;}
img.imagequote2 {width: 550px; height: 400px; padding: 5px; border-top: 1px solid #ddd; border-left: 1px solid #ddd; border-bottom: 1px solid #c0c0c0; border-right: 1px solid #c0c0c0; display:block; margin-left:auto; margin-right:auto;}
.home-content-small{color: #000; font-size: 12px; padding: 2px; font-weight: normal;}
.category-title{font-size: 1.2em; color: #F78D03;}
.category-content-small{color: #000; font-size: 12px; padding: 2px; font-weight: normal;}
/*---Navigation Bar Section---*/
#navbar {background: #3F65A6; width: 960px; height: 29px; font-size: 11px; font-family: arial,verdana,sans-serif; color: #FFFFFF; font-weight: bold; margin: 0px auto 0px;
	padding: 0px 0px 0px 0px; border-top: 1px solid #14356C; border-bottom: 1px solid #14356C; overflow: hidden;}
#navbar a, #navbar a:visited {color: #FFFFFF; font-size: 11px; text-decoration: none;	text-transform: uppercase; padding: 0px 0px 0px 3px;}	
#navbar a:hover {color: #FFFFFF; text-decoration: underline; padding: 0px 0px 0px 3px;}	
#navbar p {color: #FFFFFF; margin: 0px auto 0px; padding: 0px 0px 0px 10px; font-weight: bold;}	
#navbarleft {width: 700px; float: left; margin: 0px; padding: 0px 0px 0px 0px;}
#navbarrss {width: 40px; float: left; padding: 0px 0px 0px 0px;}
#navbarrss img:hover {padding: 1px 1px 1px 1px;}
#navbarright {width: 200px; font-size: 11px; float: right; margin: 0px; padding: 3px 10px 0px 0px;}
#navbarright a img {border: none; margin: 0px 0px 0px 0px; padding: 0px;}
#nav, #nav ul { /* all lists */ padding: 0; margin: 0; list-style: none; line-height: 1; z-index:1;}
#nav a, #nav a:visited {background: #3F65A6; color: #FFFFFF; display: block; font-weight: bold; margin: 0px 0px 0px 0px; padding: 7px 20px 7px 20px; width: 12em;}
#nav a:hover {background: #C3D9FF; color: #FFFFFF; margin: 0px 0px 0px 0px; padding: 7px 20px 7px 20px; text-decoration: none;}
#nav li {float: left; width: 11em; margin: 0px; padding: 0px;}
#nav li li {float: left; margin: 0px; padding: 0px; width: 200px;}
#nav li li a, #nav li li a:link, #nav li li a:visited {background: #3F65A6; width: 180px; float: none; margin: 0px; padding: 7px 30px 7px 10px; border-top: 1px solid #14356C;
	border-left: 1px solid #14356C;	border-right: 1px solid #14356C;}
#nav li li a:hover, #nav li li a:active {background: #C3D9FF; padding: 7px 30px 7px 10px;}
#nav li ul {position: absolute; width: 10em; left: -999em;}
#nav li:hover ul {left: auto; display: block;}
#nav li:hover ul, #nav li.sfhover ul {left: auto;}
/*---Page Navigation Section---*/
.wp-pagenavi {clear: both; font-size: 10px;}
.wp-pagenavi a, .wp-pagenavi span {text-decoration: none;	border: 1px solid #BFBFBF; padding: 3px 5px; margin: 2px; color: #FFF; background: #C3D9FF;}
.wp-pagenavi span.pages, .wp-pagenavi a.page, .wp-pagenavi a.last, .wp-pagenavi a.nextpostslink, .wp-pagenavi a.first, .wp-pagenavi a.previouspostslink{background: #3F65A6;}
.wp-pagenavi a:hover, .wp-pagenavi span.current {border-color: #000;background: #C3D9FF;}
.wp-pagenavi span.current {font-weight: bold; background: #C3D9FF;}

/*---Header Section---*/
#header{text-align:left; margin-bottom:30px; padding:10px 0 0;}
#header a {text-decoration: none;}
#header h1 {font-size: 2.5em;}
/*---Sidebar Section---*/
#sidebar{}
/*---Form Style Section---*/
.entry form {text-align: center;}
select {width: 140px;}
#commentform input {width: 170px; padding: 2px; margin: 5px 5px 1px 0; border: 1px solid #ccc; background: #f9f9f9;}
#commentform textarea {width: 95%; padding: 2px; border: 1px solid #ccc; background: #f9f9f9;}
#commentform #submit {color: #666; background: #eee; vertical-align: top;}
#commentform #submit:hover {border: 1px solid #aaa; background: #ddd;}
#commentform input:focus, #commentform textarea:focus, #searchform #s:focus {background: #fff;}
.comment_no {padding: 10px 0; float: right; font-size: 3em; color: #ccc;}
.commentlist {padding: 20px; margin: 0;}
ol.commentlist {margin: 0 !important; padding: 0 !important;}
.commentlist li {clear: both; background-color: #FFF; list-style-type: none !important; padding: 10px !important; border: 1px solid #CBD8F3; padding: 0.5em; margin: 0.5em;  margin: 10px !important;}
.commentlist .gravatar {display: block; float:left; padding: 3px; margin: 0 20px 5px 0; border: 2px solid #ccc; background: #eee;}
.commentmetadata {border-top: 1px dashed #ec5; clear: both; text-align: right; font-size: 0.8em; font-weight: normal; color: #ca5; margin-top: 20px !important;}
/*---Twitter Section---*/
ul.twitter {float: left; list-style: none; margin: 0; padding: 5px;}
ul.twitter li {margin: 0; padding: 5px; float: left; position: relative; width: 210px; height: 85px;}
ul.twitter li img{width: 200px; height: 300px; -ms-interpolation-mode: bicubic; /* IE Fix for Bicubic Scaling */ border: 1px solid #ddd; padding: 5px; background: #ffffff;position: absolute;left: 0; top: 0;}
ul.twittercat {float: left; list-style: none; margin: 5px; padding: 5px;}
ul.twittercat li {padding: 5px; float: left; position: relative; width: 225px; height: 325px;}
ul.twittercat li img {width: 215px; height: 325px; -ms-interpolation-mode: bicubic; /* IE Fix for Bicubic Scaling */ border: 1px solid #ddd; padding: 5px; background: #ffffff;	position: absolute;	left: 0; top: 0;}
ul.twitter-large {float: left; list-style: none; margin: 0; padding: 5px;}
ul.twitter-large li {margin: 0; padding: 5px; float: left; position: relative; width: 810px; height: 85px;}
ul.twitter-large li img{width: 860px; height: 400px; -ms-interpolation-mode: bicubic; /* IE Fix for Bicubic Scaling */ border: 1px solid #ddd; padding: 5px; background: #ffffff;position: absolute;left: 0; top: 0;}
ul.twittercat-large {float: left; list-style: none; margin: 5px; padding: 5px;}
ul.twittercat-large li {padding: 5px; float: left; position: relative; width: 525px; height: 325px;}
ul.twittercat-large li img {width: 515px; height: 325px; -ms-interpolation-mode: bicubic; /* IE Fix for Bicubic Scaling */ border: 1px solid #ddd; padding: 5px; background: #ffffff;	position: absolute;	left: 0; top: 0;}
/*---Thumbnail Section---*/
ul.thumb {float: left; list-style: none; margin: 0; padding: 5px;}
ul.thumb li {margin: 0; padding: 5px; float: left; position: relative; width: 210px; height: 85px;}
ul.thumb li img {width: 200px; height: 75px; -ms-interpolation-mode: bicubic; /* IE Fix for Bicubic Scaling */	border: 1px solid #ddd;	padding: 5px; background: #ffffff;
	position: absolute;	left: 0; top: 0;}
ul.thumb li img.hover {background:url('images/thumb_bg2.png') no-repeat center center; border: none;}

#navilower{float: left; margin: 15px;}
/*---Clear Section---*/
.clear {clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0;}
.clear2 {clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 10px;}
.clearfix:after {clear: both; content: ' '; display: block; font-size: 0; line-height: 0; visibility: hidden; width: 0; height: 0;}
* html .clearfix {height: 1%;}