/**
 * vModal - Simple, flexible and beautiful modal dialogs in AngularJS
 * @version v1.3.7
 * @link http://lukaszwatroba.github.io/v-modal
 * @author Łukasz Wątroba <l@lukaszwatroba.com>
 * @license MIT License, http://www.opensource.org/licenses/MIT
 */

/***************************************
  vModal
 ***************************************/
/**
 * Example HTML:
 *
  <v-modal class="vModal--default" close="[ctrl method]">
    <v-dialog role="dialog" fit middle>
      <button aria-label="close" v-close></button>
      [content]
    </v-dialog>
  </v-modal>
 */
/* Base
 ***************************************/
v-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
  overflow-x: hidden;
  overflow-y: auto;
  background-color: rgba(0, 0, 0, 0.5);
  padding: 40px 20px; }
  v-modal v-close {
    position: absolute;
    top: 0;
    right: 0; }

v-dialog {
  display: block;
  position: relative;
  pointer-events: auto;
  background: white;
  z-index: 0;
  min-width: 240px;
  outline: 0;
  max-width: 560px; }
  v-dialog:focus {
    outline: 0; }

v-dialog[middle] {
  max-height: 100%;
  overflow-y: auto; }

v-dialog[fit] {
  width: 100%; }

v-dialog[small] {
  max-width: 340px; }
  @media (min-width: 340px) {
    v-dialog[small] {
      min-width: 340px; } }

v-dialog[medium] {
  max-width: 560px; }
  @media (min-width: 560px) {
    v-dialog[medium] {
      min-width: 560px; } }

v-dialog[large] {
  max-width: 780px; }
  @media (min-width: 780px) {
    v-dialog[large] {
      min-width: 780px; } }

v-close {
  display: inline-block;
  z-index: 10;
  cursor: pointer;
  outline: 0;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none; }
  v-close:hover, v-close:focus {
    outline: 0; }

[v-modal-open] {
  overflow: hidden; }

v-modal {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center; }

v-dialog {
  -webkit-align-self: flex-start;
      -ms-flex-item-align: start;
          align-self: flex-start; }

v-dialog[middle] {
  -webkit-align-self: center;
      -ms-flex-item-align: center;
          align-self: center; }

/* Theme: default
   ***************************************/
.vModal--default {
  -webkit-transition: opacity 0.25s;
          transition: opacity 0.25s; }
  .vModal--default v-dialog {
    will-change: transform;
    padding: 20px;
    border-radius: 2px;
    -webkit-animation: vDialog-enter 0.5s;
            animation: vDialog-enter 0.5s; }
  .vModal--default v-close {
    width: 40px;
    height: 40px; }
    .vModal--default v-close::after, .vModal--default v-close::before {
      content: '';
      display: block;
      position: absolute;
      top: 50%;
      left: 12px;
      height: 1px;
      width: 16px;
      -webkit-transform-origin: 50% 50%;
              transform-origin: 50% 50%; }
    .vModal--default v-close::before {
      -webkit-transform: rotate(-45deg);
              transform: rotate(-45deg); }
    .vModal--default v-close::after {
      -webkit-transform: rotate(45deg);
              transform: rotate(45deg); }
    .vModal--default v-close::after, .vModal--default v-close::before {
      background-color: #2196F3;
      -webkit-transition: background-color 0.25s;
              transition: background-color 0.25s; }
    .vModal--default v-close:hover::after, .vModal--default v-close:hover::before, .vModal--default v-close:focus::after, .vModal--default v-close:focus::before {
      background-color: #F44336; }
  .vModal--default.ng-enter {
    opacity: 0; }
  .vModal--default.ng-enter-active {
    opacity: 1; }
  .vModal--default.ng-leave {
    opacity: 1; }
  .vModal--default.ng-leave-active {
    opacity: 0; }

/* Theme: default (animations) */
@-webkit-keyframes vDialog-enter {
  0% {
    -webkit-transform: translate3d(0, 30px, 0);
            transform: translate3d(0, 30px, 0); }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0); } }
@keyframes vDialog-enter {
  0% {
    -webkit-transform: translate3d(0, 30px, 0);
            transform: translate3d(0, 30px, 0); }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0); } }
