@charset "UTF-8";

/** MENU **/
.lay-1, .lay-2 {
    display:grid;
    grid-template-columns: 1fr;
    gap:0px;
    width: 70%; padding: 0 15% 15%;
}
.col { width: 100%;}
.sec {
    grid-column: 1 / -1;
    width: 100%;
    margin-top: 50px;
    text-align: center;
}
.image {
    width: 100%;
    min-height: 400px;
    grid-column: 1 / -1;
    border-radius: 15px;
    margin-top: 30px;
}
.image2 {
    display:grid;
    gap: 20px;
    min-height: 450px;
    grid-column: 1 / -1;
    grid-template-columns: 1fr;
    border-radius: 15px;
    margin-top: 30px; 
}

/* IMAGEN 2 DE FONDO */
.start1 { min-height: 350px; width: 100%; background: url("../img/allende-mexican-kitchen-bar-fajitas-tacos-lunch-burritos-salads-vegetarian-img-08.jpg"); border-radius: 15px; background-size: cover; background-position: center;}
.start2 { min-height: 350px; width: 100%; background: url("../img/allende-mexican-kitchen-bar-fajitas-tacos-lunch-burritos-salads-vegetarian-img-09.jpg"); border-radius: 15px; background-size: cover; background-position: center;}
.tacos1 { min-height: 350px; width: 100%; background: url("../img/allende-mexican-kitchen-bar-fajitas-tacos-lunch-burritos-salads-vegetarian-img-11.jpg"); border-radius: 15px; background-size: cover; background-position: center;}
.tacos2 { min-height: 350px; width: 100%; background: url("../img/allende-mexican-kitchen-bar-fajitas-tacos-lunch-burritos-salads-vegetarian-img-12.jpg"); border-radius: 15px; background-size: cover; background-position: center;}
.burr1 { min-height: 350px; width: 100%; background: url("../img/allende-mexican-kitchen-bar-fajitas-tacos-lunch-burritos-salads-vegetarian-img-13.jpg"); border-radius: 15px; background-size: cover; background-position: center;}
.burr2 { min-height: 350px; width: 100%; background: url("../img/allende-mexican-kitchen-bar-fajitas-tacos-lunch-burritos-salads-vegetarian-img-14.jpg"); border-radius: 15px; background-size: cover; background-position: center;}
.flav1 { min-height: 350px; width: 100%; background: url("../img/allende-mexican-kitchen-bar-fajitas-tacos-lunch-burritos-salads-vegetarian-img-15.jpg"); border-radius: 15px; background-size: cover; background-position: center;}
.flav2 { min-height: 350px; width: 100%; background: url("../img/allende-mexican-kitchen-bar-fajitas-tacos-lunch-burritos-salads-vegetarian-img-16.jpg"); border-radius: 15px; background-size: cover; background-position: center;}
.dess { min-height: 350px; width: 100%; background: url("../img/allende-mexican-kitchen-bar-fajitas-tacos-lunch-burritos-salads-vegetarian-img-18.jpg"); border-radius: 15px; background-size: cover; background-position: center;}
.dess2 { min-height: 350px; width: 100%; background: url("../img/allende-mexican-kitchen-bar-fajitas-tacos-lunch-burritos-salads-vegetarian-img-19.jpg"); border-radius: 15px; background-size: cover; background-position: center;}
.veg { min-height: 350px; width: 100%; background: url("../img/allende-mexican-kitchen-bar-fajitas-tacos-lunch-burritos-salads-vegetarian-img-20.jpg"); border-radius: 15px; background-size: cover; background-position: center;}
.veg2 { min-height: 350px; width: 100%; background: url("../img/allende-mexican-kitchen-bar-fajitas-tacos-lunch-burritos-salads-vegetarian-img-21.jpg"); border-radius: 15px; background-size: cover; background-position: center;}

/* IMAGEN FONDO LARGO */
.start3 { background: url("../img/allende-mexican-kitchen-bar-fajitas-tacos-lunch-burritos-salads-vegetarian-img-10.jpg"); background-size: cover; background-position: center;}
.salad { background: url("../img/allende-mexican-kitchen-bar-fajitas-tacos-lunch-burritos-salads-vegetarian-img-17.jpg"); background-size: cover; background-position: center;}
.lun { background: url("../img/allende-mexican-kitchen-bar-fajitas-tacos-lunch-burritos-salads-vegetarian-img-22.jpg"); background-size: cover; background-position: center;}
.marg { background: url("../img/allende-mexican-kitchen-bar-fajitas-tacos-lunch-burritos-salads-vegetarian-img-23.jpg"); background-size: cover; background-position: center;}
.cocktail { background: url("../img/allende-mexican-kitchen-bar-fajitas-tacos-lunch-burritos-salads-vegetarian-img-24.jpg"); background-size: cover; background-position: center;}

.TabbedPanelsContent .info {
    display: block;
    grid-column: 1 / -1;
    text-align: center;
    margin-top: 80px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 10.6px;
    line-height: 14px;
    color: #261f1e;
}
.TabbedPanelsContent .title {
    padding-bottom: 20px;
    border-bottom: 1px solid #d3ccb0;
    display: block;
    grid-column: 1 / -1;
    width: 100%;
    text-align: center;
    margin-bottom: 10px;
    color: #261f1e;
}
.TabbedPanelsContent .title h2 { font-size: 50px; line-height: 60px; font-weight: 600;}
.TabbedPanelsContent .sec .title { margin-bottom: 30px; color: #a71028;}

/**END STYLES**/


/* CONTENEDOR GENERAL */
.TabbedPanels {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	margin: 0;
	padding: 0;
}

/* LISTA DE TABS */
.TabbedPanelsTabGroup {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	padding: 5%;
	margin: 0;
	width: 90%;
}
.TabbedPanelsTabGroup li {
	list-style: none;
}
/* TAB INDIVIDUAL */
.TabbedPanelsTab {
	flex: 1 1 calc(33.33% - 10px); /* 3 por fila en móvil/tablet */
	padding: 12px 15px;
	font-family: "Source Serif 4", sans-serif;
	font-weight: 300;
	font-size: 12pt;
	color: #1d1d1a;
	background-color: #fcfcf0;
	border-radius: 30px;
	text-align: center;
	cursor: pointer;
	transition: all 0.3s ease;
}

/* HOVER */
.TabbedPanelsTab:hover {
	color: #f4f5e6;
	background-color: #261f1e;
    font-weight: 500;
}

/* TAB ACTIVO */
.TabbedPanelsTabSelected {
	background-color: #eb1e3f;
	color: #f4f5e6;
	border-radius: 30px;
    font-weight: 500;
}

/* CONTENIDO */
.TabbedPanelsContentGroup {
	width: 100%;
	margin-top: 40px;
}

.TabbedPanelsContent {
	padding: 0;
}


/* Styles for Printing */
@media print {
.TabbedPanels {
	overflow: visible !important;
}
.TabbedPanelsContentGroup {
	display: block !important;
	overflow: visible !important;
	height: auto !important;
}
.TabbedPanelsContent {
	overflow: visible !important;
	display: block !important;
	clear:both !important;
}
.TabbedPanelsTab {
	 overflow: visible !important;
	 display: block !important;
	 clear:both !important;
}
}

@media only screen and (min-width: 581px) and (max-width: 899px){
.TabbedPanelsTab {
	flex: 1 1 calc(25% - 10px); /* 3 por fila en móvil/tablet */
	font-size: 12pt;
    line-height: 15pt;
}
.TabbedPanels {
    background-size: 30% auto;
}
.lay-1, .lay-2 {
    gap:20px;
}
.TabbedPanelsContent .title h2 { font-size: 70px; line-height: 80px;}
.TabbedPanelsContent .sec .title { margin-bottom: 40px;}
.sec { margin-top: 20px; }
    
.image {
    min-height: 300px;
    grid-column: 1 / -1;
    border-radius: 15px;
    margin-top: 30px;
}
.image2 {
    gap: 20px;
    min-height: 350px;
    grid-column: 1 / -1;
    grid-template-columns:repeat(2,1fr);
    border-radius: 15px;
    margin-top: 30px; 
}
}


@media only screen and (min-width: 900px) {
.TabbedPanels {
	flex-wrap: nowrap;
    padding: 5%;
    width: 90%;
}
.TabbedPanelsTabGroup li {
	list-style: none;
	padding: 10px 5px 10px 20px;
}
.sec { margin-top: 20px; }
.TabbedPanelsContent .title h2 { font-size: 70px; line-height: 80px;}
.TabbedPanelsContent .sec .title { margin-bottom: 40px;}

/* Tabs en columna izquierda */
.TabbedPanelsTabGroup {
	flex-direction: column;
	width: 30%;
	gap: 8px;
    padding: 0;
}
.TabbedPanelsContent {
	padding: 4% 6% 6%;
    border-radius: 35px;
    background: #fbf6e3;
    margin-top: -40px;
}
.TabbedPanelsTab {
	flex: none;
	width: 100%;
	text-align: left;
	padding: 12px 15px;
    list-style: none;
    font-size: 14pt;
}
.TabbedPanelsContentGroup {
	width: 95%;
	padding-left: 5%;
}

/** MENU **/
.lay-1 {
    grid-template-columns:repeat(3,1fr);
    gap:35px;
    width: 100%; padding: 0;
    
}
.lay-2 {
    grid-template-columns:repeat(2,1fr);
    gap:35px;
    width: 100%; padding: 0;
}
    
.TabbedPanelsContent .title {
    padding-bottom: 20px;
    text-align: center;
    margin-bottom: 5px;
}
    
.image {
    min-height: 300px;
    grid-column: 1 / -1;
    margin-top: 30px;
}
.image2 {
    gap: 20px;
    min-height: 350px;
    grid-column: 1 / -1;
    grid-template-columns:repeat(2,1fr);
}

    
}