/*#region public*/

:root {
    --color-orange: #f8981d;
    --color-blue: #73A1FB;
    /*--color-blue: #456c86;*/

    --color-orange__hover: #FF6600;
    --color-blue__hover: #5779BE;
    /*--color-blue__hover: #3c5f77;*/

    --title-color: #232323;
    --body-color: #6f6f6f;

    --transition-style: all 0.3s ease-out;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--title-color, #232323);
}

body {
    direction: rtl;
    text-align: right;
    font-size: 14px;
    font-family: vazir, sans-serif;
    overflow-x: hidden;
    position: relative;
    background-color: #fff;
    font-weight: 400;
    color: var(--body-color, #6f6f6f);
    padding: 0;
    margin: 0;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
}

a,
a:hover,
a:focus,
a:active,
a:link {
    text-decoration: none;
}

a {
    color: inherit;
}

a:focus,
button:focus,
.btn.focus,
input:focus,
.form-control:focus,
select:focus,
textarea:focus {
    /*color: #495057;*/
    /*background-color: #fff;*/

    box-shadow: none;
    outline: 0;
    outline-offset: .05em;
    border-color: transparent;
}

input, textarea, a, button, .btn {
    -moz-transition: var(--transition-style);
    -o-transition: var(--transition-style);
    -webkit-transition: var(--transition-style);
    -ms-transition: var(--transition-style);
    transition: var(--transition-style);

}

ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.-hover:hover, .-hover:focus {
    /*background: #3c5f77 !important;*/
    background: var(--color-blue__hover) !important;
    /*background: rgb(51, 153, 255) !important;*/
}

.-hoverActive:hover, .-hoverActive:focus {
    /*background: #f8981d !important;*/
    background: var(--color-orange__hover);
}

.invalid {
    box-shadow: 0 0 1px 1px red;
    border-radius: 3px;
}

img {
    font-weight: 300;
    text-align: center;
    position: relative;
    /*flex: 1 1 auto;*/
}

/*img::before {*/
/*    content: " ";*/
/*    display: block; */

/*    position: absolute;*/
/*    top: 0;*/
/*    left: 0;*/
/*    height: 100%;*/
/*    width: 100%;*/
/*    background-color: rgb(230, 230, 230);*/
/*    border: 1px dotted rgb(200, 200, 200);*/
/*    border-radius: 3px;*/
/*}*/

/*img::after {*/
/*    !*content: "\f127" " Broken Image of " attr(alt);*!*/
/*    content: url("../media/images/svg/image-not-found.svg") " broken Image of " attr(alt);*/
/*    display: block;*/
/*    font-size: 10px;*/
/*    font-style: normal;*/
/*    !*font-family: FontAwesome, sans-serif;*!*/
/*    !*color: #646464;*!*/

/*    position: absolute;*/
/*    top: calc(50% - 10px);*/
/*    left: calc(50% - 10px);*/
/*    width: 20px;*/
/*    text-align: center;*/
/*}*/
.my-btn {
    color: #fff !important;
    border-radius: 3px;
    padding: 6px 10px;
    width: 140.5px;
    font-size: 14px;
    display: inline-block;
    transition: var(--transition-style);
    margin: 0 7px;
    text-align: center;
}

.my-btn-primary {
    background: var(--color-blue);
    border-color: var(--color-blue__hover);
}

.my-btn-default {
    background: var(--color-orange);
    border-color: var(--color-orange__hover);
}

html, body {
    height: 100%;
}

.main {
    height: 100%;
    display: flex;
    flex-direction: column;
    min-height: 100%;
}

.main > .authPage {
    flex: 1;
}

.form-group .form-control {
    border: none;
    height: 50px;
    background-color: rgba(247, 247, 249, 0.7);
    padding-right: 1.25rem;
    padding-left: 1.25rem;
    -webkit-transition: background-color 0.3s ease;
    transition: background-color 0.3s ease;
}

.input-group-text {
    border: rgba(247, 247, 249, 0.7);

}

.userPanel-checkbox-inline label {
    margin-bottom: 0;
}

.userPanel-checkbox-list .userPanel-checkbox {
    text-align: right;
    display: block;
}

.userPanel-checkbox > input {
    position: absolute;
    z-index: -1;
    opacity: 0;
}

input[type="radio"], input[type="checkbox"] {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0;
}

button, input {
    overflow: visible;
}

input, button, select, optgroup, textarea {
    margin: 0;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}

.userPanel-checkbox > input:checked ~ span {
    border: 1px solid #c8cfdd;
}

.userPanel-checkbox:hover > input:not([disabled]):checked ~ span, .userPanel-checkbox > input:checked ~ span {
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.userPanel-checkbox-list .userPanel-checkbox {
    text-align: right;
    display: block;
}

.form-group label {
    font-weight: 400;
}

.userPanel-checkbox > input:checked ~ span {
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    background: none;
}

.userPanel-checkbox > span {
    border: 1px solid #d1d7e2;
}

.userPanel-checkbox > span {
    border-radius: 3px;
    background: none;
    position: absolute;
    top: 1px;
    right: 0;
    height: 15px;
    width: 15px;
}

.userPanel-checkbox > input:checked ~ span::after {

    display: block;

}

.userPanel-checkbox > span::after {

    border: solid #bfc7d7;
    border-top-width: medium;
    border-right-width: medium;
    border-bottom-width: medium;
    border-left-width: medium;

}

.userPanel-checkbox > span::after {

    content: '';
    position: absolute;
    display: none;
    top: 50%;
    right: 50%;
    margin-right: -2px;
    margin-top: -6px;
    width: 5px;
    height: 10px;
    border-width: 0 2px 2px 0 !important;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);

}

.userPanel-checkbox {
    display: inline-block;
    position: relative;
    padding-right: 20px;
    padding-left: 30px;
    margin-bottom: 10px;
    text-align: right;
    cursor: pointer;
    /*font-size: 1rem;*/
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

svg#goHome:hover path:last-of-type {
    fill: var(--color-orange);
}

/*#endregion*/

/*#region rightBox*/
.subFooter--containerBox {
    display: flex;
    justify-content: space-between;
    border-top: 1px dashed #bdbfc1;
    flex: 1 1 auto;
    padding-top: 5px;
    margin-top: 5px;
}

.footer--subFooter p {
    margin: 0;
    /*width: 33.333%;*/
}

.rightBox {
    /*width: 35%;*/
    /*background-image: url("../media/images/auth/1.jpg");*/
    background-image: url("../media/images/auth/bg-2.png");
    /*background-image: url("../media/images/java-logo/java.svg");*/
    /*background-position: center center;*/
    /*background-size: cover;*/
    background-size: 100% 100%;
    background-repeat: no-repeat;
    position: relative;

    /*background-blend-mode: luminosity;*/
    /*background-color: var(--color-blue);*/

    display: flex;
    flex: 1 1 30%;
    flex-direction: column;
}

.rightBox * {
    color: #fff;
}

.rightBox--outerWrapper {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-content: space-between;
    flex: 1 1 auto;
    padding: 1rem;
}

.list-inline-item:not(:last-child) {
    margin-left: .5rem;
    margin-right: 0;
}

/*#endregion*/

/*#region leftBox*/
.submitBtn, .closeBtn {
    color: #fff;
    padding: 6px 8px;
    width: 140.5px;
    border: none;
}

.leftBox {
    /*width: 65%;*/
    display: flex;
    flex: 1 1 70%;
    position: relative;

}

.leftBox--outerWrapper {
    display: flex;
    flex: 1;
    align-self: center;
    justify-content: center;
    padding: 2rem 0;
}

.leftBox--outerWrapper form {
    width: 100%;
    max-width: 450px;
}

.socials a:last-child {
    margin-left: 0;
}

.socials a:first-child {
    margin-right: 0;
}

.authPage .login__divider:not(:first-child):not(:last-child) {
    font-weight: 400;
    color: #b5b2c3;
    font-size: 1rem;
}

.authPage .login__divider {
    margin: 1rem 0 1rem 0;
}

.divider {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.divider > span:first-child {
    width: 100%;
    height: 1px;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    background: #EBECF1;
    display: inline-block;
}

.divider > span:not(:first-child):not(:last-child) {
    padding: 0 2rem;
}

.divider > span:last-child {
    width: 100%;
    height: 1px;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    background: #EBECF1;
    display: inline-block;
}

.registerBtnContainer {
    background-color: var(--color-blue);
    transform: skew(45deg);

    position: absolute;
    left: 1rem;
    top: 1rem;

}

.submitBtn:hover, .submitBtn:focus {
    background: var(--color-orange__hover);
}

.socials a:hover, .socials a:focus {
    filter: brightness(1.2);
    /*filter: invert(50%);*/
}

.privacy, .forgotPassword {
    color: var(--color-blue);
    text-decoration: underline !important;
    font-weight: 500;
}

.privacy:hover, .forgotPassword:hover {
    color: var(--color-blue__hover);
}

.gmailBtn {
    background-color: #fd397a;
    border-color: #fd397a;
}

.twitterBtn {
    background-color: #5578eb;
    border-color: #5578eb;
}

.facebookBtn {
    background-color: #5867dd;
    border-color: #5867dd;
}

.ma {
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    height: 21px;
    width: 21px;
    vertical-align: middle;
}

.ma-gmail {
    margin-left: 5px;
    background-image: url("../media/images/auth/google-plus.svg");
}

.ma-email {
    background-image: url("../media/images/panel/arroba.svg");

}

.ma-phone {
    background-image: url("../media/images/svg/phone-solid.svg");
}

.ma-twitter {
    margin-left: 5px;
    background-image: url("../media/images/auth/twitter.svg");
}

.ma-facebook {
    margin-left: 5px;
    background-image: url("../media/images/auth/facebook-logo.svg");
}

.ma-github {
    margin-left: 5px;
    background-image: url("../media/images/auth/github.png");
}

.ma-sms {
    margin-left: 5px;
    background-image: url("../media/images/auth/sms.svg");
}

.ma-register {
    margin-left: 5px;

    background-image: url("../media/images/auth/contract.svg");
}

.ma-login {
    margin-left: 5px;

    background-image: url("../media/images/auth/login(2).svg");
}

.ma-lock {
    background-image: url("../media/images/auth/lock(1).svg");
}

.ma-refresh {
    background-image: url("../media/images/svg/refresh.svg");
}

/*#endregion*/

.modal-footer {
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.modal-header .close {
    margin: -1rem auto -1rem -1rem;
}

.modal-title {
    color: var(--title-color);
}

.captchaImageContainer img {
    width: 100%;
}

@media (max-width: 991.98px) {
    form {
        padding: 1rem 2rem;
    }
}

@media (max-width: 767.98px) {
    .subFooter--containerBox {
        flex: 1 1 auto;
        text-align: right;
        flex-wrap: wrap;
    }
}

@media (max-width: 575.98px) {
    form {
        padding: 2rem 1rem;
    }

    .main > .authPage {
        flex-direction: column;
    }

    .rightBox {
        flex: 1 1 100vh;
    }

}

@media (max-width: 400px) {
    .socials {
        flex: 1 1 100%;
        flex-wrap: wrap;
        justify-content: center;
        flex-direction: column;
        align-items: center;
    }

    .socials a {
        flex-grow: 1;
        width: 100%;
        margin: 0 0 1rem 0;

    }
}