.menu-bar{width: 100%;height: 770px;background-color: #FFF;position: absolute;top: 76px;right: 0;transition:all .3s ease-in-out 0s;z-index: -1;opacity: 0;}
.menu_close{width: 25px;cursor: pointer;position: absolute;top: 30px;left: 30px;} 
.menu_close img{width: 100%;display: block;}
.menu_bx{margin-top: 80px;}
.menu_row{width: 50%;float: right;}
.menu_in{margin: 0 10px;cursor: pointer;padding-bottom: 15px;position: relative;}
.menu_in img{width: 70px;display: table;margin: 0 auto 10px;}
.menu_in p{font-size: 16px;margin: 0;text-align: center;color: #000;}
.allMsg{width: 100%;padding: 7px 0;background-color: #5aaa5a;color: #FFF;font-size: 12px;text-align: center;position: absolute;bottom: -20px;right: 0;transition:all .3s ease-in-out 0s;opacity: 0;}
.borderBtm{border-bottom: 2px solid #EDEDED;}
#particles-js{width:100%;height:100%;z-index: 999;position: absolute;top: 0;left: 0;}

.p-top{width: 100%;background-color: #121212;}
.ptop-in{width: 90%;margin: 0 auto;display: table;padding: 15px 0;}
.ptop-menu{width: 40px;height: 40px;float: right;margin-left: 25px;background: url('../j2/menubar.png') no-repeat center center/35px;cursor: pointer;}
.ptop-support{width: 45px;height: 45px;float: right;margin-left: 40px;background: url('../j2/support.png') no-repeat center 1px/43px;cursor: pointer;}
.ptop-paging{float: right;font-size: 21px;color: #7f6b42;margin-top: 8px;font-weight: 700;font-family: arial;}
.ptop-logo{width: 130px;float: left;margin-top: 5px;}
.ptop-logo img{display: block;width: 100%;}

.p-btm{width: 100%;position: absolute;bottom: 15px;left: 0;}
.p-row1{width: 40px;height: 30px;margin: 0 auto;}
.p-row2{width: 310px;margin: 0 auto;}
.p-row3{width: 400px;margin: 0 auto;}
.p-btm a{display: block;width: 40px;height: 40px;}
.p-btm a img{width: 100%;height: 100%;display: block;}
.p-a1,.p-a2{float: right;}
.p-a4,.p-a5{float: left;}

/*p1*/
.p1-bg{background: #000 url('ttk-bg1.jpg') no-repeat right top/100% 100%;}
.p1-middle{width: 260px;transition:all .8s ease-in-out 0s;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);z-index: 2;}
.p1-logo{margin-bottom: 10px;}
.p1-logo img{display: block;width: 100%;}
.p1-middle > p{font-size: 22px;color: #FFF;margin:0;font-family: Vazir-bold;}
.p1-m70{margin-right: 70px!important;}

/*p2*/
.p2-bg{background-color: #4166db;}
.p2-middle{width: 100%;height: 770px;position: relative;background: url('ttk-bg22.jpg') no-repeat right top/100% 100%;}
.p2-txt{padding: 40px 5% 20px;}
.p2-title{width: 85%;border-bottom: 1px solid #FFF;margin-bottom: 15px;position: relative;}
.p2-title span{display: table;padding: 1px 40px;background-color: #e8ab2c;color: #FFF;font-size: 20px;font-family: Vazir-bold;}
.p2-cnt{font-size: 16px;color: #FFF;line-height: 32px;white-space: break-spaces;text-align: justify;}
#padcast{width: 80%;margin: 20px auto 0;display: table;}

/*p3*/
.p3-bg{background-color: #4166db;}
.p3-middle{width: 100%;height: 770px;position: relative;background: url('ttk-bg2.jpg') no-repeat right top/100% 100%;}
.p3-txt{padding: 40px 5% 0;}
.p3-service{margin: 20px 5% 0;}
.p3-subs{width: 96%;padding: 5px 4% 5px 0;margin-bottom:5px;font-size: 18px;color: #616bf7;text-align: right;font-family: Vazir-bold;}
#sub1{background:#FFF url('bg-01.jpg') no-repeat left top/105px 100%;}
#sub2{background:#FFF url('bg-02.jpg') no-repeat left top/142px 100%;}
#sub3{background:#FFF url('bg-03.jpg') no-repeat left top/154px 100%;}
#sub4{background:#FFF url('bg-04.jpg') no-repeat left top/171px 100%;}
.p3-video{width: 90%;margin: 20px auto 0;}
.p3-video video{width: 96%;display: block;padding: 2%;border: 1px solid #B0B0B0;border-radius: 8px;}

/*p4*/
.p4-bg{background-color: #4166db;}
.p4-middle{width: 100%;height: 770px;position: relative;background: url('ttk-bg6.jpg') no-repeat right top/100% 100%;}
.p4-txt{padding: 40px 5% 20px;}
.prtf-row{margin-bottom: 30px;}
.prtf-row img{float: right;margin-left: 20px;}
#prtf-img1, #prtf-img2, #prtf-img4, #prtf-img5{width: 150px;}
#prtf-img3{width: 50px;}
#prtf-img6{width: 100px;}
.prtf-row p{font-size: 16px;color: #000;float: right;display: table;font-family: Vazir-bold;}
#prtf-p1, #prtf-p2, #prtf-p5{margin: 10px 0 0;}
#prtf-p3{margin: 20px 0 0;}
#prtf-p4{margin: 15px 0 0;}
#prtf-p6{margin: 12px 0 0;}
.prtf-row ul{margin: 0;padding: 0 25px 0 0;}
.prtf-row ul li{font-size: 15px;color: #FFF;}

/*p5*/
.p5-bg{background-color: #4166db;}
.p5-middle{width: 100%;height: 770px;position: relative;background: url('ttk-bg4.jpg') no-repeat right top/100% 100%;}
.p5-txt{padding: 40px 5% 20px;}
.p5-txt > img{width: 450px;display: block;margin-bottom: 30px;}

/*p6*/
.p6-bg{background-color: #000}
.p6-bg-in{background: url('ttk-bg5.jpg') no-repeat right top/100% 100%;}
.p6-middle{width: 70%;position: absolute;top: 45%;left: 50%;transform: translate(-50%, -50%);z-index: 2;}
.p6-qrcode{width: 160px;height: 160px;margin: 0 auto 60px;}
.p6-logo{width: 260px;display: table;margin: 0 auto;}
.p6-logo img{display: block;width: 100%;}

@media only screen and (max-width:1400px) and (min-width:540px){
    .book{width: 350px;height: 590px;}
    .flipBtn{width: 35px;height: 35px;background-size: 35px !important;} 
    .p2-title{margin-bottom: 10px;}
    .p2-title span{font-size: 16px;}
    .menu-bar{height: 630px;top: 60px;}
    .menu_close{width: 18px;}
    .ptop-menu{width: 30px;height: 30px;background-size: 25px !important;}
    .ptop-support{width: 30px;height: 30px;background-size: 25px !important;margin-left: 30px;}
    .ptop-paging{font-size: 19px;margin-top: 2px;}
    .ptop-logo{width: 85px;}
    .p1-logo{width: 190px;}
    .p1-middle > p{font-size: 18px;}
    .p2-txt{padding: 20px 5% 20px;}
    .p2-cnt{font-size: 13px;line-height: 22px;}
    .p-btm{bottom: 10px;}
    .p-row1{width: 35px;margin: 0 auto -30px;position: relative;}
    .p-row2{width: 160px;}
    .p-row3{width: 230px;}
    .p-btm a{width: 35px;height: 35px;}
    .p3-txt, .p4-txt, .p5-txt{padding: 25px 5% 0;}
    .p6-qrcode{margin: 0 auto 40px;}
    .p6-logo{width: 170px;}
    #prtf-p1, #prtf-p2, #prtf-p5{margin: 2px 0 0;}
    .p2-middle, .p3-middle, .p4-middle, .p5-middle{height: 630px;}
    .p3-subs{padding: 2px 4% 2px 0;font-size: 15px;}
    .p3-video{margin: 10px auto 0;}
    #prtf-img1, #prtf-img2, #prtf-img4, #prtf-img5{width: 100px;}
    #prtf-img3{width: 40px;}
    #prtf-img6{width: 85px;}
    .prtf-row{margin-bottom: 15px;}
    .prtf-row p{font-size: 15px;}
    #prtf-p3{margin: 12px 0 0;}
    .prtf-row ul li{font-size: 14px;}
    .p1-middle{width: 180px;}
}

@media only screen and (max-width:539px){
    .book{width: 100%;height: 100%;position: absolute;top: 0;overflow: hidden;}
    .front,.back{z-index: 1;}
    .back-content{transform: rotateY(0deg)}
    .menu-bar{top: 6.8%;height: 95%;}
    .menu_in img{width: 40px;}
    .menu_in p{font-size: 14px;}
    .menu_close{width: 15px;}
    .ptop-in{padding: 5px 0;}
    .ptop-menu{width: 30px;height: 30px;background-size: 30px;margin-top: 5px;}
    .ptop-support{width: 35px;height: 35px;background-size: 33px;margin-top: 3px;}
    .ptop-logo{width: 110px;}
    .ptop-paging{font-size: 17px;margin-top: 9px;}
    .p1-logo{width: 180px;}
    .p1-middle{width: auto;}
    .p1-middle > p{font-size: 18px;}
    .p2-txt{padding: 10px 5% 20px;}
    .p2-cnt{font-size: 15px;line-height: 26px;height: 350px;overflow: auto;} 
    .p-btm{bottom: 10px;}
    .p-row1{width: 35px;margin: 0 auto -30px;position: relative;}
    .p-row2{width: 260px;}
    .p-row3{width: 340px;}
    .p-btm a{width: 35px;height: 35px;}
    .p3-txt{padding: 10px 5% 0;}
    .p3-subs{padding: 2px 4% 2px 0;font-size: 16px;}
    .p3-video{margin: 10px auto 0;}
    .p4-txt{padding: 10px 5% 0;}
    .p5-txt{padding: 10px 5% 0;}
    .p6-logo{width: 180px;}
    .p2-middle, .p3-middle, .p4-middle, .p5-middle{height: 93%;}
    .p6-qrcode{width: 130px;height: 130px;margin: 0 auto 30px;}
    .prtf-row{margin-bottom: 20px;}
    .prtf-row ul li{font-size: 14px;}
    #padcast{width: 95%;margin: 5px auto 0;}
    .p2Middle_box{width: 90%;position: absolute;top: 45%;left: 50%;transform: translate(-50%, -50%);}
    .p3Middle_box{width: 100%;position: absolute;top: 42%;left: 50%;transform: translate(-50%, -50%);}
    .p4-portfolio{width: 90%;position: absolute;top: 45%;left: 50%;transform: translate(-50%, -50%);}
}