* {background-color:white;color:black;font-family:arial;text-align:center;box-sizing:border-box;margin:0;padding:0;vertical-align:top;}
*:before, *:after {box-sizing:border-box;}
a.card  
{
align-items:center;
border-radius:10px;
border:solid 1px silver;
box-shadow:0 4px 8px 0 rgba(0,0,0,0.8);
cursor:pointer;
display:inline-flex;
font-size:20px;
font-weight:500;
justify-content:center;
margin:20px;
min-height:180px;
padding:40px;
text-decoration:none;
transition:0.5s;
width:280px;
}
div.card  
{
border-radius:10px;
border:solid 1px silver;
box-shadow:0 4px 8px 0 rgba(0,0,0,0.8);
display:inline-block;
line-height:1.5;
margin:20px;
min-height:440px;
padding:40px;
text-decoration:none;
transition:0.5s;
width:280px;
}
div.card2  
{
border-radius:10px;
border:solid 1px silver;
box-shadow:0 4px 8px 0 rgba(0,0,0,0.8);
display:inline-block;
line-height:1.5;
margin:20px;
min-height:488px;
padding:40px;
text-decoration:none;
transition:0.5s;
width:280px;
}
div.card3  
{
border-radius:10px;
border:solid 1px silver;
box-shadow:0 4px 8px 0 rgba(0,0,0,0.8);
display:inline-block;
line-height:1.5;
margin:20px;
min-height:458px;
padding:40px;
text-decoration:none;
transition:0.5s;
width:280px;
}
.animate {-webkit-animation:animatezoom 0.9s;animation:animatezoom 0.9s}
.cerrar {color:black;cursor:pointer;font-size:40px;font-weight:bold;padding:8px;position:absolute;left:20px;top:100px;background-color:transparent;}
.foto img {width:100%;height:auto;margin:-10px;-webkit-filter:grayscale(100%);filter:grayscale(100%);}
.foto {position:relative;width:150px;height:150px;overflow:hidden;margin:auto;border-radius:50%;margin-bottom:40px;}
.foto2 img {width:100%;height:auto;margin:0;-webkit-filter:grayscale(100%);filter:grayscale(100%);}
.foto2 {position:relative;width:150px;height:150px;overflow:hidden;margin:auto;border-radius:50%;margin-bottom:40px;}  
@-webkit-keyframes animatezoom {from {-webkit-transform:scale(0)} to {-webkit-transform:scale(1)}}
@keyframes animatezoom {from {transform:scale(0)} to {transform:scale(1)}}
a.card:hover {box-shadow:0 8px 16px 0 rgba(0,0,0,0.4);color:green;background-color:orange;}
a.card:active {border:solid 4px green;}
div.header {width:100%;text-align:left;}
h1 {padding:40px;text-transform:uppercase;}
h2 {margin-bottom:25px;}
img.logos {width:300px;height:76px;margin-left:128px;}
@media screen and (max-width:800px) 
{
div.header {text-align:center;}
img.logos {margin:0;margin:auto;}
.cerrar {top:90px;}
}