a.trivial {
	color: #ffffff
	/* trivial */
}
 #fpc_effect-back {
	 background-color: #222222;
	/* some background color to match corner inside's */
	 width: 100%;
	/* trivial */
	 font: 12pt arial,sans-serif,helvetica,verdana;
	/* trivial */
	 color: #666;
	/*trivial*/
}
 #fpc_effect-back * {
	 box-sizing: border-box;
}
 #fpc_box {
	 width: auto;
	/*was 500px any relative or absolute*/
	 max-width:705px;
	 position: relative;
	 background-color: #FFF;
}
 #fpc_content {
	 padding: 0px;
}
 #fpc_content:before {
	 content:"";
	 width: 80px;
	 height: 0px;
	 float: right;
}
 #fpc_page-tip:before, #fpc_page-tip:after {
	 background-color: #FFF;
	 position: absolute;
	 display: block;
	 z-index: 2;
	 border-top-right-radius: 60%;
	 width: 50%;
	 height: 50%;
	 content: "";
}
 #fpc_page-tip:before {
	 right: 100%;
	 top: 0%;
	 background: -webkit-radial-gradient(-180% 200%, circle, rgba(255,255,255,0) 85%, rgba(0,0,0,.1) 93%);
}
 #fpc_box:hover #fpc_page-tip:before {
	 border-right: solid 1px #fff;
}
 #fpc_box div#fpc_corner-box:hover #fpc_page-tip:before {
	 border-right: solid 2px #fff;
}
 #fpc_page-tip:after {
	 top: 100%;
	 right: 0%;
	 background: -webkit-radial-gradient(-250% 320%, circle, rgba(255,255,255,0) 85%, rgba(0,0,0,.10) 93%);
}
 #fpc_box:hover #fpc_page-tip:after {
	 border-top: solid 1px #fff;
}
 #fpc_box div#fpc_corner-box:hover #fpc_page-tip:after {
	 border-top: solid 2px #fff;
}
 #fpc_corner-box {
	/* edit these sizes for the default revealing corner size */
	 height: 20px;
	 width: 20px;
	 right: 0;
	 top: 0;
	 position: absolute;
	 overflow: visible;
}
 #fpc_box:hover #fpc_corner-box {
	/* edit corner size (First animation, when the whole page is rollovered) */
	 height: 50px;
	 width: 50px;
}
 #fpc_box div#fpc_corner-box:hover {
	/* edit corner size (Second animation, when the corner itself is rollovered) */
	 height: 100px;
	 width: 100px;
}
 #fpc_corner-box:before {
	 position: absolute;
	 top: 0;
	 right: 0;
	 content: "";
	 display: block;
	 width: 133%;
	 height: 133%;
}
 #fpc_corner-contents:after {
	 position: absolute;
	 top: 0;
	 right: 0;
	 content: "";
	 background: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0) 37%, #DDD 62%, rgba(230, 230, 230, 0.1) 64%, rgba(255, 255, 255, 0) 67%), -webkit-radial-gradient(-50% 150%, circle, transparent 74%, rgba(0, 0, 0, 0.2) 74%, transparent 81%);
	 display: block;
	 width: 133%;
	 height: 133%;
}
 #fpc_page-tip {
	 position: absolute;
	 top: 0;
	 right: 0;
	 content: "";
	 background: -webkit-linear-gradient(45deg, #ddd 17%, #dfdfdf 18%, #f5f5f5 30%, #f8f8f8 34%, #eee 39%, rgba(200,200,200,0) 41%);
	 display: block;
	 width: 100%;
	 height: 100%;
}
 #fpc_corner-button {
	 position: absolute;
	 width: 7em;
	 top: 0;
	 right: 0;
	 background-color: #900;
	 color: #fff;
	 font-family: Verdana, Geneva, sans-serif;
	 text-align: center;
	 padding: 8px 5px;
	 border-radius: 5px;
	 display: inline-block;
	 font-size: 11px;
}
 #fpc_corner-contents {
	 width: 125%;
	 position: absolute;
	 display: block;
	 overflow: hidden;
	 -webkit-mask: -webkit-linear-gradient(45deg, transparent 49%, #000 53%);
	 top: 0;
	 right: 0;
	 height: 125%;
}
 #fpc_corner-contents:before {
	 content: "";
	 position: absolute;
	 top: 0;
	 right: 0;
	 display: block;
	 width: 100%;
	 height: 100%;
	 background-color: #eeeef4;
	/* Match this background color to #fpc_effect-back */
}
 #fpc_corner-box, #fpc_corner-contents, #fpc_page-tip {
	 -webkit-transition-property: all;
	 -webkit-transition-duration: .3s;
	 -webkit-transition-timing-function: cubic-bezier(0, 0.35, .5, 1.7);
}
 #fpc_corner-button strong {
	 font-size: 13px;
	 font-weight: bold;
	 display: block;
}
 @media only screen and (max-width: 767px) {
	 #fpc_box {
		 width: auto;
		/*was 300px any relative or absolute*/
		 position: relative;
		 background-color: #FFF;
	}
}