/* ==========================================================================
   Project: 	TWD CMS - Login
   Date:		08/27/14
   Created by:	Third Wave Digital (www.thirdwavedigital.com)
   ========================================================================== */
   
/* ==========================================================================
   Basic Elements
   ========================================================================== */
   
body {background: #ddd;}

/* ==========================================================================
   Login
   ========================================================================== */

.form-wrapper {background: #fff; padding: 20px; position: absolute; margin: 0px; top: 0px; left: 0px;width: 290px;-webkit-box-shadow: 0px 0px 5px rgba(50, 50, 50, 0.5);-moz-box-shadow: 0px 0px 5px rgba(50, 50, 50, 0.5);box-shadow: 0px 0px 5px rgba(50, 50, 50, 0.5);}
	form {margin: 0px; padding: 0px;}  
	form p {margin: 0px; padding: 0px;}   
	form p, form p a {color: #666;}
	form p a:hover {color: #357ebd;}
	form .logo { border-bottom: 2px solid #ccc; padding-bottom: 8px;text-align:center;margin-bottom: 5px;}
	form h2 { margin: 15px 0px 15px 0px; padding: 0px; }
	form .or {text-transform: uppercase; border-top: 1px solid #ccc;position: relative; width: 100%; height: 10px; margin: 10px 0px 0px 0px; font-size: 12px; color: #666;}
	form .or span {  position: absolute; top:-10px; left: 50%; width: 30px; margin-left: -15px; background: #f3f3f3;}
	
.flip-wrapper-outer {-webkit-perspective: 800px;-moz-perspective: 800px;-ms-perspective: 800px;-o-perspective: 800px;perspective: 800px;margin: auto; top: 0px; left: 0px; bottom: 0px; right: 0px;  position: absolute; height: 390px; width: 290px;}
	.flip-wrapper-inner {-o-transition: all .4s ease-in-out;-ms-transition: all .4s ease-in-out;-moz-transition: all .4s ease-in-out;-webkit-transition: all .4s ease-in-out;transition: all .4s ease-in-out;-webkit-transform-style: preserve-3d;transform-style: preserve-3d;}
	.flip-wrapper-inner .front, .flip-wrapper-inner .back {-webkit-backface-visibility: hidden;-moz-backface-visibility: hidden; backface-visibility: hidden; transform-style: preserve-3d}
	.flip-wrapper-inner .front {z-index: 2;}
	.flip-wrapper-inner .back {z-index: 1; -webkit-transform: rotateY(180deg);-moz-transform: rotateY(180deg);}
	.flip-wrapper-inner.flip {-webkit-transform: rotateY(180deg);-moz-transform: rotateY(180deg);}
	.flip-wrapper-inner.flip .front { z-index: 1;}
	.flip-wrapper-inner.flip .back { z-index: 2;}