@import"https://fonts.googleapis.com/css2?family=Kode+Mono:wght@400..700&display=swap";*{margin:0;padding:0;box-sizing:border-box}*,*:before,*:after{box-sizing:border-box}html:focus-within{scroll-behavior:smooth}img,picture,svg,video,canvas{max-width:100%;height:auto;display:block;block-size:auto;background-repeat:no-repeat;background-size:cover}input,button,textarea,select{font:inherit}ol[role=list],ul[role=list]{list-style:none;padding-inline:0}h1,h2,h3,h4,h5{font-size:inherit;font-weight:inherit}body,html{height:100%;scroll-behavior:smooth}body{font:14px/1.5 Kode Mono,sans-serife;background:#fff;color:#111;margin:0 auto;display:block}#root{margin:0 auto;height:100vh;display:flex;flex-direction:column}main{flex-grow:1;display:flex;justify-content:center;flex-direction:column;align-items:center;width:100%}header{background:#fff;font-size:1em;display:flex;flex-direction:row;justify-content:space-between;position:sticky;z-index:1000;top:0;padding:1em 2em;box-shadow:0 0 1em #0003}.site-header .header-first{display:flex;justify-content:center;font-size:1.5em;font-weight:700;align-items:center;text-decoration:none;color:#000}.header-first .logo{text-shadow:.1em .05em #d6cfcf}.navbar-closed{color:#000;text-align:end}.navbar-closed i{padding-top:.7em;width:100%;height:100%}.inactive-toggle-nav{display:none}.active-toggle-nav{display:block;position:absolute;top:4.5em;left:0;opacity:.92;width:100%}.active-toggle-nav li a{padding:1em 0}.mobile{display:block}.no-mobile{display:none}.nav-list-items{display:flex;flex-direction:column;justify-content:center;text-align:center;gap:.2em}.navbar ul li{display:block;list-style:none outside;border-radius:.2em}.nav-list-items li a{display:block;max-width:100%;text-align:cennter;background:#eeeaea;color:#000;border-radius:.2em;padding:.5em 0;font-weight:700;font-size:13px;text-shadow:.9px .9px #d6cfcf}.username{position:absolute;top:53px;left:89px}.users-greeting{font-size:.7em}.nav-logout-btn{display:block;width:100%;background:#eeeaea;color:#000;border:none;border-radius:.2em;padding:.5em 0;font-weight:700;font-size:13px;text-shadow:.9px .9px #d6cfcf;cursor:pointer;font-family:inherit}@media(min-width:450px){header{font-size:1.6em}}@media(min-width:710px){.site-header{font-size:inherit}.site-header{padding:3em 1px 1em 2em;gap:10%}.header-first{flex:1 1 25%}.header-second{flex:1 1 60%;position:relative}.navbar-closed,.mobile{display:none}.no-mobile{display:block}.inactive-toggle-nav{display:block;position:static;top:4.5em;left:2em;opacity:.92;width:85%}.active-toggle-nav{position:static;top:4.5em;left:2em;opacity:.92;width:85%}.nav-list-items{flex-direction:row;justify-content:flex-end}.nav-list-items li{gap:1em}.nav-list-items li a{background-color:#fff;padding:.2em}.nav-logout-btn{background-color:#fff;padding:.2em;font-size:inherit}}@media(min-width:1000px){.site-header{font-size:1.5em;padding:.3em 1px .3em 2em}.nav-list-items li a{padding:1em;font-size:1em}}footer{padding:2em 0}footer p{text-align:center}.hero{height:40em;position:relative;width:100%}.hero-wrapper{background:#000;background-image:url(/assets/pexels-lum3n-44775-406014-Ynu1fSV2.jpg);background-size:cover;width:100%;height:100%;background-position-y:bottom;display:flex;justify-content:center;align-items:flex-end}.hero-wrapper h1{color:#fff;font-size:2.5em;font-weight:700;text-align:center}@media(min-width:1000px){.hero{margin:0 auto}.hero-wrapper{align-items:center}}.sections-wrapper{margin:0 auto;width:100%;padding:2em 3em;display:flex;flex-direction:column;gap:1.5em}.top h2{padding:1em 0;font-size:1.5em;font-weight:700;text-align:center}.top-wrapper{display:flex;flex-direction:row;gap:1em;flex-wrap:wrap}.all{margin:0 auto;text-align:center;color:#000;text-decoration:underline;border:none;background-color:#fff}.card{position:relative;border-radius:1em;min-height:27em;background:inherit;width:100%;color:#fff;height:27em}.card-img img{position:absolute;background-size:cover;left:0;top:0;z-index:-1;border-radius:1em;width:100%;height:100%;object-fit:cover}.card-info{display:flex;flex-direction:column;justify-content:space-between;align-items:center;width:100%;height:100%}.card-pets-name,.card-description{text-align:center;padding:.5em;background-color:#d3d3d3;width:100%;height:10%;border-radius:1em 1em 0 0;background:#6667671a}.card-likes i{font-size:8em;color:#fff;position:relative;text-shadow:.03em -.01em #d6cfcf}.card-likes i p{position:absolute;left:50%;top:50%;font-size:.3em;-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);text-shadow:.1em .03em #d6cfcf}.card-description{border-radius:0 0 1em 1em}@media(min-width:800px){.card{flex:1 1 30%}}.sing-form{min-width:40%;margin:3em}.error-sing-form-inactive{display:none}.error-sing-form-active{color:red;display:flex;justify-content:flex-start;gap:.5em;align-items:center}@media(min-width:700px){.sing-form{max-width:40%}}.infinite-scroll-component__outerdiv{display:flex;justify-content:center;width:100%;padding-top:2em}.posts-wrapper{display:flex;max-width:90%;flex-direction:column;justify-content:space-around;gap:3em;padding:2em 0}.post{display:flex;flex-direction:column;border-radius:1em;box-shadow:0 0 1em #0003;padding-bottom:1em}.post-owner-info{padding:0 .5em;display:flex;justify-content:space-between;gap:.5em}.post-owner-info-separator{display:flex;gap:1em;padding:.5em;align-items:center}.post-owner-img{border-radius:50%;box-shadow:0 0 1em #0003;position:relative;width:2em;height:2em}.post-owner-img img{position:absolute;top:0;left:0;border-radius:50%;object-fit:cover;aspect-ratio:1 / 1}.post-info{display:flex;gap:.5em;padding:.5em .5em 0}.post-img{position:relative;min-height:50vh}.post-img img{background-size:cover;left:0;top:0;width:100%;height:100%;object-fit:cover}.post-likes i{font-size:2em}.post-likes-count{font-weight:700}.post-description{padding:0 0 0 .5em}.post-all-comments{display:flex;flex-direction:column;gap:.5em;font-size:.7em;padding:0 1.5em}.post-show{font-size:1em;font-weight:700}.post-comment-ouner a{text-decoration:none;color:#000;font-weight:700;max-width:100%}.post-add-comment{display:flex;font-size:.9em;padding:1em 2em;gap:1em;justify-content:center;align-items:center}.post-add-comment button{border:none;padding:1em;border-radius:1em;text-shadow:.9px .9px #d6cfcf}.post-add-comment textarea{height:70%;flex-grow:2;outline:none;border:none;border-bottom:1px solid gray;border-radius:.5em}.post-add-comment textarea:focus{outline:none;border:none}.post-date{padding:0 2em;font-size:.7em;text-align:end}@media(min-width:710px){.posts-wrapper{padding:2em 5em}}@media(min-width:1000px){.posts-wrapper{padding:2em 12em}}@media(min-width:1200px){.posts-wrapper{padding:2em 20em}}.comment{box-shadow:0 0 1em #0000001a}.post-comment-ouner{font-weight:700}.create-edite-form{min-width:40%;margin:3em}fieldset{display:flex;box-shadow:0 1em 1em #0003;flex-direction:column;gap:2em;border:none;padding:1em}legend{font-weight:800;font-size:1.5em}.input-wrapper{position:relative;border:1px solid black}.form-icons{display:none}.error-icon{position:absolute;transform:translate(-149%,38%);color:#e65151;font-size:2em;display:inline-block}.repeat_passwotd{transform:translate(13%,76%)}input{width:100%;border:none;padding:1em}textarea{padding:1em}.auth-form-button{background-color:#3357ff;color:#fff;padding:1em;border:none;font-size:1.1em}.error-create-edite-form-inactive{display:none}.error-create-edite-form-active{color:red;display:flex;justify-content:flex-start;gap:.5em;align-items:center}.user-profile-wrapper{width:90%;padding:2em}.user-posts{width:90%;padding-top:2em;display:flex;flex-wrap:wrap;gap:1em}.user-posts .post{flex:1 1 45%}@media(min-width:900px){.user-posts .post{flex:1 1 20%}.user-posts{align-items:start}}.profile-info{width:90%;display:flex;align-items:center;justify-content:space-around;height:40%;padding:1em}.user-image{max-width:40%}.user-image img{object-fit:cover}.user-info{display:flex;flex-direction:column;gap:1em}@media(min-width:900px){.profile-info{padding:2em}.user-image{max-width:20%}}.profile-form{display:flex;width:90%;margin:3em;box-shadow:0 1em 1em #0003;flex-direction:column}.profile-form legend{flex:100%;align-items:center}.form-wrapper{display:flex;flex-direction:column;gap:1em}.form-wrapper input{flex:1 1 60%;box-shadow:0 1em 1em 1em #0000001a}.form-wrapper input:focus{outline:none;border:none}.form-wrapper button{width:100%;background-color:#3357ff;color:#fff;border:none;padding:.9em}.spinner-profile-edit{max-width:20%;margin:0 auto}@media(min-width:600px){.profile-form{width:80%}}@media(min-width:850px){.profile-form{width:50%}}@media(min-width:900px){.form-wrapper{display:flex;flex-direction:row;gap:0}.form-wrapper button{flex:1 1 20%}}