.modal-button-cards{color:#fff}
.row__cards{display:flex;flex-direction:row;justify-content:space-between}
.card__modal-button{background-color:transparent;cursor:pointer;color:inherit;border-radius:4px;width:30%;margin:10px 0 0;padding:32px 0 0;text-align:center}
.card__modal-button p{object-fit:contain;opacity:.8;font-family:Gibson;font-size:14px;font-weight:100;font-stretch:normal;font-style:normal;line-height:1.57;letter-spacing:normal;margin:0 0 24px}
.card__modal-button img{width:34px;height:34px;margin-bottom:16px}
.card__modal-button a{text-decoration:none}
.card__modal-button:hover{background-color:rgba(0,0,0,0.05)}
.modal{display:none;position:fixed;z-index:1;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgba(0,0,0,0.5)}
.modal-content{background-color:#000;color:white;width:100%;max-width:800px;min-height:100vh}
.modal-content-container{padding:20px 30px 40px;position:relative}
.close{color:#aaa;font-size:46px;position:absolute;top:0;right:10px}
.close:hover,.close:focus{color:#fff;text-decoration:none;cursor:pointer}
body{font-family:Arial,Helvetica,sans-serif}
.column{float:left;width:25%;padding:0 10px}
.row{margin:0 -5px}
.row:after{content:"";display:table;clear:both}
@media screen and (max-width:600px){.column{width:100%;display:flex;margin-bottom:20px}
}
.card{box-shadow:0 4px 8px 0 rgba(0,0,0,0.2);padding:16px;text-align:center;background-color:#f1f1f1}
@media(min-width:768px){.modal-content{margin:40px auto 0;min-height:calc(100% - 80px)}
}
@media(min-width:1920px){.card__modal-button p{font-size:22px;line-height:34px}
.card__modal-button img{margin-bottom:20px;width:52px;height:52px}
}