@font-face{
    font-family:vazir;
    font-style:normal;
    font-weight:900;
    src:url(/build/assets/Vazir-Bold-FD-grcBrNPd.eot?08b87f17e48f206a20e17ab85354af11);
    src:url(/build/assets/Vazir-Bold-FD-grcBrNPd.eot?08b87f17e48f206a20e17ab85354af11?#iefix) format("embedded-opentype"),url(/build/assets/Vazir-Bold-FD-3GIdADW1.woff?823b5b3701e1192e885dc9cc58fdc177) format("woff"),url(/build/assets/Vazir-Bold-FD-VZiyGgfD.ttf?9cc20b0d50d6c49692f653c622392de0) format("truetype")
}
@font-face{
    font-family:vazir;
    font-style:normal;
    font-weight:700;
    src:url(/build/assets/Vazir-Medium-FD-98ucFUTp.eot?e8bf431bb6a5a48df131757740379df2);
    src:url(/build/assets/Vazir-Medium-FD-98ucFUTp.eot?e8bf431bb6a5a48df131757740379df2?#iefix) format("embedded-opentype"),url(/build/assets/Vazir-Medium-FD-NLsnY4jB.woff?a465b68f7c1069909584ea67d34c0319) format("woff"),url(/build/assets/Vazir-Medium-FD-0JBYA0nR.ttf?3f27847a3a3b282bcee2400a6f6e2c2f) format("truetype")
}
@font-face{
    font-family:vazir;
    font-style:normal;
    font-weight:500;
    src:url(/build/assets/Vazir-Regular-FD-a2qAP86r.eot?53303c0ceea321fbdc85b02670fd0556);
    src:url(/build/assets/Vazir-Regular-FD-a2qAP86r.eot?53303c0ceea321fbdc85b02670fd0556?#iefix) format("embedded-opentype"),url(/build/assets/Vazir-Regular-FD-Qh4V6_id.woff?d402f064a654da21814cd7d67686e1d2) format("woff"),url(/build/assets/Vazir-Regular-FD-D572_w89.ttf?6a10d7a5fb2bcdd12953b99810c553fe) format("truetype")
}
@font-face{
    font-family:vazir;
    font-style:normal;
    font-weight:300;
    src:url(/build/assets/Vazir-Light-FD-8PoTqnPC.eot?7b481604de757aea4f5bf92cf505203f);
    src:url(/build/assets/Vazir-Light-FD-8PoTqnPC.eot?7b481604de757aea4f5bf92cf505203f?#iefix) format("embedded-opentype"),url(/build/assets/Vazir-Light-FD-dyZJNQ6W.woff?e6e3c9b2dbe72f247b3f618a39351453) format("woff"),url(/build/assets/Vazir-Light-FD-yDKwucKi.ttf?b9497b4bfb9aa38e50fcccca3f7b31a9) format("truetype")
}
@font-face{
    font-family:vazir;
    font-style:normal;
    font-weight:100;
    src:url(/build/assets/Vazir-Thin-FD-NgjwRCB6.eot?eb450668450513758c4dc760735661b6);
    src:url(/build/assets/Vazir-Thin-FD-NgjwRCB6.eot?eb450668450513758c4dc760735661b6?#iefix) format("embedded-opentype"),url(/build/assets/Vazir-Thin-FD-2vaXVeji.woff?27ce2292a17132cf6de308a1f3f1dfb8) format("woff"),url(/build/assets/Vazir-Thin-FD-Dz-F1WxV.ttf?50de0009ea5ff2cd18c1de41bb6f5c1d) format("truetype")
}
i,html{
    margin:0;
    padding:0;
    line-height:normal;
    -webkit-text-size-adjust:100%;
    -ms-text-size-adjust:100%;
    font-family:vazir,vazir,sans-serif;
    height:100%
}
*{
    border:0;
    padding:0;
    margin:0;
    list-style:none;
    font-style:normal;
    line-height:normal
}
img{
    max-width:100%;
    height:auto;
    vertical-align:bottom;
    display:inline-block
}
input,textarea,select,select option,button{
    outline-style:none;
    font-family:vazir,vazir,sans-serif
}
button,input[type=submit]{
    cursor:pointer
}
input:focus{
    outline:0
}
li,a{
    text-decoration:none;
    transition:all .3s ease-in-out;
    outline:0
}
li{
    transition:none
}
*,*:before,*:after{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box
}
body{
    direction:rtl;
    font-size:12px;
    margin:0;
    padding:0;
    text-align:right;
    overflow-x:hidden;
    height:100%;
    background:#edf1f7;
    font-family:vazir,vazir,sans-serif
}
body .hidden{
    display:none
}
body .width{
    width:75%
}
@media screen and (max-width: 1600px){
    body .width{
        width:100%
    }
}
@media screen and (max-width: 1000px){
    body .allHome{
        padding-bottom:80px
    }
}
.allPageIndex{
    margin:auto;
    background:#fff;
    margin-top:1rem;
    border-radius:10px;
    padding:1rem;
    box-shadow:0 0 10px #0000000d
}
.allPageIndex h1{
    padding-bottom:1rem;
    font-size:1.6rem;
    font-weight:700;
    color:#007e46;
    border-bottom:4px dashed #bbb;
    margin-bottom:1rem;
    text-align:center
}
.allPageIndex .description p{
    font-size:1rem;
    font-weight:300;
    color:#475569;
    line-height:2.25;
    border-radius:10px
}
.allPageIndex .description .image{
    display:grid;
    justify-content:center
}
.allPageIndex .pageContainer{
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-gap:1rem
}
.allPageIndex .pageContainer #map4{
    z-index:1
}
.allPageIndex .pageContainer .mapp-container{
    height:20rem!important
}
.allHeaderIndexBlock2{
    position:sticky;
    z-index:100;
    top:0
}
.allHeaderIndexBlock2 .allHeaderIndex2{
    background:#fff;
    border-bottom:2px solid #eee;
    padding-top:1rem
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top{
    display:grid;
    grid-template-columns:1fr auto;
    grid-gap:1rem;
    align-items:center;
    margin:auto;
    margin-bottom:.5rem
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .right{
    display:flex;
    align-items:center;
    justify-content:right;
    gap:1rem
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .right .rightRes{
    display:none;
    align-items:center;
    justify-content:right
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .right .rightRes svg{
    width:1.5rem;
    height:1.5rem;
    fill:#475569
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .right .logo{
    display:flex;
    align-items:center;
    justify-content:right;
    gap:.5rem
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .right .logo .pic{
    display:grid;
    align-items:center
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .right .logo .pic img{
    max-width:7rem;
    height:3rem;
    object-fit:contain
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .right .logo .title1{
    font-size:1.7rem;
    font-weight:900;
    color:#007e46
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .right form{
    position:relative
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .right form label{
    background:#fff;
    border:1px solid #bbb;
    padding:.6rem 1rem;
    display:flex;
    justify-content:right;
    align-items:center;
    border-radius:10px;
    gap:.5rem;
    cursor:text
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .right form label i{
    display:grid;
    align-items:center
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .right form label i svg{
    width:1rem;
    height:1rem;
    fill:#475569
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .right form label input{
    width:30rem;
    font-size:1rem;
    font-weight:500;
    color:#000;
    background:transparent
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .right form ul{
    position:absolute;
    top:110%;
    left:0;
    right:0;
    background:#fff;
    box-shadow:0 0 10px #0003;
    border-radius:5px;
    z-index:10
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .right form ul li a{
    font-size:.95rem;
    font-weight:700;
    color:#475569;
    padding:.5rem 1rem;
    display:flex;
    gap:.5rem
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .right form ul li a span{
    color:#007e46
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .right form ul li a:hover{
    background:#eee
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .left{
    display:flex;
    justify-content:left;
    align-items:center;
    gap:.5rem
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .left .login{
    display:flex;
    justify-content:left;
    align-items:center;
    gap:.5rem;
    font-size:1rem;
    font-weight:700;
    color:#475569;
    padding:.5rem 1rem;
    border:1px solid #475569;
    border-radius:5px
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .left .login .pic{
    display:grid;
    align-items:center
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .left .login .pic img{
    width:1.5rem;
    height:1.5rem;
    object-fit:cover;
    border-radius:50%
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .left .login span{
    font-size:.8rem;
    font-weight:300;
    color:#007e46;
    text-decoration:underline
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .left .logins{
    position:relative
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .left .logins ul{
    position:absolute;
    top:100%;
    left:0;
    min-width:10rem;
    background:#fff;
    box-shadow:0 0 10px #0000001a;
    border-radius:5px;
    z-index:10;
    opacity:0;
    visibility:hidden;
    transition:all .3s ease-in-out
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .left .logins ul li a{
    display:grid;
    padding:.5rem;
    font-size:.9rem;
    font-weight:300;
    color:#000
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .left .logins:hover ul{
    opacity:1;
    visibility:visible;
    margin-top:.5rem
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .left .chatBtn{
    display:flex;
    justify-content:right;
    align-items:center;
    gap:.5rem;
    font-size:1rem;
    font-weight:700;
    color:#475569;
    padding:.5rem 1rem;
    border-radius:5px;
    border:1px solid #475569;
    cursor:pointer
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .left .chatBtn i{
    display:grid;
    align-items:center
}
.allHeaderIndexBlock2 .allHeaderIndex2 .top .left .chatBtn i svg{
    width:1.3rem;
    height:1.3rem;
    fill:#475569
}
.allHeaderIndexBlock2 .allHeaderIndex2 .bot{
    position:relative;
    background:#007e4612;
    border-right:5px solid #007E46;
    border-left:5px solid #007E46
}
.allHeaderIndexBlock2 .allHeaderIndex2 .bot .width{
    margin:auto
}
.allHeaderIndexBlock2 .allHeaderIndex2 .bot .navList{
    display:flex;
    gap:1.5rem;
    align-items:center
}
.allHeaderIndexBlock2 .allHeaderIndex2 .bot .navList li{
    padding:.7rem 0;
    position:relative
}
.allHeaderIndexBlock2 .allHeaderIndex2 .bot .navList li a{
    font-size:1rem;
    font-weight:700;
    color:#475569
}
.allHeaderIndexBlock2 .allHeaderIndex2 .bot .navList li .headerList{
    position:absolute;
    top:100%;
    right:0;
    background:#fff;
    padding:.5rem;
    border-radius:5px;
    transition:all .1s ease-in-out;
    box-shadow:0 20px 20px #0000001a;
    border:1px solid #ddd;
    z-index:5;
    display:flex;
    opacity:0;
    visibility:hidden;
    flex-direction:column;
    flex-wrap:wrap;
    align-content:flex-start;
    align-items:baseline
}
.allHeaderIndexBlock2 .allHeaderIndex2 .bot .navList li .headerList li{
    padding:0
}
.allHeaderIndexBlock2 .allHeaderIndex2 .bot .navList li .headerList li a{
    font-weight:300;
    margin-bottom:.5rem;
    width:11rem;
    margin-left:2rem;
    display:grid
}
.allHeaderIndexBlock2 .allHeaderIndex2 .bot .navList li .headerList li .active1{
    display:flex;
    justify-content:right;
    align-items:center;
    gap:.5rem;
    margin-top:.5rem;
    font-weight:500
}
.allHeaderIndexBlock2 .allHeaderIndex2 .bot .navList li .headerList li .active1:before{
    content:"";
    display:grid;
    align-items:center;
    width:.5rem;
    height:.5rem;
    border-radius:50%;
    background:#007e46
}
.allHeaderIndexBlock2 .allHeaderIndex2 .bot .navList li .headerList li:first-child,.allHeaderIndexBlock2 .allHeaderIndex2 .bot .navList li .headerList li:first-child .active1{
    margin-top:0
}
.allHeaderIndexBlock2 .allHeaderIndex2 .bot .navList li:hover .headerList{
    visibility:visible;
    opacity:1
}
.allHeaderIndexBlock2 .chatShow{
    position:fixed;
    left:0;
    right:0;
    top:0;
    bottom:0;
    background:#00000080;
    z-index:20;
    box-shadow:10px 0 10px #00000026;
    direction:ltr
}
.allHeaderIndexBlock2 .chatShow .chatBox{
    direction:rtl;
    width:30rem;
    background:#fff
}
.allHeaderIndexBlock2 .chatShow .chatBox .block{
    position:relative
}
.allHeaderIndexBlock2 .chatShow .chatBox .block .load{
    position:absolute;
    top:0;
    right:0;
    left:0;
    bottom:0;
    background:#00000080;
    display:grid;
    justify-content:center;
    align-items:center;
    font-size:2rem;
    font-weight:700;
    color:#fff
}
.allHeaderIndexBlock2 .chatShow .chatBox .titleAll{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:.5rem;
    padding:1rem;
    border-bottom:1px solid #bbb
}
.allHeaderIndexBlock2 .chatShow .chatBox .titleAll .name{
    font-size:1rem;
    font-weight:500;
    color:#475569
}
.allHeaderIndexBlock2 .chatShow .chatBox .titleAll i{
    display:grid;
    align-items:center;
    justify-content:center
}
.allHeaderIndexBlock2 .chatShow .chatBox .titleAll i svg{
    width:1.3rem;
    height:1.3rem;
    fill:#475569
}
.allHeaderIndexBlock2 .chatShow .chatBox .items{
    height:calc(100vh - 3rem);
    overflow-y:scroll
}
.allHeaderIndexBlock2 .chatShow .chatBox .items .item{
    padding:1rem;
    display:grid;
    grid-template-columns:auto 1fr;
    grid-gap:1rem;
    border-bottom:1px solid #ddd;
    cursor:pointer
}
.allHeaderIndexBlock2 .chatShow .chatBox .items .item .pic{
    width:3rem;
    height:3rem;
    border-radius:50%;
    overflow:hidden
}
.allHeaderIndexBlock2 .chatShow .chatBox .items .item .detail .title2{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
    gap:.5rem;
    margin-bottom:.5rem
}
.allHeaderIndexBlock2 .chatShow .chatBox .items .item .detail .title2 .name{
    line-height:1.7rem;
    font-size:.8rem;
    font-weight:900;
    color:#000
}
.allHeaderIndexBlock2 .chatShow .chatBox .items .item .detail .title2 .name a{
    color:red;
    border-bottom:1px solid red;
    padding:0 3px
}
.allHeaderIndexBlock2 .chatShow .chatBox .items .item .detail .title2 .time,.allHeaderIndexBlock2 .chatShow .chatBox .items .item .detail .body{
    font-size:.8rem;
    font-weight:300;
    color:#475569
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat{
    display:grid;
    color:#434651
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-header{
    padding:10px;
    border-bottom:1px solid #eee;
    display:flex;
    align-items:center;
    justify-content:space-between;
    grid-gap:1rem
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-header .chat-with{
    font-weight:700;
    font-size:16px
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-header .chatBack{
    display:grid;
    align-items:center;
    justify-content:center;
    cursor:pointer
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-header .chatBack svg{
    width:1rem;
    height:1rem;
    fill:#475569
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-history{
    padding:15px;
    overflow-y:scroll;
    background:#eee;
    height:calc(100vh - 5.7rem)
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-history .message-data{
    display:flex;
    align-items:center;
    margin-bottom:15px
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-history .message-data-time{
    color:#475569;
    font-size:.6rem;
    padding-right:6px
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-history .message-data-name{
    color:#000;
    font-size:.9rem
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-history ul{
    display:grid
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-history .message{
    color:#fff;
    padding:10px 20px;
    line-height:26px;
    font-size:13px;
    border-radius:5px;
    margin-bottom:30px;
    max-width:90%;
    position:relative
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-history .message i{
    display:grid;
    align-items:center;
    justify-content:left;
    margin-top:.3rem
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-history .message i svg{
    width:1rem;
    height:1rem;
    fill:#fff
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-history .message:after{
    bottom:100%;
    right:7%;
    border:solid transparent;
    content:" ";
    height:0;
    width:0;
    position:absolute;
    pointer-events:none;
    border-bottom-color:#32cd32;
    border-width:10px;
    margin-left:-10px
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-history .my-message{
    float:right;
    background:#32cd32
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-history .other-message{
    background:red
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-history .other-message:after{
    border-bottom-color:red;
    right:auto;
    left:1rem
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-message{
    display:grid;
    grid-template-columns:1fr auto auto;
    align-items:center;
    grid-gap:1rem;
    padding:0 .5rem
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-message input{
    width:100%;
    font-size:1rem;
    padding:10px
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-message .sendFile{
    color:#475569;
    cursor:pointer;
    position:relative
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-message .sendFile input{
    opacity:0;
    position:absolute;
    top:0;
    right:0;
    left:0;
    bottom:0
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-message .sendFile i{
    display:flex;
    justify-content:center;
    align-items:center
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-message .sendFile i svg{
    width:1.2rem;
    height:1.2rem;
    fill:#475569;
    opacity:.7
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-message .sendTicket{
    color:#475569;
    cursor:pointer;
    position:relative;
    background:transparent;
    transform:rotate(-135deg)
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-message .sendTicket i{
    display:flex;
    justify-content:center;
    align-items:center
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .chat .chat-message .sendTicket i svg{
    width:1.2rem;
    height:1.2rem;
    fill:#475569;
    opacity:.7
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .align-left{
    justify-content:left;
    text-align:left
}
.allHeaderIndexBlock2 .chatShow .chatBox .container .float-left{
    float:left;
    text-align:left
}
@media screen and (max-width: 1000px){
    .allHeaderIndexBlock2{
        position:sticky;
        top:0;
        z-index:6
    }
    .allHeaderIndexBlock2 .chatShow .chatBox{
        width:100%
    }
    .allHeaderIndexBlock2 .allHeaderIndex2{
        padding-top:.5rem
    }
    .allHeaderIndexBlock2 .allHeaderIndex2 .top{
        grid-gap:5px
    }
    .allHeaderIndexBlock2 .allHeaderIndex2 .top .right{
        display:grid;
        grid-template-columns:auto 1fr
    }
    .allHeaderIndexBlock2 .allHeaderIndex2 .top .right .rightRes{
        display:grid
    }
    .allHeaderIndexBlock2 .allHeaderIndex2 .top .right .logo{
        display:none
    }
    .allHeaderIndexBlock2 .allHeaderIndex2 .top .right form{
        position:relative
    }
    .allHeaderIndexBlock2 .allHeaderIndex2 .top .right form label{
        grid-template-columns:auto 1fr
    }
    .allHeaderIndexBlock2 .allHeaderIndex2 .top .right form label input{
        width:100%
    }
    .allHeaderIndexBlock2 .allHeaderIndex2 .top .left,.allHeaderIndexBlock2 .allHeaderIndex2 .top .left .cityChoice{
        height:100%
    }
    .allHeaderIndexBlock2 .allHeaderIndex2 .top .left .logins,.allHeaderIndexBlock2 .allHeaderIndex2 .top .left .cart,.allHeaderIndexBlock2 .allHeaderIndex2 .bot{
        display:none
    }
}
.allHeaderIndexBlock2 .categoryHeaderResponsive{
    position:fixed;
    top:0;
    bottom:0;
    right:0;
    transition:all .3s ease-in-out;
    background:#fff;
    width:80%;
    z-index:900;
    box-shadow:0 1px 7px #00000040;
    overflow:scroll;
    display:none
}
.allHeaderIndexBlock2 .categoryHeaderResponsive .title{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
    height:55px;
    border-bottom:1px solid #bbb
}
.allHeaderIndexBlock2 .categoryHeaderResponsive .title span{
    color:#475569;
    font-weight:700;
    font-size:1rem;
    padding:0 1rem
}
.allHeaderIndexBlock2 .categoryHeaderResponsive .title i{
    border-right:1px solid #bbb;
    display:grid;
    align-items:center;
    justify-content:center;
    width:4rem;
    height:100%
}
.allHeaderIndexBlock2 .categoryHeaderResponsive .title i svg{
    width:1.7rem;
    height:1.7rem;
    fill:#475569
}
.allHeaderIndexBlock2 .categoryHeaderResponsive .allCats li .allCatsTitle{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
    height:55px;
    border-bottom:1px solid #bbb
}
.allHeaderIndexBlock2 .categoryHeaderResponsive .allCats li .allCatsTitle a{
    color:#475569;
    font-weight:300;
    font-size:.85rem;
    padding:0 1rem
}
.allHeaderIndexBlock2 .categoryHeaderResponsive .allCats li .allCatsTitle i{
    border-right:1px solid #bbb;
    display:grid;
    align-items:center;
    justify-content:center;
    width:4rem;
    height:100%
}
.allHeaderIndexBlock2 .categoryHeaderResponsive .allCats li .allCatsTitle i svg{
    width:.85rem;
    height:.85rem;
    fill:#475569
}
.allHeaderIndexBlock2 .categoryHeaderResponsive .allCats li .allCatsList{
    background:#f5f5f5;
    display:none
}
.allHeaderIndexBlock2 .categoryHeaderResponsive .allCats li .allCatsList li ul{
    background:#fff
}
.allHeaderIndexBlock2 .categoryHeaderResponsive .allCats li .allCatsList li ul li{
    background:#f5f5f5;
    border-right:1px solid #bbb
}
.allHeaderIndexBlock3{
    position:sticky;
    z-index:100;
    top:0;
    background:#fff
}
.allHeaderIndexBlock3 .allHeaderIndex3{
    display:grid;
    grid-template-columns:1fr auto;
    grid-gap:1rem;
    align-items:center;
    margin:auto
}
.allHeaderIndexBlock3 .allHeaderIndex3 .right{
    display:flex;
    justify-content:right;
    align-items:center;
    grid-gap:1rem
}
.allHeaderIndexBlock3 .allHeaderIndex3 .right .btnShowMenu{
    height:2.5rem;
    width:2.5rem;
    border-radius:10px;
    border:1px solid #bbb;
    display:grid;
    justify-content:center;
    align-items:center
}
.allHeaderIndexBlock3 .allHeaderIndex3 .right .btnShowMenu svg{
    width:1.5rem;
    height:1.5rem;
    fill:#475569
}
.allHeaderIndexBlock3 .allHeaderIndex3 .right .pic img{
    height:2.5rem;
    max-width:7rem;
    object-fit:contain
}
.allHeaderIndexBlock3 .allHeaderIndex3 .right form label{
    display:grid;
    grid-template-columns:auto 1fr auto;
    align-items:center;
    grid-gap:.5rem;
    background:#f8f8fc;
    padding:.5rem;
    border-radius:5px;
    border:1px solid #e3e7ee
}
.allHeaderIndexBlock3 .allHeaderIndex3 .right form label i{
    display:grid;
    align-items:center
}
.allHeaderIndexBlock3 .allHeaderIndex3 .right form label i svg{
    width:1.3rem;
    height:1.3rem;
    fill:#475569
}
.allHeaderIndexBlock3 .allHeaderIndex3 .right form label input{
    background:transparent
}
.allHeaderIndexBlock3 .allHeaderIndex3 .right form label select{
    background:transparent;
    border-right:1px solid #e3e7ee;
    padding-right:.5rem
}
.allHeaderIndexBlock3 .allHeaderIndex3 .right .navList{
    display:flex;
    gap:1.5rem;
    align-items:center;
    margin-bottom: 0
}
.allHeaderIndexBlock3 .allHeaderIndex3 .right .navList li{
    padding:1rem 0;
    position:relative
}
.allHeaderIndexBlock3 .allHeaderIndex3 .right .navList li a{
    font-size:1rem;
    font-weight:700;
    color:#475569;
    display:flex;
    align-items:center;
    gap:.3rem
}
.allHeaderIndexBlock3 .allHeaderIndex3 .right .navList li a i{
    display:grid;
    align-items:center;
    justify-content:center;
    opacity:.6
}
.allHeaderIndexBlock3 .allHeaderIndex3 .right .navList li a i svg{
    width:.9rem;
    height:.9rem;
    fill:#475569
}
.allHeaderIndexBlock3 .allHeaderIndex3 .right .navList li .headerList{
    position:absolute;
    top:100%;
    right:0;
    background:#fff;
    padding:.5rem;
    border-radius:5px;
    transition:all .1s ease-in-out;
    box-shadow:0 20px 20px #0000001a;
    border:1px solid #ddd;
    z-index:5;
    display:flex;
    opacity:0;
    visibility:hidden;
    flex-direction:column;
    flex-wrap:wrap;
    align-content:flex-start;
    align-items:baseline
}
.allHeaderIndexBlock3 .allHeaderIndex3 .right .navList li .headerList li{
    padding:0
}
.allHeaderIndexBlock3 .allHeaderIndex3 .right .navList li .headerList li a{
    font-weight:300;
    margin-bottom:.5rem;
    width:11rem;
    margin-left:2rem;
    display:grid
}
.allHeaderIndexBlock3 .allHeaderIndex3 .right .navList li .headerList li .active1{
    display:flex;
    justify-content:right;
    align-items:center;
    gap:.5rem;
    margin-top:.5rem;
    font-weight:500
}
.allHeaderIndexBlock3 .allHeaderIndex3 .right .navList li .headerList li .active1:before{
    content:"";
    display:grid;
    align-items:center;
    width:.5rem;
    height:.5rem;
    border-radius:50%;
    background:#007e46
}
.allHeaderIndexBlock3 .allHeaderIndex3 .right .navList li .headerList li:first-child,.allHeaderIndexBlock3 .allHeaderIndex3 .right .navList li .headerList li:first-child .active1{
    margin-top:0
}
.allHeaderIndexBlock3 .allHeaderIndex3 .right .navList li:hover .headerList{
    visibility:visible;
    opacity:1
}
.allHeaderIndexBlock3 .allHeaderIndex3 .left{
    display:flex;
    justify-content:left;
    align-items:center;
    gap:1rem
}
.allHeaderIndexBlock3 .allHeaderIndex3 .left .project{
    display:grid;
    padding:.3rem 1rem;
    border-radius:5px;
    border:2px solid #007E46;
    font-size:1rem;
    color:#007e46;
    background:#d6ffc233
}
.allHeaderIndexBlock3 .allHeaderIndex3 .left .login{
    display:grid;
    padding:.3rem 1rem;
    border-radius:5px;
    border:2px solid #e3e7ee;
    color:#000;
    font-size:1rem
}
.allHeaderIndexBlock3 .allHeaderIndex3 .left .logins{
    position:relative
}
.allHeaderIndexBlock3 .allHeaderIndex3 .left .logins .login2{
    display:flex;
    justify-content:left;
    align-items:center;
    gap:.5rem;
    font-size:1rem;
    font-weight:700;
    color:#475569
}
.allHeaderIndexBlock3 .allHeaderIndex3 .left .logins .login2 .pic{
    display:grid;
    align-items:center
}
.allHeaderIndexBlock3 .allHeaderIndex3 .left .logins .login2 .pic img{
    width:3rem;
    height:3rem;
    object-fit:cover;
    border-radius:50%
}
.allHeaderIndexBlock3 .allHeaderIndex3 .left .logins .login2 span{
    font-size:.8rem;
    font-weight:300;
    color:#007e46;
    text-decoration:underline
}
.allHeaderIndexBlock3 .allHeaderIndex3 .left .logins ul{
    position:absolute;
    top:100%;
    left:0;
    min-width:10rem;
    background:#fff;
    box-shadow:0 0 10px #0000001a;
    border-radius:5px;
    z-index:10;
    opacity:0;
    visibility:hidden;
    transition:all .3s ease-in-out
}
.allHeaderIndexBlock3 .allHeaderIndex3 .left .logins ul li a{
    display:grid;
    padding:.5rem;
    font-size:.9rem;
    font-weight:300;
    color:#000
}
.allHeaderIndexBlock3 .allHeaderIndex3 .left .logins:hover ul{
    opacity:1;
    visibility:visible;
    margin-top:.5rem
}
.allHeaderIndexBlock3 .allHeaderIndex3 .left .call{
    display:grid;
    font-size:1rem;
    color:#000
}
.allHeaderIndexBlock3 .allHeaderIndex3 .left .chatBtn{
    display:flex;
    justify-content:right;
    align-items:center;
    gap:.5rem;
    font-size:1rem;
    font-weight:700;
    color:#475569;
    padding:.3rem 1rem;
    border-radius:5px;
    border:2px solid #475569;
    cursor:pointer
}
.allHeaderIndexBlock3 .chatShow{
    position:fixed;
    left:0;
    right:0;
    top:0;
    bottom:0;
    background:#00000080;
    z-index:20;
    box-shadow:10px 0 10px #00000026;
    direction:ltr
}
.allHeaderIndexBlock3 .chatShow .chatBox{
    direction:rtl;
    width:30rem;
    background:#fff
}
.allHeaderIndexBlock3 .chatShow .chatBox .block{
    position:relative
}
.allHeaderIndexBlock3 .chatShow .chatBox .block .load{
    position:absolute;
    top:0;
    right:0;
    left:0;
    bottom:0;
    background:#00000080;
    display:grid;
    justify-content:center;
    align-items:center;
    font-size:2rem;
    font-weight:700;
    color:#fff
}
.allHeaderIndexBlock3 .chatShow .chatBox .titleAll{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:.5rem;
    padding:1rem;
    border-bottom:1px solid #bbb
}
.allHeaderIndexBlock3 .chatShow .chatBox .titleAll .name{
    font-size:1rem;
    font-weight:500;
    color:#475569
}
.allHeaderIndexBlock3 .chatShow .chatBox .titleAll i{
    display:grid;
    align-items:center;
    justify-content:center
}
.allHeaderIndexBlock3 .chatShow .chatBox .titleAll i svg{
    width:1.3rem;
    height:1.3rem;
    fill:#475569
}
.allHeaderIndexBlock3 .chatShow .chatBox .items{
    height:calc(100vh - 3rem);
    overflow-y:scroll
}
.allHeaderIndexBlock3 .chatShow .chatBox .items .item{
    padding:1rem;
    display:grid;
    grid-template-columns:auto 1fr;
    grid-gap:1rem;
    border-bottom:1px solid #ddd;
    cursor:pointer
}
.allHeaderIndexBlock3 .chatShow .chatBox .items .item .pic{
    width:3rem;
    height:3rem;
    border-radius:50%;
    overflow:hidden
}
.allHeaderIndexBlock3 .chatShow .chatBox .items .item .detail .title2{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
    gap:.5rem;
    margin-bottom:.5rem
}
.allHeaderIndexBlock3 .chatShow .chatBox .items .item .detail .title2 .name{
    line-height:1.7rem;
    font-size:.8rem;
    font-weight:900;
    color:#000
}
.allHeaderIndexBlock3 .chatShow .chatBox .items .item .detail .title2 .name a{
    color:red;
    border-bottom:1px solid red;
    padding:0 3px
}
.allHeaderIndexBlock3 .chatShow .chatBox .items .item .detail .title2 .time,.allHeaderIndexBlock3 .chatShow .chatBox .items .item .detail .body{
    font-size:.8rem;
    font-weight:300;
    color:#475569
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat{
    display:grid;
    color:#434651
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-header{
    padding:10px;
    border-bottom:1px solid #eee;
    display:flex;
    align-items:center;
    justify-content:space-between;
    grid-gap:1rem
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-header .chat-with{
    font-weight:700;
    font-size:16px
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-header .chatBack{
    display:grid;
    align-items:center;
    justify-content:center;
    cursor:pointer
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-header .chatBack svg{
    width:1rem;
    height:1rem;
    fill:#475569
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-history{
    padding:15px;
    overflow-y:scroll;
    background:#eee;
    height:calc(100vh - 5.7rem)
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-history .message-data{
    display:flex;
    align-items:center;
    margin-bottom:15px
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-history .message-data-time{
    color:#475569;
    font-size:.6rem;
    padding-right:6px
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-history .message-data-name{
    color:#000;
    font-size:.9rem
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-history ul{
    display:grid
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-history .message{
    color:#fff;
    padding:10px 20px;
    line-height:26px;
    font-size:13px;
    border-radius:5px;
    margin-bottom:30px;
    max-width:90%;
    position:relative
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-history .message i{
    display:grid;
    align-items:center;
    justify-content:left;
    margin-top:.3rem
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-history .message i svg{
    width:1rem;
    height:1rem;
    fill:#fff
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-history .message:after{
    bottom:100%;
    right:7%;
    border:solid transparent;
    content:" ";
    height:0;
    width:0;
    position:absolute;
    pointer-events:none;
    border-bottom-color:#32cd32;
    border-width:10px;
    margin-left:-10px
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-history .my-message{
    float:right;
    background:#32cd32
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-history .other-message{
    background:red
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-history .other-message:after{
    border-bottom-color:red;
    right:auto;
    left:1rem
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-message{
    display:grid;
    grid-template-columns:1fr auto auto;
    align-items:center;
    grid-gap:1rem;
    padding:0 .5rem
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-message input{
    width:100%;
    font-size:1rem;
    padding:10px
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-message .sendFile{
    color:#475569;
    cursor:pointer;
    position:relative
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-message .sendFile input{
    opacity:0;
    position:absolute;
    top:0;
    right:0;
    left:0;
    bottom:0
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-message .sendFile i{
    display:flex;
    justify-content:center;
    align-items:center
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-message .sendFile i svg{
    width:1.2rem;
    height:1.2rem;
    fill:#475569;
    opacity:.7
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-message .sendTicket{
    color:#475569;
    cursor:pointer;
    position:relative;
    background:transparent;
    transform:rotate(-135deg)
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-message .sendTicket i{
    display:flex;
    justify-content:center;
    align-items:center
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .chat .chat-message .sendTicket i svg{
    width:1.2rem;
    height:1.2rem;
    fill:#475569;
    opacity:.7
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .align-left{
    justify-content:left;
    text-align:left
}
.allHeaderIndexBlock3 .chatShow .chatBox .container .float-left{
    float:left;
    text-align:left
}
.allHeaderIndexBlock3 .categoryHeaderResponsive{
    position:fixed;
    top:0;
    bottom:0;
    right:0;
    transition:all .3s ease-in-out;
    background:#fff;
    width:20rem;
    z-index:900;
    box-shadow:0 1px 7px #00000040;
    overflow:scroll;
    display:none
}
.allHeaderIndexBlock3 .categoryHeaderResponsive .title{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
    height:55px;
    border-bottom:1px solid #bbb
}
.allHeaderIndexBlock3 .categoryHeaderResponsive .title span{
    color:#475569;
    font-weight:700;
    font-size:1rem;
    padding:0 1rem
}
.allHeaderIndexBlock3 .categoryHeaderResponsive .title i{
    border-right:1px solid #bbb;
    display:grid;
    align-items:center;
    justify-content:center;
    width:4rem;
    height:100%
}
.allHeaderIndexBlock3 .categoryHeaderResponsive .title i svg{
    width:1.7rem;
    height:1.7rem;
    fill:#475569
}
.allHeaderIndexBlock3 .categoryHeaderResponsive .allCats li .allCatsTitle{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
    height:55px;
    border-bottom:1px solid #bbb
}
.allHeaderIndexBlock3 .categoryHeaderResponsive .allCats li .allCatsTitle a{
    color:#475569;
    font-weight:300;
    font-size:.85rem;
    padding:0 1rem
}
.allHeaderIndexBlock3 .categoryHeaderResponsive .allCats li .allCatsTitle i{
    border-right:1px solid #bbb;
    display:grid;
    align-items:center;
    justify-content:center;
    width:4rem;
    height:100%
}
.allHeaderIndexBlock3 .categoryHeaderResponsive .allCats li .allCatsTitle i svg{
    width:.85rem;
    height:.85rem;
    fill:#475569
}
.allHeaderIndexBlock3 .categoryHeaderResponsive .allCats li .allCatsList{
    background:#f5f5f5;
    display:none
}
.allHeaderIndexBlock3 .categoryHeaderResponsive .allCats li .allCatsList li ul{
    background:#fff
}
.allHeaderIndexBlock3 .categoryHeaderResponsive .allCats li .allCatsList li ul li{
    background:#f5f5f5;
    border-right:1px solid #bbb
}
@media screen and (max-width: 1000px){
    .allHeaderIndexBlock3 .chatShow .chatBox{
        width:100%
    }
    .allHeaderIndexBlock3 .allHeaderIndex3{
        grid-gap:.5rem
				  
    }
    .allHeaderIndexBlock3 .allHeaderIndex3 .right{
        display:grid;
        grid-template-columns:auto 1fr;
        grid-gap:.5rem;
        padding:1rem 0
    }
    .allHeaderIndexBlock3 .allHeaderIndex3 .right .btnShowMenu{
        height:2.5rem;
        width:2.5rem
    }
    .allHeaderIndexBlock3 .allHeaderIndex3 .right .btnShowMenu svg{
        width:1.2rem;
        height:1.2rem
    }
    .allHeaderIndexBlock3 .allHeaderIndex3 .right .pic{
        display:none
    }
    .allHeaderIndexBlock3 .allHeaderIndex3 .right form label{
        grid-template-columns:1fr auto;
        grid-gap:.3rem
    }
    .allHeaderIndexBlock3 .allHeaderIndex3 .right form label i{
        display:none
    }
    .allHeaderIndexBlock3 .allHeaderIndex3 .right form label input{
        background:transparent;
        width:7rem
    }
    .allHeaderIndexBlock3 .allHeaderIndex3 .right form label select{
        background:transparent;
        border-right:1px solid #e3e7ee;
        padding-right:.5rem;
        font-size:.7rem
    }
    .allHeaderIndexBlock3 .allHeaderIndex3 .right .navList,.allHeaderIndexBlock3 .allHeaderIndex3 .left .project,.allHeaderIndexBlock3 .allHeaderIndex3 .left .logins,.allHeaderIndexBlock3 .allHeaderIndex3 .left .call{
        display:none
    }
    .allHeaderIndexBlock3 .allHeaderIndex3 .left .chatBtn{
        font-size:.9rem;
        padding:.3rem .5rem
    }
    .allHeaderIndexBlock3 .categoryHeaderResponsive{
        width:80%
    }
}
.allFooter{
    background:#151414;
    margin-top:5rem;
    position:relative
}
.allFooter .width{
    margin:auto
}
.allFooter .width .topFooter{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    justify-content:center;
    align-items:center;
    border-bottom:2px solid #333
}
.allFooter .width .topFooter .option{
    padding:2rem;
    display:flex;
    align-items:center;
    gap:1rem;
    border-left:1px solid #333
}
.allFooter .width .topFooter .option i{
    display:grid;
    align-items:center
}
.allFooter .width .topFooter .option i svg{
    width:2.2rem;
    height:2.2rem;
    fill:#007e46
}
.allFooter .width .topFooter .option .des{
    font-size:.8rem;
    font-weight:300;
    color:#ffffff80
}
.allFooter .width .topFooter .option .des .desT{
    font-size:1.1rem;
    font-weight:700;
    color:#fff;
    margin-bottom:.3rem
}
.allFooter .width .topFooter .option:last-child{
    border-left:0
}
.allFooter .width .centerFooter{
    display:grid;
    grid-template-columns:1fr 2fr;
    grid-gap:3rem;
    padding:2rem 0
}
.allFooter .width .centerFooter .right .pic{
    margin-bottom:1rem
}
.allFooter .width .centerFooter .right .pic img{
    width:auto;
    height:5rem;
    object-fit:contain
}
.allFooter .width .centerFooter .right p{
    font-size:1rem;
    font-weight:500;
    color:#fff;
    opacity:.7
}
.allFooter .width .centerFooter .left{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    grid-gap:1rem
}
.allFooter .width .centerFooter .left .item h4{
    font-size:1rem;
    font-weight:300;
    color:#fff;
    position:relative;
    margin-bottom:1.5rem
}
.allFooter .width .centerFooter .left .item h4:before{
    content:"";
    position:absolute;
    top:100%;
    width:4rem;
    height:2px;
    background:#007e46;
    right:0;
    margin-top:.5rem
}
.allFooter .width .centerFooter .left .item ul li{
    margin-top:1rem
}
.allFooter .width .centerFooter .left .item ul li a{
    display:flex;
    align-items:center;
    gap:.5rem;
    font-size:.9rem;
    font-weight:500;
    color:#fff;
    opacity:.7
}
.allFooter .width .centerFooter .left .item ul li a i{
    display:grid;
    align-items:center
}
.allFooter .width .centerFooter .left .item ul li a i svg{
    width:.8rem;
    height:.8rem;
    fill:#fff
}
.allFooter .width .centerFooter .left .item ul li:first-child{
    margin-top:0
}
.allFooter .width .centerFooter .left p{
    font-size:.8rem;
    font-weight:300;
    color:#fff;
    margin-bottom:1rem
}
.allFooter .width .centerFooter .left .trustFooter{
    display:flex;
    justify-content:right;
    align-items:center
}
.allFooter .width .centerFooter .left .trustFooter img{
    width:100%;
    height:7rem;
    object-fit:contain
}
@media screen and (max-width: 800px){
    .allFooter .width .topFooter{
        display:block
    }
    .allFooter .width .topFooter .option{
        padding:1rem;
        gap:.5rem;
        border-left:0
    }
    .allFooter .width .topFooter .option i svg{
        width:1.5rem;
        height:1.5rem
    }
    .allFooter .width .topFooter .option .des,.allFooter .width .topFooter .option .des .desT{
        font-size:.75rem
    }
    .allFooter .width .centerFooter{
        display:block;
        padding-bottom:4rem
    }
    .allFooter .width .centerFooter .right{
        margin-bottom:2rem
    }
    .allFooter .width .centerFooter .right p{
        font-size:.7rem
    }
    .allFooter .width .centerFooter .left{
        display:flex;
        flex-wrap:wrap;
        gap:1rem
    }
    .allFooter .width .centerFooter .left .item ul li a{
        font-size:.7rem
    }
    .allFooter .width .centerFooter .left .item ul li a i svg{
        width:.7rem;
        height:.7rem
    }
    .allFooter .width .centerFooter .left .item:first-child{
        width:50%
    }
    .allFooter .width .centerFooter .left .item:last-child{
        margin-top:2rem
    }
    .allFooter .width .centerFooter .left .item:nth-child(2){
        width:45%
    }
}
@media screen and (max-width: 700px){
    .allFooter{
        padding-bottom:2rem
    }
}
.allFooter2{
    background:#fff;
    margin-top:5rem;
    padding-top:3rem;
    padding-bottom:1rem;
    position:relative
}
.allFooter2 .width{
    margin:auto
}
.allFooter2 .width .skill{
    margin-bottom:3rem;
    border-bottom:1px solid #e3e7ee;
    padding-bottom:3rem
}
.allFooter2 .width .skill .title{
    font-size:1.5rem;
    font-weight:900;
    color:#000;
    margin-bottom:2rem
}
.allFooter2 .width .skill .items{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(10rem,1fr));
    grid-gap:2rem
}
.allFooter2 .width .skill .items .item span{
    font-size:1.1rem;
    font-weight:300;
    color:#475569;
    position:relative
}
.allFooter2 .width .about{
    margin-bottom:3rem;
    border-bottom:1px solid #e3e7ee;
    padding-bottom:3rem
}
.allFooter2 .width .about .title{
    font-size:1.5rem;
    font-weight:900;
    color:#007e46;
    margin-bottom:2rem
}
.allFooter2 .width .about p{
    font-size:1rem;
    font-weight:300;
    color:#475569
}
.allFooter2 .width .data,.allFooter2 .width .data .right .items{
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-gap:1rem
}
.allFooter2 .width .data .right .items .item .title3{
    font-size:1.2rem;
    font-weight:700;
    color:#475569
}
.allFooter2 .width .data .right .items .item ul li{
    margin-top:1rem
}
.allFooter2 .width .data .right .items .item ul li a{
    font-size:1rem;
    font-weight:500;
    opacity:.8;
    color:#475569;
    overflow:hidden;
    display:-webkit-box;
    -webkit-line-clamp:1;
    -webkit-box-orient:vertical;
    text-overflow:ellipsis
}
.allFooter2 .width .data .right .items .item:last-child{
    padding-right:1rem
}
.allFooter2 .width .data .right .trustFooter{
    display:flex;
    justify-content:right;
    align-items:center;
    grid-gap:1rem
}
.allFooter2 .width .data .right .trustFooter img{
    height:7rem;
    object-fit:contain
}
.allFooter2 .width .data .left .title1{
    font-size:1.2rem;
    font-weight:700;
    color:#475569
}
.allFooter2 .width .data .left .socials{
    display:flex;
    justify-content:right;
    align-items:center;
    gap:.5rem;
    margin-top:1rem
}
.allFooter2 .width .data .left .socials a{
    display:grid;
    grid-template-columns:1fr;
    align-items:center;
    justify-content:center;
    padding:.6rem;
    background:#eee;
    border-radius:5px
}
.allFooter2 .width .data .left .socials a i{
    display:grid;
    align-items:center
}
.allFooter2 .width .data .left .socials a i svg{
    width:1.2rem;
    height:1.2rem;
    fill:#475569
}
.allFooter2 .width .data .left .call,.allFooter2 .width .data .left p{
    font-size:.9rem;
    font-weight:500;
    margin-top:2rem;
    color:#475569
}
.allFooter2 .width .data .left .call span,.allFooter2 .width .data .left p span{
    opacity:.7
}
@media screen and (max-width: 1000px){
    .allFooter2{
        margin-top:3rem;
        padding-top:1rem;
        padding-bottom:1rem
    }
    .allFooter2 .width .skill{
        margin-bottom:1rem;
        padding-bottom:1rem
    }
    .allFooter2 .width .skill .title{
        font-size:1.2rem;
        margin-bottom:1rem
    }
    .allFooter2 .width .skill .items{
        display:grid;
        grid-template-columns:repeat(auto-fill,minmax(5rem,1fr));
        grid-gap:1rem
    }
    .allFooter2 .width .skill .items .item span{
        font-size:.9rem
    }
    .allFooter2 .width .about{
        margin-bottom:1rem;
        padding-bottom:1rem
    }
    .allFooter2 .width .about .title{
        font-size:1.2rem;
        margin-bottom:1rem
    }
    .allFooter2 .width .about p{
        font-size:.8rem
    }
    .allFooter2 .width .data{
        display:grid;
        grid-template-columns:1fr;
        grid-gap:.5rem
    }
    .allFooter2 .width .data .right .items .item .title3{
        font-size:1rem
    }
    .allFooter2 .width .data .right .items .item ul li a{
        font-size:.8rem
    }
    .allFooter2 .width .data .right .items .item:last-child{
        padding-right:0
    }
    .allFooter2 .width .data .right .trustFooter{
        grid-gap:.5rem;
        margin-top:.5rem
    }
    .allFooter2 .width .data .right .trustFooter img{
        height:5rem
    }
    .allFooter2 .width .data .left .title1{
        font-size:1rem;
        font-weight:700;
        color:#475569
    }
    .allFooter2 .width .data .left .socials{
        display:flex;
        justify-content:right;
        align-items:center;
        gap:.5rem;
        margin-top:1rem
    }
    .allFooter2 .width .data .left .socials a{
        display:grid;
        grid-template-columns:1fr;
        align-items:center;
        justify-content:center;
        padding:.6rem;
        background:#eee;
        border-radius:5px
    }
    .allFooter2 .width .data .left .socials a i{
        display:grid;
        align-items:center
    }
    .allFooter2 .width .data .left .socials a i svg{
        width:1.2rem;
        height:1.2rem;
        fill:#475569
    }
    .allFooter2 .width .data .left .call,.allFooter2 .width .data .left p{
        font-size:.9rem;
        font-weight:500;
        margin-top:2rem;
        color:#475569
    }
    .allFooter2 .width .data .left .call span,.allFooter2 .width .data .left p span{
        opacity:.7
    }
}
.navigation{
    height:60px;
    background:#fff;
    position:fixed;
    bottom:0;
    right:0;
    left:0;
    justify-content:center;
    align-items:center;
    border-radius:10px;
    padding:0 20px;
    z-index:3;
    box-shadow:0 -10px 10px #0000001a;
    display:none
}
.navigation .listWrap{
    list-style:none;
    display:flex;
    justify-content:space-between;
    width:100%
}
.navigation .listWrap li{
    width:70px;
    height:70px;
    position:relative;
    z-index:1
}
.navigation .listWrap li a,.navigation .listWrap li .catItemOpen{
    text-decoration:none;
    position:relative;
    display:flex;
    justify-content:center;
    align-items:center;
    flex-direction:column;
    text-align:center;
    font-weight:500;
    width:100%
}
.navigation .listWrap li a:hover,.navigation .listWrap li .catItemOpen:hover{
    text-decoration:none
}
.navigation .listWrap li a .icon,.navigation .listWrap li .catItemOpen .icon{
    position:relative;
    line-height:75px;
    text-align:center;
    transition:.5s;
    color:#f2f3f5;
    transform:translateY(-2px)
}
.navigation .listWrap li a .icon svg,.navigation .listWrap li .catItemOpen .icon svg{
    width:1.5rem;
    fill:#475569;
    height:1.5rem
}
.navigation .listWrap li a .text,.navigation .listWrap li .catItemOpen .text{
    position:absolute;
    color:#475569;
    font-weight:700;
    transition:.5s;
    font-size:.85rem;
    transform:translateY(15px);
    z-index:1
}
.navigation .listWrap li.active a .icon,.navigation .listWrap li.active .catItemOpen .icon{
    color:#fff;
    transform:translateY(-8px);
    z-index:2
}
.navigation .listWrap li.active a .icon svg,.navigation .listWrap li.active .catItemOpen .icon svg{
    fill:#fff
}
.navigation .listWrap li.active a .text,.navigation .listWrap li.active .catItemOpen .text{
    transform:translateY(15px)
}
.navigation .listWrap li .indicator{
    position:absolute;
    width:60px;
    height:60px;
    top:-25%;
    border-radius:50%;
    border:6px solid #F2F3F5;
    background:#007e46;
    transition:.3s;
    transform:translate(-5px);
    z-index:0
}
.navigation .listWrap li .indicator:before,.navigation .listWrap li .indicator:after{
    content:"";
    position:absolute;
    top:50%;
    width:20px;
    height:20px;
    background:#00f;
    background:transparent
}
@media screen and (max-width: 1000px){
    .navigation{
        display:flex
    }
}
.allProductArchive{
    display:grid;
    grid-template-columns:25rem 1fr
}
.allProductArchive .filters{
    background:#fff;
    height:calc(100vh - 3.5rem);
    overflow-y:scroll;
    position:sticky;
    top:3.5rem;
    border-left:1px solid #f2f2f2
}
.allProductArchive .filters .titleFilter{
    display:none
}
.allProductArchive .filters .filterItem{
    padding:1rem;
    border-top:2px dashed #bbb
}
.allProductArchive .filters .filterItem .title{
    font-size:1rem;
    font-weight:700;
    color:#000;
    margin-bottom:.5rem
}
.allProductArchive .filters .filterItem ul li{
    margin-top:.5rem
}
.allProductArchive .filters .filterItem ul li a{
    font-size:.9rem;
    font-weight:500;
    color:#475569
}
.allProductArchive .filters .filterItem ul li label{
    display:flex;
    justify-content:right;
    align-items:center;
    gap:.5rem;
    font-size:.9rem;
    font-weight:300;
    color:#475569;
    cursor:pointer
}
.allProductArchive .filters .filterItem ul li label input{
    width:1rem;
    height:1rem
}
.allProductArchive .filters .filterItem ul li:first-child{
    margin-top:0
}
.allProductArchive .filters .filterItem .price .priceItem{
    display:grid;
    grid-template-columns:1fr auto;
    grid-gap:.5rem;
    margin-top:1rem;
    align-items:center
}
.allProductArchive .filters .filterItem .price .priceItem label{
    display:grid;
    grid-template-columns:auto 1fr;
    border:1px solid #bbb;
    border-radius:5px;
    padding:.5rem
}
.allProductArchive .filters .filterItem .price .priceItem label span{
    font-size:.8rem;
    font-weight:300;
    color:#475569
}
.allProductArchive .filters .filterItem .price .priceItem label input{
    text-align:left;
    background:transparent
}
.allProductArchive .filters .filterItem .price .priceItem span{
    font-size:.8rem;
    font-weight:700;
    color:#475569
}
.allProductArchive .filters .filterItem .price .priceItem:first-child{
    margin-top:0
}
.allProductArchive .filters .filterItem .price button{
    margin-top:.5rem;
    width:100%;
    background:#007e46;
    border-radius:5px;
    padding:.5rem;
    text-align:center;
    color:#fff
}
.allProductArchive .filters .filterItem .search1 input{
    border:1px solid #bbb;
    border-radius:5px;
    padding:.5rem;
    font-size:.9rem;
    font-weight:500;
    color:#475569;
    width:100%;
    background:transparent
}
.allProductArchive .filters .filterItem:nth-child(2){
    border-top:0
}
.allProductArchive .filters .filterChecked{
    padding:1rem;
    border-top:2px dashed #bbb;
    display:grid;
    grid-template-columns:1fr;
    grid-gap:1rem
}
.allProductArchive .filters .filterChecked .item{
    display:grid;
    grid-template-columns:auto auto;
    align-items:center;
    justify-content:space-between;
    padding:0 .5rem;
    border-radius:.4rem;
    margin-bottom:1rem;
    font-size:1rem;
    font-weight:700;
    cursor:pointer
}
@supports (-webkit-appearance: none) or (-moz-appearance: none){
    .allProductArchive .filters .filterChecked .item input[type=checkbox],.allProductArchive .filters .filterChecked .item input[type=radio]{
        --active: #275EFE;
        --active-inner: #fff;
        --focus: 2px rgba(39, 94, 254, .3);
        --border: #BBC1E1;
        --border-hover: #275EFE;
        --background: #fff;
        --disabled: #F6F8FF;
        --disabled-inner: #E1E6F9;
        -webkit-appearance:none;
        -moz-appearance:none;
        height:21px;
        outline:none;
        display:inline-block;
        vertical-align:top;
        position:relative;
        margin:0;
        cursor:pointer;
        border:1px solid var(--bc, var(--border));
        background:var(--b, var(--background));
        transition:background .3s,border-color .3s,box-shadow .2s
    }
    .allProductArchive .filters .filterChecked .item input[type=checkbox]:after,.allProductArchive .filters .filterChecked .item input[type=radio]:after{
        content:"";
        display:block;
        left:0;
        top:0;
        position:absolute;
        transition:transform var(--d-t) var(--d-t-e, ease),opacity var(--d-o, .2s)
    }
    .allProductArchive .filters .filterChecked .item input[type=checkbox]:checked,.allProductArchive .filters .filterChecked .item input[type=radio]:checked{
        --b: var(--active);
        --bc: var(--active);
        --d-o: .3s;
        --d-t: .6s;
        --d-t-e: cubic-bezier(.2, .85, .32, 1.2)
    }
    .allProductArchive .filters .filterChecked .item input[type=checkbox]:disabled,.allProductArchive .filters .filterChecked .item input[type=radio]:disabled{
        --b: var(--disabled);
        cursor:not-allowed;
        opacity:.9
    }
    .allProductArchive .filters .filterChecked .item input[type=checkbox]:disabled:checked,.allProductArchive .filters .filterChecked .item input[type=radio]:disabled:checked{
        --b: var(--disabled-inner);
        --bc: var(--border)
    }
    .allProductArchive .filters .filterChecked .item input[type=checkbox]:disabled+label,.allProductArchive .filters .filterChecked .item input[type=radio]:disabled+label{
        cursor:not-allowed
    }
    .allProductArchive .filters .filterChecked .item input[type=checkbox]:hover:not(:checked):not(:disabled),.allProductArchive .filters .filterChecked .item input[type=radio]:hover:not(:checked):not(:disabled){
        --bc: var(--border-hover)
    }
    .allProductArchive .filters .filterChecked .item input[type=checkbox]:focus,.allProductArchive .filters .filterChecked .item input[type=radio]:focus{
        box-shadow:0 0 0 var(--focus)
    }
    .allProductArchive .filters .filterChecked .item input[type=checkbox]:not(.switch),.allProductArchive .filters .filterChecked .item input[type=radio]:not(.switch){
        width:21px
    }
    .allProductArchive .filters .filterChecked .item input[type=checkbox]:not(.switch):after,.allProductArchive .filters .filterChecked .item input[type=radio]:not(.switch):after{
        opacity:var(--o, 0)
    }
    .allProductArchive .filters .filterChecked .item input[type=checkbox]:not(.switch):checked,.allProductArchive .filters .filterChecked .item input[type=radio]:not(.switch):checked{
        --o: 1
    }
    .allProductArchive .filters .filterChecked .item input[type=checkbox]+label,.allProductArchive .filters .filterChecked .item input[type=radio]+label{
        font-size:14px;
        line-height:21px;
        display:inline-block;
        vertical-align:top;
        cursor:pointer;
        margin-left:4px
    }
    .allProductArchive .filters .filterChecked .item input[type=checkbox]:not(.switch){
        border-radius:7px
    }
    .allProductArchive .filters .filterChecked .item input[type=checkbox]:not(.switch):after{
        width:5px;
        height:9px;
        border:2px solid var(--active-inner);
        border-top:0;
        border-left:0;
        left:7px;
        top:4px;
        transform:rotate(var(--r, 20deg))
    }
    .allProductArchive .filters .filterChecked .item input[type=checkbox]:not(.switch):checked{
        --r: 43deg
    }
    .allProductArchive .filters .filterChecked .item input[type=checkbox].switch{
        width:38px;
        border-radius:11px
    }
    .allProductArchive .filters .filterChecked .item input[type=checkbox].switch:after{
        left:2px;
        top:2px;
        border-radius:50%;
        width:15px;
        height:15px;
        background:var(--ab, var(--border));
        transform:translate(var(--x, 0))
    }
    .allProductArchive .filters .filterChecked .item input[type=checkbox].switch:checked{
        --ab: var(--active-inner);
        --x: 17px
    }
    .allProductArchive .filters .filterChecked .item input[type=checkbox].switch:disabled:not(:checked):after{
        opacity:.6
    }
    .allProductArchive .filters .filterChecked .item input[type=radio]{
        border-radius:50%
    }
    .allProductArchive .filters .filterChecked .item input[type=radio]:after{
        width:19px;
        height:19px;
        border-radius:50%;
        background:var(--active-inner);
        opacity:0;
        transform:scale(var(--s, .7))
    }
    .allProductArchive .filters .filterChecked .item input[type=radio]:checked{
        --s: .5
    }
}
.allProductArchive .productContainer{
    padding:1rem
}
.allProductArchive .productContainer .ads{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));
    margin-bottom:1rem;
    grid-gap:1rem
}
.allProductArchive .productContainer .ads .ad{
    border-radius:10px;
    overflow:hidden
}
.allProductArchive .productContainer .ads .ad img{
    width:100%
}
.allProductArchive .productContainer .breadcrumbs{
    display:flex;
    justify-content:right;
    flex-wrap:wrap;
    align-items:center;
    margin-bottom:1rem
}
.allProductArchive .productContainer .breadcrumbs a{
    font-size:.8rem;
    font-weight:300;
    color:#475569
}
.allProductArchive .productContainer .breadcrumbs a:after{
    content:"/";
    padding:0 .5rem;
    color:#475569
}
.allProductArchive .productContainer .breadcrumbs a:last-child:after{
    content:unset
}
.allProductArchive .productContainer .sort{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:.5rem;
    background:#fff;
    padding:1rem;
    border-radius:10px;
    box-shadow:0 0 10px #0000000d
}
.allProductArchive .productContainer .sort ul{
    display:flex;
    justify-content:right;
    align-items:center;
    gap:1rem
}
.allProductArchive .productContainer .sort ul li{
    font-size:1rem;
    font-weight:700;
    color:#475569;
    cursor:pointer
}
.allProductArchive .productContainer .sort ul li .active{
    color:#007e46;
    text-shadow:0 2px 5px rgba(0,0,0,.2)
}
.allProductArchive .productContainer .sortRes{
    display:none;
    grid-template-columns:1fr 1fr;
    grid-gap:.5rem;
    background:#fff;
    padding:.5rem;
    position:sticky;
    top:3.5rem
}
.allProductArchive .productContainer .sortRes .openFilter,.allProductArchive .productContainer .sortRes select{
    background:#f5f5f5;
    cursor:pointer;
    border-radius:5px;
    padding:5px;
    border:1px solid #bbb;
    font-size:.8rem;
    font-weight:300;
    color:#475569
}
.allProductArchive .productContainer .products{
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-gap:1rem;
    margin-top:1rem
}
.allProductArchive .productContainer .products .item{
    display:grid;
    grid-template-columns:1fr auto;
    background:#fff;
    box-shadow:0 0 10px #0000000d;
    border-radius:10px;
    padding:1rem
}
.allProductArchive .productContainer .products .item .detail .title{
    font-size:1.2rem;
    font-weight:700;
    color:#000;
    overflow:hidden;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    text-overflow:ellipsis;
    margin-bottom:.5rem
}
.allProductArchive .productContainer .products .item .detail p{
    font-size:.9rem;
    font-weight:300;
    color:#475569;
    white-space:pre-line;
    display:-webkit-box;
    box-orient:vertical;
    -webkit-box-orient:vertical;
    line-clamp:2;
    text-align:right;
    -webkit-line-clamp:2;
    overflow:hidden;
    text-overflow:ellipsis
}
.allProductArchive .productContainer .products .item .detail .skills{
    display:grid;
    grid-template-columns:auto 1fr;
    grid-gap:.5rem;
    margin-top:1rem;
    align-items:center
}
.allProductArchive .productContainer .products .item .detail .skills .title2{
    display:flex;
    align-items:center;
    justify-content:right;
    gap:.5rem;
    font-size:.9rem;
    font-weight:500;
    color:#475569
}
.allProductArchive .productContainer .products .item .detail .skills .title2 i{
    display:grid;
    align-items:center
}
.allProductArchive .productContainer .products .item .detail .skills .title2 i svg{
    width:1rem;
    height:1rem;
    fill:#007e46
}
.allProductArchive .productContainer .products .item .detail .skills .skill{
    display:flex;
    flex-wrap:wrap
}
.allProductArchive .productContainer .products .item .detail .skills .skill span{
    font-size:.8rem;
    font-weight:300;
    color:#000
}
.allProductArchive .productContainer .products .item .detail .skills .skill span:before{
    content:",";
    padding:0 .2rem
}
.allProductArchive .productContainer .products .item .detail .skills .skill span:first-child:before{
    content:unset;
    padding:0
}
.allProductArchive .productContainer .products .item .detail .skills .skill .box{
    background:red;
    color:#fff;
    padding:.2rem;
    border-radius:5px
}
.allProductArchive .productContainer .products .item .detail .skills .skill .box:before{
    content:unset
}
.allProductArchive .productContainer .products .item .detail .skills .boxes{
    gap:.5rem
}
.allProductArchive .productContainer .products .item .price{
    padding-right:1rem;
    border-right:5px double #f1f1f1;
    min-width:16rem
}
.allProductArchive .productContainer .products .item .price .option{
    display:flex;
    justify-content:space-between;
    align-items:center;
    font-size:.85rem;
    font-weight:500;
    text-align:center;
    color:#000;
    padding:.5rem;
    border-radius:5px;
    margin-top:.5rem;
    background:#f9f9f9;
    border:1px solid #eee;
    border-right:3px solid #007E46
}
.allProductArchive .productContainer .products .item .price .option i{
    display:grid;
    align-items:center
}
.allProductArchive .productContainer .products .item .price .option i svg{
    width:1rem;
    height:1rem;
    fill:#475569
}
.allProductArchive .productContainer .products .item .price .more{
    background:#007e46;
    color:#fff;
    padding:.5rem;
    border-radius:5px;
    text-align:center;
    margin-top:.5rem;
    font-size:.9rem;
    font-weight:500
}
.allProductArchive .productContainer .products .active1{
    background:linear-gradient(to right,#fff,#00800033 30%,#00800033 80%,#fff);
    background-size:200% auto;
    animation:shine3 2s linear infinite
}
@keyframes shine3{
    to{
        background-position:200% center
    }
}
@media screen and (max-width: 1600px){
    .allProductArchive .productContainer .products{
        margin-top:0;
        display:block
    }
    .allProductArchive .productContainer .products .item{
        margin-top:1rem
    }
}
@media screen and (max-width: 1000px){
    .allProductArchive{
        display:block
    }
    .allProductArchive .filters{
        display:none;
        position:fixed;
        top:0;
        right:0;
        left:0;
        bottom:0;
        z-index:100;
        overflow-y:scroll
    }
    .allProductArchive .filters .titleFilter{
        display:grid;
        grid-template-columns:1fr auto;
        align-items:center;
        padding:1rem;
        background:#fff;
        position:sticky;
        top:0;
        border-bottom:2px dashed #bbb
    }
    .allProductArchive .filters .titleFilter .title2{
        font-size:1.1rem;
        font-weight:700;
        color:#000
    }
    .allProductArchive .filters .titleFilter i{
        display:grid;
        align-items:center;
        cursor:pointer
    }
    .allProductArchive .filters .titleFilter i svg{
        width:1.5rem;
        height:1.5rem;
        fill:#000
    }
    .allProductArchive .productContainer{
        padding:0
    }
    .allProductArchive .productContainer .ads{
        padding:.5rem;
        grid-gap:.5rem
    }
    .allProductArchive .productContainer .breadcrumbs{
        margin:.5rem
    }
    .allProductArchive .productContainer .sort{
        display:none
    }
    .allProductArchive .productContainer .sortRes{
        display:grid
    }
    .allProductArchive .productContainer .products{
        grid-template-columns:1fr 1fr;
        grid-gap:.5rem;
        padding:0 .5rem
    }
    .allProductArchive .productContainer .products .item{
        grid-template-columns:1fr;
        border-radius:5px;
        padding:.5rem;
        margin-top:.5rem
    }
    .allProductArchive .productContainer .products .item .detail .title{
        font-size:1rem
    }
    .allProductArchive .productContainer .products .item .detail p{
        font-size:.8rem
    }
    .allProductArchive .productContainer .products .item .detail .skills{
        margin-top:.5rem
    }
    .allProductArchive .productContainer .products .item .detail .skills .title2{
        font-size:.8rem
    }
    .allProductArchive .productContainer .products .item .detail .skills .title2 i svg{
        width:.8rem;
        height:.8rem
    }
    .allProductArchive .productContainer .products .item .detail .skills .skill span{
        font-size:.7rem
    }
    .allProductArchive .productContainer .products .item .price{
        padding-right:0;
        border-right:0;
        min-width:auto;
        margin-top:.5rem
    }
    .allProductArchive .productContainer .products .item .price .option{
        font-size:.75rem
    }
    .allProductArchive .productContainer .products .item .price .option i svg{
        width:.8rem;
        height:.8rem
    }
    .allProductArchive .productContainer .products .item .price .more{
        font-size:.75rem
    }
}
.allNews{
    margin:auto;
    margin-top:2rem;
    min-height:calc(100vh - 12rem)
}
.allNews h1{
    font-size:1.5rem;
    font-weight:900;
    color:#007e46;
    margin-bottom:2rem
}
.allNews .allNewsRightItems{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(25rem,1fr));
    grid-gap:1rem;
    margin-bottom:2rem
}
.allNews .allNewsRightItems .allNewsRightItem{
    position:relative;
    border-radius:10px;
    overflow:hidden
}
.allNews .allNewsRightItems .allNewsRightItem img{
    width:100%;
    height:100%;
    object-fit:cover
}
.allNews .allNewsRightItems .allNewsRightItem .allNewsRightItemOver{
    position:absolute;
    top:0;
    right:0;
    left:0;
    bottom:0;
    box-shadow:inset 0 -50px 50px #0006;
    border-radius:10px;
    padding:1rem;
    display:grid;
    align-items:end
}
.allNews .allNewsRightItems .allNewsRightItem .allNewsRightItemOver span{
    border-radius:5px;
    padding:.3rem 1rem;
    font-weight:500;
    font-size:.9rem;
    background:#dd4b39;
    color:#fff;
    position:absolute;
    top:1rem;
    left:1rem
}
.allNews .allNewsRightItems .allNewsRightItem .allNewsRightItemOver .active{
    background:#3cd901e6;
    color:#fff
}
.allNews .allNewsRightItems .allNewsRightItem .allNewsRightItemOver h3{
    font-size:1rem;
    font-weight:700;
    color:#fff;
    margin-top:1rem;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden
}
.allNews .description{
    margin-top:2rem
}
.allNews .description p{
    font-size:1rem;
    font-weight:500;
    color:#475569;
    line-height:2rem
}
@media screen and (max-width: 1000px){
    .allNews{
        padding-top:1rem
    }
    .allNews .allNewsRightItems{
        grid-template-columns:1fr
    }
}
.allShopsArchive{
    margin:auto;
    margin-top:2rem;
    min-height:100vh
}
.allShopsArchive .tops{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
    grid-gap:1rem;
    padding:1rem;
    border-radius:10px;
    background:#fff
}
.allShopsArchive .tops h1{
    font-size:1.5rem;
    font-weight:500;
    color:#000
}
.allShopsArchive .tops h1 span{
    color:#007e46
}
.allShopsArchive .tops label input{
    background:#f2f3f7;
    border-radius:10px;
    font-size:1rem;
    font-weight:300;
    color:#000;
    width:25rem;
    padding:.5rem 1rem
}
.allShopsArchive ul{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(20rem,1fr));
    grid-gap:1rem;
    margin:1rem 0
}
.allShopsArchive ul li a{
    display:grid;
    background:#fff;
    padding:1rem;
    border-radius:10px
}
.allShopsArchive ul li a .pic{
    display:grid;
    justify-content:center;
    align-items:center
}
.allShopsArchive ul li a .pic img{
    width:100%;
    height:6rem;
    object-fit:contain
}
.allShopsArchive ul li a .titles{
    display:grid;
    grid-template-columns:1fr auto;
    grid-gap:1rem;
    padding:.5rem 0;
    margin:1rem 0;
    border-top:1px solid #ddd;
    border-bottom:1px solid #ddd
}
.allShopsArchive ul li a .titles h3{
    text-overflow:ellipsis;
    white-space:nowrap;
    overflow:hidden;
    font-size:1rem;
    font-weight:500;
    color:#000
}
.allShopsArchive ul li a .titles .stars{
    display:flex;
    justify-content:left;
    align-items:center;
    gap:.2rem;
    font-size:1rem;
    font-weight:500;
    color:#000
}
.allShopsArchive ul li a .titles .stars .rateItem{
    display:grid;
    align-items:center
}
.allShopsArchive ul li a .titles .stars img{
    width:1rem;
    height:1rem
}
.allShopsArchive ul li a .options{
    display:grid;
    grid-template-columns:1fr 1fr
}
.allShopsArchive ul li a .options .name{
    font-size:.85rem;
    font-weight:700;
    color:#475569;
    opacity:.6
}
.allShopsArchive ul li a .options .body{
    font-size:.85rem;
    font-weight:500;
    color:#000
}
.allShopsArchive ul li a .options .type{
    border-left:1px solid #ddd;
    padding-left:1rem
}
.allShopsArchive ul li a .options .time{
    padding-right:1rem
}
@media screen and (max-width: 1000px){
    .allShopsArchive{
        margin-top:1rem
    }
    .allShopsArchive .tops{
        grid-template-columns:1fr
    }
    .allShopsArchive .tops label input{
        width:100%
    }
    .allShopsArchive ul{
        grid-template-columns:1fr
    }
}
.allProductSingle{
    margin:auto;
    margin-top:1rem
}
.allProductSingle .ads{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));
    margin-bottom:1rem;
    grid-gap:1rem
}
.allProductSingle .ads .ad{
    border-radius:10px;
    overflow:hidden
}
.allProductSingle .ads .ad img{
    width:100%
}
.allProductSingle .breadcrumbs{
    display:flex;
    justify-content:right;
    flex-wrap:wrap;
    align-items:center;
    margin-bottom:1rem
}
.allProductSingle .breadcrumbs a{
    font-size:.8rem;
    font-weight:300;
    color:#475569
}
.allProductSingle .breadcrumbs a:after{
    content:"/";
    padding:0 .5rem;
    color:#475569
}
.allProductSingle .breadcrumbs a:last-child:after{
    content:unset
}
.allProductSingle .topSingle{
    box-shadow:0 0 10px #0000001a;
    background:#fff;
    border-radius:10px;
    overflow:hidden;
    position:relative;
    border-top:5px solid #007E46
}
.allProductSingle .topSingle h1{
    font-size:1.3rem;
    font-weight:900;
    color:#000;
    text-align:center;
    padding:2rem;
    padding-bottom:0
}
.allProductSingle .topSingle .options{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    margin-top:2rem;
    padding:1rem 2rem;
    background:#eee
}
.allProductSingle .topSingle .options .right .author{
    display:flex;
    justify-content:right;
    align-items:center;
    gap:.5rem;
    font-size:1rem;
    font-weight:500;
    color:#475569
}
.allProductSingle .topSingle .options .right .author img{
    width:2.5rem;
    height:2.5rem;
    object-fit:cover;
    border-radius:50%
}
.allProductSingle .topSingle .options .right .author span{
    font-weight:700;
    color:#000
}
.allProductSingle .topSingle .options .left{
    display:flex;
    align-items:center;
    justify-content:left;
    gap:1rem
}
.allProductSingle .topSingle .options .left .option1{
    display:flex;
    cursor:pointer;
    justify-content:center;
    align-items:center;
    gap:.5rem;
    font-size:.9rem;
    font-weight:500;
    color:#000;
    border-radius:5px;
    background:#fff;
    border:1px solid #bbb;
    padding:.5rem 1rem
}
.allProductSingle .topSingle .options .left .option1 i{
    display:grid;
    align-items:center
}
.allProductSingle .topSingle .options .left .option1 i svg{
    width:1rem;
    height:1rem;
    fill:#000
}
.allProductSingle .topSingle .body{
    padding:2rem
}
.allProductSingle .topSingle .body .title1{
    font-size:1.2rem;
    font-weight:700;
    color:#000;
    margin-bottom:.5rem
}
.allProductSingle .topSingle .body p{
    font-size:1rem;
    font-weight:300;
    color:#475569;
    white-space:pre-line;
    display:-webkit-box;
    box-orient:vertical;
    -webkit-box-orient:vertical;
    text-align:right;
    text-overflow:ellipsis
}
.allProductSingle .topSingle .skills{
    padding:2rem
}
.allProductSingle .topSingle .skills .title1{
    font-size:1rem;
    font-weight:700;
    color:#000;
    margin-bottom:1rem
}
.allProductSingle .topSingle .skills ul{
    display:flex;
    justify-content:right;
    align-items:center;
    gap:.5rem
}
.allProductSingle .topSingle .skills ul li{
    font-size:.8rem;
    padding:.2rem .5rem;
    border-radius:5px;
    font-weight:500;
    color:#475569;
    border:1px solid #bbb
}
.allProductSingle .topSingle .bot{
    display:grid;
    grid-template-columns:1fr auto;
    grid-gap:.5rem;
    align-items:center;
    background:#f9f9f9;
    border-top:1px solid #bbb
}
.allProductSingle .topSingle .bot .right{
    padding:1rem 2rem;
    padding-left:0;
    display:flex;
    align-items:center;
    justify-content:right;
    gap:3rem
}
.allProductSingle .topSingle .bot .right .item{
    display:flex;
    justify-content:right;
    align-items:center;
    gap:1rem
}
.allProductSingle .topSingle .bot .right .item i{
    display:grid;
    align-items:center
}
.allProductSingle .topSingle .bot .right .item i svg{
    width:2rem;
    height:2rem;
    fill:#007e46
}
.allProductSingle .topSingle .bot .right .item .title2{
    font-size:.9rem;
    font-weight:500;
    color:#475569
}
.allProductSingle .topSingle .bot .right .item .data{
    font-size:1rem;
    font-weight:900;
    color:#000
}
.allProductSingle .topSingle .bot .right .item .data2{
    font-size:1rem;
    font-weight:300;
    color:#475569
}
.allProductSingle .topSingle .bot .right .item .data2 span{
    font-size:1.1rem;
    color:#000;
    font-weight:900
}
.allProductSingle .topSingle .bot .left{
    display:flex;
    justify-content:left;
    align-items:center;
    gap:1rem;
    height:100%
}
.allProductSingle .topSingle .bot .left .item .title2{
    font-size:.9rem;
    font-weight:500;
    color:#475569
}
.allProductSingle .topSingle .bot .left .item .data{
    font-size:1.1rem;
    font-weight:900;
    color:#000;
    text-align:left
}
.allProductSingle .topSingle .bot .left .send{
    display:flex;
    align-items:center;
    gap:1rem;
    padding:1rem 2rem;
    background:#007e46;
    color:#fff;
    font-size:1.2rem;
    font-weight:700;
    height:100%;
    cursor:pointer
}
.allProductSingle .topSingle .bot .left .send i{
    display:grid;
    align-items:center
}
.allProductSingle .topSingle .bot .left .send i svg{
    width:1.5rem;
    height:1.5rem;
    fill:#fff
}
.allProductSingle .topSingle:before{
    content:"";
    position:absolute;
    top:0;
    right:0;
    height:2rem;
    width:2rem;
    background:#007e46;
    border-bottom-left-radius:5rem
}
.allProductSingle .topSingle:after{
    content:"";
    position:absolute;
    top:0;
    left:0;
    height:2rem;
    width:2rem;
    background:#007e46;
    border-bottom-right-radius:5rem
}
.allProductSingle .demands{
    box-shadow:0 0 10px #0000001a;
    background:#fff;
    border-radius:10px;
    overflow:hidden;
    padding:2rem;
    margin-top:3rem
}
.allProductSingle .demands .title{
    font-size:1.4rem;
    font-weight:900;
    color:#000;
    text-align:center
}
.allProductSingle .demands ul{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(20rem,1fr));
    grid-gap:1rem;
    margin-top:2rem
}
.allProductSingle .demands ul li{
    border-radius:10px;
    border:1px solid #bbb;
    background:#fff;
    padding:1rem
}
.allProductSingle .demands ul li .pic{
    display:grid;
    justify-content:center
}
.allProductSingle .demands ul li .pic img{
    width:4rem;
    height:4rem;
    object-fit:cover;
    border-radius:50%
}
.allProductSingle .demands ul li .name{
    display:grid;
    font-size:1rem;
    font-weight:700;
    justify-content:center;
    color:#007e46;
    margin-top:.5rem
}
.allProductSingle .demands ul li p{
    font-size:1rem;
    font-weight:300;
    color:#475569;
    white-space:pre-line;
    display:-webkit-box;
    box-orient:vertical;
    -webkit-box-orient:vertical;
    line-clamp:6;
    text-align:right;
    -webkit-line-clamp:6;
    overflow:hidden;
    text-overflow:ellipsis
}
.allProductSingle .demands ul li .bot{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:.5rem;
    border-top:1px solid #bbb;
    padding-top:1rem;
    margin-top:1rem
}
.allProductSingle .demands ul li .bot .item{
    display:flex;
    justify-content:right;
    align-items:center;
    gap:.5rem;
    font-size:.85rem;
    font-weight:300;
    color:#475569
}
.allProductSingle .demands ul li .bot .item i{
    display:grid;
    align-items:center
}
.allProductSingle .demands ul li .bot .item i svg{
    width:1rem;
    height:1rem;
    fill:#475569
}
.allProductSingle .demands ul li .bot .item span{
    color:#000;
    font-weight:700
}
.allProductSingle .allSendDemand{
    background:#00000080;
    z-index:4000;
    position:fixed;
    top:0;
    right:0;
    width:100%;
    height:100%;
    display:grid;
    grid-template-columns:1fr;
    justify-content:center;
    overflow-y:scroll
}
.allProductSingle .allSendDemand .sendDemand{
    width:60%;
    margin:auto;
    background:#fff;
    display:grid;
    grid-template-columns:1fr;
    border-radius:.4rem;
    overflow:hidden
}
.allProductSingle .allSendDemand .sendDemand .title{
    padding:1rem;
    display:flex;
    justify-content:space-between;
    align-items:center;
    font-size:1.2rem;
    font-weight:700;
    color:#000;
    border-bottom:1px solid #bbb
}
.allProductSingle .allSendDemand .sendDemand .title i{
    cursor:pointer;
    display:grid;
    align-items:center
}
.allProductSingle .allSendDemand .sendDemand .title i svg{
    width:2rem;
    height:2rem;
    fill:#000
}
.allProductSingle .allSendDemand .sendDemand .top{
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-gap:1rem;
    padding:1rem
}
.allProductSingle .allSendDemand .sendDemand .top .form .item{
    margin-top:1rem
}
.allProductSingle .allSendDemand .sendDemand .top .form .item .name{
    font-size:.9rem;
    font-weight:300;
    color:#000;
    margin-bottom:.5rem
}
.allProductSingle .allSendDemand .sendDemand .top .form .item label{
    display:grid;
    grid-template-columns:1fr auto;
    border-radius:5px;
    overflow:hidden;
    border:1px solid #f2f2f2
}
.allProductSingle .allSendDemand .sendDemand .top .form .item label input{
    padding:.5rem;
    direction:ltr;
    font-weight:300;
    font-size:1rem
}
.allProductSingle .allSendDemand .sendDemand .top .form .item label span{
    display:grid;
    align-items:center;
    background:#eee;
    padding:.3rem .5rem;
    font-weight:300;
    font-size:1rem;
    color:#000;
    text-align:center
}
.allProductSingle .allSendDemand .sendDemand .top .form .item:first-child{
    margin-top:0
}
.allProductSingle .allSendDemand .sendDemand .top .prices{
    background:#eee;
    padding:1rem;
    border-radius:10px
}
.allProductSingle .allSendDemand .sendDemand .top .prices .title2{
    text-align:center;
    font-size:1rem;
    font-weight:500;
    color:#007e46;
    border-bottom:1px solid #bbb;
    padding-bottom:.5rem;
    margin-bottom:.5rem
}
.allProductSingle .allSendDemand .sendDemand .top .prices .item{
    padding:.5rem 0;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:.5rem
}
.allProductSingle .allSendDemand .sendDemand .top .prices .item .name,.allProductSingle .allSendDemand .sendDemand .top .prices .item .price{
    font-size:.8rem;
    font-weight:500;
    color:#475569
}
.allProductSingle .allSendDemand .sendDemand .top .prices .item .price span{
    font-size:1rem;
    color:#000;
    font-weight:700
}
.allProductSingle .allSendDemand .sendDemand .top .prices .item:last-child .name,.allProductSingle .allSendDemand .sendDemand .top .prices .item:last-child .price{
    font-size:1rem;
    color:#007e46
}
.allProductSingle .allSendDemand .sendDemand .top .prices .item:last-child .name span,.allProductSingle .allSendDemand .sendDemand .top .prices .item:last-child .price span{
    color:#007e46
}
.allProductSingle .allSendDemand .sendDemand .payConditions{
    padding:1rem
}
.allProductSingle .allSendDemand .sendDemand .payConditions .title2{
    font-size:.9rem;
    font-weight:900;
    color:#000
}
.allProductSingle .allSendDemand .sendDemand .payConditions .note{
    color:red;
    font-size:.8rem;
    font-weight:500;
    margin:1rem 0
}
.allProductSingle .allSendDemand .sendDemand .payConditions .items .item{
    display:grid;
    grid-template-columns:1fr auto 1fr 3rem 3rem;
    align-items:center;
    grid-gap:1rem;
    margin-bottom:1rem
}
.allProductSingle .allSendDemand .sendDemand .payConditions .items .item label{
    display:grid;
    grid-template-columns:1fr auto;
    border-radius:5px;
    overflow:hidden;
    border:1px solid #f2f2f2
}
.allProductSingle .allSendDemand .sendDemand .payConditions .items .item label input{
    padding:.5rem;
    direction:ltr;
    font-weight:300;
    font-size:1rem
}
.allProductSingle .allSendDemand .sendDemand .payConditions .items .item label span{
    display:grid;
    align-items:center;
    background:#eee;
    padding:.3rem .5rem;
    font-weight:300;
    font-size:1rem;
    color:#000;
    text-align:center
}
.allProductSingle .allSendDemand .sendDemand .payConditions .items .item .title2{
    display:flex;
    justify-content:center;
    align-items:center;
    font-size:.9rem;
    font-weight:700;
    color:#475569
}
.allProductSingle .allSendDemand .sendDemand .payConditions .items .item i{
    display:grid;
    align-items:center;
    cursor:pointer
}
.allProductSingle .allSendDemand .sendDemand .payConditions .items .item i svg{
    width:1.2rem;
    height:1.2rem;
    fill:#475569
}
.allProductSingle .allSendDemand .sendDemand .payConditions .addConditions{
    color:#007e46;
    text-decoration:underline;
    font-size:.8rem;
    font-weight:500;
    cursor:pointer
}
.allProductSingle .allSendDemand .sendDemand .progressPay{
    padding:1rem;
    background:#eee
}
.allProductSingle .allSendDemand .sendDemand .progressPay .titles{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:.5rem
}
.allProductSingle .allSendDemand .sendDemand .progressPay .titles .all{
    display:grid;
    grid-template-columns:1fr;
    grid-gap:.5rem
}
.allProductSingle .allSendDemand .sendDemand .progressPay .titles .all span{
    font-size:.8rem;
    font-weight:300;
    color:#475569
}
.allProductSingle .allSendDemand .sendDemand .progressPay .titles .all .data{
    font-size:.9rem
}
.allProductSingle .allSendDemand .sendDemand .progressPay .titles .all .data span{
    font-weight:900;
    color:#000;
    font-size:1rem
}
.allProductSingle .allSendDemand .sendDemand .progressPay .titles .all:last-child{
    text-align:left
}
.allProductSingle .allSendDemand .sendDemand .progressPay .progress{
    position:relative;
    z-index:1;
    width:100%;
    height:5px;
    background:#fff;
    margin-top:1rem;
    border-radius:5rem;
    overflow:hidden
}
.allProductSingle .allSendDemand .sendDemand .progressPay .progress .move{
    position:absolute;
    z-index:2;
    right:0;
    top:0;
    bottom:0;
    width:0;
    background:#00f;
    transition:all .3s ease-in-out
}
.allProductSingle .allSendDemand .sendDemand .description{
    padding:1rem
}
.allProductSingle .allSendDemand .sendDemand .description .title2{
    font-size:1rem;
    font-weight:900;
    color:#000
}
.allProductSingle .allSendDemand .sendDemand .description p{
    font-size:.9rem;
    font-weight:300;
    color:#475569
}
.allProductSingle .allSendDemand .sendDemand .description textarea{
    font-size:1rem;
    font-weight:500;
    color:#475569;
    border:1px solid #bbb;
    padding:1rem;
    width:100%;
    border-radius:5px;
    margin-top:.5rem
}
.allProductSingle .allSendDemand .sendDemand .buttons{
    display:flex;
    justify-content:right;
    align-items:center;
    padding:1rem;
    padding-top:0;
    gap:1rem
}
.allProductSingle .allSendDemand .sendDemand .buttons .sendCondition1[disabled]{
    opacity:.4
}
.allProductSingle .allSendDemand .sendDemand .buttons .sendCondition1,.allProductSingle .allSendDemand .sendDemand .buttons button{
    background:#007e46;
    color:#fff;
    font-size:1rem;
    font-weight:300;
    border-radius:5px;
    padding:.3rem 1rem
}
.allProductSingle .allSendDemand .sendDemand .buttons .sendCondition1:last-child,.allProductSingle .allSendDemand .sendDemand .buttons button:last-child{
    background:transparent;
    color:red;
    border:1px solid red;
    border-radius:5px
}
@media screen and (max-width: 1000px){
    .allProductSingle{
        margin-top:.5rem
    }
    .allProductSingle .allSendDemand .sendDemand{
        width:95%
    }
    .allProductSingle .allSendDemand .sendDemand .title{
        padding:.5rem;
        font-size:.9rem
    }
    .allProductSingle .allSendDemand .sendDemand .title i svg{
        width:1.3rem;
        height:1.3rem
    }
    .allProductSingle .allSendDemand .sendDemand .top{
        grid-template-columns:1fr;
        padding:.5rem
    }
    .allProductSingle .allSendDemand .sendDemand .top .form .item .name{
        font-size:.8rem
    }
    .allProductSingle .allSendDemand .sendDemand .top .form .item label input,.allProductSingle .allSendDemand .sendDemand .top .form .item label span{
        font-size:.7rem
    }
    .allProductSingle .allSendDemand .sendDemand .top .prices{
        padding:.5rem
    }
    .allProductSingle .allSendDemand .sendDemand .top .prices .title2,.allProductSingle .allSendDemand .sendDemand .top .prices .item .name,.allProductSingle .allSendDemand .sendDemand .top .prices .item .price,.allProductSingle .allSendDemand .sendDemand .top .prices .item .price span{
        font-size:.7rem
    }
    .allProductSingle .allSendDemand .sendDemand .top .prices .item:last-child .name,.allProductSingle .allSendDemand .sendDemand .top .prices .item:last-child .price{
        font-size:.8rem
    }
    .allProductSingle .allSendDemand .sendDemand .payConditions{
        padding:.5rem
    }
    .allProductSingle .allSendDemand .sendDemand .payConditions .title2{
        font-size:.7rem
    }
    .allProductSingle .allSendDemand .sendDemand .payConditions .note{
        font-size:.7rem;
        margin:.5rem 0
    }
    .allProductSingle .allSendDemand .sendDemand .payConditions .items .item{
        grid-template-columns:1fr auto 1fr auto auto;
        grid-gap:.5rem
    }
    .allProductSingle .allSendDemand .sendDemand .payConditions .items .item label{
        grid-template-columns:1fr auto
    }
    .allProductSingle .allSendDemand .sendDemand .payConditions .items .item label input{
        font-size:.7rem
    }
    .allProductSingle .allSendDemand .sendDemand .payConditions .items .item label span{
        font-size:.6rem
    }
    .allProductSingle .allSendDemand .sendDemand .payConditions .items .item .title2{
        font-size:.7rem
    }
    .allProductSingle .allSendDemand .sendDemand .payConditions .items .item i svg{
        width:.9rem;
        height:.9rem
    }
    .allProductSingle .allSendDemand .sendDemand .payConditions .addConditions{
        font-size:.7rem
    }
    .allProductSingle .allSendDemand .sendDemand .progressPay{
        padding:.5rem
    }
    .allProductSingle .allSendDemand .sendDemand .progressPay .titles .all span,.allProductSingle .allSendDemand .sendDemand .progressPay .titles .all .data{
        font-size:.7rem
    }
    .allProductSingle .allSendDemand .sendDemand .progressPay .titles .all .data span{
        font-size:.8rem
    }
    .allProductSingle .allSendDemand .sendDemand .description{
        padding:.5rem
    }
    .allProductSingle .allSendDemand .sendDemand .description .title2{
        font-size:.7rem
    }
    .allProductSingle .allSendDemand .sendDemand .description p{
        font-size:.6rem
    }
    .allProductSingle .allSendDemand .sendDemand .description textarea{
        font-size:.7rem;
        padding:.5rem
    }
    .allProductSingle .allSendDemand .sendDemand .buttons{
        padding:.5rem;
        gap:.5rem
    }
    .allProductSingle .allSendDemand .sendDemand .buttons .sendCondition1,.allProductSingle .allSendDemand .sendDemand .buttons button{
        font-size:.7rem;
        padding:.3rem .5rem
    }
    .allProductSingle .breadcrumbs{
        margin-bottom:.5rem
    }
    .allProductSingle .breadcrumbs a:nth-last-child(2):after{
        content:unset
    }
    .allProductSingle .breadcrumbs a:last-child{
        display:none
    }
    .allProductSingle .topSingle{
        border-radius:5px;
        border-top:0
    }
    .allProductSingle .topSingle h1{
        font-size:1.1rem;
        padding:1rem;
        padding-bottom:0
    }
    .allProductSingle .topSingle .options{
        gap:.5rem;
        margin-top:1rem;
        padding:.5rem
    }
    .allProductSingle .topSingle .options .right .author{
        font-size:.8rem
    }
    .allProductSingle .topSingle .options .right .author img{
        width:1.5rem;
        height:1.5rem
    }
    .allProductSingle .topSingle .options .left .share{
        font-size:.7rem;
        padding:.2rem .5rem
    }
    .allProductSingle .topSingle .options .left .share i svg{
        width:.7rem;
        height:.7rem
    }
    .allProductSingle .topSingle .body{
        padding:.5rem
    }
    .allProductSingle .topSingle .body .title1{
        font-size:.9rem
    }
    .allProductSingle .topSingle .body p{
        font-size:.8rem
    }
    .allProductSingle .topSingle .skills{
        padding:.5rem
    }
    .allProductSingle .topSingle .skills .title1{
        font-size:.9rem
    }
    .allProductSingle .topSingle .skills ul li{
        font-size:.7rem
    }
    .allProductSingle .topSingle .bot{
        display:grid;
        grid-template-columns:1fr
    }
    .allProductSingle .topSingle .bot .right{
        justify-content:space-between;
        padding:.5rem;
        gap:1rem
    }
    .allProductSingle .topSingle .bot .right .item{
        gap:.5rem
    }
    .allProductSingle .topSingle .bot .right .item i{
        display:none
    }
    .allProductSingle .topSingle .bot .right .item .title2{
        font-size:.7rem
    }
    .allProductSingle .topSingle .bot .right .item .data{
        font-size:.8rem
    }
    .allProductSingle .topSingle .bot .right .item .data2{
        font-size:.7rem
    }
    .allProductSingle .topSingle .bot .right .item .data2 span{
        font-size:.8rem
    }
    .allProductSingle .topSingle .bot .left{
        justify-content:space-between;
        gap:.5rem;
        padding:.5rem
    }
    .allProductSingle .topSingle .bot .left .item .title2{
        font-size:.8rem
    }
    .allProductSingle .topSingle .bot .left .item .data{
        text-align:right;
        font-size:.8rem
    }
    .allProductSingle .topSingle .bot .left .send{
        gap:.5rem;
        padding:.5rem 1rem;
        font-size:.8rem;
        height:auto;
        border-radius:5px
    }
    .allProductSingle .topSingle .bot .left .send i svg{
        width:1.2rem;
        height:1.2rem
    }
    .allProductSingle .topSingle:before{
        content:unset
    }
    .allProductSingle .topSingle:after{
        content:unset
    }
    .allProductSingle .demands{
        border-radius:5px;
        padding:.5rem;
        margin-top:1rem
    }
    .allProductSingle .demands .title{
        font-size:1rem
    }
    .allProductSingle .demands ul{
        display:grid;
        grid-template-columns:1fr;
        grid-gap:1rem;
        margin-top:1rem
    }
    .allProductSingle .demands ul li{
        border-radius:5px;
        padding:.5rem
    }
    .allProductSingle .demands ul li .pic img{
        width:3rem;
        height:3rem
    }
    .allProductSingle .demands ul li .name{
        font-size:.9rem
    }
    .allProductSingle .demands ul li p,.allProductSingle .demands ul li .bot .item{
        font-size:.8rem
    }
    .allProductSingle .demands ul li .bot .item i svg{
        width:.8rem;
        height:.8rem
    }
}
.allUserIndex{
    margin:auto;
    margin-top:1rem;
    display:grid;
    grid-template-columns:1fr 2fr 1fr;
    grid-gap:1rem
}
.allUserIndex .allUserList{
    background:#fff;
    border-radius:10px;
    padding:1rem;
    box-shadow:0 0 10px #0000000d;
    position:sticky;
    top:8rem
}
.allUserIndex .allUserList .top{
    display:grid;
    grid-template-columns:auto 1fr 1fr;
    grid-gap:1rem
}
.allUserIndex .allUserList .top .pic{
    display:grid;
    justify-content:center
}
.allUserIndex .allUserList .top .pic img{
    width:4rem;
    height:4rem;
    object-fit:cover;
    border-radius:100%
}
.allUserIndex .allUserList .top .followCount{
    text-align:center
}
.allUserIndex .allUserList .top .followCount .title1{
    font-size:1rem;
    font-weight:500;
    color:#475569
}
.allUserIndex .allUserList .top .followCount .num{
    font-size:1.2rem;
    font-weight:900;
    color:#000
}
.allUserIndex .allUserList h1{
    font-size:1.2rem;
    font-weight:700;
    color:#475569;
    margin-top:1rem
}
.allUserIndex .allUserList .body p{
    position:relative;
    font-size:1rem;
    font-weight:300;
    color:#000;
    white-space:pre-line;
    display:-webkit-box;
    box-orient:vertical;
    -webkit-box-orient:vertical;
    line-clamp:2;
    -webkit-line-clamp:2;
    overflow:hidden;
    text-overflow:ellipsis
}
.allUserIndex .allUserList .body p:before{
    content:"";
    position:absolute;
    top:0;
    right:0;
    left:0;
    bottom:0;
    background:linear-gradient(transparent,#ffffff80)
}
.allUserIndex .allUserList .body button{
    display:flex;
    justify-content:right;
    align-items:center;
    width:100%;
    background:#fff;
    color:#000;
    font-weight:700;
    text-align:right
}
.allUserIndex .allUserList .body button i{
    display:grid;
    align-items:center
}
.allUserIndex .allUserList .body button i svg{
    width:1rem;
    height:1rem;
    fill:#000
}
.allUserIndex .allUserList .follows{
    margin-top:2rem
}
.allUserIndex .allUserList .follows .follow{
    cursor:pointer;
    display:flex;
    justify-content:center;
    align-items:center;
    gap:.5rem;
    padding:.5rem;
    border-radius:5px;
    border:1px solid #bbb;
    color:#000;
    font-size:.9rem;
    font-weight:500;
    width:100%;
    background:#fff;
    text-align:center
}
.allUserIndex .allUserList .follows .follow i{
    display:grid;
    align-items:center
}
.allUserIndex .allUserList .follows .follow i svg{
    width:1.1rem;
    height:1.1rem;
    fill:#000
}
.allUserIndex .allUserList .follows .follow .number{
    border-right:1px solid #000;
    padding-right:.5rem;
    color:#475569
}
.allUserIndex .allUserList .follows .active{
    background:red;
    color:#fff
}
.allUserIndex .allUserList .follows .active i svg{
    fill:#fff
}
.allUserIndex .allUserList .follows .active .number{
    color:#fff
}
.allUserIndex .allUserList .options{
    border-radius:10px;
    margin-top:2rem;
    display:grid;
    grid-template-columns:1fr 1fr;
    border:2px solid #f2f2f2
}
.allUserIndex .allUserList .options .option{
    padding:.5rem;
    text-align:center;
    display:grid;
    border-right:2px solid #f2f2f2
}
.allUserIndex .allUserList .options .option .title1{
    font-size:.9rem;
    font-weight:300;
    color:#000
}
.allUserIndex .allUserList .options .option .num{
    font-size:1.2rem;
    font-weight:900;
    color:#000
}
.allUserIndex .allUserList .options .option:first-child{
    border-right:0
}
.allUserIndex .allUserList .title{
    font-size:1rem;
    font-weight:700;
    color:#000;
    margin-bottom:.5rem
}
.allUserIndex .allUserList .skills{
    padding-bottom:1rem;
    border-bottom:2px solid #f2f2f2
}
.allUserIndex .allUserList .skills ul{
    display:flex;
    justify-content:right;
    align-items:center;
    gap:.5rem;
    flex-wrap:wrap
}
.allUserIndex .allUserList .skills ul li{
    background:#eee;
    padding:.3rem;
    font-size:.8rem;
    font-weight:300;
    color:#000;
    border-radius:5px
}
.allUserIndex .allUserList .skills .empty{
    font-size:.9rem;
    font-weight:500;
    color:red
}
.allUserIndex .allUserList .userDetail{
    margin-top:1rem
}
.allUserIndex .allUserList .userDetail ul li{
    display:flex;
    justify-content:space-between;
    align-items:center;
    grid-gap:1rem;
    padding:.5rem;
    font-size:.9rem;
    font-weight:300;
    color:#000;
    margin-top:1rem;
    background:#f5f5f5;
    border-radius:5px
}
.allUserIndex .allUserList .userDetail ul li .data{
    font-weight:700
}
.allUserIndex .allUserList .share{
    color:#00f;
    text-decoration:underline;
    font-size:1rem;
    font-weight:500;
    margin-top:1rem;
    cursor:pointer
}
.allUserIndex .userIndex .tabs{
    display:flex;
    justify-content:right;
    align-items:center;
    flex-wrap:wrap;
    background:#fff;
    padding:1rem;
    border-radius:10px;
    box-shadow:0 0 10px #0000000d
}
.allUserIndex .userIndex .tabs .tab{
    padding:.3rem .5rem;
    text-align:center;
    font-size:.9rem;
    font-weight:500;
    color:#475569;
    border-radius:5px;
    cursor:pointer;
    transition:all .3s ease-in-out
}
.allUserIndex .userIndex .tabs .tab span{
    background:#eee;
    padding:0 .3rem;
    border-radius:5px;
    color:#000
}
.allUserIndex .userIndex .tabs .tab:hover{
    background:#f5f5f5
}
.allUserIndex .userIndex .tabs .active{
    background:#007e46;
    color:#fff
}
.allUserIndex .userIndex .tabs .active span{
    background:#fff;
    color:#007e46
}
.allUserIndex .userIndex .tabs .active:hover{
    background:#007e46
}
.allUserIndex .userIndex .resume .item{
    background:#fff;
    padding:1rem;
    border-radius:10px;
    box-shadow:0 0 10px #0000000d;
    margin-top:1rem
}
.allUserIndex .userIndex .resume .item .title{
    font-size:1.1rem;
    font-weight:700;
    color:#000;
    margin-bottom:.5rem
}
.allUserIndex .userIndex .resume .item ul li{
    padding:.5rem 1rem;
    background:#f8f8f8;
    border-radius:5px;
    margin-top:1rem
}
.allUserIndex .userIndex .resume .item ul li .top{
    display:flex;
    justify-content:right;
    align-items:center;
    gap:1rem;
    font-size:.9rem;
    font-weight:900;
    color:#000
}
.allUserIndex .userIndex .resume .item ul li .top .date{
    font-weight:300;
    color:#475569
}
.allUserIndex .userIndex .resume .item ul li .top .date span{
    direction:ltr;
    unicode-bidi:bidi-override
}
.allUserIndex .userIndex .resume .item ul li .job{
    font-size:.8rem;
    font-weight:300;
    color:#475569
}
.allUserIndex .userIndex .resume .item ul li .body{
    font-size:.9rem;
    font-weight:300;
    color:#000;
    margin-top:1rem
}
.allUserIndex .userIndex .resume .item .empty{
    color:red;
    font-size:.9rem;
    font-weight:500
}
.allUserIndex .userIndex .comment .items{
    background:#fff;
    box-shadow:0 0 10px #0000000d;
    padding:1rem;
    border-radius:10px;
    margin-top:1rem
}
.allUserIndex .userIndex .comment .items .title2{
    font-size:1.1rem;
    font-weight:700;
    color:#475569;
    margin-bottom:1rem
}
.allUserIndex .userIndex .comment .items .item{
    border-bottom:1px solid #f2f2f2;
    margin-bottom:1rem;
    padding-bottom:1rem;
    display:grid;
    grid-template-columns:10rem 1fr;
    grid-gap:2rem
}
.allUserIndex .userIndex .comment .items .item .rightComment .topRight{
    display:flex;
    flex-wrap:wrap;
    justify-content:right;
    align-items:center;
    grid-gap:.5rem;
    margin-bottom:1rem
}
.allUserIndex .userIndex .comment .items .item .rightComment .topRight h4{
    font-size:1rem;
    font-weight:500;
    color:#475569
}
.allUserIndex .userIndex .comment .items .item .rightComment .topRight span{
    font-size:.7rem;
    font-weight:300;
    color:#475569;
    background:#f1f4f9;
    border-radius:5px;
    padding:.1rem .5rem
}
.allUserIndex .userIndex .comment .items .item .rightComment .botRight .rates{
    display:flex;
    justify-content:right;
    align-items:center;
    gap:.2rem;
    margin-top:.5rem
}
.allUserIndex .userIndex .comment .items .item .rightComment .botRight .rates img{
    width:1.2rem;
    height:1.2rem
}
.allUserIndex .userIndex .comment .items .item .rightComment .botRight .rates .rateItem{
    -webkit-transform:scaleX(-1);
    transform:scaleX(-1)
}
.allUserIndex .userIndex .comment .items .item .leftComment .allCommentTitle{
    font-size:1rem;
    font-weight:300;
    color:#475569;
    padding:.5rem;
    border-radius:5px;
    background:#f9f9f9;
    margin-bottom:1rem
}
.allUserIndex .userIndex .comment .items .item .leftComment .allCommentBody p{
    font-size:.85rem;
    font-weight:500;
    color:#475569;
    line-height:1.7rem;
    opacity:.6
}
.allUserIndex .userIndex .comment .items .item:last-child{
    border-bottom:0;
    margin-bottom:0;
    padding-bottom:0
}
.allUserIndex .userIndex .samples ul{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(12rem,1fr));
    grid-gap:1rem;
    margin-top:1rem
}
.allUserIndex .userIndex .samples ul li{
    background:#fff;
    box-shadow:0 0 10px #0000000d;
    padding:.5rem;
    border-radius:5px
}
.allUserIndex .userIndex .samples ul li .pic img{
    width:100%;
    height:10rem;
    object-fit:cover
}
.allUserIndex .userIndex .samples ul li .name{
    text-align:center;
    font-size:.8rem;
    font-weight:700;
    color:#475569;
    margin-top:.5rem
}
.allUserIndex .userIndex .container1{
    display:none
}
.allUserIndex .userIndex .container1 .products .item{
    display:grid;
    grid-template-columns:1fr auto;
    background:#fff;
    box-shadow:0 0 10px #0000000d;
    border-radius:10px;
    padding:1rem;
    margin-top:1rem
}
.allUserIndex .userIndex .container1 .products .item .detail .title{
    font-size:1.2rem;
    font-weight:700;
    color:#000;
    overflow:hidden;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    text-overflow:ellipsis;
    margin-bottom:.5rem
}
.allUserIndex .userIndex .container1 .products .item .detail p{
    font-size:.9rem;
    font-weight:300;
    color:#475569;
    white-space:pre-line;
    display:-webkit-box;
    box-orient:vertical;
    -webkit-box-orient:vertical;
    line-clamp:2;
    text-align:right;
    -webkit-line-clamp:2;
    overflow:hidden;
    text-overflow:ellipsis
}
.allUserIndex .userIndex .container1 .products .item .detail .skills{
    display:grid;
    grid-template-columns:auto 1fr;
    grid-gap:.5rem;
    margin-top:1rem;
    align-items:center
}
.allUserIndex .userIndex .container1 .products .item .detail .skills .title2{
    display:flex;
    align-items:center;
    justify-content:right;
    gap:.5rem;
    font-size:.9rem;
    font-weight:500;
    color:#475569
}
.allUserIndex .userIndex .container1 .products .item .detail .skills .title2 i{
    display:grid;
    align-items:center
}
.allUserIndex .userIndex .container1 .products .item .detail .skills .title2 i svg{
    width:1rem;
    height:1rem;
    fill:#007e46
}
.allUserIndex .userIndex .container1 .products .item .detail .skills .skill{
    display:flex;
    flex-wrap:wrap
}
.allUserIndex .userIndex .container1 .products .item .detail .skills .skill span{
    font-size:.8rem;
    font-weight:300;
    color:#000
}
.allUserIndex .userIndex .container1 .products .item .detail .skills .skill span:before{
    content:",";
    padding:0 .2rem
}
.allUserIndex .userIndex .container1 .products .item .detail .skills .skill span:first-child:before{
    content:unset;
    padding:0
}
.allUserIndex .userIndex .container1 .products .item .detail .skills .skill .box{
    background:red;
    color:#fff;
    padding:.2rem;
    border-radius:5px
}
.allUserIndex .userIndex .container1 .products .item .detail .skills .skill .box:before{
    content:unset
}
.allUserIndex .userIndex .container1 .products .item .detail .skills .boxes{
    gap:.5rem
}
.allUserIndex .userIndex .container1 .products .item .price{
    padding-right:1rem;
    border-right:5px double #f1f1f1;
    min-width:15rem
}
.allUserIndex .userIndex .container1 .products .item .price .option{
    display:flex;
    justify-content:space-between;
    align-items:center;
    font-size:.85rem;
    font-weight:500;
    text-align:center;
    color:#000;
    padding:.5rem;
    border-radius:5px;
    margin-top:.5rem;
    background:#f9f9f9;
    border:1px solid #eee;
    border-right:3px solid #007E46
}
.allUserIndex .userIndex .container1 .products .item .price .option i{
    display:grid;
    align-items:center
}
.allUserIndex .userIndex .container1 .products .item .price .option i svg{
    width:1rem;
    height:1rem;
    fill:#475569
}
.allUserIndex .userIndex .container1 .products .item .price .more{
    background:#007e46;
    color:#fff;
    padding:.5rem;
    border-radius:5px;
    text-align:center;
    margin-top:.5rem;
    font-size:.9rem;
    font-weight:500
}
@media screen and (max-width: 700px){
    .allUserIndex{
        grid-template-columns:1fr
    }
}
.authIndex{
    background:#fff;
    display:grid;
    align-items:center;
    padding-top:2rem
}
.authIndex .login{
    width:40%;
    margin:0 auto;
    padding:20px;
    border-radius:10px;
    overflow:hidden;
    box-shadow:0 10px 10px #0003;
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
    position:relative
}
.authIndex .login .top{
    position:relative;
    z-index:2;
    flex-grow:1
}
.authIndex .login .top h1{
    font-weight:900;
    color:#fff;
    text-align:center;
    font-size:1.5rem;
    margin-bottom:1rem
}
.authIndex .login .top h2{
    font-weight:500;
    color:#fff;
    text-align:center;
    font-size:1.3rem
}
.authIndex .login .top input{
    background:#fff;
    border:1px solid #ccc;
    padding:.5rem;
    font-size:1rem;
    font-weight:500;
    color:#475569;
    text-align:center;
    border-radius:10px
}
.authIndex .login .top button{
    padding:.5rem;
    background:#007e46;
    font-size:1rem;
    font-weight:500;
    color:#fff;
    border-radius:5px
}
.authIndex .login .top .buttons{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(10rem,1fr));
    grid-gap:1rem;
    align-items:center
}
.authIndex .login .top .buttons .first{
    background:orange
}
.authIndex .login .top .authItems{
    display:grid;
    grid-template-columns:1fr;
    grid-gap:1rem
}
.authIndex .login .title{
    position:relative;
    z-index:2;
    display:grid;
    justify-content:center;
    margin-bottom:5vh
}
.authIndex .login .title img{
    height:5rem;
    object-fit:contain
}
.authIndex .login .reset-code{
    display:none
}
.authIndex .login:before{
    content:"";
    position:absolute;
    top:0;
    bottom:0;
    right:0;
    left:0;
    background:#0009;
    z-index:1
}
@media screen and (max-width: 1000px){
    .authIndex{
        display:block
    }
    .authIndex .login{
        width:100%;
        height:100%
    }
    .authIndex .login .bot{
        text-align:center;
        margin-top:1rem
    }
    .authIndex .leftAuth{
        display:none
    }
}
.allProfileIndex{
    display:grid;
    grid-template-columns:auto 1fr;
    grid-gap:1rem
}
.allProfileIndex .pays{
    background:#fff;
    margin-top:1rem;
    border-radius:10px;
    overflow:hidden
}
.allProfileIndex .pays .titleTicket{
    padding:1rem
}
.allProfileIndex .pays .titleTicket h3{
    font-size:1.1rem;
    font-weight:500;
    color:#475569
}
.allProfileIndex .pays .postItem{
    padding:1rem;
    border-bottom:1px solid #f2f2f2;
    cursor:pointer
}
.allProfileIndex .pays .postItem .postTop{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center
}
.allProfileIndex .pays .postItem .postTop .postTitle{
    display:grid;
    grid-template-columns:auto 1fr;
    grid-gap:1rem;
    align-items:center
}
.allProfileIndex .pays .postItem .postTop .postTitle .postImages{
    display:grid;
    grid-template-columns:auto auto auto auto;
    justify-content:right;
    align-items:center
}
.allProfileIndex .pays .postItem .postTop .postTitle .postImages .postImage img{
    width:100%;
    height:5rem;
    object-fit:contain
}
.allProfileIndex .pays .postItem .postTop .postTitle .postImages .postMore{
    display:grid;
    justify-content:center;
    align-items:center;
    border:1px solid #bbb;
    border-radius:5px
}
.allProfileIndex .pays .postItem .postTop .postTitle .postImages .postMore i{
    display:grid;
    justify-content:center;
    align-items:center;
    height:5rem;
    width:5rem
}
.allProfileIndex .pays .postItem .postTop .postTitle .postImages .postMore i svg{
    width:2.5rem;
    height:2.5rem;
    fill:#475569;
    opacity:.7
}
.allProfileIndex .pays .postItem .postTop .postTitle ul{
    display:flex;
    flex-wrap:wrap;
    justify-content:right;
    align-items:center;
    grid-gap:1rem
}
.allProfileIndex .pays .postItem .postTop .postTitle ul li{
    font-size:.9rem;
    font-weight:300;
    color:#475569;
    opacity:.7
}
.allProfileIndex .pays .postItem .postTop .postTitle ul li span:last-child{
    color:#000
}
.allProfileIndex .pays .postItem .postTop .postOptions{
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-gap:.5rem;
    align-items:center
}
.allProfileIndex .pays .postItem .postTop .postOptions a,.allProfileIndex .pays .postItem .postTop .postOptions i{
    display:grid;
    align-items:center;
    justify-content:center;
    padding:.5rem;
    background:#f5f5f5;
    border-radius:5px;
    cursor:pointer
}
.allProfileIndex .pays .postItem .postTop .postOptions a svg,.allProfileIndex .pays .postItem .postTop .postOptions i svg{
    width:1.2rem;
    height:1.2rem;
    fill:#606265
}
.allProfileIndex .pays .postItem .postBot{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
    grid-gap:.5rem;
    margin-top:.5rem;
    background:#dcdcdc;
    border-radius:5px;
    padding:1rem
}
.allProfileIndex .pays .postItem .postBot ul{
    display:flex;
    flex-wrap:wrap;
    justify-content:right;
    grid-gap:2rem;
    align-items:center
}
.allProfileIndex .pays .postItem .postBot ul li{
    display:grid;
    grid-template-columns:auto auto;
    justify-content:right;
    align-items:center;
    grid-gap:.5rem
}
.allProfileIndex .pays .postItem .postBot ul li span{
    font-size:.8rem;
    font-weight:300;
    color:#606265
}
.allProfileIndex .pays .postItem .postBot ul li span:last-child{
    color:#000c
}
.allProfileIndex .pays .postItem .postBot ul li .status100{
    padding:.1rem .5rem;
    background:green;
    color:#fff!important;
    border-radius:5px
}
.allProfileIndex .pays .postItem .postBot ul li .status0{
    padding:.1rem .5rem;
    background:red;
    color:#fff!important;
    border-radius:5px
}
.allProfileIndex .pays .postItem .postBot ul li .status1{
    padding:.1rem .5rem;
    background:#000;
    color:#fff!important;
    border-radius:5px
}
.allProfileIndex .pays .postItem .postBot ul li .status20{
    padding:.1rem .5rem;
    background:#03f;
    color:#fff!important;
    border-radius:5px
}
.allProfileIndex .pays .postItem .postBot ul li .status50{
    padding:.1rem .5rem;
    background:purple;
    color:#fff!important;
    border-radius:5px
}
.allProfileIndex .pays .postItem .postBot .checks1{
    display:grid;
    align-items:center
}
.allProfileIndex .pays .postItem .postBot .checks1 svg{
    width:1.5rem;
    height:1.5rem;
    fill:#475569
}
@media screen and (max-width: 700px){
    .allProfileIndex .pays .postItem .postTop{
        grid-template-columns:1fr!important
    }
    .allProfileIndex .pays .postItem .postTop .postTitle{
        grid-template-columns:1fr
    }
}
.allProfileIndex .pays .postItem:last-child{
    border-bottom:0
}
.allProfileIndex .tabsProject{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(1rem,1fr));
    grid-gap:1rem;
    margin-top:1rem
}
.allProfileIndex .tabsProject .tab{
    background:#fff;
    box-shadow:0 0 10px #0000001a;
    padding:.5rem 1rem;
    border-radius:5px;
    text-align:center;
    font-size:1.1rem;
    font-weight:300;
    border-right:3px solid #007E46;
    border-left:3px solid #007E46;
    cursor:pointer
}
.allProfileIndex .tabsProject .active{
    background:#007e46;
    color:#fff
}
@media screen and (max-width: 1000px){
    .allProfileIndex{
        display:block
    }
}
.profileIndex{
    padding-left:1rem
}
.profileIndex .widgets{
    margin-bottom:1rem;
    border-radius:10px;
    background:#fff;
    box-shadow:0 0 10px #00000005;
    padding:1rem
}
.profileIndex .widgets .title{
    font-size:1.1rem;
    font-weight:700;
    color:#000
}
.profileIndex .widgets .items{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));
    grid-gap:1rem;
    margin-top:1rem
}
.profileIndex .widgets .items .widget{
    padding:1rem;
    text-align:center;
    border:1px solid #007E46;
    border-radius:10px
}
.profileIndex .widgets .items .widget .title2{
    font-size:1rem;
    font-weight:700;
    color:#007e46;
    margin-bottom:.5rem;
    transition:all .3s ease-in-out
}
.profileIndex .widgets .items .widget p{
    transition:all .3s ease-in-out;
    font-size:.8rem;
    font-weight:300;
    color:#000;
    opacity:.7
}
.profileIndex .widgets .items .widget:hover{
    background:#007e46
}
.profileIndex .widgets .items .widget:hover .title2,.profileIndex .widgets .items .widget:hover p{
    color:#fff
}
.profileIndex .notes .note{
    background:#fff;
    border-radius:5px;
    padding:1rem;
    box-shadow:0 0 10px #00000005;
    margin-top:1rem;
    position:relative
}
.profileIndex .notes .note .title{
    font-size:1rem;
    font-weight:500;
    color:#000
}
.profileIndex .notes .note .body{
    font-size:.8rem;
    font-weight:300;
    color:#475569;
    margin-top:.5rem
}
.profileIndex .notes .note:before{
    content:"";
    position:absolute;
    top:0;
    bottom:0;
    right:0;
    margin:auto;
    height:80%;
    width:5px;
    background:red;
    border-top-left-radius:10px;
    border-bottom-left-radius:10px
}
.profileIndex .notes .note:first-child{
    margin-top:0
}
.profileIndex .myRef{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
    gap:1rem;
    background:#fff;
    border-radius:5px;
    padding:1rem;
    box-shadow:0 0 10px #00000005;
    margin-top:1rem;
    position:relative
}
.profileIndex .myRef .right .title{
    font-size:1rem;
    font-weight:500;
    margin-bottom:.5rem;
    color:#000
}
.profileIndex .myRef .right p{
    font-size:.9rem;
    font-weight:500;
    color:#475569;
    line-height:1rem
}
.profileIndex .myRef .right p span{
    color:#007e46
}
.profileIndex .myRef .left{
    font-size:1rem;
    font-weight:700;
    text-align:center;
    background:linear-gradient(to right,#3468cc 20%,#007e46,#007e46,#3468cc 80%);
    background-size:200% auto;
    animation:shine 1s linear infinite;
    padding:.5rem 1rem;
    border-radius:5px;
    color:#fff
}
@keyframes shine{
    to{
        background-position:200% center
    }
}
.profileIndex .about{
    border-radius:5px;
    padding:1rem;
    background:#fff;
    box-shadow:0 0 10px #00000005;
    margin-top:1rem
}
.profileIndex .about .title{
    font-size:1rem;
    font-weight:500;
    color:#000;
    margin-bottom:1rem
}
.profileIndex .about .items{
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-gap:1rem;
    align-items:center
}
.profileIndex .about .items .item .name{
    font-size:.9rem;
    font-weight:500;
    color:#475569;
    margin-bottom:.5rem
}
.profileIndex .about .items .item .body{
    font-size:1rem;
    font-weight:500;
    color:#000;
    background:#eee;
    padding:.5rem;
    border-radius:5px
}
@media screen and (max-width: 1000px){
    .profileIndex{
        padding-left:0
    }
}
.profileLists{
    padding:1rem;
    padding-left:0
}
.profileLists .profileListRes{
    display:none;
    width:100%;
    background:#fff;
    padding:.5rem;
    text-align:center;
    color:#475569;
    font-size:1rem;
    cursor:pointer;
    font-weight:500;
    z-index:1
}
.profileLists .profileList{
    background:#fff;
    height:calc(100vh - 9rem);
    padding:1rem;
    border-radius:10px;
    box-shadow:0 5px 10px #0000001a;
    width:17rem;
    position:sticky;
    overflow:hidden;
    overflow-y:scroll;
    top:4rem;
    z-index:2
}
.profileLists .profileList .titleFilter{
    display:none
}
.profileLists .profileList .wallet{
    text-align:center;
    padding-bottom:1rem
}
.profileLists .profileList .wallet i{
    display:grid;
    justify-content:center
}
.profileLists .profileList .wallet i svg{
    width:3rem;
    height:3rem;
    fill:#007e46
}
.profileLists .profileList .wallet .title1{
    text-align:center;
    font-size:.8rem;
    font-weight:500;
    margin-top:.5rem;
    color:#475569
}
.profileLists .profileList .wallet .charge{
    text-align:center;
    font-size:1.2rem;
    font-weight:900;
    margin-top:.1rem;
    color:#475569;
    margin-bottom:.5rem
}
.profileLists .profileList .wallet .charge span{
    font-size:.8rem
}
.profileLists .profileList .wallet a{
    font-size:.8rem;
    text-align:center;
    padding:.2rem 1rem;
    border-radius:5px;
    background:#007e46;
    color:#fff
}
.profileLists .profileList .buttons1{
    border-top:1px solid #eee;
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-gap:.5rem;
    padding:.5rem 0;
    margin-bottom:0
}
.profileLists .profileList .buttons1 button{
    padding:.3rem;
    color:#000;
    background:#eee;
    border-radius:5px;
    font-size:.9rem;
    font-weight:300
}
.profileLists .profileList .buttons1 .active{
    background:red;
    color:#fff
}
.profileLists .profileList .items{
    border-top:1px solid #eee;
    padding-top:1rem
}
.profileLists .profileList .items h4{
    font-size:.8rem;
    font-weight:700;
    color:#475569;
    margin-bottom:.5rem;
    opacity:.7
}
.profileLists .profileList .items ul li{
    margin-bottom:1rem
}
.profileLists .profileList .items ul li a{
    font-size:1rem;
    font-weight:500;
    color:#000
}
.profileLists .profileList .items ul li a span{
    opacity:.6
}
.profileLists .profileList .items ul .active a{
    display:flex;
    justify-content:right;
    align-items:center;
    gap:.5rem;
    color:#007e46;
    font-weight:500
}
.profileLists .profileList .items ul .active a:before{
    content:"";
    width:.5rem;
    height:.5rem;
    border-radius:100%;
    background:#007e46;
    display:grid
}
.profileLists .profileList .items:first-child{
    border-top:0;
    padding-top:0
}
.profileLists .profileList .listM h4{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:1rem;
    font-size:1rem;
    font-weight:700;
    color:#000;
    cursor:pointer
}
.profileLists .profileList .listM h4 i{
    display:grid;
    align-items:center
}
.profileLists .profileList .listM h4 i svg{
    width:1.1rem;
    height:1.1rem;
    fill:#000
}
.profileLists .profileList .listM ul{
    display:none
}
@media screen and (max-width: 1000px){
    .profileLists{
        position:sticky;
        top:3.6rem;
        z-index:2;
        padding:0
    }
    .profileLists .profileList{
        display:none;
        position:fixed;
        top:0;
        right:0;
        left:0;
        bottom:0;
        width:100%;
        z-index:100;
        padding:0
    }
    .profileLists .profileListRes{
        display:flex
    }
    .profileLists .closeListRes{
        display:block;
        background:#f5f5f5;
        color:#475569;
        padding:10px;
        text-align:center;
        font-weight:500;
        cursor:pointer;
        margin-bottom:10px;
        border-bottom:1px solid #eee
    }
    .profileLists .profileList .titleFilter{
        display:none
    }
    .profileLists .profileList .titleFilter{
        display:grid;
        grid-template-columns:1fr auto;
        align-items:center;
        margin-bottom:1rem;
        padding:1rem;
        background:#fff;
        position:sticky;
        top:0;
        border-bottom:2px dashed #bbb
    }
    .profileLists .profileList .titleFilter .title2{
        font-size:1.1rem;
        font-weight:700;
        color:#000
    }
    .profileLists .profileList .titleFilter i{
        display:grid;
        align-items:center;
        cursor:pointer
    }
    .profileLists .profileList .titleFilter i svg{
        width:1.5rem;
        height:1.5rem;
        fill:#000
    }
    .profileLists .profileList .items{
        padding:.5rem
    }
    .profileLists .profileListRes{
        display:block
    }
}
.profileHistory{
    margin:1rem;
    margin-right:0
}
.profileHistory ul{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));
    grid-gap:1rem
}
.profileHistory ul .item{
    display:grid;
    background:#fff;
    border:1px solid #bbb;
    border-radius:10px;
    padding:.5rem
}
.profileHistory ul .item .pic img{
    width:100%;
    height:12rem;
    object-fit:contain
}
.profileHistory ul .item .title{
    font-size:1rem;
    font-weight:500;
    color:#000;
    overflow:hidden;
    display:-webkit-box;
    -webkit-line-clamp:3;
    -webkit-box-orient:vertical;
    text-overflow:ellipsis;
    margin-top:1rem
}
.profileHistory ul .item .option{
    display:flex;
    justify-content:space-between;
    align-items:center;
    font-size:.85rem;
    font-weight:500;
    text-align:center;
    color:#000;
    padding:.5rem;
    background:#eee;
    border-radius:5px;
    margin-top:.5rem;
    border:1px solid #bbb
}
.profileHistory ul .item .option i{
    display:grid;
    align-items:center
}
.profileHistory ul .item .option i svg{
    width:1rem;
    height:1rem;
    fill:#475569
}
@media screen and (max-width: 1000px){
    .profileHistory{
        margin:.5rem
    }
    .profileHistory ul{
        grid-template-columns:1fr 1fr;
        grid-gap:.5rem
    }
    .profileHistory ul .item{
        border-radius:5px
    }
    .profileHistory ul .item .pic img{
        height:8rem
    }
    .profileHistory ul .item .title{
        font-size:.8rem;
        margin-top:.5rem
    }
    .profileHistory ul .item .option{
        font-size:.8rem;
        font-weight:500
    }
    .profileHistory ul .item .option i{
        display:grid;
        align-items:center
    }
    .profileHistory ul .item .option i svg{
        width:.8rem;
        height:.8rem
    }
}
.profileReport{
    margin:1rem;
    margin-right:0
}
.profileReport ul{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));
    grid-gap:1rem
}
.profileReport ul li{
    background:#fff;
    border:1px solid #bbb;
    border-radius:5px;
    overflow:hidden;
    padding:1rem
}
.profileReport ul li .title{
    font-size:1rem;
    font-weight:500;
    color:#475569;
    margin-bottom:.5rem
}
.profileReport ul li p{
    font-size:1rem;
    font-weight:300;
    color:#475569;
    opacity:.8
}
.profileReport ul li .status{
    width:100%;
    display:grid;
    border-radius:5px;
    background:red;
    font-size:.8rem;
    font-weight:300;
    text-align:center;
    margin-top:1rem;
    padding:.5rem;
    color:#fff
}
.profileReport ul li .active{
    background:green
}
@media screen and (max-width: 1000px){
    .profileReport{
        margin:.5rem
    }
}
.allSample .createSample{
    background:#fff;
    padding:1rem;
    border-radius:10px;
    margin-top:1rem;
    box-shadow:0 0 10px #0000000d
}
.allSample .createSample .name{
    font-size:1rem;
    font-weight:500;
    color:#000;
    margin-bottom:.5rem
}
.allSample .createSample .item{
    margin-bottom:1rem
}
.allSample .createSample .items{
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-gap:1rem
}
.allSample .createSample input,.allSample .createSample textarea,.allSample .createSample select{
    font-size:1rem;
    font-weight:500;
    color:#000;
    padding:.5rem 1rem;
    border-radius:5px;
    width:100%;
    border:1px solid #bbb;
    background:transparent
}
.allSample .createSample button{
    font-size:1rem;
    font-weight:300;
    color:#fff;
    border-radius:5px;
    background:#007e46;
    padding:.3rem 1rem
}
.allSample ul{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(12rem,1fr));
    grid-gap:1rem;
    margin-top:1rem
}
.allSample ul li{
    background:#fff;
    border-radius:10px;
    padding:1rem
}
.allSample ul li .pic img{
    height:10rem
}
.allSample ul li h4{
    font-size:.9rem;
    text-overflow:ellipsis;
    white-space:nowrap;
    overflow:hidden;
    font-weight:700;
    color:#475569;
    text-align:center;
    margin-top:1rem
}
.allSample ul li h5{
    font-size:.8rem;
    text-overflow:ellipsis;
    white-space:nowrap;
    overflow:hidden;
    font-weight:300;
    color:#475569;
    text-align:center;
    margin-top:.5rem
}
.allSample ul li button{
    background:red;
    padding:.2rem;
    text-align:center;
    font-size:.8rem;
    font-weight:300;
    color:#fff;
    width:100%;
    border-radius:5px;
    margin-top:.5rem
}
.profileIndexTicket{
    background:#fff;
    border-radius:10px;
    box-shadow:0 0 10px #0000000d;
    margin-top:1rem;
    overflow:hidden
}
.profileIndexTicket .titleTicket{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:1rem;
    padding:1rem
}
.profileIndexTicket .titleTicket h1{
    font-size:1.1rem;
    font-weight:500;
    color:#475569
}
.profileIndexTicket .titleTicket button{
    background:#007e46;
    padding:.3rem .5rem;
    border-radius:5px;
    color:#fff;
    font-size:1rem;
    font-weight:300
}
.profileIndexTicket h6{
    font-size:1.2rem;
    font-weight:500;
    color:#475569;
    margin-bottom:1rem
}
.profileIndexTicket .alert{
    background:#00800042;
    color:#006200;
    padding:1rem;
    border-radius:.3rem;
    font-size:.85rem;
    font-weight:300;
    margin:1rem 0
}
.profileIndexTicket .referralCode{
    background:#fff;
    border-radius:.3rem;
    box-shadow:0 0 10px #bbb;
    margin-bottom:1rem;
    padding:1rem;
    display:grid;
    grid-template-columns:auto 1fr;
    grid-gap:1rem;
    align-items:center
}
.profileIndexTicket .referralCode span{
    font-size:.9rem;
    font-weight:300;
    color:#475569
}
.profileIndexTicket .referralCode h5{
    font-size:.9rem;
    font-weight:300;
    color:#475569;
    padding:.5rem;
    border:1px solid #bbb;
    border-radius:5px
}
.profileIndexTicket .containerSub{
    background:#fff;
    border-radius:.3rem;
    box-shadow:0 0 10px #bbb;
    margin-bottom:1rem;
    padding:1rem;
    overflow:hidden
}
.profileIndexTicket .containerSub table{
    margin-bottom:0
}
.profileIndexTicket .emptyUser{
    margin:1rem 0;
    font-size:1.1rem;
    font-weight:700;
    color:#32cd32;
    text-align:center
}
.profileIndexTicket table{
    background:#fff;
    border-radius:.3rem;
    box-shadow:0 0 10px #0000000d;
    width:100%;
    margin-bottom:1rem
}
.profileIndexTicket table tr{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(1px,1fr));
    align-items:center;
    grid-gap:1rem;
    padding:1rem
}
.profileIndexTicket table tr th{
    font-weight:700;
    color:#475569;
    font-size:.85rem;
    text-align:center;
    text-overflow:ellipsis;
    white-space:nowrap;
    overflow:hidden;
    display:grid;
    align-items:center;
    justify-content:center
}
.profileIndexTicket table tr td{
    font-weight:300;
    font-size:.85rem;
    text-align:center;
    color:#475569
}
.profileIndexTicket table tr td svg{
    fill:#475569;
    width:1rem;
    height:1rem;
    cursor:pointer
}
.profileIndexTicket table tr td img{
    width:2.5rem;
    height:2.5rem;
    object-fit:cover;
    border-radius:5rem;
    box-shadow:0 0 10px #0000001a
}
.profileIndexTicket table tr td a{
    display:grid;
    align-items:center
}
.profileIndexTicket table tr td a svg{
    margin-left:.5rem
}
.profileIndexTicket table tr .buttons a{
    font-size:.8rem;
    padding:.3rem;
    border-radius:5px;
    color:#fff;
    background:green
}
.profileIndexTicket table tr .buttons button{
    font-size:.8rem;
    padding:.3rem;
    border-radius:5px;
    color:#fff;
    background:orange
}
.profileIndexTicket table tr:nth-child(2n){
    background:#f5f5f5
}
.profileIndexTicket .allTickets .container{
    border-radius:5px;
    background:#fff
}
.profileIndexTicket .allTickets .container .chat{
    display:grid;
    color:#434651
}
.profileIndexTicket .allTickets .container .chat .chat-header{
    padding:10px;
    border-bottom:1px solid #eee;
    display:grid;
    grid-template-columns:auto 1fr;
    align-items:center;
    grid-gap:1rem
}
.profileIndexTicket .allTickets .container .chat .chat-header img{
    width:3rem;
    height:3rem;
    object-fit:cover;
    border-radius:100%
}
.profileIndexTicket .allTickets .container .chat .chat-header .chat-with{
    font-weight:700;
    font-size:16px
}
.profileIndexTicket .allTickets .container .chat .chat-history{
    padding:15px;
    border-bottom:2px solid white;
    overflow-y:scroll;
    height:400px
}
.profileIndexTicket .allTickets .container .chat .chat-history .message-data{
    display:flex;
    align-items:center;
    margin-bottom:15px
}
.profileIndexTicket .allTickets .container .chat .chat-history .message-data-time{
    color:#475569;
    font-size:.6rem;
    padding-right:6px
}
.profileIndexTicket .allTickets .container .chat .chat-history .message-data-name{
    color:#000;
    font-size:.9rem
}
.profileIndexTicket .allTickets .container .chat .chat-history ul{
    display:grid
}
.profileIndexTicket .allTickets .container .chat .chat-history .message{
    color:#fff;
    padding:10px 20px;
    line-height:26px;
    font-size:13px;
    border-radius:5px;
    margin-bottom:30px;
    max-width:90%;
    position:relative
}
.profileIndexTicket .allTickets .container .chat .chat-history .message i{
    display:grid;
    align-items:center;
    justify-content:left;
    margin-top:.3rem
}
.profileIndexTicket .allTickets .container .chat .chat-history .message i svg{
    width:1rem;
    height:1rem;
    fill:#fff
}
.profileIndexTicket .allTickets .container .chat .chat-history .message:after{
    bottom:100%;
    right:7%;
    border:solid transparent;
    content:" ";
    height:0;
    width:0;
    position:absolute;
    pointer-events:none;
    border-bottom-color:#32cd32;
    border-width:10px;
    margin-left:-10px
}
.profileIndexTicket .allTickets .container .chat .chat-history .my-message{
    float:right;
    background:#32cd32
}
.profileIndexTicket .allTickets .container .chat .chat-history .other-message{
    background:red
}
.profileIndexTicket .allTickets .container .chat .chat-history .other-message:after{
    border-bottom-color:red;
    right:auto;
    left:1rem
}
.profileIndexTicket .allTickets .container .chat .chat-message{
    border-top:1px solid #bbb;
    padding:10px
}
.profileIndexTicket .allTickets .container .chat .chat-message .messageData{
    position:relative
}
.profileIndexTicket .allTickets .container .chat .chat-message .messageData textarea{
    width:100%;
    border:none;
    font-size:.8rem;
    padding:10px;
    margin-bottom:10px;
    border-radius:5px;
    resize:vertical;
    background:#eee
}
.profileIndexTicket .allTickets .container .chat .chat-message .messageData span{
    position:absolute;
    bottom:1rem;
    left:.5rem;
    background:#777;
    padding:.3rem .5rem;
    border-radius:5px;
    font-weight:300;
    font-size:.7rem;
    color:#fff
}
.profileIndexTicket .allTickets .container .chat .chat-message .chatButtons{
    display:flex;
    gap:.5rem
}
.profileIndexTicket .allTickets .container .chat .chat-message .chatButtons button{
    display:flex;
    gap:.5rem;
    color:#fff;
    font-size:14px;
    cursor:pointer;
    font-weight:300;
    background:#32cd32;
    padding:.5rem 1rem;
    border-radius:5px;
    position:relative
}
.profileIndexTicket .allTickets .container .chat .chat-message .chatButtons button i{
    display:flex;
    justify-content:center;
    align-items:center
}
.profileIndexTicket .allTickets .container .chat .chat-message .chatButtons button i svg{
    width:1rem;
    height:1rem;
    fill:#fff
}
.profileIndexTicket .allTickets .container .chat .chat-message .chatButtons button:last-child{
    background:red
}
.profileIndexTicket .allTickets .container .align-left{
    justify-content:left;
    text-align:left
}
.profileIndexTicket .allTickets .container .float-left{
    float:left;
    text-align:left
}
.profileIndexTicket .sendFiles{
    background:#00000080;
    z-index:4000;
    position:fixed;
    top:0;
    right:0;
    width:100%;
    height:100%;
    display:grid;
    grid-template-columns:1fr;
    justify-content:center
}
.profileIndexTicket .sendFiles .sendPos{
    width:40%;
    padding:1rem;
    margin:auto;
    background:#fff;
    border-radius:.4rem;
    position:relative
}
.profileIndexTicket .sendFiles .sendPos .sendImage{
    background:#fff;
    border-radius:10px;
    overflow:hidden;
    display:grid;
    grid-template-columns:1fr;
    justify-content:center;
    box-shadow:0 0 10px #0000000d;
    margin-top:1rem
}
.profileIndexTicket .sendFiles .sendPos .sendImage .dropify-wrapper{
    height:100px;
    border:1px solid #eee!important
}
.profileIndexTicket .sendFiles .sendPos .sendImage .dropify-wrapper .file-icon:before{
    opacity:0!important;
    position:absolute!important;
    top:0!important;
    visibility:hidden!important
}
.profileIndexTicket .sendFiles .sendPos .sendImage .dropify-wrapper .dropify-message{
    position:relative!important;
    top:auto!important;
    margin-top:2rem
}
.profileIndexTicket .sendFiles .sendPos .sendImage .dropify-wrapper .dropify-message p{
    margin:0;
    font-size:1rem;
    font-family:irsans;
    color:#00800082
}
.profileIndexTicket .createTicket{
    padding:1rem;
    background:#fff;
    border-radius:5px
}
.profileIndexTicket .createTicket p{
    font-size:.8rem;
    font-weight:300;
    color:#475569;
    opacity:.7
}
.profileIndexTicket .createTicket p .closeChats{
    padding:.2rem .4rem;
    background:red;
    color:#fff;
    border-radius:5px;
    font-size:.7rem;
    cursor:pointer;
    display:none
}
.profileIndexTicket .createTicket .bodyLabel{
    display:grid;
    grid-template-columns:1fr;
    grid-gap:.5rem;
    font-size:.9rem;
    font-weight:300;
    color:#475569;
    margin-top:1rem
}
.profileIndexTicket .createTicket .bodyLabel input,.profileIndexTicket .createTicket .bodyLabel select,.profileIndexTicket .createTicket .bodyLabel textarea{
    background:#fff;
    border:1px solid #bbb;
    padding:.3rem .5rem;
    color:#475569;
    border-radius:5px;
    font-size:.9rem;
    font-weight:300;
    width:100%;
    transition:all .3s ease-in-out
}
.profileIndexTicket .createTicket .buttons{
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-gap:1rem
}
.profileIndexTicket .createTicket .buttons .submit{
    font-size:.9rem;
    font-weight:500;
    color:#32cd32;
    text-align:center;
    background:transparent;
    width:100%;
    border:1px solid limegreen;
    padding:.5rem 1rem;
    border-radius:5px;
    margin-top:1rem;
    transition:all .3s ease-in-out
}
.profileIndexTicket .createTicket .buttons .submit:hover{
    background:#32cd32;
    color:#fff
}
.profileIndexTicket .createTicket .buttons .cancel{
    font-size:.9rem;
    font-weight:500;
    color:red;
    text-align:center;
    background:transparent;
    width:100%;
    border:1px solid red;
    padding:.5rem 1rem;
    border-radius:5px;
    margin-top:1rem;
    transition:all .3s ease-in-out
}
.profileIndexTicket .createTicket .buttons .cancel:hover{
    background:red;
    color:#fff
}
.profileIndexTicket .createTicket .sendImage{
    background:#fff;
    border-radius:10px;
    overflow:hidden;
    display:grid;
    grid-template-columns:1fr;
    justify-content:center;
    box-shadow:0 0 10px #0000000d;
    margin-top:1rem
}
.profileIndexTicket .createTicket .sendImage .dropify-wrapper{
    border:1px solid #eee!important
}
.profileIndexTicket .createTicket .sendImage .dropify-wrapper .file-icon:before{
    display:none!important
}
.profileIndexTicket .createTicket .sendImage .dropify-wrapper .dropify-message{
    position:relative!important;
    top:auto!important;
    margin-top:2rem
}
.profileIndexTicket .createTicket .sendImage .dropify-wrapper .dropify-message p{
    margin:0;
    font-size:1rem;
    color:#00800082
}
@media screen and (max-width: 700px){
    .profileIndexTicket table tr{
        grid-gap:.5rem;
        padding:.5rem
    }
    .profileIndexTicket table tr th,.profileIndexTicket table tr td{
        font-size:.5rem
    }
    .profileIndexTicket table tr td svg{
        width:.7rem;
        height:.7rem
    }
    .profileIndexTicket table tr .buttons{
        display:block
    }
    .profileIndexTicket table tr .buttons a,.profileIndexTicket table tr .buttons button{
        font-size:.5rem
    }
    .profileIndexTicket .allTickets .container{
        display:block
    }
    .profileIndexTicket .allTickets .container .people-list{
        border-left:0;
        width:100%;
        border-bottom:1px solid #eee
    }
    .profileIndexTicket .allTickets .container .chat{
        display:grid;
        background:#fff;
        color:#434651
    }
    .profileIndexTicket .allTickets .container .chat .chat-message .chatButtons{
        display:grid;
        grid-template-columns:1fr 1fr 1fr;
        grid-gap:.5rem
    }
    .profileIndexTicket .allTickets .container .chat .chat-message .chatButtons button{
        font-size:.7rem;
        padding:.5rem
    }
    .profileIndexTicket .allTickets .container .chat .chat-message .chatButtons button i svg{
        width:.6rem;
        height:.6rem
    }
    .profileIndexTicket .sendFiles .sendPos{
        width:90%
    }
}
.profileIndexTicket .popUp{
    background:#00000080;
    z-index:4000;
    position:fixed;
    top:0;
    right:0;
    width:100%;
    height:100%;
    display:grid;
    grid-template-columns:1fr;
    justify-content:center
}
.profileIndexTicket .popUp .popUpItem{
    width:40%;
    margin:auto;
    background:#fff;
    border-radius:.4rem;
    position:relative;
    padding:1rem
}
.profileIndexTicket .popUp .popUpItem .title{
    font-size:1.2rem;
    font-weight:500;
    color:#475569;
    text-align:center
}
.profileIndexTicket .popUp .popUpItem p{
    margin-top:.5rem;
    font-size:1rem;
    font-weight:300;
    color:#475569;
    text-align:center
}
.profileIndexTicket .popUp .popUpItem .buttonsPop{
    display:grid;
    grid-template-columns:auto auto;
    justify-content:center;
    align-items:center;
    grid-gap:1rem;
    margin-top:2rem
}
.profileIndexTicket .popUp .popUpItem .buttonsPop button{
    font-size:.9rem;
    padding:.3rem 1rem;
    border-radius:5px;
    background:green;
    color:#fff
}
.profileIndexTicket .popUp .popUpItem .buttonsPop button:nth-child(2){
    background:red
}
.profileIndexTicket .showTicket{
    background:#00000080;
    z-index:4000;
    position:fixed;
    top:0;
    right:0;
    width:100%;
    height:100%;
    display:grid;
    grid-template-columns:1fr;
    justify-content:center;
    overflow-y:scroll
}
.profileIndexTicket .showTicket .ticketData{
    width:40%;
    margin:auto;
    background:#fff;
    border-radius:.4rem;
    position:relative;
    padding:1rem
}
.profileIndexTicket .showTicket .ticketData .itemsAnswer{
    margin-top:2rem
}
.profileIndexTicket .showTicket .ticketData h4{
    font-size:.9rem;
    font-weight:500;
    color:#475569;
    margin-bottom:.5rem
}
.profileIndexTicket .showTicket .ticketData p{
    padding:.5rem;
    background:#f5f5f5;
    border-radius:5px;
    font-size:.85rem;
    font-weight:300;
    color:#475569
}
.profileIndexTicket .showTicket .ticketData .buttonsPop{
    display:grid;
    grid-template-columns:auto auto;
    justify-content:center;
    align-items:center;
    grid-gap:1rem;
    margin-top:2rem
}
.profileIndexTicket .showTicket .ticketData .buttonsPop button{
    font-size:.9rem;
    padding:.3rem 1rem;
    border-radius:5px;
    background:green;
    color:#fff
}
.profileIndexTicket .showTicket .ticketData .buttonsPop button:nth-child(2){
    background:red
}
.allChargeIndex .chargePrices{
    margin-bottom:1rem
}
.allChargeIndex .chargePrices form .chargeField{
    background:#fff;
    border:1px solid #bbb;
    border-radius:10px;
    padding:1rem;
    overflow:hidden
}
.allChargeIndex .chargePrices form .chargeField .top{
    display:grid;
    grid-template-columns:1fr;
    text-align:right;
    grid-gap:.5rem;
    padding-bottom:1rem;
    border-bottom:1px solid #bbb
}
.allChargeIndex .chargePrices form .chargeField .top .right1{
    font-size:.9rem;
    font-weight:700;
    color:#475569
}
.allChargeIndex .chargePrices form .chargeField .top input{
    direction:ltr;
    text-align:left;
    border:1px solid #000;
    padding:.3rem .5rem;
    color:#475569;
    width:100%;
    border-radius:5px;
    font-size:1rem
}
.allChargeIndex .chargePrices form .chargeField .top p{
    font-size:.75rem;
    font-weight:300;
    color:#475569
}
.allChargeIndex .chargePrices form .chargeField .finalPrice{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:1rem;
    margin-top:1rem
}
.allChargeIndex .chargePrices form .chargeField .finalPrice .title2,.allChargeIndex .chargePrices form .chargeField .finalPrice .price{
    font-size:1.1rem;
    font-weight:900;
    color:#000
}
.allChargeIndex .chargePrices form .chargeField .finalPrice button{
    font-size:1rem;
    font-weight:700;
    color:#fff;
    background:#007e46;
    padding:.5rem 2rem;
    border-radius:5px;
    cursor:pointer
}
.allChargeIndex .chargePrices form .bot{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:1rem
}
.allChargeIndex .chargePrices form .bot .gateItems{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:.5rem;
    margin:2rem 0
}
.allChargeIndex .chargePrices form .bot .gateItems .gateItem{
    display:grid;
    justify-content:center;
    padding:.5rem;
    box-shadow:0 0 10px #0000001a;
    border-radius:10px;
    background:#fff;
    cursor:pointer;
    border:2px solid white;
    filter:grayscale(1);
    transition:all .3s ease-in-out
}
.allChargeIndex .chargePrices form .bot .gateItems .gateItem img{
    height:3.5rem;
    width:3.5rem;
    object-fit:contain
}
.allChargeIndex .chargePrices form .bot .gateItems .gateItem:hover{
    filter:grayscale(0)
}
.allChargeIndex .chargePrices form .bot .gateItems .active{
    border:2px solid #007E46;
    filter:grayscale(0)
}
.allChargeIndex .chargePrices form .bot button{
    font-size:1rem;
    font-weight:700;
    color:#fff;
    background:#007e46;
    padding:.5rem 2rem;
    border-radius:5px;
    cursor:pointer
}
@media screen and (max-width: 1000px){
    .allChargeIndex{
        margin:.5rem
    }
    .allChargeIndex .chargePrice{
        padding:.5rem
    }
    .allChargeIndex .chargePrice form .top .right1{
        font-size:.8rem
    }
    .allChargeIndex .chargePrice form .top input{
        font-size:.8rem;
        width:100%
    }
    .allChargeIndex .chargePrice form .gateItems .gateItem img{
        height:2rem;
        width:2rem
    }
}
.allCreate{
    background:#fff;
    box-shadow:0 0 10px #0000001a;
    padding:1rem;
    margin-top:1rem;
    border-radius:10px
}
.allCreate .alert{
    background:#ff000026;
    color:red;
    padding:1rem;
    border-radius:.3rem;
    font-size:.9rem;
    font-weight:300;
    letter-spacing:.3px;
    margin-bottom:1rem
}
.allCreate .success{
    background:#00ff001a;
    color:green;
    padding:1rem;
    border-radius:.3rem;
    font-size:.9rem;
    font-weight:300;
    letter-spacing:.3px;
    margin-bottom:1rem
}
.allCreate .note2{
    background:#ff000026;
    color:red;
    padding:1rem;
    border-radius:.3rem;
    font-size:.9rem;
    font-weight:300;
    letter-spacing:.3px;
    margin-bottom:1rem
}
.allCreate .item{
    margin-bottom:2rem
}
.allCreate .item .name{
    font-size:1rem;
    font-weight:500;
    color:#000;
    margin-bottom:.5rem
}
.allCreate .item .select2{
    width:100%
}
.allCreate .item .select2 span{
    font-size:1rem;
    font-weight:500;
    color:#000
}
.allCreate .item .select2 .select2-search__field{
    height:25px
}
.allCreate .item .select2 .select2-selection--single{
    height:auto;
    padding:.3rem 0
}
.allCreate .item .select2 .select2-selection__arrow{
    height:100%
}
.allCreate .item .rateItem{
    direction:ltr
}
.allCreate .item .rates{
    direction:ltr;
    display:flex;
    justify-content:right;
    align-items:center
}
.allCreate .item input,.allCreate .item textarea,.allCreate .item select{
    font-size:1rem;
    font-weight:500;
    color:#000;
    padding:.5rem 1rem;
    resize:vertical;
    border-radius:5px;
    width:100%;
    border:1px solid #bbb;
    background:transparent
}
.allCreate .item .prices{
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-gap:1rem;
    align-items:center
}
.allCreate .btnU,.allCreate .btnU3{
    width:100%;
    padding:.5rem;
    text-align:center;
    background:#007e46;
    font-size:1rem;
    font-weight:500;
    color:#fff;
    border-radius:5px
}
.allCreate .btnU2{
    width:100%;
    padding:.5rem;
    text-align:center;
    background:#00f;
    font-size:1rem;
    font-weight:500;
    color:#fff;
    border-radius:5px
}
.allCreate .options{
    padding:1rem;
    border-radius:10px;
    background:#f1f1f1
}
.allCreate .options .name{
    font-size:1rem;
    font-weight:500;
    color:#000
}
.allCreate .options p{
    font-size:.8rem;
    color:#000;
    font-weight:300
}
.allCreate .options .items{
    margin-top:1rem;
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(10rem,1fr));
    grid-gap:1rem
}
.allCreate .options .items .option{
    background:#fff;
    border:3px solid #eee;
    border-radius:10px;
    padding:.5rem;
    cursor:pointer
}
.allCreate .options .items .option .title2{
    text-align:center;
    font-size:1rem;
    font-weight:900;
    color:#000
}
.allCreate .options .items .option .body{
    text-align:center;
    font-size:.9rem;
    font-weight:500;
    color:#475569;
    margin:.5rem
}
.allCreate .options .items .option .price{
    text-align:center;
    font-size:1rem;
    font-weight:700;
    color:#007e46
}
.allCreate .options .items .active{
    border:3px solid #007E46
}
.allCreate .invoice{
    display:grid;
    grid-template-columns:1fr 1fr;
    margin-top:2rem;
    border:1px solid #bbb;
    border-radius:5px
}
.allCreate .invoice .title2{
    border-bottom:1px solid #bbb;
    padding:1rem;
    text-align:center;
    font-size:1rem;
    font-weight:900;
    color:#475569
}
.allCreate .invoice .right{
    border-left:1px solid #bbb
}
.allCreate .invoice ul li{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:.5rem;
    padding:1rem;
    font-size:.9rem;
    font-weight:700;
    color:#475569;
    border-top:1px solid #bbb
}
.allCreate .invoice ul li .buttons2{
    margin-top:1rem
}
.allCreate .invoice ul li .buttons2 button{
    width:100%;
    background:#007e46;
    padding:.2rem .5rem;
    border-radius:5px;
    color:#fff
}
.allCreate .invoice ul li:first-child{
    border-top:0
}
.allCreate .invoice .left .title2{
    color:#007e46
}
.allCreate .invoice .left ul li{
    font-weight:900
}
.allCreate .invoice .left ul li:last-child{
    color:#007e46;
    font-size:1.2rem
}
.allCreate .invoice .left .button{
    display:grid;
    padding:1rem
}
.allCreate .invoice .left .button button{
    width:100%;
    padding:.5rem;
    text-align:center;
    background:#007e46;
    font-size:1rem;
    font-weight:500;
    color:#fff;
    border-radius:5px
}
@media screen and (max-width: 1000px){
    .allCreate .invoice{
        display:block;
        border:0
    }
    .allCreate .invoice .right,.allCreate .invoice .left{
        border:1px solid #bbb
    }
    .allCreate .invoice .left{
        margin-top:1rem
    }
}
.allCartIndex{
    width:100%;
    padding-left:1rem
}
.allCartIndex .checkoutItems{
    display:grid;
    grid-template-columns:1fr 20rem;
    grid-gap:1rem;
    margin-top:1rem
}
.allCartIndex .checkoutItems .title3{
    font-size:1.2rem;
    font-weight:700;
    color:#000;
    margin-bottom:1rem
}
.allCartIndex .checkoutItems .product{
    background:#fff;
    box-shadow:0 0 10px #0000000d;
    border-radius:10px;
    padding:1rem;
    margin-bottom:1rem
}
.allCartIndex .checkoutItems .product .detail .title{
    font-size:1.2rem;
    font-weight:700;
    color:#000;
    overflow:hidden;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    text-overflow:ellipsis;
    margin-bottom:.5rem
}
.allCartIndex .checkoutItems .product .detail p{
    font-size:.9rem;
    font-weight:300;
    color:#475569;
    white-space:pre-line;
    display:-webkit-box;
    box-orient:vertical;
    -webkit-box-orient:vertical;
    line-clamp:2;
    text-align:right;
    -webkit-line-clamp:2;
    overflow:hidden;
    text-overflow:ellipsis
}
.allCartIndex .checkoutItems .product .detail .skills{
    display:grid;
    grid-template-columns:auto 1fr;
    grid-gap:.5rem;
    margin-top:1rem;
    align-items:center
}
.allCartIndex .checkoutItems .product .detail .skills .title2{
    display:flex;
    align-items:center;
    justify-content:right;
    gap:.5rem;
    font-size:.9rem;
    font-weight:500;
    color:#475569
}
.allCartIndex .checkoutItems .product .detail .skills .title2 i{
    display:grid;
    align-items:center
}
.allCartIndex .checkoutItems .product .detail .skills .title2 i svg{
    width:1rem;
    height:1rem;
    fill:#007e46
}
.allCartIndex .checkoutItems .product .detail .skills .skill{
    display:flex;
    flex-wrap:wrap
}
.allCartIndex .checkoutItems .product .detail .skills .skill span{
    font-size:.8rem;
    font-weight:300;
    color:#000
}
.allCartIndex .checkoutItems .product .detail .skills .skill span:before{
    content:",";
    padding:0 .2rem
}
.allCartIndex .checkoutItems .product .detail .skills .skill span:first-child:before{
    content:unset;
    padding:0
}
.allCartIndex .checkoutItems .product .detail .skills .skill .box{
    background:red;
    color:#fff;
    padding:.2rem;
    border-radius:5px
}
.allCartIndex .checkoutItems .product .detail .skills .skill .box:before{
    content:unset
}
.allCartIndex .checkoutItems .product .detail .skills .boxes{
    gap:.5rem
}
.allCartIndex .checkoutItems .product .detail .option{
    display:flex;
    justify-content:left;
    align-items:center;
    gap:.5rem
}
.allCartIndex .checkoutItems .product .detail .option .title2{
    font-size:.9rem;
    font-weight:300;
    color:#475569
}
.allCartIndex .checkoutItems .product .detail .option .body{
    font-size:1rem;
    font-weight:700;
    color:#000
}
.allCartIndex .checkoutItems .checkoutOptions{
    border-radius:10px;
    box-shadow:0 0 10px #0000000d;
    background:#fff;
    padding:1rem
}
.allCartIndex .checkoutItems .checkoutOptions .checkoutTitle{
    font-size:1.2rem;
    font-weight:900;
    color:#475569;
    margin-bottom:1rem;
    letter-spacing:.5px
}
.allCartIndex .checkoutItems .checkoutOptions .payMethod ul{
    margin-top:1rem
}
.allCartIndex .checkoutItems .checkoutOptions .payMethod ul li{
    padding:1rem 0
}
.allCartIndex .checkoutItems .checkoutOptions .payMethod ul li button{
    display:grid;
    grid-template-columns:auto auto 1fr;
    align-items:center;
    grid-gap:1rem;
    background:transparent;
    font-size:1rem;
    font-weight:500;
    color:#475569
}
.allCartIndex .checkoutItems .checkoutOptions .payMethod ul li button i{
    display:grid;
    align-items:center;
    justify-content:center
}
.allCartIndex .checkoutItems .checkoutOptions .payMethod ul li button i svg{
    width:1.5rem;
    height:1.5rem;
    fill:#475569
}
.allCartIndex .checkoutItems .checkoutOptions .payMethod ul li button:before{
    content:"";
    border:2px solid #475569;
    background:#fff;
    border-radius:100%;
    width:.9rem;
    height:.9rem
}
.allCartIndex .checkoutItems .checkoutOptions .payMethod ul li .active{
    color:#007e46
}
.allCartIndex .checkoutItems .checkoutOptions .payMethod ul li .active i svg{
    fill:#007e46
}
.allCartIndex .checkoutItems .checkoutOptions .payMethod ul li .active:before{
    border:2px solid #007E46;
    background:#007e46
}
.allCartIndex .checkoutItems .left .discount{
    box-shadow:0 0 10px #0000000d;
    background:#fff;
    display:grid;
    grid-template-columns:1fr;
    border-radius:10px;
    padding:1rem;
    margin-bottom:1rem
}
.allCartIndex .checkoutItems .left .discount h4{
    color:#475569;
    font-size:.8rem;
    font-weight:400
}
.allCartIndex .checkoutItems .left .discount label{
    display:grid;
    grid-template-columns:1fr auto;
    margin-top:.5rem;
    padding:.5rem;
    border:1px solid #eee;
    border-radius:5px
}
.allCartIndex .checkoutItems .left .discount label input{
    background:transparent;
    color:#475569;
    font-size:.8rem;
    font-weight:400
}
.allCartIndex .checkoutItems .left .discount label button{
    border-radius:5px;
    background:#007e46;
    padding:.3rem .5rem;
    font-size:.75rem;
    font-weight:300;
    color:#fff
}
.allCartIndex .checkoutItems .left .cartNext{
    background:#fff;
    box-shadow:0 0 10px #0000000d;
    border-radius:10px;
    overflow:hidden
}
.allCartIndex .checkoutItems .left .cartNext .cartPriceItem{
    display:grid;
    grid-template-columns:auto auto;
    justify-content:space-between;
    align-items:center;
    padding:.8rem;
    border-top:1px solid #eee
}
.allCartIndex .checkoutItems .left .cartNext .cartPriceItem h4{
    font-size:.9rem;
    font-weight:300;
    color:#475569
}
.allCartIndex .checkoutItems .left .cartNext .cartPriceItem span{
    font-size:1rem;
    font-weight:300;
    color:#475569
}
.allCartIndex .checkoutItems .left .cartNext .cartPriceItem h3{
    display:grid;
    grid-template-columns:auto auto;
    justify-content:left;
    align-items:center;
    grid-gap:.5rem;
    min-height:2rem;
    font-size:1.4rem;
    font-weight:900;
    text-overflow:ellipsis;
    white-space:nowrap;
    overflow:hidden;
    border-radius:10px;
    color:#007e46
}
.allCartIndex .checkoutItems .left .cartNext .cartPriceItem:first-child{
    border-top:0
}
.allCartIndex .checkoutItems .left .cartPay{
    background:#fff;
    box-shadow:0 0 10px #0000000d;
    border-radius:10px;
    margin-top:1rem;
    overflow:hidden;
    position:sticky;
    top:1rem;
    padding:1rem
}
.allCartIndex .checkoutItems .left .cartPay .gatePay{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    margin-bottom:1rem;
    grid-gap:1rem
}
.allCartIndex .checkoutItems .left .cartPay .gatePay .gateItem{
    display:grid;
    justify-content:center;
    padding:.5rem;
    box-shadow:0 0 10px #0000000d;
    border-radius:10px;
    cursor:pointer;
    border:2px solid #bbb;
    filter:grayscale(1);
    transition:all .3s ease-in-out
}
.allCartIndex .checkoutItems .left .cartPay .gatePay .gateItem img{
    height:4rem;
    object-fit:contain
}
.allCartIndex .checkoutItems .left .cartPay .gatePay .active{
    border:2px solid #007E46;
    filter:grayscale(0)
}
.allCartIndex .checkoutItems .left .cartPay .active{
    border:2px solid #007E46!important;
    filter:grayscale(0)!important
}
.allCartIndex .checkoutItems .left .cartPay .nextItem{
    padding:.5rem;
    display:grid;
    justify-content:center
}
.allCartIndex .checkoutItems .left .cartPay .nextItem button{
    display:grid;
    padding:.5rem 1rem;
    border-radius:5px;
    background:#007e46;
    color:#fff;
    font-size:1rem;
    font-weight:300
}
@media screen and (max-width: 800px){
    .allCartIndex .checkoutItems{
        display:block
    }
    .allCartIndex .checkoutItems .left{
        margin-top:1rem
    }
}
.projectIndex{
    margin:1rem;
    margin-right:0
}
.projectIndex .table{
    background:#fff;
    border-radius:5px;
    border:1px solid #bbb
}
.projectIndex .table .filters{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:1rem;
    padding:1rem;
    border-bottom:1px solid #bbb
}
.projectIndex .table .filters .right{
    display:flex;
    justify-content:right;
    align-items:center;
    gap:1rem
}
.projectIndex .table .filters .right .title1{
    font-weight:700;
    color:#000;
    font-size:1rem
}
.projectIndex .table .filters .right select,.projectIndex .table .filters .right input{
    background:transparent;
    border:1px solid #bbb;
    padding:.5rem;
    border-radius:5px;
    font-weight:300;
    color:#475569;
    font-size:.85rem
}
.projectIndex .table .filters .right button{
    background:green;
    padding:.3rem 1rem;
    border-radius:5px;
    color:#fff;
    font-size:1rem;
    height:2.5rem;
    font-weight:300
}
.projectIndex .table .filters .left a{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:.5rem;
    background:#007e46;
    padding:.3rem 1rem;
    border-radius:5px;
    color:#fff;
    font-size:1rem;
    font-weight:300;
    height:2.5rem
}
.projectIndex .table .filters .left a i{
    display:grid;
    align-items:center
}
.projectIndex .table .filters .left a i svg{
    width:1rem;
    height:1rem;
    fill:#fff
}
.projectIndex .table table{
    background:#fff;
    border-radius:.3rem;
    width:100%
}
.projectIndex .table table tr{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(1px,1fr));
    align-items:center;
    border-top:1px solid #eee
}
.projectIndex .table table tr th{
    font-weight:700;
    color:#000;
    font-size:.85rem;
    text-align:center;
    text-overflow:ellipsis;
    white-space:nowrap;
    height:100%;
    overflow:hidden;
    border-left:1px solid #eee;
    padding:.8rem
}
.projectIndex .table table tr th:last-child{
    border-left:0
}
.projectIndex .table table tr td{
    display:grid;
    align-items:center;
    font-weight:700;
    font-size:.85rem;
    text-align:center;
    color:#475569;
    height:100%;
    border-left:1px solid #eee;
    padding:.8rem
}
.projectIndex .table table tr td .unActive{
    background:red;
    color:#fff;
    padding:.2rem .5rem;
    border-radius:5px
}
.projectIndex .table table tr td .active{
    background:green;
    color:#fff;
    padding:.2rem .5rem;
    border-radius:5px
}
.projectIndex .table table tr td .buttons{
    position:relative
}
.projectIndex .table table tr td .buttons .operate{
    font-size:.8rem;
    padding:.3rem;
    border-radius:5px;
    color:#007e46;
    background:transparent;
    border:1px solid #007E46;
    width:100%
}
.projectIndex .table table tr td .buttons .items{
    position:absolute;
    top:calc(100% + 5px);
    z-index:10;
    width:100%;
    background:#fff;
    border-radius:5px;
    border:1px solid #007E46;
    display:none;
    grid-template-columns:1fr
}
.projectIndex .table table tr td .buttons .items a{
    display:grid;
    padding:.5rem;
    font-size:.8rem;
    font-weight:300;
    color:#007e46;
    text-align:right;
    border-top:1px solid #007E46;
    transition:all .3s ease-in-out
}
.projectIndex .table table tr td .buttons .items a:first-child{
    border-top:0
}
.projectIndex .table table tr td .buttons .items a:hover{
    background:#007e46;
    color:#fff
}
.projectIndex .table table tr td:last-child{
    border-left:0
}
.projectIndex .table table tr:first-child{
    border-top:0
}
@media screen and (max-width: 1000px){
    .projectIndex{
        display:block;
        padding:.5rem;
        margin:0
    }
    .projectIndex .table .filters{
        display:flex;
        flex-direction:column-reverse;
        padding:.5rem
    }
    .projectIndex .table .filters .right{
        display:grid;
        grid-template-columns:1fr 1fr;
        grid-gap:1rem;
        margin-bottom:1rem;
        width:100%
    }
    .projectIndex .table .filters .right .title1{
        display:none
    }
    .projectIndex .table .filters .right select,.projectIndex .table .filters .right input{
        width:100%;
        font-size:.7rem
    }
    .projectIndex .table .filters .right button{
        padding:.3rem .5rem;
        font-size:.8rem
    }
    .projectIndex .table .filters .left{
        width:100%
    }
    .projectIndex .table .table1{
        overflow-x:scroll
    }
    .projectIndex .table table tr{
        display:flex;
        align-items:center;
        border-top:1px solid #eee
    }
    .projectIndex .table table tr th{
        width:10rem;
        font-weight:700;
        color:#000;
        font-size:.85rem;
        text-align:center;
        text-overflow:ellipsis;
        white-space:nowrap;
        height:100%;
        overflow:hidden;
        border-left:1px solid #eee;
        padding:.8rem
    }
    .projectIndex .table table tr th:last-child{
        border-left:0
    }
    .projectIndex .table table tr td{
        width:10rem
    }
}
.allIndex .myWidget{
    margin-top:6rem
}
.allIndex .myWidget:first-child{
    margin-top:0
}
.allIndex .myWidget:last-child{
    margin-bottom:2rem
}
@media screen and (max-width: 1000px){
    .allIndex .myWidget{
        margin-top:2rem
    }
}
.allAdsIndex{
    margin:auto
}
.allAdsIndex .adsItems{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));
    grid-gap:2rem
}
.allAdsIndex .adsItems .adsItem{
    border-radius:10px;
    overflow:hidden
}
.allAdsIndex .adsItems .adsItem img{
    width:100%;
    height:100%;
    object-fit:cover
}
@media screen and (max-width: 700px){
    .allAdsIndex .adsItems{
        grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));
        grid-gap:1rem
    }
}
.serviceIndex{
    background:#fff;
    padding:3rem 0
}
.serviceIndex .width{
    margin:auto
}
.serviceIndex .width .title{
    font-size:1.8rem;
    font-weight:900;
    color:#000;
    margin-bottom:4rem;
    text-align:center;
    position:relative;
    z-index:1
}
.serviceIndex .width .title:before{
    position:absolute;
    content:"";
    margin:auto;
    right:0;
    top:calc(100% + .5rem);
    left:0;
    width:4rem;
    border-radius:5rem;
    height:5px;
    background:#007e46
}
.serviceIndex .width .items{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(25rem,1fr));
    grid-gap:2rem
}
.serviceIndex .width .items .item{
    border:1px solid #bbb;
    border-radius:10px;
    position:relative
}
.serviceIndex .width .items .item .top{
    display:flex;
    justify-content:right;
    align-items:center;
    gap:1rem;
    border-bottom:1px solid #bbb;
    padding:1.5rem;
    font-size:1.3rem;
    font-weight:900;
    color:#000
}
.serviceIndex .width .items .item .top i{
    display:grid;
    align-items:center
}
.serviceIndex .width .items .item .top i svg{
    width:2rem;
    height:2rem;
    fill:#007e46
}
.serviceIndex .width .items .item .bot{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:1.5rem
}
.serviceIndex .width .items .item .bot .count{
    font-size:1rem;
    font-weight:900;
    color:#007e46
}
.serviceIndex .width .items .item .bot .more{
    font-size:1rem;
    font-weight:900;
    color:#475569;
    text-decoration:underline;
    transition:all .3s ease-in-out
}
.serviceIndex .width .items .item .bot .more:hover{
    color:#1e90ff
}
.serviceIndex .width .items .item:before{
    content:"";
    background:#fff;
    width:90%;
    height:6px;
    margin:auto;
    position:absolute;
    border:1px solid #bbb;
    border-top:0;
    top:101%;
    border-bottom-left-radius:5px;
    border-bottom-right-radius:5px;
    right:0;
    left:0
}
.serviceIndex .width .items .item:after{
    content:"";
    background:#fff;
    width:70%;
    height:6px;
    margin:auto;
    border:1px solid #bbb;
    border-bottom-left-radius:5px;
    border-bottom-right-radius:5px;
    border-top:0;
    position:absolute;
    top:calc(101% + 6px);
    right:0;
    left:0
}
@media screen and (max-width: 1000px){
    .serviceIndex{
        padding:1rem 0 2rem
    }
    .serviceIndex .width .title{
        font-size:1rem;
        margin-bottom:2rem
    }
    .serviceIndex .width .title:before{
        height:4px
    }
    .serviceIndex .width .items{
        display:grid;
        grid-template-columns:1fr;
        grid-gap:2rem
    }
    .serviceIndex .width .items .item .top{
        gap:.5rem;
        padding:.5rem;
        font-size:1rem
    }
    .serviceIndex .width .items .item .top i svg{
        width:1.2rem;
        height:1.2rem;
        fill:#007e46
    }
    .serviceIndex .width .items .item .bot{
        padding:1rem
    }
    .serviceIndex .width .items .item .bot .count{
        font-size:.9rem;
        font-weight:900
    }
    .serviceIndex .width .items .item .bot .more{
        font-size:.8rem
    }
}
.serviceIndex2{
    margin:auto
}
.serviceIndex2 .title{
    font-size:2.2rem;
    font-weight:900;
    color:#000;
    text-align:center;
    margin-bottom:2rem
}
.serviceIndex2 .items{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));
    grid-gap:1rem
}
.serviceIndex2 .items .item{
    border:1px solid #e3e7ee;
    border-radius:10px;
    background:#fff;
    position:relative;
    padding:2rem
}
.serviceIndex2 .items .item .pic{
    display:grid;
    justify-content:center;
    align-items:center;
    margin-bottom:2rem
}
.serviceIndex2 .items .item .pic img{
    height:4rem;
    object-fit:contain
}
.serviceIndex2 .items .item .title2{
    font-size:1.3rem;
    font-weight:700;
    text-align:center;
    height: 6em; /* ارتفاع معادل چهار خط، هر خط تقریبا 1.2em */
    color:#000
}
.serviceIndex2 .items .item .body{
    font-size:.9rem;
    font-weight:300;
    margin-top:.5rem;
    color:#475569;
    height: 6.6em; /* ارتفاع معادل چهار خط، هر خط تقریبا 1.2em */																							 
    white-space:pre-line;
    display:-webkit-box;
    box-orient:vertical;
    -webkit-box-orient:vertical;
    line-clamp:4;
    text-align:center;
    -webkit-line-clamp:4;
    overflow:hidden;
    text-overflow:ellipsis
}
.serviceIndex2 .items .item .more{
    width:100%;
    background:#edf1f7;
    border-radius:5px;
    color:#000;
    font-size:1rem;
    font-weight:300;
    text-align:center;
    padding:.5rem;
    margin-top:1rem;
    transition:all .3s ease-in-out
}
.serviceIndex2 .items .item:hover{
    box-shadow:0 15px 99px #29292926
}
.serviceIndex2 .items .item:hover .more{
    background:#007e46;
    color:#fff
}
@media screen and (max-width: 1000px){
    .serviceIndex2 .title{
        font-size:1.5rem;
        margin-bottom:1rem
    }
    .serviceIndex2 .items{
        display:grid;
        grid-template-columns:1fr 1fr;
        grid-gap:.5rem
    }
    .serviceIndex2 .items .item{
        padding:.5rem
    }
    .serviceIndex2 .items .item .pic{
        margin-bottom:1rem
    }
    .serviceIndex2 .items .item .title2{
        font-size:1rem
    }
    .serviceIndex2 .items .item .body{
        font-size:.7rem;
        line-clamp:2;
        -webkit-line-clamp:2
    }
    .serviceIndex2 .items .item .more{
        font-size:.8rem
    }
}
.skillIndex{
    background:#fff;
    padding:3rem 0
}
.skillIndex .width{
    margin:auto
}
.skillIndex .width .title{
    font-size:2.5rem;
    font-weight:900;
    color:#000;
    margin-bottom:2rem;
    padding-bottom:2rem;
    border-bottom:1px solid #bbb
}
.skillIndex .width .items{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));
    grid-gap:2rem
}
.skillIndex .width .items .item span{
    font-size:1.1rem;
    font-weight:700;
    color:#000;
    opacity:.7;
    position:relative
}
.skillIndex .width .items .item span:before{
    position:absolute;
    top:100%;
    right:0;
    left:0;
    content:"";
    width:0;
    background:#007e46;
    height:2px;
    transition:all .3s ease-in-out
}
.skillIndex .width .items .item:hover span:before{
    width:100%
}
@media screen and (max-width: 1000px){
    .skillIndex{
        padding:1rem
    }
    .skillIndex .width .title{
        font-size:1.2rem;
        margin-bottom:1rem;
        padding-bottom:1rem
    }
    .skillIndex .width .items{
        grid-template-columns:repeat(auto-fill,minmax(6rem,1fr));
        grid-gap:.5rem
    }
    .skillIndex .width .items .item span{
        font-size:.8rem
    }
}
.freelancerIndex{
    margin:auto
}
.freelancerIndex .title{
    font-size:2.2rem;
    font-weight:900;
    color:#000;
    text-align:center;
    margin-bottom:1rem
}
.freelancerIndex .slider-freelancer article{
    padding:.5rem
}
.freelancerIndex .slider-freelancer article .item{
    border:1px solid #e3e7ee;
    border-radius:10px;
    background:#fff;
    position:relative;
    padding:1rem
}
.freelancerIndex .slider-freelancer article .item .pic{
    display:grid;
    justify-content:center;
    align-items:center
}
.freelancerIndex .slider-freelancer article .item .pic img{
    height:5rem;
    object-fit:contain;
    border-radius:10px
}
.freelancerIndex .slider-freelancer article .item .name{
    font-size:1.3rem;
    font-weight:700;
    text-align:center;
    color:#000;
    margin-top:1rem;
    margin-bottom:.5rem
}
.freelancerIndex .slider-freelancer article .item p{
    font-size:.8rem;
    font-weight:300;
    text-align:center;
    color:#475569;
    white-space:pre-line;
    display:-webkit-box;
    box-orient:vertical;
    -webkit-box-orient:vertical;
    line-clamp:3;
    -webkit-line-clamp:3;
    overflow:hidden;
    text-overflow:ellipsis
}
.freelancerIndex .slider-freelancer article .item .options{
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-gap:.5rem;
    margin-top:1rem
}
.freelancerIndex .slider-freelancer article .item .options .option{
    padding:.3rem;
    text-align:center;
    font-size:.8rem;
    font-weight:500;
    color:#000;
    background:#f8f8fc;
    border:1px solid #e3e7ee;
    border-radius:5px
}
.freelancerIndex .slider-freelancer article .item .buttons{
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-gap:.5rem;
    margin-top:1rem
}
.freelancerIndex .slider-freelancer article .item .buttons a{
    display:grid;
    padding:.3rem 1rem;
    border-radius:5px;
    border:1px solid #E4911F;
    font-size:.8rem;
    font-weight:500;
    text-align:center;
    color:#e4911f;
    background:#e4911f0d
}
.freelancerIndex .slider-freelancer article .item .buttons a:hover{
    background:#e4911f;
    color:#fff
}
.freelancerIndex .slider-freelancer article .item .buttons a:last-child{
    border:1px solid #007E46;
    color:#007e46;
    background:transparent
}
.freelancerIndex .slider-freelancer article .item .buttons a:last-child:hover{
    background:#007e46;
    color:#fff
}
.freelancerIndex .more{
    padding:.8rem;
    text-align:center;
    background:#007e46;
    color:#fff;
    font-size:1rem;
    font-weight:700;
    display:grid;
    border-radius:5px;
    width:70%;
    margin:auto;
    margin-top:1rem
}
@media screen and (max-width: 1000px){
    .freelancerIndex .title{
        font-size:1.5rem
    }
    .freelancerIndex .slider-freelancer article{
        padding:.5rem .2rem
    }
    .freelancerIndex .slider-freelancer article .item{
        padding:.2rem
    }
    .freelancerIndex .slider-freelancer article .item .pic img{
        height:4rem
    }
    .freelancerIndex .slider-freelancer article .item .name{
        font-size:1rem;
        margin-top:.5rem
    }
    .freelancerIndex .slider-freelancer article .item p{
        font-size:.7rem;
        line-clamp:2;
        -webkit-line-clamp:2
    }
    .freelancerIndex .slider-freelancer article .item .options .option{
        font-size:.5rem
    }
    .freelancerIndex .slider-freelancer article .item .buttons{
        display:grid;
        grid-template-columns:1fr 1fr
    }
    .freelancerIndex .slider-freelancer article .item .buttons a{
        padding:.3rem .1rem;
        font-size:.5rem
    }
    .freelancerIndex .more{
        padding:.4rem;
        font-size:.8rem;
        width:100%;
        margin-top:.5rem
    }
}
.commentIndex{
    margin:auto;
    position:relative
}
.commentIndex .title{
    font-size:1.8rem;
    font-weight:900;
    color:#000;
    text-align:center;
    margin-bottom:2rem
}
.commentIndex .slider-comment .item .block{
    background:#fff;
    border-radius:10px;
    overflow:hidden;
    border:1px solid #bbbbbb
}
.commentIndex .slider-comment .item .block .body{
    font-size:1rem;
    font-weight:700;
    color:#475569;
    line-height:2.5rem;
    margin:1rem 0;
    padding:0 1rem;
    overflow:hidden;
    display:-webkit-box;
    -webkit-line-clamp:4;
    -webkit-box-orient:vertical;
    text-overflow:ellipsis;
    border-bottom:1px solid #bbbbbb
}
.commentIndex .slider-comment .item .block .user{
    display:flex;
    justify-content:right;
    align-items:center;
    gap:1rem;
    margin-bottom:1rem
}
.commentIndex .slider-comment .item .block .user .pic{
    background:#eee;
    overflow:hidden;
    padding:.3rem 1rem .3rem .3rem;
    border-top-left-radius:5rem;
    border-bottom-left-radius:5rem
}
.commentIndex .slider-comment .item .block .user .pic img{
    border-radius:100%;
    width:2.4rem;
    height:2.4rem;
    object-fit:cover;
    border:2px solid white;
    box-shadow:0 0 5px #0003
}
.commentIndex .slider-comment .item .block .user .name .title1{
    font-size:1rem;
    font-weight:900;
    color:#000
}
.commentIndex .slider-comment .item .block .user .name .job{
    font-size:.8rem;
    font-weight:500;
    color:#007e46
}
.commentIndex .slider-comment .item:after{
    display:grid;
    width:90%;
    margin:auto;
    content:"";
    height:6px;
    background:#007e46;
    border-bottom-right-radius:10px;
    border-bottom-left-radius:10px;
    border:1px solid #bbbbbb;
    border-top:0
}
@media screen and (max-width: 1000px){
    .commentIndex .title{
        font-size:1.2rem;
        margin-bottom:1rem
    }
    .commentIndex .slider-comment .item .block{
        border-radius:5px
    }
    .commentIndex .slider-comment .item .block .body{
        font-size:.8rem;
        padding:.5rem
    }
    .commentIndex .slider-comment .item .block .user{
        gap:.5rem;
        margin-bottom:.5rem
    }
    .commentIndex .slider-comment .item .block .user .pic img{
        width:2rem;
        height:2rem
    }
    .commentIndex .slider-comment .item .block .user .name .title1{
        font-size:.8rem
    }
    .commentIndex .slider-comment .item .block .user .name .job{
        font-size:.65rem
    }
}
.commentIndex2{
    background:#fff;
    padding:4rem 0
}
.commentIndex2 .width{
    margin:auto
}
.commentIndex2 .title{
    font-size:2.2rem;
    font-weight:900;
    color:#000;
    text-align:center;
    margin-bottom:2rem
}
.commentIndex2 .slider-comment2 .item{
    padding:1rem .5rem
}
.commentIndex2 .slider-comment2 .item .block{
    background:#fff;
    border-radius:10px;
    overflow:hidden;
    border:1px solid #e3e7ee;
    box-shadow:0 5px 10px #0000000d
}
.commentIndex2 .slider-comment2 .item .block .body{
    font-size:1rem;
    font-weight:700;
    color:#475569;
    line-height:2.5rem;
    padding:2rem;
    overflow:hidden;
    display:-webkit-box;
    -webkit-line-clamp:4;
    -webkit-box-orient:vertical;
    text-overflow:ellipsis;
    border-bottom:1px solid #e3e7ee
}
.commentIndex2 .slider-comment2 .item .block .user{
    display:flex;
    justify-content:right;
    align-items:center;
    gap:1rem;
    padding:1rem
}
.commentIndex2 .slider-comment2 .item .block .user .pic{
    overflow:hidden
}
.commentIndex2 .slider-comment2 .item .block .user .pic img{
    border-radius:100%;
    width:4rem;
    height:4rem;
    object-fit:cover
}
.commentIndex2 .slider-comment2 .item .block .user .name .title1{
    font-size:1.2rem;
    font-weight:900;
    color:#000
}
.commentIndex2 .slider-comment2 .item .block .user .name .job{
    font-size:.8rem;
    font-weight:500;
    color:#007e46
}
.commentIndex2 .slider-comment2 .owl-next,.commentIndex2 .slider-comment2 .owl-prev{
    background:#000!important;
    border:2px solid white!important;
    box-shadow:0 0 10px #0000001a;
    width:3rem;
    height:3rem;
    display:grid;
    align-content:center;
    border-radius:50%;
    position:absolute;
    top:0;
    bottom:0;
    margin:auto
}
.commentIndex2 .slider-comment2 .owl-next span,.commentIndex2 .slider-comment2 .owl-prev span{
    font-size:2rem;
    color:#fff
}
.commentIndex2 .slider-comment2 .owl-prev{
    right:0
}
.commentIndex2 .slider-comment2 .owl-next{
    left:0
}
@media screen and (max-width: 1000px){
    .commentIndex2{
        padding:1rem 0
    }
    .commentIndex2 .title{
        font-size:1.2rem;
        margin-bottom:0
    }
    .commentIndex2 .slider-comment2 .item{
        padding:0;
        padding-top:1rem
    }
    .commentIndex2 .slider-comment2 .item .block .body{
        font-size:.8rem;
        padding:1rem
    }
    .commentIndex2 .slider-comment2 .item .block .user{
        gap:.5rem;
        padding:.5rem
    }
    .commentIndex2 .slider-comment2 .item .block .user .pic img{
        width:2.5rem;
        height:2.5rem
    }
    .commentIndex2 .slider-comment2 .item .block .user .name .title1{
        font-size:.9rem
    }
    .commentIndex2 .slider-comment2 .item .block .user .name .job{
        font-size:.7rem
    }
    .commentIndex2 .slider-comment2 .owl-next,.commentIndex2 .slider-comment2 .owl-prev{
        width:2rem;
        height:2rem
    }
    .commentIndex2 .slider-comment2 .owl-next span,.commentIndex2 .slider-comment2 .owl-prev span{
        font-size:1.3rem
    }
}
.aboutIndex{
    margin:auto;
    display:grid;
    grid-template-columns:1fr 2fr;
    grid-gap:3rem
}
.aboutIndex .pic{
    overflow:hidden;
    border-radius:10px;
    box-shadow:0 5px 10px #0003
}
.aboutIndex .pic img{
    object-fit:cover;
    width:100%;
    height:100%
}
.aboutIndex .detail .title{
    font-size:2rem;
    margin-bottom:1rem;
    font-weight:900;
    color:#000
}
.aboutIndex .detail .more{
    font-size:1rem;
    margin-bottom:.5rem;
    font-weight:500;
    color:#007e46
}
.aboutIndex .detail .bodies{
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-gap:2rem;
    margin-top:2rem
}
.aboutIndex .detail .bodies .body{
    background:#fff;
    padding:1rem;
    border-radius:10px
}
.aboutIndex .detail .bodies .body .title1{
    font-size:1.2rem;
    font-weight:900;
    color:#000
}
.aboutIndex .detail .bodies .body p{
    font-size:1rem;
    font-weight:500;
    line-height:2rem;
    color:#475569
}
@media screen and (max-width: 1000px){
    .aboutIndex{
        display:block
    }
    .aboutIndex .pic{
        border-radius:5px;
        margin-bottom:1rem
    }
    .aboutIndex .detail .title{
        text-align:center;
        font-size:1.5rem
    }
    .aboutIndex .detail .more{
        text-align:center;
        font-size:1rem
    }
    .aboutIndex .detail .bodies{
        grid-gap:.5rem;
        margin-top:1rem
    }
    .aboutIndex .detail .bodies .body{
        padding:.5rem;
        border-radius:5px
    }
    .aboutIndex .detail .bodies .body .title1{
        font-size:.9rem
    }
    .aboutIndex .detail .bodies .body p{
        font-size:.8rem
    }
}
.aboutIndex2{
    margin:auto;
    display:grid;
    grid-template-columns:1fr 2fr;
    grid-gap:3rem
}
.aboutIndex2 .pic{
    overflow:hidden;
    border-radius:10px;
    box-shadow:0 5px 10px #0003
}
.aboutIndex2 .pic img{
    object-fit:cover;
    width:100%;
    height:100%
}
.aboutIndex2 .detail .title{
    font-size:2.5rem;
    font-weight:900;
    margin-bottom:.5rem;
    color:#000
}
.aboutIndex2 .detail .more{
    font-size:1.1rem;
    margin-bottom:1rem;
    font-weight:500;
    color:#000
}
.aboutIndex2 .detail .bodies{
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
    grid-gap:2rem;
    margin-top:3rem
}
.aboutIndex2 .detail .bodies .body{
    border-radius:10px
}
.aboutIndex2 .detail .bodies .body .title1{
    font-size:1.2rem;
    font-weight:700;
    color:#000;
    display:flex;
    justify-content:right;
    align-items:center;
    gap:.5rem
}
.aboutIndex2 .detail .bodies .body .title1:before{
    content:"";
    width:18px;
    height:18px;
    background:#fff;
    border-radius:100%;
    border:5px solid #007E46
}
.aboutIndex2 .detail .bodies .body p{
    font-size:.85rem;
    font-weight:500;
    line-height:2rem;
    margin-top:.5rem;
    color:#475569
}
@media screen and (max-width: 1000px){
    .aboutIndex2{
        display:block
    }
    .aboutIndex2 .pic{
        border-radius:5px;
        margin-bottom:1rem
    }
    .aboutIndex2 .detail .title{
        text-align:center;
        font-size:1.5rem
    }
    .aboutIndex2 .detail .more{
        text-align:center;
        font-size:1rem
    }
    .aboutIndex2 .detail .bodies{
        grid-template-columns:1fr 1fr;
        grid-gap:.5rem;
        margin-top:1rem
    }
    .aboutIndex2 .detail .bodies .body{
        padding:.5rem;
        border-radius:5px
    }
    .aboutIndex2 .detail .bodies .body .title1{
        font-size:.8rem
    }
    .aboutIndex2 .detail .bodies .body p{
        font-size:.7rem
    }
}
.topIndex{
    background:#2f3d29;
    background:linear-gradient(150deg,green,#007e46,#32cd32);
    padding:4rem 0;
    border-bottom-left-radius:5rem
}
.topIndex .width{
    display:grid;
    grid-template-columns:2fr 1fr;
    grid-gap:2rem;
    margin:auto
}
.topIndex .width .right .title{
    font-size:3rem;
    font-weight:900;
    color:#fff;
    margin-bottom:1rem
}
.topIndex .width .right p{
    font-size:1.3rem;
    font-weight:700;
    color:#fff;
    opacity:.7;
    margin-bottom:1rem
}
.topIndex .width .right .buttons{
    display:flex;
    gap:1rem;
    align-items:center;
    flex-wrap:wrap;
    margin-bottom:2rem
}
.topIndex .width .right .buttons a{
    font-size:1.1rem;
    font-weight:500;
    color:#007e46;
    padding:.5rem 1rem;
    border-radius:5px;
    background:#fff
}
.topIndex .width .right .buttons a:last-child{
    border:1px solid white;
    background:transparent;
    color:#fff
}
.topIndex .width .right .options{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:1rem
}
.topIndex .width .right .options .option{
    color:#ffffffb3;
    background:#020024;
    background:linear-gradient(45deg,#02002400 5%,#ffffff80 6%,#fff0 9%,#ffffff80 10%,#fff0 17%,#ffffff80,#fff0 21%);
    background-size:150%;
    background-position:left;
    transition:1s;
    box-shadow:inset 0 3px 5px #fff,0 0 10px #00000040;
    padding:1rem;
    text-align:center;
    border-radius:10px;
    overflow:hidden;
    min-width:10rem;
    position:relative
}
.topIndex .width .right .options .option .title2{
    position:relative;
    z-index:1;
    direction:ltr;
    font-size:2rem;
    font-weight:900;
    color:#000
}
.topIndex .width .right .options .option .body{
    position:relative;
    z-index:1;
    font-size:1rem;
    font-weight:300;
    color:#000
}
.topIndex .width .right .options .option:before{
    position:absolute;
    filter:blur(45px);
    top:0;
    right:0;
    left:0;
    bottom:0;
    background:#fff;
    content:"";
    z-index:1
}
.topIndex .width .left{
    border:4px solid white;
    border-radius:10px;
    overflow:hidden
}
.topIndex .width .left img{
    width:100%;
    height:100%;
    object-fit:cover
}
@media screen and (max-width: 1000px){
    .topIndex{
        border-bottom-left-radius:0;
        padding:2rem 0
    }
    .topIndex .width{
        display:flex;
        flex-direction:column-reverse
    }
    .topIndex .width .right .title{
        font-size:1.5rem;
        margin-bottom:.5rem;
        text-align:center
    }
    .topIndex .width .right p{
        font-size:1rem;
        margin-bottom:.5rem;
        text-align:center
    }
    .topIndex .width .right .buttons{
        display:grid;
        grid-template-columns:1fr 1fr;
        margin-bottom:1rem
    }
    .topIndex .width .right .buttons a{
        font-size:.9rem;
        padding:.5rem;
        text-align:center
    }
    .topIndex .width .right .options{
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:.5rem
    }
    .topIndex .width .right .options .option{
        padding:.5rem;
        min-width:auto
    }
    .topIndex .width .right .options .option .title2{
        font-size:1rem
    }
    .topIndex .width .right .options .option .body{
        font-size:.7rem
    }
}
.topIndex2{
    padding-top:4rem;
	padding-bottom:2rem;					
    background-attachment:scroll;
    background-size:contain;
    position:relative
}
.topIndex2 .width{
    margin:auto;
    position:relative;
    z-index:3;
    text-align:center
}
.topIndex2 .width .top{
    display:grid;
    justify-items:center
}
.topIndex2 .width .top .title{
    font-size:2.3rem;
    font-weight:900;
    color:#fff;
    margin-bottom:1rem
}
.topIndex2 .width .top p{
    font-size:1rem;
    font-weight:300;
    color:#fff;
    margin-bottom:1rem
}
.topIndex2 .width .top .filters{
    display:grid;
    justify-items:right;
    width:50vw;
    margin:1rem 0
}
.topIndex2 .width .top .filters .tabs{
    display:flex;
    justify-content:right;
    align-items:center;
    gap:1rem;
    background:#fff;
    padding:1rem;
    border-radius:5px;
    margin-bottom:.5rem
}
.topIndex2 .width .top .filters .tabs .titleT{
    font-size:1rem;
    font-weight:300;
    color:#000
}
.topIndex2 .width .top .filters .tabs .tab{
    cursor:pointer;
    font-size:1rem;
    font-weight:300;
    color:#000
}
.topIndex2 .width .top .filters .tabs .tab input{
    width:1rem;
    height:1rem
}
.topIndex2 .width .top .filters .searchC{
    background:#fff;
    padding:1rem;
    border-radius:5px;
    width:100%;
    display:grid;
    justify-items:right
}
.topIndex2 .width .top .filters .searchC input{
    text-align:right;
    font-size:1.3rem;
    font-weight:300;
    color:#000
}
.topIndex2 .width .top .cats{
    display:flex;
    justify-items:center;
    align-items:center;
    flex-wrap:wrap;
    gap:1rem
}
.topIndex2 .width .top .cats .item{
    font-size:1rem;
    background:#fff;
    border-radius:5rem;
    font-weight:300;
    color:#000;
    padding:.5rem 1rem
}
.topIndex2 .slider-options{
    display:grid!important;
    position:relative;
    z-index:3;
    transform:translateY(3rem);
    overflow:hidden
}
.topIndex2 .slider-options .option{
    background:#fff;
    border-radius:10px;
    padding:2rem;
    display:grid;
    border:2px solid #e3e7ee;
    grid-template-columns:auto 1fr;
    gap:1rem
}
.topIndex2 .slider-options .option .pic i{
    display:grid;
    align-items:center
}
.topIndex2 .slider-options .option .pic i svg{
    width:4rem;
    height:4rem;
    fill:#007e46
}
.topIndex2 .slider-options .option .des .title2{
    font-size:1.5rem;
    font-weight:700;
    color:#000
}
.topIndex2 .slider-options .option .des .body{
    font-size:1rem;
    font-weight:300;
    color:#000
}
.topIndex2 .slider-options .owl-next,.topIndex2 .slider-options .owl-prev{
    background:#000!important;
    border:2px solid white!important;
    box-shadow:0 0 10px #0000001a;
    width:3rem;
    height:3rem;
    display:grid;
    align-content:center;
    border-radius:50%;
    position:absolute;
    top:0;
    bottom:0;
    margin:auto
}
.topIndex2 .slider-options .owl-next span,.topIndex2 .slider-options .owl-prev span{
    font-size:2rem;
    color:#fff
}
.topIndex2 .slider-options .owl-prev{
    right:0
}
.topIndex2 .slider-options .owl-next{
    left:0
}
.topIndex2:before{
    content:"";
    position:absolute;
    top:0;
    right:0;
    left:0;
    bottom:0;
    background:#000c
}
@media screen and (max-width: 1000px){
    .topIndex2{
        margin-bottom:4rem;
        padding-top:2rem
    }
    .topIndex2 .width .top .title{
        font-size:1.7rem
    }
    .topIndex2 .width .top p{
        font-size:.9rem;
        font-weight:300;
        color:#fff;
        margin-bottom:1rem
    }
    .topIndex2 .width .top .filters{
        display:grid;
        justify-items:right;
        width:100%;
        margin:1rem 0
    }
    .topIndex2 .width .top .filters .tabs{
        padding:.5rem
    }
    .topIndex2 .width .top .filters .tabs .titleT,.topIndex2 .width .top .filters .tabs .tab{
        font-size:.9rem
    }
    .topIndex2 .width .top .filters .tabs .tab input{
        width:.7rem;
        height:.7rem
    }
    .topIndex2 .width .top .filters .searchC{
        padding:.8rem
    }
    .topIndex2 .width .top .filters .searchC input{
        font-size:1rem
    }
    .topIndex2 .width .top .cats{
        grid-gap:.5rem
    }
    .topIndex2 .width .top .cats .item{
        font-size:.7rem;
        padding:.5rem
    }
    .topIndex2 .slider-options{
        transform:translateY(2rem)
    }
    .topIndex2 .slider-options .option{
        padding:1rem;
        gap:.5rem
    }
    .topIndex2 .slider-options .option .pic i svg{
        width:2.7rem;
        height:2.7rem
    }
    .topIndex2 .slider-options .option .des .title2{
        font-size:1rem
    }
    .topIndex2 .slider-options .option .des .body{
        font-size:.7rem
    }
    .topIndex2 .slider-options .owl-next,.topIndex2 .slider-options .owl-prev{
        width:2rem;
        height:2rem
    }
    .topIndex2 .slider-options .owl-next span,.topIndex2 .slider-options .owl-prev span{
        font-size:1.3rem
    }
}

			  
																					   
																		 
															  
																		  
																	   

	
 

								 
																								  
					
					
						   
																										 
																					
 

							 
						 
					
																
				
							  
																						
					
									  
 

								   
							  
 
								
																								 
						 
							  
				
				 
					
					
					   
					
									  
 

									  
							  
 

																														  
								 
					
					
																												  
 

.AllPopUpIndex{
    position:fixed;
    top:0;
    right:0;
    width:100%;
    height:100%;
    background-color:#0009;
    z-index:999
}
.AllPopUpIndex .AllPopUpData{
    padding:1rem;
    width:35%;
    margin:auto;
    border-radius:.3rem;
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    background:#fff
}
.AllPopUpIndex .AllPopUpData .pic{
    display:grid;
    justify-content:center;
    margin-bottom:1rem
}
.AllPopUpIndex .AllPopUpData .pic img{
    width:100%;
    height:5rem;
    object-fit:contain
}
.AllPopUpIndex .AllPopUpData h3{
    text-align:center;
    font-size:1.1rem;
    font-weight:700;
    color:#475569;
    margin-bottom:.5rem
}
.AllPopUpIndex .AllPopUpData p{
    text-align:center;
    font-size:.9rem;
    font-weight:500;
    color:#475569;
    opacity:.7
}
.AllPopUpIndex .AllPopUpData .buttons{
    display:grid;
    justify-content:center;
    margin-top:1rem
}
.AllPopUpIndex .AllPopUpData .buttons a{
    text-align:center;
    font-size:.9rem;
    font-weight:500;
    background:#007e46;
    color:#fff;
    padding:.2rem 1rem;
    border-radius:5px
}
@media screen and (max-width: 920px){
    .AllPopUpIndex .AllPopUpData{
        width:90%
    }
}
.blogIndex{
    margin:auto
}
.blogIndex .title{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:2rem
}
.blogIndex .title .name{
    font-size:2rem;
    font-weight:900;
    color:#000
}
.blogIndex .title a{
    padding:.3rem 1.5rem;
    border-radius:5px;
    font-size:1.2rem;
    font-weight:300;
    color:#fff;
    background:#007e46;
    box-shadow:0 0 5px #0000004d
}
.blogIndex .slider-blog a{
    display:grid;
    border-radius:10px;
    position:relative;
    overflow:hidden
}
.blogIndex .slider-blog a .cover{
    position:absolute;
    top:0;
    right:0;
    left:0;
    bottom:0;
    background:#00000080;
    display:grid;
    align-content:end;
    padding:1rem
}
.blogIndex .slider-blog a .cover .options{
    display:flex;
    align-items:center;
    gap:2rem;
    opacity:.9
}
.blogIndex .slider-blog a .cover .options .option{
    display:flex;
    align-items:center;
    gap:.5rem;
    font-size:.9rem;
    font-weight:300;
    color:#fff
}
.blogIndex .slider-blog a .cover .options .option i{
    display:grid;
    align-items:center
}
.blogIndex .slider-blog a .cover .options .option i svg{
    width:1.3rem;
    height:1.3rem;
    fill:#fff
}
.blogIndex .slider-blog a .cover .title2{
    font-size:1.1rem;
    font-weight:900;
    color:#fff;
    margin-top:1rem
}
@media screen and (max-width: 1000px){
    .blogIndex .title .name{
        font-size:1.5rem
    }
    .blogIndex .title a{
        padding:.3rem 1rem;
        font-size:.9rem
    }
    .blogIndex .slider-blog a{
        border-radius:5px
    }
    .blogIndex .slider-blog a .cover{
        padding:.5rem
    }
    .blogIndex .slider-blog a .cover .options{
        gap:1rem
    }
    .blogIndex .slider-blog a .cover .options .option{
        font-size:.8rem
    }
    .blogIndex .slider-blog a .cover .options .option i svg{
        width:1.1rem;
        height:1.1rem
    }
    .blogIndex .slider-blog a .cover .title2{
        font-size:.9rem;
        font-weight:900;
        color:#fff;
        margin-top:1rem
    }
}
.blogIndex2 .width{
    margin:auto
}
.blogIndex2 .title{
    font-size:2.2rem;
    font-weight:900;
    color:#000;
    text-align:center;
    margin-bottom:1rem
}
.blogIndex2 .slider-blog2 a{
    display:grid;
    border-radius:10px;
    position:relative;
    overflow:hidden;
    background:#fff
}
.blogIndex2 .slider-blog2 a .pic img{
    height:15rem;
    object-fit:cover
}
.blogIndex2 .slider-blog2 a .title2{
    font-size:1.2rem;
    font-weight:900;
    color:#000;
    margin:1rem;
    text-overflow:ellipsis;
    white-space:nowrap;
    overflow:hidden
}
.blogIndex2 .slider-blog2 a p{
    background:#ebf5fe;
    padding:1rem;
    margin:1rem;
    margin-top:0;
    border-radius:5px;
    font-size:.9rem;
    font-weight:300;
    color:#000;
    white-space:pre-line;
    display:-webkit-box;
    box-orient:vertical;
    -webkit-box-orient:vertical;
    line-clamp:5;
    -webkit-line-clamp:5;
    overflow:hidden;
    text-overflow:ellipsis
}
.blogIndex2 .slider-blog2 a .move{
    padding:.8rem;
    text-align:center;
    background:#edf1f7;
    color:#000;
    font-size:1rem;
    font-weight:700;
    display:grid;
    border-radius:5px;
    margin:1rem;
    margin-top:0
}
.blogIndex2 .more{
    padding:.8rem;
    text-align:center;
    background:#007e46;
    color:#fff;
    font-size:1rem;
    font-weight:700;
    display:grid;
    border-radius:5px;
    width:70%;
    margin:auto;
    margin-top:1rem
}
@media screen and (max-width: 1000px){
    .blogIndex2 .title{
        font-size:1.5rem
    }
    .blogIndex2 .slider-blog2 a .title2{
        font-size:.9rem;
        margin:.5rem
    }
    .blogIndex2 .slider-blog2 a p{
        padding:.5rem;
        margin:.5rem;
        font-size:.7rem;
        line-clamp:3;
        -webkit-line-clamp:3
    }
    .blogIndex2 .slider-blog2 a .move{
        padding:.5rem;
        font-size:.7rem;
        margin:.5rem
    }
    .blogIndex2 .more{
        padding:.4rem;
        font-size:.8rem;
        width:100%;
        margin-top:.5rem
    }
}
.projectHome{
    margin:auto
}
.projectHome .title{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:2rem
}
.projectHome .title .name{
    font-size:1.7rem;
    font-weight:900;
    color:#000
}
.projectHome .title a{
    padding:.3rem 1.5rem;
    border-radius:5px;
    font-size:1rem;
    font-weight:300;
    color:#fff;
    background:linear-gradient(to left,#007e46,#32cd32,#007e46);
    box-shadow:0 0 5px #0000004d
}
.projectHome .slider-project .projectItem{
    border-radius:10px;
    border:1px solid #bbb;
    background:#fff;
    padding:1rem
}
.projectHome .slider-project .projectItem .pic{
    display:grid;
    justify-content:center
}
.projectHome .slider-project .projectItem .pic img{
    width:4rem;
    height:4rem;
    object-fit:cover;
    border-radius:50%
}
.projectHome .slider-project .projectItem .name{
    display:grid;
    font-size:1rem;
    font-weight:700;
    justify-content:center;
    color:#007e46;
    margin-top:.5rem
}
.projectHome .slider-project .projectItem p{
    font-size:1rem;
    font-weight:300;
    margin-top:1rem;
    color:#475569;
    white-space:pre-line;
    display:-webkit-box;
    box-orient:vertical;
    height:5rem;
    -webkit-box-orient:vertical;
    line-clamp:3;
    text-align:right;
    -webkit-line-clamp:3;
    overflow:hidden;
    text-overflow:ellipsis
}
.projectHome .slider-project .projectItem .bot{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:.5rem;
    border-top:1px solid #bbb;
    padding-top:1rem;
    margin-top:1rem
}
.projectHome .slider-project .projectItem .bot .item{
    display:flex;
    justify-content:right;
    align-items:center;
    gap:.5rem;
    font-size:.85rem;
    font-weight:300;
    color:#475569
}
.projectHome .slider-project .projectItem .bot .item i{
    display:grid;
    align-items:center
}
.projectHome .slider-project .projectItem .bot .item i svg{
    width:1rem;
    height:1rem;
    fill:#475569
}
.projectHome .slider-project .projectItem .bot .item span{
    color:#000;
    font-weight:700
}
@media screen and (max-width: 1000px){
    .projectHome .title .name{
        font-size:1.5rem
    }
    .projectHome .title a{
        padding:.3rem 1rem;
        font-size:.9rem
    }
    .projectHome .slider-blog a{
        border-radius:5px
    }
    .projectHome .slider-blog a .cover{
        padding:.5rem
    }
    .projectHome .slider-blog a .cover .options{
        gap:1rem
    }
    .projectHome .slider-blog a .cover .options .option{
        font-size:.8rem
    }
    .projectHome .slider-blog a .cover .options .option i svg{
        width:1.1rem;
        height:1.1rem
    }
    .projectHome .slider-blog a .cover .title2{
        font-size:.9rem;
        font-weight:900;
        color:#fff;
        margin-top:1rem
    }
}
.projectHome2{
    margin:auto
}
.projectHome2 .title{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:2rem
}
.projectHome2 .title .name{
    font-size:1.7rem;
    font-weight:900;
    color:#000
}
.projectHome2 .title a{
    padding:.3rem 1.5rem;
    border-radius:5px;
    font-size:1rem;
    font-weight:300;
    color:#fff;
    background:linear-gradient(to left,#007e46,#32cd32,#007e46);
    box-shadow:0 0 5px #0000004d
}
.projectHome2 .productS{
    position:relative;
    z-index:1
}
.projectHome2 .productS .slider-project2 .projectItem{
    border-radius:10px;
    border:1px solid #bbb;
    background:#fff;
    padding:2rem 1rem 1rem
}
.projectHome2 .productS .slider-project2 .projectItem .name{
    text-align:center;
    font-size:1.2rem;
    font-weight:700;
    color:#007e46;
    margin-top:.5rem
}
.projectHome2 .productS .slider-project2 .projectItem p{
    font-size:1rem;
    font-weight:300;
    margin-top:1rem;
    color:#475569;
    white-space:pre-line;
    display:-webkit-box;
    box-orient:vertical;
    height:8rem;
    -webkit-box-orient:vertical;
    line-clamp:4;
    text-align:center;
    line-height:2rem;
    -webkit-line-clamp:4;
    overflow:hidden;
    text-overflow:ellipsis
}
.projectHome2 .productS .slider-project2 .projectItem:before{
    position:absolute;
    top:1rem;
    left:50%;
    width:.7rem;
    height:.7rem;
    content:"";
    background:red;
    border-radius:50%;
    box-shadow:-.1rem -.1rem .3rem .02rem #00000080 inset;
    filter:drop-shadow(.3rem .15rem .2rem rgba(0,0,0,.5));
    transform:translateZ(0);
    z-index:2
}
.projectHome2 .productS:before{
    height:20%;
    margin:auto;
    content:"";
    position:absolute;
    top:0;
    bottom:0;
    right:0;
    left:0;
    box-shadow:0 5px 5px #0000001a;
    background:linear-gradient(to right,red 20%,#007e46,#007e46,red 80%);
    background-size:200% auto;
    animation:shine2 1.5s linear infinite
}
@keyframes shine2{
    to{
        background-position:200% center
    }
}
@media screen and (max-width: 1000px){
    .projectHome2 .title .name{
        font-size:1.5rem
    }
    .projectHome2 .title a{
        padding:.3rem 1rem;
        font-size:.9rem
    }
    .projectHome2 .productS .slider-project2 .projectItem{
        padding:1rem .5rem .5rem
    }
    .projectHome2 .productS .slider-project2 .projectItem .name{
        font-size:.9rem;
        text-overflow:ellipsis;
        white-space:nowrap;
        overflow:hidden
    }
    .projectHome2 .productS .slider-project2 .projectItem p{
        font-size:.8rem;
        height:4rem;
        line-clamp:3;
        line-height:1.3rem;
        -webkit-line-clamp:3
    }
    .projectHome2 .productS .slider-project2 .projectItem:before{
        top:.3rem
    }
}
.sampleIndex{
    margin:auto
}
.sampleIndex .title{
    font-size:1.8rem;
    font-weight:900;
    color:#000;
    margin-bottom:4rem;
    text-align:center;
    position:relative;
    z-index:1
}
.sampleIndex .title:before{
    position:absolute;
    content:"";
    margin:auto;
    right:0;
    top:calc(100% + .5rem);
    left:0;
    width:4rem;
    border-radius:5rem;
    height:5px;
    background:#007e46
}
.sampleIndex .items{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    grid-gap:1rem
}
.sampleIndex .items .item{
    background:#eee;
    border-radius:10px;
    overflow:hidden;
    transform:translateY(1rem)
}
.sampleIndex .items .item img{
    width:100%;
    height:100%
}
.sampleIndex .items .item:nth-child(2n){
    animation:sample2 4s ease infinite
}
@keyframes sample2{
    0%{
        transform:translateY(1rem)
    }
    50%{
        transform:translateY(-1rem)
    }
    to{
        transform:translateY(1rem)
    }
}
.sampleIndex .items .item:nth-child(odd){
    transform:translateY(-1rem);
    animation:sample1 4s ease infinite
}
@keyframes sample1{
    0%{
        transform:translateY(-1rem)
    }
    50%{
        transform:translateY(1rem)
    }
    to{
        transform:translateY(-1rem)
    }
}
@media screen and (max-width: 1000px){
    .sampleIndex .title{
        font-size:1rem;
        margin-bottom:2rem
    }
    .sampleIndex .title:before{
        height:4px
    }
    .sampleIndex .items{
        display:grid;
        grid-template-columns:1fr 1fr 1fr;
        grid-gap:.5rem
    }
    .sampleIndex .items .item{
        border-radius:5px
    }
    .sampleIndex .items .item:nth-child(2n){
        transform:translateY(0);
        animation:sample2 0
    }
    .sampleIndex .items .item:nth-child(odd){
        transform:translateY(0);
        animation:sample1 0
    }
}
.allChargeIndex{
    margin:1rem;
    margin-right:0
}
.allChargeIndex .success{
    background:#00800042;
    color:#006200;
    padding:1rem;
    border-radius:.3rem;
    font-size:.85rem;
    font-weight:300;
    margin-bottom:1rem
}
.allChargeIndex .error{
    color:red;
    background:#ff00001a;
    padding:1rem;
    border-radius:.3rem;
    font-size:.85rem;
    font-weight:300;
    margin-bottom:1rem
}
.allChargeIndex .chargeWidgets{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));
    grid-gap:1rem
}
.allChargeIndex .chargeWidgets .WidgetItem{
    display:grid;
    grid-template-columns:auto 1fr;
    align-items:center;
    grid-gap:1rem;
    padding:1rem;
    border-radius:10px;
    overflow:hidden;
    position:relative;
    background:#fff;
    z-index:1;
    border:1px solid #bbb
}
.allChargeIndex .chargeWidgets .WidgetItem .WidgetIcon{
    position:relative;
    display:grid;
    justify-content:center;
    align-items:center
}
.allChargeIndex .chargeWidgets .WidgetItem .WidgetIcon svg{
    width:4rem;
    height:4rem
}
.allChargeIndex .chargeWidgets .WidgetItem .WidgetSubject{
    position:relative;
    z-index:5
}
.allChargeIndex .chargeWidgets .WidgetItem .WidgetSubject h4{
    font-size:.8rem;
    color:#475569;
    font-weight:300
}
.allChargeIndex .chargeWidgets .WidgetItem .WidgetSubject h5{
    font-size:.85rem;
    color:#000;
    font-weight:700;
    margin-top:.5rem
}
.allChargeIndex .chargeWidgets .WidgetItem .WidgetSubject h5 span{
    letter-spacing:.2px
}
.allChargeIndex .chargePrice{
    background:#fff;
    margin-top:1rem;
    border:1px solid #bbb;
    border-radius:10px;
    padding:1rem;
    overflow:hidden
}
.allChargeIndex .chargePrice form{
    text-align:center
}
.allChargeIndex .chargePrice form .top .right1{
    font-size:.9rem;
    font-weight:500;
    color:#475569
}
.allChargeIndex .chargePrice form .top input{
    border:1px solid #bbb;
    padding:.3rem .5rem;
    color:#475569;
    border-radius:5px;
    font-size:1rem;
    width:15rem;
    transition:all .3s ease-in-out
}
.allChargeIndex .chargePrice form .top input:focus{
    box-shadow:0 3px 8px #0000001a;
    border:1px solid #3468cc
}
.allChargeIndex .chargePrice form p{
    margin-top:1rem;
    font-size:1rem;
    font-weight:500;
    color:red
}
.allChargeIndex .chargePrice form .gateItems{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:.5rem;
    margin:1rem 0
}
.allChargeIndex .chargePrice form .gateItems .gateItem{
    display:grid;
    justify-content:center;
    padding:.5rem;
    box-shadow:0 0 10px #0000001a;
    border-radius:10px;
    cursor:pointer;
    border:2px solid #bbb;
    filter:grayscale(1);
    transition:all .3s ease-in-out
}
.allChargeIndex .chargePrice form .gateItems .gateItem img{
    height:3.5rem;
    width:3.5rem;
    object-fit:contain
}
.allChargeIndex .chargePrice form .gateItems .gateItem:hover{
    filter:grayscale(0)
}
.allChargeIndex .chargePrice form .gateItems .active{
    border:2px solid #007E46;
    filter:grayscale(0)
}
.allChargeIndex .chargePrice form button{
    font-size:.9rem;
    font-weight:300;
    color:#fff;
    background:#007e46;
    padding:.3rem 1rem;
    border-radius:5px;
    cursor:pointer;
    height:2.2rem
}
.allChargeIndex table{
    margin-top:1rem;
    background:#fff;
    border-radius:10px;
    width:100%;
    border:1px solid #bbb
}
.allChargeIndex table tr{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(1px,1fr));
    align-items:center;
    grid-gap:1rem;
    padding:1rem
}
.allChargeIndex table tr th{
    font-weight:700;
    color:#475569;
    font-size:.85rem;
    text-align:center;
    text-overflow:ellipsis;
    white-space:nowrap;
    overflow:hidden;
    display:grid;
    align-items:center;
    justify-content:center
}
.allChargeIndex table tr td{
    font-weight:300;
    font-size:.85rem;
    text-align:center;
    color:#475569
}
.allChargeIndex table tr td .active{
    background:green;
    padding:.3rem .5rem;
    font-size:.8rem;
    font-weight:300;
    color:#fff!important;
    border-radius:5px
}
.allChargeIndex table tr td .unActive{
    background:red;
    padding:.3rem .5rem;
    font-size:.8rem;
    font-weight:300;
    color:#fff!important;
    border-radius:5px
}
.allChargeIndex table tr:nth-child(2n){
    background:#eee
}
@media screen and (max-width: 1000px){
    .allChargeIndex{
        margin:.5rem
    }
    .allChargeIndex .chargeWidgets{
        grid-template-columns:1fr 1fr;
        grid-gap:.5rem
    }
    .allChargeIndex .chargeWidgets .WidgetItem{
        display:block;
        padding:.5rem
    }
    .allChargeIndex .chargeWidgets .WidgetItem .WidgetIcon{
        display:none
    }
    .allChargeIndex .chargeWidgets .WidgetItem .WidgetSubject h4{
        font-size:.75rem
    }
    .allChargeIndex .chargeWidgets .WidgetItem .WidgetSubject h5{
        font-size:.8rem
    }
    .allChargeIndex .chargePrice{
        padding:.5rem
    }
    .allChargeIndex .chargePrice form .top .right1{
        font-size:.8rem
    }
    .allChargeIndex .chargePrice form .top input{
        font-size:.8rem;
        width:100%
    }
    .allChargeIndex .chargePrice form .gateItems .gateItem img{
        height:2rem;
        width:2rem
    }
    .allChargeIndex .allTables{
        overflow-x:scroll
    }
    .allChargeIndex .allTables table{
        clear:both;
        margin-top:6px!important;
        margin-bottom:6px!important;
        max-width:none!important;
        border-collapse:separate!important;
        width:100%
    }
    .allChargeIndex .allTables table tbody{
        background:#fff
    }
    .allChargeIndex .allTables table tr{
        display:flex
    }
    .allChargeIndex .allTables table tr td,.allChargeIndex .allTables table tr th,.allChargeIndex .allTables table tr .buttons{
        min-width:6rem
    }
}
.allPayPanel .topProductIndex{
    display:grid;
    grid-template-columns:1fr auto;
    background:#fff;
    border-radius:.3rem;
    padding:1rem
}
.allPayPanel .topProductIndex .right{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(2px,auto));
    justify-content:right;
    align-items:center;
    grid-gap:.5rem
}
.allPayPanel .topProductIndex .right span,.allPayPanel .topProductIndex .right a{
    color:#475569;
    font-weight:400;
    font-size:.95rem
}
.allPayPanel .topProductIndex .right a:last-child{
    color:#3468cc
}
.allPayPanel .topProductIndex .groupEdits{
    position:fixed;
    bottom:1rem;
    left:1rem;
    background:red;
    box-shadow:0 2px 4px #a3afbd80;
    padding:.6rem 1rem;
    transition:all .3s ease-in-out;
    border-radius:.3rem;
    color:#fff;
    cursor:pointer
}
.allPayPanel .topProductIndex .filterItems{
    position:relative
}
.allPayPanel .topProductIndex .filterItems .filterTitle{
    display:grid;
    cursor:pointer;
    grid-template-columns:auto auto;
    justify-content:center;
    grid-gap:.5rem;
    align-items:center;
    background-color:#a3afbd;
    box-shadow:0 2px 4px #a3afbd80;
    padding:.6rem 1rem;
    transition:all .3s ease-in-out;
    border-radius:.3rem;
    color:#fff
}
.allPayPanel .topProductIndex .filterItems .filterTitle svg{
    width:1rem;
    height:1rem;
    fill:#fff
}
.allPayPanel .topProductIndex .filterItems .filterTitle:hover{
    background:#394c62;
    box-shadow:0 4px 12px #a3afbd99!important
}
.allPayPanel .topProductIndex .filterItems .filterContent{
    position:absolute;
    top:120%;
    left:0;
    box-shadow:0 5px 25px #0003;
    background:#fff;
    border-radius:.2rem;
    padding:.5rem;
    display:none;
    grid-gap:1rem;
    width:20rem;
    z-index:100
}
.allPayPanel .topProductIndex .filterItems .filterContent:before{
    content:"";
    position:absolute;
    top:-10px;
    left:8px;
    border-style:solid;
    border-width:0 10px 10px 10px;
    border-color:transparent transparent #fff transparent
}
.allPayPanel .topProductIndex .filterItems .filterContent .filterContentItem{
    display:grid;
    grid-gap:.5rem
}
.allPayPanel .topProductIndex .filterItems .filterContent .filterContentItem label{
    color:#475569;
    font-weight:300;
    font-size:.7rem
}
.allPayPanel .topProductIndex .filterItems .filterContent .filterContentItem input{
    border:1px solid #bbb;
    padding:.4rem .5rem;
    color:#475569;
    border-radius:.3rem;
    font-size:.7rem;
    width:100%;
    transition:all .3s ease-in-out;
    outline:transparent
}
.allPayPanel .topProductIndex .filterItems .filterContent .filterContentItem input:focus{
    box-shadow:0 3px 8px #0000001a;
    border:1px solid #3468cc
}
.allPayPanel .topProductIndex .filterItems .filterContent button{
    background:#007e46;
    color:#fff;
    box-shadow:0 0 10px #0000000d;
    padding:.3rem;
    text-align:center;
    border-radius:5px
}
.allPayPanel .alert{
    background:#00800042;
    color:#006200;
    padding:1rem;
    border-radius:.3rem;
    font-size:.85rem;
    font-weight:300;
    margin-top:1rem
}
.allPayPanel .allTableContainer{
    background:#fff;
    margin:1rem 0;
    border-radius:10px
}
.allPayPanel .allTableContainer .titlePin{
    font-size:1.1rem;
    font-weight:700;
    color:red;
    padding:1rem
}
.allPayPanel .allTableContainer .postItem{
    padding:1rem;
    border-bottom:1px solid #bbb;
    cursor:pointer
}
.allPayPanel .allTableContainer .postItem .postTop{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center
}
.allPayPanel .allTableContainer .postItem .postTop .postTitle{
    display:grid;
    grid-template-columns:auto 1fr;
    grid-gap:1rem;
    align-items:center
}
.allPayPanel .allTableContainer .postItem .postTop .postTitle .postImages{
    display:grid;
    grid-template-columns:auto auto auto auto;
    justify-content:right;
    align-items:center
}
.allPayPanel .allTableContainer .postItem .postTop .postTitle .postImages .postImage img{
    width:100%;
    height:5rem;
    object-fit:contain
}
.allPayPanel .allTableContainer .postItem .postTop .postTitle .postImages .postMore{
    display:grid;
    justify-content:center;
    align-items:center;
    border:1px solid #bbb;
    border-radius:5px
}
.allPayPanel .allTableContainer .postItem .postTop .postTitle .postImages .postMore i{
    display:grid;
    justify-content:center;
    align-items:center;
    height:5rem;
    width:5rem
}
.allPayPanel .allTableContainer .postItem .postTop .postTitle .postImages .postMore i svg{
    width:2.5rem;
    height:2.5rem;
    fill:#475569;
    opacity:.7
}
.allPayPanel .allTableContainer .postItem .postTop .postTitle ul{
    display:flex;
    flex-wrap:wrap;
    justify-content:right;
    align-items:center;
    grid-gap:1rem
}
.allPayPanel .allTableContainer .postItem .postTop .postTitle ul li{
    font-size:.9rem;
    font-weight:300;
    color:#475569;
    opacity:.7
}
.allPayPanel .allTableContainer .postItem .postTop .postTitle ul li span:last-child{
    color:#000
}
.allPayPanel .allTableContainer .postItem .postTop .postOptions{
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-gap:.5rem;
    align-items:center
}
.allPayPanel .allTableContainer .postItem .postTop .postOptions a,.allPayPanel .allTableContainer .postItem .postTop .postOptions i{
    display:grid;
    align-items:center;
    justify-content:center;
    padding:.5rem;
    background:#f5f5f5;
    border-radius:5px;
    cursor:pointer
}
.allPayPanel .allTableContainer .postItem .postTop .postOptions a svg,.allPayPanel .allTableContainer .postItem .postTop .postOptions i svg{
    width:1.2rem;
    height:1.2rem;
    fill:#606265
}
.allPayPanel .allTableContainer .postItem .postBot{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
    grid-gap:.5rem;
    margin-top:.5rem;
    background:#dcdcdc;
    border-radius:5px;
    padding:1rem
}
.allPayPanel .allTableContainer .postItem .postBot ul{
    display:flex;
    flex-wrap:wrap;
    justify-content:right;
    grid-gap:2rem;
    align-items:center
}
.allPayPanel .allTableContainer .postItem .postBot ul li{
    display:grid;
    grid-template-columns:auto auto;
    justify-content:right;
    align-items:center;
    grid-gap:.5rem
}
.allPayPanel .allTableContainer .postItem .postBot ul li span{
    font-size:.8rem;
    font-weight:300;
    color:#606265
}
.allPayPanel .allTableContainer .postItem .postBot ul li span:last-child{
    color:#000c
}
.allPayPanel .allTableContainer .postItem .postBot ul li .status100{
    padding:.1rem .5rem;
    background:green;
    color:#fff!important;
    border-radius:5px
}
.allPayPanel .allTableContainer .postItem .postBot ul li .status0{
    padding:.1rem .5rem;
    background:red;
    color:#fff!important;
    border-radius:5px
}
.allPayPanel .allTableContainer .postItem .postBot ul li .status1{
    padding:.1rem .5rem;
    background:#000;
    color:#fff!important;
    border-radius:5px
}
.allPayPanel .allTableContainer .postItem .postBot ul li .status20{
    padding:.1rem .5rem;
    background:#03f;
    color:#fff!important;
    border-radius:5px
}
.allPayPanel .allTableContainer .postItem .postBot ul li .status50{
    padding:.1rem .5rem;
    background:purple;
    color:#fff!important;
    border-radius:5px
}
.allPayPanel .allTableContainer .postItem .postBot .checks1{
    display:grid;
    align-items:center
}
.allPayPanel .allTableContainer .postItem .postBot .checks1 svg{
    width:1.5rem;
    height:1.5rem;
    fill:#475569
}
@media screen and (max-width: 700px){
    .allPayPanel .allTableContainer .postItem .postTop{
        grid-template-columns:1fr!important
    }
    .allPayPanel .allTableContainer .postItem .postTop .postTitle{
        grid-template-columns:1fr
    }
}
.allPayPanel .allTableContainer .postItem:last-child{
    border-bottom:0
}
.allPayPanel .allTableContainer .checked{
    background:#f0efef
}
.allPayPanel .allStatistics{
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-gap:1rem;
    margin-top:1rem
}
.allPayPanel .allStatistics .right,.allPayPanel .allStatistics .left{
    background:#fff;
    border:1px solid #bbb;
    border-radius:5px
}
.allPayPanel .allStatistics .right h3,.allPayPanel .allStatistics .left h3{
    font-size:1rem;
    font-weight:700;
    color:#3468cc;
    text-align:center;
    padding:1rem
}
.allPayPanel .allStatistics .right .item,.allPayPanel .allStatistics .left .item{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:1rem;
    padding:1rem
}
.allPayPanel .allStatistics .right .item h4,.allPayPanel .allStatistics .left .item h4{
    font-size:.9rem;
    font-weight:500;
    color:#475569
}
.allPayPanel .allStatistics .right .item h5,.allPayPanel .allStatistics .left .item h5{
    font-size:.9rem;
    font-weight:300;
    color:#3468cc
}
.allPayPanel .allStatistics .right .item:nth-child(2) h5,.allPayPanel .allStatistics .left .item:nth-child(2) h5{
    font-size:1.1rem;
    font-weight:500
}
.allPayPanel .allStatistics .right .item:nth-child(2n),.allPayPanel .allStatistics .left .item:nth-child(2n){
    background:#f5f5f5
}
.allPayPanel .allStatistics .left h3,.allPayPanel .allStatistics .left .item h5{
    color:red
}
@media screen and (max-width: 800px){
    .allPayPanel .allStatistics{
        display:block
    }
    .allPayPanel .allStatistics .left{
        margin-top:1rem
    }
}
.allPayPanel .allReturnedPay{
    margin:1rem 0;
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));
    grid-gap:1rem;
    align-items:center
}
.allPayPanel .allReturnedPay .postItem{
    background:#fff;
    position:relative;
    border-radius:10px;
    overflow:hidden;
    box-shadow:0 7px 7px #0000001a
}
.allPayPanel .allReturnedPay .postItem .pic{
    display:grid;
    justify-content:center;
    margin-top:1rem
}
.allPayPanel .allReturnedPay .postItem .pic img{
    height:6rem;
    object-fit:contain
}
.allPayPanel .allReturnedPay .postItem h3{
    text-align:center;
    font-weight:300;
    font-size:.9rem;
    color:#475569;
    padding:.5rem;
    text-overflow:ellipsis;
    white-space:nowrap;
    overflow:hidden
}
.allPayPanel .allReturnedPay .postItem h5{
    display:grid;
    grid-template-columns:auto 1fr;
    align-items:center;
    font-weight:300;
    font-size:.8rem;
    color:#000;
    padding:.5rem
}
.allPayPanel .allReturnedPay .postItem h5:nth-child(odd){
    background:#f5f5f5
}
.allPayPanel .allReturnedPay .postItem h5 a{
    direction:ltr;
    text-align:left;
    overflow:hidden;
    display:-webkit-box;
    -webkit-line-clamp:3;
    -webkit-box-orient:vertical;
    text-overflow:ellipsis
}
.allPayPanel .allReturnedPay .postItem h5 span{
    text-align:left
}
.allPayPanel .allReturnedPay .postItem .show{
    display:grid;
    text-align:center;
    margin:.5rem;
    background:#3468cc;
    border-radius:5px;
    color:#fff;
    padding:.5rem
}
.allPayPanel .allReturnedPay .postItem .showPays{
    display:none;
    position:absolute;
    top:0;
    right:0;
    left:0;
    bottom:0;
    z-index:1;
    background:#fff
}
.allPayPanel .allReturnedPay .postItem .showPays h4{
    text-align:center;
    font-size:1rem;
    font-weight:500;
    color:#475569;
    padding:.5rem
}
.allPayPanel .allReturnedPay .postItem .showPays .payItem{
    display:flex;
    justify-content:space-between;
    padding:.5rem
}
.allPayPanel .allReturnedPay .postItem .showPays .payItem h6{
    font-size:.7rem;
    font-weight:300;
    color:#475569
}
.allPayPanel .allReturnedPay .postItem .showPays .payItem .payItemData{
    display:flex;
    justify-content:left;
    font-size:.7rem;
    font-weight:300;
    color:#00f;
    gap:.5rem
}
.allPayPanel .allReturnedPay .postItem .showPays .payItem .payItemData span{
    padding:.1rem;
    border-radius:5px;
    font-size:.6rem;
    font-weight:300;
    color:#fff;
    background:#007e46
}
.allPayPanel .allReturnedPay .postItem .showPays .payItem:nth-child(odd){
    background:#f5f5f5
}
.allPayPanel .allReturnedPay .postItem:hover .showPays{
    display:block
}
.allPayPanel .popUp{
    background:#00000080;
    z-index:4000;
    position:fixed;
    top:0;
    right:0;
    width:100%;
    height:100%;
    display:grid;
    grid-template-columns:1fr;
    justify-content:center
}
.allPayPanel .popUp .popUpItem{
    width:40%;
    margin:auto;
    background:#fff;
    border-radius:.4rem;
    position:relative;
    padding:1rem
}
.allPayPanel .popUp .popUpItem .title{
    font-size:1.2rem;
    font-weight:500;
    color:#475569;
    text-align:center
}
.allPayPanel .popUp .popUpItem p{
    margin-top:.5rem;
    font-size:1rem;
    font-weight:300;
    color:#475569;
    text-align:center
}
.allPayPanel .popUp .popUpItem .buttonsPop{
    display:grid;
    grid-template-columns:auto auto;
    justify-content:center;
    align-items:center;
    grid-gap:1rem;
    margin-top:2rem
}
.allPayPanel .popUp .popUpItem .buttonsPop button{
    font-size:.9rem;
    padding:.3rem 1rem;
    border-radius:5px;
    background:green;
    color:#fff
}
.allPayPanel .popUp .popUpItem .buttonsPop button:nth-child(2){
    background:red
}
.allShowPay,.showOrder{
    background:#fff;
    box-shadow:0 0 5px #0000000d;
    border-radius:10px;
    padding:1rem;
    margin:1rem;
    margin-right:0
}
.allShowPay .topShowPay .title,.showOrder .topShowPay .title{
    display:flex;
    justify-content:right;
    flex-wrap:wrap;
    align-items:center;
    grid-gap:1rem;
    border-bottom:1px solid #bbb;
    padding-bottom:1rem
}
.allShowPay .topShowPay .title h2,.showOrder .topShowPay .title h2{
    font-size:1.2rem;
    color:#475569;
    font-weight:700
}
.allShowPay .topShowPay .title span,.showOrder .topShowPay .title span{
    font-size:.9rem;
    font-weight:300;
    color:#475569;
    opacity:.7;
    background:#f5f5f5;
    padding:.2rem 1rem;
    border-radius:5px
}
.allShowPay .topShowPay .title button,.showOrder .topShowPay .title button{
    display:grid;
    grid-template-columns:auto auto;
    justify-content:right;
    align-items:center;
    grid-gap:.5rem;
    font-size:.8rem;
    color:#fff;
    background:#007e46;
    font-weight:500;
    padding:.3rem 1rem;
    border-radius:5px
}
.allShowPay .topShowPay .title button svg,.showOrder .topShowPay .title button svg{
    fill:#fff;
    width:1rem;
    height:1rem
}
@media screen and (max-width: 500px){
    .allShowPay .topShowPay .title h2,.showOrder .topShowPay .title h2{
        font-size:1rem
    }
    .allShowPay .topShowPay .title span,.showOrder .topShowPay .title span{
        font-size:.7rem
    }
}
.allShowPay .topShowPay .detail .items,.showOrder .topShowPay .detail .items{
    display:flex;
    justify-content:right;
    flex-wrap:wrap;
    align-items:center;
    grid-gap:1.5rem;
    margin-top:1rem
}
.allShowPay .topShowPay .detail .items .item,.showOrder .topShowPay .detail .items .item{
    display:flex;
    justify-content:right;
    align-items:center;
    gap:.5rem
}
.allShowPay .topShowPay .detail .items .item h5,.showOrder .topShowPay .detail .items .item h5{
    font-size:.9rem;
    font-weight:300;
    color:#475569;
    opacity:.7
}
.allShowPay .topShowPay .detail .items .item div,.showOrder .topShowPay .detail .items .item div{
    font-size:.9rem;
    font-weight:300;
    color:#475569
}
.allShowPay .topShowPay .detail .items .item input,.allShowPay .topShowPay .detail .items .item select,.showOrder .topShowPay .detail .items .item input,.showOrder .topShowPay .detail .items .item select{
    font-size:.9rem;
    font-weight:300;
    color:#000;
    padding:.3rem .5rem;
    background:#f5f5f5;
    border:1px solid #bbb;
    border-radius:5px
}
.allShowPay .topShowPay .detail .items .item .active,.showOrder .topShowPay .detail .items .item .active{
    display:grid;
    grid-template-columns:auto auto;
    justify-content:right;
    align-items:center;
    grid-gap:.5rem;
    font-size:.9rem
}
.allShowPay .topShowPay .detail .items .item .active:before,.showOrder .topShowPay .detail .items .item .active:before{
    width:10px;
    height:10px;
    content:"";
    background:#32cd32;
    border-radius:5rem
}
.allShowPay .topShowPay .detail .items .item .unActive,.showOrder .topShowPay .detail .items .item .unActive{
    display:grid;
    grid-template-columns:auto auto;
    justify-content:right;
    align-items:center;
    grid-gap:.5rem;
    font-size:.9rem
}
.allShowPay .topShowPay .detail .items .item .unActive:before,.showOrder .topShowPay .detail .items .item .unActive:before{
    width:10px;
    height:10px;
    content:"";
    background:red;
    border-radius:5rem
}
@media screen and (max-width: 700px){
    .allShowPay .topShowPay .detail .items,.showOrder .topShowPay .detail .items{
        grid-template-columns:1fr
    }
}
.allShowPay .topShowPay .detail .topDetail,.showOrder .topShowPay .detail .topDetail{
    border-bottom:1px solid #bbb;
    padding-bottom:1rem;
    margin-bottom:1rem
}
.allShowPay .topShowPay .detail .botDetail,.showOrder .topShowPay .detail .botDetail{
    border-bottom:1px solid #bbb;
    padding-bottom:1rem
}
.allShowPay .topShowPay .trackPay,.showOrder .topShowPay .trackPay{
    border-bottom:1px solid #bbb;
    padding:1rem 0;
    display:grid;
    grid-template-columns:1fr;
    grid-gap:.5rem
}
.allShowPay .topShowPay .trackPay span,.showOrder .topShowPay .trackPay span{
    font-size:.9rem;
    font-weight:300;
    color:#475569;
    opacity:.7
}
.allShowPay .topShowPay .trackPay p,.allShowPay .topShowPay .trackPay textarea,.showOrder .topShowPay .trackPay p,.showOrder .topShowPay .trackPay textarea{
    border-radius:5px;
    background:#f5f5f5;
    font-size:.9rem;
    font-weight:300;
    color:#000;
    padding:.5rem
}
.allShowPay .topShowPay .trackPay textarea,.showOrder .topShowPay .trackPay textarea{
    resize:vertical
}
.allShowPay .topShowPay .trackPay label,.allShowPay .topShowPay .trackPay h4,.showOrder .topShowPay .trackPay label,.showOrder .topShowPay .trackPay h4{
    font-size:.9rem;
    font-weight:500;
    color:#475569
}
.allShowPay .note,.showOrder .note{
    padding:1rem;
    background:#ff00001a;
    border-radius:10px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-top:1rem
}
.allShowPay .note span,.showOrder .note span{
    font-size:1rem;
    font-weight:300;
    color:#000;
    display:grid
}
.allShowPay .note p,.showOrder .note p{
    font-size:.9rem;
    font-weight:300;
    color:red;
    text-align:left
}
.allShowPay .allShowPayContainer,.showOrder .allShowPayContainer{
    margin-top:1rem
}
.allShowPay .allShowPayContainer .items,.showOrder .allShowPayContainer .items{
    background:#f5f5f5;
    padding:1rem;
    border-radius:10px
}
.allShowPay .allShowPayContainer .items .title,.showOrder .allShowPayContainer .items .title{
    font-size:1.2rem;
    font-weight:700;
    color:#475569;
    margin-bottom:1rem
}
.allShowPay .allShowPayContainer .items .item,.showOrder .allShowPayContainer .items .item{
    padding:1rem;
    display:grid;
    grid-template-columns:auto 1fr;
    align-items:center;
    border-radius:10px;
    box-shadow:0 0 5px #bbb;
    background:#fff;
    margin-bottom:1rem;
    grid-gap:1rem;
    position:relative
}
.allShowPay .allShowPayContainer .items .item .cartDetailPic img,.showOrder .allShowPayContainer .items .item .cartDetailPic img{
    width:100%;
    max-width:10rem;
    height:8rem;
    object-fit:cover
}
.allShowPay .allShowPayContainer .items .item .cartDetailInfo .topCart,.showOrder .allShowPayContainer .items .item .cartDetailInfo .topCart{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:.5rem
}
.allShowPay .allShowPayContainer .items .item .cartDetailInfo .topCart .cancel,.showOrder .allShowPayContainer .items .item .cartDetailInfo .topCart .cancel{
    font-size:.7rem;
    color:#fff;
    font-weight:500;
    text-align:center;
    padding:.5rem;
    background:red;
    border-radius:5px;
    cursor:pointer
}
.allShowPay .allShowPayContainer .items .item .cartDetailInfo .topCart .cancel i,.showOrder .allShowPayContainer .items .item .cartDetailInfo .topCart .cancel i{
    display:grid;
    align-items:center;
    justify-content:center
}
.allShowPay .allShowPayContainer .items .item .cartDetailInfo .topCart .cancel i svg,.showOrder .allShowPayContainer .items .item .cartDetailInfo .topCart .cancel i svg{
    fill:#fff;
    width:1rem;
    height:1rem
}
.allShowPay .allShowPayContainer .items .item .cartDetailInfo .cartDetailInfoItem,.showOrder .allShowPayContainer .items .item .cartDetailInfo .cartDetailInfoItem{
    margin-top:1rem;
    display:flex;
    flex-wrap:wrap;
    grid-gap:.5rem;
    align-items:center
}
.allShowPay .allShowPayContainer .items .item .cartDetailInfo .cartDetailInfoItem span,.showOrder .allShowPayContainer .items .item .cartDetailInfo .cartDetailInfoItem span{
    color:#475569;
    font-size:.9rem;
    font-weight:500
}
.allShowPay .allShowPayContainer .items .item .cartDetailInfo .cartDetailInfoItem span:first-child,.showOrder .allShowPayContainer .items .item .cartDetailInfo .cartDetailInfoItem span:first-child{
    opacity:.7
}
.allShowPay .allShowPayContainer .items .item .cartDetailInfo .cartDetailInfoItem input,.allShowPay .allShowPayContainer .items .item .cartDetailInfo .cartDetailInfoItem select,.showOrder .allShowPayContainer .items .item .cartDetailInfo .cartDetailInfoItem input,.showOrder .allShowPayContainer .items .item .cartDetailInfo .cartDetailInfoItem select{
    font-size:.9rem;
    font-weight:300;
    color:#000;
    padding:.3rem .5rem;
    background:#f5f5f5;
    border:1px solid #bbb;
    border-radius:5px
}
.allShowPay .allShowPayContainer .items .item .cartDetailInfo .cartDetailInfoItem .check,.showOrder .allShowPayContainer .items .item .cartDetailInfo .cartDetailInfoItem .check{
    background:#00f;
    color:#fff;
    padding:.3rem 1rem;
    border-radius:5rem;
    font-size:.9rem;
    font-weight:300
}
.allShowPay .allShowPayContainer .items .item .cartDetailInfo .cartDetailInfoItem .active,.showOrder .allShowPayContainer .items .item .cartDetailInfo .cartDetailInfoItem .active{
    background:green;
    color:#fff;
    padding:.3rem 1rem;
    border-radius:5rem;
    font-size:.9rem;
    font-weight:300
}
.allShowPay .allShowPayContainer .items .item .cartDetailInfo .cartDetailInfoItem .unActive,.showOrder .allShowPayContainer .items .item .cartDetailInfo .cartDetailInfoItem .unActive{
    background:red;
    color:#fff;
    padding:.3rem 1rem;
    border-radius:5rem;
    font-size:.9rem;
    font-weight:300
}
.allShowPay .allShowPayContainer .items .item .cartDetailInfo .cartDetailInfoItem i,.showOrder .allShowPayContainer .items .item .cartDetailInfo .cartDetailInfoItem i{
    display:grid;
    justify-content:center;
    align-items:center
}
.allShowPay .allShowPayContainer .items .item .cartDetailInfo .cartDetailInfoItem i svg,.showOrder .allShowPayContainer .items .item .cartDetailInfo .cartDetailInfoItem i svg{
    fill:#475569;
    width:1.1rem;
    height:1.1rem;
    opacity:.7
}
.allShowPay .allShowPayContainer .items .item .cartDetailInfo .cartDetailInfoItem:first-child,.showOrder .allShowPayContainer .items .item .cartDetailInfo .cartDetailInfoItem:first-child{
    display:block;
    margin-top:0
}
.allShowPay .allShowPayContainer .items .item .cartDetailInfo .cartCount,.showOrder .allShowPayContainer .items .item .cartDetailInfo .cartCount{
    display:grid;
    grid-template-columns:auto auto auto;
    justify-content:left;
    align-items:center;
    grid-gap:.5rem;
    color:#475569
}
.allShowPay .allShowPayContainer .items .item .cartDetailInfo .cartCount button,.showOrder .allShowPayContainer .items .item .cartDetailInfo .cartCount button{
    display:grid;
    justify-content:center;
    align-items:center;
    background:red;
    height:1.3rem;
    padding:0 1rem;
    border-top-left-radius:.2rem;
    border-bottom-left-radius:.2rem;
    font-size:.8rem;
    color:#fff
}
.allShowPay .allShowPayContainer .items .item .cartDetailInfo .cartCount button:first-child,.showOrder .allShowPayContainer .items .item .cartDetailInfo .cartCount button:first-child{
    font-size:.8rem;
    border-top-left-radius:0;
    border-bottom-left-radius:0;
    border-top-right-radius:.2rem;
    border-bottom-right-radius:.2rem
}
.allShowPay .allShowPayContainer .items .item:last-child,.showOrder .allShowPayContainer .items .item:last-child{
    margin-bottom:0
}
.allShowPay .allShowPayContainer .items .save,.showOrder .allShowPayContainer .items .save{
    position:fixed;
    bottom:1rem;
    left:1rem
}
.allShowPay .allShowPayContainer .items .save span,.showOrder .allShowPayContainer .items .save span{
    background:green;
    padding:.3rem 1rem;
    border-radius:5px;
    color:#fff;
    font-size:1rem;
    font-weight:300;
    cursor:pointer
}
@media screen and (max-width: 500px){
    .allShowPay .allShowPayContainer .items .item,.showOrder .allShowPayContainer .items .item{
        grid-template-columns:1fr
    }
    .allShowPay .allShowPayContainer .items .item .cartDetailPic,.showOrder .allShowPayContainer .items .item .cartDetailPic{
        display:grid;
        justify-content:center
    }
}
.allBecomeSeller{
    padding-left:1rem;
    width:100%
}
.allBecomeSeller .allBecomeUserInfo{
    border-radius:10px;
    background:#fff;
    box-shadow:0 0 20px #0000000d;
    padding:1rem;
    margin-top:1rem
}
.allBecomeSeller .allBecomeUserInfo .allBecomeTip{
    background:#ff00001a;
    border:1px solid red;
    padding:0 .5rem;
    border-radius:10px;
    display:grid;
    grid-template-columns:auto auto;
    justify-content:right;
    align-items:center;
    grid-gap:.5rem;
    height:3rem
}
.allBecomeSeller .allBecomeUserInfo .allBecomeTip i svg{
    fill:red;
    width:1.2rem;
    height:1.2rem;
    animation:arrow-anim 1s ease infinite;
    margin-bottom:0
}
@keyframes arrow-anim{
    0%{
        margin-bottom:0
    }
    10%{
        margin-bottom:.5rem
    }
    30%{
        transform:rotate(-40deg)
    }
    50%{
        transform:rotate(40deg)
    }
    60%{
        transform:rotate(-40deg)
    }
    70%{
        transform:rotate(-20deg)
    }
    80%{
        transform:rotate(0);
        margin-bottom:1rem
    }
    to{
        margin-bottom:.5rem
    }
}
.allBecomeSeller .allBecomeUserInfo .allBecomeTip span{
    font-size:.85rem;
    font-weight:500;
    color:red;
    height:3rem;
    display:grid;
    align-items:center
}
.allBecomeSeller .allBecomeUserInfo .allBecomeTip p{
    font-size:.85rem;
    font-weight:500;
    color:#475569;
    height:3rem;
    display:grid;
    align-items:center
}
.allBecomeSeller .allBecomeUserInfo .sellerType{
    margin-top:3rem
}
.allBecomeSeller .allBecomeUserInfo .sellerType h3{
    font-size:1rem;
    font-weight:700;
    color:#475569
}
.allBecomeSeller .allBecomeUserInfo .sellerType select{
    padding:.5rem;
    border:1.4px solid #bbb;
    border-radius:.2rem;
    width:100%;
    background:#fff;
    transition:all .3s ease-in-out;
    font-size:.85rem;
    font-weight:300;
    margin:1rem 0;
    height:2.8rem
}
.allBecomeSeller .allBecomeUserInfo .sellerType select:focus{
    border:1.4px solid #007E46
}
.allBecomeSeller .allBecomeUserInfo .sellerType p{
    font-size:.75rem;
    font-weight:300;
    color:#475569
}
.allBecomeSeller .allBecomeUserInfo .personInfoItems{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(20rem,1fr));
    grid-gap:1rem;
    margin-top:1rem
}
.allBecomeSeller .allBecomeUserInfo .personInfoItems .personInfoItem h4{
    font-size:.9rem;
    font-weight:300;
    color:#475569;
    margin-bottom:.5rem
}
.allBecomeSeller .allBecomeUserInfo .personInfoItems .personInfoItem input,.allBecomeSeller .allBecomeUserInfo .personInfoItems .personInfoItem select,.allBecomeSeller .allBecomeUserInfo .personInfoItems .personInfoItem .body{
    background:#fff;
    padding:.5rem;
    border:1.4px solid #bbb;
    border-radius:.2rem;
    width:100%;
    transition:all .3s ease-in-out;
    font-size:.85rem;
    font-weight:300;
    height:2.8rem
}
.allBecomeSeller .allBecomeUserInfo .personInfoItems .personInfoItem input:focus,.allBecomeSeller .allBecomeUserInfo .personInfoItems .personInfoItem select:focus,.allBecomeSeller .allBecomeUserInfo .personInfoItems .personInfoItem .body:focus{
    border:1.4px solid #007E46
}
@media screen and (max-width: 700px){
    .allBecomeSeller .allBecomeUserInfo .personInfoItems{
        grid-template-columns:1fr
    }
}
.allBecomeSeller .allBecomeUserInfo .personInfoSeller{
    margin-top:3rem
}
.allBecomeSeller .allBecomeUserInfo .personInfoSeller h3{
    font-size:1.3rem;
    font-weight:500;
    color:#475569;
    letter-spacing:.5px
}
.allBecomeSeller .allBecomeUserInfo .personInfoSeller .personInfoItems:nth-last-child(1):nth-last-child(1) input{
    border-top-right-radius:0;
    border-bottom-right-radius:0
}
.allBecomeSeller .allBecomeUserInfo .contactSeller{
    margin-top:3rem
}
.allBecomeSeller .allBecomeUserInfo .contactSeller h3{
    font-size:1.3rem;
    font-weight:500;
    color:#475569;
    letter-spacing:.5px
}
.allBecomeSeller .buttons{
    display:grid;
    justify-content:left;
    margin-top:1rem
}
.allBecomeSeller .buttons button{
    font-size:.85rem;
    font-weight:300;
    color:#fff;
    background:#007e46;
    padding:.3rem 1rem;
    border-radius:5px;
    display:grid;
    align-items:center;
    justify-content:center;
    width:8rem;
    height:2.2rem
}
.allBecomeSeller .buttons button .loading{
    fill:#fff;
    width:1.2rem;
    height:1.2rem;
    animation:arrow-anim2 .5s ease infinite
}
@keyframes arrow-anim2{
    0%{
        transform:rotate(0)
    }
    15%{
        transform:rotate(45deg)
    }
    25%{
        transform:rotate(90deg)
    }
    50%{
        transform:rotate(180deg)
    }
    75%{
        transform:rotate(270deg)
    }
    85%{
        transform:rotate(300deg)
    }
    to{
        transform:rotate(360deg)
    }
}
.allBecomeSeller .success{
    background:#00ff001a;
    color:green;
    padding:1rem;
    border-radius:.3rem;
    font-size:.9rem;
    font-weight:300;
    letter-spacing:.3px;
    margin:1rem 0
}
.allBecomeSeller .uploadDocument{
    border-radius:10px;
    box-shadow:0 0 10px #0000000d;
    padding:1rem;
    background:#fff;
    margin-top:1rem
}
.allBecomeSeller .uploadDocument h3{
    font-size:1.3rem;
    font-weight:700;
    color:#475569
}
.allBecomeSeller .uploadDocument ul{
    margin-top:1rem
}
.allBecomeSeller .uploadDocument ul li{
    font-size:.85rem;
    font-weight:300;
    color:#475569;
    position:relative;
    margin-bottom:1rem;
    display:grid;
    grid-template-columns:auto auto;
    justify-content:right;
    align-items:center;
    grid-gap:.3rem
}
.allBecomeSeller .uploadDocument ul li:before{
    content:"";
    width:8px;
    height:8px;
    background:#007e46;
    border-radius:5rem
}
.allBecomeSeller .uploadDocument .sendFileItem{
    background:#fff;
    margin:1rem;
    border-radius:10px;
    overflow:hidden;
    display:grid;
    grid-template-columns:1fr;
    justify-content:center;
    box-shadow:0 0 10px #0000000d
}
.allBecomeSeller .uploadDocument .sendFileItem .dropify-wrapper{
    border:1px solid #eee!important
}
.allBecomeSeller .uploadDocument .sendFileItem .dropify-wrapper .file-icon:before{
    opacity:0!important;
    position:absolute!important;
    top:0!important;
    visibility:hidden!important
}
.allBecomeSeller .uploadDocument .sendFileItem .dropify-wrapper .dropify-message p{
    margin:0;
    font-size:1.3rem;
    font-family:irsans;
    color:#00800082
}
.allBecomeSeller .checkUploaded{
    margin-top:1rem
}
.allBecomeSeller .checkUploaded h3{
    font-size:1.3rem;
    font-weight:700;
    color:#475569
}
.allBecomeSeller .welcomeSeller{
    border-radius:10px;
    box-shadow:0 0 10px #0000000d;
    padding:1rem;
    margin-top:1rem;
    background:#fff
}
.allBecomeSeller .welcomeSeller i{
    display:grid;
    align-items:center;
    justify-content:center
}
.allBecomeSeller .welcomeSeller i svg{
    width:8rem;
    height:8rem
}
.allBecomeSeller .welcomeSeller h2,.allBecomeSeller .welcomeSeller h3{
    font-size:1.5rem;
    font-weight:700;
    color:#475569;
    text-align:center;
    margin-top:2rem
}
.allBecomeSeller .welcomeSeller h3{
    font-weight:500;
    font-size:1rem;
    margin-top:1rem
}
.allBecomeSeller .welcomeSeller p{
    color:#475569;
    text-align:center;
    font-weight:300;
    font-size:.85rem;
    margin-top:1rem
}
.allBecomeSeller .welcomeSeller .nextButton{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(10rem,auto));
    justify-content:center;
    grid-gap:1rem;
    margin-top:2rem
}
.allBecomeSeller .welcomeSeller .nextButton a{
    color:#007e46;
    text-align:center;
    font-weight:300;
    font-size:.85rem;
    border-radius:5px;
    padding:.5rem 1rem;
    border:1px solid #007E46
}
.allBecomeSeller .welcomeSeller .nextButton a:hover{
    background:#007e46;
    color:#fff
}
.allBecomeSeller table{
    background:#fff;
    border-radius:.3rem;
    box-shadow:0 0 10px #0000000d;
    width:100%;
    margin-top:1rem
}
.allBecomeSeller table tr{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(1px,1fr));
    align-items:center;
    grid-gap:1rem;
    padding:1rem
}
.allBecomeSeller table tr th{
    font-weight:700;
    color:#475569;
    font-size:.85rem;
    text-align:center;
    text-overflow:ellipsis;
    white-space:nowrap;
    overflow:hidden;
    display:grid;
    align-items:center;
    justify-content:center
}
.allBecomeSeller table tr td{
    font-weight:300;
    font-size:.85rem;
    text-align:center;
    color:#475569
}
.allBecomeSeller table tr td svg{
    fill:#475569;
    width:1rem;
    height:1rem;
    cursor:pointer
}
.allBecomeSeller table tr td img{
    width:2.5rem;
    height:2.5rem;
    object-fit:cover;
    border-radius:5rem;
    box-shadow:0 0 10px #0000001a
}
.allBecomeSeller table tr td a{
    display:grid;
    align-items:center
}
.allBecomeSeller table tr td a svg{
    margin-left:.5rem
}
.allBecomeSeller table tr .buttons{
    display:grid;
    grid-template-columns:auto auto;
    grid-gap:.5rem
}
.allBecomeSeller table tr .buttons a{
    font-size:.8rem;
    padding:.3rem;
    border-radius:5px;
    color:#fff;
    background:green
}
.allBecomeSeller table tr .buttons button{
    font-size:.8rem;
    padding:.3rem;
    border-radius:5px;
    color:#fff;
    background:orange
}
.allBecomeSeller table tr .buttons button:last-child{
    background:red
}
.allBecomeSeller table tr:nth-child(2n){
    background:#eee
}
.allPaginateHome{
    display:grid;
    justify-content:center;
    margin-top:2rem;
    margin-bottom:1rem
}
.allPaginateHome .pages{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    align-items:center;
    gap:1rem
}
.allPaginateHome .pages div{
    width:2.3rem;
    height:2.3rem;
    border-radius:5px;
    background:#fff;
    color:#475569;
    display:grid;
    justify-content:center;
    align-items:center;
    font-size:1rem;
    font-weight:300;
    box-shadow:0 0 10px #0003;
    cursor:pointer
}
.allPaginateHome .pages div svg{
    width:.8rem;
    height:.8rem;
    fill:#475569
}
.allPaginateHome .pages .true{
    background:#007e46;
    color:#fff
}
.pagination{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    align-items:center;
    gap:1rem;
    margin:1rem 0
}
.pagination a{
    width:2.3rem;
    height:2.3rem;
    border-radius:5px;
    background:#fff;
    color:#475569;
    display:grid;
    justify-content:center;
    align-items:center;
    font-size:1rem;
    font-weight:300;
    box-shadow:0 0 10px #0003;
    cursor:pointer
}
.pagination a svg{
    width:.8rem;
    height:.8rem;
    fill:#475569
}
.pagination .active-page{
    background:#007e46;
    color:#fff
}
.allCounseling{
    position:fixed;
    top:0;
    bottom:0;
    right:0;
    left:0;
    background:#87878780;
    z-index:999;
    display:none;
    overflow-y:scroll
}
.allCounseling .counselingFast{
    background:#fff;
    padding:.5rem 1rem 1rem;
    width:50%;
    margin:auto;
    border-radius:5px;
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    display:none;
    text-align:center
}
.allCounseling .counselingFast .title{
    display:grid;
    grid-template-columns:auto auto;
    justify-content:space-between;
    align-items:center;
    border-bottom:2px dashed #bbb;
    padding-bottom:.5rem;
    margin-bottom:.5rem
}
.allCounseling .counselingFast .title .title2{
    font-size:1.1rem;
    font-weight:500;
    color:#475569
}
.allCounseling .counselingFast .title i{
    display:grid;
    align-items:center;
    cursor:pointer
}
.allCounseling .counselingFast .title i svg{
    width:1.5rem;
    height:1.5rem;
    fill:#475569
}
.allCounseling .counselingFast .counselingTitleProduct{
    font-size:.9rem;
    font-weight:300;
    color:#475569;
    background:#eee;
    border-radius:5px;
    padding:.5rem;
    text-align:right
}
.allCounseling .counselingFast .counselingFastData{
    margin:1rem 0
}
.allCounseling .counselingFast .counselingFastData label{
    font-size:.9rem;
    font-weight:500;
    color:#475569;
    margin-bottom:.5rem;
    display:grid;
    text-align:right
}
.allCounseling .counselingFast .counselingFastData input,.allCounseling .counselingFast .counselingFastData textarea{
    background:#fff;
    border:1px solid #bbb;
    padding:.4rem .5rem;
    color:#475569;
    border-radius:5px;
    font-size:.8rem;
    width:100%;
    transition:all .3s ease-in-out;
    resize:vertical;
    outline:transparent
}
.allCounseling .counselingFast .captchaQuick{
    display:grid;
    margin-top:1rem;
    justify-content:center
}
.allCounseling .counselingFast button,.allCounseling .counselingFast a{
    background:#007e46;
    color:#fff;
    font-size:.8rem;
    font-weight:300;
    padding:.3rem 1rem;
    border-radius:5px;
    margin-top:1rem
}
@media screen and (max-width: 800px){
    .allCounseling .counselingFast{
        width:98%
    }
}
.showAllShare{
    background:#00000080;
    z-index:4000;
    position:fixed;
    top:0;
    right:0;
    width:100%;
    height:100%;
    display:grid;
    grid-template-columns:1fr;
    justify-content:center
}
.showAllShare .showAllShareHome{
    width:30%;
    margin:auto;
    background:#fff;
    display:grid;
    grid-template-columns:1fr;
    border-radius:.4rem;
    overflow:hidden
}
.showAllShare .showAllShareHome .showAllShareTop{
    display:grid;
    grid-template-columns:1fr auto;
    background:#f5f5f5;
    border-bottom:2px solid #bbb
}
.showAllShare .showAllShareHome .showAllShareTop i{
    display:grid;
    justify-content:center;
    align-items:center;
    padding:1rem;
    cursor:pointer
}
.showAllShare .showAllShareHome .showAllShareTop i svg{
    fill:#475569;
    width:1.3rem;
    height:1.3rem
}
.showAllShare .showAllShareHome .showAllShareTop .title2{
    font-size:1rem;
    font-weight:300;
    padding:1rem;
    color:#475569
}
.showAllShare .showAllShareHome .showAllShareItems{
    display:grid;
    grid-template-columns:1fr;
    justify-content:center;
    align-items:center;
    grid-gap:1rem;
    background:#fff;
    padding:1rem;
    padding-bottom:0
}
.showAllShare .showAllShareHome .showAllShareItems .showAllShareItem{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
    justify-content:space-between;
    grid-gap:.4rem;
    text-align:center;
    border:1px solid #bbb;
    padding:.5rem;
    border-radius:5px
}
.showAllShare .showAllShareHome .showAllShareItems .showAllShareItem .showAllShareItemName .title2{
    font-size:1rem;
    text-align:right;
    color:#475569;
    font-weight:300
}
.showAllShare .showAllShareHome .showAllShareItems .showAllShareItem .showAllShareItemName a{
    text-align:left;
    direction:ltr;
    width:100%;
    display:block;
    color:#475569;
    opacity:.5;
    font-size:.7rem;
    font-weight:300;
    margin-top:.3rem;
    height:15px;
    display:-webkit-box;
    -webkit-line-clamp:1;
    -webkit-box-orient:vertical;
    overflow:hidden
}
.showAllShare .showAllShareHome .showAllShareItems .showAllShareItem a{
    display:grid;
    justify-content:center;
    align-items:center;
    width:2.5rem;
    height:2.5rem
}
.showAllShare .showAllShareHome .showAllShareItems .showAllShareItem a i svg{
    width:2.5rem;
    height:2.5rem
}
.showAllShare .showAllShareHome .showAllShareTag{
    display:grid;
    grid-template-columns:auto 1fr auto;
    align-items:center;
    justify-content:left;
    direction:ltr;
    grid-gap:.5rem;
    margin:1rem;
    padding:.5rem;
    border-radius:.5rem;
    border:1px solid #bbb
}
.showAllShare .showAllShareHome .showAllShareTag i{
    display:grid;
    justify-content:center;
    align-items:center
}
.showAllShare .showAllShareHome .showAllShareTag i svg{
    fill:#475569;
    width:1.3rem;
    height:1.3rem
}
.showAllShare .showAllShareHome .showAllShareTag i .copy{
    fill:#007e46
}
.showAllShare .showAllShareHome .showAllShareTag .title2{
    color:#475569;
    text-align:left;
    font-weight:300
}
.showAllShare .showAllShareHome .showAllShareTag input{
    visibility:hidden;
    position:absolute;
    opacity:0
}
@media screen and (max-width: 1200px){
    .showAllShare .showAllShareHome{
        width:50%
    }
}
@media screen and (max-width: 1000px){
    .showAllShare .showAllShareHome{
        width:55%
    }
}
@media screen and (max-width: 800px){
    .showAllShare .showAllShareHome{
        width:98%;
        display:block
    }
}
.allSingleNews{
    display:grid;
    grid-template-columns:1fr 3fr;
    grid-gap:1rem;
    margin:1rem auto;
    min-height:calc(100vh - 12rem)
}
.allSingleNews .right .pic{
    border-radius:10px;
    box-shadow:0 0 10px #0000001a;
    padding:1rem;
    background:#fff
}
.allSingleNews .right .pic img{
    width:100%;
    height:100%;
    object-fit:cover
}
.allSingleNews .right .postsList{
    border-radius:10px;
    box-shadow:0 0 10px #0000001a;
    padding:1rem;
    margin-top:1rem;
    background:#fff
}
.allSingleNews .right .postsList .titleList{
    font-size:1rem;
    font-weight:500;
    color:#475569
}
.allSingleNews .right .postsList ul li{
    margin-top:1rem;
    overflow:hidden;
    transition:all .3s ease-in-out
}
.allSingleNews .right .postsList ul li a{
    display:grid;
    grid-template-columns:auto 1fr;
    grid-gap:.5rem;
    align-items:center
}
.allSingleNews .right .postsList ul li a img{
    width:5rem;
    height:100%;
    object-fit:cover;
    border-radius:3px
}
.allSingleNews .right .postsList ul li a .showInfo{
    display:grid;
    justify-content:right;
    text-align:right;
    align-items:center;
    grid-gap:.5rem;
    text-overflow:ellipsis;
    white-space:nowrap;
    overflow:hidden
}
.allSingleNews .right .postsList ul li a .showInfo h4{
    text-overflow:ellipsis;
    white-space:nowrap;
    overflow:hidden;
    font-weight:500;
    color:#475569;
    font-size:.8rem
}
.allSingleNews .right .postsList ul li a .showInfo span{
    font-size:.7rem;
    color:#475569;
    font-weight:300
}
.allSingleNews .right .postsList ul li a:hover .showInfo h4{
    color:#007e46
}
.allSingleNews .left{
    border-radius:10px;
    box-shadow:0 0 10px #0000001a;
    padding:1rem;
    background:#fff
}
.allSingleNews .left .top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:.5rem
}
.allSingleNews .left .top h1{
    font-size:1.7rem;
    font-weight:500;
    color:#475569;
    line-height:3rem
}
.allSingleNews .left .top i{
    display:grid;
    align-items:center;
    cursor:pointer
}
.allSingleNews .left .top i svg{
    width:2rem;
    height:2rem;
    fill:#475569
}
.allSingleNews .left .leftItem{
    display:flex;
    flex-wrap:wrap;
    justify-content:right;
    align-items:center;
    padding:1rem 0;
    margin:1rem 0;
    border-top:2px dashed #bbb;
    border-bottom:2px dashed #bbb;
    gap:2rem
}
.allSingleNews .left .leftItem .option{
    position:relative;
    padding-left:2rem
}
.allSingleNews .left .leftItem .option h3{
    font-size:1.1rem;
    font-weight:300;
    color:#475569;
    margin-bottom:.5rem
}
.allSingleNews .left .leftItem .option h4{
    font-size:.9rem;
    font-weight:300;
    color:#475569;
    background:#f5f5f5;
    border-radius:5rem;
    padding:.2rem .5rem
}
.allSingleNews .left .leftItem .option a{
    font-size:.9rem;
    font-weight:300;
    color:#475569;
    margin-top:.5rem
}
.allSingleNews .left .leftItem .option:after{
    content:"";
    width:2px;
    height:100%;
    position:absolute;
    left:0;
    bottom:0;
    top:0;
    background:#eee
}
.allSingleNews .left .leftItem .option:last-child:after{
    content:none
}
.allSingleNews .left .leftP{
    display:grid;
    justify-items:center
}
.allSingleNews .left .leftP p{
    font-size:1rem;
    font-weight:400;
    color:#475569;
    margin-bottom:1rem;
    line-height:3rem
}
.allSingleNews .left .leftP .image{
    display:grid;
    justify-content:center;
    margin:1rem 0
}
.allSingleNews .left .leftP ul{
    margin:2rem
}
.allSingleNews .left .leftP ul li{
    list-style:decimal;
    margin-bottom:1rem
}
.allSingleNews .left .leftP ul ul{
    margin:0;
    margin-top:1rem;
    margin-right:1rem
}
@media screen and (max-width: 700px){
    .allSingleNews{
        display:block
    }
    .allSingleNews .right{
        margin-bottom:1rem
    }
    .allSingleNews .right .postsList{
        position:absolute;
        opacity:0;
        visibility:hidden
    }
    .allSingleNews .left{
        padding:.5rem
    }
    .allSingleNews .left .top h1{
        font-size:1.2rem
    }
    .allSingleNews .left .top i svg{
        width:1.5rem;
        height:1.5rem
    }
    .allSingleNews .left .leftItem .option h3,.allSingleNews .left .leftItem .option h4,.allSingleNews .left .leftItem .option a{
        font-size:.7rem
    }
    .allSingleNews .left .leftItem .option a span{
        font-size:.9rem
    }
}
.allComment{
    display:grid;
    grid-template-columns:1fr 1fr
}
.allComment .addComment{
    padding:1rem
}
.allComment .addComment .sendCommentItem{
    display:grid;
    grid-template-columns:1fr;
    grid-gap:.5rem;
    margin-bottom:1rem
}
.allComment .addComment .sendCommentItem input,.allComment .addComment .sendCommentItem select{
    padding:.5rem;
    background:transparent;
    border:1px solid #bbb;
    border-radius:5px;
    width:100%;
    transition:all .3s ease-in-out;
    font-size:.85rem;
    font-weight:300
}
.allComment .addComment .sendCommentItem textarea{
    padding:.5rem;
    border:1px solid #bbb;
    border-radius:5px;
    width:100%;
    outline-style:unset;
    transition:all .3s ease-in-out;
    font-size:.85rem;
    font-weight:300;
    height:10rem;
    resize:vertical
}
.allComment .addComment .sendCommentItem label{
    font-size:.95rem;
    line-height:1.692;
    color:#475569;
    position:relative
}
.allComment .addComment .sendCommentItem label i{
    position:absolute;
    left:1rem;
    top:0;
    bottom:0;
    display:grid;
    justify-content:center;
    align-items:center;
    cursor:pointer
}
.allComment .addComment .sendCommentItem label i svg{
    width:1.2rem;
    height:1.2rem
}
.allComment .addComment button{
    display:grid;
    grid-template-columns:auto auto;
    justify-content:center;
    align-items:center;
    color:#fff;
    background:#007e46;
    padding:.5rem 1rem;
    border-radius:.2rem
}
.allComment .addComment button i{
    display:grid;
    justify-content:center;
    align-items:center
}
.allComment .addComment button i svg{
    fill:#fff;
    width:1rem;
    height:1rem
}
.allComment .addComment button img{
    width:4rem;
    height:1rem;
    object-fit:cover
}
.allComment .addComment button:last-child{
    display:block;
    background:red
}
.allComment .showComments{
    border-right:1px solid #bbb
}
.allComment .showComments .getCommentItem{
    border-bottom:1px solid #bbb;
    padding:.5rem
}
.allComment .showComments .getCommentItem .user{
    font-size:1rem;
    font-weight:700;
    color:#475569
}
.allComment .showComments .getCommentItem .seller{
    font-size:.8rem;
    font-weight:300;
    color:#475569;
    opacity:.7;
    margin:.3rem 0
}
.allComment .showComments .getCommentItem p{
    font-size:.85rem;
    font-weight:500;
    color:#475569;
    line-height:1.7rem
}
.allComment .showComments .getCommentItem .answer1{
    margin-top:.5rem;
    background:#f5f5f5;
    border:2px dashed #bbb;
    border-radius:5px;
    padding:.5rem
}
.allComment .showComments .getCommentItem .answer1 .seller{
    margin-top:0;
    font-size:.85rem;
    font-weight:500;
    color:#007e46;
    opacity:1
}
.allComment .showComments .getCommentItem .answer1 p{
    color:#007e46
}
.allComment .showComments .getCommentItem .answer{
    margin-top:.5rem
}
.allComment .showComments .getCommentItem .answer .reply{
    text-align:left
}
.allComment .showComments .getCommentItem .answer .reply span{
    cursor:pointer;
    font-size:.75rem;
    font-weight:500;
    background:#007e46;
    color:#fff;
    padding:.2rem .5rem;
    border-radius:5px
}
.allComment .showComments .getCommentItem .answer .contentReply{
    background:#eee;
    padding:.5rem;
    border-radius:5px;
    margin-top:.5rem;
    display:none
}
.allComment .showComments .getCommentItem .answer .contentReply textarea{
    padding:.5rem;
    border:1px solid #bbb;
    border-radius:5px;
    font-size:.75rem;
    font-weight:300;
    height:4rem;
    width:100%;
    resize:vertical;
    margin:.5rem 0
}
.allComment .showComments .getCommentItem .answer .contentReply button{
    font-size:.8rem;
    font-weight:300;
    background:green;
    color:#fff;
    padding:.2rem;
    border-radius:5px
}
.allComment .showComments .emptyComment{
    font-size:1rem;
    font-weight:500;
    color:red;
    text-align:center;
    opacity:.7
}
@media screen and (max-width: 800px){
    .allComment{
        display:flex;
        flex-direction:column-reverse
    }
    .allComment .showComments{
        border-right:0
    }
    .allComment .showComments .getCommentItem{
        display:block
    }
}

.input-group {
    display: flex;              /* چینش آیتم‌ها به‌صورت افقی */
    align-items: center;        /* تراز عمودی آیتم‌ها */
    width: 100%;                /* تمام عرض صفحه */
    max-width: 1200px;          /* حداکثر عرض (اختیاری) */
    margin: 0 auto;             /* مرکز‌چینی در صفحه */

    
}

.input-group input[type="text"] {
    flex: 1;                    /* فیلد جستجو کل فضای موجود را بگیرد */
    padding: 0.5rem;
    font-size: 1rem;
    border: 1px solid #ccc;
    border-right: none;         /* حذف حاشیه سمت راست برای ادغام با دکمه */
    border-radius: 0 5px 5px 0;  /* گرد کردن گوشه‌های سمت چپ */
}

.input-group .search-button {
    padding: 0.5rem 1rem;
    font-size: 1rem;
    background-color: #4285F4;  /* رنگ آبی دلخواه */
    color: #fff;
    border: 1px solid #4285F4;
    border-radius: 5px 0 0 5px;  /* گرد کردن گوشه‌های سمت راست */
    cursor: pointer;
    transition: background-color 0.3s;
}

.input-group .search-button:hover {
    background-color: #3367D6;
}
.input-group .open-link-button {
    margin-right: 2.5rem;      /* فاصله مناسب بین دکمه و فیلد جستجو */
    padding: 0.5rem 1rem;
    background-color: #51C44F;
    color: #fff;
    border: none;
    padding: 0.5rem;
    font-size: 1rem;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s;
}

.input-group .open-link-button:hover {
    background-color: #007E46;
}

/* در صورت نیاز می‌توانید استایل فیلد ورودی جستجو را هم تنظیم کنید */
.input-group input[type="text"] {
    padding: 0.5rem;
    font-size: 1rem;
     /* این ویژگی باعث می‌شود فیلد باقی‌مانده عرض والد را بگیرد */
}