/*
 *
 * Template Name: Fullscreen Login
 * Description: Login Template with Fullscreen Background Slideshow
 * Author: Anli Zaimi
 * Author URI: http://azmind.com
 *
 */


body { background: #f8f8f8; font-family: 'PT Sans', Helvetica, Arial, sans-serif; text-align: center; color: #fff; }

.page-container { margin: 15% auto 0 auto; }

h1 { font-size: 30px;  text-shadow: 0 1px 4px rgba(0,0,0,.4); }

form { position: relative; width: 305px; margin: 15px auto 0 auto; text-align: center; }

.selectdown { position: absolute; width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; border-top: 10px solid rgba(255, 255, 255, 0.69); left: 270px; top: 42px; }
.select_panel { top: 68px; height: auto; display: none; border-radius: 2px; border: 1px solid rgba(255,255,255,.15); background: rgba(45,45,45,.80); position: absolute; width: 300px; color: white;    height: 200px; overflow: hidden;overflow-y: auto; }
ul li { line-height: 30px; cursor: default; }
ul li:hover { background: rgba(249, 249, 249, 0.31); }
input { width: 270px; height: 42px; margin-top: 25px; padding: 0 15px; background: #2d2d2d; /* browsers that don't support rgba */ background: rgba(45,45,45,.15); -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; border: 1px solid #3d3d3d; /* browsers that don't support rgba */ border: 1px solid rgba(255,255,255,.15); -moz-box-shadow: 0 2px 3px 0 rgba(0,0,0,.1) inset; -webkit-box-shadow: 0 2px 3px 0 rgba(0,0,0,.1) inset; box-shadow: 0 2px 3px 0 rgba(0,0,0,.1) inset; font-family: 'PT Sans', Helvetica, Arial, sans-serif; font-size: 14px; color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.1); -o-transition: all .2s; -moz-transition: all .2s; -webkit-transition: all .2s; -ms-transition: all .2s; }

input:-moz-placeholder { color: #fff; }
input:-ms-input-placeholder { color: #fff; }
input::-webkit-input-placeholder { color: #fff; }

input:focus, select:focus { outline: none; -moz-box-shadow: 0 2px 3px 0 rgba(0,0,0,.1) inset, 0 2px 7px 0 rgba(0,0,0,.2); -webkit-box-shadow: 0 2px 3px 0 rgba(0,0,0,.1) inset, 0 2px 7px 0 rgba(0,0,0,.2); box-shadow: 0 2px 3px 0 rgba(0,0,0,.1) inset, 0 2px 7px 0 rgba(0,0,0,.2); }

button { cursor: pointer; width: 300px; height: 44px; margin-top: 25px; padding: 0; background: #2196F3; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; border: 1px solid #2196F3; -moz-box-shadow: 0 15px 30px 0 rgba(255,255,255,.25) inset, 0 2px 7px 0 rgba(0,0,0,.2); -webkit-box-shadow: 0 15px 30px 0 rgba(255,255,255,.25) inset, 0 2px 7px 0 rgba(0,0,0,.2); box-shadow: 0 15px 30px 0 rgba(255,255,255,.25) inset, 0 2px 7px 0 rgba(0,0,0,.2); font-family: 'PT Sans', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: 700; color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.1); -o-transition: all .2s; -moz-transition: all .2s; -webkit-transition: all .2s; -ms-transition: all .2s; }

button:hover { -moz-box-shadow: 0 15px 30px 0 rgba(255,255,255,.15) inset, 0 2px 7px 0 rgba(0,0,0,.2); -webkit-box-shadow: 0 15px 30px 0 rgba(255,255,255,.15) inset, 0 2px 7px 0 rgba(0,0,0,.2); box-shadow: 0 15px 30px 0 rgba(255,255,255,.15) inset, 0 2px 7px 0 rgba(0,0,0,.2); }

button:active { -moz-box-shadow: 0 15px 30px 0 rgba(255,255,255,.15) inset, 0 2px 7px 0 rgba(0,0,0,.2); -webkit-box-shadow: 0 15px 30px 0 rgba(255,255,255,.15) inset, 0 2px 7px 0 rgba(0,0,0,.2); box-shadow: 0 5px 8px 0 rgba(0,0,0,.1) inset, 0 1px 4px 0 rgba(0,0,0,.1); border: 0px solid #ef4300; }

.error { display: none; position: absolute; top: 27px; right: -55px; width: 40px; height: 40px; background: #2d2d2d; /* browsers that don't support rgba */ background: rgba(45,45,45,.25); -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; }

.error span { display: inline-block; margin-left: 2px; font-size: 40px; font-weight: 700; line-height: 40px; text-shadow: 0 1px 2px rgba(0,0,0,.1); -o-transform: rotate(45deg); -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); }

.connect { position: absolute; font-size: 14px; width: 100%; bottom: 10px; text-align: center; color: #eee; }

.connect a { color: #fff; }

.connect a.facebook { background: url(../img/facebook.png) center center no-repeat; }
.connect a.twitter { background: url(../img/twitter.png) center center no-repeat; }

.connect a:hover { background-position: center bottom; }