Page History

...

Div

id	event-detail-description
class	section

Div

class	container

Div

class	cols

Html-bobswift

<div class="col-9">

<h2>Description</h2>

<p>The objective of the first Implementers Café is to provide participants with 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 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 OOTS implementation.</li>
<li>Implementers Cafés have a thematic approach to prepare and check your readiness for the different aspects of the Connectathon and the Connectathon process.</li>
</ul>

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

</div>

...

Div

id	event-detail-footer
class	section

Div

class	container

Div

class	cols

Div

Html-bobswift
<p class="register-cta"><a class="btn primary" target="_blank" href="#"><span>Register for this event</span></a></p> <p>Don’t forget to follow us to keep up to date with the latest news.</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;}

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

Page tree

Versions Compared

Old Version 71

New Version 72

Key