@import"https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap";*{margin:0;padding:0;box-sizing:border-box;font-family:Roboto,Arial,sans-serif}html{font-size:62.5%}body{padding:6rem 2rem;background-image:linear-gradient(to right,#0074a2,#007ca6,#0083aa,#008bad,#0092b0);min-height:100vh}header{display:flex;flex-direction:column;align-items:center;gap:.2rem}header h1{text-align:center;font-size:4.7rem;color:#fff}header p{font-size:2.4rem;color:#ffbb61;font-weight:500}form{position:relative;width:100%;max-width:50rem;margin:5rem auto 0;padding:1rem 1.5rem;display:flex;align-items:center;gap:1rem;background-color:#fff;border-radius:.3rem}form:before{content:"";position:absolute;left:0;bottom:-5px;width:100%;height:.3rem;background:#FFBB61;border-radius:.2rem;transform:scaleX(0);transition:transform .25s}form:focus-within:before{transform:scale(1)}form button{background-color:transparent;border:none;cursor:pointer}form button i{font-size:1.8rem;opacity:30%}form:focus-within button i{color:#ffbb61;opacity:100%}form input{border:none;outline:none;background-color:transparent;font-size:1.6rem;flex-grow:1}form input::placeholder{font-size:1.6rem;opacity:70%}.nav-search{margin-top:1.5rem;display:flex;flex-wrap:wrap;justify-content:center;gap:1.5rem;list-style:none;font-size:1.6rem;color:#fff}.nav-search__item input{display:none}.nav-search__item label{transition-duration:.3s;cursor:pointer}.nav-search__item--active{color:#ffbb61}.result-container{max-width:144rem;margin:6rem auto 0;display:flex;flex-direction:column;align-items:center;justify-content:center}.result-container__title{width:100%;padding:.5rem;text-align:center;font-size:2rem;color:#ffbb61}.result-container__card-grid{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;gap:3rem}.card{height:25rem;width:100%;max-width:28rem;border-radius:1rem;display:flex;flex-direction:column;overflow:hidden}.card img{width:100%;height:85%;object-fit:cover}.card__btn-container{height:15%;display:flex;align-items:center;justify-content:space-evenly;background-color:#fff}.card__btn-container a{width:50%;display:flex;justify-content:center;align-items:center;gap:.5rem;font-size:1.6rem;font-weight:600;color:#0074a2;text-decoration:none}.card__btn-container button{width:50%;display:flex;justify-content:center;align-items:center;gap:.5rem;font-size:1.6rem;font-weight:600;background-color:#fff;text-decoration:none;border:none;cursor:pointer}.card__copy-link--no-copy{color:#0074a2}.card__copy-link--copy{color:#c75e93}.paginator-container{margin-top:5rem;display:flex;justify-content:center;flex-wrap:wrap;gap:1rem}.paginator-container__button{width:3rem;height:3rem;border-radius:.5rem;border:none;font-size:1.6rem;font-weight:600;color:#0074a2;box-shadow:#00000040 0 .0625em .0625em,#00000040 0 .125em .5em,#ffffff1a 0 0 0 1px inset;transition-duration:.3s;cursor:pointer}.paginator-container__button:hover{background-color:#ffbb61}.paginator-container__button--active{background-color:#ffbb61;box-shadow:none}.sk-chase{width:40px;height:40px;position:relative;animation:sk-chase 2.5s infinite linear both}.sk-chase-dot{width:100%;height:100%;position:absolute;left:0;top:0;animation:sk-chase-dot 2s infinite ease-in-out both}.sk-chase-dot:before{content:"";display:block;width:25%;height:25%;background-color:#fff;border-radius:100%;animation:sk-chase-dot-before 2s infinite ease-in-out both}.sk-chase-dot:nth-child(1){animation-delay:-1.1s}.sk-chase-dot:nth-child(2){animation-delay:-1s}.sk-chase-dot:nth-child(3){animation-delay:-.9s}.sk-chase-dot:nth-child(4){animation-delay:-.8s}.sk-chase-dot:nth-child(5){animation-delay:-.7s}.sk-chase-dot:nth-child(6){animation-delay:-.6s}.sk-chase-dot:nth-child(1):before{animation-delay:-1.1s}.sk-chase-dot:nth-child(2):before{animation-delay:-1s}.sk-chase-dot:nth-child(3):before{animation-delay:-.9s}.sk-chase-dot:nth-child(4):before{animation-delay:-.8s}.sk-chase-dot:nth-child(5):before{animation-delay:-.7s}.sk-chase-dot:nth-child(6):before{animation-delay:-.6s}@keyframes sk-chase{to{transform:rotate(360deg)}}@keyframes sk-chase-dot{80%,to{transform:rotate(360deg)}}@keyframes sk-chase-dot-before{50%{transform:scale(.4)}to,0%{transform:scale(1)}}
