/* Destination Planet Travel CSS Document */

html {
	background: url('/images/www.dptravel.com/bodybg.jpg') repeat-x top left #f1f9fd;
	margin: 0;
	padding: 0;
}
body {
	background: url('/images/www.dptravel.com/cloudsbg.jpg') no-repeat top center;
	margin: 0;
	padding: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	color: #848484;
}

h2 {color: #d81b12; margin: 0 0 10px 0; padding: 0; border-bottom: 1px solid #c2e2f4;}

.clear {clear: both;}

#wrapper {width: 960px; margin: 0 auto; padding: 0;}

/* Header */
#header {margin: 0; padding: 10px 0;}
#header .logo {float: left;}
#header .abta {float: right; text-align: right;}
#header .phone {float: right; color: #006faf; font-size: 18px; font-weight: bold; text-align: right;}
#header .phone span, #header .phone a {color: #3fa0d8; font-size: 20px; text-decoration: none;}
#header .phone a:hover {text-decoration: underline;}


/* Navigation */
#navigation {color: #c3c3c3; font-weight: bold; padding: 0 0 10px 0; margin: 0 0 10px 0; border-bottom: 1px solid #006faf;}
#navigation a {color: #006faf; text-decoration: none;}
#navigation a.current {color: #d81b12;}
#navigation a:hover {text-decoration: underline;}

/* BODY & CONTENT */

#bodywrapper {background: #FFFFFF; padding: 10px;}
#bodywrapper #leftcolumn {float: left; width: 580px;}
#bodywrapper #rightcolumn {float: right; width: 350px;}

div.introText {margin: 0 0 20px 0; padding: 0;}

ul.top10 {float: left; width: 270px; list-style: none; margin: 0; padding: 0; color: #006FAF;}
ul.top10 li b {color: #d81b12;}

#latestoffers {margin: 0 0 20px 0; padding: 0;}

#homeboxes {margin: 0 0 0 -10px; padding: 0;}
#homeboxes h2 {margin: 0 0 10px 10px;}
#homeboxes .box {float: left; margin: 0 0 10px 10px; width: 186px; cursor: pointer;}
#homeboxes .box .header {background: #006faf; padding: 5px; color: #FFFFFF; margin: 0 0 2px 0}

#homeImage {margin: 0 0 10px 0; padding: 0; position: relative; background: url('/images/www.dptravel.com/homebanner.jpg') no-repeat top left; width: 350px; height: 200px;}
#homeImage .text {position: absolute; bottom: 0; background: url('/images/www.dptravel.com/text-overlay.png') repeat top left; color: #FFFFFF; padding: 5px; width: 340px; font-weight: bold;}
#homeImage .text a {color: #FFFFFF; font-weight: normal;}

.contentBox {
	background: #006faf;
	padding: 10px;
	margin: 0 0 10px 0;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
.contentBox h2 {color: #FFFFFF; border: none;}
.contentBox .content {
	background: #FFFFFF;
	padding: 10px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

.newsletter {position: relative;}
.newsletter .envelope {position: absolute; top: -5px; right: 10px;}

.radioMargin a {color: #006FAF; text-decoration: none;}
.radioMargin a:visited {color: #006FAF;}

/* Offers */
.offerboxes {margin: 0 0 0 -10px;}
.offerbox {
	float: left;
	width: 186px;
	margin: 0 0 10px 10px;
	background: #d3ebf7;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	color: #006faf;
	cursor: pointer;
}
.offerbox .top {font-size: 14px; padding: 5px 5px 0 5px;}
.offerbox .top span {font-size: 12px;}
.offerbox .content {padding: 5px;}
.offerbox .content .image {float: right; margin: 0 0 5px 5px;}
.offerbox .link {background: url('/images/www.dptravel.com/offerpricebg.gif') no-repeat bottom left; height: 32px; padding: 5px; color: #FFFFFF;}
.offerbox .link .moreinfo {float: left; margin: 15px 0 0 0; font-weight: bold;}
.offerbox .link .price {float: right; width: 79px; text-align: center; padding: 0 0 0 5px;}
.offerbox .link .price span {font-size: 14px; font-weight: bold;}


/* Footer */
#footer {
	margin: 10px 0;
	padding: 10px 0 0 0;
	border-top: 1px solid #006FAF;
	color: #006faf;
}
#footer .footerLeft {float: left;}
#footer .footerRight {float: right; text-align: right;}
#footer .links {color: #afafaf; margin: 0; padding: 0;}
#footer .links a {color: #D81B12; text-decoration: none;}
#footer .links a:hover {text-decoration: underline;}


/*---------------------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------*/

/* BE SURE TO INCLUDE THE CSS RESET FOUND IN THE DEMO PAGE'S CSS */
/*------------------------------------*\
	NAV
\*------------------------------------*/
#nav{
	list-style:none;
	font-weight:bold;
	margin-bottom:10px;
	/* Clear floats */
	float:left;
	width:100%;
	/* Bring the nav above everything else--uncomment if needed.
	position:relative;
	z-index:5;
	*/
}
ul#nav {margin: 0; padding: 0; z-index: 9999;}
#nav li{
	float:left;
	margin: 0;
	padding: 0;
	position:relative;
    z-index: 998
}

/*--- DROPDOWN ---*/
#nav ul{
	background: #fff; /* Adding a background makes the dropdown work properly in IE7+. Make this as close to your page's background as possible (i.e. white page == white background). */
	/*background:rgba(255,255,255,0);  But! Let's make the background fully transparent where we can, we don't actually want to see it if we can help it... */
	list-style:none;
	position:absolute;
	left:-9999px; /* Hide off-screen when not needed (this is more accessible than display:none;) */
	margin: 0;
	padding: 5px;
	z-index: 998;
	border: 1px solid #006FAF;
	border-top: none;
}
#nav ul li{
	/* padding-top:1px; Introducing a padding between the li and the a give the illusion spaced items */
	float:none;
}
#nav ul a{
	white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
}
#nav li:hover ul{ /* Display the dropdown on hover */
	left:0; /* Bring back on-screen when needed */
}
#nav li:hover a{ /* These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list. */
	text-decoration:underline;
}
#nav li:hover ul a{ /* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */
	text-decoration: none;
	margin: 0 0 3px 0;
}
#nav li:hover ul li a:hover{ /* Here we define the most explicit hover states--what happens when you hover each individual link. */
	text-decoration: underline;
}*/









/* RESULTS */

#results {
	padding: 20px;
}
/*#results h2 {color: #21BEF1; margin: 3px 0px; font-size: 16px;}*/

#results-right {float: right; margin: 0px 0px 0px 5px; width: 350px;}
#results-left {float: left; width: 580px;}

.hotelfilter {margin:0; font-size: 11px;}
.hotelfilter select,option {font-size: 11px;}

.pricebox {font-size: 11px;}
.pricebox a {
	color: #1cbcf1;
	font-size: 14px;
	font-weight: bold;
}

#hotelsortarea {
	margin: 10px 0px 10px 0px;
}
#hotelsortarea .left {float: left;}
#hotelsortarea .right {float: right; padding-top: 11px;}

#hotelitin {
	background-color: #1cbcf1;
	color: #FFFFFF;
	margin-top: 10px;
	padding: 10px;
}
#hotelitin h2 {color: #FFFFFF; margin: 0 0 5px 0; padding: 0;}
.itinRefHotel {text-align: center; background-color: #FFFFFF; color: #1cbcf1; padding: 5px; margin: 0 0 10px 0;}

/* BASKET */

#basket {
	float: right; 
	width: 330px;
}
#basket h4 {font-size: 14px; color: #006FAF; font-weight: bold; margin: 0 0 3px 0; padding: 0;}
#basket a {color: #D81B12;}
#itinAddons {
	float: left;
	width: 580px;
}

#basketextra {
	/*float: right;*/
	background-color: #1cbcf1;
	padding: 10px;
	margin-bottom: 5px;
	/*width: 284px;*/
	color: #FFFFFF;
}
#basketextra table {background-color: #FFFFFF; color: #333333; font-size: 11px;}
#basketextra a {color: #1cbcf1;}

/* BOOKING PAGES */

#booking {padding: 0px 20px;}

#bookingitin {
	background-color: #1cbcf1;
	padding: 10px;
}
#bookingitin .itinitem {
	border: 0;
	background-color: #FFFFFF;
	padding: 5px;
}
#bookingitin .itinitem b {color: #1cbcf1;}
#bookingitin .itinitem p {color: #ec008c; font-size: 18px; font-weight: bold; text-align: right; margin: 0;}