#turnos-title{
    color: #B62C38;
    text-align: center;
    font-weight: bold;
    margin-top: 40px;
}

.header{
    position: unset;
}

.card-cont{
    display: flex;
    width: 75%;
    margin: auto;
    flex-wrap: wrap;
}

@media screen and (max-width: 1700px){
    .card-cont {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(calc(33.33% - 20px), 1fr));
        grid-gap: 20px;
    }
}

@media screen and (max-width: 1000px){
    .card-cont {
        display: flex;
        width: 75%;
        margin: auto;
        flex-wrap: wrap;
    }
}

.card-cont .card-subcont,
.card-cont .card-subcont2,
.card-cont .card-subcont3,
.card-cont .card-subcont4,
.card-cont .card-subcont5,
.card-cont .card-subcont6,
.card-cont .card-subcont7{
    margin-top: 40px;
}
/* Radiologia */
.card-subcont{
    width: 250px;
    height: 350px;
    background-color: black;
    margin: auto;
    border-radius: 20px;
    background-image: url("../img/turnos/radio.jpg");
    cursor: pointer;
    transition: 1s;
}

.card-subcont h4{
    color: #B62C38;
    font-weight: bold;
    text-align: center;
    margin-top: 40px;
    visibility: hidden;
}

.card-subcont .card-description{
    width: 80%;
    margin: auto;
    visibility: hidden;
}

.card-subcont .card-description p{
    color: #B62C38;
    text-align: center;
}

.card-subcont::before{
    content: 'Radiología';
    color: #B62C38;
    position: absolute;
    margin-top: 280px;
    margin-left: 116px;
    font-weight: lighter;
    font-size: 20px;
    background-color: white;
    padding: 20px;
    border-radius: 20px 0px 20px 0px;
    cursor: pointer;
}

.card-subcont:hover{
    background-color: white;
    border: 1px solid #B62C38;
    background-image: none;
    box-shadow: 3px 1px 24px 4px rgba(0,0,0,0.75);

}

.card-subcont:hover::before{
    display: none;
}

.card-subcont:hover h4,
.card-subcont:hover .card-description{
    visibility: visible;
}
/* Radiologia */

/* Donto */
.card-subcont2{
    width: 250px;
    height: 350px;
    background-color: black;
    margin: auto;
    border-radius: 20px;
    background-image: url("../img/turnos/dent.jpg");
    cursor: pointer;
    transition: 1s;
}

.card-subcont2 h4{
    color: #B62C38;
    font-weight: bold;
    text-align: center;
    margin-top: 40px;
    visibility: hidden;
}

.card-subcont2 .card-description{
    width: 80%;
    margin: auto;
    visibility: hidden;
}

.card-subcont2 .card-description p{
    color: #B62C38;
    text-align: center;
}

.card-subcont2::before{
    content: 'Img. Odontológica';
    color: #B62C38;
    position: absolute;
    margin-top: 280px;
    margin-left: 49px;
    font-weight: lighter;
    font-size: 20px;
    background-color: white;
    padding: 20px;
    border-radius: 20px 0px 20px 0px;
    cursor: pointer;
}

.card-subcont2:hover{
    background-color: white;
    border: 1px solid #B62C38;
    background-image: none;
    box-shadow: 3px 1px 24px 4px rgba(0,0,0,0.75);

}

.card-subcont2:hover::before{
    display: none;
}

.card-subcont2:hover h4,
.card-subcont2:hover .card-description{
    visibility: visible;
}
/* Donto */

/* Laboratorio */
.card-subcont3{
    width: 250px;
    height: 350px;
    background-color: black;
    margin: auto;
    border-radius: 20px;
    background-image: url("../img/turnos/labo.jpg");
    cursor: pointer;
    transition: 1s;
}

.card-subcont3 h4{
    color: #B62C38;
    font-weight: bold;
    text-align: center;
    margin-top: 40px;
    visibility: hidden;
}

.card-subcont3 .card-description{
    width: 80%;
    margin: auto;
    visibility: hidden;
}

.card-subcont3 .card-description p{
    color: #B62C38;
    text-align: center;
}

.card-subcont3::before{
    content: 'Laboratorio';
    color: #B62C38;
    position: absolute;
    margin-top: 280px;
    margin-left: 115px;
    font-weight: lighter;
    font-size: 20px;
    background-color: white;
    padding: 20px;
    border-radius: 20px 0px 20px 0px;
    cursor: pointer;
}

.card-subcont3:hover{
    background-color: white;
    border: 1px solid #B62C38;
    background-image: none;
    box-shadow: 3px 1px 24px 4px rgba(0,0,0,0.75);

}

.card-subcont3:hover::before{
    display: none;
}

.card-subcont3:hover h4,
.card-subcont3:hover .card-description{
    visibility: visible;
}
/* Laboratorio */

/* Densitometria */
.card-subcont4{
    width: 250px;
    height: 350px;
    background-color: black;
    margin: auto;
    border-radius: 20px;
    background-image: url("../img/turnos/densi.jpg");
    cursor: pointer;
    transition: 1s;
}

.card-subcont4 h4{
    color: #B62C38;
    font-weight: bold;
    text-align: center;
    margin-top: 40px;
    visibility: hidden;
}

.card-subcont4 .card-description{
    width: 80%;
    margin: auto;
    visibility: hidden;
}

.card-subcont4 .card-description p{
    color: #B62C38;
    text-align: center;
}

.card-subcont4::before{
    content: 'Densitometría';
    color: #B62C38;
    position: absolute;
    margin-top: 280px;
    margin-left: 87px;
    font-weight: lighter;
    font-size: 20px;
    background-color: white;
    padding: 20px;
    border-radius: 20px 0px 20px 0px;
    cursor: pointer;
}

.card-subcont4:hover{
    background-color: white;
    border: 1px solid #B62C38;
    background-image: none;
    box-shadow: 3px 1px 24px 4px rgba(0,0,0,0.75);

}

.card-subcont4:hover::before{
    display: none;
}

.card-subcont4:hover h4,
.card-subcont4:hover .card-description{
    visibility: visible;
}
/* Densitometria */

/* Mamografia */
.card-subcont5{
    width: 250px;
    height: 350px;
    background-color: black;
    margin: auto;
    border-radius: 20px;
    background-image: url("../img/turnos/mamo.jpg");
    cursor: pointer;
    transition: 1s;
}

.card-subcont5 h4{
    color: #B62C38;
    font-weight: bold;
    text-align: center;
    margin-top: 40px;
    visibility: hidden;
}

.card-subcont5 .card-description{
    width: 80%;
    margin: auto;
    visibility: hidden;
}

.card-subcont5 .card-description p{
    color: #B62C38;
    text-align: center;
}

.card-subcont5::before{
    content: 'Mamografía';
    color: #B62C38;
    position: absolute;
    margin-top: 280px;
    margin-left: 115px;
    font-weight: lighter;
    font-size: 20px;
    background-color: white;
    padding: 20px;
    border-radius: 20px 0px 20px 0px;
    cursor: pointer;
}

.card-subcont5:hover{
    background-color: white;
    border: 1px solid #B62C38;
    background-image: none;
    box-shadow: 3px 1px 24px 4px rgba(0,0,0,0.75);

}

.card-subcont5:hover::before{
    display: none;
}

.card-subcont5:hover h4,
.card-subcont5:hover .card-description{
    visibility: visible;
}
/* Mamografia */

/* Reso */
.card-subcont6{
    width: 250px;
    height: 350px;
    background-color: black;
    margin: auto;
    border-radius: 20px;
    background-image: url("../img/turnos/reso.jpg");
    cursor: pointer;
    transition: 1s;
}

.card-subcont6 h4{
    color: #B62C38;
    font-weight: bold;
    text-align: center;
    margin-top: 40px;
    visibility: hidden;
}

.card-subcont6 .card-description{
    width: 80%;
    margin: auto;
    visibility: hidden;
}

.card-subcont6 .card-description p{
    color: #B62C38;
    text-align: center;
}

.card-subcont6::before{
    content: 'Resonancia';
    color: #B62C38;
    position: absolute;
    margin-top: 280px;
    margin-left: 111px;
    font-weight: lighter;
    font-size: 20px;
    background-color: white;
    padding: 20px;
    border-radius: 20px 0px 20px 0px;
    cursor: pointer;
}

.card-subcont6:hover{
    background-color: white;
    border: 1px solid #B62C38;
    background-image: none;
    box-shadow: 3px 1px 24px 4px rgba(0,0,0,0.75);

}

.card-subcont6:hover::before{
    display: none;
}

.card-subcont6:hover h4,
.card-subcont6:hover .card-description{
    visibility: visible;
}
/* Reso */

/* Tomo */
.card-subcont7{
    width: 250px;
    height: 350px;
    background-color: black;
    margin: auto;
    border-radius: 20px;
    background-image: url("../img/turnos/tomo.jpg");
    cursor: pointer;
    transition: 1s;
    margin-top: 40px;
}

.card-subcont7 h4{
    color: #B62C38;
    font-weight: bold;
    text-align: center;
    margin-top: 40px;
    visibility: hidden;
}

.card-subcont7 .card-description{
    width: 80%;
    margin: auto;
    visibility: hidden;
}

.card-subcont7 .card-description p{
    color: #B62C38;
    text-align: center;
}

.card-subcont7::before{
    content: 'Tomografía';
    color: #B62C38;
    position: absolute;
    margin-top: 280px;
    margin-left: 111px;
    font-weight: lighter;
    font-size: 20px;
    background-color: white;
    padding: 20px;
    border-radius: 20px 0px 20px 0px;
    cursor: pointer;
}

.card-subcont7:hover{
    background-color: white;
    border: 1px solid #B62C38;
    background-image: none;
    box-shadow: 3px 1px 24px 4px rgba(0,0,0,0.75);

}

.card-subcont7:hover::before{
    display: none;
}

.card-subcont7:hover h4,
.card-subcont7:hover .card-description{
    visibility: visible;
}
/* Tomo */

/* Eco */
.card-subcont8{
    width: 250px;
    height: 350px;
    background-color: black;
    margin: auto;
    border-radius: 20px;
    background-image: url("../img/turnos/eco.jpg");
    cursor: pointer;
    transition: 1s;
    margin-top: 40px;
}

.card-subcont8 h4{
    color: #B62C38;
    font-weight: bold;
    text-align: center;
    margin-top: 40px;
    visibility: hidden;
}

.card-subcont8 .card-description{
    width: 80%;
    margin: auto;
    visibility: hidden;
}

.card-subcont8 .card-description p{
    color: #B62C38;
    text-align: center;
}

.card-subcont8::before{
    content: 'Ecografía';
    color: #B62C38;
    position: absolute;
    margin-top: 280px;
    margin-left: 124px;
    font-weight: lighter;
    font-size: 20px;
    background-color: white;
    padding: 20px;
    border-radius: 20px 0px 20px 0px;
    cursor: pointer;
}

.card-subcont8:hover{
    background-color: white;
    border: 1px solid #B62C38;
    background-image: none;
    box-shadow: 3px 1px 24px 4px rgba(0,0,0,0.75);

}

.card-subcont8:hover::before{
    display: none;
}

.card-subcont8:hover h4,
.card-subcont8:hover .card-description{
    visibility: visible;
}
/* Eco */

/* Consultorios */
.card-subcont9{
    width: 250px;
    height: 350px;
    background-color: black;
    margin: auto;
    border-radius: 20px;
    background-image: url("../img/turnos/consul.jpg");
    cursor: pointer;
    transition: 1s;
    margin-top: 40px;
}

.card-subcont9 h4{
    color: #B62C38;
    font-weight: bold;
    text-align: center;
    margin-top: 40px;
    visibility: hidden;
}

.card-subcont9 .card-description{
    width: 80%;
    margin: auto;
    visibility: hidden;
}

.card-subcont9 .card-description p{
    color: #B62C38;
    text-align: center;
}

.card-subcont9::before{
    content: 'Consultorios';
    color: #B62C38;
    position: absolute;
    margin-top: 280px;
    margin-left: 100px;
    font-weight: lighter;
    font-size: 20px;
    background-color: white;
    padding: 20px;
    border-radius: 20px 0px 20px 0px;
    cursor: pointer;
}

.card-subcont9:hover{
    background-color: white;
    border: 1px solid #B62C38;
    background-image: none;
    box-shadow: 3px 1px 24px 4px rgba(0,0,0,0.75);

}

.card-subcont9:hover::before{
    display: none;
}

.card-subcont9:hover h4,
.card-subcont9:hover .card-description{
    visibility: visible;
}
/* Consultorios */

.divider{
    background-color: white;
    height: 200px;
}

.pedirturnoCont{
    width: 100%;
    height: 1100px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.pedirturnoCont label{
    color: #B62C38;
}

.checkboxTomas{
    margin-top: 70px;
}

.fechaHorarioTitle{
    margin-top: 70px;
}

.formTurnos{
    width: 40%;
    height: 75%;
    box-shadow: 0px 0px 50px 0px rgba(0,0,0,0.75);
    -webkit-box-shadow: 0px 0px 50px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 50px 0px rgba(0,0,0,0.75);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 25px;
}


.step1{
    width: 80%;
    margin: auto;
}

.formTurnos h1{
    text-align: center;
    color: #B62C38;
}

.arrayTomas{
    display: flex;
    align-items: center;
    justify-content: space-around;
    width: 80%;
    margin: auto;
    flex-wrap: wrap;
}

.firstWindow{
    display: flex;
    flex-direction: column;
    width: 40%;
    margin: auto;
    margin-top: 50px;
}

.firstWindow input{
    border: none;
    border-bottom: 1px solid #B62C38;
}

.firstWindow label{
    margin-top: 25px;
}

#date{
    margin-top: 25px;
    color: #B62C38;
}

.buttonsFirstWindow{
    width: 100%;
    display: flex;
    justify-content: space-around;
    margin-top: 50px;
}

.buttonsFirstWindow button{
    width: 49.5%;
}

.botones{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 25px;
}

.formTurnos2{
    width: 50%;
    height: 80%;
    box-shadow: 0px 0px 50px 0px rgba(0,0,0,0.75);
    -webkit-box-shadow: 0px 0px 50px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 50px 0px rgba(0,0,0,0.75);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50px;
    display: flex;
    flex-direction: column;
}

.formTurnos2 label{
    margin-top: 20px;
}

.formTurnos2 input{
    height: 35px;
    border: 1px solid #B62C38;
    padding:1em;

}

.formTurnos2 h1{
    color: #B62C38;
}

.text-rojo-diag{
    color: #B62C38;
}

#writeTurn{
    margin-top: 60px;
}

@media (max-width: 991px){

    .pedirturnoCont{
        height: 2000px;
        justify-content: unset;
        align-items: unset;

    }

    .arrayTomas{
        flex-wrap: wrap;
    }

    .step1 h1{
        margin-top: 100px;
    }

    .formTurnos{
        width: 100%;
        height: 1450px;
        border-radius: unset;
        display: unset;
    }
    
    .formTurnos2{
        width: 100%;
        border-radius: unset;
        height: 40%;
    }

    #firstStep{
        height: 50%;
    }

    .firstWindow{
        width: 70%;
    }
        
}