nav{align-items:center;-webkit-backdrop-filter:blur(33px);backdrop-filter:blur(33px);background-color:var(--nav-back-color);border:0;box-sizing:border-box;display:table;display:flex;height:60px;justify-content:space-between;margin:0;padding:0 15px;position:sticky;top:0;transition:all .5s;width:100%;z-index:999}nav.stick{box-shadow:0 2px 13px #00000026;top:0}nav.menu-open{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;background-color:var(--background-color)!important;transition:background-color .3s ease}nav .nav-search{align-items:center;-moz-column-gap:13px;column-gap:13px;display:flex;float:left;height:54px;justify-content:flex-start;margin:0;padding:0;transition:.5s ease;width:calc(100% - 320px)}nav .nav-search :not(.show-menu){display:inline-block}nav .nav-search form{display:block}nav .nav-search .logo{float:left;height:54px;margin:auto 15px auto 0;padding:9px 0;width:auto;width:180px}nav .nav-account{align-items:center;display:flex;float:left;gap:9px;height:54px;justify-content:flex-end;margin:0;max-width:320px;padding:0 0 0 12px;transition:.5s ease}nav .nav-account .btn{margin:0;padding:8px 11px}nav .navlink{align-content:center;align-items:center;background-color:transparent;border:0;border-bottom:1px solid transparent;border-radius:50px;color:var(--btn-color-1);display:flex;font-size:24px;height:40px;justify-content:center;padding:0;text-decoration:none;width:40px}nav .navlink svg{height:43px;padding:3px;transition:all 0s;width:43px}nav .navlink img{border-radius:50%;height:40px;transition:all 0s;width:40px}nav .navlink.show{background-color:var(--btn-2-color);border-bottom-right-radius:7px;border-top-right-radius:7px;color:var(--color-0);cursor:pointer}nav .navlink:hover{background-color:#ebecee;cursor:pointer}.create-article{align-items:center;background-color:var(--primary-color);border:2px solid transparent;border-radius:7px;color:#fff;cursor:pointer;display:flex;font-size:16px;height:40px;justify-content:center;padding:2px;width:40px}.create-article svg{fill:#fff;margin:0;padding:0;stroke:#fff;width:-moz-min-content;width:min-content}.create-article svg path{stroke:#fff}.create-article p{padding-right:6px}.create-article:hover{background-color:#fff;border:2px solid var(--primary-color);text-decoration:none}.create-article:hover *{color:var(--primary-color);fill:var(--primary-color);stroke:var(--primary-color)}.search-container{background-color:var(--back-color-2);border-radius:40px;box-sizing:border-box;height:40px;max-width:100%;overflow:visible;padding:3px 40px 3px 3px;position:relative}.search-container:hover{border-color:#222}.search-container input[type=search]{background-color:transparent;border:0;border-bottom-left-radius:28px;border-top-left-radius:28px;color:#222;font-size:15px;font-weight:400;height:32px;margin:1px 3px;max-width:100%;outline:none;padding-left:9px;transition:width .7s ease;width:calc(100% - 40px);width:300px}.search-container input[type=search]::-moz-placeholder{color:#b9b9b9}.search-container input[type=search]::placeholder{color:#b9b9b9}.search-container input[type=search]:focus{outline:none}.search-container input[type=search]:focus-within{width:450px}.search-container input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAn0lEQVR42u3UMQrDMBBEUZ9WfQqDmm22EaTyjRMHAlM5K+Y7lb0wnUZPIKHlnutOa+25Z4D++MRBX98MD1V/trSppLKHqj9TTBWKcoUqffbUcbBBEhTjBOV4ja4l4OIAZThEOV6jHO8ARXD+gPPvKMABinGOrnu6gTNUawrcQKNCAQ7QeTxORzle3+sDfjJpPCqhJh7GixZq4rHcc9l5A9qZ+WeBhgEuAAAAAElFTkSuQmCC);background-repeat:no-repeat;background-size:20px;color:#5193d6;cursor:pointer;display:block;height:10px;padding:6px;top:0;width:10px}.search-container button{align-content:center;align-items:center;background-color:#0c42ad;border:0;border-radius:100%;color:#fff;cursor:pointer;display:flex!important;flex-direction:row;font-size:16px;height:40px;justify-content:center;margin:3px;outline:0;padding:0 7px;position:absolute;right:-3px;top:-3px;transition:background-color .555s;width:40px}.search-container button svg{fill:transparent;height:32px;padding:2px;width:32px}.search-container button svg path{stroke:#fff}.search-container button:hover{background-color:#00349c}.search-container .results{-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);background-color:var(--background-color);border-radius:11px;box-shadow:0 0 11px #0000001a;display:flex;flex-direction:column;margin-top:9px;min-width:180px;overflow:hidden;padding:11px;position:absolute;right:0;width:100%;z-index:1000}.search-container .results .item{border-radius:7px;color:var(--text-color);padding:10px 15px;text-decoration:none}.search-container .results .item:hover{background-color:var(--back-color-1)}.dropdown{display:inline-block;position:relative}.dropdown .dropdown-content{-webkit-backdrop-filter:blur(13px);backdrop-filter:blur(13px);background-color:var(--background-color);border:1px solid var(--border-color);border-radius:11px;box-shadow:0 0 11px #0000001c;display:flex;flex-direction:column;margin-top:5px;min-width:200px;overflow:hidden;position:absolute;right:0;z-index:1000}.dropdown .dropdown-content .notif{flex-direction:column;gap:12px;min-width:300px;padding:15px}.dropdown .dropdown-content .notif.more{border-radius:0;border-top:1px solid var(--border-color);font-size:12px;letter-spacing:1.1px;margin:0;text-align:center;text-transform:uppercase}.dropdown .dropdown-content .notif:not(:last-child){border-bottom:.005px dashed var(--border-color)}.dropdown .dropdown-content .notif img{border-radius:11px;max-width:250px}.dropdown .dropdown-content .notif .detail{display:flex;flex-direction:column;font-size:14px;gap:7px}.dropdown .dropdown-content .notif:hover{background-color:var(--back-color-1);cursor:pointer}.dropdown .dropdown-content a{color:var(--text-color);display:flex;gap:3px;padding:10px 15px;text-decoration:none}.dropdown .dropdown-content a:hover{background-color:var(--back-color-1)}@media(max-width:768px){.create-article{height:36px;width:36px}nav{padding:0 9px}nav .nav-account{gap:7px}nav .nav-search{-moz-column-gap:7px;column-gap:7px}nav .nav-search .logo{width:170px}nav .navlink{height:36px;width:36px}.search-container{display:none!important}}