/* MAIN BLOG*/

html {
    color: #30475E;
}

/* TITULO BLOG*/

.container-titulo {
    display: flex;
    justify-content: center;
    align-items: center;
}

.titulo-blog p {
    font-size: 2em;
    padding: 0;
    margin: 0;
    text-align: center;
	font-weight: bold;
}

.fecha-post {
    text-align: center;
    font-weight: 200;
    font-size: 1.2em;
    padding-bottom: 2em;
}

.container-img-post {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 2em;
}

.container-img-post img {
    width: 100%;
    min-height: 30em;
    max-height: 30em;
}

/* DESCRIPCION POST */

.titulo-description-post {
    font-size: 1.5em;
    font-weight: bold;
}

.titulo-description-post p {
    padding: 0.1em;
    margin: 0;
}

.description-post p {
    font-size: 1.1em;
    line-height: 1.3em;
}

.description-post #example {
    font-weight: bold;
}

.description-post li {
    list-style-position: inside; 
    text-indent: -1.5em;
    padding-left: 1.5em;
    padding-bottom: 1em;
}

/* FORMULARIO COMENTARIOS */

.container-formulario {
    padding-bottom: 1.5em;
}

.container-formulario p {
    font-size: 1.4em;
    font-weight: bold;
}

textarea {
    width: 100%;
    overflow-y: hidden;
    padding: 0.4em 0;
    resize: none;
    padding-left: 0.4em;
}

textarea:focus {
    border-color: #30475E;
    border-radius: 0.2em;
    border: 2px solid #30475E;
    outline: none;
}

button {
    border: 2px solid black;
    background-color: #FF7000;
    height: 2.3em;
    width: 4.9em;
    cursor: pointer;
    color: white;
    box-shadow: 2px 2px 0px 0px black;
}

/* MUESTRA COMENTARIOS */

.container-box-comentario {
    padding: 2em 0;
    display: flex;
    justify-content: center;
}

.container-comentario {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    border-radius: 0.7em;
    background-color: #ECECEC;
    width: 50%;
}

.container-user {
    display: flex;
    justify-content: center;
    align-items: center;
}

.container-user img {
    max-width: 3.5em;
}

.user-name {
    padding-left: 1em;
}

.user-name p {
    font-weight: bold;
    font-size: 1.2em;
    margin: 0;
}

.fecha-comentario {
    padding-top: 0.3em;
}

.fecha-comentario p {
    font-weight: 200;
    font-size: 0.9em;
}

.comentario-text {
    padding-left: 0.5em;
}

.responder-container {
    display: flex;
    justify-content: left;
    align-items: center;
    margin-right: auto;
    flex-direction: column;
    padding-bottom: 1em;
    padding-left: 0.5em;
}

.responder {
    display: flex;
    cursor: pointer;
}

.responder:hover {
    color: #FF7000;
}

.responder p {
    margin: 0;
    padding-left: 0.3em;
}

/* ICONOS PASADOR ENTRE COMENTARIOS */

.pasador-izquierdo {
    display: flex;
    align-items: center;
    padding-right: 3em;
}

.fa-angle-left {
    cursor: pointer;
}

.pasador-derecho {
    display: flex;
    align-items: center;
    padding-left: 3em;
}

.fa-angle-right {
    cursor: pointer;
}


/* REAJUSTES A MÓBIL*/

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

    .container-img-post img{
        max-height: 15em;
        min-height: 15em;
    }

    .titulo-principal p {
        text-align: center;
    }

    /* COMENTARIOS */

    .container-comentario {
        width: 100%;
    }

    .pasador-izquierdo {
        padding-right: 0.5em;
    }

    .pasador-derecho {
        padding-left: 0.5em;
    }

}