/*---------------------------------------------------------------------------
CSS for CARPENTERS ARMS
-----------------------------------------------------------------------------
-----------------------------------------------------------------------------
The first four styles are for the whole site and are designed to standardise
browser behaviour as much as possible
----------------------------------------------------------------------------*/

body, h1, h2, h3, h4, h5, h6, p, ol, ul, form, blockquote {
padding: 0;
margin: 0;
}

h1, h2, h3, h4, h5, h6 {
font-size: 1em;
}

a {
text-decoration: none;
}

a img {
border: none;
}

body {
font-family: Verdana, Geneva, Tahoma, Helvetica, sans-serif;
background-image: url(gallery/fiber6.jpg);
margin: 20px auto 20px auto;
border: 4px ridge #D5474C;
margin-bottom: 20px;
width: 1000px;
}

/*--------------------------------------------------------------
The wrapper is to allow a max and min width style and centre placement
The extra margin-bottom in body above is needed for IE
---------------------------------------------------------------*/

#awardtext {
float: left;
width: 480px;
height: 80px;
margin-top: 37px;
margin-left: 60px;
color: #C8D09C;
text-align: center;
font-size: 13px;
background-color: #D5474C;
border: 2px ridge #D5474C;
}

#awardtext p {
margin-top: 3px;
}

h1 {
background-image: url(gallery/name.png);
background-repeat: no-repeat;
background-position: bottom left;
background-color: #C8D09C;
padding: 200px 0 20px 0;
color: #D5474C;
}

h2 {
background-color: #D5474C;
padding: 10px 0 10px 30px;
border-bottom: 1px solid aqua;
border-top: 1px solid aqua;
color: #C8D09C;
}

h3 {
color: #D5474C;
background-color: #C8D09C;
border: 2px ridge #D5474C;
font-weight: bold;
text-align: center;
margin: 10px auto 0 auto;
width: 175px;
height: 20px;
}

.newcomer {
float: left;
}

.lunch {
float: left;
}

.logo {
float: right;
margin-top: 3px;
margin-right: 3px;
}

/*-------------------------------------------------------------------------
I've set a fixed height for the columns. Otherwise they will 
only grow as you add content and not be of even height
--------------------------------------------------------------------------*/

#leftbarhome {
background-image: url(gallery/candle.jpg);
background-repeat: no-repeat;
background-position: top left;
border-right: 1px solid #D5474C;
float: left;
height: 800px;
width: 230px;
padding-left: 5px;
margin-right: 5px;
}

#leftbarbeer {
background-image: url(gallery/bottles3.jpg);
background-repeat: no-repeat;
background-position: top left;
border-right: 1px solid #D5474C;
float: left;
height: 800px;
width: 230px;
padding-left: 5px;
margin-right: 5px;
}

#leftbarwine {
background-image: url(gallery/chandelier4.jpg);
background-repeat: no-repeat;
background-position: top left;
border-right: 1px solid #D5474C;
float: left;
height: 800px;
width: 230px;
padding-left: 5px;
margin-right: 5px;
}

#leftbarfood {
float: left;
height: 800px;
width: 230px;
padding-left: 5px;
margin-right: 5px;
}

#leftbarevents {
float: left;
height: 800px;
width: 230px;
padding-left: 5px;
margin-right: 5px;
}

#leftbargallery {
float: left;
height: 800px;
width: 230px;
padding-left: 5px;
margin-right: 5px;
}

#leftbarreviews {
background-image: url(gallery/trees1.jpg);
background-repeat: no-repeat;
background-position: top left;
float: left;
height: 800px;
width: 230px;
padding-left: 5px;
margin-right: 5px;
border-right: 1px solid #D5474C;
}

#leftbaremail {
background-image: url(gallery/sidebottle2.jpg);
background-repeat: no-repeat;
background-position: top left;
float: left;
height: 800px;
width: 230px;
padding-left: 5px;
margin-right: 5px;
border-right: 1px solid #D5474C;
}

#rightbarhome h3 {
height: 38px;
margin-top: 5px;
font-size: 95%;
}

#rightbarhome {
position: relative;
background-image: url(gallery/monks2.jpg);
background-repeat: no-repeat;
background-position: top left;
border-left: 1px solid #D5474C;
float: right;
height: 800px;
width: 230px;
padding-left: 5px;
margin-left: 10px;
}

#rightbarfood {
/*
background-image: url(gallery/sarah.png);
background-repeat: no-repeat;
background-position: left bottom;
*/
float: right;
height: 800px;
width: 230px;
padding-left: 5px;
margin-left: 10px;
}

#rightbarfood h3 {
margin-right: 32px;
}

#rightbarfood p {
margin: 5px 5px 20px 5px;
text-align: left;
line-height: 140%;
color: #FFF;
font-weight: normal;
font-size: 90%;
}

#rightbaremail {
background-image: url(gallery/sidebottle1.jpg);
background-repeat: no-repeat;
background-position: top right;
border-left: 1px solid #D5474C;
float: right;
height: 800px;
width: 230px;
padding-left: 5px;
margin-left: 10px;
}

#rightbaremail p {
margin: 5px 5px 20px 5px;
text-align: left;
line-height: 140%;
color: #FFF;
font-weight: normal;
font-size: 90%;
}

#rightbargallery {
float: right;
height: 800px;
width: 230px;
padding-left: 5px;
margin-left: 10px;
}

#rightbarreviews {
background-image: url(gallery/kraypanel1.jpg);
background-repeat: no-repeat;
background-position: top center;
float: right;
height: 800px;
width: 230px;
padding-left: 5px;
margin-left: 10px;
border-left: 1px solid #D5474C;
}

.textbox {
background-color: #D5474C;
margin: 20px auto 0 auto;
height: 550px;
width: 200px;
border: 1px solid #C8D09C;
}

/*------------------------------------------------------------------ 
navpanel styles are for the buttons on the left for the whole site
-------------------------------------------------------------------*/

.buttontext {
margin-left: -5px;
}

#sitenav {
text-align: left;
}

#sitenav ul {
list-style-type: none;
margin-top: 20px;
}

#sitenav li { 
background-color: #D5474C;
margin-left: 20px;
margin-bottom: 15px;
width: 88px;
}

#sitenav li a:link, #sitenav li a:visited {
background-image: url(gallery/navbut3.jpg);
background-repeat: no-repeat;
background-position: center center;
display: block;
padding: 13px 20px 13px 14px;
color: #C8D09C;
font-weight: bold;
}

#sitenav li a:hover {
background-image: url(gallery/navbut4.jpg);
background-repeat: no-repeat;
background-position: center center;
color: #D5474C;
}


/*----------------------------------------------------------------------------
The wrap is needed to make the maintext background picture fill the whole space
otherwise it is only as long as the text. The divs have to encompass the tallest
column on the page and then they become the same height. Good tip!
------------------------------------------------------------------------------*/ 

#wraphome {
background-image: url(gallery/homeback1.jpg);
background-repeat: no-repeat;
background-position: top center;
height: 800px;
}

#wrapbeer {
background-image: url(gallery/beerback5.jpg);
background-repeat: no-repeat;
background-position: center right;
height: 800px;
}

#wrapwine {
background-image: url(gallery/wineback1.jpg);
background-repeat: no-repeat;
background-position: top right;
height: 800px;
}

.flower {
float: right;
padding-right: 40px;
margin-top: 293px;
}

#wrapfood {
background-image: url(gallery/albert2010.jpg);
background-repeat: no-repeat;
background-position: center bottom;
height: 800px;
}

#wrapevents {
background-image: url(gallery/chandelier2.jpg);
background-repeat: no-repeat;
background-position: top right;
height: 800px;
}

#wrapgallery {
background-image: url(gallery/bar4.jpg);
background-repeat: no-repeat;
background-position: top left;
height: 800px;
}

#wrapreviews {
background-image: url(gallery/taps5.jpg);
background-repeat: no-repeat;
background-position: center center;
height: 800px;
}

#wrapemail {
background-image: url(gallery/bottles2.jpg);
background-repeat: no-repeat;
background-position: top right;
height: 800px;
}

#contenthome {
margin: 0 235px 0 235px;
}

#navreviews ul {
margin-top: 20px;
list-style-type: none;
}

#navreviews li { 
margin-left: 17px;
margin-bottom: 15px;
text-align: left;
}

#navreviews li a:link, #navreviews li a:visited {
background-image: url(gallery/gallbut1.jpg);
background-position: center center;
background-repeat: no-repeat;
padding: 14px 40px 15px 18px;
margin-right: 14px;
font-size: 14px;
display: block;
font-weight: bold;
color: #D5474C;
}

#navreviews li a:hover {
background-image: url(gallery/gallbut2.jpg);
background-repeat: no-repeat;
background-position: center center;
color: #C8D09C;
}


#navgallery ul {
margin-top: 20px;
list-style-type: none;
}

#navgallery li { 
margin-left: 10px;
margin-bottom: 15px;
text-align: left;
width: 210px;
}

#navgallery li a:link, #navgallery li a:visited {
background-image: url(gallery/gallbut1.jpg);
background-repeat: no-repeat;
background-position: center center;
padding: 13px 35px 13px 35px;
font-size: 15px;
font-weight: bold;
display: block;
color: #D5474C;
}

#navgallery li a:hover {
background-image: url(gallery/gallbut2.jpg);
background-repeat: no-repeat;
background-position: center center;
color: #C8D09C;
}

#contenthome p {
padding-top: 5px;
margin-left: 20px;
margin-right: 20px;
text-align: justify;
font-size: 13px;
font-weight: normal;
line-height: 135%;
color: #FFF;
}

#start h4 {
font-family: Vivaldi, Verdana, sans-serif;
color: #FF0066;
font-weight: bold;
font-size: 50px;
padding-right: 2px;
}

#contentbeer h4 {
margin-left: 500px;
color: #C8D09C;
font-size: 500%;
font-weight: bold;
}

#contentbeer h5 {
margin-top: 570px;
margin-left: 470px;
color: #C8D09C;
font-size: 150%;
font-weight: bold;
}

#contentwine h4 {
color: #D1333B;
font-size: 500%;
font-weight: bold;
margin-left: 470px;
}

#contentevents h4 {
color: #C8D09C;
font-size: 500%;
font-weight: bold;
margin-left: 370px;
}

#contentemail h4 {
color: #C8D09C;
font-size: 500%;
font-weight: bold;
margin-left: 370px;
}

#contentgallery h4 {
color: #D1333B;
font-size: 500%;
font-weight: bold;
margin-left: 330px;
}

#contentreviews h4 {
color: #D1333B;
font-size: 500%;
font-weight: bold;
margin-left: 340px;
}

#contentgallery p {
color: #FFF;
font-weight: bold;
margin-top: 300px;
}

#contentwine img {
position: relative;
right: -180px;
bottom: -30px;
}


/*-----------------------------------------------------------
email = styling for the email address on contact page
-------------------------------------------------------------*/

#email {
text-align: center;
}

#email ul {
padding-top: 40px;
padding-bottom: 20px;
list-style-type: none;
}

#email li {
padding-bottom: 22px;
font-weight: bold;
font-size: 90%;
text-decoration: none;
}

#email li a:link, #email li a:visited  {
background-image: url(gallery/emailbut1.jpg);
background-repeat: no-repeat;
background-position: center center;
border: 1px solid #000;
padding: 20px 40px 20px 40px;
text-align: center;
background-color: #D5474C;
color: #C8D09C;
border-color: #FFF;
border: 2px outset;
}

#email li a:hover {
border: 1px solid #000;
text-align: center;
color: #C8D09C;
border-color: #FFF;
border: 2px inset;
}

.formula, .equals {
color:  #D5474C;
font-size: 40%;
font-weight: bold;
}

#box1 {
background-image: url(gallery/krayalt2.jpg);
background-repeat: no-repeat;
margin-top: 10px;
margin-left: 20px;
border: 4px ridge #D5474C;
float: right;
width: 250px;
height: 224px;
}

#box1:hover {
background-image: url(gallery/krayalt5.jpg);
background-repeat: no-repeat;
margin-top: 10px;
margin-left: 20px;
border: 4px ridge #D5474C;
float: right;
width: 250px;
height: 224px;
}

#box1 p {
color: yellow;
text-align: center;
font-weight: bold;
margin-top: -5px;
}

#footer {
background-color: #C8D09C;
color: #D5474C;
clear: both;
width: 100%;
height: 150px;
}

#maptext {
font-size: 13px;
margin-left: 1px;
margin-top: -15px;
font-weight: normal;
color: #C8D09C;
}

#map {
float: right;
margin-top: 15px;
padding-left: 15px;
background-color: #D5474C;
color: #C8D09C;
height: 80px;
width: 221px;
font-size: 80%;
font-weight: normal;
padding-top: 25px;
padding-bottom: 17px;
}

#map a:link, #map a:visited {
background-image: url(gallery/navbut1.jpg);
background-repeat: no-repeat;
background-position: center center;
font-size: 13px;
padding: 14px 10px 14px 10px;
text-decoration: none;
border-color: #FFF;
border: 1px outset;
color: #FFF;
}

#map a:hover {
background-color: #4D0000;
padding: 15px 10px 15px 10px;
text-decoration: none;
border-color: #FFF;
border: 1px inset;
color: #FFFF00;
}

#adbox, #timebox {
margin-top: 15px;
float: left;
padding-left: 15px;
padding-top: 10px;
background-color: #D5474C;
color: #C8D09C;
height: 110px;
width: 221px;
font-weight: normal;
font-size: 13px;
}

#timebox {
width: 350px;
margin-left: 85px;
}

cite {
font-weight: bold;
color: #FF0066;
}

#webfather {
float: left;
margin-left: 140px;
margin-top: 98px;
}

#webfather img {
margin-bottom: -16px;
}


#webfather ul {
list-style-type: none;
}

#webfather li {
font-weight: normal;
font-size: 80%;
}

#webfather li a:link, #webfather li a:visited  {
text-decoration: none;
margin-right: 4px;
text-align: center;
}

#webfather li a:hover {
text-align: center;
}

#update p {
margin-top: 15px;
font-weight: normal;
font-size: 70%;
color: #FFFF00;
}