...
| HTML |
|---|
<style>
.bg-top-curve {
background-image: url("https://ec.europa.eu/digital-building-blocks/sites/download/attachments/609583364/bg-curve-node.svg");
background-position: right bottom;
background-repeat: no-repeat;
background-size: contain;
}
.whats-in-it-for-you-curve-top {
background: linear-gradient(
84.61deg,
#00b3ef -13.37%,
#004494 33.79%,
#004494 65.57%,
#ff0179 115.49%
) !important;
}
#main-content .mb-24 {
margin-bottom: 24px !important;
}
#main-content .mb-128 {
margin-bottom: 128px !important;
}
#choose-a-domain > div:nth-child(3) > .cols > div > ul {
padding-left: 20px;
}
#main-content .btn,
#main-content .btn span {
font-weight: 600;
}
#ebsi-node-network .col-5 {
padding-right: 0;
}
#ebsi-node-network .col-5 .btns,
#ebsi-node-network .col-5 .btns a.btn {
margin-bottom: 0;
}
#ebsi-node-operator-introduction .btn {
font-weight: 600;
}
#ebsi-node-operator-introduction .col-5 {
box-sizing: content-box;
}
#ebsi-become-node-operator .col-6 {
max-width: 500px; box-sizing: content-box;
}
#ebsi-become-node-operator h2 {
font-size: 40px;
}
#ebsi-node-operator-introduction .outline .ico-arrow-south {
background: url("https://ec.europa.eu/digital-building-blocks/sites/download/attachments/468026266/ico-arrow-south-primary.svg")
left no-repeat !important;
}
.blue-container{
border-radius: 16px;
padding: 40px;
display: flex;
flex-direction: column;
gap: 40px;
background-color: #E6F7FD;
}
.blue-container >div> .h4:first-of-type{margin-bottom: 20px;}
.blue-container >div> p:first-of-type{margin-top: 20px;}
@media screen and (max-width:768px){
.blue-container > p .btn.secondary{align-items: center;}
.blue-container > p .btn.secondary >span:first-child{max-width: 80%;}
}
/* CARDS */
.section-cards-container {
display: flex;
flex-direction: column;
gap: 1rem;
margin-left: 1rem;
}
.section-cards-container .card-grid {
margin: 1rem;
}
.section-cards-container_endorsment {
display: flex;
flex-direction: row;
gap: 1rem;
margin-left: 0.2rem;
}
.section-cards-container_endorsment div {
min-height: 44px;
}
.section-cards-container_alreadyano {
display: flex;
flex-direction: column;
align-items: center;
}
.section-cards-container_alreadyano h3 {
text-align: center;
}
.container-alreadyano_content {
display: flex !important;
gap: 1rem;
z-index: 10;
}
.container-alreadyano_content > div {
max-width: 392px; padding:1rem;
}
.container-alreadyano_content .card-grid-body {
display: flex;
flex-direction: column;
justify-content: space-between;
}
.container-alreadyano_content .card-grid-footer {
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 10px;
}
#already-a-node-operator .card-grid h4{font-weight:600;}
.card-grid {
min-height: 240px;
}
.card-grid-body {
padding: 24px;
}
.card-grid-body > p:first-child {
display: none;
}
.card-grid-body > p:last-child {
display: none;
}
.card-grid-header {
display: flex;
flex-direction: row;
gap: 11px;
align-items: center;
margin-bottom: 16px;
}
.card-grid-header p {
margin: 0;
}
/* injected */
@media screen and (min-width: 769px) {
#main-content .section {
padding: 100px 108px;
}
#main-content .section:last-of-type {
padding: 80px 108px;
}
}
@media screen and (max-width: 820px) {
.container-alreadyano_content {
flex-direction: column !important;
}
}
@media screen and (max-width: 890px) {
.section-cards-container_endorsment {
flex-direction: column !important;
}
.section-cards-container_endorsment > div {
width: -webkit-fill-available !important;
min-height: auto !important;
}
}
@media screen and (max-width: 690px) {
.case-family_tabs {
height: auto;
flex-direction: column;
}
.case-family_tabs li {
width: -webkit-fill-available !important;
}
}
@media screen and (min-width: 1117px) {
.case-family_tabs li:hover,
.case-family_tabs li:active {
background: #ffb3d7;
border-radius: 16px;
color: white;
padding: 16px 40px;
}
}
/* -- restricted link label -- */
.restricted-access {
display: inline-block !important;
/* margin-left: 24px; */
position: relative;
color: #776e85;
}
.restricted-access:before {
position: absolute;
top: 0;
left: -24px;
content: "";
width: 20px;
height: 20px;
background: url("https://ec.europa.eu/digital-building-blocks/sites/download/attachments/468026266/ico-lock-darkpurple.svg")
right no-repeat;
background-size: 14px;
}
#read-the-requirements .list-numeral li span {
font-size: 32px;
margin-left: 10px;
font-weight: 500;
}
#read-the-requirments .list-numeral li::before {
}
#read-the-requirements .container > div {
display: flex;
flex-direction: column;
}
#read-the-requirements {
padding-bottom: 5rem;
padding-left: 1.5rem;
padding-right: 1.5rem;
margin-top: 1.5rem;
}
#requirments-to-join .list-numeral li span {
font-size: 32px;
margin-left: 10px;
font-weight: 500;
}
#requirments-to-join .justify-content-around {
padding-bottom: 1.5rem;
}
#requirments-to-join h2 {
font-size: 40px;
}
.header-requirments-to-join {
padding-top: 0px !important;
padding-bottom: 0px !important;
}
.remove-unused-list {
visibility: hidden;
margin: 0px;
}
#pilot-environment {
border-left: 2px solid #99e1f9;
}
#pilot-environment .col-9{
box-sizing: content-box;
}
#pilot-environment > div {
padding-left: 2.5rem;
}
#pilot-environment > div:first-child {
padding-top: 0px;
}
#pilot-environment {
display: flex;
flex-direction: column;
margin-left: 0.2rem;
}
#get-endorse {
border-left: 2px solid #99e1f9;
}
#get-endorse > div {
padding-left: 2.5rem;
}
#get-endorse > div:first-child {
padding-top: 0px;
}
#get-endorse {
display: flex;
flex-direction: column;
margin-left: 0.2rem;
}
.case-family_tabs ul {
list-style: none;
}
.case-family_tabs li {
display: flex;
align-items: center;
justify-content: center;
list-style: none;
height: 72px;
cursor: pointer;
}
.case-family_tabs li:first-child {
width: 203px;
}
.case-family_tabs li:last-child {
width: 375px;
}
.case-family_tabs a {
text-decoration: none;
color: black;
text-align: center;
line-height: 1;
}
.case-family_tabs {
display: flex;
max-width: 595px;
justify-content: space-between;
align-items: center;
padding: 8px;
border-radius: 20px;
list-style: none;
background: #f6f5f7;
}
.case-family_tabs .active {
background: #cd1d8b;
display: flex;
align-items: center;
border-radius: 16px;
color: white;
padding: 16px 40px;
font-weights: 600;
}
.case-family_tabs .active a {
color: white;
}
.case-family_tabs > ul > li:hover {
background: #ffb3d7;
border-radius: 16px;
color: white;
padding: 16px 40px;
width: 275px;
height: 72px;
}
.whats-in-it-for-you-curve-top > p > img {
position: absolute;
top: -1px;
left: -1%;
width: 102%;
}
.whats-in-it-for-you-curve-top {
z-index: 1;
margin-top: -1rem;
position: relative;
}
#whats-in-it-for-you {
display: flex;
flex-direction: column;
justify-content: center;
}
#whats-in-it-for-you p {
color: #fff;
}
#whats-in-it-for-you h3 {
color: #fff;
}
#whats-in-it-for-you_image {
margin-top: 5rem;
}
#whats-in-it-for-you_image p {
margin: 0 !important;
}
#whats-in-it-for-you_image img {
width: 90%;
}
#request-a-node-content > div:first-child {
padding-left: 2.5rem;
}
#request-a-node .list-numeral li span {
font-size: 32px;
margin-left: 10px;
font-weight: 500;
color: #fff;
}
#request-a-node p {
color: #fff;
}
#reaquest-a-node h2 {
color: #fff;
}
#request-a-node .list-numeral li::before {
color: #fff !important;
}
#request-a-node .container > div {
display: flex;
flex-direction: column;
}
#request-a-node {
padding-left: 1.5rem;
padding-right: 1.5rem;
}
#request-a-node-content > div > p:first-child {
margin: 0px;
}
#request-a-node-content > div > p:nth-child(2) {
margin-bottom: 2rem;
}
#request-a-node-content > div > p:nth-child(3) {
margin-bottom: 5rem;
}
#request-a-node-content .card-grid {
width: 32%;
min-width: 145px !important;
min-height: 290px !important;
display: flex;
flex-direction: column;
justify-content: space-around;
}
#request-a-node-content .card-grid-footer {
display: flex;
justify-content: end;
}
#request-a-node-content .justify-content-around {
margin-top: 3rem;
}
#request-a-node-content .card-grid-text p {
color: #000;
}
#request-a-node-content > div > p:nth-child(2) {
max-width: 770px;
font-size: 18px;
line-height: 28px;
}
#get-endorse
> div:nth-child(2)
> div.cols.section-cards-container_endorsment.pilot-env {
margin-bottom: 0;
}
#get-endorse > div:nth-child(2) {
padding-bottom: 0;
}
#service-disabled_banner {
background: #ffe6f2;
padding: 1rem;
}
.service-disabled_container {
display: flex !important;
flex-direction: row;
align-items: center;
gap: 1.75rem;
}
.service-disabled_content > p:nth-child(2) {
margin-bottom: 4px;
}
.service-disabled_img > p {
margin: 0px;
}
.btn {
align-items: center;
}
</style> |
...