﻿body, html {
    height: 100%;
    position: relative;
    display: table;
    width: 100%
}

body {
    color: rgb(123,166,171);
    display: table;
    width: 100%;
    background-size: contain;
    background-image: url('../Images/BgLogin.jpg');
    background-repeat: no-repeat;
    background-color: transparent;
}
a {
    outline: 0;
    text-decoration: none;
    color: #7ba4a9;
    white-space: nowrap;
}
    a:focus, body a:hover {
        color: #fff;
        text-decoration: none;
    }

ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.login-container, .resetPassword-container {height: 100%;width: 100%;position: relative;display: inline-flex;direction: rtl}
.login-container .radio label, .resetPassword-container .radio label, .checkbox label {white-space: nowrap;}
.login-container .sidebar, .resetPassword-container .sidebar {width: 35%; position: relative; height: 100%; padding: 0px;margin-right: 10%;}
.login-container .sidebar .caption, .login-resetPassword .sidebar .caption { margin: 20px;color:#fff }
.login-container .sidebar .caption h4, .resetPassword-container .sidebar .caption h4 {  }
.login-container .sidebar .form-group, .resetPassword-container .sidebar .form-group { position: relative;overflow: hidden;margin-bottom: 0;border-radius: 5px;margin: 1px auto;}
.resetPassword-container .sidebar .form-group{margin: 5px auto;background: #fff;}
.login-container .sidebar .form-group .form-control, .resetPassword-container .sidebar .form-group .form-control { font-size: 14px; font-weight: normal; color: #333; background-color: #fff;border-bottom: 1px solid #e5e5e5;border-top: 0; box-shadow: none; transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; height: 40px; border-right: 0px;border-left: 0;padding-left: 20px;padding-right: 20px }
.login-container .sidebar .form-group .controls > i, .resetPassword-container .sidebar .form-group .controls > i { color: #ccc; display: block; font-size: 16px; margin: 5px 5px 4px 5px; position: absolute; text-align: center; width: 16px; z-index: 3;line-height: 30px;direction: ltr }
.login-container .sidebar .form-group.captchabox, .resetPassword-container .sidebar .form-group.captchabox { border: 1px solid #e5e5e5; }
.login-container .sidebar .form-group.captchainputbox input, .resetPassword-container .sidebar .form-group.captchainputbox input { border-radius: 0; border: 0; font-size: 12px; height: 54px; padding: 0 5px; }
.login-container .sidebar .text-info, .resetPassword-container .sidebar .text-info { color: #3b4752; text-decoration: none; }
.login-container .sidebar .button-holder, .resetPassword-container .sidebar .button-holder { margin-top: 20px; margin-bottom: 30px; }
.login-container .sidebar .button-holder .btn-primary, .login-container .sidebar .button-holder .btn-primary:focus, .resetPassword-container .sidebar .button-holder .btn-primary, .resetPassword-container .sidebar .button-holder .btn-primary:focus { color: #fff; background-color: #45b6af; border-color: #45b6af; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; font-size: 16px; padding: 4px 28px 9px; width: 100%;border-radius: 5px}
.login-container .sidebar .button-holder .btn-primary:focus:hover, .login-container .sidebar .button-holder .btn-primary:hover, .resetPassword-container .sidebar .button-holder .btn-primary:focus:hover, .resetPassword-container .sidebar .button-holder .btn-primary:hover { background-color: #3ea49e; border-color: #3ea49e; color: #fff; }
.login-container .sidebar .list li a, .resetPassword-container .sidebar .list li a { position: relative; display: block; padding-right: 15px;font-size: 12px;}
.login-container .sidebar .list li a:before, .resetPassword-container .sidebar .list li a:before { content: ""; position: absolute; right: 0; top: 5px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; background-color: #5a8f99; width: 7px; height: 7px; }
.login-container .sidebar .pull-bottom, .resetPassword-container .sidebar .pull-bottom { right: 0; bottom: 0; left: 0; padding: 20px 55px;}
.login-container .sidebar .pull-bottom .row .col-sm-12, .resetPassword-container .sidebar .pull-bottom .row .col-sm-12 { }
.login-container .sidebar .pull-bottom .logo-holder a, .resetPassword-container .sidebar .pull-bottom .logo-holder a { display: block; margin: 5px 0; }
.login-container .sidebar .pull-bottom .menu li, .resetPassword-container .sidebar .pull-bottom .menu li { float: right; margin-left: 20px; }
.login-container .sidebar .pull-bottom .change-lan, .resetPassword-container .sidebar .pull-bottom .change-lan { text-align: left; }
.login-container .sidebar .pull-bottom .change-lan select, .resetPassword-container .sidebar .pull-bottom .change-lan select { border: 1px solid #e5e5e5; padding: 2px 5px; border-radius: 3px; }
.login-container .content, .resetPassword-container .content {border-right: 0px solid #000; position: relative; width: 65%;background: url(../images/MiddleBg.png) top right no-repeat;background-position: right center;}
.login-container .content .messages, .resetPassword-container .content .messages {opacity: 0.8; width: 70%;border-right: 0px solid #4e7c8b;float: right}
.login-container .content .messages img, .resetPassword-container .content .messages img{}
.login-container .content .messages .item, .resetPassword-container .content .messages .item { margin: 250px 30px 30px; color: #fff; font-size: 17px; }
.resetPassword-container .content .messages .item { font-size: 14px;}
.resetPassword-container .content .messages .item h3 { font-size: 17px; margin-top: 10px }
.resetPassword-container .resultMessage { display: none }
.resetPassword-container .showMessage .resultMessage { display: block }
.login-container .content .messages .item p, .resetPassword-container .content .messages .item p { color: #fff; font-size: 15px; white-space: normal;line-height: 30px;max-width: 500px}
.login-container .content .footer, .resetPassword-container .content .footer { position: absolute; left: 0; bottom: 0; right: 0; color: #ddd; padding: 10px 30px; }
.login-container .sidebar .caption, .resetPassword-container .sidebar .caption { }
.login-container .sidebar .logo ,.resetPassword-container .sidebar .logo { text-align: center;margin: 20px 0 35px }
.login-container .sidebar .caption h4, .resetPassword-container .sidebar .caption h4 { color: #fff;margin: 0px auto;;height: 30px;}
.login-container .content .footer .copyright, .resetPassword-container .content .footer .copyright { text-align: left; padding: 20px 0 0; opacity: .7; filter: alpha(opacity=70); direction: ltr; }
.login-container .sidebar .footer-links, .resetPassword-container .sidebar .footer-links { margin-bottom: 20px; margin-top: 1px;}
.login-container .sidebar .footer-links .right-link ul li, .resetPassword-container .sidebar .footer-links .right-link ul li { float: right; }
.login-container .sidebar .footer-links .left-link ul li, .resetPassword-container .sidebar .footer-links .left-link ul li { float: left; }
.login-container .sidebar .footer-links div ul li, .resetPassword-container .sidebar .footer-links div ul li { font-family: almasfontText; margin: 0 2px; background-color: #fff;border-radius: 0; border: 1px solid #aaa;}
.login-container .sidebar .footer-links div ul li a, .resetPassword-container .sidebar .footer-links div ul li a { padding: 3px 7px; display: block; }
.login-container .sidebar .footer-links div ul li:hover, .resetPassword-container .sidebar .footer-links div ul li:hover { background-color: #45b6af; border-color: #45b6af; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -ms-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out; }
.login-container .sidebar .footer-links div ul li:hover a, .resetPassword-container .sidebar .footer-links div ul li:hover a { color: #fff; }
.login-container .sidebar .scroll, .resetPassword-container .sidebar .scroll{position: relative; display: block; padding:60px 55px 0; top: 0; bottom: 120px;overflow: auto;margin: 0 auto}
.multilogin-form .loginformgroup {border-radius: 5px;margin: 10px 0;background: #fff;overflow: hidden}
.login-container .loginForm .loginformgroup .form-group{ }
.login-container .loginForm .loginformgroup .group1{}
.login-container .loginForm .loginformgroup .group2{}
.login-container .loginForm .txtusername{ border-width: 0 0 1px 0;}
.login-container .loginForm .txtpassword{ border-width: 0;}
.login-container .loginForm .loginformgroup .col{ padding: 0;margin: 0}
.login-container .loginForm .validation-message{color: red;position: absolute;top: 10px;left: 7px;}
.login-container .captchabox {display: inline-flex;}
.login-container .captchabox .recaptcha {cursor: pointer;margin-top: 22px;color: #008080;font-size: 14px;width: 20px;height: 20px;}
.validation-summary-errors,.validation { width: 100%; text-align: center; font-family: almasfontText; font-size: 12px; color: #de5358;; }
.captcha-img { cursor: pointer;}
.validation-summary-valid { color: #555; border-radius: 10px; font-family: almasfontText; font-size: 11px; padding: 10px 36px; margin: 10px; }
.validation-summary-valid ul { font-weight: bold; text-transform: uppercase; background: #ffecec url('../Image/error.png') no-repeat 10px 50%; }
.forgetPasswordContainer { opacity: 0;border-radius: 0;height: 0;padding: 0 5px;overflow: hidden;z-index: 10; border-radius: 0; }
.showForgetPanel .forgetPasswordContainer { height: 370px;opacity: 1;}
.loginForm {opacity: 1;height: 460px;overflow: hidden;  }
.transition{-webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -ms-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out;}
.showForgetPanel .loginForm { height: 0; opacity: 0}
.success { margin:21px 0; background-color: #e8e8e8;color: black;padding:5px 10px;text-align: justify;height: auto}
.error   { margin:5px 0; background-color: #94bdb0;color: #a04040;padding: 10px;text-align: justify;border-radius: 5px;}
.forgetPasswordContainer button,.resetPasswordContainer button {width: 100%;margin-bottom: 5px;}
.form-group.row .col-sm-6 {float: none;width: 100%;}
.tab-select-app{ border-bottom: 1px solid rgb(89, 140, 151);display: inline-block;width: 100%;font-size: 12px}
.tab-select-app li{ border-radius: 5px 5px 0 0; cursor: pointer;padding:5px 10px;width: 50%;text-align: center;white-space: nowrap;line-height:25px}
.tab-select-app li.active{ background: rgb(90, 143, 153);color: #fff}
.list {margin: 10px 0 0;}
.list ul li {line-height: 16px;margin: 5px;}
.block-border{transition: all linear 500ms;overflow: hidden}
.fade {opacity: 0;height: 0}
.fade.ng-hide-remove,.fade.ng-hide-add {display: block !important;}
.language{ text-align: left;direction: rtl;padding: 5px;position: absolute;top: 10px;left: 10px;z-index: 9}
.language a{color:#fff}
.language .FA{font-family: tahoma}
.language .EN{font-family: tahoma}


@media (max-width: 1300px) {
    .login-container .sidebar, .resetPassword-container .sidebar {
        width: 50%;
        margin-right: 2%;
    }
    .login-container .content, .resetPassword-container .content{width: 50%}
}
@media (max-width:767px) {
    .login-container .sidebar, .resetPassword-container .sidebar { float: none; width: 100%; padding: 30px 25px; }
    .login-container .sidebar .scroll, .resetPassword-container .sidebar .scroll{ width: 100%;padding: 5px 10px}
    .login-container .sidebar, .resetPassword-container .sidebar { margin-right: 0px;}
    .login-container .sidebar .pull-bottom, .resetPassword-container .sidebar .pull-bottom{position: relative}
    .showForgetPanel .forgetPasswordContainer{height: auto}
}
@media (max-width:480px) {
    .login-container .sidebar, .resetPassword-container .sidebar {float: none;width: 100%;padding: 30px 5px;}
}
.disabled,.disabled *{opacity: 0.5;cursor: not-allowed;}
.disabled input[type="password"],.disabled input[type="text"],.disabled input[type="number"]{opacity: 0.5;background-color: gray;color: gray;}
.form-control[type="text"], .form-control[type="number"],.form-control[type="password"]:-webkit-autofill {-webkit-box-shadow: 0 0 0px 1000px #fff inset !important;}

@keyframes blink {
    from {
        background-color: rgb(140, 193, 203);
    }
    to {
        background-color: rgb(60, 113, 123);
    }
}
