*{box-sizing:border-box;font-family:Open Sans,sans-serif}.top-bar{text-align:right;width:100%;height:80px;margin-top:0;position:relative}#title{height:100%;display:inline-block;position:absolute;top:0;left:20px}.nav{height:100%;display:inline-block}.nav a{justify-content:center;align-items:center;height:100%;margin:0 20px;font-size:120%;display:inline-flex}.grid{flex-wrap:wrap;justify-content:center;display:flex}.card{--shadow:transparent;width:300px;height:400px;box-shadow:0 0 10px 5px var(--shadow);border:1.25px solid #e9e9e9;border-radius:16px;margin:10px;font-size:100%;transition:all .5s;display:inline-block;position:relative;overflow:hidden}.card:hover{--shadow:#3535351a}.card:hover .main-content{pointer-events:initial;opacity:1}.card *{margin:0}.card img{object-fit:cover;width:100%;height:100%}.main-content{opacity:0;pointer-events:none;background-color:#ffffffe6;width:100%;height:100%;padding:25px;transition:all .5s;position:absolute;top:0;left:0}.owner{color:gray;font-size:110%}.pet-name{font-size:130%;font-weight:700}h5.pet-name{color:#fff;text-shadow:0 0 4px #000;padding:10px;position:absolute;bottom:0;left:0}.info ul{border-radius:7px;padding:0 10px 10px}li{margin:0;list-style-type:none}.info{color:#535353;position:relative;overflow:hidden}.info.likes{margin-top:25px}.label{font-weight:700}.btn-container{text-align:right;padding:10px;position:absolute;bottom:10px;right:10px}.btn{--accent:grey;cursor:pointer;border:1.5px solid var(--accent);color:var(--accent);letter-spacing:1px;background:0 0;border-radius:10px;outline:none;padding:10px 15px;font-size:90%;transition:all .5s}.btn:hover{background:var(--accent);color:#fff}.edit.btn{--accent:green}.delete.btn{--accent:red;margin-left:10px}.view.btn{--accent:blue;margin-left:10px}.pet-container{width:100%}.confirmation-box.show{display:block}