:root{
    --tds-spacer-base:4px;
    --tds-size--1x: 8px;
    --tds-size--3x: 24px;
    --tds-size--9x: 72px;
    --tds-color--grey35: #8e8e8e;
  --tds-color--grey40: #a2a3a5;
  --tds-color--grey30: #5c5e62;
  --tds-btn--border-radius:4px;
  --tds-color--blue10: #2e4994;
  --tds-color--blue20: #3457b1;
  --tds-color--blue30: #3e6ae1;
  --tds-color--red10: #9b1d10;
  --tds-color--red20: #ed4e3b;
  --tds-color--grey10: #171a20;
  --tds-color--grey15: #222;
  --tds-border-style: solid;
  --tds-border-width--hairline: 1px;
  --tds-border-width--large: 3px;
  --tds-border-width--medium: 2px;
  --tds-border-width--small: 1px;
  --tds-spacer-base: var(--tds-size--half);
  --tds-spacer-1x: var(--tds-spacer-base);
  --tds-spacer-2x: calc(var(--tds-spacer-base)*2);
  --tds-spacer-3x: calc(var(--tds-spacer-base)*3);
  --tds-spacer-4x: calc(var(--tds-spacer-base)*4);
  --tds-spacer-5x: calc(var(--tds-spacer-base)*5);
  --tds-spacer-6x: calc(var(--tds-spacer-base)*6);
  --tds-spacer-8x: calc(var(--tds-spacer-base)*8);
  --tds-spacer-10x: calc(var(--tds-spacer-base)*10);
  --tds-spacer-12x: calc(var(--tds-spacer-base)*12);
  --tds-spacer-14x: calc(var(--tds-spacer-base)*14);
  --tds-spacer-16x: calc(var(--tds-spacer-base)*16);
  --tds-spacer-18x: calc(var(--tds-spacer-base)*18);
  --tds-spacer-20x: calc(var(--tds-spacer-base)*20);
  --tds-spacer-24x: calc(var(--tds-spacer-base)*24);
  --tds-spacer-32x: calc(var(--tds-spacer-base)*32);
  }
  .contentvv i {
    width: 132px;
  font-size: 1.5rem;
  /* display: flex; */
  /* justify-content: center; */
}
.imgbb{
display: flex;
align-items: center;
justify-content: center;
}
.agendar{
grid-gap: 24px;
  display: grid;
  grid-template-columns: repeat(12,90px);
  justify-content: center;
  margin: auto;
  max-width: 1440px;
  min-height: 64vh;
}
.test-handheld-container{
grid-column: 4/10;
  margin-top: 116px;
}
.content-holder{
position: relative;
} 
.tds-layout-item{
grid-column: 1 / 13;
}
.demo-containershow{

}
.header-container {
  margin-bottom: 24px;
}
.tds--no_padding {
  padding: 0 !important;
}
.tds--vertical_padding--small {
  -webkit-padding-after: var(--tds-size--1x) !important;
  -webkit-padding-before: var(--tds-size--1x) !important;
  padding-block-end: var(--tds-size--1x) !important;
  padding-block-start: var(--tds-size--1x) !important;
}
.soft-selection {
  grid-gap: var(--tds-size--3x);
  display: grid;
  gap: var(--tds-size--3x);
  grid-template-columns: repeat(3,1fr);
  margin-bottom: 0;
  padding: 0;
}
.soft-selection .button-container{
box-sizing: border-box;
  display: flex;
  flex-direction: column;
  height: 275px;
  justify-content: flex-start;
}
.soft-selection .button-container::-webkit-scrollbar {
  width: 6px;
  background-color: transparent;
}
.tds-btn {
  --tds-btn--background-color: var(--tds-theme-primary);
  --tds-btn--border-color: transparent;
  --tds-btn--border-radius: 4px;
  align-items: center;
  background-color: var(--tds-btn--background-color);
  block-size: var(--tds-height--pill);
  border: var(--tds-border-width--large) solid var(--tds-btn--border-color);
  border-radius: var(--tds-btn--border-radius);
  box-shadow: inset 0 0 0 var(--tds-border-width--medium) transparent;
  color: var(--tds-theme-foreground-on-primary);
  display: inline-flex;
  font-family: var(--tds-font-family--combined);
  font-size: var(--tds-btn--font-size);
  font-weight: var(--tds-font-weight--medium);
  justify-content: center;
  line-height: 1.2;
  padding: var(--tds-size--half) var(--tds-size--3x);
  position: relative;
  text-align: center;
  text-transform: inherit;
  transition: border-color .33s ease,background-color .33s ease,color .33s ease,box-shadow .25s ease;
}
.soft-selection button.models {
  background-color: #fff;
  border: 1px solid var(--tds-color--grey40);
  color: var(--tds-color--grey30);
  flex-grow: 1;
  margin: 0 0 15px;
  max-height: 50px;
}
.soft-selection .img-container {
  grid-column: span 2;
}
.image-container {
  grid-column: span 2;
}
.soft-selection .marca-image.hide {
  display: none;
}
.soft-selection .marca-image.showw {
  display: flex;
  padding-top: 0;
  align-items: center;
  justify-content: center;

}
.soft-selection .marca-image img {
  /* width: 100%; */
  width: auto;
}
.selectedButton1 {
  border-color: var(--tds-color--blue30);
  box-shadow: inset 0 0 0 var(--tds-border-width--medium) var(--tds-color--blue30);
  color: var(--tds-color--grey10);
}
.selectedButton2 {
  border-color: var(--tds-color--red10);
  box-shadow: inset 0 0 0 var(--tds-border-width--medium) var(--tds-color--red10);
  color: var(--tds-color--grey10);
}
.selectedButton3 {
  border-color: var(--tds-color--blue30);
  box-shadow: inset 0 0 0 var(--tds-border-width--medium) var(--tds-color--grey10);
  color: var(--tds-color--grey10);
}
@media (max-width: 599px){
.agendar{
  grid-gap: 24px;
  display: grid;
  grid-template-columns: repeat(2,1fr);
  justify-content: center;
  margin-top: var(--tds-size--9x) auto;
  padding: 24px;
}
.test-handheld-container{
  grid-column: 1/-1;
  margin-top: var(--tds-size--2x);
}
:is(h1,.tds-text--h1,.tds-text--h1-alt) {
  margin-top: var(--tds-spacer-14x);
}
.car-selection {
  display: grid;
  grid-template-columns: auto;
  margin: var(--tds-size-6x) auto auto auto;
  max-width: 100%;
}
.header-container {
  width: 100%;
}
.soft-selection {
display: grid;
  grid-template-columns: auto;
  margin: var(--tds-size-6x) auto auto auto;
  max-width: 100%;
}
.soft-selection .button-container{
-ms-overflow-style: none;
  flex-direction: row;
  grid-column: span 2;
  height: auto;
  order: 1;
  overflow: scroll;
  scrollbar-width: none;
  width: 100%;
}
.soft-selection button.models {
margin-right: 10px;
  margin-top: var(--tds-size--2x);
  min-width: 135px;
  padding: 20px 25px;
  width: auto;
}
.tds-btn {
  inline-size: 100%;
  inline-size: -webkit-fill-available;
}
.soft-selection .marca-image.showw {
display: block;
  width: 100%;
}
}

.container-card-slider {
width: 100%;
min-height: 70vh;
background-color: #fff;
overflow: hidden;
perspective: 100px;
perspective-origin: 50% 10%;
  }
.slide {
user-select: none;
/* line-height: 150px; */
/* display: block; */
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-around;
position: absolute;
top: 50%;
left: 50%;
width: 80%;
max-width: 800px;
min-width: 250px;
height: 50%;
min-height: 300px;
max-height: 500px;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
background-size: cover;
background-position: center;
cursor: pointer;
transition: all .5s;
border-radius: 15px;
background-color: #fff;
padding: 50px;
}
.slide p{
text-align: center;
padding: 0 50px;
}
.slider-image{
display: flex;
justify-content: center;
align-items: center;
user-select: none;
}
.slider-info{
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-around;
}
#slide_1 {
transform: translate3d(-50%, -50%, 0);
z-index: 4;
}

#slide_2 {
transform: translate3d(-50%, -55%, -15px);
z-index: 3;
opacity: .8;
}

#slide_3 {
transform: translate3d(-50%, -60%, -30px);
z-index: 2;
opacity: .6;
}

#slide_4 {
transform: translate3d(-50%, -65%, -45px);
z-index: 1;
opacity: 0;
}
#slide_5 {
transform: translate3d(-50%, -65%, -45px);
z-index: 1;
opacity: 0;
}
#slide_6 {
transform: translate3d(-50%, -65%, -45px);
z-index: 1;
opacity: 0;
}
#slide_7 {
transform: translate3d(-50%, -65%, -45px);
z-index: 1;
opacity: 0;
}
#slide_8{
transform: translate3d(-50%, -65%, -45px);
z-index: 1;
opacity: 0;
}
#slide_9 {
transform: translate3d(-50%, -65%, -45px);
z-index: 1;
opacity: 0;
}

@keyframes move {
0% {
  top: 50%;
  opacity: 1;
}

100% {
  top: 135%;
  opacity: 0;
}
}