#Certificates { padding:1rem 0 3rem 0; width:100%; background-color:var(--color4); font-family:var(--font-title);  }
#Certificates .content{ flex-wrap:wrap; margin:0 auto; justify-content:center; }
#Certificates .content .item{ width:170px; height:220px; background-image:url(/Images/certificate2.svg); background-position:center center; background-size:contain; background-repeat:no-repeat;
                              margin:30px; position:relative;
}
#Certificates .content .item a { display:block; width:calc(100% - 20px); height:calc(100% - 20px); left:0; top:0; padding:10px; 
                                 text-decoration:none; font-weight:300; text-decoration:none; text-transform:uppercase; }
#Certificates .content .item a .tit { width:100%; display:block; text-align:center; color:var(--color2); margin-top:1rem; font-size:1.2rem; font-weight:600;  }
#Certificates .content .item a .subtit { width:100%; display:block; text-align:center; color:white; margin-top:1rem; font-weight:500; font-size:1.3rem;  }


#about-me .boxes{ display:flex; flex-wrap:wrap; justify-content:center; margin:2rem 0; }
#about-me .boxes .item{ width:250px; padding:30px; margin:30px 15px 0 15px; background-color:var(--color9);
                          transition: transform .2s;
}
#about-me .boxes .item:hover{ transform: scale(1.1); }
#about-me .boxes .item .ico{ width:100%; font-size:3rem; line-height:1; text-align:center; color:var(--color3); }
#about-me .boxes .item .title{ font-family:var(--font-title); font-weight:500; text-align:center; margin:1rem 0; font-size:1.8rem; color:var(--color3); }
#about-me .boxes .item .desc{ text-align:center; }

#about-me .usertext .button { display:table; padding:0 30px; margin:30px auto; width:auto; }

#about-me #WhayMe { background-color:var(--color4); display:block; box-sizing:border-box; padding-bottom:3rem;}
#about-me #WhayMe h2{ color:var(--color10); }
#about-me #WhayMe .boxes { margin-bottom:0; }

#Reference { padding:3rem 0; background-color:var(--color3); font-family:var(--font-title); font-weight:500; }
#Reference h2 { color:var(--color10); }
#about-me .usertext .content .flex { flex-wrap:nowrap; }
#about-me .usertext .content .flex .txt{ width:70%; padding:0 60px 0 0; }
#about-me .usertext .content .flex .img{ width:30%; background-image:url(/Images/lukasmachacek2.jpg); background-position:center center; background-repeat:no-repeat;
                                         background-size:cover;
}


@media all and (max-width:42em) {

    #about-me .boxes .item { width: calc(100% - 90px); }
}

@media all and (max-width:36em) {
    #about-me .usertext .content .flex .txt{ width:100%; }
    #about-me .usertext .content .flex .img { display: none; }
    
}