﻿@font-face {
    font-family: 'Vazir';
    src: url('../Font/vazir/Vazir.ttf') format('truetype');
}

::-webkit-scrollbar {
    width: 5px;
    border-radius: 10px
}

::-webkit-scrollbar-track {
    background-color: darkgrey;
}

::-webkit-scrollbar-thumb {
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}

* {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    font-family: Vazir
}

.besm-title {
    text-align: center
}

.besm {
    width: 200px;
    height: auto;
}

.space-5 {
    margin: 150px 0px;
}

.login-form {
    /*   margin: 10px;
    width: 600px*/
}

    .login-form input {
        font-size: 16px;
        font-weight: normal;
        background: rgba(57, 57, 57, 0.07);
        margin: 12.5px 0;
        height: 68px;
        border: none !important;
        padding: 0 30px;
        border-radius: 10px;
    }

        .login-form input:focus-visible {
            border: 0 !important
        }

    .login-form .btn-login {
        background: -webkit-linear-gradient(110deg, #f794a4 0%, #fdd6bd 100%);
        background: -o-linear-gradient(110deg, #f794a4 0%, #fdd6bd 100%);
        background: linear-gradient(-20deg, #f794a4 0%, #fdd6bd 100%);
        border: none;
        width: 241px;
        height: 58px;
        text-transform: uppercase;
        color: white;
        border-radius: 10px;
        font-weight: bold;
        font-size: 20px;
        -webkit-transition: 0.3s ease-in-out;
        -o-transition: 0.3s ease-in-out;
        transition: 0.3s ease-in-out;
    }

.btn-login:hover {
    color: white !important;
    -webkit-transition: 0.3s ease-in-out;
    -o-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
    background: -webkit-gradient(linear, left bottom, left top, from(#09203f), to(#537895));
    background: -webkit-linear-gradient(bottom, #09203f 0%, #537895 100%);
    background: -o-linear-gradient(bottom, #09203f 0%, #537895 100%);
    background: linear-gradient(to top, #09203f 0%, #537895 100%);
}

.content-right-bottom {
    margin-top: 100px;
}

.login-form a {
    cursor: pointer;
    text-decoration: none;
    color: #537895
}

.bg-illustration {
    background-size: contain;
    -webkit-animation: bgslide 1.1s forwards;
    animation: bgslide 2.1s forwards;
}

@-webkit-keyframes bgslide {
    from {
        left: -100%;
        width: 0;
        opacity: 0;
    }

    to {
        right: 0;
        width: 100%;
        opacity: 1;
    }
}

@keyframes bgslide {
    from {
        left: -100%;
        width: 0;
        opacity: 0;
    }

    to {
        right: 0;
        width: 100%;
        opacity: 1;
    }
}
