/* LOGO ANDREA-HOUSE */


#logo_container {
    padding: 20px 70px;
    height:200px;
    display:flex;
    justify-content:center;
    align-items:center;
}

#logo {
    width: 100%;
    min-width: 100px;
    max-height: 200px;
    max-width: 200px;
}

/* ACCORDION MENU */

.accordion-menu li.open .dropdownlink {
 font-weight: bold;
}

.accordion-menu li:last-child .dropdownlink {
 border-bottom: 5px;
}

.menu li .dropdownlink, .menu li .dropdownlink-selected {
 cursor: pointer;
 margin: auto;
 width:170px;
 display: block;
 padding: 14px 8px;
 font-size: 14px;
 color: var(--brown);
 position: relative;
 border-bottom: 2px solid var(--brown);
 text-align: center;

}

.menu li .dropdownlink:hover, .menu li .dropdownlink-selected {
   font-weight: bold;
}

.submenuItemsDisplaySelected {
    font-weight: bold;
    background-color: lightseagreen;
}

.submenuItemsHidden {
  display: none;
  background: white;
}
.submenuItemsDisplay {
  display: block;
  background: white;
  color: var(--brown);
  text-align: center;
  padding: 12px 12px 12px 12px;
  transition: all 0.4s ease-out;
}
.submenuItemsDisplay:hover {
    font-weight: bold;
    color: var(--brown);
}

.icon-menu {
    width: 20px;
    vertical-align: top;
    margin-left: 20px;
}



/* RESPONSIVE MENU */


@media screen and (max-width: 900px) {
    * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }

    .dropdown:hover .dropdown-content {
        display: none;
    }

    .menu_container {
        display: inline-block;
        width: 100%;
        margin-left: unset;
    }

    #logo {
        width: 20%;
        min-width: 60px;
        margin-top:10px;
    }

    .col_container {
        width: 100%;
        padding-left: 5%;
        padding-right: 5%;
    }

    .header-container {
        margin: 25px;
    }

    .header_horizontal_menu {
        top: 0;
        position: absolute;
        right: 0;
    }

    .menu {
        display: none;
        position: fixed;
        background: white;
        z-index: 100;
        width: 70%;
        top: 0;
        padding: 50px 0;
        height: 100vh;
        box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
        overflow: scroll;
        overflow-x: hidden;
    }

    menu li .dropdownlink, .menu li .dropdownlink-selected {
        width:170px;
    }

    .closebtn {
        position: absolute;
        right: 25px;
        font-size: 36px;
        color: #7D5525;
        margin-left: 50px;
        top: 25px;
    }

    /* .closebtn-menu {
        top: 50%;
    }
    .closebtn-nav {
        top: 30px;
    }*/

    .dropbutton {
        padding: 5px;
        margin-top: 20px;
        width: 22px;
    }


    .menu_burguer {
        display: block;
        width: 30px;
        top: 0;
        left: 5%;
        position: absolute;
        margin-top: 25px;
        cursor: pointer;
    }


    .dropdown-content a {
        border: unset;
        cursor: pointer;
        margin: auto;
        width: 170px;
        display: block;
        padding: 14px 8px;
        font-size: 14px;
        color: #7D5525;
        position: relative;
        border-bottom: 2px solid var(--brown);
        text-align: center;

    }

    .dropdown-content {
        display: none;
        right: 0;
        background-color: white;
        z-index: 810;
        text-align: left;
        top: 0;
        height: 100vh;
        cursor: pointer;
        width: 70%;
         padding: 14px 8px;
        position: fixed;
         cursor: pointer;
    }

    .dropdown-content a:hover, .dropdown-content a.selected {
        background-color: white;
        color: #7D5525;
    }
    .dropdown-content a:first-child {
        background-color: unset;
        color: unset;
        text-align: center;
    }

    .dropdown {
        position: unset;
    }

    .closebtn {
        display: block;
    }

    #logo_container {
        display: flex;
        justify-content: center;
        align-items: center;
        height: unset;
        padding: unset;
    }
    .centrar_logo {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .header_principal {
        height: unset;
    }
    .header_container {
        margin: 20px 0;
        height: unset;
    }

    .footer-border {
        display: flex;
        flex-flow: row wrap-reverse;
        margin-top: 25px;
    }

    .footer-section {
        width: 100%;
        text-align: center;
    }

    .footer-rights {
        margin-left: unset;

    }
    .footer-contact {
        margin-bottom:30px;
    }

    .header_horizontal_menu {
        display: block;
        position: absolute;
        top: 0;
        right: 5%;
    }
}

