.profile .images{width:100%;height:300px;position:relative}.profile .images .cover{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;position:absolute;left:0}@media (min-width: 768px){.profile .images .cover{width:100%;position:relative;margin:15px 0;border-radius:10px}}.profile .images .profile-image{width:80px;height:80px;border-radius:50%;position:absolute;-o-object-fit:cover;object-fit:cover;left:0;right:0;margin:auto;top:calc(100% - 40px)}@media (min-width: 768px){.profile .images .profile-image{top:calc(100% - 30px)}}.profile .profile-content{position:relative;display:flex;align-items:center;gap:15px;flex-direction:column;padding:70px 15px 40px}@media (min-width: 768px){.profile .profile-content{flex-direction:row;gap:30px;justify-content:space-between;align-items:flex-start;padding:50px 15px 30px}}@media (min-width: 992px){.profile .profile-content{padding:60px 15px 30px}}.profile .profile-content .left{display:flex;gap:15px}@media (min-width: 768px){.profile .profile-content .left{flex-direction:column;padding-top:20px}}@media (min-width: 992px){.profile .profile-content .left{flex-direction:row}}.profile .profile-content .left .social-icon{cursor:pointer}.profile .profile-content .center{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px}.profile .profile-content .center .web{word-break:break-word}@media (min-width: 768px){.profile .profile-content .center{align-items:flex-start}}.profile .profile-content .center .bottom .follow-button{border-radius:5px;background-color:#1546e6;color:#fffefe;padding:7px 13px;text-transform:uppercase;font-weight:600;letter-spacing:.05rem;cursor:pointer;margin-bottom:20px}.profile .profile-content .right{position:relative}.profile .profile-content .right .more{cursor:pointer;padding-top:20px}.profile .profile-content .right .profile-details{width:50vw;display:flex;flex-direction:column;justify-content:center;gap:5px;position:absolute;background-color:#d3d3d3;z-index:10;padding:20px;bottom:40px;left:50%;transform:translate(-50%)}@media (min-width: 768px){.profile .profile-content .right .profile-details{width:40vw}}@media (min-width: 992px){.profile .profile-content .right .profile-details{width:30vw}}.profile .profile-content .right .profile-details h3{text-align:center;margin-bottom:5px;text-transform:uppercase;font-weight:600}.profile .profile-content .right .profile-details .avatar{display:flex;justify-content:space-between;align-items:center;gap:10px;word-break:break-word}.profile .profile-content .right .profile-details .avatar img{width:40px;height:40px;-o-object-fit:cover;object-fit:cover;border-radius:50%}.profile .profile-content .right .profile-details form{display:flex;flex-direction:column}.profile .profile-content .right .profile-details form input{border-radius:5px;padding:5px}.profile .profile-content .right .profile-details form .edit-details-button{background-color:#d33891;color:#fffefe;padding:7px 10px;width:100%;border-radius:5px;margin-top:30px;cursor:pointer}.profile .profile-posts{display:flex;flex-direction:column;gap:15px}.post{box-shadow:0 0 25px -10px #00000061;-webkit-box-shadow:0px 0px 25px -10px rgba(0,0,0,.38);-moz-box-shadow:0px 0px 25px -10px rgba(0,0,0,.38);border-radius:10px}.post .container{padding:20px}.post .user{display:flex;align-items:center;justify-content:space-between}.post .user .userInfo{display:flex;gap:20px}.post .user .userInfo img{width:40px;height:40px;border-radius:50%;-o-object-fit:cover;object-fit:cover}.post .user .userInfo .user-details a{display:flex;flex-direction:column;text-decoration:none}.post .user .userInfo .user-details a .name{font-weight:500}.post .user .userInfo .user-details a .date{font-size:12px}.post .user .details{margin-right:10px;cursor:pointer}.post .user .details .more{position:relative}.post .user .details .more a{position:absolute;right:0;width:40vw;background-color:#d33891;color:#fffefe;padding:10px;border-radius:0 0 10px 10px}@media (min-width: 425px){.post .user .details .more a{width:27vw}}@media (min-width: 768px){.post .user .details .more a{width:20vw}}@media (min-width: 992px){.post .user .details .more a{width:15vw}}.post .content{margin:20px 0}.post .content img{width:100%;margin:0 auto;max-height:600px;-o-object-fit:cover;object-fit:cover;padding:10px 0}@media (min-width: 992px){.post .content img{width:90%;max-height:800px}}.post .content .likes{display:flex}.post .info{display:flex;align-items:center;gap:20px}.post .info .item{display:flex;align-items:center;gap:10px;cursor:pointer;font-size:14px}.comments img{width:40px;height:40px;border-radius:50%;-o-object-fit:cover;object-fit:cover}.comments .write{margin:20px 0;display:flex;justify-content:space-between;align-items:center;gap:20px}.comments .write input{flex:5;padding:10px;background-color:transparent;border-radius:3px}.comments .write button{border:none;padding:10px;color:#fff;background-color:#5271ff;cursor:pointer;border-radius:3px}.comments .comment{margin:30px 0;display:flex;justify-content:space-between;gap:10px}.comments .comment .info{flex:5;display:flex;flex-direction:column;align-items:flex-start;gap:5px}.comments .comment .info span{font-weight:500}.comments .comment .date{flex:1;align-self:center;color:gray;font-size:12px}.likes .container ul{display:flex;gap:10px}.likes .container ul li{font-size:22px;cursor:pointer}.likes .container label{font-size:14px;font-weight:600}.likes .container label select{width:30px}.likes .container .like-button{padding:5px 10px;border-radius:5px;background-color:#1546e6;color:#fffefe;margin-left:10px}.comment{margin-bottom:10px}.comment .owner{display:flex;align-items:center;gap:5px}.comment .owner img{width:30px;height:30px;border-radius:50%;-o-object-fit:cover;object-fit:cover}.comment .owner span{padding-left:10px}header{display:flex;justify-content:space-between;align-items:center;padding:15px;position:sticky;top:0;background-color:#62e636;z-index:10}@media (min-width: 768px){header{margin-bottom:10px}}header .left{display:flex;flex-wrap:wrap;flex:6;align-items:center;position:relative}@media (min-width: 425px){header .left{gap:10px}}header .left .logo{color:#000;font-weight:900;letter-spacing:.1rem;text-transform:uppercase}header .left .menu-icon{cursor:pointer;display:flex;font-size:2rem;align-items:center;position:relative;top:-1px;left:10px}@media (min-width: 425px){header .left .menu-icon{left:0}}@media (min-width: 768px){header .left .menu-icon{display:none}}header .left .sidebar-container{display:flex;gap:10px}header .center{position:relative}header .center .person{margin-right:10px}header .center .person .person-icon{cursor:pointer;font-size:30px}@media (min-width: 768px){header .center .person .person-icon{display:none}}header .right{display:flex;align-items:center;gap:10px}header .right .user{position:relative}header .right .user .profile-icon{cursor:pointer}header .right .user .face-icon{font-size:26px}header .right .user ul{width:45vw;position:absolute;right:-15px;top:35px;background-color:#d33891;padding:15px;border-radius:0 0 10px 10px;line-height:2rem}header .right .user ul a{color:#fffefe}@media (min-width: 425px){header .right .user ul{width:40vw}}@media (min-width: 768px){header .right .user ul{width:25vw}}@media (min-width: 992px){header .right .user ul{width:20vw}}header .right .user img{height:30px;width:30px;-o-object-fit:cover;object-fit:cover;border-radius:50%}.sidebar{width:70vw;position:absolute;top:50px;left:-15px;background-color:#fff;border:2px solid #d3d3d3;border-radius:0 20px 0 0;height:calc(100vh - 50px);overflow:scroll;padding:10px;z-index:1000}.sidebar::-webkit-scrollbar{display:none}.sidebar .container{padding:10px 20px}.sidebar .container hr{margin:10px 0;border:none;height:.5px;background-color:#d3d3d3}.sidebar .container .menu{display:flex;flex-direction:column;gap:10px}.sidebar .container .menu .header{font-weight:600;padding:10px}.sidebar .container .menu .item a{display:flex;gap:5px;align-items:center}.sidebar .container .menu .item a a{text-decoration:none}.sidebar .container .menu .item a span{font-size:14px}.sidebar .container .menu .item a img{height:30px;width:30px;-o-object-fit:cover;object-fit:cover;border-radius:5px}.profiles .userInfo a{text-decoration:none;display:flex;flex-wrap:wrap;align-items:center;gap:5px;padding:5px 0}.profiles .userInfo a img{width:30px;height:30px;border-radius:5px}.friend{padding:10px 0}.friend .friendInfo a{text-decoration:none;display:flex;flex-wrap:wrap;align-items:center;gap:5px}.friend .friendInfo a img{width:40px;height:40px;border-radius:50%;-o-object-fit:cover;object-fit:cover}.friends{width:70vw;position:absolute;top:50px;right:-45px;background-color:#fff;border:2px solid #d3d3d3;border-radius:20px 0 0;height:calc(100vh - 50px);overflow:scroll;padding:10px;z-index:1000}.friends::-webkit-scrollbar{display:none}.friends .container{padding:10px 20px}.follower{padding:10px 0}.follower .followerInfo a{text-decoration:none;display:flex;flex-wrap:wrap;align-items:center;gap:5px}.follower .followerInfo a img{width:40px;height:40px;border-radius:50%;-o-object-fit:cover;object-fit:cover}.latest{padding:10px 0}.latest .friendInfo{text-decoration:none;display:flex;flex-wrap:wrap;align-items:center;gap:5px}.latest .friendInfo img{width:40px;height:40px;border-radius:50%;-o-object-fit:cover;object-fit:cover}.leftbar{flex:2;position:sticky;top:10px;height:calc(100vh - 50px);overflow:scroll;display:none;margin-top:5px}.leftbar::-webkit-scrollbar{display:none}@media (min-width: 768px){.leftbar{display:block}}.leftbar .wrapper{padding:10px 20px}.leftbar .wrapper hr{margin:10px 0;border:none;height:.5px;background-color:#d3d3d3}.leftbar .wrapper .menu{display:flex;flex-direction:column;gap:10px}.leftbar .wrapper .menu .item a{display:flex;flex-wrap:wrap;gap:5px;align-items:center;text-decoration:none}.leftbar .wrapper .menu .item a img{height:30px;width:30px;-o-object-fit:cover;object-fit:cover;border-radius:5px}.leftbar .wrapper .menu span{font-size:14px}.leftbar .wrapper .header{font-weight:600;padding:0;text-transform:uppercase}.rightbar{flex:3;position:sticky;top:10px;height:calc(100vh - 50px);overflow:scroll;display:none;margin-top:5px}.rightbar::-webkit-scrollbar{display:none}@media (min-width: 768px){.rightbar{display:block}}.rightbar .container{padding:10px}.rightbar .container .item{box-shadow:0 0 15px 1px #00000017;-webkit-box-shadow:0px 0px 15px 1px rgba(0,0,0,.09);-moz-box-shadow:0px 0px 15px 1px rgba(0,0,0,.09);padding:20px;margin-bottom:20px;border-radius:10px}.rightbar .container .item .header{font-weight:600;padding:0;text-transform:uppercase}.rightbar .container .item .user{display:flex;align-items:center;justify-content:space-between;margin:20px 0}.rightbar .container .item .user .userInfo{position:relative}.rightbar .container .item .user .userInfo img{width:40px;height:40px;border-radius:50%;-o-object-fit:cover;object-fit:cover}.footer{padding:15px 0;font-size:14px;color:#000;display:flex;flex-direction:column;justify-content:center;align-items:center;margin:20px 0}.footer .top{display:flex;gap:15px}.footer .bottom{display:flex}.share{display:flex;flex-wrap:wrap;gap:10px;box-shadow:0 0 25px -10px #00000061;-webkit-box-shadow:0px 0px 25px -10px rgba(0,0,0,.38);-moz-box-shadow:0px 0px 25px -10px rgba(0,0,0,.38);border-radius:10px;padding:20px}.share .container{width:100%}.share .container .top{display:flex;align-items:center;gap:10px;padding-bottom:10px}.share .container .top .left{display:flex;flex-direction:column;gap:10px}.share .container .top .left .user{display:flex;align-items:center;gap:10px}.share .container .top .left .user .profile-icon{width:45px;height:45px}.share .container .top .left input{margin-left:0}.share .container .top .right .file{width:100px;height:100px;-o-object-fit:cover;object-fit:cover;border-radius:0}.share .container .top img{border-radius:50%;width:40px;height:40px;-o-object-fit:cover;object-fit:cover}.share .container .top input{margin-left:10px;max-width:80vw}@media (min-width: 768px){.share .container .top input{max-width:40vw}}.share .container .rule{margin-bottom:15px}.share .container .bottom{display:flex;align-items:center;justify-content:space-between;gap:15px}.share .container .bottom .left{display:flex;gap:10px;position:relative}.share .container .bottom .left img{width:40px;height:40px;border-radius:5px}.share .container .bottom .left input{padding:5px}.share .container .bottom .left .item{display:flex;flex-direction:column;cursor:pointer}.share .container .bottom .left .item span{padding-top:5px}.share .container .bottom .left .item .cancel{background-color:#d33891;color:#fffefe;font-size:14px;padding:0 7px}.share .container .bottom button{display:flex;align-items:center;height:32px;border:none;border-radius:5px;padding:15px 10px;background-color:#1546e6;color:#fffefe;font-weight:600;cursor:pointer}.posts{display:flex;flex-direction:column;gap:20px;margin:10px 0;position:relative}@media (min-width: 768px){.posts{margin:15px 0 0 15px}}.posts .search{display:flex;padding-left:15px}@media (min-width: 768px){.posts .search{padding-left:0}}.posts .search input{border:none}.login{display:flex;justify-content:center;align-items:center}.login .card{display:flex;flex-direction:column-reverse;margin:40px 0;max-width:75%}@media (min-width: 768px){.login .card{flex-direction:row-reverse}}.login .card .login-left{flex:1;padding:20px 40px;display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(#d338914d,#d338911a),url(https://images.pexels.com/photos/3228727/pexels-photo-3228727.jpeg?auto=compress&cs=tinysrgb&w=1600) center;background-size:cover}@media (min-width: 768px){.login .card .login-left{flex:1}}.login .card .login-left h1{font-weight:600;font-size:50px;color:#fffefe;margin:10px 0}@media (min-width: 768px){.login .card .login-left h1{font-size:40px;margin:20px 0}}@media (min-width: 1280px){.login .card .login-left h1{font-size:50px}}.login .card .login-left p{font-size:22px;color:#fffefe;margin-bottom:10px}.login .card .login-left span{font-size:14px;margin-bottom:10px;color:#fffefe}.login .card .login-left button{border-radius:5px;border:none;background-color:#62e636;color:#000;padding:15px 20px;margin:10px 0;cursor:pointer;text-transform:uppercase}.login .card .login-left button:hover{background-color:#62e619cc}.login .card .login-left button:focus,.login .card .login-left button:active{outline:none}.login .card .login-left button:disabled{cursor:not-allowed}.login .card .login-right{flex:1;padding:40px;display:flex;background-color:#f3f3f3;flex-direction:column;justify-content:center;align-items:center;gap:20px}@media (min-width: 768px){.login .card .login-right{align-items:center}}.login .card .login-right h1{font-size:30px;font-weight:600}.login .card .login-right form fieldset{border:none;display:flex;flex-direction:column;gap:20px}.login .card .login-right form input{border:none;background-color:#fffefe;padding:20px 10px}.login .card .login-right form button{border:none;background-color:#1546e6;color:#fff;padding:15px 20px;border-radius:5px;cursor:pointer;font-weight:700;text-transform:uppercase}.login .card .login-right form button:hover{background-color:#1546e6cc}.register{display:flex;justify-content:center;align-items:center}.register .card{display:flex;flex-direction:column;margin:40px 0;max-width:75%}@media (min-width: 768px){.register .card{flex-direction:row}}.register .card .register-left{flex:1;padding:40px;display:flex;flex-direction:column;background:linear-gradient(#d338914d,#d338911a),url(https://images.pexels.com/photos/3228727/pexels-photo-3228727.jpeg?auto=compress&cs=tinysrgb&w=1600) center;background-size:cover}@media (min-width: 768px){.register .card .register-left{justify-content:space-between;flex:1}}.register .card .register-left h1{font-size:50px;font-weight:600;color:#fffefe;margin:20px 0 10px}@media (min-width: 768px){.register .card .register-left h1{margin:60px 0 20px}}.register .card .register-left p{font-size:22px;color:#fffefe;margin-bottom:10px}.register .card .register-left span{font-size:14px;margin-bottom:10px;color:#fffefe}.register .card .register-left button{border-radius:5px;border:none;background-color:#1546e6;color:#fffefe;padding:15px 20px;margin:10px 0;cursor:pointer;text-transform:uppercase}.register .card .register-left button:hover{background-color:#1546e6cc}.register .card .register-left button:focus,.register .card .register-left button:active{outline:none}.register .card .register-left button:disabled{cursor:not-allowed}.register .card .register-right{flex:1;padding:40px;display:flex;background-color:#f3f3f3;flex-direction:column;justify-content:center;align-items:center;gap:20px}@media (min-width: 768px){.register .card .register-right{align-items:center}}.register .card .register-right h1{font-size:30px;font-weight:600}.register .card .register-right form fieldset{display:flex;flex-direction:column;gap:20px;border:none}.register .card .register-right form input{border:none;background-color:#fffefe;padding:20px 10px}.register .card .register-right form button{border:none;background-color:#62e636;color:#000;padding:15px 20px;border-radius:5px;cursor:pointer;font-weight:700;text-transform:uppercase}.register .card .register-right form button:hover{background-color:#62e619cc}html{box-sizing:border-box;max-width:1440px;margin:0 auto}body{font-family:Nunito Sans,Verdana,Geneva,Tahoma,sans-serif;margin:0}h1,h2,h3,h4,h5,h6{font-family:Lora,Times New Roman,Times,serif}a{color:#000;text-decoration:none}a:hover{text-decoration:underline}input{font-size:.9rem;border:none;opacity:.9}@media (min-width: 768px){input{font-size:1rem}}input:focus{outline:none}input:focus::-moz-placeholder{opacity:0}input:focus::placeholder{opacity:0}ul{list-style:none}button{border:none}.edit{max-width:80vw;align-items:center;margin:10px auto 0;background-color:#fffefe;border:2px solid #d3d3d3;border-radius:5px;padding:20px;display:flex;flex-direction:column;position:relative}@media (min-width: 425px){.edit{width:70vw}}@media (min-width: 768px){.edit{width:45vw}}.edit .back-link{display:flex;gap:5px;color:#1546e6}.edit .edit-form{max-width:45vw;padding:10px 0;display:flex;flex-direction:column;gap:5px}.edit .edit-form label{font-size:14px}.edit .edit-form input{border-radius:5px;padding:5px;border:1px solid #d3d3d3}.edit .edit-form img{border-radius:5px;margin:10px 0}.edit .edit-form .item{display:flex;margin-top:5px;gap:10px;cursor:pointer}.edit .edit-form .item .cancel{background-color:#d33891;color:#fffefe;font-size:14px;padding:0 7px}.edit .edit-form .item button{display:flex;align-items:center;height:32px;border:none;border-radius:5px;padding:15px 10px;background-color:#1546e6;color:#fffefe;font-weight:600;cursor:pointer}.edit .edit-button,.edit .delete-button{padding:5px 10px;border-radius:5px;border:1px solid #1546e6;color:#1546e6;margin:5px 0}.edit .edit-button{margin-top:10px}.edit .delete-button{border:1px solid #d33891;color:#d33891}
