@import "https://fonts.googleapis.com/css?family=Nunito+Sans:200,300,regular,500,600,700,800,900,200italic,300italic,italic,500italic,600italic,700italic,800italic,900italic";@import "https://fonts.googleapis.com/css?family=Montserrat:100,200,300,regular,500,600,700,800,900,100italic,200italic,300italic,italic,500italic,600italic,700italic,800italic,900italic";*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{-webkit-font-smoothing:antialiased;height:100%;line-height:1.5;font-family:var(--fontPrimary);color:var(--Color_Text)}body{text-rendering:optimizelegibility}img,picture,video,canvas,svg{max-width:100%;display:block}input,button,textarea,select{font:inherit;background:0 0;border:none;outline:none}button{cursor:pointer}a{color:inherit;text-decoration:none}ul,ol{list-style:none}table{border-collapse:collapse;border-spacing:0}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}.container{background-color:var(--Color_Background);flex-direction:column;justify-content:center;align-items:center;width:100%;min-height:calc(100vh - 80px);padding:40px 80px;display:flex}@media screen and (width<=840px){.container{padding:20px 30px}}.txtBold{font-weight:800}:root{--Color_Text:#000;--Color_Background:#f5f5f5;--Boxes_Elements:#fff;--fontPrimary:"Nunito Sans", sans-serif, "Montserrat", sans-serif;--Box_Shadow:gray}[data-theme=dark]{--Color_Text:#fff;--Boxes_Elements:#2b3945;--Color_Background:#202c37}.header{width:100%;height:80px;box-shadow:17px 6px 19px -13px var(--Box_Shadow);background-color:var(--Boxes_Elements);z-index:99;position:sticky;top:0}.header__container{justify-content:space-between;align-items:center;width:100%;height:100%;padding:15px 60px;display:flex}@media screen and (width<=840px){.header__container{padding:15px 25px}}.header__title{color:var(--Color_Text);font-size:20px;font-weight:800}@media screen and (width<=840px){.header__title{font-size:16px}}.header__theme-setter{color:var(--Color_Text);cursor:pointer;background:0 0;border:none;align-items:center;gap:10px;display:flex}@media screen and (width<=840px){.header__theme-setter{font-size:16px}}.header__theme-setter>svg{transition:transform .3s}.header__theme-setter>svg:hover{transform:rotate(15deg)}.controls{justify-content:space-between;align-items:center;width:100%;display:flex}@media screen and (width<=840px){.controls{flex-direction:column;align-items:start;gap:50px}}.search{box-shadow:17px 6px 19px -13px var(--Box_Shadow);background-color:var(--Boxes_Elements);border-radius:6px;align-items:center;gap:10px;width:400px;max-width:480px;height:100%;padding:10px 25px;display:flex}@media screen and (width<=840px){.search{width:100%}}.search__input{color:var(--Color_Text);letter-spacing:2px;font-size:14px;font-weight:600}.filter{box-shadow:17px 6px 19px -13px var(--Box_Shadow);background-color:var(--Boxes_Elements);border-radius:6px;width:200px;height:100%;position:relative}.filter__button{background-color:var(--Boxes_Elements);width:100%;box-shadow:17px 6px 19px -13px var(--Box_Shadow);color:var(--Color_Text);cursor:pointer;border:none;border-radius:6px;justify-content:space-between;align-items:center;padding:14px 20px;display:flex}.filter__menu{background:var(--Boxes_Elements);border-radius:6px;width:100%;list-style:none;position:absolute;top:60px;left:0;box-shadow:0 4px 1px 2px #0000001f}.filter__menu>li{cursor:pointer;background:var(--White);padding:4px 16px}.filter__menu>li:hover{color:var(--Box_Shadow);font-weight:600;transition:all .2s ease-in-out;scale:1.1}.icon{transition:transform .3s ease-in-out}.icon.open{transform:rotate(180deg)}.countriesGrid{grid-template-columns:1fr;justify-items:center;gap:40px;width:100%;padding:40px 0;display:grid}@media screen and (width>=580px){.countriesGrid{grid-template-columns:repeat(2,1fr)}}@media screen and (width>=1050px){.countriesGrid{grid-template-columns:repeat(3,1fr)}}@media screen and (width>=1600px){.countriesGrid{grid-template-columns:repeat(5,1fr)}}@media screen and (width>=2200px){.countriesGrid{grid-template-columns:repeat(6,1fr)}}.countryCard{width:260px;height:360px;box-shadow:17px 6px 19px -13px var(--Box_Shadow);cursor:pointer;border-radius:5px;transition:transform .3s ease-in-out}.countryCard:hover{transform:scale(1.03)}.countryCard__flag{aspect-ratio:16/9;border-radius:5px 5px 0 0;width:100%;transition:transform .3s ease-in-out;overflow:hidden}.countryCard__flag>img{object-fit:cover;width:100%;height:100%}.countryCard__content{background-color:var(--Boxes_Elements);border-radius:0 0 5px 5px;width:100%;height:215px;padding:25px}.countryCard__content__title{font-size:18px;font-weight:800}.countryCard__content__details{padding-top:20px;font-size:14px}.back-button{box-shadow:3px 4px 12px var(--Box_Shadow);width:135px;height:40px;color:var(--Color_Text);border-radius:5px;justify-content:center;align-items:center;gap:6px;display:flex;position:absolute;top:11rem;left:10rem}@media screen and (width<=999px){.back-button{top:8rem;left:2rem}}.detailsCard{grid-template-columns:repeat(2,1fr);place-items:center;width:100%;margin-top:120px;display:grid}@media screen and (width<=999px){.detailsCard{grid-template-columns:1fr}}.detailsCard__flag{max-width:80%}@media screen and (width<=999px){.detailsCard__flag{max-width:100%}}.detailsCard__flag>img{border-radius:5px;width:100%}.detailsCard__description{width:100%}.detailsCard__nameCountry{color:var(--Color_Text);font-size:27px;font-weight:800}@media screen and (width<=999px){.detailsCard__nameCountry{margin-top:30px}}.detailsCard__contentMore{grid-template-columns:repeat(2,1fr);max-width:600px;margin:30px 0 50px;line-height:35px;display:grid}@media screen and (width<=999px){.detailsCard__contentMore{grid-template-columns:1fr}}.detailsCard__borderCountries{align-items:center;gap:12px;display:flex}.detailsCard__borderCountries--container{flex-wrap:wrap;justify-content:center;align-items:center;gap:16px;display:flex}@media screen and (width<=840px){.detailsCard__borderCountries{flex-direction:column;align-items:start}}.detailsCard__borderCountries--title{margin-right:15px}.detailsCard__borderCountries--1,.detailsCard__borderCountries--2,.detailsCard__borderCountries--3{box-shadow:3px 4px 12px var(--Box_Shadow);width:100px;height:40px;color:var(--Color_Text);border-radius:5px;justify-content:center;align-items:center;font-size:16px;display:flex}
