/*////////////////////////////////////////////////////////////////
///////////////////// CSS ///////////////////////////////////////
/////////////////////////////////////////////////////////////////
* Filename: style.css						*
* Version: 2.0.0						*
* Website: http://jpmcgarrity.com				*
* Author:
  __     ___                 ___                _ _         
  \ \   / _ \   /\/\   ___  / _ \__ _ _ __ _ __(_) |_ _   _ 
   \ \ / /_)/  /    \ / __|/ /_\/ _` | '__| '__| | __| | | |
/\_/ // ___/  / /\/\ \ (__/ /_\\ (_| | |  | |  | | |_| |_| |
\___(_)/  (_) \/    \/\___\____/\__,_|_|  |_|  |_|\__|\__, |
                                                      |___/
 											
* Description: Handles the site layout.		*

/////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////*/
/*

    font-size:0.75em;	= 12px
    font-size:0.875em;	= 16px

*/
/*///////////////////////////////////////////////////////////////
*				I. HTML Styles									*
///////////////////////////////////////////////////////////////*/


::-moz-selection{background: #b31027; !important} 

::selection {background: #b31027; !important}

br
{
	clear:both;
}
body
{
	background:#1d262d url('/portfolio/2009/gfx/body_background8.jpg') repeat fixed;
	width:100%;
	margin:0 auto;
    font-size:100%;	
    line-height:1.135em; /* 16×1.125=18 */
}

p
{
	color:#dfe5e1;
	color:#c4cacf;	
	margin:5px 0px 10px;
	font:normal 0.80em arial,verdana;		
}

b, strong
{
	color:#fff;
}

h1
{
	font:normal 1.80em helvetica,Georgia,times;
	color:#fff;
	margin:14px 0px 0px 0px;
}

h2
{
	font:normal 1.40em arial,Verdana,Georgia,times,helvetica;
	letter-spacing: -1px;
	margin:0px 0px 5px 0px;
	color:#b2b29b;	
}

h3
{
	color:#dfe5e1;	
	font:normal 1.88em helvetica,Georgia,times;
	margin:0px 0px 5px 0px;
}


h3#Portfolio
{
	background:url('/portfolio/2009/gfx/title_portfolio-trans.png') no-repeat;	
	text-indent: -9999px;
	width:229px;
	height:61px;
}

h3#Services
{
	background:url('/portfolio/2009/gfx/title_services-trans.png') no-repeat;	
	text-indent: -9999px;
	width:229px;
	height:61px;
}

h3#About
{
	background:url('/portfolio/2009/gfx/title_about-trans.png') no-repeat;	
	text-indent: -9999px;
	width:229px;
	height:61px;
}

h3#Contact
{
	background:url('/portfolio/2009/gfx/title_contact-trans.png') no-repeat;	
	text-indent: -9999px;
	width:229px;
	height:61px;
}

h4
{
	color:#aba971;	
	font:normal 1.40em helvetica,Georgia,times,helvetica;	
	margin:0px 0px 8px 0px;
}

h4#Process
{
	background:url('/portfolio/2009/gfx/title_process-trans.png') no-repeat;	
	text-indent: -9999px;
	width:165px;
	height:44px;
}

h4#Client_list
{
	background:url('/portfolio/2009/gfx/title_client_list-trans.png') no-repeat;	
	text-indent: -9999px;
	width:190px;
	height:44px;
}


h5
{
		color:#dfe5e1;	
		font:normal 1.88em helvetica,Georgia,times;
		margin:0px 0px 5px 0px;
}

h6
{

}
 

a
{
	background:#b31027;
	color:#dfe5e1;
	text-decoration:none;
	padding:0 2px;
}


a:hover
{
	background:#b31027;
	color:#dfe5e1;
	text-decoration:underline;
	padding:0 2px;
}

a.none,a.none:hover
{
	background:none !important;
	text-decoration:none;
	padding:0px;
}

ul
{
	list-style:none;
}

ol
{
	margin-left:1.5em;
}

ol li
{
	margin:5px 0px 10px 0px;
}


dl
{
	color:#dfe5e1;
	margin:5px 0px 10px;
	font:normal 0.80em arial,verdana;
}

dt
{
	display:inline;
	font-weight:bold;
}

dd
{
	display:inline;	
	float:left;
	width:200px;
	margin-left:20px;
}

label
{
	display:block;
	color:#fff;
	margin:10px 0px 2px 0px;
	font-family: arial,verdana;
	
}

legend
{
	display:none;
}

input,textarea
{
	padding:5px;
	width:400px;
	font:normal 100% arial,verdana;
	background:#000;
	opacity:.75;
	border:1px solid #737f76;	
/*	border:none;*/
	color:#dfe5e1;
}

textarea
{
	display:block;	
	margin-bottom:20px;
}

small
{
	font:normal 80% arial,verdana;
	color:#737f76;	
}





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

#page_wrapper
{
	width:1000px;
	margin:0px auto;
}

#tab_holder
{
	width:100%;
	background:#000;
/*	background:#626c64;*/
	height:1px;
	border-bottom:1px dashed #737f76;
/*	border-bottom:1px solid #000;*/
}

#tab_bottom
{
	width:100%;
	background:#000;
	height:6px;
}

.tweet
{
	opacity:1.4;
}
.tweet a
{
	background:none;
	text-decoration:underline;
}


.date
{
	float:right;
	width:100px;
	background:#000;
	border:1px solid #fff;
}

#top-bar
{
/*	background:#ccc url('/portfolio/2009/gfx/top-bar.gif') repeat-x;*/
	float:left;
/*	text-align:center;*/
	margin:5px auto 0px;	
	width:1000px;
	height:100px;
}


#content_level_1
{
/*		background:#fff url('/portfolio/2009/gfx/blue_background.jpg') repeat;*/
		width:1000px;
		height:400px;
		margin:20px auto;	
}


#narrow_col
{
	float:right;
	width:300px;	
	color:#dfe5e1;
	margin:5px 0px 5px;
/*	font:normal 0.80em arial,verdana;		*/
}

#wide_col
{
	border-right:1px solid #737f76;
	float:left;
	width:675px;		
	_width:655px;		
	padding-right:20px;
	_padding-right:12px;
	color:#dfe5e1;
}

#full_col
{
	float:left;
	width:1000px;
	padding-right:10px;
	color:#dfe5e1;
}



#short_bio, #contact_snap
{
	padding-left:10px;
	margin-bottom:10px;	
}

#contact_snap li
{
	font:normal 0.80em arial,verdana;		
}

#global_navigation
{
	text-transform: uppercase;
	float:right;
	text-align:right;
	font-family:arial;
    font-size:0.75em;
	width:100%;
}

#global_navigation ul li,#global_navigation li
{
	list-style:none;
	display:inline;
	margin:0px 5px 5px 5px;
}

/* advance selectors fuck ie6 */
#global_navigation li:first-child
{
	margin:0px 5px 5px 0px;
}

#global_navigation li:nth-child(5)
{
	margin:0px 0px 5px 7px;
}
/* end advanced selectors */

#global_navigation li
{
	float:left;
}

#global_navigation a
{
	margin:5px 0;
	float:left;
	width:181px;
	color:#fff;
	text-decoration:none;
	border-bottom:1px solid #737f76;
	padding:5px 5px 5px 5px;
	background:none;
	font-size:1.25em;
	text-align:left;
	-webkit-transition: all 100ms linear;

}

#global_navigation a:hover
{
	color:#fff;
	border-bottom:5px solid #737f76;
	padding:5px 5px 1px;
	background:none;
	font-size:1.25em;
}

#global_navigation .active_global
{
	margin-top:0px;
	color:#fff;
	border-top:5px solid #b31027;
	padding:5px;
	background:none;
	font-size:1.25em;
}


a.blank_link
{
	color:#fff;
	text-decoration:none;
	background:none;
	border:0px;
	padding:0px;
}

.externalLink /* this is called with jquery letting users know it will take them to an external link */
{
	background:#3e6586 url('../gfx/external_link_background.gif') right no-repeat;
	color:#dfe5e1;
	text-decoration:none;
	padding:0 13px 0 2px;
	
}

.externalLink:hover /* this is called with jquery letting users know it will take them to an external link */
{
	background:#3e6586 url('../gfx/external_link_background.gif') right no-repeat;
	color:#dfe5e1;
	text-decoration:none;
	padding:0 13px 0 2px;
	
}


#banner img
{
/*	background:#737f76;*/
	background:#000;
	padding:4px;
	border:1px solid #737f76;
}

#quote
{
	border-top:3px double #737f76;
	border-bottom:3px double #737f76;	
	width:985px;
	padding:0 7px;
	font-family: Georgia;
	color: #444;
	text-decoration: none;
	word-spacing: normal;
	text-align: left;
	letter-spacing: 0;
	line-height: 1.2em;
	font-size: 1.3em;
	margin:48px 0 12px;
	_margin:28px 0 12px;	
	background:#000;
	opacity: 0.85;
}

#footer
{
	clear:both;
	float:left;
	border-top:1px solid #737f76;
	width:1000px;
	margin:20px 0;
	padding:10px 0;	
	color:#dfe5e1;
	font:normal 0.80em arial,verdana;
}

.tags
{
	background:#737f76 url('/portfolio/2009/gfx/tags_corner.gif') top left no-repeat;
	margin:10px 1px 0px 1px;
	padding:3px;
	color:#ccc;
	font:normal 90% arial,verdana;	
}


#service_list li
{
	float:left;
	width:31%;
	margin:0 20px 15px 0;	
	font:normal 0.80em arial,verdana;		
}

#portfolio_list li
{
	float:left;
	width:31%;
	margin:0 20px 25px 0;	
	font:normal 90% arial,verdana;		
	height:290px;
}

#portfolio_list li.blank
{
	float:left;
	width:31%;
	margin:0 20px 25px 0;	
	font:normal 90% arial,verdana;		
	height:290px;
	background:#000;
	opacity: .5;
	border:1px dashed #737f76;
}

#resume_list
{
	font:normal 0.80em arial,verdana;		
}

#resume_list ul
{
	margin:2px 0px 15px 0px;
}

#client_list ul
{
	clear:both;
}

#client_list li
{
	float:left;
	width:13.5%;
	margin:0 20px 15px 0;	
	font:normal 0.80em arial,verdana;
	font-weight:bold;
	padding:3px 5px;
	background:#000;
}


#process
{
	border-top:1px solid #737f76;
	padding:10px 0;
}

.portfolio_image
{
	background:#737f76;
	padding:2px;	
}

.portfolio_image:hover
{
	background:#aec0b2;
	padding:2px;	
}

#service_list strong
{
	text-transform: uppercase;
}

a.return
{
	float:right;
	font:normal 100% arial,verdana;	
	padding:4px;
	font-weight:bold;
}

#images { height: 185px; width: 240px; padding:0; margin:0; overflow: hidden;}
#images img { border:none;}


/* contact form styles */

.info_fieldset
{
float:left;	
height:450px;	
}

.button
{
	background:#737f76;
/*	border:1px solid #42342c;*/
	width:410px;
	font-weight:bold;
	color:#dfe5e1;
	cursor: pointer;
}

.button2
{
	background:#737f76;
	font-size:12px;
	width:410px;
	font-weight:bold;
	color:#dfe5e1;
	padding:2px;
	height:30px;
	cursor: pointer;	
}


.note
{
	background:red;
	padding:5px;
}


#process_list
{
	font:normal 0.80em arial,verdana;			
}

#process_list li
{
	margin-left:1em;
}

#sitemap ul li
{
	display:inline;
	list-style:none;
	width:200px;
}

#sitemap a
{
	color:#fff;
	text-decoration:none;
	width:60px;
/*	border:1px solid #737f76;*/
	padding:5px;
	background:none;
}

#sitemap a:hover, .active_sitemap
{
	color:#fff;
	text-decoration:underline;
	width:60px;
/*	border:1px solid #737f76;*/
	padding:5px;
	background:none;
}

/*/////////////// Weather styles */

.weather {
	width: 30px; height: 10px;
	/* DEFAULTS TO SUNNY */
	background: black;
	}
	.weather-rain {
		background: green;
	}
	.weather-snow {
		background: purple;
	}
	.weather-sunny, .weather-fair {
		background: blue;
	}
	.weather-partly-cloudy, .weather-cloudy, .weather-mostly-cloudy {
		background: orange;
}



/*/////////////// blog styles */

h3.postTitle a
{
	background:none;
	color:#dfe5e1;	
	margin:0px 0px 5px -3px;	
}

#blog_narrow_col 
{
	float:right;
	width:290px;	
	_width:280px;		
	color:#dfe5e1;
	margin:0px 0px 5px;
	padding-left:10px;
}

#blog_narrow_col a, .postMeta a
{
	font:normal 100% arial,verdana;	
	background:none;
}

#blog_narrow_col a:hover, .postMeta a:hover
{
	background:none;
/*	color:#c0d3e4;*/
/*	background:#20394e;*/
}


#blog_narrow_col label, #archives, .categories
{
	color:#aba971;	
/*	font:normal 1.40em Georgia,times,helvetica;	*/
	margin:0px 0px 8px 0px;	
	margin-top:20px;	
}


#blog_narrow_col input
{
	width:190px;
}

.postWrapper
{
	float:left;
	width:675px;
	_width:655px;		
	padding-right:20px;
	_padding-right:0px;	
	color:#dfe5e1;
}


#primaryContent, #posts, .postWrapper
{
font-size:100%;
}

#posts
{
	border-right:1px solid #737f76;
	float:left;
	width:675px;
	padding-right:20px;
	color:#dfe5e1;
}

#posts ol
{
	list-style:none;
	color:#dfe5e1;
	margin-left:0px;
}


#primaryContent
{
	width:100%;
/*	border:1px solid green;*/
	padding:0px;
}

#skip, #header
{
	display:none;
}


#canvas
{
	padding:0px;
	margin:0px;	
}

.postMeta
{
	margin:3px 0 0 0;
	padding:5px 3px;
	display:block;
	border:none;
}

.postWrapper
{
	width:99.8%;
	border-bottom:1px dotted #737f76;
	margin-bottom:8px;
}

.postWrapper img.fixed
{
	width:500px;
 	border:4px solid #737f76;
	padding:0px;
	margin:0px;
}

.postWrapper img
{
 	border:4px solid #737f76;
	padding:0px;
	margin:0px 0px 4px 0px;
}

#mac_apps ul
{
	display:inline;
}

#mac_apps li 
{
	float:left;
	width:185px;
	height:180px;	
	margin:5px;
	padding:10px;
	background:#1d2f3e;	
	overflow: visible;
	list-style:none;
}

code
{
	float:left;
	display:block;
	background:#213649;	
	padding:6px;
/*	font:normal 0.95em arial,verdana;		*/
	width:675px;
	display:block;
	margin:5px 0px;
}

.post li
{
	font:normal 0.85em arial,verdana;		
	margin:0px 0px 10px 0px;
	list-style: disc;
	margin-left:1em;
}

hr,.noCss, .postMeta
{
	border:none;
}


.cat-item, #archives ul li
{
	border-bottom: 1px dotted #737f76;
	padding:3px;
}


.postMeta
{
	width:101%;
	background:#1d2f3e;	
}

#pagination
{
	clear:both;
	width:690px;
	font-family:arial,helvetica;
}

.previous a, .future a
{
	padding:3px;
}

#commentlist ol li, #commentlist li
{
	border-bottom: 1px dotted #737f76;
	padding:3px;
}

#commentlist li
{
	background:#1d2f3e;
	padding:5px 5px 0;
	line-height:22px !important;
	color:#c4c4c4;	
	width:680px;
}

cite
{
	background:#0c1924;
	padding:4px;
}

code
{
	font:normal 11px helvetica;
	line-height:18px;
	border:1px solid #737f76;
	width:640px;
	float:left;	
	height:auto;
	margin:0 0 16px 0;
}



#posts h4
{
	margin-top:28px;
}

#posts h5
{
	color:#dfe5e1;	
	font:normal 1.1em helvetica,Georgia,times;
}

#posts h6
{
	color:#dfe5e1;	
	font:normal 1.0em helvetica,Georgia,times;
}


label[for='s']
{
	display:none;
}

.postMetaContainer
{
	clear:both;	
	padding:3px 0;
}

label
{
	color:#737f76;	
}

textarea[name='comment']
{
	margin-top:5px;
}

input[rel="search"] {
	width: 71px !important;
	height:31px;
	border:none;
	background: url('/portfolio/2009/gfx/search.png') no-repeat;
}

#mobile_navigation{
  display:none;
}

#search{
margin:0 0 10px 0;
}

.amazon_book{
	border:3px solid #737F76;
	width:70px;
}

/* using google font api */
.postTitle{
	font-family: 'Cardo', helvetica,arial, serif;
	font-size:2.08em;
}

/* Mobile CSS Settings */
@media screen and (max-device-width: 480px) {
         body{
                background-image:none; /*remove background image on mobile for faster load*/
                background-color:rgb('32,41,52');
        }

        #blog_narrow_col, #quote blockquote, #global_navigation{
                display:none;
        }

        #top-bar{
                text-align: center;
        }
	#posts{
		width:100%;
		border:none;
		zoom:200%;
	}
	code{
		width:100%
	}
	#top-bar img{
		zoom:300%;
	}
	#top-bar{
		clear:both;
		margin-bottom:200px;
	}
	#sitemap{
		display:none;
	}
	#footer{
	 width:100%;
	 zoom:300%;
	}	
	#mobile_navigation{
		display:block;
		text-transform: uppercase;
		text-align: center;
		font-family: arial;
		
		width: 100%;
		zoom:300%;
	}
	#mobile_navigation ul li, #mobile_navigation li {
	list-style: none;
	display: inline;
	margin: 0px 5px 5px 5px;
	}	
	#mobile_navigation li {
	float: left;

	}	

	#mobile_navigation a:hover {
	color: white;
	border-bottom: 5px solid #737F76;
	padding: 5px 5px 1px;
	background: none;
	font-size: 70px;
	}
	#mobile_navigation a {
	margin: 5px 0;
	float: left;
	width: 181px;
	color: white;
	text-decoration: none;
	border-bottom: 1px solid #737F76;
	padding: 5px 5px 5px 5px;
	background: none;
	font-size: 1.25em;
	text-align: left;
	-webkit-transition: all 100ms linear;
	}
	

}