Monitoring

...

Content Layer

background-repeat	no-repeat
background-size	cover
id	1130511694
background-image	bg-dotted-monitoring.png
class	cef cef-section cef-primary-bg cef-img-parallax

Content Column

width	100%
id	1130511695

Content Block

id	1130511696

Div

class	cef-container

Div

class	cef-row

Div

class	cef-col-12

HTML
<h2>CEF Telecom<h2>Telecom Guidelines</h2>

Div

class	cef-row

Div

class	cef-col-12

HTML
<h3 class="cef-secondary-color cef-mt-5">Specific objectives</h3>

Div

class	cef-row cef-justify-content-center

Div

class	cef-col-6 cef-mt-4

HTML

<h3 class="cef-secondary-heading-deco">Economic growth</h3>
<p class="cef-mb-0">Economic growth and support to the completion and functioning of the internal market in support of the competitiveness of the European economy, including small and medium-sized enterprises (SMEs).</p>

Div

class	cef-col-6 cef-mt-4

HTML

<h3 class="cef-secondary-heading-deco">Improvements in daily life</h3>
<p class="cef-mb-0">Improvements for citizens, businesses and public authorities through the promotion of broadband networks, interconnection and interoperability of national, regional and local broadband networks, as well as non-discriminatory access to such networks and digital inclusion.</p>

Div

class	cef-row

Div

class	cef-col-12 cef-mt-5

HTML
<h3 class="cef-secondary-color">Operational priorities</h3>

Div

class	cef-row cef-justify-content-center

Div

class	cef-col-6 cef-mt-4

HTML

<h3 class="cef-secondary-heading-deco">Trans-European digital services</h3>
<p class="cef-mb-0">Interoperability, connectivity, sustainable deployment, operation and upgrading of trans-European digital service infrastructures, as well as coordination at European level.</p>

Div

class	cef-col-6 cef-mt-4

HTML

<h3 class="cef-secondary-heading-deco">Broadband networks</h3>
<p class="cef-mb-0">Efficient flow of private and public investments to stimulate the deployment and modernisation of broadband networks to contribute to the achievement of the broadband targets of the Digital Agenda for Europe.</p>

CSS Stylesheet

/*EBSI INTRODUCTION ILLUSTRATION*/
/*------------------------------*/
.ebsi-introduction-illu img { margin-top:10px;}

/*EBSI INTRODUCTION TEXT*/
/*----------------------*/
.ebsi-introduction-text .lead { margin-bottom:30px;}
.ebsi-introduction-text .first-letter p::first-letter { font-size: 300%;}

/*EBSI KEY FIGURE*/
/*---------------*/
.ebsi-key-figure {text-align:center;}
.ebsi-key-figure .cef-equal-height-column { width:48%; background-color: rgba(0,0,0,0.1); border-radius: 10px;}
.ebsi-key-figure .cef-equal-height-content { padding:20px; background-color: rgba(0,0,0,0.5); border-radius: 10px;}
.ebsi-key-figure h2, .ebsi-key-figure p {color:white;}
.ebsi-key-figure h2 { margin-bottom:30px;}
.ebsi-key-figure h3 { color:#ffd417; line-height:1;}
.ebsi-key-figure p { margin-top:0;}

/*EBSI CASE*/
/*---------*/
.ebsi-case .cef-equal-height-container { margin-top:30px;}
.ebsi-case .cef-equal-height-column { width:48%; background-color: rgba(255,255,255,0.4); border-radius: 10px;}
.ebsi-case .cef-equal-height-content { padding:20px; height:310px; background-color: rgba(255,255,255,0.8); border-radius: 10px;}
.ebsi-case img { width:120px;}
.ebsi-case h3 { margin-top:0;}
.ebsi-case h3:after { display:block; margin-top:30px; margin-bottom:30px; content:""; width:25px; height:5px; background-color: #ffd417;}

@media only screen and (max-width: 768px) {
	.ebsi-case .cef-equal-height-content { height:440px;}
}
@media only screen and (max-width: 574px) {
	.ebsi-case .cef-equal-height-content { height:auto;}
}

/*EBSI WORKING*/
/*------------*/
.ebsi-working img { margin-top:30px;}

/*EBSI BENEFIT*/
/*------------*/
.ebsi-benefit {text-align:center;}
.ebsi-benefit .cef-equal-height-column { width:53%; background-color: rgba(0,0,0,0.1); border-radius: 10px;}
.ebsi-benefit .cef-equal-height-content { padding:20px; height:340px; background-color: rgba(0,0,0,0.5); border-radius: 10px;}
.ebsi-benefit h2, .ebsi-benefit h3, .ebsi-benefit p {color:white;}
.ebsi-benefit h2 { margin-bottom:30px;}
.ebsi-benefit h3 { margin-top:10px;}
.ebsi-benefit h3:after { display:block; margin:30px auto; content:""; width:25px; height:5px; background-color: #ffd417;}
.ebsi-benefit img { width:100px;}

@media only screen and (max-width: 768px) {
	.ebsi-benefit .cef-equal-height-content { height:420px;}
}
@media only screen and (max-width: 574px) {
	.ebsi-benefit .cef-equal-height-content { height:auto;}
}

/*EBSI COME FROM*/
/*--------------*/
.ebsi-come-from h2 { margin-bottom:30px;}
.ebsi-come-from h3:after { display:block; margin-top:30px; margin-bottom:30px; content:""; width:25px; height:5px; background-color: #ffd417;}

/*EBSI CALL TO ACTION*/
/*-------------------*/
.ebsi-call-to-action { text-align:center;}
.ebsi-call-to-action h2 { margin-bottom:30px; color: white;}
@media only screen and (max-width: 574px) {
	.ebsi-call-to-action { text-align:left;}
}
.form-ebsi-subscribe { font-family: 'Source Sans Pro', sans-serif;}
.form-ebsi-subscribe h2 { margin:30px 0 0 0 !important;} 
.form-ebsi-subscribe .easyforms-container { margin:0; border:none;}
.form-ebsi-subscribe .easyforms-header, .form-ebsi-subscribe .easyforms-footer {background-color: transparent;}
.form-ebsi-subscribe .easyforms-title { display:none !important;}
.form-ebsi-subscribe form.aui .field-group { padding: 0;}
.form-ebsi-subscribe form.aui .field-group > label { float: none; margin: 0 10px 0 0; padding: 0; font-size: initial; color: white;}
.form-ebsi-subscribe form.aui input.text { padding:10px 5px; width: 300px; height:auto; font-size: initial; border:3px solid white; border-radius: 0;}
.form-ebsi-subscribe form.aui input.text:focus { border-color:#f8cc02; box-shadow: none; -webkit-box-shadow: none; outline: none;}
.form-ebsi-subscribe form.aui .buttons-container { margin: 0; padding: 0;}
.form-ebsi-subscribe form.aui input.button { margin-top:30px; padding:10px 12px; min-width: 140px; height:auto; font-size:16px; text-transform: uppercase; letter-spacing: 1px; background-color: #f8cc02 !important; border-color:#f8cc02; border-radius: 0;}
.form-ebsi-subscribe form.aui input.button:hover { text-decoration: underline; background-color:#FFE570 !important;}

/*VALIDATION*/
.form-ebsi-subscribe form.aui .icon-required::before { font-size: initial; color: #F9786C;}
.form-ebsi-subscribe .easyforms-form input.parsley-error { border:3px solid #F9786C !important;}
.form-ebsi-subscribe .easyforms-form .parsley-errors-list { margin: 0;}
.brikit-canvas ul.parsley-errors-list li {color:#F9786C;}

/*CONFIRMATION*/
.form-ebsi-subscribe .aui-message.success { background: #f8cc02;; border-color: #f8cc02; border-radius: 0;}
.form-ebsi-subscribe .aui-message.success::after { content: "";}
.form-ebsi-subscribe .aui-message p.title { color: #003764;}
.form-ebsi-subscribe .easyforms-submitted-header { color: #003764;}

/*EBSI MILESTONE*/
/*--------------*/
.ebsi-milestone h2 { margin-bottom: 30px;}
.ebsi-milestone .timeline { display:none;}
.ebsi-milestone img { display:block;}

@media only screen and (max-width: 574px) {
	.ebsi-milestone img { display:none;}
	.ebsi-milestone .timeline { display:block;}
}

/*EBSI SERVICE*/
/*------------*/
.ebsi-service .cef-equal-height-container { margin-top:30px;}
.ebsi-service .cef-equal-height-column { width:32%; background-color: rgba(255,255,255,0.4); border-radius: 10px;}
.ebsi-service .cef-equal-height-content { padding:20px; height:440px; background-color: rgba(255,255,255,0.8); border-radius: 10px;}
.ebsi-service h3:after { display:block; margin-top:30px; margin-bottom:30px; content:""; width:25px; height:5px; background-color: #ffd417;}

@media only screen and (max-width: 768px) {
	.ebsi-service .cef-equal-height-content { height:600px;}
}
@media only screen and (max-width: 574px) {
	.ebsi-service .cef-equal-height-content { height:auto;}
}

/*GRID*/
/*----*/
@media only screen and (max-width: 574px) {
.colwrapper { margin-bottom:30px; padding-left:0; padding-right:0;}
.empty-column { display:none;}
}
/*TYPOGRAPHY*/
/*----------*/
.display-1 { font-size: 6rem; font-weight: 300; line-height: 1.2;}
.display-2 { font-size: 5.5rem; font-weight: 300; line-height: 1.2;}
.display-3 { font-size: 4.5rem; font-weight: 300; line-height: 1.2;}
.display-4 { font-size: 3.5rem !important; font-weight: 300; line-height: 1.2;}
.wiki-content h1, .brikit-content-layers .h1, .brikit-content-layers .h1:first-child { font-size: 3.157em; line-height: 1.2;}
.wiki-content h2, .brikit-content-layers .h2, .brikit-content-layers .h2:first-child { font-size: 2.369em; line-height: 1.2;}
.wiki-content h3, .brikit-content-layers .h3, .brikit-content-layers .h3:first-child { font-size: 1.777em; line-height: 1.2;}
.wiki-content h4, .brikit-content-layers .h4, .brikit-content-layers .h4:first-child {font-size: 1.333em; line-height: 1.2;}

.blog-blockquotes h2, .brikit-canvas p { line-height:1.4em;}

@media only screen and (max-width: 574px) {
	.wiki-content h1, .brikit-content-layers .h1, .brikit-content-layers .h1:first-child { font-size: 2.5em;}
	.wiki-content h2, .brikit-content-layers .h2, .brikit-content-layers .h2:first-child { font-size: 1.8em;}
	.wiki-content h3, .brikit-content-layers .h3, .brikit-content-layers .h3:first-child, .blog-blockquotes h2 { font-size: 1.4em;}
	.blog-blockquotes h2 { font-size: 1.4em !important;}
	.wiki-content h4, .brikit-content-layers .h4, .brikit-content-layers .h4:first-child {font-size: 1.1em;}
}

/*UTILITIES*/
/*---------*/

/*EQUAL HEIGHT COL*/
.cef-equal-height-container { display: table; width: 100%;}
.cef-equal-height-column { float:none; display: table-cell; vertical-align:top;}
.cef-equal-height-empty-column { float:none; display: table-cell; width:15px;}
.cef-equal-height-content { margin:20px;}

@media only screen and (max-width: 574px) {
  .cef-equal-height-column { margin-bottom:15px; display: inline-block; width: 100% !important;}
  .cef-equal-height-empty-column { display:none;}
}

/*TIMELINE*/
.timeline * { box-sizing: border-box;}
.timeline { margin: 0 auto; position: relative;}
.timeline::after { margin-left: -3px; position: absolute; top: 0; left: 50%; bottom: 0; content: ''; width: 6px; background-color: #eee;}

.timeline-year { padding:20px; text-align:center; background-color: #eee; border-radius: 10px;}

.timeline-container { position: relative; padding: 10px 40px; width: 50%;}
.timeline-container.step-point::after { z-index: 1; content: ''; position: absolute; top: 0; right: -17px; width: 35px; height: 35px; border-radius: 50%;}
.step-point-first-color::after { background-color: #003666;  border: 4px solid #0076c7;}
.step-point-second-color::after { background-color: #ffd417; border: 4px solid #0076c7;}

.timeline-container.timeline-right.line-second-color::before {margin-left: 6px; position: absolute; top: 0; left: 0; bottom: 0; content: ''; width: 6px; background-color: #ffd417;}
.timeline-container.timeline-left.line-second-color::before {margin-right: -12px; position: absolute; top: 0; right: 0; bottom: 0; content: ''; width: 6px; background-color:#ffd417;}

.timeline-left { left: 0;}
.timeline-right { left: 50%;}

.timeline-left::before { z-index: 1; position: absolute; top: 22px; right: 30px;}
.timeline-right::before { z-index: 1; position: absolute; top: 22px; left: 30px;}
.timeline-right::after { left: -16px;}

.timeline-content { padding-bottom:20px; position: relative; background-color: white;}

@media only screen and (max-width: 574px) 
{ 
.timeline::after { left: 15px;}
.timeline-container { width: 100%;}
.timeline-right { left: 5%;}  
.timeline-container.timeline-left.line-second-color::before { left: 0; margin-left: 23px;}
}

.horizontal-align { margin:0 auto; float:none;}
.text-center { text-align:center;}
.clearfix { width:100%; overflow: auto;}  
.clearfix::after { content: ""; clear: both; display: table;}  
.img-responsive { max-width: 100%; height: auto;}  
.text-half-size { font-size:50%;} 

/*SPECIFIC STYLE FOR THIS PAGE*/
/*----------------------------*/

.brikit-footer-backdrop {margin-top: 0;}

.aui-button.action-button { color:#141F3E; background-color:#f8cc02 !important; -webkit-transition: 0.3s; transition: 0.3s;}
.aui-button.action-button:hover { text-decoration: underline; background-color:#FFE570 !important;}

...

Page tree

Versions Compared

Old Version 93

New Version 94

Key