/* = TOOLS
------------------------------------------------------------------------------------------------------------------
*/

/* = RESET
---------------------------------------------------------
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td
{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
	background: transparent;
}

/* remember to define focus styles! */

:focus
{
	outline: 0;
}

body
{
	line-height: 1.0;
	color: black;
	background: white;
}

ol, ul
{
	list-style: none;
}

/* tables still need 'cellspacing="0"' in the markup */

table
{
	border-collapse: collapse;
	border-spacing: 0;
}

caption, th, td
{
	text-align: left;
	font-weight: normal;
}

blockquote:before, blockquote:after,
q:before, q:after
{
	content: "";
}

blockquote, q
{
	quotes: "" "";
}

/* END RESET
---------------------------------------------------------
*/

/* = CLEARING
---------------------------------------------------------
*/

.stretch,
.clear
{
	clear: both; 
	height: 1px; 
	margin: 0; 
	padding: 0; 
	font-size: 15px;
	line-height: 1px;
}

.clearfix:after
{
	content: "."; 
	display: block; 
	height: 0; 
	clear: both;
	visibility: hidden;
}

/* END CLEARING
---------------------------------------------------------
*/

/* = ACCESSIBILITY
---------------------------------------------------------
*/

span.accesskey
{
	text-decoration: none;
}

.accessibility,
.accessibile-headline
{
	position: absolute;
	top: -999em;
	left: -999em;
}
		
/* END ACCESSIBILITY
---------------------------------------------------------
*/

/* END TOOLS
------------------------------------------------------------------------------------------------------------------
*/


body
{
    margin: 0px;
    background-color: #fff;
    font-family: Arial, Helvetica, sans-serif;
}            

a
{
    color: #80c844;
}

a:hover
{
	text-decoration: none;
}

p
{
	font-size: 12px;
	line-height: 18px;
}

	#header
	{
	    width: auto;
	    margin: 0;
	    padding: 40px 20px 60px 250px;
	    text-align: left;
	    position: relative;
		color: #fff;
		background: #333/* url('http://www.justinmacnair.com/tumblr/face.gif') 763px 20px no-repeat*/;
	}

		#header h1
		{
			font-weight: normal;
			font-size: 48px;
			/* letter-spacing: -2px; */
			line-height: 60px;
			width: 459px;
			height: 45px;
		}
		            
		    #header h1 a
		    {
		    	display: block;
		    	width: 100%;
		    	height: 100%;
		        color: #fff;
		        text-decoration: none;
		        background: #333 url('http://www.justinmacnair.com/tumblr/h1.gif') left top no-repeat;
		    }
		            
		    #header a,
		    #header a:link,
		    #header a:visited
		    {
		        color: #80c844;
		        text-decoration: none;
		    }
		    
		    #header a:hover,
		    #header a.current
		    {
		    	color: #ccc;
		    }
		    
		    #header a img
		    {
		        border-width: 0px;
		    }
		    
		    div#header div#description
		    {
		    	color: white;
		    }
		    
		    div#header div#nav
		    {
				float: left;
		    }
		
			div#header div#search
			{
				float: left;
		        width: 250px;
		        margin-left: 5px;
		        text-align: left;
		    }

				div#header div#search input
				{
					display: block;
					float: left;
					background: #f0f0f0;
					border: none;
				}
				
				div#header div#search input.field
				{
					width: 158px;
					color: #fff;
					font-size: 17px;
					line-height: 20px;
					font-weight: normal;
					padding: 0;
					margin: 0;
					background: #333;
					border-bottom: 1px solid #fff;
				}
				
				div#header div#search input.button
				{
					width: 20px;
					height: 21px;
					color: #4d4e4f;
					font-size: 14px;
					line-height: 21px;
					font-weight: bold;
					padding: 0;
					margin: 0 0 0 5px;
				}
			
			div#header p
			{
				clear: both;
			}

div#content
{
    width: auto;
    margin: 50px auto 0 auto;
    position: relative;
}

	div#posts
	{
		float: left;
		width: 670px;
		margin-left: 250px;
	}

            div#description
            {
				font-weight: normal;
				font-size: 17px;
                line-height: 20px;
                color: #777;
            }

                div#description a
                {
                    color: #80c844;
                }

				div#searchresultcount
				{
					width: 670px;
					margin: 15px 0 40px 250px;
					text-align: left;
	                padding-bottom: 40px;
	                border-bottom: 1px solid #ccc;
				}

				div#searchresultcount p
				{
					font-size: 18px;
				}
				
				.query
				{
					font-weight: bold;
				}
            
            div.post
            {
                position: relative;
                margin-bottom: 40px;
                padding-right: 40px;
                padding-bottom: 40px;
                border-bottom: 1px solid #ccc;
            }

                    div.post h2 a,
                    div.post div.caption a,
                    div.post div.quote div.quote_text a,
                    div.post div.quote div.source a
                    {
                        color: #80c844;
                        text-decoration: none;
                    }

                    div.post h2 a:hover,
                    div.post div.caption a:hover,
                    div.post div.quote div.quote_text a:hover,
                    div.post div.quote div.source a:hover
                    {
                        color: #cc0000;
                    }

                div.post div.date
                {
                    position: absolute;
                    left: -250px;
                    text-align: right;
                    width: 200px;                
                    white-space: nowrap;
                    font: normal 34px;
                    /* letter-spacing: -2px; */
                    color: #ccc;
                    text-transform: uppercase;
                    line-height: 35px;
                }
                
                    div.post div.date div.date_brick
                    {
                        float: right;
                        background-color: #00adef;
                        color: #fff;
                        font-weight: bold;
                        font-size: 14px;
                        text-align: center;
                        line-height: 18px;
                        margin-left: 10px;
                        padding: 10px;
                        /* letter-spacing: 0px; */
                        overflow: hidden;
                    }

                div.post div.permalink
                {
                    width: 30px;
                    height: 19px;
                    border-width: 0px;
                    background-color: #fff;
                    position: absolute;
                    right: 0px;
                    top: 4px;
                    z-index: 10;
                }
                
                    div.post div.permalink a
                    {
                    	display: block;
                    	width: 100%;
                    	height: 100%;
		        		background: #fff url('http://www.justinmacnair.com/tumblr/permalink.gif') left top no-repeat;
                    }
                
                    div.post div.permalink a:hover
                    {
		        		background: #fff url('http://www.justinmacnair.com/tumblr/permalink.gif') left -19px no-repeat;
                    }

					div.post img,
					div.video .embed
					{
						border: 10px solid black;
					}

                div.post h2
                {
                    font-size: 18px;
                    font-weight: bold;
                    color: #6498cc;
                    /* letter-spacing: -1px; */
                    margin: 0px 0px 5px 0px;
                }
            
                div.post div.caption
                {
                    font-size: 14px;
                    line-height: 18px;
                    font-weight: bold;
                    color: #333333;
                    margin-top: 10px;
                    padding: 0px 20px 0px 0px;
                }
    
            /* Regular Post */
            
                div.post div.regular
                {
                    font-size: 12px;
                    color: #333333;
                    line-height: 18px;
                }

                    div.post div.regular blockquote
                    {
                        font-style: italic;
                        border-left: solid 2px #333333;
                        padding-left: 10px;
                    }
                        
            /* Quote Post */
            
                div.post div.quote div.quote_text
                {
                    font-weight: bold;
                    color: #888;
                    border-left: solid 5px #6498cc;
                    padding-left: 10px;
                }
                
                    div.post div.quote div.quote_text span.short
                    {
                        font-size: 36px;
                        line-height: 40px;
                        /* letter-spacing: -1px; */
                    }
                    
                    div.post div.quote div.quote_text span.medium
                    {
                        font-size: 25px;
                        line-height: 29px;
                        /* letter-spacing: -1px; */
                    }
                    
                    div.post div.quote div.quote_text span.long
                    {
                        font-size: 16px;
                        line-height: 21px;
                    }
        
                div.post div.quote div.source
                {
                    font-size: 16px;
                    font-weight: Bold;
                    color: #555;
                    margin-top: 5px;
                }
            
            /* Link Post */
            
                div.post div.link a.link
                {
					font-weight: bold;
					font-size: 20px;
					line-height: 24px;
                    /* letter-spacing: -1px; */
                    color: #80c844;
                }

                div.post div.link a.link:hover
                {
                	color: #cc0000;
                }
                
                    div.post div.link span.description
                    {
                        font-size: 12px;
                        line-height: 18px;
                        font-weight: normal;
                        /* letter-spacing: -1px; */
                        color: #333333;
                    }
            
            /* Conversation Post */
                        
                div.post div.conversation ul
                {
                    list-style-type: none;
                    margin: 0px;
                    padding: 0px 0px 0px 1px;
                    border-left: solid 5px #bbb;
                }
            
                    div.post div.conversation ul li
                    {
                        font-size: 12px;
                        padding: 4px 10px 4px 8px;
                        color: #333333;
                        margin-bottom: 1px;
                    }
            
                        div.post div.conversation ul li span.label
                        {
                            font-weight: bold;
                        }
                        
                            div.post div.conversation ul li span.user_1
                            {
                                color: #80c844;
                            }
                            
                            div.post div.conversation ul li span.user_2
                            {
                                color: #00c;
                            }
                            
                            div.post div.conversation ul li span.user_3
                            {
                                color: #0a0;
                            }
                        
                        div.post div.conversation ul li.odd
                        {
                            background-color: #f4f4f4;
                        }

                        div.post div.conversation ul li.even
                        {
                            background-color: #e8e8e8;
                        }
            
            /* Video Post */
            
            div.post div.video
            {
            	width: 420px;
                margin: 0;
            }
            
            .youtubin-video
            {
            	clear: both;
            	display: block;
            	margin: 20px 0;
            	border: 1px solid red;
            }

/* Footer */
            
div#footer
{
	width: 670px;
    margin: 40px 0px 40px 250px;
    text-align: center;
    font-size: 15px;
    font-weight: bold;
    color: #333333;
	clear: both;
}

	div#footer div#prev,
	div#footer div#next
	{
		display: block;
		width: 330px;
	}
	
	div#footer div#prev
	{
		float: left;
		text-align: left;
	}
	
	div#footer div#next
	{
		float: right;
		text-align: right;
	}
	            
		div#footer a
		{
			display: block;
			width: 300px;
			height: 100%;
			padding: 15px;
			text-decoration: none;
			color: white;
			background: #80c844;
		}
		            
		div#footer a:hover
		{
			text-decoration: none;
			background: #cc0000;
		}
                    
	div#credit
	{
		display: block;
		clear: both;
		font-size: 13px;
		margin: 0;
		padding: 15px 15px 15px 250px;
		text-align: left;
		background: #333333;
		color: white;
	}
	
		div#credit div.col
		{
			width: 125px;
			float: left;
			padding: 0 25px 0 0;
		}
	
		div#credit a
		{
			display: inline;
			padding: 0;
			width: auto;
			height: auto;
			background: none;
			color: white;
			text-decoration: underline;
		}
		
		div#credit a:hover
		{
			text-decoration: none;
		}
	
	div#credit a.current
	{
		text-decoration: none;
	}