@import url(https://fonts.googleapis.com/css?family=Lato:400,100,300,700,900); /* font-family: 'Lato', sans-serif; */
/*Default color #1abb9c to #E8158E */

html, body.lcm-loginbody { height:100%;  }
body { font-family: 'Lato', sans-serif; }
a, p, label, div, aside, section, ul, li, span, i, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family: 'Lato', sans-serif; }

a { text-decoration: none !important; -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; }

/********* login ****************/

a.hiddenanchor { display: none; }
/** The wrapper that will contain our two forms **/
#wrapper { right: 0px; margin: 0px auto; margin-top: 5%; max-width: 350px; position: relative; }
#register, #login { position: absolute; top: 0px; width: 100%; }
#register { z-index: 21; opacity: 0; width: 100%; }
#login { z-index: 22; }
#toregister:target ~ #wrapper #register, #tologin:target ~ #wrapper #login { z-index: 22; -webkit-animation-name: fadeInLeft; -moz-animation-name: fadeInLeft; -ms-animation-name: fadeInLeft; -o-animation-name: fadeInLeft; animation-name: fadeInLeft; -webkit-animation-delay: .1s; -moz-animation-delay: .1s; -o-animation-delay: .1s; -ms-animation-delay: .1s; animation-delay: .1s; }
#toregister:target ~ #wrapper #login, #tologin:target ~ #wrapper #register { -webkit-animation-name: fadeOutLeft; -moz-animation-name: fadeOutLeft; -ms-animation-name: fadeOutLeft; -o-animation-name: fadeOutLeft; animation-name: fadeOutLeft; }
/** the actual animation, credit where due : http://daneden.me/animate/ ***/
.animate { -webkit-animation-duration: 0.5s; -webkit-animation-timing-function: ease; -webkit-animation-fill-mode: both; -moz-animation-duration: 0.5s; -moz-animation-timing-function: ease; -moz-animation-fill-mode: both; -o-animation-duration: 0.5s; -o-animation-timing-function: ease; -o-animation-fill-mode: both; -ms-animation-duration: 0.5s; -ms-animation-timing-function: ease; -ms-animation-fill-mode: both; animation-duration: 0.5s; animation-timing-function: ease; animation-fill-mode: both; }
/********* /login ***************/
/********** sign in ***************************/
.login_box { padding: 20px; margin: auto; }
a { text-decoration: none; }
a:hover { text-decoration: underline; }
.left { float: left; }
.alignleft { float: left; margin-right: 15px; }
.alignright { float: right; margin-left: 15px; }
.clearfix:after, form:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.login_content { margin: 0 auto; padding: 25px 0 0; position: relative; text-align: center; text-shadow: 0 1px 0 #fff; min-width: 280px; }
.login_content h1 { font: normal 25px Helvetica, Arial, sans-serif; letter-spacing: -0.05em; line-height: 20px; margin: 10px 0 30px; }
.login_content h1:before, .login_content h1:after { content: ""; height: 1px; position: absolute; top: 10px; width: 27%; }
.login_content h1:after { background: rgb(126,126,126); background: -moz-linear-gradient(left, rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%); background: -webkit-linear-gradient(left, rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%); background: -o-linear-gradient(left, rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%); background: -ms-linear-gradient(left, rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%); background: linear-gradient(left, rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%); right: 0; }
.login_content h1:before { background: rgb(126,126,126); background: -moz-linear-gradient(right, rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%); background: -webkit-linear-gradient(right, rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%); background: -o-linear-gradient(right, rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%); background: -ms-linear-gradient(right, rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%); background: linear-gradient(right, rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%); left: 0; }
.login_content h1:before, .login_content h1:after { content: ""; height: 1px; position: absolute; top: 10px; width: 20%; }
.login_content h1:after { background: rgb(126,126,126); background: -moz-linear-gradient(left, rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%); background: -webkit-linear-gradient(left, rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%); background: -o-linear-gradient(left, rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%); background: -ms-linear-gradient(left, rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%); background: linear-gradient(left, rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%); right: 0; }
.login_content h1:before { background: rgb(126,126,126); background: -moz-linear-gradient(right, rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%); background: -webkit-linear-gradient(right, rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%); background: -o-linear-gradient(right, rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%); background: -ms-linear-gradient(right, rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%); background: linear-gradient(right, rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%); left: 0; }
.login_content form { margin: 20px 0; position: relative }
.login_content form input[type="text"], .login_content form input[type="email"], .login_content form input[type="password"] { -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; -webkit-box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0,0,0,0.08) inset; -moz-box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0,0,0,0.08) inset; -ms-box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0,0,0,0.08) inset; -o-box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0,0,0,0.08) inset; box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0,0,0,0.08) inset; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; border: 1px solid #c8c8c8; color: #777; margin: 0 0 20px; width: 100%; }
.login_content form input[type="text"]:focus, .login_content form input[type="email"]:focus, .login_content form input[type="password"]:focus { -webkit-box-shadow: 0 0 2px #AA77B4 inset; -moz-box-shadow: 0 0 2px #ed1c24 inset; -ms-box-shadow: 0 0 2px #ed1c24 inset; -o-box-shadow: 0 0 2px #ed1c24 inset; box-shadow: 0 0 2px #A97AAD inset; background-color: #fff; border: 1px solid #A878AF; outline: none; }

#username { background-position: 10px 10px !important }
#password { background-position: 10px -53px !important }
.login_content form div a { font-size: 12px; margin: 10px 15px 0 0; }
.reset_pass { margin-top: 10px !important; }
.login_content div .reset_pass { margin-top: 13px !important; margin-right: 39px; float: right; }
.separator { border-top: 1px solid #D8D8D8; margin-top: 10px; padding-top: 10px; }
.button { background: rgb(247,249,250); background: -moz-linear-gradient(top, rgba(247,249,250,1) 0%, rgba(240,240,240,1) 100%); background: -webkit-linear-gradient(top, rgba(247,249,250,1) 0%, rgba(240,240,240,1) 100%); background: -o-linear-gradient(top, rgba(247,249,250,1) 0%, rgba(240,240,240,1) 100%); background: -ms-linear-gradient(top, rgba(247,249,250,1) 0%, rgba(240,240,240,1) 100%); background: linear-gradient(top, rgba(247,249,250,1) 0%, rgba(240,240,240,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f9fa', endColorstr='#f0f0f0', GradientType=0 );
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.1) inset; -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.1) inset; -ms-box-shadow: 0 1px 2px rgba(0,0,0,0.1) inset; -o-box-shadow: 0 1px 2px rgba(0,0,0,0.1) inset; box-shadow: 0 1px 2px rgba(0,0,0,0.1) inset; -webkit-border-radius: 0 0 5px 5px; -moz-border-radius: 0 0 5px 5px; -o-border-radius: 0 0 5px 5px; -ms-border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px; border-top: 1px solid #CFD5D9; padding: 15px 0; }
login_content form input[type="submit"], #content form .submit { float: left; margin-left: 38px; }
.button a { background: url(http://cssdeck.com/uploads/media/items/8/8bcLQqF.png) 0 -112px no-repeat; color: #7E7E7E; font-size: 17px; padding: 2px 0 2px 40px; text-decoration: none; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
.button a:hover { background-position: 0 -135px; color: #00aeef; }
header { width: 100%; }
/********** end of sign in ********************/

/* *********  Login Page  ******** */

#register { display: none; }
.lcm-loginbody { -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; position: relative; width: 100%; color: #FFF; min-height: 100%; background: url(../images/back.jpg) center center no-repeat; background-size: cover; font-family: 'Lato', sans-serif; background-attachment:fixed; }
.lcm-loginbody::after { -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; content: ""; background: rgba(0, 0, 0, 0.3); position: fixed; top: 0; right: 0; left: 0; bottom: 0; }
.lcm-login-outer { height: 100%; min-height: 100%; position: relative; width: 100%; }
.lcm-login-logo { max-width: 100%; height: 100px; display: inline-block; width: 100%; padding: 10px 0; }
.lcm-login-logo img { max-height: 100%; height: 100%; margin: 0 auto; display: inline-block; }
#login.lcm-login-wrapper { z-index: 20; /*background: rgba(255, 255, 255, 0.15);*/ background:rgba(0,0,0,0.9); box-shadow: 0 0 5px rgba(0,0,0,0.8); left: 0; margin: 0 auto; max-width: 380px; position: absolute; right: 0; text-align: center; top: 10em; width: 100%; font-family: 'Lato', sans-serif; -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; }
#login.lcm-login-wrapper form { padding:15px; }
.lcm-login-wrapper h1 { border-bottom: 4px solid #FFF; color: #fff; display: inline-block; float: right; font-size: 24px; margin: 0 0 20px; padding: 0 0 10px; text-align: center; text-transform: uppercase; width: 100%; font-weight: 400; font-family: 'Lato', sans-serif; }
.lcm-login-wrapper h1 strong { font-weight: 700; margin-left: 5px; color: #9BC93B; }
.login_content.lcm-login-wrapper form { margin: 0; color: #FFF; display: inline-block; width: 100%; font-family: 'Lato', sans-serif; }
.login_content.lcm-login-wrapper form::after { display: none; }
.lcm-login-wrapper .captcha { background:#FFF; }
.lcm-login-wrapper .captcha > a { display: inline-block; width: 100%; color:#4c4c4c; margin: 10px 0; }
.lcm-keep-sign-in { text-align: left; }
.lcm-keep-sign-in label { color: #FFF; }
.lcm-loginbody #login input, .lcm-loginbody .login_content #login input.form-control { color: #333; height:40px; background:rgba(255, 255, 255, 1); }
.lcm-loginbody #login .lcm-login-btn { background: #9bc93b; border: 1px solid #101010; color: #fff; font-size: 18px; font-weight: 700; margin-top: 10px; min-height: 100%; padding: 10px 0; line-height:normal; text-transform: uppercase; width: 100%; transition: all 0.3s ease-in-out 0s; -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; }
.lcm-loginbody #login .lcm-login-btn:hover, .lcm-loginbody #login .lcm-login-btn:focus, .lcm-loginbody #login .lcm-login-btn:active { background: #E8158E; color: #FFF; border: 1px solid #E8158E; }
.lcm-login-wrapper a { color: #FFF; }
.lcm-login-wrapper a:hover { color: #E8158E; }
.lcm-login-wrapper .separator { border-top-color:rgba(255,255,255,0.2); }
.lcm-login-wrapper .separator p { font-size: 12px; }
.lcm-login-wrapper .separator p a { color:#9bc93b; }
.lcm-login-wrapper .separator p a:hover { color: #E8158E; }
.lcm-login-footer { background: rgba(0, 0, 0, 0.7); float: left; padding: 10px; width: 100%; }
.lcm-login-footer p { margin:0; }
.lcm-login-footer p a { color:#9bc93b; }
.formError .formErrorContent, .formError .formErrorArrow div { background:rgb(232, 21, 142); }


/* *********  Home Page  ******** */

.nav_title, .site_title { height:auto; }
.site_title { padding:5px; text-align:center; }
.site_title > img { height: 110px; margin:0 auto; display:inline-block; text-align:center; }
.nav-sm .site_title > img { height: 30px; }


/* *********  Home Page  ******** */
.lcm-msg-list li { position:relative; }
ul.messages.lcm-msg-list li .message_date { position:absolute; right:0; top:0; bottom:0; width:50px; background:#1f364f; text-align:center; }
.lcm-msg-list li .message_date h3 , .lcm-msg-list li .message_date .month { color:#FFF; }
.lcm-msg-list li .message_wrapper { margin-right: 55px;   }


@media screen and (min-width:3000px) {
#login.lcm-login-wrapper { top: 25em; }
}

@media screen and (max-width:1600px) {
#login.lcm-login-wrapper { top: 7em; }
}

@media screen and (max-width:1199px) {
#login.lcm-login-wrapper { top: 4em; }
}

@media screen and (max-width:992px) {
#login.lcm-login-wrapper { top: 7em; }
}

@media screen and (max-width:767px) {
#login.lcm-login-wrapper { top: 0; }
}
