/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/
.hide{
    display: none !important;
}
.dir-ltr{
    direction: ltr !important;
}
.dir-rtl{
    direction: rtl !important;
}
.text-left{
    text-align: left !important;
}
.text-right{
    text-align: right !important;
}
#contact-me {
    position: fixed;
    border-radius: 50%;
    z-index: 299;
    width: 40px;
    height: 40px;
    font-size: 20px;
    line-height: 36px;
    text-align: center;
    color: #FFF;
    top: auto;
    left: auto;
    right: 25px;
    bottom: 30px;
    cursor: pointer;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: transform .3s ease;
    -o-transition: transform .3s ease;
    transition: transform .3s ease;
}
#slider-index-1,#slider-index-2{
    background: #050505 url('/images/canvas/mobile/dots-white.png') 100% 0 no-repeat; background-size: 35%;
}

#mobile-nov-header{
    flex-direction: row-reverse;
}
div.global-menu a.active{
    color: #8e24aa;
}
.cardlink-p{
    font-size: .83em;
}
.text-justify{
    text-align: justify;
}
/* contact us form label */
.form-floating > label {
    position: absolute;
    top: 0;
    right: 10px;
    left: auto;
    height: 100%;
    padding: 1rem 0.75rem;
    pointer-events: none;
    border: 1px solid transparent;
    transform-origin: 0 0;
    transition: opacity 0.1s ease-in-out, transform 0.1s ease-in-out;
}
label{
    font-weight: 350;
}
/* google recaptcha */
.grecaptcha-badge {
    width: 70px !important;
    overflow: hidden !important;
    transition: all 0.3s ease !important;
    left: 4px !important;
}
.grecaptcha-badge:hover {
    width: 256px !important;
}
/* modal sweet alert */
body.dark .swal-modal{
    color: #222;
}
body.dark .swal-button {
    color: #222;
}
/*.grid-filter li{*/
/*    width: 100% !important;*/
/*}*/
.grid-filter.flex-column {
    border: 1px solid rgba(0,0,0,0.07);
    border-radius: 4px;
}

.grid-filter.flex-column,
.grid-filter.flex-column li {
    width: 100%;
}

.grid-filter.flex-column li a {
    padding: 14px 20px;
    font-size: 0.9375rem;
    text-align: right;
    border-left: 0;
    border-radius: 0;
    border-bottom: 1px solid rgba(0,0,0,0.07);
}

.grid-filter.flex-column li:first-child a {
    border-radius: 4px 4px 0 0;
}

.grid-filter.flex-column li:last-child a {
    border-bottom: 0;
    border-radius: 0 0 4px 4px;
}

.text-bw{
    color: #808080;
}
.num-fa{
    font-family: 'iransens_num', sans-serif !important;
}
.ml-10{
    margin-left: 10px !important;
}
a.cardlink-a{
    text-decoration: none !important;
    color: #8e24aa;
}
.a-notif{
    border-radius: 50%;
    width: 40px;
    height: 40px;
}
.i-notif{
    line-height: 26px;
    font-size: 18px;
    left: -8px !important;
}
.section{
    padding: 10px 0;
}
.owl-carousel .owl-item img {
    width: 70% !important;
}
.notifBorder {
    width: 40px;
    height: 40px;
    display: block;
    cursor: pointer;
    -webkit-transform: translateY(-0%);
    -ms-transform: translateY(-0%);
    -o-transform: translateY(-0%);
    transform: translateY(-0%);
    z-index: 1000;
    border-radius: 50%;
    background-color: var(--theme-bg);
    pointer-events: auto;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}
.notifBorder::after {
    width: 40px;
    height: 40px;
    box-sizing: border-box;
    content: '';
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    pointer-events: none;
    border: 4px solid var(--theme-bg);
    border-radius: 50%;
    -webkit-animation-duration: 1.2s;
    animation-duration: 1.2s;
    -webkit-animation-name: intervalNotifBorder;
    animation-name: intervalNotifBorder;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
@keyframes intervalNotifBorder {
    0% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    80% {
        -webkit-transform: scale(1.6);
        transform: scale(1.6);
    }
    100% {
        opacity: 0;
        -webkit-transform: scale(1.6);
        transform: scale(1.6);
    }
}
/* mobile frame in profile*/
.simlulator-frame {
    max-width: 70%;
    width: 480px;
    position: fixed;
    left: -40px;
    top: 95px;
    z-index: 10;
}
.mobile-container img {
    border: 0 none;
}
#iframe-smartphone {
    display: block;
    height: 701px;
    width: 325px;
    border: 1px solid #aaa;
    position: fixed;
    left: 37px;
    top: 122px;
    border-radius: 34px;
    overflow: hidden;
    z-index: 10;
    overflow-y: scroll;
}
/* Hide scrollbar for Chrome, Safari and Opera */
#iframe-smartphone::-webkit-scrollbar {
    display: none;
}
/* Hide scrollbar for IE, Edge and Firefox */
#iframe-smartphone {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}
@media only screen and (max-height: 900px) {
    #iframe-smartphone {
        display:block;
        height: 666px;
        width: 308px;
        border: 1px solid #aaa;
        position: fixed;
        left: 33px;
        top: 116px;
        border-radius: 34px;
        overflow: hidden
    }

    .simlulator-frame {
        width: 455px;
        position: fixed;
        left: -40px;
        top: 90px
    }
}

@media only screen and (max-height: 800px) {
    #iframe-smartphone {
        display:block;
        height: 591px;
        width: 280px;
        border: 1px solid #aaa;
        position: fixed;
        left: 32px;
        top: 103px;
        border-radius: 34px;
        overflow: hidden
    }

    .simlulator-frame {
        width: 405px;
        position: fixed;
        left: -30px;
        top: 80px
    }
}

@media only screen and (max-height: 720px) {
    #iframe-smartphone {
        display:none;
        height: 485px;
        width: 225px;
        border: 1px solid #aaa;
        position: fixed;
        left: 22px;
        top: 99px;
        border-radius: 24px;
        overflow: hidden
    }

    .simlulator-frame {
        display: none;
        width: 330px;
        position: fixed;
        left: -30px;
        top: 80px
    }
}
.iphoneimage {
    width: 480px;
    position: absolute;
    left: -40px;
    top: 3166px
}

.iphoneiframe {
    display: block;
    height: 701px;
    width: 325px;
    border: 1px solid #aaa;
    position: absolute;
    left: 37px;
    top: 3193px;
    border-radius: 34px;
    overflow: hidden
}
/* form label in placeholder */
.block-form-z .form-group {
    position: relative;
    margin-bottom: 1rem;
}

.block-form-z .form-group label:not(.error) {
    position: absolute;
    top: 50%;
    right: 10px;
    margin-bottom: 0; /* Override default `<label>` margin */
    color: #BBB;
    padding: 0 4px;
    transform: translateY(-50%);
    transition: all 200ms ease;
    cursor: text;
    text-transform: none;
    letter-spacing: 0;
    font-weight: 500;
}

.block-form-z .form-group input:focus + label:not(.error),
.block-form-z .form-group input.focus-visible + label:not(.error),
.block-form-z .form-group input:visited + label:not(.error),
.block-form-z .form-group input:not(:placeholder-shown) + label:not(.error) {
    font-size: 70%;
    transform: translate3d(0, -50%, 0);
    top: 0;
    color: #999;
    background-color: #FFF;
}

.block-form-z .form-group input::-webkit-input-placeholder {
    opacity: 0;
}
.block-form-z .form-group input:-ms-input-placeholder {
    opacity: 0;
}
.block-form-z .form-group input::-moz-placeholder {
    opacity: 0;
}

.block-form-z .form-control.border-bottom {
    border-left: 0;
    border-top: 0;
    border-right: 0;
}

.block-form-z .form-control.border-bottom + label:not(.error) {
    right: 0;
    color: #BBb !important;
}
.formLabelRight{
    right: 20px !important;
}
 textarea.form-control.is-valid {
     padding-left: 0.75rem;
     padding-right: 0.75rem;
}
textarea.form-control.is-invalid {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}
