/*
Theme Name: Red Lion.
Theme URI: http://www.redlionevenley.com/
Description: The village pub website, designed and developed April 2010.
Version: v4
Author: Rufus Denne
Author URI: http://www.rufus-denne.co.uk
Tags: red lion pub
*/

@import "style/css/reset.css";
@import "style/css/typography.css";
@import "style/css/layout.css";

/* 

colours.

dark - #242626

drk orange - #f26522
orange - #f7931e

drk grey - #58595b
med grey - #808285
lgt grey - #a7a9ac

*/

* {

margin:0;
padding:0;

} 

html, body, #wrapper {

height: 100%;

}

.clear {

clear: both;

}


/* 

Header styling.

*/

#loading {  

position:fixed;  
z-index: 10;
width:100%;
height: 100%;  
top:0;  
left:0;  
text-align:center;  
color: white;
font:lighter 20px georgia;  
text-transform: uppercase;
padding-top: 250px;
background-image: url(style/images/bg/load-bg.png);

} 

body {

background-image:url(style/images/bg/bg-standard.jpg);
background-repeat: repeat-x;
background-color: #efebe1;

}

#wrapper {

min-height: 100%;
height: auto !important;
height: 100%;
margin: 10px auto -200px;
width: 960px;

}

#logo-area {

background-image: url(style/images/logo/lion-logo.jpg);
width: 88px;
height: 101px;
position: absolute;
left: 60px;
z-index: 2;

}

#navigation {

background-image: url(style/images/bg/nav-bg.jpg);
width: 954px;
height: 30px;
margin: 0 3px 0 3px;
position: relative;
z-index: 1;
text-align: right;

}

ul.navigation {

width: 960px;
height: 30px;
text-align: right;

}

ul.navigation li {

display: inline;
list-style-type: none;
float: right;
background-color: #3f4243;
margin: 5px 18px 0 0;
padding: 2px 8px;
-moz-border-radius: 3px; 
-webkit-border-radius: 3px; 
border: 1px solid #808285;

}

ul.navigation li:hover {

background-color: #58595b;

}

ul.navigation li.current_page_item {

background-color: #58595b;

}

#image-container {

width: 960px;
height: 400px;
position: relative;
z-index: 0;
background-image: url(style/images/bg/shadow-bg.png);
background-repeat: no-repeat;
background-position: bottom;

}

#image {

width: 950px;
height: 390px;
position: relative;
z-index: 1;
margin: 0 5px 10px 5px;

}

br.big-break {
line-height: 30px;
}

/*

sidebar style

*/

#sidebar {

margin: 5px 0 10px 10px;
width: 250px;
height: auto;
float: left;
background-image: url(style/images/bg/transparent-bg.jpg);
border: 2px solid #d1d3d4;

}

.side-heading {

width: 240px;
height: auto;
margin: 20px 5px 10px 5px;
border-bottom: solid 1px #242626;
float: left;

}

.side-images-cont {

width: 234px;
height: auto;
float: left;
border: 2px solid #a7a9ac;
margin: 0 7px 0 7px;
float: left;

}

.side-image {

padding: 2px;
width: 226px;
height: auto;

}

.side-under-text {

float: left;
width: 230px;
height: auto;
margin: 10px 6px 0 10px;

}

.tabs {

float: left;
width: 226px;

}

.post-heading {

width: 214px;
background-color: #242626;
display: block;
text-decoration: none;
color: white;
font-size: 12px;
font-family: lucida grande;
text-transform: uppercase;
font-weight: lighter;
padding: 1px 0 1px 0;
float: left;


}

.post-heading:hover {

background: #000;

}

.post-small-content {

width: 207px;
margin: 3px 0 0 3px;
float: left;

}

.post {

float: left;
height: auto;
width: 214px;
margin-bottom: 4px;
padding-bottom: 3px;
border-bottom: solid 1px #a7a9ac;

}

.flickr_gallery {

width: 210px;
margin: 0 1px 5px 7px;
padding: 3px 3px 3px 0;
background-image: url(style/images/bg/black-transparent-bg.png);
border: solid 1px #a7a9ac;
float: left;
height: auto;

}

.flickr-image {

width: 60px;
float: left;
overflow: hidden;
margin: 2px 2px 2px 4px;
border: solid 2px #a7a9ac;
position: relative;

}

/* 

footer styling

*/

.push {
height: 200px;
}

#footer {

width: 100%;
background-color: #242626;
border-top: 3px solid #f7931e;
height: 200px;
clear: both;
margin: 0;
padding: 0;
} 

#footer-container {

width: 960px;
margin: 0 auto;
height: 200px;
position: relative;

}

#contact {

width: 160px;
margin: 45px 65px 0 20px;
height: 150px;
float: left;
font-family: Georgia;
position: relative;

}

.contact-google {

position: relative;
width: 950px;
height: 390px;
z-index: 1;
margin: 0 5px 10px 5px;
}

#ale {

width: 180px;
height: 220px;
float: left;
font-family: Georgia;
position: relative;
top: -20px;
margin-left: 35px;

}

#ale-image {

width: 120px;
height: 111px;
padding: 0 30px;
float: left;
position: relative;

}

#ale-text {

width: 180px;
height: 40px;
float: left;
position: relative;

}

.follow-us {

width: 200px;
margin: 45px 0 0 55px;
height: 150px;
float: left;
font-family: Georgia;
position: relative;

}

.follow {

width: 200px;
margin-top: 10px;
height: 32px;

}

p.follow-text {

font-family: Georgia;
font-weight: lighter;
font-size: 12px;
color: #666;
margin: 10px 0 0 0;

}

p.follow-text a {

color: #f26522;
text-decoration: underline;

}

p.follow-text a:hover {

text-decoration: none;

}

p a {

color: #f26522;
text-decoration: underline;

}

p a:hover {

text-decoration: none;

}

h3.popular-links {

margin: 0;
padding: 0;
font-size: 16px;
color: #f7931e;
font-weight: lighter;

}

#landlords-tweet {

height: 237px;
width: 190px;
float: left;
position: relative;
top: -37px;

}

#twitter-logo {

width: 18px;
float: left;
height: 45px;
margin-top: 10px;

}

#image-twitter {

height: 180px;
width: 190px;
padding: 0 10px;
float: left;
position: relative;

}

#landlords-message {

width: 190px;
position: relative;
height: 52px;
float: left;

}

#twitter-message {

width: 167px;
height: 47px;
float: left;
padding: 5px 0 0 5px;
position: relative;
font-family: lucida grande;
font-size: 8px;
color: #666;

}

#twitter-message a {

color: #f7931e;
text-decoration: underline;

}

#twitter-message a:hover {
text-decoration: none;
}

h3.contact {

margin: 0;
padding: 0;
font-size: 16px;
color: #f7931e;
font-weight: lighter;

}

p.para-contact {

font-family: Georgia;
font-weight: lighter;
font-size: 12px;
color: #666;
margin: 10px 0 0 0;

}

h4.contact-info {

font-family: Georgia;
font-weight: lighter;
font-size: 14px;
color: #f26522;
margin: 10px 0 0 0;

}

h4.contact-info a {

font-family: Georgia;
font-weight: lighter;
font-size: 14px;
color: #f26522;

}

h4.contact-info a:hover {

text-decoration: none;
}

/* 

text styling

*/

h1 {

font-family: Zapfino;
font-size: 24px;
color: #242626;
text-transform: capitalize;
font-weight: lighter;

}

.main-content p {

font-size: 14px;
color: #58595b;
font-family: Georgia;
text-decoration: none;

}

li a {

font-family: lucida grande;
font-size: 12px;
text-transform: capitalize;
text-decoration: none;
color: white;
font-weight: light;

}

h2.sidebar {

text-transform: uppercase;
padding: 0 0 0 5px;
font-weight: lighter;
color: #242626;
font-size: 16px;
text-transform: uppercase;
font-family: Georgia;

}

p {

font-size: 10px;
color: #a7a9ac;
font-family: lucida grande;
font-style: italic;

}

p a.sidebar-link {

color: #f7931e;
text-decoration: underline;

}

p a.sidebar-link:hover {

text-decoration: none;

}


h2.post-title {

color: white;
font-size: 12px;
font-family: lucida grande;
text-transform: uppercase;
font-weight: lighter;
padding: 1px 3px 1px 6px;

}

h2.post-title a {

color: white;
text-decoration: none;
font-style: normal;

}

h2.post-title a:hover {

color: white;
text-decoration: underline;
font-style: normal;

}

p.small-date {

color: #f26522;
padding: 2px 3px 0 3px;

}

.post-overview p {

padding: 0 3px;
color: #808285;
font-style: normal;

}

.post-overview-flickr p {

padding: 0 3px;
color: #808285;
font-style: normal;
float: left;
width: 200px;
margin: 0 0 0 5px;
font-style: italic;

}

/*

PAGE CONTENT

*/

#page-content {

float: left;
width: 655px; 
height: auto;
margin: 5px 0 0 20px;
padding: 10px;

}

.main-content {

height: auto;
margin: 20px 0 10px 0;

}

.date-cont {

font-size: 16px;
color: #f26522;
font-family: Georgia;
margin: 5px 0 20px 0;
text-transform: none;

}

.lion-divider {

float: left;
width: 583px; 
height: 22px;
margin: 20px 0 20px 20px;
background-image: url(style/images/bg/lion-break.png);
background-repeat: no-repeat;

}


/* 

TABBBBBBS

*/

ul.tabs {
margin: 0;
padding: 0;
float: left;
list-style: none;
height: 20px; /*--Set height of tabs--*/
width: 240px;
margin: 3px 5px 0 18px;

}

ul.tabs li {
float: left;
margin: 0;
padding: 0;
height: 19px; /*--Subtract 1px from the height of the unordered list--*/
line-height: 19px; /*--Vertically aligns the text within the tab--*/
overflow: hidden;
position: relative;
background: #f7931e;
margin: 0 6px 0 6px;
-moz-border-radius: 3px; 
-webkit-border-radius: 3px; 


}
ul.tabs li a {
text-decoration: none;
color: #000;
display: block;
font-size: 12px;
padding: 0 10px;
outline: none;
-moz-border-radius: 3px; 
-webkit-border-radius: 3px; 

}

ul.tabs li a:hover {
background: #f26522;
}
html ul.tabs li.active, html ul.tabs li.active a:hover  { /*--Makes sure that the active tab does not listen to the hover properties--*/
background: #f26522;

}

#tab1, #tab2 {
background-image: url(style/images/bg/black-transparent-bg.png);
border: solid 1px #a7a9ac;
margin-top: 10px;
height: auto;
width: 220px;
float: left;
margin-left: 7px;
}

.tab_container {
border-top: none;
overflow: hidden;
clear: both;
float: left; 
width: 240px;
height: auto;
margin: 0 5px 0 5px;
float: left;
}

.tab_content {
padding: 5px 0 0 5px;
font-size: 10px;
font-family: lucida grande;
font-style: italic;
color: #a7a9ac;

}

ul.next-prev-links li a {

font-family: lucida grande;
font-size: 11px;
text-decoration: underline;
color: #f7931e;
padding: 0 6px 10px 6px;
float: right;
}


/*

accordion

*/

#accordion-wrap {

background-image: url(style/images/bg/black-transparent-bg.png);
border: solid 1px #a7a9ac;
float: left;
height: auto;
width: 220px;
margin-left: 12px;
padding: 5px 0 5px 5px;
margin-bottom: 10px;

}

ul#menu, ul#menu ul {
list-style-type:none;
padding: 0;
float: left;
}

ul#menu a {
display: block;
text-decoration: none;
color: white;
height: auto;
font-size: 12px;
font-family: lucida grande;
text-transform: uppercase;
font-weight: lighter;
float: left;
width: 205px;	
}


ul#menu li {
color: white;
text-decoration: none;
font-style: normal;
}

ul#menu li a {
background: #242626;
color: #fff;	
margin: 2px 0;
padding: 2px 3px 2px 6px;

}

ul#menu li a:hover {
background: #000;
color: white;
text-decoration: underline;
font-style: normal;
}

ul#menu li ul li {
color: #808285;
font-style: normal;
margin: 0 0 0 5px;
font-size: 11px;
float: left;
width: 190px;
}

ul#menu li ul li.typical {

color: #f26522;

}