Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
CSS Stylesheet
/*-------------------------------------------------------*/
/*---OOH COMMON AND SUPPORTTING SERVICES - 17-11-2022---*/
/*-----------------------------------------------------*/
.hack-remove-p > p:first-child, 
.hack-remove-p > p:last-child { display:none; border:1px solid red;}

@media screen and (max-width: 769px) {
  .img-mobile { width: 180px;}
  .remove-on-mobile { display:none !important;}
}  

@media screen and (max-width: 1200px) {
  .not-d-block-mobile  { display:inline !important;}
}

/*---INTRODUCTION---*/
/*HACK INTRODUCTION ILLU SIZE*/
#introduction { padding-top:3rem; padding-bottom:3rem;}  
#introduction h1 { margin-bottom:2.5rem;}
#introduction h1 span { font-size: 1rem; line-height: 24px;}  
#introduction p { margin-bottom:0;}
/*hack - remove empty p from confluence*/
#introduction p:first-child ,#introduction p:last-child { display:none; border:1px solid red;}

/*---SERVICES---*/
#services { background: #00284A;}
#services h2, #services h3, #services p { color: white;}
#services .card-grid { padding: 0; background: transparent;}
#services .col-separator-before:before, 
#services .col-separator-after:after { border-left:1px solid rgba(255, 255, 255, 0.12);}  
#services .opacity-75 { opacity: 0.75;}
#services .opacity-50 { opacity: 0.50;}
#services .badge { margin-bottom:0.5rem; color: #995E00; background: #FFEECC;}
/*HACK remove empty p from Confluence*/
#services .col-4 > p:first-child { border:1px solid green; display: none;}

@media screen and (min-width: 769px) {
  #services { padding-bottom:6rem;}
  #services .card-grid-body p:last-child { margin-bottom:0;}
}

/*---SUPPORTING SERVICES---*/
#supporting-services {
background-image: url("https://ec.europa.eu/digital-building-blocks/sites/download/attachments/615481586/bg-illu-sigle-supporting-services.svg");
background-position: bottom right;
background-repeat: no-repeat;
}
#supporting-services .cols:last-child { margin-top:-3rem;}
#supporting-services h2 { margin-bottom:2.5rem;}
#supporting-services hr { margin:2rem 0 3rem 0; border:none; border-top:1px solid #E3E6EB; height: 1px;}

@media screen and (min-width: 769px) {
  .supporting-services-container { display: flex; justify-content: space-between;}
  .supporting-services-container p:first-child { width: 70%;}
  .supporting-services-container p:last-child { width: 30%; text-align: right;}
  .supporting-services-container .btn { margin-left:1rem;}
}

/*---SERVICE DESK---*/
#service-desk { padding-top: 0;}
#service-desk .service-desk-cta { margin-top: 2.5rem; margin-bottom:0;}
Div
idintroduction
classsection
Div
classcontainer
Div
classcols justify-content-between align-items-center
Div
classcol-7
Html-bobswift
<h1>Common<h1><span class="d-block text-primary">Common and Supporting</span>Common and Supporting<br> services</h1>
<p>To provide comprehensive support and proper exchange of evidence between Data Services and Online Procedure Portals, the Once-Only Technical System uses Once-Only common services and additional supporting services.</p>
Div
classcol-4
HTML Image
srchttps://ec.europa.eu/digital-building-blocks/sites/download/attachments/615481586/illu-introduction.png
altillustration Once Only Technical System (OOTS)
classimg-fluid img-mobile

...