From ec490b3809ef6cb87bed8da453a94e9943427703 Mon Sep 17 00:00:00 2001 From: Irina-anat <116644910+Irina-anat@users.noreply.github.com> Date: Mon, 15 Jan 2024 08:35:08 +0000 Subject: [PATCH] =?UTF-8?q?Deploying=20to=20gh-pages=20from=20@=20Irina-an?= =?UTF-8?q?at/cat-search@48fabdb2581f08399e9f58d6c2c3b13a915376b3=20?= =?UTF-8?q?=F0=9F=9A=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.fec695f4.css => index.bd2ef8f0.css | 4 ++-- index.bd2ef8f0.css.map | 1 + index.fec695f4.css.map | 1 - index.html | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) rename index.fec695f4.css => index.bd2ef8f0.css (87%) create mode 100644 index.bd2ef8f0.css.map delete mode 100644 index.fec695f4.css.map diff --git a/index.fec695f4.css b/index.bd2ef8f0.css similarity index 87% rename from index.fec695f4.css rename to index.bd2ef8f0.css index bcf0016..c6b1947 100644 --- a/index.fec695f4.css +++ b/index.bd2ef8f0.css @@ -1,2 +1,2 @@ -:root{--ss-primary-color:#5897fb;--ss-bg-color:#fff;--ss-font-color:#4d4d4d;--ss-font-placeholder-color:#8d8d8d;--ss-disabled-color:#dcdee2;--ss-border-color:#dcdee2;--ss-highlight-color:#fffb8c;--ss-success-color:#00b755;--ss-error-color:#dc3545;--ss-focus-color:#5897fb;--ss-main-height:30px;--ss-content-height:300px;--ss-spacing-l:7px;--ss-spacing-m:5px;--ss-spacing-s:3px;--ss-animation-timing:.2s;--ss-border-radius:4px}@keyframes ss-valueIn{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}@keyframes ss-valueOut{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(0)}}.ss-hide{display:none!important}.ss-main{-ms-user-select:none;user-select:none;color:var(--ss-font-color);min-height:var(--ss-main-height);width:100%;padding:var(--ss-spacing-s);cursor:pointer;border:1px solid var(--ss-border-color);border-radius:var(--ss-border-radius);background-color:var(--ss-bg-color);box-sizing:border-box;transition:background-color var(--ss-animation-timing);outline:0;flex-direction:row;display:flex;position:relative;overflow:hidden}.ss-main:focus{box-shadow:0 0 5px var(--ss-focus-color)}.ss-main.ss-disabled{background-color:var(--ss-disabled-color);cursor:not-allowed}.ss-main.ss-disabled .ss-values .ss-disabled{color:var(--ss-font-color)}.ss-main.ss-disabled .ss-values .ss-value .ss-value-delete{cursor:not-allowed}.ss-main.ss-open-above{border-top-left-radius:0;border-top-right-radius:0}.ss-main.ss-open-below{border-bottom-left-radius:0;border-bottom-right-radius:0}.ss-main .ss-values{gap:var(--ss-spacing-m);flex-wrap:wrap;flex:100%;display:inline-flex}.ss-main .ss-values .ss-placeholder{padding:var(--ss-spacing-s)var(--ss-spacing-m)var(--ss-spacing-s)var(--ss-spacing-m);width:100%;color:var(--ss-font-placeholder-color);text-overflow:ellipsis;white-space:nowrap;align-items:center;margin:auto 0;line-height:1em;display:flex;overflow:hidden}.ss-main .ss-values .ss-max{-ms-user-select:none;user-select:none;width:fit-content;color:var(--ss-bg-color);padding:var(--ss-spacing-s)var(--ss-spacing-m);background-color:var(--ss-primary-color);border-radius:var(--ss-border-radius);align-items:center;font-size:12px;line-height:1;display:flex}.ss-main .ss-values .ss-single{margin:auto 0px auto var(--ss-spacing-s);display:flex}.ss-main .ss-values .ss-value{-ms-user-select:none;user-select:none;width:fit-content;background-color:var(--ss-primary-color);border-radius:var(--ss-border-radius);animation-name:ss-valueIn;animation-duration:var(--ss-animation-timing);align-items:center;animation-timing-function:ease-out;animation-fill-mode:both;display:flex}.ss-main .ss-values .ss-value.ss-value-out{animation-name:ss-valueOut;animation-duration:var(--ss-animation-timing);animation-timing-function:ease-out}.ss-main .ss-values .ss-value .ss-value-text{color:var(--ss-bg-color);padding:var(--ss-spacing-s)var(--ss-spacing-m);font-size:12px;line-height:1}.ss-main .ss-values .ss-value .ss-value-delete{height:var(--ss-spacing-l);width:var(--ss-spacing-l);padding:var(--ss-spacing-s)var(--ss-spacing-m);cursor:pointer;border-left:solid 1px var(--ss-bg-color);box-sizing:content-box;align-items:center;display:flex}.ss-main .ss-values .ss-value .ss-value-delete svg{height:var(--ss-spacing-l);width:var(--ss-spacing-l)}.ss-main .ss-values .ss-value .ss-value-delete svg path{fill:none;stroke:var(--ss-bg-color);stroke-width:18px;stroke-linecap:round;stroke-linejoin:round}.ss-main .ss-deselect{width:fit-content;height:auto;margin:0 var(--ss-spacing-m)0 var(--ss-spacing-m);flex:0 auto;justify-content:center;align-items:center;display:flex}.ss-main .ss-deselect svg{width:8px;height:8px}.ss-main .ss-deselect svg path{fill:none;stroke:var(--ss-font-color);stroke-width:20px;stroke-linecap:round;stroke-linejoin:round}.ss-main .ss-arrow{width:12px;height:12px;margin:auto var(--ss-spacing-m)auto var(--ss-spacing-m);flex:0 auto;justify-content:flex-end;align-items:center;display:flex}.ss-main .ss-arrow path{fill:none;stroke:var(--ss-font-color);stroke-width:18px;stroke-linecap:round;stroke-linejoin:round;transition-timing-function:ease-out;transition:var(--ss-animation-timing)}.ss-content{height:auto;width:auto;max-height:var(--ss-content-height);box-sizing:border-box;border:solid 1px var(--ss-border-color);background-color:var(--ss-bg-color);transition:transform var(--ss-animation-timing),opacity var(--ss-animation-timing);opacity:0;transform-origin:top;z-index:10000;flex-direction:column;display:flex;position:absolute;overflow:hidden;transform:scaleY(0)}.ss-content.ss-relative{height:100%;position:relative}.ss-content.ss-open-above{opacity:1;transform-origin:bottom;border-top-left-radius:var(--ss-border-radius);border-top-right-radius:var(--ss-border-radius);flex-direction:column-reverse;transform:scaleY(1)}.ss-content.ss-open-below{opacity:1;transform-origin:top;border-bottom-left-radius:var(--ss-border-radius);border-bottom-right-radius:var(--ss-border-radius);transform:scaleY(1)}.ss-content .ss-search{padding:var(--ss-spacing-l)var(--ss-spacing-l)var(--ss-spacing-m)var(--ss-spacing-l);flex-direction:row;flex:0 auto;display:flex}.ss-content .ss-search input{font-size:inherit;line-height:inherit;width:100%;min-width:0;padding:var(--ss-spacing-m)var(--ss-spacing-l);border:1px solid var(--ss-border-color);border-radius:var(--ss-border-radius);background-color:var(--ss-bg-color);text-align:left;box-sizing:border-box;outline:0;flex:auto;margin:0;display:inline-flex}.ss-content .ss-search input::-ms-input-placeholder{color:var(--ss-font-placeholder-color);vertical-align:middle}.ss-content .ss-search input::placeholder{color:var(--ss-font-placeholder-color);vertical-align:middle}.ss-content .ss-search input:focus{box-shadow:0 0 5px var(--ss-focus-color)}.ss-content .ss-search .ss-addable{cursor:pointer;height:auto;margin:0 0 0 var(--ss-spacing-m);border:1px solid var(--ss-border-color);border-radius:var(--ss-border-radius);flex:none;justify-content:center;align-items:center;display:inline-flex}.ss-content .ss-search .ss-addable svg{width:12px;height:12px;margin:auto var(--ss-spacing-m)auto var(--ss-spacing-m);flex:0 auto;justify-content:flex-end;align-items:center;display:flex}.ss-content .ss-search .ss-addable svg path{fill:none;stroke:var(--ss-font-color);stroke-width:18px;stroke-linecap:round;stroke-linejoin:round}.ss-content .ss-list{height:auto;flex:auto;overflow-x:hidden;overflow-y:auto}.ss-content .ss-list .ss-error{color:var(--ss-error-color);padding:var(--ss-spacing-l)}.ss-content .ss-list .ss-searching{color:var(--ss-font-color);padding:var(--ss-spacing-l)}.ss-content .ss-list .ss-optgroup.ss-close .ss-option{display:none!important}.ss-content .ss-list .ss-optgroup .ss-optgroup-label{padding:var(--ss-spacing-m)var(--ss-spacing-l)var(--ss-spacing-m)var(--ss-spacing-l);flex-direction:row;justify-content:space-between;align-items:center;display:flex}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-label-text{color:var(--ss-font-color);flex:auto;font-weight:700}.ss-content .ss-list .ss-optgroup .ss-optgroup-label:has(.ss-arrow){cursor:pointer}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions{justify-content:center;align-items:center;gap:var(--ss-spacing-m);flex-direction:row;flex:0 auto;display:flex}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall{cursor:pointer;flex-direction:row;flex:none;display:flex}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall:hover{opacity:.5}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall.ss-selected svg path{stroke:var(--ss-error-color)}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall span{text-align:center;padding:0 var(--ss-spacing-s)0 0;flex:0 auto;justify-content:center;align-items:center;font-size:60%;display:flex}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg{width:13px;height:13px;flex:0 auto}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg path{fill:none;stroke:var(--ss-success-color);stroke-linecap:round;stroke-linejoin:round}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg:first-child{stroke-width:5px}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg:last-child{stroke-width:11px}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-closable{cursor:pointer;flex-direction:row;flex:0 auto;display:flex}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-closable .ss-arrow{width:10px;height:10px;flex:auto}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-closable .ss-arrow path{fill:none;stroke:var(--ss-font-color);stroke-width:18px;stroke-linecap:round;stroke-linejoin:round;transition-timing-function:ease-out;transition:var(--ss-animation-timing)}.ss-content .ss-list .ss-optgroup .ss-option{padding:var(--ss-spacing-s)var(--ss-spacing-s)var(--ss-spacing-s)calc(var(--ss-spacing-l)*3)}.ss-content .ss-list .ss-option{padding:var(--ss-spacing-m)var(--ss-spacing-l)var(--ss-spacing-m)var(--ss-spacing-l);color:var(--ss-font-color);cursor:pointer;-ms-user-select:none;user-select:none;display:flex}.ss-content .ss-list .ss-option:hover,.ss-content .ss-list .ss-option.ss-highlighted,.ss-content .ss-list .ss-option:not(.ss-disabled).ss-selected{color:var(--ss-bg-color);background-color:var(--ss-primary-color)}.ss-content .ss-list .ss-option.ss-disabled{cursor:not-allowed;background-color:var(--ss-disabled-color)}.ss-content .ss-list .ss-option.ss-disabled:hover{color:var(--ss-font-color)}.ss-content .ss-list .ss-option .ss-search-highlight{background-color:var(--ss-highlight-color)}*{box-sizing:border-box}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}ul{margin:0;padding:0;list-style:none}img{height:auto;display:block}a{text-decoration:none}h1,h2,h3,h4,h5,h6,p{margin:0;padding:0}.loader{width:80px;height:80px;border:2px solid #52bc54;border-radius:50%;margin-top:150px;margin-left:auto;margin-right:auto;animation:rotation 1s linear infinite;display:flex;position:relative}.loader:after,.loader:before{content:"";box-sizing:border-box;width:6px;height:6px;background:#ff3d00;border-radius:50%;position:absolute;top:0;left:0}.loader:before{top:auto;bottom:0;left:auto;right:0}@keyframes rotation{0%{transform:rotate(0deg)}to{transform:rotate(360deg)}}.is-hidden{width:1px;height:1px;white-space:nowrap;clip:rect(0 0 0 0);clip-path:inset(100%);border:0;margin:-1px;padding:0;position:absolute;overflow:hidden}.container{max-width:1000px;height:800px;background-color:#faebd7;margin:10px auto;padding:30px 20px 50px}.box-description{display:flex}@media (max-width:600px){.box-description{flex-wrap:wrap}}.breed-select{margin-bottom:20px}.img-thumb{max-width:500px;margin-bottom:20px;margin-right:20px}@media (max-width:600px){img{max-width:100%}}.title{margin-bottom:20px;font-size:26px}.description{max-width:400px;margin-bottom:20px;font-size:18px}.description>span{font-size:20px;font-weight:500}.wikipedia-link{color:#007bff;transition:color .3s}.wikipedia-link:hover{color:#0056b3} -/*# sourceMappingURL=index.fec695f4.css.map */ +:root{--ss-primary-color:#5897fb;--ss-bg-color:#fff;--ss-font-color:#4d4d4d;--ss-font-placeholder-color:#8d8d8d;--ss-disabled-color:#dcdee2;--ss-border-color:#dcdee2;--ss-highlight-color:#fffb8c;--ss-success-color:#00b755;--ss-error-color:#dc3545;--ss-focus-color:#5897fb;--ss-main-height:30px;--ss-content-height:300px;--ss-spacing-l:7px;--ss-spacing-m:5px;--ss-spacing-s:3px;--ss-animation-timing:.2s;--ss-border-radius:4px}@keyframes ss-valueIn{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}@keyframes ss-valueOut{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(0)}}.ss-hide{display:none!important}.ss-main{-ms-user-select:none;user-select:none;color:var(--ss-font-color);min-height:var(--ss-main-height);width:100%;padding:var(--ss-spacing-s);cursor:pointer;border:1px solid var(--ss-border-color);border-radius:var(--ss-border-radius);background-color:var(--ss-bg-color);box-sizing:border-box;transition:background-color var(--ss-animation-timing);outline:0;flex-direction:row;display:flex;position:relative;overflow:hidden}.ss-main:focus{box-shadow:0 0 5px var(--ss-focus-color)}.ss-main.ss-disabled{background-color:var(--ss-disabled-color);cursor:not-allowed}.ss-main.ss-disabled .ss-values .ss-disabled{color:var(--ss-font-color)}.ss-main.ss-disabled .ss-values .ss-value .ss-value-delete{cursor:not-allowed}.ss-main.ss-open-above{border-top-left-radius:0;border-top-right-radius:0}.ss-main.ss-open-below{border-bottom-left-radius:0;border-bottom-right-radius:0}.ss-main .ss-values{gap:var(--ss-spacing-m);flex-wrap:wrap;flex:100%;display:inline-flex}.ss-main .ss-values .ss-placeholder{padding:var(--ss-spacing-s)var(--ss-spacing-m)var(--ss-spacing-s)var(--ss-spacing-m);width:100%;color:var(--ss-font-placeholder-color);text-overflow:ellipsis;white-space:nowrap;align-items:center;margin:auto 0;line-height:1em;display:flex;overflow:hidden}.ss-main .ss-values .ss-max{-ms-user-select:none;user-select:none;width:fit-content;color:var(--ss-bg-color);padding:var(--ss-spacing-s)var(--ss-spacing-m);background-color:var(--ss-primary-color);border-radius:var(--ss-border-radius);align-items:center;font-size:12px;line-height:1;display:flex}.ss-main .ss-values .ss-single{margin:auto 0px auto var(--ss-spacing-s);display:flex}.ss-main .ss-values .ss-value{-ms-user-select:none;user-select:none;width:fit-content;background-color:var(--ss-primary-color);border-radius:var(--ss-border-radius);animation-name:ss-valueIn;animation-duration:var(--ss-animation-timing);align-items:center;animation-timing-function:ease-out;animation-fill-mode:both;display:flex}.ss-main .ss-values .ss-value.ss-value-out{animation-name:ss-valueOut;animation-duration:var(--ss-animation-timing);animation-timing-function:ease-out}.ss-main .ss-values .ss-value .ss-value-text{color:var(--ss-bg-color);padding:var(--ss-spacing-s)var(--ss-spacing-m);font-size:12px;line-height:1}.ss-main .ss-values .ss-value .ss-value-delete{height:var(--ss-spacing-l);width:var(--ss-spacing-l);padding:var(--ss-spacing-s)var(--ss-spacing-m);cursor:pointer;border-left:solid 1px var(--ss-bg-color);box-sizing:content-box;align-items:center;display:flex}.ss-main .ss-values .ss-value .ss-value-delete svg{height:var(--ss-spacing-l);width:var(--ss-spacing-l)}.ss-main .ss-values .ss-value .ss-value-delete svg path{fill:none;stroke:var(--ss-bg-color);stroke-width:18px;stroke-linecap:round;stroke-linejoin:round}.ss-main .ss-deselect{width:fit-content;height:auto;margin:0 var(--ss-spacing-m)0 var(--ss-spacing-m);flex:0 auto;justify-content:center;align-items:center;display:flex}.ss-main .ss-deselect svg{width:8px;height:8px}.ss-main .ss-deselect svg path{fill:none;stroke:var(--ss-font-color);stroke-width:20px;stroke-linecap:round;stroke-linejoin:round}.ss-main .ss-arrow{width:12px;height:12px;margin:auto var(--ss-spacing-m)auto var(--ss-spacing-m);flex:0 auto;justify-content:flex-end;align-items:center;display:flex}.ss-main .ss-arrow path{fill:none;stroke:var(--ss-font-color);stroke-width:18px;stroke-linecap:round;stroke-linejoin:round;transition-timing-function:ease-out;transition:var(--ss-animation-timing)}.ss-content{height:auto;width:auto;max-height:var(--ss-content-height);box-sizing:border-box;border:solid 1px var(--ss-border-color);background-color:var(--ss-bg-color);transition:transform var(--ss-animation-timing),opacity var(--ss-animation-timing);opacity:0;transform-origin:top;z-index:10000;flex-direction:column;display:flex;position:absolute;overflow:hidden;transform:scaleY(0)}.ss-content.ss-relative{height:100%;position:relative}.ss-content.ss-open-above{opacity:1;transform-origin:bottom;border-top-left-radius:var(--ss-border-radius);border-top-right-radius:var(--ss-border-radius);flex-direction:column-reverse;transform:scaleY(1)}.ss-content.ss-open-below{opacity:1;transform-origin:top;border-bottom-left-radius:var(--ss-border-radius);border-bottom-right-radius:var(--ss-border-radius);transform:scaleY(1)}.ss-content .ss-search{padding:var(--ss-spacing-l)var(--ss-spacing-l)var(--ss-spacing-m)var(--ss-spacing-l);flex-direction:row;flex:0 auto;display:flex}.ss-content .ss-search input{font-size:inherit;line-height:inherit;width:100%;min-width:0;padding:var(--ss-spacing-m)var(--ss-spacing-l);border:1px solid var(--ss-border-color);border-radius:var(--ss-border-radius);background-color:var(--ss-bg-color);text-align:left;box-sizing:border-box;outline:0;flex:auto;margin:0;display:inline-flex}.ss-content .ss-search input::-ms-input-placeholder{color:var(--ss-font-placeholder-color);vertical-align:middle}.ss-content .ss-search input::placeholder{color:var(--ss-font-placeholder-color);vertical-align:middle}.ss-content .ss-search input:focus{box-shadow:0 0 5px var(--ss-focus-color)}.ss-content .ss-search .ss-addable{cursor:pointer;height:auto;margin:0 0 0 var(--ss-spacing-m);border:1px solid var(--ss-border-color);border-radius:var(--ss-border-radius);flex:none;justify-content:center;align-items:center;display:inline-flex}.ss-content .ss-search .ss-addable svg{width:12px;height:12px;margin:auto var(--ss-spacing-m)auto var(--ss-spacing-m);flex:0 auto;justify-content:flex-end;align-items:center;display:flex}.ss-content .ss-search .ss-addable svg path{fill:none;stroke:var(--ss-font-color);stroke-width:18px;stroke-linecap:round;stroke-linejoin:round}.ss-content .ss-list{height:auto;flex:auto;overflow-x:hidden;overflow-y:auto}.ss-content .ss-list .ss-error{color:var(--ss-error-color);padding:var(--ss-spacing-l)}.ss-content .ss-list .ss-searching{color:var(--ss-font-color);padding:var(--ss-spacing-l)}.ss-content .ss-list .ss-optgroup.ss-close .ss-option{display:none!important}.ss-content .ss-list .ss-optgroup .ss-optgroup-label{padding:var(--ss-spacing-m)var(--ss-spacing-l)var(--ss-spacing-m)var(--ss-spacing-l);flex-direction:row;justify-content:space-between;align-items:center;display:flex}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-label-text{color:var(--ss-font-color);flex:auto;font-weight:700}.ss-content .ss-list .ss-optgroup .ss-optgroup-label:has(.ss-arrow){cursor:pointer}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions{justify-content:center;align-items:center;gap:var(--ss-spacing-m);flex-direction:row;flex:0 auto;display:flex}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall{cursor:pointer;flex-direction:row;flex:none;display:flex}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall:hover{opacity:.5}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall.ss-selected svg path{stroke:var(--ss-error-color)}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall span{text-align:center;padding:0 var(--ss-spacing-s)0 0;flex:0 auto;justify-content:center;align-items:center;font-size:60%;display:flex}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg{width:13px;height:13px;flex:0 auto}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg path{fill:none;stroke:var(--ss-success-color);stroke-linecap:round;stroke-linejoin:round}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg:first-child{stroke-width:5px}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg:last-child{stroke-width:11px}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-closable{cursor:pointer;flex-direction:row;flex:0 auto;display:flex}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-closable .ss-arrow{width:10px;height:10px;flex:auto}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-closable .ss-arrow path{fill:none;stroke:var(--ss-font-color);stroke-width:18px;stroke-linecap:round;stroke-linejoin:round;transition-timing-function:ease-out;transition:var(--ss-animation-timing)}.ss-content .ss-list .ss-optgroup .ss-option{padding:var(--ss-spacing-s)var(--ss-spacing-s)var(--ss-spacing-s)calc(var(--ss-spacing-l)*3)}.ss-content .ss-list .ss-option{padding:var(--ss-spacing-m)var(--ss-spacing-l)var(--ss-spacing-m)var(--ss-spacing-l);color:var(--ss-font-color);cursor:pointer;-ms-user-select:none;user-select:none;display:flex}.ss-content .ss-list .ss-option:hover,.ss-content .ss-list .ss-option.ss-highlighted,.ss-content .ss-list .ss-option:not(.ss-disabled).ss-selected{color:var(--ss-bg-color);background-color:var(--ss-primary-color)}.ss-content .ss-list .ss-option.ss-disabled{cursor:not-allowed;background-color:var(--ss-disabled-color)}.ss-content .ss-list .ss-option.ss-disabled:hover{color:var(--ss-font-color)}.ss-content .ss-list .ss-option .ss-search-highlight{background-color:var(--ss-highlight-color)}*{box-sizing:border-box}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}@media (max-width:600px){body{background-color:#faebd7}}ul{margin:0;padding:0;list-style:none}img{height:auto;display:block}a{text-decoration:none}h1,h2,h3,h4,h5,h6,p{margin:0;padding:0}.loader{width:80px;height:80px;border:2px solid #52bc54;border-radius:50%;margin-top:150px;margin-left:auto;margin-right:auto;animation:rotation 1s linear infinite;display:flex;position:relative}.loader:after,.loader:before{content:"";box-sizing:border-box;width:6px;height:6px;background:#ff3d00;border-radius:50%;position:absolute;top:0;left:0}.loader:before{top:auto;bottom:0;left:auto;right:0}@keyframes rotation{0%{transform:rotate(0deg)}to{transform:rotate(360deg)}}.is-hidden{width:1px;height:1px;white-space:nowrap;clip:rect(0 0 0 0);clip-path:inset(100%);border:0;margin:-1px;padding:0;position:absolute;overflow:hidden}.container{max-width:1000px;height:800px;background-color:#faebd7;margin:10px auto;padding:30px 20px 50px}.box-description{display:flex}@media (max-width:720px){.box-description{flex-wrap:wrap}}.breed-select{margin-bottom:20px}.img-thumb{max-width:500px;margin-bottom:20px;margin-right:20px}@media (max-width:600px){img{max-width:100%}}.title{margin-bottom:20px;font-size:26px}.description{max-width:400px;margin-bottom:20px;font-size:18px}.description>span{font-size:20px;font-weight:500}.wikipedia-link{color:#007bff;transition:color .3s}.wikipedia-link:hover{color:#0056b3} +/*# sourceMappingURL=index.bd2ef8f0.css.map */ diff --git a/index.bd2ef8f0.css.map b/index.bd2ef8f0.css.map new file mode 100644 index 0000000..734cf4d --- /dev/null +++ b/index.bd2ef8f0.css.map @@ -0,0 +1 @@ +{"mappings":"AEAA,0aA4BA,uFAUA,wFAYA,gCAKA,4aAkBE,wDAIA,kFAKI,wEAKE,8EAON,0EAIA,gFAKA,yFAME,mSAcA,wSAcA,qFAMA,yUAYE,uJAMA,kJAOA,kQAUE,wGAIE,yJAYR,yKASE,+CAIE,kIAUJ,uKASE,qMAaJ,kYAiBE,sDAKA,6MASA,kLAQA,wJAME,kVAgBE,iHAAA,uGAKA,4EAKF,qPAWE,2LASE,+IAWN,6EAME,uFAKA,0FAQI,6EAKF,2NAOE,kIAOA,mFAIA,wLAQE,iJAME,yGAMI,0IAMJ,iOAUA,+HAKE,qLAOA,yHAGA,yHAMJ,kJAME,kIAKE,mRAcR,0IAKF,kNAOE,qNAWA,yGAIE,6EAMF,gGClfN,wBAIA,4MAQA,yBACI,+BAKJ,sCAMA,8BAKA,uBAIA,uCAWA,mMAaA,uJAaA,mDAOA,2EAUA,6JAaA,0GAUA,8BAIA,yBACI,iCAKJ,iCAIA,gEAOA,yBACI,oBAKJ,yCAKA,+DAMA,iDAKA,mDAKA","sources":["index.bd2ef8f0.css","node_modules/slim-select/dist/slimselect.css","node_modules/slim-select/src/slim-select/slimselect.scss","src/styles.css"],"sourcesContent":[":root {\n --ss-primary-color: #5897fb;\n --ss-bg-color: #fff;\n --ss-font-color: #4d4d4d;\n --ss-font-placeholder-color: #8d8d8d;\n --ss-disabled-color: #dcdee2;\n --ss-border-color: #dcdee2;\n --ss-highlight-color: #fffb8c;\n --ss-success-color: #00b755;\n --ss-error-color: #dc3545;\n --ss-focus-color: #5897fb;\n --ss-main-height: 30px;\n --ss-content-height: 300px;\n --ss-spacing-l: 7px;\n --ss-spacing-m: 5px;\n --ss-spacing-s: 3px;\n --ss-animation-timing: .2s;\n --ss-border-radius: 4px;\n}\n\n@keyframes ss-valueIn {\n 0% {\n opacity: 0;\n transform: scale(0);\n }\n\n 100% {\n opacity: 1;\n transform: scale(1);\n }\n}\n\n@keyframes ss-valueOut {\n 0% {\n opacity: 1;\n transform: scale(1);\n }\n\n 100% {\n opacity: 0;\n transform: scale(0);\n }\n}\n\n.ss-hide {\n display: none !important;\n}\n\n.ss-main {\n -ms-user-select: none;\n user-select: none;\n color: var(--ss-font-color);\n min-height: var(--ss-main-height);\n width: 100%;\n padding: var(--ss-spacing-s);\n cursor: pointer;\n border: 1px solid var(--ss-border-color);\n border-radius: var(--ss-border-radius);\n background-color: var(--ss-bg-color);\n box-sizing: border-box;\n transition: background-color var(--ss-animation-timing);\n outline: 0;\n flex-direction: row;\n display: flex;\n position: relative;\n overflow: hidden;\n}\n\n.ss-main:focus {\n box-shadow: 0 0 5px var(--ss-focus-color);\n}\n\n.ss-main.ss-disabled {\n background-color: var(--ss-disabled-color);\n cursor: not-allowed;\n}\n\n.ss-main.ss-disabled .ss-values .ss-disabled {\n color: var(--ss-font-color);\n}\n\n.ss-main.ss-disabled .ss-values .ss-value .ss-value-delete {\n cursor: not-allowed;\n}\n\n.ss-main.ss-open-above {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n}\n\n.ss-main.ss-open-below {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n}\n\n.ss-main .ss-values {\n gap: var(--ss-spacing-m);\n flex-wrap: wrap;\n flex: 100%;\n display: inline-flex;\n}\n\n.ss-main .ss-values .ss-placeholder {\n padding: var(--ss-spacing-s) var(--ss-spacing-m) var(--ss-spacing-s) var(--ss-spacing-m);\n width: 100%;\n color: var(--ss-font-placeholder-color);\n text-overflow: ellipsis;\n white-space: nowrap;\n align-items: center;\n margin: auto 0;\n line-height: 1em;\n display: flex;\n overflow: hidden;\n}\n\n.ss-main .ss-values .ss-max {\n -ms-user-select: none;\n user-select: none;\n width: fit-content;\n color: var(--ss-bg-color);\n padding: var(--ss-spacing-s) var(--ss-spacing-m);\n background-color: var(--ss-primary-color);\n border-radius: var(--ss-border-radius);\n align-items: center;\n font-size: 12px;\n line-height: 1;\n display: flex;\n}\n\n.ss-main .ss-values .ss-single {\n margin: auto 0px auto var(--ss-spacing-s);\n display: flex;\n}\n\n.ss-main .ss-values .ss-value {\n -ms-user-select: none;\n user-select: none;\n width: fit-content;\n background-color: var(--ss-primary-color);\n border-radius: var(--ss-border-radius);\n animation-name: ss-valueIn;\n animation-duration: var(--ss-animation-timing);\n align-items: center;\n animation-timing-function: ease-out;\n animation-fill-mode: both;\n display: flex;\n}\n\n.ss-main .ss-values .ss-value.ss-value-out {\n animation-name: ss-valueOut;\n animation-duration: var(--ss-animation-timing);\n animation-timing-function: ease-out;\n}\n\n.ss-main .ss-values .ss-value .ss-value-text {\n color: var(--ss-bg-color);\n padding: var(--ss-spacing-s) var(--ss-spacing-m);\n font-size: 12px;\n line-height: 1;\n}\n\n.ss-main .ss-values .ss-value .ss-value-delete {\n height: var(--ss-spacing-l);\n width: var(--ss-spacing-l);\n padding: var(--ss-spacing-s) var(--ss-spacing-m);\n cursor: pointer;\n border-left: solid 1px var(--ss-bg-color);\n box-sizing: content-box;\n align-items: center;\n display: flex;\n}\n\n.ss-main .ss-values .ss-value .ss-value-delete svg {\n height: var(--ss-spacing-l);\n width: var(--ss-spacing-l);\n}\n\n.ss-main .ss-values .ss-value .ss-value-delete svg path {\n fill: none;\n stroke: var(--ss-bg-color);\n stroke-width: 18px;\n stroke-linecap: round;\n stroke-linejoin: round;\n}\n\n.ss-main .ss-deselect {\n width: fit-content;\n height: auto;\n margin: 0 var(--ss-spacing-m) 0 var(--ss-spacing-m);\n flex: 0 auto;\n justify-content: center;\n align-items: center;\n display: flex;\n}\n\n.ss-main .ss-deselect svg {\n width: 8px;\n height: 8px;\n}\n\n.ss-main .ss-deselect svg path {\n fill: none;\n stroke: var(--ss-font-color);\n stroke-width: 20px;\n stroke-linecap: round;\n stroke-linejoin: round;\n}\n\n.ss-main .ss-arrow {\n width: 12px;\n height: 12px;\n margin: auto var(--ss-spacing-m) auto var(--ss-spacing-m);\n flex: 0 auto;\n justify-content: flex-end;\n align-items: center;\n display: flex;\n}\n\n.ss-main .ss-arrow path {\n fill: none;\n stroke: var(--ss-font-color);\n stroke-width: 18px;\n stroke-linecap: round;\n stroke-linejoin: round;\n transition-timing-function: ease-out;\n transition: var(--ss-animation-timing);\n}\n\n.ss-content {\n height: auto;\n width: auto;\n max-height: var(--ss-content-height);\n box-sizing: border-box;\n border: solid 1px var(--ss-border-color);\n background-color: var(--ss-bg-color);\n transition: transform var(--ss-animation-timing), opacity var(--ss-animation-timing);\n opacity: 0;\n transform-origin: top;\n z-index: 10000;\n flex-direction: column;\n display: flex;\n position: absolute;\n overflow: hidden;\n transform: scaleY(0);\n}\n\n.ss-content.ss-relative {\n height: 100%;\n position: relative;\n}\n\n.ss-content.ss-open-above {\n opacity: 1;\n transform-origin: bottom;\n border-top-left-radius: var(--ss-border-radius);\n border-top-right-radius: var(--ss-border-radius);\n flex-direction: column-reverse;\n transform: scaleY(1);\n}\n\n.ss-content.ss-open-below {\n opacity: 1;\n transform-origin: top;\n border-bottom-left-radius: var(--ss-border-radius);\n border-bottom-right-radius: var(--ss-border-radius);\n transform: scaleY(1);\n}\n\n.ss-content .ss-search {\n padding: var(--ss-spacing-l) var(--ss-spacing-l) var(--ss-spacing-m) var(--ss-spacing-l);\n flex-direction: row;\n flex: 0 auto;\n display: flex;\n}\n\n.ss-content .ss-search input {\n font-size: inherit;\n line-height: inherit;\n width: 100%;\n min-width: 0;\n padding: var(--ss-spacing-m) var(--ss-spacing-l);\n border: 1px solid var(--ss-border-color);\n border-radius: var(--ss-border-radius);\n background-color: var(--ss-bg-color);\n text-align: left;\n box-sizing: border-box;\n outline: 0;\n flex: auto;\n margin: 0;\n display: inline-flex;\n}\n\n.ss-content .ss-search input::-ms-input-placeholder {\n color: var(--ss-font-placeholder-color);\n vertical-align: middle;\n}\n\n.ss-content .ss-search input::placeholder {\n color: var(--ss-font-placeholder-color);\n vertical-align: middle;\n}\n\n.ss-content .ss-search input:focus {\n box-shadow: 0 0 5px var(--ss-focus-color);\n}\n\n.ss-content .ss-search .ss-addable {\n cursor: pointer;\n height: auto;\n margin: 0 0 0 var(--ss-spacing-m);\n border: 1px solid var(--ss-border-color);\n border-radius: var(--ss-border-radius);\n flex: none;\n justify-content: center;\n align-items: center;\n display: inline-flex;\n}\n\n.ss-content .ss-search .ss-addable svg {\n width: 12px;\n height: 12px;\n margin: auto var(--ss-spacing-m) auto var(--ss-spacing-m);\n flex: 0 auto;\n justify-content: flex-end;\n align-items: center;\n display: flex;\n}\n\n.ss-content .ss-search .ss-addable svg path {\n fill: none;\n stroke: var(--ss-font-color);\n stroke-width: 18px;\n stroke-linecap: round;\n stroke-linejoin: round;\n}\n\n.ss-content .ss-list {\n height: auto;\n flex: auto;\n overflow-x: hidden;\n overflow-y: auto;\n}\n\n.ss-content .ss-list .ss-error {\n color: var(--ss-error-color);\n padding: var(--ss-spacing-l);\n}\n\n.ss-content .ss-list .ss-searching {\n color: var(--ss-font-color);\n padding: var(--ss-spacing-l);\n}\n\n.ss-content .ss-list .ss-optgroup.ss-close .ss-option {\n display: none !important;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label {\n padding: var(--ss-spacing-m) var(--ss-spacing-l) var(--ss-spacing-m) var(--ss-spacing-l);\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n display: flex;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-label-text {\n color: var(--ss-font-color);\n flex: auto;\n font-weight: bold;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label:has(.ss-arrow) {\n cursor: pointer;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions {\n justify-content: center;\n align-items: center;\n gap: var(--ss-spacing-m);\n flex-direction: row;\n flex: 0 auto;\n display: flex;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall {\n cursor: pointer;\n flex-direction: row;\n flex: none;\n display: flex;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall:hover {\n opacity: .5;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall.ss-selected svg path {\n stroke: var(--ss-error-color);\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall span {\n text-align: center;\n padding: 0 var(--ss-spacing-s) 0 0;\n flex: 0 auto;\n justify-content: center;\n align-items: center;\n font-size: 60%;\n display: flex;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg {\n width: 13px;\n height: 13px;\n flex: 0 auto;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg path {\n fill: none;\n stroke: var(--ss-success-color);\n stroke-linecap: round;\n stroke-linejoin: round;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg:first-child {\n stroke-width: 5px;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg:last-child {\n stroke-width: 11px;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-closable {\n cursor: pointer;\n flex-direction: row;\n flex: 0 auto;\n display: flex;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-closable .ss-arrow {\n width: 10px;\n height: 10px;\n flex: auto;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-closable .ss-arrow path {\n fill: none;\n stroke: var(--ss-font-color);\n stroke-width: 18px;\n stroke-linecap: round;\n stroke-linejoin: round;\n transition-timing-function: ease-out;\n transition: var(--ss-animation-timing);\n}\n\n.ss-content .ss-list .ss-optgroup .ss-option {\n padding: var(--ss-spacing-s) var(--ss-spacing-s) var(--ss-spacing-s) calc(var(--ss-spacing-l) * 3);\n}\n\n.ss-content .ss-list .ss-option {\n padding: var(--ss-spacing-m) var(--ss-spacing-l) var(--ss-spacing-m) var(--ss-spacing-l);\n color: var(--ss-font-color);\n cursor: pointer;\n -ms-user-select: none;\n user-select: none;\n display: flex;\n}\n\n.ss-content .ss-list .ss-option:hover, .ss-content .ss-list .ss-option.ss-highlighted, .ss-content .ss-list .ss-option:not(.ss-disabled).ss-selected {\n color: var(--ss-bg-color);\n background-color: var(--ss-primary-color);\n}\n\n.ss-content .ss-list .ss-option.ss-disabled {\n cursor: not-allowed;\n background-color: var(--ss-disabled-color);\n}\n\n.ss-content .ss-list .ss-option.ss-disabled:hover {\n color: var(--ss-font-color);\n}\n\n.ss-content .ss-list .ss-option .ss-search-highlight {\n background-color: var(--ss-highlight-color);\n}\n\n* {\n box-sizing: border-box;\n}\n\nbody {\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n margin: 0;\n font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Open Sans, Helvetica Neue, sans-serif;\n}\n\n@media (max-width: 600px) {\n body {\n background-color: #faebd7;\n }\n}\n\nul {\n margin: 0;\n padding: 0;\n list-style: none;\n}\n\nimg {\n height: auto;\n display: block;\n}\n\na {\n text-decoration: none;\n}\n\nh1, h2, h3, h4, h5, h6, p {\n margin: 0;\n padding: 0;\n}\n\n.loader {\n width: 80px;\n height: 80px;\n border: 2px solid #52bc54;\n border-radius: 50%;\n margin-top: 150px;\n margin-left: auto;\n margin-right: auto;\n animation: rotation 1s linear infinite;\n display: flex;\n position: relative;\n}\n\n.loader:after, .loader:before {\n content: \"\";\n box-sizing: border-box;\n width: 6px;\n height: 6px;\n background: #ff3d00;\n border-radius: 50%;\n position: absolute;\n top: 0;\n left: 0;\n}\n\n.loader:before {\n top: auto;\n bottom: 0;\n left: auto;\n right: 0;\n}\n\n@keyframes rotation {\n 0% {\n transform: rotate(0deg);\n }\n\n 100% {\n transform: rotate(360deg);\n }\n}\n\n.is-hidden {\n width: 1px;\n height: 1px;\n white-space: nowrap;\n clip: rect(0 0 0 0);\n clip-path: inset(100%);\n border: 0;\n margin: -1px;\n padding: 0;\n position: absolute;\n overflow: hidden;\n}\n\n.container {\n max-width: 1000px;\n height: 800px;\n background-color: #faebd7;\n margin: 10px auto;\n padding: 30px 20px 50px;\n}\n\n.box-description {\n display: flex;\n}\n\n@media (max-width: 720px) {\n .box-description {\n flex-wrap: wrap;\n }\n}\n\n.breed-select {\n margin-bottom: 20px;\n}\n\n.img-thumb {\n max-width: 500px;\n margin-bottom: 20px;\n margin-right: 20px;\n}\n\n@media (max-width: 600px) {\n img {\n max-width: 100%;\n }\n}\n\n.title {\n margin-bottom: 20px;\n font-size: 26px;\n}\n\n.description {\n max-width: 400px;\n margin-bottom: 20px;\n font-size: 18px;\n}\n\n.description > span {\n font-size: 20px;\n font-weight: 500;\n}\n\n.wikipedia-link {\n color: #007bff;\n transition: color .3s;\n}\n\n.wikipedia-link:hover {\n color: #0056b3;\n}\n\n/*# sourceMappingURL=index.bd2ef8f0.css.map */\n",":root{--ss-primary-color: #5897fb;--ss-bg-color: #ffffff;--ss-font-color: #4d4d4d;--ss-font-placeholder-color: #8d8d8d;--ss-disabled-color: #dcdee2;--ss-border-color: #dcdee2;--ss-highlight-color: #fffb8c;--ss-success-color: #00b755;--ss-error-color: #dc3545;--ss-focus-color: #5897fb;--ss-main-height: 30px;--ss-content-height: 300px;--ss-spacing-l: 7px;--ss-spacing-m: 5px;--ss-spacing-s: 3px;--ss-animation-timing: 0.2s;--ss-border-radius: 4px}@keyframes ss-valueIn{0%{transform:scale(0);opacity:0}100%{transform:scale(1);opacity:1}}@keyframes ss-valueOut{0%{transform:scale(1);opacity:1}100%{transform:scale(0);opacity:0}}.ss-hide{display:none !important}.ss-main{display:flex;flex-direction:row;position:relative;user-select:none;color:var(--ss-font-color);min-height:var(--ss-main-height);width:100%;padding:var(--ss-spacing-s);cursor:pointer;border:1px solid var(--ss-border-color);border-radius:var(--ss-border-radius);background-color:var(--ss-bg-color);outline:0;box-sizing:border-box;transition:background-color var(--ss-animation-timing);overflow:hidden}.ss-main:focus{box-shadow:0 0 5px var(--ss-focus-color)}.ss-main.ss-disabled{background-color:var(--ss-disabled-color);cursor:not-allowed}.ss-main.ss-disabled .ss-values .ss-disabled{color:var(--ss-font-color)}.ss-main.ss-disabled .ss-values .ss-value .ss-value-delete{cursor:not-allowed}.ss-main.ss-open-above{border-top-left-radius:0px;border-top-right-radius:0px}.ss-main.ss-open-below{border-bottom-left-radius:0px;border-bottom-right-radius:0px}.ss-main .ss-values{display:inline-flex;flex-wrap:wrap;gap:var(--ss-spacing-m);flex:1 1 100%}.ss-main .ss-values .ss-placeholder{display:flex;padding:var(--ss-spacing-s) var(--ss-spacing-m) var(--ss-spacing-s) var(--ss-spacing-m);margin:auto 0px auto 0px;line-height:1em;align-items:center;width:100%;color:var(--ss-font-placeholder-color);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ss-main .ss-values .ss-max{display:flex;user-select:none;align-items:center;width:fit-content;font-size:12px;color:var(--ss-bg-color);line-height:1;padding:var(--ss-spacing-s) var(--ss-spacing-m);background-color:var(--ss-primary-color);border-radius:var(--ss-border-radius)}.ss-main .ss-values .ss-single{display:flex;margin:auto 0px auto var(--ss-spacing-s)}.ss-main .ss-values .ss-value{display:flex;user-select:none;align-items:center;width:fit-content;background-color:var(--ss-primary-color);border-radius:var(--ss-border-radius);animation-name:ss-valueIn;animation-duration:var(--ss-animation-timing);animation-timing-function:ease-out;animation-fill-mode:both}.ss-main .ss-values .ss-value.ss-value-out{animation-name:ss-valueOut;animation-duration:var(--ss-animation-timing);animation-timing-function:ease-out}.ss-main .ss-values .ss-value .ss-value-text{font-size:12px;color:var(--ss-bg-color);line-height:1;padding:var(--ss-spacing-s) var(--ss-spacing-m)}.ss-main .ss-values .ss-value .ss-value-delete{display:flex;align-items:center;height:var(--ss-spacing-l);width:var(--ss-spacing-l);padding:var(--ss-spacing-s) var(--ss-spacing-m);cursor:pointer;border-left:solid 1px var(--ss-bg-color);box-sizing:content-box}.ss-main .ss-values .ss-value .ss-value-delete svg{height:var(--ss-spacing-l);width:var(--ss-spacing-l)}.ss-main .ss-values .ss-value .ss-value-delete svg path{fill:none;stroke:var(--ss-bg-color);stroke-width:18;stroke-linecap:round;stroke-linejoin:round}.ss-main .ss-deselect{flex:0 1 auto;display:flex;align-items:center;justify-content:center;width:fit-content;height:auto;margin:0 var(--ss-spacing-m) 0 var(--ss-spacing-m)}.ss-main .ss-deselect svg{width:8px;height:8px}.ss-main .ss-deselect svg path{fill:none;stroke:var(--ss-font-color);stroke-width:20;stroke-linecap:round;stroke-linejoin:round}.ss-main .ss-arrow{flex:0 1 auto;display:flex;align-items:center;justify-content:flex-end;width:12px;height:12px;margin:auto var(--ss-spacing-m) auto var(--ss-spacing-m)}.ss-main .ss-arrow path{fill:none;stroke:var(--ss-font-color);stroke-width:18;stroke-linecap:round;stroke-linejoin:round;transition-timing-function:ease-out;transition:var(--ss-animation-timing)}.ss-content{position:absolute;display:flex;height:auto;flex-direction:column;width:auto;max-height:var(--ss-content-height);box-sizing:border-box;border:solid 1px var(--ss-border-color);background-color:var(--ss-bg-color);transition:transform var(--ss-animation-timing),opacity var(--ss-animation-timing);opacity:0;transform:scaleY(0);transform-origin:center top;overflow:hidden;z-index:10000}.ss-content.ss-relative{position:relative;height:100%}.ss-content.ss-open-above{flex-direction:column-reverse;opacity:1;transform:scaleY(1);transform-origin:center bottom;border-top-left-radius:var(--ss-border-radius);border-top-right-radius:var(--ss-border-radius)}.ss-content.ss-open-below{opacity:1;transform:scaleY(1);transform-origin:center top;border-bottom-left-radius:var(--ss-border-radius);border-bottom-right-radius:var(--ss-border-radius)}.ss-content .ss-search{flex:0 1 auto;display:flex;flex-direction:row;padding:var(--ss-spacing-l) var(--ss-spacing-l) var(--ss-spacing-m) var(--ss-spacing-l)}.ss-content .ss-search input{display:inline-flex;font-size:inherit;line-height:inherit;flex:1 1 auto;width:100%;min-width:0px;padding:var(--ss-spacing-m) var(--ss-spacing-l);margin:0;border:1px solid var(--ss-border-color);border-radius:var(--ss-border-radius);background-color:var(--ss-bg-color);outline:0;text-align:left;box-sizing:border-box}.ss-content .ss-search input::placeholder{color:var(--ss-font-placeholder-color);vertical-align:middle}.ss-content .ss-search input:focus{box-shadow:0 0 5px var(--ss-focus-color)}.ss-content .ss-search .ss-addable{display:inline-flex;justify-content:center;align-items:center;cursor:pointer;flex:0 0 auto;height:auto;margin:0 0 0 var(--ss-spacing-m);border:1px solid var(--ss-border-color);border-radius:var(--ss-border-radius)}.ss-content .ss-search .ss-addable svg{display:flex;align-items:center;justify-content:flex-end;flex:0 1 auto;width:12px;height:12px;margin:auto var(--ss-spacing-m) auto var(--ss-spacing-m)}.ss-content .ss-search .ss-addable svg path{fill:none;stroke:var(--ss-font-color);stroke-width:18;stroke-linecap:round;stroke-linejoin:round}.ss-content .ss-list{flex:1 1 auto;height:auto;overflow-x:hidden;overflow-y:auto}.ss-content .ss-list .ss-error{color:var(--ss-error-color);padding:var(--ss-spacing-l)}.ss-content .ss-list .ss-searching{color:var(--ss-font-color);padding:var(--ss-spacing-l)}.ss-content .ss-list .ss-optgroup.ss-close .ss-option{display:none !important}.ss-content .ss-list .ss-optgroup .ss-optgroup-label{display:flex;flex-direction:row;align-items:center;justify-content:space-between;padding:var(--ss-spacing-m) var(--ss-spacing-l) var(--ss-spacing-m) var(--ss-spacing-l)}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-label-text{flex:1 1 auto;font-weight:bold;color:var(--ss-font-color)}.ss-content .ss-list .ss-optgroup .ss-optgroup-label:has(.ss-arrow){cursor:pointer}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions{flex:0 1 auto;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--ss-spacing-m)}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall{flex:0 0 auto;display:flex;flex-direction:row;cursor:pointer}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall:hover{opacity:.5}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall.ss-selected svg path{stroke:var(--ss-error-color)}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall span{flex:0 1 auto;display:flex;align-items:center;justify-content:center;font-size:60%;text-align:center;padding:0 var(--ss-spacing-s) 0 0}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg{flex:0 1 auto;width:13px;height:13px}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg path{fill:none;stroke:var(--ss-success-color);stroke-linecap:round;stroke-linejoin:round}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg:first-child{stroke-width:5}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg:last-child{stroke-width:11}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-closable{flex:0 1 auto;display:flex;flex-direction:row;cursor:pointer}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-closable .ss-arrow{flex:1 1 auto;width:10px;height:10px}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-closable .ss-arrow path{fill:none;stroke:var(--ss-font-color);stroke-width:18;stroke-linecap:round;stroke-linejoin:round;transition-timing-function:ease-out;transition:var(--ss-animation-timing)}.ss-content .ss-list .ss-optgroup .ss-option{padding:var(--ss-spacing-s) var(--ss-spacing-s) var(--ss-spacing-s) calc(var(--ss-spacing-l)*3)}.ss-content .ss-list .ss-option{display:flex;padding:var(--ss-spacing-m) var(--ss-spacing-l) var(--ss-spacing-m) var(--ss-spacing-l);color:var(--ss-font-color);cursor:pointer;user-select:none}.ss-content .ss-list .ss-option:hover{color:var(--ss-bg-color);background-color:var(--ss-primary-color)}.ss-content .ss-list .ss-option.ss-highlighted,.ss-content .ss-list .ss-option:not(.ss-disabled).ss-selected{color:var(--ss-bg-color);background-color:var(--ss-primary-color)}.ss-content .ss-list .ss-option.ss-disabled{cursor:not-allowed;background-color:var(--ss-disabled-color)}.ss-content .ss-list .ss-option.ss-disabled:hover{color:var(--ss-font-color)}.ss-content .ss-list .ss-option .ss-search-highlight{background-color:var(--ss-highlight-color)}",":root {\n // Colors\n --ss-primary-color: #5897fb;\n --ss-bg-color: #ffffff;\n --ss-font-color: #4d4d4d;\n --ss-font-placeholder-color: #8d8d8d;\n --ss-disabled-color: #dcdee2;\n --ss-border-color: #dcdee2;\n --ss-highlight-color: #fffb8c;\n --ss-success-color: #00b755;\n --ss-error-color: #dc3545;\n --ss-focus-color: #5897fb;\n\n // Heights\n --ss-main-height: 30px;\n --ss-content-height: 300px;\n\n // Spacing\n --ss-spacing-l: 7px;\n --ss-spacing-m: 5px;\n --ss-spacing-s: 3px;\n\n // Misc\n --ss-animation-timing: 0.2s;\n --ss-border-radius: 4px;\n}\n\n// Animation keyframes\n@keyframes ss-valueIn {\n 0% {\n transform: scale(0);\n opacity: 0;\n }\n 100% {\n transform: scale(1);\n opacity: 1;\n }\n}\n@keyframes ss-valueOut {\n 0% {\n transform: scale(1);\n opacity: 1;\n }\n 100% {\n transform: scale(0);\n opacity: 0;\n }\n}\n\n// Misc classes\n.ss-hide {\n display: none !important;\n}\n\n// Main container\n.ss-main {\n display: flex;\n flex-direction: row;\n position: relative;\n user-select: none;\n color: var(--ss-font-color);\n min-height: var(--ss-main-height);\n width: 100%;\n padding: var(--ss-spacing-s);\n cursor: pointer;\n border: 1px solid var(--ss-border-color);\n border-radius: var(--ss-border-radius);\n background-color: var(--ss-bg-color);\n outline: 0;\n box-sizing: border-box;\n transition: background-color var(--ss-animation-timing);\n overflow: hidden;\n\n &:focus {\n box-shadow: 0 0 5px var(--ss-focus-color);\n }\n\n &.ss-disabled {\n background-color: var(--ss-disabled-color);\n cursor: not-allowed;\n\n .ss-values {\n .ss-disabled {\n color: var(--ss-font-color);\n }\n\n .ss-value {\n .ss-value-delete {\n cursor: not-allowed;\n }\n }\n }\n }\n\n &.ss-open-above {\n border-top-left-radius: 0px;\n border-top-right-radius: 0px;\n }\n &.ss-open-below {\n border-bottom-left-radius: 0px;\n border-bottom-right-radius: 0px;\n }\n\n .ss-values {\n display: inline-flex;\n flex-wrap: wrap;\n gap: var(--ss-spacing-m);\n flex: 1 1 100%;\n\n .ss-placeholder {\n display: flex;\n padding: var(--ss-spacing-s) var(--ss-spacing-m) var(--ss-spacing-s) var(--ss-spacing-m);\n margin: auto 0px auto 0px;\n line-height: 1em;\n align-items: center;\n width: 100%;\n color: var(--ss-font-placeholder-color);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n // Max is used to display max number of values\n .ss-max {\n display: flex;\n user-select: none;\n align-items: center;\n width: fit-content;\n font-size: 12px;\n color: var(--ss-bg-color);\n line-height: 1;\n padding: var(--ss-spacing-s) var(--ss-spacing-m);\n background-color: var(--ss-primary-color);\n border-radius: var(--ss-border-radius);\n }\n\n // Used for single select selected value\n .ss-single {\n display: flex;\n margin: auto 0px auto var(--ss-spacing-s);\n }\n\n // Used for the selected values\n .ss-value {\n display: flex;\n user-select: none;\n align-items: center;\n width: fit-content;\n background-color: var(--ss-primary-color);\n border-radius: var(--ss-border-radius);\n animation-name: ss-valueIn;\n animation-duration: var(--ss-animation-timing);\n animation-timing-function: ease-out;\n animation-fill-mode: both;\n\n &.ss-value-out {\n animation-name: ss-valueOut;\n animation-duration: var(--ss-animation-timing);\n animation-timing-function: ease-out;\n }\n\n .ss-value-text {\n font-size: 12px;\n color: var(--ss-bg-color);\n line-height: 1;\n padding: var(--ss-spacing-s) var(--ss-spacing-m);\n }\n\n .ss-value-delete {\n display: flex;\n align-items: center;\n height: var(--ss-spacing-l);\n width: var(--ss-spacing-l);\n padding: var(--ss-spacing-s) var(--ss-spacing-m);\n cursor: pointer;\n border-left: solid 1px var(--ss-bg-color);\n box-sizing: content-box;\n\n svg {\n height: var(--ss-spacing-l);\n width: var(--ss-spacing-l);\n\n path {\n fill: none;\n stroke: var(--ss-bg-color);\n stroke-width: 18;\n stroke-linecap: round;\n stroke-linejoin: round;\n }\n }\n }\n }\n }\n\n .ss-deselect {\n flex: 0 1 auto;\n display: flex;\n align-items: center;\n justify-content: center;\n width: fit-content;\n height: auto;\n margin: 0 var(--ss-spacing-m) 0 var(--ss-spacing-m);\n\n svg {\n width: 8px;\n height: 8px;\n\n path {\n fill: none;\n stroke: var(--ss-font-color);\n stroke-width: 20;\n stroke-linecap: round;\n stroke-linejoin: round;\n }\n }\n }\n\n .ss-arrow {\n flex: 0 1 auto;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n width: 12px;\n height: 12px;\n margin: auto var(--ss-spacing-m) auto var(--ss-spacing-m);\n\n path {\n fill: none;\n stroke: var(--ss-font-color);\n stroke-width: 18;\n stroke-linecap: round;\n stroke-linejoin: round;\n transition-timing-function: ease-out;\n transition: var(--ss-animation-timing);\n }\n }\n}\n\n// Content container\n.ss-content {\n position: absolute; // default position\n display: flex;\n height: auto;\n flex-direction: column;\n width: auto;\n max-height: var(--ss-content-height);\n box-sizing: border-box;\n border: solid 1px var(--ss-border-color);\n background-color: var(--ss-bg-color);\n transition: transform var(--ss-animation-timing), opacity var(--ss-animation-timing);\n opacity: 0;\n transform: scaleY(0);\n transform-origin: center top;\n overflow: hidden;\n z-index: 10000;\n\n &.ss-relative {\n position: relative;\n height: 100%;\n }\n\n &.ss-open-above {\n flex-direction: column-reverse;\n opacity: 1;\n transform: scaleY(1);\n transform-origin: center bottom;\n border-top-left-radius: var(--ss-border-radius);\n border-top-right-radius: var(--ss-border-radius);\n }\n\n &.ss-open-below {\n opacity: 1;\n transform: scaleY(1);\n transform-origin: center top;\n border-bottom-left-radius: var(--ss-border-radius);\n border-bottom-right-radius: var(--ss-border-radius);\n }\n\n .ss-search {\n flex: 0 1 auto;\n display: flex;\n flex-direction: row;\n padding: var(--ss-spacing-l) var(--ss-spacing-l) var(--ss-spacing-m) var(--ss-spacing-l);\n\n input {\n display: inline-flex;\n font-size: inherit;\n line-height: inherit;\n flex: 1 1 auto;\n width: 100%;\n min-width: 0px;\n padding: var(--ss-spacing-m) var(--ss-spacing-l);\n margin: 0;\n border: 1px solid var(--ss-border-color);\n border-radius: var(--ss-border-radius);\n background-color: var(--ss-bg-color);\n outline: 0;\n text-align: left;\n box-sizing: border-box;\n\n &::placeholder {\n color: var(--ss-font-placeholder-color);\n vertical-align: middle;\n }\n\n &:focus {\n box-shadow: 0 0 5px var(--ss-focus-color);\n }\n }\n\n .ss-addable {\n display: inline-flex;\n justify-content: center;\n align-items: center;\n cursor: pointer;\n flex: 0 0 auto;\n height: auto;\n margin: 0 0 0 var(--ss-spacing-m);\n border: 1px solid var(--ss-border-color);\n border-radius: var(--ss-border-radius);\n\n svg {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n flex: 0 1 auto;\n width: 12px;\n height: 12px;\n margin: auto var(--ss-spacing-m) auto var(--ss-spacing-m);\n\n path {\n fill: none;\n stroke: var(--ss-font-color);\n stroke-width: 18;\n stroke-linecap: round;\n stroke-linejoin: round;\n }\n }\n }\n }\n\n .ss-list {\n flex: 1 1 auto;\n height: auto;\n overflow-x: hidden;\n overflow-y: auto;\n\n .ss-error {\n color: var(--ss-error-color);\n padding: var(--ss-spacing-l);\n }\n\n .ss-searching {\n color: var(--ss-font-color);\n padding: var(--ss-spacing-l);\n }\n\n .ss-optgroup {\n // If optgroup has close, hide all options\n &.ss-close {\n .ss-option {\n display: none !important;\n }\n }\n\n .ss-optgroup-label {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n padding: var(--ss-spacing-m) var(--ss-spacing-l) var(--ss-spacing-m) var(--ss-spacing-l);\n\n .ss-optgroup-label-text {\n flex: 1 1 auto;\n font-weight: bold;\n color: var(--ss-font-color);\n }\n\n // If optgroup has arrow, make label clickable\n &:has(.ss-arrow) {\n cursor: pointer;\n }\n\n .ss-optgroup-actions {\n flex: 0 1 auto;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: center;\n gap: var(--ss-spacing-m);\n\n .ss-selectall {\n flex: 0 0 auto;\n display: flex;\n flex-direction: row;\n cursor: pointer;\n\n &:hover {\n opacity: 0.5;\n }\n\n &.ss-selected {\n svg {\n path {\n stroke: var(--ss-error-color);\n }\n }\n }\n\n span {\n flex: 0 1 auto;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: calc(100% * 0.6);\n text-align: center;\n padding: 0 var(--ss-spacing-s) 0 0;\n }\n\n svg {\n flex: 0 1 auto;\n width: 13px;\n height: 13px;\n\n path {\n fill: none;\n stroke: var(--ss-success-color);\n stroke-linecap: round;\n stroke-linejoin: round;\n }\n\n &:first-child {\n stroke-width: 5;\n }\n &:last-child {\n stroke-width: 11;\n }\n }\n }\n\n .ss-closable {\n flex: 0 1 auto;\n display: flex;\n flex-direction: row;\n cursor: pointer;\n\n .ss-arrow {\n flex: 1 1 auto;\n width: 10px;\n height: 10px;\n\n path {\n fill: none;\n stroke: var(--ss-font-color);\n stroke-width: 18;\n stroke-linecap: round;\n stroke-linejoin: round;\n transition-timing-function: ease-out;\n transition: var(--ss-animation-timing);\n }\n }\n }\n }\n }\n\n .ss-option {\n padding: var(--ss-spacing-s) var(--ss-spacing-s) var(--ss-spacing-s) calc(var(--ss-spacing-l) * 3);\n }\n }\n\n .ss-option {\n display: flex;\n padding: var(--ss-spacing-m) var(--ss-spacing-l) var(--ss-spacing-m) var(--ss-spacing-l);\n color: var(--ss-font-color);\n cursor: pointer;\n user-select: none;\n\n &:hover {\n color: var(--ss-bg-color);\n background-color: var(--ss-primary-color);\n }\n\n &.ss-highlighted,\n &:not(.ss-disabled).ss-selected {\n color: var(--ss-bg-color);\n background-color: var(--ss-primary-color);\n }\n\n &.ss-disabled {\n cursor: not-allowed;\n background-color: var(--ss-disabled-color);\n\n &:hover {\n color: var(--ss-font-color);\n }\n }\n\n // Sub div wrapper for highlighting text\n .ss-search-highlight {\n background-color: var(--ss-highlight-color);\n }\n }\n }\n}\n","* {\n box-sizing: border-box;\n}\n\nbody {\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,\n Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n margin: 0;\n}\n\n@media (max-width: 600px) {\n body {\n background-color: #faebd7;\n }\n}\n\nul {\n margin: 0;\n padding: 0;\n list-style: none;\n}\n\nimg {\n display: block;\n height: auto;\n}\n\na {\n text-decoration: none;\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np {\n margin: 0;\n padding: 0;\n}\n\n.loader {\n position: relative;\n width: 80px;\n height: 80px;\n border: 2px solid hsl(121, 44%, 53%);\n border-radius: 50%;\n display: flex; \n margin-left: auto;\n margin-right: auto;\n margin-top: 150px;\n animation: rotation 1s linear infinite;\n}\n\n.loader::after,\n.loader::before {\n content: '';\n box-sizing: border-box;\n position: absolute;\n left: 0;\n top: 0;\n background: #FF3D00;\n width: 6px;\n height: 6px;\n border-radius: 50%;\n}\n\n.loader::before {\n left: auto;\n top: auto;\n right: 0;\n bottom: 0;\n}\n\n@keyframes rotation {\n 0% {\n transform: rotate(0deg);\n }\n\n 100% {\n transform: rotate(360deg);\n }\n}\n\n.is-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n margin: -1px;\n padding: 0;\n border: 0;\n white-space: nowrap;\n clip: rect(0 0 0 0);\n clip-path: inset(100%);\n overflow: hidden;\n}\n\n.container{\n margin: 10px auto;\n padding: 30px 20px 50px 20px;\n max-width: 1000px;\n background-color: #faebd7;\n height: 800px;\n}\n\n\n\n.box-description{\n display: flex;\n}\n\n@media (max-width: 720px) {\n .box-description {\n flex-wrap: wrap;\n }\n}\n\n.breed-select{\n margin-bottom: 20px;\n}\n\n.img-thumb{\n margin-bottom: 20px;\n margin-right: 20px; \n max-width: 500px; \n}\n\n\n@media (max-width: 600px) {\n img {\n max-width: 100%;\n }\n}\n\n.title{\n margin-bottom: 20px;\n font-size: 26px;\n}\n\n.description{\n margin-bottom: 20px;\n font-size: 18px;\n max-width: 400px;\n}\n\n.description>span{\n font-weight: 500;\n font-size: 20px;\n}\n\n.wikipedia-link{\n color: #007bff;\n transition: color 0.3s ease;\n}\n\n.wikipedia-link:hover {\n color: #0056b3;\n}"],"names":[],"version":3,"file":"index.bd2ef8f0.css.map"} \ No newline at end of file diff --git a/index.fec695f4.css.map b/index.fec695f4.css.map deleted file mode 100644 index 9cbdf91..0000000 --- a/index.fec695f4.css.map +++ /dev/null @@ -1 +0,0 @@ -{"mappings":"AEAA,0aA4BA,uFAUA,wFAYA,gCAKA,4aAkBE,wDAIA,kFAKI,wEAKE,8EAON,0EAIA,gFAKA,yFAME,mSAcA,wSAcA,qFAMA,yUAYE,uJAMA,kJAOA,kQAUE,wGAIE,yJAYR,yKASE,+CAIE,kIAUJ,uKASE,qMAaJ,kYAiBE,sDAKA,6MASA,kLAQA,wJAME,kVAgBE,iHAAA,uGAKA,4EAKF,qPAWE,2LASE,+IAWN,6EAME,uFAKA,0FAQI,6EAKF,2NAOE,kIAOA,mFAIA,wLAQE,iJAME,yGAMI,0IAMJ,iOAUA,+HAKE,qLAOA,yHAGA,yHAMJ,kJAME,kIAKE,mRAcR,0IAKF,kNAOE,qNAWA,yGAIE,6EAMF,gGClfN,wBAIA,4MAQA,sCAMA,8BAKA,uBAIA,uCAWA,mMAaA,uJAaA,mDAOA,2EAUA,6JAaA,0GAQA,8BAIA,yBACI,iCAKJ,iCAIA,gEAOA,yBACI,oBAKJ,yCAKA,+DAMA,iDAKA,mDAKA","sources":["index.fec695f4.css","node_modules/slim-select/dist/slimselect.css","node_modules/slim-select/src/slim-select/slimselect.scss","src/styles.css"],"sourcesContent":[":root {\n --ss-primary-color: #5897fb;\n --ss-bg-color: #fff;\n --ss-font-color: #4d4d4d;\n --ss-font-placeholder-color: #8d8d8d;\n --ss-disabled-color: #dcdee2;\n --ss-border-color: #dcdee2;\n --ss-highlight-color: #fffb8c;\n --ss-success-color: #00b755;\n --ss-error-color: #dc3545;\n --ss-focus-color: #5897fb;\n --ss-main-height: 30px;\n --ss-content-height: 300px;\n --ss-spacing-l: 7px;\n --ss-spacing-m: 5px;\n --ss-spacing-s: 3px;\n --ss-animation-timing: .2s;\n --ss-border-radius: 4px;\n}\n\n@keyframes ss-valueIn {\n 0% {\n opacity: 0;\n transform: scale(0);\n }\n\n 100% {\n opacity: 1;\n transform: scale(1);\n }\n}\n\n@keyframes ss-valueOut {\n 0% {\n opacity: 1;\n transform: scale(1);\n }\n\n 100% {\n opacity: 0;\n transform: scale(0);\n }\n}\n\n.ss-hide {\n display: none !important;\n}\n\n.ss-main {\n -ms-user-select: none;\n user-select: none;\n color: var(--ss-font-color);\n min-height: var(--ss-main-height);\n width: 100%;\n padding: var(--ss-spacing-s);\n cursor: pointer;\n border: 1px solid var(--ss-border-color);\n border-radius: var(--ss-border-radius);\n background-color: var(--ss-bg-color);\n box-sizing: border-box;\n transition: background-color var(--ss-animation-timing);\n outline: 0;\n flex-direction: row;\n display: flex;\n position: relative;\n overflow: hidden;\n}\n\n.ss-main:focus {\n box-shadow: 0 0 5px var(--ss-focus-color);\n}\n\n.ss-main.ss-disabled {\n background-color: var(--ss-disabled-color);\n cursor: not-allowed;\n}\n\n.ss-main.ss-disabled .ss-values .ss-disabled {\n color: var(--ss-font-color);\n}\n\n.ss-main.ss-disabled .ss-values .ss-value .ss-value-delete {\n cursor: not-allowed;\n}\n\n.ss-main.ss-open-above {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n}\n\n.ss-main.ss-open-below {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n}\n\n.ss-main .ss-values {\n gap: var(--ss-spacing-m);\n flex-wrap: wrap;\n flex: 100%;\n display: inline-flex;\n}\n\n.ss-main .ss-values .ss-placeholder {\n padding: var(--ss-spacing-s) var(--ss-spacing-m) var(--ss-spacing-s) var(--ss-spacing-m);\n width: 100%;\n color: var(--ss-font-placeholder-color);\n text-overflow: ellipsis;\n white-space: nowrap;\n align-items: center;\n margin: auto 0;\n line-height: 1em;\n display: flex;\n overflow: hidden;\n}\n\n.ss-main .ss-values .ss-max {\n -ms-user-select: none;\n user-select: none;\n width: fit-content;\n color: var(--ss-bg-color);\n padding: var(--ss-spacing-s) var(--ss-spacing-m);\n background-color: var(--ss-primary-color);\n border-radius: var(--ss-border-radius);\n align-items: center;\n font-size: 12px;\n line-height: 1;\n display: flex;\n}\n\n.ss-main .ss-values .ss-single {\n margin: auto 0px auto var(--ss-spacing-s);\n display: flex;\n}\n\n.ss-main .ss-values .ss-value {\n -ms-user-select: none;\n user-select: none;\n width: fit-content;\n background-color: var(--ss-primary-color);\n border-radius: var(--ss-border-radius);\n animation-name: ss-valueIn;\n animation-duration: var(--ss-animation-timing);\n align-items: center;\n animation-timing-function: ease-out;\n animation-fill-mode: both;\n display: flex;\n}\n\n.ss-main .ss-values .ss-value.ss-value-out {\n animation-name: ss-valueOut;\n animation-duration: var(--ss-animation-timing);\n animation-timing-function: ease-out;\n}\n\n.ss-main .ss-values .ss-value .ss-value-text {\n color: var(--ss-bg-color);\n padding: var(--ss-spacing-s) var(--ss-spacing-m);\n font-size: 12px;\n line-height: 1;\n}\n\n.ss-main .ss-values .ss-value .ss-value-delete {\n height: var(--ss-spacing-l);\n width: var(--ss-spacing-l);\n padding: var(--ss-spacing-s) var(--ss-spacing-m);\n cursor: pointer;\n border-left: solid 1px var(--ss-bg-color);\n box-sizing: content-box;\n align-items: center;\n display: flex;\n}\n\n.ss-main .ss-values .ss-value .ss-value-delete svg {\n height: var(--ss-spacing-l);\n width: var(--ss-spacing-l);\n}\n\n.ss-main .ss-values .ss-value .ss-value-delete svg path {\n fill: none;\n stroke: var(--ss-bg-color);\n stroke-width: 18px;\n stroke-linecap: round;\n stroke-linejoin: round;\n}\n\n.ss-main .ss-deselect {\n width: fit-content;\n height: auto;\n margin: 0 var(--ss-spacing-m) 0 var(--ss-spacing-m);\n flex: 0 auto;\n justify-content: center;\n align-items: center;\n display: flex;\n}\n\n.ss-main .ss-deselect svg {\n width: 8px;\n height: 8px;\n}\n\n.ss-main .ss-deselect svg path {\n fill: none;\n stroke: var(--ss-font-color);\n stroke-width: 20px;\n stroke-linecap: round;\n stroke-linejoin: round;\n}\n\n.ss-main .ss-arrow {\n width: 12px;\n height: 12px;\n margin: auto var(--ss-spacing-m) auto var(--ss-spacing-m);\n flex: 0 auto;\n justify-content: flex-end;\n align-items: center;\n display: flex;\n}\n\n.ss-main .ss-arrow path {\n fill: none;\n stroke: var(--ss-font-color);\n stroke-width: 18px;\n stroke-linecap: round;\n stroke-linejoin: round;\n transition-timing-function: ease-out;\n transition: var(--ss-animation-timing);\n}\n\n.ss-content {\n height: auto;\n width: auto;\n max-height: var(--ss-content-height);\n box-sizing: border-box;\n border: solid 1px var(--ss-border-color);\n background-color: var(--ss-bg-color);\n transition: transform var(--ss-animation-timing), opacity var(--ss-animation-timing);\n opacity: 0;\n transform-origin: top;\n z-index: 10000;\n flex-direction: column;\n display: flex;\n position: absolute;\n overflow: hidden;\n transform: scaleY(0);\n}\n\n.ss-content.ss-relative {\n height: 100%;\n position: relative;\n}\n\n.ss-content.ss-open-above {\n opacity: 1;\n transform-origin: bottom;\n border-top-left-radius: var(--ss-border-radius);\n border-top-right-radius: var(--ss-border-radius);\n flex-direction: column-reverse;\n transform: scaleY(1);\n}\n\n.ss-content.ss-open-below {\n opacity: 1;\n transform-origin: top;\n border-bottom-left-radius: var(--ss-border-radius);\n border-bottom-right-radius: var(--ss-border-radius);\n transform: scaleY(1);\n}\n\n.ss-content .ss-search {\n padding: var(--ss-spacing-l) var(--ss-spacing-l) var(--ss-spacing-m) var(--ss-spacing-l);\n flex-direction: row;\n flex: 0 auto;\n display: flex;\n}\n\n.ss-content .ss-search input {\n font-size: inherit;\n line-height: inherit;\n width: 100%;\n min-width: 0;\n padding: var(--ss-spacing-m) var(--ss-spacing-l);\n border: 1px solid var(--ss-border-color);\n border-radius: var(--ss-border-radius);\n background-color: var(--ss-bg-color);\n text-align: left;\n box-sizing: border-box;\n outline: 0;\n flex: auto;\n margin: 0;\n display: inline-flex;\n}\n\n.ss-content .ss-search input::-ms-input-placeholder {\n color: var(--ss-font-placeholder-color);\n vertical-align: middle;\n}\n\n.ss-content .ss-search input::placeholder {\n color: var(--ss-font-placeholder-color);\n vertical-align: middle;\n}\n\n.ss-content .ss-search input:focus {\n box-shadow: 0 0 5px var(--ss-focus-color);\n}\n\n.ss-content .ss-search .ss-addable {\n cursor: pointer;\n height: auto;\n margin: 0 0 0 var(--ss-spacing-m);\n border: 1px solid var(--ss-border-color);\n border-radius: var(--ss-border-radius);\n flex: none;\n justify-content: center;\n align-items: center;\n display: inline-flex;\n}\n\n.ss-content .ss-search .ss-addable svg {\n width: 12px;\n height: 12px;\n margin: auto var(--ss-spacing-m) auto var(--ss-spacing-m);\n flex: 0 auto;\n justify-content: flex-end;\n align-items: center;\n display: flex;\n}\n\n.ss-content .ss-search .ss-addable svg path {\n fill: none;\n stroke: var(--ss-font-color);\n stroke-width: 18px;\n stroke-linecap: round;\n stroke-linejoin: round;\n}\n\n.ss-content .ss-list {\n height: auto;\n flex: auto;\n overflow-x: hidden;\n overflow-y: auto;\n}\n\n.ss-content .ss-list .ss-error {\n color: var(--ss-error-color);\n padding: var(--ss-spacing-l);\n}\n\n.ss-content .ss-list .ss-searching {\n color: var(--ss-font-color);\n padding: var(--ss-spacing-l);\n}\n\n.ss-content .ss-list .ss-optgroup.ss-close .ss-option {\n display: none !important;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label {\n padding: var(--ss-spacing-m) var(--ss-spacing-l) var(--ss-spacing-m) var(--ss-spacing-l);\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n display: flex;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-label-text {\n color: var(--ss-font-color);\n flex: auto;\n font-weight: bold;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label:has(.ss-arrow) {\n cursor: pointer;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions {\n justify-content: center;\n align-items: center;\n gap: var(--ss-spacing-m);\n flex-direction: row;\n flex: 0 auto;\n display: flex;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall {\n cursor: pointer;\n flex-direction: row;\n flex: none;\n display: flex;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall:hover {\n opacity: .5;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall.ss-selected svg path {\n stroke: var(--ss-error-color);\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall span {\n text-align: center;\n padding: 0 var(--ss-spacing-s) 0 0;\n flex: 0 auto;\n justify-content: center;\n align-items: center;\n font-size: 60%;\n display: flex;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg {\n width: 13px;\n height: 13px;\n flex: 0 auto;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg path {\n fill: none;\n stroke: var(--ss-success-color);\n stroke-linecap: round;\n stroke-linejoin: round;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg:first-child {\n stroke-width: 5px;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg:last-child {\n stroke-width: 11px;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-closable {\n cursor: pointer;\n flex-direction: row;\n flex: 0 auto;\n display: flex;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-closable .ss-arrow {\n width: 10px;\n height: 10px;\n flex: auto;\n}\n\n.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-closable .ss-arrow path {\n fill: none;\n stroke: var(--ss-font-color);\n stroke-width: 18px;\n stroke-linecap: round;\n stroke-linejoin: round;\n transition-timing-function: ease-out;\n transition: var(--ss-animation-timing);\n}\n\n.ss-content .ss-list .ss-optgroup .ss-option {\n padding: var(--ss-spacing-s) var(--ss-spacing-s) var(--ss-spacing-s) calc(var(--ss-spacing-l) * 3);\n}\n\n.ss-content .ss-list .ss-option {\n padding: var(--ss-spacing-m) var(--ss-spacing-l) var(--ss-spacing-m) var(--ss-spacing-l);\n color: var(--ss-font-color);\n cursor: pointer;\n -ms-user-select: none;\n user-select: none;\n display: flex;\n}\n\n.ss-content .ss-list .ss-option:hover, .ss-content .ss-list .ss-option.ss-highlighted, .ss-content .ss-list .ss-option:not(.ss-disabled).ss-selected {\n color: var(--ss-bg-color);\n background-color: var(--ss-primary-color);\n}\n\n.ss-content .ss-list .ss-option.ss-disabled {\n cursor: not-allowed;\n background-color: var(--ss-disabled-color);\n}\n\n.ss-content .ss-list .ss-option.ss-disabled:hover {\n color: var(--ss-font-color);\n}\n\n.ss-content .ss-list .ss-option .ss-search-highlight {\n background-color: var(--ss-highlight-color);\n}\n\n* {\n box-sizing: border-box;\n}\n\nbody {\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n margin: 0;\n font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Open Sans, Helvetica Neue, sans-serif;\n}\n\nul {\n margin: 0;\n padding: 0;\n list-style: none;\n}\n\nimg {\n height: auto;\n display: block;\n}\n\na {\n text-decoration: none;\n}\n\nh1, h2, h3, h4, h5, h6, p {\n margin: 0;\n padding: 0;\n}\n\n.loader {\n width: 80px;\n height: 80px;\n border: 2px solid #52bc54;\n border-radius: 50%;\n margin-top: 150px;\n margin-left: auto;\n margin-right: auto;\n animation: rotation 1s linear infinite;\n display: flex;\n position: relative;\n}\n\n.loader:after, .loader:before {\n content: \"\";\n box-sizing: border-box;\n width: 6px;\n height: 6px;\n background: #ff3d00;\n border-radius: 50%;\n position: absolute;\n top: 0;\n left: 0;\n}\n\n.loader:before {\n top: auto;\n bottom: 0;\n left: auto;\n right: 0;\n}\n\n@keyframes rotation {\n 0% {\n transform: rotate(0deg);\n }\n\n 100% {\n transform: rotate(360deg);\n }\n}\n\n.is-hidden {\n width: 1px;\n height: 1px;\n white-space: nowrap;\n clip: rect(0 0 0 0);\n clip-path: inset(100%);\n border: 0;\n margin: -1px;\n padding: 0;\n position: absolute;\n overflow: hidden;\n}\n\n.container {\n max-width: 1000px;\n height: 800px;\n background-color: #faebd7;\n margin: 10px auto;\n padding: 30px 20px 50px;\n}\n\n.box-description {\n display: flex;\n}\n\n@media (max-width: 600px) {\n .box-description {\n flex-wrap: wrap;\n }\n}\n\n.breed-select {\n margin-bottom: 20px;\n}\n\n.img-thumb {\n max-width: 500px;\n margin-bottom: 20px;\n margin-right: 20px;\n}\n\n@media (max-width: 600px) {\n img {\n max-width: 100%;\n }\n}\n\n.title {\n margin-bottom: 20px;\n font-size: 26px;\n}\n\n.description {\n max-width: 400px;\n margin-bottom: 20px;\n font-size: 18px;\n}\n\n.description > span {\n font-size: 20px;\n font-weight: 500;\n}\n\n.wikipedia-link {\n color: #007bff;\n transition: color .3s;\n}\n\n.wikipedia-link:hover {\n color: #0056b3;\n}\n\n/*# sourceMappingURL=index.fec695f4.css.map */\n",":root{--ss-primary-color: #5897fb;--ss-bg-color: #ffffff;--ss-font-color: #4d4d4d;--ss-font-placeholder-color: #8d8d8d;--ss-disabled-color: #dcdee2;--ss-border-color: #dcdee2;--ss-highlight-color: #fffb8c;--ss-success-color: #00b755;--ss-error-color: #dc3545;--ss-focus-color: #5897fb;--ss-main-height: 30px;--ss-content-height: 300px;--ss-spacing-l: 7px;--ss-spacing-m: 5px;--ss-spacing-s: 3px;--ss-animation-timing: 0.2s;--ss-border-radius: 4px}@keyframes ss-valueIn{0%{transform:scale(0);opacity:0}100%{transform:scale(1);opacity:1}}@keyframes ss-valueOut{0%{transform:scale(1);opacity:1}100%{transform:scale(0);opacity:0}}.ss-hide{display:none !important}.ss-main{display:flex;flex-direction:row;position:relative;user-select:none;color:var(--ss-font-color);min-height:var(--ss-main-height);width:100%;padding:var(--ss-spacing-s);cursor:pointer;border:1px solid var(--ss-border-color);border-radius:var(--ss-border-radius);background-color:var(--ss-bg-color);outline:0;box-sizing:border-box;transition:background-color var(--ss-animation-timing);overflow:hidden}.ss-main:focus{box-shadow:0 0 5px var(--ss-focus-color)}.ss-main.ss-disabled{background-color:var(--ss-disabled-color);cursor:not-allowed}.ss-main.ss-disabled .ss-values .ss-disabled{color:var(--ss-font-color)}.ss-main.ss-disabled .ss-values .ss-value .ss-value-delete{cursor:not-allowed}.ss-main.ss-open-above{border-top-left-radius:0px;border-top-right-radius:0px}.ss-main.ss-open-below{border-bottom-left-radius:0px;border-bottom-right-radius:0px}.ss-main .ss-values{display:inline-flex;flex-wrap:wrap;gap:var(--ss-spacing-m);flex:1 1 100%}.ss-main .ss-values .ss-placeholder{display:flex;padding:var(--ss-spacing-s) var(--ss-spacing-m) var(--ss-spacing-s) var(--ss-spacing-m);margin:auto 0px auto 0px;line-height:1em;align-items:center;width:100%;color:var(--ss-font-placeholder-color);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ss-main .ss-values .ss-max{display:flex;user-select:none;align-items:center;width:fit-content;font-size:12px;color:var(--ss-bg-color);line-height:1;padding:var(--ss-spacing-s) var(--ss-spacing-m);background-color:var(--ss-primary-color);border-radius:var(--ss-border-radius)}.ss-main .ss-values .ss-single{display:flex;margin:auto 0px auto var(--ss-spacing-s)}.ss-main .ss-values .ss-value{display:flex;user-select:none;align-items:center;width:fit-content;background-color:var(--ss-primary-color);border-radius:var(--ss-border-radius);animation-name:ss-valueIn;animation-duration:var(--ss-animation-timing);animation-timing-function:ease-out;animation-fill-mode:both}.ss-main .ss-values .ss-value.ss-value-out{animation-name:ss-valueOut;animation-duration:var(--ss-animation-timing);animation-timing-function:ease-out}.ss-main .ss-values .ss-value .ss-value-text{font-size:12px;color:var(--ss-bg-color);line-height:1;padding:var(--ss-spacing-s) var(--ss-spacing-m)}.ss-main .ss-values .ss-value .ss-value-delete{display:flex;align-items:center;height:var(--ss-spacing-l);width:var(--ss-spacing-l);padding:var(--ss-spacing-s) var(--ss-spacing-m);cursor:pointer;border-left:solid 1px var(--ss-bg-color);box-sizing:content-box}.ss-main .ss-values .ss-value .ss-value-delete svg{height:var(--ss-spacing-l);width:var(--ss-spacing-l)}.ss-main .ss-values .ss-value .ss-value-delete svg path{fill:none;stroke:var(--ss-bg-color);stroke-width:18;stroke-linecap:round;stroke-linejoin:round}.ss-main .ss-deselect{flex:0 1 auto;display:flex;align-items:center;justify-content:center;width:fit-content;height:auto;margin:0 var(--ss-spacing-m) 0 var(--ss-spacing-m)}.ss-main .ss-deselect svg{width:8px;height:8px}.ss-main .ss-deselect svg path{fill:none;stroke:var(--ss-font-color);stroke-width:20;stroke-linecap:round;stroke-linejoin:round}.ss-main .ss-arrow{flex:0 1 auto;display:flex;align-items:center;justify-content:flex-end;width:12px;height:12px;margin:auto var(--ss-spacing-m) auto var(--ss-spacing-m)}.ss-main .ss-arrow path{fill:none;stroke:var(--ss-font-color);stroke-width:18;stroke-linecap:round;stroke-linejoin:round;transition-timing-function:ease-out;transition:var(--ss-animation-timing)}.ss-content{position:absolute;display:flex;height:auto;flex-direction:column;width:auto;max-height:var(--ss-content-height);box-sizing:border-box;border:solid 1px var(--ss-border-color);background-color:var(--ss-bg-color);transition:transform var(--ss-animation-timing),opacity var(--ss-animation-timing);opacity:0;transform:scaleY(0);transform-origin:center top;overflow:hidden;z-index:10000}.ss-content.ss-relative{position:relative;height:100%}.ss-content.ss-open-above{flex-direction:column-reverse;opacity:1;transform:scaleY(1);transform-origin:center bottom;border-top-left-radius:var(--ss-border-radius);border-top-right-radius:var(--ss-border-radius)}.ss-content.ss-open-below{opacity:1;transform:scaleY(1);transform-origin:center top;border-bottom-left-radius:var(--ss-border-radius);border-bottom-right-radius:var(--ss-border-radius)}.ss-content .ss-search{flex:0 1 auto;display:flex;flex-direction:row;padding:var(--ss-spacing-l) var(--ss-spacing-l) var(--ss-spacing-m) var(--ss-spacing-l)}.ss-content .ss-search input{display:inline-flex;font-size:inherit;line-height:inherit;flex:1 1 auto;width:100%;min-width:0px;padding:var(--ss-spacing-m) var(--ss-spacing-l);margin:0;border:1px solid var(--ss-border-color);border-radius:var(--ss-border-radius);background-color:var(--ss-bg-color);outline:0;text-align:left;box-sizing:border-box}.ss-content .ss-search input::placeholder{color:var(--ss-font-placeholder-color);vertical-align:middle}.ss-content .ss-search input:focus{box-shadow:0 0 5px var(--ss-focus-color)}.ss-content .ss-search .ss-addable{display:inline-flex;justify-content:center;align-items:center;cursor:pointer;flex:0 0 auto;height:auto;margin:0 0 0 var(--ss-spacing-m);border:1px solid var(--ss-border-color);border-radius:var(--ss-border-radius)}.ss-content .ss-search .ss-addable svg{display:flex;align-items:center;justify-content:flex-end;flex:0 1 auto;width:12px;height:12px;margin:auto var(--ss-spacing-m) auto var(--ss-spacing-m)}.ss-content .ss-search .ss-addable svg path{fill:none;stroke:var(--ss-font-color);stroke-width:18;stroke-linecap:round;stroke-linejoin:round}.ss-content .ss-list{flex:1 1 auto;height:auto;overflow-x:hidden;overflow-y:auto}.ss-content .ss-list .ss-error{color:var(--ss-error-color);padding:var(--ss-spacing-l)}.ss-content .ss-list .ss-searching{color:var(--ss-font-color);padding:var(--ss-spacing-l)}.ss-content .ss-list .ss-optgroup.ss-close .ss-option{display:none !important}.ss-content .ss-list .ss-optgroup .ss-optgroup-label{display:flex;flex-direction:row;align-items:center;justify-content:space-between;padding:var(--ss-spacing-m) var(--ss-spacing-l) var(--ss-spacing-m) var(--ss-spacing-l)}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-label-text{flex:1 1 auto;font-weight:bold;color:var(--ss-font-color)}.ss-content .ss-list .ss-optgroup .ss-optgroup-label:has(.ss-arrow){cursor:pointer}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions{flex:0 1 auto;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--ss-spacing-m)}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall{flex:0 0 auto;display:flex;flex-direction:row;cursor:pointer}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall:hover{opacity:.5}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall.ss-selected svg path{stroke:var(--ss-error-color)}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall span{flex:0 1 auto;display:flex;align-items:center;justify-content:center;font-size:60%;text-align:center;padding:0 var(--ss-spacing-s) 0 0}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg{flex:0 1 auto;width:13px;height:13px}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg path{fill:none;stroke:var(--ss-success-color);stroke-linecap:round;stroke-linejoin:round}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg:first-child{stroke-width:5}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-selectall svg:last-child{stroke-width:11}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-closable{flex:0 1 auto;display:flex;flex-direction:row;cursor:pointer}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-closable .ss-arrow{flex:1 1 auto;width:10px;height:10px}.ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-actions .ss-closable .ss-arrow path{fill:none;stroke:var(--ss-font-color);stroke-width:18;stroke-linecap:round;stroke-linejoin:round;transition-timing-function:ease-out;transition:var(--ss-animation-timing)}.ss-content .ss-list .ss-optgroup .ss-option{padding:var(--ss-spacing-s) var(--ss-spacing-s) var(--ss-spacing-s) calc(var(--ss-spacing-l)*3)}.ss-content .ss-list .ss-option{display:flex;padding:var(--ss-spacing-m) var(--ss-spacing-l) var(--ss-spacing-m) var(--ss-spacing-l);color:var(--ss-font-color);cursor:pointer;user-select:none}.ss-content .ss-list .ss-option:hover{color:var(--ss-bg-color);background-color:var(--ss-primary-color)}.ss-content .ss-list .ss-option.ss-highlighted,.ss-content .ss-list .ss-option:not(.ss-disabled).ss-selected{color:var(--ss-bg-color);background-color:var(--ss-primary-color)}.ss-content .ss-list .ss-option.ss-disabled{cursor:not-allowed;background-color:var(--ss-disabled-color)}.ss-content .ss-list .ss-option.ss-disabled:hover{color:var(--ss-font-color)}.ss-content .ss-list .ss-option .ss-search-highlight{background-color:var(--ss-highlight-color)}",":root {\n // Colors\n --ss-primary-color: #5897fb;\n --ss-bg-color: #ffffff;\n --ss-font-color: #4d4d4d;\n --ss-font-placeholder-color: #8d8d8d;\n --ss-disabled-color: #dcdee2;\n --ss-border-color: #dcdee2;\n --ss-highlight-color: #fffb8c;\n --ss-success-color: #00b755;\n --ss-error-color: #dc3545;\n --ss-focus-color: #5897fb;\n\n // Heights\n --ss-main-height: 30px;\n --ss-content-height: 300px;\n\n // Spacing\n --ss-spacing-l: 7px;\n --ss-spacing-m: 5px;\n --ss-spacing-s: 3px;\n\n // Misc\n --ss-animation-timing: 0.2s;\n --ss-border-radius: 4px;\n}\n\n// Animation keyframes\n@keyframes ss-valueIn {\n 0% {\n transform: scale(0);\n opacity: 0;\n }\n 100% {\n transform: scale(1);\n opacity: 1;\n }\n}\n@keyframes ss-valueOut {\n 0% {\n transform: scale(1);\n opacity: 1;\n }\n 100% {\n transform: scale(0);\n opacity: 0;\n }\n}\n\n// Misc classes\n.ss-hide {\n display: none !important;\n}\n\n// Main container\n.ss-main {\n display: flex;\n flex-direction: row;\n position: relative;\n user-select: none;\n color: var(--ss-font-color);\n min-height: var(--ss-main-height);\n width: 100%;\n padding: var(--ss-spacing-s);\n cursor: pointer;\n border: 1px solid var(--ss-border-color);\n border-radius: var(--ss-border-radius);\n background-color: var(--ss-bg-color);\n outline: 0;\n box-sizing: border-box;\n transition: background-color var(--ss-animation-timing);\n overflow: hidden;\n\n &:focus {\n box-shadow: 0 0 5px var(--ss-focus-color);\n }\n\n &.ss-disabled {\n background-color: var(--ss-disabled-color);\n cursor: not-allowed;\n\n .ss-values {\n .ss-disabled {\n color: var(--ss-font-color);\n }\n\n .ss-value {\n .ss-value-delete {\n cursor: not-allowed;\n }\n }\n }\n }\n\n &.ss-open-above {\n border-top-left-radius: 0px;\n border-top-right-radius: 0px;\n }\n &.ss-open-below {\n border-bottom-left-radius: 0px;\n border-bottom-right-radius: 0px;\n }\n\n .ss-values {\n display: inline-flex;\n flex-wrap: wrap;\n gap: var(--ss-spacing-m);\n flex: 1 1 100%;\n\n .ss-placeholder {\n display: flex;\n padding: var(--ss-spacing-s) var(--ss-spacing-m) var(--ss-spacing-s) var(--ss-spacing-m);\n margin: auto 0px auto 0px;\n line-height: 1em;\n align-items: center;\n width: 100%;\n color: var(--ss-font-placeholder-color);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n // Max is used to display max number of values\n .ss-max {\n display: flex;\n user-select: none;\n align-items: center;\n width: fit-content;\n font-size: 12px;\n color: var(--ss-bg-color);\n line-height: 1;\n padding: var(--ss-spacing-s) var(--ss-spacing-m);\n background-color: var(--ss-primary-color);\n border-radius: var(--ss-border-radius);\n }\n\n // Used for single select selected value\n .ss-single {\n display: flex;\n margin: auto 0px auto var(--ss-spacing-s);\n }\n\n // Used for the selected values\n .ss-value {\n display: flex;\n user-select: none;\n align-items: center;\n width: fit-content;\n background-color: var(--ss-primary-color);\n border-radius: var(--ss-border-radius);\n animation-name: ss-valueIn;\n animation-duration: var(--ss-animation-timing);\n animation-timing-function: ease-out;\n animation-fill-mode: both;\n\n &.ss-value-out {\n animation-name: ss-valueOut;\n animation-duration: var(--ss-animation-timing);\n animation-timing-function: ease-out;\n }\n\n .ss-value-text {\n font-size: 12px;\n color: var(--ss-bg-color);\n line-height: 1;\n padding: var(--ss-spacing-s) var(--ss-spacing-m);\n }\n\n .ss-value-delete {\n display: flex;\n align-items: center;\n height: var(--ss-spacing-l);\n width: var(--ss-spacing-l);\n padding: var(--ss-spacing-s) var(--ss-spacing-m);\n cursor: pointer;\n border-left: solid 1px var(--ss-bg-color);\n box-sizing: content-box;\n\n svg {\n height: var(--ss-spacing-l);\n width: var(--ss-spacing-l);\n\n path {\n fill: none;\n stroke: var(--ss-bg-color);\n stroke-width: 18;\n stroke-linecap: round;\n stroke-linejoin: round;\n }\n }\n }\n }\n }\n\n .ss-deselect {\n flex: 0 1 auto;\n display: flex;\n align-items: center;\n justify-content: center;\n width: fit-content;\n height: auto;\n margin: 0 var(--ss-spacing-m) 0 var(--ss-spacing-m);\n\n svg {\n width: 8px;\n height: 8px;\n\n path {\n fill: none;\n stroke: var(--ss-font-color);\n stroke-width: 20;\n stroke-linecap: round;\n stroke-linejoin: round;\n }\n }\n }\n\n .ss-arrow {\n flex: 0 1 auto;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n width: 12px;\n height: 12px;\n margin: auto var(--ss-spacing-m) auto var(--ss-spacing-m);\n\n path {\n fill: none;\n stroke: var(--ss-font-color);\n stroke-width: 18;\n stroke-linecap: round;\n stroke-linejoin: round;\n transition-timing-function: ease-out;\n transition: var(--ss-animation-timing);\n }\n }\n}\n\n// Content container\n.ss-content {\n position: absolute; // default position\n display: flex;\n height: auto;\n flex-direction: column;\n width: auto;\n max-height: var(--ss-content-height);\n box-sizing: border-box;\n border: solid 1px var(--ss-border-color);\n background-color: var(--ss-bg-color);\n transition: transform var(--ss-animation-timing), opacity var(--ss-animation-timing);\n opacity: 0;\n transform: scaleY(0);\n transform-origin: center top;\n overflow: hidden;\n z-index: 10000;\n\n &.ss-relative {\n position: relative;\n height: 100%;\n }\n\n &.ss-open-above {\n flex-direction: column-reverse;\n opacity: 1;\n transform: scaleY(1);\n transform-origin: center bottom;\n border-top-left-radius: var(--ss-border-radius);\n border-top-right-radius: var(--ss-border-radius);\n }\n\n &.ss-open-below {\n opacity: 1;\n transform: scaleY(1);\n transform-origin: center top;\n border-bottom-left-radius: var(--ss-border-radius);\n border-bottom-right-radius: var(--ss-border-radius);\n }\n\n .ss-search {\n flex: 0 1 auto;\n display: flex;\n flex-direction: row;\n padding: var(--ss-spacing-l) var(--ss-spacing-l) var(--ss-spacing-m) var(--ss-spacing-l);\n\n input {\n display: inline-flex;\n font-size: inherit;\n line-height: inherit;\n flex: 1 1 auto;\n width: 100%;\n min-width: 0px;\n padding: var(--ss-spacing-m) var(--ss-spacing-l);\n margin: 0;\n border: 1px solid var(--ss-border-color);\n border-radius: var(--ss-border-radius);\n background-color: var(--ss-bg-color);\n outline: 0;\n text-align: left;\n box-sizing: border-box;\n\n &::placeholder {\n color: var(--ss-font-placeholder-color);\n vertical-align: middle;\n }\n\n &:focus {\n box-shadow: 0 0 5px var(--ss-focus-color);\n }\n }\n\n .ss-addable {\n display: inline-flex;\n justify-content: center;\n align-items: center;\n cursor: pointer;\n flex: 0 0 auto;\n height: auto;\n margin: 0 0 0 var(--ss-spacing-m);\n border: 1px solid var(--ss-border-color);\n border-radius: var(--ss-border-radius);\n\n svg {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n flex: 0 1 auto;\n width: 12px;\n height: 12px;\n margin: auto var(--ss-spacing-m) auto var(--ss-spacing-m);\n\n path {\n fill: none;\n stroke: var(--ss-font-color);\n stroke-width: 18;\n stroke-linecap: round;\n stroke-linejoin: round;\n }\n }\n }\n }\n\n .ss-list {\n flex: 1 1 auto;\n height: auto;\n overflow-x: hidden;\n overflow-y: auto;\n\n .ss-error {\n color: var(--ss-error-color);\n padding: var(--ss-spacing-l);\n }\n\n .ss-searching {\n color: var(--ss-font-color);\n padding: var(--ss-spacing-l);\n }\n\n .ss-optgroup {\n // If optgroup has close, hide all options\n &.ss-close {\n .ss-option {\n display: none !important;\n }\n }\n\n .ss-optgroup-label {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n padding: var(--ss-spacing-m) var(--ss-spacing-l) var(--ss-spacing-m) var(--ss-spacing-l);\n\n .ss-optgroup-label-text {\n flex: 1 1 auto;\n font-weight: bold;\n color: var(--ss-font-color);\n }\n\n // If optgroup has arrow, make label clickable\n &:has(.ss-arrow) {\n cursor: pointer;\n }\n\n .ss-optgroup-actions {\n flex: 0 1 auto;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: center;\n gap: var(--ss-spacing-m);\n\n .ss-selectall {\n flex: 0 0 auto;\n display: flex;\n flex-direction: row;\n cursor: pointer;\n\n &:hover {\n opacity: 0.5;\n }\n\n &.ss-selected {\n svg {\n path {\n stroke: var(--ss-error-color);\n }\n }\n }\n\n span {\n flex: 0 1 auto;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: calc(100% * 0.6);\n text-align: center;\n padding: 0 var(--ss-spacing-s) 0 0;\n }\n\n svg {\n flex: 0 1 auto;\n width: 13px;\n height: 13px;\n\n path {\n fill: none;\n stroke: var(--ss-success-color);\n stroke-linecap: round;\n stroke-linejoin: round;\n }\n\n &:first-child {\n stroke-width: 5;\n }\n &:last-child {\n stroke-width: 11;\n }\n }\n }\n\n .ss-closable {\n flex: 0 1 auto;\n display: flex;\n flex-direction: row;\n cursor: pointer;\n\n .ss-arrow {\n flex: 1 1 auto;\n width: 10px;\n height: 10px;\n\n path {\n fill: none;\n stroke: var(--ss-font-color);\n stroke-width: 18;\n stroke-linecap: round;\n stroke-linejoin: round;\n transition-timing-function: ease-out;\n transition: var(--ss-animation-timing);\n }\n }\n }\n }\n }\n\n .ss-option {\n padding: var(--ss-spacing-s) var(--ss-spacing-s) var(--ss-spacing-s) calc(var(--ss-spacing-l) * 3);\n }\n }\n\n .ss-option {\n display: flex;\n padding: var(--ss-spacing-m) var(--ss-spacing-l) var(--ss-spacing-m) var(--ss-spacing-l);\n color: var(--ss-font-color);\n cursor: pointer;\n user-select: none;\n\n &:hover {\n color: var(--ss-bg-color);\n background-color: var(--ss-primary-color);\n }\n\n &.ss-highlighted,\n &:not(.ss-disabled).ss-selected {\n color: var(--ss-bg-color);\n background-color: var(--ss-primary-color);\n }\n\n &.ss-disabled {\n cursor: not-allowed;\n background-color: var(--ss-disabled-color);\n\n &:hover {\n color: var(--ss-font-color);\n }\n }\n\n // Sub div wrapper for highlighting text\n .ss-search-highlight {\n background-color: var(--ss-highlight-color);\n }\n }\n }\n}\n","* {\n box-sizing: border-box;\n}\n\nbody {\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,\n Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n margin: 0;\n}\n\nul {\n margin: 0;\n padding: 0;\n list-style: none;\n}\n\nimg {\n display: block;\n height: auto;\n}\n\na {\n text-decoration: none;\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np {\n margin: 0;\n padding: 0;\n}\n\n.loader {\n position: relative;\n width: 80px;\n height: 80px;\n border: 2px solid hsl(121, 44%, 53%);\n border-radius: 50%;\n display: flex; \n margin-left: auto;\n margin-right: auto;\n margin-top: 150px;\n animation: rotation 1s linear infinite;\n}\n\n.loader::after,\n.loader::before {\n content: '';\n box-sizing: border-box;\n position: absolute;\n left: 0;\n top: 0;\n background: #FF3D00;\n width: 6px;\n height: 6px;\n border-radius: 50%;\n}\n\n.loader::before {\n left: auto;\n top: auto;\n right: 0;\n bottom: 0;\n}\n\n@keyframes rotation {\n 0% {\n transform: rotate(0deg);\n }\n\n 100% {\n transform: rotate(360deg);\n }\n}\n\n.is-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n margin: -1px;\n padding: 0;\n border: 0;\n white-space: nowrap;\n clip: rect(0 0 0 0);\n clip-path: inset(100%);\n overflow: hidden;\n}\n\n.container{\n margin: 10px auto;\n padding: 30px 20px 50px 20px;\n max-width: 1000px;\n background-color: #faebd7;\n height: 800px;\n}\n\n.box-description{\n display: flex;\n}\n\n@media (max-width: 600px) {\n .box-description {\n flex-wrap: wrap;\n }\n}\n\n.breed-select{\n margin-bottom: 20px;\n}\n\n.img-thumb{\n margin-bottom: 20px;\n margin-right: 20px; \n max-width: 500px; \n}\n\n\n@media (max-width: 600px) {\n img {\n max-width: 100%;\n }\n}\n\n.title{\n margin-bottom: 20px;\n font-size: 26px;\n}\n\n.description{\n margin-bottom: 20px;\n font-size: 18px;\n max-width: 400px;\n}\n\n.description>span{\n font-weight: 500;\n font-size: 20px;\n}\n\n.wikipedia-link{\n color: #007bff;\n transition: color 0.3s ease;\n}\n\n.wikipedia-link:hover {\n color: #0056b3;\n}"],"names":[],"version":3,"file":"index.fec695f4.css.map"} \ No newline at end of file diff --git a/index.html b/index.html index 5c5729f..6f1b671 100644 --- a/index.html +++ b/index.html @@ -1 +1 @@ -Cat-search

Oops! Something went wrong! Try reloading the page!

\ No newline at end of file +Cat-search

Oops! Something went wrong! Try reloading the page!

\ No newline at end of file