diff --git a/src/assets/i18n/en.json b/src/assets/i18n/en.json
index 60dba81..64a5ba6 100644
--- a/src/assets/i18n/en.json
+++ b/src/assets/i18n/en.json
@@ -108,6 +108,9 @@
     "error-code": "Error code",
     "home": "Go back home"
   },
+  "event": {
+    "title": ""
+  },
   "toasts": {
     "ticket-bought": {
       "title": "Ticket was bought!",
@@ -116,6 +119,18 @@
     "failed": {
       "title": "Transaction failed.",
       "description": "The transaction failed. Try again."
+    },
+    "install-metamask": {
+      "title": "Install MetaMask",
+      "description": "MetaMask is not installed in your computer"
+    },
+    "connect-metamask": {
+      "title": "Connect your accout",
+      "description": "MetaMask account is  not connected."
+    },
+    "change-network": {
+      "title": "Not valid network",
+      "description": "Set your network to mumbai to get your ticket"
     }
   }
 }
\ No newline at end of file
diff --git a/src/assets/i18n/es.json b/src/assets/i18n/es.json
index 905d493..3328806 100644
--- a/src/assets/i18n/es.json
+++ b/src/assets/i18n/es.json
@@ -114,8 +114,20 @@
       "description": "El tiquete fue comprado exitosamente."
     },
     "failed": {
-      "title": "Transaction failed.",
-      "description": "La transacción falló. Intenta de nuevo"
+      "title": "Transacción fallida",
+      "description": "La transacción falló. Intenta de nuevo."
+    },
+    "install-metamask": {
+      "title": "Instala MetaMask",
+      "description": "MetaMask no está instalado en este navegador."
+    },
+    "connect-metamask": {
+      "title": "Cuenta desconectada",
+      "description": "Conecta tu cuenta de MetaMask para comprar un tiquete."
+    },
+    "change-network": {
+      "title": "Red no válida",
+      "description": "Cambia a la red Mumbai para comprar un tiquete."
     }
   }
 }
\ No newline at end of file
diff --git a/src/components/events/Attendees.tsx b/src/components/events/Attendees.tsx
index 0323587..28bd25c 100644
--- a/src/components/events/Attendees.tsx
+++ b/src/components/events/Attendees.tsx
@@ -14,13 +14,13 @@ const Attendees = () => {
 			p={{ base: 5, md: 7 }}
 		>
 			<Text
-				fontSize='1.953rem'
+				fontSize={{ base: '2xl', lg: '3xl' }}
 				fontFamily={'space'}
 				fontWeight='semibold'
 				color={'#00001C'}
 				textAlign={{ base: 'start', md: 'start' }}
 			>
-				X Asistentes
+				Asistentes
 			</Text>
 
 			<SimpleGrid columns={{ sm: 2, md: 3 }} spacing='8'>
diff --git a/src/components/events/EventDetails.tsx b/src/components/events/EventDetails.tsx
index 04b80d0..f5987bd 100644
--- a/src/components/events/EventDetails.tsx
+++ b/src/components/events/EventDetails.tsx
@@ -1,5 +1,5 @@
 import React from 'react'
-import { Flex, Text, VStack } from '@chakra-ui/react'
+import { Flex, List, ListItem, Text, VStack } from '@chakra-ui/react'
 
 const EventDetails = () => {
 	return (
@@ -13,7 +13,7 @@ const EventDetails = () => {
 		>
 			<VStack align='start' spacing={5}>
 				<Text
-					fontSize='1.953rem'
+					fontSize={{ base: '2xl', lg: '3xl' }}
 					fontFamily={'space'}
 					fontWeight='semibold'
 					color={'#00001C'}
@@ -21,26 +21,43 @@ const EventDetails = () => {
 					Detalles del Evento
 				</Text>
 				<Text fontSize='md' color={'#00001C'} fontFamily={'space'}>
-					🌐 Web3 en Acción: Sé voluntari@ de impacto 🌐 ¡Únete a nosotros el
-					Jueves 14 de septiembre a las 6pm en el restaurante Bitácora (Cra. 19
-					# 134-69) para una experiencia única que te conectará con el poder de
-					ser un voluntario web3! ¿Quieres ser parte del cambio y hacer un
-					impacto significativo en la comunidad? ¿Te interesa conocer más sobre
-					la tecnología web3 y cómo puedes usarla para el bien común? ¡Este
-					evento es para ti! Tendremos un preámbulo a la Blockchain Summit Latam
-					donde conocerás más detalles de los beneficios que recibirás al
-					registrarte como voluntario, igualmente encontrarás: 🗣️ Charlas
-					Inspiradoras: Escucha a expertos de la industria compartir su visión y
-					experiencias en el mundo web3 y cómo el voluntariado puede impulsar un
-					cambio real. 🍽️ Comida deliciosa: Disfruta de la sazón del restaurante
-					Bitácora mientras conectas con otros apasionados por la tecnología y
-					el voluntariado web3. 🤝 Networking enriquecedor: Amplía tu red de
-					contactos, conoce a personas afines y crea conexiones valiosas que
-					pueden marcar la diferencia. Este evento es una oportunidad única para
-					inspirarte, aprender y tomar acción. ¡Juntos podemos construir un
-					futuro mejor a través de la tecnología y el voluntariado!¡Regístrate
-					ahora y sé parte de este movimiento de cambio!#Web3EnAccion
-					#VoluntariadoWeb3 #ImpactoPositivo
+					🌐 Web3 en Acción: Sé voluntari@ de impacto 🌐
+				</Text>
+				<Text fontSize='md' color={'#00001C'} fontFamily={'space'}>
+					¿Quieres ser parte del cambio y hacer un impacto significativo en la
+					comunidad? ¿Te interesa conocer más sobre la tecnología web3 y cómo
+					puedes usarla para el bien común? ¡Este evento es para ti!
+				</Text>
+				<Text fontSize='md' color={'#00001C'} fontFamily={'space'}>
+					¡Únete a nosotros el Jueves 14 de septiembre a las 6pm en el
+					restaurante Bitácora (Cra. 19 # 134-69) para una experiencia única que
+					te conectará con el poder de ser un voluntario web3! Tendremos un
+					preámbulo a la Blockchain Summit Latam donde conocerás más detalles de
+					los beneficios que recibirás al registrarte como voluntario,
+					igualmente encontrarás:
+				</Text>
+				<List spacing={3}>
+					<ListItem ml={10}>
+						🗣️ Charlas Inspiradoras: Escucha a expertos de la industria
+						compartir su visión y experiencias en el mundo web3 y cómo el
+						voluntariado puede impulsar un cambio real.
+					</ListItem>
+					<ListItem ml={10}>
+						🍽️ Comida deliciosa: Disfruta de la sazón del restaurante Bitácora
+						mientras conectas con otros apasionados por la tecnología y el
+						voluntariado web3.
+					</ListItem>
+					<ListItem ml={10}>
+						🤝 Networking enriquecedor: Amplía tu red de contactos, conoce a
+						personas afines y crea conexiones valiosas que pueden marcar la
+						diferencia.
+					</ListItem>
+				</List>
+				<Text fontSize='md' color={'#00001C'} fontFamily={'space'}>
+					Este evento es una oportunidad única para inspirarte, aprender y tomar
+					acción. ¡Juntos podemos construir un futuro mejor a través de la
+					tecnología y el voluntariado!¡Regístrate ahora y sé parte de este
+					movimiento de cambio!#Web3EnAccion #VoluntariadoWeb3 #ImpactoPositivo
 				</Text>
 			</VStack>
 		</Flex>
diff --git a/src/components/events/EventLocation.tsx b/src/components/events/EventLocation.tsx
index 1476aad..a399b77 100644
--- a/src/components/events/EventLocation.tsx
+++ b/src/components/events/EventLocation.tsx
@@ -54,11 +54,11 @@ const EventLocation = () => {
 					Restaurante Bitácora, Calle 85 # 12-51, Bogotá, Colombia
 				</Text>
 			</HStack>
-			<Box flex='1' w='100%' h='full' bg='gray.300' borderRadius='md' mt={4}>
+			{/* <Box flex='1' w='100%' h='full' bg='gray.300' borderRadius='md' mt={4}>
 				<Text textAlign='center' verticalAlign='middle' m='auto'>
 					Map Placeholder
 				</Text>
-			</Box>
+			</Box> */}
 		</Flex>
 	)
 }
diff --git a/src/components/events/GetTicketCard.tsx b/src/components/events/GetTicketCard.tsx
index 3493af3..f2b1376 100644
--- a/src/components/events/GetTicketCard.tsx
+++ b/src/components/events/GetTicketCard.tsx
@@ -1,14 +1,16 @@
 import React from 'react'
-import { Flex, Button, Text } from '@chakra-ui/react'
+import { Flex, Button, Text, VStack } from '@chakra-ui/react'
+import { Event } from '@/models/event.model'
 
 type Props = {
+	event: Event
 	getTicket: () => Promise<void>
 	isBuyTicketLoading: boolean
 	hasTicket: boolean
 }
 
 const GetTicketCard = (props: Props) => {
-	const { getTicket, isBuyTicketLoading, hasTicket } = props
+	const { event, getTicket, isBuyTicketLoading, hasTicket } = props
 	return (
 		<Flex
 			h={'fit-content'}
@@ -32,15 +34,16 @@ const GetTicketCard = (props: Props) => {
 				direction={{ base: 'row', lg: 'column' }}
 				gap={3}
 				justifyContent={'center'}
+				alignItems={'center'}
 			>
 				<Text
-					fontSize='lg'
+					fontSize={{ base: 'md', lg: 'lg' }}
 					fontFamily={'space'}
 					fontWeight='semibold'
 					color={'#00001C'}
 					textAlign={'center'}
 				>
-					GRATIS • Quedan 7 cupos
+					¡GRATIS! • Quedan {event.remainingTickets} cupos
 				</Text>
 				{hasTicket ? (
 					<Button
@@ -52,7 +55,7 @@ const GetTicketCard = (props: Props) => {
 						bg={'teal'}
 						color={'#FFF'}
 						fontFamily={'neue'}
-						fontSize={['18px', '22px']}
+						fontSize={{ base: 'md', lg: 'lg' }}
 						fontWeight={400}
 						_active={{
 							transform: 'scale(0.98)'
diff --git a/src/components/events/PreviousEvents.tsx b/src/components/events/PreviousEvents.tsx
index 98a4b20..6c02c1d 100644
--- a/src/components/events/PreviousEvents.tsx
+++ b/src/components/events/PreviousEvents.tsx
@@ -17,7 +17,7 @@ export default function PreviousEvents() {
 			>
 				<VStack align='start' justifyContent={'flex-start'} spacing={0}>
 					<Text
-						fontSize='1.953rem'
+						fontSize={{ base: '2xl', lg: '3xl' }}
 						fontFamily={'space'}
 						fontWeight='semibold'
 						color={'#00001C'}
diff --git a/src/components/events/TagsSection.tsx b/src/components/events/TagsSection.tsx
index 9c3cbc6..4ed3e20 100644
--- a/src/components/events/TagsSection.tsx
+++ b/src/components/events/TagsSection.tsx
@@ -15,7 +15,7 @@ const TagsSection = () => {
 		>
 			<VStack align='start' spacing={5}>
 				<Text
-					fontSize='1.953rem'
+					fontSize={{ base: '2xl', lg: '3xl' }}
 					fontFamily={'space'}
 					fontWeight='semibold'
 					color={'#00001C'}
diff --git a/src/functions/dto/index.ts b/src/functions/dto/index.ts
new file mode 100644
index 0000000..e78c768
--- /dev/null
+++ b/src/functions/dto/index.ts
@@ -0,0 +1,17 @@
+import { Event, EventDTO } from '@/models/event.model'
+
+export function mapDTOtoEvent(eventDTO: EventDTO): Event {
+	return {
+		id: eventDTO.id,
+		name: eventDTO.name,
+		description: eventDTO.description,
+		location: eventDTO.location,
+		totalTickets: eventDTO.totalTickets.toNumber(),
+		remainingTickets: eventDTO.remainingTickets.toNumber(),
+		startTime: eventDTO.startTime.toNumber(),
+		endTime: eventDTO.endTime.toNumber(),
+		reedemableTime: eventDTO.reedemableTime.toNumber(),
+		ownerAddress: eventDTO.ownerAddress,
+		nftAddress: eventDTO.nftAddress
+	}
+}
diff --git a/src/models/event.model.ts b/src/models/event.model.ts
new file mode 100644
index 0000000..f9e111c
--- /dev/null
+++ b/src/models/event.model.ts
@@ -0,0 +1,29 @@
+import { BigNumber } from 'ethers'
+
+export interface Event {
+	id: string
+	name: string
+	description: string
+	location: string
+	totalTickets: number
+	remainingTickets: number
+	startTime: number
+	endTime: number
+	reedemableTime: number
+	ownerAddress: string
+	nftAddress: string
+}
+
+export interface EventDTO {
+	id: string
+	name: string
+	description: string
+	location: string
+	totalTickets: BigNumber
+	remainingTickets: BigNumber
+	startTime: BigNumber
+	endTime: BigNumber
+	reedemableTime: BigNumber
+	ownerAddress: string
+	nftAddress: string
+}
diff --git a/src/pages/events/[id]/index.tsx b/src/pages/events/[id]/index.tsx
index dccff19..e4ac900 100644
--- a/src/pages/events/[id]/index.tsx
+++ b/src/pages/events/[id]/index.tsx
@@ -20,21 +20,27 @@ import Footer from '@/components/shared/Footer'
 import '../../../config/i18n'
 import { CHAINID, PROVIDER } from '@/constants/constants'
 import { useAccount, useNetwork } from 'wagmi'
+import { Event, EventDTO } from '@/models/event.model'
+import { mapDTOtoEvent } from '@/functions/dto'
+
+const initialEvent: Event = {
+	id: '',
+	name: '',
+	description: '',
+	location: '',
+	totalTickets: 0,
+	remainingTickets: 0,
+	startTime: 0,
+	endTime: 0,
+	reedemableTime: 0,
+	ownerAddress: '',
+	nftAddress: ''
+}
 import Loader from '@/components/shared/Loader'
 import { useTranslation } from 'react-i18next'
 
-interface Event {
-	id: string
-	title: string
-	description: string
-}
-
-type Props = {
-	event: Event
-}
-
-function Event(props: Props): JSX.Element {
-	const { event } = props
+function Event(): JSX.Element {
+	const [event, setEvent] = useState<Event>(initialEvent)
 	const [hasTicket, setHasTicket] = useState<boolean>(false)
 	const [isBuyTicketLoading, setIsBuyTicketLoading] = useState<boolean>(false)
 	const [isLoading, setIsLoading] = useState<boolean>(true)
@@ -54,20 +60,38 @@ function Event(props: Props): JSX.Element {
 		const ethereum = (window as any).ethereum
 
 		if (!ethereum) {
-			// TODO: i18n
-			alert('MetaMask no está instalado en este navegador.')
+			toast({
+				title: t('toasts.install-metamask.title'),
+				description: t('toasts.install-metamask.description'),
+				status: 'warning',
+				duration: 3000,
+				isClosable: false,
+				position: 'top-right'
+			})
 			return
 		}
 
 		if (!address) {
-			// TODO: i18n
-			alert('Conecta tu cuenta de MetaMask para comprar un ticket.')
+			toast({
+				title: t('toasts.connect-metamask.title'),
+				description: t('toasts.connect-metamask.description'),
+				status: 'warning',
+				duration: 3000,
+				isClosable: false,
+				position: 'top-right'
+			})
 			return
 		}
 
 		if (chain?.id !== CHAINID) {
-			// TODO: i18n
-			alert('Cambia a la red mumbai para comprar un ticket.')
+			toast({
+				title: t('toasts.change-network.title'),
+				description: t('toasts.change-network.description'),
+				status: 'warning',
+				duration: 2000,
+				isClosable: false,
+				position: 'top-right'
+			})
 			return
 		}
 
@@ -92,6 +116,10 @@ function Event(props: Props): JSX.Element {
 				})
 				await tx.wait(1)
 
+				const newEvent = event
+				newEvent.remainingTickets = newEvent.remainingTickets - 1
+				setEvent(newEvent)
+
 				setIsBuyTicketLoading(false)
 				setHasTicket(true)
 
@@ -99,7 +127,7 @@ function Event(props: Props): JSX.Element {
 					title: t('toasts.ticket-bought.title'),
 					description: t('toasts.ticket-bought.description'),
 					status: 'success',
-					duration: 3000,
+					duration: 2000,
 					isClosable: false,
 					position: 'top-right'
 				})
@@ -109,33 +137,41 @@ function Event(props: Props): JSX.Element {
 
 			if (error instanceof Error) {
 				if (error.message.includes('user rejected transaction')) {
+					toast({
+						title: t('toasts.failed.title'),
+						description: t('toasts.failed.description'),
+						status: 'error',
+						duration: 2000,
+						isClosable: false,
+						position: 'top-right'
+					})
 					return
 				} else if (error.message.includes('transaction failed')) {
 					toast({
-						title: 'Could not create account',
-						description: '',
-						status: 'success',
-						duration: 3000,
+						title: t('toasts.failed.title'),
+						description: t('toasts.failed.description'),
+						status: 'error',
+						duration: 2000,
 						isClosable: false,
 						position: 'top-right'
 					})
 				} else {
 					console.error('error: ', error)
 					toast({
-						title: 'Account created.',
-						description: "We've created your account for you.",
-						status: 'success',
-						duration: 3000,
+						title: t('toasts.failed.title'),
+						description: t('toasts.failed.description'),
+						status: 'error',
+						duration: 2000,
 						isClosable: false,
 						position: 'top-right'
 					})
 				}
 			} else {
 				toast({
-					title: 'Account created.',
-					description: "We've created your account for you.",
-					status: 'success',
-					duration: 3000,
+					title: t('toasts.failed.title'),
+					description: t('toasts.failed.description'),
+					status: 'error',
+					duration: 2000,
 					isClosable: false,
 					position: 'top-right'
 				})
@@ -167,6 +203,22 @@ function Event(props: Props): JSX.Element {
 				rpcProvider
 			) as MeetdAppEvent
 
+			const eventDTO: EventDTO = {
+				id: await eventContract.eventId(),
+				name: await eventContract.eventName(),
+				description: await eventContract.eventDescription(),
+				location: await eventContract.eventLocation(),
+				totalTickets: await eventContract.eventTotalTickets(),
+				remainingTickets: await eventContract.eventRemainingTickets(),
+				startTime: await eventContract.eventStartTime(),
+				endTime: await eventContract.eventRemainingTickets(),
+				reedemableTime: await eventContract.eventReedemableTime(),
+				ownerAddress: await eventContract.eventOwner(),
+				nftAddress: await eventContract.eventNfts()
+			}
+
+			setEvent(mapDTOtoEvent(eventDTO))
+
 			if (address) {
 				const ticket: boolean = await eventContract.eventAttendees(address)
 				setHasTicket(ticket)
@@ -176,7 +228,7 @@ function Event(props: Props): JSX.Element {
 
 			setMeetdAppEventContract(eventContract)
 			setIsLoading(false)
-		}, 3000)
+		}, 1000)
 	}
 
 	useEffect(() => {
@@ -196,7 +248,6 @@ function Event(props: Props): JSX.Element {
 	return (
 		<>
 			<Navbar />
-
 			<Flex
 				background={
 					'linear-gradient(180deg, #348793 -0.41%, #00001C -0.4%, #053763 73.8%)'
@@ -211,7 +262,7 @@ function Event(props: Props): JSX.Element {
 				) : (
 					<>
 						<Flex
-							mt={'8em'}
+							mt={'9em'}
 							mb={'3em'}
 							maxW={'1200px'}
 							width={'90%'}
@@ -225,7 +276,8 @@ function Event(props: Props): JSX.Element {
 								flex={7}
 								w={'full'}
 								gap={'3em'}
-								order={{ base: 1, lg: 0 }}
+								alignItems={'center'}
+								justify={'center'}
 							>
 								<EventImage />
 								<EventDetails />
@@ -235,21 +287,21 @@ function Event(props: Props): JSX.Element {
 							</Flex>
 
 							<Flex
-								direction={'column'}
-								flex={3}
-								w={'full'}
+								width={'full'}
+								alignItems={'center'}
 								gap={'3em'}
-								order={{ base: 0, lg: 1 }}
+								flex={3}
+								direction={'column'}
 							>
 								<EventLocation />
 								<GetTicketCard
+									event={event}
 									getTicket={onBuyTicket}
 									isBuyTicketLoading={isBuyTicketLoading}
 									hasTicket={hasTicket}
 								/>
 							</Flex>
 						</Flex>
-
 						<Flex
 							mt={'8em'}
 							width={'90%'}
@@ -267,6 +319,7 @@ function Event(props: Props): JSX.Element {
 								<Attendees />
 								<TagsSection />
 								<GetTicketCard
+									event={event}
 									getTicket={onBuyTicket}
 									isBuyTicketLoading={isBuyTicketLoading}
 									hasTicket={hasTicket}