/*display:inline; - can be used for floats */

.no-print {}
.print-only {display:none;}

/* ========== STRUCTURE ========== */

body {
margin:2px 0 10px 0;
padding:0;
border:none; 
color:#0000c0;
font-size:100.1%;
background-color:#fff; 
text-align :center;} /* keep page centered in IE */

#wrapper { 
width:100%;
max-width:85%;
min-width:300px;
margin:0 auto; 
padding:0;
border:2px solid #0000c0; 
background-color:#ffc;
font-family:arial, helvetica, sans-serif;
font-size:0.9em;	
line-height:1.4em; 
overflow:hidden;
text-align :left;} /* resets alignment to compensate for 'text-align:center' */ 

#left-column { 
float:left;
width:18%; /* was 19% */
display:inline;
padding:0 5px 1em 5px; 
background-color:#ffc; 
text-align:left;}

#content {
float:right; 
width:75%; /* was 74% */ 
background-color:#fff;
padding:0.5em 1em 1em 1em;
border:1px solid #0000c0;
border-right:none;}

#header {
background-color:#ffc;
color:#0000c0; 
margin:0 auto;
text-align:center; 
padding-top:10px;}

#footer {
clear:both;
background-color:#ffc;
padding:0 0.5em 1em 0; 
font-size:0.75em;}

/* to increase the height of the page to fit the left nav */
#picture,
#full-page {
height:100em;}

#picture h3 {
margin-top:3em; }

/* ========== CENTER ========== */

.center {
display: block;
margin-left:auto;
margin-right:auto; 
text-align:center;
padding:0;}

/* ========== LEFT COLUMN AREA ========== */

/* navigation list styles */
#left-nav ul {
padding:0;}

#left-nav li { 
list-style:none; 
padding:0 0.5em 0.5em 0;
list-style-position:outside;
line-height:1.2em; 
text-align:left;}

/* ========== navigation styles in left column 
for heading "Ingleside Guest House, Lynton" ========== */
#left-nav p{ 
font-family:"Comic Sans MS",Arial,Helvetica,sans-serif;
text-align:center; 
margin:-0.5em auto 0 auto;
padding:.5em; 
font-weight:400; 
font-size:1.2em; 
line-height:130%}

#left-nav p a {
color:#0000c0; 
text-decoration:none;}

#left-nav p a:visited {
background-color:transparent;}

#left-nav p a:hover {
color:#0000c0; 
background-color:transparent;}

#left-nav p a:active {
color:#0000c0; 
background-color:transparent;}

#left-nav h3 {
padding:0;
margin:0;
line-height:1em;}

#left-nav ul {
padding:0.5em 0;
margin:0 0 0 0.5em;}

/* ========== HEADING STYLES ========== */

h1, h2, h3, h4,h5, h6, dt {
font-family:"Comic Sans MS",Arial,Helvetica,sans-serif;
color:#0000c0; 
background-color:inherit; 
text-align:left;
margin:1em 0;}

h1, .header1 {
font-size:175%;
font-weight:400;
text-align:center;}

.header1 {
margin:0; 
padding-bottom:0.5em;}

h2, .header2 {
font-size:140%;
font-weight:400;}

.header2 {
margin:0;
text-align:center; 
padding-bottom:0;}

h3, h4, dt, .heading3 {
font-size:120%;
line-height:1.3em;
font-weight:400;}

.header3 {
text-align:right; 
font-size:0.9em; 
margin:0 1em 0 0; 
padding-bottom:0;}

/* ========== MAIN CONTENT AREA ========== */

#content h1 {
margin:0;
padding:.5em;
text-align:center;
line-height:1.2em;}

#content h2 {
margin:0; 
padding:.5em 0 1.5em 0; 
text-align:center; 
line-height:1.2em;}

#content h3 {
text-align:left; 
font-size:1em; 
margin-top:0; 
font-weight:700;}

/* ========== FOOTER AREA ========== */

#row {
display:inline;}

#footer p { 
padding:0 0 1em 1em;}

#footer span.left {
float:left;
text-align:left;
padding-left:21%;
width:50%;}

#footer span.right {
float:right;
text-align:right;
width:25%;}

/* ========== VERTICAL NAVIGATION ========== */
a { 
color:#0000c0;
text-decoration:underline;
background-color:inherit;}

/* this is the only blue of this shade - #b2b2ec; is too light for visited text */
a:visited { 
color:#797ce9; 
text-decoration:underline;
background-color:inherit;}

a:hover { 
color:#0000c0;
text-decoration:none; 
background-color:#b2b2ec;}

a:active { 
color:#0000c0;
text-decoration:none; 
background-color:#b2b2ec;}

#faq #content a:visited {
color:#0000c0;}

/* ========== TEXT STYLES ========== */

p { 
font-size:0.9em; 
padding-bottom:0.5em;}

p.name {
line-height:1px; 
height:1px;}

/* to leave a larger gap than normal above the paragraph */
p.top-space {
padding:2em 0 0 0;}

li { 
font-size:0.9em;
padding-bottom:0.5em;}

.text-center {
text-align:center;}

.text-center-strong {
text-align:center; 
font-weight:700;}

.text-left {
float:left;
text-align:left;}

.text-right {
float:right;
text-align:right;}

em { 
font-family:"comic sans",serif; 
font-size:1.1em; 
font-style:italic;
font-weight:400;}

.strong {
font-family:Arial,Helvetica,sans-serif;
color:#0000c0; 
background-color:inherit; 
font-weight:700;}

.small {
font-size:0.85em;}

hr { 
border-width:0; 
color:#b2b2ec;
background-color:#b2b2ec;
height:1px;
margin-left:20%; 
margin-right:20%; 
margin-top:2em;}

/* Any questions? Just ask! */
.questions{
font-size:0.75em; 
text-align:right; 
padding:1em 0 0 0;}

/* return to top of page */
.top-of-page { 
text-align:right; 
font-size:0.75em; 
padding:0 0 0.5em 0;
font-style:italic;
float:right;}

.current-page { 
font-weight:700;} 

.indent3 {
margin-left:3em;}

.help {
border-bottom: 1px dotted #b2b2ec;
cursor:help;}

/* ========== LIST STYLES ========== */
/* style both the left padding and left margin of lists */
ul {
padding:0 0 0 0.3em;
margin-left:0.3em; 
list-style-position:outside;}

ul li {
line-height:1.2em; 
padding-left:0.1em;
margin-left:1px;}

.bullet-none { 
list-style:none;}

dt {
margin-bottom:0;}

dd {
font-size:0.9em;	
line-height:1.4em;}

.list-short li { 
padding-bottom:0.5em;}

#sitemap ul {
list-style:none;}

#sitemap #content ul li {
padding:0.5em 0 0 0; 
margin-left:2em;}

#sitemap #content ul li ul li{
margin-left:2em;}

/* ========== CONTACT US PAGE ========== */

#contact table p{
text-align:left;
line-height:1.5em; 
font-family:arial, helvetica, sans-serif; 
font-size:0.9em;
line-height:1.5em;}

/* ========== TARIFF PAGE ========== */

#tariff table { 
width:95%; 
margin:1em auto; 
padding:0; border-collapse:collapse;}

#tariff th { 
text-align:center;}

#tariff th,
#tariff td {
border:1px solid #b2b2ec; 
padding:2px 5px;}

#tariff td { 
text-align:center; 
vertical-align:middle; 
width:25%;}

#tariff tr { 
background-color:#ffffeb;}

#tariff .date { 
font-weight:700;
font-size:140%;
font-style:italic; 
text-align:center;}

/* ========== TEXT BOXES ========== */  

.box50, .box75, .box90, .box50l, .box75l, .box90l { 
text-align:center; 
border-top:2px outset #b2b2ec; 
border-left:2px outset #b2b2ec; 
border-bottom:3px inset #0000c0;
border-right:3px inset #0000c0; 
color:#0000c0; 
background-color :#ffffeb; 
padding:1em;
margin:1em auto; 
display:block;}

.box50 { width:50%;}
.box50l { width:50%; text-align:left;}

.box75 { width:75%;}
.box75l {width:75%; text-align:left;}

.box90 { width:90%;}
.box90l { width:90%; text-align:left;}

/* ========== IMAGES ========== */

/* ========== Image of Ingleside on left of header ========== */

#house { 
float:left; 
border-color:#ffc; 
width:218px; 
padding-top:0;} 
/* #ffc border color keeps link border from showing */
/* 218px is the width of the image */

#ingleside-title {
width:432px;
height:77px;
padding-top:10px;}

/* ========== Enjoy England Logos ========== */

#enjoy-england-logos { 
margin:0 auto;
padding:0;
text-align:center;} 	/* should centre the images */ 

#enjoy-england-logos img { 
border:1px solid #ffc;} 

#enjoy-england-logos a {
text-decoration:none;}

#enjoy-england-logos a span {
display:none;}

#enjoy-england-logos a:visited {
text-decoration:none;}

#enjoy-england-logos a:hover { 
background-color:#ffc;}

#enjoy-england-logos a:hover span {
display:block;
position:absolute; 
top:300px; 
left:220px; 
width:15em;
padding:2px;
margin:0.5em;
z-index:100;
color:#0000c0; 
background:#fff;
font:10px Verdana, sans-serif;
text-align:left; 
border:1px solid #0000c0;}

#enjoy-england-logos a:active {
text-decoration:none;}

/* ========== Other Images ========== */

/* border for all images */
.image,
div.float-left img, 
div.float-right img, 
div.float-center img,
.image-indexpage { 
padding:3px; margin:3px; 
background-color:#fff;
border-top:2px outset #b2b2ec; 
border-left:2px outset #b2b2ec; 
border-bottom:3px inset #0000c0; 
border-right:3px inset #0000c0;}	
 
/* border for small images in the nav column */
.image-thumbnail {
margin:2em auto;
display:block;
padding:2px; 
background-color:#fff;
border-top:1px outset #b2b2ec; 
border-left:1px outset #b2b2ec; 
border-bottom:2px inset #0000c0; 
border-right:2px inset #0000c0;}

/* left aligned div for images and captions */
div.float-left { 
float:left; 
margin:0; 
padding:0 1em 1em 0; 
text-align:center;
font-size:0.9em; 
font-family:"Courier New", Courier, monospace; 
line-height:130%;}

/* centered div for images and captions */
div.float-center { 
display:block;
margin:1em auto; 
text-align:center;
font-size:0.9em; 
font-family:"Courier New", Courier, monospace;
line-height:130%;}

/* right aligned div for images and captions */
div.float-right { 
float:right; 
margin:1em 0 1em 1em; 
padding:0 0 1em 1em; 
text-align:center;
font-size:0.9em; 
font-family:"Courier New", Courier, monospace;
line-height:130%;}

/* vignettes / thumbnails */
.image-no-frame-left {
float:left;
padding:1em; 
text-align:center;} 

.image-no-frame-right {
float:right;
padding:1em; 
text-align:center;}

.image-no-frame-center {
display: block;
margin-left: auto;
margin-right: auto;
text-align:center;} 

.caption { 
font-size:0.75em;
line-height:1em; 
font-style:italic; 
margin-left:auto;
margin-right:auto; 
font-weight:550;}

/* decorative line used to clear all page */
.line300clear {
display:block; 
clear:both;
margin:0 auto; 
width:300px; 
height:1px; 
padding:1em; 
overflow:hidden;}

/* decorative line used to separate sections on a page */
.line300 {
margin:0 auto; 
display:block; 
width:300px; 
height:1px; 
padding:1em;}

/* ========== CLEAR ========== */

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

.clear-left { 
clear:left;
height:1px;
overflow:hidden;}

.clear-right { 
clear:right;
height:1px;
overflow:hidden;}

/* ***** ROLLOVER IMAGES ***** */

.thumbnail{
position: relative;
z-index: 0;}

.thumbnail img{
border:0;}

.thumbnail:hover{
background-color: transparent;
z-index: 50;}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color:#fff;
padding: 5px;
left: -1000px;
border: 1px solid #797ce9;
visibility: hidden;
color: black;
text-decoration: none;
font-size:0.75em;
line-height:1em; 
/*font-style:italic;*/
font-weight:550;}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;}

/* this may need to be specifically styles for individual pages or even images */
.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: -90px;
left: 40px;} /*position of enlarged image */