Spaces:
Running
Running
File size: 54,313 Bytes
bd2bf69 bdb3f4b bd2bf69 14ed44c bd2bf69 14ed44c bd2bf69 bdb3f4b bd2bf69 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288 289 290 291 292 293 294 295 296 297 298 299 300 301 302 303 304 305 306 307 308 309 310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325 326 327 328 329 330 331 332 333 334 335 336 337 338 339 340 341 342 343 344 345 | <html lang="en"><head><meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<base href="/">
<link rel="stylesheet" href="bootstrap/bootstrap.min.css">
<link rel="stylesheet" href="app.css">
<link rel="stylesheet" href="MatinikTaff.styles.css">
<link rel="icon" type="image/png" href="favicon.png">
<style>*, ::before, ::after{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/* ! tailwindcss v3.4.16 | MIT License | https://tailwindcss.com */*,::after,::before{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}::after,::before{--tw-content:''}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}.pointer-events-none{pointer-events:none}.absolute{position:absolute}.relative{position:relative}.inset-y-0{top:0px;bottom:0px}.-bottom-10{bottom:-2.5rem}.left-0{left:0px}.left-4{left:1rem}.right-0{right:0px}.mx-auto{margin-left:auto;margin-right:auto}.-mr-2{margin-right:-0.5rem}.mb-1{margin-bottom:0.25rem}.mb-2{margin-bottom:0.5rem}.mb-4{margin-bottom:1rem}.mb-8{margin-bottom:2rem}.ml-1{margin-left:0.25rem}.mr-1{margin-right:0.25rem}.mr-2{margin-right:0.5rem}.mt-3{margin-top:0.75rem}.mt-4{margin-top:1rem}.mt-5{margin-top:1.25rem}.mt-8{margin-top:2rem}.block{display:block}.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.hidden{display:none}.h-16{height:4rem}.h-24{height:6rem}.h-4{height:1rem}.h-6{height:1.5rem}.h-screen{height:100vh}.w-11{width:2.75rem}.w-4{width:1rem}.w-64{width:16rem}.w-full{width:100%}.max-w-5xl{max-width:64rem}.max-w-7xl{max-width:80rem}.flex-1{flex:1 1 0%}.flex-shrink-0{flex-shrink:0}.transform{transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.cursor-pointer{cursor:pointer}.grid-cols-1{grid-template-columns:repeat(1, minmax(0, 1fr))}.grid-cols-2{grid-template-columns:repeat(2, minmax(0, 1fr))}.items-start{align-items:flex-start}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-4{gap:1rem}.gap-8{gap:2rem}.space-x-6 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(1.5rem * var(--tw-space-x-reverse));margin-left:calc(1.5rem * calc(1 - var(--tw-space-x-reverse)))}.space-y-1 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0.25rem * var(--tw-space-y-reverse))}.space-y-4 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:0.5rem}.rounded-md{border-radius:0.375rem}.rounded-xl{border-radius:0.75rem}.rounded-r-md{border-top-right-radius:0.375rem;border-bottom-right-radius:0.375rem}.border{border-width:1px}.border-r{border-right-width:1px}.border-t{border-top-width:1px}.border-gray-100{--tw-border-opacity:1;border-color:rgb(243 244 246 / var(--tw-border-opacity, 1))}.border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1))}.border-gray-300{--tw-border-opacity:1;border-color:rgb(209 213 219 / var(--tw-border-opacity, 1))}.border-gray-700{--tw-border-opacity:1;border-color:rgb(55 65 81 / var(--tw-border-opacity, 1))}.border-transparent{border-color:transparent}.bg-gray-200{--tw-bg-opacity:1;background-color:rgb(229 231 235 / var(--tw-bg-opacity, 1))}.bg-gray-50{--tw-bg-opacity:1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1))}.bg-gray-800{--tw-bg-opacity:1;background-color:rgb(31 41 55 / var(--tw-bg-opacity, 1))}.bg-indigo-600{--tw-bg-opacity:1;background-color:rgb(79 70 229 / var(--tw-bg-opacity, 1))}.bg-purple-600{--tw-bg-opacity:1;background-color:rgb(147 51 234 / var(--tw-bg-opacity, 1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.bg-gradient-to-r{background-image:linear-gradient(to right, var(--tw-gradient-stops))}.from-blue-500{--tw-gradient-from:#3b82f6 var(--tw-gradient-from-position);--tw-gradient-to:rgb(59 130 246 / 0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to)}.to-purple-600{--tw-gradient-to:#9333ea var(--tw-gradient-to-position)}.p-2{padding:0.5rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.px-3{padding-left:0.75rem;padding-right:0.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.py-12{padding-top:3rem;padding-bottom:3rem}.py-2{padding-top:0.5rem;padding-bottom:0.5rem}.py-3{padding-top:0.75rem;padding-bottom:0.75rem}.pb-5{padding-bottom:1.25rem}.pl-10{padding-left:2.5rem}.pl-3{padding-left:0.75rem}.pr-28{padding-right:7rem}.pt-14{padding-top:3.5rem}.pt-4{padding-top:1rem}.pt-8{padding-top:2rem}.text-left{text-align:left}.text-center{text-align:center}.text-2xl{font-size:1.5rem;line-height:2rem}.text-base{font-size:1rem;line-height:1.5rem}.text-sm{font-size:0.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.tracking-wider{letter-spacing:0.05em}.text-gray-300{--tw-text-opacity:1;color:rgb(209 213 219 / var(--tw-text-opacity, 1))}.text-gray-400{--tw-text-opacity:1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}.text-gray-600{--tw-text-opacity:1;color:rgb(75 85 99 / var(--tw-text-opacity, 1))}.text-gray-700{--tw-text-opacity:1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}.text-gray-800{--tw-text-opacity:1;color:rgb(31 41 55 / var(--tw-text-opacity, 1))}.text-gray-900{--tw-text-opacity:1;color:rgb(17 24 39 / var(--tw-text-opacity, 1))}.text-indigo-600{--tw-text-opacity:1;color:rgb(79 70 229 / var(--tw-text-opacity, 1))}.text-purple-600{--tw-text-opacity:1;color:rgb(147 51 234 / var(--tw-text-opacity, 1))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.text-yellow-500{--tw-text-opacity:1;color:rgb(234 179 8 / var(--tw-text-opacity, 1))}.placeholder-gray-500::placeholder{--tw-placeholder-opacity:1;color:rgb(107 114 128 / var(--tw-placeholder-opacity, 1))}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 rgb(0 0 0 / 0.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.transition{transition-property:color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.duration-200{transition-duration:200ms}.duration-300{transition-duration:300ms}.after\:absolute::after{content:var(--tw-content);position:absolute}.after\:left-\[2px\]::after{content:var(--tw-content);left:2px}.after\:top-\[2px\]::after{content:var(--tw-content);top:2px}.after\:h-5::after{content:var(--tw-content);height:1.25rem}.after\:w-5::after{content:var(--tw-content);width:1.25rem}.after\:rounded-full::after{content:var(--tw-content);border-radius:9999px}.after\:border::after{content:var(--tw-content);border-width:1px}.after\:border-gray-300::after{content:var(--tw-content);--tw-border-opacity:1;border-color:rgb(209 213 219 / var(--tw-border-opacity, 1))}.after\:bg-white::after{content:var(--tw-content);--tw-bg-opacity:1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.after\:transition-all::after{content:var(--tw-content);transition-property:all;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.after\:content-\[\'\'\]::after{--tw-content:'';content:var(--tw-content)}.hover\:-translate-y-1:hover{--tw-translate-y:-0.25rem;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\:bg-gray-100:hover{--tw-bg-opacity:1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.hover\:bg-indigo-700:hover{--tw-bg-opacity:1;background-color:rgb(67 56 202 / var(--tw-bg-opacity, 1))}.hover\:bg-purple-700:hover{--tw-bg-opacity:1;background-color:rgb(126 34 206 / var(--tw-bg-opacity, 1))}.hover\:text-gray-500:hover{--tw-text-opacity:1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}.hover\:text-indigo-600:hover{--tw-text-opacity:1;color:rgb(79 70 229 / var(--tw-text-opacity, 1))}.hover\:text-white:hover{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.hover\:shadow-lg:hover{--tw-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring-2:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000)}.focus\:ring-inset:focus{--tw-ring-inset:inset}.focus\:ring-indigo-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(99 102 241 / var(--tw-ring-opacity, 1))}.focus\:ring-offset-2:focus{--tw-ring-offset-width:2px}.peer:checked ~ .peer-checked\:bg-indigo-600{--tw-bg-opacity:1;background-color:rgb(79 70 229 / var(--tw-bg-opacity, 1))}.peer:checked ~ .peer-checked\:after\:translate-x-full::after{content:var(--tw-content);--tw-translate-x:100%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.peer:checked ~ .peer-checked\:after\:border-white::after{content:var(--tw-content);--tw-border-opacity:1;border-color:rgb(255 255 255 / var(--tw-border-opacity, 1))}.peer:focus ~ .peer-focus\:outline-none{outline:2px solid transparent;outline-offset:2px}.peer:focus ~ .peer-focus\:ring-4{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000)}.peer:focus ~ .peer-focus\:ring-indigo-300{--tw-ring-opacity:1;--tw-ring-color:rgb(165 180 252 / var(--tw-ring-opacity, 1))}@media (min-width: 640px){.sm\:grid-cols-2{grid-template-columns:repeat(2, minmax(0, 1fr))}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}}@media (min-width: 768px){.md\:order-1{order:1}.md\:order-2{order:2}.md\:ml-6{margin-left:1.5rem}.md\:mt-0{margin-top:0px}.md\:block{display:block}.md\:flex{display:flex}.md\:hidden{display:none}.md\:max-w-sm{max-width:24rem}.md\:grid-cols-4{grid-template-columns:repeat(4, minmax(0, 1fr))}.md\:items-center{align-items:center}.md\:justify-between{justify-content:space-between}.md\:space-x-8 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(2rem * var(--tw-space-x-reverse));margin-left:calc(2rem * calc(1 - var(--tw-space-x-reverse)))}}@media (min-width: 1024px){.lg\:grid-cols-3{grid-template-columns:repeat(3, minmax(0, 1fr))}.lg\:px-8{padding-left:2rem;padding-right:2rem}}@media (min-width: 1280px){.xl\:grid-cols-4{grid-template-columns:repeat(4, minmax(0, 1fr))}}</style></head>
<body><script src="https://cdn.tailwindcss.com" b-bhopcadze7=""></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" b-bhopcadze7="">
<link href="css/site.css" rel="stylesheet" b-bhopcadze7="">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css" rel="stylesheet" b-bhopcadze7="">
<div class="main-layout" b-bhopcadze7=""><nav class="bg-white shadow-lg" b-s133ccvhw9=""><div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8" b-s133ccvhw9=""><div class="flex justify-between h-16" b-s133ccvhw9=""><div class="flex items-center" b-s133ccvhw9=""><div class="flex-shrink-0 flex items-center" b-s133ccvhw9=""><i class="fas fa-hands-helping text-indigo-600 text-2xl mr-2" b-s133ccvhw9=""></i>
<span class="text-xl font-bold text-indigo-600" b-s133ccvhw9="">SkillBridge</span></div></div>
<div class="hidden md:ml-6 md:flex md:items-center md:space-x-8" b-s133ccvhw9=""><a href="/Categories" class="text-gray-900 hover:text-indigo-600 px-3 py-2 text-sm font-medium" b-s133ccvhw9="">Trouver un artisan</a>
<a href="#" class="text-gray-500 hover:text-indigo-600 px-3 py-2 text-sm font-medium" b-s133ccvhw9="">Trouver un travail</a>
<a href="/Weather" class="text-gray-500 hover:text-indigo-600 px-3 py-2 text-sm font-medium" b-s133ccvhw9="">Poster un travail</a></div>
<div class="hidden md:ml-6 md:flex md:items-center" b-s133ccvhw9=""><a href="#" class="text-gray-900 hover:text-indigo-600 px-3 py-2 text-sm font-medium" b-s133ccvhw9="">S'inscrire</a>
<a href="#" class="px-4 py-2 border border-transparent text-sm font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700" b-s133ccvhw9="">Se connecter</a></div>
<div class="-mr-2 flex items-center md:hidden" b-s133ccvhw9=""><button type="button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500" b-s133ccvhw9=""><span class="sr-only" b-s133ccvhw9="">Open main menu</span>
<i class="fas fa-bars" b-s133ccvhw9=""></i></button></div></div></div></nav>
<div class="main-content" b-bhopcadze7=""><!--!--><div class="flex"><!--!--><div class="hidden md:block w-64 h-screen bg-white border-r border-gray-200 p-4 overflow-y-auto"><!--!--><div class="mb-8"><div class="flex items-center justify-between mb-4"><span class="text-sm font-medium text-gray-500">Artisans</span>
<label class="relative inline-flex items-center cursor-pointer"><input type="checkbox" class="sr-only peer" checked="">
<div class="w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-indigo-300 rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-indigo-600"></div></label>
<span class="text-sm font-medium text-gray-500">Services</span></div></div>
<div><!--!--><h3 class="text-sm font-semibold text-gray-500 uppercase tracking-wider mb-2">Catégories</h3>
<div class="space-y-1"><div class="mb-1"><button class="flex justify-between items-center w-full px-3 py-2 text-sm font-medium text-left text-gray-700 bg-gray-50 hover:bg-gray-100 rounded-md"><span>Bâtiment & Rénovation</span><!--!-->
<svg class="w-4 h-4 transition-transform duration-200 " fill="none" stroke="currentColor" viewBox="0 0 24 24"><!--!--><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg></button></div><div class="mb-1"><button class="flex justify-between items-center w-full px-3 py-2 text-sm font-medium text-left text-gray-700 bg-gray-50 hover:bg-gray-100 rounded-md"><span>Informatique & Tech</span><!--!-->
<svg class="w-4 h-4 transition-transform duration-200 " fill="none" stroke="currentColor" viewBox="0 0 24 24"><!--!--><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg></button></div><div class="mb-1"><button class="flex justify-between items-center w-full px-3 py-2 text-sm font-medium text-left text-gray-700 bg-gray-50 hover:bg-gray-100 rounded-md"><span>Beauté & Bien-être</span><!--!-->
<svg class="w-4 h-4 transition-transform duration-200 " fill="none" stroke="currentColor" viewBox="0 0 24 24"><!--!--><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg></button></div><div class="mb-1"><button class="flex justify-between items-center w-full px-3 py-2 text-sm font-medium text-left text-gray-700 bg-gray-50 hover:bg-gray-100 rounded-md"><span>Événementiel</span><!--!-->
<svg class="w-4 h-4 transition-transform duration-200 " fill="none" stroke="currentColor" viewBox="0 0 24 24"><!--!--><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg></button></div><div class="mb-1"><button class="flex justify-between items-center w-full px-3 py-2 text-sm font-medium text-left text-gray-700 bg-gray-50 hover:bg-gray-100 rounded-md"><span>Cours particuliers</span><!--!-->
<svg class="w-4 h-4 transition-transform duration-200 " fill="none" stroke="currentColor" viewBox="0 0 24 24"><!--!--><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg></button></div><div class="mb-1"><button class="flex justify-between items-center w-full px-3 py-2 text-sm font-medium text-left text-gray-700 bg-gray-50 hover:bg-gray-100 rounded-md"><span>Jardinage & Extérieurs</span><!--!-->
<svg class="w-4 h-4 transition-transform duration-200 " fill="none" stroke="currentColor" viewBox="0 0 24 24"><!--!--><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg></button></div><div class="mb-1"><button class="flex justify-between items-center w-full px-3 py-2 text-sm font-medium text-left text-gray-700 bg-gray-50 hover:bg-gray-100 rounded-md"><span>Nettoyage & Ménage</span><!--!-->
<svg class="w-4 h-4 transition-transform duration-200 " fill="none" stroke="currentColor" viewBox="0 0 24 24"><!--!--><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg></button></div><div class="mb-1"><button class="flex justify-between items-center w-full px-3 py-2 text-sm font-medium text-left text-gray-700 bg-gray-50 hover:bg-gray-100 rounded-md"><span>Services Véhicule</span><!--!-->
<svg class="w-4 h-4 transition-transform duration-200 " fill="none" stroke="currentColor" viewBox="0 0 24 24"><!--!--><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg></button></div><div class="mb-1"><button class="flex justify-between items-center w-full px-3 py-2 text-sm font-medium text-left text-gray-700 bg-gray-50 hover:bg-gray-100 rounded-md"><span>Animaux</span><!--!-->
<svg class="w-4 h-4 transition-transform duration-200 " fill="none" stroke="currentColor" viewBox="0 0 24 24"><!--!--><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg></button></div><div class="mb-1"><button class="flex justify-between items-center w-full px-3 py-2 text-sm font-medium text-left text-gray-700 bg-gray-50 hover:bg-gray-100 rounded-md"><span>Petits Bricolages</span><!--!-->
<svg class="w-4 h-4 transition-transform duration-200 " fill="none" stroke="currentColor" viewBox="0 0 24 24"><!--!--><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg></button></div><div class="mb-1"><button class="flex justify-between items-center w-full px-3 py-2 text-sm font-medium text-left text-gray-700 bg-gray-50 hover:bg-gray-100 rounded-md"><span>Transport & Livraison</span><!--!-->
<svg class="w-4 h-4 transition-transform duration-200 " fill="none" stroke="currentColor" viewBox="0 0 24 24"><!--!--><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg></button></div></div></div></div><!--!-->
<div class="flex-1 p-4"><!--!--><div class="w-full max-w-5xl mx-auto px-4"><div class="relative rounded-md shadow-sm"><!--!--><div class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none"><i class="fas fa-search text-gray-400"></i></div>
<input type="text" placeholder="Rechercher un artisan, service, ou mot-clé..." class="block w-full pl-10 pr-28 py-3 border border-gray-300 rounded-md text-gray-900 placeholder-gray-500 focus:outline-none focus:ring-2 focus:ring-indigo-500"><!--!-->
<div class="absolute inset-y-0 right-0 flex items-center"><button class="px-4 py-2 bg-indigo-600 text-white font-medium rounded-r-md hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"><!--!-->
Rechercher
</button></div></div></div><!--!--><div class="space-y-4"><div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4"><!--!--><div class="artisan-card bg-white rounded-xl overflow-hidden w-full md:max-w-sm shadow hover:shadow-lg transition-transform duration-300 transform hover:-translate-y-1" style="height: 100%;"><div><div class="h-24 bg-gradient-to-r from-blue-500 to-purple-600 relative"><div class="absolute -bottom-10 left-4"><img src="https://randomuser.me/api/portraits/men/1.jpg" alt="Profil" class="profile-img rounded-full shadow-lg"></div></div><!--!-->
<div class="p-6 pt-14"><div class="flex justify-between items-start"><div><h2 class="text-xl font-bold text-gray-800">Jean Dupont</h2><!--!-->
<p class="text-purple-600 font-medium"><!--!--><i class="fas fa-briefcase mr-1"></i> </p></div><!--!-->
<div class="flex items-center"><span class="text-yellow-500 font-bold">0.0</span><!--!-->
<i class="fas fa-star rating-star ml-1"></i></div></div><!--!-->
<div class="mt-3 flex items-center text-gray-600"><!--!--><i class="fas fa-map-marker-alt mr-2"></i>
<span>Paris, Île-de-France</span></div><!--!-->
<div class="mt-4"><span class="availability-dot unavailable"></span><!--!-->
<span class="text-gray-700 font-medium">Indisponible</span></div><!--!-->
<!--!--><div class="mt-5 border-t border-gray-100 pt-4"><div class="flex justify-between"><div class="text-center"><p class="text-gray-500 text-sm">Expérience</p>
<p class="font-bold">Experience</p></div>
<div class="text-center"><p class="text-gray-500 text-sm">Projets</p>
<p class="font-bold">CompletedProjects</p></div>
<div class="text-center"><p class="text-gray-500 text-sm">Réactivité</p>
<p class="font-bold">ResponseTime</p></div></div></div></div><!--!-->
<!--!--><div class="px-5 pb-5"><button class="w-full bg-purple-600 hover:bg-purple-700 text-white py-2 rounded-lg font-medium transition duration-200"><i class="fas fa-user mr-2"></i> Voir le profil
</button></div></div></div><!--!--><div class="artisan-card bg-white rounded-xl overflow-hidden w-full md:max-w-sm shadow hover:shadow-lg transition-transform duration-300 transform hover:-translate-y-1" style="height: 100%;"><div><div class="h-24 bg-gradient-to-r from-blue-500 to-purple-600 relative"><div class="absolute -bottom-10 left-4"><img src="https://randomuser.me/api/portraits/women/2.jpg" alt="Profil" class="profile-img rounded-full shadow-lg"></div></div><!--!-->
<div class="p-6 pt-14"><div class="flex justify-between items-start"><div><h2 class="text-xl font-bold text-gray-800">Sophie Lambert</h2><!--!-->
<p class="text-purple-600 font-medium"><!--!--><i class="fas fa-briefcase mr-1"></i> </p></div><!--!-->
<div class="flex items-center"><span class="text-yellow-500 font-bold">0.0</span><!--!-->
<i class="fas fa-star rating-star ml-1"></i></div></div><!--!-->
<div class="mt-3 flex items-center text-gray-600"><!--!--><i class="fas fa-map-marker-alt mr-2"></i>
<span>Lyon, Auvergne-Rhône-Alpes</span></div><!--!-->
<div class="mt-4"><span class="availability-dot unavailable"></span><!--!-->
<span class="text-gray-700 font-medium">Indisponible</span></div><!--!-->
<!--!--><div class="mt-5 border-t border-gray-100 pt-4"><div class="flex justify-between"><div class="text-center"><p class="text-gray-500 text-sm">Expérience</p>
<p class="font-bold">Experience</p></div>
<div class="text-center"><p class="text-gray-500 text-sm">Projets</p>
<p class="font-bold">CompletedProjects</p></div>
<div class="text-center"><p class="text-gray-500 text-sm">Réactivité</p>
<p class="font-bold">ResponseTime</p></div></div></div></div><!--!-->
<!--!--><div class="px-5 pb-5"><button class="w-full bg-purple-600 hover:bg-purple-700 text-white py-2 rounded-lg font-medium transition duration-200"><i class="fas fa-comment-dots mr-2"></i> Contacter
</button></div></div></div><!--!--><div class="artisan-card bg-white rounded-xl overflow-hidden w-full md:max-w-sm shadow hover:shadow-lg transition-transform duration-300 transform hover:-translate-y-1" style="height: 100%;"><div><div class="h-24 bg-gradient-to-r from-blue-500 to-purple-600 relative"><div class="absolute -bottom-10 left-4"><img src="https://randomuser.me/api/portraits/men/3.jpg" alt="Profil" class="profile-img rounded-full shadow-lg"></div></div><!--!-->
<div class="p-6 pt-14"><div class="flex justify-between items-start"><div><h2 class="text-xl font-bold text-gray-800">Ali Benomar</h2><!--!-->
<p class="text-purple-600 font-medium"><!--!--><i class="fas fa-briefcase mr-1"></i> </p></div><!--!-->
<div class="flex items-center"><span class="text-yellow-500 font-bold">0.0</span><!--!-->
<i class="fas fa-star rating-star ml-1"></i></div></div><!--!-->
<div class="mt-3 flex items-center text-gray-600"><!--!--><i class="fas fa-map-marker-alt mr-2"></i>
<span>Marseille, Provence-Alpes-Côte d'Azur</span></div><!--!-->
<div class="mt-4"><span class="availability-dot unavailable"></span><!--!-->
<span class="text-gray-700 font-medium">Indisponible</span></div><!--!-->
<!--!--><div class="mt-5 border-t border-gray-100 pt-4"><div class="flex justify-between"><div class="text-center"><p class="text-gray-500 text-sm">Expérience</p>
<p class="font-bold">Experience</p></div>
<div class="text-center"><p class="text-gray-500 text-sm">Projets</p>
<p class="font-bold">CompletedProjects</p></div>
<div class="text-center"><p class="text-gray-500 text-sm">Réactivité</p>
<p class="font-bold">ResponseTime</p></div></div></div></div><!--!-->
<!--!--><div class="px-5 pb-5"><button class="w-full bg-purple-600 hover:bg-purple-700 text-white py-2 rounded-lg font-medium transition duration-200"><i class="fas fa-comment-dots mr-2"></i> Contacter
</button></div></div></div><!--!--><div class="artisan-card bg-white rounded-xl overflow-hidden w-full md:max-w-sm shadow hover:shadow-lg transition-transform duration-300 transform hover:-translate-y-1" style="height: 100%;"><div><div class="h-24 bg-gradient-to-r from-blue-500 to-purple-600 relative"><div class="absolute -bottom-10 left-4"><img src="https://randomuser.me/api/portraits/women/4.jpg" alt="Profil" class="profile-img rounded-full shadow-lg"></div></div><!--!-->
<div class="p-6 pt-14"><div class="flex justify-between items-start"><div><h2 class="text-xl font-bold text-gray-800">Claire Moreau</h2><!--!-->
<p class="text-purple-600 font-medium"><!--!--><i class="fas fa-briefcase mr-1"></i> </p></div><!--!-->
<div class="flex items-center"><span class="text-yellow-500 font-bold">0.0</span><!--!-->
<i class="fas fa-star rating-star ml-1"></i></div></div><!--!-->
<div class="mt-3 flex items-center text-gray-600"><!--!--><i class="fas fa-map-marker-alt mr-2"></i>
<span>Toulouse, Occitanie</span></div><!--!-->
<div class="mt-4"><span class="availability-dot unavailable"></span><!--!-->
<span class="text-gray-700 font-medium">Indisponible</span></div><!--!-->
<!--!--><div class="mt-5 border-t border-gray-100 pt-4"><div class="flex justify-between"><div class="text-center"><p class="text-gray-500 text-sm">Expérience</p>
<p class="font-bold">Experience</p></div>
<div class="text-center"><p class="text-gray-500 text-sm">Projets</p>
<p class="font-bold">CompletedProjects</p></div>
<div class="text-center"><p class="text-gray-500 text-sm">Réactivité</p>
<p class="font-bold">ResponseTime</p></div></div></div></div><!--!-->
<!--!--><div class="px-5 pb-5"><button class="w-full bg-purple-600 hover:bg-purple-700 text-white py-2 rounded-lg font-medium transition duration-200"><i class="fas fa-comment-dots mr-2"></i> Contacter
</button></div></div></div></div><div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4"><!--!--><div class="artisan-card bg-white rounded-xl overflow-hidden w-full md:max-w-sm shadow hover:shadow-lg transition-transform duration-300 transform hover:-translate-y-1" style="height: 100%;"><div><div class="h-24 bg-gradient-to-r from-blue-500 to-purple-600 relative"><div class="absolute -bottom-10 left-4"><img src="https://randomuser.me/api/portraits/men/5.jpg" alt="Profil" class="profile-img rounded-full shadow-lg"></div></div><!--!-->
<div class="p-6 pt-14"><div class="flex justify-between items-start"><div><h2 class="text-xl font-bold text-gray-800">Marc Delattre</h2><!--!-->
<p class="text-purple-600 font-medium"><!--!--><i class="fas fa-briefcase mr-1"></i> </p></div><!--!-->
<div class="flex items-center"><span class="text-yellow-500 font-bold">0.0</span><!--!-->
<i class="fas fa-star rating-star ml-1"></i></div></div><!--!-->
<div class="mt-3 flex items-center text-gray-600"><!--!--><i class="fas fa-map-marker-alt mr-2"></i>
<span>Nice, Provence-Alpes-Côte d'Azur</span></div><!--!-->
<div class="mt-4"><span class="availability-dot unavailable"></span><!--!-->
<span class="text-gray-700 font-medium">Indisponible</span></div><!--!-->
<!--!--><div class="mt-5 border-t border-gray-100 pt-4"><div class="flex justify-between"><div class="text-center"><p class="text-gray-500 text-sm">Expérience</p>
<p class="font-bold">Experience</p></div>
<div class="text-center"><p class="text-gray-500 text-sm">Projets</p>
<p class="font-bold">CompletedProjects</p></div>
<div class="text-center"><p class="text-gray-500 text-sm">Réactivité</p>
<p class="font-bold">ResponseTime</p></div></div></div></div><!--!-->
<!--!--><div class="px-5 pb-5"><button class="w-full bg-purple-600 hover:bg-purple-700 text-white py-2 rounded-lg font-medium transition duration-200"><i class="fas fa-comment-dots mr-2"></i> Contacter
</button></div></div></div><!--!--><div class="artisan-card bg-white rounded-xl overflow-hidden w-full md:max-w-sm shadow hover:shadow-lg transition-transform duration-300 transform hover:-translate-y-1" style="height: 100%;"><div><div class="h-24 bg-gradient-to-r from-blue-500 to-purple-600 relative"><div class="absolute -bottom-10 left-4"><img src="https://randomuser.me/api/portraits/women/6.jpg" alt="Profil" class="profile-img rounded-full shadow-lg"></div></div><!--!-->
<div class="p-6 pt-14"><div class="flex justify-between items-start"><div><h2 class="text-xl font-bold text-gray-800">Laura Martin</h2><!--!-->
<p class="text-purple-600 font-medium"><!--!--><i class="fas fa-briefcase mr-1"></i> </p></div><!--!-->
<div class="flex items-center"><span class="text-yellow-500 font-bold">0.0</span><!--!-->
<i class="fas fa-star rating-star ml-1"></i></div></div><!--!-->
<div class="mt-3 flex items-center text-gray-600"><!--!--><i class="fas fa-map-marker-alt mr-2"></i>
<span>Bordeaux, Nouvelle-Aquitaine</span></div><!--!-->
<div class="mt-4"><span class="availability-dot unavailable"></span><!--!-->
<span class="text-gray-700 font-medium">Indisponible</span></div><!--!-->
<!--!--><div class="mt-5 border-t border-gray-100 pt-4"><div class="flex justify-between"><div class="text-center"><p class="text-gray-500 text-sm">Expérience</p>
<p class="font-bold">Experience</p></div>
<div class="text-center"><p class="text-gray-500 text-sm">Projets</p>
<p class="font-bold">CompletedProjects</p></div>
<div class="text-center"><p class="text-gray-500 text-sm">Réactivité</p>
<p class="font-bold">ResponseTime</p></div></div></div></div><!--!-->
<!--!--><div class="px-5 pb-5"><button class="w-full bg-purple-600 hover:bg-purple-700 text-white py-2 rounded-lg font-medium transition duration-200"><i class="fas fa-comment-dots mr-2"></i> Contacter
</button></div></div></div><!--!--><div class="artisan-card bg-white rounded-xl overflow-hidden w-full md:max-w-sm shadow hover:shadow-lg transition-transform duration-300 transform hover:-translate-y-1" style="height: 100%;"><div><div class="h-24 bg-gradient-to-r from-blue-500 to-purple-600 relative"><div class="absolute -bottom-10 left-4"><img src="https://randomuser.me/api/portraits/men/7.jpg" alt="Profil" class="profile-img rounded-full shadow-lg"></div></div><!--!-->
<div class="p-6 pt-14"><div class="flex justify-between items-start"><div><h2 class="text-xl font-bold text-gray-800">Thomas Roux</h2><!--!-->
<p class="text-purple-600 font-medium"><!--!--><i class="fas fa-briefcase mr-1"></i> </p></div><!--!-->
<div class="flex items-center"><span class="text-yellow-500 font-bold">0.0</span><!--!-->
<i class="fas fa-star rating-star ml-1"></i></div></div><!--!-->
<div class="mt-3 flex items-center text-gray-600"><!--!--><i class="fas fa-map-marker-alt mr-2"></i>
<span>Strasbourg, Grand Est</span></div><!--!-->
<div class="mt-4"><span class="availability-dot unavailable"></span><!--!-->
<span class="text-gray-700 font-medium">Indisponible</span></div><!--!-->
<!--!--><div class="mt-5 border-t border-gray-100 pt-4"><div class="flex justify-between"><div class="text-center"><p class="text-gray-500 text-sm">Expérience</p>
<p class="font-bold">Experience</p></div>
<div class="text-center"><p class="text-gray-500 text-sm">Projets</p>
<p class="font-bold">CompletedProjects</p></div>
<div class="text-center"><p class="text-gray-500 text-sm">Réactivité</p>
<p class="font-bold">ResponseTime</p></div></div></div></div><!--!-->
<!--!--><div class="px-5 pb-5"><button class="w-full bg-purple-600 hover:bg-purple-700 text-white py-2 rounded-lg font-medium transition duration-200"><i class="fas fa-comment-dots mr-2"></i> Contacter
</button></div></div></div><!--!--><div class="artisan-card bg-white rounded-xl overflow-hidden w-full md:max-w-sm shadow hover:shadow-lg transition-transform duration-300 transform hover:-translate-y-1" style="height: 100%;"><div><div class="h-24 bg-gradient-to-r from-blue-500 to-purple-600 relative"><div class="absolute -bottom-10 left-4"><img src="https://randomuser.me/api/portraits/women/8.jpg" alt="Profil" class="profile-img rounded-full shadow-lg"></div></div><!--!-->
<div class="p-6 pt-14"><div class="flex justify-between items-start"><div><h2 class="text-xl font-bold text-gray-800">Inès Giraud</h2><!--!-->
<p class="text-purple-600 font-medium"><!--!--><i class="fas fa-briefcase mr-1"></i> </p></div><!--!-->
<div class="flex items-center"><span class="text-yellow-500 font-bold">0.0</span><!--!-->
<i class="fas fa-star rating-star ml-1"></i></div></div><!--!-->
<div class="mt-3 flex items-center text-gray-600"><!--!--><i class="fas fa-map-marker-alt mr-2"></i>
<span>Rennes, Bretagne</span></div><!--!-->
<div class="mt-4"><span class="availability-dot unavailable"></span><!--!-->
<span class="text-gray-700 font-medium">Indisponible</span></div><!--!-->
<!--!--><div class="mt-5 border-t border-gray-100 pt-4"><div class="flex justify-between"><div class="text-center"><p class="text-gray-500 text-sm">Expérience</p>
<p class="font-bold">Experience</p></div>
<div class="text-center"><p class="text-gray-500 text-sm">Projets</p>
<p class="font-bold">CompletedProjects</p></div>
<div class="text-center"><p class="text-gray-500 text-sm">Réactivité</p>
<p class="font-bold">ResponseTime</p></div></div></div></div><!--!-->
<!--!--><div class="px-5 pb-5"><button class="w-full bg-purple-600 hover:bg-purple-700 text-white py-2 rounded-lg font-medium transition duration-200"><i class="fas fa-comment-dots mr-2"></i> Contacter
</button></div></div></div></div><div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4"><!--!--><div class="artisan-card bg-white rounded-xl overflow-hidden w-full md:max-w-sm shadow hover:shadow-lg transition-transform duration-300 transform hover:-translate-y-1" style="height: 100%;"><div><div class="h-24 bg-gradient-to-r from-blue-500 to-purple-600 relative"><div class="absolute -bottom-10 left-4"><img src="https://randomuser.me/api/portraits/men/9.jpg" alt="Profil" class="profile-img rounded-full shadow-lg"></div></div><!--!-->
<div class="p-6 pt-14"><div class="flex justify-between items-start"><div><h2 class="text-xl font-bold text-gray-800">Lucas Bernard</h2><!--!-->
<p class="text-purple-600 font-medium"><!--!--><i class="fas fa-briefcase mr-1"></i> </p></div><!--!-->
<div class="flex items-center"><span class="text-yellow-500 font-bold">0.0</span><!--!-->
<i class="fas fa-star rating-star ml-1"></i></div></div><!--!-->
<div class="mt-3 flex items-center text-gray-600"><!--!--><i class="fas fa-map-marker-alt mr-2"></i>
<span>Montpellier, Occitanie</span></div><!--!-->
<div class="mt-4"><span class="availability-dot unavailable"></span><!--!-->
<span class="text-gray-700 font-medium">Indisponible</span></div><!--!-->
<!--!--><div class="mt-5 border-t border-gray-100 pt-4"><div class="flex justify-between"><div class="text-center"><p class="text-gray-500 text-sm">Expérience</p>
<p class="font-bold">Experience</p></div>
<div class="text-center"><p class="text-gray-500 text-sm">Projets</p>
<p class="font-bold">CompletedProjects</p></div>
<div class="text-center"><p class="text-gray-500 text-sm">Réactivité</p>
<p class="font-bold">ResponseTime</p></div></div></div></div><!--!-->
<!--!--><div class="px-5 pb-5"><button class="w-full bg-purple-600 hover:bg-purple-700 text-white py-2 rounded-lg font-medium transition duration-200"><i class="fas fa-comment-dots mr-2"></i> Contacter
</button></div></div></div><!--!--><div class="artisan-card bg-white rounded-xl overflow-hidden w-full md:max-w-sm shadow hover:shadow-lg transition-transform duration-300 transform hover:-translate-y-1" style="height: 100%;"><div><div class="h-24 bg-gradient-to-r from-blue-500 to-purple-600 relative"><div class="absolute -bottom-10 left-4"><img src="https://randomuser.me/api/portraits/women/10.jpg" alt="Profil" class="profile-img rounded-full shadow-lg"></div></div><!--!-->
<div class="p-6 pt-14"><div class="flex justify-between items-start"><div><h2 class="text-xl font-bold text-gray-800">Émilie Chapel</h2><!--!-->
<p class="text-purple-600 font-medium"><!--!--><i class="fas fa-briefcase mr-1"></i> </p></div><!--!-->
<div class="flex items-center"><span class="text-yellow-500 font-bold">0.0</span><!--!-->
<i class="fas fa-star rating-star ml-1"></i></div></div><!--!-->
<div class="mt-3 flex items-center text-gray-600"><!--!--><i class="fas fa-map-marker-alt mr-2"></i>
<span>Reims, Grand Est</span></div><!--!-->
<div class="mt-4"><span class="availability-dot unavailable"></span><!--!-->
<span class="text-gray-700 font-medium">Indisponible</span></div><!--!-->
<!--!--><div class="mt-5 border-t border-gray-100 pt-4"><div class="flex justify-between"><div class="text-center"><p class="text-gray-500 text-sm">Expérience</p>
<p class="font-bold">Experience</p></div>
<div class="text-center"><p class="text-gray-500 text-sm">Projets</p>
<p class="font-bold">CompletedProjects</p></div>
<div class="text-center"><p class="text-gray-500 text-sm">Réactivité</p>
<p class="font-bold">ResponseTime</p></div></div></div></div><!--!-->
<!--!--><div class="px-5 pb-5"><button class="w-full bg-purple-600 hover:bg-purple-700 text-white py-2 rounded-lg font-medium transition duration-200"><i class="fas fa-comment-dots mr-2"></i> Contacter
</button></div></div></div></div></div></div></div></div>
<footer class="bg-gray-800"><div class="max-w-7xl mx-auto py-12 px-4 sm:px-6 lg:px-8"><div class="grid grid-cols-2 md:grid-cols-4 gap-8"><div><h3 class="text-sm font-semibold text-gray-400 tracking-wider uppercase">
SkillBridge
</h3>
<ul class="mt-4 space-y-4"><li><a href="#" class="text-base text-gray-300 hover:text-white">
À propos
</a></li>
<li><a href="#" class="text-base text-gray-300 hover:text-white">
Carrières
</a></li>
<li><a href="#" class="text-base text-gray-300 hover:text-white">
Blog
</a></li></ul></div>
<div><h3 class="text-sm font-semibold text-gray-400 tracking-wider uppercase">
Pour les clients
</h3>
<ul class="mt-4 space-y-4"><li><a href="#" class="text-base text-gray-300 hover:text-white">
Comment ça marche
</a></li>
<li><a href="#" class="text-base text-gray-300 hover:text-white">
Trouver un professionnel
</a></li>
<li><a href="#" class="text-base text-gray-300 hover:text-white">
Avis clients
</a></li></ul></div>
<div><h3 class="text-sm font-semibold text-gray-400 tracking-wider uppercase">
Pour les professionnels
</h3>
<ul class="mt-4 space-y-4"><li><a href="#" class="text-base text-gray-300 hover:text-white">
Devenir professionnel
</a></li>
<li><a href="#" class="text-base text-gray-300 hover:text-white">
Conseils pour réussir
</a></li>
<li><a href="#" class="text-base text-gray-300 hover:text-white">
Centre d'aide
</a></li></ul></div>
<div><h3 class="text-sm font-semibold text-gray-400 tracking-wider uppercase">
Légal
</h3>
<ul class="mt-4 space-y-4"><li><a href="#" class="text-base text-gray-300 hover:text-white">
Confidentialité
</a></li>
<li><a href="#" class="text-base text-gray-300 hover:text-white">
Conditions
</a></li>
<li><a href="#" class="text-base text-gray-300 hover:text-white">
Cookies
</a></li></ul></div></div>
<div class="mt-8 border-t border-gray-700 pt-8 md:flex md:items-center md:justify-between"><div class="flex space-x-6 md:order-2"><a href="#" class="text-gray-400 hover:text-white"><span class="sr-only">Facebook</span>
<i class="fab fa-facebook-f text-xl"></i></a>
<a href="#" class="text-gray-400 hover:text-white"><span class="sr-only">Instagram</span>
<i class="fab fa-instagram text-xl"></i></a>
<a href="#" class="text-gray-400 hover:text-white"><span class="sr-only">Twitter</span>
<i class="fab fa-twitter text-xl"></i></a>
<a href="#" class="text-gray-400 hover:text-white"><span class="sr-only">LinkedIn</span>
<i class="fab fa-linkedin-in text-xl"></i></a></div>
<p class="mt-8 text-base text-gray-400 md:mt-0 md:order-1">
© 2023 SkillBridge. Tous droits réservés.
</p></div></div></footer></div>
<script src="_framework/blazor.web.js"></script>
<!-- Visual Studio Browser Link -->
<script type="text/javascript" src="/_vs/browserLink" async="async" id="__browserLink_initializationData" data-requestid="c894b5510b114db2950fa93ffeb506be" data-requestmappingfromserver="false" data-connecturl="http://localhost:60258/60daa124abd849f29b0b35e1f1985ecb/browserLink"></script>
<!-- End Browser Link -->
<script src="/_framework/aspnetcore-browser-refresh.js"></script><p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=Sjokode/skillbridge" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body></html> |