:root {

    --boder-radius-bottom: 5%
}

html body {

    background-color: #fefcfbff ;
    font-family: 'Helvetica', 'Arial', sans-serif;
    height: 100%;
    margin: 0;
    padding: 0;
}

.navbar {


    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 10%;
    background-color: transparent;
    z-index: 1000;
    background-color: transparent;
    transition: background-color 1s;


}

.navbar.scrolled {
    background: #0a1128ff;
    
}

/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
    /* Styles */
    .button-navbar-modify
{
 
    position: relative;
    right: 0;
   
}
}

/* Desktops and laptops ----------- */
@media only screen 
and (min-width : 1224px) {
    /* Styles */

    .button-navbar-modify
{
 
    position: absolute;
    right: 0;
   
}
}

/* Large screens ----------- */
@media only screen 
and (min-width : 1824px) {
    /* Styles */
    .button-navbar-modify
{
 
    position: absolute;
    right: 0;
   
}
}

.navbar a {
    color: transparent;
    color: white;
    padding: 10px 20px;
    text-decoration: none;
    margin-right: 10px;
    font-size: 20px;
    font-weight: bold;
}
.navbar .navbar-toggler .icon-bar {
    background: black !important;
  }


.img-navbar-modify
{
    position: absolute;
    left: 2%;
    top: 10px;

    width: 150px;
    height: 50px;
    background-image: url("../design/LogNavbar/logo-navbar.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
  

}

.container-nabvar
{
    position: absolute;
    top: 0;
    border: 2px solid blue;
}

.row-indetify
{
    border: 2px solid red;

}

.col-identify
{
    border: 2px solid white;

}
.col-identify-1
{
    
    border: 5px solid greenyellow;


}

.jumbotron-modify {


    background: rgb(10,17,40);
background: linear-gradient(180deg, rgba(10,17,40,1) 22%, rgba(3,64,120,1) 89%);
    height: 100vh;
    border-bottom-right-radius: 300px;
    position:relative;
    z-index: 1;
    overflow: hidden;
}


.section-info
{

    margin: 5%;
}


.particle-modify {

    top: 0;
    position: absolute;
    display: flex;
    justify-content: center;
    /* Centrar horizontalmente */
    align-items: center;
    height: 100vh;
    width: 100%;
   
}

.jumbotron-modify-2
{
    
  height: 100vh;
  position: 0;
  z-index: 0;
  position: relative;

}

.svg-1
{
    width: 100%;
    height: 50%;
    position: absolute;
    bottom: 0;
    z-index: 4;
}

.svg-2
{
    
    position: absolute;
    bottom: 1%;
   z-index: 4;
}

.text-jumbotron
{

    top: 70%;
    position: absolute;
    z-index: 3;
    color: white;
    font-size: 3rem;
     content:justify;
    font-family: Verdana, Arial, Helvetica, sans-serif;
   
    text-align: center;

}

.image-logo {

    background-image: url('../design/LogNavbar/logo-navbar.png');
    height:60%;
    width: 60%;
    background-repeat: no-repeat;
    top: 20%;
    background-size: contain;
    position: absolute;
    z-index: 3;
}


@media screen and (max-width: 768px) {

    /* Ajustes para pantallas más pequeñas (tabletas, dispositivos móviles) */
    .image-logo {

        background-repeat: no-repeat;
     
        position: absolute;
        top: 30%;
        z-index: 3;
        height: 100%;
        width: 100%;
        /* Reducir el ancho para pantallas más pequeñas */
    }
}

.Slogan
{
    color: #fefcfbff;
    position: absolute;
    top: 70%;
    z-index: 3;
    font-size: 20vw;
    justify-content: center;
    text-align: center;

}

.SloganString
{
    font-size: calc(20px + (40 - 20) * ((100vw - 300px) / (1200 - 300)));
}

@media screen and (max-width: 768px) {
.Slogan
{
    color: #fefcfbff;
    position: absolute;
    top: 53%;
    z-index: 3;
    
    justify-content: center;
    text-align: center;

}
}

.text-div-logo {
    top: 70%;
    justify-content: center;
    text-align: center;
    position: absolute;
    z-index: 5;
}





.wave {
    top: 0%;
    position: relative;
    z-index: 2;
}



.container-base-jumbotron {

    position: relative;
}

.t-20
{
    justify-content: center;
    text-align: center;
    font-size: 5vh;
}


.text-information-tittle {

    /* font-family: 'Open Sans',sans-serif!important;*/
 
    font-size: 3vh;

}




.image-1 {

    height: 50vh;
    width: calc(50vh * 16/9);
    background-image: url('../design/rect927.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;

}


.section-card {

    border-top-left-radius: 200px;
    border-bottom-right-radius: 200px;
   
   

    padding-bottom: 30vh;
    background: rgb(3, 64, 120);
    background: linear-gradient(0deg, rgba(10, 17, 40, 1) 32%,rgb(3, 64, 120) 60%);
}

.card-img-top
{
    margin-top: 5%;
   
    border-radius: 8%;
    width: 50%;
    height: auto;
}

.card {

  
    display: flex;
    justify-content: center;
    /* Centrar horizontalmente */
    align-items: center;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    border-top-left-radius: 150px;
  
    border-bottom-right-radius: 150px;
   

}


.row-shirt
{

  
    margin-top: 50px;
    display:flex ;
    flex-wrap: wrap;
}

#image-shirt
{
  
    margin-top: 50px;
    height: 500px;
    width: 500px;
   
    background-image: url('../images/shirt.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;

}

@media screen and (max-width: 768px) {
    #image-shirt
    {
      
    
        height: 300px;
        width: 300px;
    
    }
}


.shirt-text
{

    margin-top: 50px;
    color: white;
  
  text-align: center;
    

}

.text-shirt-slogan
{
    color: #ffffff; font-family: 'Lato', sans-serif;
    line-height: 50px; 
    margin: 0 0 50px;
    font-size: calc(20px + (40 - 20) * ((100vw - 300px) / (1200 - 300)));
}

#shirt-text-f10
{

   
    font-size: calc(20px + (40 - 20) * ((100vw - 300px) / (1200 - 300)));

}


.text-shirt-q2
{
    font-size: 2vh;
    line-height: 50px;
    text-align: justify;
}

.col-sm-3 {

   margin-top: 50px;
  
 
}

.wave-up {


    width: 100%;
    height: 5%;
    padding: 5px solid rgb(3, 64, 120);
}


.wave-down {



    width: 100%;
    height: 5%;
}

.text-servicios {
    font-size: 5em;
    display: flex;
    justify-content: center;
    /* Centrar horizontalmente */
    align-items: center;
    color: white;
    /* font-family: Haettenschweiler; */
}



.img-producto {
    height: 30vh;
    width: calc(30vh * 16/9);

    background-image: url('../images/producto.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}


.col {
    width: auto;
    height: 30vh;
    border: 5px;



}

.container-clientes {

    margin-top: 5%;
}


.clientes {
    height: 100%;
    width: 100%;
    background-image: url('../images/cortijo.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.footer-mody {
    background: rgba(10, 17, 40, 1)
}

section {
    margin-top: -1px;
    margin-bottom: -1px;
}



.text-clientes {
    font-size: 2em;
    display: flex;
    justify-content: center;
    align-items: center;
    color: rgb(3, 64, 120);

}

.text-productos {
    font-size: 5em;
    display: flex;
    justify-content: center;
    /* Centrar horizontalmente */
    align-items: center;
    color: white;

}

.section-productos {


    padding-bottom: 10%;
    padding-top: 4%;
    background: rgb(3, 64, 120);

}

.section-cliente {
   
 margin-bottom: 5%;
  
}


.cost-products
{

    position: absolute;
    right: 0;
    

}

.ul-modify-cost
{
 
    border-radius: 2%;
    padding-top: 5%;
    color: rgb(38, 139, 233);
    
}

.modify-backgroun-laundry
{
   
    margin-top: 10%;
    height: 2811px;
    width: auto;
    background-image: url('../images/lavadora-fondo.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-position: center top;
    
    
}

@media (max-width: 767px) {
    .modify-backgroun-laundry {
        height: 100vh; /* Ajusta para dispositivos móviles */
    }
}


.section-images-information
{

 
   
   
    padding-bottom: 50px;
    
   

}

.text-image-information
{
    text-align: justify;
    color: white;
    
}

.image-information
{
    padding: -1;
    width: auto;
    height: 50vh;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.image_information_src_1
{
    background-image: url("../images/images-laundry/sabanas-2.jpeg");
}

.image_information_src_2
{
    background-image: url("../images/images-laundry/sabanas.png");
}

.identificar
{

   
}

.row-image
{

   
}
.information-image-sabanas
  {
    


    color: rgb(15, 76, 130);
    content: justify;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    line-height: 4;
    text-align: center;
  
  }
/* Then style the iframe to fit in the container div with full height and width */
.responsive-iframe {
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
  }

  .p-border-raius{
    padding-right: 20px;
  }