/* about fonts */

*{
    cursor: default;
}


input {
    cursor: text;
}


textarea{
    cursor: text;
}

input[type='button']{
    cursor: pointer;
}

a , button{
    cursor: pointer !important;
}

/* body{
    overflow: hidden;
}

body , html{
    overflow-x: hidden ;
} */
@font-face {
    font-family: "IRANSansX";
    src: url("../fonts/A-Iranian-Sans/Iranian\ Sans.ttf") format("ttf");
}
/* start project */
:root{
    --color--F5F7FA : #F5F7FA;
    --color--2BA769 : #2BA769;
    --color--EF991F : #EF991F;
    --color--241442 :#241442;
    --color--00675F : #00675F;
    --color--D0D0D0 :#D0D0D0;
    --color--017067 :#017067;
    --color--9192A6 : #9192A6;
    --color--7F7F7F : #7F7F7F;
    --color--C1DFC5 : #C1DFC5;
    --color--248D59 : #248D59;
    
}
html{
    box-sizing: border-box;
    margin: 0%;
    padding: 0%;
    scroll-behavior: smooth;
}
*,*::after,*::before{
    box-sizing: inherit;
}
.bod{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.header{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
#nav_logo{
    display: flex;
    justify-content: center;
    align-items: center;
}
#nav_logo img{
    width: 25px;
    height: 25px;
}
.navigator {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #fff;
    background: rgb(1, 112, 103);
    background: linear-gradient(45deg, rgba(1, 112, 103, 1) 22%, rgba(0, 103, 95, 1) 22%);
    position: absolute;
    top: 0;
    padding: 10px;
    transition-duration: 0.3s;
}
.navigator.lilone{
    width: 93%;
    border-radius: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #fff;
    backdrop-filter: blur(15px);
    background: rgb(1, 112, 103);
    background: linear-gradient(45deg, rgb(1 112 103 / 84%) 22%, rgb(0 103 95 / 66%) 22%);
    position: fixed;
    top: 20px;
    padding: 10px;
    box-shadow: #00665e 0px 0px 40px 0px;
    z-index: 99;
}
.navigator.lilone img{
    /* filter: drop-shadow(0px 0px 1px white); */
    filter:brightness(1.3);
}
.navigator.lilone .nav_items{
    margin-right: 35px;
}
.rot{
    width: 100%;
}
*{
    font-family: "IRANSansX";
    padding: 0;
    margin: 0;
}
.container{
    width: 1250px;
    height: auto;
    margin: 0 auto;;
}
li {
    list-style: none;
}
button {
    border: none;
}
input {
    border: none;
}
a{
    text-decoration: none;
}
/* کد های سارا در این محدوده است کد ننویسید وگرنه پراتونو قیچی میکنم*/
.first_s{
    width: 75%;
    height: fit-content;
    margin-top: 100px;
    margin-bottom: 100px;
}
.second_s{
    display: flex;
    justify-content: center;
    align-items: flex-start;
    height: fit-content;
    flex-direction: row-reverse;
}
.s_right_1{
    width: 30%;
    padding: 10px;
    padding-right: 110px;
    padding-top: 90px;
}

.s_right_1 h1{
    text-wrap: nowrap;
}
.s_button {
    width: fit-content;
    height: auto;
    border-radius: 35px;
    margin-top: 20px;
    background-color: #248D59;
    color: #FFFFFF;
    line-height: 30px;
    size: 20px;
    display: flex;
    align-items: center;
    font-size: 18px;
    padding: 10px;
    justify-content: center;
}
.moreinfobtn.zerotop{
    position: static;
}
.s_button svg{
    width: 30px;
    height: 100%;
    margin-right: 10px;
}
.sl{
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    background-color:#F3F3F3;
    height: 180px;
    width: 250px;
    margin: 20px;
    border-radius: 20px;
}
.sl img{
    width: 78%;
}
.s_page_2{
    width: 100%;
    display: flex;
}
.s_page_3{
    width: 100%;
    display: flex;
    height: fit-content;
    display: flex;
    justify-content: center;
    align-items: center;
}
.s_page_3 .itemab{
    position: relative;
}
.s_page_3 .itemab.text{
    width: 95%;
}
.itemab.pics img{
    width: 450px;
    height: 100%;
}
.s_page_3 .itemab.pics{
    position: relative;
}
.s_page_3 .itemab.pics .pic1{
    width: 400px;
}
.s_page_3 .itemab.pics .pic2{
    position: absolute;
    top: -50px;
    right: -40px;
    width: 150px;
    height: 150px;
}
.s_page_3 .itemab.pics .pic3{
    position: absolute;
    width: 400px;
    height: auto;
    left: -150px;
    bottom: -70px;
}
.itemab.text .abilitus{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    padding-top: 70px;
}
.itemab.text .abilitus .abitem {
    width: fit-content;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 32%;
    margin-top: 15px;
}
.itemab.text .abilitus .abitem img{
    padding-left: 10px;
    width: 12%;
}
.itemab.text .abilitus {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    padding-right: 160px;
    position: relative;
}

.moreinfobtn{
    background-color: #248D59;
    color: white;
    border-radius: 100px;
    padding: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    bottom: -70px;
    right: 150px;
}

.s_left_1{
    display: flex;
    justify-content: flex-start;
    flex-direction: row-reverse;
    margin-left: 72px;
}
.sl .icon{
    width: 160px;
    height: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.sl_1_bu {
    width: 95%;
    border-radius: 20px;
    background-color: #3672C4;
    color: #FFFFFF;
    position: absolute;
    bottom: -5px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 7px;
}
a.sl_1_bu{
    text-wrap: nowrap;
}
.s_right_2{
    width: 40%;
}


.slideritem{
    width: 490px;
    height: 170px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row-reverse;
    box-shadow: rgba(0, 0, 0, 0.25) 0px 0px 30px 0px;
    border-radius: 15px;
    margin-left: 110px;
}
.slideritem.row span{
    width: 465px;
}
.box{
    width: 100%;
    display: flex;
    justify-content: center;
    padding-top: 15px;
}
.box input{
    box-shadow: #00000040 0px 0px 30px 0px;
    border-radius: 100px;
    padding: 10px;
    cursor: text;
    outline: none;
    transition-duration: 0.3s;
}
.box button{
    background-color: #248D59;
    border-radius: 100px;
    padding-left: 20px;
    padding-right: 20px;
    outline: none;
    border: none;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 15px;
}
.box input:focus{
    box-shadow: #248D59 0px 0px 30px 0px;
}
.slideritem.row .item{
    width: 100%;
}
.slideritem.row{
    flex-direction: column;
    padding: 15px;
}
.slideritem .item h4{
    text-wrap: nowrap;
    text-align: center;
}
.slideritem .item {
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.upbtn{
    position: fixed;
    right: 50px;
    bottom: -100%;
    width: 50px;
    height: 50px;
    backdrop-filter: blur(15px);
    background-color: #00665e7c;
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    transition-duration: 0.7s;
    cursor: pointer;
    z-index: 999999999999999;
}
.activeupbtn{
    bottom: 50px;
}
.upbtn svg{
    width: 50%;
    height: 50%;
    color: white;
}
.s_div_news{
    height: fit-content;
    width: 80%;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.s_top_news{
    text-align: center;
    margin-top: 30px;
}
.s_slider_news{
    width: fit-content;
    display: -webkit-box;
    justify-content: center;
    height: fit-content;
    padding: 15px 0px 20px; 
}

.s_slider_news::-webkit-scrollbar{
    height: 0px;
}

.holder{
    width:100%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.s_top_news h1{
    color: white;
}
.perimage{
    width: 100%;
    height: 46%;
    position: absolute;
    top: 0;
    z-index: -1;
}
.perimage img{
    width: 100%;
    height: 100%;
}
.sl_news{
    width: 300px;
    height: 400px;
    background-color: white; 
    margin-top:40px;
    margin-bottom:40px;
    margin-left:20px;
    margin-right: 20px;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    box-shadow: #0000003f 0px 0px 10px 0px;
    position: relative;
}
.s_div_news .leftarrow{
    position: absolute;
    left: 15px;
    bottom: 51%;
    cursor: pointer;
}
.s_div_news .leftarrow svg{
    cursor: pointer;
}
.s_div_news .rightarrow svg{
    cursor: pointer;
}
.s_div_news .rightarrow{
    position: absolute;
    right: 0px;
    bottom: 51%;
    cursor: pointer;
}
.s_div_news{
    position: relative;
}
.newssliderholder .infobox{
    width: 100%;
    display: flex;
    justify-content: space-around;
    align-items: center;
    flex-direction: row-reverse;
    position: absolute;
    bottom: 5px;
    background-color: white;
    border-radius: 20px;
    
}
.newssliderholder .infobox span{
    color: #515151;
    font-size: 15px;
}
.newssliderholder{
    width: 1030px;
    height: fit-content;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row-reverse;
    position: relative;
    overflow: hidden;
    
}
.img_slid{
    width: auto;
    height: 170px;
    position: relative;
    background-color: #3672C4;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    overflow: hidden;
}
.img_slid .date{
    width: fit-content;
    height: fit-content;
    padding: 6px;
    border-radius: 50px;
    background-color: #248D59;
    color:white;
    position: absolute;
    left: 10px;
    bottom: -17px;
    border-top-left-radius: 15px;
    border-bottom-left-radius: 0;
    cursor: pointer;
    transition-duration: 0.3s;
}

.img_slid .date:hover{
    bottom: 0;
}

.img_slid img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-top-left-radius: 19px;
    border-top-right-radius: 19px;
}
.h1_sli{
    font-size: 15px;
    padding: 15px 15px 10px;
}


.sl_news a{
    cursor: pointer !important;
    color: initial;
}
.p_sli{
    font-size: 14px;
    color: #9F9F9F;
    padding: 0px 15px 20px;
}
.spansers{
    width:100%;
    height: 300px;
    display: flex;
    justify-content: space-around;
    align-items: center;
    overflow-x: scroll;
}
.spansers::-webkit-scrollbar{
    height: 0;
}
.spansers img{
    width: 150px;
    height:fit-content;
    vertical-align: middle;
    padding: 20px;
    transition-duration: 0.3s;
    cursor: pointer;
}
/* از اینجا به بعد آزاد*/

.a_right h1{
    font-size: 50px !important;
}


.a_right_exp{
    font-size: 25px;
}

.a_imgholder img.secendimage {
    left: 72px;
    top: 173px;
}

.a_imgholder img.firstmaig{
    left: 436px;
    bottom: 124px;
}

.a_imgholder img{
    width: 43%;
    position: absolute;
}

.phoneheader{
    display: none;
}

.a_imgholder{
    position: relative;
    width: 50%;
}

.item {
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.scroloverflow{
    overflow-x: hidden;
}

.s_page_3{
    margin-top: 100px;
    margin-bottom: 100px;
}
.titlebox{
    display: flex;
    justify-content: center;
    align-items: center;
    width: fit-content;
}
.titlebox svg{
    width: 25px;
    height: 25px;
    margin-left: 10px;
}
.titlebox.centeral{
    width: 100%;
}
.titlebox.rightside{
    width: 100%;
    justify-content: flex-start;
}
.managersboxph{
    width: 100%;
    height: 100vh;
    display: none;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding-right: 30px;
}
.textitem{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row-reverse;
    margin-top: 35px;
    margin-bottom: 35px;
}
.textitem .item.text{
    width: 70% !important;
    padding: 20px;
}
.textitem .item.text p{
    font-size: 10px;
    text-align: justify;

}
.textitem .item.icon{
    width: 30% !important;
}
.greenline{
    width: 100%;
    height: 30vh;
    position: relative;
}
.greenline h1 .Span{
    font-size: 12px;
}
.greenline h1{
    font-size: 12px;
}
.greenbox{
    width: 100%;
    height: 90px;
    background-color: #C1DFC5;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    flex-direction: row-reverse;
    padding: 10px;
    margin-top: 10px;
}
.greenbox .item{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.greenbox .item span{
    font-size: 12px; 
}
.greenbox .item .title{
    color: white;
    
}
.greenbox .imageholder img{
    width: 100%;
}
.greenbox .imageholder{
    width: 200px;
}
.picforphone{
    display: none;
}

.roadbox{
    width: 100%;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: url("../assets/road\ map.png");
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
    position: relative;
}

.readmap{
    width: 1360px;
    height: fit-content;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 50px;
}

.plaanet {
    position: absolute;
}

.grayone{
    /* background-color: #00163E; */
    border-radius: 100%;
    /* box-shadow: #FFFFFF 0px 0px 60px 0px; */
    box-shadow: inset -19px 0px 10px 0px #A8C7FF;
    z-index: 1;
    transition-duration: 0.3s;
    background-size: cover;
    background-position: center;
}

.grayone:hover{
    box-shadow: inset -19px 0px 10px 0px #A8C7FF , 0px 0px 4000px 60px #A8C7FF;
    background-color: #A8C7FF;
    cursor: pointer;
}
.sticymaker{
    width: 100%;
    height: 1000px;
}
.planetactive{
    box-shadow: 0px 0px 4000px 60px #A8C7FF !important;
    background-color: #A8C7FF !important;
    cursor: pointer !important;
}

.earth span {
    top: -30px;
    right: -5px;
}

.plaanet span{
    position: absolute;
    color: #2BA769;
    font-weight: bolder !important;
    text-wrap: nowrap;
}

.plaanet span p{
    color: white !important;
    font-weight:normal !important;
    font-size: 12px;
}

.p1 {
    left: 146px;
    bottom: 110px;
    background-image: url("../assets/roadmap/png1.png");
}
.p1 span {
    bottom: -53px;
}
.p2 {
    top: 187px;
    left: 375px;
    background-image: url("../assets//roadmap/png2.png");
}
.p2 span {
    top: -80px;
    right: 123px;
}
.p3 {
    top: 297px;
    left: 577px;
    background-image: url("../assets//roadmap/png3.png");
}
.p3 span {
    bottom: -56px;
    left: -29px;
}
.p4 {
    top: 115px;
    right: 463px;
    background-image: url("../assets/roadmap/png5.png");
}
.p4 span {
    top: -78px;
    right: 168px;
}
.p5 {
    right: 215px;
    bottom: 30px;
    background-image: url("../assets/roadmap/png4.png");
}
.p5 span {
    bottom: 148px;
    left: 196px;
}

.p6 {
    right: 140px;
    top: 126px;
    background-image: url('../assets/roadmap/png6.png');
}

.p6 span {
    bottom: 195px;
    right: 122px;
}
.lastplanet {
    right: -142px;
    top: -123px;
}

.larg {
    width: 200px;
    height: 200px;
}

.mediom{
    width: 150px;
    height: 150px;
}
.smal{
    width: 100px;
    height: 100px;
}

.earth{
    width: 100px;
    height: 100px;
    left: -35px;
    bottom: -5px;
}
.earth img{
    width: 100%;
}
.readmap svg{
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 1;
}
.pcroad{
    display: block;
}

.phoneroad{
    display: none;
}
.grayone {
    box-shadow: none;
}
.grayone:hover{
    box-shadow: 0px 0px 4000px 60px #A8C7FF;
    transform: scale(1.1);
    cursor: pointer;
}
.phone{
    display: none;
}
.pc{
    display: flex;
}
.a_imgholder img.secendimage{
    height: 447px;
    object-fit: cover;
    border-bottom-left-radius: 150px;
}

.s_div_1{
    position: relative;
}



.btnsbox{
    width: 50%;
    display: flex;
    justify-content: space-around;
    align-items: center;
    position: absolute;
    bottom: 90px;
    left: 15px;
}


.btnsbox svg{
    color: #3672C4;
    width: 40px;
    height: 40px;
}

@media (max-width : 600px) {
    .a_imgholder img.firstmaig {
        left: 221px;
        bottom: -288px;
        object-fit: contain;
        border-bottom-right-radius: 0px !important
      }
}

@media (max-width:1110px) {
    .a_imgholder img.firstmaig {
        left: 221px;
        bottom: -288px;
        object-fit: cover;
        border-bottom-right-radius: 100px;
      }
    .phone{
        display: flex;
    }
    .pc{
        display: none;
    }
    .larg{
        width: 150px;
        height: 150px;
    }
    .readmap svg {
        width: 278px;
        height: 100%;
        position: relative;
        z-index: 1;
    }
    .mediom{
        width: 100px;
        height: 100px;
    }
    .plaanet span{
        font-size: 10px;
    }
    .plaanet span p{
        display: none;
    }
    .smal{
        width: 50px;
        height: 50px;
    }
    .earth{
        top: -10px;
    }
    .p1{
        top: 40px;
        left: 153px;
    }
    .p1 span{
        bottom: -42px;
    }
    .p2{
        top: 245px;
        left: 55px;
    }
    .p2 span {
        top: 100px;
        right: 15px;
    }
    .p3 {
        top: 290px;
        right: 79px;
    }
    .p3 span {
        bottom: -45px;
        left: 6px;
    }
    .p4 {
        top: 463px;
        right: 204px;
    }
    .p4 span {
        top: 154px;
        right: 86px;
    }
    .p5 {
        top: 617px;
        right: 73px;
    }
    .p5 span {
        bottom: -57px;
        left: 11px;
    }
    .p6 {
        bottom: 186px;
        top: auto;
        right: 180px;
    }
    .p6 span {
        bottom: -70px;
        right: 30px;
    }
    .lastplanet {
        top: auto;
        bottom: -51px;
        right: -42px;
    }
    .earth span{
        top: 105px;
        right: 1px;
    }
    .roadbox{
        height: fit-content;
    }
    .pcroad{
        display: none;
    }
    .phoneroad{
        display: block;
    }
    .sl{
        width: 120px !important;
    }
    .managersboxph{
        display: flex;
    }
    .centeralris{
        width: 100%;
        justify-content: center;
        align-items: center;
    }
    .phoneheader .logo.fixed {
        border-radius: 20px;
        width: 95%;
        height: fit-content;
        background-image: url(../assets/background_phone.png);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 15px;
        position: fixed;
        top: 10px;
        background-image: none;
        background-color: #015c4db7;
        backdrop-filter: blur(10px);
        box-shadow: #015c4d 0px 0px 10px 0px;
        z-index: 99;
}
    .phoneheader .logo.fixed h1 svg{
        filter: brightness(1.5);
        -webkit-filter: brightness(1.5);
}
    .scroloverflow {
        overflow-x: hidden;
        overflow-y: scroll;
    }
    .s_left_1 {
        display: flex;
        margin-left: 72px;
        flex-direction: column;
    }
    .navigator{
        display: none;
    }
    .itemboxholder .itembox{
        width: 80%;
        display: flex;
        justify-content: flex-start;
        align-items: center;
    }
    .sl {
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;
        background-color: #F3F3F3;
        height: 180px;
        width: 150px;
        margin: 20px;
        border-radius: 20px;
}
    .s_page_2{
        margin-right: 0;
        padding-right: 0%;
        margin-top: 100px;
        margin-bottom: 100px;
        width: 100%;
    }
    .first_s {
        width: 75%;
        height: 130px;
        margin-top: 100px;
        margin-bottom: 100px;
        margin-right: -25px;
    }
    .s_right_1 h1{
        text-wrap: wrap;
    }
    .s_right_1{
        padding: 15px;
        width: 100%;
    }

    .itemboxholder .itembox a{
        color: white;
    }
    .itemboxholder{
        width: 100%;
        height: 60%;
        display: flex;
        justify-content: space-evenly;
        align-items: center;
        flex-direction: column;
    }
    .a_div_1{
        height: fit-content !important;
        margin-bottom: 70px;
        flex-direction: column;
        background-image: none !important;
    }
    .a_div_1 .a_page_1 {
        width: 100%;
    }
    .a_right_title{
        color: black !important;
    }
    .a_right h1{
        font-size: 20px !important;
        text-align: center;
    }
    p.a_right_exp{
        font-size: 10px;
        text-align: center;
        color: rgba(0, 0, 0, 0.844);
    }
    .a_imgholder img.secendimage {
        left: 25px;
        top: 39px;
    }
    .a_imgholder img.firstmaig {
        left: 221px;
        bottom: -288px;
    }
    .a_imgholder img {
        width: 43%;
        position: static !important;
        height: 240px;
        
    }
    .a_imgholder img.secendimage{
        height: 240px;
        object-fit: cover;
        border-bottom-left-radius: 80px;
    }
    .greenbox .imageholder img{
        width: 150px;
        height: 150px;
    }
    .a_page_1.item.a_imgholder{
        width: 100%;
        position: static;
        display: flex;
        flex-direction: row-reverse;
        justify-content: space-evenly;
        align-items: center;
        margin-top: 20px;
    }
    .f_div_4{
        display: none;
    }
    .lilone{
        display: none !important;
    }
    .phoneheader{
        display: flex;
        justify-content: flex-start;
        align-items: center;
        flex-direction: column;
        width: 100%;
        height: 200px;
        position: relative;
    }
    .phoneheader .logo{
        width: 100%;
        height: 55%;
        background-image: url("../assets/background_phone.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 15px;
        transition-duration: 0.3s
    }
    .phoneheader .logo .logobox{
        direction: ltr;
    }
    .phoneheader .logo .logobox h1{
        color: white;
        font-size: 30px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .menubtn{
        display: flex;
        justify-content: center;
        align-items: center;
        width: 40px;
        height: 40px;
    }
    .menubtn svg{
        width: 80%;
        height: 80%;
        color: white;
    }
    .searchbar{
        width: 80%;
        height: 40px;
        border-radius: 15px;
        box-shadow: gray 0px 0px 15px 0px;
        margin-top: 20px;
        display: flex;
        justify-content: space-around;
        align-items: center;
}
    .searchbar input{
        width: 80%;
        height: 100%;
        border: none;
        outline: none;
    }
    .glass{
        opacity: 0;
        visibility: hidden;
        backdrop-filter: blur(10px);
        background-color: #22222249;
        width: 100%;
        height: 100vh;
        position: fixed;
        z-index: 999999999;
    }
    .menu{
        width: 70%;
        height: 100vh;
        position: fixed;
        top: 0;
        right: -100%;
        background-color: #015c4d;
        z-index: 9999999999;
        transition-duration: 0.3s;
    }
    .menu .logobox{
        width: 100%;
        height: fit-content;
        display: flex;
        justify-content: space-between;
        align-items: center;
        direction: ltr;
        padding: 15px;
    }
    .menu.opened{
        right:-0.1% !important;
    }
    .glass.visi{
        opacity: 1;
        visibility: visible;
    }
    .menu .logobox h1{
        direction: ltr;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 30px;
        color: white;
    }
    .menu .logobox .closebtn svg{
        color: white !important;
    }
    .a_div_1 .a_page_1 {
        width: 100%;
        display: flex;
        justify-content: center;
    }
    .newssliderholder {
        width: 278px;
        height: fit-content;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: row-reverse;
        position: relative;
        overflow: hidden;
    }
    .s_slider_news {
        width: 571px;
        display: flex;
        justify-content: flex-start;
        flex-direction: row-reverse;
        height: fit-content;
        padding: 15px 0px 20px;
        overflow: hidden;
    }
    .sl_news {
        width: 250px;
        height: 400px;
        background-color: white;
        margin-top: 40px;
        margin-bottom: 40px;
        margin-left: 20px;
        margin-right: 20px;
        border-radius: 20px;
        display: flex;
        flex-direction: column;
        box-shadow: #0000003f 0px 0px 10px 0px;
        position: relative;
}
    .s_div_news .rightarrow {
        position: absolute;
        right: -27px;
        bottom: 524px;
        cursor: pointer;
        z-index: 9;
    }
    .s_div_news .leftarrow {
        position: absolute;
        left: -18px;
        bottom: 524px;
        cursor: pointer;
        z-index: 9;
    }
    .spansers {
        width: 385px;
        height: 300px;
        display: flex;
        justify-content: space-around;
        align-items: center;
        overflow: scroll;
    }
    .spansers img {
        width: 128px;
        height: fit-content;
        vertical-align: middle;
        padding: 20px;
    }
    .sl_1_bu{
        width: 100%;
        text-wrap: nowrap;
    }
    .sl{
        border-radius: 25px;
        box-shadow: gray 0px 0px 10px 0px;
}
    .s_button{
        font-size: 20px;
    }
    .itemab.text .abilitus{
        padding-right: 0px;
    }
    .itemab.text .abilitus .abitem{
        width: fit-content;
        margin: 10px;
    }
    .itemab.text .abilitus .abitem img{
        width: 30px;        
    }
    .itemab.text .abilitus .abitem span{
        font-size: 12px;
    }
    .itemab.text .abilitus .abitem {
        justify-content: first baseline;
        width: 42%;
    }
    .second_s{
        flex-direction: column;
    }
    .s_page_3 .itemab.pics .pic2{
        display: none;
    }
    .s_page_3 .itemab.pics{
        position: static;
    }
    .s_page_3 .itemab.pics img{
        position: static;
    }
    .s_page_3 .itemab.pics .pic2 , .s_page_3 .itemab.pics .pic1 , .s_page_3 .itemab.pics .pic3{
        position: static;
    }
    .textholder{
        margin-bottom: 100px;
    }
    .picforphone{
        display: block;
        width: 100% !important;
        height: 100% !important;
    }
    .itemab.pics{
        display: flex;
        overflow: scroll;
        width: 300px;
        justify-content: flex-start;
        flex-direction: row-reverse;
        margin-right: 30px;
    }
    .pics svg{
        width: 50px;
        height: 50px;
    }
    .s_page_3 .itemab.pics .pic3{
        width: 100%;
        height: 100%;
    }
    .pic1{
        display: none;
    }

    .img_slid{
        width: 250px;
    }
}
