/* 
	Title: Hungrybrowser - Global style sheet
	Description: Contains all the custom styling for the mmk website
	Client: MMK
	Date: 05/12/2006
	Version 1.01
	Author: Ben Ellis
*/


/* ------------------------------------------------------------
	Container
---------------------------------------------------------------- */

#container {
	width: 955px;
	text-align: left;
	margin: 0px auto;
}

#popup {
	width: 760px;
	text-align: left;
	margin: 0px auto;
}

/* ------------------------------------------------------------
	Header
---------------------------------------------------------------- */

#header {
	width: 955px;
	height: 173px;
	padding: 0px;
	margin: 0px 0px 0px 0px;
	position: relative;
	z-index: 100;
	background-color: #011E0D;
}

#popup #header {
	width: 760px;
	height: 120px;
}

/* Styles the logo */

#header h1 {
	position: absolute;
	top: 15px;
	left: 0px;
	width: 262px;
	height: 84px;
	margin: 0px;
}

#header h1 a {
	text-indent:  -10000px;
	display:block;
	width: 265px;
	height: 90px;
	background: url("../img/logo.gif") 0px 0px no-repeat;
}

#popup #header h1 {
	left: 30px;
}

/* ------------------------------------------------------------
	Sub-header
---------------------------------------------------------------- */

#sub_header {
	position: absolute;
	top: 8px;
	right: 0px;
	width: 650px;
	text-align: right;
	margin: 0px;
}

/* Tag line */

#sub_header h2 {
	margin: 0px;
	font-size: 115%;
	color: #FFFFFF;
}

/* List 1 */

#list_1 {
	position: absolute;
	top: 20px;
	right: 0px;
}

/* List 2 */

#list_2 {
	position: absolute;
	top: 60px;
	right: 0px;
}

/* Phone number */

#sub_header h3 {
	margin: 0px;
	font-size: 115%;
	font-weight:  bold;
	color: #FFFFFF;
	margin: 0px 0px 5px 0px;
}

/* Buttons */

#sub_header ul {
	text-align: right;
	margin: 5px 0px 0px 0px;
}

#sub_header ul li, #sub_header ul li a {
	display:  block;
	float: left;
	padding: 0px;
	margin: 0px;
	height:  33px;
	line-height: 30px;
	color:  #CCCCCC;
	text-align: center;
	font-size: 93%;
}

#sub_header ul li a {
	margin-left: 4px;
	text-decoration: none;
}

#sub_header ul li a:hover, #sub_header ul li a:focus, #sub_header ul li a:visited {
	text-decoration:  none;
	color:  #FFFFFF;
}

/* Button 1: Request a tailormade holiday */

#sub_header ul li#button_1 a {
	width: 172px;
	background: url("../img/button_1_bg.gif") 0px 0px no-repeat;
}

/* Button 2: Map search */

#sub_header ul li#button_2 a {
	width: 172px;
	background: url("../img/button_2_bg.gif") 0px 0px no-repeat;
}

/* Button 3: Newsletter */

#sub_header ul li#button_3 a {
	width: 92px;
	background: url("../img/button_3_bg.gif") 0px 0px no-repeat;
}

/* Hover states for all buttons */

#sub_header ul li#button_1 a:hover, #sub_header ul li#button_1 a:focus,
#sub_header ul li#button_2 a:hover, #sub_header ul li#button_2 a:focus,
#sub_header ul li#button_3 a:hover, #sub_header ul li#button_3 a:focus {
	background-position: 0px -33px;
}

/* Search form */

#sub_header form, #sub_header fieldset {
	background-color: transparent;
	padding:  0px;
	margin: 0px;
	border:  none;
}

#sub_header form {
	padding:  1px 0px 0px 0px;
}

#sub_header legend {
	display:  none;
}

#sub_header button {
	background: url("../img/search_button_bg.gif") 0px 0px no-repeat;
	margin: 0px;
	padding: 5px 0px 6px 0px;
	width: 72px;
	color: #FFFFFF;
	text-align: center;
	font-size: 93%;
	font-weight: normal;
}

#sub_header button:hover, #sub_header button:focus {
	background-position: 0px -56px;
}

#sub_header input {
	border: 1px #000000 solid;
}

/* ------------------------------------------------------------
	Breadcrumb
---------------------------------------------------------------- */

ul#breadcrumb, ul#breadcrumb li {
	margin: 0px;
	padding: 0px;
	background-color: #053718;
}

ul#breadcrumb {
	position: absolute;
	z-index: 0;
	top: 158px;
	clear: both;
	font-size: 80%;
	width: 940px;
	padding: 0px 0px 0px 15px;
	letter-spacing: 0.5px;
}

ul#breadcrumb li {
	display: inline;
	margin: 0px 2px 0px 2px;
	color: #CCCCCC;
}

ul#breadcrumb li a, ul#breadcrumb li a:hover, ul#breadcrumb li a:visited {
	padding-right: 11px;
	color: #CCCCCC;
}

ul#breadcrumb li a {
	background: url("../img/breadcrumb_bg.gif") center right no-repeat;
}

/* ------------------------------------------------------------
	Language selector
---------------------------------------------------------------- */

#language_selector {
	position: absolute;
	z-index: 0;
	top: 157px;
	right: 0px;
	clear: both;
	color: #FFFFFF;
	font-size: 80%;
	text-align:  right;
}

#language_selector ul {
	background-color: #053718;
	padding: 4px 0px 0px 0px;
}

#language_selector ul li {
	float: left;
}

#language_selector ul li a {
	border: 1px #053718 solid;
	display: block;
	width: 17px;
	height: 12px;
	margin: 0px 0px 0px 4px;
	padding: 0px;
}

#language_selector ul li a:hover {
	border-color: #FFFFFF;
}

/* ------------------------------------------------------------
	Footer area
---------------------------------------------------------------- */

#footer {
	clear: both;
	color: #FFFFFF;
	padding: 0px;
	margin: 10px 0px 0px 0px;
	text-align: center;
	font-size: 85%;
}

#footer #footer_nav {
	font-size: 120%;
}

#footer ul li {
	display: inline;
	border-left: 1px #CCCCCC solid;
	padding: 0px 2px 0px 7px;
	white-space: nowrap;
}

#footer ul li.first {
	border: none;
}

#footer ul, #footer p {
	margin: 10px 0px 10px 0px;
}

#footer a {
	color: #FFFFFF;
}

#footer img {
	margin: 0px 3px 0px 0px;
}

/* ------------------------------------------------------------
	Navigation
---------------------------------------------------------------- */

/* Styles the top level navigation */

ul#nav, ul#nav li {
	font-size: 95%;
	font-family: Arial, Helvetica, Verdana, sans-serif;
	padding: 0px;
	margin: 0px;
	list-style: none;
	list-style-type: none;
}

ul#nav {
	margin: 0px;
	position: relative;
	z-index: 1;
	top: 117px;
	left:  0px;
	display: block;
	background: #053718 url("../img/nav_bg.gif") bottom left no-repeat;
	clear: both;
	width: 955px;
	height: 40px;
	border-top: 1px #011C0C solid;
}

ul#nav li {
	float: left;
	position: relative;
}

ul#nav li a {
	display: block;
	text-align: center;
	background-color: #053718;
	text-decoration: none;
	color: #EEEEEE;
	/*width: 135.4px;*/
	padding: 8px 15px 7px 15px;
	margin: 0px 0px 0px 0px;
	border-left: 1px #022C12 solid;
}

ul#nav li a:hover, ul#nav li a:focus, ul#nav li.active a {
	background-color: #085024;
	color: #FFFFFF;
}

ul#nav li.active a {
	background-color: #085024;
	color: #FFFFFF;
}

ul#nav li a.first, ul#nav li.active a.first {
	border-left: none;
}

/* Second level navigation */

ul#nav li ul {
	display: none;
	width: 165px;
	position: absolute;
	top: 100%;
	left: 0px;
	padding: 0px;
	margin: 0px;
}

ul#nav li>ul {
	top: auto;
	left: auto;
}

ul#nav li li {
	display: block;
	float: none;
	padding: 0px;
	margin: 0px;
}

ul#nav li:hover ul, ul#nav li.over ul {
	display: block;
}

ul#nav ul li a, ul#nav li.active ul li a {
	width: 200px;
	background-image: none;
	background-color: #085024;
	border-top: none;
	border-right: 1px #022C12 solid;
	border-bottom: 1px #022C12 solid;
	border-left: 1px #022C12 solid;
	height: auto;
	font-size: 90%;
	line-height: 15px;
	padding: 2px 0px 2px 5px;
	margin: 0px 0px 0px 0px;
	text-align: left;
	color: #EEEEEE;
}

ul#nav ul li a:hover, ul#nav li.active ul li a:hover {
	background: #0B6C30;
	color: #FFFFFF;
	border-top: none;
}

ul#nav ul li.first a, ul#nav ul li.first a:hover, ul#nav li.active ul li.first a {
	/*border-top: 1px #E5E0CA solid;*/
}

/* ------------------------------------------------------------
	Section page
---------------------------------------------------------------- */

#section_heading {
	background-color: #DFDBD1;
	overflow: auto;
	padding: 24px 20px 19px 15px;
}

#section_heading h1 {
	float: left;
	background: url("../img/section_header_bg.gif") 0px 0px no-repeat;
	margin: 0px;
	padding: 0px 0px 2px 35px;
	width: 300px;
	font-weight: bold;
}

#section_heading h2 {
	float: right;
	margin: 3px 0px 0px 0px;
	padding: 0px;
}

#section_sub_heading {
	padding: 24px 20px 19px 20px;
	margin: 0px 0px 20px 0px;
	background-color: #FFFFFF;
	border-bottom: 1px #DFDBD1 solid;
}

#section h3.heading_3 {
	font-size: 140%;
	line-height: 22px;
	color: #333333;
	font-weight: normal;
}

#section_body {
	width: 500px;
	float: left;
	margin: 0px 0px 0px 20px;
}

/* ------------------------------------------------------------
	Content area
---------------------------------------------------------------- */

/* Styles the content div */

#content {
	margin: 0px;
	padding:  20px 30px 20px 30px;
	clear: both;
	background-color: #FFFFFF;
	overflow: auto;
}

/* Styles the content div for section pages */

#section #content {
	margin: 0px;
	padding:  0px 0px 20px 0px;
	clear: both;
	background-color: #FAF8F2;
	overflow: auto;
}

/* Styles the content div for section pages */

#content_page #content {
	padding-right: 0px;
}

/* ------------------------------------------------------------
	Headings
---------------------------------------------------------------- */

h1.heading_1 {
	background: url("../img/heading_1_bg.gif") 0px 0px no-repeat;
	padding: 0px 0px 2px 35px;
	width: 400px;
}

/* ------------------------------------------------------------
	Column 1
---------------------------------------------------------------- */

#column1 {
	margin: 0px;
	float: left;
	width: 475px;
	min-height: 500px;
}

#column1.wide {
	float: none;
	width: 100%;
}

#popup .scroller {
	height: auto;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	overflow: inherit;
}

/* ------------------------------------------------------------
	Column 2
---------------------------------------------------------------- */

/* Container */

#column2 {
	float: right;
	width: 350px;
}

#column2.dark {
	margin: 0px 20px 0px 0px;
}

#column2.light {
	margin: 0px 40px 0px 0px;
}

#column2 img {
    border: 1px #999999 solid;  
}

#column2 #locationMap img {
	width: 297px;
	height: 200px;
	display: block;
	margin: 0px 0px 5px 35px;
}

#column2 #locationMap li a {
	border: none;
}

/* ------------------------------------------------------------
	Column 2 headings
---------------------------------------------------------------- */

#column2 h3 {
	margin: 0px 0px 10px 0px;
	padding: 5px 0px 7px 40px;
	color: #FFFFFF;
	font-size: 112.5%;
	font-weight: normal;
}

#column2 h3.header_1 {
	background: url("../img/column_2_heading_1_bg.gif") 0px 0px no-repeat;
}

#column2 h3.header_2 {
	background: url("../img/column_2_heading_2_bg.gif") 0px 0px no-repeat;
}

#column2 h3.header_3 {
	background: url("../img/column_2_heading_3_bg.gif") 0px 0px no-repeat;
}

/* ------------------------------------------------------------
	Column 2 links
---------------------------------------------------------------- */

/* Standard links */

#column1 ul, #column1 ul ul, #column1 ul li, #column1 li li,
#column2 ul, #column2 ul ul, #column2 ul li, #column2 li li {
	list-style: none;
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	display: block;
}

#column1 ul li,
#column2 ul li a,
#content #column2.light ul li a {
	display: block;
	padding: 2px 0px 2px 25px;
	clear:both;
}

/* Links on a light background */

#column1 ul li,
#content #column2.light ul li a {
	background: url("../img/column_2_bullet_bg_light.gif") 0px 7px no-repeat;
}

/* Links on a dark background */

#column1.dark ul li,
#column2 ul li a {
	background: url("../img/column_2_bullet_bg_dark.gif") 0px 7px no-repeat;
}

/* Links hover states */

#column1 ul li a:hover,
#content #column2 ul li a:hover {
	background-position: 0px -43px;
}

#column1.dark #column2 ul li {
	background-image: none;
	padding: 0px;
}

/* ------------------------------------------------------------
	Column 2 content pods
---------------------------------------------------------------- */

.pod {
	margin: 0px 0px 20px 0px;
	padding: 0px;
	clear: both;
}

/* ------------------------------------------------------------
	Column 2 itinerary items
---------------------------------------------------------------- */

#column2 .pod div {
	clear: both;
	/*border-bottom: 1px #CCCCCC solid;*/
	padding: 7px 10px 5px 10px;
	margin: 0px 0px 0px 0px;
}

#column2 .pod div.no_border {
	border-bottom: none;
}

#column2 .pod div.dark {
	background-color: #EEEEEE;
}

#column2 .pod div img {
	float: left;
	margin: 5px 10px 10px 0px;
}

#column2 .pod div h4 {
	height: 17px;
	margin:  0px 0px 5px 0px;
}

/* Newsletter button */

#content #column2 ul li.newsletter a {
	background: url("../img/newsletter_button_bg.gif") 0px 0px no-repeat;
	color: #FFFFFF;
	text-align: center;
	padding: 6px 0px 6px 0px;
	text-decoration: none;
	margin: 0px 0px 10px 0px;
}

#content #column2 ul li.newsletter a:hover {
	background-position: 0px -32px;
}

/* ------------------------------------------------------------
	Styles for content and itinerary slideshow
---------------------------------------------------------------- */

/* For single images instead of slideshows */

#single_image {
    float: right;
	width: 350px;
	margin: 0px 40px 30px 0px;
	background: #FFFFFF url("../img/loader.gif") center center no-repeat;
}

#section #single_image {
    float: none;
	width: auto;
	margin: 0px;
}

ul#content_slideshow  {  
    padding: 0px;  
    margin:  0px 4px 20px 0px;
    float: right;
	width: 420px;
} 

ul#content_slideshow li {
	float: left;
	display: block;
    height: 250px; 
}
 
ul#content_slideshow li#slide_image {  
    width: 350px;  
    margin:  0px;
	background: #FFFFFF url("../img/loader.gif") center center no-repeat;
}

ul#content_slideshow li#slide_image img {
    width: 350px;  
    height: 250px; 
}

ul#content_slideshow li#caption {
	clear: both;
	text-align:  center;
    width: 350px; 
    margin: 5px 35px 0px 35px;
    line-height: 16px; 
	height: 35px;
	color: #000000;
}

p.caption {
	text-align:  center;
    width: 350px; 
    margin: 5px 0px 0px 0px;
    line-height: 16px; 
	color: #000000;
}

ul#content_slideshow li a {
	width: 35px;
	display: block;
    height: 250px; 
    text-indent: -10000px;
	padding: 0px;
}

ul#content_slideshow li#prev a {
	background: url("../img/column_2_prev_button_off_bg.gif") center center no-repeat;
}

ul#content_slideshow li#prev a:hover {
	background: url("../img/column_2_prev_button_on_bg.gif") center center no-repeat;
}

ul#content_slideshow li#next a {
	background: url("../img/column_2_next_button_off_bg.gif") center center no-repeat;
}

ul#content_slideshow li#next a:hover {
	background: url("../img/column_2_next_button_on_bg.gif") center center no-repeat;
}

/* ------------------------------------------------------------
	Check availability form 
---------------------------------------------------------------- */

#column2 input, #column2 select {
	width: 80px;
}

#column2 table {
	line-height: 14px;
	margin: 0px;
	font-size: 90%;
}

#column2 form { 
	font-size: 90%;
	margin: 5px 0px 10px 0px;
}

#column2 form p {
	margin: 0px;
}

#column2 td {
	padding: 3px 3px 7px 0px;
}

#column2 td.noBorder, #proposal td.noBorder {
	border-bottom: none;
	padding-bottom: 0px;
}

/* ------------------------------------------------------------
	Request proposal form
---------------------------------------------------------------- */

#proposal td {
	width: 25%;
	padding: 5px 3px 7px 0px;
}

/* ------------------------------------------------------------
	Site map
---------------------------------------------------------------- */

/* Links on a dark background */

#column1 #siteMap ul li {
	background-image: none;
	padding: 0px;
}

#column1 #siteMap ul li a {
	font-size: 150%;
	display: block;
	color: #000000;
	padding: 2px 0px 2px 25px;
	background: url("../img/column_2_bullet_bg_light.gif") 0px 7px no-repeat;
}

#column1 #siteMap ul li li a {
	font-size: 130%;
	color: #333333;
	padding-left: 45px;
	background-position: 25px 7px;
}

#column1 #siteMap ul li li li a {
	font-size: 110%;
	color: #402570;
	padding-left: 65px;
	background-position: 45px 7px;
}

/* ------------------------------------------------------------
	Search results
---------------------------------------------------------------- */

#column1 ul#search_results li {
	background-image: none;
}

#column1 ul#search_results, #column1 #search_results li {
	list-style:  none;
	list-style-type:  none;
	padding:  0px;
	margin: 0px;
}

#column1 ul#search_results li li {
	margin: 0px 0px 0px 0px;
	border-top: 1px #DFDBD1 solid;
	padding: 0px 5px 10px 5px;
}

#column1 ul#search_results li li.dark {
	background-color: #FAF8F2;
}

#column1 ul#search_results h2 {
	height: 17px;
	width: 625px;
	float: left;
	margin: 10px 0px 10px 0px;
}

#column1 ul#search_results em {
	margin: 5px 0px 0px 0px;
	color: #000000;
	float: right;
	text-align: right;
	width: 175px;
	color: #666666;
	font-size: 90%;
}

#column1 ul#search_results div {
	clear: both;
}

#column1 ul#search_results img {
	width: 135px;
	height: 85px;
	float: left;
	margin:  0px 10px 10px 0px;
}

#column1 ul#search_results p.url {
	font-size: 95%;
}

#column1 ul#search_results .itin h2 {
	background: url("../img/sub_feature_header_bg.gif") 0px 0px no-repeat;
	padding: 0px 0px 2px 35px;
}

#column1 ul#search_results .dark.itin h2 {
	background: url("../img/text_content_header_bg.gif") 0px 0px no-repeat;
	padding: 0px 0px 2px 35px;
}

#column1 #search_form form {
	width: 250px;
	margin: 0px 0px 20px 0px;
}

/* ------------------------------------------------------------
	Search paging 
---------------------------------------------------------------- */

#column1 ul#search_paging {
	display:  block;
	height: 24px;
	margin:  0px 0px 0px 0px;
	background-color: #FFFFFF;
}

#column1 ul#search_paging li {
	float: left;
	display:  block;
	background-image: none;
	padding: 0px;
	clear: none;
}

#column1 ul#search_paging li a {
	float: left;
	display: block;
	border-top: 1px #DFDBD1 solid;
	border-right: 1px #DFDBD1 solid;
	border-left: 1px #DFDBD1 solid;
	background-color: #DFDBD1;
	margin-left: 1px;
	padding: 2px 5px 2px 5px;
	width: 20px;
	text-align:  center;
	text-decoration: none;
	color: #666666;
	font-weight: bold;
}

#column1 ul#search_paging li a:hover {
	background-color:#A5A39D ;
	color: #FFFFFF;
}

#column1 ul#search_paging li.active a {
	background-color: #FFFFFF;
	color: #000000;
}

#column1 ul#search_paging li a.first {
	margin-left: 0px;
}

/* ------------------------------------------------------------
	Banners
---------------------------------------------------------------- */

#bottom_banner {
	background-color: #FFFFFF;
	padding: 30px 0px 30px 0px;
	text-align: center;
	width: 955px;
	border: 1px #CC000 solid;
}

#inner_banner {
	width: 728px;
	height: 90px;
}

#sidebar_banner img {
	margin: 10px 0px 10px 0px;
	border: none;
}

/* ------------------------------------------------------------
	Add this
---------------------------------------------------------------- */

.add_this {
	background: url("http://s7.addthis.com/static/btn/v2/lg-share-en.gif") 0px 0px no-repeat;
	text-indent: -10000px;
}

#content #column2.light ul li.add_this a {
	background: none;
	margin: 10px 0px 0px 0px;
}

/* Swallow bullets */

#column1 ul li, #column1.dark ul li {
	background: url("../img/transparent_swallow_bullet.gif") 0px 5px no-repeat;
	padding-left: 30px;
}

