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

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

h2{ 
	font-family: "Times New Roman", Times, serif;
	font-size: 36px;
	letter-spacing: -1px;
	word-spacing: 1px;
	color: #000000;
	font-weight: normal;
	text-decoration: none;
	font-style: normal;
	font-variant: normal;
	text-transform: none;
}

h2.mensajes{ 
	background: #fff;
    color: #000;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 12px 20px;
    margin: 20px auto;
    width: fit-content;
    box-shadow: 0 2px 8px rgba(0,0,0,.12);
    font-family: "Times New Roman", Times, serif;
    font-size: 36px;
    text-align: center;
}

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

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

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;
}

hr.deliveryfloresparafuneral {	
    height: 12px;
    border: 0;
    box-shadow: inset 0 12px 12px -12px rgba(0, 0, 0, 0.5);
}

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

  hr.deliveryfloresparafuneral{
    width: 500px;
	height: 12px;
    border: 0;
    box-shadow: inset 0 12px 12px -12px rgba(0, 0, 0, 0.5);
  }
}

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

 hr.deliveryfloresparafuneral{
	width: 100%;
	height: 12px;
    border: 0;
    box-shadow: inset 0 12px 12px -12px rgba(0, 0, 0, 0.5);
  }
}


hr {	
     text-align: center;
}

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

  hr{
    width: 500px;
	height: 1px;
    border: 1;
  }
}

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

 hr{
	width: 100%;
	height: 1px;
    border: 1;
  }
}
  
a:link { 
	color: #000;
	text-decoration: none;
}

a:hover{ 
	color: #48b;
	text-decoration: underline;
}

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

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

.deliveryfloresguatemala{ 
	text-align: center;
}

.deliveryflores{ 
	text-align: center;
}

.deliveryflores a:link { 
	color: #000;
	text-decoration: none;
}
  
.floresparafuneral{  
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 1em;
	font-size: 18px;
	justify-content: center;
	align-items: center;
	width: 500px;
}

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

.floresparafuneral .deliveryflores{ 
	background: #000;
}

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

.floresparafuneral div:hover{ 
	border: 1px solid #797D7F;
}

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

  .floresparafuneral{
    grid-template-columns: 1fr;
	width: 500px;
  }
  
  .floresparafuneral div { 
	background: #fff;
	padding: 1em;
	border: 1px solid #fff;
  } 
}

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

 .floresparafuneral{
	  grid-template-columns: repeat(3, 1fr);
	  width: 100%;
  }  
}

.floresafunerales{  
	display: grid;
	grid-template-columns: repeat(4, 1fr);	
	gap: 1em;
	grid-template-rows: minmax(240px; auto);
}

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

.floresafunerales div:hover{ 
	border: 1px solid #f1c40f;
}

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

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

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

.obituariosguatemala{
	display: grid;
	grid-template-columns: repeat(4, 1fr);	
	gap: 1em;
	grid-template-rows: minmax(100px; auto);
}

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

.obituariosguatemala div:hover{ 
	border: 1px solid #f1c40f;
}

@media screen and (min-width: 360px) {
  
.obituariosguatemala{
    grid-template-columns: repeat(2, 1fr);
  }
}

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

.obituario{
	font-size: 16px;
}

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

.enviofloresparafuneral div:hover{ 
	border: 1px solid #f1c40f;
}

.enviofloresparafuneral{  
	display: grid;
	grid-template-columns: repeat(4, 1fr);	
	gap: 1em;
	grid-template-rows: minmax(100px; auto);
}

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

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

}

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

.enviofloresparafuneral{
    grid-template-columns: repeat(4, 1fr);
  }

}

p{
    grid-template-columns: 1fr;
	width: 500px;
  }

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

  p{
    grid-template-columns: 1fr;
	width: 500px;
  }

}

  
@media screen and (min-width: 960px) {
	  p{
    grid-template-columns: 1fr;
	width: 100%;
  } 
}

.arreglosfunebres {
	color: #515C64;
	font-size: 14px;
	font-weight: bolder;
}

.arreglosfunebres:hover {
	color: red;
	font-size: 14px;
	font-weight: bolder;
}

.arreglosfunebres:visited {
	color: #515C64;
	font-size: 14px;
	font-weight: bolder;
}

.ventadefloresguatemala{
	display: grid;
	grid-template-columns: repeat(1, 1fr);	
	gap: 10px;
	grid-template-rows: minmax(100px; auto);
}

.ventadefloresguatemala div {
	background: #ecf0f1;
	padding-top: 15px;
	paddin-bottom: 10px;
	border: 1px solid #fff;
}

.ventadefloresguatemala div:hover{
	border: 1px solid #a3a3a3;
}

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

.ventadefloresguatemala img{
  max-width: 100%;
  display: block;
  border: 1px solid #a3a3a3;
  margin:auto;
  } 

}

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

}

.floristeriasguatemala{
	grid-column: 1/4;
	justify-content: center;
	align-items: center;
}

@media screen and (min-width: 360px) {
	.floristeriasguatemala{
    grid-template-columns: 1fr;
	width: 500px;
	justify-content: center;
	align-items: center;
  }
}

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

	.floristeriasguatemala{
    grid-template-columns: 1fr;
	width: 100%;
	justify-content: center;
	align-items: center;
  }
}

.obituarios{
	display: grid;
	grid-template-columns: repeat(4, 1fr);	
	gap: 1em;
	grid-template-rows: minmax(100px; auto);
}

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

.obituarios div:hover{
	border: 1px solid #000000;
}

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

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

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

.obituarios{
    grid-template-columns: repeat(4, 1fr);
  }
  
}

.esquelasguatemala{
	display: grid;
	grid-template-columns: repeat(1, 1fr);	
	gap: 10px;
	grid-template-rows: minmax(100px; auto);
}


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

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

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

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

.arreglosflorales{  
	display: grid;
	grid-template-columns: repeat(1, 1fr);	
	gap: 1em;
	grid-template-rows: minmax(100px; auto);
}

.arreglosflorales div { 
	background: #1e272e;
	color: #fff;
	border: 1px solid #fff;
	padding: 10px;
	text-align: center;
}

.arreglosflorales div:hover{ 
	border: 1px solid #E9967A;
}

.arreglosflorales a:link{ 
	color: #fff;
	text-decoration: none;
}

.arreglosflorales a:hover{ 
	color: #E9967A;
	text-decoration: underline;
}

.arreglosflorales a:visited{ 
	color: #fff;
	text-decoration: none;
}

.arreglosflorales p{ 
	margin-top: -30px;
}


.coronasdefloresguatemala{
	font-family: Tahoma,Verdana,Segoe,sans-serif; 
	font-size: 14px;
	color: #88B4CA !important;
}

.disenowebguatemala {
	font-family: Tahoma,Verdana,Segoe,sans-serif; 
	font-size: 14px;
	color: #fff !important;
}

.funeralesguatemala {
	padding-top: 0px;
	margin: auto;
    width:500px;
    text-align: "center";
}

.difunto{
	color: #000;
	font-size: 18px;
	font-style: italic;
	font-weight: bold;
}

.contenido p{
font-family: Georgia, serif;
}

.floresparacementerio{
	margin: auto;
}

table.floresparacementerio {
  font-family: "Trebuchet MS", Helvetica, sans-serif;
  border: 1px solid #FFFFFF;
  width: 500px;
  height: 60px;
  text-align: left;
  border-collapse: collapse;
}

table.floresparacementerio td, table.floresparacementerio th {
  border: 1px solid #FFFFFF;
  padding: 0px 1px;
}

table.floresparacementerio tbody td {
  font-size: 14px;
  font-family:Arial, Helvetica, sans-serif;
}

table.floresparacementerio tr:nth-child(even) {
  background: #fff;
}
table.floresparacementerio thead {
  background: #000;
}

table.floresparacementerio thead th {
  font-size: 16px;
  font-weight: bold;
  color: #FFFFFF;
  text-align: center;
  border-left: 2px solid #FFFFFF;
}

table.floresparacementerio thead th:first-child {
  border-left: none;
}
  
.floresguatemala{
	display: grid;
	place-items: center;
}


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

.floresguatemala{
    grid-template-columns: 1fr;
	width: 500px;
  }

}

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

.floresguatemala{
	  grid-template-columns: repeat(1, 1fr);
	  width: 100%;
  }
}


.funerales { 
	color: #00e5ff!important;
	text-decoration: none;
	
}

.floristeriasguatemala{  
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	grid-template-rows: minmax(240px; auto);
}

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

.floristeriasguatemala div:hover{ 
	border: 1px solid #f1c40f;
}

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

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

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


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


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

.obi{
    grid-template-columns: 1fr;
    text-align: center;
	width: 500px;
  }

}

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

.obi{
	  grid-template-columns: repeat(1, 1fr);
	  text-align: center;
	  width: 100%;
  }
}

hr.obituariosguatemala {	
        border-bottom: 0.5rem solid #000;
}


.obituariosenguatemala{
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: normal;
} 

.retornar{
	display: grid;
	place-items: center;
}


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

.retornar{
    grid-template-columns: 1fr;
	width: 530px;
	text-align:center;
  }

}

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

.retornar{
	  grid-template-columns: repeat(1, 1fr);
	  width: 100%;
  }
}

td{
    text-align: center;
}

td h3{
    text-align: left;
	background-color:#004985;
	color: #fff;
}


.floristeria{
    max-width:500px;
    width:100%;
    margin:30px auto;
    padding:20px;
    background:#fff;
    border-radius:8px;
    box-shadow:0 2px 10px rgba(0,0,0,.15);
    box-sizing:border-box;
}

.floristeria p{
    width:100%;
    margin:0 0 12px;
    box-sizing:border-box;
}

.coronasflorales,
.flores24hrs{
    background:#000;
    color:#fff;
    padding:12px 15px;
    box-sizing:border-box;
    overflow-wrap:break-word;
}

.floresgt {
    color: #000;
    font-size: 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
    margin-bottom: 15px !important;
}

.coronasdeflores {
    color: #FFD700;
    font-size: 18px;
    letter-spacing: 2px;
}

.comentarios{
    margin-top:20px;
    text-align:center;
    font-size:14px;
    color:#666;
    border-top:1px solid #ddd;
    padding-top:15px;
}


@media (max-width:480px){
	
.floristeria{
   grid-template-columns: 1fr;
	width: 500px;
	justify-content: center;
	align-items: center;
    }

.floresgt{
        flex-direction:column;
        align-items:flex-start;
        gap:5px;
    }
}

Footer
© 2026 Flores para Funeral