/*modal*/
@-moz-keyframes out { 100%{transform: scale(0); opacity: 0} }
@-moz-keyframes in { 100%{transform: scale(1); opacity: 1} }
@-webkit-keyframes out { 100%{transform: scale(0); opacity: 0} }
@-webkit-keyframes in { 100%{transform: scale(1); opacity: 1} }
@keyframes out { 100%{transform: scale(0); opacity: 0} }
@keyframes in { 100%{transform: scale(1); opacity: 1} }
/*.hidden{animation: out .3s 1 forwards; pointer-events:none}*/
[data-section="revista"],
.modal{   top: 0; left: 0; width: 100%; background: rgba(27, 27, 27, 0.95); height: 100%;
                                  padding:0; margin: 0; max-width: inherit; z-index: 2; display: block;
                                  overflow-y:auto; transition: all .3s;transform: scale(0);opacity: 0;
                                  animation: out .3s 1 forwards; pointer-events:none}
[data-section="revista"].visible,
.visible,
.modal.visible{-moz-animation: in .3s 1 forwards;-webkit-animation: in .3s 1 forwards;
        animation: in .3s 1 forwards; pointer-events:all; z-index: 9}
.close{    width: 40px; height: 40px; background: rgba(0, 0, 0, 0.63) url(../img/cross-remove-sign.png) no-repeat center; display: block; position: absolute; background-size: 70% 70%; z-index: 8; right: 1%; cursor: pointer; top: 1%;}
.box-modal{    max-width: 1100px; margin: 0 auto; width: 100%; background: #fff; position: relative}
/*and modal*/