body{ } .interview-pre { text-align:center; margin:0; padding:80px 3px 0 3px; height:100%; overflow:hidden; position:relative; background-color:#F6F6F6; } .interview-pre .head1 { font-size: 24px; font-family: 'Noto Serif', serif; font-weight:400; } .interview-pre .head2 { font-family:'Noto Serif'; font-size:20px; font-weight:500; color: #222; line-height: 1.35; letter-spacing: -.05em; text-transform: unset; margin: 0; } .interview-pre .head3 { font-size: 1.2rem; font-family: 'Roboto', serif; font-weight: 400; line-height: 1.35; margin- margin: 0; color:#aaa; } .interview-pre .antworten { margin:60px auto; display: flex; flex-wrap: wrap; justify-content: center; } .interview-pre .antwort { margin: 12px 15px; width: 165px; max-width: 165px; height: 100%; text-align: center; flex-direction: column; transition: all .1s; padding: 0; overflow: hidden; box-shadow: 5px 5px 20px rgba(0,0,0,.16); border: 4px solid #fff; border-radius: 4px; background: #fff; text-decoration:none; color:#333; } .interview-pre .antwort:hover { background: #f6f6f6; color:#6a4d00; border-color:#FEB901; box-shadow: 3px 3px 7px 3px rgba(0,0,0,.3); } .interview-pre .icon { margin: 30px 0; } .interview-pre .label { font-family: 'Roboto', sans-serif; font-size: 1rem; font-weight: 400; padding:0.4rem 0 0.8rem 0; } .interview-pre .vorteile { margin-top:70px; font-family: Roboto; font-size: 0.9rem; line-height:1.35; color:#858586; } /** Mehr Platz mobil **/ @media only screen and (max-width: 400px) { .interview-pre { text-align:center; margin:0; padding:30px 3px 0 3px; } .interview-pre .antworten { margin:20px auto; } .interview-pre .vorteile { margin-top:30px; } }