234 lines
2.5 KiB
CSS
234 lines
2.5 KiB
CSS
.flight-image {
|
|
height: 260px;
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
|
|
|
|
.flight-image img {
|
|
transition: .6s ease;
|
|
}
|
|
|
|
|
|
.card:hover .flight-image img {
|
|
transform: scale(1.08);
|
|
}
|
|
|
|
|
|
.card.border-0.shadow-sm.rounded-4.overflow-hidden {
|
|
|
|
border-radius: 24px !important;
|
|
overflow: hidden;
|
|
position: relative;
|
|
background: #fff;
|
|
transition: .4s ease;
|
|
border: 1px solid #f1f1f1 !important;
|
|
|
|
}
|
|
|
|
|
|
.card.border-0.shadow-sm.rounded-4.overflow-hidden:hover {
|
|
|
|
transform: translateY(-8px);
|
|
|
|
box-shadow:
|
|
0 20px 45px rgba(0,0,0,.12)!important;
|
|
|
|
}
|
|
|
|
.card form {
|
|
|
|
position:absolute;
|
|
top:18px;
|
|
left:18px;
|
|
z-index:5;
|
|
|
|
}
|
|
|
|
|
|
.card form button {
|
|
|
|
border-radius:50px;
|
|
|
|
background:rgba(255,255,255,.9);
|
|
|
|
backdrop-filter:blur(8px);
|
|
|
|
border:none;
|
|
|
|
padding:10px 18px;
|
|
|
|
color:#e63946;
|
|
|
|
font-weight:600;
|
|
|
|
box-shadow:
|
|
0 8px 20px rgba(0,0,0,.15);
|
|
|
|
transition:.3s;
|
|
|
|
}
|
|
|
|
|
|
.card form button:hover {
|
|
|
|
background:#e63946;
|
|
|
|
color:white;
|
|
|
|
}
|
|
|
|
|
|
.flight-badge {
|
|
|
|
position:absolute;
|
|
|
|
right:20px;
|
|
|
|
bottom:20px;
|
|
|
|
background:white;
|
|
|
|
color:#0d6efd;
|
|
|
|
padding:8px 20px;
|
|
|
|
border-radius:50px;
|
|
|
|
font-size:14px;
|
|
|
|
font-weight:700;
|
|
|
|
box-shadow:
|
|
0 8px 20px rgba(0,0,0,.15);
|
|
|
|
}
|
|
|
|
.flight-image:after {
|
|
|
|
content:"";
|
|
|
|
position:absolute;
|
|
|
|
inset:0;
|
|
|
|
background:
|
|
linear-gradient(
|
|
transparent,
|
|
rgba(0,0,0,.45)
|
|
);
|
|
|
|
}
|
|
|
|
.card-body {
|
|
|
|
padding:28px !important;
|
|
|
|
}
|
|
|
|
|
|
.card-body h5 {
|
|
|
|
font-size:22px;
|
|
|
|
font-weight:800 !important;
|
|
|
|
color:#222;
|
|
|
|
}
|
|
|
|
.route {
|
|
|
|
display:flex;
|
|
|
|
justify-content:center;
|
|
|
|
align-items:center;
|
|
|
|
gap:15px;
|
|
|
|
margin:25px 0;
|
|
|
|
font-weight:700;
|
|
|
|
font-size:16px;
|
|
|
|
}
|
|
|
|
|
|
.route .line {
|
|
|
|
width:55px;
|
|
|
|
height:2px;
|
|
|
|
background:#dbe7ff;
|
|
|
|
position:relative;
|
|
|
|
}
|
|
|
|
|
|
.route .line:after {
|
|
|
|
content:"✈";
|
|
|
|
position:absolute;
|
|
|
|
top:50%;
|
|
left:50%;
|
|
|
|
transform:translate(-50%,-50%);
|
|
|
|
background:white;
|
|
|
|
padding:5px;
|
|
|
|
color:#0d6efd;
|
|
|
|
}
|
|
|
|
|
|
.card-body strong {
|
|
|
|
font-size:20px;
|
|
|
|
color:#0d6efd;
|
|
|
|
}
|
|
|
|
.card-body .btn-primary {
|
|
|
|
background:linear-gradient(
|
|
135deg,
|
|
#0062ff,
|
|
#00b7ff
|
|
);
|
|
|
|
border:none;
|
|
|
|
padding:11px 30px;
|
|
|
|
font-weight:700;
|
|
|
|
box-shadow:
|
|
0 10px 25px rgba(0,98,255,.3);
|
|
|
|
transition:.3s;
|
|
|
|
}
|
|
|
|
|
|
.card-body .btn-primary:hover {
|
|
|
|
transform:translateY(-3px);
|
|
|
|
box-shadow:
|
|
0 15px 30px rgba(0,98,255,.4);
|
|
|
|
}
|
|
|
|
|
|
|
|
|