﻿.modal { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 10000; overflow: hidden; -webkit-overflow-scrolling: touch; outline: 0; background-color: rgba(0, 0, 0, 0.25); }
.fade { opacity: 0; -webkit-transition: opacity 0.15s linear; -o-transition: opacity 0.15s linear; transition: opacity 0.15s linear; }
.fade.in { display: block; opacity: 1; }

.modal-dialog { margin: 50px auto; }

.modal.fade .modal-dialog { -webkit-transform: translate(0, -25%); -ms-transform: translate(0, -25%); -o-transform: translate(0, -25%); transform: translate(0, -25%); -webkit-transition: -webkit-transform 0.3s ease-out; -o-transition: -o-transform 0.3s ease-out; transition: -webkit-transform 0.3s ease-out; transition: transform 0.3s ease-out; transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out, -o-transform 0.3s ease-out; }
.modal.in .modal-dialog { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); }

.modal-content { position: relative; background-color: #fff; background-clip: padding-box; border: 1px solid #999; border: 1px solid rgba(0, 0, 0, 0.2); border-radius: 6px; -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5); box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5); outline: 0; }

.modal-header { padding: 15px 30px 15px 15px; border-bottom: 1px solid #e5e5e5; position: relative; }

.modal-header .close { width: 10px; height: 10px; background-color: transparent; background-image: url("/_assets/icon-close-dark.png"); background-size: contain; background-position: center; background-repeat: no-repeat; position: absolute; top: 10px; right: 10px; color: #747474; font-size: 10px; font-weight: bold; font-family: sans-serif; }

.modal-footer { border-top: 1px solid #e3e3e3; padding: 14px 15px 15px; margin-top: 0; border-radius: 0 0 4px 4px; text-align: right; font-size: 0;  }
.modal-footer .close { border: 1px solid #bed600 !important; color: #4D5357 !important; background-color: transparent !important; font-weight: normal; padding: 10px; text-align: center; transition: all 0.3s ease 0s; margin-left: 5px; }

.modal-body { padding: 15px 0; overflow-x: hidden; overflow-y: auto; }

.modal-intro { padding: 0 15px; }
.modal-intro p { font-size: 14px; color: #333333; }

.modal-intro p:last-child{ margin-bottom: 0; }

.modal .media { margin: 0 15px 20px 15px; padding: 12px; border: 1px solid #e3e3e3; border-radius: 4px; background-color: #f5f5f5; max-height: 45vh; overflow: auto; }
.modal .media-body.standard-page-content { margin: 0; }

.modal .media .media-link { margin-bottom: 1em; }

.modal .media-body h4 { font-size: 17px; margin-bottom: 0.5em; }

.modal .form-vertical { padding: 0 15px; }

.modal .col-sm-4 { flex-basis: 33.33%; flex-shrink: 0; }
.modal .col-sm-8 { flex-basis: 66.66%; flex-shrink: 0; }
.modal .col-sm-6 { flex-basis: 50%; flex-shrink: 0; }

.modal .form-group label { font-size: 14px; text-align: left; padding-right: 10px; }

.modal .btn { border: 1px solid #bed400; padding: 5px 10px; margin-right: 10px; }
.modal .btn:last-child { margin-right: 0; }

@media (min-width: 768px) { .modal-dialog { width: 600px; }
   .modal-dialog.modal-sm { width: 300px; }

   .modal-content { -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5); box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5); }
}