
/* samsung note 20 */
@media only screen and (-webkit-min-device-pixel-ratio: 2.625) {
}

/* Media Query for Mobile Devices */
@media (max-width: 480px) {
.navbar-brand img {
	width: 130px;
}
.package-card h4 {
	height: auto;
}
.topbar-left a span {
	display: none;
}
.topbar a i {
	font-size: 13px;
}
.social-icons {
	gap: 4px;
}
.topbar-right img {
	width: 20px!important;
	margin-right: 2px!important;
}
.mainbox .nav-tabs .nav-link.active, .mainbox .nav-tabs .nav-link {
	padding: 7px 12px!important;
}
.mainbox .row > div {
	margin-bottom: 0;
}
.mainbox .form-control, .mainbox .form-select {
	font-size: 13px;
}
.mainbox .form-label {
	font-size: 12px;
	margin-bottom: 5px;
}
.bluebg_block {
	margin-bottom: 10px!important;
}
.imp_car .title {
	font-size: 11px;
}
.imp_car img {
	width: 35px;
	height: auto;
}
.quote-btn img {
	height: 75px;
	object-fit: cover;
	object-position: 55% 0;
}
.secure h6 {
	font-size: 14px;
}
.text-muted {
	font-size: 12px !important;
	line-height: 15px;
	margin: 5px 0;
}
.secure .row > div {
	margin-bottom: 10px;
}
.route-summary.mt-3 {
	margin-top: 0 !important;
}
.route-summary .alert-info {
	font-size: 15px;
}
.booking-section {
	padding: 0 ;
}
.mainbox {
	margin: 0;
}
#bookingMap {
	height: 400px!important;
}
.package-section .section-title h2 {
    font-size: 18px;
    margin: 10px 0;
}
.package-section .section-title h3 {
    font-size: 18px;
}
.package-badge { font-size: 11px;}

}

@media (max-width: 320px) {
}

@media (max-width: 767.98px) {
}

@media (min-width: 1200px) {
}

@media (min-width: 1400px) {
}

@media only screen and (min-device-width : 820px) and (max-device-width : 1180px) and (orientation : landscape) {
}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
}

/**************** New Added ***********************/
@media (max-width: 480px) {
.price-card h1 {
	font-size: 1.5rem;
	font-weight: 600;
	margin: 0;
}
.hero-text h3 {
	font-size: 22px;
}
.hero-image {
	margin: 0;
}
.hero-image img {
	width: 100%;
}
.card-box {
	margin-top: 0;
}
.input-group-custom {
	margin-bottom: 0;
}
.card-box .row > div {
	margin-bottom: 0;
}
.payment_method .text-end {
	text-align: left !important;
	margin-top: 10px;
}
.price-benefits p {
	font-size: 11px;
}
.price-card {
	padding: 15px;
}
.price-ribbon {
	top: 4px;
	right: 3px;
}
.price-ribbon img {
	width: 35px;
}
.city-skyline {
	height: 145px;
}
}
/* ==========================================
   TRIP / BOOKING SUMMARY
========================================== */

.booking-summary {
	background: #fff;
	border-radius: 22px;
	padding: 35px;
	box-shadow: 0 15px 40px rgba(0,0,0,.06);
}
.booking-summary .summary-card .section-title {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 20px;
    background: #f9f4c9;
    padding: 8px;
    border-radius: 8px;
	text-align: left;
}
.booking-summary .summary-card .section-title i {
    color: #e3b61c;
}
.booking-summary .summary-card li i {
    color:var(--teal);
}
.summary-header {
	background:var(--teal);
	padding: 10px 20px;
	border-radius: 20px;
}
.summary-header h4 {
	color:var(--white);
	margin: 0;
	padding: 0;
}
.summary-header .text-muted {
	color:#e0fcff!important;
}
.vehicle-img img {
	width: 100%;
	margin-right: 15px;
}
.payment-footer .price-box {
	text-align: left;
}

.price-box {
	text-align: right;
}
.summary-header .price-box h2 {
	color:var(--white);
	font-weight: 700;
	font-size: 25px;
	line-height: 30px;
}
.summary-header .price-box small {
	color:var(--white);
}
.price-box h2 {
	color:var(--teal);
	font-weight: 700;
	font-size: 25px;
	line-height: 30px;
}
.price-box small {
	color:var(--black);
}
.summary-card {
	border: 1px solid #ececec;
	border-radius: 18px;
	padding: 22px;
	box-shadow: 0 0 12px #0000001a;
}
.summary-card li {
	margin: 0 0 10px 0;
}
.summary-card small {
	color: #888;
}
.section-title {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 20px;
}
.section-title i {
	font-size: 22px;
	color: var(--yellow);
	margin-right: 8px;
}
.timeline {
	border-left: 2px solid #ddd;
	margin-left: 10px;
}
.timeline-item {
	position: relative;
	padding-left: 25px;
	margin-bottom: 25px;
}
.timeline-item:last-child {
	margin-bottom: 0;
}
.timeline-item:before {
	content: "";
	width: 12px;
	height: 12px;
	border-radius: 50%;
	position: absolute;
	left: -7px;
	top: 5px;
}
.timeline-item.start:before {
	background: #28c76f;
}
.timeline-item.end:before {
	background: #ff4d4f;
}
.payment-footer {
	margin-top: 35px;
	border-top: 1px solid #eee;
	padding-top: 25px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 20px;
}
/* ==========================================
   PRIMARY BUTTON
========================================== */

.btn-primary {
	font-size: 14px;
	font-weight: 600;
	padding: 6px 10px;
	color: var(--white);
	background-color: var(--teal);
	border: 2px solid var(--teal) !important;
	vertical-align: initial;
}
.btn-primary:hover, .btn-primary:focus {
	color: var(--black);
	background-color: var(--white);
}
.btn-primary:hover i {
	color: var(--yellow);
}
.btn-primary i {
	font-size: 13px;
	margin-right: 4px;
}

/* ==========================================
   MOBILE / RESPONSIVE
========================================== */

@media (max-width: 480px) {
.summary-header .d-flex {
	display: block !important;
}
.price-box {
	text-align: left;
}
.price-box.mt-3 {
	margin-top: 6px !important;
}
.summary-header .row > div {
	margin-bottom: 10px;
}
.booking-summary {
	padding: 10px;
}
.payment-footer .price-box {
	text-align: center;
	margin: 0;
}
.booking-summary .price-box .text-end {
	text-align: left !important;
}
.booking-summary .summary-card .section-title {margin-top: 0;}
.booking-summary .row > div {
	margin-bottom: 0;
}
.text-muted {
	font-size: 12px !important;
	line-height: 15px;
	margin: 5px 0;
}
.price-box {
	margin-top: 10px;
}
.payment-footer {
	margin: 15px 0;
}
.price-box h2 {
	font-weight: 600;
}
}
