@import"https://fonts.googleapis.com/css2?family=Abril+Fatface&family=Bebas+Neue&family=Poppins:wght@400;500;600&family=Roboto:wght@400;500;700&display=swap";*{font-family:Roboto,sans-serif;margin:0;padding:0}html{background-color:#24243e}.Nav-content{display:flex;background-color:#24243e;width:100%;height:80px;justify-content:space-between;flex-direction:row;align-items:center;box-shadow:0 2px 4px #0003}.logo{background-image:linear-gradient(180deg,rgba(242,95,41,1) 0%,rgb(174,10,250) 100%);background-size:100%;background-repeat:repeat;-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-size:2.2rem;font-weight:700;margin-left:3rem}.Nav-ul{display:flex;justify-content:center;align-items:center;flex-direction:row;text-decoration:none}.Nav-ul ul{background-color:#24243e}.Nav-ul li{background-color:#24243e;padding:10px;border-radius:1.5rem;margin-left:3rem;color:#ffffffba;list-style:none;font-size:1rem;letter-spacing:1px;transition:.5s;text-decoration:none}.Nav-ul li:hover{font-size:1.4rem;background-color:#ffffff1a}.login-name :hover{cursor:pointer;color:#fff;background-image:linear-gradient(to right,#F25F29,#CE3298,#AE0AFA)}.Nav-content1 img{margin:1.2rem auto;width:6rem;height:auto}.sign-in,.sign-up{color:#fff;text-decoration:none}.login-name{padding-right:25px}.login-name a{font-weight:600}.login-name i{font-size:15px;margin-right:5px}.login-name button{border-radius:10px;justify-content:center;text-align:center;width:6rem;height:3rem;padding:10px;background-color:#ae0afa;box-shadow:none}.login-name a{margin-right:3px}.toggle-bar i{font-size:30px;color:#fff;margin-right:30px;cursor:pointer}.tab-mobile{width:50%;height:500px;background-color:#46469c;position:absolute;right:-100%;top:80px;transition:.3s}.tab-mobile.active{width:50%;height:500px;background-color:#24243e;position:absolute;right:0;top:80px;transition:.8s;border-radius:20px}.container-mobile{display:flex;flex-direction:column;align-items:center;background-color:#24243e}.mobile-login-name{display:flex;flex-direction:column;margin-top:30px;margin-bottom:20px}.mobile-login-name button{border-radius:10px;justify-content:center;text-align:center;width:8em;height:3rem;background-color:#ae0afa;font-size:1rem;font-weight:600;color:#fff}.mobile-login-name i{margin-right:10px}.mobile-login-name :hover{cursor:pointer;color:#fcfcfc;background-color:#ae0afa;background-image:linear-gradient(to right,#F25F29,#CE3298,#AE0AFA);border-radius:10px}.mobile-nav-ul li{background-color:#24243e;padding:10px;border-radius:1.5rem;margin-top:20px;color:#fff;list-style:none;font-size:1rem;letter-spacing:1px;cursor:pointer;text-align:center}.mobile-nav-ul li:hover{background-color:#414171;color:#000}.Nav-content.hide{display:none}.nav-mobile{z-index:999}@media screen and (min-width: 987px){.nav-mobile{display:none}}@media screen and (max-width :987px){.ul,.login-name{display:none}}.login{margin:80px auto;width:30%;padding:1rem;padding:3px;border-radius:1.5em}.login form{height:300px;width:100%;background-color:#ffffff31;display:flex;flex-direction:column;align-items:center;border-radius:1.5em}.login form h1{color:#fff;text-align:center;margin:20px;font-size:1.5rem}.login form .contentLogin{display:flex;justify-content:center;flex-direction:column}.login form .contentLogin .listContentLogin{display:flex;justify-content:center}.login form .contentLogin i{color:#24243e;font-size:2rem;height:40px;margin:5px;border:.1px solid rgba(3,3,3,0);padding-right:5px}.login form .contentLogin input::placeholder{opacity:.8;color:#24243e}.login form .contentLogin input{height:40px;width:90%;padding-left:1rem;border:none;color:#fff;background-color:#ffffff31;border-radius:.5em}.login button{height:50px;width:35%;margin-top:10px;margin-left:2.5rem;background-color:#ae0afa;color:#fff;border-radius:.5em;font-size:1em;cursor:pointer;border:#AE0AFA}.login button:hover{background-image:linear-gradient(to right,#F25F29,#CE3298,#AE0AFA);border-radius:.5em}.login .underButton{display:flex;justify-content:center;width:100%;margin-top:15px}.login .underButton h3{margin:10px}.login .underButton h3 span{color:#fff;text-decoration:none;font-size:1rem;font-weight:200}.login .underButton h3 span:hover{text-decoration:underline}@media only screen and (max-width: 992px){.login{width:40%}}@media only screen and (max-width: 768px){.login{width:50%}}@media only screen and (max-width: 480px){.login{width:70%}}@media only screen and (max-width: 320px){.login{font-size:12px;width:90%}.login form{height:260px;width:100%}.login button{width:50%}}.register{margin:5rem auto;width:30%;border:.1px solid rgba(0,0,0,0);padding:3px;border-radius:1.5em}.register form{height:480px;width:100%;background-color:#ffffff31;display:flex;flex-direction:column;align-items:center;border-radius:1.5em}.register form h1{color:#fff;text-align:center;margin:20px;font-size:1.3rem}.register form .contentRegister{display:flex;flex-direction:column;justify-content:center}.register form .contentRegister .listContentRegister{display:flex;justify-content:center}.register form .contentRegister i{padding-top:.5em;font-size:1.5em;height:40px;margin-right:5px;color:#24243e;border:.1px solid rgba(3,3,3,0)}.register form .contentRegister input::placeholder{opacity:.8;color:#24243e}.register form .contentRegister input{height:40px;width:80%;margin:5px;padding-left:1rem;border:.1px solid rgba(3,3,3,0);background-color:#ffffff15;border:none;color:#fafafa;border-radius:.5em}.register form .contentRegister .inputUserPhoto{padding:auto 5px}.register button{height:50px;width:60%;background-color:#ae0afa;color:#fff;border-radius:.5em;font-size:1rem;cursor:pointer;border:#AE0AFA;margin-left:1.5rem}.register button:hover{background-image:linear-gradient(to right,#F25F29,#CE3298,#AE0AFA);border-radius:.5em}.register .underRegister{display:flex;justify-content:center;width:100%}.register .underRegister h3{margin:10px}.register .underRegister h3 span{color:#fff;text-decoration:none;font-size:.8em;font-weight:100;margin-left:1rem}.register .underRegister h3 span:hover{text-decoration:underline}@media only screen and (max-width: 992px){.register{width:40%}}@media only screen and (max-width: 768px){.register{width:50%}}@media only screen and (max-width: 480px){.register{width:70%}}@media only screen and (max-width: 320px){.register{font-size:12px;width:90%;height:450px}.register form{height:430px;width:100%}}.MainPage{padding:0;margin:0;box-sizing:border-box;background-color:#24243e}.feed{background-color:#24243e}.main-session{display:flex;margin-top:.2rem;column-gap:5rem;background-color:#24243e}.main{flex-grow:1;background-color:#24243e}.useronline{margin-top:1.3rem;color:#fff;box-shadow:10px 2px 5px 1px #00000040;width:15rem}.useronline-date{display:flex;flex-direction:column}.DatePicker{width:14.5rem;box-sizing:border-box;border:double 2px transparent;background-origin:border-box;background-clip:padding-box,border-box;background-color:#ffffff13}.box{color:#fff;width:100%;overflow:auto;height:80vh}.box post{background-color:#24243e}.box::-webkit-scrollbar{display:none}.post{width:100%;margin-top:1.25rem;padding-top:.625rem;border-radius:.9375rem;background-color:#2d2d4b;box-shadow:0 5px 7px -7px #000000bf}.postLeft{color:#a19af3;display:flex;flex-direction:row;margin-left:4%;margin-top:.9375rem;align-items:center;gap:.625rem;background-color:#2d2d4b}.postLeftInfo{gap:0px}.postLeftInfo h3,.postLeftInfo p{font-size:medium;background-color:#2d2d4b;font-weight:small}.postLeftInfo p{padding-top:.1rem;font-size:.8em}.postAvatar{margin-right:10px;background-color:#2d2d4b}.postRight{background-color:#2d2d4b;margin-top:0;justify-content:center}.postRight p{margin-left:4%;margin-right:4%;margin-top:1.25rem;margin-bottom:1.25rem;background-color:#2d2d4b}.postImage{background-color:#2d2d4b}.postImage img{background-color:#2d2d4b;width:100%;height:20%;border-radius:.3125rem}.postOptions{background-color:#2d2d4b;display:flex;justify-content:space-around;font-size:medium;cursor:pointer;margin-top:0;color:#7873ad}.reply{background-color:#2d2d4b;display:flex;flex-direction:column;width:.625rem;align-items:center;justify-content:center}.reply img{background-color:#2d2d4b;width:1.25rem}.reply :hover{color:#f25f29;font-weight:700}.privateChat{background-color:#2d2d4b;display:flex;flex-direction:row;width:.625rem;align-items:center;justify-content:center}.privateChat img{width:1.25rem;flex-direction:row;background-color:#2d2d4b}.location{background-color:#2d2d4b;display:flex;flex-direction:row;width:.625rem;align-items:center;justify-content:center}.location img{background-color:#2d2d4b;width:1.25rem;flex-direction:row}.privateChat:hover{color:#f25f29;font-weight:700}.SideBar{background-color:#24243e;width:15rem;align-items:center;z-index:2;padding-top:1rem;padding-bottom:1rem;display:flex;flex-direction:column;gap:1rem;border-right:1px solid #3b3939}.btn{color:#fcfcfc;background-image:linear-gradient(to right,#F25F29,#CE3298,#AE0AFA);background-size:100%;cursor:pointer;width:80%;padding-top:1.2rem;padding-bottom:1.5rem;border:none;border-radius:3rem;font-size:1rem;font-weight:700}.btn:hover{transform:scale(1.1)}.SideBar .Runingicon,.SideBar .Joggingicon,.SideBar .Swimmingicon,.SideBar .Yogaicon,.SideBar .Aerobicicon,.SideBar .Strengthtrainingicon,.SideBar .Plusicon{position:relative}.SideBar .Addposticon,.SideBar .Othersicon{position:relative;padding-top:1.4rem}.Runingicon img,.Joggingicon img{height:1.4rem}.Swimmingicon img{height:1.4rem;margin-right:.3rem}.Yogaicon img,.Aerobicicon img{height:1.4rem}.SideBar .Strengthtrainingicon img{height:27px;margin-right:.5rem}.Addposticon img{margin-right:.5rem}.SideBar .Addposticon{margin-right:.5rem;color:#fff;background-color:#ae0afa;background-size:100%;cursor:pointer;width:80%;padding-top:1.2rem;padding-bottom:1.5rem;border:none;border-radius:3rem;font-size:1rem;font-weight:700}.SideBar .Addposticon:hover{background-color:#f25f29;transform:scale(1.1)}.notification{position:absolute;top:-10px;right:20px;z-index:4}.circle-count{font-size:14px;position:absolute;padding:.6rem;border-radius:2rem;width:1rem;height:1rem;color:#fff;background-color:red}.Useronline{background-color:#24243e;width:15rem;border-left:1px solid #3b3939;border-top:1px solid #3b3939}.list{color:#fff}.Seemore{margin-left:6rem;margin-top:1rem;margin-bottom:1rem}.PostForm{width:50%;padding-bottom:1rem;border-radius:1.5em;background-color:#24243e}.PostForm h1{text-align:center;color:#fff;font-size:25px;padding:.5em}.PostForm .content input,.PostForm .content select,.PostForm .content textarea{color:#e5e5e5;font-size:15px;height:40px;padding:5px 10px;box-sizing:border-box;border:double 2px transparent;border-radius:20px}.PostForm .chooseFile{font-size:15px;height:20px;padding-top:3px;background-color:#24243e;color:#fff;cursor:pointer;padding-left:7px;border:double 2px transparent;border-radius:20px;background-color:#f25f29ab;font-size:12px;transition:.3s}.PostForm .chooseFile:hover{background-color:#ae0afa}.PostForm button{height:30px;width:80px;color:#fff;border:solid transparent;border-radius:28px;padding-right:0 2px;box-shadow:1px 1px #00000040;align-content:center;margin-left:10px;margin-right:10px}.PostForm .buttonPost{display:flex;justify-content:center;cursor:pointer}.ProfilePage{padding:0;margin:0;box-sizing:border-box;font-family:Inter;background-color:#24243e}.user-profile{position:fixed;background-color:#2d2d4b;width:20%;padding-top:90px;min-height:100vh}.my-activity{position:relative;left:20%;width:80%;background-color:#24243e}.box-profile-page{display:flex;flex-direction:row;box-sizing:border-box;background-color:#2d2d4b;border-right:1px solid #3b3939}.profile-picture{display:flex;justify-content:center;background-color:#2d2d4b}.profile-picture img{border-radius:50%;width:45%;height:70%;box-shadow:0 2px 5px #000000b3;border:1px solid rgb(231,229,229);background-color:#fff}.profile-detail{display:flex;flex-direction:column;background-color:#2d2d4b;font-size:17px;padding-top:50px;padding-left:20%}.profile-detail h2{padding-bottom:25px;font-size:clamp(.7em,1.5vw,1.2em);color:#fff;font-weight:700;background-color:#2d2d4b}.profile-detail span{color:#fff;font-weight:300;text-shadow:1px 1px 1px #a8a8a8;background-color:#2d2d4b}.navbar{position:fixed;z-index:1;width:100%;height:auto}@media only screen and (max-width: 640px){.my-activity{left:0%;width:100%}}.card{width:70%;max-width:798px;min-width:350px;height:auto;margin-top:20px;padding:10px 30px 20px;border-radius:30px;background-color:#2d2d4b;box-shadow:0 4px 4px #00000040}.gird-container{display:grid;grid-template-columns:3fr 1fr;grid-template-rows:30px auto}.header-comment:first-child{grid-column-start:1;grid-column-end:3;background-color:#2d2d4b}.header-comment{display:flex;justify-content:right}.left-box{display:grid;grid-template-rows:2.5fr 1fr;background-color:#2d2d4b}.image-comment{display:flex;justify-content:center;align-items:center;padding-top:10px;background-color:#2d2d4b}.image-comment img{width:250px;height:auto;max-width:500px;background-color:#2d2d4b;box-shadow:0 8px 7px -7px #000000bf;border-radius:5%}.footer-cooment{background-color:#2d2d4b}.text-comment{padding:5px 10px 5px 5px;background-color:#2d2d4b}.text-comment p{background-color:#2d2d4b;font-size:1.05em;color:#fff}.button-edit,.button-delete{display:flex;justify-content:center;background-color:#fff;padding:0 8px;margin-left:10px;border:solid 1.5px rgb(96,130,255);border-radius:2em;align-items:center;box-shadow:0 1px 1px 1px #cececebf;cursor:pointer;font-size:14px}.button-edit span{background-color:#fff;color:#07f;font-weight:500}.button-delete span{background-color:#fff;font-weight:500;color:#e09200}.button-edit i{padding-right:10px;color:#07f}.button-delete i{padding-right:10px;color:#e09200}.button-edit:hover,.button-delete:hover{background-color:#f3f3f3;transform:scale(1.02)}.footer-cooment i{font-size:19px}.footer-cooment .location{display:flex;font-size:1.1em;font-weight:600;background-color:#a19af3;margin-left:10px}.footer-cooment .location p{margin-left:10px;background-color:#2d2d4b;color:#a19af3;width:100px}.fa-location-dot:before,.fa-map-marker-alt:before{color:#a19af3}.posted-date{display:flex;padding-top:5px;background-color:#2d2d4b;letter-spacing:1px}.posted-date p{padding-right:20px;font-weight:300;background-color:#2d2d4b;color:#7873ad}.posted-date h5{font-weight:600;font-size:1em;padding-right:10px;background-color:#2d2d4b;color:#7873ad}@media only screen and (max-width: 1140px){.image-comment img{width:100%;max-width:400px;height:auto}.footer-cooment{font-size:1.2vw}}@media only screen and (max-width: 960px){.gird-container{display:grid;grid-template-columns:1fr;grid-template-rows:30px auto auto;grid-template-areas:"header" "image" "comment"}.header-comment{grid-area:header}.image-comment{grid-area:image}.left-box{padding-top:15px;grid-area:comment}.image-comment img{width:100%;max-width:300px;height:auto}.footer-cooment{padding-top:10px}.footer-cooment{padding-top:10px;font-size:1.7vw}.button-edit,.button-delete{font-size:12px;margin-left:8px;padding:0 7px}}.dropbtn{background-color:#ae0afa;color:#fff;padding:16px;font-size:14px;border:none;cursor:pointer;border-radius:2rem}.dropdown{position:relative;display:inline-block;direction:unset}.dropdown-content{display:none;position:absolute;background-color:#f9f9f9;min-width:160px;box-shadow:0 8px 16px #0003;z-index:1}.dropdown-content a{color:#000;padding:12px 16px;text-decoration:none;display:block}.dropdown-content a:hover{background-color:#f1f1f1}.dropdown:hover .dropdown-content{display:block}.dropdown:hover .dropbtn{background-image:linear-gradient(to right,#F25F29,#CE3298,#AE0AFA)}.show-card-activities{display:flex;flex-direction:column;justify-content:center;align-items:center;padding-top:90px}.h1__weeks{display:flex;width:70%;max-width:798px;min-width:350px;justify-content:space-between;align-items:center}.h1__weeks h1{font-size:clamp(22px,2vw,25px);text-align:center;letter-spacing:1px;color:#fff}.PostForm{margin:10px auto;font-family:Arial,Helvetica,sans-serif;width:50%;padding-bottom:1rem;box-shadow:0 7px 7px 5px #00000040;border-radius:10px}.PostForm h1{text-align:center;color:#fff;font-size:25px;padding-bottom:.5rem}.PostForm .content{padding-bottom:10px;margin-left:12rem;font-size:16px}.PostForm .content label{padding-bottom:.2rem;color:#fff;display:block;width:100px}.PostForm .content input,.PostForm .content select,.PostForm .content textarea{color:#c9c4fd;font-size:15px;height:40px;padding:5px 10px;box-sizing:border-box;border:double 2px transparent;border-radius:20px;background-image:linear-gradient(#24243E,#24243E),linear-gradient(to right,#F25F29,#DB4271,#CE3298,#AE0AFA);background-origin:border-box;background-clip:padding-box,border-box}.PostForm .content input,.PostForm .content textarea[type=text]{width:60%}.PostForm .content input::placeholder,.PostForm .content textarea::placeholder{color:#c9c4fd}.PostForm .content textarea{height:70px}.PostForm .content select{position:relative;cursor:pointer;margin-left:1px;width:60%}.PostForm .content .addSport{width:20%;font-size:14px;margin-left:1rem;background-image:linear-gradient(#414171,#414171),linear-gradient(to right,#414171,#414171);color:#c9c4fd}.PostForm .content .inputTime{width:60%;color:#c9c4fd}.PostForm .content span{margin-left:15px;margin-right:15px;font-size:30px;color:#fff}.PostForm .chooseFile{font-size:15px;height:20px;padding-top:3px;background-color:#24243e;color:#fff;cursor:pointer;padding-left:7px;border:double 2px transparent;border-radius:20px;font-size:12px;transition:.3s}.PostForm .PostForm .chooseFile:hover{background-color:#fff;width:50px;height:50px}.PostForm .chooseFile img:hover{background-color:#fff;border:15px solid #24243E;width:100px;height:100px;margin-top:-10px;margin-left:-10px}.PostForm button{height:30px;width:80px;font-weight:700;color:#fff;border:solid transparent;border-radius:28px;padding-right:0 2px;box-shadow:1px 1px #00000040;align-content:center;margin-left:10px;margin-right:10px}.PostForm .buttonPost{display:flex;justify-content:center;cursor:pointer;margin-top:5rem}.PostForm .buttonPost .saveButton{background-color:#ae0afa}.PostForm .buttonPost .saveButton:hover{background-color:#f25f29}.PostForm .buttonPost .cancelButton{background-color:#26263f;border:1px solid white}.PostForm .buttonPost .cancelButton:hover{background-color:#12121e}@media only screen and (max-width: 992px){.PostForm{width:60%}.PostForm .content{margin-left:10rem}.PostForm .content label{width:25%;padding-bottom:.2rem}.PostForm .content .addSport{width:20%}}@media only screen and (max-width: 768px){.PostForm{width:80%}.PostForm .content .addSport{width:25%}}@media only screen and (max-width: 480px){.PostForm{width:70%}.PostForm h1{font-size:20px}.PostForm .content{font-size:16px;margin-left:3rem;padding-bottom:.5rem}.PostForm .content input,.PostForm .content select,.PostForm .content textarea{font-size:12px;width:65%;padding:5px 10px}.PostForm .content .addSport{font-size:10px;margin-left:3px;width:30%}.PostForm .content .inputTime{width:30%}.PostForm .content span{font-size:15px;margin:0 5px}.PostForm .chooseFile{font-size:12px;padding-top:5px;height:15px}}@media only screen and (max-width: 320px){.PostForm{width:90%}.PostForm h1{font-size:14px}.PostForm .content{font-size:14px;margin-left:5px;padding-bottom:.3rem}.PostForm .content input,.PostForm .content select,.PostForm .content textarea{font-size:12px;width:70%;padding:3px 7px}.PostForm .content input,.PostForm .content textarea[type=text]{width:70%}.PostForm .content .addSport{width:25%;font-size:9px}.PostForm .content .inputTime{width:32%}.PostForm .chooseFile{font-size:10px;padding-top:3px;height:12px}.PostForm button{height:30px;width:60px;font-size:10px}.PostForm .buttonPost{display:block;align-items:center;width:90%;height:30px}.PostForm .buttonPost .saveButton{margin:.5rem 5rem}.PostForm .buttonPost .cancelButton{margin:0 5rem}}