Estructura de HTML básico para plantilla

El HTML de fastcontent se distribuye en las siguientes secciones:

### HEAD

Global para todos los Fastcontent.

<style>
/* FASTCONTENT GLOBALS */

body { 
    margin: 0 0 0 0; 
    font-family: sans-serif;
}

#chrome_flags{ 
    background-color: #c33e3e; 
    width: 100%; 
    height: 100%; 
    text-align: center; 
    font-size: 1vw;
}

#chrome_flasgs_inner{ 
    padding: 20px; 
    background-color: #AAAAAA;
    margin-left: 20%; 
    width: 60%; 
    text-align: left; 
    font-size: 1vw;
}

#chrome_info{ 
    background-color: #228a33db;
    width: 100%; 
    height: 100%; 
    text-align: center; 
    font-size: 1vw;
}

.image{
    width:100%;
    height: 100%;
}

.video{
    width:100%;
    height: 100%;
    object-fit: fill
}

.shape{
    width:100%;
    height: 100%;
}

</style>

### FASTCONTENT UNIVERSAL SCRIPT

Este script se debe copiar del repo proporcionado anteriormente.

<!-- SCRIPT UNIVERSAL GENERICO DE FASTCONTENT HTML5 - INCLUYE API CONTENT & JQUERY -->

<script>
    …… (añadir aquí el código del repo)

</script>>

### PERSONALIZACION DE FASTCONTENT

<!-- SCRIPT ESPECIFICO PARA ESTE CONTENIDO -->

<script>
    …… (añadir aquí el código específico para el fastcontent)

</script>

### PERSONALIZACION EVENTOS EN RELACION A PLAYER

<!-- SCRIPTS ADICIONAL PARA EJECUTAR EN EL MOMENTO DE RENDERIZADO (PLAY) DEL CONTENIDO -->

<!-- el evento onRender se disparará cuando el player haga play del contenido -->

<script>

function onRender(slide_index){
    console.log("Fastcontent is rendering slide : "+slide_index);
    ...(añadir aquí el código necesario para ser ejecutado cuando el player dispara el contenido)
}

</script>

### BODY

Crear las variables necesarias y correctamente seteadas que serán reflejadas en el XML.

<div id="background" class=""> </div>
<div id="producto" class="text"> </div>
<div id="imagen"> </div>
<div id="precio" class="text" style="opacity: 0;"> </div>
<div id="descripcion" class="text"> </div>
<div id="promo"> </div>