File: /mnt/data/truelysell-wp-demo/catering/wp-content/themes/truelysell/assets/css/style-new.txt
.btn.btn-linear-primary {
background: linear-gradient(90deg, #FD2692 0%, #0A67F2 100%);
color: #FFF;
border: 0;
position: relative;
overflow: hidden;
z-index: 1;
}
.hero-section-ten .form-control:focus::-webkit-input-placeholder, .hero-section-ten .form-control:focus::placeholder {
color: #AFB2B8;
padding-inline-start: 0.3rem;
transition: padding-inline-start 0.1s ease-in;
}
.hero-section-ten {
position: relative;
background-color: #FBFBFB;
min-height: auto;
}
.hero-section-ten h1{
font-size: 36px;
}
.hero-section-ten .hero-content {
padding: 80px 0;
z-index: 1;
}
.hero-section-ten .hero-content h1 {
line-height: 48px;
margin-top: 0;
}
.hero-section-ten .hero-content h1 span {
position: relative;
}
.hero-section-ten .hero-content h1 span::before {
content: "";
background-color: #FF008A;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 5px;
}
.hero-section-ten .hero-content .sub-title {
font-size: 18px;
line-height: 40px;
}
.hero-section-ten .banner-img {
max-width: 750px;
position: absolute;
right: 10px;
bottom: 0;
background: url("../images/bgs/banner-bg.png") no-repeat;
background-size: contain;
background-position: bottom center;
}
.hero-section-ten .badge {
border-radius: 60px;
padding: 6px 8px;
}
.hero-section-ten .badge:hover {
background: #FF008A;
color: #FFF;
}
.hero-section-ten .banner-info {
margin-top: 38px;
}
.hero-section-ten .banner-info h6{
margin-bottom: 0;
}
.hero-section-ten .banner-info p {
font-size: 14px;
margin-bottom: 0;
}
.hero-section-ten .banner-form {
position: relative;
border-radius: 8px;
padding: 10px 10px 2px;
}
.hero-section-ten .banner-form .input-group .input-group-text {
background-color: transparent;
border: 0;
color: #656B76;
}
.hero-section-ten .banner-form .input-group .form-control {
border: 0;
padding-left: 6px;
}
.hero-section-ten .banner-form .btn {
white-space: nowrap;
padding: 9px 15px;
}
.hero-section-ten .banner-form .shape-06 {
bottom: -30%;
right: -17%;
position: absolute;
z-index: -1;
}
.hero-section-ten .hero-image .shape-01 {
right: 40%;
top: 25%;
position: absolute;
}
.hero-section-ten .hero-image .shape-01 .border-edge {
border-style: solid;
border-width: 22px 25px 0px 0px;
border-color: transparent #fff transparent transparent;
border-radius: 0px;
position: absolute;
bottom: -5px;
right: 20px;
transform: rotate(40deg);
}
.hero-section-ten .hero-image .shape-02 {
top: 10%;
right: 5%;
position: absolute;
}
.hero-section-ten .hero-image .shape-02 .border-edge {
border-style: solid;
border-width: 22px 25px 0px 0px;
border-color: transparent #fff transparent transparent;
border-radius: 0px;
position: absolute;
bottom: -5px;
left: 20px;
transform: rotate(40deg);
}
.hero-section-ten .hero-image .shape-03 {
bottom: 0;
left: 0;
z-index: -1;
position: absolute;
}
.hero-section-ten .hero-image .shape-04 {
top: 0;
left: 0;
z-index: -1;
position: absolute;
}
.hero-section-ten .hero-image .shape-05 {
top: 0;
right: 35%;
z-index: -1;
position: absolute;
}
.hero-section-ten .hero-image .shape-01 {
right: 40%;
top: 25%;
position: absolute;
}
.hero-section-ten .hero-image .shape-01 .border-edge {
border-style: solid;
border-width: 22px 25px 0px 0px;
border-color: transparent #fff transparent transparent;
border-radius: 0px;
position: absolute;
bottom: -5px;
right: 20px;
transform: rotate(40deg);
}
.hero-section-ten .avatar {
position: relative;
height: 2.625rem;
width: 2.625rem;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 4px;
color: #FFF;
font-weight: 500;
}
.hero-section-ten .avatar.avatar-md {
width: 2rem;
height: 2rem;
line-height: 2rem;
font-size: 0.8rem;
}
.hero-section-ten .badge {
border-radius: 60px;
padding: 6px 8px;
}
.hero-section-ten .badge.badge-dark-transparent {
background: #EAEBEE;
color: #242B3A;
}
.hero-section-ten .badge:hover {
background: #FF008A;
color: #FFF;
}
.hero-section-ten .banner-info {
margin-top: 38px;
}
.hero-section-ten .banner-info p {
font-size: 14px;
}
.home .content.full-width {
padding: 0!important;
}
.animation-float {
animation: float 3000ms linear 500ms infinite alternate both;
}
@keyframes float {
0% {
transform: translateY(0px);
}
50% {
transform: translateY(10px);
}
100% {
transform: translateY(20px);
}
}
.floating-x {
-webkit-animation-name: floating-x;
animation-name: floating-x;
-webkit-animation-duration: 3s;
animation-duration: 3s;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
}
@keyframes floating-x {
0% {
-webkit-transform: translateX(30px);
transform: translateX(30px);
}
50% {
-webkit-transform: translateX(10px);
transform: translateX(10px);
}
100% {
-webkit-transform: translateX(30px);
transform: translateX(30px);
}
}
.section-header {
margin-bottom: 40px;
}
.text-linear-primary {
background: linear-gradient(90deg, #FD2692 0%, #0A67F2 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.section {
padding: 60px 0;
}
.section .view-all {
margin-top: 40px;
}
.category-item {
position: relative;
box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.08);
border-radius: 5px;
padding: 20px;
border: 1px solid #FFF;
-webkit-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease;
}
.category-item img {
height: 40px !important;
}
.category-item .badge {
position: absolute;
top: 0;
right: 0;
border-radius: 0 2px 0 5px;
}
.category-item a {
display: none;
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
-webkit-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease;
white-space: nowrap;
}
.category-item:hover {
-webkit-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease;
border-radius: 10px;
border-color: #FF008A;
box-shadow: 0px 10px 20px -5px rgba(0, 0, 0, 0.08);
background: url("../images/category-bg.svg") no-repeat;
background-size: cover;
background-position: top center;
}
.category-item:hover a {
display: block;
bottom: 20px;
-webkit-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease;
}
.category-item:hover .badge {
border-radius: 0 10px 0 5px;
}
.category-item:hover p {
display: none;
-webkit-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease;
}
.link-primary {
color: #FF008A !important;
}
.service-item {
box-shadow: 0px 4px 4px 0px rgba(217, 217, 217, 0.25);
border-radius: 10px;
overflow: hidden;
margin-bottom: 40px;
}
.service-item .service-img {
position: relative;
border-radius: 10px 10px 0 0;
overflow: hidden;
}
.service-item .service-img img {
-webkit-transition: all 0.3s ease-out 0s;
-ms-transition: all 0.3s ease-out 0s;
transition: all 0.3s ease-out 0s;
}
.service-item .service-img .fav-item {
position: absolute;
top: 0;
right: 0;
padding: 10px;
z-index: 999;
}
.service-item .service-content {
padding: 20px;
border: 1px solid #EBECED;
border-width: 0 1px 1px 1px;
}
.service-item .service-content .service-pro-info p:hover {
color: #FF008A;
}
.service-item:hover .service-img img {
-webkit-transition: all 0.3s ease-out 0s;
-ms-transition: all 0.3s ease-out 0s;
transition: all 0.3s ease-out 0s;
transform: scale(1.1);
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
}
.service-content p {
color: #74788d;
font-size: 16px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.text-truncate {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.service-item .service-content h6 a {
display: inline;
background-image: linear-gradient(#FF008A, #FF008A), linear-gradient(#FF008A, #FF008A);
background-size: 0% 2px, 0 2px;
background-position: 100% 100%, 0 100%;
background-repeat: no-repeat;
transition: background-size 0.4s linear;
}
.service-item .service-content h6 a:hover {
background-size: 0 2px, 100% 2px;
}
.apexcharts-toolbar {
display: none !important;
}
.fav-item .fav-icon {
width: 31px;
height: 31px;
background: #fff;
color: #111827;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
justify-content: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
border-radius: 50%;
}
.work-section-new {
border-radius: 10px;
padding: 60px 20px;
position: relative;
margin: 60px 0;
}
.work-section-new .work-bg1 {
position: absolute;
top: 30px;
left: 0;
}
.work-section-new .work-bg2 {
position: absolute;
top: 0;
right: 113px;
}
@media (max-width: 991.98px) {
.work-section-new {
padding: 50px;
}
}
@media (max-width: 767.98px) {
.work-section-new {
padding: 30px;
}
}
.fav-item .fav-icon:hover {
background-color: #ff008a;
color: #fff;
}
.fs-sm {
font-size: 0.6875rem;
}
.fs-base {
font-size: 0.875rem;
}
.fs-lg {
font-size: 1.125rem;
}
.fs-1 {
font-size: 0.0625rem;
}
.fs-2 {
font-size: 0.125rem;
}
.fs-3 {
font-size: 0.1875rem;
}
.fs-4 {
font-size: 0.25rem;
}
.fs-5 {
font-size: 0.3125rem !important;
}
.fs-6 {
font-size: 0.375rem !important;
}
.fs-7 {
font-size: 0.4375rem;
}
.fs-8 {
font-size: 0.5rem !important;
}
.fs-9 {
font-size: 0.5625rem;
}
.fs-10 {
font-size: 0.75em !important;
}
.fs-11 {
font-size: 0.6875rem;
}
.fs-12 {
font-size: 0.75rem;
}
.fs-13 {
font-size: 0.8125rem;
}
.fs-14 {
font-size: 0.875rem !important;
}
.fs-15 {
font-size: 0.9375rem;
}
.fs-16 {
font-size: 1rem !important;
}
.fs-17 {
font-size: 1.0625rem;
}
.fs-18 {
font-size: 1.125rem;
}
.fs-19 {
font-size: 1.1875rem;
}
.fs-20 {
font-size: 1.25rem;
}
.fs-21 {
font-size: 1.3125rem;
}
.fs-22 {
font-size: 1.375rem;
}
.fs-23 {
font-size: 1.4375rem;
}
.fs-24 {
font-size: 1.5rem;
}
.fs-25 {
font-size: 1.5625rem;
}
.fs-26 {
font-size: 1.625rem;
}
.fs-27 {
font-size: 1.6875rem;
}
.fs-28 {
font-size: 1.75rem;
}
.fs-29 {
font-size: 1.8125rem;
}
.fs-30 {
font-size: 1.875rem;
}
.fs-32 {
font-size: 2rem;
}
.fs-34 {
font-size: 2.125rem;
}
.fs-36 {
font-size: 2.25rem;
}
.fs-38 {
font-size: 2.375rem;
}
.fs-40 {
font-size: 2.5rem;
}
@media (max-width: 1399.98px) {
.hero-section-ten .banner-img {
max-width: 650px;
}
}
@media (max-width: 1199.98px) {
.hero-section-ten .banner-img {
max-width: 600px;
}
}
@media (max-width: 991.98px) {
.section {
padding: 50px 0;
}
.hero-section-ten h1{
font-size: 30px;
}
.hero-section-ten .banner-info {
margin-top: 18px;
}
.hero-section-ten .hero-content .sub-title {
font-size: 16px;
}
.hero-section-ten .banner-img {
display: none !important;
}
.hero-section-ten .banner-info {
margin-top: 18px;
}
.hero-section-ten .hero-image .shape-05 {
display: none !important;
}
.hero-section-ten .hero-image .shape-01 {
display: none !important;
}
.hero-section-ten .hero-image .shape-02 {
display: none !important;
}
.hero-section-ten .banner-form .shape-06 {
display: none !important;
}
.hero-section-ten .hero-image .shape-01 {
display: none !important;
}
}
@media (max-width: 767.98px) {
.hero-section-ten .hero-content {
padding: 60px 0;
}
.hero-section-ten h1{
font-size: 28x;
}
}