@import url(http://fonts.googleapis.com/css?family=Quattrocento+Sans&v1);

body {	font: .9em/134%  Palatino, "Palatino Linotype", Georgia, serif;	background:url(_img/bg-page.png) fixed;}
body, div#footer a {	color:#666}
ul#navSub li a, #secMain h1, .secMcd h1 a, #project h1   {	color: #E5E7D3}
 #slideshowCaption {font-family: "Lucida Grande", Arial, sans-serif; font-size:11px} 

h1, h2, h3, ul#thumbs li a, #contact1, ul#navSub li, #footer, .photo1 ul li a, #intro, #next, #McDonald-post cite, #sparklejet {font-family:"Quattrocento Sans", "Myriad Pro", "Lucida Grande", Arial, sans-serif;}

#header, /* #secAbout div, */ #wrapContent, #wrap {overflow:hidden;}
ul#nav li a, body,h1, h2, h3, h4, h5, h6,#sparklejet, ul.list1, ul#thumbs, .photo1 ul {margin:0}
ul#nav, ul#navSub, ul.list1, #projectSummary ul, ul#thumbs, .photo1 ul  {padding:0}
#project tt a, #project h1 {position:relative}
ul#nav li, ul#navSub li {display: inline}
#header p a, #header cite a, img, #project tt a, #project h1 span, .thumb215, ul#thumbs li a, .photo1 ul li a, a#social-facebook {display:block}
ul#nav, ul#navSub, ul.list1, .photo1 ul li {list-style-type: none} 
#header p a, #header cite a, ul#nav li a, #project tt a, a#social-facebook {text-indent:-999em}
#sparklejet a, ul#navSub li a, div#footer a, ul#thumbs li a, .photo1 ul li a, a#contact1add, .secMcd h1 a, a#social-facebook  {text-decoration:none}
ul#navSub li a:hover, .secMcd h1 a:hover {text-decoration:underline}
ul#navSub li, ul.list1 li div img, #colAbout img, .col3of3, #slideshow {float:right}
#header p a, #header cite a, ul#nav li a, #secMain h1, .col1of3, ul.list1 li img, ul.list1 li div, .cols5050-1, .cols5050-2, .thumb215, ul#thumbs li a {float:left}
#projectSummary h2, #project h1 span {
}
#contact1, #projectSummary {font-size: .9em}

#header, #secAbout div {	box-shadow:  0px 0px 5px rgba(0, 0, 0, .3); -webkit-box-shadow:  0px 0px 5px rgba(0, 0, 0, .3); -moz-box-shadow:  0px 0px 5px rgba(0, 0, 0, .3)}
	
h1, h2, h3, h4, h5, h6 {font-weight:normal;line-height:1.3}
h2, h3, h4, h5, h6 {margin:0 0 .3em 0}

a {	color:#777}
a:hover {	color:#03F}
img {border: none;}
p {margin-top: 0px}
 
.col1of3 {	width: 211px}
.col3of3 {	width: 690px}

#colAbout h2 , #colAbout h3 {color: #98461D;clear: right }
#colAbout h3 {font-size:1.3em}  
#colAbout img {	margin:0 0 3em 2em; border:1px solid #999; clear: right}
.cols5050-1	 {width:47%; margin: 0 5% 0 0}
.cols5050-2	 {width:47%}

#header {background: url(_img/bg-logoSprite.png) no-repeat; height:115px; width:970px}
#header p a {height: 100px;	width: 150px}
#header cite a {height: 36px;	width: 490px;	margin: 2px 0 0 20px;}
div#footer {	background:url(_img/bg-logoSprite.png) 0 -127px;	height:81px; 	padding:18px 24px 0 24px;	text-shadow:0 1px 0 rgba(255,255,255,.8); 	line-height:170%; 	-webkit-border-bottom-right-radius: 5px; 	-webkit-border-bottom-left-radius: 5px; 	-moz-border-radius-bottomright: 5px; 	-moz-border-radius-bottomleft: 5px; 	border-bottom-right-radius: 5px; 	border-bottom-left-radius: 5px; 	font-size: .9em}
div#footer a:first-child {text-transform:uppercase; font-size:0.9em; letter-spacing:.2em}
div#footer p a {border-bottom: 1px dotted #999}
div#footer p a:hover {color:#333; border-bottom-color: #333}
div#footer p span  {color: #A5AE83;	padding: 0 .3em;	text-shadow: 0 1px 0 rgba(255,255,255,.6)}

ul.list1 li {clear:both; margin:1em 0 2em; padding:0 0 1em 0;border-bottom:1px dotted #7E835F; overflow:auto;}
ul.list1 li div {margin:0 20px 20px 0; width:256px;}

dl.listDL1 dt {margin:0 0 0 1em}
dl.listDL1 dd {margin:-1.3em 0 2em 80px}

.list-quotes blockquote  {	margin: 1em 0 3em 0; padding: .5em .5em .5em .8em;	border-left: 3px solid #B5B7A6}
.list-quotes blockquote p {margin: 0px 0px .4em}

/* NAV */
ul#nav {margin: 75px 0 0 266px; overflow:auto; width:701px}
ul#nav li a {	height: 40px;	background-image:url(_img/nav-sprite.png)}

ul#nav li#navAbo a {background-position: 0 -10px;width:95px}
ul#nav li#navAbo a:hover, ul#nav li#navAbo a#navAboOn:hover {	background-position: 0 -60px}
ul#nav li#navAbo a#navAboOn {background-position: 0 -110px}

ul#nav li#navRes a {background-position:-95px -10px;width:112px}
ul#nav li#navRes a#navResOn {background-position:-95px -110px}
ul#nav li#navRes a:hover, ul#nav li#navRes a#navResOn:hover {background-position: -95px -60px}

ul#nav li#navCom a {background-position:-207px -10px;width:118px}
ul#nav li#navCom a#navComOn {background-position:-207px -110px}
ul#nav li#navCom a:hover, ul#nav li#navCom a#navComOn:hover  {background-position: -207px -60px}

ul#nav li#navFac a {background-position:-325px -10px;	width:200px}
ul#nav li#navFac a#navFacOn {background-position:-325px -110px}
ul#nav li#navFac a:hover,ul#nav li#navFac a#navFacOn:hover {background-position: -325px -60px}

ul#nav li#navMcd a {background-position:-525px -10px;width:176px}
ul#nav li#navMcd a#navMcdOn {background-position:-525px -110px}
ul#nav li#navMcd a:hover,ul#nav li#navMcd a#navMcdOn:hover {	background-position: -525px -60px}

ul#navSub {margin:0 14px 0 0}
ul#navSub li {margin:40px .6em 0 .6em;font-size:1em}
ul#navSub li a {text-shadow:0 0 3px rgba(0,0,0,.6)}

#next {margin:2em 0; clear:both; color: #98461D;}

#secMain, #project {height:66px;	border-left:1px solid rgba(200,200,200,.4);	border-right:1px solid rgba(200,200,200,.4);	background-image: url(_img/bg-navSub.png)}
#secMain h1 {text-shadow: 0 1px 1px rgba(0,0,0,.3); 	font-size: 2em;	padding: 25px 0 0 24px}

.photo1 {width:452px; float:right;margin:0 0 2em 22px}
.photo1 ul li a {width:452px;	height:330px;	padding:8px 0 0 8px;	font-size:2.1em;	color:#eee;	text-shadow:1px 1px 3px rgba(0,0,0,.9)}
.photo1 ul li a#res {background:url(_img/about/background-res.jpg) no-repeat; opacity:0.85}
.photo1 ul li a#com {background:url(_img/about/background-com.jpg) no-repeat; opacity:0.85}
.photo1 ul li a#team {background:url(_img/about/Rynerson-OBrien-architects.jpg); opacity:0.9}
.photo1 ul li a#res:hover {color:#39F;opacity:1;}
.photo1 ul li a#com:hover {color:#39F;opacity:1;}
.photo1 ul li a#team:hover {color:#39F;opacity:1;}
	
#project tt a {margin:0; width:111px; height:26px; background-image:url(_img/next-project.png);  left:20px; top:20px;}
#project h1 {text-shadow: 1px 1px 1px rgba(0,0,0,.5); font-size: 1.4em; left: 260px;top:-12px}
#project h1 span {font-size:.7em; font-family:Palatino, "Palatino Linotype", Georgia, serif;}
#projectSummary h2 {font-size:1.4em}
#projectSummary ul {margin:1em 0 1em .4em}
#projectSummary ul li {line-height:1.20; padding:0 0 .5em 0;margin:0 0 0 1em}


#remodel-shingle-sanrafael1 {background:url(_img/res/remodel-shingle-sanrafael1.jpg)}
#remodel-shingle-sanrafael2 {background:url(_img/res/remodel-shingle-sanrafael2.jpg)}
#new-country-diablo {background:url(_img/res/new-country-diablo.jpg)}
#new-craftsman-oakland {background:url(_img/res/new-craftsman-oakland.jpg)}
#new-artsandcrafts-oakland {background:url(_img/res/new-artsandcrafts-oakland.jpg)}
#new-spanish-revival-oakland {background:url(_img/res/new-spanish-revival-oakland.jpg)}
#remodel-queenanne-sanfrancisco {background: url(_img/res/remodel-queenanne-sanfrancisco.jpg)}
#remodel-victorian-sanfrancisco {background:url(_img/res/remodel-victorian-sanfrancisco.jpg)}
#remodel-edwardian-sanfrancisco {background:url(_img/res/remodel-edwardian-sanfrancisco.jpg)}
#remodel-craftsman-albany {background:url(_img/res/remodel-craftsman-albany.jpg)}
#remodel-neoclassical-sunol {background:url(_img/res/remodel-neoclassical-sunol.jpg)}
#remodel-craftsman-larkspur {background:url(_img/res/remodel-craftsman-larkspur.jpg)}
#restoration-italiante-sanfrancisco {background: url(_img/facades/italianate-restoration-sanfrancisco.jpg)}
#remodel-craftsman-berkeley {background:url(_img/res/remodel-craftsman-berkeley.jpg)}
#restoration-queenanne-sanfrancisco {background: url(_img/facades/queen-anne-restoration-sanfrancisco.jpg)}
#kitchen-berkeley {background:url(_img/res/kitchen-berkeley.jpg)}
#kitchen-sanfrancisco {background:url(_img/res/kitchen-sanfrancisco.jpg)}
#mcdonald-sm {background:url(_img/res/mcdonald-sm.jpg)}
#mcdonald-lg {background:url(_img/res/mcdonald-lg.jpg)}
 
#bass-studios {background:url(_img/com/bass-studios.jpg)}
#smith-ranch-art-studios {background:url(_img/com/smith-ranch-art-studios.jpg)}
#office-improvement {background: url(_img/com/office-improvement.jpg)}
#retail-bugatti {background: url(_img/com/retail-bugatti.jpg)}
#retail-cs-ilikai {background:url(_img/com/retail-cs-ilikai.jpg); margin-right:22px}
#retail-cs-outlet {background:url(_img/com/retail-cs-outlet.jpg)}
#retail-cs-waikiki {background:url(_img/com/retail-cs-waikiki.jpg)}
#retail-cs-alamoana {background:url(_img/com/retail-cs-alamoana.jpg)}
#retail-cs-bayview {background:url(_img/com/retail-cs-bayview.jpg)}

#fillmore1-sanfrancisco {background:url(_img/com/fillmore1-sanfrancisco.jpg)}
#storefront-18th-sanfrancisco {background: url(_img/com/storefront-18th-sanfrancisco.jpg)}
#fillmore2-sanfrancisco {background:url(_img/com/fillmore2-sanfrancisco.jpg); width:690px; height:23px;	padding:309px 0 0 0}
#home-facade {background:url(_img/home/home-facade.jpg)}

#new-craftsman-oakland, #new-artsandcrafts-oakland, #bass-studios, #smith-ranch-art-studios, #office-improvement, #retail-bugatti, #fillmore1-sanfrancisco, #storefront-18th-sanfrancisco, #retail-cs-outlet, #retail-cs-ilikai, #mcdonald-sm, #home-facade, #mcdonald-lg, #restoration-italiante-sanfrancisco, #restoration-queenanne-sanfrancisco, #remodel-edwardian-sanfrancisco, #remodel-craftsman-berkeley {padding:309px 0 0 0}

#remodel-edwardian-sanfrancisco, #new-craftsman-oakland, #kitchen-berkeley, #smith-ranch-art-studios, #retail-bugatti,  #fillmore1-sanfrancisco, #office-improvement, #mcdonald-lg, #new-artsandcrafts-oakland, #restoration-italiante-sanfrancisco {width:452px; margin:0 22px 0 0}

#bass-studios, #storefront-18th-sanfrancisco, #retail-cs-outlet, #retail-cs-ilikai, #home-facade, #restoration-queenanne-sanfrancisco, #remodel-craftsman-berkeley {width:215px; height:23px}

#kitchen-berkeley {padding:142px 0 0 0}

ul#thumbs {list-style-type:none;	text-transform: uppercase;	font-size: .7em}
ul#thumbs li a {background-repeat:no-repeat}
.thumb215 {width:215px;	margin:0 22px 0 0;	height:25px;	padding:142px 0 0 0}
.thumb215b {width:215px; margin:0; height:25px; padding:142px 0 0 0}

#McDonald-post cite {font-style:normal; font-size:.95em; display:block}
#McDonald-post img {margin:0 0 4px 0}

.secRes {background: 0px -66px}
.secCom {background: 0px -132px}
.secFac {background: 0px -198px}
.secMcd {	background: 0px -264px}

#slideshow {width: 690px}


a#social-facebook {background:url(_img/social.png) no-repeat 2px -24px; height:28px; width:28px; float:right; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; margin:4px; -webkit-transition: background-color 0.6s linear;}
a:hover#social-facebook {background:url(_img/social.png) no-repeat 2px -24px #fff; box-shadow:  0px 0px 3px rgba(0, 0, 0, .2); -webkit-box-shadow:  0px 0px 3px rgba(0, 0, 0, .2); -moz-box-shadow:  0px 0px 3px rgba(0, 0, 0, .2)}
	
#SimpleThumbviewJS1308181121725 {width:690px;height:560px}
#ThumbnailSlideJS1308186530014 {width:690px;height:560px}
#sparklejet a{
	color: #777;
	float: right;
	border-bottom: 1px solid #bbb;
	text-shadow: 0 1px 0 rgba(255,255,255,.6);
}
#sparklejet a:hover {border-bottom:1px solid #777; color:#333;}
#wrap {margin: auto; width: 970px}
#wrapContent {clear:both; padding: 24px; 	background: #EDEEE0 url(_img/bg-content.png)}
.clear {clear: both}

