/* ---------------------------------------------------------------
   EU funding notice bar
   Institutional notice fixed above the main header on every page, so
   the EU emblem, the funding statement and the programme logo are
   visible without scrolling. The main navigation is offset by the
   bar height.

   Bar height / body padding / navigation offset must always match:
      >= 768px : 70px bar, 48px logos
      >= 480px : 58px bar, 36px logos
      >= 360px : 56px bar, 32px logos
       < 360px : 52px bar, 28px logos
   Below 768px the logo size is limited by the available width, not by
   the bar height, so the bar stays compact there.
------------------------------------------------------------------ */
.eu-topbar {position: fixed; top: 0; left: 0; width: 100%; height: 70px; background: #fff; border-bottom: 1px solid #ececec; z-index: 9998;}
.eu-topbar .eu-topbar-notice {display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-items: center; -ms-flex-align: center; align-items: center; height: 69px; color: #232323; text-decoration: none;}
.eu-topbar .eu-topbar-logo {-webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; height: 48px; width: auto;}
.eu-topbar .eu-topbar-logo-programme {margin-left: 22px;}
.eu-topbar .eu-topbar-more {-webkit-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; margin-left: 20px; font-size: 11px; color: #939393; white-space: nowrap; text-align: right;}
.eu-topbar .eu-topbar-more i {margin-left: 4px;}
.eu-topbar .eu-topbar-notice:hover, .eu-topbar .eu-topbar-notice:focus {color: #232323; text-decoration: none;}
.eu-topbar .eu-topbar-notice:hover .eu-topbar-more {color: #232323;}

/* The bar is fixed, so the page is moved down by its height: the header and
   the hero keep the exact same relationship to each other as before.
   Keep this padding and the .eu-topbar height above in sync. */
body {padding-top: 70px;}

/* offset the fixed main navigation by the height of the notice bar */
header nav.navbar.bootsnav.navbar-fixed-top {top: 70px;}

@media (max-width: 767px) {
    .eu-topbar {height: 58px;}
    .eu-topbar .eu-topbar-notice {height: 57px;}
    .eu-topbar .eu-topbar-logo {height: 36px;}
    .eu-topbar .eu-topbar-logo-programme {margin-left: 12px;}
    .eu-topbar .eu-topbar-more {margin-left: 12px; font-size: 10px;}
    body {padding-top: 58px;}
    header nav.navbar.bootsnav.navbar-fixed-top {top: 58px;}
}

/* on the narrowest screens keep the two logos only */
@media (max-width: 479px) {
    .eu-topbar {height: 56px;}
    .eu-topbar .eu-topbar-notice {height: 55px;}
    .eu-topbar .eu-topbar-logo {height: 32px;}
    .eu-topbar .eu-topbar-more {display: none;}
    body {padding-top: 56px;}
    header nav.navbar.bootsnav.navbar-fixed-top {top: 56px;}
}

@media (max-width: 359px) {
    .eu-topbar {height: 52px;}
    .eu-topbar .eu-topbar-notice {height: 51px;}
    .eu-topbar .eu-topbar-logo {height: 28px;}
    .eu-topbar .eu-topbar-logo-programme {margin-left: 10px;}
    body {padding-top: 52px;}
    header nav.navbar.bootsnav.navbar-fixed-top {top: 52px;}
}

/* "РЕЗЮМЕ" link on the programmes and projects page */
.eu-resume-link {display: inline-block; font-size: 24px; line-height: 30px; letter-spacing: 0.5px;}
.eu-resume-link:hover, .eu-resume-link:focus {color: #FF214F; text-decoration: none;}