.mact-layout { background: rgba(0,0,0,0.7); position: fixed; z-index: 2001; left: 0; right: 0; bottom: 0; top: 0 }

.mact { position: absolute; top: 30px; bottom: 30px; left: 30px; right: 30px; margin: auto;  }
.mact1 { max-height: 57px; }
.mact2 { max-height: 103px; }
.mact3 { max-height: 155px; }
.mact4 { max-height: 207px; }
.mact5 { max-height: 259px; }
.mact6 { max-height: 312px; }

.mact-action { cursor: pointer; background: #fff; display: block; color: #000; border-bottom: 1px solid rgba(0, 0, 0, 0.08); text-align: center; font: 600 23px/21px geometria, arial; padding: 15px 0 }
.mact-action:first-child { border-radius: 10px 10px 0 0; }
.mact-action:last-child { border-bottom: 0; border-radius: 0 0 10px 10px }
.mact-action:first-child:last-child { border-radius: 10px; }

.mact-close { font-weight: 400 }

.mact-other { cursor: pointer; position: absolute; bottom: -40px; left: 0; right: 0; text-shadow: rgba(0, 0, 0, 0.2) 0px 1px 0px; font: 500 20px/25px geometria, arial; text-align: center; color: #fff; }

@media screen and (min-width:501px) {
    .mact { max-width: 300px; }
    .mact-action { text-shadow: 0 1px 0 rgba(255,255,255,0.4); }
    .mact-action:hover { text-decoration: none; background: #ffeacc; }
    .mact-action:active { line-height: 22px; }
    .mact-action:first-child { border-radius: 10px 10px 0 0; }
    .mact-action:last-child { border-radius: 0 0 10px 10px; }
}

@media screen and (max-width: 500px) {
    .mact-action { -webkit-tap-highlight-color: rgba(201, 224, 253, 0.8); }
}