.listing-details-area{ .single-listing{ .list-img { overflow: hidden; border-radius: 5px 5px 0 0; img { width: 100%; transform: scale(1); transition: all 0.6s ease-out 0s; } } .list-caption { border: 1px solid #e1ebf7; padding: 31px 24px 18px 24px; border-top: 0; position: relative; z-index: 0; span { color: #fff; position: absolute; top: -18px; right: 7px; font-size: 16px; font-weight: 500; width: 96px; height: 35px; background: #ff3d1c; border-radius: 30px; text-align: center; line-height: 35px; } h3 { padding-right: 48px; margin-bottom: 17px; @media #{$md}{ padding-right: 0px; } @media #{$sm}{ padding-right: 0px; } @media #{$xs}{ padding-right: 0px; } a{ color: #1c1930; font-weight: 700; font-size: 25px; } } p{ color:#57667e; @media #{$laptop}{ padding-right: 59px; } } } .list-footer{ border-top: 1px solid #e1ebf7; margin-top: 20px; padding-top: 20px; ul{ display: flex; justify-content: space-between; li{ color: #727272; font-size: 14px; } } } // Hover &:hover .list-img img { transform: scale(1.1); } } } // // Form Style Slider form.search-box2{ border: 8px solid rgba(255, 255, 255,.2); display: flex; flex-wrap: wrap; justify-content: space-between; border-radius: 50px; @media #{$sm}{ border: none; } @media #{$xs}{ border: none; } .input-form{ width: 45%; position: relative; // Border Radius border-top-left-radius: 50px; overflow: hidden; border-bottom-left-radius: 50px; @media #{$sm}{ width: 66%; border-top-left-radius: 0px; border-bottom-left-radius: 0px; } @media #{$xs}{ width: 100%; border-top-left-radius: 0px; border-bottom-left-radius: 0px; } input{ height: 60px; width: 100%; color: #777777; font-size: 18px; font-weight: 400; padding: 9px 33px 9px 32px; border: none; border-radius: 0px; position: relative; @media #{$xs}{ margin-bottom: 20px; } @media #{$sm}{ padding: 9px 33px 9px 25px; margin-bottom: 20px; } &::placeholder { color: #616875; @media #{$xs}{ font-size: 13px; } } } &::before { position: absolute; content: ''; width: 1px; height: 60px; background:#e0e4f8; right: 22px; top: 50%; z-index: 1; transform: translateY(-50%); @media #{$sm}{ top: 38%; } @media #{$xs}{ display: none; } } } .select-form{ width: 34%; @media #{$xs}{ width: 100%; } .nice-select { width: 100%; height: 60px; background: #fff; border-radius: 0px; padding: 11px 19px 11px 10px; color: #616875; line-height: 42px; border: 0; @media #{$xs}{ margin-bottom: 20px; padding-left: 25px; } @media #{$sm}{ margin-bottom: 20px; padding-left: 25px; } .list { width: 100%; } &.open .list { width: 100%; border-radius: 0; border: 0; } &::after { border-bottom: 1px solid #a9b6cd; border-right: 1px solid #a9b6cd; height: 12px; width: 12px; margin-top: -7px; right: 29px; } } } .search-form{ width: 21%; // Border Radius border-top-right-radius: 50px; overflow: hidden; border-bottom-right-radius: 50px; @media #{$sm}{ width: 100%; border-top-right-radius: 0px; border-bottom-right-radius: 0px; } @media #{$xs}{ width: 100%; border-top-right-radius: 0px; border-bottom-right-radius: 0px; } a{ width: 100%; height: 60px; background:$btn-bg; font-size: 20px; line-height: 1; text-align: center; color: #fff; display: block; padding: 15px; border-radius: 0px; text-transform: capitalize; font-family: $font_1; line-height: 31px; font-size: 15px; } } }