Cta Section 

<div class="cta-section">
    <h2>Kein passender Termin dabei?</h2>
    <p class="standalone">Gerne bieten wir Ihnen einen gesonderten Termin an!</p>
    <a class="btn btn--cta" data-label="Termin anfragen" href="#">Termin anfragen</a>
    <p class="display small"> 1 weiterer Termin verfügbar</p>
</div>

<div class="cta-section cta-section--dark-bg">
    <h2>Kein passender Termin dabei?</h2>
    <p class="standalone">Gerne bieten wir Ihnen einen gesonderten Termin an!</p>
    <a class="btn btn--cta btn--cta--inverted" data-label="Termin anfragen" href="#">Termin anfragen</a>
    <p class="display small"> 1 weiterer Termin verfügbar</p>
</div>
 
<div class="cta-section">
    <h2>Kein passender Termin dabei?</h2>
    <p class="standalone">Gerne bieten wir Ihnen einen gesonderten Termin an!</p>
    <a class="btn btn--cta" data-label="Termin anfragen" href="#">Termin anfragen</a>
    <p class="display small"> 1 weiterer Termin verfügbar</p>
</div>

<div class="cta-section cta-section--dark-bg">
    <h2>Kein passender Termin dabei?</h2>
    <p class="standalone">Gerne bieten wir Ihnen einen gesonderten Termin an!</p>
    <a class="btn btn--cta btn--cta--inverted" data-label="Termin anfragen" href="#">Termin anfragen</a>
    <p class="display small"> 1 weiterer Termin verfügbar</p>
</div>
 
/* No context defined. */
  • Content: 
    .cta-section {
  margin: $spacer-lg 0;
  text-align: center;

  > * {
    margin-bottom: 0;
  }

  > * + * {
    margin-top: $spacer-md;
  }
}

.cta-section--dark-bg {
  padding: $spacer-lg;
  background-color: $brand-secondary;

  > h2,
  p {
    color: $brand-white;
  }
}
  • URL: /components/raw/cta-section/_cta-section.scss
  • Filesystem Path: components/04-molecules/article&blog-post-elements/cta-section/_cta-section.scss
  • Size: 275 Bytes
  • Handle: @cta-section
  • Preview:
  • Filesystem Path: components/04-molecules/article&blog-post-elements/cta-section/cta-section.html

No notes defined.