/*----------------------------------------------------------------------------------- Zona Box */
.zonaBox {
    width:100%;
    height:22px;
    display: grid;
	grid-template-columns:  1fr  720px        1fr;
    grid-template-areas: "  .    zonaFondo  .";
    place-items: center start;
}
.zonaFondo {
    grid-area: zonaFondo;
    display: grid;
    width:100%;
    height:22px;
    background:#000;
    color: #EEE;
    font-family:Calibri;
    font-size:16px;
    font-weight: 400;
    padding-left:8px;
    letter-spacing:3px;
    word-spacing:2px;
    place-items: center start;
}
@media (max-width: 576px) {
    .zonaBox {
        grid-template-columns:  auto;
        grid-template-areas: "  zonaFondo";
    }
    .zonaFondo {
        grid-template-columns:  auto;
        font-size:13px;
        font-weight: 400;
    }
}
/*----------------------------------------------------------------------------------- Iglesia Box */
.churchBox {
    width:100%;
    height:36px;
    display: grid;
	grid-template-columns:  1fr  720px        1fr;
    grid-template-areas: "  .    churchFondo  .";
}
.churchFondo {
    grid-area: churchFondo;
    display: grid;
    width:100%;
    height:100%;
    grid-template-columns:  720px;
    grid-template-areas: "  churchfila";
}
.churchFondoGris {
    grid-area: churchFondo;
    display: grid;
    width:100%;
    height:100%;
    grid-template-columns:  720px;
    grid-template-areas: "  churchfila";
    background:#DDD;
}
.churchFila {
    width:100%;
    height:100%;
    display: grid;
	grid-template-columns:  170px       130px       370px          25px        25px;
    grid-template-areas: "  churchName  churchFono  churchAddress  churchIcon  eraseIcon";
    place-items: center start;
}
.churchName { 
    grid-area: churchName;
    display: grid;
    font-size: 18px;
    word-wrap: break-word; 
    overflow-wrap: break-word; 
    overflow: hidden;
}
.churchFono { 
    grid-area: churchFono;
    display: grid;
    font-size: 17px;
    color:#000;
    text-decoration:none;
}
.churchFono:hover{
    font-size: 17px;
    text-decoration:none;
    color:#000;
}
.churchAddress { 
    grid-area: churchAddress;
    display: grid;
    width:370px;
    font-size: 15px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding-right:8px;
}
.churchIcon { 
    grid-area: churchIcon;
    display: grid;
}
.churchIcon:hover {
    cursor: pointer;
}
.eraseIcon { 
    grid-area: eraseIcon;
    display: grid;
}
.eraseIcon:hover {
    cursor: pointer;
}
@media (max-width: 576px) {
    .churchBox {
        grid-template-columns:  auto;
        grid-template-areas: "  churchFondo";
    }
    .churchFondo {
        grid-template-columns:  auto;
    }
    .churchFondoGris {
        grid-template-columns:  auto;
        background:#EEE;
    }
    .churchFila {
        grid-template-columns:  230px       1fr         30px        30px;
        grid-template-areas: "  churchName  churchFono  churchIcon  eraseIcon";
    }
    .churchName { 
        padding-left:12px;
    }
    .churchAddress { 
        display:none;
    }
}