Initial production backup
This commit is contained in:
Tesscorp
+889
@@ -0,0 +1,889 @@
|
||||
.c_carousel {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
.c_carousel::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 10vw;
|
||||
background: linear-gradient(to right, white, transparent);
|
||||
z-index: 1;
|
||||
}
|
||||
.c_carousel::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
width: 10vw;
|
||||
background: linear-gradient(to left, white, transparent);
|
||||
z-index: 1;
|
||||
}
|
||||
.c_slides {
|
||||
display: flex;
|
||||
}
|
||||
.c_slides img {
|
||||
flex-shrink: 0;
|
||||
width: 50vw; /* Mobile first: ~2 visibles */
|
||||
height: 80px; /* Altura fija para no deformar */
|
||||
object-fit: contain; /* Mantiene proporción sin deformar */
|
||||
}
|
||||
@keyframes slide4 {
|
||||
from {
|
||||
transform: translateX(0);
|
||||
}
|
||||
to {
|
||||
transform: translateX(calc(-50vw * 4));
|
||||
}
|
||||
}
|
||||
@keyframes slide5 {
|
||||
from {
|
||||
transform: translateX(0);
|
||||
}
|
||||
to {
|
||||
transform: translateX(calc(-50vw * 12));
|
||||
}
|
||||
}
|
||||
.c_private .c_slides {
|
||||
animation: slide4 10s linear infinite;
|
||||
}
|
||||
.c_public .c_slides {
|
||||
animation: slide5 24s linear infinite;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
.c_private .c_slides img {
|
||||
width: 25vw; /* ~4 visibles en desktop */
|
||||
height: 100px; /* Altura fija en desktop */
|
||||
object-fit: contain; /* Mantiene proporción sin deformar */
|
||||
}
|
||||
.c_public .c_slides img {
|
||||
width: 20vw; /* ~5 visibles en desktop */
|
||||
height: 100px; /* Altura fija en desktop */
|
||||
object-fit: contain; /* Mantiene proporción sin deformar */
|
||||
}
|
||||
.c_carousel::before,
|
||||
.c_carousel::after {
|
||||
width: 5vw; /* Menos fade en desktops */
|
||||
}
|
||||
@keyframes slide4 {
|
||||
from {
|
||||
transform: translateX(0);
|
||||
}
|
||||
to {
|
||||
transform: translateX(calc(-25vw * 4));
|
||||
}
|
||||
}
|
||||
@keyframes slide5 {
|
||||
from {
|
||||
transform: translateX(0);
|
||||
}
|
||||
to {
|
||||
transform: translateX(calc(-20vw * 12));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.c-size {
|
||||
width: 600px;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.c-size {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
# Hero Section
|
||||
--------------------------------------------------------------*/
|
||||
|
||||
#hero {
|
||||
width: 100%;
|
||||
height: 600px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
background-color: white;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#hero:before {
|
||||
content: "";
|
||||
background: white;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
#hero .carousel-container {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
text-align: center;
|
||||
bottom: 0;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
#hero .hc-i1 {
|
||||
background-color: #d4efff;
|
||||
}
|
||||
|
||||
#hero .hc-i2 {
|
||||
background-color: #15296e;
|
||||
}
|
||||
|
||||
#hero .hc-i3 {
|
||||
background-color: #2baba3;
|
||||
}
|
||||
|
||||
#hero h2 {
|
||||
color: #fff;
|
||||
margin-bottom: 30px;
|
||||
font-size: 48px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
#hero p {
|
||||
width: 80%;
|
||||
-webkit-animation-delay: 0.4s;
|
||||
animation-delay: 0.4s;
|
||||
/* margin: 0 auto 30px auto; */
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#hero .carousel-control-prev,
|
||||
#hero .carousel-control-next {
|
||||
width: 10%;
|
||||
}
|
||||
|
||||
#hero .carousel-control-next-icon,
|
||||
#hero .carousel-control-prev-icon {
|
||||
background: none;
|
||||
font-size: 48px;
|
||||
line-height: 1;
|
||||
width: auto;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
#hero .btn-get-started {
|
||||
font-family: "Raleway", sans-serif;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
letter-spacing: 1px;
|
||||
display: inline-block;
|
||||
padding: 12px 32px;
|
||||
border-radius: 50px;
|
||||
transition: 0.5s;
|
||||
line-height: 1;
|
||||
margin: 10px;
|
||||
color: #fff;
|
||||
-webkit-animation-delay: 0.8s;
|
||||
animation-delay: 0.8s;
|
||||
border: 2px solid #f6b024;
|
||||
}
|
||||
|
||||
#hero .btn-get-started:hover {
|
||||
background: #f6b024;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
@media (min-width: 1024px) {
|
||||
#hero p {
|
||||
width: 80%;
|
||||
}
|
||||
#hero .carousel-control-prev,
|
||||
#hero .carousel-control-next {
|
||||
width: 5%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#hero h2 {
|
||||
font-size: 28px;
|
||||
}
|
||||
}
|
||||
|
||||
#mision::before,
|
||||
#vision::before,
|
||||
#valores::before,
|
||||
#servicios::before,
|
||||
#contacto::before {
|
||||
display: block;
|
||||
content: " ";
|
||||
margin-top: -65px;
|
||||
height: 65px;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.logo-vitalcare {
|
||||
max-width: 100px;
|
||||
}
|
||||
|
||||
.btn-vitalcare {
|
||||
color: white;
|
||||
background-color: teal;
|
||||
}
|
||||
|
||||
.btn-vitalcare:hover {
|
||||
color: gray;
|
||||
}
|
||||
|
||||
.somos {
|
||||
min-height: 500px;
|
||||
}
|
||||
|
||||
.img-somos {
|
||||
max-width: 300px;
|
||||
}
|
||||
|
||||
.text-somos {
|
||||
color: #263153;
|
||||
font-size: x-large;
|
||||
}
|
||||
|
||||
.row-mision {
|
||||
color: #263153;
|
||||
background-color: white;
|
||||
min-height: 500px;
|
||||
}
|
||||
|
||||
.row-vision {
|
||||
color: white;
|
||||
background-color: #2baba3;
|
||||
min-height: 500px;
|
||||
}
|
||||
|
||||
.row-valores {
|
||||
color: white;
|
||||
background-color: #475a9e;
|
||||
min-height: 500px;
|
||||
}
|
||||
|
||||
.row-servicios {
|
||||
color: #15296e;
|
||||
min-height: 500px;
|
||||
}
|
||||
.row-subtitulo {
|
||||
color: #21a6d4;
|
||||
min-height: 50px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.row-nosotro {
|
||||
color: #15296e;
|
||||
min-height: 50px;
|
||||
}
|
||||
|
||||
.row-suministro {
|
||||
color: white;
|
||||
background-color: #475a9e;
|
||||
min-height: 500px;
|
||||
/* text-shadow: 4px 4px black; */
|
||||
}
|
||||
|
||||
.row-contacto {
|
||||
min-height: 500px;
|
||||
}
|
||||
|
||||
.row-cuentas {
|
||||
min-height: 500px;
|
||||
}
|
||||
|
||||
.row-agenda {
|
||||
color: white;
|
||||
background-color: #2baba3;
|
||||
min-height: 500px;
|
||||
}
|
||||
|
||||
.row-precios {
|
||||
color: #15296e;
|
||||
}
|
||||
|
||||
.row-about {
|
||||
color: white;
|
||||
background-color: black;
|
||||
min-height: 100px;
|
||||
}
|
||||
|
||||
.card-icons {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
background-color: white;
|
||||
border: 1px solid;
|
||||
border-color: black;
|
||||
box-shadow: 1px 1px 8px 0px #7d7d7d;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.card-icons:hover {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
color: white;
|
||||
background-color: #15296e;
|
||||
border: 1px solid;
|
||||
border-color: black;
|
||||
box-shadow: 1px 1px 8px 0px #7d7d7d;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.card:hover > .icon > .img-card {
|
||||
filter: brightness(0) invert(1);
|
||||
}
|
||||
|
||||
.img-card {
|
||||
max-width: 80px;
|
||||
}
|
||||
|
||||
.img-agenda {
|
||||
max-width: 300px;
|
||||
}
|
||||
|
||||
.forma {
|
||||
color: black;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background-color: #2baba3;
|
||||
}
|
||||
|
||||
.btn {
|
||||
display: inline-block;
|
||||
padding: 0.5rem 1rem;
|
||||
font-size: 1rem;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.btn-yellow {
|
||||
background-color: #f5c542;
|
||||
color: #111;
|
||||
}
|
||||
|
||||
.pill {
|
||||
border-radius: 999px;
|
||||
}
|
||||
|
||||
.btn:hover {
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
.whatsapp {
|
||||
position: fixed;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
bottom: 40px;
|
||||
right: 40px;
|
||||
background-color: #25d366;
|
||||
color: #fff;
|
||||
border-radius: 50px;
|
||||
text-align: center;
|
||||
font-size: 30px;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.whatsapp-icon {
|
||||
margin-top: 13px;
|
||||
}
|
||||
|
||||
.fa:hover {
|
||||
color: gray;
|
||||
}
|
||||
|
||||
.tablabancaria {
|
||||
font-size: small;
|
||||
}
|
||||
|
||||
th.rotate {
|
||||
height: 80px;
|
||||
white-space: nowrap;
|
||||
position: relative;
|
||||
color: white;
|
||||
background-color: gray;
|
||||
}
|
||||
|
||||
th.rotate > div {
|
||||
transform: rotate(-90deg);
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 115px;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
/** Servicios cards **/
|
||||
|
||||
/*
|
||||
.about {
|
||||
position: fixed;
|
||||
z-index: 10;
|
||||
bottom: 10px;
|
||||
right: 10px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: flex-end;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.about .bg_links {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: rgba(255, 255, 255, 0.2);
|
||||
border-radius: 100%;
|
||||
backdrop-filter: blur(5px);
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.about .logo {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
z-index: 9;
|
||||
background-image: url(https://rafaelalucas91.github.io/assets/codepen/logo_white.svg);
|
||||
background-size: 50%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: 10px 7px;
|
||||
opacity: 0.9;
|
||||
transition: all 1s 0.2s ease;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.about .social {
|
||||
opacity: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.about .social .icon {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-size: 20px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-color: transparent;
|
||||
display: flex;
|
||||
transition: all 0.2s ease, background-color 0.4s ease;
|
||||
opacity: 0;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
.about .social.portfolio {
|
||||
transition: all 0.8s ease;
|
||||
}
|
||||
|
||||
.about .social.portfolio .icon {
|
||||
background-image: url(https://rafaelalucas91.github.io/assets/codepen/link.svg);
|
||||
}
|
||||
|
||||
.about .social.dribbble {
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.about .social.dribbble .icon {
|
||||
background-image: url(https://rafaelalucas91.github.io/assets/codepen/dribbble.svg);
|
||||
}
|
||||
|
||||
.about .social.linkedin {
|
||||
transition: all 0.8s ease;
|
||||
}
|
||||
|
||||
.about .social.linkedin .icon {
|
||||
background-image: url(https://rafaelalucas91.github.io/assets/codepen/linkedin.svg);
|
||||
}
|
||||
|
||||
.about:hover {
|
||||
width: 105px;
|
||||
height: 105px;
|
||||
transition: all 0.6s cubic-bezier(0.64, 0.01, 0.07, 1.65);
|
||||
}
|
||||
|
||||
.about:hover .logo {
|
||||
opacity: 1;
|
||||
transition: all 0.6s ease;
|
||||
}
|
||||
|
||||
.about:hover .social {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.about:hover .social .icon {
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
.about:hover .social:hover {
|
||||
background-size: 28px;
|
||||
}
|
||||
|
||||
.about:hover .social:hover .icon {
|
||||
background-size: 65%;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.about:hover .social.portfolio {
|
||||
right: 0;
|
||||
bottom: calc(100% - 40px);
|
||||
transition: all 0.3s 0s cubic-bezier(0.64, 0.01, 0.07, 1.65);
|
||||
}
|
||||
|
||||
.about:hover .social.portfolio .icon:hover {
|
||||
background-color: #698fb7;
|
||||
}
|
||||
|
||||
.about:hover .social.dribbble {
|
||||
bottom: 45%;
|
||||
right: 45%;
|
||||
transition: all 0.3s 0.15s cubic-bezier(0.64, 0.01, 0.07, 1.65);
|
||||
}
|
||||
|
||||
.about:hover .social.dribbble .icon:hover {
|
||||
background-color: #ea4c89;
|
||||
}
|
||||
|
||||
.about:hover .social.linkedin {
|
||||
bottom: 0;
|
||||
right: calc(100% - 40px);
|
||||
transition: all 0.3s 0.25s cubic-bezier(0.64, 0.01, 0.07, 1.65);
|
||||
}
|
||||
|
||||
.about:hover .social.linkedin .icon:hover {
|
||||
background-color: #0077b5;
|
||||
} */
|
||||
|
||||
.wrapper {
|
||||
width: 100vw;
|
||||
margin: 0 auto;
|
||||
height: 400px;
|
||||
background-color: #161616;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 767px) {
|
||||
.wrapper {
|
||||
height: 700px;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
max-width: 1024px;
|
||||
width: 100%;
|
||||
padding: 0 4%;
|
||||
padding-top: 250px;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 767px) {
|
||||
.content {
|
||||
padding-top: 300px;
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
|
||||
.card {
|
||||
width: 100%;
|
||||
max-width: 300px;
|
||||
min-width: 200px;
|
||||
height: 250px;
|
||||
background-color: white;
|
||||
margin: 10px;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0px 2px 10px rgba(0, 0, 0, 0);
|
||||
border: 2px solid rgba(7, 7, 7, 0.12);
|
||||
font-size: 16px;
|
||||
transition: all 0.3s ease;
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
cursor: pointer;
|
||||
transition: all 0.9s ease;
|
||||
}
|
||||
|
||||
.icon {
|
||||
margin: 0 auto;
|
||||
width: 100%;
|
||||
height: 80px;
|
||||
max-width: 80px;
|
||||
background: linear-gradient(90deg, white 0%, #15296e 60%, #15296e 0%);
|
||||
border-radius: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: white;
|
||||
transition: all 0.8s ease;
|
||||
background-position: 0px;
|
||||
background-size: 200px;
|
||||
}
|
||||
|
||||
.material-icons.md-18 {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.material-icons.md-24 {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.material-icons.md-36 {
|
||||
font-size: 36px;
|
||||
}
|
||||
|
||||
.material-icons.md-48 {
|
||||
font-size: 48px;
|
||||
}
|
||||
|
||||
.card .title {
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
margin-top: 30px;
|
||||
color: #15296e;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 4px;
|
||||
}
|
||||
|
||||
.card .text {
|
||||
width: 95%;
|
||||
margin: 0 auto;
|
||||
font-size: 13px;
|
||||
text-align: center;
|
||||
margin-top: 20px;
|
||||
color: #15296e;
|
||||
font-weight: 200;
|
||||
letter-spacing: 2px;
|
||||
opacity: 0;
|
||||
max-height: 0;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.card:hover {
|
||||
height: 280px;
|
||||
}
|
||||
|
||||
.card-integral:hover {
|
||||
height: 400px;
|
||||
justify-content: start !important;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.card-analisis:hover {
|
||||
height: 450px;
|
||||
justify-content: start !important;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.card-medbasico:hover {
|
||||
height: 550px;
|
||||
justify-content: start !important;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.card-altaespe:hover {
|
||||
height: 650px;
|
||||
justify-content: start !important;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.card-alianza:hover {
|
||||
height: 420px;
|
||||
justify-content: start !important;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.card-cura:hover {
|
||||
height: 580px;
|
||||
justify-content: start !important;
|
||||
padding-top: 20px;
|
||||
}
|
||||
.card-laboratorio:hover {
|
||||
height: 430px;
|
||||
justify-content: start !important;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.card-generico:hover {
|
||||
height: 350px;
|
||||
justify-content: start !important;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.card-medico:hover {
|
||||
height: 350px;
|
||||
justify-content: start !important;
|
||||
padding-top: 20px;
|
||||
}
|
||||
.card-analisis:hover {
|
||||
height: 350px;
|
||||
justify-content: start !important;
|
||||
padding-top: 20px;
|
||||
}
|
||||
.card-refrigeracion:hover {
|
||||
height: 350px;
|
||||
justify-content: start !important;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.card:hover .info {
|
||||
height: 90%;
|
||||
}
|
||||
|
||||
.card:hover .text {
|
||||
transition: all 0.3s ease;
|
||||
opacity: 1;
|
||||
max-height: 70px;
|
||||
}
|
||||
|
||||
.card:hover .icon {
|
||||
background-position: -120px;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.card:hover .icon i {
|
||||
background: linear-gradient(90deg, #ff7e7e, #ff4848);
|
||||
background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
opacity: 0.5;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
/** end Servicios Card**/
|
||||
|
||||
.img-precio {
|
||||
max-width: 300px;
|
||||
}
|
||||
|
||||
@media (min-width: 576px) {
|
||||
.container {
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.container {
|
||||
max-width: 992px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.container {
|
||||
max-width: 1200px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 576px) {
|
||||
#hero .carousel-container .carousel-item {
|
||||
max-height: 300px;
|
||||
}
|
||||
#hero .carousel {
|
||||
max-height: 600px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
}
|
||||
|
||||
/* ACORDEON DE CUENTAS*/
|
||||
|
||||
.accordion.width {
|
||||
border: 1px solid rgba(0, 0, 0, 0.125);
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.accordion.width .card {
|
||||
flex-direction: row;
|
||||
flex-grow: 0;
|
||||
flex-shrink: 1;
|
||||
min-width: min-content;
|
||||
}
|
||||
|
||||
.accordion.width .card .card-header {
|
||||
cursor: pointer;
|
||||
transform: rotate(180deg);
|
||||
writing-mode: vertical-rl;
|
||||
}
|
||||
|
||||
.accordion.width .card .card-header:not(.collapsed) {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.collapsing.width {
|
||||
transition: width 0s ease;
|
||||
height: auto;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
.text-yellow {
|
||||
color: rgb(211, 211, 15);
|
||||
}
|
||||
|
||||
.price-card {
|
||||
max-width: 300px;
|
||||
background-color: #070f3b;
|
||||
border-radius: 30px;
|
||||
}
|
||||
|
||||
.icono-precios {
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
/* Estilos para carrusel de marcas */
|
||||
.marcas-carousel {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.marcas-carousel .owl-carousel .item {
|
||||
text-align: center;
|
||||
padding: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-height: 100px;
|
||||
}
|
||||
|
||||
.marcas-carousel .owl-carousel .item img {
|
||||
max-height: 60px;
|
||||
max-width: 150px;
|
||||
width: auto;
|
||||
height: auto;
|
||||
object-fit: contain;
|
||||
filter: grayscale(0%);
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
.marcas-carousel .owl-carousel .item img:hover {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
.marcas-carousel .owl-nav {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.marcas-carousel .owl-dots {
|
||||
display: none;
|
||||
}
|
||||
Reference in New Issue
Block a user