.ff-bubble-intro-container {
position: relative;
margin-top: 120px;
margin-bottom: 200px;
}
@media screen and (max-width: 781px) {
.ff-bubble-intro-container {
margin-top: 50px;
margin-bottom: 100px;
}
}
.ff-bubble-intro-container .ff-svg-container {
position: absolute;
top: 50%;
z-index: -1;
height: min(100vh, 730px);
width: 100%;
transform: translateY(-50%);
pointer-events: none;
}
.ff-bubble-intro-container .ff-svg-container svg {
mix-blend-mode: multiply;
}
.ff-bubble-intro-container .bubble-intro-content-wrapper {
display: block;
}
.ff-bubble-intro-container .bubble-intro-content-wrapper .bubble-intro-content {
padding-left: 50px;
padding-right: 50px;
}
@media (min-width: 1023px) {
.ff-bubble-intro-container .bubble-intro-content-wrapper .bubble-intro-content {
padding-left: 35px;
padding-right: 35px;
}
}
@media (max-width: 767px) {
.ff-bubble-intro-container .bubble-intro-content-wrapper .bubble-intro-content {
padding-left: 0;
padding-right: 0;
}
}
.ff-bubble-intro-container .bubble-intro-content-wrapper .bubble-intro-content p {
color: #66a2bc;
font-size: clamp(30px, 3.7vw, 50px) !important;
line-height: clamp(41px, 3.7vw, 61px) !important;
}
.ff-bubble-intro-container .bubble-intro-content-wrapper .bubble-intro-citation {
margin-left: 20%;
padding-top: 70px;
}
@media (max-width: 767px) {
.ff-bubble-intro-container .bubble-intro-content-wrapper .bubble-intro-citation {
margin-left: 0;
padding-top: 50px;
}
}
.ff-bubble-intro-container .bubble-intro-content-wrapper .bubble-intro-citation p {
color: #003c59;
font-size: clamp(26px, 3.7vw, 45px) !important;
line-height: clamp(29px, 3.7vw, 48px) !important;
font-family: "TiemannPro-Roman", serif;
font-weight: 500;
}
.ff-bubble-intro-container div.ff-svg-container .ff-citation-svg:nth-child(1) svg {
margin-top: 10vh;
}
@media screen and (max-width: 676px) {
.ff-bubble-intro-container div.ff-svg-container.without-subline .ff-citation-svg:nth-child(1) {
width: 100% !important;
}
.ff-bubble-intro-container div.ff-svg-container.without-subline .ff-citation-svg:nth-child(2) {
width: 100% !important;
}
.ff-bubble-intro-container div.ff-svg-container.without-subline .ff-citation-svg:nth-child(3) {
width: 100% !important;
}
}
@media screen and (max-width: 1400px) {
.ff-bubble-intro-container div.ff-svg-container .ff-citation-svg:nth-child(1) {
width: 75% !important;
}
}
@media screen and (max-width: 676px) {
.ff-bubble-intro-container div.ff-svg-container .ff-citation-svg:nth-child(1) {
width: 85% !important;
}
.ff-bubble-intro-container div.ff-svg-container .ff-citation-svg:nth-child(2) {
width: 110% !important;
top: -20% !important;
left: -14% !important;
}
.ff-bubble-intro-container div.ff-svg-container .ff-citation-svg:nth-child(3) {
width: 70% !important;
}
}