*{margin:0;padding:0;box-sizing:border-box;font-family:sans-serif}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:#f1f1f1}::-webkit-scrollbar-thumb{background:#c8c8c8;border-radius:5px}::-webkit-scrollbar-thumb:hover{background:#b2b2b2;cursor:pointer}.app{width:100%;display:flex;gap:16px}.content{flex:1;margin-right:16px}.leftBar{height:100vh;width:72px;display:flex;flex-direction:column;justify-content:space-between;align-items:center;border-right:1px solid #8a8a8a52;padding:16px 0;position:sticky;top:0;left:0}.menuIcons{display:flex;flex-direction:column;align-items:center;gap:24px}.menuIcon{display:flex;justify-content:center;align-items:center;height:24px;width:24px;padding:24px;border:none;border-radius:5px;transition:all .2s ease}.menuIcon:hover{background-color:#f1f1f1}.logo{height:28px;width:28px}.NavBar{margin:16px 0 24px;display:flex}.search{flex:1;padding:12px;background-color:#f1f1f1;border-radius:12px;display:flex;margin-right:16px}.search .img{padding:0 8px}.search input{flex:1;border:none;background-color:transparent;outline:none;font-size:1.4rem;margin-left:16px}.search:hover{background-color:#e1e1e1}.search:focus-within{background-color:#e1e1e1}.UserButton{display:flex;justify-content:center;align-items:center;gap:16px;min-width:5rem;position:relative}.UserButton img{border:none;border-radius:50%}.avatar{height:32px;width:32px;object-fit:cover;cursor:pointer}.arrow{height:16px;width:16px;cursor:pointer}.login{background-color:#e9e9e9;font-family:sans-serif;color:#000;text-decoration:none;padding:16px;border-radius:16px}.login:hover{background-color:#f1f1f1}.options{position:absolute;background-color:#ffffff98;display:flex;flex-direction:column;top:110%;right:16px;box-shadow:0 0 4px #0000005b;z-index:10;border-radius:8px}.UserButton a{color:#000;text-decoration:none}.option{padding:8px 26px;border-radius:8px;cursor:pointer}.option:hover{background-color:#e9e9e9}@media (max-width: 475px){.UserButton{display:none}}.gallery{display:grid;grid-template-columns:repeat(7,1fr);grid-auto-rows:10px;gap:16px}.scroll{text-align:center;margin:126px 0 36px;color:#b2b2b2}@media (max-width: 1729px){.gallery{grid-template-columns:repeat(6,1fr)}}@media (max-width: 1509px){.gallery{grid-template-columns:repeat(5,1fr)}}@media (max-width: 1272px){.gallery{grid-template-columns:repeat(4,1fr)}}@media (max-width: 1035px){.gallery{grid-template-columns:repeat(3,1fr)}}@media (max-width: 798px){.gallery{grid-template-columns:repeat(2,1fr)}}@media (max-width: 475px){.gallery{grid-template-columns:repeat(1,1fr);margin-right:16px}}.galleryItem{display:flex;position:relative;border:none;border-radius:17px}.galleryItem .img{width:100%;border-radius:16px;height:auto;object-fit:cover;object-position:center}.overlay{position:absolute;height:100%;width:100%;top:0;right:0;border:none;border-radius:16px;cursor:pointer;transition:all .2s ease;display:flex;flex-direction:column;justify-content:space-between}.save{position:absolute;top:10px;right:12px;display:none;background-color:#e50829;color:#fff;font-weight:500;border:none;border-radius:24px;width:max-content;padding:12px 16px;transition:all .2s ease;cursor:pointer}.overlayIcons{display:none;position:absolute;bottom:10px;right:4px;transition:all .2s ease}.overlayIcons .img{height:32px;width:32px;margin-right:8px;object-fit:cover;background-color:#ffffff85;padding:8px}.galleryItem:hover .overlay{background-color:#00000042}.galleryItem:hover .save,.galleryItem:hover .overlayIcons{display:block}
