Add landing page

assets/fonts/stylesheet.css

@@ -1,72 +0,0 @@
-/*! Generated by Font Squirrel (https://www.fontsquirrel.com) on October 19, 2020 */
-
-
-
-@font-face {
-    font-family: 'nimbus_sans_lbold';
-    src: url('nimbussans-bol.woff2') format('woff2'),
-         url('nimbussans-bol.woff') format('woff');
-    font-weight: normal;
-    font-style: normal;
-
-}
-
-
-
-
-@font-face {
-    font-family: 'nimbus_sans_lbold_italic';
-    src: url('nimbussans-bolita.woff2') format('woff2'),
-         url('nimbussans-bolita.woff') format('woff');
-    font-weight: normal;
-    font-style: normal;
-
-}
-
-
-
-
-@font-face {
-    font-family: 'nimbus_sans_d_otlight';
-    src: url('nimbussans-light.woff2') format('woff2'),
-         url('nimbussans-light.woff') format('woff');
-    font-weight: normal;
-    font-style: normal;
-
-}
-
-
-
-
-@font-face {
-    font-family: 'nimbus_sans_lregular';
-    src: url('nimbussans-reg.woff2') format('woff2'),
-         url('nimbussans-reg.woff') format('woff');
-    font-weight: normal;
-    font-style: normal;
-
-}
-
-
-
-
-@font-face {
-    font-family: 'nimbus_sans_lregular_italic';
-    src: url('nimbussans-regita.woff2') format('woff2'),
-         url('nimbussans-regita.woff') format('woff');
-    font-weight: normal;
-    font-style: normal;
-
-}
-
-
-
-
-@font-face {
-    font-family: 'nimbus_sans_d_otultra_light';
-    src: url('nimbussans-ultralight.woff2') format('woff2'),
-         url('nimbussans-ultralight.woff') format('woff');
-    font-weight: normal;
-    font-style: normal;
-
-}

assets/images/circle.svg

@@ -1,3 +0,0 @@
-<svg width="10" height="10" viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg">
-<circle cx="8.5" cy="8.09998" r="8" fill="black"/>
-</svg>

assets/images/next.svg

@@ -1,5 +0,0 @@
-<svg width="38" height="32" viewBox="0 0 38 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M0.5 13.75H32V18.75H0.5V13.75Z" fill="black"/>
-<path d="M19.3345 28.0845L34.5845 12.8345L38.12 16.37L22.87 31.62L19.3345 28.0845Z" fill="black"/>
-<path d="M34.6072 19.8928L18.9999 4.28553L22.5355 0.75L38.1427 16.3573L34.6072 19.8928Z" fill="black"/>
-</svg>

assets/images/prev.svg

@@ -1,5 +0,0 @@
-<svg width="38" height="32" viewBox="0 0 38 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M38.1427 18.62L6.6427 18.62L6.6427 13.62L38.1427 13.62L38.1427 18.62Z" fill="black"/>
-<path d="M19.3082 4.28549L4.0582 19.5355L0.522664 16L15.7727 0.749954L19.3082 4.28549Z" fill="black"/>
-<path d="M4.03552 12.4772L19.6428 28.0845L16.1072 31.62L0.49999 16.0127L4.03552 12.4772Z" fill="black"/>
-</svg>

assets/js/main.js

@@ -1,555 +0,0 @@
-"use strict";
-
-var view;
-window.scrollTo(0, 0);
-document.addEventListener('DOMContentLoaded', function () {
-  window.onpopstate = function () {
-    window.location.href = window.location.href;
-  };
-
-  var mySwiper;
-  /* ====================
-  =======================
-        VIEW OBJECT
-  =======================
-  ==================== */
-
-  view = {
-    transTime: 250,
-    title: document.querySelector('title').textContent,
-    url: document.querySelector('title').dataset.url,
-    description: document.querySelector('meta[description]').getAttribute('description'),
-    device: '',
-    state: 'grid',
-    scrollPos: 0,
-    prevState: {
-      type: 'none',
-      url: '',
-      title: ''
-    },
-    header: {
-      container: document.querySelector('.header'),
-      logo: document.querySelector('.header__logo'),
-      logoOriginSize: parseInt(window.getComputedStyle(document.querySelector('.header__logo')).getPropertyValue('font-size')),
-      logoBtn: document.querySelector('.logoBtn'),
-      size: 'big',
-      btns: {
-        enable: true,
-        container: document.querySelector('.header__views'),
-        size: document.querySelectorAll('.views__btn--smaller, .views__btn--bigger'),
-        smaller: document.querySelector('.views__btn--smaller'),
-        bigger: document.querySelector('.views__btn--bigger'),
-        close: document.querySelector('.views__btn--close'),
-        list: document.querySelector('.views__btn--mobile'),
-        toClose: function toClose() {
-          if (window.innerWidth > 800) {
-            view.header.btns.size.forEach(function (btn) {
-              btn.classList.add('hide');
-              setTimeout(function () {
-                btn.style.display = 'none';
-              }, view.transTime);
-            });
-          } else {
-            view.header.btns.list.classList.add('hide');
-            setTimeout(function () {
-              view.header.btns.list.style.display = 'none';
-            }, view.transTime);
-          }
-
-          setTimeout(function () {
-            view.header.btns.close.style.display = 'block';
-            view.header.btns.close.classList.remove('hide');
-          }, view.transTime);
-        },
-        toSize: function toSize() {
-          view.header.btns.close.classList.remove('hide');
-          setTimeout(function () {
-            view.header.btns.close.style.display = 'none';
-            view.header.btns.size.forEach(function (btn) {
-              btn.style.display = 'block';
-              setTimeout(function () {
-                btn.classList.remove('hide');
-              }, 50);
-            });
-          }, view.transTime);
-        },
-        toMobileSize: function toMobileSize() {
-          view.header.btns.close.classList.remove('hide');
-          setTimeout(function () {
-            view.header.btns.close.style.display = 'none';
-            view.header.btns.list.style.display = 'block';
-
-            if (view.scrollPos !== 0) {
-              setTimeout(function () {
-                view.header.btns.list.classList.remove('hide');
-              }, 50);
-            }
-          }, view.transTime);
-        }
-      },
-      reduce: function reduce() {
-        if (view.header.size === 'big') {
-          view.header.size = 'normal';
-          view.header.logo.classList.remove('header__logo--big');
-          view.header.container.classList.remove('header--big');
-          setTimeout(function () {
-            view.grid.container.classList.remove('grid--distant');
-          }, 100);
-          setTimeout(function () {
-            view.header.btns.container.classList.remove('header__views--unvisible');
-            view.header.size = 'normal';
-          }, view.transTime);
-        }
-      },
-      toInfo: function toInfo() {
-        view.header.logo.textContent = 'INFO';
-      },
-      toName: function toName() {
-        view.header.logo.textContent = 'DATA';
-      }
-    },
-    grid: {
-      container: document.querySelector('.grid'),
-      blocks: document.querySelectorAll('.block'),
-      images: document.querySelectorAll('.block__image'),
-      showBlocks: function showBlocks(block) {
-        var image = block.querySelector('.block__image');
-
-        if (image.complete) {
-          setTimeout(function () {
-            block.parentNode.classList.remove('toProject--wait');
-            setTimeout(function () {
-              block.classList.remove('hide');
-            }, view.transTime);
-          }, 100);
-        } else {
-          image.addEventListener('load', function () {
-            block.parentNode.classList.remove('toProject--wait');
-            setTimeout(function () {
-              block.classList.remove('hide');
-            }, view.transTime);
-          });
-        }
-      },
-      smaller: function smaller() {
-        if (view.state === 'grid' && view.header.btns.enable === true) {
-          if (view.grid.container.classList.contains('grid--0')) {
-            view.grid.container.classList.remove('grid--full');
-            view.grid.blocks.forEach(function (block) {
-              block.querySelector('.block__image').classList.remove('block__image--full');
-            });
-            view.grid.container.classList.remove('grid--0');
-            view.grid.container.classList.add('grid--1');
-          } else if (view.grid.container.classList.contains('grid--1')) {
-            view.grid.container.classList.remove('grid--1');
-            view.grid.container.classList.add('grid--2');
-          } else if (view.grid.container.classList.contains('grid--2')) {
-            view.grid.container.classList.remove('grid--2');
-            view.grid.container.classList.add('grid--3');
-          } else if (view.grid.container.classList.contains('grid--3')) {
-            view.grid.container.classList.remove('grid--3');
-            view.grid.container.classList.add('grid--4');
-          } else if (view.grid.container.classList.contains('grid--4')) {
-            view.grid.container.classList.remove('grid--4');
-            view.grid.container.classList.add('grid--5');
-          } else if (view.grid.container.classList.contains('grid--5')) {
-            view.grid.container.classList.remove('grid--5');
-            view.grid.container.classList.add('list');
-            view.list.init();
-          }
-        }
-      },
-      bigger: function bigger() {
-        if (view.state !== 'project' && view.header.btns.enable === true) {
-          view.header.btns.enable = false; // if (view.grid.container.classList.contains('grid--0') !== true) {
-          //   view.grid.container.classList.add('hide')
-          //   view.list.container.classList.add('hide')
-          // }
-
-          if (view.grid.container.classList.contains('list')) {
-            view.list.toGrid();
-          } else if (view.grid.container.classList.contains('grid--5')) {
-            view.grid.container.classList.remove('grid--5');
-            view.grid.container.classList.add('grid--4');
-          } else if (view.grid.container.classList.contains('grid--4')) {
-            view.grid.container.classList.remove('grid--4');
-            view.grid.container.classList.add('grid--3');
-          } else if (view.grid.container.classList.contains('grid--3')) {
-            view.grid.container.classList.remove('grid--3');
-            view.grid.container.classList.add('grid--2');
-          } else if (view.grid.container.classList.contains('grid--2')) {
-            view.grid.container.classList.remove('grid--2');
-            view.grid.container.classList.add('grid--1');
-          } else if (view.grid.container.classList.contains('grid--1')) {
-            view.grid.container.classList.remove('grid--1');
-            view.grid.container.classList.add('grid--0');
-            view.grid.blocks.forEach(function (block) {
-              view.grid.container.classList.add('grid--full');
-              block.querySelector('.block__image').classList.add('block__image--full');
-            });
-          }
-
-          setTimeout(function () {
-            view.grid.container.classList.remove('hide');
-            view.header.btns.enable = true;
-          }, 100);
-        }
-      },
-      projects: document.querySelectorAll('.toProject')
-    },
-    project: {
-      container: document.querySelector('.project'),
-      init: function init(link, title, toHide, toFill) {
-        view.prevState.type = view.state;
-        view.prevState.url = '';
-        view.prevState.title = '';
-        view.state = 'project';
-        history.pushState(null, title, link);
-        toHide.classList.add('hide');
-        fetch(link).then(function (res) {
-          return res.text();
-        }).then(function (html) {
-          var domElement = document.createElement('div');
-          domElement.classList.add('test-container');
-          domElement.innerHTML = html;
-          var projectContent = domElement.querySelector('.projectContainer').innerHTML;
-          toFill.innerHTML = projectContent;
-          view.project.swiper.init();
-        }).then(function () {
-          document.querySelector('.toProjectDesc').addEventListener('click', function () {
-            console.log(document.querySelectorAll('.swiper-slide').length - 2);
-            mySwiper.slideTo(document.querySelectorAll('.swiper-slide').length - 2);
-          });
-          setTimeout(function () {
-            toFill.style.display = 'block';
-            setTimeout(function () {
-              view.project.fadeIn(toHide, toFill);
-            }, 50);
-          }, view.transTime);
-        });
-      },
-      fadeIn: function fadeIn(toHide, toFill) {
-        toHide.style.display = 'none';
-        toFill.style.display = 'block';
-        toFill.classList.remove('hide');
-        toHide.removeEventListener('transitionend', view.project.fadeIn());
-      },
-      close: function close() {
-        history.pushState(null, view.title, view.url);
-        console.log("view.state : ".concat(view.state));
-        console.log("prevState : ".concat(view.prevState.type));
-        view.project.container.classList.add('hide');
-        setTimeout(function () {
-          view.project.container.style.display = 'none';
-
-          if (view.prevState.type === 'list') {
-            var toShow = window.innerWidth > 800 ? view.list.container : view.list.mobileContainer;
-            toShow.style.display = 'block';
-            setTimeout(function () {
-              toShow.classList.remove('hide');
-              view.state = 'list';
-            }, 50);
-          } else if (view.prevState.type === 'grid' || view.prevState.type === 'agency') {
-            if (view.grid.container.classList.contains('list')) {
-              window.innerWidth > 800 ? view.list.container.style.display = 'block' : view.list.mobileContainer.style.display = 'block';
-              setTimeout(function () {
-                window.innerWidth > 800 ? view.list.container.classList.remove('hide') : view.list.mobileContainer.classList.remove('hide');
-                view.state = 'list';
-              }, 50);
-            } else {
-              window.innerWidth > 800 ? view.grid.container.style.display = 'grid' : view.grid.container.style.display = 'block';
-              setTimeout(function () {
-                view.grid.container.classList.remove('hide');
-                view.state = 'grid';
-              }, 50);
-            }
-          } else if (view.prevState.type === 'project') {
-            view.project.swiper.destroy();
-            view.project.init(view.prevState.url, view.prevState.title, document.querySelector('.project'), document.querySelector('.project'));
-          }
-        }, view.transTime);
-      },
-      swiper: {
-        init: function init() {
-          mySwiper = new Swiper('.swiper-container', {
-            // Optional parameters
-            direction: 'horizontal',
-            loop: true,
-            observer: true,
-            observeSlideChildren: true,
-            observeParents: true,
-            speed: 300,
-            autoplay: {
-              delay: 2000
-            },
-            // Responsive
-            breakpoints: {
-              800: {
-                speed: 500,
-                autoplay: false
-              }
-            },
-            // Navigation arrows
-            navigation: {
-              nextEl: '.swiper-button-next',
-              prevEl: '.swiper-button-prev'
-            },
-            // Keyboard control
-            keyboard: {
-              enabled: true
-            }
-          });
-        },
-        destroy: function destroy() {
-          mySwiper.destroy();
-        }
-      }
-    },
-    agency: {
-      init: function init(link, title, toHide, toFill) {
-        view.prevState.type = view.state;
-
-        if (view.state === 'grid' || view.state === 'list') {
-          view.prevState.url = '';
-          view.prevState.title = '';
-        } else if (view.state === 'project') {
-          view.prevState.url = window.location.href;
-          view.prevState.title = title;
-        }
-
-        view.state = 'agency';
-        history.pushState(null, title, link);
-        toHide.classList.add('hide');
-        fetch(link).then(function (res) {
-          return res.text();
-        }).then(function (html) {
-          var domElement = document.createElement('div');
-          domElement.classList.add('test-container');
-          domElement.innerHTML = html;
-          var pageContent = domElement.querySelector('.wrapper').innerHTML;
-          setTimeout(function () {
-            toFill.innerHTML = pageContent;
-            toFill.style.display = 'block';
-            setTimeout(function () {
-              view.project.fadeIn(toHide, toFill);
-            }, 50);
-          }, view.transTime);
-        });
-      }
-    },
-    list: {
-      container: document.querySelector('.list'),
-      mobileContainer: document.querySelector('.list--mobile'),
-      init: function init() {
-        var list = view.device === 'desktop' ? view.list.container : view.list.mobileContainer;
-        view.prevState.type = view.state;
-        view.prevState.url = '';
-        view.prevState.title = '';
-        view.state = 'list';
-        view.grid.container.style.display = 'none';
-        list.style.display = 'block';
-        setTimeout(function () {
-          list.classList.remove('hide');
-        }, 50);
-      },
-      toGrid: function toGrid() {
-        view.prevState.type = view.state;
-        view.state = 'grid';
-        view.grid.container.classList.remove('list');
-        view.grid.container.classList.add('grid--5');
-        window.innerWidth > 800 ? view.list.container.style.display = 'none' : view.list.mobileContainer.style.display = 'none';
-        view.grid.container.style.display = '';
-      }
-    }
-  };
-  /* ====================
-  =======================
-      INTERACTIONS
-  =======================
-  ==================== */
-  // =========================================== BLOCK FADE IN ON LOAD
-
-  if (window.innerWidth > 800) {
-    view.device = 'desktop';
-  } else {
-    view.device = 'mobile';
-  }
-
-  view.grid.blocks.forEach(function (block) {
-    view.grid.showBlocks(block);
-  }); // =========================================== LOGO STRETCHING
-
-  view.header.logo.style.fontSize = view.header.logoOriginSize;
-  var prevScrollPos = 0;
-  window.addEventListener('scroll', function (event) {
-    if (window.scrollY * -1.007 + view.header.logoOriginSize >= 40 && view.state !== 'agency' && view.state !== 'project') {
-      view.header.logo.style.fontSize = "".concat(window.scrollY * -1.007 + view.header.logoOriginSize, "px");
-
-      if (!view.header.btns.list.classList.contains('hide')) {
-        view.header.btns.list.classList.add('hide');
-      }
-    } else {
-      if (view.header.logo.style.fontSize !== '40 px') {
-        view.header.logo.style.fontSize = '40px';
-        view.header.btns.list.classList.remove('hide');
-      }
-    }
-  }); // =========================================== VIEW BUTTON
-
-  view.header.btns.smaller.addEventListener('click', function () {
-    view.grid.smaller();
-  });
-  view.header.btns.bigger.addEventListener('click', function () {
-    view.grid.bigger();
-  }); // =========================================== CLOSE BTN
-
-  view.header.btns.close.addEventListener('click', function () {
-    if (view.header.btns.enable === true) {
-      if (view.state === 'agency') {
-        view.header.toName();
-      }
-
-      if (view.state === 'project' || view.prevState.type === 'grid' || view.prevState.type === 'list') {
-        if (view.scrollPos === 0) {
-          view.header.logo.style.fontSize = view.header.logoOriginSize + 'px';
-          setTimeout(function () {
-            view.header.logo.style.transition = '';
-          }, 300);
-        } else {
-          setTimeout(function () {
-            window.scrollTo(0, view.scrollPos);
-            setTimeout(function () {
-              view.header.logo.style.transition = '';
-            }, 300);
-          }, 300);
-        }
-      }
-
-      view.project.close();
-
-      if (view.prevState.type !== 'project') {
-        if (window.innerWidth > 800) {
-          view.header.btns.toSize();
-        } else {
-          view.header.btns.toMobileSize();
-        }
-      }
-    }
-  });
-  view.header.btns.list.addEventListener('click', function () {
-    if (view.state === 'grid') {
-      view.state === 'list';
-      view.header.btns.list.querySelector('h1').textContent = 'images';
-      view.grid.container.classList.add('list');
-      view.list.init();
-    } else {
-      view.state === 'grid';
-      view.header.btns.list.querySelector('h1').textContent = 'liste';
-      view.grid.container.classList.remove('list');
-      view.list.toGrid();
-    }
-  });
-  document.addEventListener('keydown', function (event) {
-    if (view.state === 'project' && view.header.btns.enable === true && event.code === 'Escape') {
-      if (view.header.btns.enable === true) {
-        if (view.state === 'agency') {
-          view.header.toName();
-        }
-
-        if (view.state === 'project' || view.prevState.type === 'grid' || view.prevState.type === 'list') {
-          if (view.scrollPos === 0) {
-            view.header.logo.style.fontSize = view.header.logoOriginSize + 'px';
-            setTimeout(function () {
-              view.header.logo.style.transition = '';
-            }, 300);
-          } else {
-            setTimeout(function () {
-              window.scrollTo(0, view.scrollPos);
-              setTimeout(function () {
-                view.header.logo.style.transition = '';
-              }, 300);
-            }, 300);
-          }
-        }
-
-        view.project.close();
-
-        if (view.prevState.type !== 'project') {
-          if (window.innerWidth > 800) {
-            view.header.btns.toSize();
-          } else {
-            view.header.btns.toMobileSize();
-          }
-        }
-      }
-    }
-  });
-  document.querySelector('.grid, grid--mobile').addEventListener('click', function () {
-    if (view.header.size === 'big') {
-      view.header.reduce();
-    }
-  });
-  view.header.logo.addEventListener('mouseenter', function () {
-    if (view.state !== 'agency') {
-      view.header.toInfo();
-    }
-  });
-  view.header.logo.addEventListener('mouseleave', function () {
-    if (view.state !== 'agency') {
-      view.header.toName();
-    }
-  }); // /* ====================
-  // =======================
-  // --------- SPA ---------
-  // =======================
-  // ==================== */
-
-  document.querySelectorAll('.toProject, .list__project, .list__project--mobile').forEach(function (project) {
-    project.addEventListener('click', function (e) {
-      view.scrollPos = window.scrollY;
-      e.preventDefault();
-      view.header.logo.style.transition = 'font-size .3s ease-in-out';
-      setTimeout(function () {
-        view.header.logo.style.fontSize = '2.5rem';
-      }, 10);
-      view.header.btns.toClose();
-      var link = project.getAttribute('href');
-      var title = project.dataset.title;
-      var description = project.dataset.description;
-
-      if (view.state === 'list') {
-        window.innerWidth > 800 ? view.project.init(link, title, view.list.container, view.project.container) : view.project.init(link, title, view.list.mobileContainer, view.project.container);
-      } else {
-        view.project.init(link, title, view.grid.container, view.project.container);
-      }
-    });
-  }); // =========================================== LOGO BTN AGENCE
-
-  view.header.logoBtn.addEventListener('click', function (e) {
-    e.preventDefault();
-    view.scrollPos = window.scrollY;
-    view.header.logo.style.transition = 'font-size .3s ease-in-out';
-    setTimeout(function () {
-      view.header.logo.style.fontSize = '2.5rem';
-    }, 10);
-    view.header.btns.toClose();
-    var link = view.header.logoBtn.getAttribute('href');
-    var title = view.header.logoBtn.dataset.title;
-    setTimeout(function () {
-      window.scrollTo(0, 0);
-    }, 300);
-
-    if (view.state === 'list') {
-      window.innerWidth > 800 ? view.agency.init(link, title, view.list.container, view.project.container) : view.agency.init(link, title, view.list.mobileContainer, view.project.container);
-    } else if (view.state === 'project') {
-      view.agency.init(link, title, view.project.container, view.project.container);
-    } else if (view.state === 'grid') {
-      view.agency.init(link, title, view.grid.container, view.project.container);
-    }
-  });
-  /* ====================
-  =======================
-          END
-  =======================
-  ==================== */
-});

assets/svg/bigger.svg

@@ -1 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="100%" height="100%" viewBox="0 0 130 130" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><g><rect x="0" y="54.167" width="129.167" height="20.833"/><path d="M54.167,0l-0,129.167l20.833,-0l-0,-129.167l-20.833,0Z"/></g></svg>

assets/svg/close.svg

@@ -1 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="100%" height="100%" viewBox="0 0 130 130" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><g><path d="M113.432,-0l-113.432,113.432l14.731,14.731l113.432,-113.432l-14.731,-14.731Z"/><path d="M-0,14.731l113.432,113.432l14.731,-14.731l-113.432,-113.432l-14.731,14.731Z"/></g></svg>

assets/svg/smaller.svg

@@ -1 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="100%" height="100%" viewBox="0 0 130 130" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><rect x="0" y="54.167" width="129.167" height="20.833"/></svg>