.project_container{padding:5em 10em;width:100%;height:100em}.project_container .project{display:grid;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:5%;margin-top:5em}.project_container .loading{width:10%;display:block;margin:5% auto auto}.card{padding:1rem;min-width:400px;height:300px;cursor:pointer}.card .wrapper{background-color:#fff;min-height:300px;min-width:400px;position:relative;overflow:hidden;box-shadow:0 19px 38px rgba(0,0,0,.3),0 15px 12px rgba(0,0,0,.2)}.card .wrapper:hover .data{transform:translateY(0)}.card .data{position:absolute;bottom:0;width:100%;transform:translateY(calc(80px + 1em));transition:transform .3s}.card .data .content{padding:1.5em;position:relative;z-index:1}.data .content .demolink{float:right;margin-bottom:10%}.card .links a{color:#fff;margin-left:3%}.card .title{margin-top:0;font-size:1.5em;margin-bottom:1.5em}.card .text{height:70px;margin:0}.card input[type=checkbox]{display:none}.card input[type=checkbox]:checked+.menu-content{transform:translateY(-60px)}.example-3 .date span{display:block;text-align:center}.example-3 .date .day{font-weight:700;font-size:3rem;text-shadow:2px 3px 2px rgba(0,0,0,.18)}.example-3 .date .month{text-transform:uppercase}.example-3 .date .month,.example-3 .date .year{font-size:10px}.example-3 .content{backdrop-filter:blur(5px);color:#000;box-shadow:0 5px 30px 10px rgba(0,0,0,.3)}.example-3 .title a{color:#fff}.example-3 .menu-content{position:absolute;top:0;left:0;width:0}.example-3 .menu-content li{text-align:center;width:3rem;backdrop-filter:blur(30px);height:3rem;position:relative}.example-3 .menu-content a{font-size:24px}.project_container .section-title{font-size:2em;text-align:center}.project_container .section-subtitle{font-size:1.5em;text-align:center}@media (max-width:768px){.project_container{padding:5em 0 0;height:180em}.project_container .section-title{font-size:1.9em;text-align:center}.project_container .section-subtitle{font-size:1em;text-align:center}.project_container .project{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:5%;margin-left:8%}.project_container .card{width:50%;margin-left:-1.5em}.card .wrapper{min-height:300px;min-width:350px}}