html {
  scroll-behavior: smooth;
}
@font-face {
  font-family: 'Heebo-Black';
  src: local('Heebo-Black'),
       local('Heebo-Black'),
       local('Heebo-Black'),
       url(../fonts/Heebo-Black.ttf) format('truetype');}
@font-face {
  font-family: 'Heebo-Bold';
  src: local('Heebo-Bold'),
       local('Heebo-Bold'),
       local('Heebo-Bold'),
       url(../fonts/Heebo-Bold.ttf) format('truetype');}
@font-face {
  font-family: 'Heebo-ExtraBold';
  src: local('Heebo-ExtraBold'),
       local('Heebo-ExtraBold'),
       local('Heebo-ExtraBold'),
       url(../fonts/Heebo-ExtraBold.ttf) format('truetype');}
@font-face {
  font-family: 'Heebo-Light';
  src: local('Heebo-Light'),
       local('Heebo-Light'),
       local('Heebo-Light'),
       url(../fonts/Heebo-Light.ttf) format('truetype');}
@font-face {
  font-family: 'Heebo-Medium';
  src: local('Heebo-Medium'),
       local('Heebo-Medium'),
       local('Heebo-Medium'),
       url(../fonts/Heebo-Medium.ttf) format('truetype');}
@font-face {
  font-family: 'Heebo-VariableFont_wght';
  src: local('Heebo-VariableFont_wght'),
       local('Heebo-VariableFont_wght'),
       local('Heebo-VariableFont_wght'),
       url(../fonts/Heebo-VariableFont_wght.ttf) format('truetype');}
@font-face {
  font-family: 'MyriadPro-Regular';
  src: local('MyriadPro-Regular'),
       local('MyriadPro-Regular'),
       local('MyriadPro-Regular'),
       url(../fonts/MyriadPro-Regular.otf);
}

.site-branding img{
  width: 100%;
  max-width: 250px;
}
.bg-header {
  background: rgba(0,234,255,0.3);
}
.logo-cui {
  display: flex;
  align-items: end;
}
.logo-cui img{
  max-width:320px;
  width:100%;
}
.item-mate a{
  text-decoration: none;
}
.nav-item{
  font-family:'Heebo-Bold';
  font-size: 17px;
  line-height: 1;
  max-width: 115px;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}

.nav-item a{
  padding: 0;
  padding-left:10px;
  padding-right:10px;
  color: #044d5e;
}
.nav-item:not(:last-child){
  border-right: 2px solid #ff394d;
}

.navbar.navbar-expand-md.main-navigation {
  display: flex;
  justify-content: end;
  padding-top: 30px;
  padding-bottom: 40px;
}
.bg-video {
  position: relative;
  padding-top: 70px;
  padding-bottom: 40px;
  background: #f14253;
}
.video-responsive {
  height: 0;
  overflow: hidden;
  padding-bottom: 56.25%;
  position: relative;
  }
.video-responsive iframe, .video-responsive object, .video-responsive embed {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  }
.bg-video .box-video {
  padding: 5% 8%;
  background-image: url(../images/video-shape.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
}
#maltratoinfantil{
  padding-top: 50px;
}
.sect-qph{
  padding-top: 40px;
  padding-bottom: 30px;
}
.sect-txtvio{
  background: #044d5e;
  position:relative;
  padding-top:60px;
  padding-bottom:60px;
  margin-top:80px;
}
.tt-txtviol::before{
  content: url(../images/icon-1.svg);
}
.tt-txtviol{
  color: #ef5f6c;
}
.icon-1{
  max-width: 90%;
  width: 100%;
}
.sect-txtvio::before {
    content: '';
    background-image: url(../images/before-blue.svg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top center;
    height: 80px;
    width: 100%;
    position: absolute;
    top: -80px;
    z-index: 2;
    left: 0;
}
.tt-viol{
  text-align:center;
  color:#044d5e;
  font-family: 'Heebo-Light';
  font-size: 60px;
  text-transform: uppercase;
}
.txt-bold{
  font-family: 'Heebo-Extrabold';
}
.txt-med{
  font-family: 'Heebo-Medium';  
}
.txtblk{
  font-family: 'Heebo-Black'; 
}
.tt-txtviol{
  font-size: 40px;
  margin-right:30%;
  position: relative;
}
.txt-column {
  -moz-column-count: 2;
  -webkit-column-count: 2;
  column-count: 2;
  -moz-column-gap: 40px;
  -webkit-column-gap: 40px;
  column-gap: 40px;
  color:#fff;
  font-family: 'Heebo-Light';
  font-size: 20px;
}
.tt-txtviol:before{
  display:none;
}
.btn-vm{
  text-align: right;
}
.btn-vm a{
  padding:10px 25px;
  border-radius:10px;
  color:#fff !important;
  background:#ef5f6c;
  font-family: 'Heebo-Medium';
  font-size: 20px;
  text-decoration: none;
}
.ttqph{
  background: #044d5e;
  display:flex;
  padding:10px;
  color:#fff;
  width: fit-content;
  font-family: 'Heebo-Light';
  font-size: 45px;
  text-transform: uppercase;
}
.ttxtqph{
  font-size:30px;
  color:#004e60;
  font-family: 'Heebo-Black';
  line-height: 1;
  margin-bottom:40px;
  
}
.txtqph .txtblk{
  color:#ff394d !important;
  text-decoration: none;
}
.txtqph{
  font-family: 'Heebo-Light';
  font-size:22px;
  color:#004e60;
  line-height: normal;
  margin-top:40px;
}
.col-qph{
  margin-top:50px !important;
}
.ddn{
    display:none;
  }
.separatorh {
  margin-top: 20px;
  width: 100%;
  margin-bottom: 20px;
}
.separatorv.mdn {
  height: 340px;
  width: auto;
}
.bg-prog{
  background: #f14253;
  padding-bottom: 100px;
}
.ttprog{
  font-family: 'Heebo-Light';
  text-transform: uppercase;
  font-size: 45px;
  padding: 10px;
  width: fit-content;
  background: #00e8ff;
  color: #044d5e;
  margin:0;
  line-height: 1;
}
.grid-prog{
  margin-top: 50px;
  display: grid !important;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  grid-gap: 20px;
}
.item-prog{
  position: relative;
  padding-top: 100%;
  background: url(../images/item-pro.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.item-prog a{
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 20%;
  text-align: center;
  color: #fff !important;
  height: 100%;
  width: 100%;
  text-decoration: none;
  font-family: 'Heebo-Black';
  font-size: 22px;
  line-height: 1;
  transition: .3s ease;
}
.item-prog:first-child a{
  font-size: 18px;
}
.item-prog a:hover{
  color: #044d5e !important;
  transition: .3s ease;
}
#leydegarantias{
  background: url(../images/bg-ley.svg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  padding-top: 80px;
  padding-bottom: 80px;
}
.leygar{
  max-width: 70%;
}
#materialdeconsulta{
  background: rgba(0,234,255,0.3);
  padding-top: 40px;
  padding-bottom: 70px;
}
.grid-material{
  margin-top: 50px;
  display: grid !important;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  row-gap: 50px;
  column-gap: 30px;
}
.item-mate{
  text-align: center;
}
.icon-mat img{
  width: 100px;
  max-width: 30%;
}
.txt-mat{
  color: #ff394d;
  font-family: 'Heebo-Medium';
  font-size: 18px;
  line-height: 1;
  margin-top: 20px;
}
.img-slider{
  max-width: 80%;
}
.logos-slide{
  text-align: center;
}
#slide-logos .swiper-button-next, #slide-logos .swiper-button-prev {
  color: #044d5e !important;
}
.swiper-button-next::after, .swiper-button-prev::after{
  font-size: 25px !important;
}
.Swiperlogos{
  margin-top: 40px;
}
.footer-main{
  margin-top: 50px;
}
.rrss{
  margin-top: 100px;
  background: #044d5e;
}
.ttequipo{
  font-size: 22px;
  font-family: 'Heebo-Extrabold';
}
.icon-rrss{
  padding-top: 60px;
  padding-bottom: 40px;
  text-align: center;
}
.ers{
  color: #f14253 !important;
  font-size: 35px;
}
.ers:not(:last-child){
  margin-right: 30px;
}
#carousel-mobile{
  display: none;
}
.navbar-toggler-icon {
  background: none !important;
  display: flex !important;
  justify-content: center;
  align-items: center;

}
.navbar-toggler:focus{
  box-shadow: none !important;
}
.navbar-toggler {
  position: absolute !important;
  right: 20px !important;
  bottom: -10px !important;
  z-index: 999 !important;
  background: #00eaff !important;
  border-radius: 100px !important;
  padding: 7px !important;
}
.navbar-toggler.collapsed .navbar-toggler-icon::before {
  content: '\f0c9';
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  transition: .5s ease;
  font-size: 25px;
  color: #044d5e;
}
.navbar-toggler .navbar-toggler-icon::before {
  content: '\f00d';
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  font-size: 25px;
  color: #044d5e;
}
#tiposdemaltrato{
  background: #004e60;
  padding-top: 15px;
  padding-bottom: 60px;
}
.tt-tiposmal{
  font-size: 50px;
  color: #ef5f6c;
}
.tt-tipomalt{
  background: #fff;
  color: #004e60;
  width: fit-content;
  padding: 5px 15px;
  border-radius: 25px;
  font-size: 35px;
}
.txt-tipomal{
  color: #fff;
  font-family: 'Heebo-Light';
  font-size: 22px;
  margin-top: 20px;
}
.ejm-tip{
  color: #00e8ff;
  font-size: 22px;
  font-family: 'Heebo-Bold';
  margin-top: 75px;
}
.txt-ejm-tip{
  color: #00e8ff;
  font-family: 'Heebo-Light';
  font-size: 22px;
}
@media screen and (max-width: 991px) {
  .tt-tiposmal{
    font-size: 40px;
  }
  .grid-prog{
    padding-left: 10%;
    padding-right: 10%;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 20px;
  }
  .txt-mat{
    font-size: 16px;
  }
  .tt-tipomalt{
    font-size: 25px;
  }
  .sect-txtvio, #quepuedeshacer, #programas, #materialdeconsulta, .logos-equipo, .rrss{
    padding-left: 5% !important;
    padding-right: 5% !important;
  }


}
@media screen and (max-width: 767px) {
  .site-branding a {
  justify-content: center;
}
  #tiposdemaltrato{
    padding-left: 5%;
    padding-right: 5%;
  }
  .tt-tipomalt{
    font-size: 25px;
  }
  .txt-tipomal, .ejm-tip, .txt-ejm-tip{
    font-size: 17px;
  }
  .ejm-tip{
    margin-top: 10px;
  }
  .tt-tiposmal{
    font-size: 30px;
  }
  .tt-viol{
    font-size: 40px;
  }
  .sect-txtvio::before {
    background-position: top center;
    background-size: cover;
    height: 30px;
    top: -30px;
  }
  #carousel-desktop{
    display: none;
  }
  .logo-footer{
    text-align: right;
  }
  .site-branding {
    text-align: center;
  }
  .site-branding img{
    max-width: 200px;
    margin-bottom: 30px;
  }
  .logo-cui a {
    justify-content: center;
  }
  .logo-cui{
    justify-content: center;
  }
  .logo-cui img{
    max-width: 80%;
  }
  .grid-material{
    grid-template-columns: 1fr 1fr 1fr;
  }
  #leydegarantias{
    padding-top: 50px;
    padding-bottom: 50px;
  }
  .leygar{
    max-width: 95%;
  }
  .grid-prog{
    padding-left: 5%;
    padding-right: 5%;
    grid-template-columns: 1fr 1fr 1fr;
  }
  .item-prog:first-child a{
    font-size: 14px;
  }
  .item-prog a{
    font-size: 16px;
  }
  .mdn{
    display:none;
  }
  .ddn{
    display:block;
  }
  .tt-txtviol{
    margin-right:0;
    padding-left:28%;
    font-size:35px;
  }
  .tt-txtviol:before{
    display:block;
    content: '';
    background-image: url(../images/icon-1.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 120%;
    width: 25%;
    position: absolute;
    bottom: 0px;
    z-index: 2;
    left: 0;
  }
  .txt-column {
    -moz-column-count: 1;
      -webkit-column-count:1;
      column-count: 1;
  }
    #navbarSupportedContent {
  position: absolute;
  top: 50px;
  z-index: 999;
  width: 250px;
  background: rgb(0, 234, 255);
}
.nav-item{
  max-width:100% ;
  padding: 10px;
  
}
.nav-item:not(:last-child){
  border:none;
  border-bottom: 1px solid #ff394d;
}
  .navbar.navbar-expand-md.main-navigation{
    padding-top: 20px;
    padding-bottom: 20px;
  }
    #carousel-mobile{
    display: block;
  }

}
@media screen and (max-width: 576px) {



  .grid-prog{
    padding-left: 5%;
    padding-right: 5%;
    grid-template-columns: 1fr 1fr;
  }
  .grid-material{
    grid-template-columns: 1fr;
    row-gap: 10px;
    margin-top: 20px;
  }
  .item-mate a{
    display: flex;
    text-align: left;
    align-items: center;
    position: relative;
  }
  .icon-mat {
    width: 10%;
  }
  .icon-mat img {
    width: 100px;
    max-width: 70%;
  }
  .txt-mat{
    margin: 0;
    width: 90%;
  }

  .tt-txtviol{
    font-size:25px;
  }
  .sect-txtvio{
    padding-left:0;
    padding-right:0;
    margin-top: 30px;
    padding-left: 5%;
    padding-right: 5%;
  }
  .ttqph, .ttprog{
    font-size: 25px;
    padding-top: 5px;
    margin-right: auto;
    margin-left: auto;
  }
  .bg-prog{
    padding-bottom: 30px;
  }

  .ttxtqph{
    font-size: 20px;
  }
  .txtqph{
    font-size: 14px;
  }
  .sect-qph{
    padding-left: 5%;
    padding-right: 5%;
  }
  .btn-vm a{
    font-size: 16px;
    padding: 7px 15px;
  }
  .txt-column{
    font-size:14px;
  }
  .tt-txtviol:before{
    height: 135%;
  }
  .ttequipo{
    font-size: 16px;
  }
  #materialdeconsulta, #tiposdemaltrato{
    padding-left: 5%;
    padding-right: 5%;
  }
  .logos-equipo, .rrss{
    padding-left: 5% !important;
    padding-right: 5% !important;
  }

}