In a section of the page that works with drupal I am implementing four images with horizontal arrangement. Each of these images opens a collapsible panel right in the next division. The problem is that when I click on one of the images to open the panel, the same drupal (I think) hides it shortly after opening. You click it again and the panel reappears but it immediately has the effect of closing like an accordion. I leave the code.
<section id="section-categorias" class="bloquehome" data-stellar-background-ratio="0.5">
<div class="container-12">
<div class="align-center">
<h2 class="section-heading animated" data-animation="bounceInUp">CURSOS Y ACTIVIDADES</h2>
<div class="espaciocentro"><div class="plecaverdecentro"></div></div>
<div class="row">
<div class="col-md-3">
<a data-toggle="collapse" href="#collapse" aria-expanded="false">
<img class="ca" src="<?php print base_path() . path_to_theme() .'/' ?>images/espacios/cultura-digital2.png">
</a>
</div>
<div class="col-md-3">
<a data-toggle="collapse" href="#collapse" aria-expanded="false">
<img class="ca" src="<?php print base_path() . path_to_theme() .'/' ?>images/espacios/innovacion-tecnologica2.png">
</a>
</div>
<div class="col-md-3">
<a data-toggle="collapse" href="#collapse" aria-expanded="false">
<img class="ca" src="<?php print base_path() . path_to_theme() .'/' ?>images/espacios/inclusion-digital.png" >
</a>
</div>
<div class="col-md-3">
<a data-toggle="collapse" href="#collapse" aria-expanded="false">
<img class="ca" src="<?php print base_path() . path_to_theme() .'/' ?>images/espacios/robotica.png">
</a>
</div>
</div>
</div>
</div>
<div id="collapse" class="collapse">
<div class="card card-block">
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident.
</div>
</div>