
/* --- actionable --- */
.play, .close {text-transform: uppercase; font-weight: 700}
.play {display: table; color: #333; line-height: 1;}
.play span {display: inline-block; vertical-align: middle; background-position: center center; background-repeat: no-repeat}
.play:hover {color: #fff}
.play:hover span img {opacity: 0;}
.close{position:absolute; z-index: 1; top:0;right:0;-webkit-transform:translate(50%,-50%);transform:translate(50%,-50%); line-height: 1;cursor: pointer}
.close i{display:block;background-color:#fff;-webkit-box-shadow:0 0 0 4px #f1c24e; box-shadow:0 0 0 4px #f1c24e; color: #f1c24e; border-radius:50%;width:40px; font-size: 20px; line-height:40px;text-align:center;}
.close i {-webkit-transform: rotate(45deg);transform: rotate(45deg); display: inline-block;}
.close:before{content:"Close Video"; color:#fff; position:absolute;top:0px;right:62px;width:100px;text-align:right;opacity:0}
.close:hover i{background-color: #f1c24e; color:#fff}
.close:hover:before{opacity:1}

@media (max-width: 650px) {
    .modal .close {right: 18px; top: -10px;}
}
@media (max-width: 650px) {
    .modal .close {right: 18px; top: -10px;}
}
/* ------------- home page video modal ------------- */
body.modal-opened { overflow: hidden; }
.modal, .modal.open:after { position: fixed; top: 0; left: 0; width: 100%; height: 100%;}
.modal.open:after { background-color: rgba(0, 0, 0, 0.8); z-index: -1; content: ""; display: block;}
.modal { max-height: 100% !important; max-width: 100% !important; z-index: 100000; display: none; padding: 10px; -ms-flex-flow: column; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-flow: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; -ms-grid-row-align: center;  align-items: center; }
.modal.open { display: -webkit-box; display: -ms-flexbox; display: flex; }
.modal.open .close {display: block;}
.modal .figure { width: 580px; max-width: 100%; text-align: center; position: relative; }



/* --- modal setup --- */
.modal-open{overflow:hidden}.modal{display:none;overflow:auto;overflow-y:scroll;position:fixed;top:0;right:0;bottom:0;left:0;z-index:104000}.modal.fade .modal-dialog{-webkit-transform:translate(0,-25%);transform:translate(0,-25%);-webkit-transition:-webkit-transform .3s ease-out;transition:-webkit-transform .3s ease-out;transition:transform .3s ease-out;transition:transform .3s ease-out, -webkit-transform .3s ease-out}.modal.in .modal-dialog{-webkit-transform:translate(0,0);transform:translate(0,0)}.modal-dialog{position:relative;width:auto;margin:10px;z-index:1050}.modal-content{position:relative;background-color:#fff;border:1px solid #999;border:1px solid rgba(0,0,0,.2);border-radius:6px;box-shadow:0 3px 9px rgba(0,0,0,.5);background-clip:padding-box;outline:0}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1030;background-color:#000}.modal-backdrop.fade{opacity:0;filter:alpha(opacity=0)}.modal-backdrop.in{opacity:.5;filter:alpha(opacity=50)}.modal-header{padding:15px;border-bottom:1px solid #e5e5e5;min-height:16.428571429px}.modal-header .close{margin-top:-2px;float:right;font-size:25px;}.modal-title{margin:0;line-height:1.428571429}.modal-body{position:relative;padding:20px}.modal-footer{margin-top:15px;padding:19px 20px 20px;text-align:right;border-top:1px solid #e5e5e5}.modal-footer:after,.modal-footer:before{content:" ";display:table}.modal-footer:after{clear:both}.modal-footer .btn+.btn{margin-left:5px;margin-bottom:0}.modal-footer .btn-group .btn+.btn{margin-left:-1px}.modal-footer .btn-block+.btn-block{margin-left:0}@media screen and (min-width:768px){.modal-dialog{width:600px;margin:30px auto}.modal-content{box-shadow:0 5px 15px rgba(0,0,0,.5)}}.tooltip{position:absolute;z-index:1030;display:block;visibility:visible;font-size:12px;line-height:1.4;opacity:0;filter:alpha(opacity=0)}.tooltip.in{opacity:.9;filter:alpha(opacity=90)}

/* --- modal custom --- */
body.modal-open{overflow:hidden;}
.free-modal { text-align: center; position: absolute; z-index: 10000000; top: 0; left: 0; visibility: hidden; width: 100%; height: 100%; }
.free-modal.is-visible { visibility: visible; }
.modal-overlay { position: fixed; z-index: 10; top: 0; left: 0; width: 100%; height: 100%; background: hsla(0, 0%, 0%, 0.5); visibility: hidden; opacity: 0; -webkit-transition:visibility 0s linear 0.3s, opacity 0.3s; transition: visibility 0s linear 0.3s, opacity 0.3s; }
.free-modal.is-visible .modal-overlay { opacity: 1; visibility: visible; -webkit-transition-delay: 0s; transition-delay: 0s; }
.modal-wrapper { position: absolute; z-index: 9999; max-width: 32em; width: calc(100% - 20px); background-color: #fff; box-shadow: 0 0 1.5em hsla(0, 0%, 0%, 0.35);
    position: fixed; right: 50%;bottom: 50%; -webkit-transform: translate(50%, 50%); transform: translate(50%, 50%); -webkit-font-smoothing: subpixel-antialiased; }
.modal-transition { -webkit-transition:all 0.3s 0.12s; transition: all 0.3s 0.12s; opacity: 0; }
.free-modal.is-visible .modal-transition { opacity: 1; }
.free-modal .modal-content{box-shadow: none !important; padding: 0 !important; border: none !important;}
.modal-header, .modal-content { padding: 1em; }
.modal-header { position: relative; border: none !important; min-height: auto !important; }
.modal-close { position: absolute; top: 0; right: 0; padding: 1em; color: #aaa; background: none; border: 0; outline: none}
.modal-close i{-webkit-transform: rotate(45deg);transform: rotate(45deg); display: block;}
.modal-close:hover { color: #5b5b5c; }
.free-modal h2 {margin: 0;}
.free-modal p {margin-top: 0}

.free-modal input[type=checkbox]{display: inline; width: auto; vertical-align: middle; text-align: left; margin: 0 10px 0 0}
.free-modal input[type=checkbox]:checked + textarea{display: block;}
.free-modal label.error{display: block;}
.free-modal .btn {display: table; margin: 10px auto; width: inherit;}