﻿.form {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  max-width: 300px;
  margin: 0 auto 100px;
  padding: 30px;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  border-bottom-left-radius: 3px;
  border-bottom-right-radius: 3px;
  text-align: center;
}
.form .thumbnail {
  background: #EF3B3A;
  width: 150px;
  height: 150px;
  margin: 0 auto 30px;
  padding: 50px 30px;
  border-top-left-radius: 100%;
  border-top-right-radius: 100%;
  border-bottom-left-radius: 100%;
  border-bottom-right-radius: 100%;
  box-sizing: border-box;
}
.form .thumbnail img {
  display: block;
  width: 100%;
}
.form input {
  outline: 0;
  background: #f2f2f2;
  width: 100%;
  border: 0;
  margin: 0 0 15px;
  padding: 15px;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  border-bottom-left-radius: 3px;
  border-bottom-right-radius: 3px;
  box-sizing: border-box;
  font-size: 14px;
}
.form button {
  outline: 0;
  background: #EF3B3A;
  width: 100%;
  border: 0;
  padding: 15px;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  border-bottom-left-radius: 3px;
  border-bottom-right-radius: 3px;
  color: #FFFFFF;
  font-size: 14px;
  -webkit-transition: all 0.3 ease;
  transition: all 0.3 ease;
  cursor: pointer;
}
.form .message {
  margin: 15px 0 0;
  color: #b3b3b3;
  font-size: 12px;
}
.form .message a {
  color: #EF3B3A;
  text-decoration: none;
}
.form .register-form {
  display: none;
}

.clearfix{
    clear: both;
}
.container {
  position: relative;
  z-index: 1;
  margin: 0 auto;
}
.container:before, .container:after {
  content: "";
  display: block;
  clear: both;
}
.container .info {
  margin: 50px auto;
  text-align: center;
}
.container .info h1 {
  margin: 0 0 15px;
  padding: 0;
  font-size: 36px;
  font-weight: 300;
  color: #1a1a1a;
}
.container .info span {
  color: #4d4d4d;
  font-size: 12px;
}
.container .info span a {
  color: #000000;
  text-decoration: none;
}
.container .info span .fa {
  color: #EF3B3A;
}

/* END Form */
/* Demo Purposes */
body {
  /*background: #ccc;*/
  font-family: "istpok","Roboto", sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
    position: relative;
    direction: rtl; 
}
body:before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  display: block;
  /*background: url(../images/Blue-Background.jpg) no-repeat;*/
    background-size: 100%;
  width: 100%;
  height: 100%;
}

.form-inline {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.form-register {
    display: none;
}

.form-horizontal {
  position: absolute;
  top: 70%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.form-horizontal .btn-blue{
    width: 100%;
}

.btn-blue:focus {
    color: #000 !important;
}

.form-horizontal .form-group{
    margin-right: 0 !important;
    margin-left: 0 !important;
}

.btn-blue {
    background: #3498db;
    color: #fff !important;
}

.btn-blue {
    background: #3498db;
    color: #fff !important;
        padding: 7px 20px;
}

.btn-blue:hover {
    background:rgba(52, 152, 219, 0.86) !important;
    color: #fff !important;
}

a.btn.btn-rahnama {
    padding: 5px 22px;
    margin-top: 9px;
    background: #d9534f;
    color: #fff !important;
    -webkit-transition: .4s ease-in-out;
    -moz-transition: .4s ease-in-out;
    -o-transition: .4s ease-in-out;
    -ms-transition: .4s ease-in-out;
    transition: .4s ease-in-out;

}

a.btn.btn-rahnama:hover,a.btn.btn-rahnama:focus{
    background-color:#bc2e29 !important;
    -webkit-transition: .4s ease-in-out;
    -moz-transition: .4s ease-in-out;
    -o-transition: .4s ease-in-out;
    -ms-transition: .4s ease-in-out;
    transition: .4s ease-in-out;

}

.active a{
    background: #3498db !important;
    color: #fff !important;
    margin-right: 10px;
}

.forgot-pass{
    float: left;
    margin-top: 10px;
}
.forgot-pass:hover {
    text-decoration: none;
}

footer.container-fluid {
    background: #ecf0f1;
    color: #000;
    position: fixed;
    /* line-height: 20px; */
    bottom: 0;
    width: 100%;
    border-top: 1px solid #3498DB;
}

footer.container-fluid p {
    margin-top: 7px;
    text-align: center;
}


.logo-container {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  
}
.logo-container img {
    width: 120px;
    position: relative;
    top: -120px;
    -webkit-transition: all .6s ease-in-out;
    -moz-transition: all .6s ease-in-out;
    -o-transition: all .6s ease-in-out;
    -ms-transition: all .6s ease-in-out;
    transition: all .6s ease-in-out;
      
}


.logo-img.animate{
    width: 107px;
    top: -190px;
    -webkit-transition: all .6s ease-in-out;
    -moz-transition: all .6s ease-in-out;
    -o-transition: all .6s ease-in-out;
    -ms-transition: all .6s ease-in-out;
    transition: all .6s ease-in-out;
}

.active.login a{
        padding: 15px 22px;
}


/*modal */
.modal-dialog {
    z-index: 9999;
}
.close{
    float: right;
}
.modal-header .close {
    margin: -10px 0px 0px -5px;
}

.input-group-addon {
    font-size: 13px;
    font-weight: 600;
    background: #eee;
}

.modal-content {
    box-shadow: none !important;
    border-radius: 0 !important;
} 

#registerForm {
    width: 30%;
}

.alert-box {
    color:#555;
    border-radius:10px;
    padding:10px 10px 10px 36px;
    margin:10px;
    min-height: 65px;
    font-size: 15px;
}
.alert-box span {
    font-weight:bold;
    text-transform:uppercase;
}
.error {
    background:#ffecec url('../images/error.png') no-repeat 10px 50%;
    border:1px solid #f5aca6;
}
.success {
    background:#e9ffd9 url('../images/success.png') no-repeat 10px 50%;
    border:1px solid #a6ca8a;
}
.warning {
    background:#fff8c4 url('../images/warning.png') no-repeat 10px 50%;
    border:1px solid #f2c779;
}
.notice {
    background:#e3f7fc url('../images/notice.png') no-repeat 10px 50%;
    border:1px solid #8ed9f6;
}

#Msg {
    margin: 10px;
}