/* CSS Document */



/********************************************
HTML ELEMENTS
********************************************/
/* top elements */
* { margin: 0; padding: 0; outline: 0; } /*sets no padding or margin around the body of our document*/

body {
	background-color: #2d2d2e; /*website background color (black)*/
	background-repeat: no-repeat; /*no repeat of our background*/
	color: #eff0ec; /*sets our text color for our website*/
	margin: 0px 0; /*sets no padding and a 15px margin around the body of our document*/
	font-family: Arial, Myriad Pro, Verdana, Tahoma, sans-serif; /*sets the font family for our website*/
	font-size: 16px; /*sets the font size in px*/
	line-height: 1.5em; /*sets the height between each line of text.*/
}



/********************************************
WEBSITE LAYOUT
********************************************/
#wrap {
	width: 1000px; /*width of our wrap*/
	background: #2d2d2e; /*sets our background color to black */
	background-image: url(images/interior6_border.jpg); /*sets the background image, single photo*/
	background-repeat: no-repeat; /*repeats our background over and over*/
	margin: auto; /*center our margin to auto will center our website*/
	text-align: left; /*aligns our text to the left*/
	
}

#mwrap {
	width: 1000px; /*width of our wrap*/
	background: #2d2d2e; /*sets our background color to black */
	background-image: url(images/map_backgr_2014.jpg); /*sets the background image, single photo*/
	background-repeat: no-repeat; /*repeats our background over and over*/
	margin: auto; /*center our margin to auto will center our website*/
	text-align: left; /*aligns our text to the left*/
	
}

#iwrap {
	width: 1000px; /*width of our wrap*/
	background: #2d2d2e; /*sets our background color to black */
	background-image: url(images/cups_border.jpg); /*sets the background image, single photo*/
	background-repeat: no-repeat; /*repeats our background over and over*/
	margin: auto; /*center our margin to auto will center our website*/
	text-align: left; /*aligns our text to the left*/
	
}

#header {
	position: relative; /*An element with position: relative moves an element relative to its normal position, so "left:20" adds 20 pixels to the element’s LEFT position*/
	height: 105px; /*sets our header height, this should be the same as our header image*/
	background: #2d2d2e; /*sets a background behind our header and sets our header image onto the page*/
	opacity:0.9;
    filter:alpha(opacity=60); /* For IE8 and earlier */
 	padding: 0; /*no padding is needed*/
}

ul {
	float: left; /*Floats our menu to the left*/
	list-style: none;
	padding: 8px 25px 0 25px;
}

#items {
	color: #cec8bb; /*sets our text color for our website*/
	font-size: 26px; /*sets the font size in px*/
	line-height: 1.2em; /*sets the height between each line of text.*/
	text-transform: uppercase;
}


#hours {
	color: #FFF; /*sets our text color for our website*/
	font-size: 16px; /*sets the font size in px*/
	line-height: 1.42em; /*sets the height between each line of text.*/
	padding-top: 10px;
}

.first {
	font-size: 18px; /*sets the font size in px*/
}


#menu {
	text-align: right;
	}
	
#menu ul li {
	display: inline; /*The element will be displayed as an inline element, with no line break before or after the element*/
}

.social {
	padding: 12px 0 0 380px;
}

#twitter
{
 
  width: 40px;
  height: 39px;
  background: url("twitter1.gif") no-repeat 0 0;

}

#twitter:hover
{ 
  background-position: 0 -39px;
}

#twitter span
{
  position: absolute;
  top: -999em;
}

.nav {
	text-align: right;
	font-size: 18px; /*sets the font size in px*/
	color: #cec8bb;
	padding: 10px 0 0 416px;
	word-spacing:14px;
}


.nav a:link {color:#cec8bb; text-decoration:none;}      /* unvisited link */
.nav a:visited {color:#897b77; text-decoration:none;}  /* visited link */
.nav a:hover {color:#eff0ec; text-decoration:underline;}  /* mouse over link */
.nav a:active {color:#eff0ec; text-decoration:underline;}  /* selected link */

#content {
	position: relative; /*An element with position: relative moves an element relative to its normal position, so "left:20" adds 20 pixels to the element’s LEFT position*/
	clear: both; /*The clear property sets the sides of an element where other floating elements are not allowed.*/
	width: 1000px; /*width of our wrap*/
	height: 450px; /*sets our header height, this should be the same as our header image*/
	margin: 5px auto; /*sets our top margin at 5 pixels and the rest to auto*/
	padding: 0; /*sets 0 padding*/
}

#logo {
	position: absolute; top:255px; left: 20px; 
	background: #2d2d2e no-repeat center;
	opacity:0.9;
	width: 260px; /*width of our wrap*/
	height: 120px; /*sets our header height, this should be the same as our header image*/
	padding: 16px 50px 38px 16px;
	border-radius: 15px;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
}

#map {
	position: absolute; top:47px; left: 147px; 
	background: #2d2d2e no-repeat center;
	width: 325x; /*width of our wrap*/
	height: 267px; /*sets our header height, this should be the same as our header image*/
	padding: 14px 14px 24px 14px;
	border-radius: 15px;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
}

#map p {
	position: absolute; top:281px; left: 291px; 
	color: #cec8bb; /*sets our text color for our website*/
	font-size: 14px; /*sets the font size in px*/
	text-transform: uppercase;
}

#map p a:link {color:#cec8bb; text-decoration:none;}      /* unvisited link */
#map p a:visited {color:#897b77; text-decoration:none;}  /* visited link */
#map p a:hover {color:#eff0ec; text-decoration:underline;}  /* mouse over link */
#map p a:active {color:#eff0ec; text-decoration:underline;}  /* selected link */

#logo2 {
	position: absolute; top:265px; left: 630px; 
	width: 260px; /*width of our wrap*/
	height: 120px; /*sets our header height, this should be the same as our header image*/
	padding: 16px 50px 38px 16px;
}


#list {
	position: absolute; top:17px; left: 47px; 
	background: #2d2d2e no-repeat center;
	opacity:0.9;
	width: 395px; /*width of our wrap*/
	height: 380px; /*sets our header height, this should be the same as our header image*/
	padding: 4px 0px 24px 0px;
	border-radius: 15px;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	color: #eff0ec; /*sets our text color for our website*/
	
}

#list ul {
	list-style-type: none;
	padding: 0px;
	margin: 9px 11px 0 0;
	
}

#list li{
	font-size: 14px; /*sets the font size in px*/
	line-height: 1.2em; /*sets the height between each line of text.*/
	padding-bottom: 9px;
	margin-left: 25px;
	list-style: none;
	list-style-position: outside;
	list-style-image: url(images/dash.png);
	list-style-type: square;
	}

#list li a:link {color:#cec8bb; text-decoration:none;}      /* unvisited link */
#list li a:visited {color:#897b77; text-decoration:none;}  /* visited link */
#list li a:hover {color:#eff0ec; text-decoration:underline;}  /* mouse over link */
#list li a:active {color:#eff0ec; text-decoration:underline;}  /* selected link */

#logo3 {
	position: absolute; top:308px; left: 200px; 
	padding: 16px 50px 38px 16px;
}

#pictures {
	position: absolute; top:-15px; left: 530px; 
	padding: 16px 50px 38px 16px;
}

.bagels {
	margin-top: -33px;
}


/********************************************
FOOTER
********************************************/
#footer {
	background: #2d2d2e; /*sets our background color to black */
	color: #eff0ec;
	clear: both;
	width: 1000px;
	height: 30px;
	opacity:0.95;
    filter:alpha(opacity=60); /* For IE8 and earlier */	
	border-bottom: 1px solid #000000;
}

#footer p {
	text-align: right;
	font-size: 16px;
	font-weight: bold;
	margin-right: 20px;
	padding: 4px 0 0 0;
}

#copyright {
	background: #2d2d2e; /*sets our background color to black */
	font-size: 10px;
	padding: 0px 0 0 6px;
}

#copyright a:link {color:#cec8bb; text-decoration:none;}      /* unvisited link */
#copyright a:visited {color:#897b77; text-decoration:none;}  /* visited link */
#copyright a:hover {color:#eff0ec; text-decoration:underline;}  /* mouse over link */
#copyright a:active {color:#eff0ec; text-decoration:underline;}  /* selected link */