/*Screen stylesheet for www.moonboats.co.uk 
Contents
1. Body
2. Sidebar
3. Main content in vaguely top to bottom order
4. Typography
5. Links
6. Tables
*/

*{
margin:0;
padding:0;
border:0;
}

body {
	padding:0 0 10px;
	text-align:center;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:80%;
	color:#333;
	background:#060 url(../images/common/bodybg.jpg) repeat-x center top;
	font-weight: normal;
}

#container {
width:960px;
margin:0 auto;
background:#ffc url(../images/common/containerbg.jpg) repeat-y;
}

#banner {
	height:244px;
	width:auto;
	background-image: url(../images/common/bannerfinal.jpg);
}

#banner a {
	display:block;
	height:244px;
	background-image:url(../images/common/banner2.jpg);
	text-decoration:none;
}

/*-------------Sidebar ------------------*/

#sidebar {
float:left;
width:139px;
}

#sidebartop {
height:60px;
margin-left:35px;
background:url(../images/common/sidebartop.gif) no-repeat top;
}
				 
#sidebar img {margin-top:20px;}
		 
.buttonscontainer {
margin-left:35px;
width:102px;
border-right:1px solid;
border-left:1px solid;
border-color:#333;
background-color: #fc3;
padding-top:1px;
}

.buttons a:link,.buttons a:visited {
color: #000;
background-color: #fc3;
font: 1.1em Arial, sans-serif;
font-weight: bold;
text-align: left;
text-decoration: none;
overflow:hidden;      
display: block;
width:95px;
padding:3px 0 1px 5px;
margin-top:1px;
border:1px solid #fc3;      
}	
	 	 
.buttons a:hover,.buttons a:link.active,.buttons a:visited.active {
border-color:#c90 #f90 #ff9 #f90;
color:#000;		
}

.buttons a:hover {
background-color: #feda15;
text-decoration:none;}
	
.buttons a:link.active,.buttons a:visited.active {background-color: #f90;}

#thispage {color:#f00;}    

#sidebarbottom {
height:30px;
background-image:url(../images/common/sidebarbottom.gif);
margin-left:35px;
}

/*-----------End of sidebar stuff, start of main container stuff-----*/

#contentcontainer {
margin:0 34px 0 154px;
}

/* hide hack from Mac-IE5 \*/
* html #contentcontainer { height: 1%; }
/* end hiding */
		
#content {				  
padding:10px 0 0 0;		
background:#cf9 url(../images/common/contenttop.gif) no-repeat top;
}

#blurb {			  
border:solid #693;
border-width:0 1px;
background:url(../images/common/blurbbg.gif) repeat-y;	
}

/* hide hack from Mac-IE5 \*/
* html #blurb{ height: 1%; }
/* end hiding */

/*-----------tabs-----*/

#extratab {
width:720px; 
margin:0 auto;
}


#nav {
font:bold 1.1em Arial, sans-serif;
background:url(../images/common/tabbottom.gif) repeat-x left bottom;
width:772px;
float:left;	
}

#nav ul {
margin:0;
list-style:none;
padding:10px 10px 0 10px;
}

#nav a, #nav strong, #nav span {
float:left;
display:block;
color:#666;
padding:5px 20px 5px 11px;
background: url(../images/common/tab.png) no-repeat 100% 0px;
text-decoration:none
}

/* Commented Backslash Hack hides rule from IE5-Mac \*/
#nav a {float:none;}
/* End IE5-Mac hack */

#nav li {
float:left;
background:url(../images/common/tab.png) no-repeat 0px 0px;
margin:0 1px;
padding:0 0 0 9px;
}

#nav #current {
background:url(../images/common/tab.png) no-repeat 0 -41px;
}

#nav #current a {
background:url(../images/common/tab.png) no-repeat 100% -41px;
padding:7px 20px 5px 11px;
color:#000;
}

#nav a:hover {
color:#000;
}


/*-----------End of tab stuff-----*/

.teaser {
	width:720px;
	padding-bottom:15px;
	background:#ffc url(../images/common/teaserboxbg.gif) no-repeat bottom left;
	margin-top: 10px;
	margin-right: auto;
	margin-bottom: 10px;
	margin-left: auto;
}

.teaser h1 {
margin:0;
padding:10px 20px 0 20px;
background:url(../images/common/teaserboxbg.gif) no-repeat top left;
}

.teaser h1.teaser h2,.teaser p,.teaser div{
background-color:#ffc;
border-width:0 1px;
border-style:solid;
border-color:#060;
}

.teaser #credit {border:none}

#picrow img {margin:0 5px 10px 6px;}

.new {
width:678px;
margin:0 auto;
padding:10px 20px 10px;
}

.new h3 {
font-size:1.1em;
margin:0;
color:#060;
}

.largehead {
height:30px;
background:url(../images/common/raquel.jpg) no-repeat top left;
margin:0 20px ;
padding:5px 0 0 15px;
}

.dropshadow {
background: url(../images/common/shadow.gif) bottom right;
margin: 20px auto;
position: relative;
}/*WIDTH = IMG WIDTH + 26px*/

.dropshadow img {
background-color: #fff;
border: 1px solid #000;
margin: -7px 7px 7px -7px;
padding: 12px;
position: relative;
vertical-align: bottom;
}

.textbox {
background:url(../images/common/textboxbg3.jpg) repeat-x top;
margin:0 19px 10px;
border-bottom:2px solid #bfe777;
border-right:1px solid #bfe777;
padding-top:10px;
}

#credit  {
width:550px;
background:url(../images/common/credit.gif) no-repeat;
padding:50px 0 10px;		
font-size:0.85em;		
margin:10px auto 0;		
}

blockquote {
margin:5px 10px 10px 10px;
padding:5px 5px 10px 5px;
background-color:#ffc;
border:1px solid #060;
}        

#tops  {margin:5px auto 0}

#counter  {
width:660px;
height:15px;
margin:5px auto;
}

.divider{
height:30px;
background:url(../images/common/dividerbg.gif) no-repeat center top;
margin:10px 0;
}

.clear {
clear:both;
height:1px;
overflow:hidden;
}

.hide { width:700px;}

#contentbottom {		
height:20px;
background:url(../images/common/contentbottom.gif) no-repeat bottom;
}	

#footer {
clear:both;
height:20px;
background:url(../images/common/containerbottom.jpg) no-repeat center;
}

/*--------------------------------- typography -------------------------------------*/

p {    
font-size: 1em;
color: #000;
text-align: justify;
padding:5px 20px;
}

.left {
position: absolute;
left:-200000px;
font-size:0.1em;
}

.copyright {
font-size:0.7em;
color:#9c6;
text-align:right;
padding:0 20px;
}

h1 {
	font-size: 1.2em;
	font-weight: normal;
	color: #060;
	text-align: justify;
	margin:0 20px 10px 20px;
}

.right {
float:right;
font-weight:normal;
font-size:0.9em;
margin-right:10px;
}

.right a {font-weight:bold;}

.title {
font-size:1.4em;
line-height:24px;
background:url(../images/common/h1bg.gif) no-repeat left;
padding-left:50px;
margin: 2px 10px 2px 20px;
}

h2 {
font-size: 1.1em;
font-weight: bold;
color: #060;
text-align: justify;
margin: 0 10px 2px 20px;
}

h3 {
	font-size: 1em;
	text-align: justify;
	margin: 2px 10px 2px 20px;
	font-weight: normal;
}

/*-------------------------- links -------------------------------------*/

a:link  {
color:#f33;
text-decoration: none;		
}

a:active {
color:#f33;
text-decoration: none;
}

a:visited {
color:#f33;
text-decoration: none;
}

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

/*--------------------- tables-------------------------------------*/

/*smaller photos on index page*/	

#smallsnaps {
width:720px;
margin:10px auto 0;
}

#smallsnaps td {text-align:center;
padding-left:14px;}/*to account for the drop shadow*/

#smallsnaps .dropshadow {margin:10px auto 0;}

#smallsnaps p {
text-align:center;
padding:0;
font-size:0.9em;
font-weight:bold;
margin-right:14px;/*to account for the drop shadow*/
}

/*---------------------------- availability -------------------------------------*/		

#calendar {
width:450px;
margin:-3px auto;
background-color:#ffc;
border-left:1px solid #fc0;
border-right:1px solid #fc0;
}
	 

#calendar table {
background-image:url(../images/calendar/monthbg.gif);
background-position:top;
background-repeat:no-repeat;
margin:0 auto 8px;
width:422px;
} 

#calendar h2{margin: 0 10px}	

#calendar td {
width:53px;
border: 1px solid #696;
font-family:Arial, Helvetica, sans-serif;
font-size:1.1em;
font-weight:bold;
background-position:center;
}

.month {
margin:0 auto;
width:422px;
background-image:url(../images/calendar/monthbg2.gif);
background-repeat:no-repeat;
background-position:bottom;
}


.day {
color:#060;
background-color:#ff9;
}

.unbooked {background-color:#fff;}	

.maybe {background-color:#fc0;}

.maybeout {background-image:url(../images/calendar/maybeout.gif);		 }

.maybeback {background-image:url(../images/calendar/maybeback.gif);}

.maybebackbookedout {background-image:url(../images/calendar/maybebackbookedout.gif);}

.booked {
background-color:#f00;
color: #ccc;
}	

.bookedout {background-image:url(../images/calendar/out.gif);}	

.bookedback {background-image:url(../images/calendar/back.gif);}

.bookedbackmaybeout {background-image:url(../images/calendar/bookedbackmaybeout.gif);}

.blank {background-color:#ccc;}	

/*--------------------------------- Prices Table -------------------------------------*/

#price	{
border-left: 1px solid #666;
border-right: 1px solid #666;
background-color:#fc0;
width:550px;
margin:-3px auto 0;
}

#price table {
background-color:#fff;
background-image:url(../images/prices/tablebg.gif);
background-position:top;
background-repeat:no-repeat;
margin:0 auto -3px;
padding:0 1px;
width:550px;
} 	

#price td {
width:174px;
/*border: 1px solid #696;*/
font-size:1.1em;
font-weight:bold;
padding:2px 0 2px 5px;
}



.dates {text-align:left;
border: 1px solid #696;}

.price{border: 1px solid #696;}	

/*--------------- Booking Form-------------------------------------*/

#bookform {
font-family: Arial, Helvetica, sans-serif;     
margin:auto;
padding:0 15px;
}

#bookform h1 {margin:2px 0}

#bookform table{
color: #000;
background-color:#fff;
border:1px solid #666;
text-align: left;
}

#bookform table td {
font-size: 1em;
color: #000;
text-align: justify;
padding:2px 10px;
border:1px solid #999;
height:20px;
}

/*-------------------------------------------contact form -------------------------------------*/	

fieldset {
border-width:1px 0;		 
border-style:solid;
border-color:#060;
width: 500px;
margin:0 auto;
padding:10px 0;
background-color:#fff;
text-align:center;
}

#formheader {
width: 500px;
background-color:#fc3;
margin:20px auto 0;
border-width:1px 1px 0 1px;		 
border-style:solid;
border-color:#060;
}/*Bizarrely this goes first*/

.input-box{		
margin:0 auto 10px;
padding:0 5px;
color: #000;
background: #ffc;
border: #060 solid 1px;
}

textarea {		
color: #000;
background: #ffc;
border: #060 solid 1px;
padding:5px;
}

.pushbutton {         
width:100px;
margin:0 7px;	
border:outset 1px #ccc;         
font-weight:bold;
background-color:#fc3;			 
}
		 
.simply_superior {
	font-family: "Lucida Handwriting";
	font-size: 16px;
}
