/* RESET Básico */
* {margin: 0; padding: 0;}

/* GENERALES */
body {background-color: #ffffff;}

/* HEADER */
header {margin-left: auto; margin-right: auto; max-width: 900px; display: flex; justify-content:space-between; align-items: center; padding: 10px;}

/* Logo (Home) */
.logo {width: 70px; border-radius: 50%; margin-left: 20px;}
/* Redes */
.redes {display: inline;}
.redes img {margin: 4px; width: 40px; border-radius: 50%;}
/* ID */
.id_pagina {display: inline; color: #017c75; margin-right: 20px;}

/* NAV BAR */
nav {display: flex; justify-content: center; background-color: #000000;}
nav a {text-decoration: none; margin: 10px 17px; font-size: 20px; color: #c0e9fd;}
nav a:hover {color: #d847ef;}

/* Patreon */
.patreon {display: flex; justify-content: center; align-items: center; height: 70px;}
.pat {font-size: 20px; color: #d847ef}

/* CONTENIDO */
main {display: flex; justify-content: center; align-items: center;}
section {border: solid #ffffff 1px; max-width: 900px; margin: 13px; border-radius: 20px; padding: 0; display: flex; flex-wrap: wrap; justify-content: center;}

/* FOOTER */
.estadisticas {display: flex; justify-content: center; background-color: #000000; margin-top: 13px; margin-bottom: 13px;}
.estadisticas a {text-decoration: none; margin: 10px 17px; font-size: 20px; color: #c0e9fd;}
.estadisticas a:hover {color: #d847ef;}
/* Pie De Página */
.pie_de_pagina {text-align: center; margin-bottom: 17px; color: #aaaaaa;}

/* H1 */
.h1-01 {color: #007777; text-align: center; font-size: 30px; margin: 17px 13px 0 13px; width: 100%;}

/* H2 */
.h2-01 {color: grey; text-align: center; font-size: 20px; margin: 0 20px 0 20px; width: 100%;}

/* H3 */
.h3-01 {font-size: 24px; color: #005a55; margin: 53px 13px 4px 13px;}
.h3-02 {font-size: 20px; color: #001716; margin: 53px 13px 4px 13px; text-align: justify;}

/* MARCO BIBLIA */
.marco-biblia {border: solid 1px black; width: 300px; border-radius: 20px; margin: 17px; padding: 13px;}

/* LA BIBLIA */
.la-biblia {width: 100%; margin: 0 17px; padding: 0 13px;}

/* BOTONERA */
.botonera {background-color: #1f283b; border-radius: 17px; margin: 0 0 8px 0; padding: 8px; display: flex; flex-wrap: wrap;}
.botonera a {text-align: center; display: inline-block; color: #ffffff; text-decoration: none; background-color: #334054; padding: 4px 8px; margin: 2px; flex-grow: 1; border: 1px solid #2665ea; border-radius: 7px;}
.botonera a:hover {background-color: #d847ef;}

/* LISTADOS */
.listado-01 {display: flex; flex-wrap: wrap; justify-content: center; width: 100%;}

/* LISTAS */
.l01 {margin: 2px 35px;}
.l-02 {border: solid 1px #2665ea; border-radius: 5px; padding: 2px 8px; margin: 2px;}
.l-03 {text-align: center; border-bottom: 1px solid brown; font-size: 23px;}
.l-04 {text-align: center;}

/* ELEMENTOS */
.ele-01 {border: solid 1px #2665ea; padding: 4px; border-radius: 5px; margin: 4px; text-decoration: none;}
.ele-02 {border: solid 1px #2665ea; padding: 4px; border-radius: 5px; margin: 4px; text-decoration: none; color: black;}
.ele-02:hover {background-color: black; text-decoration: none; color: #d847ef;}

/* ESTUDIOS */
.estudios-01 {margin-top: 17px; width: 100%;}
.est-01 {border: solid 1px #2665ea; border-radius: 5px; width: 100%;     display: flex; flex-wrap: wrap; justify-content: center; text-decoration: none; margin: 8px 0;}
.est-01:hover, .h2-02:hover {background-color: black; text-decoration: none; color: #d847ef;}
.h2-02 {font-size: 24px; color: #007777; margin: 8px 17px 8px 0;}
.h3-03 {font-size: 17px; color: dimgrey; margin: 13px 17px 0 17px;}
.h4-01 {font-size: 13px; color: red; margin: 13px 0 0 0;}

/* EN DESARROLLO */
.animar {font-size: 24px; animation: mover 2s infinite; margin: 40px; }
@keyframes mover {0% { transform: translateX(0); } 50% { transform: translateX(100px); } 100% { transform: translateX(0); } }