/* if the viewport is equal to 1910px or less than that */ 
@media only screen and (max-width: 1910px){
    .header_area .main-menu .navbar{
        padding: 1rem;
    }
}

/* if the viewport is equal to 792px or less than that */ 
@media only screen and (max-width: 792px){
    /* secciones */
    .seccion {
      padding: 6rem 0;
    }
    .seccion-top {
      padding: 6rem 0 0 0;
    }

    /* hearder */
    .header-area .main-menu .navbar,
    .header-area .main-menu .navbar .navbar-brand
    {
        padding: 2%;
        margin: 0%;
    }
    .header-area .main-menu .navbar .navbar-brand {
        width: 50%;
    }
    .header-area .main-menu.navbar-fixed .navbar .navbar-brand img {
        height: 40px;
    }

    .site-main .site-banner {
      min-height: 50vh;
    }
    .site-main .site-banner .site-title h1 {
      font: normal bold 50px/60px var(--fuente-titulo);
      color: var(--text-white);
      text-shadow: var(--title-shadow);
    }

    .site-main .site-banner .site-title h1 > span {
      font: normal bold 36px/52px var(--fuente-titulo);
    }

    .site-main .site-banner .site-title h3 {
      font: normal 500 36px/52px var(--fuente-titulo);
    }

    .site-main .site-banner-seccion .site-title h1, .site-main .site-banner-seccion .site-title h2 {
        font: normal bold 4rem/4rem var(--fuente-titulo);
        letter-spacing: 2px;
        margin-bottom: -0.8rem !important;
        margin-top: 5rem !important;
    }

    .site-main .site-banner-secciones {
      min-height: 30vh;
    }

    .site-main .site-banner-secciones .site-title h1 {
      font: normal bold 50px/40px var(--fuente-titulo);
    }

    .site-main .site-banner-secciones .site-title h1 > span {
      font: normal bold 30px/52px var(--fuente-titulo);
    }

    /* titulos */
    .title-h1{
        font: normal bold 34px/42px var(--fuente-titulo)
    }
    .title-h2{
        font: normal bold 28px/36px var(--fuente-titulo);
    }
    .title-h3{
        font: normal bold 28px/36px var(--fuente-titulo)
    }
    .title-h4{
        font: normal bold 24px/32px var(--fuente-titulo)
    }
}

/* if the viewport is equal to 576px or less than that */ 
@media only screen and (max-width: 576px){
    /* secciones */
    .seccion {
      padding: 5rem 0;
    }

    .seccion-top {
      padding: 5rem 0 0 0;
    }

    /* hearder */
    .header-area .main-menu .navbar,
    .header-area .main-menu .navbar .navbar-brand
    {
        padding: 2%;
        margin: 0%;
    }
    .header-area .main-menu .navbar .navbar-brand {
        width: 50%;
    }
    .header-area .main-menu.navbar-fixed .navbar .navbar-brand img {
        height: 40px;
    }

    /* banner home superior */
    .site-main .site-banner {
      background-size: contain;
      min-height: 50vh;
    }

    .site-main .site-banner .site-title h1 {
      font: normal bold 28px/36px var(--fuente-titulo);
    }

    .site-main .site-banner .site-title h1 > span {
      font: normal bold 28px/36px var(--fuente-titulo);
    }

    .site-main .site-banner .site-title h1 > span.decor-line::after {
      display: none;
    }

    .site-main .site-banner .site-title h2 {
      font: normal 500 20px/28px var(--fuente-titulo);
    }

    .site-main .site-banner .site-title h3 {
      font: normal 500 24px/32px var(--fuente-titulo);
    }

    .site-main .site-banner-secciones {
      min-height: 30vh;
    }

    .site-main .site-banner-secciones .site-title h1 {
      font: normal bold 28px/36px var(--fuente-titulo);
    }

    .site-main .site-banner-secciones .site-title h1 > span {
      font: normal bold 28px/36px var(--fuente-titulo);
    }

    /* titulos */
    .title-h1{
        font: normal bold 30px/38px var(--fuente-titulo)
    }
    .title-h2{
        font: normal bold 24px/32px var(--fuente-titulo);
    }
    .title-h3{
        font: normal bold 24px/32px var(--fuente-titulo)
    }
    .title-h4{
        font: normal bold 22px/32px var(--fuente-titulo)
    }

    /* */
    .img-gradient::before{
        position: relative;
    }
}


/* if the viewport is equal to 340px or less than that */ 
@media only screen and (max-width: 340px){
    /* secciones */
    .seccion {
      padding: 3rem 0;
    }

    .seccion-top {
      padding: 5rem 0 0 0;
    }

    /* hearder */
    .header-area .main-menu .navbar,
    .header-area .main-menu .navbar .navbar-brand
    {
        padding: 2%;
        margin: 0%;
    }
    .header-area .main-menu .navbar .navbar-brand {
        width: 50%;
    }
    .header-area .main-menu.navbar-fixed .navbar .navbar-brand img {
        height: 40px;
    }

    /* banner home superior */
    .site-main .site-banner {
      background-size: contain;
      min-height: 50vh;
    }

    .site-main .site-banner .site-title h1 {
      font: normal bold 28px/36px var(--fuente-titulo);
    }

    .site-main .site-banner .site-title h1 > span {
      font: normal bold 28px/36px var(--fuente-titulo);
    }

    .site-main .site-banner .site-title h1 > span.decor-line::after {
      display: none;
    }

    .site-main .site-banner .site-title h2 {
      font: normal 500 20px/28px var(--fuente-titulo);
    }

    .site-main .site-banner .site-title h3 {
      font: normal 500 24px/32px var(--fuente-titulo);
    }

    /* titulos */
    .title-h1{
        font: normal bold 28px/36px var(--fuente-titulo)
    }
    .title-h2{
        font: normal bold 22px/30px var(--fuente-titulo);
    }
    .title-h3{
        font: normal bold 22px/30px var(--fuente-titulo)
    }
    .title-h4{
        font: normal bold 20px/30px var(--fuente-titulo)
    }

    /* */
    .img-gradient::before{
        position: relative;
    }
}