/*
light grey #E5E5E5
grey/brown #403238
dark grey #2C2A32
dark dark grey #1D1C21
taupe #cdc4a5
light taupe #EDEADE
red #800000
light green #a8ccc9
dark green #445752
*/

html { margin: 0; padding: 0; height: 101%;  }
body { margin: 0; padding: 0; background: #403238 url('../_images/background.png') repeat-x; text-align: center; font-family: "Trebuchet MS",Tahoma,Arial,sans-serif; font-size: 1em; line-height: 1.1em; }
h1  { font-size: 1.5em; font-weight: bold; margin: 0 0 0.5em 0; border-bottom: 1px solid #FFF; padding: 0.25em 0 0.5em 0; }
h4 { padding: 1em 0 1em 0; }
p { padding: 0 0 1em 0; }
a,a:link,a:focus,a:active,a:visited { color: #000; }
a:hover { color: #333; }
label  { clear: both; width: 100%; display: block; font-size: 0.85em; }
dt { font-weight: bold; padding: 0.5em 0 0.5em 0; }
ul { list-style-type: none; margin-left: 1em; }
ul li { padding: 0.25em 0 0.25em 0; }

#page_container { clear: both; margin: 20px auto; width: 800px; text-align: left; border: 3px solid #cdc4a5; background-color: #cdc4a5; }

header { background-color: #403238; height: 80px; }
#rose_cottage  { background: #a8ccc9 url('../_images/rose-cottage-header-background.jpg') repeat-x; height: 80px; }
#logo { width: 127px; float: left; margin: 0 0 0 5px; }
#rose_cottage #logo { width: 241px; float: left; margin: 0; }
#heading { color: #FFF; font-size: 65px; font-family: "Angsana New","Trebuchet MS",Tahoma,Arial,sans-serif; line-height: 65px; width: 400px; float: left; padding: 3px 0 0 5px; }
#quick_contact { width: 200px; float: right; text-align: right; color: #cdc4a5; padding: 8px 10px 0 0; }
#rose_cottage  #quick_contact { width: 200px; float: right; text-align: right; line-height: 0.75em; color: #000; padding: 15px 10px 0 0; }

nav { width: 800px; float: left; background-color: #800000; border-top: 2px solid #cdc4a5; }
nav ul { margin: 0; padding: 0; list-style-type: none; }
nav ul li  { float: left; position: relative; padding: 0;  }
nav a  { padding: 10px 10px; font-size: 0.9em; text-align: center; text-decoration: none; color: #cdc4a5; display: block; }
nav a:link,nav a:visited { color: #cdc4a5; }
nav a:hover,nav a:focus,nav a:active,nav #selectedmenu { background-color: #2C2A32; color: #FFF; }

#rose_cottage_nav { width: 800px; float: left; background-color: #445752; border-top: 2px solid #cdc4a5; }
#rose_cottage_nav ul { margin: 0; padding: 0; list-style-type: none; }
#rose_cottage_nav ul li  { float: left; position: relative; padding: 0;  }
#rose_cottage_nav a  { padding: 10px 12px; font-size: 0.9em; text-align: center; text-decoration: none; color: #EDEADE; display: block; }
#rose_cottage_nav a:link,#rose_cottage_nav a:visited { color: #EDEADE; }
#rose_cottage_nav a:hover,#rose_cottage_nav a:focus,#rose_cottage_nav a:active,#rose_cottage_nav #selectedmenu { background-color: #2C2A32; color: #FFF; }

.slideshow { clear: both; border-top: 2px solid #cdc4a5; }
#lightbox { float: right; padding: 0 0 20px 20px; width: 250px; }
#lightbox  img{ float: right; clear: both; margin: 0 0 5px 0; }
#lighbox p { font-size: 0.75em; text-align: center; }

article { background-color: #EDEADE; margin: 0 0 5px 0; padding: 10px 20px; text-align: justify; }
#cta ul { list-style-type: none; }
.article_photo_right_land { float: right; padding: 0 0 20px 20px; width: 240px; }
.article_photo_right_land img { float: right; }
.article_photo_right_port { float: right; padding: 0 0 20px 20px; width: 170px; }
.article_photo_right_port img { float: right; }
.testimonial { clear: both; padding: 0.5em 0;  }
.testimonial .signature { font-style: italic; font-weight: bold; border-bottom: 1px dashed #7A7A7A;}
.event { clear: both; padding: 0.5em 0; width: 90%; }

label.error { color: #B0171F; position: relative; top: -3em; left: 5em; }
#contact_us { width: 900px; margin: 0 20px 20px 20px; }
#contact_us_form { float: left; width: 400px; }
#form_intro { clear: both; padding: 1em 0 0 0; }
#confirmation_msg { padding: 0.5em; color: #63152a; }
.form_input { width: 100%; clear: both; margin: 0.5em 0 0.5em 0; }
.form_input span { clear: both; font-size: 0.85em; }
.form_input_inline { float: left; margin: 0.5em 0 0.5em 0; }
#lastname { visibility: hidden; }
#privacy  { padding: 2em 0 0 0; font-size: 0.75em; }
#map { float: right; width: 300px; height: 300px; border: 1px solid #aaa; padding: 0 20px 1em 20px; }
.vcard { padding: 2em 0 1em 0; clear: both; }
.tel { padding: 0.5em 0 0.5em 0 }
.tel .type,.tel .value  { font-size: 1.3em; font-weight: bold; }
.submit-btn, .submit_btn  { background-color: #800000; color: #FFF; padding: 0.25em 1em 0.25em 1em; }
#submit_email_order_btn, #bank_transfer_btn, #continue_shopping_btn { background-color: #800000; color: #FFF; padding: 0.25em 1em 0.25em 1em; margin: 0.5em 0; }
.list_items { padding: 0.5em 1em 0.5em 2em; }
.list_items td { padding: 0.25em; vertical-align: top; }
.row_on { background-color: #EEE; }
.list_testimonial_name { padding: 0.25em 0.5em; }
.list_news_and_events_title { padding: 0.25em 0.5em; }
.list_product_photo { padding: 0.25em 0.5em; width: 30%; }
.list_product_name { padding: 0.25em 0.5em; width: 50%; }
.product_type_heading { width: 730px; background-color: #800000; font-size: 1.2em; color: #FFF; padding: 0.5em 0 0.5em 20px; }
.product_listing { clear: both; width: 730px; height: 250px; background-color: #D8CDBB; margin: 10px 0 30px 0; padding: 20px 0 0 20px; border: 1px solid #000; }
.product_photo { float: left; width: 150px; height: 200px; }
.product_details { float: left; width: 500px; padding: 1em 1em; }
.product_name { font-size: 1.2em; font-weight: bold; padding-bottom: 1em; }
.product_size { float: left; width: 150px; }
.product_quantity { float: left; width: 80px; }
.product_description { clear: both; padding-bottom: 1em; }
#cart { float: right; background: #EAE4DA; width: 200px; margin: 0.25em 0 1em 1em; padding: 1em 0 1em 2em; border: 1px solid #000000;}
#cart p  { margin: 0; padding: 0; float: left; width: 80px; }
#checkout { width: 100%; text-align: left; }
#checkout_cart { background-color: #EEE; width: 710px; padding: 0.5em 1em 0.5em 1em; margin-top: 1em; border: 1px solid #FFF; }
.checkout_row { clear: both; padding: 1em 0 1em 0; width: 100%;  }
.checkout_title_row div { font-weight: bold; font-size: 0.85em; padding: 0.5em 0.5em 0.5em 0em; }
.checkout_row div { padding: 0.5em 0.5em 0.5em 0em; }
.checkout_quantity { float: left; width: 70px; }
.checkout_name{ float: left; width: 250px; font-weight: bold; }
.checkout_price { float: left; width: 150px; }
.checkout_pandh { float: left; width: 70px; }
.checkout_button { float: left; width: 100px; }
#checkout_total { clear: both; width: 100%; font-weight: bold; font-size: 1.1em; padding: 0 0 1em 0; }
#payment_options { clear: both; padding: 1em 0 0 1em; }
#payment_options dt { padding: 1em 0 0 0; font-size: 1.2em; font-weight: bold; }
#payment_options dd { width: 650px; }
#cart_total { font-size: 1.1em; font-weight: bold; padding: 1em 0 0 170px; }
#size_help { font-size: 0.85em; }
.clear { clear: both; }
#home_page_news ul { margin-left: 0; }
#home_page_news li { min-height: 60px; clear: both; }
#home_page_news img { float: left; }
#home_page_news p { width: 400px; float: left; font-size: 0.85em; padding: 0 0 0 0.5em; }

#admin_form { margin: 3em 0 0 2em; }
#admin_toolbar { float: right; margin: 2em 0 0 0; }
#admin_toolbar a{ padding: 0 0.5em 0 0.5em; }
#progress_indicator { visibility: hidden; }

footer { clear: both; background-color: #2C2A32; font-size: 0.75em; color: #cdc4a5; text-align: center; padding: 10px 0 10px 0; } 
footer a, footer a:link, footer a:focus, footer a:active, footer a:visited { color: #cdc4a5; }
footer a:hover  { color: #E5E5E5; }

/* located in demo.css and creates a little calendar icon
 * instead of a text link for "Choose date"
 */
a.dp-choose-date {
	float: left;
	width: 16px;
	height: 16px;
	padding: 0;
	margin: 5px 3px 0;
	display: block;
	text-indent: -2000px;
	overflow: hidden;
	background: url(../_images/calendar.png) no-repeat; 
}
a.dp-choose-date.dp-disabled {
	background-position: 0 -20px;
	cursor: default;
}
/* makes the input field shorter once the date picker code
 * has run (to allow space for the calendar icon
 */
input.dp-applied {
	width: 140px;
	float: left;
}