<section class="supt-section-contact">
    <div class="container">
        <div class="row">
            <div class="col offset-md-1 col-md-10 offset-lg-2 col-lg-8">
                <div class="supt-section-contact__head">
                    <h2>Verisure markets contact</h2>
                    <p>For any media inquiries please email:</p>
                </div>
                <div class="supt-section-contact__body">
                    <div class="supt-card-contact">
                        <h3>Argentina</h3>
                        <a href="mailto:argentina.pressrelations@verisure.com">
                            <svg width="14" height="12" viewBox="0 0 14 12" fill="none" xmlns="http://www.w3.org/2000/svg">
                                <path d="M2 1.5H12C12.6904 1.5 13.25 2.05964 13.25 2.75V9.25C13.25 9.94036 12.6904 10.5 12 10.5H2C1.30964 10.5 0.75 9.94036 0.75 9.25V2.75C0.75 2.05964 1.30964 1.5 2 1.5Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
                                <path d="M1.3125 2.0625L5.70812 5.78187C6.45381 6.41284 7.54619 6.41284 8.29188 5.78187L12.6875 2.0625" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
                            </svg>
                            <span>argentina.pressrelations@verisure.com</span>
                        </a>
                    </div>
                    <div class="supt-card-contact">
                        <h3>Belgium</h3>
                        <a href="mailto:belgium.pressrelations@verisure.com">
                            <svg width="14" height="12" viewBox="0 0 14 12" fill="none" xmlns="http://www.w3.org/2000/svg">
                                <path d="M2 1.5H12C12.6904 1.5 13.25 2.05964 13.25 2.75V9.25C13.25 9.94036 12.6904 10.5 12 10.5H2C1.30964 10.5 0.75 9.94036 0.75 9.25V2.75C0.75 2.05964 1.30964 1.5 2 1.5Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
                                <path d="M1.3125 2.0625L5.70812 5.78187C6.45381 6.41284 7.54619 6.41284 8.29188 5.78187L12.6875 2.0625" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
                            </svg>
                            <span>belgium.pressrelations@verisure.com</span>
                        </a>
                    </div>
                    <div class="supt-card-contact">
                        <h3>Brazil</h3>
                        <a href="mailto:brazil.pressrelations@verisure.com">
                            <svg width="14" height="12" viewBox="0 0 14 12" fill="none" xmlns="http://www.w3.org/2000/svg">
                                <path d="M2 1.5H12C12.6904 1.5 13.25 2.05964 13.25 2.75V9.25C13.25 9.94036 12.6904 10.5 12 10.5H2C1.30964 10.5 0.75 9.94036 0.75 9.25V2.75C0.75 2.05964 1.30964 1.5 2 1.5Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
                                <path d="M1.3125 2.0625L5.70812 5.78187C6.45381 6.41284 7.54619 6.41284 8.29188 5.78187L12.6875 2.0625" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
                            </svg>
                            <span>brazil.pressrelations@verisure.com</span>
                        </a>
                    </div>
                    <div class="supt-card-contact">
                        <h3>Chile</h3>
                        <a href="mailto:chile.pressrelations@verisure.com">
                            <svg width="14" height="12" viewBox="0 0 14 12" fill="none" xmlns="http://www.w3.org/2000/svg">
                                <path d="M2 1.5H12C12.6904 1.5 13.25 2.05964 13.25 2.75V9.25C13.25 9.94036 12.6904 10.5 12 10.5H2C1.30964 10.5 0.75 9.94036 0.75 9.25V2.75C0.75 2.05964 1.30964 1.5 2 1.5Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
                                <path d="M1.3125 2.0625L5.70812 5.78187C6.45381 6.41284 7.54619 6.41284 8.29188 5.78187L12.6875 2.0625" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
                            </svg>
                            <span>chile.pressrelations@verisure.com</span>
                        </a>
                    </div>
                    <div class="supt-card-contact">
                        <h3>Denmark</h3>
                        <a href="mailto:denmark.pressrelations@verisure.com">
                            <svg width="14" height="12" viewBox="0 0 14 12" fill="none" xmlns="http://www.w3.org/2000/svg">
                                <path d="M2 1.5H12C12.6904 1.5 13.25 2.05964 13.25 2.75V9.25C13.25 9.94036 12.6904 10.5 12 10.5H2C1.30964 10.5 0.75 9.94036 0.75 9.25V2.75C0.75 2.05964 1.30964 1.5 2 1.5Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
                                <path d="M1.3125 2.0625L5.70812 5.78187C6.45381 6.41284 7.54619 6.41284 8.29188 5.78187L12.6875 2.0625" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
                            </svg>
                            <span>denmark.pressrelations@verisure.com</span>
                        </a>
                    </div>
                    <div class="supt-card-contact">
                        <h3>Finland</h3>
                        <a href="mailto:finland.pressrelations@verisure.com">
                            <svg width="14" height="12" viewBox="0 0 14 12" fill="none" xmlns="http://www.w3.org/2000/svg">
                                <path d="M2 1.5H12C12.6904 1.5 13.25 2.05964 13.25 2.75V9.25C13.25 9.94036 12.6904 10.5 12 10.5H2C1.30964 10.5 0.75 9.94036 0.75 9.25V2.75C0.75 2.05964 1.30964 1.5 2 1.5Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
                                <path d="M1.3125 2.0625L5.70812 5.78187C6.45381 6.41284 7.54619 6.41284 8.29188 5.78187L12.6875 2.0625" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
                            </svg>
                            <span>finland.pressrelations@verisure.com</span>
                        </a>
                    </div>
                    <div class="supt-card-contact">
                        <h3>France</h3>
                        <a href="mailto:france.pressrelations@verisure.com">
                            <svg width="14" height="12" viewBox="0 0 14 12" fill="none" xmlns="http://www.w3.org/2000/svg">
                                <path d="M2 1.5H12C12.6904 1.5 13.25 2.05964 13.25 2.75V9.25C13.25 9.94036 12.6904 10.5 12 10.5H2C1.30964 10.5 0.75 9.94036 0.75 9.25V2.75C0.75 2.05964 1.30964 1.5 2 1.5Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
                                <path d="M1.3125 2.0625L5.70812 5.78187C6.45381 6.41284 7.54619 6.41284 8.29188 5.78187L12.6875 2.0625" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
                            </svg>
                            <span>france.pressrelations@verisure.com</span>
                        </a>
                    </div>
                    <div class="supt-card-contact">
                        <h3>Germany</h3>
                        <a href="mailto:germany.pressrelations@verisure.com">
                            <svg width="14" height="12" viewBox="0 0 14 12" fill="none" xmlns="http://www.w3.org/2000/svg">
                                <path d="M2 1.5H12C12.6904 1.5 13.25 2.05964 13.25 2.75V9.25C13.25 9.94036 12.6904 10.5 12 10.5H2C1.30964 10.5 0.75 9.94036 0.75 9.25V2.75C0.75 2.05964 1.30964 1.5 2 1.5Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
                                <path d="M1.3125 2.0625L5.70812 5.78187C6.45381 6.41284 7.54619 6.41284 8.29188 5.78187L12.6875 2.0625" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
                            </svg>
                            <span>germany.pressrelations@verisure.com</span>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

No notes defined.

<section class="supt-section-contact">
	<div class="container">
		<div class="row">
			<div class="col offset-md-1 col-md-10 offset-lg-2 col-lg-8">
				<div class="supt-section-contact__head">
					{% if title %}
						<h2>{{ title }}</h2>
					{% endif %}
					{% if text %}
						<p>{{ text }}</p>
					{% endif %}
				</div>
				<div class="supt-section-contact__body">
					{% for item in items %}
						{% include "molecules/cards/card-contact/card-contact.twig" with item only %}
					{% endfor %}
				</div>
			</div>
		</div>
	</div>
</section>
{
  "title": "Verisure markets contact",
  "text": "For any media inquiries please email:",
  "items": [
    {
      "title": "Argentina",
      "email": "argentina.pressrelations@verisure.com"
    },
    {
      "title": "Belgium",
      "email": "belgium.pressrelations@verisure.com"
    },
    {
      "title": "Brazil",
      "email": "brazil.pressrelations@verisure.com"
    },
    {
      "title": "Chile",
      "email": "chile.pressrelations@verisure.com"
    },
    {
      "title": "Denmark",
      "email": "denmark.pressrelations@verisure.com"
    },
    {
      "title": "Finland",
      "email": "finland.pressrelations@verisure.com"
    },
    {
      "title": "France",
      "email": "france.pressrelations@verisure.com"
    },
    {
      "title": "Germany",
      "email": "germany.pressrelations@verisure.com"
    }
  ]
}
  • Content:
    .supt-section-contact {
    	@mixin clamp padding-block, $spacing-8, $spacing-16, $breakpoint-xs, $breakpoint-xl;
    	background-color: $color-grey-background;
    
    	.container {
    		@media (max-width: calc($breakpoint-sm - 1px)) {
    			padding-inline: $spacing-4;
    		}
    	}
    
    	.row {
    		@media (max-width: calc($breakpoint-sm - 1px)) {
    			display: flex;
    			flex-direction: column;
    			gap: $spacing-8;
    		}
    	}
    
    	.col {
    		display: flex;
    		flex-direction: column;
    		@mixin clamp gap, $spacing-6, $spacing-8, $breakpoint-xs, $breakpoint-xl;
    	}
    
    	&__head {
    		display: flex;
    		flex-direction: column;
    		@mixin clamp gap, $spacing-3, $spacing-4, $breakpoint-xs, $breakpoint-xl;
    
    		h2 {
    			@extend %t-h2;
    			font-weight: $font-weight-medium;
    			margin: 0;
    		}
    
    		p {
    			@extend %t-body-s;
    			color: $color-grey-5;
    		}
    	}
    }
    
  • URL: /components/raw/section-contact/section-contact.css
  • Filesystem Path: src/components/organisms/section-contact/section-contact.css
  • Size: 795 Bytes
  • Handle: @section-contact
  • Preview:
  • Filesystem Path: src/components/organisms/section-contact/section-contact.twig