*{box-sizing:border-box;margin:0;padding:0;list-style:none;text-decoration:none;font-family:'Roboto Mono', monospace}.header{height:200px;width:100%;background-image:url(../images/pexels-leah-kelley-3935702.jpg);background-position:center top -50px;background-repeat:no-repeat;background-size:600px}@media all and (min-width: 768px){.header{height:350px;background-position:center top -120px;background-size:1200px}}.main{width:100%;display:flex;flex-direction:column;text-align:center;justify-content:center;gap:20px}.search{background-color:#f5f5f5;height:80px;width:80%;margin-left:auto;margin-right:auto;transform:translateY(-40px);box-shadow:1px 1px 4px 0px #afa9a9;display:flex;justify-content:center;align-items:center;gap:20px}@media all and (min-width: 768px){.search{width:60%}}.search-btn{all:unset;cursor:pointer;text-transform:capitalize;color:whitesmoke;background-color:#008378;font-size:14px;padding:2px;height:30px;width:60px;border-radius:5px}@media all and (min-width: 768px){.search-btn{height:30px;width:80px;font-size:16px}}.search-input{padding-left:10px;border:1px solid #008378;width:60%;height:26px}.cards-lists-container{margin-top:10px;display:flex;flex-direction:column;justify-content:center;gap:12px;padding:12px}@media all and (min-width: 768px){.cards-lists-container{flex-direction:row-reverse;padding:40px;gap:20px}}.cards-section{display:flex;flex-direction:column;justify-content:flex-start;align-items:center;text-align:center;gap:20px}.cards-section-title{font-size:18px;color:#008378;text-transform:uppercase;margin-bottom:30px}.cards-section-list{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:20px}.heart{color:#ab7a5c}@media all and (min-width: 768px){.reg-cards{margin-right:30px}}@media all and (min-width: 768px){.fav-cards{margin-left:60px}}.card{padding:10px;cursor:pointer;background-color:#f5f5f5;width:220px;height:140px;box-shadow:1px 1px 4px 0px #afa9a9;display:flex;flex-direction:column;justify-content:flex-start;align-items:center}@media all and (min-width: 768px){.card{width:300px;height:210px}}.card-img{max-height:80px;-o-object-fit:contain;object-fit:contain}@media all and (min-width: 768px){.card-img{max-height:100px}}.card-name{font-size:13px;font-weight:bold;padding:5px 0 3px 0}@media all and (min-width: 768px){.card-name{font-size:15px}}.card-continent{font-size:12px}@media all and (min-width: 768px){.card-continent{font-size:14px}}.favcard{padding:10px;cursor:pointer;background-color:#f5f5f5;width:220px;height:180px;box-shadow:1px 1px 4px 0px #afa9a9;display:flex;flex-direction:column;justify-content:flex-start;align-items:center}@media all and (min-width: 768px){.favcard{width:280px;height:240px}}.favcard-img{width:160px;height:120px;-o-object-fit:cover;object-fit:cover}@media all and (min-width: 768px){.favcard-img{width:210px;height:150px}}.favcard-name{font-size:13px;font-weight:bold;padding:5px 0 3px 0}@media all and (min-width: 768px){.favcard-name{font-size:15px}}.favcard-text{font-size:11px}@media all and (min-width: 768px){.favcard-text{font-size:14px}}.selected{background-color:#64a1a4;color:#f5f5f5}.fa-square-xmark{color:#f5f5f5;font-size:22px;transform:translate(96px, -3px)}@media all and (min-width: 768px){.fa-square-xmark{font-size:26px;transform:translate(113px, -2px)}}.reset-button{all:unset;cursor:pointer;text-transform:capitalize;color:#f5f5f5;background-color:#ab7a5c;padding:2px;height:30px;width:60px;border-radius:5px;margin-bottom:20px}@media all and (min-width: 768px){.reset-button{height:30px;width:80px}}.hidden{display:none}.footer{background-color:#f5f5f5;opacity:0.7;width:100%;height:50px;display:flex;justify-content:space-around;align-items:center;padding:10px}@media all and (min-width: 768px){.footer{height:30px;padding:5px;position:fixed;bottom:0}}.footer-text{color:black;font-size:12px}@media all and (min-width: 768px){.footer-text{font-size:14px}}.footer-text-span{font-size:12px;text-transform:capitalize}@media all and (min-width: 768px){.footer-text-span{font-size:14px}}