@charset "UTF-8";
/* CSS Document */
.watermarked 	
{
    COLOR: gray;	
    BACKGROUND-COLOR: #f0f8ff}

.popupMenu 
{	
    padding:10px;
    border:1px;
border-top-width: 1px;
 border-right-width: 1px;
 border-bottom-width: 1px;
 border-left-width: 1px;
 border-top-color: #000;
 border-right-color: #000;
 border-bottom-color: #000;
 border-left-color: #000;
    border-color:Black;
    VISIBILITY: hidden;	POSITION: absolute;	BACKGROUND-COLOR: #f5f7f8;	  width:350px;  
 	}

.popupHover
{
        border:1px;
    border-color:Black;
background-position: left top;
    BACKGROUND-COLOR: #f5f7f8;	
    /*background-color: #E9E9E9;*/
}
.placeContainer
{
    width: 800px;
    Height: 100%}
    
#searchaccommodationbox { background-color: #F93; }
#refineyoursearchbox { background-color: #F93; }
#refineyoursearchinnerbox {
	background-color: #FFF;
	padding: 5px;
	margin: 5px;
}
#inandaroundbox {
	background-color: #daedfa;
	padding: 5px;
	margin: 5px;
}

#optionalavailabilitycheck {
	border: 1px dashed #F00;
	padding: 5px;
	margin-right: 15px;
	margin-left: 5px;
	background-color: #fffdda;
}





.establishment-description-padded {
	line-height:14px !important;
	font-variant:normal;
	font-style:normal;
	font-weight:normal;
	color:#696969!important;
	font-size:12px;
	text-align:left !important;
	font-family:arial, sans-serif;
	padding:10px 0 10px 0;
	border:0;
	margin:0;
}

.establishment-description {
	line-height:14px !important;
	font-variant:normal;
	font-style:normal;
	font-weight:normal;
	color:#000!important;
	font-size:12px;
	text-align:justify !important;
	font-family:arial, sans-serif;
	padding:0;
	border:0;
	margin:0;
}

.establishment-heading {
	font-weight:normal;
	font-family:arial, sans-serif;
	padding:0;
	margin:0;
	border:0;
	font-size:16px;
	
}

.establishment-emphasis {font-size:14px!important; }




#container { position: relative; }

#homesearch {
	background-color: #F90;
	padding: 10px;
	float: left;
	height: 400px;
	width: 300px;
	clear: left;
}


#homefeatured {
	background-color: #CCC;
	float: right;
	height: 400px;
	width: 400px;
	position: relative;
}

div.masterpage-one-footer {
	width:90%;
	margin-left:auto;
	margin-right:auto;
	text-align:left;
	min-width:960px;
	max-width:1110px;
	color:#fff;
	background-image: url(/images/fading_background_18.png);
	background-color: #CCC;
} 	

#footerwhyusesafarinow {
	padding: 10px;
	color: #333;
	background-repeat: repeat-x;
	min-width:960px;
	max-width:1110px;
	background-color: #d5d5d5;
}

#footerphonenumbers {
	padding: 10px;
	color: #333;
	min-width:960px;
	max-width:1110px;
	background-color: #eeeeee;
	
}
#footerlinks {
	padding: 10px;
	color: #333;

	min-width:960px;
	max-width:1110px;
	background-color: #797979;
}






/* column container */
	.colmask {
		clear:both;
		float:left;
		width:100%;			/* width of whole page */
		overflow:hidden;		/* This chops off any overhanging divs */
	}
	/* common column settings */
	.colright,
	.colmid,
	.colleft {
		float:left;
		width:100%;
		position:relative;
	}
	.col1,
	.col2,
	.col3 {
		float:left;
		position:relative;
		padding:0 0 1em 0;
		overflow:hidden;
	}
	/* 2 Column (double page) settings */
	.doublepage {
		background:#eee;		/* right column background colour */
	}
	.doublepage .colleft {
		right:50%;			/* right column width */
		background:#fff;		/* left column background colour */
	}
	.doublepage .col1 {
		width:46%;			/* left column content width (column width minus left and right padding) */
		left:52%;			/* right column width plus left column left padding */
	}
	.doublepage .col2 {
		width:46%;			/* right column content width (column width minus left and right padding) */
		left:56%;			/* (right column width) plus (left column left and right padding) plus (right column left padding) */
	}






#footertestimonials {
	font-style: italic;
	font-weight: normal;
	padding: 10px;
}


#searchaccheading {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 20px;
	font-weight: bold;
}

.ui-state-highlight 
{
	border: 1px solid #fed22f;
	color: #363636; 
	background: #ffe45c url(/images/ui-bg_highlight-soft_75_ffe45c_1x100.png) 50% top repeat-x; 	 
}

/*gridView*/
.grid
{
	width: 100%;
}
.grid td, .grid th
{
    padding:5px;
    text-align:left;
}
.gridheader
{
    text-align:left;
    color:white;
    font-weight: bold;
    border-bottom: solid 1px gray; 
    background-color:#0078B6
}
.gridrow td
{
    border-bottom:solid 1px blue;
}
.gridalternating
{
    background-color:#eeeeee;
}
.gridalternating td
{
	
}
/*gridView*/


/* Menu Control*/

/* This style sheet is intended to contain OFTEN CHANGED rules used when the Menu control adapter is enabled. */

/* When the Menu control's Orientation property is Vertical the adapter wraps the menu with DIV */
/* whose class is AspNet-Menu-Vertical. */
/* Note that the example menu in this web site uses relative positioning to force the menu to occupy */
/* a specific place in the web page.  Your web site will likely use a different technique to position your */
/* menu.  So feel free to change all the properties found in this CSS rule if you clone this style sheet. */
/* There is nothing, per se, that is magical about these particular property value choices.  They happen to */
/* work well for the sample page used to demonstrate an adapted menu. */
.PrettyMenu .AspNet-Menu-Vertical
{
    position:relative;
    left: 0;
    z-index: 300;
}

/* The menu adapter renders an unordered list (ul) in HTML for each tier in the menu. */
/* So, effectively says: style all tiers in the menu this way... */
.PrettyMenu ul.AspNet-Menu, 
.PrettyMenu ul.AspNet-Menu ul
{
    width: 140px;
    font-family: Arial;
    font-size: 12px;
}

/* This rule effectively says: style all tiers EXCEPT THE TOP TIER in the menu this way... */
/* In other words, this rule can be used to style the second and third tiers of the menu without impacting */
/* the topmost tier's appearance. */
.PrettyMenu ul.AspNet-Menu ul
{
    left: 138px;
    top: 3px;
    background:#FFF;
}

/* The menu adapter generates a list item (li) in HTML for each menu item. */
/* Use this rule create the common appearance of each menu item. */
.PrettyMenu ul.AspNet-Menu li
{
    background: #ffd repeat-x 0 13px;
    margin:0 2px 2px 0;
}

/* Within each menu item is a link or a span, depending on whether or not the MenuItem has defined it's */
/* NavigateUrl property. By setting a transparent background image here you can effectively layer two images */
/* in each menu item.  One comes from the CSS rule (above) governing the li tag that each menu item has. */
/* The second image comes from this rule (below). */
.PrettyMenu ul.AspNet-Menu li a,
.PrettyMenu ul.AspNet-Menu li span
{
    color: black;
    /*min-height: 30px;*/
    padding: 7px 8px 8px 8px;
    border-top: solid 1px #E7E7E7;
    border-right: solid 1px #D2D2D2;
    border-bottom: solid 1px #D2D2D2;
    border-left: solid 1px #E7E7E7;
    background: transparent url(/images/arrow.png) right center no-repeat;
}

/* When a menu item contains no submenu items it is marked as a "leaf" and can be styled specially by this rule. */
.PrettyMenu ul.AspNet-Menu li.AspNet-Menu-Leaf a,
.PrettyMenu ul.AspNet-Menu li.AspNet-Menu-Leaf span
{
    background-image: none;
}

/* Not used presently.  This is here if you modify the menu adapter so it renders img tags, too. */
.PrettyMenu ul.AspNet-Menu li a img
{
    border-style: none;
    vertical-align: middle;
}

/* When you hover over a menu item, this rule comes into play. */
/* Browsers that do not support the CSS hover pseudo-class, use JavaScript to dynamically change the */
/* menu item's li tag so it has the AspNet-Menu-Hover class when the cursor is over that li tag. */
/* See MenuAdapter.js (in the JavaScript folder). */
.PrettyMenu ul.AspNet-Menu li:hover, 
.PrettyMenu ul.AspNet-Menu li.AspNet-Menu-Hover
{
    background:#FFa;
    color:#2e89c5;
}

/* While you hover over a list item (li) you are also hovering over a link or span because */
/* the link or span covers the interior of the li.  So you can set some hover-related styles */
/* in the rule (above) for the li but set other hover-related styles in this (below) rule. */
.PrettyMenu ul.AspNet-Menu li a:hover,
.PrettyMenu ul.AspNet-Menu li span.Asp-Menu-Hover
{
    background: transparent url(/images/arrow-active.png) right center no-repeat;
    color:#2e89c5;
}

.PrettyMenu ul.AspNet-Menu li.AspNet-Menu-Leaf a:hover
{
    background-image: none;
}


/* -------------------------------------------------------------------------- */
/* When the Menu control's Orientation property is Horizontal the adapter wraps the menu with DIV */
/* whose class is AspNet-Menu-Horizontal. */
/* Note that the example menu in this web site uses absolute positioning to force the menu to occupy */
/* a specific place in the web page.  Your web site will likely use a different technique to position your */
/* menu.  So feel free to change all the properties found in this CSS rule if you clone this style sheet. */
/* There is nothing, per se, that is magical about these particular property value choices.  They happen to */
/* work well for the sample page used to demonstrate an adapted menu. */

.PrettyMenu .AspNet-Menu-Horizontal
{
    position:absolute;
    left: 100px;
    top: 16px;
    margin: 0 0 0 50px;
    width: 550px;
    z-index: 300;
}

/* This rule controls the width of the top tier of the horizontal menu. */
/* BE SURE TO MAKE THIS WIDE ENOUGH to accomodate all of the top tier menu items that are lined */
/* up from left to right. In other words, this width needs to be the width of the individual */
/* top tier menu items multiplied by the number of items. */
.PrettyMenu .AspNet-Menu-Horizontal ul.AspNet-Menu
{
    width: 550px;
}

/* This rule effectively says: style all tiers EXCEPT THE TOP TIER in the menu this way... */
/* In other words, this rule can be used to style the second and third tiers of the menu without impacting */
/* the topmost tier's appearance. */
/* Remember that only the topmost tier of the menu is horizontal.  The second and third tiers are vertical. */
/* So, they need a much smaller width than the top tier.  Effectively, the width specified here is simply */
/* the width of a single menu item in the second and their tiers. */
.PrettyMenu .AspNet-Menu-Horizontal ul.AspNet-Menu ul
{
    width: 130px;
    left: 3px;
    top: 2em;
}

/* Generally, you use this rule to set style properties that pertain to all menu items. */
/* One exception is the width set here.  We will override this width with a more specific rule (below) */
/* That sets the width for all menu items from the second tier downward in the menu. */
.PrettyMenu .AspNet-Menu-Horizontal ul.AspNet-Menu li
{
    width:100px;
    text-align:left;
}

/* This rule can be used to set styles for the menu items in the second tier (and lower) in the menu. */
.PrettyMenu .AspNet-Menu-Horizontal ul.AspNet-Menu li li
{
    text-align:left;
}

/* This rule establishes the width of menu items below the top tier.  This allows the top tier menu items */
/* to be narrower, for example, than the sub-menu items. */
/* This value you set here should be slightly larger than the left margin value in the next rule. See */
/* its comment for more details. */
.PrettyMenu .AspNet-Menu-Horizontal ul.AspNet-Menu ul li
{
    width:130px;
}

/* Third tier menus have to be positioned differently than second (or top) tier menu items because */
/* they drop to the side, not below, their parent menu item. This is done by setting the last margin */
/* value (which is equal to margin-left) to a value that is slightly smaller than the WIDTH of the */
/* menu item. So, if you modify the rule above, then you should modify this (below) rule, too. */
.PrettyMenu .AspNet-Menu-Horizontal ul.AspNet-Menu li ul li ul
{
    margin: -1.8em 0 0 126px;
}

/*This highlights which Account is currently active(Establishment/Customer/Staff/Affiliate)*/
.ActiveRole
{
    text-decoration: underline;
    padding: 2px;
    font-weight: bold;
    background: #ffd;
}

div.SignInRegisterControl label
{
    font: bold 18px Arial,Sans-Serif ;
}

div.SignInRegisterControl label.cinput {display: block;}

div.SignInRegisterControl input.cinput, div.SignInRegisterControl span input.cinput
{
    width: 300px; 
    font-size: 18px; 
    color: #999999;
    display: block;
}

h3.ravesheader
{
        
}

ul.raves
{
        
}

ul.raves li
{
    margin: 0 0 10px 0;
    padding: 0;
    list-style: none;
}

ul.raves li span.ravesdescription
{
    margin: 0 0 9px 0;
    padding: 10px;
    display: block;    
    background: #F5FAFE;
    border: solid 1px #D8E7EE;
}

ul.raves li span.ravesname
{
    margin: 0 5px 0 0;
    padding: 20px 0 0 60px;
    background: url(../../../images/RaveCommentBottomLeft.png) no-repeat -1px 0;
    font-weight: bold;
}

ul.raves li span.ravesdate
{
    
}



 #quoteoptions-a
{
    font-size: 12px;
    width: 100%;
    text-align: left;
    border-collapse: collapse;
    border: 1px solid #69c;
}
#quoteoptions-a th
{
    padding: 10px 17px 10px 17px;
    font-weight: normal;
    font-size: 14px;
    color: #039;
    border-bottom: 1px dashed #69c;
}
#quoteoptions-a td
{
    padding: 7px 17px 7px 17px;
    color: #669;
}
#quoteoptions-a tbody tr:hover td
{
    color: #339;
    background: #EBF8B5;
}

.quoteHeader
{
    background-color: #2E4D7B;
    border: 1px solid #2F4F4F;
    color: white;
    cursor: pointer;
    font-family: Arial,Sans-Serif;
    font-size: 12px;
    font-weight: bold;
    margin-top: 5px;
    padding: 5px;
}

.UserNavigationLoggedIn
{ 
    margin: 5px 5px;
    padding: 0;
    float: right;
    color: #2e89c5;
}

.UserNavigationLoggedIn a
{
     text-decoration: underline;     
} 

.UserNavigationZone
{
    margin: -5px 0 10px 0;
    padding: 2px 8px; 
    float: left; 
    /*background-color:  rgb(255, 255, 204);
    border: dotted 1px #7D7F81;*/
}

.UserNavigationZone a
{
    padding: 0px 0px 0px 38px;
    /*color: #7D7F81;*/
    text-decoration: none;
    display: block;
    height: 25px;
    line-height: 25px;
    /*font-weight: bold;*/
    background-image: url(../../moodring/images/homeaccount.gif);
    background-repeat: no-repeat;
    background-position: 0px 0px;
}

.UserNavigationZone a:hover
{
    /*color: #545556;*/
    text-decoration: underline;
    background-position: 0px -25px;
}  
.UserNavigationMenu
{
    margin: -5px 5px 0 0;
    padding: 0px 8px; 
    float: left; 
    background-color:  rgb(255, 255, 204);/*#DEECF6;*/
    z-index: 5099;
}

.UserNavigationMenu a
{
    padding: 5px 0px;
    color: #7D7F81;
    text-decoration: none;
    display: block;
    height: 100%;
    font-weight: bold;
    z-index: 5099;
}

.UserNavigationMenu a strong
{
    padding: 5px 0px 5px 5px;
    margin: 0 0 0 5px;
    border-left: solid 2px #d4e3ee;
    z-index: 5099;
}

.UserNavigationMenu div
{
    margin: 0 0 0 -9px;
    padding: 7px;
    background-color:  rgb(255, 255, 204);/*#DEECF6;*/
    border: solid 2px #d4e3ee;
    z-index: 5099;
}

.UserNavigationMenu div ul
{
    margin: 0px;
    padding: 0px;
    display: block;
    z-index: 5099;
}

.UserNavigationMenu div ul li
{
    margin: 0px;
    padding: 0px;
    list-style: none;
    line-height: 150%;
    z-index: 5099;
}

.UserNavigationMenu div ul li a
{
    padding: 2px;
    display: block;
    font-weight: normal;
    z-index: 5099;
}

.UserNavigationMenu div ul li a:hover
{
    color: #777;
    text-decoration: underline;
}

div.SiteMapNavigation
{
    margin: 0;
    padding: 0;
    width: 150px;
    overflow: hidden;
}

div.SiteMapNavigation_Item
{
    margin: 10px 0 0 0;
}

div.SiteMapNavigation_Item a
{
    font-weight:bold;    
}

a.SiteMapNavigation_Item_Parent
{
    color: #000;
    font-weight: bold;
}

ul.SiteMapNavigation_Item_Children
{
    margin: 0 0 20px 5px;
    padding: 0;
    list-style:none;
}

.SiteMapNavigation_Item_Children a
{
    text-decoration: underline;
}

/*This applies to the On Page Template in the CMS*/
div.OnPageMenu div.SiteMapNavigation
{
    width: 100%;
}

div.OnPageMenu div.SiteMapNavigation div.SiteMapNavigation_Item
{
    font-size: 16px;
}

div.OnPageMenu div.SiteMapNavigation ul.SiteMapNavigation_Item_Children
{
    margin: 10px 0 10px 20px;
    list-style-type: disc;    
}
    
.NewsFlash
{
    background-color: #ffc;
    border: dashed 2px #ff2;
    padding: 5px;
}

.NewsFlash h2
{
    float: left;
    font-size: 14px;
}

.NewsFlash div
{
    margin: 0 5px;
    padding: 0;
    line-height: 14px;
    float: left;
    overflow: hidden;
    max-width: 80%;
}

/*Buyer Quote*/

.whitebox
{
    padding: 10px;
    background-color: #FFF;
    font-size: 14px;
}
.yellowbox
{
    padding: 10px;
    background-color: #ffffcc;
    border: 1px dashed #666;
}
.quote td
{
    padding: 5px 5px 5px 5px;
    font-family:Arial ;
    font-size:14px;
    
}
.quote tbody
{
    background-color: white;
}
.quote th
{
    background-color: #B5C6DF;
}

.DefaultRoleSelection input
{
    margin: 20px 0px;
    width: 200px;
    height: 30px;
    display: block;
}

.fixed
{
    position: fixed;
}