.modal-outer{background-color:rgba(0,0,0,0.75);width:100%;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:fixed;top:0;left:0;right:0;bottom:0;opacity:0;z-index:-1000;visibility:hidden;-webkit-transition:300ms all ease-in-out;transition:300ms all ease-in-out}.modal-outer.visible{opacity:1;visibility:visible;z-index:10000}.modal{padding:40px;margin:20px;border-radius:10px;background:white;max-width:500px;opacity:0;visibility:hidden;position:relative;-webkit-transform:scale(0);transform:scale(0);-webkit-transition:all 300ms ease-in-out;transition:all 300ms ease-in-out}.modal.video,.modal.form{width:100%;max-width:700px;padding:30px}.visible .modal{opacity:1;visibility:visible;-webkit-transform:scale(1);transform:scale(1);-webkit-transition:all 300ms ease,opacity 100ms ease;transition:all 300ms ease,opacity 100ms ease}.modal #close{height:36px;width:36px;border-radius:50%;position:absolute;top:-3%;right:-1%;background-color:#fff;-webkit-transition:all 300ms ease-in-out;transition:all 300ms ease-in-out}.modal #close:focus{border:1px dashed teal}.modal #close:hover{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.modal #close::after,.modal #close::before{content:"";height:20px;width:1px;background-color:#ccc;position:absolute}.modal #close::before{left:47%;top:20%;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.modal #close::after{left:47%;top:20%;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.modal iframe,.modal video{position:absolute;top:0;left:0;width:100%;height:100%}