html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:flex;overflow:hidden;align-items:center;justify-content:center}@media only screen and (min-width: 720px){body{align-items:center}}.grid-container{height:100dvh;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));width:1000px;padding:0 120px;align-items:center}.grid-item{display:flex;flex-direction:column;align-items:center;justify-content:center;margin:20px;text-align:center;border-radius:10px;border:6px solid transparent;transition:.1s all;padding:0 10px 10px}.grid-item:hover{border:6px solid #d3d3d3;cursor:pointer;transform:scale(1.04)}.grid-item:hover>img{transition:1s all;transform:scale(1.04)}.grid-item .hobby ul{list-style-type:none;margin:0;padding:0}.grid-item .hobby ul li{border:2px solid #9e9e9e;border-radius:6px;display:inline-block;font-size:12px;margin:0 7px 7px 0;padding:7px;background:white}.btn{border:2px solid #060806;border-radius:6px;display:inline-block;font-size:12px;margin:0 7px 7px 0;padding:7px;background:#f6f6f6;box-shadow:0 5px #0000004a;cursor:pointer;transition:.3s ease}.btn:active{box-shadow:none;background:#a5a5a5}a,a:visited,a:hover,a:active{color:inherit;text-decoration:none}.react-demo{display:flex;flex-direction:column;align-content:center;align-items:center}.a1-box{background:#cca4ff;padding:20px;margin:4px;color:#fff;font-size:1.2em;display:inline-block;border-radius:15px;display:flex;width:50%}.a2-box{align-items:center;justify-content:space-between;background:#81c784;padding:20px;margin:4px;font-size:1.2em;display:inline-block;border-radius:15px;display:flex;width:50%}.a-box{background:#ffe0b2;padding:20px;margin:10px;font-size:1.2em;border-radius:15px;display:flex;width:96%}button{cursor:pointer}.card{font-size:1.2em;display:inline-block;border-radius:15px;display:flex;min-width:240px;align-items:center;flex-direction:row;padding:20px;margin:10px;background-color:#ffe4e1;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;line-height:1.6;color:#333;width:96%}.card input{border:navajowhite;text-transform:capitalize;margin:0 8px;border-radius:4px;font-size:1em}.card div{display:inline-block}.card div.false{width:15px;height:15px;border-radius:50%;background-color:red;margin:0 8px}.card div.true{width:15px;height:15px;border-radius:50%;background-color:green;margin:0 8px}.card ul{list-style-type:none;margin:0;padding:0}.card li{border-radius:6px;float:left;margin:5px;padding:8px;width:100px;background:white;box-shadow:-2px 1px 5px #0101015c}