:root{--main-color: #27BBD8;--dark-color: #333;--text-color: #38363f;--border: 1px solid #DBDBDB}*{margin:0;padding:0;list-style:none;text-decoration:none;box-sizing:border-box}body,button,input{font-family:Tajawal,sans-serif}html{scroll-behavior:smooth}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-thumb{background-color:var(--main-color)}::-webkit-scrollbar-track{background-color:#ddd}@media (max-width: 767px){*{cursor:auto!important}}main{height:100vh;margin-inline-start:250px}main .mian-outlet{min-height:calc(100vh - 75px)}@media (max-width: 1000px){main{margin-inline-start:0!important}}.sidebar{position:fixed;z-index:999;width:250px;height:100vh;overflow:auto;border-inline-end:var(--border);background-color:#fff;transition:all .3s}.sidebar .active{background-color:var(--main-color);color:#fff!important;border-radius:10px}.sidebar header{display:flex;align-items:center;justify-content:space-between;border-bottom:var(--border);padding-inline:15px;height:75px}.sidebar header .logo{display:flex;align-items:center;justify-content:center}.sidebar header .logo img{width:40px}.sidebar header .control-sidebar{display:flex;align-items:center;justify-content:center;border:none;background-color:transparent;font-size:30px;color:#6d6d6d;cursor:pointer}.sidebar header .close-menu{display:none}.sidebar .main-pages{padding:20px 0;margin-inline:15px;display:flex;flex-direction:column;gap:10px;border-bottom:var(--border)}.sidebar .main-pages .item{display:flex;align-items:center;gap:10px;font-size:18px;color:var(--text-color);padding:9px 15px;transition:all .3s}.sidebar .main-pages .item span{display:flex;align-items:center;justify-content:center}.sidebar .main-pages .item:hover{background-color:var(--main-color);color:#fff;border-radius:10px}.sidebar .companys,.sidebar .boards{padding:20px 25px}.sidebar .companys .head,.sidebar .boards .head{display:flex;align-items:center;justify-content:space-between}.sidebar .companys .head p,.sidebar .boards .head p{font-size:20px;color:var(--text-color)}.sidebar .companys .head p span:last-child,.sidebar .boards .head p span:last-child{display:none}.sidebar .companys .head button,.sidebar .boards .head button{display:flex;align-items:center;justify-content:center;border:none;background-color:transparent;font-size:20px;cursor:pointer}.sidebar .companys .all-companys,.sidebar .companys .all-boards,.sidebar .boards .all-companys,.sidebar .boards .all-boards{margin-top:15px;display:flex;flex-direction:column;gap:10px}.sidebar .companys .all-companys .item,.sidebar .companys .all-boards .item,.sidebar .boards .all-companys .item,.sidebar .boards .all-boards .item{display:flex;align-items:center;gap:10px;font-size:18px;color:var(--text-color);padding:5px 15px;transition:all .3s}.sidebar .companys .all-companys .item:hover,.sidebar .companys .all-boards .item:hover,.sidebar .boards .all-companys .item:hover,.sidebar .boards .all-boards .item:hover{background-color:var(--main-color);color:#fff;border-radius:10px}.sidebar .companys .all-companys .item span,.sidebar .companys .all-boards .item span,.sidebar .boards .all-companys .item span,.sidebar .boards .all-boards .item span{display:block;width:12px;height:12px;border-radius:50%}.close-sidebar{width:100px!important}.close-sidebar header{padding-inline:0;justify-content:space-around}.close-sidebar .main-pages{margin-inline:20px}.close-sidebar .main-pages .item{justify-content:center}.close-sidebar .main-pages .item p{display:none}.close-sidebar .companys .head,.close-sidebar .boards .head{gap:10px}.close-sidebar .companys .head p span:first-child,.close-sidebar .boards .head p span:first-child{display:none}.close-sidebar .companys .head p span:last-child,.close-sidebar .boards .head p span:last-child{display:flex;align-items:center}.close-sidebar .companys .all-companys,.close-sidebar .companys .all-boards,.close-sidebar .boards .all-companys,.close-sidebar .boards .all-boards{margin-top:30px;gap:20px}.close-sidebar .companys .all-companys .item,.close-sidebar .companys .all-boards .item,.close-sidebar .boards .all-companys .item,.close-sidebar .boards .all-boards .item{justify-content:center}.close-sidebar .companys .all-companys .item span,.close-sidebar .companys .all-boards .item span,.close-sidebar .boards .all-companys .item span,.close-sidebar .boards .all-boards .item span{width:20px;height:20px}.close-sidebar .companys .all-companys .item p,.close-sidebar .companys .all-boards .item p,.close-sidebar .boards .all-companys .item p,.close-sidebar .boards .all-boards .item p{display:none}@media (max-width: 1000px){.sidebar header .control-sidebar{display:none}.sidebar header .close-menu{display:flex;align-items:center;justify-content:center;border:none;background-color:transparent;color:var(--main-color);font-size:25px;cursor:pointer}}.navbar{height:75px;padding-inline:20px;border-bottom:1px solid #DBDBDB;display:flex;align-items:center;justify-content:space-between;transition:all .3s}.navbar .menu-icon{border:none;background-color:transparent;display:flex;align-items:center;justify-content:center;font-size:30px;color:var(--main-color);cursor:pointer;display:none}.navbar .search{border:var(--border);display:flex;align-items:center;gap:8px;padding:8px 15px;width:400px;border-radius:25px;font-size:22px;color:#616161}.navbar .search input{border:none;outline:none;font-size:17px}.navbar .control{display:flex;align-items:center;gap:20px;position:relative}.navbar .control .notificatins{font-size:20px;display:flex;align-items:center;justify-content:center}.navbar .control .user{border:var(--border);padding:10px 15px;width:250px;border-radius:15px;cursor:pointer;background-color:transparent;text-align:start;display:flex;align-items:center;justify-content:space-between}.navbar .control .user h4{font-size:18px;color:#535353}.navbar .control .user .user-img{width:35px;height:35px;border-radius:50%;border:2px solid var(--main-color);color:var(--main-color);display:flex;align-items:center;justify-content:center;font-size:18px}.navbar .control .menu-user{position:absolute;inset-inline-end:0;top:calc(100% + 25px);width:250px;border:var(--border);padding:15px;border-radius:15px;display:flex;flex-direction:column;gap:15px;background-color:#fff}.navbar .control .menu-user a{font-size:18px;text-align:center;color:var(--main-color)}.navbar .control .menu-user button{border:none;background-color:var(--main-color);color:#fff;font-size:16px;padding:7px;border-radius:10px;cursor:pointer}@media (max-width: 1000px){.navbar{transition:all .3s}.navbar .menu-icon{display:flex}.navbar .search{display:none}.navbar .control .user{width:fit-content}.navbar .control .user h4{display:none}}.home{min-height:calc(100vh - 75px);padding:25px;display:flex;align-items:center;justify-content:space-around;gap:30px}.home .content h1{display:flex;flex-direction:column;color:var(--main-color);margin-bottom:20px;line-height:1.7}.home .content p{font-size:20px;color:var(--text-color);line-height:1.9;margin-bottom:25px}.home .content button{display:block;border:none;background-color:var(--main-color);color:#fff;font-size:18px;padding:10px 25px;border-radius:15px;cursor:pointer}.home .image iframe{width:500px;height:400px;border:none}@media (max-width: 1150px){.home{flex-direction:column-reverse;gap:10px}.home .content h1{font-size:22px;margin-bottom:10px;line-height:1.7}.home .content p{font-size:17px;line-height:1.6}.home .image iframe{width:100%;height:100%}}.loading-page{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;z-index:9999;background-color:#fff}.loader{width:48px;height:48px;position:relative}.loader:before,.loader:after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:48em;height:48em;background-image:radial-gradient(circle 10px,var(--main-color) 100%,transparent 0),radial-gradient(circle 10px,var(--main-color) 100%,transparent 0),radial-gradient(circle 10px,var(--main-color) 100%,transparent 0),radial-gradient(circle 10px,var(--main-color) 100%,transparent 0),radial-gradient(circle 10px,var(--main-color) 100%,transparent 0),radial-gradient(circle 10px,var(--main-color) 100%,transparent 0),radial-gradient(circle 10px,var(--main-color) 100%,transparent 0),radial-gradient(circle 10px,var(--main-color) 100%,transparent 0);background-position:0em -18em,0em 18em,18em 0em,-18em 0em,13em -13em,-13em -13em,13em 13em,-13em 13em;background-repeat:no-repeat;font-size:.5px;border-radius:50%;animation:blast 1s ease-in infinite}.loader:after{font-size:1px;background:var(--main-color);animation:bounce 1s ease-in infinite}@keyframes bounce{0%,to{font-size:.75px}50%{font-size:1.5px}}@keyframes blast{0%,40%{font-size:.5px}70%{opacity:1;font-size:4px}to{font-size:6px;opacity:0}}.login{height:100vh;display:flex;align-items:stretch;overflow:hidden}.login .form{width:35%;padding:40px}.login .form header{display:flex;align-items:center;justify-content:space-between}.login .form header img{width:80px}.login .form .welcome{padding:30px 0 20px;text-align:center;font-size:25px;font-weight:600}.login .form form{display:flex;flex-direction:column;padding-bottom:20px}.login .form form .box{display:flex;flex-direction:column}.login .form form .box label:not(label:last-child){font-size:17px;margin-bottom:5px}.login .form form .box input:not(input[type=checkbox]){font-size:16px;padding:10px 13px;outline:none;border:1px solid #808080;color:#202020;margin-bottom:15px;border-radius:10px}.login .form form .password{position:relative}.login .form form .password button{display:flex;align-items:center;justify-content:center;position:absolute;inset-inline-end:18px;top:50%;font-size:20px;transform:translateY(-15%);border:none;background-color:transparent;cursor:pointer}.login .form form .login-helpers{display:flex;align-items:center;justify-content:space-between;margin:10px 0 15px}.login .form form .login-helpers .remember{display:flex;align-items:center;gap:5px}.login .form form .login-helpers .remember label,.login .form form .login-helpers .remember input{cursor:pointer}.login .form form .login-helpers .forgot a{color:var(--main-color)}.login .form form .submit{background-color:var(--main-color);color:#fff;border:none;font-size:17px;display:block;padding:13px;border-radius:10px;cursor:pointer}.login .form .other-way button{background-color:var(--dark-color);color:#fff;border:none;width:100%;display:flex;align-items:center;justify-content:center;gap:10px;padding:13px;font-size:17px;border-radius:10px}.login .form .other-way .sign-up{padding-block:20px;text-align:center;display:flex;align-items:center;justify-content:center;gap:8px;font-size:18px}.login .form .other-way .sign-up a{color:var(--main-color)}.login .image{width:65%}.login .image img{width:100%;height:100%;object-fit:cover;object-position:center}@media (max-width: 1100px){.login .form{width:45%}.login .image{width:55%}}@media (max-width: 800px){.login{align-items:center;justify-content:center}.login .form{width:100%}.login .form form .submit,.login .form .other-way button{font-size:15px}.login .image{display:none}}.register{height:100vh;overflow:hidden;display:flex;align-items:stretch}.register .image{width:40%}.register .image img{width:100%;height:100%;object-fit:cover;object-position:center}.register .form{width:60%;padding:40px}.register .form header{display:flex;align-items:center;justify-content:space-between}.register .form header img{width:80px}.register .form .welcome{padding-block:22px;display:flex;flex-direction:column;gap:2px}.register .form .welcome h3{font-size:30px}.register .form .welcome p{font-size:17px;color:#444}.register .form form{display:flex;flex-direction:column;gap:10px}.register .form form .box{display:flex;align-items:center;gap:15px}.register .form form .box div{display:flex;flex-direction:column;flex:1;gap:5px}.register .form form .box div label{font-size:18px}.register .form form .box div input{font-size:16px;padding:10px 13px;outline:none;border:1px solid #808080;color:#202020;margin-bottom:15px;border-radius:10px}.register .form form .password{position:relative}.register .form form .password button{display:flex;align-items:center;justify-content:center;position:absolute;inset-inline-end:18px;top:50%;font-size:20px;transform:translateY(-15%);border:none;background-color:transparent;cursor:pointer}.register .form form .login-helpers{display:flex;align-items:center;justify-content:space-between;margin:0 0 15px}.register .form form .login-helpers .remember{display:flex;align-items:center;gap:5px}.register .form form .login-helpers .remember label,.register .form form .login-helpers .remember input{cursor:pointer}.register .form form .login-helpers .forgot a{color:var(--main-color)}.register .form form .btns{display:flex;align-items:center;gap:15px}.register .form form .btns button{display:block;width:100%;display:flex;align-items:center;justify-content:center;gap:15px;border:none;color:#fff;padding:13px;font-size:17px;border-radius:10px;cursor:pointer}.register .form form .btns button:first-child{background-color:var(--main-color)}.register .form form .btns button:last-child{background-color:var(--dark-color)}.register .form .account{padding-block:25px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:18px}.register .form .account a{color:var(--main-color)}@media (max-width: 1100px){.register{height:auto!important}.register .form{width:60%}.register .form form .btns{flex-direction:column}.register .image{width:40%}}@media (max-width: 850px){.register .form{width:100%;padding:40px 20px 10px}.register .form .box{flex-direction:column}.register .form .box div{width:100%}.register .image{display:none}}.company .all-board{padding:25px}.company .all-board .head{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;font-size:22px}.company .all-board .head h2{color:var(--main-color)}.company .all-board .head p span{font-weight:600;color:var(--main-color)}.company .all-board .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(450px,1fr));gap:15px}.company .all-board .grid .item{display:flex;align-items:center;justify-content:space-between;box-shadow:#091e4240 0 4px 8px -2px,#091e4214 0 0 0 1px;padding:15px;border-radius:20px 0;gap:20px}.company .all-board .grid .item .content .title{font-size:20px;margin-bottom:7px;color:var(--main-color)}.company .all-board .grid .item .content .date{font-size:16px;color:#7c7c7c;font-weight:600;margin-bottom:20px}.company .all-board .grid .item .content .description{line-height:1.7;color:#2b2b2b;font-size:15px}.company .empty-image{min-height:calc(100vh - 75px);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:50px;height:100%}.company .empty-image img{width:60%}.company .empty-image button{font-size:20px;padding:7px 20px;border:1px solid var(--main-color);background-color:transparent;color:var(--main-color);border-radius:15px;cursor:pointer}@media (max-width: 600px){.company .all-board .head{flex-direction:column-reverse;gap:15px}.company .all-board .grid{grid-template-columns:repeat(1,1fr)}}.page-404{height:calc(100vh - 75px);display:flex;align-items:center;justify-content:center;font-size:50px}.board{min-height:calc(100vh - 75px);display:flex;align-items:center;justify-content:center;font-size:50px}