/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: May 14 2026 | 21:22:30 */
/* ==================================================
   CVALL – HEADER PURA LANA RESPONSIVE FINAL
================================================== */

/* Transición */
.top_bar, .top_bar_wrapper,
#menu_wrapper,
#custom_logo, #custom_logo img,
.main_menu_container,
#mobile_nav_icon {  transition: all .3s ease; }


#mobile_nav_icon {
  border-color: #472a2a !important;
}

/* =========================
   1) DESKTOP +1101px
   Logo centro REAL
========================= */

@media (min-width: 1101px) {

    #mobile_nav_icon {
        display: none !important;
    }

    .top_bar,
    .top_bar_wrapper,
    #menu_wrapper {
        width: 100% !important;
        max-width: 100% !important;

        height: 85px !important;
        min-height: 85px !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    #menu_wrapper {
        display: grid !important;
        grid-template-columns: 1fr 170px 1fr !important;
        align-items: center !important;
    }

    .main_menu_container.visible {
        display: contents !important;
        margin: 0 !important;
    }

    /* LOGO */
    #custom_logo {
        grid-column: 2 !important;

        width: 170px !important;
        height: 85px !important;

        margin: 0 auto !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    #custom_logo img {
        width: 95px !important;
        height: auto !important;
        max-height: 70px !important;
        display: block !important;
    }

    /* MENÚ IZQUIERDO */
    #main_menu_left {
        grid-column: 1 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;

        gap: 40px !important;

        padding-right: 45px !important;
        margin: 0 !important;
    }

    /* MENÚ DERECHO */
    #main_menu_right {
        grid-column: 3 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;

        gap: 40px !important;

        padding-left: 45px !important;
        margin: 0 !important;
    }

    #main_menu_left li,
    #main_menu_right li {
        margin: 0 !important;
        padding: 0 !important;
    }

    #menu_wrapper .nav li a {
        line-height: 85px !important;
        padding: 0 !important;

        white-space: nowrap !important;

        font-size: 15px !important;
        letter-spacing: .8px !important;
    }

    /* Scroll */
    body.scrolled .top_bar,
    body.scrolled .top_bar_wrapper,
    body.scrolled #menu_wrapper {
        height: 65px !important;
        min-height: 65px !important;
    }

    body.scrolled #custom_logo {
        height: 65px !important;
    }

    body.scrolled #custom_logo img {
        width: 82px !important;
        max-height: 52px !important;
    }

    body.scrolled #menu_wrapper .nav li a {
        line-height: 65px !important;
    }
}


/* =========================
   2) TABLET 960px a 1100px
   Menús izquierda / logo derecha
========================= */
@media (min-width: 960px) and (max-width: 1100px) {

    #mobile_nav_icon {
        display: none !important;
    }

	#main_menu_left, #main_menu_right {
		gap: 8px !important;  }

    .top_bar {
        padding: 0 !important;    }

    .top_bar_wrapper,
    #menu_wrapper {
        height: 90px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important; }

	#menu_wrapper div .nav li {
		margin: 0 5px 0 5px !important; }
	
    .main_menu_container.visible {
        margin-top: 0 !important;
        height: 90px !important;
        display: flex !important;
        align-items: center !important; }

    #custom_logo {
        order: 3 !important;
        width: 150px !important;
        height: 90px !important;
        margin-left: 35px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important; }

    #custom_logo img {
        height: 70px !important;
        max-height: 70px !important;
        width: auto !important; }

    #main_menu_left,
    #main_menu_right {
        display: flex !important;
        align-items: center !important;
        margin: 0 !important;
        padding: 0 !important; }
	
	.main_menu_container { margin: 0 !important; }

    #main_menu_left { order: 1 !important; }

    #main_menu_right {
        order: 2 !important;
        margin-left: 0 !important; }

    #menu_wrapper .nav li a {
        font-size: 13px !important;
        line-height: 90px !important;
        padding: 0 !important;
        white-space: nowrap !important; }

    /* Scroll tablet */
    body.scrolled .top_bar,
    body.scrolled .top_bar_wrapper,
    body.scrolled #menu_wrapper,
    body.scrolled .main_menu_container.visible {
        height: 60px !important;
        min-height: 60px !important;
    }

    body.scrolled #custom_logo {
        height: 60px !important;
    }

    body.scrolled #custom_logo img {
        height: 50px !important;
        max-height: 50px !important;
        width: auto !important;
    }

    body.scrolled #menu_wrapper .nav li a {
        line-height: 60px !important;
    }
}


/* =========================
   3) 779px a 959px
   Icono menú izquierda / logo centro
========================= */
@media (min-width: 779px) and (max-width: 959px) {

    .main_menu_container,
    .main_menu_container.visible,
    #main_menu_left,
    #main_menu_right {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
    }

	#mobile_nav_icon {
		margin-top: 0 !important; margin-left: 0 !important; }
	
    #mobile_nav_icon {
        display: block !important;
        position: absolute !important;
        left: 40px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        z-index: 9999 !important;
    }

    .top_bar {
        height: 95px !important;
        min-height: 95px !important;
        padding: 0 !important;
    }

    .top_bar_wrapper,
    #menu_wrapper {
        height: 95px !important;
        position: relative !important;
    }

    #custom_logo {
        position: absolute !important;
        left: 50% !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important;
        margin: 0 !important;
        height: auto !important;
        width: auto !important;
    }

    #custom_logo img {
        height: 70px !important;
        max-height: 70px !important;
        width: auto !important;
    }

    /* Scroll: NO activar menú normal */
    body.scrolled .main_menu_container,
    body.scrolled .main_menu_container.visible,
    body.scrolled #main_menu_left,
    body.scrolled #main_menu_right {
        display: none !important;
    }

    body.scrolled .top_bar {
        height: 70px !important;
        min-height: 70px !important;
    }

    body.scrolled .top_bar_wrapper,
    body.scrolled #menu_wrapper {
        height: 70px !important;
    }

    body.scrolled #custom_logo img {
        height: 50px !important;
        max-height: 50px !important;
        width: auto !important;
    }
}


/* =========================
   4) MÓVIL hasta 778px
   Solo icono menú + logo centro
========================= */
@media (max-width: 778px) {
	
    .main_menu_container,
    .main_menu_container.visible,
    #main_menu_left,
    #main_menu_right {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
    }
	
	#mobile_nav_icon {
		margin-top: 0 !important; margin-left: 0 !important; } 

    #mobile_nav_icon {
        display: block !important;
        position: absolute !important;
        left: 25px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        z-index: 9999 !important; }

    .top_bar {
        height: 85px !important;
        min-height: 85px !important;
        padding: 0 !important;  }

    .top_bar_wrapper,
    #menu_wrapper {
        height: 85px !important;
        position: relative !important; }

    #custom_logo {
        position: absolute !important;
        left: 50% !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important;
        margin: 0 !important;
        height: auto !important;
        width: auto !important; }

    #custom_logo img {
        max-height: 50px !important;
    }

	#custom_logo img {
  		width: 94px !important;
  		height: 50px !important; }
	
	.logo_wrapper img { margin-top: 0 !important;   }
	
    /* Scroll móvil: NO activar menú normal */
    body.scrolled .main_menu_container,
    body.scrolled .main_menu_container.visible,
    body.scrolled #main_menu_left,
    body.scrolled #main_menu_right {
        display: none !important;
    }

    body.scrolled .top_bar {
        height: 65px !important;
        min-height: 65px !important;
    }

    body.scrolled .top_bar_wrapper,
    body.scrolled #menu_wrapper {
        height: 65px !important;
    }

    body.scrolled #custom_logo img {
        height: 45px !important;
        max-height: 45px !important;
        width: auto !important;
    }
}


/* CVALL – Menú móvil Pura Lana */

/* CVALL – Ajuste final menú móvil Pura Lana */
@media (max-width: 959px) {
  
  .top_bar,
  .top_bar_wrapper,
  #menu_wrapper {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .top_bar_wrapper {
    padding: 0 !important;
  }
	
  #mobile_nav_icon {
    display: block !important;
    position: absolute !important;
    left: 30px !important;
    right: auto !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 99999 !important;
    margin: 0 !important;
  }

  body.mobile_menu_open #mobile_nav_icon {
    left: 260px !important;
  }

  body.scrolled #mobile_nav_icon {
    left: 30px !important;
    top: 50% !important;
  }

  body.scrolled.mobile_menu_open #mobile_nav_icon {
    left: 260px !important;
  }
}