*{
    padding:0 auto;
}

:root {
    --first: #0C3DA0;
    --second: #2ED573;
    --third: #f9f9f9;
    --fourth: #181818;
}

body{
    direction: rtl;
    font-family: Yekan Bakh , iranyekanfan !important;
    overflow-x:hidden ;
}
.login {
    float: right;
    width: 100%;
    height: 100vh;
    background: radial-gradient(circle, rgb(21, 81, 184) 0%, rgb(0, 35, 95) 100%);
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}
.login .loginBox {
    display: block;
    width: 500px;
    padding: 33px;
    border-radius: 10px;
}
.login .loginBox img {
    width: 86px;
}
.login .loginBox h2 {
    width: 100%;
    display: block;
    font-family: yekanbakh !important;
    color: var(--first);
    font-size: 26px;
    line-height: 0;
    margin: 0 0 11px 0;
}
.login .loginBox h2 span {
    background: var(--second);
    color: #fff;
    padding: 16px 13px 24px;
    border-radius: 6px;
    line-height: 0;
    display: inline-block;
}
.login .loginBox .box_login {
    float: right;
    width: 100%;
    margin: 0 0 0;
    padding: 0px 20px 20px 20px;
    border-radius: 10px;
}
.login .loginBox .box_login label {
    color: #fff;
}
.login .loginBox .box_login input {
    box-shadow: none;
}
.form-group {
    float: right;
    width: 98%;
    margin: 12px 1% 0px;
}
.form-group label {
    float: right;
    width: 100%;
    text-align: right;
    margin: 0 0 1px 0;
    font-size: 14px;
    color: #444;
    padding: 2px 8px 0 0;
    height: 30px;
}
.form-control {
    width: 100%;
    height: 43px;
    border-radius: 20px;
    box-shadow: 0 0 30px #eee;
    border: 1px solid #ccc;
    padding: 10px 20px;
}
.btn {
    float: right;
    width: 98%;
    margin: 20px 1% 0;
    background: var(--second);
    color: #fff;
    border-radius: 22px;
    font-size: 13px;
    padding: 12px 0;
    transition: 0.5s;
    font-weight: bold;
}
.btn:hover {
    background: var(--first);

    color: #fff;
    transition: 0.5s;
}


.ALERT {
    position: fixed;
    width: 100%;
    right: 0;
    bottom: 0;
    text-align: center;
    display: flex;
    justify-content: center;
    padding: 0 0 30px 0;
    z-index:-1;
}
.ALERT .AlERTMessage {
    width: auto;
    padding: 13px 100px;
    background: #f8ac00;
    font-size: 16px;
    border-radius: 50px;
    color: #fff;
    box-shadow: 0 0 30px rgba(0,0,0,0.4);
    font-weight: bold;
    overflow: hidden;
    height: 0;
    top: 20px;
    position: relative;
    transition: 0.5s;
    opacity: 0;
}
.ALERT.s .AlERTMessage {
    background: #34a600;
}
.ALERT.e .AlERTMessage {
    background: #ff0039;
}
.ALERT.active .AlERTMessage {
    height: 48px;
    top: 0;
    transition: 0.5s;
    opacity: 0.85;

}
.ALERT.active{
    z-index:999;
}

.Main {
    float: right;
    width: 100%;
    min-height: 100vh;
    background: rgb(242, 245, 250);
    padding: 0 20px;
}
.Main nav {
    float: right;
    width: 100%;
}
.Main nav .menu {
    position: fixed;
    width: 250px;
    height: 100%;
    overflow: auto;
    transition: 0.5s;
    background: #fff;
    right: 0;
    top: 20px;
    padding: 18px;
    border-radius: 10px 0 0 10px;
}
.Main nav header {
    width: 100%;
    height: 60px;
    z-index: 9999;
    background: #f2f5fa;
    right: 0;
    padding: 0 40px;
}
.Main nav .menu #logo {
    float: right;
    width: 60px;
    text-align: center;
    margin: 0px calc(50% - 30px) 65px 0;
    display: none;
}
.Main nav .menu #logo img {
    width: 100%;
}
.Main nav .menu ul {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
}
.Main nav .menu ul li {
    float: right;
    width: 100%;
    position:relative;
}
.Main nav .menu ul li a
{
    float: right;
    width: 100%;
    padding: 13px 15px;
    text-align: right;
    text-decoration: none;
    color: #555;
    font-size: 13px;
    font-family: iranyekan;
    display: flex;
    align-items: center;
    font-weight: 500;
    position: relative;
    border-bottom: 1px solid #f8f8f8;
}
.Main nav .menu ul li a i
{
    font-size: 22px;
    margin: -2px 0 0 4px;
    color: var(--first);
}
.Main nav .menu ul li a:hover {
    color: var(--first);
}
.Main nav .menu ul li a:after {
    border-radius: 6px;
}

.Main nav header .UserDetail
{
    float: left;
    height: 48px;
    position: relative;
    display: flex;
    align-items: center;
    padding: 0;
}
.Main nav header .UserDetail .profile_option {
    display: block;
    position: relative;
}
.Main nav header .UserDetail .thumb
{
    width: 30px;
    height: 30px;
    background-size: contain;
    background-repeat: no-repeat;
    border: 1px solid var(--second);
    background-position: center;
    border-radius: 50%;
    background-color: #fff;
}
.Main nav header .UserDetail .profile_option .menu_list {
    position: absolute;
    width: 200px;
    left: 0;
    top: 100%;
    background: #fff;
    box-shadow: 0 0 20px #eee;
    padding: 20px;
    border-radius: 10px;
    display: none;
    z-index: 9999;
}
.Main nav header .UserDetail .profile_option .menu_list ul {
    width: 100%;
    list-style: none;
    padding: 0;
}
.Main nav header .UserDetail .profile_option .menu_list ul li {
    float: right;
    width: 100%;
}
.Main nav header .UserDetail .profile_option .menu_list ul li a {
    float: right;
    width: 100%;
    text-decoration: none;
    border-bottom: 1px solid #eee;
    padding: 10px;
    color: var(--fourth);
    font-size: 15px;
    display: flex;
    align-items: center;
}
.Main nav header .UserDetail .profile_option .menu_list ul li a i {
    font-size: 22px;
    color: var(--first);
    margin: -2px 0 0 6px;
}
.Main nav header .UserDetail .profile_option .menu_list ul li a:hover {
    color: var(--first);
}
.Main nav header .UserDetail .profile_option .menu_list ul li:last-child a {
    border: 0;
}
.Main nav header .UserDetail .profile_option:hover .menu_list {
    display: block;
}
.Main nav header .UserDetail .profile_option .profile_list {
    font-size: 15px;
    color: var(--fourth);
    text-decoration: none;
    padding: 0 16px;
}
.Main nav header .UserDetail .profile_option .profile_list i {
    display: inline-block;
    margin: 0 2px 0 0px;
    font-size: 11px;
}

.Main .content {
    float: right;
    width: 100%;
    padding: 0px 290px 20px 40px;
    transition: 0.5s;
}
.Main .content .row {
    background: #fff;
    padding: 10px 0;
}
.title {
    float: right;
    width: 100%;
    font-size: 20px;
    font-family: yekanbakh;
    color: var(--first);
    position: relative;
    z-index: 9;
}
.title i {
    float: left;
    margin: 3px 0 13px 0;
}
.DetailUser {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0 0 0 0;
    display: flex;
}
.DetailUser li {
    float: right;
    width: 100%;
    background: #eefefd;
    padding: 21px 30px;
    text-align: center;
    border-radius: 10px;
}
.DetailUser li:nth-child(2) {
    background: #ffeeef;
    margin: 0 2%;
}
.DetailUser li:nth-child(3) {
    background: #f2e8ff;
    margin: 0 0 0 2%;
}
.DetailUser li:nth-child(4) {
    background: #fef3f0;
}
.DetailUser li span {
    font-size: 40px;
    font-family: iransansfan !important;
    color: var(--fourth);
}
.DetailUser li h4 {
    font-size: 16px;
    font-family: iranyekan;
    font-weight: bold;
}

.Main nav .menu ul li a .las.la-angle-down {
    position: absolute;
    left: 0;
    font-size: 14px;
}
.Main nav .menu ul li .sub_menu {
    background: #fff;
    border-radius: 6px;
    overflow: hidden;
    height: 0;
    transition: 0.5s;
}
.Main nav .menu ul li .sub_menu.active {
    height: auto;
    transition: 0.5s;
    padding: 6px 6px 20px;
}
.Main nav .menu ul li .sub_menu a
{
    font-size: 14px;
    padding: 6px 22px 8px;
    font-size: 12px;
}
.Main nav .menu ul li .sub_menu a i
{
    font-size: 22px;
}

.Main nav header .UserDetail .profile_option .menu_list ul li .sub_menu {
    display: none;
}
.Main nav header .UserDetail .profile_option .menu_list ul li .las.la-angle-down {
    display: none;
}

form.inner_form {
    float: right;
    width: 100%;
    border-radius: 9px;
}
.form-group.third {
    width: 31.3%;
}
.form-group.half {
    width: 48%;
}
form.inner_form label {
    color: var(--fourth);
    cursor: pointer;
}
.access_list {
    float: right;
    width: 100%;
    padding: 0px;
    margin: 21px 0 0;
    border-radius: 15px;
    background: #fff;
}
.access_list h4 {
    float: right;
    width: 100%;
    font-size: 20px;
    font-family: yekanbakh;
    color: var(--fourth);
    text-align: right;
    display: none;
}
.list_of_access {
    float: right;
    width: 100%;
    list-style: none;
    padding: 4px 0 0 0;
}
.list_of_access li {
    float: right;
    width: 18%;
    margin: 10px 1%;
}
.list_of_access li.header {
    width: 98%;
    font-family: yekanbakh;
    font-size: 17px;
    color: var(--fourth);
    font-weight: bold;
    padding: 0 0 7px;
    border-bottom: 1px dashed #ccc;
    margin: 0 1% 9px;
}
.access_list label {
    float: right;
    width: 100%;
    border: 1px solid #eee;
    padding: 10px 19px;
    border-radius: 50px;
    font-size: 13px;
    text-align: center;
    position: relative;
}
.access_list label input {
    margin: 0 0 0 6px;
    position: absolute;
    width: 100%;
    height: 100%;
    right: 0;
    top: 0;
    opacity: 0;
    cursor: pointer;
}
.access_list label:hover, .access_list label.active {
    background: var(--first);
    color: #fff;
}

.list_of_data
{
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0px 0;
    display: flex;
    background: #fff;
    box-shadow: inset 0 0px 10px rgba(0,0,0,0.15);
    padding: 11px 0px;
    border-radius: 0;
    align-items: center;
    position: relative;
    transition: 0.2s;
    border-bottom: 1px solid #eee;
}
.page-template-Personal .show_horizental {
    /*display: none;*/
}


.list_of_data:hover
{
    border-bottom: 1px solid #20c999;
    transition: 0.2s;
}

.list_of_data li {
    width: 100%;
    text-align: center;
    margin: 0;
    font-size: 13px;
}
.list_of_data.head:hover{
    transform: scale(1);
    border: 0;
}
.list_of_data.head
{
    background: #20c999;
    box-shadow: none;
    font-family: yekanbakh;
    box-shadow: none !important;
    color: #181818;
    padding: 17px 0 15px !important;
    color: #fff;
}
.list_of_data.head li
{
    border-left: 1px solid #ffffff47;
    color: #131313;
}
.list_of_data li .edit, .list_of_data li .show, .list_of_data li .add {
    color: #fff;
    font-size: 18px;
    background: #06c600;
    width: fit-content;
    display: inline-grid;
    height: 30px;
    text-decoration: navajowhite;
    align-content: center;
    border-radius: 9px;
    padding: 0 5px 2px 0;
}
.list_of_data li .add {
    background: var(--bs-blue);
}
.list_of_data li .edit {
    background: var(--bs-gray-dark);
}
.list_of_data li .show {
    background: var(--second);
}
.list_of_data li .edit:hover {
    background: var(--first);
}

.list_of_detail {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
}
.list_of_detail li {
    float: right;
    width: 33.3%;
    position: relative;
    padding: 29px 0;
    display: flex;
    align-items: center;
}
.list_of_detail li span {
    color: var(--fourth);
    font-size: 19px;
    font-family: iranyekan;
}
.list_of_detail li i {
    background: var(--second);
    width: 30px;
    height: 30px;
    display: inline-grid;
    align-content: center;
    text-align: center;
    font-size: 20px;
    border-radius: 50px;
    color: #fff;
    margin: 0 0 0 9px;
}
.list_of_detail li:after {
    position: absolute;
    content: "";
    width: 1px;
    height: 100%;
    border: 1px dashed #ccc;
    right: 13px;
    top: 59px;
}
.list_of_detail li:nth-child(4)::after , .list_of_detail li:nth-child(5)::after , .list_of_detail li:nth-child(6)::after {
    display: none;
}

.description p {
    margin: 0;
}
.description {
    float: right;
    width: 99%;
    background: #f4f2f4;
    padding: 20px;
    border-radius: 5px;
    margin: 0 0.5%;
}
#add_log {
    float: right;
    width: 99%;
    padding: 13px;
    margin: 8px 0.5%;
    border-radius: 10px;
    background: #fff9f6;
}
#add_log textarea {
    height: 100px;
}


.user_search_popup {
    float: right;
    width: 100%;
    padding: 10px;
    text-align: center;
}
.user_search_popup h2 {
    float: right;
    width: 100%;
    text-align: center;
    color: var(--first);
    font-family: yekanbakh;
    margin: 0 0 12px 0;
    font-size: 23px;
    font-weight: 600;
}
.user_search_popup .user_search_popup_area {
    float: right;
    width: 100%;
    border-top: 1px solid #eee;
    padding: 10px;
}
.user_search_popup .user_search_popup_area .listCustomerFound {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
}
.user_search_popup .user_search_popup_area .listCustomerFound li {
    float: right;
    width: 100%;
}
.user_search_popup .user_search_popup_area .listCustomerFound li .detail_user {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
    padding: 11px 0;
}
.user_search_popup .user_search_popup_area .listCustomerFound li .detail_user li {
    float: right;
    width: 100%;
    margin: 0;
}
.user_search_popup .user_search_popup_area .listCustomerFound li .detail_user li:first-child {
    border-left: 1px solid #eee;
}
.user_search_popup .user_search_popup_area .listCustomerFound li span {
    font-size: 12px;
}
.user_search_popup .user_search_popup_area .listCustomerFound li b {
    color: var(--first);
    font-size: 14px;
}
.user_search_popup .user_search_popup_area .listCustomerFound li .projectList {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
}
.user_search_popup .user_search_popup_area .listCustomerFound li .projectList li {
    float: right;
    width: 31.3%;
    margin: 0 1%;
    border: 1px solid #eee;
    padding: 10px 0;
    border-radius: 60px;
    position: relative;
    font-size: 13px;
}
.user_search_popup .user_search_popup_area .listCustomerFound li .projectList li input {
    position: absolute;
    width: 100%;
    height: 100%;
    right: 0;
    top: 0;
    cursor: pointer;
    opacity: 0;
}
.user_search_popup .user_search_popup_area .listCustomerFound li .projectList li:hover , .user_search_popup .user_search_popup_area .listCustomerFound li .projectList li.active {
    background: var(--first);
    color: #fff;
}
#ShowUserPopUp .select_customer {
    float: right;
    width: 90%;
    background: var(--second);
    margin: 7px 5% 10px;
    text-align: center;
    font-size: 13px;
    padding: 10px 0;
    border-radius: 50px;
    color: #fff;
    cursor: pointer;
}
.user_search_popup .user_search_popup_area .listCustomerFound li .select_user:hover, .user_search_popup .user_search_popup_area .listCustomerFound li .select_user.active {
    background: var(--second);
    color: #fff;
}
.user_search_popup .user_search_popup_area .listCustomerFound li .select_user {
    float: right;
    font-size: 12px;
    background: #eee;
    padding: 3px 10px;
    border-radius: 17px;
    cursor: pointer;
}

.LableSection {
    float: right;
    width: 100%;
    text-align: center;
    font-family: pinar;
    font-size: 24px;
    text-align: right;
    margin: 13px 0 11px 0;
    padding: 0 8px 0 0;
    color: var(--first);
}
.add_list_of_service {
    float: left;
    background: var(--first);
    color: #fff;
    text-align: center;
    font-size: 13px;
    padding: 7px 50px;
    border-radius: 30px;
    cursor: pointer;
}

.list_of_service_place {
    float: right;
    width: 100%;
    margin: 0 0 14px 0;
}
.list_of_service {
    float: right;
    width: 100%;
    padding: 10px 10px 20px;
    margin: 7px 0 4px 0;
    border-radius: 6px;
    box-shadow: -10px -10px 20px #fff, 10px 20px 20px #f2f2f2, inset 10px 20px 20px #ebebeb;
}
.type_of_request {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 10px 0 5px 0px;
}
.type_of_request li {
    float: right;
    width: 23%;
    margin: 0 1% 9px;
    position: relative;
    text-align: center;
    border: 1px solid #eee;
    padding: 14px 0;
    background: #fff;
    border-radius: 50px;
    font-size: 13px;
    cursor: pointer;
}
.type_of_request li input {
    position: absolute;
    width: 100%;
    height: 100%;
    right: 0;
    top: 0;
    opacity: 0;
    cursor: pointer;
}
.type_of_request li:hover , .type_of_request li.active {
    background: var(--first);
    color: #fff;
}
.type_of_request.service li {
    width: 31.333%;
    display: none;
}

.BOX_OF_Service_Option {
    float: right;
    width: 100%;
    margin: 30px 0 10px 0;
    box-shadow: ;
    padding: 20px;
}
.BOX_OF_Service_Option .col-md-6 {
    box-shadow: -20px -20px 20px #fff, 20px 40px 40px #f2f2f2, inset 20px 40px 40px #f2f2f2;
    margin: 0 1%;
    width: 48%;
    padding: 30px;
    border-radius: 6px;
}
.BOX_OF_Service_Option .list_of_option {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0 0 0 0;
}
.BOX_OF_Service_Option .list_of_option li {
    float: right;
    width: 100%;
}
.BOX_OF_Service_Option .list_of_option li label {
    float: right;
    width: 100%;
    position: relative;
    padding: 4px;
    border-radius: 6px;
    font-size: 14px;
    padding: 10px 0;
    border-bottom: 1px solid #eee;
}
.BOX_OF_Service_Option .list_of_option li label p {
    background: var(--second);
    color: #fff;
    float: left;
    padding: 6px 11px;
    font-size: 12px;
    border-radius: 6px;
    position: absolute;
    left: 0;
    top: 4px;
    width: 50%;
    text-align: center;
    opacity: 0;
}
.BOX_OF_Service_Option .list_of_option li label:hover p {
    opacity: 1;
}

.BOX_OF_Service_Option .list_of_option li label i {
    float: left;
    font-style: normal;
    color: var(--second);
    font-weight: 600;
}

.calc_price {
    float: right;
    width: 100%;
    list-style: none;
    margin: 0 0 23px 0;
    background: #eefefd;
    padding: 28px;
    display: flex;
    border-radius: 6px;
}
.calc_price li {
    width: 100%;
    margin: 0;
    border-left: 1px solid #ccc;
    padding: 0 10px;
}
.calc_price li:last-child {
    border: 0;
}
.calc_price li b {
    color: var(--first);
}

.list_of_tab {
    float: right;
    width: 100%;
    list-style: none;
    margin: 22px 0 0;
    padding: 0 0;
    border-radius: 50px;
    padding: 11px 8px;
    display: flex;
}
.list_of_tab li {
    float: right;
    width: 100%;
    margin: 0 0.5%;
    text-align: center;
    padding: 13px 0;
    border-radius: 50px;
    color: var(--first);
    font-size: 13px;
    cursor: pointer;
    border: 1px solid;
}
.list_of_tab li.active , .list_of_tab li:hover {
    background: var(--first);
    color: #fff;
}
.div_of_list_of_tab {
    float: right;
    width: 100%;
    margin: 0 0 0 0;
    border: 1px solid #eee;
    padding: 10px;
    border-radius: 6px;
    margin: 12px 0 7px 0;
    display: none;
}
.div_of_list_of_tab.active {
    display: block;
}

.Img_selector {
    float: right;
    width: 100%;
    border: 2px dashed #e7e7e7;
    padding: 10px;
    border-radius: 7px;
    margin: 5px 0px 6px 0;
    position: relative;
    background: #eeeeee2b;
    backdrop-filter: blur(10px);
}
.Img_selector.selected::after {
    position: absolute;
    content: "در حال بارگذاری";
    width: 100%;
    height: 100%;
    background: rgba(62, 99, 247, 0.77);
    right: 0;
    top: 0;
    border-radius: 10px;
    text-align: center;
    display: flex;
    color: #fff;
    text-align: center;
    justify-content: center;
    align-items: center;
    font-size: 21px;
    text-shadow: 0 0 10px #000;
}
.Img_selector .thumb {
    float: right;
    width: 200px;
    height: 49px;
    background-color: #eeeeee;
    border-radius: 6px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    display: none;
}
.Img_selector.uploaded .thumb {
    display: block;
}
.Img_selector .box_upload {
    float: left;
    width: 100%;
    height: 49px;
    align-content: center;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    position: relative;
    font-size: 14px;
    color: #666;
}
.Img_selector.uploaded .box_upload {
    width: calc(100% - 226px);
}
.Img_selector .box_upload .imgUpload {
    position: absolute;
    width: 100%;
    height: 100%;
    right: 0;
    top: 0;
    opacity: 0;
    cursor: copy;
}
.add_document {
    float: left;
    background: var(--first);
    color: #fff;
    font-size: 13px;
    padding: 11px 75px;
    margin: 6px 0 0 11px;
    border-radius: 6px;
    cursor: pointer;
}
.list_of_data li .project {
    display: block;
    font-size: 11px;
    color: var(--first);
}
.list_of_data li.small {
    width: 14%;
    position: relative;
}
.list_of_data li .status , .list_of_data li .request {
    font-size: 10px;
    background: var(--bs-yellow);
    color: #000;
    padding: 5px 12px;
    border-radius: 20px;
}
.list_of_data li .request {
    background: var(--bs-pink);
    color: #fff;
}
.list_of_data li .date {
    background: var(--bs-purple);
    font-size: 11px;
    padding: 5px 12px;
    border-radius: 20px;
    color: #fff;
}
.list_of_data li .mobile {
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 3px;
    border-bottom: 1px dashed var(--bs-info);
    color: var(--bs-info);
    cursor: pointer;
}

.description_order {
    float: left;
    position: absolute;
    right: -30px;
    top: 0px;
    background: var(--bs-yellow);
    width: 25px;
    height: 25px;
    display: inline-grid;
    align-content: center;
    border-radius: 50px;
    color: #000;
    font-size: 19px;
    cursor: pointer;
}
.description_order p {
    position: absolute;
    width: 400px;
    max-height: 200px;
    background: #ffeeef;
    font-size: 12px;
    right: 100%;
    top: -8px;
    overflow: scroll;
    border-radius: 6px;
    padding: 12px;
    display: none;
}
.description_order:hover p {
    display: block;
}

.DetailOfRequest {
    float: right;
    width: 49%;
    background: #eefefd;
    margin: 0 0.5% 10px;
    padding: 36px 21px;
    list-style: none;
    border-radius: 6px;
}
.DetailOfRequest:nth-child(3) {
    background: #fef3f0;
}
.DetailOfRequest li {
    width: 50%;
    float: right;
    padding: 12px 0;
    border-bottom: 1px dashed rgba(0,0,0,0.1);
}
.DetailOfRequest li i {
    font-size: 18px;
    color: var(--first);
}
.DetailOfRequest li b {
    font-size: 12px;
    font-weight: normal;
    color: var(--first);
}
.DetailOfRequest li span {
    font-size: 14px;
    color: var(--bs-dark);
    font-weight: bold;
}

.list_of_doc {
    float: right;
    width: 100%;
    padding: 0;
    margin: 10px 0 0 0;
    list-style: none;
    padding: 10px 0 0 0;
    display: flex;
}
.list_of_doc li {
    width: 10%;
}
.list_of_doc li a {
    float: right;
    width: 100%;
    background: rgba(255,255,255,0.5);
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    padding: 10px;
    border-radius: 6px;
    text-decoration: navajowhite;
    color: var(--second);
    font-size: 30px;
}
.list_of_doc li a span {
    font-size: 8px;
}
.list_of_doc li a:hover {
    background: var(--second);
    color: #fff;
}

.detail_comment {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0 0 4px 0;
    margin: 0 0 5px 0;
    display: flex;
    border-bottom: 1px solid #f9f9f9;
    align-content: center;
    align-items: center;
}
.detail_comment li {
    float: right;
    width: 50%;
}
.detail_comment li i {
    font-size: 17px;
    color: var(--second);
}
.detail_comment li span {
    font-size: 12px;
    color: var(--bs-gray);
}
.detail_comment li:last-child {
    justify-content: left;
}
.detail_comment li {
    display: flex;
    align-content: center;
    align-items: center;
}

.FileOfComment_place {
    float: right;
    width: 100%;
}
.FileOfComment_place .form-group.eightel {
    width: 14.6666%;
}
.FileOfComment_place .form-group.eightel .Img_selector {
    width: 100%;
    display: flex;
    flex-direction: column;
}
.FileOfComment_place .form-group.eightel .Img_selector .thumb {
    width: 100%;
    height: 60px;
}
.FileOfComment_place .form-group.eightel .Img_selector .box_upload {
    width: 100%;
    font-size: 8px;
    height: auto;
    color: #000;
    display: flex;
    flex-direction: column;
    padding: 12px 0;
}
.FileOfComment_place .form-group.eightel .Img_selector .box_upload i {
    font-size: 26px;
}
.FileOfComment_place .form-group.eightel .Img_selector .box_upload .imgUpload {
    cursor: pointer;
}
.add_FileOfComment {
    float: left;
    border: 1px solid var(--first);
    color: var(--first);
    font-size: 13px;
    padding: 10px 45px;
    border-radius: 50px;
    margin: 10px 0 0 11px;
    cursor: pointer;
}
.description.log {
    background: #fbfbfb;
    border: 1px solid #eee;
    margin: 7px .5%;
}
body.page-template-show_request .title {
    margin: 15px 0 0px 0;
}

.Show_status_reqest {
    float: right;
    width: 100%;
    position: relative;
}
.Show_status_reqest.active:after {
    position: absolute;
    width: 100%;
    height: 100%;
    background: var(--first);
    right: 0;
    top: 0;
    content: "در حال ارسال اطلاعات";
    border-radius: 50px;
    display: inline-grid;
    align-content: center;
    text-align: center;
    color: #fff;
    font-weight: bold;
    font-size: 17px;
    opacity: 0.6;
}
.BOX_OF_Service_Option.show_request {
    margin: 15px 0 0 0;
    padding: 0;
}

.request_user {
    float: right;
    width: 100%;
    min-height: 100vh;
    display: inline-grid;
    align-content: center;
    background: #f9f9f9;
    text-align: center;
}
.request_user .request_user_box {
    display: inline-block;
    width: 600px;
    margin: 0 auto;
}
.request_user .request_user_box .SelectOFCatService {
    float: right;
    width: 100%;
    padding: 0;
    margin: 0;
}
.request_user .request_user_box h2 {
    width: 100%;
    display: block;
    font-family: yekanbakh !important;
    color: var(--first);
    font-size: 26px;
    line-height: 0;
    margin: 0 0 11px 0;
}
.request_user .request_user_box h2 span {
    background: var(--second);
    color: #fff;
    padding: 16px 13px 24px;
    border-radius: 6px;
    line-height: 0;
    display: inline-block;
}

.request_user .request_user_box .box_of_request {
    float: right;
    width: 100%;
    background: #fff;
    box-shadow: -20px -20px 40px #fff, 20px 40px 40px #f0f0f0, inset 20px 40px 40px #f0f0f0;
    padding: 30px;
    border-radius: 10px;
}
.request_user .request_user_box .SelectOFCatService li {
    float: right;
    width: 48%;
    border: 1px solid #eee;
    padding: 20px;
    position: relative;
    display: flex;
    flex-direction: column;
    border-radius: 6px;
    margin: 7px 1%;
}
.request_user .request_user_box .SelectOFCatService li input , .request_user .request_user_box .SelectOFCatService li a {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    opacity: 0;
    z-index: 9;
    cursor: pointer;
}
.request_user .request_user_box .SelectOFCatService li img {
    width: 40px;
    display: inline-block;
    margin: 0 auto;
    padding: 5px;
    border: 1px solid #eee;
    border-radius: 50px;
}
.request_user .request_user_box .SelectOFCatService li span {
    font-family: pinar;
    color: var(--bs-gradient);
    margin: 8px 0 0 0;
    font-size: 15px;
}
.request_user .request_user_box .SelectOFCatService li .select {
    position: absolute;
    background: #eee;
    color: #333;
    font-size: 10px;
    padding: 2px 10px;
    top: 0;
    right: 0;
    border-radius: 0 4px 0 0;
    cursor: pointer;
}
.request_user .request_user_box .SelectOFCatService li:hover , .request_user .request_user_box .SelectOFCatService li.active {
    background: var(--bs-warning);
}
.request_user .request_user_box .SelectOFCatService li:hover img , .request_user .request_user_box .SelectOFCatService li.active img {
    background: var(--bs-white);
    border-radius: 50px;
    padding: 5px;
    transition: 0.5s;
}
.request_user .request_user_box .SelectOFCatService li:hover .select , .request_user .request_user_box .SelectOFCatService li.active .select {
    opacity: 0;
}
.request_user .request_user_box .SelectOFCatService li:hover span , .request_user .request_user_box .SelectOFCatService li.active span {
    color: var(--bs-gray-dark);
}

.request_user .request_user_box .box_of_request .next_step {
    float: left;
    width: 98%;
    background: var(--first);
    color: #fff;
    text-decoration: none;
    font-size: 13px;
    padding: 10px 0;
    margin: 15px 0 0 1%;
    border-radius: 50px;
    opacity: 0.2;
}
.request_user .request_user_box .box_of_request .next_step.active {
    opacity: 1;
}

.request_user .request_user_box .SelectOFCatService li span.price {
    font-size: 12px;
    font-family: iranyekan;
    color: var(--second);
    margin: 2px 0 0 0;
}
.request_user .request_user_box .SelectOFCatService li:hover span.price , .request_user .request_user_box .SelectOFCatService li.active span.price {
    color: #fff;
}

.request_user.SelectServiceFeature {
    height: auto;
    display: block;
    padding: 40px 0 100px 0;
}
.request_user.SelectServiceFeature .box_of_request {
    box-shadow: none;
    background: transparent;
    padding: 0;
}
.request_user.SelectServiceFeature .request_user_box {
    width: 90%;
}
.request_user.SelectServiceFeature .request_user_box > h2 {
    margin: 17px 0 -30px 0;
}


.request_user.SelectServiceFeature .request_user_box h2.title {
    float: right;
    width: 100%;
    text-align: center;
    margin: 11px 0 24px 0;
    color: var(--second);
}
.request_user.SelectServiceFeature .request_user_box .list_of_option {
    float: right;
    width: 100%;
    margin: 19px 0 0 0;
}
.request_user.SelectServiceFeature .request_user_box .list_of_option li {
    float: right;
    width: 48%;
    margin: 5px 1%;
}
.request_user.SelectServiceFeature .request_user_box .list_of_option li label {
    float: right;
    width: 100%;
    position: relative;
    padding: 18px 0;
    border-radius: 50px;
    border: 1px solid #eee;
    cursor: pointer;
    font-size: 12px;
}
.request_user.SelectServiceFeature .request_user_box .list_of_option li label input {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    opacity: 0;
    cursor: pointer;
}
.request_user.SelectServiceFeature .request_user_box .list_of_option li label p {
    width: 100%;
    top: -31px;
    color: #000;
    background: var(--bs-warning);
}
.request_user.SelectServiceFeature .request_user_box .list_of_option li label:hover , .request_user.SelectServiceFeature .request_user_box .list_of_option li label.active {
    background: var(--first);
    color: #fff;
}
.request_user.SelectServiceFeature .request_user_box .list_of_option.base li label {
    background: var(--first);
    color: #fff;
}
.request_user.SelectServiceFeature .request_user_box .list_of_option li label p:after {
    position: absolute;
    content: "";
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
    border-top: 5px solid var(--bs-warning);
    bottom: -5px;
    right: 50%;
}
.request_user.SelectServiceFeature .request_user_box .list_of_option.extra li label {
    display: flex;
    flex-direction: column;
    position: relative;
}
.request_user.SelectServiceFeature .request_user_box .list_of_option.extra li label:hover i , .request_user.SelectServiceFeature .request_user_box .list_of_option.extra li label.active i {
    color: #fff;
}


.request_user.show_request_user {
    height: auto;
    min-height: auto;
    padding: 50px 0;
}
.request_user.show_request_user .request_user_box {
    width: 100%;
}
.request_user.show_request_user .request_user_box .DetailOfRequest {
    width: 100%;
    background: top;
}
.request_user.show_request_user .request_user_box .DetailOfRequest li {
    width: 25%;
}

.tablePreInvoice {
    float: right;
    width: 100%;
}
.tablePreInvoice th {
    background: #eefefd;
    color: #333;
    padding: 15px 0 15px;
    font-family: pinar;
    font-size: 14px;
}
.tablePreInvoice td {
    padding: 14px 0;
    border: 1px solid #f5f5f5;
    font-weight: bold;
    font-size: 14px;
    background: #fff;
}

.request_user.show_request_user .box_of_request {
    box-shadow: none;
    padding: 0;
    background: transparent;
}
.request_user.show_request_user .box_of_request .DetailOfRequest {
    padding: 6px 0;
    border: 1px solid #eee;
    background: #fff;
}
.request_user.show_request_user .box_of_request .DetailOfRequest li {
    border: 0;
}

.base_of_option {
    float: right;
    width: 100%;
    background: #fff;
    border: 1px solid #eee;
    border-radius: 6px;
    margin: 11px 0 0 0;
    padding: 20px;
}
.base_of_option h3 {
    float: right;
    font-family: pinar;
    color: var(--first);
    font-size: 20px;
    width: 100%;
    text-align: right;
}
.base_of_option div {
    float: right;
    border: 1px solid #eee;
    font-size: 11px;
    padding: 5px 10px;
    border-radius: 23px;
    margin: 8px 0 0 7px;
}


.header_of_invoice {
    float: right;
    width: 100%;
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0 0 13px 0;
    align-items: center;
}
.header_of_invoice li {
    width: 100%;
}
.header_of_invoice li:nth-child(2) {
    display: flex;
    justify-content: center;
    width: 100%;
}
.header_of_invoice li:nth-child(3) {
    display: flex;
    justify-content: left;
}
.header_of_invoice span.date {
    font-size: 13px;
}
.header_of_invoice span.date b {
    color: var(--first);
    font-size: 16px;
}
.header_of_invoice li:nth-child(2) h2 {
    margin: 0 auto;
    width: auto;
}
#capture {
    text-align: right;
}
.request_user.show_request_user .box_of_request .DetailOfRequest li {
    border: 0;
    display: flex;
    justify-content: center;
}
.tablePreInvoice span {
    display: flex;
    width: 100%;
    justify-content: center;
}
.request_user.show_request_user .box_of_request .DetailOfRequest span {
    margin: -2px 9px 0 0;
}
.request_user.SelectServiceFeature .descritpion_feature {
    display: block !important;
    font-size: 14px;
    margin: 9px 0 0 0;
    float: right;
    width: 100%;
    text-align: center;
}
.request_user.SelectServiceFeature .request_user_box .list_of_option.base input {
    cursor: no-drop;
}
.calc_price.fixed {
    position: fixed;
    bottom: -23px;
    right: 0;
    z-index: 999;
    background: #daeae9;
    transition: 0.5s;
}
.download_pre_invoice {
    position: fixed;
    background: var(--bs-teal);
    padding: 14px 25px;
    top: 135px;
    border-radius: 6px 0 0 6px;
    color: #fff;
    font-size: 13px;
    cursor: pointer;
}
.request_user .request_user_box > p {
    float: right;
    width: 100%;
    color: #000;
    margin: -3px 0 14px 0;
    position: relative;
    z-index: 0;
    font-size: 15px;
    font-weight: 600;
}
.request_user.SelectCat .box_of_request {
    width: 100%;
    box-shadow: none;
    background: transparent;
}
.request_user.SelectCat .request_user_box {
    width: 62%;
}
.request_user.SelectCat .SelectOFCatService.cat_id {
    display: flex;
}
.request_user.SelectCat .SelectOFCatService.cat_id li {
    width: 100%;
    margin: 0 1%;
    border: 0;
    padding: 0;
    position: relative;
}
.request_user.SelectCat .SelectOFCatService.cat_id li img {
    width: 100%;
    border-radius: 0;
    border: 0;
    padding: 0;
}
.request_user.SelectCat .SelectOFCatService.cat_id li:hover , .request_user.SelectCat .SelectOFCatService.cat_id li.active {
    background: transparent;
}
.request_user.SelectCat .SelectOFCatService.cat_id li.active::after {
    position: absolute;
    content: "\f00c";
    font-family: 'Line Awesome Free';
    font-size: 13px;
    background: var(--bs-teal);
    right: -4px;
    top: -11px;
    color: #fff;
    width: 30px;
    height: 30px;
    display: inline-grid;
    align-content: center;
    border-radius: 50%;
}
.request_user.SelectCat .SelectOFCatService.cat_id li:hover img, .request_user.SelectCat .SelectOFCatService.cat_id li.active img {
    background: transparent;
}


.request_user.SelectService {
}
.request_user.SelectService .request_user_box {
    width: 100%;
}
.request_user.SelectService .box_of_request {
    background: transparent;
    box-shadow: none;
    margin: 0;
    padding: 0;
}
.request_user.SelectService .box_of_request .SelectOFCatService.serviceId {
    display: flex;
    width: 100%;
    justify-content: center;
}
.request_user.SelectService .box_of_request .SelectOFCatService.serviceId li {
    width: 20%;
    padding: 0;
    border: 0 !important;
}
.request_user.SelectService .box_of_request .SelectOFCatService.serviceId li img {
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
}
.request_user.SelectService .box_of_request .SelectOFCatService.serviceId li:hover , .request_user.SelectService .box_of_request .SelectOFCatService.serviceId li.active {
    background: transparent;
}
.request_user.SelectService .box_of_request .SelectOFCatService.serviceId li:hover img {
    background: transparent;
}
.request_user.SelectService .next_step {
    display: none;
}


.request_user.SelectService .box_of_request .SelectOFCatService.serviceId li .discount_image {
    position: absolute;
    width: 97px;
    right: 0;
    transform: rotate(38deg);
}
.discount_image_inner {
    float: right;
    width: 40%;
    border-radius: 6px;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    margin: 37px 30% -34px;
}

.calc_price li del {
    display: inline-block;
    font-size: 13px;
    color: #ff0039;
}

.request_user.SelectServiceFeature .request_user_box .list_of_option.base li label {
    font-size: 12px;
    background: #eee;
    color: #000;
}
.request_user.SelectServiceFeature .request_user_box .list_of_option.extra li label {
    font-size: 12px;
}
.request_user.SelectServiceFeature .request_user_box .list_of_option.extra li {
    width: 100%;
}
.request_user.SelectServiceFeature .request_user_box .list_of_option.extra li label:after {
    position: absolute;
    content: "انتخاب";
    width: 41px;
    height: 100%;
    background: #eee;
    top: 0;
    right: 0;
    border-radius: 0 20px 20px 0;
    display: inline-grid;
    align-content: center;
    font-size: 9px;
}
.request_user.SelectServiceFeature .request_user_box .list_of_option.extra li label.active::after , .request_user.SelectServiceFeature .request_user_box .list_of_option.extra li label:hover::after {
    display: none;
}
.alert {
    background: var(--bs-yellow);
    text-align: center;
    margin: 0;
}

.request_user.SelectServiceFeature .calc_price {
    display: none;
}
.request_user.SelectServiceFeature i {
    display: none;
}

body.page-template-get-starated {
    background: #f8fafc;
    font-family: YekanBakh!important;
}
.Get_started_Header {
    position: fixed;
    width: 100%;
    background: #fff;
    box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.05);
    border-radius: 0 0 20px 20px;
    padding: 13px 0;
    z-index: 99;
}
.Get_started_Header .logo {
    float: right;
    width: 71px;
}
.Get_started_Header .logo img {
    float: right;
    width: 100%;
}
.Get_started_Header .hints {
    float: left;
    margin: 0;
    padding: 0;
    list-style: none;
}
.Get_started_Header .hints li {
    float: right;
}
.Get_started_Header .hints li a {
    font-size: 27px;
    color: var(--first);
    line-height: 0;
}
.Get_started_Header .row {
    align-items: center;
}

.Get_start.First_section {
    float: right;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 150px 8% 100px;
    flex-direction: column;
}
.Get_start.First_section .box_text {
    float: right;
    width: 100%;
    display: flex;
    flex-direction: column;
}
.Get_start h1 {
    float: right;
    width: 100%;
    font-size: 22px;
    text-align: center;
    font-weight: 600;
    font-family: iranyekanfan;
    color: var(--bs-primary);
}
.Get_start p {
    float: right;
    width: 100%;
    text-align: center;
    font-size: 13px;
    color: #333;
    margin: 5px 0 15px 0;
}
.Get_start.First_section .box_text #get_start_register {
    float: right;
    width: 80%;
    margin: 11px 10% 0;
    position: relative;
}
.Get_start.First_section .box_text #get_start_register #mobile {
    width: 100%;
    height: 50px;
    border: 1px solid #eee;
    border-radius: 50px;
    font-family: iranyekanfan;
    font-size: 22px;
    letter-spacing: 5px;
}
.Get_start.First_section .box_text #get_start_register #mobile::placeholder {
    font-size: 13px;
    letter-spacing: 0;
}
.Get_start.First_section .box_text #get_start_register .btn {
    position: absolute;
    width: 100px;
    left: 10px;
    top: 6px;
    margin: 0;
    height: 38px;
    padding: 0;
    font-size: ;
    background: var(--first);
    font-weight: normal;
    font-size: 11px;
    border-radius: 50px;
}

.jibPFy {
    display: flex;
    flex-direction: column;
    -moz-box-pack: center;
    justify-content: center;
    -moz-box-align: center;
    align-items: center;
    margin: 50px 0px;
    align-self: center;
}
.DykGo {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 1px solid rgb(209, 209, 214);
}
.jEEywD {
    width: 1px;
    height: 125px;
    background: rgb(209, 209, 214) none repeat scroll 0% 0%;
    margin-top: 10px;
}
.iPexDg {
    border-color: rgb(209, 209, 214);
    border-style: solid;
    border-image: none 100% / 1 / 0 stretch;
    border-width: 0px 1px 1px 0px;
    display: inline-block;
    padding: 7px;
    transform: rotate(45deg);
}
.Get_start.First_section .box_text #get_start_register .btn:hover {
    background: var(--bs-teal);
}
.Get_start {
    float: right;
    width: 100%;
    text-align: center;
    padding: 80px 0;
}

.show_if_active {
    height: 0;
    overflow: hidden;
    padding: 0;
}
.show_if_active.active {
    height: auto;
    overflow: unset;
    padding: 80px 0 150px;
}

.Get_start.First_section .box_text #get_start_register.complate .btn {
    display: none;
}
.Get_start.First_section .box_text #get_start_register.complate #mobile {
    width: 100%;
    text-align: center;
    font-size: 30px;
    font-family: iranyekanfan;
    color: var(--bs-gray);
    background: transparent;
    box-shadow: none;
    border: 0;
    letter-spacing: 4px;
}

.GS_SelectService {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    display: flex;
    justify-content: center;
    margin: 19px 0 0 0;
}
.GS_SelectService li a {
    width: 141px;
    background: #fff;
    box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 5px;
    border-radius: 10px;
    margin: 0 12px;
    opacity: 0.8;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 37px 0px;
    flex-direction: column;
    text-decoration: none;
    transition: 0.5s;
    position: relative;
    border: 1px solid #eee;
}
.GS_SelectService li img {
    display: block;
    width: 38px;
    margin: 0 auto 11px;
}
.GS_SelectService li {
    display: block;
}
.GS_SelectService li a span {
    display: block;
    width: 100%;
    font-size: 15px;
    color: var(--bs-gray-dark);
    font-weight: 500;
}
.GS_SelectService li a:hover, .GS_SelectService li a.active {
    background: rgb(22, 120, 242) none repeat scroll 0% 0%;
    transition: 0.5s;
    opacity: 1;
}
.GS_SelectService li a:hover span , .GS_SelectService li a.active span {
    color: #fff;
}
.GS_SelectService li a:hover img , .GS_SelectService li a.active img {

    filter: brightness(0) invert(1);
}
.LadingNow {
    background: var(--bs-warning);
    padding: 10px;
    border-radius: 50px;
    opacity: 0.7;
    width: 100px;
    margin: 0 auto;
    display: inline-grid;
    align-content: center;
    justify-content: center;
}

.Get_start#s_3 {
}
.Get_start#s_3 .BOX_OF_Service_Option {
    padding: 0;
    margin: 0;
}
.Get_start#s_3 .BOX_OF_Service_Option .item_of_option {
    padding: 0;
    margin: 0;
}
.Get_start#s_3 .BOX_OF_Service_Option .item_of_option .calc_price {
    display: none;
}
.Get_start#s_3 .BOX_OF_Service_Option .item_of_option .col-md-6 {

    background: transparent;
    box-shadow: none;
    padding: 0;
    margin: 0 0 30px 0!important;
}
.Get_start#s_3 .BOX_OF_Service_Option .item_of_option .col-md-6 .title {
    float: right;
    width: 100%;
    text-align: right;
    text-align: center;
    font-size: 16px;
    font-family: yekanbakh;
    font-weight: 500;
    color: #333;
    font-weight: 600;
}
.Get_start#s_3 .BOX_OF_Service_Option .item_of_option .col-md-6 .descritpion_feature {
    display: block !important;
    font-size: 13px;
    margin: 0;
}

.Get_start#s_3 .BOX_OF_Service_Option .item_of_option .col-md-6 .list_of_option {
    float: right;
    width: 98%;
    display: flex;
    flex-wrap: wrap;
    padding: 10px;
    justify-content: center;
    border: 1px solid #eee;
    margin: 13px 1% 0;
    border-radius: 10px;
    box-shadow: 0 0 10px #eee;
}
.Get_start#s_3 .BOX_OF_Service_Option .item_of_option .col-md-6 .list_of_option li {
    float: right;
    background: #fff;
    box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 10px;
    padding: 0px 6px;
    width: 49%;
    margin: 5px 0.5%;
    border-radius: 33px;
    position: relative;
}
.Get_start#s_3 .BOX_OF_Service_Option .item_of_option .col-md-6 .list_of_option li label {
    border: 0;
    font-size: 12px;
    font-family: yekanbakh;
    font-weight: 500;
    color: #333;
}
.Get_start#s_3 .BOX_OF_Service_Option .item_of_option .col-md-6 .list_of_option li input {
    display: none;
}
.Get_start#s_3 .BOX_OF_Service_Option .item_of_option .col-md-6 .list_of_option li p {
    display: none;
}
.Get_start#s_3 .BOX_OF_Service_Option .item_of_option .col-md-6 .list_of_option.base li {
    background: var(--bs-primary);
    opacity: 0.9;
}

.Get_start#s_3 .BOX_OF_Service_Option .item_of_option .col-md-6 .list_of_option.base li label {
    color: #fff;
}
.Get_start#s_3 .BOX_OF_Service_Option .item_of_option .col-md-6 .list_of_option li i {
    display: none;
}
.BOX_OF_Service_Option .item_of_option .col-md-6 .list_of_option.extra li:hover , .Get_start#s_3 .BOX_OF_Service_Option .item_of_option .col-md-6 .list_of_option.extra li.active {
    background: var(--first) !important;
}
.BOX_OF_Service_Option .item_of_option .col-md-6 .list_of_option.extra li:hover label, .Get_start#s_3 .BOX_OF_Service_Option .item_of_option .col-md-6 .list_of_option.extra li.active label {
    color:#fff!important;
}
.Get_start#s_3 .BOX_OF_Service_Option .item_of_option .col-md-6 .list_of_option.extra li , .Get_start#s_3 .BOX_OF_Service_Option .item_of_option .col-md-6 .list_of_option.extra li label {
    cursor: pointer;
}
.Get_start#s_3 .BOX_OF_Service_Option .item_of_option .col-md-6 .list_of_option.extra li label input {
    position: absolute;
    display: block !important;
    width: 100%;
    height: 100%;
    top: 0;
    cursor: pointer;
    opacity: 0;
}


.Finish_and_show_invoice {
    display: inline-block;
    background: var(--bs-teal);
    font-size: 17px;
    padding: 11px 50px;
    border-radius: 50px;
    color: #fff;
    font-size: 13px;
    margin: 7px 0 0 0;
    box-shadow: 0 0 10px #ccc;
    cursor: pointer;
    transition: 0.5s;
}
.Finish_and_show_invoice:hover {
    background: var(--first);
}

.show_pre_invoice {
    float: right;
    width: 100%;
}
.show_if_active.active#s_4 {
    padding: 0 0 100px 0;
    min-height: 80vh;
}
.show_pre_invoice .header_of_invoice {
    padding: 0;
    margin: 0;
}
.show_pre_invoice .header_of_invoice li:nth-child(1) {
    justify-content: right;
    display: flex;
}
.show_pre_invoice .header_of_invoice li span {
    font-size: 14px;
    font-weight: 500;
    color: #333;
}
.show_pre_invoice .header_of_invoice span b {
    font-size: 13px;
    font-family: iranyekanfan;
    color: var(--first);
    margin: 0 6px 0 0;
}
.show_pre_invoice .header_of_invoice h2 {
    font-size: 21px;
    font-weight: 600;
}
.show_pre_invoice .header_of_invoice h2 span {
    font-size: 22px;
    font-weight: 600;
    color: var(--second);
}
.show_pre_invoice .box_of_request {
    float: right;
    width: 100%;
}
.show_pre_invoice .DetailOfRequest {
    float: right;
    width: 100%;
    display: flex;
    background: #fff;
    box-shadow: 0 0 20px #eee;
    padding: 0;
    margin: 22px 0 9px 0;
}
.show_pre_invoice .DetailOfRequest b {
    font-size: 12px;
    font-weight: 500;
    color: #555;
}
.show_pre_invoice .DetailOfRequest span {
    font-family: iranyekanfan;
    font-weight: 600;
    margin: 0 4px 0 0;
}
.show_pre_invoice .tablePreInvoice {
    box-shadow: 0 0 10px #eee;
    border-radius: 5px;
}
.show_pre_invoice .tablePreInvoice th {
    background: var(--bs-white) !important;
    border: 1px solid #eee;
    font-family: yekanbakh !important;
    font-size: 15px;
    font-weight: 600;
}
.show_pre_invoice .tablePreInvoice td {
    font-family: iranyekanfan !important;
    font-size: 13px;
    color: #555;
}
.show_pre_invoice .base_of_option {
    display: none;
}

.export_pdf_now {
    float: right;
    margin: 23px 0 0 0;
    background: var(--bs-warning);
    padding: 10px 57px;
    font-size: 13px;
    border-radius: 50px;
    font-weight: 500;
    color: #333;
    cursor: pointer;
    text-decoration: none;
}
.export_pdf_now:hover {
    background: var(--first);
    color: #fff;
}

.show_if_active.active#s_3{
    padding-bottom:0!important; ;
}

.Get_started_Header .Step_OF_Request {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
    align-content: center;
}
.Get_started_Header .Step_OF_Request li {
    width: 155px;
    font-size: 13px;
    position: relative;
    padding: 0 14px 0 0;
    color: #a7a7be;
    font-weight: 500;
}
.Get_started_Header .Step_OF_Request li:after {
    position: absolute;
    content: "";
    width: 10px;
    height: 10px;
    background: #e3e8f7;
    border-radius: 50px;
    right: 0;
    top: 4px;
}
.Get_started_Header .Step_OF_Request li:before {
    position: absolute;
    content: "";
    width: 86%;
    height: 2px;
    background: #e3e8f7;
    top: 46%;
    right: 15px;
}
.Get_started_Header .Step_OF_Request li:last-child::before {
    display: none;
}
.Get_started_Header .Step_OF_Request li span {
    position: relative;
    background: #fff;
    padding: 0 0 0 5px;
}
.Get_started_Header .Step_OF_Request li.active {
    color: var(--bs-blue);
}
.Get_started_Header .Step_OF_Request li.active:after ,.Get_started_Header .Step_OF_Request li.active:before {
    background: var(--bs-blue);
}
.show_if_active.active#s_4 .DetailOfRequest li {
    justify-content: center;
    display: flex;
}
.GS_SelectService li a .tag {
    position: absolute;
    background: var(--bs-warning);
    width: 60px;
    border-radius: 50px;
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #333;
    top: -7px;
}
.description_package {
    margin: 31px 0 0 0 !important;
    color: #999 !important;
}

.Get_start#s_3 .BOX_OF_Service_Option .item_of_option .col-md-6 .list_of_option.extra li:after {
    position: absolute;
    content: "انتخاب";
    font-size: 11px;
    background: var(--bs-warning);
    right: 17px;
    color: #555;
    padding: 3px 12px;
    border-radius: 18px;
    top: -9px;
}
.Get_start#s_3 .BOX_OF_Service_Option .item_of_option .col-md-6 .list_of_option.extra li.active::after {
    display: none;
}

.Box_Register {
    float: right;
    width: 60%;
    margin: 38px 20% 80px 0;
    border-top: 1px solid #eee;
    padding: 34px 0 0 0;
}
.Box_Register h3 {
    float: right;
    width: 100%;
    font-size: 18px;
    color: #333;
    font-weight: 500;
    margin: 0 0 22px 0;
}
.Box_Register #form-register_get_started {
    float: right;
    width: 100%;
    display: flex;
    align-items: center;
}
.Box_Register .form-group {
    float: right;
    width: 150%;
}
.Box_Register .form-group .form-control {
    font-size: 13px;
    border-radius: 7px;
}
.Box_Register .btn {
    margin: 13px 0 0 0;
    background: var(--bs-teal);
    border-radius: 10px;
    height: 44px;
    font-size: 12px;
    font-weight: normal;
}
.show_if_active.active #s_3 {
    min-height: 80vh;
}

p {
}
.Get_start.First_section .Hints {
    float: right;
    display: flex;
    justify-content: center;
    background: var(--bs-warning);
    border-radius: 50px;
    margin: 23px 0 0;
    align-items: center;
    padding: 10px 31px;
    font-size: 16px;
    color: #333;
}
.Get_start.First_section .Hints .call_now {
    display: inline-block;
    background: #fff;
    font-size: 14px;
    text-decoration: none;
    color: #222;
    padding: 3px 20px;
    border-radius: 50px;
    margin: 0 8px 0 0;
    font-weight: 600;
}
.Get_start.First_section .Hints p {
    margin: 0;
}

.GS_SelectService li .ReadMore {
    display: inline-block;
    font-size: 10px;
    background: #eee;
    padding: 5px 20px;
    border-radius: 18px;
    margin: 9px 0 0 0;
    cursor: pointer;
    position: relative;
    z-index: 999;
}
.GS_SelectService li .ReadMore:hover {
    background: var(--bs-warning);
}

.Content_readMore {
    position: fixed;
    width: 700px;
    height: 400px;
    right: calc(50% - 350px);
    top: calc(50% - 200px);
    background: #fff;
    box-shadow: 0 0 24px #ccc;
    border-radius: 6px;
    color: #000;
    padding: 20px;
    z-index: 999999;
    display: none;
    overflow: auto;
}
.Content_readMore p {
    color: #333;
    text-align: justify;
    font-size: 15px;
    line-height: 2;
}
.Content_readMore.active {
    display: block;
}

.Content_readMore h2 {
    font-size: 20px;
    color: var(--bs-blue);
    font-weight: 600;
    border-bottom: 1px solid #eee;
    padding: 0 0 5px 0;
}
.Content_readMore .close_box {
    position: absolute;
    bottom: 5px;
    background: var(--bs-teal);
    width: 95%;
    color: #fff;
    font-size: 14px;
    padding: 10px 0;
    border-radius: 50px;
    right: 2.5%;
    cursor: pointer;
}
.Content_readMore .close_box:hover {
    background: var(--bs-red);
}
.Content_readMore .content_div {
    float: right;
    width: 100%;
    height: 266px;
    overflow: auto;
    padding: 20px;
    margin: 3px 0 0 0;

}
.GS_SelectService li a .click {
    font-size: 10px;
    background: var(--bs-primary);
    color: #fff;
    display: inline-block;
    padding: 2px 11px;
    border-radius: 20px;
    margin: 2px 0 0 0;
}

.tableInvoice {
    float: right;
    width: 100%;
    margin: 37px 0 0 0;
    background: #fff;
}
.tableInvoice th , .tableInvoice td {
    border: 1px solid #eee;
    background: #fff;
    padding: 15px 13px;
    text-align: center;
}
.tableInvoice .form-control {
    border-radius: 0px;
    border: 1px solid #eee;
    background: transparent !important;
    box-shadow: none;
    font-size: 12px;
    border-radius: 6px;
    text-align: center;
}
.tableInvoice th {
    background: #f7f7f7;
    font-size: 12px;
}
#invoice_base_price {
}
.tableInvoice #invoice_qq {
    width: 70px;
}
.tableInvoice #invoice_description {
    width: 220px;
}

#capture {
}
.request_user.show_request_user.show_financial {
    background: #fff;
}
.request_user.show_request_user.show_financial .header_of_invoice {
    border: 1px solid #eee;
    padding: 15px 15px;
    border-radius: 6px;
    background: #f1f1f1;
}
.request_user.show_request_user.show_financial .header_of_invoice b {
    font-size: 14px;
    color: #000;
    font-family: iranyekanfan;
}
.request_user.show_request_user.show_financial .header_of_invoice span {
    font-family: iranyekanfan;
}
.request_user.show_request_user.show_financial .header_of_invoice h2 {
    font-family: iranyekanfan !important;
    font-size: 17px;
    color: #000;
    font-weight: 600;
}
.request_user.show_request_user.show_financial .header_of_invoice h2 span {
    background: transparent;
    color: #000;
    padding: 0;
    font-weight: 700;
}
.request_user.show_request_user.show_financial .Customer_detail {
    float: right;
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 6px;
    padding: 5px 7px;
}
.request_user.show_request_user.show_financial .Customer_detail .title {
    float: right;
    background: #ebebeb;
    width: auto;
    font-family: iranyekanfan !important;
    color: #000;
    font-size: 16px !important;
    font-weight: 600;
    padding: 14px;
    border-radius: 5px;
    margin: 0 0 0 0;
}
.request_user.show_request_user.show_financial .Customer_detail ul {
    float: right;
    width: auto;
    margin: 0 14px 0 0;
    list-style: none;
    padding: 0;
    display: flex;
    height: 51px;
    align-items: center;
}
.request_user.show_request_user.show_financial .Customer_detail ul li {
    margin: 0 0 0 25px;
    font-size: 14px;
    font-family: iranyekanfan !important;
    color: #555;
}
.request_user.show_request_user.show_financial .Customer_detail ul li b {
    color: #000;
}
.request_user.show_request_user.show_financial .tableInvoice {
    margin: 16px 0 0 0;
}

.request_user.show_request_user.show_financial .Customer_detail.bank {
    margin: 17px 0 0 0;
}
.request_user.show_request_user.show_financial .Customer_detail.bank b {
    background: #f3f3f3;
    padding: 6px 16px;
    border-radius: 17px;
}
.request_user.show_request_user.show_financial .Customer_detail.bank li {
    margin: 0 0 0 5px;
}
.request_user.show_request_user.show_financial .tableInvoice th, .request_user.show_request_user.show_financial .tableInvoice td {
    text-align: right;
}
.request_user.show_request_user.show_financial {
    background: #fff;
    min-height: 800px;
    align-content: start;

}
.request_user.show_request_user.show_financial .Customer_detail.desc .description_text {
    float: left;
    margin: 0 10px 0 0;
    min-height: 50px;
    display: flex;
    font-size: 13px;
    align-items: center;
    width: calc(100% - 110px);
}
.request_user.show_request_user.show_financial .Customer_detail.desc .description_text p {
    margin: 0;
}
.request_user.show_request_user.show_financial .Customer_detail.desc {
    margin: 12px 0 0 0;
}

.logo_crm {
    float: right;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    margin: 0 0 -20px 0;
}
.logo_crm img {
    float: right;
    width: 40px !important;
    height: auto !important;
    filter: brightness(0) invert(1);
}
.logo_crm h1 {
    font-size: 21px;
    margin: 0 10px 0 0;
}

.un.used {
    background: var(--bs-green);
}
.used {
    background: #ff0039;
    color: #fff;
    border-radius: 2px;
    display: inline-block;
    padding: 4px 10px 2px;
    font-size: 12px;
    border-radius: 50px;
}
.form-group.forth {
    width: 23%;
}
.DetailOfRequest.full {
    width: 98%;
    background: #deffdd;
}
.login .loginBox .logo_login {
    width: 130px;
}

.title .name {
    font-weight: 500;
    color: #000;
}
.title .date {
    font-size: 13px;
    font-weight: normal;
    background: var(--bs-orange);
    color: #fff;
    padding: 5px 20px;
    border-radius: 50px;
    margin: 0 7px 0 0;
    display: inline-block;
    position: relative;
    top: -2px;
}

.task_descritpion {
    float: right;
    width: 100%;
}
.task_descritpion .row {
    box-shadow: none !important;
}
.task_descritpion h4 {
    float: right;
    width: 100%;
    font-size: 20px;
    border-bottom: 1px solid #eee;
    padding: 10px;
    color: var(--bs-blue);
}
.task_descritpion .text {
    float: right;
    width: 100%;
    padding: 10px;
    font-size: 15px;
    line-height: 2;
    color: #181818;
}

.add_note_report {
    float: right;
    width: 100%;
    margin: 12px 0 0 0;
}
.add_note_report #log_description:focus {
    height: 100px;
    transition: 0.5s;
}


.search_box {
    float: right;
    width: 100%;
    padding: 15px;
    background: #f0f3f8;
    border-radius: 6px;
    margin: 0 0 13px 0;
    cursor: pointer;
}
.search_box h4 {
    float: right;
    width: 100%;
    text-align: center;
    font-size: 17px;
    position: relative;
    margin: 0;
}
.search_box h4:after {
    position: absolute;
    content: "";
    width: 100%;
    height: 1px;
    background: #ccc;
    right: 0;
    top: 0;
    top: 50%;
}
.search_box h4 span {
    display: inline-block;
    position: relative;
    background: #f2f5fa;
    z-index: 9;
    padding: 0 19px;
}
.search_box form {
    float: right;
    width: 100%;
    display: none;
}
.search_box.active form {
    display: flex;
}
.search_box form .form-group .select2.select2-container {
    width: 100% !important;
    height: ;
}
.search_box form .form-group .select2.select2-container .selection .select2-selection {
    height: 40px;
    border-radius: 30px;
    display: flex;
    align-content: center;
    align-items: center;
}
.search_box form .btn {
    width: 20%;
    height: 40px;
    margin: 43px 0 0 0;
}

.select2-container--default .select2-selection--single {
    height: 40px;
    border-radius: 50px;
    padding: 6px;
}


.list_of_access li.list_user {
    width: 98%;
    border: ;
}
.list_of_access li.list_user .form-group >  span {
    float: right;
    width: 100%;
    font-weight: 500;
}
.list_of_access li.list_user .select2.select2-container.select2-container--default {
    width: 100% !important;
    height: ;
}
.list_of_access li.list_user .select2.select2-container.select2-container--default .select2-selection.select2-selection--multiple {
    height: 49px;
    border-radius: 50px;
    margin: 8px 0 0 0;
}

.ImReadAndAccept {
    float: left;
    background: var(--bs-teal);
    color: #fff;
    padding: 10px 0;
    margin: 15px 0 0 0;
    border-radius: 50px;
    cursor: pointer;
    width: 100%;
    text-align: center;
}
.ImReadAndAccept:hover {
    background: var(--bs-green);
}

.content.no_back .row {
    background: transparent;
    box-shadow: none;
    padding: 0 !important;
}

.list_of_read {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 21px 0 0 0;
}
.list_of_read li {
    float: right;
}
.list_of_read li span {
    float: right;
    background: var(--bs-yellow);
    font-size: 13px;
    padding: 6px 25px;
    border-radius: 50px;
    margin: 0 0 0 10px;
}

.select2-selection.select2-selection--single {
    height: 40px;
    border-radius: 50px;
    border: 1px solid #ccc;
    box-shadow: 0 0 10px rgba(0,0,0,0.09);
}
.description_project {
    float: right;
    width: 100%;
}
.description_project ul {
    display: inline-block;
    width: 100%;
    padding: 0;
    list-style: none;
    padding: 0;
    margin: 0;
    position: relative;
    z-index: 9;
}
.description_project ul li {
    float: right;
    width: 33.3333%;
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
    justify-content: center;
}
.description_project ul span {
    font-size: 12px;
    color: #000;
    width: 100%;
    text-align: center;
    font-size: 12px !important;
}
.description_project ul b {
    font-size: 12px;
    color: var(--fourth);
    float: right;
    width: 50px;
    font-family: iranyekanfan;
    height: 50px;
    border: 1px solid #ccc;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px !important;
    font-weight: normal;
    background: #fff;
    margin: 0 0 5px 0;
}
.description_project ul li:nth-child(2) {
    text-align: center;
}
.description_project ul li:last-child {
    text-align: left;
}
.Main .content.Project .row {
    background: transparent;
    box-shadow: none;
    padding: 0;
}
.description_project.showProject {
    background: #fff;
    margin: 7px 0 0 0;
    border-radius: 6px;
    padding: 20px !important;
}


.customer_auth_page {
    float: right;
    width: 100%;
    height: 100vh;
}
.customer_auth_page .col-md-6 {
    height: 100vh;
}
.customer_auth_page .col-md-6.image {
    background-size: cover;
    position: relative;
}
.customer_auth_page .col-md-6.image:after {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    background: var(--first);
    right: 0;
    top: 0;
    opacity: 0.3;
}
.customer_auth_page .row {
    align-items: center;
}



.box_of_login_auth_forget {
    float: right;
    width: 70%;
    margin: 0 15%;
    text-align: center;
    display: inline-grid;
    align-content: center;
    height: 100vh;
}
.box_of_login_auth_forget #logo {
    width: 200px;
    margin: 0 auto;
}
.box_of_login_auth_forget .box_of_step_login_auth_forget {
    float: right;
    width: 100%;
    display: none;
}
.box_of_login_auth_forget .box_of_step_login_auth_forget.active {
    display: block;
}
.box_of_login_auth_forget .box_of_step_login_auth_forget h2 {
    float: right;
    width: 100%;
    font-size: 20px;
    font-weight: 500;
    color: var(--first);
    margin: 8px 0 9px 0;
}



.nav_of_step_login_auth_forget {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 9px 0 0 0;
}
.nav_of_step_login_auth_forget li {
    float: right;
    width: 50%;
}
.nav_of_step_login_auth_forget li:first-child div {
    float: right;
    border: 1px solid #ccc;
    color: #444;
    font-size: 13px;
    padding: 10px 30px;
    border-radius: 50px;
    cursor: pointer;
}
.nav_of_step_login_auth_forget li:last-child div {
    float: left;
    padding: 10px 0;
    color: #ff0039;
    font-size: 13px;
    cursor: pointer;
}

body form.customer_form .form-control {
    border: 0;
    border-bottom-color: currentcolor;
    border-bottom-style: none;
    border-bottom-width: 0px;
    border-bottom-color: currentcolor;
    border-bottom-style: none;
    border-bottom-width: 0px;
    border-bottom-color: currentcolor;
    border-bottom-style: none;
    border-bottom-width: 0px;
    box-shadow: none !important;
    border-bottom: 1px solid #ccc;
    border-radius: 0 !important;
    font-family: iranyekan !important;
}


.VerifyAgain {
    float: left;
    margin: 12px 0 -8px 0;
}
.VerifyAgain .timer {
    float: right;
    font-size: 14px;
    border: 1px solid #eee;
    padding: 4px 20px;
    border-radius: 0 6px 6px 0;
    font-family: iranyekanfan !important;
    color: #666;
}
.VerifyAgain .resend_again {
    float: right;
    font-size: 13px;
    background: var(--first);
    color: #fff;
    padding: 4px 25px;
    border: 1px solid var(--first);
    border-radius: 6px 0 0 6px;
    opacity: 0.4;
    cursor: no-drop;
}
.VerifyAgain .resend_again.active {
    opacity: 1;
    cursor: pointer;
}


.NotifUser {
    float: left;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    margin: 9px 0 0 8px;
    position: relative;
}
.NotifUser .list_of_notif {
    position: absolute;
    width: 400px;
    left: 0;
    top: 100%;
    z-index: 999999;
    background: #fff;
    box-shadow: 0 0 10px rgba(0,0,0,0.09);
    border-radius: 7px;
    padding: 20px;
    list-style: none;
    margin: 0;
    display: none;
    max-height: 300px;
    overflow: auto;
}
.NotifUser .icon {
    background: var(--bs-warning);
    width: 40px;
    height: 40px;
    border-radius: 50px;
    font-size: 20px;
    color: #000;
    text-align: center;
    align-content: center;
    display: inline-grid;
    border: ;
    cursor: pointer;
}
.NotifUser:hover .list_of_notif , .NotifUser.active .list_of_notif {
    display: block;
}
.NotifUser .list_of_notif li {
    float: right;
    width: 100%;
    border-bottom: 1px solid #eee;
    padding: 10px;
}
.NotifUser .list_of_notif li .head_notif {
    float: right;
    width: 100%;
    cursor: pointer;
}
.NotifUser .list_of_notif li .head_notif h3 {
    float: right;
    width: calc(100% - 20px);
    font-size: 17px;
    color: var(--bs-blue);
}
.NotifUser .list_of_notif li .description {
    width: 100%;
    padding: 10px;
    text-align: justify;
    font-size: 14px;
    display: none;
}
.NotifUser .list_of_notif li.active .description {
    display: block;
}


.content.Notif .row {
    background: transparent;
    box-shadow: none;
    padding: 0;
    margin: 0;
}
.content.Notif .list_of_notif {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0px 0 -18px 0;
}
.content.Notif .list_of_notif li {
    float: right;
    width: 98%;
    background: #eefefd;
    background-color: rgb(238, 254, 253);
    padding: 0px 5px;
    border-radius: 6px;
    margin: 0 1% 5px 0;
}
.content.Notif .list_of_notif li .head_notif {
    float: right;
    width: 100%;
    padding: 10px 0;
    cursor: pointer;
}
.content.Notif .list_of_notif li .head_notif h3 {
    float: right;
    width: calc(100% - 17px);
    font-size: 16px;
    margin: 0;
    display: flex;
    align-items: center;
}
.content.Notif .list_of_notif li .head_notif h3 i {
    font-size: 24px;
}
.content.Notif .list_of_notif li .description {
    background: rgba(255,255,255,0.2);
    border-radius: 6px;
    display: none;
    margin: 0 0 12px 0;
}
.content.Notif .list_of_notif li.active .description{
    display: block;
}
.content.Notif {
    padding: 8px 275px 16px 29px !important;
}

.Calc_sharge_account {
    float: left;
    width: 33.3%;
    list-style: none;
    padding: 0;
    margin: 41px 0 0 0;
    text-align: center;
    border: 1px solid #eee;
    border-radius: 18px;
    height: 45px;
}
.Calc_sharge_account li {
    width: 80%;
    float: right;
    font-size: 13px;
    padding: 12px 10px;
    color: #444;
}
.Calc_sharge_account li:first-child {
    color: #fff;
    width: 20%;
    border-radius: 10px;
    background: #7bacf8;
}
.Calc_sharge_account li:last-child {
    border-right: 1px solid #eee;
}
.list_of_data li .delete_order {
    font-size: 23px;
    color: #777;
    cursor: pointer;
}

.PaymentOrderWithCustomer {
    float: left;
    margin: 9px 0 0 0;
    background: var(--bs-teal);
    color: #fff;
    padding: 10px 100px;
    border-radius: 50px;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    cursor: pointer;
}
.Payment.Faild {
    float: right;
    width: 100%;
    background: #ff0039;
    margin: 24px 0 0 0;
    border-radius: 6px;
    text-align: center;
    color: #fff;
    padding: 10px;
}

.list_of_data li .success, .list_of_data li .error {
    background: var(--bs-teal);
    font-size: 10px;
    color: #fff;
    padding: 2px 10px;
    border-radius: 50px;
    margin: 0 1px;
}
.list_of_data li .error {
    background: #ff0039;
}

.list_of_data li .DeleteOrderNow {
    font-size: 25px;
    color: #ff0039;
    text-decoration: none;
}
.list_of_data li .PaymentOrderNow {
    font-size: 24px;
    color: var(--bs-info);
}


.email_account {
    border: 1px solid #eee;
    padding: 10px;
    width: 98%;
    float: right;
    border-radius: 5px;
    margin: 9px 1% 0 0;
    background: #fafafa;
    position: relative;
}
.email_account .remove_email {
    position: absolute;
    left: -7px;
    background: #f03a3ae6;
    font-size: 16px;
    border-radius: 50px;
    top: -5px;
    cursor: pointer;
    color: #fff;
    padding: 0;
    line-height: 0;
    padding: 4px;
}
.add_email_btn {
    float: right;
    color: var(--bs-blue);
    font-size: 14px;
    padding: 10px;
    border-radius: 6px;
    margin: 14px 0 0 1%;
    cursor: pointer;
    text-decoration: underline;
}
.list_of_data li .Show_account_detail {
    font-size: 20px;
    color: var(--bs-indigo);
}

.customer_form .select2.select2-container.select2-container--default .selection .select2-selection.select2-selection--single {
    border: 0 !important;
    border-bottom-color: currentcolor;
    border-bottom-style: none;
    border-bottom-width: 0px;
    box-shadow: none;
    border-bottom: 1px solid #ccc !important;
    border-radius: 0 !important;
    height: 43px;
    font-size: 15px;
}

.request_new_account {
    float: right;
    width: 100%;
    border: 1px solid #eee;
    padding: 10px;
    margin: 11px 0 0 0;
    border-radius: 6px;
}
.request_new_account h4 {
    color: var(--first);
    font-size: 18px;
    font-weight: 500;
}

.Select_package {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 8px 0 0 0;
    display: flex;
}
.Select_package > li {
    width: 100%;
    margin: 0 1%;
    background: #fff;
    border: 3px solid #ccc;
    padding: 10px;
    border-radius: 5px;
    position: relative;
    text-align: center;
}
.Select_package > li > input {
    position: absolute;
    width: 100%;
    height: 100%;
    right: 0;
    top: 0;
    cursor: pointer;
    opacity: 0;
}
.Select_package > li .per {
    display: inline-block;
    margin: 0 auto;
    text-align: center;
    background: #eee;
    font-size: 13px;
    padding: 4px 10px;
    border-radius: 50px;
    float:right;
}
.Select_package > li h2 {
    float: right;
    width: 100%;
    text-align: center;
    font-size: 22px;
    font-weight: 500;
    color: var(--first);
}
.Select_package .desc {
    float: right;
    width: 100%;
    font-size: 14px;
    text-align: right;
}
.Select_package > li:hover,.Select_package > li.active {
    border: 2px solid var(--bs-yellow);
    position:relative;
}


.Select_package > li.disabled {
    opacity: 0.5;
    cursor: no-drop;
}
.Select_package > li.disabled:hover , .Select_package > li.disabled.active {
    border: 3px solid #eee;
}
.more_desc {
    display: inline-flex;
    width: 23px;
    height: 23px;
    position: relative;
    font-size: 18px;
    border-radius: 50px;
    text-align: center;
    display: inline-grid;
    align-content: center;
    color: #333;
    cursor: pointer;
    border: 1px solid #ccc;
    z-index: 99;
}
.more_desc .DescriptionMore {
    position: absolute;
    width: 200px;
    background: var(--bs-yellow);
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    font-size: 12px;
    bottom: 100%;
    padding: 10px;
    border-radius: 10px;
    display: none;
}
.more_desc:hover .DescriptionMore {
    display: block;
}

.form-group.half.Charge #account_amount {
    float: right;
    width: 80%;
}
.form-group.half.Charge #account_currency {
    float: right;
    width: 20%;
    background: var(--bs-warning);
    text-align: center;
    border-radius: 10px !important;
    appearance: button;
    position: relative;
}
body form.customer_form .form-control::placeholder {
    font-size: 12px;
}


.Guid_charge:hover {
    background: #181818;
    color: #fff;
}
.Guid_charge {
    float: left;
    border: 1px solid var(--bs-blue);
    color: var(--bs-blue);
    font-size: 13px;
    padding: 9px 31px;
    border-radius: 25px;
    margin: -3px 0 0 11px;
    cursor: pointer;
}


.guid_detail {
    float: right;
    width: 100%;
    padding: 20px;
    font-size: 14px;
    line-height: 2;
    text-align: justify;
}
.guid_detail h2 {
    float: right;
    width: 100%;
    font-size: 22px;
    text-align: center;
    color: var(--bs-blue);
}
.guid_detail .close_popup {
    float: right;
    width: 100%;
    background: var(--bs-blue);
    text-align: center;
    color: #fff;
    margin: 7px 0 0 0;
    padding: 5px 0;
    border-radius: 5px;
    cursor: pointer;
}



.BOx_of_Invocie {
    float: right;
    width: 100%;
}
.BOx_of_Invocie .List_of_detail {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
}
.BOx_of_Invocie .List_of_detail li {
    width: 23%;
    float: right;
    background: #fff;
    border-radius: 10px;
    margin: 0 1% 5px 1%;
    padding: 0;
    border: 1px solid #0c3da0;
    padding: 3px;
}

.BOx_of_Invocie .List_of_detail li span {
    background: #D9E9F2;
    color: #000;
    width: 106px;
    float: right;
    padding: 7px;
    border-radius: 10px;
    font-size: 12px;
    text-align: center;
}
.BOx_of_Invocie .List_of_detail li b {
    width: calc(100% - 106px);
    float: right;
    height: 33px;
    display: inline-grid;
    align-content: center;
    padding: 0 12px;
    font-size: 13px;
    color: #181818;
    font-family: iranyekanfan !important;
    text-align: center;
    font-weight: normal;
    overflow: hidden;
}
.BOx_of_Invocie .List_of_detail li b .notpayment {
    background: #f45353;
    width: auto;
    font-size: 10px !important;
    padding: 5px 18px;
    margin: 0 auto;
    display: block;
    float: none;
    color:#fff;
}
.List_of_detail.detail_invoice li {
    width: 31.3%;
    margin: 0 1% 2px;
    padding: 3px;
}
.List_of_detail.detail_invoice li .email_list {
    float: right;
    width: 100%;
    height: 30px;
    padding: 0;
    font-size: 12px;
    text-align: center;
    border: 0;
    box-shadow: none !important;
    appearance: button;
    text-align: center;
}

.list_of_data.invoice_page {
    width: 98%;
    margin: 3px 1% 2px;
    box-shadow: none !important;
    border: 1px solid #0c3da0;
    padding: 5px 0;
}
.list_of_data.head.invoice_page {
    padding: 10px;
    font-size: 14px;
    font-weight: normal;
    border: 0;
}


.request_official_bill {
    float: right;
    display: flex;
    align-items: center;
    align-content: center;
    margin: 13px 1% 0 0;
    cursor: pointer;
}
.request_official_bill p {
    font-size: 16px;
    margin: 2px 6px 0 0;
    font-weight: 500;
}


.request_bill_official {
    float: right;
    width: 100%;
    padding: 15px;
}
.request_bill_official p {
    float: right;
    width: 100%;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
}
.request_bill_official .invoice_show_bill {
    float: right;
    width: 80%;
    list-style: none;
    padding: 0;
    margin: 0 10%;
}
.request_bill_official .invoice_show_bill li {
    float: right;
    width: 100%;
    padding: 3px;
    border: 1px solid #0c3da0;
    border-radius: 10px;
    margin: 0 0 5px 0;
}
.request_bill_official .invoice_show_bill li span {
    float: right;
    background: #0c3da0;
    color: #fff;
    font-size: 13px;
    padding: 5px 0;
    width: 24%;
    text-align: center;
    border-radius: 6px;
}
.request_bill_official .invoice_show_bill li b {
    float: left;
    font-family: iranyekanfan !important;
    font-size: 14px;
    padding: 5px 0 0 8px;
    text-align: ;
}
.request_bill_official .accept_official_bill {
    float: right;
    width: 100%;
    background: #20c997;
    text-align: center;
    color: #fff;
    padding: 10px 0;
    border-radius: 50px;
    text-decoration: none;
    font-size: 13px;
    margin: 6px 0 0 0;
}

.switch_form_bill_official {
    float: right;
    width: 50%;
    list-style: none;
    padding: 0;
    margin: 0 25%;
}
.switch_form_bill_official li {
    float: right;
    width: 50%;
}
.switch_form_bill_official li .switch_form_bill_official_item {
    float: right;
    width: 100%;
    margin: 0 0;
    background: #eee;
    text-align: center;
    border-radius: 0 50px 50px 0;
    padding: 14px;
    position: relative;
}
.switch_form_bill_official li .switch_form_bill_official_item input {
    position: absolute;
    width: 100%;
    height: 100%;
    right: 0;
    top: 0;
    cursor: pointer;
    opacity: 0;
}
.switch_form_bill_official li .switch_form_bill_official_item span {
    float: right;
    width: 100%;
    font-weight: 500;
}
.switch_form_bill_official li .switch_form_bill_official_item:hover , .switch_form_bill_official li .switch_form_bill_official_item.active {
    background: var(--bs-warning);
}
.switch_form_bill_official li:last-child .switch_form_bill_official_item {
    border-radius: 50px 0 0 50px;
}
.div_form_bill_official {
    float: right;
    width: 100%;
    margin: 19px 0 0 0;
    display: none;
}
.div_form_bill_official.active {
    display: block;
}

.download_form {
    float: right;
    width: 100%;
    background: var(--bs-teal);
    text-align: center;
    color: #fff!important;
    text-decoration: none;
    padding: 10px 0;
    border-radius: 6px;
}

.Allow_law {
    float: right;
    width: 100%;
    text-align: right;
    margin:
            4px 5px 0 0;
    font-size: 14px;
    padding:
            5px;
    border-radius:
            5px;
    display: flex;
}

.TCSection {
    float: right;
    width: 100%;
    display: flex
;
    align-items: center;
    margin: 10px 0 0 0;
    padding: 0 7px 0 0;
}
.TCSection input {
}
.TCSection input {
    color: #0d6efd;
}
.Allow_law .show_law_hdm {
    float: right;
    color: #000;
    font-weight: bold;
    margin: 0 6px 0 6px;
    cursor: pointer;
}

.MenuMobile {
    float: right;
    font-size: 24px;
    line-height: 0;
    background: var(--bs-warning);
    padding: 5px 10px;
    border-radius: 5px;
    margin: 11px 9px 0 0;
    display: none;
    cursor: pointer;
}


.hide_in_desktop{
    display: none;
}
.hide_in_mobile{
    display: flex;
}


body .Charge .select2.select2-container.select2-container--default .selection .select2-selection.select2-selection--single {
    border-bottom: 0 !important;
    border-radius: 10px !important;
    display: flex;
    align-content: center;
    padding: 8px 7px 0 0;
    color: #000;
    background: #fdd662;
}
body .Charge .select2.select2-container.select2-container--default .selection .select2-selection.select2-selection--single .select2-selection__arrow {
    top: 8px;
    left: 4px;
}
body .Charge .select2.select2-container.select2-container--default .selection .select2-selection.select2-selection--single .select2-selection__arrow b {
    border-color: #000 transparent transparent transparent;
}
.Select_package > li .select {
    float: right;
    width: 98%;
    background: var(--bs-yellow);
    font-size: 14px;
    padding: 10px 0;
    border-radius: 50px;
    margin: 10px 0 5px 0;
    position: absolute;
    bottom: 0px;
    right: 1%;
    cursor: pointer;
}

div.sep {
    float: right;
    width: 98%;
    background: var(--second);
    text-align: center;
    border-radius: 5px;
    margin: 20px 1% 0 0;
    padding: 0px 0;
    color: #fff;
}


.password_gen {
    position: relative;
}
.password_gen .password_generator {
    position: absolute;
    bottom: 3px;
    left: 3px;
    background: var(--bs-yellow);
    width: 37px;
    height: 37px;
    border-radius: 50px;
    text-align: center;
    display: inline-grid;
    align-content: center;
    color: #181818;
    font-size: 20px;
    cursor: pointer;
}
.show.ShowPasswordItem {
    cursor: pointer;
    background: var(--bs-danger) !important;
}


.Show_Password_item {
    float: right;
    width: 100%;
    padding: 20px;
}
.Show_Password_item h2 {
    float: right;
    width: 100%;
    text-align: center;
    font-size: 23px;
    font-weight: bold;
    color: var(--bs-blue);
}
.Show_Password_item .host_detail_access {
    float: right;
    width: 100%;
    border: 1px solid #d3d3d3;
    border-radius: 5px;
    padding: 0 20px;
    margin: 15px 0px 8px 0;
}
.Show_Password_item .host_detail_access p {
    float: right;
    margin: -11px 0 0 0;
    background: #fff;
    padding: 0 10px;
}
.Show_Password_item .host_detail_access ul {
    float: right;
    width: 100%;
    margin: 0;
    padding: 11px;
    list-style: none;
}
.Show_Password_item .host_detail_access ul li {
    float: right;
    width: 33.3%;
    position: relative;
}
.Show_Password_item .host_detail_access ul li span {
    float: right;
    width: 100%;
    font-size: 14px;
    margin: 0 0 5px 0;
}
.Show_Password_item .host_detail_access ul li .url {
    float: right;
    width: 93%;
    text-decoration: none;
    overflow: hidden;
    text-align: right;
    background: #eee;
    text-align: center;
    line-height: ;
    padding: 5px 5px 0;
    border-radius: 50px;
}
.Show_Password_item .host_detail_access ul li .username {
    float: right;
    width: 96%;
    background: #eee;
    text-align: center;
    font-weight: normal;
    padding: 5px 5px 0;
    border-radius: 50px;
    direction: ltr;
}
.Show_Password_item .host_detail_access ul li #Copy {
    position: absolute;
    left: 12px;
    bottom: 2px;
    width: 25px;
    background: var(--bs-danger);
    color: #fff;
    height: 25px;
    display: inline-grid;
    align-content: center;
    text-align: center;
    border-radius: 50px;
    cursor: pointer;
}
.Show_Password_item .host_detail_access .description_password {
    float: right;
    width: 100%;
    padding: 10px;
}



.List_of_filter_tab
{
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0 0 18px 0;
    display: flex;
    flex-wrap: nowrap;
}
.List_of_filter_tab li a
{
    float: right;
    background: #fff;
    text-align: center;
    margin: 0 0 0 11px;
    border-radius: 3px;
    padding: 10px 31px 8px;
    font-size: 14px;
    cursor: pointer;
    text-decoration: none;
    color: #181818;
    border: 1px solid #d4d4d4;
    font-size: 13px;
}
.List_of_filter_tab li a:hover, .List_of_filter_tab li a.active{
    background: var(--bs-blue);
    color: #fff;
    font-weight: bold;
    border: 1px solid var(--bs-blue);
}
.pagination {
    float: right;
    width: 100%;
    display: flex;
    margin: 30px 0 10px 0;
    justify-content: center;
}
.pagination span , .pagination a {
    margin: 0;
    background: #eee;
    padding: 6px 20px 2px;
    margin: 0 6px;
    border-radius: 6px;
    line-height: 2;
    text-decoration: none;
    color: #181818 !important;
    cursor: pointer;
    font-family: iranyekanfan !important;
}
.pagination a:hover {
    background: var(--bs-blue);
    color: #fff !important;
}
.pagination span {
    background: var(--bs-warning);
    cursor: no-drop;
    opacity: 0.99;
}

#item-per-page
{
    float: left;
    width: 160px;
    margin: -6px 0 17px 0;
    box-shadow: none;
    background: #f9f9f9;
    border: 0;
    border-bottom-width: 0px;
    border-bottom-style: none;
    border-bottom-color: currentcolor;
    height: 40px;
    padding: 0;
    text-align: center;
    border-radius: 7px;
    box-shadow: inset 0 0 10px rgba(0,0,0,0.15);
    font-size: 13px;
    border-bottom: 3px solid var(--bs-orange);
}


.list_of_data li .badge {
    display: block;
    background: var(--bs-dark);
    width: auto;
    white-space: normal;
    margin: 0 auto;
    font-size: 9px;
    font-weight: normal;
    border-radius: 50px;
}
.list_of_data li.badge_child {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 0;
}
.list_of_data li .data_show {
    font-size: 11px;
    background: var(--bs-secondary);
    color: #fff;
    padding: 4px 0;
    border-radius: 50px;
}
.list_of_data li .EditOrder {
    font-size: 21px;
    color: var(--bs-primary);
}

.list_of_data li .ActionForOrder {
    background: var(--second);
    color: #fff;
    font-size: 13px;
    padding: 3px 16px;
    border-radius: 50px;
    text-decoration: none;
    display: ruby;
}
.list_of_data li i {
    display: inline;
    position: relative;
    top: 2px;
    right: -3px;
}
.BOx_of_Invocie .List_of_detail li span.payment {
    float: right;
    width: 100%;
    font-size: 10px !important;
    padding: 2px;
    background: var(--second);
    color:#fff;
}
.list_of_data li .type_account {
    display: inline-block;
    background: #6c757d;
    font-size: 10px;
    padding: 2px 10px 1px;
    border-radius: 60px;
    color: #fff;
    position: relative;
}
.list_of_data li .type_account .select_package {
    position: absolute;
    width: 100px;
    background: #fff;
    color: #000;
    right: -50%;
    bottom: 107%;
    padding: 4px 10px 0;
    box-shadow: 0 0 10px rgba(0,0,0,0.2);
    border-radius: 5px;
    font-size: 12px;
    display: none;
}
.list_of_data li .type_account:hover .select_package {
    display: block;
}

.BOx_of_Invocie .List_of_detail li b .TypeOfAccount {
    float: right;
    width: 100%;
    font-size: 11px;
    padding: 2px 2px;
    font-weight: normal;
    background: var(--bs-blue);
    color: #fff;
}


.List_of_detail.detail_invoice li .show_email_list_account {
    display: inline-block;
    background: var(--second);
    color: #fff;
    font-size: 12px;
    width: 130px;
    margin: 0 auto;
    border-radius: 50px;
    padding: 3px;
    cursor: pointer;
}

.ListOFEmail {
    float: right;
    width: 100%;
    padding: 20px;
}

.List_of_detail.detail_invoice li .SetAccountID {
    float: right;
    width: 100%;
    font-size: 12px;
    background: var(--bs-cyan);
    color: #fff;
    padding: 2px 2px;
    border-radius: 50px;
    cursor: pointer;
}
#SetAccountIDAjax {
    float: right;
    width: 100%;
    padding: 20px;
}


#messageListOrder {
    float: right;
    width: 100%;
}
#messageListOrder .desc {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
}
#messageListOrder .desc li {
    float: right;
    width: 100%;
}
#messageListOrder .desc li .log_item {
    float: right;
    width: 100%;
    box-shadow: -5px -5px 10px #fff, 5px 10px 10px #f0f0f0, inset 5px 10px 10px #f0f0f0;
    border-radius: 10px;
    margin: 0 0 12px 0;
    text-decoration: none;
}
#messageListOrder .desc li .log_item .contentDescription {
    width: 100%;
    padding: 16px 10px 0;
    float: right;
}
#messageListOrder .desc li .log_item .DetailDescription {
    float: left;
    width: 100%;
    background: var(--bs-warning);
    border-radius: 0 0 10px 10px;
    padding: 2px;
    text-align: center;
    display: flex;
    justify-content: center;
}
#messageListOrder .desc li .log_item .DetailDescription .item_list {
    width: 100%;
    color: ;
    color: #181818;
    font-size: 13px;
}
#messageListOrder .desc li .log_item .contentDescription h3 {
    font-size: 16px;
    color: var(--first);
    float: right;
}
#messageListOrder .desc li .log_item .contentDescription p {
    float: right;
    margin: -5px 5px 0 0;
    font-size: 13px;
    color: #000;
    background: #e5e5e5;
    padding: 3px 10px 0;
    border-radius: 50px;
}

.switch_status {
}
#OrderChangeStatusAjax {
    float: right;
    width: 100%;
}
#OrderChangeStatusAjax .switch_status {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
}
#OrderChangeStatusAjax .switch_status li {
    width: 100%;
    text-align: center;
    position: relative;
    display: flex;
    justify-content: center;
}
#OrderChangeStatusAjax .switch_status li input {
    position: absolute;
    width: 100%;
    height: 100%;
    right: 0;
    top: 0;
    cursor: pointer;
    opacity: 0;
}

#OrderChangeStatusAjax .switch_status li .box_of_item {
    float: right;
    width: 145px;
    background: #eee;
    padding: 15px 0;
    border-radius: 10px;
    position: relative;
}
#OrderChangeStatusAjax .switch_status li .box_of_item:after {
    position: absolute;
    width: 100%;
    height: 1px;
    content: "";
    border-bottom: 1px dashed #ccc;
    right: 100%;
    top: 48%;
}
#OrderChangeStatusAjax .switch_status li:last-child .box_of_item::after {
    display: none;
}
#OrderChangeStatusAjax .switch_status li .box_of_item:hover , #OrderChangeStatusAjax .switch_status li .box_of_item.active {
    background: var(--bs-info);
    color: #fff !important;
}


#OrderChangeStatusAjax .description_of_status {
    float: right;
    border: 1px solid #eee;
    width: 94%;
    margin: 17px 3%;
    padding: 10px;
    border-radius: 10px;
    background: #fefefe;
    display: none;
}
#OrderChangeStatusAjax .description_of_status textarea {
    height: 100px;
}
#OrderChangeStatusAjax .description_of_status.active {
    display: block;
}
.list_of_data li .s_n {
    background: var(--bs-cyan);
    color: #fff;
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 50px;
}


.AdvancedSearch
{
    float: left;
    background: var(--bs-gutter-y);
    font-size: 15px;
    display: flex;
    height: 37px;
    padding: 0 28px;
    border-radius: 50px;
    margin: -6px 9px 0 0;
    align-items: center;
    color: #282828;
    cursor: pointer;
    box-shadow: inset 0 0 10px rgba(0,0,0,0.15);
    border-bottom: 3px solid var(--bs-primary);
    font-size: 13px;
    padding: 20px 40px 16px;
    font-weight: normal;
    border-radius: 7px;
}
.AdvancedSearch i {
    position: relative;
    top: 4px;
    right: -3px;
}

#SearchOrderList {
    padding: 20px;
}
#SearchOrderList .select2-selection.select2-selection--single {
    width: 100%;
    height: 43px;
    border-radius: 50px;
    border: 0;
    font-size: 13px;
    padding: 9px 3px 0 0;
}
#SearchOrderList .select2.select2-container {
    float: right;
    width: 100% !important;
}
#SearchOrderList .select2-selection.select2-selection--single {
}
#SearchOrderList .select2-selection.select2-selection--single .select2-selection__arrow {
    top: 8px;
}
.show_ir_guid_popup {
    font-size: 13px;
    float: left;
    background: var(--bs-warning);
    padding: 2px 12px;
    cursor: pointer;
}


.AcceptOrIgnoreValueAdded {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 20px 0 0 0;
    display: flex;
}
.AcceptOrIgnoreValueAdded li:first-child {
    width: 70%;
}
.AcceptOrIgnoreValueAdded li div {
    float: right;
    width: 98%;
    background: var(--bs-teal);
    text-align: center;
    margin: 0 1%;
    color: #fff;
    padding: 10px 0;
    border-radius: 50px;
    font-size: 14px;
    cursor: pointer;
}
.AcceptOrIgnoreValueAdded li:last-child {
    width: 30%;
}
.AcceptOrIgnoreValueAdded li div.ignore {
    background: var(--bs-red);
}

.list_of_data li.disabled_default {
    display: none;
}
.Hide_default_compelate{
    display: none;
}
.Img_selector .box_upload span b {
    background: #eee;
    color: #000;
    font-weight: normal;
    padding: 4px 11px;
    display: inline-block;
    border-radius: 50px;
    font-size: 11px;
}

.Img_selector.uploaded .box_upload:before {
    position: absolute;
    content: "ویرایش تصویر";
    left: 0;
    top: 0;
    background: #ff0039a6;
    color: #fff;
    font-size: 12px;
    padding: 4px 10px;
    border-radius: 50px;
    z-index: 0;
}


.access_list label:after {
    position: absolute;
    content: "";
    right: 13px;
    width: 15px;
    height: 15px;
    border: 1px solid;
    top: 11px;
    border-radius: 2px;
}
.access_list label.active::after , .access_list label:hover::after {
    background: var(--bs-yellow);
}
input[type="email"] {
    text-transform: lowercase;
}

.show_report {
    display: inline-block;
    background: var(--bs-yellow);
    position: relative;
    width: 40px;
    text-align: center;
    border-radius: 50px;
    padding: 0;
    margin: 0;
    cursor: pointer;
    margin: 0 0 0 4px;
}
.show_report span {
    position: absolute;
    width: 100px;
    background: #fff;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    border-radius: 100px;
    font-size: 12px;
    top: -21px;
    right: -31px;
    opacity: 0;
}
.show_report i {
    float: right;
    width: 100%;
    text-align: center;
    border-radius: 50px;
    top:  0 !important;
    right: 0 !important;
    font-size: 12px;
}
.show_report:hover span {
    opacity: 1;
}


.form-group.timeSelect {
    display: flex;
}
.form-group.timeSelect .seprator {
    display: block;
    width: 100%;
    margin: 0 1%;
}


.Show_Date {
    display: inline-block;
    background: var(--bs-orange);
    color: #fff;
    position: relative;
    width: 90px;
    font-size: 13px;
    border-radius: 16px;
}
.Show_Date .Show_date_desc {
    position: absolute;
    width: 120px;
    background: #fff;
    color: #000;
    bottom: 26px;
    padding: 10px 5px;
    border-radius: 5px;
    right: -18px;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    display:none;
}
.Show_Date:hover .Show_date_desc{
    display:block;
}
.Show_Date .Show_date_desc span {
    font-size: 13px;
}
.Show_Date .Show_date_desc b {
    font-weight: normal;
    direction: ltr;
    display: inline-block;
    padding: 0px 0 0 7px;
    font-size: 11px;
    font-family: iranyekanfan !important;
}
.Show_Date .Show_date_desc .start {
    color: green;
}
.Show_Date .Show_date_desc .end {
    color: red;
}


.readVacationText {
    background: #eee;
    display: inline-block;
    position: relative;
    font-size: 13px;
    padding: 2px 16px;
    border-radius: 50px;
    cursor: pointer;
}
.readVacationText p {
    position: absolute;
    width: 200px;
    bottom: 7px;
    background: #fff;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    font-size: 13px;
    text-align: center;
    padding: 4px;
    border-radius: 5px;
    right: -62px;
    display: none;
}
.readVacationText b {
    font-weight: normal;
}
.readVacationText:hover p {
    display: block;
}

.SelectVacationStatus {
    float: right;
    width: 100%;
    font-size: 13px;
    text-align: center;
    height: 33px;
    padding: 0;
    margin: 3px 0 0 0;
}
span.w, span.s , span.c {
    background: #000;
    color: #fff;
    font-size: 12px;
    padding: 2px 7px;
    border-radius: 50px;
}
span.s {
    background: green;
}
span.c {
    background: red;
}
.Show_Date.hourly {
    background: var(--bs-blue);
}
.Main nav .menu ul li .badge
{
    float: left;
    background: #ff0000b8;
    color: #fff;
    font-family: iranyekanfan !important;
    font-size: 10px;
    position: absolute;
    right: -4px;
    padding: 4px 4px;
    border-radius: 3px;
}

.notificationList {
    float: right;
    width: 100%;
    padding: 0;
    margin: 0;
}
.notificationList .head_notification {
    float: right;
    width: 100%;
    background: #f3f3f3;
    padding: 10px;
}
.notificationList .head_notification .las.la-times {
    float: left;
    background: #ff0039;
    color: #fff;
    cursor: pointer;
    padding: 2px;
}
.notificationList .body_notification {
    float: right;
    width: 100%;
    padding: 20px 20px;
    height: 400px;
    overflow: auto;
    display: none;
}
.notificationList .body_notification .ListOfNotification {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
}
.notificationList .body_notification .ListOfNotification li {
    float: right;
    width: 100%;
    border-bottom: 1px solid #eee;
}
.notificationList .body_notification .ListOfNotification li a {
    float: right;
    width: 100%;
}
.notificationList .body_notification .ListOfNotification li a .header_text {
    float: right;
    width: 100%;
}
.notificationList .body_notification .ListOfNotification li a .header_text span {
    color: var(--fourth);
    font-weight: 500;
}
.notificationList .body_notification .ListOfNotification li a .header_text b {
    color: #222;
    font-weight: normal;
}

.notificationList .body_notification .ListOfNotification li a .text_desc {
    float: right;
    width: 100%;
    text-align: right;
    font-size: 13px;
    height: 21px;
    overflow: hidden;
    color: #555;
}

.notificationList .body_notification .ListOfNotification li a.read {
    opacity: 0.6;
}

.QuickAccessCustomer {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 11px 0 8px;
    display: flex;
}
.QuickAccessCustomer li {
    width: 100%;
    margin: 0 5px;
}
.QuickAccessCustomer li a {
    float: right;
    width: 100%;
    display: flex;
    flex-direction: column;
    background: #fff;
    box-shadow: 0 0 10px rgba(0,0,0,0.03);
    text-align: center;
    padding: 20px 0;
    border-radius: 6px;
    text-decoration: none;
}
.QuickAccessCustomer li a i {
    font-size: 57px;
    color: var(--bs-warning);
}
.QuickAccessCustomer li a span {
    font-size: 15px;
    margin: 9px 0 0 0;
    font-weight: 600;
    color: #000;
}
.QuickAccessCustomer li a:hover {
    background: var(--bs-warning);
}
.QuickAccessCustomer li a:hover i , .QuickAccessCustomer li a:hover span {
    color: #fff;
}

#select2-customer_account_id-results li:first-child {
    border-bottom: 2px solid #ccc;
    background-color: #f7f7f7;
    color: #000;
    padding: 12px;
    text-align: center;
    font-weight: bold;
}
.Select_package > li.active::after {
    position: absolute;
    content: "\f00c";
    font-family: 'Line Awesome Free';
    font-weight: 900;
    background: var(--bs-orange);
    color: #fff;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    border-radius: 50px;
    right: -13px;
    top: -10px;
}
.div_form_bill_official label {
    margin: 15px 0 0 0;
}
#SelectAccountApproved {
    float: right;
    width: 100%;
    margin: 0 0 24px 0;
    background: #f9f9f9;
    padding: 15px;
    border-radius: 5px;
    border: 1px solid #eee;
}
.approve_law {
    float: right;
    width: 100%;
    margin: 5px 0;
    cursor: pointer;
}

#AccepetLawPopUp .guid_detail {
    float: right;
    width: 100%;
    height: 300px;
    overflow: auto;
}
#AccepetLawPopUp .guid_detail .accept_law_btn , #AccepetLawPopUp .guid_detail .decline_law_btn {
    float: right;
    width: 48%;
    background: var(--second);
    border-radius: 50px;
    padding: 10px;
    text-align: center;
    color: #fff;
    margin: 12px 1% 0;
    cursor: pointer;
}
#AccepetLawPopUp .guid_detail .decline_law_btn {
    background: var(--bs-danger);
}
.Main nav .menu ul li .badge.subdomain {
    margin: 0 0 0 26px;
    position: absolute;
    top: 17px;
    cursor: pointer;
    z-index: 99;
}



.Header.ReportNile {
    position: fixed;
    width: 100%;
    background: #fff !important;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    z-index: 9;
    display: flex;
    align-items: center;
}
.Header.ReportNile img {
    width: 150px;
}
.Header.ReportNile h1 {
    float: left;
    text-align: left;
    width: 100%;
    font-size: 20px;
    margin: 0 0 0 28px;
}
.report {
}
.report.ReportNile {
    float: right;
    width: 100%;
    margin: 85px 0 0 0;
    direction: ltr;
}
.report.ReportNile #export {
    display: none;
}


.report.ReportNile tr th:nth-child(5),.report.ReportNile tr td:nth-child(5) {
    display: none;
}
.report.ReportNile tr th:nth-child(6), .report.ReportNile tr td:nth-child(6) {
    display: none;
}
.report.ReportNile tr th:nth-child(7), .report.ReportNile tr td:nth-child(7) {
    display: none;
}
.report.ReportNile tr th:nth-child(8), .report.ReportNile tr td:nth-child(8) {
    display: none;
}
.report.ReportNile tr th:nth-child(9), .report.ReportNile tr td:nth-child(9) {
    display: none;
}

.SearchInPassword {
    background: #eee;
    float: right;
    width: 100%;
    padding: 15px;
    margin: 0 0 9px 0;
    border-radius: 7px;
}

.list_of_data li .edit, .list_of_data li a {
    position: relative !important;
}
.list_of_data li a span {
    position: absolute !important;
    width: 100px;
    bottom: 100%;
    background: #fff;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    color: #000;
    font-size: 12px;
    right: -33px;
    border-radius: 6px;
    padding: 3px 0 0 0;
    display: none;
}
.list_of_data li a:hover span {
    display: block;
}


.date_picker_element {
    float: right;
    width: 100%;
    position: relative;
}
.date_picker_element #start_vacation_date {
    float: right;
    width: 100%;
}
.date_picker_element i {
    position: absolute;
    left: 1px;
    background: var(--bs-yellow);
    width: 60px;
    height: 43px;
    border-radius: 23px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    color: #333;
    cursor: pointer;
    z-index: 1;
    top:0;
}
.date_picker_element:after {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    background: rgba(00,0,0,0.1);
    right: 0;
    border-radius: 30px;
    top:0;
}
.flex_input {
    display: flex;
    justify-content: center;
}
.flex_input .edit {
    margin: 4px 0 0 5px;
    background: var(--bs-info) !important;
}

.form-group.price_charge {
    position: relative;
}
.form-group.price_charge .currency {
    position: absolute;
    left: 0;
    bottom: 0;
    background: #ffda20;
    width: 58px;
    text-align: center;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px 0 0 50px;
}
.ClearAllNotificiation {
    float: left;
    color: #000;
    font-size: 13px;
    padding: 0 10px;
    margin: 0px 0 0 4px;
    background: #ccc;
    cursor: pointer;
}

.list_of_data.charge {
    border-bottom: 6px solid green;
}
.list_of_data.create {
    border-bottom: 6px solid var(--bs-warning);
}
.list_of_data li.subject {
    width: 200%;
}


.list_of_Report {
    float: right;
    width: 100%;
    padding: 0 292px 0 0;
    list-style: none;
    margin: 0;
    display: flex;
}
.list_of_Report a {
    float: right;
    padding: 13px 34px 7px;
    background: #fff;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    border-radius: 6px 6px 0 0;
    text-decoration: none;
    color: #000;
    margin: 0 0 0 0px;
}
.list_of_Report a:hover , .list_of_Report a.active {
    background: var(--bs-yellow);
    color: #555;
}
.payment_img {
    background: #333;
    color: #fff !important;
    text-decoration: none !important;
    font-size: 12px;
    padding: 3px 12px 1px;
    border-radius: 50px;
}


.menu.flip
{
    width: 59px !important;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 0 10px rgba(0,0,0,0.07);
    overflow: unset !important;
    transition: 0.5s;
    z-index: 99;
    right: 0;
    top: 0;
    padding: 0 !important;
}
.menu.flip ul li a span {
    position: absolute;
    right: 100%;
    background: var(--bs-yellow);
    color: #333;
    font-size: 9px;
    width: 67px;
    text-align: center;
    padding: 1px 0 3px;
    border-radius: 10px;
    display: none;
    z-index:99;
}
.menu.flip ul li a .las.la-angle-down {
    display: none;
}

.menu.flip ul li a:hover span {
    display: block;
}
.Main .content.flip {
    padding: 0 84px 20px 40px;
    transition: 0.5s;
}

.FlipMenuIcon.flip
{
    right: 58px;
    transition: 0.5s;
    background: var(--third);
    color: #000;
    border-radius: 6px 0 0 6px;
    padding: 0 0 0 4px;
    box-shadow: 0 0 10px rgba(0,0,0,0.09);
}
.FlipMenuIcon:hover {
    background: var(--bs-primary);
}
.FlipMenuIcon
{
    position: fixed;
    right: 250px;
    top: 129px;
    background: var(--third);
    height: 42px;
    display: flex;
    align-items: center;
    border-radius: 6px 0 0 6px;
    cursor: pointer;
    color: #fff;
    padding: 0 0px 0 2px;
    transition: 0.5s;
    box-shadow: 0 0 10px rgba(0,0,0,0.09);
    color: #000;
}

.FlipMenuIcon.flip i {
    transform: rotate(180deg);
}
.menu.topSet {
    top: 10px;
    transition: 0.5s;
}

.set_account_id_popup {
    display: inline-block;
    background: var(--bs-red);
    color: #fff;
    font-size: 12px;
    border-radius: 50px;
    padding: 2px 9px 0;
    cursor: pointer;
}
.account_id_show {
    display: inline-block;
    background: #ffcb00;
    font-size: 11px;
    font-family: verdana;
    padding: 2px 7px;
    border-radius: 50px;
    color: #000;
}

.set_stock_id_popup {
    display: inline-block;
    font-size: 12px;
    background: var(--bs-red);
    color: #fff;
    padding: 2px 10px 0;
    border-radius: 50px;
    cursor: pointer;
}
#SetStockIDAjax {
    padding: 25px;
}

.stock_id_show {
    display: inline-block;
    background: #00026a;
    color: #fff;
    font-size: 12px;
    padding: 2px 17px 0px;
    border-radius: 50px;
}
.menu.flip ul li .badge
{
    left: auto !important;
    right: 46px !important;
    border-radius: 50px;
    font-size: 9px !important;
    background: #00000094 !important;
}
.set_mcc_id_popup {
    display: inline-block;
    background: var(--bs-red);
    color: #fff;
    font-size: 12px;
    padding: 2px 10px 0;
    border-radius: 50px;
    cursor: pointer;
}
#SetMCCIDAjax {
    padding: 20px;
}
.mcc_id_show {
    font-size: 12px;
    padding: 3px 10px 0;
    background: #fff7e0;
    border-radius: 50px;
    position: relative;
    cursor: pointer;
    display: inline-block;
    color: #000 !important;
}
.set_expert_id_popup {
    display: inline-block;
    background: #197300;
    font-size: 12px;
    padding: 2px 10px 1px;
    border-radius: 50px;
    color: #fff;
    cursor: pointer;
}
.cancel_expert_id_popup {
    display: inline-block;
    background: #ff0039;
    font-size: 12px;
    padding: 2px 10px 1px;
    border-radius: 50px;
    color: #fff;
    cursor: pointer;
}
.wallet_report {
    display: inline-block;
    background: var(--bs-warning);
    padding: 5px 16px 0;
    text-decoration: none;
    color: #000 !important;
    border-radius: 50px;
    font-size: 12px;
}

.list_of_data.deposit {
    border-bottom: 6px solid green;
}
.list_of_data.withdraw {
    border-bottom: 6px solid red;
}


.Charge_Order {
    float: left;
    background: var(--second);
    text-align: center;
    padding: 2px 8px 0px 1px;
    color: #fff;
    border-radius: 50px;
    cursor: pointer;
}


#ChargeAccountAjax {
    float: right;
    width: 100%;
    padding: 20px;
}
.detail_Account_user {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: nowrap;
}
.detail_Account_user li {
    float: right;
    width: 100%;
    border: 1px solid #eee;
}
.detail_Account_user li span {
    float: right;
    background: #eee;
    font-size: 12px;
    padding: 10px 11px;
}
.detail_Account_user li b {
    float: right;
    font-size: 14px;
    padding: 8px 6px;
    color: var(--first);
    margin: 0;
}

.StockDetail {
    position: relative;
}
.StockDetail .DetailBox {
    position: absolute;
    left: 0;
    bottom: 0;
    background: var(--bs-warning);
    padding: 0 29px;
    height: 42px;
    border-radius: 50px;
    display: flex;
    align-items: center;
    font-family: arial;
}
.DetailBox.f {
    font-family: iransans !important;
}

.Video_code {
    display: inline-block;
    width: 200px;
    border: 3px solid var(--bs-warning);
    word-break: break-all;
    padding: 10px;
    font-size: 13px;
    border-radius: 10px;
}


.CopyCode {
    display: block;
    background: var(--bs-warning);
    width: 100px;
    margin: 0px auto 0;
    border-radius: 0 0 10px 10px;
    cursor: pointer;
}
.TextAreaCourse {
    float: right;
    width: 100%;
    margin: 15px 0 0 0;
}
.TextAreaCourse b {
    font-size: 20px;
    margin: 0 0px 5px 0;
    float: right;
    width: 100%;
}
.TextAreaCourse p {
    float: right;
    width: 100%;
    font-size: 18px;
    line-height: 2;
}
.TextAreaCourse .dwn {
    float: right;
    width: 31.3%;
    background: var(--bs-blue);
    margin: 0 1%;
    text-align: center;
    color: #fff;
    padding: 10px 0;
    text-decoration: none;
    border-radius: 50px;
}
.TextAreaCourse .dwn:nth-child(2n) {
    background: var(--bs-success);
}


body.page-id-1913 .Main nav .menu ul li , body.page-id-6289 .Main nav .menu ul li{
    position: relative;
    opacity: 0.5;
}
body.page-id-1913 .Main nav .menu ul li:after , body.page-id-6289 .Main nav .menu ul li:after {
    position: absolute;
    width: 100%;
    content: "";
    width: 100%;
    height: 100%;
    right: 0;
    top: ;
}
body.page-id-1913 .Main nav .menu ul li.activeNow , body.page-id-6289 .Main nav .menu ul li.activeNow {
    opacity: 1;
}
body.page-id-1913 .Main nav .menu ul li.activeNow:after , body.page-id-6289 .Main nav .menu ul li.activeNow:after {
    display: none;
}

#ConvertToEcxel
{
    float: left;
    background: #fff;
    color: #fff;
    font-size: 11px;
    padding: 12px 49px;
    margin: -6px 7px 0px 0px !important;
    text-decoration: none;
    border-radius: 7px;
    color: #000;
    box-shadow: inset 0 0 10px rgba(0,0,0,0.15);
    border-bottom: 3px solid var(--second);
}


.stock_list_header {
    float: left;
}
.stock_list_header .Stock_item {
    float: right;
    margin: 11px 10px 0;
    border: 1px solid #ccc;
    border-radius: 20px;
    padding: 3px;
    background: #fff;
}
.stock_list_header .Stock_item b
{
    background: #eee;
    font-size: 9px;
    font-weight: normal;
    padding: 3px 15px;
    border-radius: 20px;
    float: right;
    font-family: iranyekanfan;
}
.stock_list_header .Stock_item span
{
    float: right;
    font-size: 11px;
    padding: 3px 10px 0;
    font-family: iranyekanfan;
    font-weight: 100;
}
.Guid_list {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: -12px 0px 8px 0;
    display: flex;
    justify-content: center;
}
.Guid_list li {
    margin: 0 15px;
    display: flex;
    align-items: center;
}
.Guid_list li b {
    width: 20px;
    height: 10px;
    float: right;
    margin: 0 0 0 6px;
}
.Guid_list li span {
    float: right;
    font-size: 14px;
}



.mcc_id_show .email_list {
    position: absolute;
    right: -100%;
    bottom: 100%;
    background: #fff;
    box-shadow: 0 0 10px rgba(0,0,0,0.09);
    padding: 13px;
    display: none;
}
.mcc_id_show .email_list {
    position: absolute;
    left: -14%;
    bottom: 100%;
    background: #fff;
    box-shadow: 0 0 10px rgba(0,0,0,0.09);
    padding: 13px;
    display: none;
}
.mcc_id_show:hover .email_list {
    display: block;
}
.mcc_id_show b {
    display: inline-block;
    width: 100%;
}


.deactive_owner {
    position: relative;
}
.deactive_owner::after
{
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    right: 0;
    top: 0;
    border-radius: 0;
    z-index: 99;
    cursor: not-allowed;
    font-size: 9px;
    opacity: 0.1;
    background-image: radial-gradient(rgba(0, 0, 0, 0.3) 4px, transparent 4px);
    background-size: 8px 8px;
    background-color: rgba(0, 0, 0, 0.21);
}
.unknown_status {
    display: inline-block;
    background: var(--bs-yellow);
    font-size: 12px;
    padding: 2px 10px;
    border-radius: 50px;
}

.active_status {
    display: inline-block;
    background: var(--bs-yellow);
    font-size: 12px;
    padding: 2px 10px;
    border-radius: 50px;
}
.deactive_status {
    display: inline-block;
    background: var(--bs-yellow);
    font-size: 12px;
    padding: 2px 10px;
    border-radius: 50px;
}




.Main nav .menu ul li .sub_menu.activeNow li:after {
    display: none;
}
.Main nav .menu ul li .sub_menu.activeNow li {
    opacity: 1;
}


.AddAccount , .ImportAccount {
    float: right;
    font-size: 14px;
    font-weight: normal;
    text-decoration: none;
    background: var(--second);
    color: #fff!important;
    padding: 7px 22px;
    margin: -6px 12px 0;
    border-radius: 50px;
}
.title span {
    float: right;
}
.ImportAccount {
    margin: -6px 0 0 0;
    background: var(--bs-primary);
}


#messageListOrder .desc li .log_item .contentDescription p.log_Acc {
    background: transparent;
}
#messageListOrder .desc li .log_item .contentDescription p.log_Acc .desc_log {
    display: inline-block;
    background: #eee;
    border-radius: 50px;
    padding: 0 10px;
    margin: 0 4px;
}


.List_of_account {
    float: right;
    width: 100%;
    height: 300px;
    overflow: auto;
    margin: 0 0 9px 0;
    border: 1px solid #eee;
    padding: 10px;
}
.List_of_account ul {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
}
.List_of_account ul li {
    float: right;
    width: 100%;
    padding: 10px;
    border-bottom: 1px solid #eee;
    position: relative;
}
.List_of_account ul li input {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    cursor: pointer;
    opacity: 0;
}
.List_of_account ul li span {
    float: right;
    margin: 0 0 0 14px;
    font-weight: 400;
}
.List_of_account ul li b {
    float: right;
    background: var(--bs-yellow);
    color: #000;
    line-height: 1;
    padding: 4px 13px 0;
    border-radius: 50px;
}
.List_of_account ul li.active {
    background: var(--bs-warning);
}

#SetAccountIDAjax h2 {
    float: right;
    width: 100%;
    font-size: 19px;
    text-align: center;
    color: var(--bs-blue);
    font-weight: 600;
}
#SetAccountIDAjax #search_Of_account {
    float: right;
    width: 100%;
    height: 37px;
    border: 1px solid #eee;
    margin: 0 0 0 0;
    text-align: center;
    font-size: 15px;
}
.account_id_format {
    direction: ltr;
    font-size: 20px;
    text-align: right;
}
.date_show {
    background: #ff0039;
    color: #fff;
    font-size: 13px;
    display: inline-block;
    padding: 2px 10px 0;
    border-radius: 50px;
}

.MinumPrice {
    float: right;
    width: 100%;
    text-align: center;
    font-size: 13px;
    color: var(--bs-danger);
    margin-bottom: 46px;
}

.ReturnToSelectPrice {
    cursor: pointer;
}
.request_entry_price span {
    float: right;
    width: 100%;
    text-align: center;
    font-size: 12px;
    color: var(--bs-danger);
}

.notificationList .body_notification .ListOfNotification li.alarm.red {
    background: #ffe995;
    padding: 6px;
}

.allarmBox {
    float: right;
    width: 100%;
}
.ShowAllAlarm {
    float: left;
    background: var(--fourth);
    padding: 6px 20px 3px;
    font-size: 15px;
    margin: -10px 0 0 0;
    color: #fff;
    border-radius: 0 0 5px 5px;
    cursor: pointer;
}

.TabNotification {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    display: flex;
}
.TabNotification li {
    float: right;
    width: 100%;
    background: #eee;
    padding: 10px 0;
    text-align: center;
    cursor: pointer;
}
.TabNotification li.active {
    background: var(--bs-yellow);
}
.notificationList .body_notification.active {
    display: block;
}


.listOfService {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0 0 0 0;
    display: flex;
    flex-wrap: nowrap;
}
.listOfService li {
    float: right;
    width: 100%;
    padding: 0 5px;
}
.listOfService li .box_service {
    float: right;
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 5px;
    padding: 4px;
}
.listOfService li .box_service i {
    background: orange;
    padding: 10px;
    font-size: 29px;
    color: #fff;
    float: right;
    border-radius: 0 5px 5px 0;
}
.listOfService li .box_service .text {
    float: right;
    height: 49px;
    display: flex;
    align-items: center;
    margin: 0;
    font-size: 15px;
    background: #fff;
    width: calc(100% - 50px);
    padding: 0 10px;
    border-radius: 5px 0 0 5px;
}
.listOfService li .box_service .text b {
    font-size: 20px;
    margin: 0 6px 0 0;
}
.listOfService li:first-child {
    padding: 0 0 0 5px;
}
.listOfService li:last-child {
    padding: 0 5px 0 0;
}

body.CustomerDashboardClass .Main {
    background: #fff;
}
body.CustomerDashboardClass header {
    background: #fff;
}
body.CustomerDashboardClass .FlipMenuIcon {
    display: none;
}
body.CustomerDashboardClass .content.Notif .list_of_notif li {
    border-radius: 3px;
}

body.CustomerDashboardClass .NotifUser .icon {
    background: #ffffff;
    border: 1px solid var(--bs-warning);
    color: var(--bs-warning);
}

body.CustomerDashboardClass .NotifUser .list_of_notif li .head_notif h3 {
    float: right;
    width: calc(100% - 20px);
    font-size: 13px;
    color: #000;
}
body.CustomerDashboardClass .NotifUser .list_of_notif {
    left: -100px;
    width: 310px;
}

.NotificationBadge {
    float: right;
    margin: 0 0 0 16px;
    display: flex;
    align-items: center;
    background: rgba(0,0,0,0.1);
    padding: 2px 10px;
    border-radius: 2px;
}
.NotificationBadge b {
    font-weight: normal;
}


.box_of_dashboard {
    float: right;
    width: 100%;
    padding: 24px 16px;
    background: #ffffff;
    border: 1px solid #00000010;
    margin: 0 0 24px 0;
    border-radius: 16px;
    box-shadow: 0px 1px 32px #0000000f;
}
.box_of_dashboard > h4 {
    float: right;
    width: 100%;
    font-size: 19px;
    font-weight: 900;
    color: #333;
}
.box_of_dashboard .LIstOfService {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 4px 0 0 0;
    display: flex;
    flex-wrap: nowrap;
}
.box_of_dashboard .LIstOfService li {
    float: right;
    width: 100%;
    padding: 0 0 0 10px;
}
.box_of_dashboard .LIstOfService li a {
    float: right;
    width: 100%;
    padding: 10px;
    background: #fafafa;
    display: flex;
    flex-direction: column;
    padding: 35px 20px 50px;
    justify-content: start;
    text-decoration: none;
    border-radius: 3px;
    color: #444;
    font-size: 15px;
}
.box_of_dashboard .LIstOfService li a i {
    font-size: 66px;
    color: var(--bs-gray);
}
.box_of_dashboard .LIstOfService li a img {
    width: 50px;
    margin: 0 0 8px 0;
}

.box_of_dashboard .LIstOfService li a .readMore {
    color: var(--second);
    text-align: right;
    margin: 7px 0 0 0;
    font-weight: ;
    border-bottom: ;
}

.box_of_dashboard .LIstOfService li.commingSoon a:after {
    position: absolute;
    content: "به زودی";
    width: 100%;
    height: 100%;
    background: #fff;
    opacity: 0.6;
    right: 0;
    top: 0;
    color: #000;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    border-radius: 3px;
    border: 1px solid #ccc;
    cursor: no-drop;
}
.box_of_dashboard .LIstOfService li.commingSoon a {
    filter: blur(1px);
    position: relative;
}


.box_of_dashboard .list_of_data {
    border-radius: 3px;
    margin: 0 0 3px 0;
    box-shadow: none;
    border: 1px solid #f3f3f3;
    padding: ;
}
.box_of_dashboard .list_of_data.head {
    background: #f7f9ff;
}

.listOfCourse {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
}
.listOfCourse li {
    float: right;
    width: 100%;
}
.listOfCourse li a {
    float: right;
    width: 100%;
    padding: 10px 0;
    border-bottom: 1px solid #eee;
    border-radius: 3px;
    text-decoration: none;
    color: #333;
}
.listOfCourse li a img {
    width: 56px;
    float: right;
}
.listOfCourse li a h5 {
    font-size: 15px;
    margin: 0 6px 0 0;
    float: right;
    height: 41px;
    display: flex;
    align-items: center;
}
.listOfCourse li {
    position: relative !important;
}
.listOfCourse li a .readMore {
    float: left;
    font-size: 15px;
    margin: 0;
    height: 24px;
    align-items: center;
    display: flex;
    color: var(--bs-teal);
    font-size: 14px;
    position: absolute;
    left: 0px;
    bottom: 3px;

}


.wallet {
    float: right;
    width: 100%;
    background: var(--wp--preset--gradient--midnight);
    padding: 35px 30px;
    margin: 34px 0 29px 0;
    border-radius: 3px;
    color: #fff;
}
.wallet a {
    float: left;
    background: #fff;
    color: var(--first) !important;
    padding: 4px 26px;
    display: flex;
    align-items: center;
    border-radius: 5px;
}
.wallet > i {
    font-size: 78px;
    margin: -15px -10px 2px 0;
}
.wallet .WalletMount {

}
.wallet .WalletMount b {
    font-size: 32px;
    font-weight: 300;
    margin: 6px 0 0 0;
    float: right;
    width: 100%;
}
.wallet .WalletMount b i {
    font-style: normal;
    font-size: 13px;
}
.wallet ul {
    float: right;
    width: 100%;
    display: flex;
    flex-direction: row;
    list-style: none;
    padding: 0;
    margin: 9px 0 0 0;
}
.wallet ul li {
    display: flex;
    align-items: center;
    font-size: 15px;
    padding: 0 0 0 36px;
}
.wallet ul li i {
    font-size: 23px;
}
.wallet ul li:first-child {

    margin: 0 0 0 27px;
}



.addProxy {
    float: right;
    width: 100%;
    background: #fff;
    box-shadow: 0 0 10px rgba(0,0,0,0.02);
    padding: 20px;
    border-radius: 24px;
}

.addproxyLink {
    background: var(--second);
    color: #fff !important;
    text-decoration: none;
    padding: 4px 20px;
    border-radius: 5px;
}


.Step_By_Step_import {
    position: fixed;
    width: 100%;
    height: 100%;
    background: #fff;
    z-index: 999;
    display: flex;
    align-items: center;
    justify-content: center;
}
.Step_By_Step_import .ProgressTime {
    width: 400px;
    text-align: center;
}
.Step_By_Step_import h2 {
    width: 100%;
    text-align: center;
    color: var(--bs-teal);
}
.Step_By_Step_import .ProgressTime .number {
    font-size: 26px;
}
.Step_By_Step_import .ProgressTime .progressLine {
    float: left;
    width: 100%;
    background: #eee;
    height: 9px;
    border-radius: 5px;
}
.Step_By_Step_import .ProgressTime .progressLine .line {
    float: right;
    height: 9px;
    background: var(--bs-success);
    border-radius: 5px;
}



.PaymentSection {
    float: right;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    background: radial-gradient(circle, rgb(21, 81, 184) 0%, rgb(0, 35, 95) 100%);
}
.PaymentSection .box_payment {
    width: 500px;
    background: #fff;
    padding: 30px 30px;
    border-radius: 6px;
    position: relative;
}
.PaymentSection .box_payment .logo {
    width: 100%;
    float: right;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.PaymentSection .box_payment .logo img {
    float: right;
    width: 120px;
}
.PaymentSection .box_payment .logo h1 {

    font-size: 24px;
    font-weight: 500;
    color: #000;
}

.PaymentSection .box_payment .form-control {
    font-size: 14px;
}
.PaymentSection .box_payment .form-control#price_payment {
    height: 54px;
    border: 2px solid var(--bs-blue);
    text-align: center;
    font-size: 26px;
    font-family: ;
    font-family: iranyekanfan;
    font-weight: normal;
}
.PaymentSection .box_payment .form-control::placeholder {
    color: #CACACA;
}
.PaymentSection .box_payment .form-control#price_payment{
    color:var(--bs-primary);
}

#ConvertPriceToText {
    float: right;
    width: 100%;
    text-align: center;
    margin: 7px 0 0 0;
    color: var(--bs-primary);
}

.payment_box {
}
.payment_box .success {
    float: right;
    width: 50%;
    margin: 0 25% 20px;
    text-align: center;
    display: flex;
    justify-content: center;
}
.payment_box .green {
    float: right;
    width: 100%;
    font-size: 26px;
    margin: 8px 0 0 0;
    text-align: center;
    color: var(--bs-success);
    font-weight: 900;
}
.payment_box .payment_status {
    float: right;
    width: 100%;
    border: 1px solid #e6e6e6;
    margin: 13px 0 0 0;
}
.payment_box .payment_status tr {
    border-bottom: 1px solid #ccc;
}
.payment_box .payment_status tr th {
    background: #eee;
    width: 30%;
    padding: 10px 0;
    text-align: center;
    font-size: 13px;
    font-weight: normal;
}
.payment_box .payment_status tr td {
    padding: 10px;
}

.payment_box .error {
    float: right;
    width: 50%;
    margin: 0 25% 20px;
    opacity: 1;
    position: relative;
}
.payment_box .error:after {
    position: ;
}
.payment_box .red {
    float: right;
    width: 100%;
    text-align: center;
    color: var(--bs-danger);
    font-weight: 900;
    font-size: 30px;
    margin: 8px 0 0 0;
}
.payment_box .repayment {
    float: right;
    width: 50%;
    background: var(--bs-orange);
    margin: 14px 25% 0;
    text-align: center;
    color: #fff;
    text-decoration: none;
    padding: 10px;
    border-radius: 5px;
    margin: ;
}

.PaymentSection {
    display: flex;
    padding: 9px;
    align-items: start;
}

.active_status.green {
    background: #0a0;
    color: #fff;
}
.deactive_status.red {
    background: #ff2525;
    color: #fff;
}
.box_of_dashboard .LIstOfService li a b {
    font-size: 16px;
    font-weight: 900;
}

.request_entry_price .form-group {
    position: relative;
}
.request_entry_price .form-group::after {
    position: absolute;
    content: "تومان";
    left: 0;
    bottom: 19px;
    background: var(--bs-yellow);
    width: 86px;
    height: 33px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
}
.Main nav .menu ul li .sub_menu .sub_menu {
    padding: 0px 11px 0 0;
}
.list_of_data li .official_tag {
    position: absolute;
    right: -20px;
    background: var(--bs-yellow);
    font-size: 11px;
    padding: 2px 7px;
    border-radius: 5px;
}
.ActionForOrder.red {
    font-size: 12px !important;
    background: var(--bs-secondary) !important;
    margin: 0 0 0 6px;
}
.showMeliCart {
    background: var(--bs-blue);
    color: #fff !important;
    text-decoration: none;
    border-radius: 5px;
    font-size: 12px;
    padding: 3px 0;
}

.ApproveAndDisAproveDocument {
    float: right;
    width: 50%;
    margin: 11px 25% 0 0;
    display: flex;
    list-style: none;
    padding: 0;
    flex-wrap: nowrap;
}
.ApproveAndDisAproveDocument li {
    width: 100%;
}
.ApproveAndDisAproveDocument li .box_a_d {
    float: right;
    width: 95%;
    background: var(--bs-success);
    text-align: center;
    color: #fff;
    padding: 10px;
    border-radius: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: 0.5s;
}
.ApproveAndDisAproveDocument li .box_a_d:hover{
    transform:scale(1.02);
    transition: 0.5s;
}
.ApproveAndDisAproveDocument li .box_a_d.disaprove {
    background: var(--bs-red);
}
.ApproveAndDisAproveDocument li .box_a_d span {
    margin: 0;
    padding: 0;
    position: relative;
    top: 2px;
    right: 7px;
}

.red_alert {
    width: 40%;
    margin: 0 30%;
    text-align: center;
    float: right;
    background: #fd0018bf;
    color: #fff;
    padding: 5px 0 2px;
    border-radius: 50px;
}

.red_alert._badge {
    width: auto;
    margin: 0;
    float: none;
    font-size: 11px;
    padding: 1px 9px;
}
.UploadUserDocument {
    background: var(--bs-blue);
    color: #fff !important;
    text-decoration: none;
    font-size: 12px;
    padding: 3px 9px 2px;
    border-radius: 50px;
    cursor: pointer;
}

.linkOfCourse {
    display: flex;
    flex-direction: row-reverse;
    flex-wrap: nowrap;
    justify-content: center;
}
.linkOfCourse input {
    float: left;
    width: 78%;
    border: 1px solid #e6e6e6;
    font-size: 13px;
    text-align: left;
    padding: 7px;
    justify-content: start;
    display: ;
}
.linkOfCourse .copyCourseLink {
    background: var(--second);
    padding: 0 10px;
    display: flex;
    align-items: center;
    color: #fff;
    cursor: pointer;
}

.course_buy_customer {
    float: right;
    width: 100%;
    display: flex;
    min-height: 100vh;
    align-items: center;
    justify-content: center;
}
.course_buy_customer .box_buy_course {
    width: 800px;
}
.course_buy_customer .box_buy_course .title {
    float: right;
    width: 100%;
    display: flex;
    align-items: center;
    flex-direction: column;
}
.course_buy_customer .box_buy_course .title img {
    width: 110px;
}
.course_buy_customer .box_buy_course .title h1 {
    float: right;
    width: 100%;
    font-size: 20px;
    text-align: center;
    font-weight: 600;
    color: #000;
}

#Discount_Code_ajax {
    float: right;
    width: 40%;
    margin: 24px 0 0 0;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
}
#Discount_Code_ajax #discount_code {
    width: 70%;
    border-radius: 0 20px 20px 0;
    height: 46px;
}
#Discount_Code_ajax .btn {
    width: 30%;
    margin: 0;
    border-radius: 20px 0 0 20px;
}


#price_academy {
    font-family: iranyekanfan;
}
#price_academy .price_new {
    float: right;
    width: 100%;
    text-align: center;
    font-size: 18px;
    font-weight: 600;
}
#price_academy del {
    color: #ff0018;
}

#order_academy_course {
    float: left;
    width: 500px;
    margin: 0 0 0 17px;
}
#Discount_Code_ajax .btn {
    background: var(--bs-gray-dark);
}

.AlertBox {
    float: right;
    width: 100%;
    text-align: center;
    background: var(--bs-teal);
    padding: 20px 0;
    border-radius: 6px;
    color: #fff;
    margin: 0 0 0 0;
}
.Red.AlertBox {
    background: var(--bs-danger);
}

.ButtonCourse {
    float: left;
    width: 300px;
    background: var(--bs-success);
    color: #fff!important;
    text-align: center;
    margin: 0 0 0 32px;
    padding: 10px 0;
    border-radius: 60px;
    text-decoration: none;
}
.ButtonCourse.red {
    background: var(--bs-danger);
}

#reserve_academy_course {
    float: left;
    width: 400px;
    margin: 0 0 0 19px;
}

.course_link {
    background: var(--bs-blue);
    color: #fff;
    text-decoration: none;
    padding: 3px 10px 2px;
    font-size: 13px;
    border-radius: 6px;
}

.disablePayment {
    float: right;
    width: 100%;
    opacity: 0.4;
    position: relative;
}
.disablePayment:after {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    width: 100%;
    height: 100%;
    right: 0;
    top: 0;
}
.alertPayment {
    float: right;
    width: 100%;
    background: #ff8300;
    text-align: center;
    color: #fff;
    margin: 13px 0 0 0;
    padding: 10px 0 8px;
    border-radius: 5px;
}


.alertPayment a {
    background: #fff;
    text-decoration: none;
    padding: 4px 10px 0;
    border-radius: 5px;
    direction: ;
    color: #000;
    font-weight: 500;
}



.AlertNotCompleteOrder {
    font-size: 15px;
    display: inline-block;
    background: var(--bs-yellow);
    color: #000;
    padding: 6px 10px 4px;
    border-radius: 50px;
    font-weight: 400;
}

.filter_of_order {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
    cursor: pointer;
}
.filter_of_order li {
    float: right;
    border: 1px solid #ccc;
    padding: 10px 20px 7px;
    margin: 5px 0 7px 12px;
    border-radius: 30px;
}
.filter_of_order li.active , .filter_of_order li:hover {
    background: var(--bs-warning);
}
.UploadUserDocument.orange {
    background: var(--bs-orange);
}
.UploadUserDocument.green {
    background: var(--bs-teal);
}

.alertPayment {
    float: right;
    width: 100%;
    background: var(--bs-teal);
    color: #fff;
    text-align: center;
    border-radius: 5px;
    margin: 0 0 15px 0;
    padding: 10px 0;
    font-size: 20px;
}
.alertPayment p {
    margin: 0;
}
.alertPayment.error {
    background: var(--bs-danger);
}

.deactive_owner .set_expert_id_popup {
    position: relative;
    z-index: 9999;
}
.deactive_owner .ActionForOrder {
    position: relative;
    z-index: 9999;
}

.titleInvoice {
    float: right;
    width: 100%;
    text-align: center;
    font-size: 21px;
    font-weight: 900;
    color: var(--first);
}

.officialtext {
    float: right;
    width: 100%;
    line-height: 2;
    font-size: 20px;
}
a.OrderList {
    float: right;
    background: var(--bs-blue);
    color: #fff;
    text-decoration: none;
    padding: 10px 20px;
    border-radius: 50px;
}


.header-web {
    position: fixed;
    width: 100%;
    box-shadow: 0 0 10px rgba(0,0,0,0.09);
    padding: 7px 0;
    background: #fff;
    z-index: 999;
}
.header-web .logo-web-img {
    float: right;
    width: 100px;
}
.header-web .access-web-link {
    float: left;
    margin: 0;
    padding: 0;
    list-style: none;
}
.header-web .access-web-link .telegram-link {
    float: left;
    background: #fff;
    display: flex;
    align-items: center;
    text-decoration: none;
    color: #333;
    font-size: 14px;
    padding: 6px 16px;
    border-radius: 6px;
    border: 1px solid #ccc;
}
.header-web .access-web-link .telegram-link i {
    margin: 0 0 0 5px;
    font-size: 18px;
}
.header-web .row {
    align-items: center;
}
.header-web .access-web-link .telegram-link:hover {
    background: var(--bs-yellow);
}
body.page.page-id-23231 {
    background: #f8fafc;
}



.first-order-request {
    float: right;
    width: 100%;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}
.first-order-request .box_first_intro {
    width: 700px;
    margin: 0 auto;
    text-align: center;
}
.first-order-request .box_first_intro h1 {
    font-size: 28px;
    font-weight: 900;
    color: #333;
}
.first-order-request .box_first_intro h5 {
    font-size: 23px;
    color: ;
}
.first-order-request .box_first_intro p {
    font-size: 19px;
    line-height: 1.7;
    color: #333;
    display: inline-block;
    margin: 4px 0 14px 0;
    width: 100%;
}
a.Start {
    background: var(--bs-blue);
    color: #fff;
    text-decoration: none;
    padding: 10px 50px;
    margin: 4px 0 0 0;
    display: inline-block;
    border-radius: 6px;
}
.kjWqoT {
    display: flex;
    flex-direction: column;
    -moz-box-pack: center;
    justify-content: center;
    -moz-box-align: center;
    align-items: center;
    margin: 50px 0px;
    align-self: center;
    position: absolute;
    bottom: 0;
    right: calc(50% - 11px);
}
.tkdwt {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 1px solid rgb(209, 209, 214);
}
.kUtPGA {
    width: 1px;
    height: 125px;
    background: rgb(209, 209, 214);
    margin-top: 10px;
}
.kMYLnJ {
    border-color: rgb(209, 209, 214);
    border-style: solid;
    border-image: none 100% / 1 / 0 stretch;
    border-width: 0px 1px 1px 0px;
    display: inline-block;
    padding: 7px;
    transform: rotate(45deg);
}
.QuestionFrom {
    float: right;
    width: 100%;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}


.QuestionFrom {
    float: right;
    width: 100%;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}
.QuestionFrom .box_Question {
    width: 700px;
    margin: 0 auto;
    text-align: center;
}
.QuestionFrom .box_Question h1 {
    font-size: 30px;
    color: #333;
    font-weight: 500;
}
.QuestionFrom .box_Question h1 b {
    font-weight: 900;
}
.QuestionFrom .box_Question p {
    color: #777;
}
.QuestionFrom .box_Question ul.AnswerList {
    list-style: none;
    padding: 0;
    margin: 0 0 0 0 !important;
    display: flex;
    flex-wrap: wrap;
}
.QuestionFrom .box_Question ul.AnswerList li {
    width: 48%;
    margin: 10px 1% 0px;
    border: 2px dotted #ccc;
    padding: 20px;
    position: relative;
}
.QuestionFrom .box_Question ul.AnswerList li input {
    position: absolute;
    width: 100%;
    height: 100%;
    right: 0;
    top: 0;
    opacity: 0;
    cursor: pointer;
}
.QuestionFrom .box_Question ul.AnswerList li span {
    width: 100%;
    text-align: center;
    display: inline-block;
    font-size: 17px;
    color: #444;
}
.QuestionFrom .box_Question ul.AnswerList li:hover , .QuestionFrom .box_Question ul.AnswerList li.active {
    background: var(--bs-warning);
}
.QuestionFrom .box_Question ul.AnswerList li.active::after {
    position: absolute;
    content: "\f00c";
    font-family: 'Line Awesome Free';
    font-weight: 900;
    width: 30px;
    height: 30px;
    background: var(--bs-warning);
    border: 1px solid #fff;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
    color: #fff;
    top: -14px;
    right: -14px;
}

.QuestionFrom .box_Question .Start {
    margin: 19px 0 0 0;
}




.SelectTemplate {
    float: right;
    width: 100%;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}
.SelectTemplate .box_select_template {
    width: 700px;
    margin: 0 auto;
    text-align: center;
}
.SelectTemplate .box_select_template h1 {
    font-size: ;
    font-size: 30px;
    color: #333;
}
.SelectTemplate .box_select_template .Select_template_item {
    list-style: none;
    padding: 0;
    margin: 20px 0 20px;
    display: flex;
    flex-wrap: nowrap;
}
.SelectTemplate .box_select_template .Select_template_item li {
    width: 100%;
    margin: 0 1%;
    border: 2px dotted #c6c6c6;
    padding: 40px 20px;
    position: relative;
}
.SelectTemplate .box_select_template .Select_template_item li input {
    width: 100%;
    position: absolute;
    height: 100%;
    top: 00;
    right: 0;
    opacity: 0;
    cursor: pointer;
}
.SelectTemplate .box_select_template .Select_template_item li span {
    width: 100%;
    display: block;
    font-size: 23px;
    font-weight: 600;
}
.SelectTemplate .box_select_template .Select_template_item li b {
    font-size: 11px;
    font-weight: normal;
    background: var(--bs-yellow);
    padding: 2px 8px;
    border-radius: 5px;
    position: relative;
    z-index: 99;
    cursor: pointer;
    margin: 6px 0 0 0;
    display: inline-block;
}
.SelectTemplate .box_select_template .Select_template_item li:hover , .SelectTemplate .box_select_template .Select_template_item li.active {
    background: var(--bs-yellow);
}

.SelectTemplate .box_select_template .Select_template_item li.active::after {
    position: absolute;
    content: "\f00c";
    font-family: 'Line Awesome Free';
    font-weight: 900;
    width: 30px;
    height: 30px;
    background: var(--bs-warning);
    border: 1px solid #fff;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
    color: #fff;
    top: -14px;
    right: -14px;
}

.SelectTemplate .box_select_template .Select_template_item li.active b , .SelectTemplate .box_select_template .Select_template_item li:hover b {
    background: var(--bs-blue);
    color: #fff;
}
.SelectTemplate .box_select_template .Select_template_item li .price {
    font-style: normal;
    font-size: 13px;
    border: 1px solid #ebebeb;
    background: #fff;
    padding: 2px 10px 0;
    border-radius: 19px;
    display: inline-block;
    margin: 0 0 4px 0;
}


.SelectPlanWebDesign {
    float: right;
    width: 100%;
    padding: 100px 0;
    text-align: center;
}
.SelectPlanWebDesign h1 {
    float: right;
    width: 100%;
    text-align: center;
    font-size: 30px;
    font-weight: 500;
    margin: 0 0 20px 0;
}
.SelectPlanWebDesign .package_box {
    float: right;
    width: 70%;
    margin: 0px 15% 0px;
    display: flex;
    flex-wrap: nowrap;
    list-style: none;
    align-items: center;
    padding: 0 14px;
}
.SelectPlanWebDesign .package_box li {
    width: 100%;
    text-align: center;
    font-size: 15px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.SelectPlanWebDesign .package_box li.large {
    width: 200%;
    border-right: 0;
    text-align: right;
    border-bottom: 1px solid #eee;
    justify-content: start;
    height: 42px;
    display: flex;
}
.SelectPlanWebDesign .package_box.head {
}
.SelectPlanWebDesign .package_box li:nth-child(2) {
    background: #fff;
    border: 0;
    box-shadow: 0 0 10px rgba(0,0,0,0.02);
    margin: 0;
    transform: scale(1.02);
    /*! border-right: 1px solid #e2e2e2; */
    /*! border-left: 1px solid #e2e2e2; */
}
.SelectPlanWebDesign .package_box li b {
    margin: 0 0 0 3px;
}
.SelectPlanWebDesign .package_box li i {
    font-style: normal;
    font-size: 22px;
    color: var(--bs-pink);
    font-weight: bold;
}
.SelectPlanWebDesign .package_box li .greenBadge {
    color: var(--second);
}
.SelectPlanWebDesign .Start {
    margin: 36px 0 0 0;
}
.SelectPlanWebDesign .package_box li:nth-child(3) {
    background: #ffffff;
    border-right: 1px solid #eee;
}
.SelectPlanWebDesign .package_box.head li:nth-child(2) {
    background: #dfdfdf;
}
.SelectPlanWebDesign .package_box.head li:nth-child(3) {
    background: #eee;
}

.SelectPlanWebDesign .package_box li.sel_pack {
    background: var(--bs-yellow);
    cursor: pointer;
}
.SelectPlanWebDesign .package_box li.sel_pack.vip {
    background: var(--bs-blue);
    color: #fff;
}


.ReadMorePackage {
    float: right;
    width: 100%;
    height: 73px;
    overflow: hidden;
    position: relative;
}
.ReadMorePackage:after {
    content: "مشاهده تمام امکانات";
    position: absolute;
    width: 69%;
    background: rgba(255,255,255,0.9);
    top: 0;
    right: 15%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #000;
    cursor: pointer;
    border: 1px solid #e7e7e7;
}
.ReadMorePackage.active{
    height:auto;
    overflow: unset;
}
.ReadMorePackage.active:after{
    display: none;
}

.SelectPlanWebDesign.base .package_box li:nth-child(2) {
    border-right: 1px solid var(--bs-yellow) !important;
    border-left: 1px solid var(--bs-yellow) !important;
}
.SelectPlanWebDesign.base .package_box li:nth-child(3) {
    opacity: 0.5;
}
.SelectPlanWebDesign.base .package_box li.sel_pack.vip {
    opacity: 1;
    background: #444;
}
.SelectPlanWebDesign.vip .package_box li:nth-child(3) {
    border-right: 1px solid var(--bs-blue) !important;
    border-left: 1px solid var(--bs-blue) !important;
}
.SelectPlanWebDesign.vip .package_box li:nth-child(2) {
    transform: scale(1);
    opacity: 0.6;
}
.SelectPlanWebDesign.vip .package_box li.sel_pack.base {
    opacity: 1;
    background: #444;
    color: #fff;
}
.error {
    border: 1px solid var(--bs-red);
    padding: 0 0 8px 0;
}

.list_of_data.head.invoice_page.total_price li:first-child {
    width: 200%;
    text-align: right;
    padding: 0 40px 0 0;
}

.description_tab
{
    width: 20px;
    height: 20px;
    position: absolute;
    top: -10px;
    left: 9px;
    background: var(--bs-gray);
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    cursor: pointer;
    font-size: 12px;
}
.List_of_filter_tab li {
    position: relative;
    position: ;
}
.description_tab .DescriptionMore
{
    position: absolute;
    width: 200px;
    max-height: 100px;
    background: #fff;
    bottom: 104%;
    overflow: auto;
    padding: 7px;
    font-size: 13px;
    z-index: 99;
    border-radius: 5px;
    display: none;
    color: #000;
    box-shadow: inset 0 0 10px rgba(0,0,0,0.09);
    border: 1px solid #e7e7e7;
}
.description_tab:hover .DescriptionMore {
    display: block;
}
form.inner_form label .wallet_number {
    font-style: normal;
    font-size: 14px;
    font-weight: 700;
}
.LoginFirst {
    float: right;
    width: 100%;
    background: red;
    color: #fff;
    padding: 10px 5px;
    border-radius: 5px;
}


.fullWidthText {
    float: right;
    width: 100%;
    position: relative;
    margin:20px 0 0 0;
}
.fullWidthText:after {
    position: ;
    position: absolute;
    content: "";
    width: 100%;
    border-bottom: 1px dashed #ccc;
    right: 0;
    top: 10px;
}
.fullWidthText span {
    float: right;
    position: relative;
    z-index: 9;
    background: #fff;
    padding: 0 0 0 12px;
}
.alertProfile {
    float: right;
    width: 100%;
    background: #ffc105;
    padding: 10px;
    border-radius: 5px;
    margin: 0 0 11px 0;
}
.green_alert {
    float: right;
    width: 98%;
    background: var(--bs-green);
    text-align: center;
    color: #fff;
    padding: 10px;
    border-radius: 7px;
    margin: 7px 1% 0;
}

.LoginPageUser {
    float: right;
    width: 100%;
    height: 100vh;
    background-size: cover;
    background-position: center;
}

.MobileReturn {
    float: right;
    width: 100%;
    background: #e3e3e3;
    font-size: 13px;
    padding: 10px;
    text-align: right;
    border-radius: 5px;
}
.MobileReturn b {
    color: #2400d0;
    margin: 0 3px;
    font-weight: 500;
}
.MobileReturn i {
    float: left;
    font-style: normal;
    background: #222222;
    color: #fff;
    font-size: 12px;
    padding: 1px 10px;
    border-radius: 50px;
    cursor: pointer;
}

.ForgetPassword {
    float: left;
    font-size: 13px;
    margin: 7px 0 -9px 6px;
    color: var(--bs-red);
    font-weight: 500;
    cursor: pointer;
}


.forgetPasswrodSection {
    float: right;
    width: 100%;
    padding: 20px;
}
.forgetPasswrodSection h2 {
    float: right;
    width: 100%;
    text-align: center;
    font-size: 25px;
    color: #000;
}
.forgetPasswrodSection p {
    float: right;
    width: 100%;
    text-align: center;
    font-size: 16px;
    line-height: 2;
    color: #333;
}
.forgetPasswrodSection .forget_btn {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: nowrap;
}
.forgetPasswrodSection .forget_btn li:first-child {
    width: 70%;
}
.forgetPasswrodSection .forget_btn li:last-child {
    width: 30%;
}
.forgetPasswrodSection .forget_btn li div {
    float: right;
    width: 98%;
    background: var(--bs-red);
    text-align: center;
    color: #fff;
    padding: 6px 0;
    font-size: 14px;
    border-radius: 50px;
    cursor: pointer;
}
.forgetPasswrodSection .forget_btn li:last-child div {
    background: #666;
}

#TransferAccountApproveAjax {
    padding: 20px;
}
#ApproveTransferAccount .form-group.third {
    border-bottom: 1px solid #eee;
}



.select2-container {
    width: 100% !important;
}
body .select2-container .select2-selection--single {
    height: 43px !important;
    border: 1px solid #ccc !important;
}
body .Charge .select2-container {
    width: 88px !important;
}
.show_img {
    display: inline-block;
    background: var(--bs-blue);
    color: #fff !important;
    text-decoration: none;
    font-size: 13px;
    padding: 1px 6px;
    border-radius: 50px;
}

.Promotion_Alert.active {
    display: flex;
}
.Promotion_Alert {
    float: right;
    width: 100%;
    background: var(--bs-teal);
    border-radius: 5px;
    display: flex;
    padding: 10px 20px;
    font-size: 17px;
    color: #fff;
    margin: 0 0 15px 0;
    align-items: center;
    justify-content: center;
    display: none;
}
.Promotion_Alert i {
    font-size: 30px;
    margin: -4px 0 0 8px;
}
.Promotion_Alert span {
    font-weight: bold;
    margin: 0 0 0 4px;
}
.Promotion_Alert p {
    margin: 0;
}

.GiftForCustomer {
    float: right;
    width: 100%;
}
.GiftForCustomer .giftHDM {
    float: right;
    width: 100%;
    padding: 10px;
    text-align: center;
    background: #fdd662;
    border-radius: 6px;
    margin: 9px 0 0 0;
}

.ComplateProfile {
    float: right;
    width: 98%;
    background: var(--bs-danger);
    color: #fff!important;
    text-decoration: none!important;
    padding: 10px 0;
    border-radius: 5px;
    text-align: center;
    margin: 14px 1% 0 0;
}
.ComplateProfile b {
    display: inline-flex;
    background: rgba(255,255,255,0.2);
    font-weight: normal;
    padding: 2px 20px;
    border-radius: 6px;
}

.Main.WithOutLogin {
    padding: 30px;
    text-align: center;
}
.Main.WithOutLogin .PaymentHeader {
    float: right;
    width: 100%;
    margin: 0 0 24px 0;
    display: flex;
    align-items: center;
}
.Main.WithOutLogin .content {
    padding: 0 40px;
}
.Main.WithOutLogin .PaymentHeader img {
    width: 116px;
}
.Main.WithOutLogin .PaymentHeader h2 {
    font-size: 25px;
}
.Promotion_Alert p b {
    color: white;
    font-size: 20px;
}

.SendSmsOrder {
    float: right;
    width: 100%;
}
.SendSmsOrder .SendHistory {
    float: right;
    width: 50%;
    margin: 9px 0 0 0;
}
.SendSmsOrder .SendHistory i {
    font-style: normal;
    font-family: iranyekanfan;
    color: var(--bs-danger);
}
.SendSmsOrder .SendSMSBtn {
    float: left;
    background: var(--bs-green);
    color: #fff;
    font-size: 14px;
    padding: 10px 20px;
    border-radius: 50px;
    cursor: pointer;
}
.SendSmsOrder .LinkOfPayment {
    float: right;
    width: 100%;
    background: #eee;
    padding: 20px;
    text-align: center;
    margin: 20px 0 0 0;
    border-radius: 6px;
}
#Add_Account_Ajax .form-group {
    height: 74px;
}

.AddRemainTOAccount {
    float: right;
    width: 100%;
    background: #7a91d7;
    color: #fff;
    padding: 9px 14px;
    margin: 14px 0 0 0;
    text-align: center;
    border-radius: 10px;
    cursor: pointer;
}
.AddRemainTOAccount span {
    font-size: 16px;
}
.AddRemainTOAccount i {
    width: 100%;
    float: right;
    background: rgba(0,0,0,0.3);
    padding: 5px 0;
    border-radius: 10px;
    font-style: normal;
    margin: 7px 0 0 0;
    cursor: pointer;
}
.SearchOptionBox {
    float: right;
    width: 100%;
    background: #eee;
    padding: 16px;
    margin: 0 0 38px 0;
    border-radius: 6px;
}

.list_of_Report a .badge {
    background: var(--bs-danger);
    font-family: iranyekanfan;
    margin: -5px 6px 0 0;
    display: inline-block;
}

.UserCustomer_Auth {
    float: right;
    width: 100%;
    padding: 29px;
    text-align: center;
}
.UserCustomer_Auth h2 {
    float: right;
    width: 100%;
    text-align: center;
    font-size: 21px;
    font-weight: 900;
    color: var(--first);
}
.UserCustomer_Auth p {
    float: right;
    width: 100%;
    text-align: center;
    font-size: 14px;
}

.First_profile {
    float: right;
    width: 100%;
    padding: 20px;
    text-align: center;
}
.First_profile h2 {
    width: 100%;
    font-size: 26px;
    font-weight: 900;
    color: var(--bs-gray-dark);
}
.First_profile p {
    float: right;
    width: 100%;
    text-align: center;
    font-size: 16px;
    margin: 4px 0 10px 0;
}
.First_profile a {
    display: inline-block;
    background: var(--second);
    color: #fff;
    text-decoration: none;
    padding: 10px 34px;
    border-radius: 10px;
    margin: 6px 0 0 0;
}

.PaymentLegal {
    float: left;
    margin: 15px 0 0 0;
    background: var(--second);
    color: #fff!important;
    text-decoration: none!important;
    padding: 10px 36px;
    border-radius: 50px;
    margin: 22px 0 0 11px;
}
.List_of_detail.showFull li {
    width: 98%;
}

.socialLink {
    display: inline-block;
    background: var(--second);
    color: #fff!important;
    width: 30px;
    height: 30px;
    padding: 0;
    font-size: 20px;
    text-align: center;
    padding: 2px 6px 0 0;
    text-decoration: none;
    border-radius: 6px;
    margin: 0 3px 0 0;
}
.socialLink.telegram {
    background: var(--bs-blue);
}


.SearchLog {
    float: right;
    width: 100%;
    background: #eee;
    padding: 17px 20px;
    margin: 0 0 20px 0;
    border-radius: 10px;
}
.list_of_data li .ActionForOrder.removeAccount {
    background: var(--bs-danger);
}
.PaymentNotification {
    float: right;
    width: 100%;
    text-align: right;
    padding: 10px 12px 0 11px;
    font-size: 14px;
    text-align: right;
    color: var(--bs-red);
}

.show_more {
    background: var(--bs-gray);
    color: #fff !important;
    text-decoration: none;
    padding: 4px 10px 0;
    border-radius: 50px;
}
.savetoFin {
    display: inline-block;
    background: var(--bs-danger);
    color: #fff !important;
    text-decoration: none;
    padding: 3px 10px 3px;
    border-radius: 50px;
}
.saved {
    background: var(--second);
    width: 30px;
    display: inline-block;
    height: 30px;
    color: #fff;
    font-size: 20px;
    text-align: center;
    padding: 2px 3px 0 0;
    border-radius: 5px;
}
.ShowInvoice , .ShowInvoiceAcademy,.ShowInvoiceWallet{
    display: inline-block;
    background: var(--bs-yellow);
    color: #000 !important;
    text-decoration: none;
    font-size: 13px;
    padding: 3px 10px 0;
    border-radius: 50px;
}

.ShowInvoiceDiv {
    float: right;
    width: 100%;
    padding: 25px;
}
.ShowInvoiceDiv h3 {
    float: left;
    width: 100%;
    text-align: center;
    font-size: 20px;
    color: var(--bs-green);
}
.ShowInvoiceDiv .show_invoice {
    float: right;
    width: 100%;
    padding: 0;
    margin: 10px 0 0 0;
    list-style: none;
}
.ShowInvoiceDiv .show_invoice li {
    float: right;
    width: 100%;
    padding: 10px 0;
    position: relative;
}
.ShowInvoiceDiv .show_invoice li:after {
    position: absolute;
    content: "";
    width: 100%;
    border-bottom: 2px dotted #999;
    right: 0;
    top: 50%;
}
.ShowInvoiceDiv .show_invoice span {
    position: relative;
    background: #fff;
    z-index: 9;
    font-size: 14px;
    padding: 0 0 0 7px;
}
.ShowInvoiceDiv .show_invoice b {
    float: left;
    background: #fff;
    position: relative;
    z-index: 9;
    color: var(--first);
    font-family: iranyekanfan;
    padding: 0 9px 0 0;
}
.last_change {
    float: right;
    width: 100%;
    font-size: 13px;
    margin: -9px 0 0 0;
    color: var(--bs-red);
}
.ComplateProfile.green {
    background: var(--second);
}


.list_of_data li.large {
    width: 100%;
}
span.dept {
    background: var(--bs-yellow);
    color: #000;
    font-size: 12px;
    padding: 2px 10px 0;
    border-radius: 19px;
}
span.imp {
    background: var(--bs-info);
    color: #fff;
    font-size: 12px;
    padding: 2px 10px 0;
    border-radius: 50px;
}
span.st_tick {
    background: var(--bs-gray);
    color: #fff;
    padding: 2px 10px 0;
    font-size: 12px;
    border-radius: 50px;
}

.List_Of_ticket_item {
    float: right;
    width: 100%;
    background: #fff;
    padding: 20px;
    margin: 14px 0 0 0;
    border: ;
}
.List_Of_ticket_item .ticketItem {
    float: right;
    width: 80%;
    background: #ffffff;
    padding: 17px 36px;
    border-radius: 10px;
    border: 1px solid #eee;
    margin: 0 0 14px 0;
}
.List_Of_ticket_item .ticketItem h5 {
    float: right;
    width: 100%;
    text-align: right;
    font-weight: bold;
    color: var(--first);
    border-bottom: 1px solid #eee;
    padding: 10px 0;
}
.List_Of_ticket_item .ticketItem .date {
    float: right;
    font-family: iranyekanfan;
    font-size: 12px;
    margin: 11px 17px 0 0;
}
.List_Of_ticket_item .ticketItem .text_ticket {
    float: right;
    width: 100%;
    background: #fff;
    border: 1px dashed var(--bs-blue);
    padding: 20px;
    margin: 12px 0 12px 0px;
}
.List_Of_ticket_item .ticketItem .text_ticket p {
    font-size: 17px;
    margin: 0;
}
.List_Of_ticket_item .ticketItem .sender {
    float: right;
    margin: 10px 0 0 0;
    border-left: 1px solid #ccc;
    padding: 0 0 0 17px;
    font-size: 13px;
}

.List_of_Attachment {
    float: right;
    width: 100%;
    margin: 13px 0 0px 0;
    border-top: 1px solid #eee;
    padding: 8px 0 0 0;
}
.List_of_Attachment span {
    float: right;
    width: 100%;
    color: ;
}
.List_of_Attachment .attachment_list {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
}
.List_of_Attachment .attachment_list li {
    float: right;
    margin: 0 0 0 7px;
}
.List_of_Attachment .attachment_list li a {
    float: right;
    width: 100%;
    font-size: 12px;
    padding: 6px 22px 2px;
    background: var(--bs-yellow);
    text-decoration: none;
    color: #000;
    border-radius: 50px;
    margin: ;
}

.List_Of_ticket_item .ticketItem.another {
    float: left;
    background: #f5f8f8;
}
.CloseTicket
{
    float: left;
    background: var(--bs-danger);
    text-align: center;
    color: #fff;
    padding: 10px 43px;
    margin: 6px 0 17px 1%;
    border-radius: 5px;
    cursor: pointer;
    font-size: 13px;
}
.disabled_vpn {
    float: right;
    width: 100%;
    text-align: center;
    margin: 15px 0 -14px 0;
    font-size: 13px;
    color: var(--bs-red);
}
.ContractIMG {
    float: right;
    width: 100%;
    padding: 11px 10px;
    text-align: center;
    color: #000;
    text-decoration: none;
    border: 1px solid #ccc;
    margin: 11px 1% 0;
    border-radius: 6px;
}
.title .account {
    background: var(--bs-yellow);
    color: #000;
    padding: 0 0 0 0;
    border-radius: 10px;
    display: inline-block;
    padding: 2px 10px 0;
    font-family: iransansfan;
    font-size: 16px;
    margin: 0 9px 0 0;
}
.ReserveMethod {
    float: right;
    width: 96%;
    background: var(--bs-orange);
    color: #fff;
    margin: 10px 2% -15px;
    padding: 13px 0;
    text-align: center;
    border-radius: 10px;
}
.CheckdOrder {
    cursor: pointer;
}
.promotion_badge {
    display: inline-block;
    background: var(--bs-yellow);
    font-size: 12px;
    padding: 1px 9px;
    border-radius: 10px;
    top: -3px;
    position: relative;
    right: 2px;
}
.SetLicenceKEY {
    display: inline-block;
    background: var(--bs-warning);
    color: #000;
    font-size: 12px;
    padding: 3px 12px 2px;
    border-radius: 50px;
    cursor: pointer;
}
#SetLicenceAjax {
    float: right;
    width: 100%;
    padding: 20px;
}

.sep_line {
    float: right;
    width: 100%;
    text-align: center;
    margin: 40px 0 30px 0;
    position: relative;
}
.sep_line:after {
    position: absolute;
    width: 100%;
    height: 1px;
    border-bottom: 2px dotted var(--bs-orange);
    right: 0;
    top: 11px;
    content: "";
}
.sep_line b {
    position: relative;
    z-index: 9;
    background: #fff;
    padding: 0 14px;
    font-weight: normal;
    color: var(--bs-orange);
}
.select2-selection.select2-selection--multiple {
    background: #fff!important;
    box-shadow: 0 0 10px rgba(0,0,0,0.09)!important;
    border: 1px solid #ccc!important;
    border-radius: 50px!important;
    padding: 10px 10px 5px!important;
}

.project_badge {
    background: var(--bs-warning);
    font-size: 14px;
    padding: 4px 10px 0;
    border-radius: 19px;
}

.service_badge {
    background: var(--bs-yellow);
    font-size: 13px;
    padding: 4px 10px 2px;
    border-radius: 50px;
}

.project_manager_name {
    background: var(--first);
    color: #fff;
    padding: 2px 10px 0;
    border-radius: 50px;
}

.add_task {
    float: right;
    width: 98%;
    background: #fff;
    border: 1px solid #ccc;
    text-align: center;
    color: #777;
    padding: 10px 0;
    border-radius: 50px;
    margin: 30px 1% 0 0;
    font-size: 13px;
    cursor: pointer;
}
.assignTask {
    background: var(--bs-green);
    color: #fff!important;
    font-size: 13px;
    text-decoration: none;
    padding: 4px 10px 2px;
    border-radius: 50px;
}
.DetailOfRequest.NoWrap {
    width: 100%;
    flex-wrap: nowrap;
    display: flex;
    margin:0;
}



.header_tax {
    float: right;
    width: 100%;
}
.content.TaskList .body_tax {
    float: right;
    width: 100%;
    border-top: 1px solid #eee;
    padding: 15px;
    display: none;
}
.header_tax .Title {
    float: right;
    width: 50%;
}
.header_tax .access {
    float: left;
    width: 50%;
    text-align: ;
}
.header_tax input {
    border: 0;
    border-top-color: currentcolor;
    border-right-color: currentcolor;
    border-bottom-color: currentcolor;
    border-left-color: currentcolor;
    box-shadow: none;
    font-size: 19px;
    cursor: no-drop;
}
.header_tax .access ul {
    float: left;
    display: flex;
    list-style: none;
    padding: 0;
    margin: 6px 0 0 0;
}
.header_tax .access ul div {
    float: left;
    background: var(--bs-success);
    color: #fff;
    font-size: 13px;
    padding: 5px 10px;
    border-radius: 50px;
    position:relative;
}
.header_tax .access ul div.clone_cat {
    background: var(--bs-gray);
    margin: 0 10px 0 0;
    cursor: pointer;
}
.body_tax .task_item {
    float: right;
    width: 100%;
    border-bottom: 1px solid #eee;
    padding: 9px;
    background: #fafafa;
    margin: 0 0 2px 0;
}
.body_tax .task_item.active {
    background: transparent;
}
.body_tax .task_item .active_task {
    float: left;
    background: var(--second);
    color: #fff;
    padding: 2px 10px;
    font-size: 13px;
    padding: 5px 10px;
    border-radius: 50px;
    position: relative;
}
.body_tax .task_item .active_task input {
    position: absolute;
    width: 100%;
    height: 100%;
    right: 0;
    top: 0;
    opacity: 0;
    cursor: pointer;
    z-index: 9;
}
.content.TaskList.active .body_tax {
    display: block;
}
.header_tax .access ul div.active_cat input {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    z-index: 9;
    right: 0;
    cursor: pointer;
    opacity: 0;
}

.header_tax .access ul div.active_cat.active {
    background: var(--bs-danger);
    color: transparent;
    position: relative;
}
.header_tax .access ul div.active_cat.active:after {
    position: absolute;
    content: "غیرفعال سازی";
    right: 0;
    top: 6px;
    width: 100%;
    height: 100%;
    color: #fff;
    font-size: 12px;
    text-align: center;
}
.content.TaskList.active .header_tax input {
    border: 1px solid #eee;
    margin-bottom: 10px;
    cursor: inherit;
}

.body_tax .task_item .active_task.active {
    background: var(--bs-danger);
    color: transparent;
}
.body_tax .task_item .active_task.active:after {
    position: absolute;
    content: "غیرفعال";
    width: 100%;
    height: 100%;
    right: 0;
    top: 0;
    color: #fff;
    text-align: center;
    top: 6px;
}

.body_tax .task_item #task_item {
    float: right;
    width: 50%;
    border: 0;
    background: transparent !important;
    box-shadow: none;
    cursor: no-drop;
}
.body_tax .task_item.active #task_item {
    border: 1px solid #eee;
}

.body_tax .task_item .clone_item_task {
    float: left;
    background: var(--bs-gray);
    color: #fff;
    font-size: 13px;
    padding: 5px 10px;
    border-radius: 50px;
    margin: 0 7px 0 0;
    cursor: pointer;
}


#AssignProjectToTask .btn {
    float: left;
    width: calc(100% - 290px);
    margin: 0 0 50px 22px;
}

.AddAnotherTask {
    float: left;
    width: calc(100% - 319px);
    margin: 20px 0 30px 33px;
    text-align: center;
    background: var(--bs-yellow);
    color: #444;
    font-size: 14px;
    padding: 10px 0;
    border-radius: 50px;
    cursor: pointer;
}
.LoadMoreTask {
    display: none;
}
.LoadMoreTask.active {
    display: block;
}

.body_tax .task_item .SettingTask {
    float: right;
    width: 100%;
    background: #eee;
    padding: 10px;
    display: flex;
    flex-wrap: nowrap;
    border-radius: 10px;
    margin: 12px 0 0 0;
}
.body_tax .task_item .SettingTask > div {
    width: 100%;
    padding: 10px;
}
.body_tax .task_item .SettingTask span {
    float: right;
    width: 100%;
    font-size: 13px;
    margin: 0 0 6px 0;
}

.content.ManagerList .row {
    background: transparent;
    padding: 0;
    box-shadow: none;
}
.personal_list_show {
    float: right;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: nowrap;
}
.personal_list_show li {
    float: right;
    width: 100%;
    padding: ;
}
.personal_list_show li .box_team {
    float: right;
    width: 98%;
    background: #fff;
    box-shadow: 0 0 20px rgba(0,0,0,0.09);
    padding: 35px;
    text-align: center;
    border: 2px solid transparent;
    position: relative;
}
.personal_list_show li .box_team .thumb {
    display: inline-block;
    width: 100px;
    height: 100px;
    background-size: cover;
    border-radius: 50%;
}
.personal_list_show li .box_team .name {
    float: right;
    width: 100%;
    text-align: center;
    color: #333;
    font-size: 15px;
    font-weight: 900;
}
.personal_list_show li .box_team .name i {
    color: var(--bs-blue);
    font-size: 18px;
    position: relative;
    top: 2px;
    right: -2px;
}
.personal_list_show li .box_team .side {
    font-size: 13px;
    color: #666;
}
.personal_list_show li.manager .box_team {
    border: 2px solid var(--bs-blue);
}
.personal_list_show li.manager .box_team::after
{
    position: absolute;
    content: "مدیر پروژه";
    background: var(--bs-blue);
    color: #fff;
    font-size: 13px;
    font-weight: normal;
    padding: 2px 10px;
    border-radius: 50px;
    bottom: -12px;
    width: 100px;
    right: calc(50% - 50px);
}

.header_tax .access ul div.show_body {
    margin: 0 7px 0 0;
    cursor: pointer;
}


.header_tax .access ul div.show_body.active {
    color: transparent;
}
.header_tax .access ul div.show_body.active:after {
    position: absolute;
    content: "بستن";
    right: 0;
    top: 5px;
    width: 100%;
    height: 100%;
    color: #fff;
    text-align: center;
    z-index: 0;
}

.Main .content.hide_body .body_tax {
    display: none;
}
.header_tax .Title > span {
    position: absolute;
    right: -30px;
    background: var(--bs-yellow);
    width: 30px;
    text-align: center;
    border-radius: 50px;
    height: 30px;
    padding: 6px 0 0 0;
    font-family: iranyekanfan;
    font-size: 13px;
    top: 6px;
}
.header_tax .Title {
    position: relative;
}


.content.CalenderProject .row {
    background: transparent;
    box-shadow: none;
    padding: 0;
    margin: 40px 0 0 0;
}
.Calender_show_date {
    background: #e5e5e5;
    border-radius: 5px;
    float: right;
    width:100%;
}



.Calender_show_date .section_time {
    float: right;
    width: 100%;
    border-bottom: 1px solid #ccc;
    position: relative;
}
.Calender_show_date .section_time .timeShow {
    float: right;
    background: #fff;
    padding: 26px;
    text-align: center;
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    width: 200px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.Calender_show_date .section_time .timeShow .dat {
    display: inline-block;
    background: #d7d7d7;
    font-size: 13px;
    padding: 1px 20px;
    border-radius: 50px;
}
.Calender_show_date .section_time .timeShow .date {
    float: right;
    width: 100%;
    text-align: center;
}
.Calender_show_date .section_time .timeShow .date {
    font-family: iranyekanfan;
    font-size: 13px;
    margin: 5px 0 0 0;
}



.Calender_show_date .section_time .Task_show
{
    float: left;
    width: calc(100% - 200px);
    min-height: 101px;
    padding: 9px;
    display: flex;
    flex-wrap: wrap;
    overflow: scroll;
}
.Calender_show_date .section_time .Task_show .TaskItemParent.\31
{
    order: 1000;
    opacity: 0.9;
    transform: scale(0.9);
}
.Calender_show_date .section_time .Task_show .task_item {
    float: right;
    background: #fff;
    box-shadow: 0 0 10px rgba(0,0,0,0.09);
    border-radius: 5px;
    padding: 5px 10px;
    display: flex;
    align-items: center;
    margin: 0 0 7px 15px;
    position: relative;
    height: 52px;
}
.Calender_show_date .section_time .Task_show .task_item .task {
    font-size: 13px;
}
.Calender_show_date .section_time .Task_show .task_item .user {
    width: 40px;
    height: 40px;
    position: relative;
}
.Calender_show_date .section_time .Task_show .task_item .user .thumb {
    width: 30px;
    height: 30px;
    border-radius: 50px;
    background-size: cover;
    background-position: center;
    margin: 4px 8px 0 0;
}
.Calender_show_date .section_time .Task_show .task_item .user .title {
    position: absolute;
    font-size: 10px;
    background: var(--bs-yellow);
    color: #000;
    top: 27px;
    border-radius: 50px;
    padding: 0 2px;
    width: 50px;
    text-align: center;
    overflow: hidden;
    right: -4px;
    height: 15px;
}
.Calender_show_date .section_time.holyday {
    filter: blur(1.5px);
    position: relative;
    cursor: no-drop;
}

.DoneTaskList {
    float: left;
    background: var(--bs-green);
    color: #fff;
    font-size: 13px;
    padding: 8px 20px;
    border-radius: 50px;
    margin: -5px 0 0 0;
    font-weight: normal;
    cursor: pointer;
}

.Calender_show_date .section_time .Task_show .task_item.active
{
    position: relative;
    border: 2px solid var(--bs-teal);
}

.list_of_data.head {
    padding: 12px;
}
.TextAreaCourse {
    margin: 0;
}
.FileOfComment_place .form-group.eightel {
    width: 100%;
    margin: 32px 0;
}
.AlertNotCompleteOrder {
    font-size: 9px;
}

.OffsetFromOrder {
    display: inline-block;
    background: var(--bs-indigo);
    color: #fff;
    font-size: 13px;
    padding: 2px 6px;
    border-radius: 50px;
    margin: 0 0 5px 0;
    cursor: pointer;
}


#offsetOrderAjax {
    padding: 20px;
}
#offsetOrderAjax p {
    float: right;
    width: 100%;
    text-align: center;
    font-size: 18px;
    color: var(--first);
    margin: 0;
}
#offsetOrderAjax .ListOfOrder {
    float: right;
    width: 100%;
    background: #fefefe;
    border: 1px solid #eee;
    padding: 10px;
}
#offsetOrderAjax .ListOfOrder label {
    float: right;
    width: 100%;
    border-bottom: 1px solid #eee;
    padding: 10px;
    height: auto;
    cursor: pointer;
}
#offsetOrderAjax .ListOfOrder label span {
    float: right;
    margin: 0 0px 4px 7px;
}
#offsetOrderAjax .ListOfOrder label span i {
    font-style: normal;
    float: right;
}
#offsetOrderAjax .ListOfOrder label span b {
    font-size: 14px;
    background: var(--bs-yellow);
    font-weight: normal;
    float: right;
    border-radius: 50px;
    padding: 2px 12px 0;
}
#offsetOrderAjax .ListOfOrder label #select_order_offset {
    float: right;
    margin: 2px 0 0 6px;
}
.account_id {
    display: inline-block;
    background: var(--bs-yellow);
    border-radius: 50px;
}

.MobileAccount {
    display: inline-block;
    background: var(--bs-gray-dark);
    color: #fff !important;
    text-decoration: none;
    padding: 2px 10px 0;
    border-radius: 50px;
    font-size: 13px;
}

.ShowDetailTask .ContentTaskShow .LoadTask {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    right: 0;
    top: 0;
    color: #666;
}


#WebsiteInput {
    float: right;
    width: 100%;
    height: 60px;
    border-radius: 6px;
    text-align: center;
    font-size: 21px;
    padding: 2px 0 3px 0;
    font-family: iranyekanfan;
    font-size: 20px;
    color: #000;
    letter-spacing: 2px;
    font-weight: 300;
}
#WebsiteInput::placeholder {
    color: #AFAFAF;
}



.List_of_keyword {
    float: right;
    width: 100%;
    margin: 10px 0;
}
.List_of_keyword .addKeyword {
    width: 100%;
    border-radius: 10px;
    background: #fff;
    position: relative;
    float: right;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
.List_of_keyword .addKeyword input {
    float: right;
    width: 100%;
    height: 53px;
    border: 0;
    box-shadow: none;
}
.List_of_keyword .addKeyword .add_keyword_btn {
    position: absolute;
    left: 0;
    background: var(--bs-teal);
    color: #fff;
    font-size: 15px;
    padding: 7px 20px;
    border-radius: 10px;
    font-weight: 100;
    top: 8px;
    left: 13px;
    cursor: pointer;
}


.PlaceOfKeyword {
    float: right;
    width: 100%;
    border: 1px dashed #ccc;
    padding: 10px;
    margin: 11px 0 0 0;
    min-height: 50px;
    background: #fbfbfb;
    position: relative;
}
.PlaceOfKeyword:after {
    position: absolute;
    content: "لیست کلمات کلیدی شما";
    width: 100%;
    height: 100%;
    right: 0;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    color: #999;
}
.PlaceOfKeyword .key_item {
    float: right;
    background: #fff;
    box-shadow: 0 0 10px rgba(0,0,0,0.09);
    padding: 9px;
    border-radius: 5px;
    position: relative;
    margin: 4px 0 4px 9px;
    z-index: 9;
}
.PlaceOfKeyword .key_item input {
    background: transparent;
    box-shadow: none;
    border: 0;
    width:  100px !important;
    max-width: auto !important;
    text-align: center;
    font-size: 13px;
}
.PlaceOfKeyword .key_item .remove {
    position: absolute;
    font-style: normal;
    font-size: 13px;
    left: 7px;
    top: 1px;
    font-family: tahoma;
    color: red;
    cursor: pointer;
    z-index: 9;
    cursor: pointer;
}

.Select_package.hideMorePackage li {
    display: none;
}
.Select_package.hideMorePackage > li.active {
    display: block;
    width: 33.3%;
}
.Select_package > li .left .desc ul {
    float: right;
    width: 100%;
    height: auto;
    color: #000;
}
.Select_package > li .left .desc ul li {
    display: block;
}



.BuyStore {
    display: inline-block;
    background: var(--wp--preset--color--vivid-red);
    color: #fff!important;
    text-decoration: none;
    padding: 3px 0;
    margin: 0;
    display: inline-block;
    position: relative;
    top: -3px;
    padding: 5px 10px;
    border-radius: 6px;
    margin: 0 1px;
}