:root{
    --main_title: 30px;
    --article-title: 40px;
    /*--article-titleMb: 34px;*/
    --article-titleMb: 26px;
    --title: 22px;   
    --second-title: 20px;
    --medium-title: 18px;
    --small-title: 18px;

    --body_text: 18px; 
    --details: 16px;
    --small-details: 14px;
    --section_text: 16px;
     
    --black: #181818;
    --white:#FFFFFF;
    --main:#c32427;
    --secondary1:#f37338; 
    --secondary2: #582A5E;    
    --secondary3: #ffaf1a;
    --secondary4: #c22326; 
    --secondary5: #225C4D; 
    --secondary6: #1F9A50;
    --secondary7: #4eb0c9;
    --secondary8: #1d1d1d;
    --secondary9: #b33f58;
    --grey:#8f8d8d;
    --grey-dark:#666666;
    --light: #F6F6F6;   
     
    --Bold: "D-DINExp-Bold";
    --RegularD: "D-DINExp";
    --Regular:"PTSerif-Regular";
    --Italic: "PTSerif-Italic"; 
    --RegularBold:"PTSerif-Bold";
}

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

*, *:before, *:after {
    box-sizing: inherit;
  }
  
body{
    font-size: 16px; /* 1rem = 10px*/
    font-family: var(--Regular);
    color: var(--black);    
    background-color: #fff;
}
h1, h2, h3, h5{    
    font-family: var(--Bold);
}

h1{
    font-size: var(--main_title);      
}

h1 > span{
    font-size: var(--main_title);
}
h2{
    font-size: var(--second-title);
}


h3{
    font-size: var(--small-title);    
}

h5{
 color: var(--main);
 font-size: var(--section_text);
 
}
.contenedor{
    padding-right: var(--bs-gutter-x,.75rem);
    padding-left: var(--bs-gutter-x,.75rem);
}
@media (min-width: 768px) {
    .contenedor{
        max-width: 170rem;
        margin-right: auto;
        margin-left: auto;
    }
}
a{
    text-decoration: none;
}
p::selection {
    background: var(--main);
      color: var(--white)
  }
img{
    max-width: 100%;
}

/*Utilidades*/

.bg-1{
    background-color: var(--secondary1);
}
.bg-2{
    background-color: var(--secondary2);
}
@media (min-width: 768px) {
    .bg-1{
        padding: 5rem;
    }
    .bg-2{
        padding: 5rem;
    }  
}

.card{
    border: none;
    background-color: transparent;
    margin-bottom: 2rem;
}
@media (min-width: 1080px){
    .card{
        padding: 0 5px;
    }
}
@media (max-width: 768px) {
    .card{
        margin-top: 2rem;
    }
}



.card-body{
    padding: 1rem 0rem 0rem;
}
.card-list{
    border-top: 1px dashed var(--grey);
}

.card-title{
    text-align: start;    
    color: var(--black);
}
.card-title:hover{
    color: var(--main);
}

h3 .card-title{
    font-size: var(--second-title);  
}
.card-text{
    color: var(--black);
    font-size: var(--details);
}
.card-text:last-child{
    margin-bottom: 1rem;
}

.card-details{
    display: flex;
    justify-content: flex-start;
    align-items: center;
   /* margin-bottom: 1rem;*/
    padding-top: 0px;
}
.card-details .autor, 
.date {
    color: var(--grey);
    font-size: var(--small-details);
}
.card-details .autor{
    font-family: var(--Bold);
    color: var(--grey);
    margin-bottom: 0px;
}

.card-details .date {
    color: var(--grey);    
    font-family: var(--Regular);
}
.card-details .date::before {
    content: "|";
    padding: 0 .5rem;
     font-family: var(--Regular);
       font-weight: 200;
  }
.card-text a{
    color: var(--main);
}
/* Buscador */
.search-container{display: flex; justify-content: flex-start; position: fixed; z-index: 98; width:100%; top:-100px;  transition: 0.5s;}
.search-container--open{top:45px;}

.search-container .search-area { 
  padding:35px 0;
  width:100%;
  background-color: #e9e9e9;
  display: flex;
  justify-content: center;
}

.search-container .search-area .btn{
    display: none;
}

.search-container .search-area form{
    margin-right:20px; width:80%;
}

.search-container .search-area .closebtn{
    font-size: 36px; 
    font-weight: 700; 
    color: #333; 
    cursor: pointer;
    position: static; 
    line-height: normal;
}

.search-container .search-area form .form-group{
  align-self: center;
}
@media(max-width: 1079px){
    .search-container .search-area form .form-group #search-box{
        padding: 1rem .75rem;
    }
}

@media(min-width: 768px){
  .search-container{
      top:-185px; 
      position: absolute;
    }
  .search-container--open{
      top:70px;
    }
  .search-container .search-area { 
      padding: 70px 0;
    }
}
@media(min-width: 992px){
    .search-container .search-area form .form-group{
        width:90%;
    }
}
@media(min-width: 1080px){
  .search-area .form-control{ 
      font-size: 1.8rem;
    }
  .search-container--open{
      top:18%;
    }
  .search-container .search-area form .form-group{
      width:90%;
    }
}
/*Navegacion Superior nav-top*/
.nav-top{
    padding: 0.5rem 0;
}
@media (min-width: 768px) {
    .nav-top .container{
        display: flex;
        justify-content: end;
    }
}
.nav-top-options{
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 2rem;
}
.nav-top-options .option{
    color: var(--black);    
    font-size: var(--small-details); 
    padding: 0 1rem;
    font-family: var(--Regular);  
}
.nav-top-options  .active{
    color: var(--main);
}

@media (min-width: 990px) {
    .nav-top-options .option, 
    .active{
        font-family: var(--Regular);               
    }
    
}
.nav-top-options .option:hover{
    color: var(--main);
}

.nav-top input{
    font-size: var(--small-title);
    border-radius: 2.9rem;
    height: 3.7rem;
    padding: 1.9rem;
    font-family: var(--Italic);
}
@media (min-width: 990px) {
    .nav-top input{
        font-size: var(--small-details);
        font-family: var(--Italic);
        width: 25rem;
        border-radius: 2.9rem;
        height: 2.7rem;
        padding: 0.9rem;
    }
}


.btn-outline{
    color: #a1344e;
    border: 1px solid #a1344e;
}
.btn-outline:hover{
    color: var(--white);
    border: 1px solid #a1344e;
    background-color: var(--main);
}


/*header*/
.header-contenedor{
    padding-top: 1.5rem;
    display: grid;
    grid-template-columns: 25% 50% 25%;
    align-items: center;
}
.logo-search{
    display: flex;
    justify-content: space-between;
    gap:1rem;
    align-items: center;
}
.header{
    background: var(--white);
}

.header-logo img{
    width: 15rem;
}

@media (min-width: 1080px) {
    .header-logo img{
        width: 20rem;
        text-align: start;
    } 
}
@media (min-width: 768px) {
    .header-logo {
        text-align: center;
    }
    .header-logo img{
        width: 25rem;
    }
}
.header-social-media{
    display: flex;
    justify-content: start;
    gap: 1rem;
}
.community{
    align-self: center;
}
.iconos img{
    width: 2.5rem;
    height: 2.5rem;
}
.header-logo-network{
    width: 100%;
    align-items: center;
}

/*Menu*/

.menu-main{
    background-color: var(--white);
    box-shadow: 0px 4px 6px 0px rgba(0,0,0,0.24);
    -webkit-box-shadow: 0px 4px 6px 0px rgba(0,0,0,0.24);
    -moz-box-shadow: 0px 4px 6px 0px rgba(0,0,0,0.24);
}
@media (max-width: 1023px) {
    .menu-main .search img{
        width: 3rem;
    }
    .header-logo{
        display: contents;
        gap: 2rem;
    }
}


.navbar-light .navbar-nav .nav-link{
    color: var(--white);
}

.nav-item:hover{
    transition: 0.2s ease-in-out;
    
}
.navbar-light .navbar-nav .nav-link:hover{
    color: var(--black);        
}
.nav-item a{
    font-size: var(--details);
    font-family: var(--Bold);
}
@media(max-width:1080px){
    .nav-item a{
    font-size: 14px;
    font-family: var(--Bold);
}
}
.section-color-one, .section-color-five, .section-color-three, .section-color-seven, .section-color-six, .section-color-three, .section-color-two, .section-color-four, .section-black, .section-color-eight, .section-color-nine{
    color: var(--black);
    display: block;
    padding: .5rem 1rem;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    text-decoration: none;   
}
.section-color-one:hover, .section-color-five:hover, .section-color-three:hover, .section-color-seven:hover, .section-color-six:hover, .section-color-three:hover, .section-color-two:hover, .section-color-four:hover, .section-black:hover, .section-color-eight:hover, .section-color-nine:hover{
    color: var(--black);   
    padding-bottom: 0;
}
.section-color-one:hover{    
    border-bottom: 3px solid var(--secondary1);
}
.section-color-five:hover{    
    border-bottom: 3px solid var(--secondary6);
}
.section-color-two:hover{
    border-bottom: 3px solid var(--secondary3);
}
.section-color-three:hover{
    border-bottom: 3px solid var(--secondary5);
}
.section-color-seven:hover{
    border-bottom: 3px solid var(--secondary4);
}
.section-color-six:hover{
    border-bottom: 3px solid var(--secondary7);
}

.section-color-four:hover{
    border-bottom: 3px solid var(--secondary2);
}
.section-black:hover{
    border-bottom: 3px solid var(--white);
}
.section-color-eight:hover{
    border-bottom: 3px solid var(--secondary8);
}
.section-color-nine:hover{
    border-bottom: 3px solid var(--secondary9);
}
.nav-top-internal{
    border-top: 1px solid var(--grey);
    padding-top: 2rem;
    margin-top: 2rem;
}
.nav-top-internal a{
 color: var(--black);
 font-weight: bold;
}

.nav-top-internal .active{
    color: var(--main);
}

ul{
    list-style: none;
    padding-left: 0;
}

.menu-options {
    position: relative;
    display: inline-block;    
}
.menu-options ul{
    list-style: none;
    padding-left: 0;
}

@media(min-width: 1024px){
    .menu-options:hover .dropup-content {
      display: block;
    }
  
    .menu-main-options{
      display: flex;
      justify-content: space-between;
  }
}
@media (min-width: 990px) {
    .menu-options {        
        z-index: 100;
      }     
}

  /*footer*/
 
  @media (max-width:767px){
    .footer-content{
        text-align: center;
      }
  }

.footer-content:last-child{
    border: none;
}
.footer-logo{
    border-bottom: 1px solid var(--black);
}
.footer-logo img{
    max-width: 200px;
    margin-bottom: 1rem;
}
.footer-logo-network{
    max-width: 100%;
}
.footer-logo-network img{
    max-width: 85%;
    width: 250px;
}
.footer-countries .btn-secondary{
    background-color: var(--main);
    border: 1px solid var(--main);
    font-size: var(--small-title);
    font-family: var(--Bold);
}

.footer-countries .btn-secondary:hover{
    background-color: var(--white);
    border: 1px solid var(--main);
    color: var(--main);
}
.footer-countries{
    display: flex;
    justify-content: start;
    align-content: center;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: 1rem;
    margin-right: 2rem;
}
@media (max-width:768px){
    .footer-countries{
       justify-content: center;
    }
}
.footer-categories h2{
    color: var(--black);
    text-transform: uppercase;
}
.footer-categories h3{
    font-size: var(--medium-title);
}
.rights h4{
    font-size: var(--small-title);
}   

.footer-category h3{
    color: var(--black);
    margin: 2.5rem 0;

}

.footer-social-media{
    display: flex;
    justify-content: center;
    gap: 2rem;
    /*border-bottom: 1px solid var(--black);
    padding-bottom: 3rem;*/
}

@media (min-width:768px){
    .footer-social-media{
        display: flex;
        justify-content: center;
        gap: 0.5rem;
        flex-direction: column;
    }
    .footer-social-media .iconos{
        display: flex;
        justify-content: start;
        gap: 1rem;
        color: var(--black);
        font-family: var(--Bold);
    }   
}


.footer-newsletter{
    font-weight: 900;
}
.footer-newsletter h3{
    text-transform: uppercase;
}

.footer-newsletter .form-control-lg{
    height: 4rem;
    margin: 1rem 0;
}
.footer-newsletter button{
    width: 100%;
}
.footer .terminos a{
    color: black;
}


#header {
    height: 8rem;
    transition: height 0.3s ease;
  }
  
  .small-header {
    height: 5rem;
  }
  
  #img1, #img {
    width: 20rem;
    transition: width 0.3s ease;
  }
  
  .small-img {
    width: 14rem;
  }
  

  .navbar-collapse .top-provincias-mbl {
    display: block !important;
    background: var(--light);
    padding: 20px;
  }
  .top-provincias-mbl li {
    display: inline-block;
  }
  .top-provincias-mbl li a {
    font-size: 12px;
    color: var(--grey-dark);
  }
  .top-provincias-mbl li:after {
    content:"/";
    margin-left:3px;
    margin-right:3px
   }
   .top-provincias-mbl li:last-child:after {
    display:none
   }

   #spip-admin{
    right: 50%;
    transform: translateX(50%);
    z-index: 100000;
   }