/*  Bobbin Inn Cafe stylesheet  */
/*   Copyright Webfresh, www.webfresh.com.au    */
/* nav menu css is in this file as well 

/* standard attributes */


* {margin:0; padding:0;}

body  {
	font-size: 14px;
	font-family: Arial, Helvetica, sans-serif;  
	text-align: center; 
	margin:0;
	padding: 0;
	color: #3d3d3d;   /* grey text */
	background: #ffffff url(../images/background.gif) repeat-x 0 0  ;  
	}


div, p, h1, h2, h3, h4, ul, ol, img, table, td, tr, th {padding:0px; margin:0px;}
img, td, tr, th {border: none;}

 table {border-collapse:collapse;}  



ul{list-style-type:none;}

a, object{outline: none} /* stop dotted lines around links in firefox */

h1,h2,h3 {color: #581816; font-weight: normal; font-family: Arial, Helvetica, sans-serif; letter-spacing: 0; }

h1{
	margin: 10px 0px 25px 0px;
	font-size:24px;
}
h2 {
	margin: 20px 0px 10px 0px;
	font-size: 20px;
}

h3 {
	margin: 25px 0 10px 0;
	font-size: 18px;

}



span.h3span {
	font-size: 18px;
	color: #581816; 
	letter-spacing: 0; 
}



/************  paragraph  *****************/
p {
	word-spacing: 1px;
	line-height: 1.5;  
	margin: 10px 10px 17px 0;
}


p.p12 {
	font-size: 12px;
	line-height: normal;
}

p.p16 {
	font-size: 16px;
}

p.front-tag {
	font-family: Georgia, 'Times New Roman', Times, serif;
	font-size: 20px;
	font-style: italic;
	line-height: 1.8;
	color: #581816;
	margin: 0 30px 35px 10px;
	padding: 0 0 0 20px;
	background-color: #FDF8F0;
}

p.page-tag {
	font-family: Georgia, 'Times New Roman', Times, serif;
	font-size: 18px;
	font-style: italic;
	line-height: 1.6;
	color: #581816;
	margin: 0 30px 35px 10px;
	padding: 3px 0 3px 20px;
	background-color: #FDF8F0;
}
#about p.page-tag {
	text-align: center;
	width: 450px;
	padding-left: 0px;
	word-spacing: 2px;
}

p.double {
	margin-bottom: 34px;
}


/************  link styles *************/

 a {
	text-decoration: none;
	color:#BC342F;
}


#main-inner-text a {
	border-bottom: 1px solid #DD9997;  
}


#footer a {
	border-bottom: 1px solid #FAF0E0;  
}

#main-inner-text a:hover, #main-inner-text a:active,  #main-inner-text a:focus
{
	border-bottom: 1px solid #AB8B8A;     
	color:#581816;  
}

#footer a:hover, #footer a:active,  #footer a:focus
{
	color:#581816;  
}


/* stop borders around images used as links  note this can mess up ie 6 if images in a link have borders*/
 a img,:link img,:visited img { 	border: none;   } 


/***************   Main layout *********************/


#wrap {
	width:1038px;
	margin:0 auto;
	text-align: left;
	background: transparent;
}

/* background image */

#header{
	background: transparent url(../images/header.jpg) no-repeat 0 0;    
	width:1038px;
	margin:0 auto;
}

/*************  top right ******************/

#topright{
	float: right;
	width: 186px;
	height: 99px;
}


#topright .tbutton-container{
	float:left;
/*	width:231px;   this breaks ie 6*/
	padding: 0;
	margin: 53px 0 0px 0 ;
}

#topright .tbutton{
	float: left;
	width: 107px; height: 38px;
	background: url( '../images/join-button.gif' ) left top no-repeat;
	}

#topright .tbutton a, #topright .tbutton a:visited {
	display: block;
	margin: 0; padding:0;
	width:100%; height:100%;
	overflow:hidden;
	text-decoration: none;
	font-size: 15px;
	letter-spacing: normal;  
	font-weight: bold;
	color: #ffffff;
	text-align:left;
	line-height: 38px;
	border: none;
	background: url( '../images/join-button.gif' ) 0 -38px no-repeat;
	}


#topright .tbutton  a:hover {
	background: transparent;
	border: none;
	color: #ffffff;
	}


#midwrap  {
	width: 950px;
	margin:0 auto 0 auto;
	padding: 207px 0 0 0 ; /* sets where the maincontent begins from top of page  **/
	background-color: transparent;
}


/************  right col ***************/

#rightcol {
	float:right;
	width:300px;  /* added to maincontent must equal midwrap  */
	background-color:  transparent;
}

#rightcol #right-inner {
	padding: 50px 14px 20px 20px;
}

#photos #rightcol #right-inner {
	padding-top: 90px ;
}

#rightcol .front-photo-frame {
	width: 259px;
	height: 175px;
	background: transparent url(../images/photos/photo-frame.gif) no-repeat 0 0; 
/*	padding: 8px 0 0 7px;  */

}

#rightcol #front-photos img {
	margin: 8px 0 0 7px;
	width: 232px;
	height: 146px;
	display: none; 
}


 .video-embed {
	margin: 45px 0 5px 0;
	width: 250px;
}


#photos  .video-embed {
	margin: 45px 0 105px 0;
}


#contact  .video-embed {
	margin: 45px 0 105px 0;
}


#about .video-embed, #todo .video-embed  {
	margin: 45px 0 10px 0;
	width: 550px;
	text-align: center;
}

 .video-embed p {
	text-align: center;
	font-size: 14px;
	font-style: italic;
	font-family: Georgia, 'Times New Roman', Times, serif;
	margin: 10px 0 0 0 ;
	line-height: 1.3;
}

.video-embed .link {
	margin: 3px 0 0 0 ;
	line-height: 1;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
}



.page-photo {
	margin: 0 0 12px 0;
}

#boats .page-photo {
	margin: 30px 0 12px 0;
}





.page-photo-120 {
	margin: 0 0 120px 0;
}

.page-photo-150 {
	margin: 0 0 150px 0;
}

.page-photo-menu {
	margin: 0 0 285px 0;
}
/*
#rightcol #front-photos img.first {
  display: block; 
}
*/

#rightcol  #photo-caption, #rightcol  #front-photo-caption  {
	text-align: center;
	font-size: 15px;
	font-style: italic;
	font-family: Georgia, 'Times New Roman', Times, serif;
}

#rightcol  #front-photo-caption {
	padding: 12px 0 0 0;
}


#rightcol  #photo-caption {
	padding: 8px 0 0 0;
}

/*********************  main text block   ************/


#maincontent {
	float:left;
	width:650px; /* added to right col must equal midwrap  */
}



#main-inner {
	margin: 20px 0 30px 0; 
	min-height: 450px; height:auto !important; height: 450px;  
}

#main-inner-text {
	padding:1px 50px 1px 35px;    /* 1px to uncollapse margins so all browsers look the same  */
}

#photos #main-inner-text {
	padding:1px 10px 1px 35px;    /* 1px to uncollapse margins so all browsers look the same  */
}



/*******************  images ******************/


#main-inner .img-caption {
	height: 54px;
	width: 415px;
	margin: 0 0 12px 0;
}



/***********************  2 columns  ************
		if inside inner-text then widths plus padding need to add up to 650px minus main-inner-text padding(102px) ************/

.col-left {
	float: left;
	width: 269px;
	padding: 0 10px 0 0;
}

.col-left p {
	margin-right: 0;
}

.col-right {
	float: left;
	width: 269px;
}

/******************  specific columns  ***************/

#footer-leftcol .col-left{width: 355px;}
#footer-leftcol .col-right{width: 245px; text-align: center;}

#menu #maincontent .col-left {
	width: 400px;
}

#menu #maincontent .col-right {
	width: 120px;
	text-align: right;
}


#menu #maincontent .col-right p, #menu #maincontent .col-left p{
	line-height: 1.2;  
	margin: 12px 1px 12px 0;

}





/****************   tables *********************/


td {
	vertical-align: top;
	padding: 10px 10px 10px 10px;
	text-align: left;
}



/************ specific tables  ************/


 table.hours,  table.contact {
	margin: 0 0 0 50px;

}

 table.hours  tr td {
	font-size: 16px;
	line-height: 22px;
	padding: 5px 5px 7px 5px;
}


 table.hours  tr td.left1{
	width: 110px;

}

 table.hours  tr td.left{
	width: 190px;

}


 table.contact  tr td {
	font-size: 16px;
	padding: 5px 5px 5px 5px;
}

 table.contact  tr td.left{
	width: 70px;
	font-weight: bold;
}

 #main-inner-text table.contact  tr td.left a{
	border:none;
}

/**************************************  paddle boats *****************************************/

div.hirecost {
	margin: 0 0 30px 0;
}


/*********************************************** Links page  & bushwalking page***************************************/

#maincontent ul.linklist{
	padding: 10px 0 0 0;
	list-style-type: none; 
	margin: 0;
}


#maincontent ul.linklist li{
	padding: 0 0 25px 15px;
}


#maincontent ul.linklist h3 {
	font-size: 16px;
	font-weight: bold;
	padding: 0px 0 6px 0;
	margin: 0 0 0 0;
}


/*****************************************    contact page **************************************/
#maincontent .contactmap{
	margin: 20px 0 0 50px;
}

#maincontent .contactmap p {
	font-size:12px;
}

#maincontent .contacthosts{
	margin: 20px 0 0 50px;
}

#maincontent .contacthosts p {
	font-size:15px;
}

/*****************************************   Our Menu page **************************************/
#maincontent .menugroup {
	width: 530px;
	padding: 1px 0 1px 0;
	margin: 20px 0 25px 0;
}

#maincontent .menugroup h2 {
	margin: 20px 0px 20px 0px;
	background-color: #fcf2f2;
}

#maincontent .menugroup .menusub{
	color: #000000;
	
}


.kitch-box {
	border: 2px solid #C40000;
	padding: 0 0 0 20px;
	margin: 40px 0 0 0;
	width: 310px;
}


.kitch-box p {
	font-size: 26px;
	color:#581816;  
}

/***********************************************   photos page **************************************/




/* #maincontent { */
	/* adjust maincontent wrapper as we need a bit more room for the photos  */
/*	width: 622px; /* width is 672 minus any padding added */
/*	padding:1px 35px 1px 15px;  /* the 1px padding "uncollapses" the border of divs contained in the main content to make ie & firefox look the same  */
/* }   */

/* need to add back in padding for header  */


galleryright{
	width: 240px; 
}

.galleria{list-style:none;}
/*.galleria li{display:block;width:80px;height:80px;overflow:hidden;float:left;margin:0 10px 10px 0} */
.galleria li a{display:none}
/*.galleria li div{position:absolute;display:none;top:0;left:180px}
.galleria li div img{cursor:pointer}
.galleria li.active div img,.galleria li.active div{display:block} */
.galleria li img.thumb{cursor:pointer;top:auto;left:auto;display:block;width:auto;height:auto}
/* .galleria li .caption{display:block;padding-top:.5em;}  */
/* * html .galleria li div span{width:400px} /* MSIE bug */



.gallery_demo{width:240px;float:left;}
.gallery_demo li{display:block;overflow:hidden;float:left;width:70px;height:65px;border:3px double #eee;margin: 0 2px 2px 0;background:#eee;}
.gallery_demo li.hover{border-color:#bbb;}
.gallery_demo li.active{border-style:solid;border-color:#222;}
/* .gallery_demo li div{left:240px}
.gallery_demo li div .caption{font:italic 0.7em/1.4 georgia,serif;} */

#main_image{margin:0px 0 60px 0; padding:10px 0 1px 0; height: 576px; width:576px;background:#ffffff; text-align: center;}
#main_image img{margin-bottom:10px; padding: 3px; border: 1px solid #AE9090;}
#main_image span.caption{display:block;padding-top:15px}  /* captions will go under photo if displayed they use the "title" attribute from the img tag */



#photos .gallery-nav{width: 225px;  color:#BC342F; padding-top:20px; text-align: center; clear:both;}

#photos .gallery-nav a:link, .gallery-nav a:visited {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color:#BC342F;
	text-decoration:none;
	border-bottom: 1px solid #DD9997;  

}
#photos .gallery-nav a:active {
	text-decoration:none;

}

#photos .gallery-nav a:hover {
	border-bottom: 1px solid #AB8B8A;     
	color:#581816;  
	text-decoration:none;
}



/**************  footer **********************/



#footer {
	padding: 30px 0 1px 0 ;
	background: #FAF0E0 url(../images/footer.gif) repeat-x 0 0  ;
	text-align: center;
	width: 100%;
	min-width: 1038px;
} 

#footer-wrap {
	width:950px;
	margin:0 auto;
	text-align: left;
	min-height: 145px; height:auto !important; height: 145px;
}



#footer-rightcol {
	float:right;
	width:300px;  /* added to footer leftcol must equal footer-wrap  */
	text-align: right;
}



#footer-image{
	width: 300px;
	height: 172px;
	position: relative; /* Fixes clipping issue in IE 6 */
	margin: -138px 0 15px 0;
	text-align: right;
}

#footer-image img{
	width: 259px;
	height: 172px;
	margin: 0 20px 0 0;
}

#footer-rightcol p {
	font-size: 11px;
	margin: 5px 40px 0 0 ;
	padding: 0 0 0 0;
	line-height: normal;
	color: #581816;
}

#footer-leftcol {
	float:left;
	width:620px; /* added to right col plus padding must equal wrap  */
	color: #581816;
	font-weight: bold;
	line-height: 1.4;
	font-size: 16px;
	padding: 20px 10px 0 20px;
}


#footer-leftcol table td {
	padding: 0 0 10px 10px;
}

#footer-leftcol table td.opentime {
	vertical-align: bottom;
}





/*********************  miscellaneous  *******************/

.clearfloat { 
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
	}

.divider {
	clear:both;
	padding: 1px 0 1px 0; /* to uncollapse margins  */
	background: url(../images/divider.gif) 0 bottom repeat-x ; 
	font-size: 1px;
	height: 1px;
}


/************  stop skype reformatting phone nums in ie **************/
span.skype_pnh_container { display:none !important; }
span.skype_pnh_print_container { display:inline !important;}



/**********************************************   nav menu *****************************************************/
/* top menu navigation for bobbin Inn  (suckerfish) 
	includes multilevel dropdown - can add any number of levels of ul in html doc  */

#navbar {
	padding: 99px 1px 0 70px;
/*	width: 790px;  can't put a width on here as it breaks ie 6 */
	float: left;
}

.nav-fb {
	margin: 2px 0 0 40px;
}


#sfnav{
	float:left; 
	font-size:16px;
	font-family:  arial,helvetica,sans-serif;
	font-weight:normal;
	/*width:100%;	  can't put a width on here as it breaks ie 6 * */
	line-height: 32px;  /* this determines the height of the hover block on the main menu */
}

#sfnav {
	padding: 1px 0 0 0 ;
}


#sfnav a {
	display:block;
	color:#ffffff;  /* menu font colour  **/
	text-decoration:none;
	border: none;
	background: transparent;
}



#sfnav a {
	padding:0px 20px;  /* horizontal distance between menu items - equal on both sides  */
	background: transparent url(../images/menu-divider.gif) no-repeat right 1px;   
}



#sfnav li{
	float:left;
	padding:0 ;
	}


/* used for styling current menu item.  */
#sfnav li.selected{
	float:left;
	padding:0 ;
	background: url(../images/menu-selected.gif) repeat-x 0 0;    
	}

#sfnav ul {
	position:absolute;
	left:-999em; 
	height:auto;
	width:215px; /*  width of submenu  alter 1st 2nd and 4th rules below if this width changes*/
	font-weight:normal;
	margin:0;
	line-height:1;  
	border:0;
/*	border-bottom:1px solid #0c0202;  */
	z-index: 10; /* needed to keep menu on top of content behind. if probs with utube video or flash, use wmode="transparent" */
	}
#sfnav li li {  /* borders on individual li items  */
	width:214px;  /*subtract the border widths here from the width above */
	border-top:1px dotted #6C504F; 
/*	border-right:1px solid #0c0202;  /* this achieves a right border on the whole "box"  the layout works better to include it here rather than on the ul above */
	font-weight:normal;
	}
#sfnav li li a {
	padding:9px 10px 8px 15px;  /* space between items in dropdown and left and right padding  */
	width:189px;  /* this width should match width of submenu minus padding and borders  */
	font-size:13px;
	color:#ffffff;  /* link text colour - not seen as is overridden by hover  */
	background: transparent;  /* stops the top level menu divider image from showing on sub levels  */
	}

#sfnav li li li {
/*	border-top:1px dotted #4D4C7B;   /* add border top for each li in 2nd level menus only needed if we don't have the border on the top level menus */
}

/* left margin should be one pixel less than top ul width to hide the margin of first level box or the same as if you want the margin to show 
	top margin is the font size plus the top and bottom padding plus the 1 pixel of the style above */
#sfnav li ul ul {  /* 2nd level menus offset  */
	margin:-32px 0 0 214px;  /* top margin is the same value as the line height curently this is overridden by the below */
	}





#sfnav li li:hover,
#sfnav li li.sfhover {
	background: #581715;  /* hover background colour in dropdowns */
}


#sfnav li ul li:hover a, 
#sfnav li ul li li:hover a, 
#sfnav li ul li.sfhover a, 
#sfnav li ul li li.sfhover a
{
	color:#ffffff;  /* dropdown font hover colour  */
	}
#sfnav li:hover a, 
#sfnav li.sfhover a {
	color:#ffffff;  /* top level font hover colour  */
	}
#sfnav li:hover li a, 
#sfnav li li:hover li a, 
#sfnav li.sfhover li a, 
#sfnav li li.sfhover li a 
{
	color:#ffffff;  /* main font colour on the dropdown */
	}
#sfnav li:hover ul ul, 
#sfnav li:hover ul ul ul, 
#sfnav li.sfhover ul ul, 
#sfnav li.sfhover ul ul ul
{
	left:-999em;
	}
#sfnav li:hover ul, 
#sfnav li li:hover ul, 
#sfnav li li li:hover ul, 
#sfnav li.sfhover ul, 
#sfnav li li.sfhover ul, 
#sfnav li li li.sfhover ul 
 {
	left:auto;
	background: #360f0e; /* drop down block background colour */
/* 	margin-left: -1px; */
	}
#sfnav li:hover, 
#sfnav li.sfhover
{
/*	 background-color:#010043;  /* top level hover background colour  */
 background: url(../images/hover.gif) repeat-x 0 0;     


}



/* adjust this so the 2nd menu level items open out to the left rather than the right for menus near the edge  */
/*
#sfnav ul.nav_last {
	margin-left: -215px ;  
}

*/





/******************  print overrides  *******************/


 @media print {
	
	body {background:#ffffff;}
	
	#navbar, #rightcol, img, #footer-rightcol{ display : none; } 
	#header{
		background: #ffffff;
		width:800px;
		margin:0 ;
	}

	#main_image img {display: block;}  /* photo gallery image  */

	#wrap {width: 800px; margin: 0;}
	#midwrap  {
		width: 800px;
		padding: 0; 
	
	}
	#maincontent {
		float:left;
		width: 715px; 
		background:#ffffff ;
	}

	#main-inner {background: #ffffff;}
	#main-inner-text {padding: 0;}

	#footer-wrap, #footer{
		width:800px;
		height: 145px;
		background: #ffffff;
	}

	#footer-leftcol {
		width:700px; 
	}


}  /*** end of print over rides **/