Page tree

CEF DIGITAL home page

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: removed social media
Content Layer
id1
Content Column
width100%
id11
Content Block
id111
Content Layer
id1
Content Column
width100%
id11
Content Block
id111
Html-bobswift
<footer class="cef-footer-main" role="contentinfo">

<!-- SERVICES AND INFORMATION-->
<div class="col-md-7">
<h3>Services & information</h3>

<div class="col-md-6">
<nav>
<ul>
<li><a href="#">Blockchain</a></li>
<li><a href="https://ec.europa.eu/digital-building-blocks/sites/x/KAavGg">eDelivery</a></li>
<li><a href="https://ec.europa.eu/digital-building-blocks/sites/x/lwOhGg">eID</a></li>
<li><a href="#">eInvoicing</a></li>
<li><a href="https://ec.europa.eu/digital-building-blocks/sites/display/DIGITAL/eSignature">eSignature</a></li>
<li><a href="https://ec.europa.eu/digital-building-blocks/sites/x/aoDIBQ">Once Only Principle</a></li>
</ul>
</nav>
</div>

<div class="col-md-6">
<nav>
<ul>
<li><a href="#">About the Digital Building Blocks</a></li>
<li><a href="#">Grants</a></li>
<li><a class="cef-link-external" href="#">Support <span class="cef-sr-only">(opens in a new tab)</span></a></li>
<li><a href="#">Digital Glossary</a></li>
</ul>
</nav>
</div>

</div>
<!-- END SERVICES AND INFORMATION-->

<!-- FOLLOW US-->
<div class="col-md-5">
<h3>Follow us</h3>

<ul class="cef-footer-main-social-media">
<li><a href="https://twitter.com/Connecting_EU" target="_blank" aria-label="Cef Digital on Twitter (opens in a new tab)">
<span class="cef-sr-only">Cef Digital on Twitter</span>
<svg aria-hidden="true" version="1.1" id="cef-ico-desktop-book-gear-code"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 200 200"
style="enable-background:new 0 0 200 200;" xml:space="preserve">
<g id="Groupe_879" transform="translate(-742.569 -327.742)">
<path id="Path_6190" class="cef-logo-social-media-st0" d="M928.1,473.2c-2.4,4.4-5.1,8.7-8.1,12.7c-1.5,2-3.1,3.9-4.7,5.8c-4.8,5.5-10.2,10.4-16.1,14.7"
/>
<path id="Path_6191" class="cef-logo-social-media-st0" d="M938,409.1c3.4,18.3,1.5,37.2-5.4,54.5"/>
<path id="Path_6192" class="cef-logo-social-media-st0" d="M926.8,378.5c0.7,1.2,1.3,2.4,1.9,3.6c1.5,2.8,2.8,5.7,4,8.7c1.4,3.4,2.5,6.9,3.5,10.5"/>
<path id="Path_6193" class="cef-logo-social-media-st0" d="M916.8,364.1c0.9,1,1.7,2.1,2.5,3.1c1.4,1.8,2.7,3.6,3.9,5.4"/>
<path id="Path_6194" class="cef-logo-social-media-st0" d="M856.1,330.2c1.2,0.2,2.4,0.4,3.7,0.6c14.8,2.8,28.8,8.9,40.9,18c4.4,3.3,8.4,6.9,12.2,10.9"/>
<path id="Path_6195" class="cef-logo-social-media-st0" d="M784.8,347.5c0.7-0.5,1.4-1,2.1-1.4c13.6-9.2,29.3-14.9,45.6-16.4"/>
<path id="Path_6196" class="cef-logo-social-media-st0" d="M758.6,375.6c1.6-2.5,3.2-5,5-7.4c4.6-6.2,10-11.7,15.9-16.6"/>
<path id="Path_6197" class="cef-logo-social-media-st0" d="M750.8,391.1c0.9-2.2,1.8-4.3,2.8-6.4"/>
<path id="Path_6198" class="cef-logo-social-media-st0" d="M744.6,439.5c-1.6-12.7-0.7-25.5,2.7-37.9c0.4-1.3,0.8-2.7,1.2-4"/>
<path id="Path_6199" class="cef-logo-social-media-st0" d="M796.8,513.9c-0.4-0.2-0.9-0.5-1.3-0.7c-4.4-2.4-8.5-5-12.5-8c-18.8-14.1-31.8-34.6-36.8-57.5"
/>
<path id="Path_6200" class="cef-logo-social-media-st0" d="M805.8,518c-1.2-0.5-2.5-1-3.7-1.6"/>
<path id="Path_6201" class="cef-logo-social-media-st0" d="M821.9,522.8c-0.5-0.1-1-0.2-1.6-0.3c-0.5-0.1-1-0.2-1.6-0.4c-2.2-0.5-4.4-1.2-6.6-1.9"/>
<path id="Path_6202" class="cef-logo-social-media-st0" d="M827.2,523.8"/>
<path id="Path_6203" class="cef-logo-social-media-st0" d="M877.1,518.3c-12.5,4.8-25.8,7-39.2,6.5"/>
</g>
<path class="cef-logo-social-media-st1" d="M150.2,73.4c5.2-3.7,9.6-8.3,13.2-13.7v0c-4.8,2.1-9.9,3.5-15.2,4.2c5.5-3.3,9.6-8.4,11.6-14.6
c-5.1,3-10.7,5.2-16.7,6.4c-4.8-5.1-11.7-8.3-19.2-8.3c-14.6,0-26.3,11.8-26.3,26.3c0,2.1,0.2,4.1,0.6,6
c-21.9-1.1-41.3-11.6-54.3-27.5c-2.3,3.9-3.6,8.5-3.6,13.3c0,9.1,4.7,17.2,11.7,21.9c-4.2-0.1-8.4-1.3-11.9-3.2v0.3
c0,12.8,9.1,23.4,21.1,25.9c-2.1,0.6-4.5,0.9-6.9,0.9c-1.7,0-3.4-0.1-5-0.4c3.4,10.4,13.1,18.1,24.6,18.3c-9,7-20.3,11.2-32.6,11.2
c-2.2,0-4.2-0.1-6.3-0.4c11.7,7.5,25.5,11.8,40.4,11.8C121.8,151.7,152.1,113,150.2,73.4L150.2,73.4z"/>
</svg>

</a></li>
<li><a href="https://www.linkedin.com/company/37046411/admin/" target="_blank" aria-label="Cef Digital on Linkedin (opens in a new tab)">
<span class="cef-sr-only">Cef Digital on Linkedin</span>
<svg aria-hidden="true" version="1.1" id="cef-ico-desktop-book-gear-code"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 200 200"
style="enable-background:new 0 0 200 200;" xml:space="preserve">
<g id="Groupe_879" transform="translate(-742.569 -327.742)">
<path id="Path_6190" class="cef-logo-social-media-st0" d="M928.9,473.9c-2.4,4.4-5.1,8.7-8.1,12.7c-1.5,2-3.1,3.9-4.7,5.8c-4.8,5.5-10.2,10.4-16.1,14.7"
/>
<path id="Path_6191" class="cef-logo-social-media-st0" d="M938.8,409.8c3.4,18.3,1.5,37.2-5.4,54.5"/>
<path id="Path_6192" class="cef-logo-social-media-st0" d="M927.6,379.2c0.7,1.2,1.3,2.4,1.9,3.6c1.5,2.8,2.8,5.7,4,8.7c1.4,3.4,2.5,6.9,3.5,10.5"/>
<path id="Path_6193" class="cef-logo-social-media-st0" d="M917.6,364.8c0.9,1,1.7,2.1,2.5,3.1c1.4,1.8,2.7,3.6,3.9,5.4"/>
<path id="Path_6194" class="cef-logo-social-media-st0" d="M856.9,330.9c1.2,0.2,2.4,0.4,3.7,0.6c14.8,2.8,28.8,8.9,40.9,18c4.4,3.3,8.4,6.9,12.2,10.9"/>
<path id="Path_6195" class="cef-logo-social-media-st0" d="M785.6,348.2c0.7-0.5,1.4-1,2.1-1.4c13.6-9.2,29.3-14.9,45.6-16.4"/>
<path id="Path_6196" class="cef-logo-social-media-st0" d="M759.4,376.3c1.6-2.5,3.2-5,5-7.4c4.6-6.2,10-11.7,15.9-16.6"/>
<path id="Path_6197" class="cef-logo-social-media-st0" d="M751.6,391.8c0.9-2.2,1.8-4.3,2.8-6.4"/>
<path id="Path_6198" class="cef-logo-social-media-st0" d="M745.4,440.2c-1.6-12.7-0.7-25.5,2.7-37.9c0.4-1.3,0.8-2.7,1.2-4"/>
<path id="Path_6199" class="cef-logo-social-media-st0" d="M797.6,514.6c-0.4-0.2-0.9-0.5-1.3-0.7c-4.4-2.4-8.5-5-12.5-8C765,491.8,752,471.3,747,448.4"
/>
<path id="Path_6200" class="cef-logo-social-media-st0" d="M806.6,518.7c-1.2-0.5-2.5-1-3.7-1.6"/>
<path id="Path_6201" class="cef-logo-social-media-st0" d="M822.7,523.5c-0.5-0.1-1-0.2-1.6-0.3c-0.5-0.1-1-0.2-1.6-0.4c-2.2-0.5-4.4-1.2-6.6-1.9"/>
<path id="Path_6202" class="cef-logo-social-media-st0" d="M828,524.5"/>
<path id="Path_6203" class="cef-logo-social-media-st0" d="M877.9,519c-12.5,4.8-25.8,7-39.2,6.5"/>
</g>
<g>
<path class="cef-logo-social-media-st1" d="M158,158.4L158,158.4L158,158.4l0-42.6c0-20.9-4.5-36.9-28.9-36.9c-11.7,0-19.6,6.4-22.8,12.5H106V80.8H82.9
v77.6H107v-38.4c0-10.1,1.9-19.9,14.5-19.9c12.3,0,12.5,11.5,12.5,20.6v37.8H158z"/>
<path class="cef-logo-social-media-st1" d="M43.7,80.8h24.1v77.6H43.7V80.8z"/>
<path class="cef-logo-social-media-st1" d="M55.8,42.1c-7.7,0-14,6.3-14,14s6.3,14.1,14,14.1s14-6.4,14-14.1C69.7,48.4,63.5,42.1,55.8,42.1z"/>
</g>
</svg>

</a></li>
<li><a href="https://www.facebook.com/Connecting-Europe-100139724879073" target="_blank" aria-label="Cef Digital on Facebook (opens in a new tab)">
<span class="cef-sr-only">Cef Digital on Facebook</span>
<svg aria-hidden="true" version="1.1" id="cef-logo-facebook"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 200 200"
style="enable-background:new 0 0 200 200;" xml:space="preserve">
<style type="text/css">
.cef-logo-social-media-st0{fill:none;stroke:#003764;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;}
.cef-logo-social-media-st1{fill:#003764;}
</style>
<g id="Groupe_879" transform="translate(-742.569 -327.742)">
<path class="cef-logo-social-media-st0" d="M928.9,473.7c-2.4,4.4-5.1,8.7-8.1,12.7c-1.5,2-3.1,3.9-4.7,5.8c-4.8,5.5-10.2,10.4-16.1,14.7"/>
<path class="cef-logo-social-media-st0" d="M938.8,409.6c3.4,18.3,1.5,37.2-5.4,54.5"/>
<path class="cef-logo-social-media-st0" d="M927.6,379c0.7,1.2,1.3,2.4,1.9,3.6c1.5,2.8,2.8,5.7,4,8.7c1.4,3.4,2.5,6.9,3.5,10.5"/>
<path class="cef-logo-social-media-st0" d="M917.6,364.6c0.9,1,1.7,2.1,2.5,3.1c1.4,1.8,2.7,3.6,3.9,5.4"/>
<path class="cef-logo-social-media-st0" d="M856.9,330.7c1.2,0.2,2.4,0.4,3.7,0.6c14.8,2.8,28.8,8.9,40.9,18c4.4,3.3,8.4,6.9,12.2,10.9"/>
<path class="cef-logo-social-media-st0" d="M785.6,348c0.7-0.5,1.4-1,2.1-1.4c13.6-9.2,29.3-14.9,45.6-16.4"/>
<path class="cef-logo-social-media-st0" d="M759.4,376.1c1.6-2.5,3.2-5,5-7.4c4.6-6.2,10-11.7,15.9-16.6"/>
<path class="cef-logo-social-media-st0" d="M751.6,391.6c0.9-2.2,1.8-4.3,2.8-6.4"/>
<path class="cef-logo-social-media-st0" d="M745.4,440c-1.6-12.7-0.7-25.5,2.7-37.9c0.4-1.3,0.8-2.7,1.2-4"/>
<path class="cef-logo-social-media-st0" d="M797.6,514.4c-0.4-0.2-0.9-0.5-1.3-0.7c-4.4-2.4-8.5-5-12.5-8C765,491.6,752,471.1,747,448.2"/>
<path class="cef-logo-social-media-st0" d="M806.6,518.5c-1.2-0.5-2.5-1-3.7-1.6"/>
<path class="cef-logo-social-media-st0" d="M822.7,523.3c-0.5-0.1-1-0.2-1.6-0.3c-0.5-0.1-1-0.2-1.6-0.4c-2.2-0.5-4.4-1.2-6.6-1.9"/>
<path class="cef-logo-social-media-st0" d="M828,524.3"/>
<path class="cef-logo-social-media-st0" d="M877.9,518.8c-12.5,4.8-25.8,7-39.2,6.5"/>
</g>
<g>
<path class="cef-logo-social-media-st1" d="M131.1,37.8l-16.1,0c-18.1,0-29.8,12-29.8,30.6v14.1H68.9c-1.4,0-2.5,1.1-2.5,2.5v20.5c0,1.4,1.1,2.5,2.5,2.5
h16.2v51.6c0,1.4,1.1,2.5,2.5,2.5h21.2c1.4,0,2.5-1.1,2.5-2.5v-51.6h19c1.4,0,2.5-1.1,2.5-2.5l0-20.5c0-0.7-0.3-1.3-0.7-1.8
s-1.1-0.7-1.8-0.7h-19v-12c0-5.8,1.4-8.7,8.9-8.7l10.9,0c1.4,0,2.5-1.1,2.5-2.5v-19C133.6,39,132.5,37.8,131.1,37.8z"/>
</g>
</svg>

</a></li>
</ul>

<h3>Subscribe to our newsletter</h3>
<p>Find out all the latest on the CEF building blocks and related news, from technical updates and events to exciting new examples of building block reuse and programme-wide initiatives!</p>
<p><a class="cef-footer-main-btn" href="#" target="_blank" aria-label="Subscribe to our Cef Digital newsletter"><span class="cef-link-external">Subscribe</span> <span class="cef-sr-only">(opens in a new tab)</span></a></p>

</div>
<!-- END FOLLOW US -->

<!-- LEGAL LINKS -->
<div class="col-md-12 cef-footer-main-legal-link">
<ul>
<li><a class="cef-link-external" href="#">Legal notice <span class="cef-sr-only">(opens in a new tab)</span></a></li>
<li><a class="cef-link-external" href="#">Cookies <span class="cef-sr-only">(opens in a new tab)</span></a></li>
<li><a href="#">Master Service Arrangement</a></li>
<li><a href="#">Privacy Statement</a></li>
</ul>

</div>
<!-- END LEGAL LINKS -->

</footer>

<!-- Europa Analytics -->
<script type="application/json">{"utility":"piwik","siteID":"457","sitePath":["ec.europa.eu\/cefdigital"]}</script>
<!-- End Europa Analytics Code -->
CSS Stylesheet
.brikit-canvas .cef-footer-main p { font-size: 16px;}

.cef-footer-main h3 { font-weight: bold; color: #003764;}
.cef-footer-main nav {margin-top:1rem; margin-bottom: 1.5rem;}
.cef-footer-main nav li {margin-bottom:0.50rem;}
.cef-footer-main nav li a {border-bottom: 2px solid transparent !important;}

.cef-footer-main-social-media { margin-top:1rem;}
.cef-footer-main-social-media li { margin-right:5px; display:inline-block;}
.cef-footer-main-social-media a { display:inline-block !important; line-height: 0; border: none !important;}
.cef-footer-main-social-media a:hover { background-color: #003764 !important; border: none !important; border-radius: 50%;}
.cef-footer-main-social-media a svg { width: 48px;}
.cef-footer-main-social-media a:hover svg .cef-logo-social-media-st1 { fill:#fff !important; stroke:#fff !important;}

.cef-footer-main-legal-link { padding-top:1.5rem; text-align: center; border-top:1px solid #DBDBDB;}
.cef-footer-main-legal-link ul li { display:inline-block; margin-right:10px;}

/*----------------------------------------*/
/*--- FOLLOWING STYLES ARE DUPLICATED WILL BE REMOVED WHEN THE CSS WILL BE APPLY ON MAIN CSS---*/
/*--------------------------------------*/

/*--- CEF 2020 LINK ---*/
/*--------------------*/
.cef-footer-main a, .cef-footer-main a:link { display: inline; position: relative; padding-left: 2px; padding-right: 2px; font-weight:bold; text-decoration: none !important; color: #003764; border-top: 2px solid transparent; border-right: 2px solid transparent; border-bottom: 2px solid #003764; border-left: 2px solid transparent;
-webkit-transition: 120ms linear; transition: 120ms linear; transition-property: all;}
.cef-footer-main a:hover { color: white; background-color: #003764; border: 2px solid #003764;}
.cef-footer-main a:focus { color: inherit; background-color: inherit; border: 2px solid transparent; outline: 2px dashed black; outline-offset: 2px;}

/*--- BUTTON ---*/
/*-------------*/
.cef-footer-main-btn { margin-bottom: 1.5rem; display:inline-block !important; padding:0.75rem 1rem !important; min-width:100px !important; font-weight: bold; line-height:1.2em; text-align:center; text-transform: uppercase; text-decoration:none !important; border: 2px solid transparent; background: #FFCF00 !important; border-color:#FFCF00 !important; border-radius:7px; box-shadow: none;}
.cef-footer-main-btn:hover { background: #FFCF00 !important; border-color:#FFCF00 !important; box-shadow: none;}
.cef-footer-main-btn:focus { outline: 2px dashed black !important; outline-offset: 2px !important;}
.cef-footer-main-btn span { padding-left:2px; padding-right:2px; color:#003764 !important; border: 2px solid transparent;}
.cef-footer-main-btn:hover span { border-top: 2px solid transparent; border-right: 2px solid transparent; border-bottom: 2px solid #003764; border-left: 2px solid transparent; border-bottom-color: #003764;}

/*--- SCREEN READER ---*/
/*--------------------*/
.cef-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0}
.cef-sr-only-focusable:active,
.cef-sr-only-focusable:focus { position:static; width:auto; height:auto; overflow:visible; clip:auto; white-space:normal}

HTML
<button onclick="topFunction()" id="scrollToTopBtn" title="Go to top"></button>
<script>
// Show or hide Scrolltotop button
function ToggleScrollToTop() {
  if (document.body.scrollTop > 1000 || document.documentElement.scrollTop > 1000) {
    document.getElementById("scrollToTopBtn").style.display = "block";
  } else {
    document.getElementById("scrollToTopBtn").style.display = "none";
  }
}

// Check every defined value millisecond 
setInterval( ToggleScrollToTop, 250 );
// When the user clicks on the button, scroll to the top of the document
function topFunction() {
  document.body.scrollTop = 0; // For Safari
  document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
}
</script>
CSS Stylesheet
#scrollToTopBtn{
  background:url("https://ec.europa.eu/digital-building-blocks/sites/download/attachments/82773348/BackToTop.png?api=v2") no-repeat left center;
  display: none;
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 99;
  border: none;
  outline: none;
  background-color: #bbb;
  color: white;
  cursor: pointer;
  width: 50px;
  height: 50px;
  border-radius: 10px;
  font-size: 18px;
}

#scrollToTopBtn:hover{background-color: #555;}