html,body{margin:0;padding:0;width:100%;height:100%;background-size:cover;}.header{width:100%;height:36px;background-color:rgba(0,0,0,.5);backdrop-filter:blur(24px);}.header .item{line-height:32px;font-size:18px;margin:0 16px;}a{color:#fff;cursor:pointer;user-select:none;text-decoration:none;position:relative;}a::after{position:absolute;content:"";width:0;height:2px;background-color:#fff;bottom:-2px;left:0;transition:all .2s ease-in-out;}a:hover::after{width:100%;}.articles{width:80%;margin:5% auto;}.articles .item{width:100%;margin-bottom:20px;background-color:rgba(0,0,0,.5);backdrop-filter:blur(24px);border-radius:8px;padding:16px;box-sizing:border-box;transition:all .2s ease-in-out;display:flex;flex-direction:row;}.articles .item .image img{object-fit:cover;border-radius:8px;height:10vh;width:17vh;}.articles .item .content{margin-left:24px;flex:1;color:#fff;}.articles .item .content .title{font-size:18px;font-weight:bold;margin-bottom:8px;margin-top:0;}.articles .item .content .description{font-size:14px;margin-bottom:8px;margin-top:0;color:#ccc;}.articles .item .content .info{font-size:12px;color:#aaa;}.articles .item:hover{transform:translateY(-5px);}