html{box-sizing:border-box;height:100%;scroll-behavior:smooth}*,*:before,*:after{box-sizing:inherit;margin:0}:where(ul,ol):where([class]){padding-left:0}body,:where(blockquote,figure):where([class]){margin:0}body{min-height:100%;line-height:1.5}ul,ol,li{list-style:none;margin:0;padding:0}img{display:block;max-width:100%}input,textarea,select,button{font:inherit;color:inherit}button{cursor:pointer;border:none}:root{font-family:Be Vietnam Pro;line-height:1.5;font-weight:400;color:#ffffffde;background-color:#1b1d1f}#root{max-width:auto;margin:0 auto;padding:2rem}body{background:top / contain no-repeat url(/world-ranks/hero-image-wr.jpg)}@media (max-width: 780px){#root{padding:.5rem}body{background:top / 100% 200px no-repeat url(/world-ranks/hero-image-wr.jpg)}}@media (max-width: 400px){body{background:top / 300% 200px no-repeat url(/world-ranks/hero-image-wr.jpg)}}.logo-container{display:flex;justify-content:center}.logo{width:100%;height:30px;margin-top:8%;margin-bottom:8%}.country-ranks{display:flex;gap:5px;font-size:1rem;padding:30px 40px;background-color:#1b1d1f;border:1px #282B30 solid;border-radius:12px}@media (max-width: 780px){.country-ranks{flex-direction:column;padding:20px 12px}}@media (max-width: 400px){.country-ranks{margin-top:20px}}.filter-bar{display:flex;flex-direction:column;gap:25px;width:25%}.found-countries{padding-top:8px;padding-bottom:26px;color:#6c727f}.filter-info{margin-bottom:8px;color:#6c727f}.filter-cont{display:flex;flex-direction:column;color:#d2d5da}.dropdown-btn{position:relative;cursor:pointer;width:90%;padding:6px 16px;text-align:start;border:2px #282B30 solid;background-color:transparent;border-top-left-radius:12px;border-top-right-radius:12px}.dropdown-btn--border{border-bottom-left-radius:12px;border-bottom-right-radius:12px}.dropdown-btn:before{content:"";position:absolute;right:10px;top:60%;transform:translateY(-50%);width:24px;height:24px;background:no-repeat url(/world-ranks/Expand_down.svg)}.dropdown-list--visible{display:flex!important}.dropdown-list{display:none;flex-direction:column;gap:5px;width:90%;padding:6px 16px;border:2px #282B30 solid;background-color:transparent;border-top:none;border-bottom-left-radius:12px;border-bottom-right-radius:12px;transition:1s}.drowdow-item{cursor:pointer}.filter-list{display:flex;flex-wrap:wrap;gap:15px;width:90%}.filter-item{cursor:pointer;padding:6px 12px;background-color:transparent;border-radius:12px}.filter-item--active{background-color:#282b30}.checkbox-label{position:relative;cursor:pointer;margin-bottom:10px}.real-checkbox{width:0;height:0;opacity:0;position:absolute;z-index:0}.custom-checkbox{position:relative;display:inline-block;width:24px;height:24px;background-color:transparent;border:2px #6C727F solid;border-radius:4px;vertical-align:sub;margin-right:10px}.custom-checkbox:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%) scale(0);width:24px;height:24px;background:center / 24px no-repeat url(/world-ranks/Done_round.svg);border-radius:4px;transition:.1s}.real-checkbox:checked+.custom-checkbox:before{transform:translateY(-50%) scale(1)}.real-checkbox:checked+.custom-checkbox{background-color:#4e80ee;border:none}@media (max-width: 780px){.filter-bar{width:100%}.found-countries{padding:8px 0}}.countries-list{display:flex;flex-direction:column;align-items:end;width:75%}.search-input{position:relative;right:0;width:350px;height:40px;color:#d2d5da;background:6px / 26px no-repeat #282b30 url(/world-ranks/Search.svg);border:none;border-radius:12px;margin-bottom:15px;padding:24px 12px 24px 40px}.search-input::placeholder{color:#6c727f}.search-input:focus{outline:1px #6C727F solid}.table{width:100%;color:#d2d5da;border-spacing:0 20px;border-collapse:separate}.table-title tr th{text-align:start;color:#6c727f;border-bottom:3px #282B30 solid;padding-bottom:15px}.table-img img{cursor:pointer;width:60px;height:45px;object-fit:cover;border-radius:6px}.table-country{cursor:pointer}@media (max-width: 780px){.countries-list{width:100%}.search-input{width:100%;margin:12px 0}}@media (max-width: 400px){.table-img img{width:50px;height:35px}.table-population,.table-country{font-size:.9rem}}.pagination-cont{width:100%}.pagination{display:flex;flex-wrap:wrap;gap:10px;width:100%}.page-item{margin-bottom:8px}.page-item button{color:#d2d5da;background-color:#282b30;width:32px;padding:5px 0;border-radius:4px;text-decoration:none}.page-item button:hover{color:#6c727f}.active{border:1px #4E80EE solid;border-radius:4px}@media (max-width: 780px){.pagination{justify-content:center}}@media (max-width: 400px){.page-item button{font-size:.9rem;padding:5px 0}}.logo{cursor:pointer}.country-page{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:1rem;max-width:880px;margin:0 auto;padding:30px 0;color:#d2d5da;background-color:#1b1d1f;border:1px #282B30 solid;border-radius:12px}.country-flag{position:absolute;top:-50px;left:50%;transform:translate(-50%);width:300px;height:200px;border-radius:16px}.country-name{margin-top:150px}.country-fullname{font-size:16px;font-weight:400}.details{display:flex;gap:50px;margin:25px 0}.details-info{display:flex;align-items:center;gap:20px;background-color:#282b30;padding:12px 20px;border-radius:12px}.country-details{display:flex;flex-direction:column;width:100%}.country-info{display:flex;justify-content:space-between;border-top:1px #282B30 solid;border-bottom:1px #282B30 solid;padding:24px 20px}.area-title sup{font-size:.5em}.neighbouring-countries{display:flex;flex-direction:column}.neighbouring-title{margin-bottom:25px}.neighbour-list{display:flex;align-items:center;gap:20px;flex-wrap:wrap;padding:0}.neighbour-img{cursor:pointer;width:100px;height:70px;object-fit:cover;border-radius:6px;margin-bottom:5px}.neighbour-name{text-align:center}@media (max-width: 550px){.country-page{margin-top:30px;padding:0}.country-name{margin-top:120px}.country-flag{width:250px;height:130px;top:-25px}.details{flex-direction:column;gap:10px}.details-info{justify-content:space-between}}@media (max-width: 400px){.country-info{flex-direction:column;align-items:center;gap:10px;font-size:.9rem}.info-title{font-size:1.25rem}.info-value span{font-size:.8rem}.neighbour-img{width:60px;height:40px}}
