@import"https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,200;0,6..12,300;0,6..12,400;0,6..12,500;0,6..12,600;0,6..12,700;0,6..12,800;0,6..12,900;0,6..12,1000;1,6..12,500;1,6..12,600;1,6..12,700;1,6..12,800;1,6..12,1000&display=swap";.content .gridbox{display:flex;justify-content:center;align-items:center;align-content:center;gap:16px;flex-wrap:wrap}.dropdown-container{width:100%;display:flex;padding:10px 0;flex-direction:column;align-items:flex-start;gap:16px}.dropdown{position:relative;width:100%}.dropdown-button{width:100%;display:flex;padding:12px;align-items:center;gap:12px;align-self:stretch;border-radius:6px;border:.5px solid #D9D9D9;background:#04080f0d}.dropdown-menu{position:absolute;top:100%;left:0;right:0;background-color:#fff;border:1px solid #ccc;box-shadow:0 2px 10px #0000001a;z-index:1000;border-radius:8px;margin-top:12px}.dropdown-item{padding:10px;cursor:pointer;border-radius:6px}.dropdown-item:hover{background-color:#f0f0f0}.Home .Users{display:flex;width:100%;align-items:flex-start;gap:13px;border-radius:12px;flex-wrap:wrap}.userCard{display:flex;width:100%;padding:12px;flex-direction:row;align-items:flex-start;gap:13px;border-radius:12px;border:.5px solid rgba(4,8,15,.12);background:#fff;justify-content:left}.userCard .user_data{width:100%;display:flex;align-items:flex-start;gap:16px}.userCard .user_data img{width:43px;height:43px;border-radius:8px;background:url(<path-to-image>) #d3d3d3 50% / cover no-repeat}.userCard .user_data .content{display:flex;flex-direction:column;justify-content:left}.userCard .user_data .content h1{font-size:18px;font-style:normal;font-weight:700;line-height:normal;text-align:left}.userCard .user_data .content p{font-size:14px;font-style:normal;font-weight:400;line-height:normal;text-align:left}.userCard .portfoliosec{display:flex;align-items:flex-start;gap:12px}.userCard .portfoliosec h2{color:#000;font-family:Nunito Sans;font-size:14px;font-style:normal;font-weight:700;line-height:normal}.Profile{width:100%;display:inline-flex;flex-direction:column;align-items:flex-start}.Profile .TopView{display:flex;justify-content:space-between;align-items:flex-start;align-self:stretch}.Profile .View_Information{width:100%;display:flex;align-items:flex-start;flex-wrap:wrap;gap:16px;margin:23px 0;position:relative;padding-bottom:40px;overflow:hidden;transition:all .5s ease-in-out}.Profile .TopView .profile_pic{width:68px;height:68px;border-radius:8px;border:.5px solid rgba(4,8,15,.15);background:url(https://skillsbank.online/assets/Logos/Logo.png),#d2d2d2 50% / cover no-repeat;overflow:hidden}.Profile .View_Information .hr_h{height:.2px;width:100%;border:none;background:#d8d8d8;display:block}.Profile .View_Information .view_controle{display:flex;width:100%;gap:12px;align-items:center;position:absolute;bottom:0;background:#fff}.Profile .View_Information .view_controle span{flex-shrink:0}.Profile .View_Information .Information_Details{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:4px;flex-shrink:0}.Profile .View_Information .Information_Details .h_container{display:flex;gap:4px;flex-shrink:0;align-items:center;justify-content:center}.Profile .View_Information .Information_Details .h_container .hr{width:.5px;height:12px;border:none;background:#8e8e8e;display:block;margin:0 5px}.Profile .View_Information .Information_Details h1{font-size:20px;font-style:normal;font-weight:700;line-height:normal}.Profile .View_Information .Information_Details p{font-size:12px;font-style:normal;font-weight:400;line-height:normal}.Profile .TopView .View_Action{display:flex;flex-direction:column;align-items:flex-end;gap:8px}.Profile .TopView .View_Action div{display:flex;padding:5px 12px;align-items:center;gap:10px}.Profile .TopView .View_Action div img{width:18px;height:18px}.Profile .TopView .View_Action div p{font-size:14px;font-style:normal;font-weight:400;line-height:normal}.Profile .Performance_View{width:100%;height:76px;overflow:scroll}.Profile .Performance_View .items_scroll{height:auto;display:flex;gap:12px}.Profile .Performance_View .View_Item{width:100%;display:flex;padding:6px;align-items:flex-start;border-radius:4px;border:.5px solid rgba(4,8,15,.12);background:#fff}.Profile .Performance_View .View_Item svg{display:none}.Profile .Performance_View .View_Item_active{border:.5px solid var(--Primary, #507DBC);position:relative}.Profile .Performance_View .View_Item .icon{display:flex;padding:8px;align-items:center;gap:10px;border-radius:4px;background:#507dbc1f}.Profile .Performance_View .View_Item_active .icon{display:flex;padding:8px;align-items:center;gap:10px;border-radius:4px;background:var(--Primary, #507DBC);transition:all .15s ease-in-out}.Profile .Performance_View .View_Item_active svg{display:block;position:absolute;bottom:-8px;z-index:-10}.Profile .Performance_View .View_Item .icon img{width:22px;height:22px}.Profile .Performance_View .View_Item .info{display:flex;height:38px;flex-direction:column;align-items:flex-start;padding:0 8px}.Profile .Performance_View .View_Item .info h4{color:#212121;font-size:16px;font-style:normal;font-weight:700;line-height:normal}.Profile .Performance_View .View_Item_active .info h4{color:var(--Primary, #507DBC);font-size:16px;font-style:normal;font-weight:800;line-height:normal}.Profile .Performance_View .View_Item .info p{font-size:12px;font-style:normal;font-weight:400;line-height:normal}.Profile .Action_View{display:flex;width:100%;flex-direction:column;align-items:flex-start;border-top:.5px solid rgba(4,8,15,.12);margin-top:18px}.Profile .Action_View .Action_Item{display:flex;padding:16px 0;justify-content:space-between;align-items:center;align-self:stretch;gap:12px;border-bottom:.5px solid rgba(4,8,15,.12)}.Profile .Action_View .Action_Item p{width:100%;font-size:16px;font-style:normal;font-weight:600}.Profile .skill_smBox{display:flex;gap:10px;flex-wrap:wrap;align-items:center;overflow:scroll}.Profile .project_smBox .project_body{width:100%;display:flex;flex-direction:column;gap:8px}.Profile .Details_View .project_body .icon{display:flex;width:41px;height:41px;padding:.5px 0;justify-content:center;align-items:center;overflow:hidden;flex-shrink:0;border-radius:6px}.Profile .Details_View .project_body .icon img{width:100%;height:100%}.Profile .Details_View .project_body .info h3{font-family:Nunito Sans;font-size:16px;font-style:normal;font-weight:700;line-height:20px;letter-spacing:.1px}.Profile .Details_View .project_body .info p{font-family:Nunito Sans;font-size:12px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.1px}.card-skil{display:flex;padding:10px;flex-direction:column;align-items:flex-start;gap:10px;border-radius:8px;border:.5px solid rgba(0,0,0,.12);background:#fff;flex-shrink:0;width:100%}.card-skil .Image-skill{display:inline-flex;padding:8px;align-items:flex-start;gap:10px;border-radius:6px;background:#9e9e9e}.card-skil .card-content{display:flex;flex-direction:column;align-items:flex-start;gap:3px}.card-skil .card-content h2{color:#000;font-family:Nunito Sans;font-size:15px;font-style:normal;font-weight:700;line-height:normal}.card-skil .card-content p{color:#000;font-family:Nunito Sans;font-size:12px;font-style:normal;font-weight:400;line-height:normal}.card-skil .card-content b{color:#000;font-family:Nunito Sans;font-size:12px;font-style:normal;font-weight:700;line-height:normal}.Profile{padding:18px}.Profile .TopSection{display:flex;align-items:flex-start;gap:28px;border-radius:8px;flex-shrink:0}.Profile .TopSection .Thumbnail{position:relative;width:50%;overflow:hidden;border-radius:12px}.Profile .TopSection .Thumbnail img{width:100%}.Profile .TopSection .Thumbnail button{position:absolute;top:2%;left:2%;background:#fff;border:.5px solid rgba(4,8,15,.12);display:flex;justify-content:center;align-items:center}.Profile .TopSection .textDetails{display:flex;flex-direction:column;align-items:flex-start;gap:10px}.Profile .TopSection .textDetails h1,.Profile .TopSection .textDetails p{text-align:left}.SkillDetails{display:flex;width:100%;align-items:flex-start;align-content:flex-start;gap:18px;flex-wrap:wrap;margin:16px 0 18px}.SkillDetails .progress{margin:16px 0;width:100%}.SkillDetails .progress .bar{width:100%;height:5px;background:#ddd;overflow:hidden;border-radius:5px}.SkillDetails .progress .bar .indicator{height:5px;width:0%;background:var(--primary-color, #507DBC)}.SkillDetails .progress p{font-size:15px;margin:6px 0;text-align:left}.SkillDetails .container_i{display:flex;align-items:flex-start;gap:9px}.SkillDetails .container_i img{display:flex;width:38px;height:38px;justify-content:center;align-items:center;border-radius:6px;padding:8px}.SkillDetails .container_i .details_i h1{font-size:12px;font-style:normal;font-weight:400;line-height:normal;text-align:left;width:100%}.SkillDetails .container_i .details_i p{color:#000;font-size:15px;font-style:normal;font-weight:700;line-height:normal;margin-top:2px;text-align:left;width:100%}.SkillDetails .KeyPoints .KeyFeaturesList{padding:12px 0;display:flex;flex-wrap:wrap;gap:12px 28px}.SkillDetails .KeyPoints .KeyFeature{display:flex;align-items:flex-start;gap:9px}.SkillDetails .KeyPoints .KeyFeature img{display:flex;width:38px;height:38px;padding:10px;justify-content:center;align-items:center;border-radius:6px;background:#6fcf9729}.SkillDetails .KeyPoints .KeyFeature .FeatureDetails h1{font-size:15px;font-style:normal;font-weight:700;line-height:normal;text-align:left}.SkillDetails .KeyPoints .KeyFeature .FeatureDetails p{font-size:12px;font-style:normal;font-weight:400;line-height:normal;opacity:.8;text-align:left}.Topics{display:flex;width:100%;align-items:flex-start;align-content:flex-start;gap:12px;flex-wrap:wrap;margin:16px 0 18px}.TopicCard{display:flex;width:345px;padding:12px;flex-direction:column;align-items:flex-start;gap:3px;border-radius:8px;border:.5px solid rgba(4,8,15,.15);background:#f8f8f8}.TopicCard h1{font-size:16px;font-style:normal;font-weight:700;line-height:normal}.List-Product-Cards{display:flex;flex-direction:column;align-items:flex-start;gap:18px;width:100%}.project-Crad-Big{display:inline-flex;flex-direction:column;align-items:flex-start;gap:10px;border-bottom:.5px solid rgba(0,0,0,.12);padding-bottom:8px;width:100%}.project-Crad-Big .project-big-img{width:100%;height:10%;flex-shrink:0;position:relative;overflow:hidden}.project-Crad-Big .project-big-img .img{width:100%;height:200px;border-radius:8px;object-fit:cover;object-position:top}.project-Crad-Big .project-big-img .ProjectType-Badge{display:inline-flex;padding:6px 10px;align-items:center;gap:5px;border-radius:100px;background:#fff9;-webkit-backdrop-filter:blur(11.5px);backdrop-filter:blur(11.5px);position:absolute;top:10px;left:10px}.project-Crad-Big .project-big-img .ProjectType-Badge img{width:18px;height:18px}.project-Crad-Big .project-big-img .ProjectType-Badge p{font-size:12px;font-style:normal;font-weight:700;line-height:normal}.project-Crad-Big .project-big-cotent{display:flex;flex-direction:column;align-items:flex-start;gap:5px;align-self:stretch}.project-Crad-Big .project-big-cotent h1{font-size:18px;font-style:normal;font-weight:700;line-height:normal}.project-Crad-Big .project-big-cotent p{font-size:14px;font-style:normal;font-weight:400;line-height:normal;opacity:.6}.project-Crad-Big .project-big-cotent .project-big-cotent-info{display:flex;padding:8px 0;justify-content:space-between;align-items:flex-start;flex:1 0 0;align-self:stretch}.project-Crad-Big .project-big-cotent .project-big-cotent-info p{font-size:12px;font-style:normal;font-weight:400;line-height:normal;opacity:.5}.Preview_Project_Container{display:flex;flex-direction:column;align-items:flex-start}.Preview_Project_Container .Details_Project{display:flex;width:345px;align-items:center;gap:18px}.Preview_Project_Container .Details_Project .Logo{width:68px;height:68px;flex-shrink:0;border-radius:6px;border:.5px solid rgba(4,8,15,.12);overflow:hidden;object-fit:cover}.Preview_Project_Container .Details_Project .Logo img{width:100%;object-fit:cover}.Preview_Project_Container .Details_Project .Text_data h3{font-family:Nunito Sans;font-size:18px;font-style:normal;font-weight:800;line-height:20px;letter-spacing:.1px}.Preview_Project_Container .Details_Project .Text_data p{color:var(--Primary, #507DBC);font-family:Nunito Sans;font-size:12px;font-style:normal;font-weight:400;line-height:20px;text-align:left}.Preview_Project_Container .Project_Prev_images{display:flex;width:100%;align-items:flex-start;gap:10px;overflow-x:scroll;padding-top:18px}.Preview_Project_Container .Project_Prev_images img{width:300px;height:224px;flex-shrink:0;border-radius:8px;object-fit:cover;background:#d3d3d3 50% / cover no-repeat;transition:all 1px ease-in-out}.Preview_Project_Container .Project_Prev_images .big_Image_preview{position:fixed;height:100%;width:100%;background-color:#0004;top:0;right:0;background-size:contain}.Preview_Project_Container .Project_Prev_images button{position:absolute;z-index:3;top:5%;right:5%}.Preview_Project_Container .More_Details{display:flex;flex-direction:column;align-items:flex-start;gap:16px}.Preview_Project_Container .More_Details p{font-family:Nunito Sans;font-size:16px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.1px}.Preview_Project_Container .More_Details .Prev_link{display:flex;justify-content:center;align-items:center;gap:8px;border-radius:100px;border:1px solid var(--Primary, #507DBC);padding:5px 18px;background:#507dbc1f}.Preview_Project_Container .More_Details .Prev_link a{color:var(--Primary, #507DBC);text-align:center;font-family:Roboto;font-size:12px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.1px}:root{--primary-color: #507DBC;--secondary-color: #04080F;--tertiary-color: #A1C6EA;--bg-color: #DAE3E5;--text-color: #212121;--screen-light-color: #FBFBFB}*{margin:0;padding:0;box-sizing:border-box;font-family:Nunito Sans;border:none;outline:none;text-decoration:none}*::-webkit-scrollbar{width:0px}body{background:#f1f1f1}button{cursor:pointer}.body{display:flex;width:100vw;height:100vh;padding:140px 257px 140.319px;justify-content:center;align-items:center}.body .container{display:flex;width:766px;padding:var(--Spacing-M, 48px);flex-direction:column;justify-content:center;align-items:center;gap:var(--Spacing-SM, 32px);flex-shrink:0;border-radius:12px;background:#fff;box-shadow:0 4px 6px -4px #0000001a,0 0 15px #0000001a}.TopAppBar{width:100%;display:flex;justify-content:center;align-items:center;border-bottom:.5px solid rgba(0,0,0,.2);padding-bottom:22px;position:relative;transition:all .5s ease-in-out}.scroll-active{position:fixed;top:0;right:0}.TopAppBar .logo{width:25%}.details{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px}h1{color:var(--secondary-color);text-align:center;font-size:22px;font-style:normal;font-weight:700;line-height:28px}p{color:#676767;text-align:center;font-size:15px;font-style:normal;font-weight:400;line-height:normal}.hero_image{width:45%}.chip{display:flex;color:#507dbc;padding:10px 21px;justify-content:center;align-items:center;gap:10px;border-radius:8px;background:#507dbc1f;font-size:12px;cursor:pointer}.chip_active{cursor:pointer;font-size:12px;display:flex;padding:10px 21px;justify-content:center;align-items:center;gap:10px;border-radius:8px;background:#507dbc;color:#fff}.button_big{display:flex;width:100%;padding:10px 24px;justify-content:center;align-items:center;gap:8px;border-radius:8px;background:var(--Primary, #507DBC);box-shadow:0 1px 2px #0000000d;color:#fff}.button_small{display:flex;padding:8px 22px;flex-direction:column;justify-content:center;align-items:center;gap:8px;border-radius:100px;border:1px solid var(--Primary, #507DBC);position:absolute;top:0;left:0}.Searchbar{display:flex;width:100%;padding:8px 8px 8px 12px;align-items:center;gap:12px;border-radius:8px;border:.5px solid var(--Primary, #858585);background:#fff}.Searchbar:hover{border:2px solid var(--Primary, #507DBC)}.Searchbar input{width:100%}.Searchbar .SearchBtn{width:80px;display:flex;padding:6px 18px;justify-content:center;align-items:center;gap:8px;background:#507dbc1f;color:#507dbc}.Searchbar .SearchBtn-diss{width:80px;display:flex;padding:6px 18px;justify-content:center;align-items:center;gap:8px;background:#6565651f}.TopAppBar .action{width:100%;display:flex;gap:12px;align-items:center}.PreviewScreen{position:fixed;padding:22px;top:0;left:0;width:100vw;height:100vh;background-color:#fff}.PopUpSceen{background:linear-gradient(180deg,#fff0,#0000004d);position:fixed;top:0%;left:0%;width:100%;height:100%;z-index:100;display:flex;justify-content:center;align-items:flex-end;-webkit-backdrop-filter:blur(35px);backdrop-filter:blur(35px);transition:all .5s ease-in-out}.PopUpSceen .PopUpSceen_Content{width:100%;padding:15px;border-radius:8px 8px 0 0;background:#fff;transition:all .5s ease-in-out}.PopUpSceen .PopUpSceen_Content .PopUpCloseBar{width:100%;background:#fff;transition:all .5s ease-in-out}.PopUpSceen .PopUpSceen_Content .PopUpCloseBar .indicBard{width:40px;height:4px;background:#bfbfbf;border-radius:50px;margin:0 auto}.PopUpSceen .PopUpSceen_Content .PopUpCloseBar .indicBard:hover{background:#507dbc;width:45px}.PopUpSceen_Content .cat_skill_list{display:flex;flex-direction:column;gap:12px;height:480px;overflow:scroll;padding:0 0 24px;margin:16px 0;transition:all .5s ease-in-out}.PopUpSceen_Content .cat_skill_list .Cat_Skill_View{display:flex;width:100%;padding:12px;flex-direction:column;align-items:flex-start;gap:3px;border-radius:8px;border:.5px solid rgba(4,8,15,.15);background:#f8f8f8}.PopUpSceen .PopUpSceen_Content .cat_skill_list .Cat_Skill_View h3{color:var(--Secondary, #04080F);font-size:16px;font-style:normal;font-weight:700;line-height:normal}.PopUpSceen .PopUpSceen_Content .cat_skill_list .Cat_Skill_View p{color:var(--Secondary, #04080F88);font-size:13px;font-style:normal;font-weight:400;line-height:normal}.Project{padding:18px}.tabview{display:flex;gap:12px;align-items:center}.tabview h5{padding:10px 20px;background-color:#fff;border:1px solid #507DBC;border-radius:8px;cursor:pointer;text-align:center}.tabview .Active{color:#fff;background:#507dbc}@media (max-width: 600px){.body{padding:40px 20px}.body .container{width:100%;padding:20px}.TopAppBar .button_small{position:static}.TopAppBar{flex-wrap:wrap;justify-content:space-between}.TopAppBar .logo{width:50%}.hero_image,.button_big,.userCard{width:100%}.TopAppBar .action{margin:16px 0}.Profile .TopSection{flex-wrap:wrap}.Profile .TopSection .Thumbnail,.TopicCard{width:100%}.Project{padding:18px}.project-Crad-Big{width:100%;margin:0 8px;border-radius:12px;overflow:hidden}.Users{justify-content:center;padding:12px}}@media (min-width: 600px) and (max-width: 768px){.body{padding:60px 30px}.body .container{width:90%;padding:30px}.TopAppBar .logo{width:40%;display:flex;justify-content:center;align-items:center}.hero_image{width:70%}.button_big,.userCard{width:100%}.Users{justify-content:center;padding:12px 56px}.Profile .TopSection{flex-wrap:wrap}.Profile .TopSection .Thumbnail,.TopicCard{width:100%}.Project{padding:48px}.project-Crad-Big{width:100%;margin:0 8px;border-radius:12px;overflow:hidden}}@media (min-width: 768px) and (max-width: 992px){.body{padding:80px 50px}.body .container{width:80%;padding:40px}.TopAppBar .logo{width:30%;display:flex;justify-content:center;align-items:center}.hero_image{width:60%}.button_big,.userCard{width:100%}.Users{justify-content:center;padding:12px 54px}.card-skil{width:30%}.card-skil p{text-align:left}.Profile .TopSection{flex-wrap:wrap}.Profile .TopSection .Thumbnail,.TopicCard{width:100%}.Project{padding:48px}.project-Crad-Big{width:100%;margin:0 8px;border-radius:12px;overflow:hidden}}@media (min-width: 992px) and (max-width: 1200px){.body{padding:100px}.body .container{width:70%;padding:40px}.TopAppBar .logo{width:25%;display:flex;justify-content:center;align-items:center}.hero_image{width:50%}.button_big{width:100%}.Users{justify-content:center;padding:12px 154px}.card-skil{width:30%}.card-skil p{text-align:left}.PopUpSceen .PopUpSceen_Content{width:50%}.Project{padding:58px}.project-Crad-Big{width:40%;margin:0 8px;border-radius:12px;overflow:hidden}}@media (min-width: 1200px){.body{padding:140px 257px}.body .container{width:766px;padding:var(--Spacing-M, 48px)}.TopAppBar .logo{width:25%;display:flex;justify-content:center;align-items:center}.hero_image{width:45%}.button_big{width:321px}.Users{justify-content:center;padding:12px 210px}.Profile .container{padding:28px}.Profile .container .View_Information .Information_Details h1{font-size:28px}.Profile .container .View_Information .Information_Details h5{font-size:20px}.Profile .container .View_Information .Information_Details p{font-size:18px}.card-skil{width:28%}.card-skil p{text-align:left}.PopUpSceen{bottom:0}.PopUpSceen .PopUpSceen_Content{width:50%;justify-content:center;align-items:center}.Project{padding:88px}.project-Crad-Big{width:30%;margin:0 8px;border-radius:12px;overflow:hidden}}
