/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}
@font-face{font-family:Inter;font-style:normal;font-weight:400;font-display:swap;src:url(2505c0d4b34ffca98f8f8852e24928eb.woff2) format("woff2"),url(fc49d131f795b4d48f261495d4caef09.woff) format("woff")}@font-face{font-family:Inter;font-style:normal;font-weight:500;font-display:swap;src:url(5b53c519b3184a74a98ca6125f513c9d.woff2) format("woff2"),url(cc6a88688869161eb83642d9393a0c2d.woff) format("woff")}@font-face{font-family:Inter;font-style:normal;font-weight:900;font-display:swap;src:url(23eb804eb49e365fa2f1d72040dc4cf8.woff2) format("woff2"),url(16792010d318c2904562ed1c9b5a5144.woff) format("woff")}
.page{margin:0 auto;max-width:1280px;min-width:300px;background-color:#000;font-family:Inter,‘Arial’,sans-serif;color:#fff;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.header{padding:0;margin:45px auto 0;border-bottom:1px solid #545454;min-height:74px;max-width:882px}@media (max-width:945px){.header{min-height:0;margin:28px auto 0}}
.logo{-o-object-fit:cover;object-fit:cover;width:142px;height:34px}@media (max-width:945px){.logo{margin-left:28px;width:104px;height:24px;margin-bottom:32px}}
.content{max-width:882px;margin:52px auto 66px;display:flex;flex-direction:column;align-items:center}@media (max-width:945px){.content{margin-left:5vw;margin-right:5vw}}@media (max-width:310px){.content{margin-left:0;margin-right:0}}
.profile{display:flex;justify-content:space-between;align-items:center;align-self:stretch;width:100%}@media (max-width:740px){.profile{flex-direction:column;justify-content:center;align-self:inherit;width:282px}}
.profile__avatar{border-radius:200px;width:127px;height:127px;cursor:pointer}.profile__avatar:hover{opacity:.3;transition:all .3s ease}
.profile__info{flex-basis:60%;display:flex;flex-direction:column;max-width:60%}@media (max-width:930px){.profile__info{flex-basis:50%}}@media (max-width:740px){.profile__info{flex-basis:0;align-items:center;margin:10px 0 36px;justify-content:flex-start;width:100%;max-width:100%}}
.profile__title{margin:0;font-size:42px;line-height:1.33;font-style:normal;white-space:nowrap;text-overflow:ellipsis;max-width:90%;overflow:hidden}@media (max-width:740px){.profile__title{font-size:27px;line-height:56px;max-width:80%;text-align:center}}
.profile__subtitle{margin:0;font-size:18px;line-height:1.33;max-width:90%}@media (max-width:740px){.profile__subtitle{font-size:14px;line-height:17px;text-align:center}}
.profile__edit-button{border:1px solid #fff;width:24px;height:24px;background-image:url(6c7bf05444b9793fdf6e73a2dd202e7e.svg);background-position:50%;background-repeat:no-repeat;margin-left:17px;transition:border .2s linear;cursor:pointer;background-color:#000}.profile__edit-button:hover{border:1px solid hsla(0,0%,100%,.6)}@media (max-width:740px){.profile__edit-button{width:18px;height:18px;margin-left:10px}}
.profile__add-button{border:2px solid #fff;background-image:url(bed8c136e13907f5eefb86d62a5fe29e.svg);background-repeat:no-repeat;background-position:50%;min-width:150px;background-color:#000;height:50px;border-radius:2px;cursor:pointer;transition:border .2s linear}.profile__add-button:hover{border:2px solid hsla(0,0%,100%,.6)}@media (max-width:740px){.profile__add-button{width:100%}}
.profile__title-edit{display:flex;align-items:center;width:100%}@media (max-width:740px){.profile__title-edit{justify-content:center}}
.profile__overlay{background-image:url(6c7bf05444b9793fdf6e73a2dd202e7e.svg);background-repeat:no-repeat;opacity:1;background-position:50%;background-size:25%}
.elements{width:100%;box-sizing:border-box}
.element{display:flex;flex-direction:column;align-items:flex-start;width:281px;max-height:361px;border-radius:20px;overflow:hidden;position:relative;justify-self:center}
.element__img{-o-object-fit:cover;object-fit:cover;height:282px;min-width:282px;width:100%;cursor:pointer}
.element__like-button{width:21px;height:18px;background-image:url(df0c965524717a3fd8e99126f77c3daf.svg);background-repeat:no-repeat;background-position:50%;position:absolute;bottom:38px;right:18px;z-index:6;display:block;background-color:#fff;border:0;outline:0;transition:transform .1s linear;cursor:pointer}.element__like-button:hover{transform:scale(1.3)}
.element__like-button_active{background-image:url(a7ffe37dcb927ba0c46c5bed570b6501.svg)}
.element__title{color:#000;font-size:24px;line-height:1.2;font-weight:900;padding:25px 27% 32px 21px;z-index:1;white-space:nowrap;text-overflow:ellipsis;width:70%;overflow:hidden;margin:0;background-color:#fff}
.elements__list{width:100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px 20px;box-sizing:border-box;margin:48px 0 0;padding:0;list-style-type:none}@media (max-width:595px){.elements__list{gap:18px 0}}
.element__recyclebin{width:18px;height:19px;background-image:url(e3c42771bff3aaa52f76f96a20d90bef.svg);background-repeat:no-repeat;background-position:50%;position:absolute;top:23px;right:18px;z-index:6;display:block;border:0;outline:0;background-color:transparent;cursor:pointer}.element__recyclebin:hover{opacity:.6}
.element__likes{position:absolute;bottom:5px;right:23px;color:#000;z-index:5;font-size:13px;line-height:15.73px;font-weight:400}
.footer{max-width:882px;margin:0 auto 60px}@media (max-width:945px){.footer{margin-left:5vw;margin-right:5vw}}@media (max-width:330px){.footer{margin-left:2vw;margin-right:2vw}}
.footer__copyright{font-size:18px;line-height:1.22;color:#545454}
.popup{visibility:hidden;display:flex;width:100vw;height:100vh;background-color:rgba(0,0,0,.5);justify-content:center;align-items:center;top:0;left:0;z-index:8;opacity:0;transition:visibility .25s,opacity .25s;position:fixed}@media (max-width:645px){.popup{justify-content:start;align-items:flex-start;padding-top:150px}}
.popup__container{display:flex;flex-direction:column;align-items:center;width:430px;height:330px;background-color:#fff;border-radius:20px}@media (max-width:645px){.popup__container{width:75vw}}
.popup_opened{display:flex;visibility:visible;opacity:1}
.popup__title{font-size:24px;line-height:29px;font-style:normal;font-weight:900;color:#000;align-self:flex-start;padding-left:40px;white-space:nowrap;text-overflow:ellipsis;margin:32px 0 0;width:80%;overflow:hidden}
.popup__edit{z-index:10;margin-bottom:4px;border:none;border-bottom:1px solid rgba(0,0,0,.2);background:#fff;width:100%;outline:none;font-size:14px;line-height:17px;padding-bottom:13px;box-sizing:border-box}.popup__edit:focus{border-bottom:2px solid rgba(26,76,241,.5)}
.popup__button{margin-top:25px;margin-bottom:10px;background-color:#000;color:#fff;padding:13px auto 18px;height:50px;border:none;cursor:pointer;width:100%;font-size:18px;line-height:22px;border-radius:2px;transition:background .2s linear;z-index:10}.popup__button:hover{background:rgba(0,0,0,.8)}
.popup__close-icon{position:relative;width:40px;height:40px;background-image:url(b9c42c3d39897f658ef5d3db16533924.svg);background-repeat:no-repeat;background-position:50%;top:-180px;left:463px;transition:transform .3s linear;cursor:pointer;background-color:transparent;border:0;outline:0}.popup__close-icon:hover{opacity:.6;transform:rotate(90deg)}@media (max-width:645px){.popup__close-icon{top:-40px;left:calc(100vw - 20%)}}
.popup__form{width:80%;overflow:hidden;margin-top:45px}
.popup__input-error{color:red;font-size:12px;line-height:15px;margin-bottom:15px;height:30px;white-space:nowrap;text-overflow:ellipsis;display:block;height:15px;width:300px;overflow:hidden}
.popup__button_inactive{margin-top:25px;margin-bottom:10px;padding:13px auto 18px;height:50px;transition:background .2s linear;z-index:10;border:1px solid #000}.popup__button_inactive,.popup__button_inactive:hover{background-color:#fff;color:#000}
.popup__edit_type_error,.popup__edit_type_error:focus{border-bottom:1px solid red}
.popup_photo__container{width:auto;height:75vh;background-color:transparent}
.popup_photo__pic{-o-object-fit:contain;object-fit:contain;max-width:75vw;max-height:75vh;overflow:hidden}
.popup_photo__title{overflow:visible;color:#fff;padding-left:4px;margin:0;font-size:12px;line-height:15px;font-weight:400}
@media (max-width:645px){.popup_photo{justify-content:center;align-items:center;padding-top:50px}}
.popup_photo__close-icon{top:-39%;left:1px}

.popup_delete__container{height:181px}
.popup_delete__form{margin-top:0}
.popup_delete__close-icon{top:-110px}@media (max-width:645px){.popup_delete__close-icon{top:-40px;left:calc(100vw - 20%)}}
.popup_avatar__container{height:272px}
.popup_avatar__button{margin-top:15px}
.popup_avatar__close-icon{top:-150px}@media (max-width:645px){.popup_avatar__close-icon{top:-40px;left:calc(100vw - 20%)}}

