Div | |||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| |||||||||||||||||||||||||||||||
|
Div | ||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
| ||||||||||||
|
Div | ||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| ||||||||||||||||||||||||
|
Div | ||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
| ||||||||||||
|
Div | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Div | ||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| ||||||||||||||
|
Div | ||||
---|---|---|---|---|
| ||||
|
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-page-detail.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;} /*---PRESENTATION---*/ #event-detail-presentation { padding-top: 0rem;} /*Remove empty p of Confluence*/ #event-detail-presentation .col-4 > p:first-child, #event-detail-presentation .col-4 > p:last-child { display: none; border:1px solid red;} #event-detail-presentation .card-grid { text-align: center;} #event-detail-presentation .card-grid-body p img { margin:0 auto 0.5rem auto; display: block;} /*---FOOTER---*/ #event-detail-footer { padding-top: 0rem; padding-bottom: 3rem; /* 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;} #event-detail-footer .social-media-cta { margin-bottom:1rem;} /* @media screen and (max-width: 769px) { #event-detail-footer { background-position: bottom left; background-size: 240%;} } */ |
CSS Stylesheet |
---|
/*---BOX CTA EVENTS---*/ #box-cta-projectathon-playbook { padding-top:0;} /*hack - remove empty p from confluence*/ #box-cta-projectathon-playbook > p:first-child , #box-cta-projectathon-playbook > p:last-child { display:none; border:1px solid red;} #box-cta-projectathon-playbook .container { position: relative; padding: 3rem 2.5rem; background-color: #00284A; border-radius: 20px;} #box-cta-projectathon-playbook h3 { color: white;} #box-cta-projectathon-playbook p { margin-top:0.75rem; color: white; opacity:0.75;} #box-cta-projectathon-playbook p:last-child { margin-bottom:0; opacity:1;} @media screen and (min-width: 769px) { #box-cta-projectathon-playbook .container { padding: 6.25rem 5rem;} #box-cta-projectathon-playbook .col-10 { padding-left: 2rem;} } |