Versions Compared

Old Version 77

changes.mady.by.user Virginie MANGELINCK

Saved on

compared with

New Version 78

changes.mady.by.user Virginie MANGELINCK

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Div
idevent-detail-introduction
classsection
Div
classcontainer
Div
classcols
Div
Html-bobswift
<p><a class="link-cta before text-primary" href="https://ec.europa.eu/digital-building-blocks/sites/x/AQWkIw"><span>Back to the events calendar</span></a></p>
Div
classcols
Div
classevent-detail-introduction-cover


Div
classcol-7 event-detail-introduction-content
Html-bobswift
<p class="date">24 November 2022 | 9:00 - 14:00</p> 
<h1 class="h2"><span>Online event</span>Implementers Café #1:</h1>
<p>“Once-Only Technical System Guidance and Connectathon Introduction”</p>
<p class="register-cta"><a class="btn primary" target="_blank" href="#"><span>Register</span></a></p>
Div
idevent-detail-description
classsection
Div
classcontainer
Div
classcols
Html-bobswift
<div class="col-9">

<h2>Description</h2>

<p>The objective of the first Implementers Café is to provide participants with useful information on the Once-Only Technical System architecture, its key components and the Common Services provided by the Commission. This event also introduces the 2023 Connectathon series, key concepts  and your role in the preparation and execution of these sessions.<p>

<ul>
<li>Connectathons are three-day, in-person events, in Brussels, where Member Sates pair-up with as many other participants as possible and run tests using different actors, roles and testable profiles to check the status of their implementation of the Once-Only Technical System.</li>
<li>Implementers Cafés have a thematic approach to prepare and check your readiness for the different aspects of the implementation of the Once-Only Technical System and the Connectathon process.</li>
</ul>

<p><a class="btn ghost" href="#"><span>Download the privacy statement</span><span class="ico-download"> </span></a></p>

</div>
Div
styledisplay:none;
idevent-detail-agenda
classsection
Div
classcontainer
Div
classcols
Html-bobswift
<div class="col-8">
<h2>Agenda</h2>

<!--START ROW-->
<div class="col-container">
<div class="col-first">09:00 - 10:00</div>
<div class="col-second">
<h3><span>Online</span>Welcome</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</div>
</div>
<!--END ROW-->

<!--START ROW-->
<div class="col-container">
<div class="col-first">10:00 - 11:00</div>
<div class="col-second">
<h3><span>Online</span>Once Only Technical System Introduction</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</div>
</div>
<!--END ROW-->

<!--START ROW-->
<div class="col-container">
<div class="col-first">11:00 - 12:00</div>
<div class="col-second">
<h3><span>Online</span>Q&A</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</div>
</div>
<!--END ROW-->

<!--START ROW-->
<div class="col-container">
<div class="col-first">12:00 - 13:00</div>
<div class="col-second">
<p>Lunch break</p>
</div>
</div>
<!--END ROW--> 

<!--START ROW-->
<div class="col-container">
<div class="col-first">13:00 - 14:00</div>
<div class="col-second">
<h3><span>Online</span>Benefits of Once Only</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</div>
</div>
<!--END ROW-->

</div>
Div
styledisplay:none;
idevent-detail-speakers
classsection
Div
classcontainer
Div
classcols

Speakers

Div
classcols speakers
Div
Html-bobswift
<p class="speaker-img"><img src="https://ec.europa.eu/digital-building-blocks/sites/download/attachments/597951752/event-01-cover.png" alt=""></p>
<p class="speaker-name">John Doe<span>Director General of DG DIGIT</span></p>
Expand
titleAbout the speaker

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Div
Html-bobswift
<p class="speaker-img"><img src="https://ec.europa.eu/digital-building-blocks/sites/download/attachments/597951752/event-01-cover.png" alt=""></p>
<p class="speaker-name">John Doe<span>Director General of DG DIGIT</span></p>
Expand
titleAbout the speaker

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Div
Html-bobswift
<p class="speaker-img"><img src="https://ec.europa.eu/digital-building-blocks/sites/download/attachments/597951752/event-01-cover.png" alt=""></p>
<p class="speaker-name">John Doe<span>Director General of DG DIGIT</span></p>
Expand
titleAbout the speaker

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Div
Html-bobswift
<p class="speaker-img"><img src="https://ec.europa.eu/digital-building-blocks/sites/download/attachments/597951752/event-01-cover.png" alt=""></p>
<p class="speaker-name">John Doe<span>Director General of DG DIGIT</span></p>
Expand
titleAbout the speaker

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Div
classcols

Partners

Div
classcols speakers
Div
Html-bobswift
<p class="speaker-img"><img src="https://ec.europa.eu/digital-building-blocks/sites/download/attachments/597951752/event-01-cover.png" alt=""></p>
<p class="speaker-name">John Doe<span>Director General of DG DIGIT</span></p>
Expand
titleAbout the speaker

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Div
Html-bobswift
<p class="speaker-img"><img src="https://ec.europa.eu/digital-building-blocks/sites/download/attachments/597951752/event-01-cover.png" alt=""></p>
<p class="speaker-name">John Doe<span>Director General of DG DIGIT</span></p>
Expand
titleAbout the speaker

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Div
Html-bobswift
<p class="speaker-img"><img src="https://ec.europa.eu/digital-building-blocks/sites/download/attachments/597951752/event-01-cover.png" alt=""></p>
<p class="speaker-name">John Doe<span>Director General of DG DIGIT</span></p>
Expand
titleAbout the speaker

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Div
idevent-detail-footer
classsection
Div
classcontainer
Div
classcols
Div
Html-bobswift
<p class="register-cta"><a class="btn primary" target="_blank" href="#"><span>Register for this event</span></a></p>
<p class="social-media-cta">Don’t forget to follow us to keep up to date with the latest news.</p>
<p><a href="https://twitter.com/EU_OnceOnly" target="_blank"><img src="https://ec.europa.eu/digital-building-blocks/sites/download/attachments/581239505/ico-twitter.svg" alt="OOH on Twitter"></a></p>
CSS Stylesheet
/*-----------------------------------------*/
/*---OOH EVENT DETAIL PAGE - 25-10-2022---*/
/*---------------------------------------*/      

/*---INTRODUCTION---*/
.event-detail-introduction-cover {
background-image: url("https://ec.europa.eu/digital-building-blocks/sites/download/attachments/597951752/event-01-cover.png");
background-position: center center; background-repeat: no-repeat; background-size: 100%;
}

.event-detail-introduction-content { position:relative; padding-top:2.5rem !important;; padding-bottom:2.5rem !important; background-color: #F3F4F7;}
.event-detail-introduction-content:before { content:''; display:block; z-index: 2; position:absolute; top:0; left:-2.5rem;; width:100%; height:100%; background-image: url("https://ec.europa.eu/digital-building-blocks/sites/download/attachments/597951745/event-detail-introduction-content-shape.svg"); background-repeat: no-repeat; background-size: 100%; background-position: center left;}

.event-detail-introduction-content h1, .event-detail-introduction-content p { z-index: 3; position:relative;}
.event-detail-introduction-content h1 { margin-left:auto; margin-right:auto; width:80%;}
.event-detail-introduction-content h1 span { display: block; margin-bottom:0.5rem; font-size: 1rem; line-height: 1; color: #5D24A4;}
.event-detail-introduction-content p { margin-left:auto; margin-right:auto; width:80%;}
.event-detail-introduction-content .register-cta { text-align: right}

@media screen and (min-width: 769px) {
	.event-detail-introduction-cover {border-top-left-radius: 12px; border-bottom-left-radius: 12px;}
	.event-detail-introduction-content { border-top-right-radius: 12px; border-bottom-right-radius: 12px;} 
}

/*---DESCRIPTION---*/
#event-detail-description { padding-top: 0rem;}
#event-detail-description h2 { margin-bottom: 2.5rem;}
#event-detail-description p:last-child { margin-bottom: 0rem;}  

/*---AGENDA---*/
#event-detail-agenda { padding-top: 0rem;
background-image: url("https://ec.europa.eu/digital-building-blocks/sites/download/attachments/597951745/bg-illu-sigle-event-detail-agenda.svg");
background-position: bottom right;
background-repeat: no-repeat;
background-size: 100%;
}

@media screen and (max-width: 769px) {
  #event-detail-agenda { background-position: top right; background-size: 240%;}
}

#event-detail-agenda h2 { margin-bottom: 2.5rem;}

#event-detail-agenda .col-container { display: flex; justify-content: space-between; align-items: center !important; margin-bottom:2.125rem; padding-bottom: 2.125rem; border-bottom:1px solid #E3E6EB;}
#event-detail-agenda .col-container:last-child { margin-bottom:0; padding-bottom:0; border-bottom:none;}   
#event-detail-agenda .col-container .col-first { padding-right:1rem; width: 25%; font-size:18px; color: #001832;} 
#event-detail-agenda .col-container .col-second { width: 75%;}
#event-detail-agenda .col-container .col-second h3 { font-size:18px; font-family: Source Sans Pro SB; } 
#event-detail-agenda .col-container .col-second h3 span { display: block; margin-bottom:0.75rem; font-size: 1rem; line-height: 1; color: #5D24A4;} 
#event-detail-agenda .col-container .col-second p:last-child { margin-bottom:0; width: 90%} 

/*---SPEAKERS---*/
#event-detail-speakers { padding-top: 0rem;}

#event-detail-speakers h2 { margin-top:1rem; margin-bottom:0;}

#event-detail-speakers .speakers { text-align: center;}

#event-detail-speakers .speaker-img { margin-bottom:0;}
#event-detail-speakers .speaker-img img { width: 100px; height: 100px; border-radius: 50%;}

#event-detail-speakers .speaker-name { margin-bottom:-1rem; font-size: 18px !important;}
#event-detail-speakers .speaker-name span { display: block; font-size: 16px !important; color: #5E748E;}

#event-detail-speakers .expand-control {}
#event-detail-speakers .expand-control, #event-detail-speakers .expand-control-text { color: #842DB5 !important;}
#event-detail-speakers .expand-content { text-align:left; color: red !important;}

/*---FOOTER---*/
#event-detail-footer { padding-top: 0rem;
background-image: url("https://ec.europa.eu/digital-building-blocks/sites/download/attachments/597951745/event-detail-footer-shape.svg");
background-position: bottom left;
background-repeat: no-repeat;
background-size: 100%;
}
#event-detail-footer .container { border-top:1px solid #E3E6EB;}
#event-detail-footer .register-cta { margin-top:2.5rem; text-align: right;}
#event-detail-footer .social-media-cta { margin-bottom:1rem;} 

@media screen and (max-width: 769px) {
  #event-detail-footer { background-position: bottom left; background-size: 240%;}
}