/*!
 * Start Bootstrap - New Age v5.0.4 (https://startbootstrap.com/template-overviews/new-age)
 * Copyright 2013-2019 Start Bootstrap
 * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap-new-age/blob/master/LICENSE)
 */

html,
body {
  width: 100%;
  height: 100%;
}

body {
  font-family: 'Fira Sans', sans-serif;
  border-top:4px solid #3acfbb;
}

.f-pt{
  font-family: 'PT Serif', serif;
  font-weight: 700;
}
a {
  color: #3acfbb;
  -webkit-transition: all .35s;
  transition: all .35s;
}

a:hover, a:focus {
  color: #c7fee8;
}

hr {
  max-width: 150px;
  margin: 40px auto 20px;
  border-width: 1px;
  border-color: rgba(34, 34, 34, 0.5);
}

hr.light {
  border-color: white;
}

.p-ab {
  position: absolute;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'Fira Sans', sans-serif;
  font-weight: 200;
  letter-spacing: 1px;
}

h5{    line-height: 1.8rem;}

p {
  font-size: 18px;
  line-height: 1.5;
  margin-bottom: 20px;
}


.container,
.container-wix {
  position: relative !important;
  z-index: 30;
}

/*** PADDING - MARGIN ****/
.nopadding{
  padding:0px !important;
}
.nopadding-l{
  padding-left:0px !important;
}


/******  COLORES  ******/

.color--blanco{
  color: #fff;
}
.color--gris--claro{
  color: #F8F8F8;
}
.color--gris--medio{
  color: #A8A8A8 ;
}
.color--verde{
  color: #3acfbb;
}
.color--azul{
  color: #232834;
}
.bck--color-p{
  background-color: white;
}
.bck--oscuro{
  background-color: #0A101A;
}
.bck--claro{
  background-color: #232834;
}
.bck--gris--claro{
  background-color: #F8F8F8;
}
.bck--gris--medio{
  background-color: #A8A8A8 ;
}
.bck--verde{
  background-color: #3acfbb;
}
.bck--verde--oscuro{
  background-color: #26B29A;
}




/*******************/

.text-right{ 
  text-align: right;
}

.text-center{
    text-align: center;
}

span.subrayado{
  background-color: #26B29A;
}

.embed-container {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
}
.embed-container iframe {
  position: absolute;
  top:0;
  left: 0;
  width: 100%;
  height: 100%;
}

.embed-container img {
    width: 100%;
}
.ml-m18{
  margin-left: -25px;
}


@media (max-width:500px) {
  .ml-m18 {
    margin-left: 0px;
  }
}


/******  SECCIONES  ******/
@media (min-width:717px) {
    section {
      padding: 80px 0;
    }
}
section {
  padding: 40px 0;
}
section h2 {
  font-size: 50px;
}
#mainNav {
  border-color: rgba(34, 34, 34, 0.05);
  background-color: white;
  -webkit-transition: all .35s;
  transition: all .35s;
  font-family: 'Fira Sans', sans-serif;
  font-weight: 200;
  letter-spacing: 1px;
}
#mainNav .navbar-brand {
  color: #FFF;
  font-family: 'PT Serif', serif;
  font-weight: 700;
  letter-spacing: 1px;
}
#mainNav .navbar-brand span{
  color: #3acfbb; 
}
#mainNav .navbar-toggler {
  font-size: 12px;
  padding: 8px 10px;
  color: #222222;
}
#mainNav .navbar-nav > li > .nav-link {
  font-size: 11px;
  font-family: 'Fira Sans', sans-serif;
  letter-spacing: 3px;
  text-transform: uppercase;
}
#mainNav .navbar-nav > li > .nav-link {
  color: #fefefe ;
  background-color: transparent;
  margin-right: 10px;
}
#mainNav .navbar-nav > li > a.active:hover {
  background-color: transparent;
}
#mainNav .navbar-nav > li > a,
#mainNav .navbar-nav > li > a:focus {
  color: #222222;
}
#mainNav .navbar-nav > li > a:hover,
#mainNav .navbar-nav > li > a:focus:hover {
  color: #C7FFE8;
}

#mainNav .navbar-brand > div{
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
  margin-left: 75px;}

#mainNav .navbar-brand > div:hover{
 opacity: 0.6;
}

@media (min-width: 992px) {
  #mainNav {
    border-color: transparent;
    background-color: transparent;
    padding: 1% 3%;
  }
   #mainNav .navbar-brand {
    color: fade(white, 70%);
  }
  #mainNav .navbar-brand:hover, #mainNav .navbar-brand:focus {
    color: white;
  }
  #mainNav .navbar-nav > li > a,
  #mainNav .navbar-nav > li > a:focus {
    color: rgba(255, 255, 255, 0.7);
  }
  #mainNav .navbar-nav > li > a:hover,
  #mainNav .navbar-nav > li > a:focus:hover {
    color: white;
  }
  #mainNav.navbar-shrink {
    border-color: rgba(34, 34, 34, 0.1);
    background-color: white;
  }
  #mainNav.navbar-shrink .navbar-brand {
    color: #222222;
  }

  #mainNav.navbar-shrink .navbar-nav > li > a,
  #mainNav.navbar-shrink .navbar-nav > li > a.nav-link,
  #mainNav.navbar-shrink .navbar-nav > li > a:focus {
    color: #222222;
  }

  
  #mainNav.navbar-shrink svg.iso-rn{  
    fill: #000 !important
  }
}




/****/

svg.iso-rn {  
  fill:#FFFFFF;
  float: left;
}


@media (max-width: 992px) {
  #mainNav .navbar-brand {
    color: #000;
  }
  svg.iso-rn {  
    fill:#000;
  }
 }

@media (max-width: 690px) {
  #mainNav .navbar-brand{
    font-size: 0.9rem;
    line-height: 1rem;
  }
  #mainNav .navbar-brand > div{ margin-left: 70px;}
  #mainNav .navbar-brand > div span{ display: block; }
}


/*****/



.overlay{
  background: rgba(0,0,0,0);
background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0,0,0,0)), color-stop(100%, rgba(0,0,0,1)));
background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);
background: -o-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);
background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);
background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=0 );
position: absolute;
width: 100%;
height: 400px;
bottom: 0;
-webkit-transition: all .35s;
transition: all .35s;
display: block;
}

.overlay-vertical{
  background: rgba(0,0,0,0);
  background: -moz-linear-gradient(left, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
  background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0,0,0,1)), color-stop(100%, rgba(0,0,0,0)));
  background: -webkit-linear-gradient(left, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
  background: -o-linear-gradient(left, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
  background: -ms-linear-gradient(left, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
  background: linear-gradient(to right, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=1 );
position: absolute;
width: 100%;
height: /*100vh*/auto;
bottom: 0;
top: 0;
-webkit-transition: all .2s ease;
transition: all .2s ease;
display: block;
opacity: 1;
}





@media (min-width: 992px) {
  .masthead-overlay .overlay{ 
    opacity: 0;
   }
}



  header.masthead {
    position: relative;
    width: 100%;
    padding-top: 150px;
    padding-bottom: 100px;
    background-repeat: no-repeat;
    background-size: cover
  }
  header.masthead.portada {
    color: white;
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  header.masthead.portada .header-content {
    margin-bottom: 100px;
    text-align: center;
  }
  header.masthead.portada .header-content a {
    text-decoration: none;
    }
    header.masthead.portada .header-content a h1{
    -webkit-transition: all .35s;
    transition: all .35s;}

    header.masthead.portada .header-content a h1:hover{
     opacity:0.5}
  

  header.masthead.portada .header-content h1 span {
  display: block;
  }
  header.masthead.portada .header-content h1 span:first-child{
    color: #fff;
    font-weight: 900;
    font-family: 'PT Serif', serif;
  }
  header.masthead.portada .header-content h1 {
    font-size: 6em;
    font-family: 'PT Serif', serif;
    font-weight: 900;
    color:#3acfbb;
  }
@media (min-width: 992px) {
  header.masthead.portada {
    height: 100vh;
    min-height:560px;
    padding-top: 0;
    padding-bottom: 0;
  }
  header.masthead.portada .header-content {
    margin-bottom: 0;
    text-align: left;
  }
}



header.masthead.canal {
  color: white;
  background: url(https://www.rionegro.com.ar/wp-content/uploads/2020/07/imagen-gral-canal-grande-canal-2.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  height: 50vh;
    min-height: 260px;
}



.separador-vertical{
  height: 100px;
  width: 3px;
  background-color: #3acfbb;
  text-align: center;
  margin: 0 auto;
}


/*******************************

********************************/

section.frase{
  padding: 10em 5%;
  background-image: url(https://www.rionegro.com.ar/wp-content/uploads/2019/09/fondo-canal-frase.jpg);
  background-repeat: no-repeat;
  background-size: cover;
}

section.frase h2{
  font-family: 'PT Serif', serif;

}





/********************************
fotgaleria
*********************************/

section.galeria{    
  padding-top: 80px;

}

section.galeria .bajada-foto{
  border-left:1px solid #3acfbb;
  padding: 20px;
}

section.galeria h2{
  color: #fff;
  font-family: 'PT Serif', serif;
  font-weight: 700;
  letter-spacing: 1px;
  border-bottom: 3px solid #3acfbb;
  display: block;
  font-size: 33px;
  margin-bottom: 50px;
}
.item-foto-galeria img{
  width: 100%;
}


/********************************
CAPITULOS
*********************************/


section.capitulos {
  background-color: #232834;
  padding-top: 100px;
}

section.capitulos h2{
  color: #fff;
  font-family: 'PT Serif', serif;
  font-weight: 700;
  letter-spacing: 1px;
  border-bottom: 3px solid #3acfbb;
  display: block;
  font-size: 33px;
margin-bottom: 50px
}

label.tit-dest-menu { color: #fff;
font-family: 'PT Serif', serif;
font-weight: 700;
letter-spacing: 1px;
border-bottom: 3px solid #3acfbb;
display: block;
font-size: 33px;
}
section.capitulos .capitulos-item {
  padding-bottom: 80px;
}

#menu .capitulos-item {
  padding-bottom: 20px;
}

section.capitulos .capitulos-item h3{
  font-size: 22px;
  color: #3acfbb;
  font-family: 'PT Serif', serif;
  font-weight: 700;
  padding-top: 12px;
}

section.capitulos .capitulos-item p{
  color: #bebfbf;
  font-size: 14px;
}

section.capitulos .capitulos-item .foto-capitulo{
 /* border-left: 8px solid #3acfbb;*/
  padding: 0px;
}

section.capitulos .capitulos-item .foto-capitulo img.display-celu,
section.capitulos .capitulos-item .foto-capitulo img.display-pc{
   border-left: 8px solid #3acfbb;
}

section.capitulos .capitulos-item .foto-capitulo .display-celu{
  width: 100%
}
section.capitulos .capitulos-item .numero-capitulo-item{
  background-color: #3acfbb;
  color: #fff;
  font-family: 'PT Serif', serif;
  font-weight: 700;
  font-size: 22px;
  display: inline-block;
  padding: 2px 12px;
  border-radius: 50%;
  position: absolute;
  top: 10px;
  right: 40px;
}
section.capitulos .capitulos-item .numero-capitulo-item.two-dig{
  padding: 2px 8px;
}






/********************************
FOOTER
*********************************/

footer {
  padding: 25px 0;
  color: rgba(255, 255, 255, 0.5);
  background-color: #0A101A;
}

footer p {
  font-size: 10px;
  line-height: 14px;
}

footer ul {
  margin-bottom: 0;
}

footer ul li a {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.3);
}

footer ul li a:hover, footer ul li a:focus, footer ul li a:active, footer ul li a.active {
  text-decoration: none;
}

.bg-primary {
  background: #3acfbb;
  background: -webkit-gradient(linear, left top, left bottom, from(#3acfbb), to(#fdc539));
  background: linear-gradient(#3acfbb, #fdc539);
}

.text-primary {
  color: #3acfbb;
}

.no-gutter > [class*='col-'] {
  padding-right: 0;
  padding-left: 0;
}

.btn-outline {
  color: white;
  border: 1px solid;
  border-color: white;
}

.btn-outline:hover, .btn-outline:focus, .btn-outline:active, .btn-outline.active {
  color: white;
  border-color: #3acfbb;
  background-color: #3acfbb;
}


.btn-compact {
  color:#0A101A;
  background-color: #3acfbb;
}

.btn-compact:hover, .btn-compact:focus, .btn-compact:active, .btn-ocompact.active {
  color: white;
  background-color: #03a58f;
}

.btn-compact-dark {
  background-color:#232834;
  border: 1px solid #fff;
  color: #fff;
}

.btn-compact-dark:hover, .btn-compact-dark:focus, .btn-compact-dark:active, .btn-compact-dark.active {
  color: white;
  background-color: #03a58f;
}

.btn {
  border-radius: 300px;
  font-family: 'Lato', 'Helvetica', 'Arial', 'sans-serif';
  letter-spacing: 4px;
  text-transform: uppercase;
  padding: 0.5rem 1.8rem;
  font-size: 0.8rem;
  margin-top: 10px;
}

.btn-xl {
  font-size: 13px;
  padding: 15px 45px;
}



/****************************
redes

***************************/

.compartir-redes{
  margin: 10px;
}

.compartir-redes .icon {
  display: inline-block;
  width: 38px;
  height: 38px;
  border: 1px solid #d4d4d4;
  border-radius: 100%;
  text-align: center;
  line-height: 38px;
  font-size: 15px;
  color: #000;
  background: #fff;
  -webkit-transition: all .35s;
  transition: all .35s;
  cursor: pointer;
}


.compartir-redes .icon:hover {

  color: #000;
  background: #3acfbb;
}


.compartir-redes .icon i{
  color: #000;
}



/****************************
***************************/



@media (max-width: 520px) {

    header.masthead.portada {
         background: url("../img/canal-anim-celu.gif");
         min-height: 615px;
         background-repeat: no-repeat;
         background-size: cover;
    }
    header.masthead.portada .header-content{
         margin-bottom: 5px;
    }
    header.masthead.portada .header-content h1 {
      font-size: 2.5em;
      /*text-align: left;*/
     /* padding-left: 30px;*/
    }
    footer p {
        margin-top: 15px;
    }
    section.frase{
        padding: 4em 5%;
    }
    section.frase h2 {
        font-size: 30px;
    }
    .overlay{
        opacity: 1;
    }
    
}