{"id":3405,"date":"2022-06-09T17:18:39","date_gmt":"2022-06-09T17:18:39","guid":{"rendered":"https:\/\/velonweb.com\/about\/"},"modified":"2025-08-14T16:51:31","modified_gmt":"2025-08-14T16:51:31","slug":"about","status":"publish","type":"page","link":"https:\/\/velonweb.com\/fr\/about\/","title":{"rendered":"about"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"3405\" class=\"elementor elementor-3405 elementor-835\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f3a3ada e-flex e-con-boxed e-con e-parent\" data-id=\"f3a3ada\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-389adef elementor-widget elementor-widget-html\" data-id=\"389adef\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"fr\">\n<head>\n<meta charset=\"UTF-8\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n<title>Carte personnelle de Omar Al-Shahri<\/title>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Tajawal:wght@300;400;500;700;800&display=swap\" rel=\"stylesheet\">\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\n<style>\n    * {\n        margin: 0;\n        padding: 0;\n        box-sizing: border-box;\n    }\n    body {\n        font-family: 'Tajawal', sans-serif;\n        min-height: 90vh;\n        background-size: 300% 300%;\n        animation: gradientBG 15s ease infinite;\n        color: #f0f0f0;\n        align-items: center;\n        overflow-x: hidden;\n    }\n    .container {\n        max-width: 100%;\n        width: 100%;\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        perspective: 1000px;\n    }\n    .card {\n        max-width: 900px;\n        direction: ltr;\n        width: 100%;\n        background: rgba(116, 141, 146, 0.25);\n        border-radius: 25px;\n        padding: 40px;\n        box-shadow: 0 15px 35px rgba(0, 0, 0, 0.4);\n        text-align: center;\n        position: relative;\n        overflow: hidden;\n        backdrop-filter: blur(12px);\n        border: 1px solid rgba(255, 255, 255, 0.15);\n        transform-style: preserve-3d;\n        transition: transform 0.5s ease, box-shadow 0.5s ease;\n        z-index: 10;\n    }\n    .card:hover {\n        transform: translateY(-10px) rotateX(5deg) rotateY(-5deg);\n        box-shadow: 0 20px 50px rgba(0, 0, 0, 0.6);\n    }\n    .card::before {\n        content: '';\n        position: absolute;\n        top: -50%;\n        left: -50%;\n        width: 200%;\n        height: 200%;\n        background: radial-gradient(circle, rgba(209, 224, 227, 0.15) 0%, transparent 70%);\n        transform: rotate(30deg);\n        z-index: -1;\n        animation: rotate 20s linear infinite;\n    }\n    .card::after {\n        content: '';\n        position: absolute;\n        top: 0;\n        left: 0;\n        right: 0;\n        bottom: 0;\n        background: linear-gradient(45deg, \n            transparent 0%, \n            rgba(161, 184, 189, 0.1) 30%, \n            transparent 70%);\n        z-index: -1;\n        pointer-events: none;\n    }\n    @keyframes rotate {\n        0% { transform: rotate(0deg); }\n        100% { transform: rotate(360deg); }\n    }\n    .profile-header {\n        position: relative;\n        margin-bottom: 30px;\n    }\n    .img-container {\n        position: relative;\n        width: 150px;\n        height: 150px;\n        margin: 0 auto 25px;\n        border-radius: 50%;\n        overflow: hidden;\n        border: 4px solid rgba(209, 224, 227, 0.5);\n        box-shadow: 0 0 30px rgba(161, 184, 189, 0.3);\n        transition: all 0.4s ease;\n        animation: float 6s ease-in-out infinite;\n    }\n    .img-container:hover {\n        transform: scale(1.05);\n        box-shadow: 0 0 50px rgba(161, 184, 189, 0.6);\n    }\n    .img {\n        width: 100%;\n        height: 100%;\n        background: linear-gradient(45deg, #5a6e73, #8fa4a9);\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        font-size: 80px;\n        color: rgba(209, 224, 227, 0.8);\n    }\n    .name {\n        font-size: 38px;\n        font-weight: 800;\n        color: #d1e0e3;\n        margin-bottom: 10px;\n        text-shadow: 0 0 15px rgba(161, 184, 189, 0.4);\n        letter-spacing: 1px;\n        position: relative;\n        display: inline-block;\n        padding: 0 20px;\n    }\n    .name::after {\n        content: '';\n        position: absolute;\n        bottom: -10px;\n        left: 20%;\n        width: 60%;\n        height: 3px;\n        background: linear-gradient(90deg, transparent, #d1e0e3, transparent);\n        border-radius: 2px;\n    }\n    .info {\n        font-size: 20px;\n        font-weight: 500;\n        color: #e0e0e0;\n        margin-bottom: 30px;\n        line-height: 1.8;\n        text-align: left;\n        padding: 0 20px;\n        position: relative;\n    }\n    .info p {\n        margin-bottom: 25px;\n        position: relative;\n        padding-left: 20px;\n    }\n    .info p::before {\n        content: '';\n        position: absolute;\n        left: 0;\n        top: 10px;\n        width: 10px;\n        height: 10px;\n        background: #d1e0e3;\n        border-radius: 50%;\n        box-shadow: 0 0 10px #d1e0e3;\n    }\n    .highlight {\n        color: #d1e0e3;\n        font-weight: 800;\n        position: relative;\n    }\n    .highlight::after {\n        content: '';\n        position: absolute;\n        bottom: -2px;\n        left: 0;\n        width: 100%;\n        height: 2px;\n        background: #d1e0e3;\n        transform: scaleX(0);\n        transform-origin: right;\n        transition: transform 0.3s ease;\n    }\n    .highlight:hover::after {\n        transform: scaleX(1);\n        transform-origin: left;\n    }\n    .floating-elements {\n        position: absolute;\n        top: 0;\n        left: 0;\n        width: 100%;\n        height: 100%;\n        pointer-events: none;\n        z-index: -1;\n    }\n    .floating-element {\n        position: absolute;\n        border-radius: 50%;\n        background: rgba(161, 184, 189, 0.16);\n        box-shadow: 0 0 90px rgba(161, 184, 189, 0.2);\n        animation: float 6s ease-in-out infinite;\n    }\n    .floating-element:nth-child(1) {\n        width: 120px;\n        height: 120px;\n        top: 10%;\n        left: 5%;\n        animation-delay: 0s;\n    }\n    .floating-element:nth-child(2) {\n        width: 80px;\n        height: 80px;\n        top: 70%;\n        left: 80%;\n        animation-delay: 2s;\n    }\n    .floating-element:nth-child(3) {\n        width: 60px;\n        height: 60px;\n        top: 40%;\n        left: 75%;\n        animation-delay: 4s;\n    }\n    .floating-element:nth-child(4) {\n        width: 100px;\n        height: 100px;\n        top: 80%;\n        left: 15%;\n        animation-delay: 6s;\n    }\n    @keyframes float {\n        0% { transform: translate(0, 0) rotate(0deg); }\n        33% { transform: translate(20px, -15px) rotate(5deg); }\n        66% { transform: translate(-15px, 10px) rotate(-3deg); }\n        100% { transform: translate(0, 0) rotate(0deg); }\n    }\n    @media (max-width: 768px) {\n        .card { padding: 30px 20px; }\n        .img-container { width: 140px; height: 140px; }\n        .name { font-size: 36px; }\n        .info { font-size: 18px; }\n    }\n    @media (max-width: 480px) {\n        .card { padding: 25px 15px; }\n        .img-container { width: 120px; height: 120px; }\n        .name { font-size: 32px; }\n        .info { font-size: 16px; padding: 0 10px; }\n    }\n<\/style>\n<\/head>\n<body>\n<div class=\"container\">\n    <div class=\"card\">\n        <div class=\"floating-elements\">\n            <div class=\"floating-element\"><\/div>\n            <div class=\"floating-element\"><\/div>\n            <div class=\"floating-element\"><\/div>\n            <div class=\"floating-element\"><\/div>\n        <\/div>\n        <div class=\"profile-header\">\n            <div class=\"img-container\">\n                <div class=\"img\"><i class=\"fas fa-user\"><\/i><\/div>\n            <\/div>\n            <h1 class=\"name\">Omar Alshehri<\/h1>\n            <div class=\"info\">\n                <p>Je suis Omar, concepteur et d\u00e9veloppeur de sites web, et fondateur de <span class=\"highlight\">VelonWeb<\/span>.<br\/>Depuis mes ann\u00e9es d\u2019\u00e9tudes, ma passion pour la technologie et le design m\u2019a pouss\u00e9 \u00e0 transformer des id\u00e9es simples en projets num\u00e9riques concrets qui aident les gens et leur apportent de la valeur.<\/p>\n                <p>J\u2019ai cr\u00e9\u00e9 <span class=\"highlight\">VelonWeb<\/span> dans le but d\u2019offrir des services num\u00e9riques professionnels, avec un style moderne, un prix abordable, et une attention particuli\u00e8re \u00e0 chaque client comme s\u2019il \u00e9tait mon premier.<\/p>\n                <p>Aujourd\u2019hui, je travaille en ind\u00e9pendant et je propose des solutions compl\u00e8tes en conception de sites web, en mettant l\u2019accent sur la qualit\u00e9 et une exp\u00e9rience utilisateur fluide.<\/p>\n                <p>Enregistr\u00e9 officiellement comme travailleur ind\u00e9pendant aupr\u00e8s du Minist\u00e8re des Ressources Humaines et du D\u00e9veloppement Social \u2013 Code du document : <span dir=\"ltr\">FL-757175720<\/span><\/p>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/div>\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-4e3dd64 e-flex e-con-boxed e-con e-parent\" data-id=\"4e3dd64\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5a20ed3 elementor-widget elementor-widget-spacer\" data-id=\"5a20ed3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-e9ff7f4 e-flex e-con-boxed e-con e-parent\" data-id=\"e9ff7f4\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-cad8026 e-con-full e-flex e-con e-child\" data-id=\"cad8026\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-68a2690 elementor-widget elementor-widget-html\" data-id=\"68a2690\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html><html lang=\"ar\"><head><meta charset=\"UTF-8\"><meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"><title>\u0627\u0644\u062a\u0632\u0627\u0645 - \u062a\u0645\u064a\u0632 - \u062a\u0648\u0627\u0635\u0644<\/title><link href=\"https:\/\/fonts.googleapis.com\/css2?family=Tajawal:wght@400;500;700&display=swap\" rel=\"stylesheet\"><link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\"><style>* {\n        margin: 0;\n        padding: 0;\n        box-sizing: border-box;\n    }\n        * {\n            margin: 0;\n            padding: 0;\n            box-sizing: border-box;\n        }\n        \n        body {\n            font-family: 'Tajawal', sans-serif;\n            color: #f0f6fc;\n            min-height: 100vh;\n\n            display: flex;\n            justify-content: center;\n            align-items: center;\n            overflow-x: hidden;\n            \n        \n        }\n        \n        .container {\n            max-width: 100&;\n            width: 100%;\n            margin: 0 auto;\n            direction: ltr;\n            \n            \n        }\n        \n        .features-container {\n            display: flex;\n            flex-direction: column;\n            gap: 20px;\n            \n            \n        }\n        \n        .feature-box {\n    display: flex;\n    align-items: flex-start;\n    padding: 22px;\n    border-radius: 14px;\n    transition: all 0.4s ease;\n    position: relative;\n    overflow: hidden;\n    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25);\n    border: 1px solid rgba(255, 255, 255, 0.08);\n    backdrop-filter: blur(6px);\n\n    \/* \u0625\u0630\u0627 \u062a\u0631\u064a\u062f \u0645\u062d\u0627\u0630\u0627\u0629 \u0627\u0644\u0646\u0635\u0648\u0635 \u0625\u0644\u0649 \u0627\u0644\u064a\u0633\u0627\u0631 *\/\n    text-align: left;\n}\n        \n        .feature-box::before {\n            content: '';\n            position: absolute;\n            top: 0;\n            right: 0;\n            height: 100%;\n            width: 6px;\n            z-index: 2;\n            \n        }\n        \n       \n        .feature-box::after {\n            content: '';\n            position: absolute;\n            top: 0;\n            right: -100%;\n            width: 100%;\n            height: 100%;\n            background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);\n            z-index: 1;\n            animation: lightEffect 3s infinite;\n            animation-delay: 0s;\n            \n        }\n        \n        @keyframes lightEffect {\n            0% {\n                right: -100%;\n            }\n            50% {\n                right: 100%;\n            }\n            100% {\n                right: 100%;\n            }\n            \n        }\n        \n        .feature-icon {\n    font-size: 28px;\n    flex-shrink: 0;\n    width: 50px;\n    height: 50px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 10px;\n    z-index: 3;\n\n    \/* \u0628\u062f\u0644 margin-left \u0625\u0644\u0649 margin-right *\/\n    margin-right: 15px;  \/* \u0628\u062f\u0644\u062a margin-left: 15px; *\/\n}\n        \n       .feature-content {\n    flex-grow: 1;\n    display: flex;\n    flex-direction: column;\n\n    \/* \u0628\u062f\u0644 text-align: center \u0625\u0644\u0649 left *\/\n    text-align: left;\n}\n        \n        .title-container {\n            display: flex;\n            align-items: center;\n            margin-bottom: 12px;\n            \n            \n        }\n        \n        .feature-title {\n            font-size: 1.5rem;\n            font-weight: 700;\n            z-index: 3;\n            color: #fff;\n            font-family: 'Tajawal';\n            margin-top: 10px;\n            \n            \n        }\n        \n        .feature-text {\n    font-size: 1.2rem;\n    font-weight: 600;\n    line-height: 1.8;\n    z-index: 3;\n    color: #c9d1d9;\n\n    direction: ltr; \/* \u0645\u0645\u0643\u0646 \u062a\u062e\u0644\u064a\u0647\u0627 \u0623\u0648 \u062a\u062d\u0630\u0641\u0647\u0627 \u062d\u0633\u0628 \u062d\u0627\u062c\u062a\u0643 *\/\n    text-align: left;\n}\n        \n        \/* \u0623\u0644\u0648\u0627\u0646 \u0645\u063a\u0645\u0642\u0629 \u0648\u062c\u0645\u064a\u0644\u0629 *\/\n        .green {\n            background: rgba(16, 185, 129, 0.15);\n        }\n        \n        .green::before {\n            background: linear-gradient(180deg, #10b981, #059669);\n            box-shadow: 0 0 15px rgba(16, 185, 129, 0.5);\n            \n        }\n        \n        .green .feature-icon {\n            background: rgba(16, 185, 129, 0.2);\n            color: #10b981;\n            box-shadow: 0 0 15px rgba(16, 185, 129, 0.3);\n        }\n        \n        .blue {\n            background: rgba(59, 130, 246, 0.15);\n        }\n        \n        .blue::before {\n            \n            background: linear-gradient(180deg, #3b82f6, #2563eb);\n            box-shadow: 0 0 15px rgba(59, 130, 246, 0.5);\n        }\n        \n        .blue .feature-icon {\n            background: rgba(59, 130, 246, 0.2);\n            color: #3b82f6;\n            box-shadow: 0 0 15px rgba(59, 130, 246, 0.3);\n        }\n        \n        .yellow {\n            background: rgba(245, 158, 11, 0.15);\n        }\n        \n        .yellow::before {\n            background: linear-gradient(180deg, #f59e0b, #d97706);\n            box-shadow: 0 0 15px rgba(245, 158, 11, 0.5);\n        }\n        \n        .yellow .feature-icon {\n            background: rgba(245, 158, 11, 0.2);\n            color: #f59e0b;\n            box-shadow: 0 0 15px rgba(245, 158, 11, 0.3);\n            \n        }\n        \n        .feature-box:hover {\n            transform: translateY(-5px);\n            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.35);\n            \n        }\n        \n        @media (max-width: 768px) {\n            .feature-box {\n                padding: 18px;\n            }\n            \n            .feature-icon {\n                width: 44px;\n                height: 44px;\n                font-size: 24px;\n                margin-left: 12px;\n            }\n            \n            .feature-title {\n                font-size: 1.35rem;\n            }\n            \n            .feature-text {\n                font-size: 1rem;\n            }\n        }\n        @media (min-width: 769px) {\n    .features-container {\n        gap: 16px;\n    }\n\n    .feature-box {\n        padding: 16px;\n    }\n\n    .feature-icon {\n        width: 40px;\n        height: 40px;\n        font-size: 22px;\n        margin-left: 10px;\n        \n    }\n\n    .feature-title {\n        font-size: 1.25rem;\n        margin-top: 6px;\n        \n    }\n\n    .feature-text {\n        font-size: 1.00rem;\n        line-height: 1.6;\n        \n    }\n}\n        \n        @media (max-width: 480px) {\n            .feature-box {\n                flex-direction: column;\n                align-items: flex-start;\n                padding: 16px;\n            }\n            \n            .feature-icon {\n                margin-left: 0;\n                margin-bottom: 12px;\n            }\n            \n            .title-container {\n                flex-direction: row-reverse;\n                justify-content: flex-end;\n            }\n            \n            .feature-title {\n                margin-right: 12px;\n            }\n            \n            .feature-text {\n                font-size: 0.95rem;\n            }\n        }\n    <\/style><\/head><body><div class=\"container\"><div class=\"features-container\"><!-- \u0627\u0644\u0627\u0644\u062a\u0632\u0627\u0645 --><div class=\"feature-box green\"><div class=\"feature-icon\"><i class=\"fas fa-handshake\"><\/i><\/div><div class=\"feature-content\"><div class=\"title-container\"><h3 class=\"feature-title\">Engagement<\/h3><\/div><p class=\"feature-text\">Je m\u2019engage \u00e0 livrer les projets dans les d\u00e9lais avec pr\u00e9cision, en veillant \u00e0 ce que chaque d\u00e9tail soit ex\u00e9cut\u00e9 selon les plus hauts standards de qualit\u00e9. Mon engagement envers mes clients constitue la base d\u2019une relation professionnelle solide et durable.\n                    <\/p><\/div><\/div><!-- \u0627\u0644\u062a\u0645\u064a\u0632 --><div class=\"feature-box blue\"><div class=\"feature-icon\"><i class=\"fas fa-crown\"><\/i><\/div><div class=\"feature-content\"><div class=\"title-container\"><h3 class=\"feature-title\">Excellence<\/h3><\/div><p class=\"feature-text\">Je propose des designs uniques et des services personnalis\u00e9s adapt\u00e9s \u00e0 chaque client, en \u00e9vitant les mod\u00e8les pr\u00e9fabriqu\u00e9s ou la r\u00e9p\u00e9tition. Cette qu\u00eate d\u2019excellence me pousse \u00e0 toujours offrir le meilleur.\n                    <\/p><\/div><\/div><!-- \u0627\u0644\u062a\u0648\u0627\u0635\u0644 --><div class=\"feature-box yellow\"><div class=\"feature-icon\"><i class=\"fas fa-comments\"><\/i><\/div><div class=\"feature-content\"><div class=\"title-container\"><h3 class=\"feature-title\">Communication continue<\/h3><\/div><p class=\"feature-text\">Je crois que la r\u00e9ussite d\u2019un projet commence par une compr\u00e9hension mutuelle. C\u2019est pourquoi je maintiens un suivi et des mises \u00e0 jour constants \u00e0 chaque \u00e9tape. Une communication efficace construit le pont de confiance entre mes clients et moi.\n                    <\/p><\/div><\/div><\/div><\/div><\/body><\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-dee9d5f e-con-full e-flex e-con e-child\" data-id=\"dee9d5f\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-701000c elementor-widget elementor-widget-heading\" data-id=\"701000c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Les valeurs en lesquelles je crois<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-bbef28f elementor-widget elementor-widget-html\" data-id=\"bbef28f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"glitch-container\"><div class=\"glitch-text\" data-text=\"Faire ressortir votre site web\">Faire ressortir votre site web<\/div><\/div><style>* {\n        margin: 0;\n        padding: 0;\n        box-sizing: border-box;\n    }\n.glitch-container {\n  display: flex;\n  justify-content: flex-end;\n  align-items: center;\n  height: 120px;\n  direction: rtl;\n  overflow: hidden;\n}\n\n.glitch-text {\n  position: relative;\n  font-size: 23px;\n  font-weight: 800;\n  color: white;\n  letter-spacing: 1px;\n  animation: glitch-skew 1s infinite linear alternate;\n}\n\n.glitch-text::before,\n.glitch-text::after {\n  content: attr(data-text);\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  overflow: hidden;\n  color: white;\n  background: transparent;\n}\n\n.glitch-text::before {\n  color: #ff00c1;\n  z-index: -1;\n  animation: glitch-anim 0.8s infinite linear alternate-reverse;\n}\n\n.glitch-text::after {\n  color: #00fff9;\n  z-index: -2;\n  animation: glitch-anim 0.8s infinite linear alternate;\n}\n\n@keyframes glitch-skew {\n  0% {\n    transform: skew(0deg);\n  }\n  10% {\n    transform: skew(10deg);\n  }\n  20% {\n    transform: skew(-10deg);\n  }\n  30% {\n    transform: skew(10deg);\n  }\n  40% {\n    transform: skew(-20deg);\n  }\n  50% {\n    transform: skew(10deg);\n  }\n  60% {\n    transform: skew(-10deg);\n  }\n  70% {\n    transform: skew(0deg);\n  }\n  100% {\n    transform: skew(0deg);\n  }\n}\n\n@keyframes glitch-anim {\n  0% {\n    transform: translate(0px, 0px);\n    clip-path: inset(0% 0% 0% 0%);\n  }\n  20% {\n    transform: translate(-1px, -5px);\n    clip-path: inset(10% 0 85% 0);\n  }\n  40% {\n    transform: translate(9px, 2px);\n    clip-path: inset(85% 0 10% 0);\n  }\n  60% {\n    transform: translate(-1px, 2px);\n    clip-path: inset(40% 0 40% 0);\n  }\n  80% {\n    transform: translate(1px, -1px);\n    clip-path: inset(20% 0 60% 0);\n  }\n  100% {\n    transform: translate(0px, 0px);\n    clip-path: inset(0% 0% 0% 0%);\n  }\n}\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-dfcfcf0 e-flex e-con-boxed e-con e-parent\" data-id=\"dfcfcf0\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3cb3afa elementor-widget elementor-widget-spacer\" data-id=\"3cb3afa\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Pellentesque tincidunt tristique neque, eget venenatis enim gravida quis. Fusce at egestas libero. Cras convallis egestas ullamcorper suspens.  <\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-3405","page","type-page","status-publish","hentry"],"blocksy_meta":{"styles_descriptor":{"styles":{"desktop":"[data-prefix=\"single_page\"] .entry-header .page-title {--theme-font-size:30px;} [data-prefix=\"single_page\"] .entry-header .entry-meta {--theme-font-weight:600;--theme-text-transform:uppercase;--theme-font-size:12px;--theme-line-height:1.3;}","tablet":"","mobile":""},"google_fonts":[],"version":6},"disable_share_box":"no","has_hero_section":"enabled","hero_elements":[{"id":"custom_title","enabled":false,"heading_tag":"h1","title":"Home","__id":"Qk0-E8YzrNbWYxeHHOVNT"},{"id":"custom_description","enabled":false,"description_visibility":{"desktop":true,"tablet":true,"mobile":false},"__id":"U6cUh7Wx_GVB3WzUTzfdF"},{"id":"custom_meta","enabled":false,"meta_elements":[{"id":"author","enabled":true,"label":"By","has_author_avatar":"yes","avatar_size":25},{"id":"post_date","enabled":true,"label":"On","date_format_source":"default","date_format":"M j, Y"},{"id":"updated_date","enabled":false,"label":"On","date_format_source":"default","date_format":"M j, Y"},{"id":"categories","enabled":false,"label":"In","style":"simple"},{"id":"comments","enabled":true}],"page_meta_elements":{"joined":true,"articles_count":true,"comments":true},"__id":"jvfpwRb4bZsGGeNF5PTiP"},{"id":"breadcrumbs","enabled":false,"__id":"-vPQk35Eofj91vxNEMRVS"}]},"aioseo_notices":[],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/velonweb.com\/fr\/wp-json\/wp\/v2\/pages\/3405","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/velonweb.com\/fr\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/velonweb.com\/fr\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/velonweb.com\/fr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/velonweb.com\/fr\/wp-json\/wp\/v2\/comments?post=3405"}],"version-history":[{"count":10,"href":"https:\/\/velonweb.com\/fr\/wp-json\/wp\/v2\/pages\/3405\/revisions"}],"predecessor-version":[{"id":4046,"href":"https:\/\/velonweb.com\/fr\/wp-json\/wp\/v2\/pages\/3405\/revisions\/4046"}],"wp:attachment":[{"href":"https:\/\/velonweb.com\/fr\/wp-json\/wp\/v2\/media?parent=3405"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}