@font-face {
    font-family: "Mega Fresh";
    src: url("./fonts/fonts-meds/52fc208a45b0ba23c86a7e911f266901.eot");
    src: url("./fonts/fonts-meds/52fc208a45b0ba23c86a7e911f266901.eot?#iefix") format("embedded-opentype"),
        url("./fonts/fonts-meds/52fc208a45b0ba23c86a7e911f266901.woff2") format("woff2"),
        url("./fonts/fonts-meds/52fc208a45b0ba23c86a7e911f266901.woff") format("woff"),
        url("./fonts/fonts-meds/52fc208a45b0ba23c86a7e911f266901.ttf") format("truetype"),
        url("./fonts//fonts-meds/52fc208a45b0ba23c86a7e911f266901.svg#Mega Fresh") format("svg");
}

        .titulo-llegar {
            background-image: linear-gradient(#ffffff);
            color: #ffffff;
            font-family: 'Mega Fresh';
            font-size: 155px;
            font-weight: 500;
            line-height: 160px;
            padding: 0px 0px;
            text-align: center;
            text-shadow: #000000 0px 2px 4px;
        }
        @media screen and (max-width:800px) {

            .titulo-llegar {
                font-size: 100px;
            }
        }

#main-container {
    margin: 150px auto;
    width: 100px;
}

.container-card {
    width: 100%;
    display: flex;
    max-width: 1110px;
    margin: auto;
    margin-bottom: 0px;
}

.container-card1 {
    width: 100%;
    display: flex;
    max-width: 440px;
    margin: auto;
    margin-bottom: 0px;
}

.title-cards {
    width: 100%;
    max-width: 1080px;
    margin: auto;
    padding: 20px;
    margin-top: 10px;
    text-align: center;
    color: #7a7a7a;
}

#posicion{
    float: left;
}

.loHosp{
    font-size: 60px;
    color: red;
    margin-bottom: 20px;
}

.card {
    width: 100%;
    margin-bottom: 0px;
    margin: 20px;
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2);
    transition: all 400ms ease-out;
    cursor: default;
}

.card:hover {
    box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.4);
    transform: translateY(-3%);
}

.card img {
    width: 100%;
    height: 210px;
}

.contenido-card h3 {
    font-size: 30px;
    text-align: 15px;
}
.contenido-card h4 {
  font-size: 22px;
  text-align: 15px;
}

/* MARGEN DEL GUADRADO INTERNO */
.card .contenido-card {
    padding: 7px;
    text-align: center;
}

.card .contenido-card h3 {
    margin-bottom: 10px;
    color: #7a7a7a;
}
.card .contenido-card h4 {
    margin-bottom: 10px;
    color: #7a7a7a;
}

/*TAMANO DE LAS LETRAS P*/
.card .contenido-card p {
    line-height: 1.8;
    color: #6a6a6a;
    font-size: 17px;
    margin-bottom: 5px;
}

.card .contenido-card a {
    display: inline-block;
    padding: 10px;
    margin-top: 10px;
    text-decoration: none;
    color: #2fb4cc;
    border: 1px solid #2fb4cc;
    border-radius: 4px;
    transition: all 400ms ease;
    margin-bottom: 5px;
}

.card .contenido-card a:hover {
    background: #2fb4cc;
    color: #fff;
}

@media screen and (max-width:800px) {
    #posicion{
        float: none;
    }
}

@media screen and (max-width:1300px) {

    .container-card1 {
        width: 100%;
        display: flex;
        max-width: 320px;
        margin: auto;
        margin-bottom: 0px;
    }
}

@media only screen and (max-width:768px) {
    .container-card {
        flex-wrap: wrap;
    }

    .card {
        margin: 15px;
    }
}

/*Fin-Cards*/
.responsiveContent {
    position: relative;
    text-align: center;
    height: 0;
    overflow: hidden;
    padding-bottom: 56.2%;
    margin-bottom: 20px;
}

.responsiveContent iframe {

    text-align: center;
    top: 0%;
    left: 0%;
    width: 650px;
    height: 300px;
    margin: 0 auto;
    display: block;
}


table {
    background-color: white;
    text-align: left;
    border-collapse: collapse;
    width: 100%;
}

th,
td {
    padding: 2px;
    font-size: 19px
}

thead {
    background-color: #246355;
    border-bottom: solid 5px #0F362D;
    color: white;
}

tr:nth-child(even) {
    background-color: #ddd;
}

tr:hover td {
    background-color: #369681;
    color: white;
}

.regresar {
    display: block;
    position: absolute;
    margin-top: 40px;
    margin-left: 40px;
    background-color: #162E44;
    color: #fff;
    text-decoration: none;
    width: 40px;
    height: 40px;
    line-height: 20px;
    border-radius: 50%;
    font-size: 20px;
    cursor: pointer;
}

/*-- POSICION Y MARGENES DE LA IMAGEN--*/
.banner-como {
    background-image: url("imagenes/anconcito/0076_como_llegar.jpg");
    width: 100%;
    height: 460px;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
    line-height: 50px;
    text-align: center;

}


/*-- TITULO DENTRO DE LA IMANGEN*/
.titulo-llegar {
    background-image: linear-gradient(#ffffff);
    color: #ffffff;
    font-family: 'Mega Fresh';
    font-size: 155px;
    font-weight: 500;
    line-height: 160px;
    padding: 0px 0px;
    text-align: center;
    text-shadow: #000000 0px 2px 4px;


}

@media screen and (max-width:800px) {

    .titulo-llegar {
        font-size: 100px;
    }
}


/*** Table Styles **/

.table-fill {
    background: white;
    border-radius:3px;
    border-collapse: collapse;
    height: 320px;
    margin: auto;
    max-width: 600px;
    padding:5px;
    width: 100%;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    animation: float 5s infinite;
  }
   
  th {
    color:#D5DDE5;;
    background:#1b1e24;
    border-bottom:4px solid #9ea7af;
    border-right: 1px solid #343a45;
    font-size:23px;
    font-weight: 100;
    padding:24px;
    text-align:left;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
    vertical-align:middle;
  }
  
  th:first-child {
    border-top-left-radius:3px;
  }
   
  th:last-child {
    border-top-right-radius:3px;
    border-right:none;
  }
    
  tr {
    border-top: 1px solid #C1C3D1;
    border-bottom: 1px solid #C1C3D1;
    color:#666B85;
    font-size:16px;
    font-weight:normal;
    text-shadow: 0 1px 1px rgba(256, 256, 256, 0.1);
  }
   
  tr:hover td {
    background:#4E5066;
    color:#FFFFFF;
    border-top: 1px solid #22262e;
  }
   
  tr:first-child {
    border-top:none;
  }
  
  tr:last-child {
    border-bottom:none;
  }
   
  tr:nth-child(odd) td {
    background:#EBEBEB;
  }
   
  tr:nth-child(odd):hover td {
    background:#4E5066;
  }
  
  tr:last-child td:first-child {
    border-bottom-left-radius:3px;
  }
   
  tr:last-child td:last-child {
    border-bottom-right-radius:3px;
  }
   
  td {
    background:#FFFFFF;
    padding:20px;
    text-align:left;
    vertical-align:middle;
    font-weight:300;
    font-size:18px;
    text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.1);
    border-right: 1px solid #C1C3D1;
  }
  
  td:last-child {
    border-right: 0px;
  }
  
  th.text-left {
    text-align: left;
    padding-right: 70px;
  
  }
  
  th.text-center {
    text-align: center;
  }
  
  th.text-right {
    text-align: right;
  }
  
  td.text-left {
    text-align: left;
  }
  
  td.text-center {
    text-align: center;
  }
  
  td.text-right {
    text-align: right;
  }