@charset "UTF-8";
/*
Designed by Tiffany Pan
Developed by philosophie llc

Client: Literati Cafe
Project: Website
Designer: Tiffany Pan
Development: Emerson Taymor and Skot Carruth

© all work is an act of philosophie

===COLOR SCHEME===

Tan: #efefed
Footer Tan: #dbdbdb
Red: #d70302
Dark Gray: #3b3a37
	
*/

body{
	font-family: helvetica, arial, sans-serif;
	font-size: .625em;
	background:#fff;
	color:#000;
}

body.bar{background-color:#676767;}
body.cafe{background-color:#cdcdcd;}

.container, #container{
	margin: 0 auto;
	width:960px;
	overflow:hidden;
	zoom:1;
}
body.home{background-color:#dbdbdb;}

#leftHalf{background-color:#6e0815;width:50%;float:left;text-align:center;}
#rightHalf{background-color:#efefed;width:50%;float:left;text-align:center;}
#leftHalf img{margin:295px 0;}
#rightHalf img{margin:314px 0;}

.home #content{
	min-width:700px;
	padding:0;
}
.home #footer{padding-left:25px;}

.cafe #upperHeader{
	background-color:#efefed;
	height:135px;
	width:100%;
}
.bar #upperHeader{
	background-color:#27292a;
	height:135px;
	width:100%;
}

#logo{
	margin:64px 0 0 20px;	
}
.bar #logo{
	margin-top:40px;	
}


ul#nav{
	width:960px;
	margin:0;
}
ul#nav li a{
	display:block;
	float:left;
	height:48px;
	background-repeat:no-repeat;
	background-position:bottom left;
	text-indent:-9999px;
}

ul#nav li a:hover, ul#nav li.selected a{
	background-position:top left;
}
/* CAFE NAV */
.cafe #navCont{	
	background-color:#cb1a1a;
	height:48px;
	overflow:hidden;
	zoom:1;
	border-top:1px solid #fff;
	border-bottom:1px solid #fff;
}

.cafe ul#nav li#visitBarNav a{
	width:191px;
	background-image:url(../_images/_cafe/nav/visit-the-bar.png);
	padding-right:248px;
	margin-left:20px;
}
.cafe ul#nav li#about a{
	width:93px;
	background-image:url(../_images/_cafe/nav/about.png);
}
.cafe ul#nav li#menu a{
	width:93px;
	background-image:url(../_images/_cafe/nav/menu.png);
}
.cafe ul#nav li#location a{
	width:118px;
	background-image:url(../_images/_cafe/nav/location.png);
}
.cafe ul#nav li#events a{
	width:93px;
	background-image:url(../_images/_cafe/nav/events.png);
}
.cafe ul#nav li#gallery a{
	width:104px;
	background-image:url(../_images/_cafe/nav/gallery.png);
}
/* BAR NAV */
.bar #navCont{	
	background-color:#771f1e;
	height:48px;
	overflow:hidden;
	zoom:1;
	border-top:1px solid #fff;
	border-bottom:1px solid #fff;
}

.bar ul#nav li#visitCafeNav a{
	width:191px;
	background-image:url(../_images/_bar/nav/visit-the-cafe.png);
	padding-left:248px;
	background-position:bottom right;
}
.bar ul#nav li#about a{
	width:93px;
	background-image:url(../_images/_bar/nav/about.png);
}
.bar ul#nav li#menu a{
	width:93px;
	background-image:url(../_images/_bar/nav/menu.png);
}
.bar ul#nav li#location a{
	width:118px;
	background-image:url(../_images/_bar/nav/location.png);
}
.bar ul#nav li#events a{
	width:93px;
	background-image:url(../_images/_bar/nav/events.png);
}
.bar ul#nav li#gallery a{
	width:104px;
	background-image:url(../_images/_bar/nav/gallery.png);
}


#content{
	background-color:#fff;	
	padding-left:20px;
}
#upperFooter{
	height:170px;
	width:100%;
	padding-top:20px;
}
.cafe #upperFooter{background-color:#efefed;}
.bar #upperFooter{background-color:#b0aeaf;}

#upperFooter .footerSect{
	float:left;
	width:190px;
}
#upperFooter #phone{
	margin-left:170px;	
}
#upperFooter .footerSect h4{
	margin-bottom:18px;
	text-indent:-9999px;
	display:block;
	background-repeat:no-repeat;
	background-position:top left;
}
/*  CAFE FOOTER HEADERS  */
.cafe #upperFooter #phone h4{
	background-image:url(../_images/_cafe/footer/phone-header.png);
	width:48px;
}
.cafe #upperFooter #hours h4{
	background-image:url(../_images/_cafe/footer/hours-header.png);
	width:47px;
}
.cafe #upperFooter #address h4{
	background-image:url(../_images/_cafe/footer/address-header.png);
	width:66px;
}
.cafe #upperFooter #followUs h4{
	background-image:url(../_images/_cafe/footer/follow_us-header.png);
	width:82px;
}
/*  BAR FOOTER HEADERS   */
.bar #upperFooter #phone h4{
	background-image:url(../_images/_bar/footer/phone.png);
	width:48px;
}
.bar #upperFooter #hours h4{
	background-image:url(../_images/_bar/footer/hours.png);
	width:47px;
}
.bar #upperFooter #address h4{
	background-image:url(../_images/_bar/footer/address.png);
	width:66px;
}
.bar #upperFooter #followUs h4{
	background-image:url(../_images/_bar/footer/follow-us.png);
	width:82px;
}

ul.socialMediaLinks li{display:inline;}

#footer{background-color:#dbdbdb;padding-top:10px;clear:both;overflow:hidden;}
#footer p{margin:0 20px 10px;}
#footer p.copyrightInfo{float:left;}
#footer p.credits{float:right;}
#footer a{color:#d70302;text-decoration:none;}
/*  ABOUT  */

#upperSection{
	padding:35px 0 35px;
	overflow:hidden;zoom:1;
}
.about #upperSection p{
	width:375px;
	float:left;
	margin-left:50px;
}

/*  LOCATION  */

#locationLeft{
	float:left;
	width:570px;
}
.directionSect{
	width:190px;
	float:left;
	margin-top:20px;
}

#map_canvas{float:right;
	width:320px;
	height:200px;
	margin-right:40px;
}

/*  GALLERY  */

h1#gallery, h1#breakfast, h1#lunch-dinner, h1#tea-coffee, h1#drinks, h1#desserts, h1#dinner, h1#lunch, h1#events{
	display:block;
	text-indent:-9999px;
	margin:35px 0 25px;
}

.cafe h1#gallery{background:url(../_images/_cafe/headers/gallery.png) no-repeat top left;
	width:166px;height:37px;}
.bar h1#gallery{background:url(../_images/_bar/headers/gallery.png) no-repeat top left;
	width:195px;height:24px;}

#galleryCont{
	width:800px;
	height:600px;
	margin:0 auto 55px;
}

/*  MENU  */

.menu h1, .events h1{float:left;}
.menuLink{
	text-transform:uppercase;
}

.menuSect{
	width:170px;
	float:left;
	padding:0 8px;
}

.cafe h1#breakfast{background:url(../_images/_cafe/headers/breakfast.png) no-repeat top left;
	width:209px;height:30px;}
.cafe h1#lunch-dinner{background:url(../_images/_cafe/headers/lunch-dinner.png) no-repeat top left;
	width:354px;height:30px;}
.cafe h1#tea-coffee{background:url(../_images/_cafe/headers/tea-coffee.png) no-repeat top left;
	width:290px;height:30px;}
.cafe h1#drinks{background:url(../_images/_cafe/headers/drinks.png) no-repeat top left;
	width:138px;height:30px;}
.cafe h1#desserts{background:url(../_images/_cafe/headers/desserts.png) no-repeat top left;
	width:179px;height:30px;}
	
.bar h1#breakfast{background:url(../_images/_bar/headers/breakfast.png) no-repeat top left;
	width:252px;height:24px;}
.bar h1#lunch{background:url(../_images/_bar/headers/lunch.png) no-repeat top left;
	width:140px;height:23px;}
.bar h1#dinner{background:url(../_images/_bar/headers/dinner.png) no-repeat top left;
	width:166px;height:24px;}
.bar h1#drinks{background:url(../_images/_bar/headers/drinks.png) no-repeat top left;
	width:162px;height:24px;}
.bar h1#desserts{background:url(../_images/_bar/headers/dessert.png) no-repeat top left;
	width:191px;height:24px;}

#downloadMenus{
	margin:0 0 30px 9px;	
}
#downloadCafeMenu{
	margin:20px 0;	
}
#menuTypes{
	float:right;margin-top:50px;	
}
#eventTypes{float:left;margin:50px 0 0 150px;}
#menuTypes li, #eventTypes li{
	display:inline;
	padding:5px 12px;
	font-size:1.2em;
}
#menuTypes li.selected, #eventTypes li.selected{background-color:#e6e6e6;}
#menuTypes li a, #eventTypes li a{
	color:#5c5c5c;	
}
#menuTypes li a:hover, #eventTypes li a:hover{color:#222;}

.menuSection{
	width:100%;
	font-size:1.2em;
	color:#5c5c5c;
	margin-bottom:36px;
}

.menuSection li{
	padding:8px 0;
	border-top:1px solid #d0d0cc;
	display:block;
	clear:both;
}
.menuSection li span{float:right;}

/*   EVENTS   */
.cafe h1#events{background:url(../_images/_cafe/headers/events.png) no-repeat top left;
	width:145px;height:30px;}
.bar h1#events{background:url(../_images/_bar/headers/events.png) no-repeat top left;
	width:166px;height:23px;}

.events .leftSide{
	width:570px;clear:both;
}

.events .leftSide form{
	display:block;
	border-top:1px solid #d0d0cc;
	font-size:1.2em;
	padding:18px 0 35px;
	overflow:hidden;
	zoom:1;
}

.events .leftSide form li{
	display:block;
	float:left;
	width:260px;
	margin:0 12px 18px 0;
}
form li label{
	color:#5c5c5c;
	display:block;
	margin-bottom:5px;
}
form li input, form li textarea{
	color:#5c5c5c;
	display:block;
	width:100%;
}
form li textarea{height:170px;}
.events .leftSide form li.commentsField{
	width:540px;
	clear:both;
}

form #submitBtn{
	width:auto;
	padding:5px 12px;
	text-transform:uppercase;
	background-color:#d0d0cc;
	border:1px solid #5c5c5c;
	cursor:pointer;
}

/* ~~~~~ Typography ~~~~~ */

a {color:#6d0814;
	text-decoration:underline;}
a:hover {color:#d70302;}
a.selected{color:;}
h1 {font-size: ; color:  ; margin-bottom: ; font-weight:bold;}
h2 {font-size: 1.6em; color:  #555; margin-bottom: 18px;}
h3 {font-size: ; font-weight: bold; color:  ; margin: ;}
p {font-size: 1.2em;line-height: 1.5em;margin-bottom:18px;}

/* UTILITY CLASSES */
.fl {float: left;}
.fr {float: right;}
.cl {clear: left;}
.cr {clear: right;}
.clear {clear: both;}
strong{font-weight:bold;}
em{font-style:italic;}