﻿#menu-container {
    display:none;

}
 
@media only screen and (max-width:758.98px) {


            .wrapper {
                position: relative;
            }
        #menu-container {
    display:block;

}
            ul {
                list-style: none;
            }


            #menu-wrapper {
                overflow: hidden;
                max-width: 100px;
                cursor: pointer;
            }


                #menu-wrapper #hamburger-menu {
                    position: relative;
                    width: 25px;
                    height: 20px;
                    margin: 20px;
                    margin-left: 40px;
                }

                    #menu-wrapper #hamburger-menu span {
                        opacity: 1;
                        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
                        left: 0;
                        display: block;
                        width: 100%;
                        height: 2px;
                        border-radius: 10px;
                        color: #fff;
                        background-color: #585345; /*top menu color*/
                        position: absolute;
                        -webkit-transform: rotate(0deg);
                        transform: rotate(0deg);
                        -webkit-transition: .4s ease-in-out;
                        transition: .4s ease-in-out;
                    }

                        #menu-wrapper #hamburger-menu span:nth-child(1) {
                            top: 0;
                        }

                        #menu-wrapper #hamburger-menu span:nth-child(2) {
                            top: 9px;
                        }

                        #menu-wrapper #hamburger-menu span:nth-child(3) {
                            top: 18px;
                        }

                    #menu-wrapper #hamburger-menu.open span:nth-child(1) {
                        top: 9px;
                        -webkit-transform: rotate(135deg);
                        transform: rotate(135deg);
                    }

                    #menu-wrapper #hamburger-menu.open span:nth-child(2) {
                        opacity: 0;
                        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
                        left: -60px;
                    }

                    #menu-wrapper #hamburger-menu.open span:nth-child(3) {
                        top: 9px;
                        -webkit-transform: rotate(-135deg);
                        transform: rotate(-135deg);
                    }

            #menu-container .menu-list .menu-submenu {
                padding-top: 20px;
                padding-bottom: 20px;
            }

            #menu-container .menu-list {
                padding-left: 0;
                display: block;
                position: absolute;
                width: 100%;
                max-width: 450px;
                background: #585345; /*top menu color*/
                box-shadow: rgba(100,100,100,0.2) 6px 2px 10px;
                z-index: 999;
                overflow-y: auto;
                overflow-x: hidden;
                left: -100%;
            }

                #menu-container .menu-list li.accordion-toggle, #menu-container .menu-list .menu-login, .accordion-non-toggle {
                    font-size: 16px;
                    padding: 15px;
                    text-transform: uppercase;
                    border-top: 1px solid #dbdcd2;
                }

                #menu-container .menu-list li:first-of-type {
                    border-top: 0;
                }

            .menu-list a:link {
                text-decoration: none;
            }

            .menu-list a:visited {
                text-decoration: none;
            }

            .menu-list a {
                text-decoration: none;
                color: white;
            }

                .menu-list a:hover {
                    color: yellow;
                }

            .accordion-toggle, .accordion-content, .accordion-non-toggle {
                cursor: pointer;
                font-size: 16px;
                position: relative;
                letter-spacing: 1px;
            }

            .accordion-content {
                display: none;
            }

            .accordion-toggle a:before, .accordion-toggle a:after {
                content: '';
                display: block;
                position: absolute;
                top: 50%;
                right: 30px;
                width: 15px;
                height: 2px;
                margin-top: -1px;
                background-color: #fff;
                -webkit-transform-origin: 50% 50%;
                -ms-transform-origin: 50% 50%;
                transform-origin: 50% 50%;
                -webkit-transition: all 0.3s;
                transition: all 0.3s ease-out;
            }

            .accordion-toggle a:before {
                -webkit-transform: rotate(-90deg);
                -ms-transform: rotate(-90deg);
                transform: rotate(-90deg);
                opacity: 1;
                z-index: 2;
            }

            .accordion-toggle.active-tab {
                background: #c1b59c;
                transition: all 0.3s ease;
            }

            .accordion-toggle a.active:before {
                -webkit-transform: rotate(0deg);
                -ms-transform: rotate(0deg);
                transform: rotate(0deg);
                background: #fff !important;
            }

            .accordion-toggle a.active:after {
                -webkit-transform: rotate(180deg);
                -ms-transform: rotate(180deg);
                transform: rotate(180deg);
                background: #fff !important;
                opacity: 0;
            }
        }