
body {
    font-family: 'Cooper Hewitt';
background: rgb(35,12,63);
background: linear-gradient(180deg, rgba(35,12,63,1) 0%, rgba(106,47,142,1) 100%);
    color: white;
}

html {
  scroll-behavior: smooth;
}


.cooper 
{
    font-family: 'Cooper Hewitt';
}

.rumble
{
      font-family: 'Rumble Brave';
}

.nav-link
{
    color:white;
    font-size: 1rem;
    font-weight: 600;
}

.max {max-width: 80%;}

 .navbar {
  background-color: transparent !important;
}
.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover {
    color: yellow;
}


@media (min-width: 768px){
.navbar-expand-md .navbar-nav .nav-link {
    padding-right: 1.5rem;
    padding-left: 1.5rem;
}
    
    .max {max-width: 100%;}
}

.mw60{max-width: 60%;}
.mw90{max-width: 90%;}
.mw80{max-width: 80%;}
.mw70{max-width: 70%;}



/**************************************************************************************************************************************************************************/
/* INTRO */

#inicio
{
   width: 100%; 
   min-height: 85vh;
    background: url('../img/bg_inicio.png?v=2');  
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    margin-top: -50px;
   
}

.intro {
    background: rgb(7,17,62);
 background: rgb(7,17,62);
background: linear-gradient(180deg, rgba(7,17,62,1) 0%, rgba(0,0,0,0.30575980392156865) 30%, rgba(0,0,0,0.3841911764705882) 80%, rgba(35, 12, 63, 0) 100%);
   
    background-position: center top;
    background-size: cover;
    min-height: 85vh;
    width: 100%;
    padding: 80px 0px;
}



.bajada {font-size: 1.9em;
line-height: 3em;}
.bajada2 {font-size: 1.4rem;
}

.fa-circle {color: #C966F4;}
.fa-inverse {
    color: #000206;
}


.desktop {display: block;}
.movil{display: none;}
@media(max-width: 768px)
{
    .desktop {display: none;}
    #inicio
    {
        background: url('../img/bckg_movil.jpg');  
        background-size: contain;
        background-repeat: no-repeat;
      
        
   }

    
.movil{
    display: block;
    }
    
  

    
}




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

#capitulos
{
   width: 100%; 
   min-height: 85vh;
    background: url('../img/bg02.png');  
    background-repeat: no-repeat;
    background-position: top left;
    background-size: 100%;
    margin-top: -150px;
    padding-top: 150px;
    padding-bottom: 80px;
   
}
.caja {
    width: 230px;
    height: 120px;
    margin: auto;
    text-align: center;
    margin: 40px auto;
}
.capi-tulo {
    text-align: center;
    font-size: 3.8em;
    line-height: .8;
    color:#e3baff;
    width: 105px;
    height: 120px;
    float: left;
        
    
}

.numero {
    
    width:120px;
    height: 120px;
    float: right;
    color: yellow;
    font-size: 8em;
    line-height: .58;
    text-align: left;
}

.bajada-video
{
  
    color: white;
    text-align: center;
    font-weight: 300;
    font-size: 1.2em;
    letter-spacing: .5px;
    text-shadow: 1px 1px rgb(189 189 189 / 65%);
}

.h3, h3 {
    font-size: 1.25rem;
}

.texto-videos {
    font-weight: 300;
}
    

/**************************************************************************************************************************************************************************/
/*PERSONAJES*/


#personajes
{
   width: 100%; 
   min-height: 85vh;
    background: url('../img/personajes-bg.png');  
    background-repeat: no-repeat;
    background-position: top left;
    background-size: 100%;
    margin-top: -150px;
    padding-top: 150px;
    padding-bottom: 40px;
   
}

.titulo-personajes {
   color: yellow;
   font-size: 3.3em;
    
}

.texto-personaje {
    font-weight: 200;
    font-size: 1.4rem;
    line-height: 1.5rem;
    
}

.nombre-personaje1 {
   color: yellow;
   font-size: 3em;
   text-align: right;
    line-height: 1;
    
}

.nombre-personaje2 {
      color: yellow;
   font-size: 3em;
    text-align: left;
    line-height: 1;
    
}

.grande {font-size: 4.2rem;}


.comillai {    
    position: absolute;
    left: 20px;
    top: 70px;}

.comillad {
    position: absolute;
    right: 40px;
    top: 70px;
}

@media(max-width: 768px)
{
    .nombre-personaje1 {text-align: center; margin-bottom: 2rem;} 
    
}

/**************************************************************************************************************************************************************************/
/*Noticias*/

#noticias
{
   width: 100%; 
   min-height: 85vh;
   background: rgb(2,0,36);
background: linear-gradient(180deg, rgba(2,0,36,0) 0%, rgba(39,14,67,0.7539390756302521) 45%, rgba(39,14,67,1) 100%);
    margin-top: -150px;
    padding-top: 150px;
   
   
}


.noticias {
     background: url('../img/bg02.png');  
    background-repeat: no-repeat;
    background-position: top left;
    background-size: 100%;
    padding-bottom: 40px;
}


.titulo-noticias {
   color: white;
   font-size: 3.3em;
 margin-bottom: 3rem;
}

.link{
    color: white;
    font-size: 2em;
   padding: 15px 0px 5px 0px;
    text-align: left;
}

.texto-noticia{
    
    color: white;
    font-weight: 300;
    text-decoration: none;
    text-align: left;
    font-size: 1.2rem;
    line-height: 1.3rem;
   
}

.bordered
{
   -webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;
}

figure {
    
    
    padding: 1.5em;
}

a{text-decoration: none;}
a:hover {text-decoration: none;}
