240x400 (4)

/* 240x400 (4) */

/* Переменная 'info' необходима для указания юридической информации о компании */

var info =
  "ООО «Рога и копыта» Олимпийский проспект, д. 14, этаж 2 129090, Москва ОГРН 123456789123";

/* Ниже этой строчки код редактировать не рекомендуется */

var custom_script=document.createElement("SCRIPT");custom_script.onload=function(){$(document).ready((function(){function enlarge(item){var that=$(item);$(".logo").addClass("logo--centered"),$(that).addClass("item--upper"),$(that).addClass("item--fullsize"),$(that).find(".price").addClass("price--visible"),$(that).find(".button").addClass("button--visible")}function squeeze(item){var that=$(item);$(".logo").removeClass("logo--centered"),$(that).find(".button").removeClass("button--visible"),$(that).removeClass("item--fullsize"),$(that).find(".price").removeClass("price--visible"),setTimeout((function(){$(that).removeClass("item--upper")}),500)}"ontouchstart"in document.documentElement?$(".item").click((function(){$(this).hasClass("item--fullsize")?squeeze(this):enlarge(this)})):$(".item").on("mouseenter",(function(){var that=$(this),timer=setTimeout((function(){enlarge(that)}),600);$(that).on("mouseleave",(function(){clearTimeout(timer),$(that).hasClass("item--fullsize")&&squeeze(that)}))}))}))},custom_script.type="text/javascript",custom_script.src="https://cdn.adhigh.net/jquery-3.6.0.min.js",custom_script.defer="defer",document.getElementById(elementId).appendChild(custom_script);var creative=function(){var container=document.createElement("div");return container.innerHTML='<div class="wrapper"><a class="logo" href="[[LANDING_PAGE]]" target="_blank"><img src="https://[[SITE_LOGO]]"></a><div class="content">'+goods(0,4)+'</div><div class="footer"><a class="footer__logo" href="https://getintent.com/" target="_blank"><span>Реклама</span><svg class="svg" viewBox="0 0 73 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M16.486 9.727 13.26 13.04a3.45 3.45 0 0 0 .973-2.407 3.45 3.45 0 0 0-.973-2.408L7.097 1.902 7.976 1A3.311 3.311 0 0 1 9.052.261a3.248 3.248 0 0 1 2.542 0A3.31 3.31 0 0 1 12.67 1l3.816 3.913a3.45 3.45 0 0 1 .972 2.408 3.45 3.45 0 0 1-.973 2.407Z" fill="#0070C1"/><path d="m4.194 11.805 6.155 6.302-.879.9a3.31 3.31 0 0 1-1.075.736 3.245 3.245 0 0 1-2.539 0 3.31 3.31 0 0 1-1.075-.736L.97 15.104a3.438 3.438 0 0 1-.97-2.4c0-.9.348-1.763.97-2.4L4.193 7.01a3.438 3.438 0 0 0-.967 2.397c0 .899.347 1.76.967 2.397Z" fill="#B5B5B5"/><path d="M4.194 13.605c-.621.637-.97 1.5-.97 2.4 0 .9.349 1.764.97 2.4l-3.224-3.3a3.438 3.438 0 0 1-.97-2.4c0-.9.35-1.763.97-2.4l3.81-3.901a3.28 3.28 0 0 1 2.345-.993c.88 0 1.723.357 2.345.993l.879.9-6.155 6.3Z" fill="#fff"/><path d="m16.486 9.727-3.816 3.916a3.313 3.313 0 0 1-1.076.737 3.25 3.25 0 0 1-2.542 0 3.314 3.314 0 0 1-1.076-.737l-.88-.903 6.164-6.316c.623-.64.973-1.505.973-2.409 0-.903-.35-1.77-.973-2.409l3.226 3.312a3.45 3.45 0 0 1 .97 2.405 3.45 3.45 0 0 1-.97 2.404Z" fill="#00AEFF"/><path d="M23.961 16.46c-.83 0-2.004-.35-2.479-1.152a.397.397 0 0 1-.052-.393.563.563 0 0 1 .307-.343l.438-.249a.737.737 0 0 1 .335-.1.547.547 0 0 1 .438.293c.109.176.266.316.452.401.186.085.392.113.593.08.733-.044 1.03-.343 1.03-1.14v-.721c-.41.109-.83.166-1.254.17-1.674 0-2.559-.88-2.559-2.535V9.555c0-1.73.96-2.638 2.768-2.638.74-.02 1.477.112 2.167.387.416.199.513.293.513.66v5.705c0 1.841-.933 2.79-2.697 2.79Zm.115-8.095c-.86 0-1.228.343-1.228 1.14v1.23c0 .68.378 1.024 1.125 1.024.356-.004.71-.05 1.056-.138V8.494a3.654 3.654 0 0 0-.953-.13Zm6.633 5.354c-1.815 0-2.814-.955-2.814-2.69V9.625c0-1.759 1.007-2.714 2.837-2.714 1.74 0 2.822 1.06 2.822 2.67v.536c0 .51-.166.657-.724.657h-3.306v.357a1.149 1.149 0 0 0 .334.86 1.096 1.096 0 0 0 .85.313 1.61 1.61 0 0 0 .762-.143c.239-.11.45-.275.613-.484 0 0 .103-.273.592 0 0 0 .287.143.547.293a.339.339 0 0 1 .19.241.355.355 0 0 1-.075.3c-.478.8-1.363 1.208-2.628 1.208Zm1.216-4.103V9.5c0-.712-.4-1.134-1.193-1.134-.553 0-1.209.249-1.209 1.134v.117h2.402Z" fill="#fff"/><path d="M58.409 13.72c-1.815 0-2.815-.956-2.815-2.691V9.625c0-1.759 1.008-2.714 2.837-2.714 1.741 0 2.823 1.06 2.823 2.67v.536c0 .51-.163.657-.724.657h-3.318v.357a1.15 1.15 0 0 0 .334.86 1.096 1.096 0 0 0 .851.313c.261.015.523-.034.762-.143.239-.109.449-.275.612-.484 0 0 .106-.273.593 0 0 0 .286.143.547.293a.34.34 0 0 1 .19.241.354.354 0 0 1-.076.3c-.478.8-1.362 1.208-2.616 1.208Zm1.216-4.104V9.5c0-.712-.4-1.134-1.194-1.134-.552 0-1.208.249-1.208 1.134v.117h2.402Z" fill="#00AEFF"/><path d="M38.049 13.523c-1.87 0-2.562-.75-2.562-2.767v-2.14h-.722c-.343 0-.43-.09-.43-.45v-.637c0-.351.087-.44.43-.44h.722V5.977c0-.352.088-.44.44-.44h.748c.352 0 .44.088.44.44V7.09h1.183c.352 0 .38.088.38.44v.635c0 .355-.03.452-.38.452h-1.183v2.092c0 .965.335 1.225 1.051 1.225.513 0 .513.091.513.449v.674c0 .357-.086.445-.447.46l-.183.006Z" fill="#fff"/><path d="M53.977 13.523c-1.866 0-2.562-.75-2.562-2.767v-2.14h-.721c-.344 0-.427-.09-.427-.45v-.637c0-.351.083-.44.426-.44h.722V5.977c0-.352.089-.44.44-.44h.75c.353 0 .439.088.439.44V7.09h1.185c.352 0 .378.088.378.44v.635c0 .355-.032.452-.378.452h-1.185v2.092c0 .965.338 1.225 1.05 1.225.513 0 .513.091.513.449v.674c0 .357-.086.445-.444.46l-.186.006Zm18.39 0c-1.866 0-2.559-.75-2.559-2.767v-2.14h-.724c-.344 0-.427-.09-.427-.45v-.637c0-.351.083-.44.427-.44h.724V5.977c0-.352.086-.44.438-.44h.759c.352 0 .44.088.44.44V7.09h1.183c.352 0 .378.088.378.44v.635c0 .355-.032.452-.378.452h-1.183v2.092c0 .965.336 1.225 1.048 1.225.513 0 .513.091.513.449v.674c0 .357-.086.445-.444.46l-.195.006Zm-31.521.018c-.344 0-.43-.03-.43-.39V7.465c0-.352.086-.375.43-.375h.761c.35 0 .438.023.438.375v5.7c0 .358-.092.39-.438.39l-.761-.014Zm7.231 0c-.344 0-.43-.03-.43-.39V9.42c0-.707-.346-1.023-1.124-1.023-.357 0-.712.05-1.057.143v4.625c0 .36-.086.39-.426.39h-.762c-.346 0-.44-.032-.44-.39v-5.09c0-.449.125-.587.54-.748a6.103 6.103 0 0 1 2.342-.416c1.672 0 2.556.88 2.556 2.535v3.72c0 .357-.091.39-.438.39l-.761-.015Zm18.594 0c-.344 0-.43-.03-.43-.39V9.42c0-.707-.346-1.023-1.125-1.023-.357 0-.712.05-1.056.143v4.625c0 .36-.083.39-.427.39h-.761c-.347 0-.441-.032-.441-.39v-5.09c0-.449.126-.587.54-.748a6.11 6.11 0 0 1 2.343-.416c1.674 0 2.559.88 2.559 2.535v3.72c0 .357-.095.39-.441.39l-.761-.015ZM41.232 6.5a.866.866 0 0 0 .856-.876.866.866 0 0 0-.856-.876.866.866 0 0 0-.856.876c0 .484.383.877.856.877Z" fill="#00AEFF"/></svg></a><div class="footer__about"><span>О компании</span></div><div class="footer__disclaimer"><p>'+info+"</p></div></div></div>",container.firstChild};function goods(i,count){for(var goods="",c=0;c<count;c++){var itemName="no name model g:title";if(products[i+c].hasOwnProperty("name"))if(products[i+c].name)itemName=products[i+c].name;if(products[i+c].hasOwnProperty("model"))if(products[i+c].model)itemName=products[i+c].model;if(products[i+c].hasOwnProperty("g:title"))if(products[i+c]["g:title"])itemName=products[i+c]["g:title"];var shortenName=itemName.substring(0,32).trim()+"...";goods+='<a class="item" href="'+products[i+c].url+'" target="_blank"><div class="top"><img src="'+products[i+c].picture+'"/><div class="price">'+products[i+c].price+' ₽</div></div><div class="bottom"><span>'+shortenName+'</span><div class="button">Посмотреть</div></div></a>'}return goods}document.getElementById(elementId).appendChild(creative());


/* В переменных можно указывать произвольные цвета */

:root {
  --itemBackgroundColor: #373737;
  --itemForegroundColor: #ebebeb;
  --itemAccentColor: #56ccf2;
}

/* Ниже этой строчки код редактировать не рекомендуется */

:root{--footerDuration:0.2s}*,:after,:before{box-sizing:border-box}body,html{margin:0;padding:0}.wrapper{aspect-ratio:.6;border:1px solid var(--itemBackgroundColor);font-family:Poppins,sans-serif;height:100%;left:50%;max-width:60vh;overflow:hidden;top:50%;transform:translate(-50%,-50%);width:100%;z-index:0}.logo,.wrapper{background-color:#fff;position:absolute}.logo{font-size:0;height:12%;right:4%;top:4%;transition:width .5s ease;width:calc(46% - 5px);z-index:1}.logo.logo--centered{width:92%}.logo img{height:100%;-o-object-fit:contain;object-fit:contain;width:100%}.content{height:72%;left:4%;top:20%;width:92%}.content,.item{position:absolute}.item{display:flex;flex-direction:column;height:calc(50% - 5px);justify-content:space-between;text-decoration:none;transition:all .5s ease;width:calc(50% - 5px)}.item:focus .top,.item:hover .top{border-color:var(--itemBackgroundColor)}.item:focus .top:before,.item:hover .top:before{opacity:1;width:calc(100% - 8px)}.item:focus .bottom,.item:hover .bottom{-webkit-font-smoothing:antialiased;background-color:var(--itemBackgroundColor);color:#fff}.item.item--upper{z-index:1}.item.item--fullsize{height:100%;width:100%}.item.item--fullsize .top{border-color:#fff}.item.item--fullsize .top:before{opacity:0}.item.item--fullsize .bottom{background-color:var(--itemBackgroundColor);padding-bottom:30px}.item.item--fullsize .bottom span{-webkit-font-smoothing:antialiased;color:#fff;font-size:15px;font-weight:400;line-height:20px;padding:10px 24px}.item:first-child{left:0;top:0}.item:nth-child(2){right:0;top:0}.item:nth-child(3){bottom:0;left:0}.item:nth-child(4){bottom:0;right:0}.top{background-color:#fff;border:1px solid var(--itemForegroundColor);border-radius:5px 5px 0 0;height:100%;overflow:hidden;position:relative;transition:height .5s ease,border .5s ease}.top:before{background-color:var(--itemAccentColor);border-radius:4px;content:" ";height:4px;left:4px;opacity:0;position:absolute;top:4px;transition:all .6s ease;width:4px}.top img{height:100%;-o-object-fit:contain;object-fit:contain;width:100%}.price{-webkit-font-smoothing:antialiased;background-color:var(--itemBackgroundColor);border-bottom-left-radius:50px;border-top-left-radius:50px;bottom:8px;color:#fff;font-size:12px;line-height:18px;padding:3px 4px 4px 20px;position:absolute;right:-100%;text-align:right;transition:right .5s ease}.price--visible{right:0}.price:before{background-color:var(--itemAccentColor);border-radius:8px;content:" ";height:8px;left:4px;position:absolute;top:8px;width:8px}.bottom{background-color:var(--itemForegroundColor);color:var(--itemBackgroundColor);flex-grow:1;font-size:8px;line-height:12px;min-height:34px;overflow:hidden;padding-bottom:0;position:relative;text-align:center;transition:all .5s ease,background-color .5s ease,color .5s ease}.bottom span{align-items:center;display:flex;flex-grow:1;height:100%;justify-content:center;padding:6px 6px 5px}.bottom span,.button{transition:all .5s ease}.button{-webkit-font-smoothing:antialiased;background-color:var(--itemAccentColor);bottom:-150%;color:#fff;font-size:15px;height:30px;left:0;line-height:30px;position:absolute;text-align:center;text-transform:uppercase;width:100%}.button.button--visible{bottom:0}.footer{-webkit-font-smoothing:antialiased;align-items:flex-end;color:#fff;display:flex;font-size:9px;justify-content:space-between;line-height:16px;text-align:center;z-index:1}.footer,.footer:before{bottom:0;left:0;position:absolute;width:100%}.footer:before{content:" ";height:10px;z-index:-1}.footer:before,.footer__logo{background-color:var(--itemBackgroundColor)}.footer__logo{-webkit-font-smoothing:antialiased;border-top-right-radius:8px;color:#fff;height:4vh;overflow:hidden;padding:0 16px;position:relative;text-decoration:none;transition:all var(--footerDuration) ease;width:30%}.footer__logo:focus,.footer__logo:hover{height:8vh;width:46%}.footer__logo:focus span,.footer__logo:hover span{line-height:8vh;opacity:0}.footer__logo:focus .svg,.footer__logo:hover .svg{opacity:1}.footer__logo span{line-height:4vh;transition:all var(--footerDuration) ease}.footer__logo .svg{left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%);transition:opacity var(--footerDuration) ease;width:66%}.footer__about{height:4vh;padding:0 8px;text-align:center;width:30%}.footer__about,.footer__disclaimer{background-color:var(--itemBackgroundColor);border-top-left-radius:8px}.footer__disclaimer{bottom:0;line-height:10px;opacity:0;padding:5px 20%;position:absolute;right:0;transform:translate(calc(100% - 30vw),calc(100% - 4vh));transition:transform var(--footerDuration) ease,opacity .1s ease;width:95%;z-index:1}.footer__disclaimer:focus,.footer__disclaimer:hover{opacity:1;transform:translate(0,0)}