<section class="splitter splitter_bg-color_white ">
<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="banner-ancho">
<div class="banner-ancho__header">
<div class="banner-ancho__header-wrapper">
<div class="row">
<div class="col-xs-12 col-ms-9 col-ms-mr-ml col-sm-10 col-lg-10 col">
<div class="row">
<div class="col-xs-12 col-ms-12 col-sm-12 col-lg-12 col">
<div class="banner-ancho__breadcrumbs">
<ul class="
breadcrumbs
breadcrumbs_light
">
<li class="breadcrumbs__item">
<a class="breadcrumbs__link" href="#">
<div class="breadcrumbs__label">
<div class="text-label-m text-label-m_color_light">Home</div>
</div>
</a>
</li>
<li class="breadcrumbs__item">
<div class="breadcrumbs__label inactive">
<div class="text-label-m text-label-m_color_light">Hipotecas</div>
</div>
</li>
</ul>
</div>
</div>
<div class="col-xs-12 col-ms-12 col-sm-6 col-lg-6 col">
<div class="banner-ancho__header-main">
<div class="banner-ancho__header-head">
<div class="banner-ancho__title">
<h1 class="
title-xl title-xl_color_light
">Hipotecas</h1>
</div>
<div class="banner-ancho__support">
<div class="banner-ancho__support-bodycopy">
<h4 class="
title-s
title-s_color_light
">¿No eres residente en España?</h4>
</div>
<div class="banner-ancho__support-link">
<a class="link
link_color_light
" href="#">
<span>Entra en productos para no residentes</span>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="col-xs-12 col-ms-12 col-sm-6 col-lg-6 col">
<div class="banner-ancho__header-content">
<div class="banner-ancho__description">
<div id="" class="
bodycopy-l
bodycopy_color_light
">
<p>Te ayudamos a financiar tu mayor proyecto, tu hogar.</p>
</div>
</div>
<div class="banner-ancho__bodycopy rich-text">
<div class="
bodycopy-m
bodycopy_color_light
">
<ul>
<li>En UCI haremos todo lo posible para que tu proyecto se convierta en realidad.</li>
<li>Descubre nuestros productos para los residentes en España.</li>
<li>Puedes pedirnos consejo siempre que lo necesites</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="line"></div>
</div>
</div>
</div>
</div>
</div>
</section>
{{#extend '@splitter' splitter }}
{{#content 'content-first-column'}}
<div class="banner-ancho" {{#if hasID}}id="{{idComponent}}"{{/if}}>
<div class="banner-ancho__header">
<div class="banner-ancho__header-wrapper">
<div class="row">
<div class="col-xs-12 col-ms-9 col-ms-mr-ml col-sm-10 col-lg-10 col">
<div class="row">
<div class="col-xs-12 col-ms-12 col-sm-12 col-lg-12 col">
<div class="banner-ancho__breadcrumbs">
{{> @breadcrumbs breadcrumbs }}
</div>
</div>
<div class="col-xs-12 col-ms-12 col-sm-6 col-lg-6 col">
<div class="banner-ancho__header-main">
<div class="banner-ancho__header-head">
<div class="banner-ancho__title">
{{> @title-xl title }}
</div>
<div class="banner-ancho__support">
<div class="banner-ancho__support-bodycopy">
{{> @title-s support-bodycopy }}
</div>
<div class="banner-ancho__support-link">
{{> @link support-link }}
</div>
</div>
</div>
</div>
</div>
<div class="col-xs-12 col-ms-12 col-sm-6 col-lg-6 col">
<div class="banner-ancho__header-content">
<div class="banner-ancho__description">
{{> @bodycopy-l description }}
</div>
<div class="banner-ancho__bodycopy rich-text">
{{> @bodycopy-m bodycopy }}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{{ render '@line' }}
</div>
{{/content}}
{{/extend}}
{
"hasID": false,
"splitter": {
"oneColumn": true,
"bgColorWhite": true
},
"breadcrumbs": {
"isLight": true,
"breadcrumb": [
{
"href": "#",
"label": {
"text": "Home",
"colorLight": true
}
},
{
"label": {
"text": "Hipotecas",
"colorLight": true
}
}
]
},
"title": {
"text": "Hipotecas",
"colorLight": true
},
"support-bodycopy": {
"text": "¿No eres residente en España?",
"colorLight": true
},
"support-link": {
"href": "#",
"text": "Entra en productos para no residentes",
"isLight": true
},
"description": {
"text": "<p>Te ayudamos a financiar tu mayor proyecto, tu hogar.</p>",
"colorLight": true
},
"bodycopy": {
"text": "<ul><li>En UCI haremos todo lo posible para que tu proyecto se convierta en realidad.</li><li>Descubre nuestros productos para los residentes en España.</li><li>Puedes pedirnos consejo siempre que lo necesites</li></ul>",
"colorLight": true
},
"info": {
"text": "<p>Combina nuestros productos con el seguro que mejor se adapte a ti</p>"
},
"isHipotecas": true
}
.banner-ancho {
margin-right: -19px;
margin-left: -20px;
margin-top: 100px;
@media (--viewport-ms-max) {
margin-top:55px;
}
@media (--viewport-ms-min) {
margin-left: 0;
margin-right: 0;
}
&__header {
display: flex;
align-items: center;
min-height: 400px;
padding: 110px 20px 60px;
background-color: var(--color-accent);
@media (--viewport-ms-min) {
min-height: 573px;
padding-right: 0;
padding-left: 0;
}
@media (--viewport-sm-min) {
min-height: 362px;
padding: 50px 0 60px;
}
@media (--viewport-ms-max) {
padding-top: 80px;
}
&-wrapper {
width: 100%;
}
&-main {
@media (--viewport-ms-max) {
margin-bottom: 40px;
}
}
}
&__breadcrumbs {
margin-bottom: 20px;
}
&__title {
margin-bottom: 40px;
}
&__support {
&-bodycopy {
margin-bottom: 20px;
@media (--viewport-sm-min) {
margin-bottom: 30px;
}
}
}
&__description {
margin-bottom: 15px;
@media (--viewport-ms-min) {
margin-bottom: 30px;
}
}
}
No notes defined.