Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

CSS Stylesheet
.home-intro { position: relative; min-height:65vh; }
.home-intro-wrapper {  display: flex; align-content: center; align-items: center; min-height:65vh; background: #014494;}
.sandbox-header-im { position: absolute; width: 100%; height: 100%; object-fit: cover; opacity: 0.4;}
.home-intro-content { position: relative; margin:0 auto; width:90%; text-align: center;}
.home-intro-content h1 { margin-top:1rem; margin-bottom:2rem; font-size:38px; line-height: 1}
.home-intro-content h1 span {font-size: 38px; display:block; margin:0.5rem 0 0 0; font-weight: normal;}
.home-intro-content p.lead { margin:0.5rem 0 0 0; font-size:18px;}
.home-intro-content .btn { margin:2rem 0 0 0;}
.home-intro-content h1, .home-intro-content p { color: white;}
.home-introduction-sb { background: url("https://ec.europa.eu/digital-building-blocks/sites/download/attachments/640548876/sandbox-bg-curve-intro.svg") no-repeat;
background-position: top right; background-position-y: 200%;}

.section-get-started { text-align: center;  }
.section-get-started-box { position:relative; padding:1.5rem 3rem; box-shadow: 0px 4px 20px rgba(0, 55, 100, 0.1); border-radius: 16px;}


.about-the-project { background: url("https://ec.europa.eu/digital-building-blocks/sites/download/attachments/640548876/sandbox-bg-oval.svg?api=v2") no-repeat; background-position-y: 30%; background-position-x: 90%; }

.apply-now { background: linear-gradient(270deg, #BC3588 -22.05%, #17458F 41.52%, #3682C2 100%); padding-top: 5rem; padding-bottom: 6rem;}
.apply-now h3 { color: white; }
.apply-now p { color: white; }


/*--- HOME FAQ ---*/
.home-faq { padding-bottom:4rem;}
.home-faq .cols { z-index: 6; position: relative;}
.home-faq h2 { margin-bottom:3rem;}
.home-faq .btn { margin-top:2rem;}



/*--- MACRO SLIDER BY DEFAULT ---*/
.slider-default { position:relative; z-index:10; }
.slider-default .flickity-enabled { background-color: transparent; box-shadow:none;}
.slider-default .flickity-enabled.is-draggable { box-shadow:none;}
.slider-default .news-slider-root > div { padding:0;}
.slider-default .aui-item > div { margin:0; padding:0;}
.slider-default .aui-item { display:inline-block; padding:0 15px 10px 15px;}
.slider-default .aui-group>.aui-item { padding-top:0; padding-top:1rem; padding-bottom:0; width: 100%;}
.slider-default .aui-group>.aui-item+.aui-item { padding:0; width: 100%;}
.slider-default > ul { list-style: none; margin: 0; padding: 0;}
/*heading*/
.slider-default h2:first-child { display: none;}
/*arrow*/ 
.slider-default .flickity-button { top:38% !important; background-color: #fff !important; border:1px solid #CD1D8B; border-radius:8px !important;}
.slider-default .flickity-button:hover { background-color: #FFE7F2 !important;}
.slider-default .flickity-button:focus {  outline: 2px dashed black; outline-offset: 2px; box-shadow: none;} 
.slider-default .flickity-prev-next-button .flickity-button-icon { left: 30%; top: 30%; width: 40%; height: 40%; fill: rgb(205, 29, 139) !important;} 
.slider-default .flickity-prev-next-button.previous { left: -15px;}
.slider-default .flickity-prev-next-button.next { right: -15px;} 
/*dots*/
.slider-default .flickity-page-dots { position:relative; margin-bottom: 0; top:1rem !important; height:1rem; text-align: center !important;}
.slider-default .flickity-page-dots .dot { opacity: 1; height: 12px; width:12px; background: #CD1D8B !important; border:1px solid #CD1D8B;}
.slider-default .flickity-page-dots .dot.is-selected { height: 12px; width:48px; background: #CD1D8B !important; border:1px solid #CD1D8B; border-radius:10px;}
.slider-default .flickity-page-dots .dot:focus { outline: 2px dashed black; outline-offset: 2px;}
.slider-default .col-4 { padding-left: 0px; padding: right: 0px; }
.slider-default .card-grid-body { display: flex; flex-direction: column; justify-content: space-evenly; }

@media screen and (min-width: 1280px) {
  .slider-default .flickity-prev-next-button.previous { left: -50px;}
  .slider-default .flickity-prev-next-button.next { right: -50px;}
}




/*--- HOME SS SLIDER BY DEFAULT ADD ON ---*/
.ss-carroussel { position:relative; padding-top:0; padding-bottom:0; z-index: 10;}
.ss-carroussel .slider-default { margin-top:1rem;}
/*hack*/
.ss-carroussel .slider-default > p:last-child { display: none;}
/*arrow*/
.ss-carroussel .slider-default .flickity-button { background-color: rgba(205, 29, 139, .3) !important;; border:1px solid #FFF;}
.ss-carroussel .slider-default .flickity-button:hover { background-color: #CD1D8B !important;}
.ss-carroussel .slider-default .flickity-prev-next-button .flickity-button-icon { fill: rgb(255, 255, 255) !important;}

@media screen and (min-width: 1280px) {
  .ss-carroussel .slider-default .flickity-button { background-color: transparent !important; border:1px solid #FFF;}
}  

/*wave top*/
.success-stories-curve-top { z-index:2; position: absolute; left: 0; right: 0; height: 100%; margin-top: 7.7rem;}
.success-stories-curve-top p { margin:0;} 
.success-stories-curve-top img {width: 103%;}
/*wave bottom*/ 
.success-stories-wave-bottom { overflow: hidden; z-index:1; position:relative; height:10rem; background-color: #E5F7FE; margin-top: 4.5rem;}
.success-stories-wave-bottom p { margin:0;} 
.success-stories-wave-bottom img { position:absolute; bottom:0; left:-1%; width: 102%;}  


#ss-become-a-pilot { position: relative; z-index: 1000; padding-top: 4rem; }
#ss-become-a-pilot h3 { color: white; }
#ss-become-a-pilot p { color: white; }
#ss-become-a-pliot span { color: white; }


#ss-bg-section {  position:relative; height:8rem;}
#ss-bg-section p { margin: 0; }
#ss-bg-section img { position: absolute; top: -216px; right: -128px; z-index: 10;}

#ss-bg-section-dec {  position:relative; height:8rem; z-index:1;}
#ss-bg-section-dec p { margin: 0; }
#ss-bg-section-dec img { position: absolute; top: -391px; right: -128px;}

.bg-gradient { background: linear-gradient(270deg, #BC3588 -22.05%, #17458F 41.52%, #3682C2 100%)!important; }
.sandbox-footer-section-s-block { display: flex; justify-content: center; }
.sandbox-footer-section-t-block { display: flex; justify-content: end; }







#ss-bg-section-dec-test { display: none; position: relative; margin-top: -15.5rem;  }
#ss-bg-section-dec-test img { max-width: 110%!important;}


.sb-testing { position: absolute; top: 155px; left: 0; width: 100%; min-width: fit-content; min-height: fit-content;}

.test0image { margin-top: -13rem; }

#ss-become-a-pilot { padding-top: 1rem; padding-bottom: 5rem; }


@media screen and ( max-width: 768px ) {
	.sandbox-footer-section-f-block { display: flex!important; flex-direction: column; gap: 1rem; align-items: center; }
	.sandbox-footer-section-t-block { justify-content: center; }
	.test0image { position: absolute; }
	.sb-testing { top: unset; z-index: 10; bottom: 0; }
	.about-the-project { background-position-y: 100%!important; background-position-x: unset!importanta; }
}

@media screen and ( max-width: 500px ) {
	.test0image { margin-top: -7rem; }
}

@media screen and (min-width: 1700px ) {
	#ss-become-a-pilot { padding-top: 10rem; }
}

#sb-footer { padding-top: 8rem; }