/* 
    Document   : com_showmenu
    Created on : 2012.08.08., 16:05:23
    Author     : semmer@infoart.hu
*/

/* -------- Main Menu -------- */

div#mainmenu {

}

body.inner div#mainmenu > div.part-showmenu .component-body {
    /* position:relative; */
}

div#mainmenu > div.part-showmenu ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

div#mainmenu > div.part-showmenu ul::after {
    content:"";
    display:block;
    clear:both;
    float:none;
}
body.alkalmazott div#mainmenu > div.part-showmenu ul li::after {
    content:"";
    display:block;
    clear:both;
    float:none;
}
div#mainmenu > div.part-showmenu .component-body > ul {
    padding-top:27px;
}

div#mainmenu > div.part-showmenu ul li {
    text-transform:uppercase;
    font-family:'Titillium Semibold';
}

div#mainmenu > div.part-showmenu ul li a {
    display:block;
    color:inherit;
    padding:0 
}

div#mainmenu > div.part-showmenu .component-body > ul > li > a {
    padding:0 12px;
    border-left:solid 1px #333333;
    line-height:14px;
    display:block;
}

div#mainmenu > div.part-showmenu .component-body > ul > li:first-child > a {
    border:none;
}

div#mainmenu > div.part-showmenu .component-body > ul > li {
    display: block;
    float: left;
    padding:5px 0;
    height:28px;
    border-bottom:solid 0px var(--sec);
    transition:0.3s;
    box-sizing:border-box;
}



div#mainmenu > div.part-showmenu .component-body > ul > li:hover {
    border-bottom:solid 4px var(--sec);
}

div#mainmenu > div.part-showmenu .component-body > ul > li.activeli {
    border-bottom:solid 4px var(--sec);
}

div#mainmenu > div.part-showmenu ul > li.activeli a {
    color:var(--sec);
}

div#mainmenu > div.part-showmenu .component-body > ul > li ul {
    display:none;
}

div#mainmenu > div.part-showmenu .component-body > ul > li.activeli > ul > li > a {
    color:#333333;
}

div#mainmenu > div.part-showmenu .component-body > ul > li.activeli:hover {
    border-bottom:solid 4px var(--sec);
}

div#mainmenu > div.part-showmenu .component-body > ul > li > ul {
    display:none;
    position:absolute;
    top:100%;
    left:0;
    width:100%;
    z-index:99;
    padding:18px;
    background-color:rgba(255,255,255,0.95);
    border:solid 1px #a9aaae;
    column-count: 3;
    column-gap: 48px;
    column-rule: solid 1px #a7a5a6;
}

div#mainmenu > div.part-showmenu .component-body > ul > li > ul.col1 {
    column-count: 1;
    column-gap:0;
    column-rule: none;
}

div#mainmenu > div.part-showmenu .component-body > ul > li > ul.col1 > li > a {
    width:30%;
    float:left;
}

div#mainmenu > div.part-showmenu .component-body > ul > li > ul.col1 > li > ul {
    width:30%;
    float:left;
}
body.alkalmazott div#mainmenu > div.part-showmenu .component-body > ul > li > ul.col1 > li > ul {
    max-height: 50vh;
    overflow-y: scroll!important;
    overflow-x: hidden!important;
    width: 70%;
}

div.home div#mainmenu > div.part-showmenu .component-body > ul > li > ul > li {
    display:inline-block;
    width:100%;
    box-sizing:border-box;
    position:relative;
}

div#mainmenu > div.part-showmenu .component-body > ul > li > ul > li > a {
    padding:10px;
}

div#mainmenu > div.part-showmenu .component-body > ul > li > ul li {
    position:relative;
    display:inline-block;
    width:100%;
}

div#mainmenu > div.part-showmenu .component-body > ul > li > ul > li.parent a {
    position:relative;
    padding-right:32px;
}

div#mainmenu > div.part-showmenu .component-body > ul > li > ul li.parent > a::after {
    content:"";
    display:block;
    position:absolute;
    width:16px;
    height:16px;
    top:12px;
    right:10px;
    background-repeat: no-repeat;
    background-position: 0 0;
    background-image:url('../gfx/parent.png');
}

div#mainmenu > div.part-showmenu .component-body > ul > li > ul li.parent > a:hover::after {
    background-position: 0 -16px;
}

div#mainmenu > div.part-showmenu .component-body > ul > li > ul > li.parent.active a::after {
    background-position: 0 -16px;
}

div#mainmenu > div.part-showmenu .component-body > ul > li > ul li.parent > a.open::after {
    background-position:0 -48px;
}

div#mainmenu > div.part-showmenu .component-body > ul > li > ul > li > a:hover {
    background-color:var(--sec);
    color:#ffffff;
}

div#mainmenu > div.part-showmenu .component-body > ul > li > ul > li ul li a {
    display:inline-block;
    width:100%;
    padding:10px;
    font-family:'Titillium';
    transition:0.3s;
}

div#mainmenu > div.part-showmenu .component-body > ul > li > ul > li ul li a:hover {
    color:#ffffff;
    background-color:#aaaaaa;
}

div.part-showmenu.quick-links {
    /*background-color:var(--sec);*/
    /*padding:24px 16px;*/
    margin-bottom:20px;
}
div.part-showmenu.quick-links .component-body{
    margin-top:10px;
    background-color:var(--sec);
}
div#content div.part-showmenu.quick-links h1.component-heading,
div#content div.part-showmenu.quick-links h2.component-heading {
    color:var(--sec);
    font-family:'Titillium Light';
}

div.part-showmenu.quick-links .component-body ul {
    list-style-type:none;
    padding:0;
    margin:0;
}

div.part-showmenu.quick-links li {
    border-top:dashed 1px #0c7bc0;
}

div.part-showmenu.quick-links li:first-child {
    border:none;
}

div.part-showmenu.quick-links li a {
    display:block;
    padding:7px 7px 14px 7px;
    text-transform:uppercase;
    transition:0.3s;
}

div.part-showmenu.quick-links li a:hover {
    background-color:#fff;
    color:var(--sec);
}
div.part-showmenu.quick-links li a:hover *{
    color:var(--sec);
}

div.part-showmenu.quick-links * {
    color:#ffffff;
}

div#footer div.part-showmenu::after {
    content:"";
    display:block;
    float:none;
    clear:both;
}

div#footer div.part-showmenu h1.component-heading,
div#footer div.part-showmenu h2.component-heading {
    margin-bottom:32px;
    text-transform:uppercase;
    font-size:24px;
}

div#footer ul {
    list-style-type: square;
    margin-bottom:32px;
}

div#footer ul li {
    padding-bottom:12px;
}

div#footer div.part-showmenu ul li a {

}


@media only screen and (min-width: 1681px) {
    

}

@media only screen and (min-width: 1305px) and (max-width: 1680px) {
    

}

@media only screen and (min-width: 984px) and (max-width: 1304px) { 
    div#content div.part-showmenu.quick-links h1.component-heading,
    div#content div.part-showmenu.quick-links h2.component-heading {
        font-size:30px;
        line-height:38px;
    }
    
    div#mainmenu > div.part-showmenu .component-body > ul > li > a {
        font-size:14px;
    }

    div#mainmenu > div.part-showmenu .component-body > ul > li > ul.col1 > li > ul {
        width:50%;
    }

    body.alkalmazott div#mainmenu > div.part-showmenu .component-body > ul > li > ul.col1 > li > ul {
        width:70%;
    }
}

@media only screen and (min-width: 665px) and (max-width: 983px) {
    div#mainmenu > div.part-showmenu .component-body > ul > li.activeli,
    div#mainmenu > div.part-showmenu .component-body > ul > li.activeli:hover,
    div#mainmenu > div.part-showmenu .component-body > ul > li:hover {
        border:none;
    }

    div#mainmenu > div.part-showmenu .component-body > ul {
        padding-bottom:10px;
    }

    div#mainmenu > div.part-showmenu .component-body > ul > li {
        padding:0;
    }

    div#mainmenu > div.part-showmenu .component-body > ul > li a {
        border:none;
        padding:5px 10px;
    }

    div#mainmenu > div.part-showmenu .component-body > ul > li a:hover {
        color:#ffffff;
        background-color:var(--sec);
    }

}

@media only screen and (max-width:983px) {
    div#mainmenu > div.part-showmenu .component-body > ul > li > ul {
        column-count:1;
        column-gap:0;
        border:none;
    }

    div#mainmenu > div.part-showmenu .component-body > ul > li > ul.col1 > li > ul {
        width:auto;
        float:none;
    }

    body.alkalmazott div#mainmenu > div.part-showmenu .component-body > ul > li > ul.col1 > li > ul {
        width:100%;
        float:left;
    }

    div#mainmenu > div.part-showmenu .component-body > ul > li > ul > li ul li a {
        display:block;
    }

    div#mainmenu > div.part-showmenu .component-body > ul > li > ul.col1 > li > a {
        width:auto;
        float:none;
    }
}

@media only screen and (min-width:984px) {
    div#mainmenu > div.part-showmenu h1.component-heading,
    div#mainmenu > div.part-showmenu h2.component-heading {
        display:none;
    }

    div#mainmenu > div.part-showmenu .component-body,
    div#head-menu #head-menu-in .part-showmenu .component-body{
        display:block !important;
    }
    
}

@media only screen and (max-width: 983px) {
    div#mainmenu > div.part-showmenu {
        position:relative;
        z-index:99;
        margin-top:-47px;
        padding-top:48px;
    }
    
    div#mainmenu > div.part-showmenu h1.component-heading,
    div#mainmenu > div.part-showmenu h2.component-heading,
    div#head-menu #head-menu-in .part-showmenu .component-heading{
        display:block;
        position:absolute;
        top:0;
        right:0;
        width:21px;
        height:21px;
        text-indent:-9999px;
        background-repeat:no-repeat;
        background-position:0 0;
        background-image: url('../gfx/hamburger-icon.svg');
        cursor:pointer;
    }
    
    div#head-menu #head-menu-in .part-showmenu::after {
        content:"";
        display:block;
        float:none;
        clear:both;
        position:static;
    }
    
    div#head-menu #head-menu-in .part-showmenu .component-heading{
        top:10px;
        right:0px;
        position: relative;
        width:40px;
        height:40px;
        background-image: url('../gfx/hamburger-icon_white.svg');
        float:right;
    }
    div#head-menu #head-menu-in .part-showmenu .component-body{
        display:none;
    }
    div#head-menu #head-menu-in .part-showmenu .component-body ul.nav{
        display:block;
        margin-top:40px;
        padding-bottom:10px;
    }
    div#head-menu #head-menu-in .part-showmenu .component-body ul.nav li:hover{
        background:0;
    }
    
    div#mainmenu > div.part-showmenu .component-body {
        clear:both;
    }

    div#mainmenu > div.part-showmenu .component-body ul {
        padding:0;
        column-count: 1;
        column-gap:0;
        position:static;
    }

    body.alkalmazott div#mainmenu > div.part-showmenu .component-body ul {
        column-count: auto;
    }

    div#mainmenu > div.part-showmenu .component-body ul li {
        float:none;
        border:none;
        padding:0;
        height:auto;
    }
    
    div#mainmenu > div.part-showmenu .component-body > ul > li > ul {
        column-count:1;
        column-gap:0;
        position:static;
        border:none;
        padding-top:0;
        padding-bottom:0;
        background:none;
    }

    div#mainmenu > div.part-showmenu .component-body ul li a {
        border:none;
        padding:15px;
        transition:0.3s;
        position:relative;
    }

    div#mainmenu > div.part-showmenu .component-body > ul {
        border-bottom:solid 4px var(--sec);
    }

    div#mainmenu > div.part-showmenu .component-body ul.nav li ul {
        background:none;
        border:none;
    }

    div#mainmenu > div.part-showmenu .component-body ul li ul li a {
        padding-left:30px;
        font-family:'Titillium';
    }
    
    div#mainmenu > div.part-showmenu .component-body > ul > li.activeli,
    div#mainmenu > div.part-showmenu .component-body > ul > li.activeli:hover,
    div#mainmenu > div.part-showmenu .component-body > ul > li:hover {
        border:none;
    }
    
    /* MENU */
    
    div#mainmenu > div.part-showmenu .component-body > ul > li > ul {
        padding:0;
    }

    div#mainmenu div.part-showmenu ul li ul li a {
        color:var(--sec);
        background:none;
        border:none;
    }

    div#mainmenu div.part-showmenu ul {
        padding-bottom:10px;
    }

    div#mainmenu div.part-showmenu .component-body > ul > li ul > li {
        float:none;
        margin-right:0;
    }

    div#mainmenu div.part-showmenu ul li ul {
        position:static;
        padding-top:0;
        padding-bottom:0;
    }

    div#mainmenu div.part-showmenu ul.nav > li > ul li.parent.parent-open > a {
        /* background-color:#418dbb; */
        /* color:#ffffff; */
    }
    
    div#mainmenu > div.part-showmenu .component-body ul.nav > li > a {
        background-color:var(--sec);
        color:#ffffff;
    }

    div#mainmenu > div.part-showmenu .component-body ul li ul li a:hover {
        /* background-color:#eeeeee; */
    }

    div#mainmenu div.part-showmenu ul li ul li a {
        width:100%;
        height:auto;
        text-align:left;
        display:block;
        padding:15px;
    }
    
    
    
    div#mainmenu div.part-showmenu ul li ul li a:hover,
    div#mainmenu div.part-showmenu ul li ul li.activeli > a {
        box-shadow:none;
    }

    div#mainmenu div.part-showmenu .component-body ul.nav > li {
        position:relative;
    }

    div#mainmenu div.part-showmenu .component-body > ul > li ul.open > li,
    div#mainmenu div.part-showmenu .component-body > ul > li ul > li.parent-open {
        margin-top:0;
    }
    
    div#mainmenu div.part-showmenu ul li.parent > a::after {
        content:"";
        display:block;
        position:absolute;
        width:34px;
        height:34px;
        top:10px;
        right:10px;
        background-repeat:no-repeat;
        background-size:34px;
    }
    
    div#mainmenu > div.part-showmenu .component-body > ul > li > ul li.parent > a::after {
        width:34px;
        height:34px;
    }
    
    div#mainmenu > div.part-showmenu .component-body > ul > li > ul li.parent > a:hover::after {
        background-position:0 0;
    }
    
    div#mainmenu > div.part-showmenu .component-body > ul > li > ul li.parent > a.open {
        /* background-color:#418dbb; */
        /* color:#ffffff; */
    }
    
    div#mainmenu > div.part-showmenu .component-body > ul > li > ul li.parent > a.open {
        background-position:0 -34px;
    }
    
    div#mainmenu > div.part-showmenu .component-body > ul > li > ul li.parent > a.open:hover {
        background-position:0 -34px;
    }
    
    div#mainmenu > div.part-showmenu .component-body > ul > li > ul li.parent > a.open::after {
        background-position:0 -34px;
    }
    
    div#mainmenu > div.part-showmenu .component-body > ul > li > ul > li ul li a:hover {
        background-color:#eeeeee;
        color:var(--sec);
    }
    
    div#mainmenu div.part-showmenu ul.nav > li.parent > a {
        padding-right:58px;
    }
    

    div#mainmenu div.part-showmenu ul.nav > li.parent > a::after {
        background-image:url('../gfx/down.svg');
        background-position:0 -34px;
    }
    
    div#mainmenu div.part-showmenu ul.nav > li ul li.parent a::after {
        background-image:url('../gfx/down.svg');
        background-position:0 0;
    }
    
    div#mainmenu > div.part-showmenu .component-body > ul > li > a.opened::after,
    div#mainmenu > div.part-showmenu .component-body > ul > li > ul li.parent > a.open::after {
        background-image:url('../gfx/back.svg');
        background-position:0 0;
    }
    
    div#mainmenu > div.part-showmenu .component-body > ul > li > ul > li ul li a {
        transition:0.3s;
        padding:15px;
    }
    
    div#mainmenu > div.part-showmenu ul.nav > li ul li a {
        height:0;
        overflow:hidden;
        padding:0;
    }
    
    div#mainmenu > div.part-showmenu ul.nav > li ul li > a,
    div#mainmenu > div.part-showmenu ul.nav > li ul.open > li.parent-open.opened.parent > a.open.opened {
        height:auto;
        overflow:hidden;
        padding:15px;
    }
    
    div#mainmenu > div.part-showmenu ul.nav > li ul.open > li.opened.parent > a.open.opened {
        height:0;
        overflow:hidden;
        padding:0;
    }
    
    
    div#mainmenu > div.part-showmenu .component-body > ul > li > ul > li > a:hover {
        /* color:var(--sec); */
    }

    div#mainmenu > div.part-showmenu .component-body ul li a {
        line-height:24px;
    }

    div#mainmenu div.part-showmenu ul li.parent a::after {
        left:auto;
    }

    div#mainmenu div.part-showmenu ul li ul li.opened {
        height:auto;
    }

    div#mainmenu div.part-showmenu ul li ul li a::before {
        display:none;
    }
}

@media only screen and (min-width:320px) and (max-width:479px) {
    div#mainmenu > div.part-showmenu {
        padding-top:58px;
    }
    
    div#mainmenu > div.part-showmenu h1.component-heading,
    div#mainmenu > div.part-showmenu h2.component-heading {
        top:10px;
        right:10px;
    }
    
    div#content div.part-showmenu.quick-links h1.component-heading,
    div#content div.part-showmenu.quick-links h2.component-heading {
        font-size:32px;
        line-height:40px;
    }
}

/* Socials */

div.part-showmenu.socials {
    
}

.header-actions > div.box.part-showmenu.socials {
    width:auto;
    height:auto;
    margin-right:32px;
}

div.part-showmenu.socials ul.nav {
    list-style-type:none;
    padding:0;
    margin:0;
}

div.part-showmenu.socials ul.nav::after {
    content:"";
    display:block;
    float:none;
    clear:both;
}

div.part-showmenu.socials ul.nav li {
    margin-left:10px;
    float:left;
}

div.part-showmenu.socials ul.nav li a {
    display:block;
}

div.part-showmenu.socials ul.nav li a span {
    display:none;
}

div.part-showmenu.socials ul.nav li a img {
    display:block;
    border-radius:50%;
    overflow:hidden;
    object-fit:cover;
    object-position:center center;
    width:22px;
    height:22px;
}

@media only screen and (max-width:664px) {
    .header-actions > div.box.part-showmenu.socials {
        position:fixed;
        margin:0;
        z-index:1000;
        right:0;
        bottom:120px;
        padding:8px;
        border-top-left-radius:17px;
        border-bottom-left-radius:17px;
        background-color:rgba(255,255,255,0.85);
    }
    
    div.part-showmenu.socials ul.nav li {
        margin-left:0;
        margin-bottom:10px;
        float:none;
    }
    
    div.part-showmenu.socials ul.nav li:last-child {
        margin-bottom:0;
    }
}