*,*:after,*:before{box-sizing:border-box;margin:0;padding:0}html,body{color:#fff;overflow-x:hidden;position:relative;min-height:100vh;z-index:-2;font-family:Arial,Helvetica,sans-serif;background:#000 url(/bg.png) no-repeat center center fixed;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover}body:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;background:#0006}a{text-decoration:none}.container{max-width:1100px;margin:auto;padding:0 20px}header{height:200px;margin:20px 0}header img{width:200px}.center{display:flex;align-items:center;justify-content:center}.search{height:100px}input[type=text]{display:block;padding:10px;font-size:20px;border:0;border-radius:5px;width:60%;margin:auto;outline:none}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-bottom:20px}.card{cursor:pointer;background-color:transparent;height:300px;perspective:1000px}.card h1{font-size:25px;border-bottom:1px #fff solid;padding-bottom:10px;margin-bottom:10px}.card img{width:100%;height:300px;object-fit:cover}.card-inner{position:relative;width:100%;height:100%;transition:transform .8s;transform-style:preserve-3d}.card:hover .card-inner{transform:rotateY(180deg)}.card-front,.card-back{position:absolute;width:100%;height:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden}.card-back{background-color:#333;color:#fff;padding:20px;transform:rotateY(180deg)}.card li{list-style:none;padding-bottom:10px}@media (max-width: 800px){.cards{grid-template-columns:repeat(2,1fr)}}@media (max-width: 500px){.cards{grid-template-columns:1fr}input[type=text]{width:90%}}