/*
CSS-file for VL
Developed by Colin Summers
*/


* {padding: 0;margin: 0;border: 0;}
body, html {color: #333; font-family: Arial, Verdana, Tahoma, sans-serif; text-align: center;}
body {font-size: 150%;color:#333;background-image:url(images/bg_body.jpg); background-position:top center; background-repeat:no-repeat; background-color: #D9E132;}
p {padding: 7px 0 7px 0; font-size:80%}
a { color: #529105; text-decoration:none;}
a:hover{ color: #529105; text-decoration:underline;}
h1, h2, h3, h4, h5 {font-weight: bold;}
h1 { font-size:131%; font-weight:normal;}
h2 { margin-bottom:10px; letter-spacing: -1px;}
h2 a{ text-decoration:none;}
h3 { font-size:100%;}
h3 .orange { color:#FC7300;}
h3 a{ text-decoration:none;}
h4 {}
.white a{ color:#FFFFFF;}
.white a:hover { color:#FFFFFF; text-decoration:underline;}
.white a:active { color:#FFFFFF; text-decoration:underline;}
h1 a{ text-decoration:none;}
.clear { clear: both; }
#background {width: 100%;margin: 0 auto; min-height: 300px;text-align: left; }
#mainContainer {width: 963px;margin: 0 auto; min-height: 300px;text-align: left;}
* html #mainContainer {height: 300px; /*** IE doesn't support min-height, but instead it handles height as min-height so we need to hack the height ***/}
.valueItem { font-size:80%; display:inline;}

/**************************
HEADER
**************************/
#header {}
#logo {margin: 0px; width: 963px;height: 104px; position: absolute;}
* html #logo {position: relative; display: none; /*** IE needs this  ***/}
#logo .logo{width:567px;float:left; display: none;}
#logo .search{width:337px;float:right; height:59px; background-image:url(images/bg_search.jpg); background-repeat:no-repeat; top:20px; right: 15px; position:relative; display: none;} 
#logo .searchfield{ background-color:#FFF; padding:3px; position:relative; left: 52px; top:10px; width:180px; display: none;} 
#logo .searchbutton{ position:relative; left: 54px; top: 15px; display: none;} 
#navigation {margin: -132px 0 0 -963px;float: left; position: relative;left: 312px;width: 963px;font-weight: normal; display: none;}
* html #navigation {position: relative; display: none;  /*** IE needs this  ***/}
#navigation .breadcrumb {position: relative;display: none;top: 36px;font-size:13px;background-color:#FFFFFF;width:943px;padding:10px; clear:both; z-index:999;}

/**************************
CONTENT AND COLUMNS
**************************/
.outer {margin-top: 50px; /*** We need to add some space for our top menu ***/padding-left: 165px;  }
* html .outer {/*** No need for hacking IE on this layout ***/}
.inner {width: 595px; /*** This width is for non-IE browsers. Mozilla makes this necessary. Be sure to check your layout in different browsers if you changes this value. Especially IE7 seems to create a horisontal scroll if this value is set too large ***/}
* html .inner {width: 100%;}
/*** div.inner is wider than its container, div.outer, and so overlaps to the right, pushing
div.right into the proper position. IE expands div.outer instead, requiring a Tan hack to avoid 
blowing the layout apart.
***/
.float-wrap {float: left;width: 963px;margin-left: -165px; margin-top: 0px; background-color:#FFF; }
* html .float-wrap {/*** No need for hacking IE on this layout ***/}
#content {float: left;width: 100%;background: #fff;  margin-bottom:10px;}
* html #content {position: relative; /*** IE needs this  ***/}
.contentWrap {padding: 10px;}
.contentWrap li {padding-bottom: 2px;}

/**************************
HOME CONTENT STYLES
**************************/
.contentWrap #flash{ margin:10px 0px 10px 0px; display: none;}
.contentWrap .introduction{ margin-bottom:0px;}
.contentWrap .introduction h1{ font-size:213%; font-weight:bold;}
.contentWrap .homeeventssearch{padding:10px; margin-bottom:10px; margin-top:10px; height:100px; background-image:url(images/bg_eventsearch.jpg); background-repeat:no-repeat; clear:both; display: none;} /*** needs height to contain other blocks  ***/
.contentWrap .homeeventssearch h2 { color:#FFF; padding:0px; margin:0px;} /*** needs height to contain other blocks  ***/
.contentWrap .homeeventssearch h3 { color:#FFF;} /*** needs height to contain other blocks  ***/

/**************************
EVENT CONTENT STYLES
**************************/
.contentWrap .eventssearch{padding:10px; margin-bottom:10px; color:#FFFFFF; height:209px; background-image:url(images/bg_eventsearch2.jpg); background-repeat:no-repeat; clear:both; display:none;}
.contentWrap .eventssearch h2 { color:#FFF; padding:0px; margin:0px;} /*** needs height to contain other blocks  ***/
.contentWrap .eventssearch h3 { color:#FFF;} /*** needs height to contain other blocks  ***/
.contentWrap .eventssearch .row { padding: 8px 0px 8px 0px;} /*** needs height to contain other blocks  ***/
.contentWrap .eventssearch .dates { width:187px; padding:3px;} /*** needs height to contain other blocks  ***/
.contentWrap .eventssearch .form_search { position:relative; bottom: 50px;}

/**************************
ACROSS SITE - ROWS, COLUMNS ETC
**************************/
.contentWrap .row{clear: both; }
.contentWrap .rowborderthick{clear: both;  margin-bottom: 13px; padding-top:10px; padding-bottom: 15px; background-color:transparent; width:100%;}
.contentWrap .rowborderthin{clear: both; padding-top:5px; background-color:Transparent; width:100%;}

.contentWrap .rowThinBorder{ border-top:1px solid #E6E6E6; width:100%; float:left; height:2px; clear:both; margin-top:10px; margin-bottom:2px; background-color:transparent; }
.contentWrap .rowThickBorder{ border-bottom:4px solid #E6E6E6; width:100%; float:left; height:16px; margin-bottom:5px; }

.contentWrap .three_column_left{ float:left; width:200px;}
.contentWrap .three_column_middle{ float:left; width:200px; margin-left:180px;}
.contentWrap .three_column_right{ float:right; width:200px;}
.contentWrap .four_column_left{ float:left; width:23%;}
.contentWrap .four_column_middleone{ float:left; width:23%;}
.contentWrap .four_column_middletwo{ float:left; width:23%;}
.contentWrap .four_column_right{ float:right; width:23%; }

.contentWrap .two_column_left{ float:left;  background-color:transparent; width: 48%; margin-right: 10px;  }
.contentWrap .two_column_right{ float:right; background-color:transparent; width: 48%; }

.contentWrap .three_columnform_left{ float:left; width:190px;}
.contentWrap .three_columnform_middle{ float:left; width:190px; margin-left:15px;}
.contentWrap .three_columnform_right{ float:right; width:190px; margin-right:10px;}


.contentWrap .two_columnform_left{ float:left; width: 48%;}
.contentWrap .two_columnform_middle{ float:left; width: 48%; margin-left:15px;}
.contentWrap .form_dropdown { width:190px;}
.contentWrap .form_dropdown2 { width:234px;}
.contentWrap .form_search { float:right; margin-right:7px; margin-top:5px;}
.contentWrap .featured{clear: both; height:170px; background-color:#529105; color:#FFFFFF; margin:13px 0px 0px 0px; }
.contentWrap .featured h2 a{ color:#FFF;}
.contentWrap .featured h2 a:link{ color:#FFF;}
.contentWrap .featured h2 a:visited{ color:#FFF;}
.contentWrap .featured h2 a:hover{ color:#FFF;}

.contentWrap .featured a{ color:#FFF;}
.contentWrap .featured a:link{ color:#FFF;}
.contentWrap .featured a:visited{ color:#FFF;}
.contentWrap .featured a:hover{ color:#FFF;}


.contentWrap .featuredtext{width:339px; float:right; padding:13px;}
.contentWrap .resultswhite{clear: both; background-color:#FFF; margin:0px 0px 10px 0px; padding-bottom:10px; }



.contentWrap .resultsdesc{width:410px; float:right; padding:0px 10px 0px 0px;}
.contentWrap .resultsinfo{width:359px; float:right; padding:0px 13px 0px 13px;}

.resultsinfo .resultsLine{ width:343px; float:left; background-color:transparent; height:auto; margin-bottom:4px;}
.resultsLine .leftInfo{ width:80px; float:left; background-color:transparent; padding-right:5px; font-size:80%;}
.resultsLine .rightInfo{ width:220px; float:left; background-color:transparent; font-size:80%; font-weight:bold; }


.contentWrap .resultsinfoleft{float:left;}
.contentWrap .resultsinforight{width:200px; float:left;}
.contentWrap .resultslogo{float:left;}
.contentWrap .resultstext{width:339px; float:right; padding:0px 13px 13px 13px;}
.contentWrap .searchfield{ border: 1px solid #ccc; padding:2px; width: 180px;}


.contentWrap .resline{width:630px; background-color:transparent; float:left; clear:both; padding-top:5px; font-size:80%;}
.contentWrap .resline .leftBx{ width:330px; background-color:transparent; float:left;}
.contentWrap .resline .rightBx{ width:300px; background-color:transparent; float:left;}

.contentWrap .nearBx{ width:100%; background-color:transparent; clear:both; }
.contentWrap .leftItems{ width:100%; float:left; background-color:transparent; height:auto; margin-right:10px; }
.contentWrap .rightItems{ width:100%; float:left; background-color:transparent; height:auto; }

.contentWrap .leftItems .detailHead{ width:100%; float:left; background-color:transparent; height:40px; padding-top:4px; }
.contentWrap .rightItems .detailHead{ width:100%; float:left; background-color:transparent; height:40px; padding-top:4px; }
.contentWrap .leftItems .detail{ width:100%; float:left; background-color:transparent; height:60px; border-bottom:1px solid #E6E6E6; padding-top:4px; }

.contentWrap .rightItems .detail{ width:100%; float:left; background-color:transparent; height:60px; border-bottom:1px solid #E6E6E6; padding-top:4px; }


/**************************
ACCOMMODATION CONTENT STYLES
**************************/
.contentWrap .accommodationsearch{padding:10px; margin-bottom:10px; margin-top:10px; height:100px; background-image:url(images/bg_eventsearch.jpg); background-repeat:no-repeat; clear:both;} /*** needs height to contain other blocks  ***/
.contentWrap .accommodationsearch h2 { color:#FFF; padding:0px; margin:0px;} /*** needs height to contain other blocks  ***/
.contentWrap .accommodationsearch h3 { color:#FFF;} /*** needs height to contain other blocks  ***/
 
/**************************
RIGHT COLUMN
**************************/
/*** div.right is in div.float-wrap, and when div.float-wrap is neg margined to the left, 
div.right is carried over into the proper position. Boxes are positioned relative and moved
up and down with the "top" and "bottom" attributes for seo
***/

#right {float: right;width: 312px;background: #fff; min-height: 250px;margin-top:-27px; display: none;}
* html #right {position: relative; /*** IE needs this  ***/height: 250px; display: none;}
#right ul {list-style: none;padding-bottom: 4px; display: none;}
#right li {padding-bottom: 2px; display: none;}
#right h3{padding:13px; margin:0px; font-size:140%; display: none;}
#right .specialoffers {height: 210px;background-image:url(images/bg_specials.gif);position:relative;width:300px;margin-bottom:10px; display: none;}
#right .signup {height:136px;width:300px;background-image:url(images/bg_signup.gif);position:relative; display: none;}
#right .signup .formfield{ border: 1px solid #ccc; padding:2px; margin-left:13px; width: 180px; display: none;}
#right .signup .submit{ position:relative; left: 10px; top:5px; display: none;}
#right .features {width:300px;position:relative; border-bottom: 4px solid #E6E6E6;}
#right .features h3{ margin-left: -13px; color:#529105; margin-bottom:0px; padding-bottom:0px; display: none;}
#right .tripideas h3{ margin-left: -13px; color:#529105;display: none; }
#right .featuresinfo {border-bottom:1px solid #E6E6E6;padding-top:10px;display: none;}
#right .tripideas {width:300px;position:relative;margin-bottom:10px;padding-bottom:10px;display: none;}
#right .addcomment {height: 350px;width:300px;position:relative;background-image:url(images/bg_comment.gif); background-repeat:no-repeat; margin-bottom:10px;display: none;}
#right .addcomment p{ padding:0px 13px 0px 13px;display: none;}
#right .quotetop { clear:both; background-image:url(images/quote_up.jpg); background-repeat:no-repeat; padding:10px;display: none;}
#right .quotebottom { clear:both; background-image:url(images/quote_bottom.jpg); background-repeat:no-repeat; height:15px;display: none;}





/**************************
FOOTER
**************************/
#footer {width: 943px;margin: 0 auto;text-align: left;border-top: 4px solid #E6E6E6;background-color:#FFF; clear:both; padding:10px; height:70px; display: none;}
#footer p { font-weight:bold; display: none;}
#footer a { text-decoration:none; display: none;}
#footer a:hover { text-decoration:underline; display: none;}
#footer .logos { float:right; position: relative; top: 5px; display: none;}


/**************************
GENERIC STYLES ACROSS THE SITE
**************************/


.imageright {float: right;padding-right:10px;}
.imageleft {float: left; padding-right:10px; margin-bottom: 20px;}
.orange { color:#FC7300;}

.floatleft {float: left; background-color:transparent;}
.floatright {float: right; background-color:transparent;}

.searchright {float: right; position:relative; bottom: 35px;}
.clearboth { clear:both;}
.print { position:absolute; left:885px;}
.printhidden { visibility: hidden; display: none;}

.paddingright { padding-right: 13px;}
.detailedimage {float: right; margin:0px 150px 10px 10px; width: 265px;}

.noBorder{ border:none;}
.printRight{ border:none; float:right;}

.contentWrap .break{ width:308px; height:7px; background-color:Transparent; float:left;}
.contentWrap .two_column_right .line{ float:left; width:308px; background-color:Transparent; font-size:80%; margin-bottom:2px;}
.contentWrap .two_column_right .line .headerItem{ float:left;  background-color:Transparent; padding-right:3px; font-weight:bold;}
.contentWrap .two_column_right .line .valueItem{ font-size:100%;  background-color:Transparent;}