@media screen and (min-width: 1024px) {
    .navbar {
        min-height: 5rem;
    }

    html.has-navbar-fixed-top {
        padding-top: 5rem;
    }
}
.navbar {
    border-bottom: 1px solid #ddd;
}

table {
    width: 100%;
}

.display_image {
    position: relative;
}

.details-svg, .channel-details-svg {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.details-svg polygon, .channel-details-svg polygon {
    /* Initial styles for fill and stroke */
    fill: yellow;
    fill-opacity: 0.2;
    stroke-width: 2;
    stroke: yellow;
    vector-effect: non-scaling-stroke;
    transition: fill-opacity 0.3s, stroke-width 0.3s; /* Smooth transition for fill-opacity and stroke-width */
}

/* Style for the SVG polygons on hover */
.details-svg polygon:hover, .channel-details-svg polygon:hover {
    fill-opacity: 0; /* Set fill-opacity to 0 on hover */
    stroke-width: 0; /* Set stroke-width to 0 on hover */
}

/* Styles for the rectangle */
.details-svg rect.hover-cilium, .channel-details-svg rect.hover-cilium {
    fill: none;
    stroke: white;
    stroke-width: 1; /* Initial stroke width */
    transition: stroke-width 0.3s; /* Transition for stroke-width */
}

/* Change the stroke-width to 0 on hover for the rectangle */
.details-svg rect.hover-cilium:hover, .channel-details-svg rect.hover-cilium:hover {
    stroke-width: 0;
}


#summarySVG {
    background-color: #f1f1f1;
    border: 1px solid #ddd;
}

#summarySVG .svg-cilium {
    fill: transparent;
    fill-opacity: 1;
    stroke-width: 0;
}

#summarySVG .svg-BasalBody {
    fill: blue;
    fill-opacity: 1;
    stroke-width: 1;
    stroke: blue;
}

#summarySVG .svg-axo {
    fill: green;
    fill-opacity: 1;
    stroke-width: 1;
    stroke: green;
}

#summarySVG .svg-transitionzone {
    fill: red;
    fill-opacity: 1;
    stroke-width: 1;
    stroke: red;
}

#summarySVG .svg-inserm-axo {
    fill: yellow;
    fill-opacity: 1;
    stroke-width: 1;
    stroke: green;
}

/*#summarySVG polygon {*/
/*    fill: #40b32c;*/
/*    fill-opacity: 1;*/
/*    stroke-width: 1;*/
/*    stroke: #40b32c;*/
/*    vector-effect: non-scaling-stroke;*/
/*    transition: fill-opacity 0.3s, stroke-width 0.3s;*/
/*}*/

