/*!
 * Base Functionalities
 * whitouth this tinyModal probably won't work as spected
**/
.tinymodal-cover {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 9999999;
  visibility: hidden;
  opacity: 0;
}

.tinymodal-window {
  position: fixed;
  left: 50%;
  top: 50%;
  visibility: hidden;
  opacity: 0;
  z-index: 999999999;
}

.tinymodal-inner {
  position: relative;
  height: 100%;
}

.tinymodal-active .tinymodal-cover {
  visibility: visible;
  opacity: 1;
}

.tinymodal-active .tinymodal-window-open {
  visibility: visible;
  opacity: 1;
}

/*!
 * Base Design
 * can be overriden by your own styles in this or your stylesheed
**/
.tinymodal-cover {
  background: rgba(0, 0, 0, 0.5);
}

.tinymodal-window {
  padding: 60px;
  background: white;
  box-shadow: rgba(0, 0, 0, 0.5) 0 0 20px;
  border-radius: 3px;
  color: #333;
  transform: translate(-50%, -50%) scale(0.9);
}

.tinymodal-active .tinymodal-window-open {
  transform: translate(-50%, -50%) scale(1);
}

.tinymodal-window-open .tinymodal-close,
.tinymodal-window-open button {
  background-color: #91cd85;
  position: absolute;
  right: -40px;
  top: -40px;
}

.tinymodal-ready .tinymodal-window,
.tinymodal-ready .tinymodal-cover {
  transition: 0.3s all ease-in-out;
}