/** GLOBAL CLASSES **/
@font-face {
    font-family: IRANSans;
    src: url('../fonts/IRANSansWeb/IRANSansWeb.eot');
    src: url('../fonts/IRANSansWeb/IRANSansWeb.eot') format('embedded-opentype'), url('../fonts/IRANSansWeb/IRANSansWeb(FaNum).woff') format('woff'), url('../fonts/IRANSansWeb/IRANSansWeb.ttf') format('truetype');
    font-weight: 400;
    font-style: normal
}
@font-face {
    font-family: dana;
    src: url('../fonts/dana/dana-fanum-medium.eot');
    src: url('../fonts/dana/dana-fanum-medium.eot') format('embedded-opentype'), url('../fonts/dana/dana-fanum-medium.woff') format('woff'), url('../fonts/dana/dana-fanum-medium.ttf') format('truetype');
    font-weight: 400;
    font-style: normal
}

body {
    font-family: 'IRANSans', sans-serif;
    color: #535353;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 , .form-label , .waviy{
    font-family: 'dana', sans-serif;
}

.img-fluid {
    max-width: 100% !important;
    height: auto;
}

.form-control:focus {
    box-shadow: none;
}

.login-box .alert{
    padding: 15.5px 20px;
    font-size: 13.5px;
    border: none !important;
    border-radius: 3px;
    margin-bottom: 25px;
}

.login-box .alert-dismissible .btn-close{
    padding: 18.5px 19px;
    background-size: 8px;
}

.login-box .alert-dismissible .btn-close:focus,
.login-box .alert-dismissible .btn-close:active {
    box-shadow: none;
}

.login-box .password-indicator {
    position: absolute;
    left: 15px;
    top: 17px;
    cursor: pointer;
    visibility: hidden;
    opacity: 0;
    transition: visibility 0s linear 300ms, opacity 500ms;
    font-size: 17px;
    color: #999;
}

.login-box .password-wrapper:hover .password-indicator{
    visibility: visible;
    opacity: 1;
    transition: visibility 0s linear 0s, opacity 500ms;
    font-size: 17px;
    color: #555;
}

.login-box .login-popover{
    font-size: 14px;
    color: #777;
    cursor: help;
}

.login-box .login-popover-abs{
    position: absolute;
    left: 15px;
    top: 15px;
}

.popover {
    border: 1px solid #ebeef5 !important;
    box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%);
}

.popover-header {
    box-shadow: none;
    border: 0px;
    background: #fff;
    color: #555;
    font-size: 15px;
    padding-bottom: 5px;
}

.popover-body {
    padding: 5px 10px 10px 16px;
    color: #777;
    font-size: 13px;
}

.login-box .form-group label.error{
    font-size: 13px;
    text-align: right;
    color: #535353;
    width: 100%;
}




/** Login admin start **/
.login-admin{
    min-height: 100vh;
    position: relative;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 30px 0;
    background: url(../img/img-19.jpg) top left repeat;
    background-size: cover;
}

.login-admin .container {
    max-width: 1120px;
    margin: 0 auto;
}

.login-admin a {
    text-decoration: none;
}

.login-admin .form-info {
    justify-content: center;
    align-items: center;
    padding: 100px 80px;
    background: #fff;
}

.login-admin .form-check-input:checked {
    display: none;
}

.login-admin .login-inner-form .form-group {
    margin-bottom: 25px;
}

.login-admin .login-inner-form .form-box {
    float: left;
    width: 100%;
    position: relative;
}

.login-admin .login-inner-form .form-control {
    font-size: 15px;
    outline: none;
    color: #535353;
    border-radius: 3px;
    font-weight: 500;
    border: 1px solid transparent;
    background: #fff;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
    padding: 12px 20px 12px 45px;
    height: 55px;
}

.login-admin .login-inner-form img {
    margin-bottom: 5px;
    height: 40px;
}

.login-admin .login-inner-form .form-box i {
    position: absolute;
    top: 13px;
    left: 20px;
    font-size: 19px;
    color: #535353;
}

.login-admin .login-inner-form label{
    font-weight: 500;
    font-size: 14px;
    margin-bottom: 5px;
}

.login-admin .login-inner-form .forgot{
    margin: 0;
    line-height: 45px;
    color: #535353;
    font-size: 15px;
    float: right;
}

.login-admin .bg-img {
    background: url(../img/img-21.jpg) top left repeat;
    background-size: cover;
    top: 0;
    bottom: 0;
    opacity: 1;
    z-index: 999;
    position: relative;
    display: flex;
}

.login-admin .login-box{
    background: #fff;
    margin: 0 auto;
    box-shadow: 0 0 35px rgba(0, 0, 0, 0.1);
}

.login-admin .form-section .form-box {
    float: left;
    width: 100%;
    text-align: left;
    position: relative;
}

.login-admin .login-inner-form .btn-md {
    cursor: pointer;
    color: #fff;
    padding: 0 50px;
    height: 55px;
    font-size: 15px;
    font-weight: 400;
    border-radius: 3px;
}

.login-admin .login-inner-form input[type=checkbox], input[type=radio] {
    margin-right: 3px;
}

.login-admin .login-inner-form p{
    margin: 0;
    color: #535353;
}

.login-admin .login-inner-form p a{
    color: #535353;
}

.login-admin .login-inner-form button:focus {
    outline: none;
    outline: 0 auto -webkit-focus-ring-color;
}

.login-admin .login-inner-form .btn-theme.focus, .btn-theme:focus {
    box-shadow: none;
}

.login-admin .login-inner-form .btn-theme {
    background: #15d0ad;
    border: none;
    color: #fff;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}

.login-admin .login-inner-form .btn-theme:hover {
    background: #12bf9f;
}

.login-admin .logo{
    height: 30px;
    top: 30px;
    left: 30px;
    position: absolute;
}

.login-admin .logo img{
    height: 25px;
}

.login-admin .logo-2{
    margin-bottom: 15px;
    display: none;
}

.login-admin .logo-2 img{
    height: 30px;
}

.login-admin .nav-pills li{
    display: inline-block;
}

.login-admin .login-inner-form .checkbox {
    margin-bottom: 25px;
    font-size: 14px;
}

.login-admin .login-inner-form .form-check{
    float: right;
    margin-bottom: 0;
    padding-right: 0;
}

.login-admin .login-inner-form .form-check a {
    color: #d6d6d6;
    /*float: left;*/
}

.login-admin .login-inner-form .form-check-input {
    position: absolute;
    margin-right: 0;
}

.login-admin .login-inner-form .form-check label::before {
    content: "";
    display: inline-block;
    position: absolute;
    width: 18px;
    height: 18px;
    top: 2px;
    margin-right: -25px;
    border: none;
    border-radius: 3px;
    background: #fff;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}

.login-admin .login-inner-form .form-check-label {
    padding-right: 25px;
    margin-bottom: 0;
    font-size: 15px;
    color: #535353;
}

.login-admin .login-inner-form .checkbox-theme input[type="checkbox"]:checked + label::before {
    color: #fff;
    background:#15d0ad;
}

.login-admin .login-inner-form input[type=checkbox]:checked + label:before {
    font-weight: 600;
    color: #fff;
    line-height: 18px;
    font-size: 12px;
    content: "\2713";
    padding-left: 4px;
}

.login-admin .btn-section {
    top: 40%;
    position: absolute;
    right: 0;
    display: inline-block;
    margin-bottom: 0;
}

.login-admin .btn-section .link-btn {
    font-size: 12px;
    float: right;
    text-align: right;
    font-weight: 600;
    border-radius: 0;
    width: 100%;
    color: #fff;
    text-decoration: none;
    text-decoration: blink;
    background: rgb(102 102 102 / 31%);
}

.login-admin .bs2 .link-btn{
    margin: 0 0 5px;
}

.login-admin .btn-section .default-bg{
    background: #fff;
    color: #505050;
}

.login-admin .btn-section .btn-1{
    line-height: 45px;
    text-align: center;
    width: 100px;
    text-transform: uppercase;
    border-radius: 50px 0 0 50px;
}

.login-admin .login-inner-form input[type=checkbox], input[type=radio] {
    margin-top: 4px;
}

.login-admin .login-inner-form .checkbox a {
    font-size: 15px;
    color: #535353;
    /* float: left;*
     margin-right: 3px;*/
}

.login-admin .form-section{
    text-align: center;
}

.login-admin .form-section h3{
    margin: 0 0 40px;
    font-size: 21px;
    font-weight: 400;
    color: #040404;
}

.login-admin .form-section .text {
    font-size: 15px;
    margin-top: 25px;
    margin-bottom: 0;
    color: #535353;
}

.login-admin .form-section .text a{
    color: #535353;
}

.login-admin .social-list{
    bottom: 20px;
    position: absolute;
    left: 0;
    padding: 0;
    margin: 0;
    list-style: none;
}

.login-admin .social-list a {
    width: 60px;
    height: 50px;
    line-height: 50px;
    margin-bottom: 5px;
    text-align: center;
    display: inline-block;
    font-size: 15px;
    color: #fff;
    border-radius: 0 50px 50px 0;
    background: rgb(102 102 102 / 31%);
}

.login-admin .facebook-bg:hover {
    background: #3b589e;
}

.login-admin .twitter-bg:hover {
    background: #33CCFF;
}

.login-admin .google-bg:hover {
    background: #db4437;
}

.login-admin .linkedin-bg:hover {
    background: #1c82ca;
}

.login-admin .pinterest-bg:hover {
    background: #a30618;
}

/** MEDIA **/
@media (max-width: 992px) {
    .login-admin .bg-img{
        display: none;
    }

    .login-admin .logo-2{
        display: block;
    }

    .login-admin .form-info {
        padding: 50px 30px;
    }

    .login-admin .login-box{
        max-width: 600px;
        margin: 0 auto;
    }
}

@media (max-width: 768px) {
    .login-admin .form-info{
        padding: 60px 30px;
    }
}
/** Login admin end **/






/** Login 1 start **/
.login-web .form-section {
    min-height: 100vh;
    position: relative;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 30px 15px;
    background: #fff2f2;
}

.login-web h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    color: #040404;
}

.login-web a {
    text-decoration: none;
    color: #535353;
}

.login-web .form-section p p{
    color: #535353;
}

.login-web .form-inner {
    max-width: 500px;
    width: 100%;
    margin: auto;
}

.login-web .bg-img {
    background: url(../img/img-1.jpg) top left repeat;
    background-size: cover;
    z-index: 999;
    min-height: 100vh;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 30px;
}

.login-web .bg-img:before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgb(36 10 99 / 74%);
}

.login-web .form-section .extra-login {
    margin-bottom: 25px;
    position: relative;
}

.login-web .form-section .extra-login::before {
    position: absolute;
    left: 0;
    top: 10px;
    width: 100%;
    height: 1px;
    background: #d8dcdc;
    content: "";
}

.login-web .form-section .extra-login > span {
    padding: 1px 20px;
    position: relative;
    font-size: 15px;
    color: #535353;
    background: #fff2f2;
}

.login-web .form-section .form-check-input {
    width: 20px;
    height: 20px;
    margin-top: 0px;
    position: absolute;
    border-radius: 2px;
    border: none;
    background-color: #fff;
    margin-right: -22px;
}

.login-web .form-check-input:focus {
    border-color: snow;
    outline: 0;
    box-shadow: none;
}

.login-web .form-check-input:checked {
    background-color: #f5c025!important;
}

.login-web .form-section p {
    margin-bottom: 0;
    font-size: 15px;
}

.login-web .form-section ul {
    list-style: none;
    padding: 0 0 50px 0;
    margin: 0 0 20px;
    display: flex;
    justify-content: center;
}

.login-web .form-section .social-list li {
    display: inline-block;
    margin-bottom: 5px;
}

.login-web .form-section .thembo {
    margin-right: 4px;
}

.login-web .form-section h3 {
    margin: 0 0 25px;
    font-size: 18px;
    font-weight: 400;
}

.login-web .form-section .form-group {
    margin-bottom: 25px;
}

.login-web .form-section .form-control {
    padding: 11px 20px 9px;
    font-size: 15px;
    outline: none;
    height: 50px;
    color: #535353;
    border-radius: 3px;
    font-weight: 500;
    border: 1px solid transparent;
    background: #fff;
}

.login-web .form-section .form-check {
    margin-bottom: 0;
}

.login-web .form-section .form-check-label {
    padding-right: 5px;
    font-size: 15px;
    color: #535353;
}

.login-web .form-section a.forgot-password {
    font-size: 15px;
}

.login-web .form-section a.forgot-password:hover{
    color: #535353;
}

.login-web .logo img {
    margin-bottom: 15px;
    height: 25px;
}

.login-web .btn-theme {
    position: relative;
    display: inline-block;
    border: none;
    outline: none !important;
    color: #ffffff;
    text-transform: capitalize;
    transition: all 0.3s linear;
    z-index: 1;
    overflow: hidden;
    cursor: pointer;
    font-size: 15px;
    font-weight: 400;
    border-radius: 3px;
    width: 100%;
}

.login-web .btn-theme:after {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    content: "";
    border-radius: 3px;
    transform: perspective(200px) scaleX(0.1) rotateX(90deg) translateZ(-10px);
    transform-origin: bottom center;
    transition: transform 0.4s linear, transform 0.4s linear;
    z-index: -1;
}

.login-web .btn-theme:hover:after {
    transform: perspective(200px) scaleX(1.05) rotateX(0deg) translateZ(0);
    transition: transform 0.4s linear, transform 0.4s linear;
}

.login-web .btn-lg{
    padding: 0 50px;
    line-height: 50px;
}

.login-web .btn{
    box-shadow: none!important;
}

.login-web .btn-primary{
    background: #f5c025;
}

.login-web .btn-primary:after {
    background: #e3af18;
}

.login-web .social-list{
    display: inline-flex;
    margin-bottom: 27px;
}

.login-web .social-list .icon {
    position: relative;
    background: #f3f3f3;
    border-radius: 3px;
    margin: 0 4px 3px 0;
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    color: #ffffff;
}

.login-web .social-list .tooltip {
    position: absolute;
    top: 0;
    font-size: 14px;
    background-color: #ffffff;
    color: #ffffff;
    padding: 5px 8px;
    border-radius: 5px;
    box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1);
    opacity: 0;
    pointer-events: none;
    transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.login-web .social-list .tooltip::before {
    position: absolute;
    content: "";
    height: 8px;
    width: 8px;
    background-color: #ffffff;
    bottom: -3px;
    left: 50%;
    transform: translate(-50%) rotate(45deg);
    transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.login-web .social-list .icon:hover .tooltip {
    top: -45px;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.login-web .social-list .icon:hover span,
.login-web .social-list .icon:hover .tooltip {
    text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.1);
}

.login-web .social-list .facebook{
    background: #3b5999;
}

.login-web .social-list .facebook:hover .tooltip,
.login-web .social-list .facebook:hover .tooltip::before {
    background: #3b5999;
}

.login-web .social-list .twitter{
    background: #46c1f6;
}

.login-web .social-list .twitter:hover .tooltip,
.login-web .social-list .twitter:hover .tooltip::before {
    background: #46c1f6;
}

.login-web .social-list .instagram{
    background: #db4437;
}

.login-web .social-list .instagram:hover .tooltip,
.login-web .social-list .instagram:hover .tooltip::before {
    background: #db4437;
}

.login-web .social-list .github{
    background: #2392e0;
}

.login-web .social-list .github:hover .tooltip,
.login-web .social-list .github:hover .tooltip::before {
    background: #2392e0;
}

.login-web .lines {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 100%;
    z-index: -1;
}

.login-web .line {
    position: absolute;
    width: 5px;
    height: 100%;
    top: 0;
    left: 50%;
    background: rgba(255, 255, 255, 0.1);
    overflow: hidden;
}

.login-web .line::after {
    content: '';
    display: block;
    position: absolute;
    height: 15vh;
    width: 100%;
    top: -50%;
    left: 0;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #ffffff 75%, #ffffff 100%);
    animation: drop 7s 0s infinite;
    animation-fill-mode: forwards;
    animation-timing-function: cubic-bezier(0.4, 0.26, 0, 0.97);
    z-index: -888;
}

.login-web .line:nth-child(1) {
    margin-left: -40%;
}

.login-web .line:nth-child(1)::after {
    animation-delay: 1s;
}

.login-web .line:nth-child(3) {
    margin-left: 40%;
}

.login-web .line:nth-child(3)::after {
    animation-delay: 2s;
}

.login-web .line:nth-child(4) {
    margin-left: -20%;
}

.login-web .line:nth-child(4)::after {
    animation-delay: 3s;
}

.login-web .line:nth-child(5) {
    margin-left: 20%;
}

.login-web .line:nth-child(5)::after {
    animation-delay: 4s;
}

@keyframes drop {
    0% {top: -50%; }
    100% {top: 110%; }
}

.login-web .info{
    max-width: 650px;
}

.login-web  .animated-text h1{
    display: block;
    text-shadow: 0 0 80px rgba(255, 255, 255, 0.5);
    background: url(../img/animated-text.png) repeat-y;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-animation: aitf 80s linear infinite;
    -webkit-transform: translate3d(0, 0, 0);
    -webkit-backface-visibility: hidden;
}

.login-web .info h1 {
    font-size: 35px;
    color: #fff;
    font-weight: 700;
    margin-bottom: 30px;
    text-transform: uppercase;
}

.login-web .info p {
    margin-bottom: 0;
    color: #fff;
    opacity: 0.9;
    line-height: 28px;
}

.hidden{
    display: none;
}
@media (max-width: 992px){
    .login-web .none-992 {
        display: none !important;
    }
}
