:root {
    --color-primary:  #f74b3e;
    --color-secondary: ;
    --black-primary: #212529;
    --enlaces: #58355e;
    --black: #343A40;
    --soft-black: #495057;
    --grey: #707070;
    --font-title: 'Cormorant';
    --body-font: 'Montserrat', sans-serif;
    /* --font-title: 'Alegreya', serif; */
    /* --body-font: 'Lato', sans-serif; */
}

/* font-family: 'Montserrat', sans-serif; */
@font-face {
	font-family: 'Cormorant';
	font-weight: 300;
	font-style: normal;
	src: local('Cormorant-Light'), url('../assets/fonts/Cormorant/Cormorant-Light.ttf') format("TrueType");
  }
  @font-face {
	font-family: 'Cormorant';
	font-weight: normal;
	font-style: normal;
	src: local('Cormorant-Regular'), url('../assets/fonts/Cormorant/Cormorant-Regular.ttf') format("TrueType");
  }
  @font-face {
	font-family: 'Cormorant';
	font-weight: medium;
	font-style: normal;
	src: local('Cormorant-Medium'), url('../assets/fonts/Cormorant/Cormorant-Medium.ttf') format("TrueType");
  }
  @font-face {
	font-family: 'Cormorant';
	font-weight: bold;
	font-style: normal;
	src: local('Cormorant-Bold'), url('../assets/fonts/Cormorant/Cormorant-Bold.ttf') format("TrueType");
  }
  @font-face {
	font-family: 'Cormorant';
	font-weight: bold;
	font-style: italic;
	src: local('Cormorant-BoldItalic'), url('../assets/fonts/Cormorant/Cormorant-BoldItalic.ttf') format("TrueType");
  }
  @font-face {
	font-family: 'Cormorant';
	font-weight: 500;
	font-style: italic;
	src: local('Cormorant-SemiBoldItalic'), url('../assets/fonts/Cormorant/Cormorant-SemiBoldItalic.ttf') format("TrueType");
  }
  @font-face {
	font-family: 'Cormorant';
	font-weight: normal;
	font-style: italic;
	src: local('Cormorant-Italic'), url('../assets/fonts/Cormorant/Cormorant-Italic.ttf') format("TrueType");
  }
  


html {
    scroll-behavior: smooth;
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: 'Montserrat', sans-serif;
    color: #343A40;
}


/*//////////////////////////////////////////////////////////////////
////////////////////////// Generales/////////////////////////////// 
///////////////////////////////////////////////////////////////////*/
.img_bg {
    width: 100%;
    height: 100%;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}

.overlay_portada {
    background-color: rgba(0, 10, 20, 0.3);
    background-blend-mode: soft-light;
}

.bg_imagen {
    width: 100%;
    object-fit: cover;
    object-position: center;
}

.img_full {
    height: 100vh;
}
.text_img {
    position: absolute;
    top: 0;
    left: 60px;
}

.border-horiz {
    border-top: 1px solid var(--color-primary);
    padding-top: 15px;
}

.margin_top {
    margin-top: 30px;
}
.margen_fotos {
    margin-top: 20px !important;
    margin-bottom: 20px;
}
.margen_grid{
    margin-top: 20px;
    margin-bottom: 20px;
}
.margin_nota {
    margin-top: 20px !important;
    margin-bottom: 40px;
}

.icon_tuberia, .tuberia_autor {
    width: 100%;
    height: 100%;
    margin-bottom: 15px;
}


/*//////////////////////////////////////////////////////////////////
////////////////////////// Navbar /////////////////////////////// 
///////////////////////////////////////////////////////////////////*/
.link-ojo a {
    font-size: 1.125rem;
}
.logo-img {
    width: 140px;
    height: auto;
}
.logo-especial{
    width: 80px;
}
.fixed-navbar-light {
    background-color: white;
}


/* ///////////////////////////////////////////
/////////////// Home ///////////////////// */
.portada_header {
    height: 100vh;
}
.img_portada{
    background-position: center top;
}
.border_vertical {
    border-left: 1px solid var(--color-primary);
    padding-left: 10px;
}
.title_portada {
    font-size: 2rem;
    font-weight: bold;
    line-height: 1;
    font-family: var(--font-title);
    color: white;
}
.text_portada {
    margin-top: 10px;
}
.text_portada p, .text_portada em {
    font-size: 1.125rem;
    font-weight: 400;
    font-family: var(--body-font);
    color: white;
}

.content_intro {
   padding-top: 30px;
   padding-bottom: 50px;
   margin-right: 0;
   justify-content: flex-end;
   align-items: center;
}
.enlace_intro{
    text-decoration: none;
}
.title_intro, .title-grid {
    font-size: 1.75rem;
    font-weight: 700;
    font-family: var(--font-title);
    line-height: 1;
    color: var(--black-primary);
}
.text_intro, .text_grid {
    font-size: 1.0625rem;
    width: 93%;
}
.container_historias {
    margin-left: auto;
    margin-right: auto;
}
.border-grid {
    width: 100%;
    border-bottom: 1px solid var(--color-primary);
    padding-top: 30px;
    margin-bottom: 30px;
}
.img_intro {
    height: 320px;
}
.img_grid {
    position: relative;
    cursor: pointer;
}
.img_big {
    height: 100%;
}
.img_ch {
    height: 350px;
}
  .container_img {
      margin-bottom: 10px;
  }
  .container_img a {
      text-decoration: none;
  }
  .overlay {
    height: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: center;
  }
  .text_overlay {
    width: 100%;
    padding: 20px 20px 30px;
    /* background-color: rgba(0, 10, 20, 0.4); */
    background-blend-mode: soft-light;
  }
  .overlay_ch {
    padding: 15px 15px 30px;
  }
  .text_overlay p, .title_nota, .title_especial {
    margin-bottom: 10px;
    color: white;
    font-size: 1.625rem;
    font-weight: 600;
    font-family: var(--font-title);
    text-align: left;
    line-height: 1.1;
  }
  .title_especial {
      color: var(--black-primary);
  }
  .text_overlay p+p{
    font-size: 1rem;
    font-weight: 300;
  }
  .text-cell {
      display: none;
  }
  
 .content_notas .img_med {
    height: 350px;
 }
 .content_notas .img_big {
    height: 330px;
 }
  .link_notas {
      text-decoration: none;
  }
  .title_nota {
    margin-top: 10px;
    margin-bottom: 10px;
    text-align: initial;
    font-size: 1.125rem;
    color: var(--black-primary);
  }
  .localidad_nota, .autor_nota{
    margin-bottom: 5px;
    font-size: 0.75rem;
    font-weight: 400;
  }
  .card_notas {
      border-radius: 0 !important;
      border: 0 !important;
  }
  .card_notas .card-body {
      padding-left: 0 !important;
  }
  .card_notas a {
      text-decoration: none;
  }
  .container-mas {
      display: flex;
      justify-content: space-between;
      align-items: baseline;
  }
  .border_mas {
      width: 43%;
  }
  .ver_mas a {
    font-size: 1.125rem;
    font-weight: 400;
    text-decoration: none;
    color: var(--black);
  }
  .ver_mas a:hover {
    color: var(--color-primary);
    font-weight: 500;
  }
 .podcast_enlace {
     text-decoration: none;
     display: flex;
     align-items: baseline;
     margin-top: 30px;
     margin-bottom: 20px;
     font-weight: 300;
     color: var(--black-primary);
 }
 .podcast_enlace img {
     width: 30px;
     margin-right: 10px;
 }
 .podcast_enlace:hover {
     color: var(--color-primary);
 }



/* ///////////////////////////////////////////
/////////////// Especial ///////////////////// */
.top_especial {
    padding-top: 20px;
}
.title_cell {
    display: none;
}
.content_autor ul {
    list-style: none;
    padding-left: 0;
}
.content_autor ul li {
    display: flex;
    align-items: flex-start;
}
.content_autor img {
    width: 20px;
    margin-right: 20px;
}
.autor_especial, .autor_redes, .autor_localidad, .autor_foto  {
    font-size: 0.9375rem;
    font-weight: 500;
    color: var(--black);
}
.autor_redes, .autor_localidad, .autor_foto {
    font-weight: 400;
}

/* .autor_especial p {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 5px;
}
.autor_especial p+p {
    font-weight: 400;
    color: var(--black-primary);
} */
.linea_autor {
    width: 100%;
    padding-top: 0;
    border-top: none;
}
.content_video {
    width: 185px;
}
.audio-especial, .video_especial {
    padding-left: auto !important;
    margin-top: 15px !important;
    margin-bottom: 10px;
}
.audio-especial audio {
    width: 100%;
}
.card_link p {
    font-size: 0.9375rem;
}
.card_link p a{
    margin-left: 5px;
}
.card_link a {
    color: #dc2a1d;
}
.card_link a:hover{
    color: var(--color-primary);
}
.text_centro {
    padding: 0 35px;
}
.text_especial p {
    font-size: 1rem;
}
.text_especial a {
    color: #81418c;
}
.text_especial a:hover{
    color: var(--enlaces);
}
.list_especial li {
    margin-bottom: 10px;
}
.list_especial a {
    text-decoration: none;
    color: var(--black);
}
/* .list_especial a:hover {
    color: var(--color-primary);
} */
.title_creditos {
    font-weight: 500;
    color: var(--black-primary);
}
.margin_text{
    margin-right: auto;
}

.container_cita {
    position: relative;
}
.contenido_cita {
    width: 198px;
}
.float_left {
    float: left;
}
.float_right {
    float: right;
}
.float_nota {
    position: relative !important;
}
.cita_start {
    margin-top: 10px;
    margin-right: 30px;
}
.cita_end {
    margin-top: 10px;
    margin-left: 30px;
}
.text_cita p, .cita_start p, .cita_end p, .cita_nota p {
    font-size: 1.375rem;
    text-align: center;
    line-height: 1.3;
    font-weight: 500;
    font-style: italic;
    font-family: 'Cormorant';
    color: var(--black);
}
/* .cita_start p, .cita_end p{
    font-size: 1.25rem;
} */

.text_cita p+p, .cita_start p+p, .cita_end p+p, .cita_nota p+p {
    font-size: 1rem;
    font-weight: 300;
    color: var(--soft-black);
}
.text_cita p+p {
    font-size: 1.25rem;
}

.img_especial {
    width: 100%;
}
.pie_foto, .pie_audio {
    margin-top: 5px;
    color: #818384;
    font-size: 0.625rem;
    font-weight: 300;
}
.subtitle_especial {
    margin-bottom: 25px;
    font-size: 2rem;
    font-weight: 700;
    color: var(--black-primary);
    font-family: var(--font-title);
}

.grid_especial {
    margin-bottom: 10px;
}
.grid_especial img {
    width: 100%;
    height: 100%;
    object-position: top center;
    object-fit: cover;
}
.grid_especial .img-1 {
    height: 100%;
}
.grid_especial .img-2 {
    height: 360px;
}
.grid_especial .img-3, .grid_especial .img-4 {
    height: 272px;
}

.grid_notas {
    margin-top: 40px;
    margin-bottom: 60px;
}


/* ///////////////////////////////////////////
/////////////// Footer ///////////////////// */

footer {
    padding-top: 30px;
    padding-bottom: 30px;
    background-color: #212121;
}
.title_footer {
    color: white;
}
.enlaces_footer a{
    color: white;
    text-decoration: none;
}
.enlaces_footer a:hover{
    color: rgb(228, 227, 227);
}


  /* Animaciones  */
  .fadeTop {
    opacity: 0; 
    transform: translate(0, 10vh);
    transition: all 1s;
  }
  
  .fadeRight {
    opacity: 0;
    transform: translate(10vh, 0vh);
    transition: all 1s;
  }
  
  .fadeLeft {
    opacity: 0;
    transform: translate(-10vh, 0vh);
    transition: all 1s;
  }
    
  .visible {
    opacity: 1;
    transform: translate(0, 0);
  }



  @media screen and (max-width: 480px) and (min-width: 320px) {
    .fixed-navbar-light {
        box-shadow: 0 0 10px 0 rgb(0 0 0 / 10%);
    }
    .portada_header {
        height: 400px;
    }
    .img_portada {
        margin-top: 50px;
    }
    /* .link-ojo {
        display: none;
    } */
    .title_cell {
        margin-bottom: 20px;
        display: block;
    }
    .title_cell h1{
        color: var(--black-primary);
    }
    .title_cell p{
        color: var(--black);
    }
    .content_text_portada {
        display: none;
    }
    .text_portada p {
        display: none;
    }
    .text_overlay {
        display: none
    }
    .content_notas .img_med {
        height: 100%;
     }
    .img_big {
        height: 360px;
    }
    .text-cell {
        display: block;
        margin-top: 15px;
        margin-bottom: 10px;
        padding-left: 10px;
        padding-right: 10px;
    }
    .margen_cell {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    .pie_foto {
        padding-left: 5px;
        padding-right: 5px;
    }
    .border_cell {
        border-bottom: 1px solid #c7c7c7;
        padding-bottom: 15px;
        padding-top: 10px;
    }
    .tuberia_autor {
        display: none;
    }
    .card_notas img {
        display: none;
    }
    .border_mas {
        width: 35%;
    }
  }

  @media screen and (min-width: 768px) {
    /* .border_table {
        border-top: 1px solid #c7c7c7;
        padding-top: 20px;
    } */

  }
