
.mobversionarticle121 {

    position: relative;

    width: 100%;

    height: 160px;

    margin: 0px;

    overflow: hidden;

}



.mobversionarticle {
    margin-top: 90px;
    border-radius: 25px;
    width: 1345px;
    height: 40px;
    transform: translateX(-50%);
    left: 50%;
    padding-left: 10px;

}


.mobversionarticle121buttoons {

    position: relative;
    width: 95px;
    height: 25px;
    margin-top: 4px;
    margin-left: 0px;
    display: inline-flex;

}


.divbuttonsmob {

    width: -webkit-fill-available;

    height: 100%;

    position: relative;



}


.backToHome {

    position: absolute;

    top: 3.5px;

    padding: 0px;

    height: 24px;

    width: fit-content;

    border-radius: 15px;

    border: 1px solid #44484c;

    background-color: white;

}



.backToHome p {

    padding: 0px;

    color: #494e52;

    font-weight: 600;

    font-size: 13px;

    margin: 0px;

    margin-top: 4px;

    margin-left: 28px;

    margin-right: 8px;

}



.backToHome a {

    text-decoration: none;

}


.backToHomeButton {
    
    left: -1px;
    top: -1px;
    width: 26px;
    height: 26px;
    /* border: 1px solid #44494d; */
    background-color: #494e52;
    position: absolute;
    border-radius: 100%;
    background-image: url(../img/filterButton12.png);
    background-size: cover;
    background-position: center;

}


.mobversionarticle121firsth1 {

    display: none;

    font-size: 26px;

    color: #42474a;

    margin-top: 17px;

}


.mobversionarticle1 {

    display: none;

    top: 106px;

    height: 62px;

    width: 100%;

    bottom: 0;

    white-space: nowrap;

    overflow-x: auto;

}



.mobversionarticle1 p {

    position: absolute;

    color: white;

    font-size: 11px;

    font-weight: 600;

    bottom: -3px;

    left: 12px;

    z-index: 1;

}


.mobversionarticle11 {

    position: relative;

    overflow: hidden;

    height: 54px;

    margin-right: 5px;

    width: 90px;

    display: inline-block;

    border-radius: 23px;

}



.mobversionarticle11u {

    position: relative;

    height: 50px;

    margin-right: 5px;

    width: 35px;

    display: inline-block;

    border-radius: 23px;

}



.checknaznacenie {

    position: absolute;

    height: 10px;

    width: 10px;

    border-radius: 12px;

    border: 3px solid white;

    background-color: white;

    margin-left: -26px;

    margin-top: 6.5px;

    z-index: 1;

}



.labelcatalog3 input:checked ~ .checknaznacenie {

    background-color: white;

}


.inppluslab {

    position: absolute;

    margin-left: 65px;

    margin-top: 10px;

    display: none;

}



.imgpluslab1 {

    position: absolute;

    width: 100%;

    height: 100%;

    border-radius: 10px;

} 


.imgpluslab {

    width: 100%;

    border-radius: 10px;

} 






.filterProodButtons {

    width: 1200px;
    height: 90%;
    position: fixed;
    /* left: 5%; */
    position: absolute;
    top: 50px;
    overflow-y: auto;
    transition: 0.7s all ease-in-out;
    transform: translateX(-50%);
    left: 50%;

}

.filterProodButtons::-webkit-scrollbar {

    width: 5px;

}



.filterProodButtons::-webkit-scrollbar-thumb {

    border-radius: 10px;

    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);

    background-color: #686b6c;

}

.mobversionarticle17 {

    top: 106px;

    height: 30px;

    width: 99%;

    display: flow-root;

    bottom: 0;

    overflow: hidden;

}

.mobversionarticle17 p {

    position: absolute;

    color: white;

    font-size: 11px;

    font-weight: 600;

    bottom: -3px;

    left: 12px;

    z-index: 1;

}

.mobversionarticle17 h3 {

    color: #686b6c;

    font-weight: 600;

    font-size: 16px;

    margin-left: 8px;

    margin-top: 7px;

    margin-bottom: 7px;

}

.divCloseThis011 {

    z-index: 1;

    width: 99%;

    height: 30px;

    position: absolute;

}

.divCloseThis01 {

    z-index: 1;

    width: 99%;

    height: 30px;

    position: absolute;

}


.imgClosePosition {

    float: right;

    margin-top: 7px;

    /* position: absolute; */

    width: 20px;

    height: 20px;

    /* right: 5px; */

    /* top: 8px; */

    transform: rotate(90deg);

    opacity: 1;

}

.imgClosePosition1 {

    float: right;

    margin-top: 7px;

    /* position: absolute; */

    width: 20px;

    height: 20px;

    /* right: 5px; */

    /* top: 8px; */

    transform: rotate(90deg);

    opacity: 1;

}

.imgClosePosition2 {

    float: right;

    margin-top: 7px;

    /* position: absolute; */

    width: 20px;

    height: 20px;

    /* right: 5px; */

    /* top: 8px; */

    transform: rotate(90deg);

    opacity: 1;

}

.imgClosePosition3 {

    float: right;

    margin-top: 7px;

    /* position: absolute; */

    width: 20px;

    height: 20px;

    /* right: 5px; */

    /* top: 8px; */

    transform: rotate(90deg);

    opacity: 1;

}

.imgOpenedPosition {

    float: right;

    margin-top: 7px;

    /* position: absolute; */

    width: 20px;

    height: 20px;

    /* right: 5px; */

    /* top: 8px; */

    opacity: 0;

}

.imgOpenedPosition1 {

    float: right;

    margin-top: 7px;

    /* position: absolute; */

    width: 20px;

    height: 20px;

    /* right: 5px; */

    /* top: 8px; */

    opacity: 0;

}

.imgOpenedPosition2 {

    float: right;

    margin-top: 7px;

    /* position: absolute; */

    width: 20px;

    height: 20px;

    /* right: 5px; */

    /* top: 8px; */

    opacity: 0;

}

.imgOpenedPosition3 {

    float: right;

    margin-top: 7px;

    /* position: absolute; */

    width: 20px;

    height: 20px;

    /* right: 5px; */

    /* top: 8px; */

    opacity: 0;

}




.mobversionarticle18 {

    top: 106px;

    height: 30px;

    width: 99%;

    display: flow-root;

    bottom: 0;

    overflow: hidden;

}

.mobversionarticle18 p {

    position: absolute;

    color: white;

    font-size: 11px;

    font-weight: 600;

    bottom: -3px;

    left: 12px;

    z-index: 1;

}


.divCloseThis1 {

    z-index: 1;

    width: 99%;

    height: 30px;

    position: absolute;

}



.divCloseThis11 {

    z-index: 1;

    width: 99%;

    height: 30px;

    position: absolute;

}

.divCloseThis2 {

    z-index: 1;

    width: 99%;

    height: 30px;

    position: absolute;

}



.divCloseThis22 {

    z-index: 1;

    width: 99%;

    height: 30px;

    position: absolute;

}



.divCloseThis3 {

    z-index: 1;

    width: 99%;

    height: 30px;

    position: absolute;

}



.divCloseThis33 {

    z-index: 1;

    width: 99%;

    height: 30px;

    position: absolute;

}



.divCloseThis4 {

    z-index: 1;

    width: 99%;

    height: 30px;

    position: absolute;

}



.divCloseThis44 {

    z-index: 1;

    width: 99%;

    height: 30px;

    position: absolute;

}


.imgClosePosition4 {

    float: right;

    margin-top: 7px;

    /* position: absolute; */

    width: 20px;

    height: 20px;

    /* right: 5px; */

    /* top: 8px; */

    transform: rotate(90deg);

    opacity: 1;

}

.imgOpenedPosition4 {

    float: right;

    margin-top: 7px;

    /* position: absolute; */

    width: 20px;

    height: 20px;

    /* right: 5px; */

    /* top: 8px; */

    opacity: 0;

}


.mobversionarticle19 {

    top: 106px;

    height: 30px;

    width: 99%;

    display: flow-root;

    bottom: 0;

    overflow: hidden;

}

.mobversionarticle19 p {

    position: absolute;

    color: white;

    font-size: 11px;

    font-weight: 600;

    bottom: -3px;

    left: 12px;

    z-index: 1;

}

.mobversionarticle19 h3 {

    color: #686b6c;

    font-weight: 600;

    font-size: 16px;

    margin-left: 8px;

    margin-top: 7px;

    margin-bottom: 7px;

}

.mobversionarticle20 h3 {

    color: #686b6c;

    font-weight: 600;

    font-size: 16px;

    margin-left: 8px;

    margin-top: 7px;

    margin-bottom: 7px;

}

.mobversionarticle20 {

    top: 106px;

    height: 30px;

    width: 99%;

    display: flow-root;

    bottom: 0;

    overflow: hidden;

}

.mobversionarticle20 p {

    position: absolute;

    color: white;

    font-size: 11px;

    font-weight: 600;

    bottom: -3px;

    left: 12px;

    z-index: 1;

}

.mobversionarticle21 p {

    position: absolute;

    color: white;

    font-size: 11px;

    font-weight: 600;

    bottom: -3px;

    left: 12px;

    z-index: 1;

}

.mobversionarticle21 h3 {

    color: #686b6c;

    font-weight: 600;

    font-size: 16px;

    margin-left: 8px;

    margin-top: 7px;

    margin-bottom: 7px;

}

.mobversionarticle21 {

    top: 106px;

    height: 30px;

    width: 99%;

    display: flow-root;

    bottom: 0;

    overflow: hidden;

}


.mobversionarticle18 h3 {

    color: #686b6c;

    font-weight: 600;

    font-size: 16px;

    margin-left: 8px;

    margin-top: 7px;

    margin-bottom: 7px;

}




/* The container */

.containerLabelFilter {

    display: block;

    position: relative;

    padding-left: 35px;

    margin-bottom: 7px;

    margin-left: 4px;

    cursor: pointer;

    font-size: 16px;

    font-weight: 600;

    -webkit-user-select: none;

    -moz-user-select: none;

    -ms-user-select: none;

    user-select: none;

    background-color: #686b6c;

    width: fit-content;

    border-radius: 15px;

    float: left;

    color: white;

    padding-bottom: 3px;

    padding-top: 1px;

    padding-right: 8px;

}


/* Hide the browser's default  */

.containerLabelFilter input {

  position: absolute;

  opacity: 0;

  cursor: pointer;

  height: 0;

  width: 0;

}



/* Create a custom  */

.checkmarkLabelFilter {

  position: absolute;

  top: -8px;

  left: 26px;

  height: 21px;

  width: 21px;

  border-radius: 100%;

  background-color: #686b6c;

}



/* On mouse-over, add a grey background color */

.containerLabelFilter:hover input ~ .checkmarkLabelFilter {

  background-color: #494E52;

}



/* When the  is checked, add a blue background */

.containerLabelFilter input:checked ~ .checkmarkLabelFilter {

  background-color: #494E52;

}



/* Create the checkmark/indicator (hidden when not checked) */




/* Style the checkmark/indicator */

.containerLabelFilter .checkmarkLabelFilter:after {

  left: 7px;

  top: 3px;

  width: 5px;

  height: 10px;

  border: solid white;

  border-width: 0 3px 3px 0;

  -webkit-transform: rotate(45deg);

  -ms-transform: rotate(45deg);

  transform: rotate(45deg);

}




.checkmarkLabelFilter:after {

  content: "";

  position: absolute;

  display: none;

}



/* Show the checkmark when checked */

.containerLabelFilter input:checked ~ .checkmarkLabelFilter:after {

  display: block;

}




.wrapper{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 400px;
    margin: 50vh auto 0;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
}

.switch_box{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    max-width: 200px;
    min-width: 200px;
    height: 200px;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
}

/* Switch 1 Specific Styles Start */

.box_1{
    background: #eee;
}

input[type="checkbox"].switch_1{
    font-size: 30px;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    width: 1.5em;
    height: 0.8em;
    background: #ddd;
    border-radius: 3em;
    position: relative;
    cursor: pointer;
    outline: none;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
  }
  
  input[type="checkbox"].switch_1:checked{
    background: #686b6c;
  }
  
  input[type="checkbox"].switch_1:after{
    position: absolute;
    content: "";
    width: 0.8em;
    height: 0.8em;
    border-radius: 50%;
    background: #fff;
    -webkit-box-shadow: 0 0 .25em rgba(0,0,0,.3);
            box-shadow: 0 0 .25em rgba(0,0,0,.3);
    -webkit-transform: scale(.7);
            transform: scale(.7);
    left: 0;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
  }
  
  input[type="checkbox"].switch_1:checked:after{
    left: calc(100% - 0.8em);
  }
    
/* Switch 1 Specific Style End */


/* Switch 2 Specific Style Start */

.box_2{
    background: #666;
}

input[type="checkbox"].switch_2{
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  width: 100px;
  height: 8px;
  background: #444;
  border-radius: 5px;
  position: relative;
  outline: 0;
  cursor: pointer;
}

input[type="checkbox"].switch_2:before,
input[type="checkbox"].switch_2:after{
  position: absolute;
  content: "";
  -webkit-transition: all .25s;
  transition: all .25s;
}

input[type="checkbox"].switch_2:before{
  width: 40px;
  height: 40px;
  background: #ccc;
  border: 5px solid #666;
  border-radius: 50%;
  top: 50%;
  left: 0;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

input[type="checkbox"].switch_2:after{
  width: 30px;
  height: 30px;
  background: #666;
  border-radius: 50%;
  top: 50%;
  left: 10px;
  -webkit-transform: scale(1) translateY(-50%);
          transform: scale(1) translateY(-50%);
  -webkit-transform-origin: 50% 50%;
          transform-origin: 50% 50%;
}

input[type="checkbox"].switch_2:checked:before{
  left: calc(100% - 35px);
}

input[type="checkbox"].switch_2:checked:after{
  left: 75px;
  -webkit-transform: scale(0);
          transform: scale(0);
}

/* Switch 2 Specific Style End */

    
/* Switch 3 Specific Style Start */

.box_3{
    background: #19232b;
}

.toggle_switch{
  width: 100px;
  height: 45px;
  position: relative;
}

input[type="checkbox"].switch_3{
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
  outline: 0;
  z-index: 1;
}

svg.checkbox .outer-ring{
  stroke-dasharray: 375;
  stroke-dashoffset: 375;
  -webkit-animation: resetRing .35s ease-in-out forwards;
          animation: resetRing .35s ease-in-out forwards;
}

input[type="checkbox"].switch_3:checked + svg.checkbox .outer-ring{
  -webkit-animation: animateRing .35s ease-in-out forwards;
          animation: animateRing .35s ease-in-out forwards;
}

input[type="checkbox"].switch_3:checked + svg.checkbox .is_checked{
  opacity: 1;
  -webkit-transform: translateX(0) rotate(0deg);
          transform: translateX(0) rotate(0deg);
}

input[type="checkbox"].switch_3:checked + svg.checkbox .is_unchecked{
  opacity: 0;
  -webkit-transform: translateX(-200%) rotate(180deg);
          transform: translateX(-200%) rotate(180deg);
}


svg.checkbox{
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

svg.checkbox .is_checked{
  opacity: 0;
  fill: yellow;
  -webkit-transform-origin: 50% 50%;
          transform-origin: 50% 50%;
  -webkit-transform: translateX(200%) rotate(45deg);
          transform: translateX(200%) rotate(45deg);
  -webkit-transition: all .35s;
  transition: all .35s;
}

svg.checkbox .is_unchecked{
  opacity: 1;
  fill: #fff;
  -webkit-transform-origin: 50% 50%;
          transform-origin: 50% 50%;
  -webkit-transform: translateX(0) rotate(0deg);
          transform: translateX(0) rotate(0deg);
  -webkit-transition: all .35s;
  transition: all .35s;
}

@-webkit-keyframes animateRing{
  to{
    stroke-dashoffset: 0;
    stroke: #b0aa28;
  }
}

@keyframes animateRing{
  to{
    stroke-dashoffset: 0;
    stroke: #b0aa28;
  }
}

@-webkit-keyframes resetRing{
  to{
    stroke-dashoffset: 0;
    stroke: #233043;
  }
}

@keyframes resetRing{
  to{
    stroke-dashoffset: 0;
    stroke: #233043;
  }
}

/* Switch 3 Specific Style End */


/* Switch 4 Specific Style Start */

.box_4{
    background: #eee;
}

.input_wrapper{
  width: 80px;
  height: 40px;
  position: relative;
  cursor: pointer;
}

.input_wrapper input[type="checkbox"]{
  width: 80px;
  height: 40px;
  cursor: pointer;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: #315e7f;
  border-radius: 2px;
  position: relative;
  outline: 0;
  -webkit-transition: all .2s;
  transition: all .2s;
}

.input_wrapper input[type="checkbox"]:after{
  position: absolute;
  content: "";
  top: 3px;
  left: 3px;
  width: 34px;
  height: 34px;
  background: #dfeaec;
  z-index: 2;
  border-radius: 2px;
  -webkit-transition: all .35s;
  transition: all .35s;
}

.input_wrapper svg{
  position: absolute;
  top: 50%;
  -webkit-transform-origin: 50% 50%;
          transform-origin: 50% 50%;
  fill: #fff;
  -webkit-transition: all .35s;
  transition: all .35s;
  z-index: 1;
}

.input_wrapper .is_checked{
  width: 18px;
  left: 18%;
  -webkit-transform: translateX(190%) translateY(-30%) scale(0);
          transform: translateX(190%) translateY(-30%) scale(0);
}

.input_wrapper .is_unchecked{
  width: 15px;
  right: 10%;
  -webkit-transform: translateX(0) translateY(-30%) scale(1);
          transform: translateX(0) translateY(-30%) scale(1);
}

/* Checked State */
.input_wrapper input[type="checkbox"]:checked{
  background: #23da87;
}

.input_wrapper input[type="checkbox"]:checked:after{
  left: calc(100% - 37px);
}

.input_wrapper input[type="checkbox"]:checked + .is_checked{
  -webkit-transform: translateX(0) translateY(-30%) scale(1);
          transform: translateX(0) translateY(-30%) scale(1);
}

.input_wrapper input[type="checkbox"]:checked ~ .is_unchecked{
  -webkit-transform: translateX(-190%) translateY(-30%) scale(0);
          transform: translateX(-190%) translateY(-30%) scale(0);
}

/* Switch 4 Specific Style End */























#checklist {
  --background: #ffffff;
  --text: #414856;
  --check: #4F29F0;
  --disabled: #C3C8DE;
  --width: 100px;
  --height: 140px;
  --border-radius: 10px;
  background: var(--background);
  width: var(--width);
  height: var(--height);
  border-radius: var(--border-radius);
  position: relative;
  box-shadow: 0 10px 30px rgba(#414856, 0.05);
  padding: 30px 45px;
  display: grid;
  grid-template-columns: 30px auto;
  align-items: center;
  label {
    color: var(--text);
    position: relative;
    cursor: pointer;
    display: grid;
    align-items: center;
    width: fit-content;
    transition: color .3s ease;
    &::before,
    &::after {
      content:"";
      position: absolute;
    }
    &::before {
      height: 2px;
      width: 8px;
      left: -27px;
      background: var(--check);
      border-radius: 2px;
      transition: background .3s ease; 
    }
    &:after {
      height: 4px;
      width: 4px;
      top: 8px;
      left: -25px;
      border-radius: 50%;
    }
  }
  input[type="checkbox"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    position: relative;
    height: 15px;
    width: 15px;
    outline: none;
    border: 0;
    margin: 0 15px 0 0;
    cursor: pointer;
    background: var(--background);
    display: grid;
    align-items: center;
    &::before,
    &::after {
      content:"";
      position: absolute;
      height: 2px;
      top: auto;
      background: var(--check);
      border-radius: 2px;
    }
    &::before {
      width: 0px;
      right: 60%;
      transform-origin: right bottom;
    }
    &::after {
      width: 0px;
      left: 40%;
      transform-origin: left bottom;
    }
    &:checked {
      &::before {
        animation: check-01 .4s ease forwards;
      }
      &::after {
        animation: check-02 .4s ease forwards;
      }
      + label {
        color: var(--disabled);
        animation: move .3s ease .1s forwards;
        &::before {
          background: var(--disabled);
          animation: slice .4s ease forwards;
        }
        &::after {
          animation: firework .5s ease forwards .1s;
        }
      }
    }
  }
}

@keyframes move {
  50% {
    padding-left: 8px;
    padding-right: 0px;
  }
  100% {
    padding-right: 4px;
  }
}
@keyframes slice {
  60% {
    width: 100%;
    left: 4px;
  }
  100% {
    width: 100%;
    left: -2px;
    padding-left: 0;
  }
}
@keyframes check-01 {
  0% {
    width: 4px;
    top: auto;
    transform: rotate(0);
  }
  50% {
    width: 0px;
    top: auto;
    transform: rotate(0);
  }
  51% {
    width: 0px;
    top: 8px;
    transform: rotate(45deg);
  }
  100% {
    width: 5px;
    top: 8px;
    transform: rotate(45deg);
  }
}
@keyframes check-02 {
  0% {
    width: 4px;
    top: auto;
    transform: rotate(0);
  }
  50% {
    width: 0px;
    top: auto;
    transform: rotate(0);
  }
  51% {
    width: 0px;
    top: 8px;
    transform: rotate(-45deg);
  }
  100% {
    width: 10px;
    top: 8px;
    transform: rotate(-45deg);
  }
}
@keyframes firework {
  0% {
    opacity: 1;
    box-shadow: 0 0 0 -2px #4F29F0, 0 0 0 -2px #4F29F0, 0 0 0 -2px #4F29F0, 0 0 0 -2px #4F29F0, 0 0 0 -2px #4F29F0, 0 0 0 -2px #4F29F0;
  }
  30% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    box-shadow: 0 -15px 0 0px #4F29F0, 14px -8px 0 0px #4F29F0, 14px 8px 0 0px #4F29F0, 0 15px 0 0px #4F29F0, -14px 8px 0 0px #4F29F0, -14px -8px 0 0px #4F29F0;
  }
}



.blockInpp {
    position: relative;
    height: 34px;
    width: fit-content;
    float: left;
    margin-left: 5px;
}


.blFillCaut {
        position: absolute;
    width: 1200px;
    height: 50px;
    transform: translateX(-50%);
    left: 50%;
    bottom: 0px;
}


.LoadFilter {
    /* opacity: 0; */
    position: fixed;
    left: 7px;
    bottom: 9px;
    background-color: #686b6c;
    letter-spacing: 2px;
    color: white;
    margin-top: 20px;
    padding: 8px;
    padding-left: 15px;
    padding-right: 15px;
    border-radius: 20px;
    border: none;
    transition: 0.7s all ease-in-out;
}


.LoadFilter1 {
    right: 0;
    float: right;
    top: 0px;
    bottom: 33px;
    background-color: #43474b;
    letter-spacing: 2px;
    color: white;
    margin-top: -60px;
    padding: 8px;
    padding-left: 15px;
    padding-right: 15px;
    border-radius: 20px;
    border: none;
    transition: 0.7s all ease-in-out;
    cursor: pointer;
}



.divzzz {
  position: relative;
    overflow: hidden;
    /* min-height: 250px; */
    height: 310px;
    width: auto;
    border-radius: 30px;
    /* margin-left: 26px; */
    /* margin-right: 26px; */
    /* margin-top: 20px; */
    margin: 10px;
    transition: all 1s ease-in-out;
}


.saleInProducts {
    left: 0px;
    height: fit-content;
    position: absolute;
    display: flex;
}