 * {
        font-family: 'Montserrat';
        font-style: normal;
    }
    
    .row>* {
  
    padding-right: 0!important;
    padding-left: 0!important;
    }
    
    :root {
      --color-primary:#5643E5;
      --background-card: #F0EFEF;
      --white: #FFFFFF;
      --button-primary-green:#46FFB5;
      --button-secondary-green: #8DFFDD;
      --backgroud-primaryio: #EDEDED;
      --backgroud-secundario: #F4F4F4;
      --background-input: #EBEBEB;
      --color-primary-form: #818080;
    }
    
    /* --- Main Header - NavBar --- */
    .main-header {
        background-color: var(--color-primary);   
        color:#ffffff;
        height: 171px;
        font-style: normal;
        font-weight: 500;
        font-size: 14px;
        line-height: 24px;
        text-align: justify;
    }
    /*
    .logo img {
        height: 287px;
    }
    */
   
    
    .inicia-colecta {
        cursor:pointer;
        background-color: var(--button-secondary-green);
        border-radius: 100px 0px;
        color: var(--color-primary);    
        font-style: normal;
        font-weight: 700;
        font-size: 19px;
        padding: 17px 35px;
    }
    
      .inicia-sesion, .buscar{
        cursor:pointer;
    }
    
    
    
    /*--- Main Contaier Home --- */
    .texto, .imagen {
      margin-top: 65px;  
    }

    
    .inicia-colecta {
        cursor:pointer;
        background-color: var(--button-secondary-green);
        border-radius: 100px 0px;
        color: var(--color-primary);
        font-size: 19px;
        font-weight: 700;
        padding: 18px 24px;
        white-space: nowrap;
    }
    .texto {
        color:#5643E5;
        text-align: left;
        font-family: 'Montserrat';
        font-style: normal;
        font-weight: 600;
        font-size: 30px;
        line-height: 129.4%;
        text-align: justify;
    }
    .imagen img {
        width: 83%;          
        max-height: 360px;
    }
    .second-row{
        margin-top: 39px;
    }
    
    .boton {
        cursor:pointer;
        background-color: var(--button-primary-green);
        border-radius: 100px 0px;
        color: var(--color-primary);
        font-weight: 700;
        font-size: 32px;
        margin-bottom: 20px;
        padding: 22px 80px;
        white-space: nowrap;
        box-shadow: 0px 4px 6px 0px #00000040;

    }
   
   
    .colecta-movil {
         background-color: var(--button-secondary-green);
        color: var(--color-primary);
        font-family: 'Montserrat';
        font-style: normal;
        font-weight: 700;
        font-size: 22px;
        line-height: 44px;
        text-align: justify;
        text-align: center;
        visibility: hidden;
    }
    /*}*/
    /* .colecta-movil{*/
    /*    display: none;*/
    /*}*/
    
        

        
        
   
    /*.pasodos span  {*/
    /*background-color: #D9D9D95E;*/
  
    /*color: #5643E5;*/
    /*font-family: 'Montserrat';*/
    /*font-style: normal;*/
    /*font-weight: 500;*/
    /*font-size: 22px;*/
    /*line-height: 24px;*/
    
    /*}*/
    
    
    /*--- Finaliza Main Contaier Home --- */

    

    /* ---- Page Campa?as Cards ----*/
    
    .card-colecta {
        background-color: var(--background-card);
        border-radius: 0px 100px;
        width: 18rem;
        cursor:pointer;
    }
    
    .card-colecta:hover {
        background-color: #dfdfdf;
        box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    }
    
    
    .container-img-campana{
        display: flex;
        align-items: center;
        width: 253px;
        min-height: 100%;
        max-height: 218px;
    }
    .container-img-campana img{
        object-fit: cover;
        width:100%;
        height: 218px;
        border-radius: 0px 84.5px 0px 84.5px
    }
    
    .card-body h5 {
        font-weight: 600;
        font-size: 17px;
        height: 62px;
        overflow:hidden;
        margin-top:2px;
        margin-bottom:2px;
/*        line-height: 42px; */
        text-align: justify!important;
        text-overflow: ellipsis;
    }
    
    .card-body > h5 {
        text-transform: lowercase;
    }

    .card-body h5:first-letter {
        text-transform: uppercase;
    }
        
    
    .contenido-card-texto {
        width: 250px;
        height: 50px;
        text-align: center;
        overflow: hidden;
        
    }
    .contenido-card-texto p{
        /*text-align: justify;*/
        font-size: 10px;
        font-weight: 400;
        line-height: 12px;
        text-align: left;

    }
    .text-collected {
        font-weight: 600;
        font-size: 13px;
        height:40px;
    }
    .text-collected span{
        font-size: 11px;
        font-weight: 400;
        line-height: 13px;

    }
    .progress-bar-green {
        background-color:#46FFB5!important;
    }

    .progress {
        background-color: #CBC8C8!important;
    }
    
    .tiempo-colecta span {
        font-family: 'Montserrat';
        font-style: normal;
        font-weight: 400;
        font-size: 10px;
    }
    .boton-card{
        background-color: var(--color-primary);
        border-radius: 100px 0px;
        color: var(--white);
        font-weight: 600;
        font-size: 12px;
        display: block;
        margin-bottom: 25px;
        white-space: nowrap;
        text-decoration: none;
        text-align: center;
        padding: 10px 30px;
        box-shadow: 0px 4px 4px 0px #00000040;

    }
    .container-boton-colecta{
        margin-bottom: 40px;
    }
    .boton-colecta{
        background-color:#FFD400;   
        color: var(--color-primary);
        border-radius: 100px 0px;
        font-weight: 700;
        font-size: 31px;
        line-height: 42px;
        text-align: justify;
        margin: 10px;
        white-space: nowrap;
        box-shadow: 0px 4px 4px 0px #00000040;
        padding: 23px 38px ;
    }
    
    /****** finaliza Page Camapana ******/
    
    
    
    /***** @media querys ******/
    
    
    
    
        @media (max-width: 991px) {
      
        .logo img{
            width: 209px;
        }
        .main-header{
            display: flex;
        }
      
        .logo{
            order: 2;
            display: flex;
            justify-content: center;
            align-items: center;
        }
        .buscar {
            order: 1;
         }
        .inicia-sesion {
            order: 3;
        }
        .registrate,
        .inicia-colecta {
            visibility: hidden;
            display: none;
        }
      
      
      
      .buscar span,
      .inicia-sesion span{
            visibility: hidden;
            display: none;
      }
      

     .logo {
          height: 209px;
          
      }
      
      .buscar img {
          height: 28px;
      }
        .inicia-sesion img {
            height: 28px;
        }
        .colecta-movil{
            visibility: visible;
        }
        .texto, .imagen {
            margin-top: 40px;
        }
        .imagen{
            margin-left: 15%;
        }
     
        .texto{
            margin-right: 15%;
            font-size: 26px;
        }
        .second-row{
            margin-top: 39px;
        }
            .boton-colecta{
                font-size: 31px;
                text-align: center;
                width: 50%;
                padding: 19px 0px;
            }
    }
    
    

    
        @media (max-width: 768px){
            .boton{
                padding: 22px 0px;
                text-align: center;
                width: 65%;
            }
            .boton-colecta{
                font-size: 28px;
                text-align: center;
                width: 80%;
                padding: 10px 0px;
            }
        }
        @media (max-width: 576px){
            .texto{
                font-size: 23px;
            }
            .boton{
                font-size: 22px;
            
            }
            
            
        }
        
         @media (max-width: 395px){
             
             .container-pregunta{
                 justify-content: center!important;
             }
             .logo img{
                 width: 172px;
             }
             .texto{
                 font-size: 15px;
                 margin-right: 10%;
             }
             .imagen{
                margin-right: 10%;
             }
             .imagen img{
                 width: 100%;
                
             }
              .boton{
                font-size: 18px;
                /*padding: 10px 0;*/
            
            }
            
            /***** page campana *****/
            
        .boton-colecta{
          
            font-size: 23px;
        }
         }
    
    
    
    
    
    

  /*



  background-color:#FFD400; 
   
        font-size: 31px;
        font-weight: 700;
        text-align: center;
        border-radius: 100px 0px 100px 0px






.boton-colecta {
    
    background-color: var(--button-secondary);
    border-radius: 100px 0px;
    color: var(--color-primary);
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 700;
    font-size: 32px;
    line-height: 42px;
    text-align: justify;
    margin: 10px;
    white-space: nowrap;
}







.main-content {
    
}



    

.second-row {
    padding: 50px;
}


.card-colecta img{
    border-radius: 0px 100px 0px 100px!important;
}






.filler-row {
    margin:25px;
}

    
/*


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


    .imagen img {
      width: 100% ;
    }
    
     .container{
         display: flex;
     }
    
     .card-body h5 {
         font-weight: 600;
    font-size: 18px;
     }
    
    .container-card{
            max-width: 1175px!important;
    }   
}


 @media (max-width: 1095px) {
     
     .card-colecta{
        width: 20rem;
    }
    
    .container{
        display: inline-block;
       
    }
    
    .colecta-content{
        text-align: center;
    }
     .contenido-card-texto {
         width: 335px;
       }
 }





@media (min-width: 961px) {
    
    .colecta-movil {
        visibility: hidden;
    }
      .texto {
      padding: 3rem!important;
      }
      
        .imagen img{
         padding: 3rem;
    }
    
    
}

 @media (max-width: 767px) {
        
        .card-colecta {
            width: 25rem!important;
        }
        
        .card-body p {
            font-size: 14px;
        }
}
 @media (max-width: 576px) {
        
        .card-colecta {
            width: 21rem!important;
        }
        
        .contenido-card-texto {
         width: 280px;
       }
       
}
 
  @media (max-width: 370px) {
        .logo img {
            height: 206px;
        }
        .card-colecta {
            width: 16rem!important;
           
        }
        
        .boton-colecta{
            font-size: 22px;
        }
        
        .contenido-card-texto {
         width: 203px;
       }
       
 
                
        
}
 
    

    

