* {
    box-sizing: border-box;
}

@font-face {
    font-family: li;
    src: url(../../font/fa/PeydaWeb-Black.woff2);
}

@font-face {
    font-family: bo;
    src: url(../../font/fa/PeydaWeb-Bold.woff2);
}

@font-face {
    font-family: de;
    src: url(../../font/fa/PeydaWeb-ExtraBold.woff2);
}

@font-face {
    font-family: ex;
    src: url(../../font/fa/peydaWeb-extralight.woff2);
}

@font-face {
    font-family: le;
    src: url(../../font/fa/peydaWeb-light.woff2);
}

@font-face {
    font-family: me;
    src: url(../../font/fa/PeydaWeb-Medium.woff2);
}

@font-face {
    font-family: re;
    src: url(../../font/fa/PeydaWeb-Regular.woff2);
}

@font-face {
    font-family: th;
    src: url(../../font/fa/PeydaWeb-Thin.woff2);
}

@font-face {
    font-family: ul;
    src: url(../../font/fa/PeydaWeb-SemiBold.woff2);
}

/*mobile*/
/* - */
@media (max-width:480px) {}

/*divais kochik*/
/* - */
@media (min-width:481px) and (max-width:767px) {}

/*tablet*/
/* - */
@media (min-width:768px) and (max-width:991px) {}

/*big tablet / labtob*/
/* - */
@media (min-width:992px) and (max-width:1199px) {}

/*desktops*/
/* - */
@media (min-width:1200px) and (max-width:1560px) {}

/*desktops hd */
/* - */
@media (min-width:1561px) {
    body {
        background-color: #00152a;
        margin: 0;
    }

    .link-short-mom-div {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 0px;
        position: fixed;
        top: 20px;
        width: 100%;
        z-index: 10;
    }

    .bg {
        background-color: #3e3e3e4f;
        backdrop-filter: blur(20px);
        width: 900px;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 25px;
        transition: 1s;
    }

    .img-logo {
        width: 140px;
        height: 100%;
    }

    .div-logo {
        display: flex;
        justify-content: right;
        align-items: center;
        margin-left: 40px;
    }

    .link-short-div {
        display: flex;
        margin-top: 4px;
    }

    #off {
        display: none;
    }


    .link-lang {
        background-color: #3e3e3e4f;
        backdrop-filter: blur(20px);
        width: 400px;
        height: 100vh;
        position: fixed;
        top: 0;
        right: -400px;
        z-index: 12;
        border-radius: 70px 0px 0px 70px;
        align-items: center;
        height: 100%;
    }

    .img-list {
        width: 50px;
        transition: 500ms;
    }

    .img-list:hover {
        filter: drop-shadow(#00ffee 0px 0px 5px);
    }

    .link-short {
        color: #00ffb3;
        font-family: li;
        margin: 0px 10px;
        text-shadow: 0px 0px 1px #00ffb3;
        font-size: 20px;
        transition: 600ms;
        text-decoration: none;
    }

    .search1 {
        width: 20px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .search {
        border-radius: 0px 8px 8px 0px;
        margin-right: 40px;
        width: 400px;
        height: 35px;
        font-family: me;
        border: 2px solid #00ffb3;
        background: none;
        border-left: none;
        color: #F1F1F1;
        outline: none;
    }

    .submit {
        margin: 0;
        border-radius: 8px 0px 0px 8px;
        height: 35px;
        font-family: me;
        border: 2px solid #00ffb3;
        background: none;
        border-right: none;
        color: #F1F1F1;
        outline: none;
    }

    .form-ser {
        margin: 0;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .f-long {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 90%;
    }

    .fgss {
        margin-right: 10px;
    }

    .showe {
        background-color: #00ff99;
        font-family: li;
        font-size: 30px;
        text-align: center;
        margin: 0;
        border-radius: 0px 0px 20px 20px;
        color: #002a53;
    }

    .header-section {
        background: #002a53;
        width: 100%;
        height: 900px;
        border-radius: 10% 10% 40% 40% / 0% 0% 59% 58%;
    }

    .img-div-me {
        width: 400px;
        height: 400px;
        border-radius: 61% 60% 17% 20% / 61% 63% 36% 39%;
        background: #00ffb3;
        box-shadow: 0px 0px 50px #00fff2;
        overflow: hidden;
        position: relative;
    }

    .text-me-abut {
        width: 200px;
        height: 100px;
        background-color: #F1F1F1;
        margin: 0px 0px 0px -140px;
        position: relative;
        z-index: 3;
        box-shadow: 0px 0px 30px #F1F1F1;
        border-radius: 15px;
        border: 3px solid #002a53;
    }

    .ms {
        height: 700px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .text-me-im-go {
        color: #002a53;
        font-family: me;
        font-size: 15px;
        text-align: center;
        display: flex;
        align-items: center;
        height: 100%;
        margin: 0;
        text-shadow: 0px 0px 80px #00ffb3;
    }

    .img-me-im {
        width: 400px;
        position: absolute;
        bottom: -100%;
    }

    .p-text-me {
        width: 400px;
        color: #F1F1F1;
        font-family: ex;
        font-size: 16px;
        text-align: center;
    }

    .jdjd {
        margin: 0px 50px;
        background: rgb(0, 255, 226);
        background: radial-gradient(circle, rgba(0, 255, 225, 0.222) 0%, rgba(0, 255, 209, 0) 52%);
    }

    .jdjdd {
        margin: 0px 50px;
        background: rgb(0, 255, 226);
        background: radial-gradient(circle, rgba(0, 255, 225, 0.222) 0%, rgba(0, 255, 209, 0) 42%);
    }

    .text-me-abut-div {
        margin: 0px 50px;
    }

    .h2-text-me {
        font-family: li;
        font-size: 70px;
        color: #00ffb3;
        margin: 0;
        padding: 0;
        text-align: center;
    }

    .img-lang-soft {
        width: 40px;
        margin: 10px 10px;
        transition: 200ms;
    }

    .div-lang-mom-soft {
        display: flex;
        justify-content: center;
    }

    .button {
        background: none;
        position: relative;
        overflow: hidden;
        padding: 15px 80px;
        border: 2px solid #00ffb3;
        border-radius: 15px;
        color: #00ffb3;
        font-family: li;
        font-size: 25px;
        margin: -100px 20px;
        z-index: 1;
        transition: 1.2s;
    }

    .button::before {
        content: "";
        position: absolute;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100%;
        background: #00ffb3;
        z-index: -1;
        transition: left 1.2s ease;
        border-radius: 15px;
    }

    .button:hover::before {
        left: 0;

    }

    .button:hover {
        transition: 1.2s;
        color: #002a53;
        box-shadow: 0px 0px 40px #00fff2;
    }

    .mom-div-button {
        display: flex;
        justify-content: center;
    }

    #q {
        width: 42px;
        margin: 9px 10px 10px 10px;
    }

    #q:hover {
        filter: sepia(1) saturate(5) hue-rotate(-30deg);
        padding: 30px 0px 0px 0px;
        transition: 200ms;
    }

    #t:hover {
        filter: sepia(1) saturate(5) hue-rotate(180deg);
        padding: 30px 0px 0px 0px;
        transition: 200ms;
    }

    #w:hover {
        filter: sepia(1) saturate(5) hue-rotate(140deg);
        padding: 30px 0px 0px 0px;
        transition: 200ms;
    }

    #e:hover {
        filter: sepia(1) saturate(7) hue-rotate(15deg);
        padding: 30px 0px 0px 0px;
        transition: 200ms;
    }

    #r:hover {
        filter: sepia(1) saturate(7) hue-rotate(75deg);
        padding: 30px 0px 0px 0px;
        transition: 200ms;
    }

    .link-short:hover {
        color: #00fff2;
        transition: 300ms;
        text-shadow: 0px 0px 15px #00fff2;
    }

    ::-webkit-scrollbar {
        width: 6px;
    }

    ::-webkit-scrollbar-thumb {
        background-color: #00ffb3;
        border-radius: 5px;
    }

    ::-webkit-scrollbar-track {
        background-color: #00152a;
        border-radius: 10px;
        color: #F1F1F1;
    }

    .how-me {
        display: flex;
        justify-content: center;
        margin-top: 80px;
    }

    .text-how {
        color: #F1F1F1;
        width: 400px;
        font-family: me;
        text-align: center;
        background: rgb(0, 255, 226);
        background: radial-gradient(circle, rgba(0, 255, 225, 0.197) 0%, rgba(0, 255, 209, 0) 55%);
    }

    .im-hov {
        color: #00ffb3;
        font-size: 50px;
        font-family: li;
        padding: 0;
        margin: 0;
        width: 400px;
        text-align: center;
    }

    .img-how-me {
        width: 400px;
        height: 400px;
        display: flex;
        align-items: end;
        justify-content: center;
        transition: 2s;
    }

    .img-how-me:hover {
        animation: infinite identifier 4s;
    }

    .nd {
        margin-left: 140px;
    }

    .nds {
        margin-left: 70px;

    }

    .img-me-how {
        width: 400px;
        margin-bottom: 40px;
    }

    .nemone {
        width: 800px;
        height: 100px;
        background-color: #002a53;
        border-radius: 38px;
        display: flex;
        justify-content: center;
        align-items: center;
        overflow: hidden;
    }

    .nemomm {
        margin-top: 100px;
        display: flex;
        justify-content: center;
    }

    .aval {
        color: #00ffb3;
        text-align: center;
        font-size: 50px;
        font-family: li;
    }

    .nemone-div {
        width: 60px;
        height: 60px;
        background-color: #00ffb3;
        margin: 10px;
        border-radius: 50px;
        box-shadow: 0px 0px 25px #00fff2;
        animation: broser 10s linear infinite alternate;
    }

    .nemone-img {
        width: 40px;
        height: 40px;

    }

    .rr {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 60px;
        height: 60px;
    }

    .table {
        border: 3px solid #00ffb3;
        border-radius: 37px;
        text-align: center;
        font-family: me;
        width: 800px;
        overflow: hidden;
        height: 800px;
    }

    .plan {
        font-size: 20px;
        color: #00ffb3;
    }

    .bronz {
        color: #ff7700;
    }

    .silver {
        color: silver;
    }

    .gold {
        color: gold;
    }

    .dfd {
        background-color: #00fff228;
    }

    .table-sec {
        display: flex;
        justify-content: center;
        margin-top: 100px;
    }

    .tarfe {
        color: #00ffb3;
        font-family: li;
        font-size: 50px;
        text-align: center;
    }

    .fjh {
        color: red;
        text-decoration: none;
    }

    .img-nemone-div {
        width: 500px;
        height: 300px;
        border-radius: 38px;
        margin-top: 40px;
    }

    .ererer {
        display: flex;
        justify-content: center;
    }

    .digi {
        font-family: de;
        color: white;
        text-shadow: 0px 0px 1px rgb(91, 91, 91);
        font-size: 50px;
        text-align: center;
        margin: 0;
    }

    .mom-div-nemone {
        width: 800px;
        height: 530px;
        background: rgb(255, 0, 0);
        background: linear-gradient(0deg, rgba(253, 45, 157, 1) 0%, rgba(255, 0, 0, 1) 47%);
        border-radius: 5px 86px 5px 86px;
        transition: 1s;
    }

    .mom-tozahat {
        display: flex;
        justify-content: center;
        padding-top: 50px;
    }

    #img-nemone-div1 {
        display: none;
        justify-content: center;
    }

    #img-nemone-div2 {
        display: none;
        justify-content: center;
    }

    .froshgah {
        width: 60px;
        height: 60px;
        border-radius: 80px;
        background: #eb0000;
        box-shadow: 0px 0px 30px red;
        margin: 10px;
        display: flex;
        justify-content: center;
    }

    .nashenas {
        width: 60px;
        height: 60px;
        border-radius: 80px;
        background: #5a5a5a;
        box-shadow: 0px 0px 30px #e1e1e1;
        margin: 10px;
        display: flex;
        justify-content: center;
    }

    .amozeshi {
        width: 60px;
        height: 60px;
        border-radius: 80px;
        background: #00ff99;
        box-shadow: 0px 0px 30px #00ffee;
        margin: 10px;
        display: flex;
        justify-content: center;
    }

    .div-nemone-web {
        display: flex;
        justify-content: center;
    }

    #digi2 {
        display: none;
    }

    #digi3 {
        display: none;
    }

    .sec-web {
        display: flex;
        justify-content: center;
        margin-top: 200px;
    }

    .tasvir {
        width: 40px;
    }

    .text-link-long {
        color: #F1F1F1;
        text-decoration: none;
        font-family: li;
        height: 50px;
        margin: 10px 0;
        width: 300px;
        display: flex;
        align-items: center;
        transition: 500ms;
        border-radius: 20px;
    }

    .text-link-long:hover {
        background-color: #00ff99;
        color: #002a53;
        transition: 500ms;
    }

    .welcome {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        background-color: #5a5a5a55;
        backdrop-filter: blur(40px);
        z-index: 20;
        display: flex;
        justify-content: center;
    }

    .img-welcome {
        margin-top: 100px;
        width: 600px;
    }

    .diratx {
        color: #ffffff;
        font-family: li;
        font-size: 35px;
    }

    .worod {
        margin: 0px 8px;
        padding: 10px;
        color: #00ff99;
        font-size: 30px;
        font-family: me;
        position: relative;
        overflow: hidden;
        border: none;
        background: none;
    }

    .worod::before {
        content: "";
        position: absolute;
        bottom: 0;
        left: -100%;
        width: 100%;
        height: 100%;
        border-bottom: 4px solid #00ff99;
        transition: left 600ms;
    }

    .worod:hover::before {
        left: 0;
    }

    .mom-mom {
        display: flex;
        width: 100%;
        justify-content: center;
    }

    .div-buttom {
        width: 50px;
        height: 50px;
        border-radius: 50px;
        background-color: #002a53;
        margin: 0px 5px;
    }

    #header {
        color: #00152a;
        text-align: center;
        font-family: li;
        font-size: 30px;
    }

    #tozihat {
        color: #002a53;
        font-family: me;
        font-size: 20px;
        text-align: center;
    }

    .mogod-tozihat {
        width: 800px;
        height: 530px;
        background: linear-gradient(0deg, rgba(0, 252, 255, 1) 0%, rgba(45, 253, 83, 1) 83%);
        border-radius: 5px 86px 5px 86px;
    }

    .img-rah {
        width: 350px;
    }

    .button-div-tozihat {
        display: flex;
        justify-content: center;
        margin-top: 45px;
    }

    .dad-tozihat {
        display: flex;
        justify-content: center;
        margin-top: 200px;
    }

    .text-buttom {
        color: #00ff99;
        font-family: li;
        font-size: 20px;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100%;
        margin-top: 4px;
    }

    .moom-tozihat {
        margin-top: 50px;
    }

    .sec-icon {
        margin-top: 300px;
        width: 100%;
        height: 280px;
        border-radius: 50% 50% 0% 100% / 100% 100% 0% 0%;
        background-color: #002a53;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .sec-icon2 {
        width: 100%;
        height: auto;
        background-color: #002a53;

    }

    .flex {
        display: flex;
    }

    .jus {
        display: flex;
        justify-content: center;
    }

    .ait {
        display: flex;
        align-items: center;
    }

    .div-morfi {
        width: 150px;
        height: 150px;
        background: linear-gradient(#00ffee, #77fff6);
        border-radius: 30px;
        margin: 5px;
    }

    .div-box-morfi {
        width: 100px;
        height: 310px;
        background: linear-gradient(#00ffee, #77fff6);
        margin: 5px;
        border-radius: 30px;
    }

    .div-asli-morfi {
        width: 310px;
        height: 310px;
        border-radius: 30px;
        background: linear-gradient(#00ffee, #77fff6);
        margin: 5px;
    }

    .margin {
        margin: 0px 30px;

    }

    #masage {
        width: 350px;
        height: 150px;
        background: linear-gradient(#00ff99, #69ffc3);
        border-radius: 20px;
        position: fixed;
        left: -350px;
        top: 80px;
        display: flex;
        align-items: center;
    }

    #img-alert {
        width: 100px;
        height: 100px;
    }

    #mom-alert {
        display: flex;
        justify-content: left;
        align-items: center;
    }

    #title-alert {
        color: #00152a;
        font-size: 20px;
        font-family: li;
        width: 240px;
        margin-bottom: 3px;
        text-align: center;
    }

    #text-alert {
        color: #002a53;
        font-size: 15px;
        font-family: me;
        width: 240px;
        margin: 0;
        text-align: center;
    }
}
.pointe{
    color: #00ff99;
    font-family: li;
    font-size: 50px;
}