@media(max-width:767px) {
    div.ruby-wrapper .hidden-xs {
        visibility: hidden;
        display: none;
    }

    div.ruby-wrapper {
        position: absolute;
        width: 100%;
        top: 0;
        background: #111;
    }

    .ruby-wrapper .visible-xs {
        visibility: visible;
        position: absolute;
        right: 0;
        top: 0;
    }

    div.ruby-wrapper > ul {
        position: absolute;
        top: 50px;
        width: 100%;
    }

    ul.ruby-menu > li, ul.ruby-menu > li.ruby-menu-left {
        float: none;
    }

        ul.ruby-menu > li > a {
            padding: 0 65px;
            background: #19ad86;
        }

            ul.ruby-menu > li > a:only-child {
                padding: 0 65px;
            }

            ul.ruby-menu > li > a:hover, ul.ruby-menu > li:hover > a, ul.ruby-menu > li.ruby-active-menu-item > a:hover {
                background: #127e61;
            }

        ul.ruby-menu > li.ruby-active-menu-item > a {
            background: #159572;
        }

        ul.ruby-menu > li.ruby-menu-social > a > span {
            display: block;
        }

        ul.ruby-menu > li > ul, ul.ruby-menu > li > ul > li > ul, ul.ruby-menu > li > ul > li > ul > li > ul {
            position: relative;
            width: 100%;
            -webkit-box-shadow: none;
            -moz-box-shadow: none;
            box-shadow: none;
            border-top: none;
        }

            ul.ruby-menu > li, ul.ruby-menu > li > ul > li, ul.ruby-menu > li > ul > li > ul > li, ul.ruby-menu > li > ul > li > ul > li > ul > li {
                position: relative;
            }

                ul.ruby-menu > li > ul > li > a, ul.ruby-menu > li > ul > li > ul > li > a, ul.ruby-menu > li > ul > li > ul > li > ul > li > a {
                    width: 100%;
                    line-height: 50px;
                    padding: 0 80px;
                    background: #d1d1d1;
                }

                    ul.ruby-menu > li > ul > li:hover > a, ul.ruby-menu > li > ul > li > a:hover, ul.ruby-menu > li > ul > li > ul > li:hover > a, ul.ruby-menu > li > ul > li > ul > li > a:hover, ul.ruby-menu > li > ul > li > ul > li > ul > li:hover > a, ul.ruby-menu > li > ul > li > ul > li > ul > li > a:hover {
                        background: #d9d9d9;
                        color: #111;
                    }

                ul.ruby-menu > li > ul > li > ul, ul.ruby-menu > li > ul > li > ul > li > ul {
                    right: auto;
                    top: auto;
                    z-index: auto;
                }

                    ul.ruby-menu > li > ul > li.ruby-open-to-right > ul, ul.ruby-menu > li > ul > li > ul > li.ruby-open-to-right > ul {
                        right: auto;
                        left: auto;
                    }

                    ul.ruby-menu > li > ul > li > ul > li > a {
                        background: #e5e5e5;
                        padding: 0 95px;
                    }

                        ul.ruby-menu > li > ul > li > ul > li:hover > a, ul.ruby-menu > li > ul > li > ul > li > a:hover {
                            background: #e1e1e1;
                        }

                    ul.ruby-menu > li > ul > li > ul > li > ul > li > a {
                        background: #efefef;
                        padding: 0 110px;
                    }

                        ul.ruby-menu > li > ul > li > ul > li > ul > li:hover > a, ul.ruby-menu > li > ul > li > ul > li > ul > li > a:hover {
                            background: #fff;
                        }

                ul.ruby-menu > li.ruby-menu-social > a {
                    border: none;
                }

                ul.ruby-menu > li.ruby-menu-mega, ul.ruby-menu > li.ruby-menu-mega-blog, ul.ruby-menu > li.ruby-menu-mega-shop {
                    position: relative;
                }

                    ul.ruby-menu > li.ruby-menu-mega > div, ul.ruby-menu > li.ruby-menu-mega-blog > div, ul.ruby-menu > li.ruby-menu-mega-shop > div {
                        position: relative;
                        top: auto;
                        right: auto;
                        border-top: none;
                        -webkit-box-shadow: none;
                        -moz-box-shadow: none;
                        box-shadow: none;
                    }

                        ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav {
                            width: 100%;
                            height: auto;
                            right: auto;
                            top: auto;
                        }

                            ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li {
                                position: relative;
                            }

                                ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > a {
                                    line-height: 50px;
                                    padding: 0 75px;
                                    background: #d1d1d1;
                                    color: #222;
                                }

                                ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li.ruby-active-menu-item > a {
                                    background: #bcbcbc;
                                }

                                ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > div {
                                    position: relative;
                                    width: 100%;
                                    min-height: auto;
                                    right: auto;
                                    top: auto;
                                    z-index: auto;
                                }

                                ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li:hover > a {
                                    background: #d9d9d9;
                                }

                    ul.ruby-menu > li.ruby-menu-mega-shop > div {
                        position: relative;
                        text-align: right;
                    }

                        ul.ruby-menu > li.ruby-menu-mega-shop > div > ul {
                            position: relative;
                            border: none;
                            font-size: 14px;
                            margin-bottom: -1px;
                        }

                            ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li {
                                position: relative;
                                display: block;
                                margin-top: -1px;
                            }

                                ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a {
                                    padding: 0 80px;
                                    line-height: 50px;
                                    max-height: 50px;
                                    text-transform: none;
                                    font-weight: 400;
                                    background: #d1d1d1;
                                    color: #222;
                                    border: none;
                                }

                                ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li.ruby-active-menu-item > a {
                                    background: #bcbcbc;
                                }

                                ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li:hover > a, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a:hover, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li.ruby-active-menu-item > a {
                                    background: #d9d9d9;
                                }

                                ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a {
                                    display: block;
                                }

                                ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > div {
                                    position: relative;
                                    top: 0;
                                    z-index: 9999;
                                    margin: 0;
                                }

                ul.ruby-menu > li.ruby-menu-social img {
                    display: inline-table;
                    position: absolute;
                    top: 15px;
                }

                ul.ruby-menu > li.ruby-menu-social > a {
                    width: 100%;
                }

                ul.ruby-menu > li.ruby-menu-social .fa {
                    position: absolute;
                    top: 17px;
                }

                ul.ruby-menu > li.ruby-menu-social span {
                    line-height: 50px;
                    padding: 0 25px;
                }

    span.ruby-dropdown-toggle {
        position: absolute;
        width: 50px;
        height: 50px;
        max-width: 50px;
        max-height: 50px;
        right: 0;
        top: 0;
        padding: 10px 17px;
        z-index: 1000000;
        cursor: pointer;
    }

        span.ruby-dropdown-toggle:after {
            font-family: "FontAwesome";
            text-decoration: none;
            content: '\f107';
            color: #fff;
            font-size: 25px;
            left: 0;
        }

        span.ruby-dropdown-toggle.ruby-dropdown-toggle-rotate {
            -webkit-transform: rotate(180deg);
            -moz-transform: rotate(180deg);
            -o-transform: rotate(180deg);
            -ms-transform: rotate(180deg);
            transform: rotate(180deg);
        }

    ul.ruby-menu > li > a:before, ul.ruby-menu > li > ul > li > a:before, ul.ruby-menu > li > ul > li > ul > li > a:before, ul.ruby-menu > li > ul > li > ul > li > ul > li > a:before, ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > a:before, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a:before {
        content: "";
        width: 50px;
        height: 50px;
        background: #333;
        position: absolute;
        right: 0;
        top: 0;
    }

    ul.ruby-menu > li > ul > li > a:before, ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > a:before, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a:before {
        background: #555;
    }

    ul.ruby-menu > li > ul > li > ul > li > a:before {
        background: #777;
    }

    ul.ruby-menu > li > ul > li > ul > li > ul > li > a:before {
        background: #999;
    }

    ul.ruby-menu > li > ul > li > ul > li > ul, ul.ruby-menu > li > ul > li > ul, ul.ruby-menu > li > ul, ul.ruby-menu, ul.ruby-menu > li.ruby-menu-mega > div, ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > div, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > div, ul.ruby-menu > li.ruby-menu-mega-blog > div, ul.ruby-menu > li.ruby-menu-mega-shop > div {
        max-height: 0;
        transform: scaleY(0);
        overflow: hidden;
    }

        ul.ruby-menu > li > ul.ruby-mobile-sublevel-show, ul.ruby-menu > li > ul > li > ul.ruby-mobile-sublevel-show, ul.ruby-menu > li > ul > li > ul > li > ul.ruby-mobile-sublevel-show, ul.ruby-menu.ruby-mobile-sublevel-show, ul.ruby-menu > li.ruby-menu-mega > div.ruby-mobile-sublevel-show, ul.ruby-menu > li.ruby-menu-mega-blog > div.ruby-mobile-sublevel-show, ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > div.ruby-mobile-sublevel-show, ul.ruby-menu > li.ruby-menu-mega-shop > div.ruby-mobile-sublevel-show, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > div.ruby-mobile-sublevel-show {
            max-height: 20000px;
            transform: scaleY(1);
        }

    div.ruby-grid > div.ruby-row div.ruby-row [class^="ruby-col"] {
        margin-top: 0;
    }

    div.ruby-grid > div.ruby-row div.ruby-row:first-of-type [class^="ruby-col"] {
        margin-top: 0;
    }

    div.ruby-grid.ruby-grid-lined > div.ruby-row:after {
        height: 0;
    }

    div.ruby-grid > div.ruby-row > [class^="ruby-col"] {
        padding: 0;
    }

        div.ruby-grid > div.ruby-row > [class^="ruby-col"] [class^="ruby-col"] {
            padding-right: 0;
        }

            div.ruby-grid > div.ruby-row > [class^="ruby-col"] [class^="ruby-col"]:first-of-type {
                padding-right: 0;
            }

    div.ruby-grid > div.ruby-row div.ruby-col-1, div.ruby-grid > div.ruby-row div.ruby-col-2, div.ruby-grid > div.ruby-row div.ruby-col-3, div.ruby-grid > div.ruby-row div.ruby-col-4, div.ruby-grid > div.ruby-row div.ruby-col-5, div.ruby-grid > div.ruby-row div.ruby-col-6, div.ruby-grid > div.ruby-row div.ruby-col-7, div.ruby-grid > div.ruby-row div.ruby-col-8, div.ruby-grid > div.ruby-row div.ruby-col-9, div.ruby-grid > div.ruby-row div.ruby-col-10, div.ruby-grid > div.ruby-row div.ruby-col-11, div.ruby-grid > div.ruby-row div.ruby-col-12 {
        width: 100%;
        padding: 20px 30px;
    }

    div.ruby-grid.ruby-grid-lined > div.ruby-row > div[class^="ruby-col"]:after {
        width: 0;
    }

    div.ruby-grid img {
        position: relative;
        max-width: 100%;
        height: auto;
        display: block;
    }

    div.ruby-grid > div.ruby-row::after {
        content: "";
        display: table;
        clear: both;
    }

    .c-hamburger {
        display: block;
        position: relative;
        overflow: hidden;
        margin: 0;
        padding: 0;
        width: 50px;
        height: 50px;
        font-size: 0;
        text-indent: -9999px;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        box-shadow: none;
        border-radius: none;
        border: none;
        cursor: pointer;
        -webkit-transition: background .3s;
        transition: background .3s;
    }

        .c-hamburger:focus {
            outline: none;
        }

        .c-hamburger span {
            display: block;
            position: absolute;
            top: 24px;
            right: 8px;
            left: 8px;
            height: 3px;
            background: #fff;
        }

            .c-hamburger span::before, .c-hamburger span::after {
                position: absolute;
                display: block;
                right: 0;
                width: 100%;
                height: 3px;
                background-color: #fff;
                content: "";
            }

            .c-hamburger span::before {
                top: -10px;
            }

            .c-hamburger span::after {
                bottom: -10px;
            }

    .c-hamburger--htx {
        background-color: #19ad86;
    }

        .c-hamburger--htx span {
            -webkit-transition: background 0 .3s;
            transition: background 0 .3s;
        }

            .c-hamburger--htx span::before, .c-hamburger--htx span::after {
                -webkit-transition-duration: 0.3s,.3s;
                transition-duration: 0.3s,.3s;
                -webkit-transition-delay: 0.3s,0;
                transition-delay: 0.3s,0;
            }

            .c-hamburger--htx span::before {
                -webkit-transition-property: top,-webkit-transform;
                transition-property: top,transform;
            }

            .c-hamburger--htx span::after {
                -webkit-transition-property: bottom,-webkit-transform;
                transition-property: bottom,transform;
            }

        .c-hamburger--htx.is-active {
            background-color: #333;
        }

            .c-hamburger--htx.is-active span {
                background: none;
            }

                .c-hamburger--htx.is-active span::before {
                    top: 0;
                    -webkit-transform: rotate(45deg);
                    -ms-transform: rotate(45deg);
                    transform: rotate(45deg);
                }

                .c-hamburger--htx.is-active span::after {
                    bottom: 0;
                    -webkit-transform: rotate(-45deg);
                    -ms-transform: rotate(-45deg);
                    transform: rotate(-45deg);
                }

                .c-hamburger--htx.is-active span::before, .c-hamburger--htx.is-active span::after {
                    -webkit-transition-delay: 0s,.3s;
                    transition-delay: 0s,.3s;
                }

    ul.ruby-menu.ruby-menu-dividers > li, ul.ruby-menu.ruby-menu-dividers > li > a, ul.ruby-menu.ruby-menu-dividers > li.ruby-menu-social > a, ul.ruby-menu.ruby-menu-dividers > li > a:hover, ul.ruby-menu.ruby-menu-dividers > li:hover > a {
        border: none;
    }

    div.ruby-wrapper.ruby-menu-transparent > ul.ruby-menu > li.ruby-active-menu-item > a {
        padding-right: 45px;
    }

    ul.ruby-menu > li.ruby-menu-social.ruby-menu-search > a {
        display: none;
    }
}

@media(min-width:768px) and (max-width:991px) {
    .ruby-wrapper .hidden-md {
        visibility: hidden;
        display: none;
    }

    div.ruby-wrapper {
        width: 760px;
    }

    ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav {
        width: 170px;
    }

        ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > div {
            width: 590px;
            right: 170px;
        }

    ul.ruby-menu.ruby-vertical > li.ruby-menu-mega > div, ul.ruby-menu.ruby-vertical > li.ruby-menu-mega-blog > div, ul.ruby-menu.ruby-vertical > li.ruby-menu-mega-shop > div {
        width: 560px;
    }

        ul.ruby-menu.ruby-vertical > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > div {
            width: 360px;
        }

    span.ruby-c-date {
        display: none;
        visibility: hidden;
        opacity: 0;
    }

    div.ruby-grid > div.ruby-row div.ruby-col-3-md {
        width: 25%;
    }

    div.ruby-grid > div.ruby-row div.ruby-col-4-md {
        width: 33.33%;
    }

    div.ruby-grid > div.ruby-row div.ruby-col-6-md {
        width: 50%;
    }

    div.ruby-grid > div.ruby-row div.ruby-col-12-md {
        width: 100%;
    }

    div.ruby-grid.ruby-grid-lined > div.ruby-row:after, div.ruby-grid.ruby-grid-lined > div.ruby-row > div[class^="ruby-col"]:after {
        background: none;
    }

    ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a {
        padding: 20px 5px;
        font-size: 12px;
        font-stretch: condensed;
        color: #666;
    }
}