/* Stylesheet for R&R Coffee. (http://www.rnrcoffee.com)

 * Last modified: Jan 29, 2008

 */

 

 * 					{margin: 0;

 						 padding: 0;}

						 

body				{background:  url('pics/background.jpg'); 

						 font: #fff; 

						 margin: 0 auto;

						 min-width: 640px; 

						 max-width: 1024px;

						 width: 80%;

					
}
div#content 		{background: #fff;}
				 
div#navigation {background: url('pics/navtop.jpg') transparent no-repeat top left; padding-top: 3em;}

div#fpfeed {background: #ccc; display: block; width: 330px; float: right; clear: right; border: 1px solid rgb(104,30,19); padding: 0; margin: .5em; margin-right: 1em; overflow: none;}

div#fpfeed h4, div#fpfeed p.base {display: block; text-align:center; font-variant:small-caps; font: 1em Georgia, Times, serif; background: rgb(104,30,19); color: #fff; padding: .2em;}
div#fpfeed p {font: .7em Georgia, Times, serif; text-indent: 0;}
div#fpfeed p a {font: 1.3em Georgia, Times, serif; font-weight: bold;}
div#fpfeed p a.more {font-size: .8em;}
div#fpfeed p.base {font: .6em Georgia, Times, serif; font-weight: bold;}
div#fpfeed p.base a {color: #000;}
div#fpfeed ol {text-align:center; line-height: 1;}

div#fpfeed ol span.poston {font: 1em Georgia, Times, serif; font-style: italic; color: #333;}

						 

a						 {color: rgb(104,30,19); background: transparent; text-decoration: none; font-weight: bold;}

a:hover			 {color: #fff; background: rgb(104,30,19); text-decoration: underline; font-weight: bold;}



h1					{height: 125px; overflow: hidden; text-indent: -5000px; background: url('pics/topangle.jpg')  no-repeat top left;}



h2#where, h2#when, h2#who, h2#menu, h2#java, h2#baked, h2#special {height: 50px; overflow: hidden; text-indent: -5000px; margin-top: 1em;}

h2#where		{background: url('pics/where.jpg') no-repeat top left;}

h2#when			{background: url('pics/when.jpg') no-repeat top left;}

h2#who			{background: url('pics/who.jpg') no-repeat top left;}

h2#menu			{background: url('pics/menu.jpg') no-repeat top left;}

h2#java			{background: url('pics/java.jpg') no-repeat top left;}

h2#baked		{background: url('pics/baked.jpg') no-repeat top left;}

h2#special	{background: url('pics/special.jpg') no-repeat top left;}

h3#bkfst, h3#lunch, h3#coffee, h3#single, h3#blends, h3#faq, h3#pastries {height: 50px; overflow: hidden; text-indent: -5000px; margin-top: 1em;}



h3#bkfst		{background: url('pics/bkfst.jpg') no-repeat top left;}

h3#lunch		{background: url('pics/lunch.jpg') no-repeat top left;}

h3#coffee		{background: url('pics/coffee.jpg') no-repeat top left;}

h3#single		{background: url('pics/single.jpg') no-repeat top left;}

h3#blends		{background: url('pics/blends.jpg') no-repeat top left;}

h3#faq		{background: url('pics/faq.jpg') no-repeat top left;}

h3#pastries {background: url('pics/pastries.jpg') no-repeat top left;}



h4#sand, h4#other, h4#coffeenow, h4#espresso, h4#snazzy, h4#cold, h4#non, h4#bread, h4#cakes, h4#four, h4#snacks, h4#soup {height: 33px; overflow: hidden; text-indent: -5000px; margin-top: .5em; height: 50px;}

h4#sand	    {background: url('pics/sand.jpg') no-repeat top left;}

h4#other		{background: url('pics/other.jpg') no-repeat top left;}

h4#coffeenow {background: url('pics/coffeenow.jpg') no-repeat top left;}

h4#espresso {background: url('pics/espresso.jpg') no-repeat top left;}

h4#snazzy		{background: url('pics/snazzy.jpg') no-repeat top left;}

h4#cold			{background: url('pics/cold.jpg') no-repeat top left;}

h4#non			{background: url('pics/non.jpg') no-repeat top left;}

h4#bread		{background: url('pics/breads.jpg') no-repeat top left;}

h4#cakes		{background: url('pics/cakes.jpg') no-repeat top left;}

h4#four			{background: url('pics/495.jpg') no-repeat top left;}

h4#snacks		{background: url('pics/snacks.jpg') no-repeat top left;}

h4#soup			{background: url('pics/soup.jpg') no-repeat top left;}



div#text, div#navigation {overflow: hidden; display: inline-block;  float: left;}

div#text	{width: 81%; margin-left: 17%;  margin-top: .5em; /*display: inline;*/ background: transparent; text-align: left;}



div#navigation {width: 17%; margin-left: -100%; /*display: inline;*/}



#navigation ul li {display: block; padding-right: .5em; background: rgb(86,86,86); margin: .2em 0;}

#navigation ul li a {display: block; width: 99%; text-align: right; background: transparent; color: #fff; font-weight: bold; line-height: 2; padding-right: 1em; border: 1px solid #333;}

#navigation ul li a.here {background: #fff; color: rgb(86,86,86); text-align: left; border: 1px solid #fff;}

#navigation ul li a:hover {background: #fff; color: rgb(86,86,86); text-align: left; text-decoration: none; border: 1px solid rgb(104,30,19); padding-left: .5em;}

#navigation ul li a.here:hover {border: 1px solid rgb(86,86,86);}

div#text {padding-left: 1em ; margin-top: -1em;}





dt		{display: block; width: 90%; background: rgb(86,86,86); color: #fff; font-weight: bold; padding: .3em; margin-left: 2em;}

dd	{display: block; margin-left: 3em; width: 90%; font: 95% Georia, Times, serif; color: #000; border: 1px solid rgb(86,86,86); padding: .1em;}

div#disclaim  {display: block; width: 100%; height: 145px; position: relative; clear: both; background: url('pics/silhouette.jpg') no-repeat top left rgb(86,86,86); text-align: right; font: 80% Georgia, Times, serif; color: #fff;}

div#disclaim p {padding-top: 120px;}



p						{font: 90% Georgia, Times, serif; color: #333; padding: .5em .5em .5em 2em; line-height: 1.5; text-indent: 1.5em;}
p.navigation			{font: 70% Georgia, Times, serif; color: #333; padding: 1em; line-height: 1; text-indent: 0; font-variant: small-caps; text-align: center;}



#text ul		{list-style-type: none; margin: 0; padding: 0 0 0 5em;}

#text li 		{text-align: center; font-variant: small-caps; display: block; background: rgb(86,86,86); width: 25em; height: auto; color: #fff; padding: 0 1em;}



img.rightf	{float: right; margin-left: 1em; padding-right: .5em;}

img.leftf	{float: left; margin-right: 1em;}



table			{margin: 0 2em;}

td, td.price, th		{font-weight: bold; font: 90% Georgia, Times, serif; font-variant: small-caps; border-bottom: 1px solid #333; padding-top: .3em;}

td.price, th	{text-align: center;}

span.descript  {font: 80% Georgia, Times, Serif; font-weight: normal; color: #333;}

span.decaf		 {color: rgb(0,240,0);}

span.date		{font: 120% Arial, Helvetica, sans-serif; font-variant: small-caps; font-weight: bold; background: rgb(104,30,19); color: #fff; display: block; float: left; width: 4em; margin: 0 1em; clear: both; text-align: center; text-indent: 0;}
/*Fixed page navigation bubble for menu page */



#fixover	{position: absolute; top: 25px; right: 1%; width: 45px; z-index: 700; padding: 0; text-align: left; }

body > div#fixover {position: fixed; min-height: 70px;}

#fixover a.close	{color: #a00;}

#fixover a.close:hover	{color: #fff; border: 0; font-style: normal;}

.threed {background: transparent; width: 200px; float: right; margin: .3em 0 0 .3em;}

.threed h1, .raised p {margin:0 10px;}

.threed h1 {font-size:2em; color:#fff;}

.threed p {padding-bottom:0.5em;}

.threed .b1, .threed .b2, .threed .b3, .threed .b4, .threed .b1b, .threed .b2b, .threed .b3b, .threed .b4b {display:block; overflow:hidden; font-size:1px;}

.threed .b1, .threed .b2, .threed .b3, .threed .b1b, .threed .b2b, .threed .b3b {height:1px;}

.threed .b2 {background:#ccc; border-left:1px solid #fff; border-right:1px solid #eee;}

.threed .b3 {background:#ccc; border-left:1px solid #fff; border-right:1px solid #ddd;}

.threed .b4 {background:#ccc; border-left:1px solid #fff; border-right:1px solid #aaa;}

.threed .b4b {background:#ccc; border-left:1px solid #eee; border-right:1px solid #999;}

.threed .b3b {background:#ccc; border-left:1px solid #ddd; border-right:1px solid #999;}

.threed .b2b {background:#ccc; border-left:1px solid #aaa; border-right:1px solid #999;}

.threed .b1 {margin:0 5px; background:#fff;}

.threed .b2, .threed .b2b {margin:0 3px; border-width:0 2px;}

.threed .b3, .threed .b3b {margin:0 2px;}

.threed .b4, .threed .b4b {height:2px; margin:0 1px;}

.threed .b1b {margin:0 5px; background:#999;}

.threed .boxcontent {display:block;  background:#ccc; border-left:1px solid #fff; border-right:1px solid #999; padding: 0.3em .6em;}

.threed .boxcontent h3.box {width: 100%; border-bottom: 1px solid #369; background: #ccc; font: 110% Georgia, Times, serif; font-weight: bold; text-align: center; color: #333; font-variant: small-caps;margin: 0; padding: 0; line-height: .5em;}

.threed .boxcontent h3.box span {background: #ccc; padding: .2em;}

.threed .boxcontent h5.box {width: 100%; display: block; border: 0; font: 60% Arial, Helvetica, sans-serif; font-variant: small-caps; margin:0; padding: 0; text-align: center; color: #fff; background: #369; margin-bottom: .1em;}

.threed .boxcontent ul	{list-style-type: none; margin: 0; padding: 0;}

.threed .boxcontent li	{width: 100%; text-align: center; margin: 0;}

.threed .boxcontent li a	{display: block; font: 80% Georgia, Times, serif; font-variant: small-caps; background: transparent; color: #369;}

.threed .boxcontent li a:hover	{color: #fff; background: #369; border: 0;}

.threed .boxcontent p {font: 70% Georgia, Times, Serif; text-align: right; border-right: 1px solid #369; margin: 1em .2em; padding-right: .2em;}

.threed .boxcontent p span.date {font: 80% Arial, Helvetica, sans-serif; display: block; width: 100%;}

.threed .boxcontent p.codep	{font: 8px Courier, monospace;border: 0; text-align: left; margin: 0;}

