:root {
    --fuenteHeading: 'PT Sans', sans-serif;
    --fuenteParrafos: 'Open Sans', sans-serif;

    --blanco: #ffffff;
    --azulVerdoso: #2D9C9C;
    --azulProfundo: #1B3C59;
    --grisClaro: #EBEFF1;
    --grisMedio: #7D8B91;
    --verdeSuave: #9CD9C2;
}
html {
    box-sizing: border-box;
    font-size: 62.5%; /* 1 rem = 10px */    
}
*, *:before, *:after {
    box-sizing: inherit;
}
body {
    font-family: var(--fuenteParrafos);
    font-size: 1.6rem;
    line-height: 2;
    background-color: var(--grisClaro) ;
}

/** Globales **/
a {
    text-decoration: none;
    color:black
}
a:visited  {
    text-decoration: none;
    color:black
}
h1, h2, h3, h4 {
    font-family: var(--fuenteHeading);
    line-height: 1.2;
}
h1 {
    font-size: 4.8rem;
    margin-bottom: 0%;
}
h2 {
    font-size: 4rem;
}
h3 {
    font-size: 3.2rem;
}
h4 {
    font-size: 2.8rem;
}
img {
    border-radius: 10px;
}
p {
    margin-top: -3%;
}

/** Utilidades **/
.no-margin {
    margin: 0;
}
.no-padding {
    padding: 0;
}
.centrar-texto {
    text-align: center;
}

.boton {
    display: block;
    font-family: var(--fuenteHeading);
    color: var(--blanco);
    text-align: center;
    padding: 1rem 3rem;
    font-size: 1.8rem;
    text-transform: uppercase;
    font-weight: 700;
    margin-bottom: 2rem;
    border: none;
    border-radius: 10px;
}

.boton--primario {
    background-color: var(--azulProfundo);
    width: 20rem;
}

.boton--primario:hover {
      background-color:var(--grisMedio);
}

.boton--secundario {
    background-color: var(--verdeSuave);
    width: 20rem;
}

.boton--secundario:hover {
      background-color:var(--grisMedio);
}

/** Contenido **/
.contenedor {
    width: min(80%, 100rem);
    height: min(80%, 100rem);
    margin: 2% auto;
    background-color: var(--blanco);
    border-radius: 10px;
    border: none;
    padding: 1% 3% 0% 3%;
}

/** Barra Superior **/
.barraSuperior {
    display: flex;
    flex-direction:column;
}
@media (min-width: 768px){
    .barraSuperior{
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    text-align: center;
    justify-content: center;
    align-items: center;
    }
}

.descripcion {
    margin-top: 0%;
}

/** Foto y Slogan **/
.slogan {
    display: flex;
    flex-direction:column;
    gap: 2rem;
    align-content: center;
}
@media (min-width: 768px){
    .slogan{
        display: flex;
        flex-direction:row;
        gap: 2rem;
        justify-content: space-between;
    }
}

#img_doctora {
    height: 300px;
    width: 250px;
}
@media (min-width: 768px){
    #img_doctora{
    height: 300px;
    width: auto;
    }
}

.sloganboton {
    display: block;
}

.img_logo {
    margin-top: 2%;
}
@media (min-width: 768px){
    .img_logo{
        margin-top: 2%;
        width: 100%;
        height: 250px;
        object-fit: contain;
    }
}

/** Areas Especializacion**/
.contenedor_tres-columnas {
    display: flex;
    flex-direction:column;
}
.img_icono {
    max-width: 30%;
}
@media (min-width: 768px){
    .contenedor_tres-columnas{
        flex-direction:row;
        align-items: center;
        justify-content: space-between;
    }

    .img_icono {
        max-width: 50%;
    }
}

.areasEspecializacion {
    text-align: center;
}

/** Contacto **/
.formulario{
    background-color: var(--grisClaro);
    border-radius: 10px;
    margin: 0% 10% 5% 10%;
    padding: 2% 2% 1% 2%;

}
.campo{
    display: flex;
    margin-bottom: 2rem;
}
.campo__label {
    flex: 0 0 9rem;
    text-align: right;
    padding-right: 2rem;
}
.campo__field {
    flex: 1;
    border: 1px solid var(--gris);
    border-radius: 10px;
    padding-left: 1%;
}
.campo__field--textarea {
    height: 1rem;
    border-radius: 10px;
    padding-top: 1%;
    padding-left: 1%;
}
.campoBoton {
    display: flex;
    justify-content: center;
    align-items: center;
}

/** LinkedIn**/
.linkedin {
    text-align: center;
    margin-top: -4%;
    margin-bottom: 5%;
    margin-left: 10%;
    margin-right: 10%;
    background-color: var(--grisClaro);
    border-radius: 10px;
}

.campo__field--textarea {
    height: 20rem;
}

.imgLinkedin {
    margin-top: 1%;
    margin-right: 1%;
}

/** Footer **/
.footer{
    color: var(--grisMedio);
    text-align: center;
    font-size: 1rem;
}

.container{
    padding-top: 2%;
    padding-left: 10%;
    margin-top: 5%;
    margin-bottom: -8%;
}

.timeline-item {
	padding: 4rem;
    margin-top: 1%;
	position: relative;
	border-left: 2px solid var(--grisMedio);
    height: 150px;
}
@media (min-width: 768px){
    .timeline-item{
	    padding: 4rem;
        margin-top: 1%;
	    position: relative;
	    border-left: 2px solid var(--grisMedio);
        height: auto;
    }
}

.timeline-item::before {
		content: attr(date-is);
		position: absolute;
		left: 3em;
		top: -1.5em;
		display: block;
}

.timeline-item::after {
		width: 20px;
		height: 20px;
		display: block;
		top: -1em;
		position: absolute;
		left: -11px;
		border-radius: 20px;
		content: '';
		border: solid var(--grisMedio);
		background: white;
}

.timeline-item:last-child {
        border:none;
}