/* 
Theme Name: whiteboard
Theme URL: http://whiteboardframework.com/
Description: A blank theme for you to draw on.
Author: Brian Purkiss
Author URI: http://brianpurkiss.com
Version: 2.0.1

Obviously, you may edit the above info upon your customization.
Though I wouldn't mind a link somewhere... *hint hint*
*/

@charset "utf-8";
/* CSS Document */

* {margin:0;padding:0;} 

html, body 
{
  height: 100%;
}

body
{
	background-color: #edeef0;
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
	font-size: 62.5%;
	line-height:1.6em;
	color:#666;
	background-image: url("images/texture.png");
}

h1, h2, h3, h4, h5, h6
{
	font-weight:normal;	
}

.clearfix {
    display: block;
	clear: both;
	visibility: hidden;
	height: 1px;
	overflow: hidden;
	font-size: 1px;
}

/*
_______________________________
CONTAINER */
#container
{
	width: 960px;
	margin-left: auto;
	margin-right:auto;
	min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -318px;
}

.wrapper {
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto -392px; /* the bottom margin is the negative value of the footer's height */
}

.push
{
	height: 318px;
    clear: both; 	
}

#topblock
{
	width: 100%;
	float: left;
	background-image: url("http://www.solidshops.com/images/frontend/v2/purple_stripe.jpg");	
	background-repeat: repeat-x;
}

#intro_container, .container
{
	width: 100%;
	max-width: 1140px; /* laptop + desktop */
	margin: 0 auto;
}

body #footer, .push {
	height: 300px; /* .push must be the same height as .footer */
}


/*
_______________________________
NAVIGATION */
a#logo:link, a#logo:visited, a#logo:hover, a#logo:active
{
	background-image: url("http://www.solidshops.com/images/frontend/v2/logo.png");
	width: 183px;
	height: 39px;
	background-position: top left;
	
	margin-left: auto;
	margin-right: auto;
	display: block;
	margin-bottom: 1em;
	
}

a#logo:hover
{
	background-position: bottom left;	
}

nav
{
	width: 90%;
	padding: 0 5%;
	text-align: center;
}

nav
{
	padding-top: 2em;	
	padding-bottom: 2em;
}

nav ul li
{
	display: inline;	
}

nav ul li a:link, 
nav ul li a:visited, 
nav ul li a:hover, 
nav ul li a:active
{
	font-size: 1.2em;
	display: inline-block;
	background-color: #372b5a;
	color: #b09ed1;
	text-transform: uppercase;
	text-decoration: none;
	padding: 0.5em;
	border-radius: 0.5em;
	margin: 0.25em 0.5em;
}

nav ul li a:hover
{
	color: #e8e3f2;	
}


nav ul li.highlight a:link, 
nav ul li.highlight a:visited, 
nav ul li.highlight a:hover, 
nav ul li.highlight a:active
{
	font-weight: bold;
	color: #dfd8ec;
}



/*
_______________________________
INTRODUCTION */
#introduction
{
	background-image:none;
	float:left;
	height:61px;
	width:960px;
}


/*
_______________________________
FOOTER */
#footer
{
	border-top: 2px solid #d4dde2;	
	background-color: #1e1e1f;
	width: 100%;
	margin-top: 60px;
	color: #f0ebe8;
	padding-top: 30px;
	font-size: 1.2em;	
	float: left;
}

#footer h4
{
	color: #ffffff;
	font-size: 1.3em;	
	margin-bottom: 1em;
}

#footer_info
{
	width: 90%;
	padding: 0 5%;
	max-width: 1140px; /* laptop + desktop */
	margin: 0 auto;		
}

#footer ul li
{
	margin-bottom: 1em;	
}

.solidshops_general
{
	width: 50%;	
	float: left;
}

.solidshops_members
{
	width: 50%;	
	float: left;
}

.whos_behind_this
{
	width: 50%;	
	float: left;
	display:none;
}

.boring_stuff
{
	width: 100%;	
	float: left;
	padding: 2em 0px;
	border-top: 1px solid #47474b;
	margin-bottom: 2em;
	margin-top:2em;
	line-height: 1.5em;
	color: #9b9ba0;
	text-align: center;
}

.boring_stuff .copyright
{
	margin-top: 1em;	
}

#footer a:link, #footer a:visited, #footer a:hover, #footer a:active
{
	color: #9b9ba0;
	text-decoration: none;
}

#footer a:hover
{
	color: #f0ebe8;	
}

#footer p.getsocial
{
	margin-bottom: 1.25em;
 	background-color: #3f3f42;
 	border-radius: 3px;
 	padding: 0.3em 0.5em;
	line-height: 1.4em;
	color: #888;
}

#footer p.getsocial strong
{
	font-weight: bold;
}

.whos_behind_this ul.social_media li
{
	width: 33%;
	float: left;
}

.whos_behind_this ul.social_media li img
{
	vertical-align: middle;
	margin-right: 5px;
}



/*
_______________________________
BLOG CONTENT */
#content
{
	width: 95%;
	float:left;
	padding: 1em 2.5%;
	background-color:#fff;
	margin: 0;

	border-radius:10px;
	
}

#content img
{
	max-width: 100%;
	height: auto;
}

/* added for post image alignment*/
img.alignright {float:right; margin:0 0 1em 1em}
img.alignleft {float:left; margin:0 1em 1em 0}
img.aligncenter {display: block; margin-left: auto; margin-right: auto}
.alignright {float:right; }
.alignleft {float:left; }
.aligncenter {display: block; margin-left: auto; margin-right: auto}



.video {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}

.video iframe,  
.video object,  
.video embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

h1.title
{
	font-size:3.0em;
	font-weight: normal;
	letter-spacing:-1px;
	margin: 30px 0 0 17px;
	font-family: Helvetica, Tahoma, Arial, sans-serif;
}

h1.title span
{
	font-size: 0.6em;
    vertical-align:middle;
}

#backgroundwrapper
{
	width: 90%;
	padding: 4em 5%;
	float:left;
}

#content a:link, #content a:visited, #content a:hover, #content a:active
{
	color:#5858b7;
	
}

#content a:hover
{
	color: #b51769;
}

#content h2, #content h3, #content h1
{
	color:#2aacde;
	font-family:Helvetica;
	font-weight:bold;
	margin: 5px 0 5px 0;
	line-height:1em;
	font-family: 'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif;
}

#content h1
{
	 font-size: 2.4em;
	 line-height: 1.2em;
	 text-transform: capitalize;
}

#content h1 a:link,
#content h1 a:visited,
#content h1 a:hover,
#content h1 a:active
{
	color: #443266;	
	text-decoration: none;
}

#content h2
{
	color: #624894;	
}

#content h3
{
	color: #624894;	
}

#content h2, #content h3
{
	font-size: 2.1em;
	margin-top: 15px;	
}

.post{margin-bottom: 30px;}

.post p
{
	line-height: 1.5em;
	font-size: 1.5em;
	font-family: Helvetica, Arial, sans-serif;
	margin: 1em 0;
}

.post .metadata
{
	font-style: italic;	
	margin: 5px 0;
	font-size: 1.2em;
}

.postmeta
{
	font-size: 0.9em;
}
	
.postnavigation{ font-size: 1.4em; }
#searchform{}
.comments_navigation{}
.comments_navigation{}
.comments_reply{}
.comments_text{}
.comments_meta{font-size: 0.9em;}

#content ul li, #content ol li 
{
	font-size: 1.5em;
	list-style-type:disc;
	list-style-position:inside;
	line-height: 1.5em;
	font-family:Helvetica,Arial,sans-serif;
}

#content ul#sharebarx li
{
	list-style-type: none;
}

#content #comments ol li
{
	list-style-type:none;
	font-size: 1em;
}

#content ol li
{
	list-style-type:decimal;
}

#comments .even a:link, 
#comments .even a:visited, 
#comments .even a:hover, 
#comments .even a:active
{
	color: #fff;
}

#comments .even a:hover
{
	text-decoration: underline;
}


/*
_______________________________
SIDEBAR */

#sidebar
{
	display:none;
	width: 25%;
	padding: 1em 2.5%;
	
	float: left;
	margin-top: 0;
	background-color:#f9fafb;
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;

}

#sidebar h2
{
	color:#846ab6;
	font-size:2em;
	font-weight:normal;
	margin: 25px 0 10px 0;
}

#sidebar ul
{
	margin: 10px 0 25px 0;	
}

#sidebar ul li 
{
	line-height: 1.5em;
	margin-bottom: 10px;
}

#sidebar ul li p
{
        font-size: 1.3em;
        margin-bottom: 1.3em;
}

#sidebar a:link, #sidebar a:visited, #sidebar a:hover, #sidebar a:active
{
	color:#4669CD;
	text-decoration:none;
	font-size: 1.4em;
	line-height: 1.3em;
}

#sidebar a:hover
{
	color: #4669CD;
}


input.searchfield
{
	width: 60%;
	padding:4px;
    border-radius: 4px;
	border: 1px solid #c0c2bd;
	margin: 0;
	vertical-align:middle;
}

input.textfield
{
    padding:4px;
	border-radius: 4px;
	border: 1px solid #c0c2bd;
	margin: 0;
	vertical-align:middle;
    margin-bottom: 2px;
}

p.promo
{
   	padding: 4px;
	background-color: #ffffac;
}

#subForm label
{
   float: left;
   width: 50px;
   font-size: 14px;
   line-height: 23px;
   vertical-align: middle;
}

div.searchalign input#searchsubmit
{
	vertical-align:middle;
	margin-left: 5px;
}


/*
_______________________________
COMMENTS */
div.comments_reply textarea
{
	padding:5px;
	border:2px solid #ddd;
	width:100%;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;

	font-size: 1.2em;
	padding: 5px;
	font-family:Arial, Helvetica, sans-serif;
}


.comments_reply label
{
	display:block;
}

.comments_reply input.text
{
	padding: 5px;	
	font-size: 1.2em;
	width: 270px;
}


.comments_reply .half
{
	width: 100%;
	float: left;
}

#comments li
{
	padding: 10px;	
}

#comments li.alt
{
	background-color:#f8fcfe;
}

#comments li.alt a:link, #comments li.alt a:visited, #comments li.alt a:hover, #comments li.alt a:active 
{
	color:#5858B7;
}

#comments li.alt a:hover
{
	color: #b51769;
}

#comments li.author
{
	background-color:#1F98C7;
	color: #e9f6fc;
}



#comments li.author a
{
     text-decoration: none;
}

#comments h3.commentcounter
{
	font-size: 2em;
	margin: 2em 0 1.5em 0;
}

.comments_meta p
{
	margin-top: 0px;
}

.comments_meta p strong
{
	
	padding: 2px;
}

.author .comments_meta  p strong
{
       color: #443266;
       font-family: 'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif;
}

img.avatar
{
       width: 30px;
       height: 30px;
       border: 2px solid #ccc;
       margin-right: 10px;
       position: relative;
       top: 10px;
       border-radius: 50%;
}

div.authoravatar
{
	float:left;
	margin-top: 0.4em;
}

div.authoravatar img.avatar
{
	width: 47px;
	height: 47px;
	position: inherit;
	top: 0;
	border: none;
}

.post p.wp-caption-text
{
	font-style: italic;
	font-size: 1.2em;
	color: #888;
}

/*
_______________________________
ARCHIVES */
#content h2.archivetitle
{
	color: #6ea600;	
	font-weight: normal;
	margin-bottom: 15px;
}


/*
________________________________
syntax highlighter evolved plugin
*/

body .syntaxhighlighter {
   font-size: 1.4em !important;
}

/*
_______________________________
QUOTES */
blockquote {
	margin: 1em 3em;
	color: #888;
	border-left: 2px solid #999;
	padding-left: 1em; 
}




/*
_______________________________
MEDIA QUERIES */

@media only screen and (min-width : 600px)
{
    .solidshops_general
	{
		width: 25%;	
	}
	
	.solidshops_members
	{
		width: 25%;	
	}
	
	.whos_behind_this
	{
		display:block;
	}	

	#content
	{
		width: 65%;
		border-top-right-radius: 0;
	}
	
	#sidebar
	{
		display:block;
	}
}


@media only screen and (min-width : 800px)
{
	
	a#logo:link, a#logo:visited, a#logo:hover, a#logo:active
	{
		float: left;
		margin-bottom: 1.5em;
	}
	
	nav
	{
		float: left;
		padding-bottom: 0em;
	}
	
	nav ul
	{
		float: right;
		background-color: #372b5a;
		border-radius: 0.5em;
	}
	
	nav ul li a:link, 
	nav ul li a:visited, 
	nav ul li a:hover, 
	nav ul li a:active
	{
		background-color: transparent;
	}	
}

@media only screen and (min-width : 1024px)
{
	.comments_reply .half
	{
		width: 50%;
	}
}

@media
only screen and (-webkit-min-device-pixel-ratio : 2),
only screen and (min-device-pixel-ratio : 2)
{	
	a#logo:link, a#logo:visited, a#logo:hover, a#logo:active
	{
		background-image: url("http://www.solidshops.com/images/frontend/v2/logo-2x.png");
		background-size: 100%; 
	}
}