<section class="splitter splitter_bg-color_white splitter_padding_top_40-60 splitter_padding_bottom_small ">
<div class="container">
<div class="splitter__wrapper">
<div class="row">
<div class="col-xs-12 col-ms-12 col-sm-12 col-lg-12">
<div class="row">
<div class="col-xs-12 col-ms-9 col-ms-mr-ml col-sm-11 col-lg-10 col">
<div class="addresses">
<div class="addresses__title">
<h2 class="
title-l
">
Oficinas centrales
</h2>
</div>
<div class="addresses__offices">
<ul class="row">
<li class="col-xs-12 col-ms-12 col-sm-6 col-lg-6 col">
<div class="addresses__office">
<div class="addresses__office-head">
<div class="addresses__office-title">
<h3 class="
title-m
">Madrid</h3>
</div>
<div class="addresses__office-address">
<div class="
bodycopy-s
">
Avda. Maisonave, 19, 4ºA, 03003. Alicante , España
</div>
</div>
</div>
<div class="addresses__office-links">
<ul class="row">
<li class="col-xs-4 col-ms-3 col-sm-4 col-md-3 col-lg-4 col">
<ul class="addresses__office-links-list">
<li class="addresses__office-links-item">
<a class="link
link_simple
link_has-icon link_has-icon_before
" href="tel:915283322">
<svg class="icon icon-tel icon-before">
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="/dist/icons/icons.svg#tel"></use>
</svg>
<span>915 28 33 22</span>
</a>
</li>
<li class="addresses__office-links-item">
<a class="link
link_simple
link_has-icon link_has-icon_before
" href="tel:913373738">
<svg class="icon icon-tel icon-before">
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="/dist/icons/icons.svg#tel"></use>
</svg>
<span>91 337 37 38</span>
</a>
</li>
</ul>
</li>
<li class="col-xs-8 col-ms-9 col-sm-8 col-md-9 col-lg-8 col">
<ul class="addresses__office-links-list">
<li class="addresses__office-links-item">
<a class="link
link_simple
link_has-icon link_has-icon_before
" href="mailto:ucimadrid@uci.com">
<svg class="icon icon-mail icon-before">
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="/dist/icons/icons.svg#mail"></use>
</svg>
<span>ucimadrid@uci.com</span>
</a>
</li>
<li class="addresses__office-links-item">
<a class="link
link_simple
link_has-icon link_has-icon_after
" href="#" target="_blank" noopener>
<span>¿Cómo llegar?</span>
<svg class="icon icon-external icon-after">
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="/dist/icons/icons.svg#external"></use>
</svg>
</a>
</li>
</ul>
</li>
</ul>
</div>
</div>
</li>
<li class="col-xs-12 col-ms-12 col-sm-6 col-lg-6 col">
<div class="addresses__office">
<div class="addresses__office-head">
<div class="addresses__office-title">
<h3 class="
title-m
">Lisboa</h3>
</div>
<div class="addresses__office-address">
<div class="
bodycopy-s
">
Avda. Maisonave, 19, 4ºA, 03003. Alicante , España
</div>
</div>
</div>
<div class="addresses__office-links">
<ul class="row">
<li class="col-xs-4 col-ms-3 col-sm-4 col-md-3 col-lg-4 col">
<ul class="addresses__office-links-list">
<li class="addresses__office-links-item">
<a class="link
link_simple
link_has-icon link_has-icon_before
" href="tel:915283322">
<svg class="icon icon-tel icon-before">
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="/dist/icons/icons.svg#tel"></use>
</svg>
<span>915 28 33 22</span>
</a>
</li>
<li class="addresses__office-links-item">
<a class="link
link_simple
link_has-icon link_has-icon_before
" href="tel:913373738">
<svg class="icon icon-tel icon-before">
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="/dist/icons/icons.svg#tel"></use>
</svg>
<span>91 337 37 38</span>
</a>
</li>
</ul>
</li>
<li class="col-xs-8 col-ms-9 col-sm-8 col-md-9 col-lg-8 col">
<ul class="addresses__office-links-list">
<li class="addresses__office-links-item">
<a class="link
link_simple
link_has-icon link_has-icon_before
" href="mailto:ucimadrid@uci.com">
<svg class="icon icon-mail icon-before">
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="/dist/icons/icons.svg#mail"></use>
</svg>
<span>ucimadrid@uci.com</span>
</a>
</li>
<li class="addresses__office-links-item">
<a class="link
link_simple
link_has-icon link_has-icon_after
" href="#" target="_blank" noopener>
<span>¿Cómo llegar?</span>
<svg class="icon icon-external icon-after">
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="/dist/icons/icons.svg#external"></use>
</svg>
</a>
</li>
</ul>
</li>
</ul>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
{{#extend '@splitter' splitter }}
{{#content 'content-first-column'}}
<div class="row">
<div class="col-xs-12 col-ms-9 col-ms-mr-ml col-sm-11 col-lg-10 col">
<div {{#if hasID}}id="{{idComponent}}"{{/if}} class="addresses">
{{#if title}}
<div class="addresses__title">
{{> @title-l title }}
</div>
{{/if}}
<div class="addresses__offices">
<ul class="row">
{{#each office}}
<li class="col-xs-12 col-ms-12 col-sm-6 col-lg-6 col">
<div class="addresses__office">
<div class="addresses__office-head">
<div class="addresses__office-title">
{{> @title-m this.title }}
</div>
<div class="addresses__office-address">
{{> @bodycopy-s this.address }}
</div>
</div>
<div class="addresses__office-links">
<ul class="row">
<li class="{{#if wide-first-col}}col-xs-12 col-ms-8 col-sm-8 col-md-8 col-lg-8{{else}}col-xs-4 col-ms-3 col-sm-4 col-md-3 col-lg-4{{/if}} col">
<ul class="addresses__office-links-list">
{{#each this.number-link}}
<li class="addresses__office-links-item">
{{> @link this.link }}
</li>
{{/each}}
</ul>
</li>
<li class="{{#if wide-first-col}}col-xs-12 col-ms-4 col-sm-4 col-md-4 col-lg-4{{else}}col-xs-8 col-ms-9 col-sm-8 col-md-9 col-lg-8{{/if}} col">
<ul class="addresses__office-links-list">
{{#each this.text-link}}
<li class="addresses__office-links-item">
{{> @link this.link }}
</li>
{{/each}}
</ul>
</li>
</ul>
</div>
</div>
</li>
{{/each}}
</ul>
</div>
</div>
</div>
</div>
{{/content}}
{{/extend}}
{
"hasID": false,
"splitter": {
"oneColumn": true,
"bgColorWhite": true,
"paddingTop4060": true,
"paddingBottomSmall": true
},
"title": {
"text": "Oficinas centrales"
},
"office": [
{
"title": {
"text": "Madrid"
},
"address": {
"text": "Avda. Maisonave, 19, 4ºA, 03003. Alicante , España"
},
"number-link": [
{
"link": {
"isSimple": true,
"icon-before": {
"name": "tel",
"isBefore": true
},
"href": "tel:915283322",
"text": "915 28 33 22"
}
},
{
"link": {
"isSimple": true,
"icon-before": {
"name": "tel",
"isBefore": true
},
"href": "tel:913373738",
"text": "91 337 37 38"
}
}
],
"text-link": [
{
"link": {
"isSimple": true,
"icon-before": {
"name": "mail",
"isBefore": true
},
"href": "mailto:ucimadrid@uci.com",
"text": "ucimadrid@uci.com"
}
},
{
"link": {
"isSimple": true,
"icon-after": {
"name": "external",
"isAfter": true
},
"href": "#",
"target": "_blank",
"text": "¿Cómo llegar?"
}
}
]
},
{
"title": {
"text": "Lisboa"
},
"address": {
"text": "Avda. Maisonave, 19, 4ºA, 03003. Alicante , España"
},
"number-link": [
{
"link": {
"isSimple": true,
"icon-before": {
"name": "tel",
"isBefore": true
},
"href": "tel:915283322",
"text": "915 28 33 22"
}
},
{
"link": {
"isSimple": true,
"icon-before": {
"name": "tel",
"isBefore": true
},
"href": "tel:913373738",
"text": "91 337 37 38"
}
}
],
"text-link": [
{
"link": {
"isSimple": true,
"icon-before": {
"name": "mail",
"isBefore": true
},
"href": "mailto:ucimadrid@uci.com",
"text": "ucimadrid@uci.com"
}
},
{
"link": {
"isSimple": true,
"icon-after": {
"name": "external",
"isAfter": true
},
"href": "#",
"target": "_blank",
"text": "¿Cómo llegar?"
}
}
]
}
]
}
.addresses {
&__title {
margin-bottom: 20px;
@media (--viewport-ms-min) {
margin-bottom: 30px;
}
@media (--viewport-sm-min) {
margin-bottom: 40px;
}
}
&__offices {
@media (--viewport-sm-min) {
margin-bottom: -40px;
}
.col {
&:last-child {
@media (--viewport-xs-max) {
margin-top: 20px;
}
.addresses__office {
@media (--viewport-ms-max) {
margin-bottom: 0;
}
}
}
}
}
&__office {
@media (--viewport-sm-min) {
width: 90%;
}
@media (--viewport-lg-min) {
width: 80%;
}
margin-bottom: 40px;
&-head {
margin-bottom: 30px;
@media (--viewport-ms-min) {
margin-bottom: 20px;
}
}
&-title {
margin-bottom: 5px;
}
&-links {
&-item {
margin-bottom: 20px;
@media (--viewport-ms-min) {
margin-bottom: 10px;
}
&:last-child {
margin-bottom: 0;
}
.link{
line-height: 16px;
.icon{
top: 0px;
}
}
}
}
}
}
No notes defined.