@font-face {
    font-family: 'Shabnam';
    src: url('../persian-font/shabnam/Shabnam-FD-WOL.eot') format('embedded-opentype');
}

@font-face {
    font-family: 'Shabnam';
    src: url('../persian-font/shabnam/Shabnam-FD-WOL.ttf') format('truetype');
}

@font-face {
    font-family: 'Shabnam';
    src: url('../persian-font/shabnam/Shabnam-FD-WOL.woff') format('woff');
}

@font-face {
    font-family: 'Shabnam';
    src: url('../persian-font/shabnam/Shabnam-FD-WOL.woff2') format('woff2');
}

html {
    direction: rtl;
    text-align: right;
}

*,
body {
    font-family: Shabnam,tahoma;
}

body {
    text-align: right;
    font-size: 14px;
}

html, body {
    height: 100%;
}

/*rasoul nevesht*/

/*start faq style*/

/*end faq style*/

.w-88 {
    width: 88%;
}
.register-title {
    font-family: titr;
    font-size: 22pt !important;
    color: #fff;
}
@media(max-width: 550px) {
    .register-title {
        font-size: 18pt !important;
    }
}
.register-caption {
    font-size: 10pt;
    color: #4effd6;
}
@keyframes send{
    0%{
        transform:translate(0,0);
    }
    35%{
        transform:translate(15px,-5px);
    }
    70% {
        transform: translate(5px,-15px)
    }
    100% {
        transform: translate(15px,-25px)
    }
           }
@keyframes scale {
    0% {
        transform: scale(0.9,0.9);
    }

    50% {
        transform: scale(1,1)
    }

    100% {
        transform: scale(0.9,0.9);
    }
}
.icon-plane-r {
    margin: 15px 0;
    margin-bottom: 25px;
    transition: linear 5s;
    animation: send 5s infinite;
    color: white;
}
.form-control-special{
    border-radius:42px !important;
}
.scale{
    animation:scale 1s infinite;
}
.form-row{
    text-align:center;
}
.about-title-container {
text-align:center;
margin-bottom: 75px;
}
.about-title{
    margin:0 auto !important;
}
.about-description{
    line-height:30px;
}
.customer-img-circle-box {
    z-index: 100000;
    width: 150px;
    height: 150px;
    margin: 20px auto 0px auto !important;
    padding: 8px;
    display: inline-flex;

}
.customer-img-circle {
    max-width: 90% !important;
    max-height: 90% !important;
}
    .customer-img-circle-box:hover{
        /*box-shadow:0 0 15px rgba(30,30,30,0.2);*/
        transition: all 1s;
    }
.customer-main-container{
    transition:500ms linear;
}
.customer-main-container:hover {
    transform: scale(1.02,1.02);
}
.customer-container {
    width: 100%;
    height: 300px;
    background-color: white;
    padding: 80px 7px 0 7px;
    border-radius: 15px;
    border: 1px solid;
    margin-top: -70px;
}
    .customer-container:hover {
        box-shadow: 0 0 15px rgba(30,30,30,0.2);
    }
    .customer-container::before{
        font-family: "Font Awesome 5 Pro";
        content: '\f10e';
        position: absolute;
        top: 156px;
        right: 20px;
        font-size: 14pt;
    }
    .customer-container::after {
        font-family: "Font Awesome 5 Pro";
        content: '\f10d';
        position: absolute;
        bottom: 5px;
        left: 20px;
        font-size: 14pt;
    }
        .customer-title {
            font-size: 18px;
            font-weight: bold;
        }
.customer-description{
    text-align:right;
}
/*rasoul nevesht*/
@media (min-width: 768px) {
    .np-order {
        display: flex;
        min-height: 100%;
        -webkit-align-items: center;
        align-items: center;
    }
}

.form-icon {
    display: inline-block;
    width: 30px;
    height: 30px;
    background-color: white;
    border-radius: 50px;
}
.tbl-specification tbody tr td .caption {
    font-size: unset;
}

.custom-container {
    margin: 30px auto;
    padding: 2rem;
    border-radius: 5px;
    /*background: url('/assets/img/blurbg.jpg')no-repeat center center;*/
    background-size: cover;
    background-color: #2988af;
}

@media (min-width:768px) {
    .custom-container {
        padding: 2.5rem 3.3rem;
        padding-left: 1rem;
        border-radius: 75px 15px 15px 15px;
        /*background: url('/assets/img/order-bg.jpg')no-repeat center center;*/
        background-color: #2988af;
    }
}

@media (min-width:1200px) {
    .container {
        max-width: 1050px;
    }
}

/*np-custom-control*/
.np-custom-control {
    padding-right: 1.5rem;
    padding-left: 0;
    margin-right: 0;
    margin-left: 1rem;
    color: white;
}

    .np-custom-control .custom-control-label {
        cursor: pointer;
    }

        .np-custom-control .custom-control-label:before {
            right: -1.5rem;
            left: auto;
        }

        .np-custom-control .custom-control-label:after {
            right: -1.5rem;
            left: auto;
        }

.privacy-link {
    color: #4effd6;
    text-decoration: none;
    transition: .1s linear;
}

    .privacy-link:hover {
        color: #71d6ff;
        text-decoration: none;
    }

.main-form {
    background: #226b96;
    padding: 1.5rem;
    border-radius: 15px;
}

@media (min-width: 768px) {
    .main-form {
        background: #226b96;
        padding: 2.5rem;
        border-radius: 25px;
        /* border-top-left-radius: 10% 50%;
        border-bottom-left-radius: 10% 50%;*/
    }
}

@media (min-width:992px) {
    .main-form {
        padding: 2.5rem 6rem;
    }
}


.btn {
    font-size: .9rem;
    transition: 0.3s;
}

    .btn:hover {
        box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2), 0 4px 18px 0 rgba(0, 0, 0, 0.14);
    }

.btn-side {
    font-weight: bold;
    font-size: .75rem;
    color: #005c97;
    /*background: #fff;*/
}

/*side-content*/
.side-content {
    text-align: center;
    color: #fff;
}

.icon {
    margin-bottom: .75rem;
    -webkit-animation: mover 4s infinite alternate;
    animation: mover 4s infinite alternate;
}

.caption {
    font-size: 1.5rem;
    margin-bottom: 1rem;
}

.description {
    font-size: .85rem;
    line-height: 1.8;
    color: #efefef;
}


.page-caption {
    font-size: 1.2rem;
    color: #333;
    color: #0c7796;
    color: #007bff;
    line-height: 1.5;
    margin-bottom: 1rem;
    font-weight: bold;
    text-align: center;
}
/*!
 * IranianBankLogos (https://github.com/webdesigniran/IranianBankLogos)
 * Version: 2.0
 * Author: Web Design Iran
 * Author URL: http://webdesigniran.com
 * Github: https://github.com/webdesigniran/IranianBankLogos
 */
.ibl32 {
    background: url("/assets/img/icons/ibls32.png") no-repeat;
    display: inline-block;
    width: 32px;
    height: 32px;
}

    .ibl32.ibl-bsi {
        background-position: 0 0;
    }

    .ibl32.ibl-mellat {
        background-position: -32px 0;
    }

    .ibl32.ibl-tejarat {
        background-position: -64px 0;
    }

    .ibl32.ibl-bmi {
        background-position: -96px 0;
    }

    .ibl32.ibl-sepah {
        background-position: -128px 0;
    }

    .ibl32.ibl-bki {
        background-position: 0 -32px;
    }

    .ibl32.ibl-parsian {
        background-position: -32px -32px;
    }

    .ibl32.ibl-maskan {
        background-position: -64px -32px;
    }

    .ibl32.ibl-rb {
        background-position: -96px -32px;
    }

    .ibl32.ibl-en {
        background-position: -128px -32px;
    }

    .ibl32.ibl-ansar {
        background-position: 0 -64px;
    }

    .ibl32.ibl-bpi {
        background-position: -32px -64px;
    }

    .ibl32.ibl-sb {
        background-position: -64px -64px;
    }

    .ibl32.ibl-sina {
        background-position: -96px -64px;
    }

    .ibl32.ibl-post {
        background-position: -128px -64px;
    }

    .ibl32.ibl-ghbi {
        background-position: 0 -96px;
    }

    .ibl32.ibl-tt {
        background-position: -32px -96px;
    }

    .ibl32.ibl-shahr {
        background-position: -64px -96px;
    }

    .ibl32.ibl-ba {
        background-position: -96px -96px;
    }

    .ibl32.ibl-sarmayeh {
        background-position: -128px -96px;
    }

    .ibl32.ibl-day {
        background-position: 0 -128px;
    }

    .ibl32.ibl-hi {
        background-position: -32px -128px;
    }

    .ibl32.ibl-iz {
        background-position: -64px -128px;
    }

    .ibl32.ibl-kar {
        background-position: -96px -128px;
    }

    .ibl32.ibl-tourism {
        background-position: -128px -128px;
    }

    .ibl32.ibl-bim {
        background-position: 0 -160px;
    }

    .ibl32.ibl-edbi {
        background-position: -32px -160px;
    }

    .ibl32.ibl-me {
        background-position: -64px -160px;
    }

    .ibl32.ibl-ivbb {
        background-position: -96px -160px;
    }

@media (min-width: 768px) {
    .page-caption {
        margin-bottom: 1.8rem;
    }
}


.form-group {
    margin-bottom: .7rem;
    width: 95%;
    margin: 0 auto 10px auto;
}

.form-control,.fc-1{
    width:90%;
    transition:500ms linear;
    margin:0 auto !important;
    text-align:center;
}
    .fc-1{
        width:67%;
    }
    .fc-1:focus {
        width: 77% !important;
    }
.form-control, .custom-select, .fc-1 {
    height: calc(3rem + 2px);
    font-size: .88rem;
    border: 1px solid #dfe6ef;
    color: #222;
    border-radius:50px;
}

    .form-control:focus {
        color: #015293;
        width:100%;
        box-shadow:0 0 5px rgba(0,0,0,0.2) !important;
    }

    .form-control:hover, .custom-select:hover, .fc-1:focus,
    .form-control:focus, .custom-select:focus {
        box-shadow: none;
        border: 1px solid #1c40ff;
    }


/*offline-pay*/
.np-order .d-block, .np-order .d-inline-block {
    animation: fadein .5s linear;
}

/*@media (max-width: 767px) {
    .form-control::-webkit-input-placeholder {
        color: #fff;
    }

    .form-control:-moz-placeholder {
        color: #fff;
    }

    .form-control::-moz-placeholder {
        color: #fff;
    }

    .form-control:-ms-input-placeholder {
        color: #fff;
    }

    .form-control::-ms-input-placeholder {
        color: #fff;
    }
}*/
.btn-round {
    border-radius: 25px;
}


@-webkit-keyframes mover {
    0% {
        -ms-transform: translateY(0) rotateX(0) rotateY(0);
        -webkit-transform: translateY(0) rotateX(0) rotateY(0);
        transform: translateY(0) rotateX(0) rotateY(0);
        opacity: 1;
    }

    100% {
        opacity: .8;
        -ms-transform: translateY(-7px) rotateX(49deg) rotateY(-8deg) scale(.9,.9);
        -webkit-transform: translateY(-7px) rotateX(49deg) rotateY(-8deg) scale(.9,.9);
        transform: translateY(-7px) rotateX(49deg) rotateY(-8deg) scale(.9,.9);
    }
}

@keyframes mover {
    0% {
        -ms-transform: translateY(0) rotateX(0) rotateY(0);
        -webkit-transform: translateY(0) rotateX(0) rotateY(0);
        transform: translateY(0) rotateX(0) rotateY(0);
        opacity: 1;
    }

    100% {
        opacity: .8;
        -ms-transform: translateY(-7px) rotateX(49deg) rotateY(-8deg) scale(.9,.9);
        -webkit-transform: translateY(-7px) rotateX(49deg) rotateY(-8deg) scale(.9,.9);
        transform: translateY(-7px) rotateX(49deg) rotateY(-8deg) scale(.9,.9);
    }
}


/*fadeInRightAnimation*/
@keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}


/*fadeOutRightAnimation*/
@keyframes fadeOut {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

/* Firefox < 16 */
@-moz-keyframes fadeOut {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadeOut {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

/* Internet Explorer */
@-ms-keyframes fadeOut {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

/* Opera < 12.1 */
@-o-keyframes fadeOut {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}