2026-06-05 16:56:04 -06:00
<!doctype html>
2026-06-04 12:20:40 -06:00
< html >
2026-06-05 16:56:04 -06:00
< head >
< style >
. sec0 {
background-image : url ( img/fondos/bg11.jpg ) ;
background-repeat : no-repeat ;
background-size : cover ;
background-position : center ;
}
. bubble {
width : 100 % ;
height : 136 px ;
background-image : linear-gradient ( to bottom , #f9f9f9 , #f5f5f5 , #f1f1f1 , #ededed , #e9e9e9 ) ;
border-top-left-radius : 25 px ;
border-top-right-radius : 25 px ;
border-bottom-right-radius : 25 px ;
}
. anim {
opacity : 0 ;
}
< / style >
< / head >
< body >
2026-06-04 12:20:40 -06:00
< div class = "section_charge bg w-100 h-100" >
2026-06-05 16:56:04 -06:00
< div class = "d-none" >
< img src = "img/fondos/bg11.jpg" alt = "" / >
< img src = "img/sprites/marco_6.png" alt = "" / >
< img src = "img/sprites/marco_7.png" alt = "" / >
< img src = "img/sprites/ruben_5.png" alt = "" / >
< img src = "img/sprites/ruben_6.png" alt = "" / >
< / div >
< section id = "sec0" class = "sec0 w-100 h-100" >
< div class = "container h-100" >
< div class = "row justify-content-center h-100" >
< div class = "col-9 offset-2 mt-2 anim anim1" >
< div class = "bubble d-flex align-items-center shadow px-3 py-2" >
< p class = "m-0" >
Rubén, recientemente leí un reportaje en el que una aseguradora tuvo que investigar a uno de sus
< b > clientes extranjeros< / b >
porque algunas de sus operaciones sobrepasaban el monto permitido, ¿consideras que un cliente así o
que viva fuera del país representa un riesgo mayor que otro cliente que sí reside aquí?
< / p >
< / div >
< / div >
< div class = "col-7 align-self-end anim anim2" >
< div class = "row justify-content-center" >
< div class = "col-4 align-self-end" >
< div class = "personaje_r_5" > < / div >
< div class = "personaje_r_6 d-none" > < / div >
2026-06-04 12:20:40 -06:00
< / div >
2026-06-05 16:56:04 -06:00
< div class = "col-4" >
< div class = "personaje_m_6" > < / div >
< div class = "personaje_m_7 d-none" > < / div >
< / div >
< / div >
2026-06-04 12:20:40 -06:00
< / div >
2026-06-05 16:56:04 -06:00
< / div >
< / div >
< / section >
2026-06-04 12:20:40 -06:00
< / div >
2026-06-05 16:56:04 -06:00
< / body >
2026-06-04 12:20:40 -06:00
< / html >
< script >
2026-06-05 16:56:04 -06:00
jQuery ( document ) . ready ( function ( $ ) {
2026-06-04 12:20:40 -06:00
instruccion ( 0 ) ;
2026-06-05 16:56:04 -06:00
var Audio _11 = newSound ( 'audio/Audio_11_Marcos.mp3' ) ;
var Audio _R8 = newSound ( 'audio/Audio_8_Ruben.mp3' ) ;
var txt1 =
'Ciertamente es un tema delicado, Marcos. En <b>Mapfre</b> contamos con una <b>política de conocimiento del cliente </b>que nos permite dar un seguimiento a sus operaciones mediante un perfil y el Grado de Riesgo que representa, viva o no en el país. ¡Acompáñame para conocer más sobre ella!' ;
2026-06-04 12:20:40 -06:00
2026-06-05 16:56:04 -06:00
Audio _11 . on ( 'end' , function ( ) {
stopAllSoundsAndPlay ( Audio _R8 ) ;
$ ( '.bubble p' ) . html ( txt1 ) ;
$ ( '.personaje_m_6' ) . addClass ( 'd-none' ) ;
$ ( '.personaje_m_7' ) . removeClass ( 'd-none' ) ;
$ ( '.personaje_r_5' ) . addClass ( 'd-none' ) ;
$ ( '.personaje_r_6' ) . removeClass ( 'd-none' ) . addClass ( 'play' ) ;
2026-06-04 12:20:40 -06:00
} ) ;
2026-06-05 16:56:04 -06:00
Audio _R8 . on ( 'end' , function ( ) {
fn _end ( ) ;
$ ( '.personaje_r_6' ) . removeClass ( 'play' ) ;
2026-06-04 12:20:40 -06:00
} ) ;
2026-06-05 16:56:04 -06:00
$ ( '.layer-load' ) . show ( ) ;
2026-06-04 12:20:40 -06:00
$ ( '.section_charge' ) . waitForImages ( {
2026-06-05 16:56:04 -06:00
finished : function ( ) {
$ ( '.section_charge' ) . css ( 'visibility' , 'visible' ) ;
$ ( '.wloader' ) . hide ( ) ;
fn _animate ( ) ;
} ,
each : function ( loaded , count , success ) {
var total = Math . floor ( ( loaded * 100 ) / count ) ;
$ ( '.wloader' ) . show ( ) ;
} ,
waitForAll : true
2026-06-04 12:20:40 -06:00
} ) ;
2026-06-05 16:56:04 -06:00
function fn _animate ( ) {
var tl = new TimelineMax ( ) ;
tl . fromTo ( '.anim2' , 1 , { opacity : 0 , x : - 150 } , { opacity : 1 , x : 0 , ease : Expo . easeInOut } ) ;
tl . fromTo ( '.anim1' , 0.7 , { opacity : 0 , y : - 250 } , { opacity : 1 , y : 0 , ease : Expo . easeInOut } ) ;
tl . call ( fn _firstAudio ) ;
2026-06-04 12:20:40 -06:00
}
2026-06-05 16:56:04 -06:00
function fn _firstAudio ( ) {
stopAllSoundsAndPlay ( Audio _11 ) ;
$ ( '.personaje_m_6' ) . addClass ( 'play' ) ;
2026-06-04 12:20:40 -06:00
}
2026-06-05 16:56:04 -06:00
function fn _end ( ) {
instruccion ( 1 ) ;
2026-06-04 12:20:40 -06:00
}
2026-06-05 16:56:04 -06:00
} ) ;
< / script >
