@charset "utf-8";

/* Pretty Stuff 

================================== */



body {
	color:white;
	margin: 0;
	padding: 0;
	line-height:1.1em;
	background-image: url(../images/bg.png);
	background-repeat: repeat;
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	font-size: 84%;
}



#wrapper {

  background:none;

  padding: 20px;

}



#header{

	position:relative;

	height:130px;

}



#logo{

	width: 474px;

	height:167px;

	background: url(../images/logo.png) top left no-repeat;

	position:absolute;

	top:5px;

	left:-100px;



}



/* Content Styling

================================== */



#content{position:relative;}

#content-top-header {
	background-image: url(../../../Website%20Development/The%20Crib/images/home.png);
	height: 30px;
	width: 961px;
}



#content h1{
	color:#A5D147;
	font-size: 1
.em;
	line-height:1em;
	font-family: Georgia, "Times New Roman", Times, serif;
}

#content h1 a{
	color:#CCC;
	text-decoration:none;
	font-size: 60%;
	line-height: 80%;
}

#content h1 a:hover{
	color:#999;
	font-size: 0.85em;
}

#content h2{
	color:#B6C52C;
	font-size: 1.25em;
	line-height:0.1em;
}

#content h2 a{

	color:#9C0;

	font-size: .85em;

	line-height:1.05em;

	text-decoration:none

}

#content h5{

	color:#B6C52C;

	font-size: .85em;

	line-height:0.1em;

}

#content h5 a{

	color:#9C0;

	font-size: 1.05em;

	line-height:0.1em;

	text-decoration:none

}

#content h3{
	color:#F5E7C4;
	font-size: 1.05em;
	line-height:0.1em;
	text-transform:uppercase;
	text-indent: 15px;
}

#content h3 span{color:#a83e12;	font-size: 1.05em;	line-height:0.1em; text-transform:none;}

#content h4{

	color:#633;

	font-size: 1.05em;

	line-height:0.1em;

}

#content h2 span{

	color:#669;

	font-size: 1.05em;

	line-height:0.1em;

}

#content-top{
	width:961px;
	height:550px;

}
#front-top{
	width:961px;
	height:750px;

}
#content-top-bg{

	background:url(../images/home.png) top left no-repeat;

	opacity:0.4;

	filter:alpha(opacity=40);

	width:961px;

	height:480px;

}

#content-bg{
	width:961px;
	height:500px;
	background-color: #000;
}
#front-bg{
	width:961px;
	height:700px;
	background-color: #000;
}

#content-top1{position:absolute;top:40px;left:20px;}

#content-top2{
	position:absolute;
	top:33px;
	left:410px;
	width:542px;
	height: 480px;

}

#content-top3{
	position:absolute;
	top:297px;
	left:22px;
	width:357px;
	height: 170px;
	color: #FFF;
	font-family: Verdana, sans-serif;
	line-height: 14px;
	overflow: visible;
}


#content-top3 img {

	border:4px solid #F5E7C4;

}

#content-top1 img, #content-bottom img{
	border:4px solid #F3F2D8;
}

#content-bottom{position:relative;margin-top:20px;width:961px;height:150px;}

#content-bottom1{position:absolute;top:15px;left:15px;width:930px;}

#content-bottom-bg{
	background:black;
	width:961px;
	height:150px;
}



table td {
	vertical-align:top;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #CCC;
}

table td a{
	color: #A5D147;
}



#footer {text-align:center; margin-top:20px}

#footer a{
	text-decoration:none;
	color:#69C
}

#footer a:hover{
	text-decoration:none;
	color:#A6D0CE

}



/* Food/Drinks Menu's Styling

================================== */

#menus-top{	width:961px;	height:1900px;}

.menus_left_col{position:absolute;top:40px;left:20px; height:400px}

#menu-tapas-bg{
	opacity:.8;
	width:961px;
	height:1500px;
	background-color: #000;

}

#menu-mains-bg{
	opacity:.8;
	width:961px;
	height:850px;
	background-color: #000;

}

.menus h1{color:#a83e12;font-size: 1.3em;line-height:.8em;}

.menus_left_col img{

	border:7px solid #F5E7C4;

}

.menus_centre{
	top:41px;
	left:162px;
	width:783px;
	position: absolute;

}

.menus_centre p{
	padding-left: 15px;
}



.menus_centre h1{color:#372161;	font-size: 1.3em;	line-height:.8em;}

.menus_centre h2{
	color:#B6C52C;
	font-size: 1.05em;
	line-height:0.1em;
	text-indent: 15px;
}

.menu_content{width:961px;height:480px;}



#drinks-bg{
	opacity:.8;
	width:961px;
	height:1600px;
	background-color: #000;

}

#drinks-top{

	width:961px;

	height:1650px;

}



#events-bg{
	opacity:.8;
	width:961px;
	height:1000px;
	background-color: #000;

}

#menus-top{
	width:961px;
	height:900px;

}

#tapas-top{

	width:961px;

	height:1550px;

}





#gallery-top{

	width:961px;

	height:770px;

}

#gallery-bg{
	width:961px;
	height:720px;
	background-color: #000;
}



#gallery-bg ul{

	color:#FFF;

	font-size: 0.9em;

	line-height:1.5em;

}

#gallery-bg ul a{

	color:#660;

	text-decoration:none

}



#gallery-bg ul a:hover{

	color:#C30;

	text-decoration:none

}



#gallery-bg ul a:active{

	color:#000;

	text-decoration:none

}



#gallery-bg h1{

	color:#a83e12;

	font-size: .8em;

}



body {
	min-width: 700px;
}



#wrapper {
	width: 961px;
	margin: 0 auto;

  

} 



div.transbox

  {

background: black;

opacity:0.4;

filter:alpha(opacity=40);  

  }

div.transbox p

  {

  margin:30px 40px;

  font-weight:bold;

  color:#000000;

  }



/* Menu Technique

================================== */



#menu {

margin-top:80px;



width:520px;

background: none;

float: right;

height:35px;

}

#menu ul {

list-style: none;

margin: 0;

padding: 5px;

float: left;

}



#menu a, #menu h2 {
	font: bold 16px/17px arial, helvetica, sans-serif;
	display: block;
	margin: 0;
	padding-top: 0px;
	padding-right: 3px;
	padding-bottom: 2px;
	padding-left: 3px;
}



#menu h2 {

color: #fff;

background: none;

padding-top:12px;

}



#menu a {
	color: #333;
	background: none;
	text-decoration: underline;
}



#menu a:hover {
	color: #B6C837;
	text-decoration:underline;
}



#menu li {position: relative;}



#menu ul ul {

position: absolute;

z-index: 500;

}



#menu ul ul ul {

position: absolute;

top: 0;

left: 100%;

}



#menu li ul {

width:200px;



}

div#menu ul ul,

div#menu ul li:hover ul ul,

div#menu ul ul li:hover ul ul

{display: none;}



div#menu ul li:hover ul,

div#menu ul ul li:hover ul,

div#menu ul ul ul li:hover ul

{display: block;}



.pikachoose{
	width:870px;
	margin:0 auto 10px auto;
	position: absolute;
	top: 42px;
	right: 44px;

}

/* This is the ul you have all your images in */

.pikachoose ul{padding-left:0;width:525px;height:300px;margin:0;overflow:hidden;}

.pikachoose ul li{float: left;border:1px solid #555;padding:2px;background:#777;margin:0 6px 4px 0;position:relative;overflow:hidden;}

.pikachoose ul li div img{position:relative;cursor:pointer;}



/* this is the surroundner for all your elements. This is also the fake border around the main img and room for caption */

.pika_main{width:506px;height:325px;display:block;position:relative;}

/*sine we give it the fake border, you need to position the image a little. */

.pika_main_img{position:relative;}

.pika_subdiv{position:relative;border:1px solid #555;background:#777;padding:2px;}

.pika_animationDivs{top:2px;left:2px;} /*must match top/left padding for subdiv */

.pika_subdiv img, .pika_subdiv a img{border:none;}

.pika_caption{width:500px;height:16px;padding-top:4px;text-align:center;position:absolute;bottom:7px;left:3px;background:url('black.png') top left;}

.pika_caption a{color:white;}



.pika_play{position:absolute;z-index:1;left:50%;margin-left:-25px;width:50px;top:5px;}

.pika_play a{position:relative;margin-left:auto;cursor:pointer;display: block;width:50px;height:50px;background:url('play.png') top center no-repeat;}

.pika_play a.pika_stop_button{background:url('pause.png') top center no-repeat;}



.pika_navigation a{font-size: 12px; text-decoration: none;}

.pika_navigation a:hover{text-decoration: underline;}

.pika_navigation{padding-top:10px;clear:both;text-align:center;}



/* if you want to 'hide' these jus make their height and width 1px */

.pika_prev_hover{position:absolute;top:5px;left:5px;height:456px;width:100px;background:url('rewind.png') top left no-repeat;}

.pika_next_hover{position:absolute;top:5px;right:5px;height:456px;width:100px;background:url('fastf.png') top right no-repeat;}

.left_col {

	float: left;

	height: 500px;

	width: 250px;

	font-family: Arial, Helvetica, sans-serif;

	color: #09C;

	position: absolute;

}

#wrapper #content #content-top #content-top4 #content-top3 p {
	color: #FFF;
}
#wrapper #content #content-top #content-top4 #content-top3 p a{
	color: #A5D147;
}
#wrapper #content #content-top #content-top4 #content-top3 p strong {
	color: #333;
}
#wrapper #content #content-top #content-top2 p span {
	font-size: 100%;
}
#wrapper #content #content-top #content-top2 p span a{
	font-size: 100%;
	color: #A5D147;
}
#wrapper #content #content-top #content-top2 #contactform p strong a {
	color: #337EDB;
}
#wrapper #content #content-top #content-top2 #contactform p a strong {
	color: #80FF00;
}
#content-top2-intro {
	width: 275px;
	clear: right;
	float: left;
	padding-top: -20px;
	margin-top: -30px;
	margin-left: -10px;
	margin-right: 15px;
}
#specials {
	height: 500px;
	width: 260px;
	float: left;
	background-image: url(../images/black_board.jpg);
	background-repeat: no-repeat;
	background-position: center;
	margin-top: -80px;
}
#artist {
	margin-top: 125px;
	margin-left: 20px;
	font-size: 20px;
	font-family: "pencilPete FONT";
}
#featured {
	font-size: 26px;
	font-family: "pencilPete FONT";
	font-weight: bold;
	color: #9DC7FF;
	text-align: center;
}

#food_special {
	font-family: "pencilPete FONT";
	font-size: 20px;
	color: #FFF;
	margin-top: 40px;
	margin-left: 25px;
}
#specials_content {
	font-family: "pencilPete FONT";
	font-size: 18px;
	color: #9CF;
	padding-left: 20px;
	padding-right: 20px;
	margin-top: 10px;
	line-height: 20px;
	text-align: center;
}
.menus_centre div {
	padding-right: 50px;
	line-height: 150%;
}
#featured_artist {
	font-family: Elephant;
	font-size: 16px;
	color: #999;
	text-align: center;
}

#featured_artist a{
	color: #9CF;
}
#featured a {
	text-decoration: none;
	color: #9CF;
}
.images {

}
#wrapper #content #gallery-top #gallery-bg album {
	margin-top: 20px;
	margin-left: 25px;
}
#album_heading {
	position: absolute;
	width: 866px;
	margin-top: 10px;
	margin-right: 30px;
	margin-left: 30px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 18px;
	color: #AFBF40;
	font-weight: bold;
}
#photos {
}
#photos {
	margin-top: 5px;
	position: absolute;
	left: 30px;
	top: 82px;
}
#wrapper #content #content-top #content-top2 h2 {
	margin-top: 22px;
	font-size: 16px;
	font-weight: bold;
	left: 3px;
	top: 40px;
}
#photos_cribtonights {
	margin-top: 0px;
	position: absolute;
	left: 30px;
	top: 115px;
}
#crib1{
	width:200px;
	font-family: "pencilPete FONT";
	font-size: 16px;
	color: #FFC;
	margin-top: 10px;
	margin-right: 10px;
	margin-left: 10px;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
}
#crib2{	width:200px;
	margin: 10px;
	padding: 5px;}
#crib1 a {
	
	font-family: "pencilPete FONT";
	font-size: 18px;
	color: #FFC;
	font-weight: bold;
}
#staff_col1{
	clear: right;
	float: left;
	width: 230px;
}
#staff_col2{
	float: left;
	width: 230px;
}
#staff_profile{
	float:left;
	width:600px;
}
#staff1 { display:block}
#staff2 {display:none}
#staff3 {display:none}
#staff4 {display:none}
#alter_ego {
	float:left;
	height: 350px;
	width: 130px;
	margin-right: 10px;
}
#staff_title{}
#staff_details { margin-top:10px}
#content #content-top #content-bg #album_heading #staff_profile #staff1 #staff_details {
	font-family: "Courier New", Courier, monospace;
	font-size: 16px;
	color: #999;
	line-height: 20px;
}

.staff_details {
	font-family: "Courier New", Courier, monospace;
	font-size: 16px;
	color: #999;
	line-height: 20px;
	text-align: justify;
}