Page History

/*--------------------------------------------------*/
/*---OOH PROJECTATONS OVERVIEW PAGE - 16-02-2023---*/
/*------------------------------------------------*/ 

#main-content p:empty { display: none;}
#main-content p span:empty { display: none;}  

/*---INTRODUCTION---*/
#introduction h1 { margin-bottom:2.5rem;} 
#introduction p { margin-bottom:0;} 
.introduction-illu { line-height:0 !important;} 
.introduction-illu img { width: 180px;}

@media screen and (min-width: 769px) {
  .introduction-illu img { width: 100%; max-width: 320px; height: auto;}
}  

/*---BENEFITS---*/ 
#benefits { background: #00284A;}
#benefits h2 { color: #FFF;} 
#benefits p { color: rgba(255, 255, 255, 0.75);}   
 
#benefits ul { display: flex; flex-wrap: wrap; margin-bottom:0; padding:0; list-style:none;}
#benefits ul li { flex-shrink: 2; position:relative; margin-top:1.5rem; padding:0 1rem 0 1.75rem; width: 50%; color: rgba(255, 255, 255, 0.75);}
#benefits ul li:before { content:''; display: block; position: absolute; top:2px; left:0; height: 20px; width: 20px; background: url("https://ec.europa.eu/digital-building-blocks/sites/download/attachments/645595199/ico-check-secondary.svg") no-repeat;}

@media screen and (min-width: 769px) {
  #benefits ul li { padding:0 3rem 0 1.75rem;}
}

/*---TEAMS AND ACTORS---*/
#teams-actors { border:1px solid red;}
.teams-actors-box { padding:5rem; background: #F3F4F7; border-radius: 60px;}
#teams-actors ul { display: flex; flex-wrap: wrap; margin-bottom:0; padding:0; list-style:none;}
#teams-actors ul li { flex-shrink: 2; padding:0 1rem30px; width: 25%; border-left:1px solid #E3E6EB;}
#teams-actors ul li:first-child { padding-left:0; border-left:none;}

/*---BOX CTA PROJECTATHON---*/
#box-cta-projectathon { position:relative;}
#box-cta-projectathon .projectathon-box { padding:1.5rem; background-color: #00284A; border-radius:20px;}
#box-cta-projectathon .container .cols { margin-bottom:-1rem;}
#box-cta-projectathon .projectathon-box-col-illu { margin-bottom:1rem;}
#box-cta-projectathon .projectathon-box-col-illu img { width: 120px; height:auto;}
#box-cta-projectathon h3, #box-cta-projectathon p { color: white;}
#box-cta-projectathon p.p-opacity { opacity: 0.75}
#box-cta-projectathon p:last-of-type { margin-bottom:0;}
/*hack - remove empty p from confluence*/
#box-cta-projectathon .container > p:first-child, #box-cta-events .container > p:last-child { display: none; border:1px solid green;}

@media screen and (min-width: 769px) {
 #box-cta-projectathon .projectathon-box { padding:2.5rem;}
 #box-cta-projectathon .projectathon-box-cols { display: flex; align-items: center;}
 #box-cta-projectathon .projectathon-box-col-illu { margin-bottom:0; padding:0 3rem 0 0}
}

@media screen and (min-width: 1366px) {
 #box-cta-projectathon .projectathon-box { padding:5rem;}
}