/* Modals */
body.no-scroll{
  overflow: hidden;
}
[modal-trigger]{
  cursor: pointer;
}
[modal-status]{
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  max-width: 100%;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: alpha(opacity=100);
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;
  -webkit-transition: opacity 800ms;
  -moz-transition: opacity 800ms;
  -o-transition: opacity 800ms;
  transition: opacity 800ms;
  z-index: 60;
  overflow: auto;
}
[modal-status="hide"]{
  z-index: -1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  -moz-opacity: 0;
  -khtml-opacity: 0;
  opacity: 0;
  -webkit-transition: opacity 300ms, z-index 0ms linear 800ms;
  -moz-transition: opacity 300ms, z-index 0ms linear 800ms;
  -o-transition: opacity 300ms, z-index 0ms linear 800ms;
  transition: opacity 300ms, z-index 0ms linear 800ms;
}
[modal-status]:after{
  content: "";
  background: #000;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
  filter: alpha(opacity=70);
  -moz-opacity: 0.7;
  -khtml-opacity: 0.7;
  opacity: 0.7;
  z-index: 1;
}
[modal-status] > *{
  z-index: 2;
}
[modal-status] > *{
  position: relative;
  -webkit-transition: all 300ms;
  -moz-transition: all 300ms;
  -o-transition: all 300ms;
  transition: all 300ms;
  -webkit-transform: translateY( 0 );
  -moz-transform: translateY( 0 );
  -o-transform: translateY( 0 );
  transform: translateY( 0 );
}
[modal-status="hide"] > *{
  -webkit-transform: translateY( -250% ) ;
  -moz-transform: translateY( -250% ) ;
  -o-transform: translateY( -250% ) ;
  transform: translateY( -250% );
}
[modal-status] [modal-close]{
  position: absolute;
  top: 0em;
  right: 0;
  font-size: 1.5em;
  padding: .2em;
  background: red;
  color: #fff;
  cursor: pointer;
}
[modal-status] [modal-close]:hover{
  background: #900;
}