diff --git a/src/components/Footer.astro b/src/components/Footer.astro
index 7ff6c69..09526c0 100644
--- a/src/components/Footer.astro
+++ b/src/components/Footer.astro
@@ -1,36 +1,36 @@
 ---
 const date = new Date();
 ---
-<footer class="position-absolute start-0 end-0">
+<footer>
     <div class="container pb-5">
       <div class="row justify-content-between align-items-center">
         <div class="col-sm mb-3 mb-sm-0">
-          <p class="small mb-0 text-white">&copy; CodyOps ~ All Rights Reserved ~ {date.toDateString()}</p>
+          <p class="mb-0 text-white">&copy; CodyOps ~ All Rights Reserved ~ {date.toDateString()}</p>
         </div>
-        <div class="col-sm-auto">
+        <div class="col-sm-auto" style="font-size:larger;">
           <ul class="list-inline mb-0">
             <li class="list-inline-item">
-              <a class="btn" href="https://www.linkedin.com/company/codyopslatam">
+              <a href="https://www.linkedin.com/company/codyopslatam">
                 <i class="bi-linkedin text-white"></i>
               </a>
             </li>
             <li class="list-inline-item">
-              <a class="btn" href="https://www.facebook.com/codyopslatam">
+              <a href="https://www.facebook.com/codyopslatam">
                 <i class="bi-facebook text-white"></i>
               </a>
             </li>            
             <li class="list-inline-item">
-              <a class="btn" href="https://www.instagram.com/codyopslatam">
+              <a href="https://www.instagram.com/codyopslatam">
                 <i class="bi-instagram text-white"></i>
               </a>
             </li>
             <li class="list-inline-item">
-              <a class="btn" href="https://www.youtube.com/@codyopslabs">
+              <a href="https://www.youtube.com/@codyopslabs">
                 <i class="bi-youtube text-white"></i>
               </a>
             </li>
             <li class="list-inline-item">
-              <a class="btn" href="https://github.com/codyopslabs">
+              <a href="https://github.com/codyopslabs">
                 <i class="bi-github text-white"></i>
               </a>
             </li>
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 9eb7fec..63de557 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -1,8 +1,9 @@
 ---
-import 'bootstrap/dist/css/bootstrap.min.css';
+import 'bootstrap/dist/css/bootstrap-grid.min.css';
+import 'bootstrap/dist/css/bootstrap-reboot.min.css';
 import 'bootstrap-icons/font/bootstrap-icons.min.css';
-
 import favicon from '../assets/svg/favicon.svg';
+
 const gtm = import.meta.env.ASTRO_GTAG;
 ---
 <!doctype html>
@@ -11,24 +12,55 @@ const gtm = import.meta.env.ASTRO_GTAG;
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 		<meta name="generator" content={Astro.generator} />
-		<meta name="description" content='' />
+		<!-- <meta name="description" content='' /> -->
 		<title>CodyOps</title>
 		<link rel="icon" type="image/svg+xml" href={favicon.src} />
 		<link rel="alternate" href="https://codyops.com/" hreflang="es" />
 		<link rel="alternate" href="https://codyops.com.es/" hreflang="es-ES" />
-		<link rel="alternate" href="https://codyops.com.br/" hreflang="pt-BR" />  
+		<link rel="alternate" href="https://codyops.com.br/" hreflang="pt-BR" />
 		{ !import.meta.env.DEV && 
 			<script is:inline async src={`https://www.googletagmanager.com/gtag/js?id=${gtm}`}></script>
 			<script is:inline async define:vars={{ gtm }}>window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);}  gtag('js', new Date());  gtag('config', gtm);</script>
-		}		
+		}
 	</head>
-	<body>
+	<body data-bs-theme="dark">
 		<slot />
 	</body>
 </html>
 
-<style>
-	body{
-		background-color: #18181B;
-	}
+<style is:global>
+	.list-inline {
+		padding-left: 0;
+		list-style: none;
+		}
+	.list-inline-item {
+		display: inline-block;
+		}
+	.list-inline-item:not(:last-child) {
+		margin-right: 1rem;
+		}
+	.text-center {
+		text-align: center !important;
+		}
+	.text-uppercase {
+		text-transform: uppercase !important;
+		}
+	.text-white {
+		--bs-text-opacity: 1;
+		color: rgba(var(--bs-white-rgb), var(--bs-text-opacity)) !important;
+		}
+	.text-decoration-none {
+		text-decoration: none !important;
+		}
+	.img-thumbnail {
+		padding: 0.25rem;
+		background-color: var(--bs-body-bg);
+		border: var(--bs-border-width) solid var(--bs-border-color);
+		border-radius: var(--bs-border-radius);
+		max-width: 100%;
+		height: auto;
+		}
+	.border-0 {
+		border: 0 !important;
+		}
 </style>
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 49877dc..e5d7c59 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -2,8 +2,7 @@
 import Layout from '../layouts/Layout.astro';
 import Footer from '../components/Footer.astro';
 
-import { Image } from 'astro:assets';
-import logo from '../assets/svg/codyops.svg';
+import { Picture } from 'astro:assets';
 
 import argentina from '../assets/img/argentina-flag-square-medium.png';
 import chile from '../assets/img/chile-flag-square-medium.png';
@@ -23,177 +22,138 @@ import spain from '../assets/img/spain-flag-square-medium.png';
 ---
 <Layout>
 <body>
-	<header id="header" class="navbar navbar-expand">
-		<div class="container">
-			<nav class="navbar-nav">
-				<a class="navbar-brand" href="/" aria-label="CodyOps">
-					<Image width="120" src={logo} alt="CodyOps Logo" />
-				</a>
-			</nav>
-		</div>
-	</header>
-	<div class="container my-2">
+	<div class="container my-4">
 		<div class="text-center mx-md-auto mb-5">
 			<span class="text-uppercase text-white">Selector</span>
 			<h2 class="h2 text-white">Escoja su País – Choose your Country - Escolha seu País</h2>
 		</div>
 		<div class="row">
 			<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
-				<a class="card h-100 text-center text-decoration-none border-0" href="https://ar.codyops.com/ ">
-					<div class="card-body bg-dark bg-opacity-75">
+				<a class="text-center text-decoration-none border-0" href="https://ar.codyops.com/ ">
 						<div class="mb-3">
-							<Image class="img-fluid img-thumbnail" src={argentina} alt="Argentina Logo" />
+							<Picture class="img-thumbnail" src={argentina} alt="Argentina Logo" />
 						</div>
 						<h2 class="card-title text-white">Argentina</h2>
-					</div>
 				</a>
 			</div>
 			<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
-				<a class="card h-100 text-center text-decoration-none border-0" href="https://www.codyops.com.br">
-					<div class="card-body bg-dark bg-opacity-75">
+				<a class="text-center text-decoration-none border-0" href="https://www.codyops.com.br">
 						<div class="mb-3">
-							<Image class="img-fluid img-thumbnail" src={brazil} alt="Brasil Logo" />
+							<Picture class="img-thumbnail" src={brazil} alt="Brasil Logo" />
 						</div>
 						<h2 class="card-title text-white">Brasil</h2>
-					</div>
 				</a>
 			</div>			
 			<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
-				<a class="card h-100 text-center text-decoration-none border-0" href="https://cl.codyops.com">
-					<div class="card-body bg-dark bg-opacity-75">
+				<a class="text-center text-decoration-none border-0" href="https://cl.codyops.com">
 						<div class="mb-3">
-							<Image class="img-fluid img-thumbnail" src={chile} alt="Chile Logo" />
+							<Picture class="img-thumbnail" src={chile} alt="Chile Logo" />
 						</div>
 						<h2 class="card-title text-white">Chile</h2>
-					</div>
 				</a>
 			</div>
 		</div>
 		<div class="row mt-3">
 			<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
-				<a class="card h-100 text-center text-decoration-none border-0" href="https://co.codyops.com">
-					<div class="card-body bg-dark bg-opacity-75">
+				<a class="text-center text-decoration-none border-0" href="https://co.codyops.com">
 						<div class="mb-3">
-							<Image class="img-fluid img-thumbnail" src={colombia} alt="Colombia Logo" />
+							<Picture class="img-thumbnail" src={colombia} alt="Colombia Logo" />
 						</div>
 						<h2 class="card-title text-white">Colombia</h2>
-					</div>
 				</a>
 			</div>			
 			<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
-				<a class="card h-100 text-center text-decoration-none border-0" href="https://cr.codyops.com/ ">
-					<div class="card-body bg-dark bg-opacity-75">
+				<a class="text-center text-decoration-none border-0" href="https://cr.codyops.com/ ">
 						<div class="mb-3">
-							<Image class="img-fluid img-thumbnail" src={costarica} alt="Costa Rica Logo" />
+							<Picture class="img-thumbnail" src={costarica} alt="Costa Rica Logo" />
 						</div>
 						<h2 class="card-title text-white">Costa Rica</h2>
-					</div>
 				</a>
 			</div>
 			<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
-				<a class="card h-100 text-center text-decoration-none border-0" href="https://do.codyops.com">
-					<div class="card-body bg-dark bg-opacity-75">
+				<a class="text-center text-decoration-none border-0" href="https://do.codyops.com">
 						<div class="mb-3">
-							<Image class="img-fluid img-thumbnail" src={dominicana} alt="Dominicana Logo" />
+							<Picture class="img-thumbnail" src={dominicana} alt="Dominicana Logo" />
 						</div>
 						<h2 class="card-title text-white">Dominicana</h2>
-					</div>
 				</a>
 			</div>
 		</div>
 		<div class="row mt-3">
 			<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
-				<a class="card h-100 text-center text-decoration-none border-0" href="https://ec.codyops.com">
-					<div class="card-body bg-dark bg-opacity-75">
+				<a class="text-center text-decoration-none border-0" href="https://ec.codyops.com">
 						<div class="mb-3">
-							<Image class="img-fluid img-thumbnail" src={ecuador} alt="Ecuador Logo" />
+							<Picture class="img-thumbnail" src={ecuador} alt="Ecuador Logo" />
 						</div>
 						<h2 class="card-title text-white">Ecuador</h2>
-					</div>
 				</a>
 			</div>
 			<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
-				<a class="card h-100 text-center text-decoration-none border-0" href="https://www.codyops.com.es">
-					<div class="card-body bg-dark bg-opacity-75">
+				<a class="text-center text-decoration-none border-0" href="https://www.codyops.com.es">
 						<div class="mb-3">
-							<Image class="img-fluid img-thumbnail" src={spain} alt="Spain Logo" />
+							<Picture class="img-thumbnail" src={spain} alt="Spain Logo" />
 						</div>
 						<h2 class="card-title text-white">España</h2>
-					</div>
 				</a>
 			</div>
 			<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
-				<a class="card h-100 text-center text-decoration-none border-0" href="https://www.codyops.com ">
-					<div class="card-body bg-dark bg-opacity-75">
+				<a class="text-center text-decoration-none border-0" href="https://www.codyops.com ">
 						<div class="mb-3">
-							<Image class="img-fluid img-thumbnail" src={usa} alt="USA Logo" />
+							<Picture class="img-thumbnail" src={usa} alt="USA Logo" />
 						</div>
 						<h2 class="card-title text-white">Estados Unidos</h2>
-					</div>
 				</a>
 			</div>			  		  			
 		</div>
 		<div class="row mt-3">
 			<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
-				<a class="card h-100 text-center text-decoration-none border-0" href="https://mx.codyops.com/ ">
-					<div class="card-body bg-dark bg-opacity-75">
+				<a class="text-center text-decoration-none border-0" href="https://mx.codyops.com/ ">
 						<div class="mb-3">
-							<Image class="img-fluid img-thumbnail" src={mexico} alt="Mexico Logo" />
+							<Picture class="img-thumbnail" src={mexico} alt="Mexico Logo" />
 						</div>
 						<h2 class="card-title text-white">México</h2>
-					</div>
 				</a>
 			</div>
 			<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
-				<a class="card h-100 text-center text-decoration-none border-0" href="https://pa.codyops.com">
-					<div class="card-body bg-dark bg-opacity-75">
+				<a class="text-center text-decoration-none border-0" href="https://pa.codyops.com">
 						<div class="mb-3">
-							<Image class="img-fluid img-thumbnail" src={panama} alt="Panama Logo" />
+							<Picture class="img-thumbnail" src={panama} alt="Panama Logo" />
 						</div>
 						<h2 class="card-title text-white">Panamá</h2>
-					</div>
 				</a>
 			</div>
 			<div class="col-md-6 col-lg-4">
-				<a class="card h-100 text-center text-decoration-none border-0" href="https://py.codyops.com">
-					<div class="card-body bg-dark bg-opacity-75">
+				<a class="text-center text-decoration-none border-0" href="https://py.codyops.com">
 						<div class="mb-3">
-							<Image class="img-fluid img-thumbnail" src={paraguay} alt="Paraguay Logo" />
+							<Picture class="img-thumbnail" src={paraguay} alt="Paraguay Logo" />
 						</div>
 						<h2 class="card-title text-white">Paraguay</h2>
-					</div>
 				</a>
 			</div>  
 		</div>
 		<div class="row mt-3">
 			<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
-				<a class="card h-100 text-center text-decoration-none border-0" href="https://pe.codyops.com/ ">
-					<div class="card-body bg-dark bg-opacity-75">
+				<a class="text-center text-decoration-none border-0" href="https://pe.codyops.com/ ">
 						<div class="mb-3">
-							<Image class="img-fluid img-thumbnail" src={peru} alt="Peru Logo" />
+							<Picture class="img-thumbnail" src={peru} alt="Peru Logo" />
 						</div>
 						<h2 class="card-title text-white">Perú</h2>
-					</div>
 				</a>
 			</div>
 			<div class="col-md-6 col-lg-4 mb-4 mb-md-5 mb-lg-0">
-				<a class="card h-100 text-center text-decoration-none border-0" href="https://sv.codyops.com">
-					<div class="card-body bg-dark bg-opacity-75">
+				<a class="text-center text-decoration-none border-0" href="https://sv.codyops.com">
 						<div class="mb-3">
-							<Image class="img-fluid img-thumbnail" src={salvador} alt="Salvador Logo" />
+							<Picture class="img-thumbnail" src={salvador} alt="Salvador Logo" />
 						</div>
 						<h2 class="card-title text-white">El Salvador</h2>
-					</div>
 				</a>
 			</div>
 			<div class="col-md-6 col-lg-4">
-				<a class="card h-100 text-center text-decoration-none border-0" href="https://uy.codyops.com">
-					<div class="card-body bg-dark bg-opacity-75">
+				<a class="text-center text-decoration-none border-0" href="https://uy.codyops.com">
 						<div class="mb-3">
-							<Image class="img-fluid img-thumbnail" src={uruguay} alt="Uruguay Logo" />
+							<Picture class="img-thumbnail" src={uruguay} alt="Uruguay Logo" />
 						</div>
 						<h2 class="card-title text-white">Uruguay</h2>
-					</div>
 				</a>
 			</div>	
 		</div>	  
