/* LOGGED ADMIN ADJUSTMENT */
/* body.toolbar-horizontal.toolbar-fixed .region.region-mega-menu:not(.hide) {
    top: 39px;
    height: calc(100% - 39px);
}
body.toolbar-horizontal.toolbar-fixed.toolbar-tray-open .region.region-mega-menu:not(.hide) {
    top: 88px;
    height: calc(100% - 88px);
} */

/* ------------------------ WRAPPER STYLE AND ELEMENTS ------------------------ */
/* external dark panel as wrapper to overlay fullscreen */
.region.region-mega-menu { display: none; }

@media (min-width: 1024px) {
    .region.region-mega-menu {
        display: block;
        width: 100%;
        height: 100%;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 100000;
        background-color: #191A1A;
        padding: 0;
    }

    .region-mega-menu > div { height: 100%; }

    .region-mega-menu .menu-rows > * { margin: 0 40px; }

    /* three rows structure: HEADER, MENU and FOOTER */
    .region-mega-menu .menu-rows {
        height: 100%;
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    .region-mega-menu nav {
        height: 100%;
        width: 100%;
    }

    /* style when closed */
    .region-mega-menu.hide {
        height: 0px;
        padding: 0;
    }
    .region-mega-menu.hide .menu-rows {
        /* display: none;  */
        overflow: hidden;
    }

    /* VERTICAL LINES */
    .region-mega-menu .logo-search-bar::after {
        content: '';
        width: 1px;
        height: 50px;
        display: block;
        position: absolute;
        top: 50%;
        left: 24%;
        transform: translateY(-50%);
        z-index: 2;
        background-color: #707070;
        display: none;
    }

    .region-mega-menu .mega-menu-columns { position: relative; }
    .region-mega-menu .mega-menu-columns::after {
        content: '';
        width: 1px;
        height: 90%;
        display: block;
        position: absolute;
        top: 50%;
        left: 265px;
        transform: translateY(-50%);
        z-index: 2;
        background-color: #707070;
    }

    /* ------------------------ MEGA MENU HEADER ------------------------ */
    .region-mega-menu .logo-search-bar {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        position: relative;
        /* width: 100%; */
        height: 80px;
    }

    .region-mega-menu .logo-search-bar .left {
        position: relative;
        display: flex;
        flex-direction: row;
        width: 25%;
    }

    /* LOGO AND BACK SECTION */
    .region-mega-menu .logo-search-bar .ictp-logo {
        height: 60px;
        margin: auto auto auto 0;
        object-fit: contain;
        width: 270px;
    }
    .region-mega-menu .logo-search-bar a { margin: auto 0; }

    .region-mega-menu .logo-search-bar .back-section {
        display: flex;
        flex-direction: row;
        position: absolute;
        top: 50%;
        left: calc((100vw - 80px) * 26 / 100);
        transform: translateY(-50%);
    }

    .region-mega-menu .logo-search-bar .back-section button {
        background-color: transparent;
        outline: none;
        border: none;
        position: relative;
        margin: auto;
        padding: 1em 1.5em 1em 40px;
        color: white;
        display: block;
        font-size: .8em;
    }

    .region-mega-menu .logo-search-bar .back-section button.hide {
        /* display: none; */
        /* visibility: hidden; */
        opacity: 0;
        pointer-events: none;

    }

    .region-mega-menu .logo-search-bar .back-section button::before {
        position: absolute;
        top: 50%;
        left: .5em;
        height: 1em;
        width: 2em;
        content: '';
        display: block;
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center center;
        background-image: url(../../assets/icons/icon_arrow_right_blue.svg);
        transform-origin: center center;
        transform: scaleX(-1) translateY(-50%);
    }

    .region-mega-menu .logo-search-bar .back-section button:hover {
        background-color: #242424;
        border-radius: 40px;
    }

    .region-mega-menu .logo-search-bar .back-section .section-name {
        color: white;
        margin: auto 10px;
        font-weight: 300;
        font-size: 12px;
        width: 300px;
    }

    /* SEARCH AND CLOSE SECTION */
    .region-mega-menu .logo-search-bar .right {
        position: relative;
        display: flex;
        flex-direction: row;
        justify-content: flex-end;
        width: 65%;
    }

    .region-mega-menu .logo-search-bar .close-button,
    .region-mega-menu .logo-search-bar .search-widget {
        margin: auto 0;
    }

    .region-mega-menu .logo-search-bar .right button {
        background-origin: content-box;
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center center;
        width: 3rem;
        height: 3rem;
        padding: 1rem;
        border-radius: 3.5rem;
        margin: 0 0 0 2.5rem;
        background-color: transparent;
        color: white;
        border: none;
        outline: none;
        position: relative;
        display: block;
    }

    .region-mega-menu .logo-search-bar .right button:hover {
        background-color: #242424;
    }

    .region-mega-menu .logo-search-bar .right button::before {
      content: '';
      width: 1px;
      height: 50px;
      background-color: #707070;
      position: absolute;
      top: 50%;
      left: -1rem;
      transform: translateY(-50%);
      display: block;
    }

    .region-mega-menu .logo-search-bar .right button.search-button { border-radius: 0; }
    .region-mega-menu .logo-search-bar .right button.search-button::before { display: none; }

    .region-mega-menu .logo-search-bar .close-button button {
        background-image: url(../../assets/icons/icon_close_w.svg);
    }

    .region-mega-menu .logo-search-bar .search-widget button {
        padding-right: 3.5rem;
        font-size: 16px;
        width: unset;
    }

    .region-mega-menu .logo-search-bar .search-widget button::after {
        content: '';
        background-position: center center;
        background-repeat: no-repeat;
        background-size: contain;
        background-image: url(../../assets/icons/icon-search-w.svg);
        position: absolute;
        display: block;
        top: 50%;
        right: 1rem;
        transform: translateY(-50%);
        width: 1.5rem;
        height: 1.5rem;
    }

    /* ACTIVE SECTION LOGO */
    .region-mega-menu .logo-search-bar .section-logo {
        width: 50px;
        height: 50px;
        min-width: 50px;
        min-height: 50px;
        margin: auto 0 auto 0;
        background-position: center center;
        background-size: contain;
        background-repeat: no-repeat;
    }

    .region-mega-menu .logo-search-bar .section-logo.hecap { background-image: url(../../assets/loghi/logo-hecap-col-typo.svg); }
    .region-mega-menu .logo-search-bar .section-logo.esp { background-image: url(../../assets/loghi/logo-esp-col-typo.svg); }
    .region-mega-menu .logo-search-bar .section-logo.sti { background-image: url(../../assets/loghi/logo-sti-col-typo.svg); }
    .region-mega-menu .logo-search-bar .section-logo.qls { background-image: url(../../assets/loghi/logo-qls-col-typo.svg); }
    .region-mega-menu .logo-search-bar .section-logo.cmsp { background-image: url(../../assets/loghi/logo-cmsp-col-typo.svg); }
    .region-mega-menu .logo-search-bar .section-logo.math { background-image: url(../../assets/loghi/logo-math-col-typo.svg); }


    /* ------------------------ MEGA MENU FOOTER ------------------------ */
    .region-mega-menu .mega-menu-footer {
        background-color: #212121;
        margin: 0;
        padding: 0 40px;
    }

    .region-mega-menu .mega-menu-footer > div {
        color: #ffffff;
        height: 60px;
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }

    .region-mega-menu .mega-menu-footer .menu {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        width: 100%;
    }


    /* ---------- SHORTCUTS MENU ---------- */
    .region-mega-menu .mega-menu-footer .shortcuts {
      width: 75%;
      margin: auto 0;
    }

    .region-mega-menu .mega-menu-footer .shortcuts .menu {
      display: flex;
      flex-direction: row;
      justify-content: flex-start;
      width: 100%;
      margin-left: 0;
    }

    .region-mega-menu .mega-menu-footer .shortcuts .menu .menu-item {
        margin-right: .75rem;
    }


    /* ---------- SOCIAL LINKS MENU ---------- */
    .region-mega-menu .mega-menu-footer .social-link {
      /* width: 25%;  */
      max-width: 400px;
      margin: auto 0;
    }

    .region-mega-menu .mega-menu-footer .social-link .menu {
      justify-content: space-around;
    }

    .region-mega-menu .mega-menu-footer .social-link li a {
      font-size: 0;
      width: 35px;
      margin: 7px;
      height: 35px;
    }

    /* LINKEDIN */
    .region-mega-menu .mega-menu-footer .social-link .menu li:nth-child(5) a { content: url("../../assets/icons/icon-footer-li.svg"); }
    .region-mega-menu .mega-menu-footer .social-link .menu li:nth-child(5) a:hover { content: url("../../assets/icons/icon-footer-li-active.svg"); }

    /* TWITTER */
    .region-mega-menu .mega-menu-footer .social-link .menu li:nth-child(2) a { content: url("../../assets/icons/icon-footer-tw.svg"); }
    .region-mega-menu .mega-menu-footer .social-link .menu li:nth-child(2) a:hover { content: url("../../assets/icons/icon-footer-tw-active.svg"); }

    /* INSTAGRAM */
    .region-mega-menu .mega-menu-footer .social-link .menu li:nth-child(4) a { content: url("../../assets/icons/icon-footer-in.svg"); }
    .region-mega-menu .mega-menu-footer .social-link .menu li:nth-child(4) a:hover { content: url("../../assets/icons/icon-footer-in-active.svg"); }

    /* FLICKR */
    .region-mega-menu .mega-menu-footer .social-link .menu li:nth-child(6) a { content: url("../../assets/icons/icon-footer-flickr.svg"); }
    .region-mega-menu .mega-menu-footer .social-link .menu li:nth-child(6) a:hover { content: url("../../assets/icons/icon-footer-flickr-active.svg"); }

    /* YOUTUBE */
    .region-mega-menu .mega-menu-footer .social-link .menu li:nth-child(3) a { content: url("../../assets/icons/icon-footer-yt.svg");}
    .region-mega-menu .mega-menu-footer .social-link .menu li:nth-child(3) a:hover { content: url("../../assets/icons/icon-footer-yt-active.svg"); }

    /* FACEBOOK */
    .region-mega-menu .mega-menu-footer .social-link .menu li:nth-child(1) a { content: url("../../assets/icons/icon-footer-fb.svg"); }
    .region-mega-menu .mega-menu-footer .social-link .menu li:nth-child(1) a:hover { content: url("../../assets/icons/icon-footer-fb-active.svg"); }
}


@media (min-width: 1200px) {
    .region-mega-menu .mega-menu-footer .shortcuts .menu .menu-item {
        margin-right: 1rem;
    }

    .mega-menu-footer .shortcuts a {
        padding: 7px 0px 7px 30px;
        font-size: 16px;
    }

    .region-mega-menu .logo-search-bar .back-section .section-name {
        max-width: unset;
        width: unset;
        font-size: 18px;
    }

    .region-mega-menu .mega-menu-footer > div {
        height: 100px;
    }

    .region-mega-menu .logo-search-bar .left {
        width: 75%;
    }

    .region-mega-menu .logo-search-bar .right {
        width: 25%;
    }
}


@media (min-width: 1400px) and (min-height:860px){
    /* .region-mega-menu .mega-menu-footer .shortcuts .menu .menu-item {
        margin-right: 35px;
    } */
    .region-mega-menu nav { width: 75%; }

    /* .region-mega-menu .mega-menu-footer .shortcuts {  width: 40%; } */

    .region-mega-menu .logo-search-bar .left::after { left: calc((100vw - 80px) * 0.75 * 24 / 100); }

    .region-mega-menu .logo-search-bar .back-section { left: calc((100vw - 80px) * 0.75 * 26 / 100); }

    .region-mega-menu:not(.hide) .logo-search-bar .ictp-logo {
      animation: logoPosition 0.75s forwards ease;
    }

    @keyframes logoPosition {
      from {
        transform: translate(57px, 0px);
      }
      to {
        transform: translate(0px, 0px);
      }
    }

    .region-mega-menu.hide .logo-search-bar .ictp-logo {
      height: 64px;
      transition: 0.2s ease;
      position: relative;
    }

    .region-mega-menu .logo-search-bar::after,
    .region-mega-menu .mega-menu-columns::after {
      left: 310px;
    }
}


@media (min-width: 3000px) {
    .region-mega-menu > div { 
        max-width: 1920px;
        margin: 0 auto;
    }
}