.tile__image {
    display: none;
}

.tile {
    display: inline-block;
    padding: 20px 20px;
    background-color: white;
    border: 2px solid #e0e4ef;
    border-radius: 20px;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
    color: #202020;
    text-align: center;
    text-decoration: none;
    transition: transform 0.2s, box-shadow 0.2s;
	width: 255px;
    box-sizing: border-box;
}

.tile:hover {
  	background-color: white;
    box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.4);
	border: 2px solid #28A2C4;
}

.grid {
    display: flex;
    flex-wrap: wrap; /* Allow buttons to wrap onto the next line */
    justify-content: center; /* Center the buttons */
    gap: 20px; /* Space between buttons */
}

.vp-tree-item__header {
    border-bottom: 1px solid #9299AE;
    padding: 4px 16px 4px 16px !important;
	display: flex;
  	flex-direction: row !important;
    justify-content: space-between;
    align-items: center;
  	border-radius: 0px !important;
}

.vp-article {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}

.vp-desktop-navigation__page-tree__collapser{
	display:none;
}

.vp-desktop-navigation__page-tree {
	padding: 0px !important;
  	width: 400px;
}

.vp-article__aside-left{
	width:400px;
}

.vp-tree-item {
  	background-color: #F4F5F7;
	--_background-color-hovered: white;
  	--_background-color-selected: #F4F5F7;
    --_background-color-pressed: #F4F5F7 !important;
}

.vp-tree {
	--_row-gap: 0px;
}

.article-header{
	margin:0 !important;
}

#main-content {
    display: block !important; /* Asegura que se comporte como un bloque */
    text-align: left !important; /* Alinea todo el contenido de texto a la izquierda */
}

.vp-article {
  --_content-spread-width: none !important;
}

.top-bar{
 	max-width: 100%;
}

.vp-breadcrumbs{
	margin: 0;
}

.vp-tree-item__header svg:not(button svg) {
	display: none !important;
}

.vp-tree-item__header__title{
	font-size: 16px !important;
}

figure.vp-image img{
	border: 0px !important;
}

.hc-portal-banner {
    height: 40vh;
  	margin-bottom: 50px !important;
}

@media (max-width: 768px) {
    .tile {
        width: 45%; /* Adjust button width for smaller screens */
    }
}

@media (max-width: 480px) {
    .tile {
        width: 90%; /* Full width for very small screens */
    }
}