.webp .header {
  background-image: url(../img/banner.webp); }

.no-webp .header {
  background-image: url(../img/banner.jpg); }

.header {
  height: 60rem;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center; }
  .header .texto {
    text-align: center;
    color: #fff;
    margin-top: 5rem; }
    @media (min-width: 768px) {
      .header .texto {
        margin-top: 15rem; } }

.barra {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4rem; }
  @media (max-width: 768px) {
    .barra {
      display: block; } }
  .barra .logo {
    color: #fff;
    font-weight: 400; }
    .barra .logo span {
      font-weight: 900; }
  @media (min-width: 768px) {
    .barra .navegacion {
      display: flex;
      gap: 2rem; } }
  .barra .navegacion a {
    color: #fff;
    display: block;
    font-size: 1.8rem; }

@media (min-width: 768px) {
  .contenidoPrincipal {
    display: grid;
    grid-template-columns: 2fr 1fr;
    column-gap: 4rem; } }

.contenidoPrincipal .blog .entrada {
  border-bottom: 1px solid #e1e1e1;
  margin-bottom: 2rem; }
  .contenidoPrincipal .blog .entrada:last-of-type {
    border: none;
    margin: 0; }

.sidebar .cursos {
  list-style: none; }
  .sidebar .cursos .curso {
    border-bottom: 1px solid #e1e1e1;
    margin-bottom: 2rem; }
    .sidebar .cursos .curso:last-of-type {
      border: none;
      margin: 0; }
    .sidebar .cursos .curso .cursoLabel {
      font-family: "Open Sans", sans-serif;
      font-weight: 700; }
    .sidebar .cursos .curso .cursoInfo {
      font-weight: normal; }

.footer {
  background-color: #000;
  padding: 3rem 0;
  margin-top: 4rem; }

.nosotros {
  display: grid; }
  @media (min-width: 768px) {
    .nosotros {
      grid-template-columns: repeat(2, 1fr);
      column-gap: 2rem; } }

.cursoContenido {
  padding: 3rem 0;
  border-bottom: 1px solid #e1e1e1; }
  @media (min-width: 768px) {
    .cursoContenido {
      display: grid;
      grid-template-columns: 1fr 2fr;
      column-gap: 2rem; } }
  .cursoContenido:last-of-type {
    border: none; }

.contactoBG {
  background-image: url(../img/contacto.jpg);
  height: 40rem;
  background-size: cover;
  background-repeat: no-repeat; }

.formulario {
  background-color: #fff;
  margin: -5rem auto 0 auto;
  width: 90%;
  padding: 5rem; }
  .formulario .campo {
    display: flex;
    margin-bottom: 2rem;
    gap: 2rem; }
    .formulario .campo label {
      flex: 0 0 9rem;
      text-align: right; }
    .formulario .campo input,
    .formulario .campo textarea {
      flex: 1;
      border: 1px solid #e1e1e1; }
    .formulario .campo textarea {
      height: 20rem; }

html {
  box-sizing: border-box;
  font-size: 62.5%; }

*,
*:before,
*:after {
  box-sizing: inherit; }

body {
  font-family: "PT Sans", sans-serif;
  font-size: 1.6rem;
  line-height: 2; }

a {
  text-decoration: none; }

h1,
h2,
h3,
h4 {
  font-family: "Open Sans", sans-serif;
  line-height: 1.2; }

h1 {
  font-size: 4.8rem; }

h2 {
  font-size: 4rem; }

h3 {
  font-size: 3.2rem; }

h4 {
  font-size: 3.8rem; }

img {
  max-width: 100%; }

.contenedor {
  width: Min(90%, 120rem);
  margin: auto; }

.noPadding {
  padding: 0; }

.noMargin {
  margin: 0; }

.centrarTexto {
  text-align: center; }

.boton {
  display: block;
  font-family: "Open Sans", sans-serif;
  color: #fff;
  text-align: center;
  padding: 1rem 3rem;
  font-size: 1.8rem;
  text-transform: uppercase;
  font-weight: 700;
  margin-bottom: 2rem;
  border: none; }
  .boton:hover {
    cursor: pointer; }
  @media (min-width: 768px) {
    .boton {
      display: inline-block; } }

.btnPrimario {
  background-color: #000; }

.btnSecundario {
  background-color: #784D3C; }
