/*********************************************************
                 LISTING PAGE STYLING
*********************************************************/

#detail-page {margin-top: 4.375em; padding-top: 0;}

/*********************************************************  Package Listing  *********************************************************/
#view-pp {margin-bottom: 0;}
#view-pp li {padding: 5px 8px; height: 35px; width: 35px; text-align: center;}
.pagination > li > a, .pagination > li > span {padding: 5px 8px; height: 35px; width: 35px; text-align: center;}
#view-pp > .active {background-color: #d7d9e0;}
#view-pp li a {color: #3f4148;}
.listing-label {color: #787b86;}
#listing-header .listing-label {line-height: 1.875em;}

.pagination [class^="icon-"]:before {margin-left: 0; margin-right: 0; width: inherit;}
.pagination [class^="icon-"] {color: #ea2d30;}

.pagination > li > a.page-control, .pagination > li.disabled > span.page-control {
  border: 1px solid #d7d9e0;
  padding: 4px 12px;
  background-color: #fff;
}
.pagination > li.disabled > span.page-control > div {color: #999;}
.pagination > li > span.more-page {padding-left: 0; padding-right: 0; width: inherit;}

#listing-result {background-color: #f2f2f2; padding-top: 2.125em; /* 34/16 */ padding-bottom: 1.875em; /* 30/16 */}

.package-container, .destination-container {
	position: relative; 
	-webkit-box-shadow: 0px 0px 5px 0px rgba(55, 72, 84, 0.5);
	-moz-box-shadow: 0px 0px 5px 0px rgba(55, 72, 84, 0.5);
	box-shadow: 0px 0px 5px 0px rgba(55, 72, 84, 0.5);
}
.package-container > a {color: #3f4148;}
.package-container > a:hover {text-decoration: none;}

.package-container .transparent-btn {border: 1px solid #153153; color: #153153; margin-top: 20px;}

.package-grid {text-align: center; background-color: #fff; padding-bottom: 5px; position: relative;}
.package-grid img {display: inline-block; *display: inline; zoom: 1;}
.package-writeup {padding: 18px 15px 10px;}
.package-price {border-top: 1px solid #d7d9e0; padding: 5px 15px; position: inherit;}

.promo-tag {background-color: #e54a4d; width: 60px; height: 20px; position: absolute; right: 0; font-size: 0.75em; text-align: center; text-transform: uppercase; color: #fff; line-height: 20px;}

.package-hover {background-color: #cfd3e4; position: absolute; top: 0; left: 0; width: 100%; display: none;}
.touch .package-container:hover .package-hover {display: block;}
.package-hover > div {padding: 18px 15px;}

/*.package-grid, .package-hover {height: 100%; max-height: 400px;}*/
.package-hover {height: 100%;}
.package-hover .description {display: none;}

#listing-result > div > .row {margin-left: -10px; margin-right: -10px;}
#listing-result > div > .row > [class^="col-"] {padding-left: 10px; padding-right: 10px; margin-bottom: 1.25em;}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
	.package-grid, .package-hover {min-height: 385px;}
	.package-price {position: absolute; bottom: 0px; width: 100%;}
	.package-hover .description {display: block;}
	
	#destination .package-grid, #destination .package-hover {min-height: 324px;}
}

/*********************************************************  Package Details  *********************************************************/
#package-details {margin-top: 1.875em;}
#package-details > .container > .row > hr {margin: 5px 0 50px;}

#package-code {margin-top: 1.25em;}

#itinerary-price ul {color: #787b86; font-size: 0.75em;}
#itinerary-price ul {list-style: none; padding-left: 0;}

#itinerary-table hr {margin-bottom: 10px;}
#toggle-itinerary {margin-top: 1.875em;}
#toggle-itinerary > .icon-angle-down {display: inline;}

.icon-time .col-xs-3.text-right {padding: 0;}

#enquiryForm .bootstrap-select, #enquiryForm .bootstrap-select > button {margin-bottom: 0;}
#enquiryForm hr {margin-top: 40px; margin-bottom: 40px;}
#enquiryForm .modal-footer {margin-top: 0; padding-top: 0; border-top: none;}

.cruise-logo {text-align: center;}
.cruise-logo img {display: inline-block; *display: inline; zoom: 1;}

.carousel-caption div {
	white-space: pre;           /* CSS 2.0 */
    white-space: pre-wrap;      /* CSS 2.1 */
    white-space: pre-line;      /* CSS 3.0 */
    white-space: -pre-wrap;     /* Opera 4-6 */
    white-space: -o-pre-wrap;   /* Opera 7 */
    white-space: -moz-pre-wrap; /* Mozilla */
    white-space: -hp-pre-wrap;  /* HP Printers */
    word-wrap: break-word;      /* IE 5+ */
}

@media (max-width: 768px) {
	#enquiryForm .form-group > .row > [class^="col-"] {margin-bottom: 15px;}
	#enquiryForm .form-group > .row > [class^="col-"]:last-child {margin-bottom: 0px;}
}

@media (min-width: 768px) {
	#package-details {margin-top: 4.375em;}
	#package-code {margin-top: 0;}
	
	#itinerary-price > .row > [class^="col-"]:last-child {margin-top: 3%;}
}

@media (min-width: 992px) {
	#package-details > .container > .row > [class^="col-"]:first-child {padding-left: 0;}
	#package-details > .container > .row > [class^="col-"]:first-child + [class^="col-"] {padding-right: 0;}
	#package-details > .container > .row > .col-xs-12, 
	#package-details > .container > .row > .col-sm-12, 
	#package-details > .container > .row > .col-md-12, 
	#package-details > .container > .row > .col-lg-12 {padding-left: 0; padding-right: 0;}
	
	#toggle-itinerary > .icon-angle-down {display: none;}
	.itinerary-timing  > [class^="col-"] {padding-top: 4px; padding-bottom: 4px;}
	.itinerary-timing  > [class^="col-"]:first-child {border-right: 1px solid #d7d9e0;}
	
	#itinerary-price > .row > [class^="col-"]:last-child {margin-top: 0;}
}

/*********************************************************  Cruise listing  *********************************************************/
.cruise-listing {
	position: relative; 
	-webkit-box-shadow: 0px 0px 5px 0px rgba(55, 72, 84, 0.5);
	-moz-box-shadow: 0px 0px 5px 0px rgba(55, 72, 84, 0.5);
	box-shadow: 0px 0px 5px 0px rgba(55, 72, 84, 0.5);
	background-color: #fff;
	text-align: center;
}
.cruise-listing a > div {color: #3f4148; padding: 20px;}
.cruise-listing a {color: #3f4148;}
.cruise-listing a:hover {text-decoration: none;}
.cruise-listing a:hover .btn-primary,
.cruise-listing a:focus .btn-primary,
.cruise-listing a:active .btn-primary {
  background-color: #0e407b;
  border-color: #285e8e;
}


.cruise-listing img {display: inline-block; *display: inline; zoom: 1;}

.cruise-description {margin-bottom: 1.875em; height: auto;}

#detail-page .cruise-logo {border-bottom: 1px solid #d9d8dd;}

#fleet-listing ul {color: #3f4148; margin-top: 0.9375em; list-style: none; padding-left: 20px;}
#fleet-listing ul > li {position: relative;}
#fleet-listing ul > li:before {content: "\2022"; font-size: 1.6em; position: absolute; left: -20px; top: -9px; color: #0f4a91;}

.touch #youtubeModal {top: 15%;}

@media (min-width: 600px) {
	#fleet-listing ul > li {float: left; width: 45%; margin-right: 5%;}
}

@media (min-width: 992px) {
	#fleet-listing ul > li {float: none; width: auto;}
	.cruise-description {height: 66px;}
}

@media (min-width: 1200px) {
	.cruise-description {height: 88px;}
}

/*********************************************************  Cruise details  *********************************************************/
.trigger-icon {margin: auto; position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 100; width: 65px; height: 62px; max-width: 65px; max-height: 62px;
  -webkit-transition: opacity 0.8s ease-in-out;
  -moz-transition: opacity 0.8s ease-in-out;
  -o-transition: opacity 0.8s ease-in-out;
  transition: opacity 0.8s ease-in-out;
}
#hover-state {opacity: 0;}

#youtubeModalToggle:hover  #hover-state {opacity: 1;}