html{ 
	background: #CCD1D1;
	padding: 1em;
}

h1{ 
	font-family: Verdana, Geneva, sans-serif;
	font-size: 30px;
	letter-spacing: -1px;
	word-spacing: 1px;
	color: #bf2424;
	font-weight: 700;
	text-decoration: none;
	font-style: normal;
	font-variant: normal;
	text-transform: none;
}

h2{
	font-family: "Helvetica Neue", Arial, sans-serif;
	font-size: 20px;
	word-spacing: 1px;
	color: #3a7c00;
	font-weight: normal;
	text-decoration: none;
	font-style: normal;
	font-variant: normal;
	text-transform: none;
	border: 1px solid #fff;
	background-color: #fefefe;
	
}

h3{
	font-family: "Times New Roman", Times, serif;
	font-size: 16px;
} 

h4{ 
	font-family: "Helvetica Neue", Arial, sans-serif;
	font-size: 20px;
	letter-spacing: -1px;
	word-spacing: 1px;
	font-weight: normal;
	text-decoration: none;
	font-style: normal;
	font-variant: normal;
	text-transform: none;
	background-color: #fff;
	color:#000;
	border: 1px solid #e6e6e6;	
}


h5{
	width: 100%;
    text-align:center;
	font-family: "Times New Roman", Times, serif;
	font-size: 24px;
	letter-spacing: -1px;
	word-spacing: 1px;
	color: #fff;
	font-weight: normal;
	text-decoration: none;
	font-style: normal;
	font-variant: normal;
	text-transform: none;
} 

h6{
	width: 100%;
    text-align:center;
	font-family: Tahoma, "Trebuchet MS", sans-serif;
	font-size: 24px;
	letter-spacing: -1px;
	word-spacing: 1px;
	color: #282A35;
	font-weight: normal;
	text-decoration: none;
	font-style: normal;
	font-weight: bold;
	text-transform: none;
	margin-top: 20px;
	margin-bottom: auto;
}   

p{
    grid-template-columns: 1fr;
	width: 500px;
  }
  
a:link { 
	color: #000;
	text-decoration: none;
}

a:hover{ 
	color: #2c6c09;
	text-decoration: underline;
}

a:visited{ 
	color: #000;
	text-decoration: none;
}

a:active{ 
	color: #000;
	text-decoration: none;
}

.guatemala{
	margin: auto;
}

.floresadomicilio {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  background-color: #F9F9F9;
  border-bottom: 2px solid #c3c3c3;
  padding: 10px;
  font-family: 'Segoe UI', sans-serif;
}

.floresadomicilio div {
  margin: 5px;
  padding: 10px 15px;
  background: #00504a;
  border: 1px solid #bbffaa;
  border-radius: 2px;
  transition: background-color 0.3s ease;
  flex: 1 1 150px; /* responsive base */
  text-align: center;
  width:240px;
}

.floresadomicilio div:hover {
  background-color: #4e7d35;
}

.floresadomicilio .deliveryfloresguatemala {
  background-image: linear-gradient(to top, #f1f1f1 0%, #fff 33%, #f1f1f1 66%);
  border: 2px solid #e5e0e0;
  color: #000;
  flex-basis: 100%;
}

.floresadomicilio a {
  text-decoration: none;
  color: #fff;
  font-weight: bold;
  font-size: 16px;
  display: block;
}

.floresadomicilio .deliveryfloresguatemala a {
  color: #333;
}

.floresadomicilio .floresfuneralguatemala {
  background: #000;
  border-color: #ccc;
}

.floresadomicilio .floresfuneralguatemala a {
  color: #fff;
}

.floresadomicilio .floresfuneralguatemala:hover {
  background-color: #ddd; /* Fondo opcional para destacar */
}

.floresadomicilio .floresfuneralguatemala a:hover {
  color: #444; /* Color al pasar el mouse (gris oscuro) */
}


.floresadomicilio .deliveryflores {
  background: #4e7d35;
  border-color: #ccc;
}

.floresadomicilio .deliveryflores:hover {
  background-color: #00504a; /* Fondo opcional para destacar */
}

.floresadomicilio .deliveryflores a {
  color: #fff;
}


.enguatemala{
	display: grid;	
	grid-template-columns: 1fr;
	text-align: center;
}

h2.enguatemala{
	display: grid;	
	grid-template-columns: 1fr;
	text-align: center;
	border-color: #95ff35;
}

h4.enguatemala{
	display: grid;	
	grid-template-columns: 1fr;
	text-align: center;
	border-color: #fff;
}


.enguate{
	text-align: center;
    padding: 20px;
}

.enguate h1 {
  font-size: 1.5rem; /* Escalable y responsive */
  color: #000;
  border: 2px solid #72eb02;
  background-color: #fff;
  padding: 10px;
  margin: 0 auto;
  max-width: 100%;
  box-sizing: border-box;
}

@media (max-width: 600px) {
  .enguate h1 {
    font-size: 1.5rem;
  }
}


.eventsguatemala{
	text-align: center;
    padding: 20px;
}

.eventsguatemala h1 {
  font-size: 1.5rem; /* Escalable y responsive */
  color: #820f0e;
  background:#f5f5f5;
  border: 2px solid #af6d7f;
  padding: 10px;
  margin: 0 auto;
  max-width: 100%;
  box-sizing: border-box;
}

@media (max-width: 600px) {
  .eventsguatemala h1 {
    font-size: 1.5rem;
  }
}


.floristerialasflores {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1em;
  padding: 1em;
}

.floristerialasflores div { 
	background: #ecf0f1;
	padding: 1em;
	border: 1px solid #fff;
}

.floristerialasflores div:hover{
	border: 1px solid #A7ADB6;
}

@media screen and (min-width: 360px) {

  .floristerialasflores{
    grid-template-columns: repeat(2, 1fr);
  }
}

@media screen and (min-width: 960px) {
 
  .floristerialasflores{
    grid-template-columns: repeat(4, 1fr);
  }
}


/* Contenedor principal en modo grid: una sola columna */
.enviofloresgt {
  display: grid;
  grid-template-columns: 1fr;
  justify-items: center; /* Centra el contenido horizontalmente */
  padding: 1em;
}

/* Contenedor interno de cada imagen */
.floresadomiciliogt {
  background: #ecf0f1;
  padding: 1em;
  border: 1px solid #fff;
  text-align: center;
  transition: border 0.3s ease;
  width: 100%;
  max-width: 500px; /* Limita el ancho máximo */
  box-sizing: border-box;
}

.floresadomiciliogt:hover {
  border: 1px solid #A7ADB6;
}

/* Imagen centrada y responsive */
.floresadomiciliogt img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 4px;
}

/* Enlace de texto debajo de la imagen */
.floresadomiciliogt a {
  color: #286b00;
  text-decoration: none;
  font-weight: bold;
  display: block;
  margin-top: 0.5em;
  font-size: 14px;
}

/* Tamaño de fuente más pequeño para pantallas pequeñas */
@media screen and (max-width: 360px) {
  .floresadomiciliogt a {
    font-size: 12px;
  }
}



.floresguatemala{
  background: #ecf0f1;
  padding: 1em;
  border: 1px solid #fff;
  text-align: center;
  transition: border 0.3s ease;
}

.floresguatemala:hover {
  border: 1px solid #A7ADB6;
}

.floresguatemala img {
  width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
  border-radius: 4px;
}

.floresguatemala a {
  color: #286b00;
  text-decoration: none;
  font-weight: bold;
  display: block;
  margin-top: 0.5em;
}

@media screen and (min-width: 360px) {

  .floresguatemala a{
    font-size:12px;
  }
}

@media screen and (min-width: 960px) {
 
  .floresguatemala a{
    font-size:18px;
  }
}

.flowershop {
  max-width: 500px;
  width: 90%;
  background-color: #619369;
  color: #fff;
  margin: 0 auto;
  padding: 10px;
  box-sizing: border-box;
}

.floresparafuneral {
  max-width: 500px;
  width: 90%;
  background-color: #000;
  color:#fff;
  margin: 0 auto;
  padding: 10px;
  box-sizing: border-box;
}

.floreszona {
  max-width: 500px;
  width: 90%;
  background-color: #FF6F6F;
  color:#fff;
  margin: 0 auto;
  padding: 10px;
  box-sizing: border-box;
}

.flores {
  max-width: 500px;
  width: 90%;
  background-color: #0068a5;
  color:#fff;
  margin: 0 auto;
  padding: 10px;
  box-sizing: border-box;
}

.floresgt {
	box-shadow: inset 0px 1px 0px 0px #ffffff;
	background: linear-gradient(to bottom, #f9f9f9 5%, #e9e9e9 100%);
	background-color: #f9f9f9;
	border-radius: 6px;
	border: 1px solid #dcdcdc;
	display: inline-block;
	cursor: pointer;
	color: #666666;
	font-family: Arial, sans-serif;
	font-size: 1rem; /* relativo */
	font-weight: bold;
	padding: 0.5em 1.5em; /* relativo */
	text-decoration: none;
	text-shadow: 0px 1px 0px #ffffff;
	max-width: 100%;
	box-sizing: border-box;
	white-space: normal;
	text-align: center;
}

.floresgt:hover {
	background: linear-gradient(to bottom, #e9e9e9 5%, #f9f9f9 100%);
	background-color: #e9e9e9;
}

.floresgt:active {
	position: relative;
	top: 1px;
}

.floresgt a:link {
	color: #538512;
	text-decoration: none;
}

@media screen and (max-width: 600px) {
.floresgt {
		font-size: 0.9rem;
		padding: 0.75em 1em;
		width: 100%;
	}
}

.florespara {
  text-align: center;
  max-width: 500px;
  width: 90%;
  background-color: #959595;
  margin: 0 auto;
  padding: 10px;
  box-sizing: border-box;
}

.florespara h3 {
	font-size: 20px;
	color: #9C0E11;
	font-family: Verdana, Geneva, sans-serif;
	background-color:#fff;
}

.florespara h3:hover {
	color:#959595;
	text-decoration:underline;
}

.floristeria{
    display: block;
    margin-block-start: 0.5em;
    margin-block-end: 0.5em;
    margin-inline-start: auto;
    margin-inline-end: auto;
    unicode-bidi: isolate;
    overflow: hidden;
    border-style: inset;
    border-width: 1px;
}

.flowershopguatemala {
	max-width: 500px;
	width: 90%;
	background-color: #406276;
	color: #fff;
	margin: 0 auto;
	padding: 10px;
	box-sizing: border-box;
}

.flowersguatemala {
	max-width: 500px;
	width: 90%;
	background-color: #878787;
	color: #fff;
	margin: 0 auto;
	padding: 10px;
	box-sizing: border-box;
}

.weddingsgt {
	max-width: 500px;
	width: 90%;
	background-color: #a6a6a6;
	color: #fff;
	margin: 0 auto;
	padding: 10px;
	box-sizing: border-box;
}

.weddingplannerguatemala {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1em;
  padding: 1em;
}

.antiguaguatemala {
  background: #ecf0f1;
  padding: 1em;
  border: 1px solid #fff;
  text-align: center;
  transition: border 0.3s ease;
}

.antiguaguatemala:hover {
  border: 1px solid #A7ADB6;
}

.antiguaguatemala video {
  width: 100%;
  height: auto;
  border-radius: 4px;
  display: block;
  margin: 0 auto;
  max-height: 300px; 
}

.antiguaguatemala br + * {
  color: #286b00;
  font-weight: bold;
  margin-top: 0.5em;
  display: block;
}

.eventplannerguatemala {
	max-width: 500px;
	width: 90%;
	background-color: #003360;
	color: #fff;
	margin: 0 auto;
	padding: 10px;
	box-sizing: border-box;
}


.floresfuneral {
  max-width: 800px;
  margin: 0 auto;
  padding: 20px;
  background: #fff;
}

.floresfuneral h4 {
  text-align: center;
  margin-bottom: 20px;
}

.floresfuneral p {
  width: 100%;
  margin-bottom: 20px;
  font-family: Tahoma, Geneva, sans-serif;
  text-align:center;
  color:#000;
}

.enviodeflores {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

.enviodeflores a {
  display: inline-block;
  padding: 8px 14px;
  background: #5b9bd5;
  color: white;
  text-decoration: none;
  border-radius: 20px;
  font-family: Tahoma, Geneva, sans-serif;
  font-size: 14px;
  transition: background 0.3s ease;
}

.enviodeflores a:hover {
  background: #2f75b5;
  text-decoration: underline;
}

.enviodefloresfuneral {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

.enviodefloresfuneral a {
  display: inline-block;
  padding: 8px 14px;
  background: #000;
  color: white;
  text-decoration: none;
  border-radius: 20px;
  font-family: Tahoma, Geneva, sans-serif;
  font-size: 14px;
  transition: background 0.3s ease;
}

.enviodefloresfuneral a:hover {
  background: #060606;
  text-decoration: underline;
}

.ramosderosas {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

.ramosderosas a {
  display: inline-block;
  padding: 8px 14px;
  background: #af6d7f;
  color: white;
  text-decoration: none;
  border-radius: 20px;
  font-family: Tahoma, Geneva, sans-serif;
  font-size: 14px;
  transition: background 0.3s ease;
}

.ramosderosas a:hover {
  background: #060606;
  text-decoration: underline;
}



@media (max-width: 480px) {
  .enviodeflores a {
    font-size: 12px;
    padding: 6px 10px;
  }


  .enviodefloresfuneral a {
    font-size: 12px;
    padding: 6px 10px;
  }
  
  .ramosderosas a {
    font-size: 12px;
    padding: 6px 10px;
  }
  
}

 .footer {
	text-align: center;
	padding: 15px;
	background-color: #1E5060;
	color: #fff;
	font-size: 0.9em;
	margin-top: 40px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    }
	
 .footer a{
	color: #ccc;
    }

.arreglosflorales {
  max-width: 800px;
  margin: 0 auto;
  padding: 20px;
  background: #fff;
}

.arreglosflorales h4 {
  text-align: center;
  margin-bottom: 20px;
}

.arreglosflorales p {
  width: 100%;
  margin-bottom: 20px;
  font-family: Tahoma, Geneva, sans-serif;
  text-align:center;
  color:#000;
}


@media (max-width: 600px) {
	
      .floresfuneral {
        padding: 10px;
      }
	  
	  .arreglosflorales{
        padding: 10px;
      }

      table td {
        padding: 10px;
        font-size: 0.95em;
      }
    }
	
Footer
© 2025 Floristeria Las Flores
