.small-bold-text{font-weight:510}.small-text{font-weight:400}.mode{background-color:#fff;color:#111517}.dark-mode{background-color:#202c37;color:#fff}.dark-mode .mode{background-color:#2b3945;color:#fff}.dark-mode .text-mode{color:#fff}.dark-mode form input:focus{outline:1px solid hsl(0,0%,100%)}.dark-mode .svg-stroke{stroke:#fff}@media screen and (min-width: 768px){body{font-size:16px}body header.mode{padding:5px 80px}body header.mode h3{font-size:25px}body main{padding:40px 80px}body form{display:flex;align-items:center;justify-content:space-between}body form input{width:300px}body #countries-container{margin-top:40px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:60px}body #countries-container .individual-country{margin:0}}@media screen and (min-width: 1000px){body #countries-container{grid-template-columns:1fr 1fr 1fr}body form input{width:400px}}@media screen and (min-width: 1348px){body #countries-container{grid-template-columns:1fr 1fr 1fr 1fr}body form input{width:450px}}.back-button{border:none;box-shadow:0 0 8px #0003;border-radius:5px;padding:8px 16px;margin:40px;cursor:pointer;font-size:14px}.back-button img{margin-right:6px;vertical-align:middle;width:25px}#country-details{margin:0;padding:40px;width:100%;height:auto;display:flex;flex-direction:column;gap:10px}#section-1{width:100%;height:auto}#section-1 img{width:100%}#section-4 h2{margin:0}#section-4 span{font-size:14px;display:inline-block;padding:6px 8px;margin:0 6px 6px 0}@media screen and (min-width: 1024px){.back-button{margin:80px}#country-details{height:300px;padding:0 80px 80px;display:grid;gap:60px;grid-template-areas:"one one two three" "one one four four"}#country-details h3{font-size:24px}#country-details #section-1{grid-area:one;width:550px;height:100%;display:flex;align-items:center}#country-details #section-1 img{width:100%;height:100%;display:block}#section-2{grid-area:two;align-self:center}#section-3{grid-area:three;align-self:center}#section-4{display:flex;flex-wrap:wrap;gap:8px;align-items:center;grid-area:four;align-self:start}#section-4 h4{display:inline-block;font-size:18px}#section-4 span{margin:3px}}body{margin:0;padding:0;width:100%;height:100vh;font-family:Nunito Sans;background:#fafafa;color:#111517}*{box-sizing:border-box}header{margin:0;padding:5px 20px;width:100%;height:auto;display:flex;box-shadow:0 0 8px #0003;justify-content:space-between}header button{border:none;font-size:15px;color:#111517;background:transparent;cursor:pointer;margin:0;padding:0;width:auto;height:auto}header button img{vertical-align:middle;width:18px;margin-right:3px}#top-btn{position:fixed;bottom:10px;right:6px;padding:3px 6px;border:none;cursor:pointer;border-radius:10px;font-size:15px;text-decoration:none}main{margin:0;padding:20px;width:100%;height:auto}form input{margin:0;padding:20px 20px 20px 60px;width:100%;height:auto;background:url(./assets/search.svg) 20px 18px no-repeat;outline:none;border:none;box-shadow:0 0 8px #0003;border-radius:5px;cursor:pointer;text-transform:capitalize}form input:focus{outline:1.5px solid hsl(0,0%,52%)}.regions-search-holder{margin:40px 0;padding:0;width:200px;height:auto;position:relative}.regions-search-holder .regions-search{display:flex;justify-content:space-between;border-radius:5px;margin:0;padding:18px;width:100%;height:auto;box-shadow:0 0 8px #0003;cursor:pointer}.regions-search-holder .regions-list{display:none;position:absolute;top:105%;margin:0;height:auto;border-radius:5px;padding:20px;width:100%;box-shadow:0 0 8px #0003;z-index:5}.regions-search-holder .regions-list li{list-style:none;margin:0;padding:5px 0;width:100%;height:auto;cursor:pointer}.regions-search-holder .regions-list li:hover{opacity:.7;font-size:13.5px}.regions-search-holder:hover .regions-list{display:block}#countries-container{margin:0;padding:30px;width:100%;height:auto}#countries-container .individual-country{cursor:pointer;margin:0 0 40px;padding:0 0 20px;width:100%;height:auto;box-shadow:0 0 8px #0003;border-radius:5px}#countries-container .individual-country img{width:100%;height:50%;border-radius:5px 5px 0 0}#countries-container .individual-country .country-info{margin:0;padding:0 20px;width:100%;height:auto;height:50%}
