.frdr {
  margin: 0;
  padding: 0;
  display: none;
  list-style: none;
  position: absolute;
  cursor: pointer;
}
 
.frdr>DIV {
  left: 0;
  top: 0;
  height: 100%;
  font-size: 12px;
  text-align: center;
  position: absolute;
  /*-webkit-transform-origin: 50% 50% 50%;*/
  -ms-transform-origin: 50% 50% 50%;
  -webkit-transform-origin: 50% 50% 50%;
  transform-origin: 50% 50% 50%;

  /*-webkit-transform: perspective(0);*/
  -moz-transform: perspective(0);
  -webkit-transform: perspective(0);
  -o-transform: perspective(0);
  -ms-transform: perspective(0);
  transform: perspective(0);

  /*-webkit-transform-style: preserve-3d;*/
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.fpage-first {
  width: 50%;
  padding: 0 0 0 50%;
  /*-webkit-transform: rotate3d(0, 1, 0, -1deg);*/
  -moz-transform: rotate3d(0, 1, 0, -1deg);
  -webkit-transform: rotate3d(0, 1, 0, -1deg);
  -o-transform: rotate3d(0, 1, 0, -1deg);
  -ms-transform: rotate3d(0, 1, 0, -1deg);
  transform: rotate3d(0, 1, 0, -1deg);
}

.fpage-right {
  width: 50%;
  padding: 0 0 0 50%;
  /*-webkit-transform: rotate3d(0, 1, 0, -1deg);*/
  -moz-transform: rotate3d(0, 1, 0, -1deg);
  -webkit-transform: rotate3d(0, 1, 0, -1deg);
  -o-transform: rotate3d(0, 1, 0, -1deg);
  -ms-transform: rotate3d(0, 1, 0, -1deg);
  transform: rotate3d(0, 1, 0, -1deg);
}
 
.fpage-left {
  width: 50%;
  padding: 0 50% 0 0;
  /*-webkit-transform: rotate3d(0, 1, 0, 1deg);*/
  -moz-transform: rotate3d(0, 1, 0, 1deg);
  -webkit-transform: rotate3d(0, 1, 0, 1deg);
  -o-transform: rotate3d(0, 1, 0, 1deg);
  -ms-transform: rotate3d(0, 1, 0, 1deg);
  transform: rotate3d(0, 1, 0, 1deg);
}
 
.bd {
  z-index: inherit;
  overflow: hidden;
  padding: 0px 0px 0px 0px;
  position: absolute;
  background-color: white;
}

.fpage-first .bd {
  border-left: 1px solid #CCC;
  /*-webkit-border-top-right-radius: 0px 0px;*/
  -webkit-border-top-right-radius: 0px 0px;
  -moz-border-top-right-radius: 0px 0px;
  border-top-right-radius: 0px 0px;

  /*-webkit-border-top-left-radius: 0px 0px;*/
  -webkit-border-top-left-radius: 0px 0px;
  -moz-border-top-left-radius: 0px 0px;
  border-top-left-radius: 0px 0px;

  /*-webkit-border-bottom-right-radius: 0px 0px;*/
  -webkit-border-bottom-right-radius: 0px 0px;
  -moz-border-bottom-right-radius: 0px 0px;
  border-bottom-right-radius: 0px 0px;

  /*-webkit-border-bottom-left-radius: 0px 0px;*/
  -webkit-border-bottom-left-radius: 0px 0px;
  -moz-border-bottom-left-radius: 0px 0px;
  border-bottom-left-radius: 0px 0px;
}

.fpage-right .bd {
  /*-webkit-border-top-right-radius: 100px 3px;*/
  -webkit-border-top-right-radius: 100px 3px;
  -moz-border-top-right-radius: 100px 3px;
  border-top-right-radius: 100px 3px;

  /*-webkit-border-top-left-radius: 100px 13px;*/
  -webkit-border-top-left-radius: 100px 13px;
  -moz-border-top-left-radius: 100px 13px;
  border-top-left-radius: 100px 13px;

  /*-webkit-border-bottom-right-radius: 100px 4px;*/
  -webkit-border-bottom-right-radius: 100px 4px;
  -moz-border-bottom-right-radius: 100px 4px;
  border-bottom-right-radius: 100px 4px;

  /*-webkit-border-bottom-left-radius: 100px 10px;*/
  -webkit-border-bottom-left-radius: 100px 10px;
  -moz-border-bottom-left-radius: 100px 10px;
  border-bottom-left-radius: 100px 10px;

  border-left: 1px solid #CCC;
}
 
.fpage-left .bd {
  /*-webkit-border-top-right-radius: 100px 13px;*/
  -webkit-border-top-right-radius: 100px 13px;
  -moz-border-top-right-radius: 100px 13px;
  border-top-right-radius: 100px 13px;

  /*-webkit-border-top-left-radius: 100px 3px;*/
  -webkit-border-top-left-radius: 100px 3px;
  -moz-border-top-left-radius: 100px 3px;
  border-top-left-radius: 100px 3px;

  /*-webkit-border-bottom-right-radius: 100px 10px;*/
  -webkit-border-bottom-right-radius: 100px 10px;
  -moz-border-bottom-right-radius: 100px 10px;
  border-bottom-right-radius: 100px 10px;

  /*-webkit-border-bottom-left-radius: 100px 4px;*/
  -webkit-border-bottom-left-radius: 100px 4px;
  -moz-border-bottom-left-radius: 100px 4px;
  border-bottom-left-radius: 100px 4px;

  /*-webkit-box-shadow: inset -5px 0px 20px #CCC;*/
  -webkit-box-shadow: inset -5px 0px 20px #CCC;
  -moz-box-shadow: inset -5px 0px 20px #CCC;
}


.shadowFlip {
  box-shadow: 0 4px 10px #666;
}