body { background: #ccc; font-family: "helvetica neue", helvetica, verdana, sans-serif; font-size: 13px; line-height: 1.5; }

#visuals {  width: 100%; height: 100%; overflow: hidden; position: fixed; z-index: 1; }
#visuals img { width: 100%; }
#wrapper { position: relative; z-index: 2; }

/* `Multi-site stuff */
#multi_site_navigation { 
	background: #000;
	background: rgba(0,0,0,.7);
	font-family: "helvetica neue", "lucida grande", verdana, sans-serif;
	height: 20px;
	left: 0;
	position: absolute;
	width: 100%;
	padding: 0 0 10px;
}
#db_logo {
	float: left;
	width: 120px;
	display: block;
	margin-top: 5px;
	font-size: 14px;
}
#multi_site_navigation a {
	color: #efefef;
	color: rgba(255,255,255,.6);
	font-weight: normal;
	text-decoration: none;
}
#multi_site_navigation a:hover, #multi_site_navigation a.active {
	color: #fff;
}
#multi_site_navigation ul {
	float: right;
}
#multi_site_navigation li {
	float: left;
	overflow: visible;
	margin-right: 10px;
}
#multi_site_navigation li a {
	display: block;
	padding: 5px 20px 0 10px;
	height: 25px;
}
#multi_site_navigation li a.active, #multi_site_navigation li a:hover {
	background: #000;
	background: rgba(0,0,0,.3);
}
#multi_site_navigation li ul {
	position: absolute;
	margin-left: -9999px;
	text-indent: -9999px;
}
#multi_site_navigation li ul li{
	float: left;
	clear: both;
}
#multi_site_navigation:hover ul li ul {
	margin-left: 0;
	text-indent: 0;
	
	width: 200px;
	z-index: 10;
}
#multi_site_navigation:hover ul li ul li a {
	width: 130px;
}
#multi_site_navigation ul li ul li a:hover {
	background: #000;
	color: #fff;
}
#multi_site_navigation ul li ul li a, #multi_site_navigation ul li ul li a.active  {
	background: #000;
	background: rgba(0,0,0,.8);
}
/* ---------------- */


/* `Branding and Navigation */

#branding { 
	float: left; 
	color: #fff; 
	padding: 10px 0; 
	font-size: 14px; 
	margin-top: 10px;
}
#branding a { color: #999;  }
#branding a:hover, #branding a.active { color: #000; }
#logo { float: left; }
#navigation { float: right; }
#navigation li, #secondary_navigation li { 
	float: left; 
	margin-right: 20px; 
}
#secondary_navigation li a {
	display: block;
	padding: 0 10px;
}
#secondary_navigation { 
	float: right; 
	clear: both;  
	margin-top: 30px;
}

/* End Branding and Navigation */

/* `Content Styles */

#content { float: left; clear: both; }

#secondary_content { float: left; clear: both; padding: 20px 0 10px; background: #787878 url(/_imgs/gray-texture.png) repeat top; color: #d2d2d2; color: rgba(255,255,255,.7); }
.glass #secondary_content { background: #333; background: rgba(0,0,0,.6); }
#secondary_content a { color: #C7C7C7; color: rgba(255,255,255,.8); }
#secondary_content a:hover { color: #fff; }
#secondary_content h2 a { color: #fff; }

#secondary_content #about_david, #secondary_content #recent_articles, #secondary_content #latest_photos { height: 243px; border-bottom: 1px dotted #9d9d9d; padding-bottom: 10px; margin-bottom: 15px; }
#secondary_content .grid_12 { border-top: 1px dotted #9d9d9d; padding-top: 10px; }

/* End Content Styles */

/* `Typography */

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

h1 { margin-left: 10px; }
h2 { text-transform: uppercase; font-size: 18px; margin-left: 10px; }
h3 { font-size: 16px; margin-left: 10px;}
a { text-decoration: none; }
p { margin: 10px; }
#content h1 { font-size: 22px; margin-top: 20px; }
#content p { margin-bottom: 20px; }
#content ul, #secondary_content ul { 
	margin: 10px;  
}
#content ul.bulleted li, #secondary_content ul.bulleted li {
	padding-left: 15px;
	background: url(/_imgs/elements/version2/angle_bullet.png) no-repeat -2px 2px;
}
#content ul.invert.bulleted li, #secondary_content ul.invert.bulleted li {
	padding-left: 15px;
	background: url(/_imgs/elements/version2/angle_bullet_white.png) no-repeat -2px 2px;
}

.focal_text { font-size: 14px; }

/* End Typography */

/* `Classes */

.full, .width_full { width: 100%; }
.half, .width_half { width: 50%; }
.quarter, .width_quarter { width: 25%; float: left; }
.two_thirds, .width_two_thirds {
	width: 66%;
}
.one_third, .width_one_third {
	width: 33%;
}
.float_right { float: right; }
.float_left { float: left; }

.gallery { float: left; width: 100%; }
.gallery li { float: left; margin: 5px 10px 5px 0; }
.gallery li a img { width: 86px; height: 86px; border: 1px solid #fff; border: 1px solid rgba(255,255,255,.6); }

#content .gallery { margin-top: 20px; }
#content .gallery li a img { width: 65px; height: 65px; }

.purchase { } 

.ad_space { display: block; width: 282px; margin: 5px 0 0 10px; height: 88px; background: #fff; color: #333333; border: 1px solid rgba(255,255,255,.6); }

.focalImageHorizontal { width: 440px; border: 1px solid #fff; border: 1px solid rgba(255,255,255,.4); }
.focalImageVertical { width: 440px; border: 1px solid #fff; border: 1px solid rgba(255,255,255,.4); }



/* End Classes */

#comment_space { }
#comment_space ul { width: 300px; }
#comment_space ul li { margin-bottom: 10px; }
#comment_space ul li input { width: 100%; }
#comment_space p { margin-left: 10px; width: 600px; }
#comment_space p textarea { width: 100%; height: 128px; }

#connected {
	float: left;
	margin-top: 20px; 
	width: 100%;
}
#connected ul li {
	float: left;
	width: 45px;
	margin-right: 10px;
	height: 30px;
}
#connected ul li img {
	width: 45px;
}


/* Specific Page Styles */

#front { background: #3E3E3E url(/_imgs/elements/version2/dark-gray-texture.png) repeat top; }
#front #container { }
#front #content { height: 558px; width: 100%; background: #E7C04A url(/_imgs/elements/version2/dino.png) no-repeat right top; border: none; }
#front .focal_text { margin-top: 270px;  }

#about { background: #3E3E3E url(/_imgs/elements/version2/dark-gray-texture.png) repeat top; }
#about #visuals img { margin-top: -140px;}
#about #content { height: 620px;  }
#about #content .focal_text { margin-top: 60px; background: #000; background: rgba(0,0,0,.6); margin-left: 0; padding: 10px;}
#about #content h1 { margin-top: 20px; color: #fff; }
#about #content p { color: #c9c9c9; }
#about #content a { color: #fff; }

#art { background: #fff url(/_imgs/elements/version2/white-texture.jpg) repeat; }
#art #content {  color: #333; padding-top: 60px;}
#art #content h1 { font-size: 6em; font-family: times, "times new roman", georgia, serif;  margin-top: -5px; width: 320px; margin-bottom: 0px; }
#art #content p.emphasized, #art #content h1 + p + p { font-size: 1.5em; font-family: times, "times new roman", georgia, serif; }

#art .focal_art { overflow: hidden; width: 918px; display: block; margin-left: 10px; margin-top: 20px; height: 200px; border: 1px solid #333;}
#art .focal_art img { width: 918px; }
#art #content h2 {  }
#art hr { width: 920px; margin-left: 10px; margin-bottom: 20px; opacity: .5;}
#art #content a { color: #000; }

#contact { background: #3E3E3E url(/_imgs/dark-gray-texture.png) repeat top; }
#contact #content { background: #fff; color: #333; padding-top: 60px; padding-bottom: 40px; }
#contact #content a { color: #000; } 
#contact #content h1 { float:left; font-size: 4em; font-family: times, "times new roman", georgia, serif;  margin-top: -5px; width: 320px; margin-bottom: 5px; }
#contact form { }
#contact form label { display: block; color: #000; margin-top: 15px; }
#contact form input, #contact form select { width: 240px; margin-bottom: 15px; }
#contact form textarea { width: 540px; height: 180px;}
.mailz { margin-top: 1.5em; float: left; }

#design { background: #3E3E3E url(/_imgs/elements/version2/dark-gray-texture.png) repeat top; }
#design #visuals { }
#design #content { padding-top: 90px; min-height: 560px; color: #c9c9c9; color: rgba(255,255,255,.8);  }
#design #content h1 { color: #fff; font-size: 6em; font-family: times, "times new roman", georgia, serif;  margin-top: -5px;}
#design #content h1 + p { font-size: 2em; font-family: times, "times new roman", georgia, serif; }
#design #content p + p, #design #content p + p + p { float: left; width: 450px; }
#design #content a { color: #fff; }
#design #content .focal_text { background: #333; background: rgba(0,0,0,.6); margin: 0; padding: 10px 10px 20px; }

#feeds { background: #fff url(/_imgs/elements/version2/white-texture.jpg) repeat; }
#feeds #content { padding: 50px 0; float: left; width: 100%; }
#feeds #content h1 {  font-size: 6em;   }
#feeds #content h1, #feeds #content p {font-family: times, "times new roman", georgia, serif;  margin-top: -5px; }
#feeds #content a { color: #000;  }
#feeds #content p { font-size: 1.5em; border-bottom: 1px dotted #ddd; padding-bottom: 10px; }
#feeds #content div div { float: left; width: 320px; }

.photography { background: #fff; }
.photography #content { padding-top: 10px;}
.photography #content a { color: #000; }
.purchase { position: absolute; display: block; width: 30px; height: 300px; margin-left: -50px; margin-top: -347px; background: url(/_imgs/purchase-link.png) no-repeat;}
.purchase span { margin-left: -9999px; text-indent: -9999px; }

#sitemap {
	background: #fff url(/_imgs/elements/version2/white-texture.jpg) repeat;
}
#sitemap #content {
	padding: 50px 0;
	float: left; 
	width: 100%;
}
#sitemap #content h1 {
	font-size: 6em;
}
#sitemap #content h1, #sitemap #content p {
	font-family: times, "times new roman", georgia, serif;  
	margin-top: -5px; 
}
#sitemap #content a {
	color: #000;
}
#sitemap #contnet p {
	font-size: 1.5em;
	border-bottom: 1px dotted #ddd;
	padding-bottom: 10px;
}

#writings { background: #fff url(/_imgs/elements/version2/white-texture.jpg) repeat; }
#writings #content h1 { font-size: 6em; font-family: times, "times new roman", georgia, serif;  margin-top: 50px; }
#writings #content {  }
#writings #content .excerpt + .excerpt { border-top: 1px dotted #333; padding-top: 15px;  }
#writings #content h2 {  }
#writings #content h2 span { font-size: 12px;}
#writings #content .entry-content img { float: left; width: 120px; height: 80px; margin-left: 10px; margin-right: 20px; border: 1px solid #333; }
#writings #content p { color: #545454;  max-width: 720px;}
#writings #content a { color: #000; }


.recent #content, .archives #content { padding-top: 50px; }
.recent #content .archives-link { margin-top: -10px; }

.archives { background: #fff url(/_imgs/elements/version2/white-texture.jpg) repeat;}
.archives #content h1 { font-size: 6em; font-family: times, "times new roman", georgia, serif;  margin-top: -5px; }
.archives .year { font-size: 2em; font-family: georgia, serif; margin-bottom: 10px; }
.archives .month { clear: both; font-size: 1.5em;  font-family: times, "times new roman", georgia, serif; }
.archives .date { float: left; clear: both; text-align: right;  width: 120px; color: #333;}
.archives .article-title { float: left; margin-top: 0; color: #000;}
.archives #content a { color: #000; }

.standard_article { background: #fff; }
.standard_article #content { padding-top: 50px; }
#writings.standard_article #content h1 { font-size: 3em; }
.standard_article #content h1 + p + p { font-size: 18px; font-family: times, "times new roman", georgia, serif; }
.standard_article img { max-width: 100%; }
.standard_article a { color: #000; }
.standard_article #content p a { border-bottom: 1px solid #000;}


#resume { background: #3E3E3E url(/_imgs/elements/version2/dark-gray-texture.png) repeat top; }
#resume #content { background: #fff; color: #333; }
#resume #content a { color: #000; }
#resume #content ul { margin-left: 30px; list-style: disc; }
#resume .section { float: left; width: 100%; padding: 10px 0;  }
#resume .section + .section { border-top: 1px dotted #333;  }
#resume .section div { float: left; width: 50%; margin-top: 10px; margin-bottom: 0px; }


/* End Specific Page Styles */

.current_comments + .current_comments { border-top: none; margin-top: 0; padding-top: 0;}

.current_comments { 
	float: left; 
	width: 960px; 
	margin: 15px 0; 
	padding: 15px 0; 
	border-top: 1px dotted #fff; 
	border-top: 1px dotted rgba(255,255,255,.3); 
	border-bottom: 1px dotted #fff; 
	border-bottom: 1px dotted rgba(255,255,255,.3); 
}
.current_comments .comment { 
	float: left;  
	background: rgba(0,0,0,.05); 
	padding: 10px 0; 
	margin: 10px 20px 10px 0; 
	width: 720px; 
}
.current_comments .comment .gravatar { 
	border: 1px solid #333; 
	float: left; 
	margin-right: 20px; 
	margin-left: 8px;
}
.current_comments .comment.author { 
	background: #333; 
	color: #ccc; 
}
.current_comments .comment.author a { 
	color: #fff !important; 
}
.current_comments .comment h3 span { 
	float: right; 
	margin-right: 10px;  
}
.current_comments .comment.author .gravatar { 
	border: 1px solid #fff; 
}
.current_comments .comment_title { 
	margin-bottom: 10px; 
}
.current_comments .comment_content { 
	float: left; 
	width: 620px; 
	margin-left: -10px;
}

.connect-to-social { padding-top: 10px; } 
.standard_article .connect-to-social, .photography .connect-to-social, #art .connect-to-social { border-top: 1px dotted #333; border-bottom: 1px dotted #333; }
#txpCommentInputForm { padding-top: 10px;  }

/* ------- Sitemap styles -------------------- */

#sitemap-canvas {
	border: 1px solid #333;
}

#sitemap-legend li {
	font-size: 16px;
	margin-bottom: 10px;
}
#sitemap-legend li ul {
	margin-left: 0;
}
#sitemap-legend li ul li {
	font-size: 12px;
	margin-left: 0;
}

#map_overlay a { 
	color: #333; 
	text-decoration: none;
}
.central_station { 
	font-size: 20px; 
}
.primary_station { 
	font-size: 13px; 
	font-weight: bold;
}
.sub_station { 
	font-size: 13px; 
	width: 420px; 
}
.legend_line {
	float: left; 
	clear: both;
	width: 240px;
	margin: 0 10px 0 20px;
}
.legend_color {
	float: left;
	height: 10px;
	margin: 5px 10px 0 0;
	width: 10px;	
}
.legend_text {
	float: left;
	margin-top: 0;
}

.mute {
	opacity: .5;
}

/* ------- Daily Photo Styles ------- */

#daily-photos h1 { 
	font-size: 6em; 
	font-family: times, "times new roman", georgia, serif;  
	margin-top: -5px; 
}

.daily-photo {
	float: left;
	margin-bottom: 10px;
	padding: 10px;
	width: 110px;
}

.daily-photo:hover {
	background: rgba(0,0,0,0.05);
}

.daily-photo img {
	border: 1px solid #fff;
	width: 108px;
}

#daily-photos #content h1 + p {
	font-size: 2em; 
	font-family: times, "times new roman", georgia, serif;
}
#daily-photos .daily-photo h3, #daily-photos .daily-photo p {
	margin-left: 0;
}

/* ------- Individual Article Styles --------- */

.texas { color: #505050; background: #F0EEEA url(http://www.davidnbrooks.com/_imgs/elements/articles/texas/large-map.jpg) no-repeat; } 
.texas #focal-concept { height: 360px; width: 954px; background: #C2DD9E url(http://www.davidnbrooks.com/_imgs/elements/articles/texas/twitter-map.jpg) no-repeat right top; border: 2px solid #333; padding-top: 1.5em; box-shadow: 0 0 5px rgba(0,0,0,.15); -webkit-box-shadow : 0 0 5px rgba(0,0,0,.15); }
.texas #content h2 { font-size: 1.25em; margin-bottom: 10px; color: #000; }
.texas #content #focal-concept p span { color: #000; }
.texas #content #focal-concept p { margin-bottom: 1em; }
.texas #content h1 a, .texas #content a { color: #000; }

.texas #content .trip-photos { list-style: none; margin-left: 0; float: left; clear: both; }
.texas #content .trip-photos li { margin-left: 0; width: 228px; border: 1px solid #3C3C3D; background: #3C3C3D; box-shadow: 0 0 5px rgba(0,0,0,.15); -webkit-box-shadow : 0 0 5px rgba(0,0,0,.15); }
.texas #content .trip-photos li a, .texas #content .trip-photos li a img { border: none; }

.texas #content #article-content p { text-align: left; color: #191B19; background: #EBE7C3; background: rgba(235,231,195,.8); margin-left: 0; padding: 10px; margin-right: 10px; width: 208px; border: 1px solid #D5CC95; box-shadow: 0 0 5px rgba(0,0,0,.15); -webkit-box-shadow : 0 0 5px rgba(0,0,0,.15); }
.texas #content #article-content p.alt { background: #D1C28C; background: rgba(209,194,140,.8); }

.texas #content h1 { float: left; background: rgba(255,255,255,.5); margin: 20px 0 10px 0; padding-left: 10px; padding-top: 10px; width: 470px; font-family: times, "times new roman", georgia, serif; }
.texas #content p.published { float: left; background: rgba(255,255,255,.5); margin-left: 0; padding-right: 10px; padding-left: 10px; margin-top: 20px; }

.texas #trip-parts { list-style: none; }
.texas #trip-parts li { position: absolute; display: block; width: 10px; height: 13px; background: url(http://www.davidnbrooks.com/_imgs/elements/articles/texas/twitter-t.png) no-repeat; }
.texas #trip-parts li a { display: block; color: #fff; width: 240px; padding: 10px; border-bottom: none; text-decoration: none; }
.texas #trip-parts li:hover a { margin-left: -260px; margin-top: -30px; text-indent: 0; z-index: 10; }
.texas #trip-parts li a{ position: absolute; margin-left: -9999px; text-indent: -9999px; }

.texas #trip-gallery { margin-left: 0; width: 480px; }
.texas #trip-gallery li { float: left; margin: 10px; }
.texas #trip-gallery li a { border-bottom: none; }
.texas #trip-gallery li a img { background: #666; border: 2px solid #666; width: 96px; height: 96px; }

.texas .twitter a { background: #EBE7C3; background: rgba(235,231,195,.8); border: 1px solid #D5CC95; box-shadow: 0 0 5px rgba(0,0,0,.15); -webkit-box-shadow : 0 0 5px rgba(0,0,0,.15); }
.texas .flickr { }

.texas .connect-to-social { float: left; clear: both; width: 720px; }

.texas .message { float: left; clear: both; margin-bottom: 1em; }
.texas .timestamp { float: left; clear: both; color: rgba(0,0,0,.6); }

.texas #update1 { margin-left: 880px; margin-top: 55px; }
.texas #update2 { margin-left: 880px; margin-top: 68px; }
.texas #update3 { margin-left: 875px; margin-top: 85px; }
.texas #update4 { margin-left: 890px; margin-top: 90px; }
.texas #update5 { margin-left: 870px; margin-top: 135px; }
.texas #update6 { margin-left: 840px; margin-top: 215px; }
.texas #update7 { margin-left: 800px; margin-top: 265px; }
.texas #update8 { margin-left: 800px; margin-top: 285px; }
.texas #update9 { margin-left: 780px; margin-top: 275px; }
.texas #update10 { margin-left: 780px; margin-top: 260px; }
.texas #update11 { margin-left: 780px; margin-top: 295px; }
.texas #update12 { margin-left: 760px; margin-top: 275px; }
.texas #update13 { margin-left: 700px; margin-top: 265px; }
.texas #update14 { margin-left: 680px; margin-top: 275px; }
.texas #update15 { margin-left: 655px; margin-top: 258px; }
.texas #update16 { margin-left: 650px; margin-top: 275px; }

/* -- State Fair --- */

.state-fair-2009 { color: #f0efef; background: #050505; }
.state-fair-2009 #content { background: #000; background: rgba(0,0,0,.6); }
.state-fair-2009 #content h1 { padding-top: 10px; color: #fff; }
.state-fair-2009 #content h1 a { color: #fff; }
.state-fair-2009 #content h2  { color: #fff; }
.state-fair-2009 #content h2 a { color: #fff; }
.state-fair-2009 #content a { color: #fff; }
.state-fair-2009 #content .article { width: 100%; }
.state-fair-2009 #content p { width: 645px; float: left; margin-left: 15px; }
.state-fair-2009 #content p a { border-bottom: 1px solid #fff; }
.state-fair-2009 #content p.published { margin-bottom: 0; }

.state-fair-2009 #content img { border: 5px solid #fff; margin-left: 5px; }

.state-fair-2009 .actual_content { float: left; width: 660px; }
.state-fair-2009 .content_gallery { float: left; width: 290px; }
.state-fair-2009 .gallery { width: 100%; float: left; margin-top: 0; margin-left: 0px; margin-right: 0; }
.state-fair-2009 .gallery a { }

.state-fair-2009 .focalImageFull { float: left; margin-left: 20px; width: 800px;margin-right: 10px; margin-bottom: 1.5em; }

/* ---- Motion in Final Cut ---- */

.fc-motion { background: #fff; }
.fc-motion #content a { color: #000; }
.fc-motion .connect-to-social { float: left; clear: both; width: 460px; margin-left: 480px; margin-top: 20px;  }

/* ---- Black Friday ----------- */

.black-friday {
	background: #333;
	font-family: "lucida grande", "helvetica neue", verdana, sans-serif;
}
.black-friday #content #article {
	clear: both;
	float: left; 
	width: 100%;
}
.black-friday #content h1 {
	font-size: 64px;
	color: #fff;
	text-transform: uppercase;
	margin-left: 20px;
}
.black-friday #content h1 a {
	color: #fff;
	text-decoration: none;
}
.black-friday .published {
	margin-left: 20px;
}
.black-friday #content {
	color: #fff;
}
.black-friday #content #article {
	border-bottom: 1px solid #ccc;
	margin-bottom: 20px;
}
.black-friday #article h2 {
	float: left; 
	clear: both;
	color: #6EC2C5;
	font-size: 32px;
	margin-left: 20px;
	margin-top: 20px;
}
.black-friday #article p {
	float: left;
	font-size: 16px;
	line-height: 1.6;
	margin-left: 20px;
	margin-right: 10px;
	width: 285px;
}
.black-friday #article p strong {
	color: #F4B22C;
	display: block;
	font-weight: normal;
	width: 100%;
}
.black-friday #content #article .imagery {
	clear: both;
	margin-left: 0px;
	width: 960px;
}
.black-friday #content #article .imagery .attribution {
	clear: both;
	float: right;
	margin-right: 10px;
	margin-top: 10px;
	text-align: right;
}
.black-friday #content h1 + p + p + p{
	clear: both;
}
.black-friday #article h2 + p {
	clear: both;
}
.black-friday #content h1 + p + p {
	clear: both;
	margin-left: 0;
}
.black-friday #content img {
	width: 936px;
	border: 2px solid #ccc;
	margin-left: 10px;
}
.black-friday #content a {
	color: #fff;
	text-decoration: underline;
}
.black-friday #content .conclusion {
	width: 940px;
}