@font-face {
    font-family: "IRANSans";
    font-style: normal;
    src: url("../fonts/IRANSansWeb.eot");
    src: url("../fonts/IRANSansWeb.eot?#iefix") format("embedded-opentype"), url("../fonts/IRANSansWeb.woff2") format("woff2"), url("../fonts/IRANSansWeb.woff") format("woff"), url("../fonts/IRANSansWeb.ttf") format("truetype");
}

:root {

    --main-color: #00c5b6;
    --main-color-lighter:#f8f4f4;
    --main-color-darker:#777777;

    --main-color-lighter-hover: yellow;
    --text-in-main-color:white;

    --color-background-light:  #f8f9fa;
    --color-background-light-text-in:  black;


    --color-text-main:black;

    --color-2 : blue;
    --color-2-hover : blue;

    --color-3 : blue;
    --color-3-hover : blue;

    --color-4 : blue;
    --color-4-hover : blue;
}

.camera-num {
    position: absolute;
    left: 5px;

}

.product_cart_video {
    padding: 10px;
    flex: 1 0 100px;
    -ms-flex: 1 0 100px;
    min-width: 24%;
    max-width: 24%;
    margin: -0.5px;
    position: relative;
    overflow: hidden;
    min-height: 200px;
    transition: all 300ms;
}

@media (max-width: 2560px) {
    .product_cart_video {
        min-width: 18%;
        max-width: 19%;
    }
}

@media (max-width: 1921px) {
    .product_cart_video {
        min-width: 24%;
        max-width: 25%;
    }
}

@media (max-width: 1650px) {
    .product_cart_video {
        min-width: 25%;
        max-width: 25%;
    }
}


@media (max-width: 1431px) {
    .product_cart_video {
        min-width: 30%;
        max-width: 31%;
    }
}


@media (max-width: 1180px) {
    .product_cart_video {
        min-width: 32%;
        max-width: 32%;
    }
}

@media (max-width: 1181px)
{
    .product_cart_video {
        min-width: 32%;
        max-width: 32%;
    }
}



@media (max-width: 860px) {
    .product_cart_video {
        min-width: 48%;
        max-width: 50%;
    }
}


@media (max-width: 500px) {
    .product_cart_video {
        min-width: 98%;
        max-width: 100%;
    }
}



@media (max-width: 380px) {
    .product_cart_video {
        min-width: 100%;
        max-width: 100%;
    }
    .mobile_wrapper {
        flex: unset;
        -ms-flex: unset;
    }
    .header_wrapper {
        justify-content: space-between;
    }
}


.video-card-image img { transition: all 0.3s ease; }




.text-under-pagination{
    color:var(--main-color-darker);
    font-weight: 600;
    display: flex;
    justify-content: space-around;
    margin-top: -30px;
}


html {
    font-size: 15px;
}

body {
    font-family: "IRANSans";
    text-align: right;
    direction: rtl;
    /*font-weight: 600;*/
}

input,
button,
select,
option {
    font-family: "IRANSans";
}

ul {
    padding-right: 0;
}

li {
    list-style-type: none;
}

a {
    text-decoration: none !important;
}

button,
input {
    outline: none !important;
}

.overlay {
    background-color: rgba(0, 0, 0, 0.7);
    display: none;
    z-index: 9999999;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
}

.overlay-container {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    user-select: none;
}

.overlay-container .overlay-side {
    cursor: pointer;
    background-color: rgba(0, 0, 0, 0);
    width: 10%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    transition: all 0.3s;
}

.overlay-container .overlay-side:hover {
    background-color: rgba(0, 0, 0, 0.3);
}

.overlay-container .overlay-side i {
    font-size: 100px;
    color: rgba(255, 255, 255, 0.5);
    transition: all 0.3s;
    pointer-events: none;
}

@media (max-width: 600px) {
    .overlay-container .overlay-side i {
        font-size: 40px;
    }
}

@media (max-width: 900px) {
    .overlay-container .overlay-side i {
        font-size: 50px;
    }
}

@media (max-width: 1200px) {
    .overlay-container .overlay-side i {
        font-size: 70px;
    }
}

.overlay-container .overlay-side:hover i {
    color: rgba(255, 255, 255, 0.8);
}

.overlay-container .overlay-left {
    left: 0;
    top: 0;
}

.overlay-container .overlay-right {
    right: 0;
    top: 0;
}

.lds-ring {
    display: inline-block;
    position: relative;
    width: 64px;
    height: 64px;
}

.lds-ring div {
    box-sizing: border-box;
    display: block;
    position: absolute;
    width: 51px;
    height: 51px;
    margin: 6px;
    border: 6px solid #fff;
    border-radius: 50%;
    animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    border-color: #fff transparent transparent transparent;
}

.lds-ring div:nth-child(1) {
    animation-delay: -0.45s;
}

.lds-ring div:nth-child(2) {
    animation-delay: -0.3s;
}

.lds-ring div:nth-child(3) {
    animation-delay: -0.15s;
}

@keyframes lds-ring {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}


/*------header-----*/

.header_wrapper {
    display: flex;
    display: -ms-flexbox;
    justify-content: center;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    width: 1920px;
    margin: 0 auto;
    max-width: 100%;
    /* border-bottom: 2px solid #efecec; */
}

.header_wrapper nav {
    flex: 2 0 100px;
    -ms-flex: 2 0 100px;
    margin-top: 15px;
    margin-bottom: 0px;

}

.header_wrapper nav>ul>li {
    float: right;
    margin: 12px 11px;
    font-size: 1rem;
    position: relative;
}

.header_wrapper nav>ul>li>a {
    color: var(--main-color-darker);
    transition: all 200ms;
    font-weight: 600;
}

.header_wrapper nav>ul>li:hover>a {
    color: var(--main-color);
}

.header_wrapper nav>ul>li:hover .sub_topmenu {
    display: flex;
    display: -ms-flexbox;
    justify-content: center;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
}

.header_wrapper .sub_topmenu {
    position: absolute;
    background: #00c5b6;
    z-index: 10;
    border-top: 39px solid #ffffff;
    display: none;
    min-width: 800px;
    color: #ffffff;
}

.header_wrapper .sub_topmenu>div {
    flex: 1 0 100px;
    -ms-flex: 1 0 100px;
    text-align: center;
    border-left: 1px solid #efecec;
    margin: 25px auto;
}

.header_wrapper .sub_topmenu>div h5 {
    margin: 20px auto;
}

.header_wrapper .sub_topmenu>div h6 {
    margin-top: 20px;
}

.header_wrapper .sub_topmenu>div h6 a {
    color: inherit;
}

.header_wrapper .sub_topmenu>div h6 .fa {
    margin-right: 10px;
    font-size: 1.4rem;
    position: relative;
    top: 3px;
}

.header_wrapper .sub_topmenu>div:last-child {
    border: none;
}

.header_wrapper .sub_topmenu>img {
    width: 100px;
    margin-bottom: 20px;
}

.header_wrapper .sub_topmenuitems {
    display: flex;
    display: -ms-flexbox;
    justify-content: center;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    justify-content: space-between;
}

.header_wrapper .sub_topmenuitems ul {
    flex: 1 0 100px;
    -ms-flex: 1 0 100px;
    text-align: center;
}

.header_wrapper .sub_topmenuitems ul:first-child {
    border-left: 1px solid #efecec;
}

.header_wrapper .sub_topmenuitems ul li {
    padding: 10px 0;
}

.header_wrapper .sub_topmenuitems a {
    color: #ffffff;
}

.header_wrapper .link_items {
    padding-top: 15px;
}

.header_wrapper .link_items form {
    display: inline-block;
}

.link_items-a {
    padding: 10px 20px 10px 20px;
    position: relative;
    font-size: 0.9rem;
}

.link_panel {
    background: var(--main-color);
    border-radius: 5px;
    color: var(--text-in-main-color);
    font-weight: 600;
}

.link-login-logout {
    background: var(--text-in-main-color);
    color: var(--main-color);
    border: none;
    padding-left: 5px;
    padding-right: 10px;
    font-weight: 600;
}

.header_wrapper .link_items a:nth-child(3) {
    color: var(--main-color);
    border: none;
    border-right: 1px solid;
    border-left: 1px solid;

}

.package-button{
    width: 90%;
    margin:auto;
}

.link_panel:hover {
    animation: pulse 1s;
    box-shadow: 0 0 0 1em rgba(255, 255, 255, 0);
    color:var(--text-in-main-color);
}
.prev,
.next{
    color: var(--main-color);
}
.prev:hover,
.next:hover{
    color: var(--main-color-darker);
}
@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 #00c5b6;
    }
}

.link-login-logout {
    border-left: 1px solid #efecec;
    color: #00c5b6;
    text-decoration: none;
}


.logo_item_top_img{
    max-width: 160px;
    top: 5px;
    position: relative;
}

.header-shop-card-span {
    position: relative;
    top: -11px;
    background: var(--main-color);
    width: 17px;
    height: 17px;
    border-radius: 50%;
    color: var(--text-in-main-color);
    text-align: center;
    font-size: 0.9rem;
    left: -6px;
}

.mobile_wrapper {
    flex: 2 0 100px;
    -ms-flex: 2 0 100px;
    display: none;
}

.mobile_menuicon {
    position: relative;
    top: 3px;
    width: 20px;
    cursor: pointer;
    padding-top: 10px;
    text-align: center;
    transition: all 300ms linear 0s;
    right: 15px;
}

.mobile_menuicon div {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #00c5b6;
    margin: 7px auto;
    cursor: pointer;
    position: relative;
}

.active_icon {
    transform: rotate(-90deg);
    margin-right: 15px;
    top: 11px;
}


/*------footer-----*/

footer {
    background: #434343;
}

.footer_wrapper {
    display: flex;
    display: -ms-flexbox;
    justify-content: center;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    padding: 20px 0;
}

.footer_item {
    margin: 20px 10px;
    flex: 1 0 100px;
    -ms-flex: 1 0 100px;
    min-width: 30%;
    max-width: 30%;
    color: #eeeeee;
    border-left: 1px solid #949090;
}

.footer_item:last-child {
    border: none;
}

.footer_item h4 {
    margin-bottom: 20px;
}

.footer_item a {
    color: inherit;
}

.footer_item .fab ,
.footer_item .fa ,
.footer_item .fas

{
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #ffffff;
    color: var(--main-color);
    transition: all 100ms;
    text-align: center;
    font-size: 1.3rem;
    padding-top: 5px;
}

.footer_item li:hover .fab ,
.footer_item li:hover .fa ,
.footer_item li:hover .fas

{
    background: var(--main-color);
    color: #ffffff;
}

.footer_links {
    display: flex;
    display: -ms-flexbox;
    justify-content: center;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    justify-content: space-between;
    padding: 50px 0 0 50px;
}

.footer_links li {
    padding: 5px 0;
}

.footerfa_info li {
    padding: 3px 0;
    font-size: 1.1rem;
}

.footerfa_info li .fa {
    margin-left: 5px;
}

.footerfa_info p {
    line-height: 27px;
    margin-top: 30px;
}

.footeren_info h3 {
    text-align: left;
    font-weight: 400;
    font-size: 2.5rem;
}

.footeren_info p {
    text-align: left;
    font-size: 1.1rem;
    direction: ltr;
    margin-top: 30px;
    line-height: 27px;
}

.footeren_info li {
    float: left;
    margin: 3px;
}


/*----carousel--*/

.owl-prev {
    font-size: 0;
    position: absolute;
    left: 14px;
    top: 40%;
    text-align: center;
}

.owl-prev .fa {
    font-size: 2rem;
    color: #00c5b6;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #ffffff;
}

.owl-next {
    font-size: 0;
    position: absolute;
    right: 14px;
    top: 40%;
    text-align: center;
}

.owl-next .fa {
    font-size: 2rem;
    color: #00c5b6;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #ffffff;
}


/*------category-----*/


/* .category_items {
    display: flex;
    display: -ms-flexbox;
    justify-content: center;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    padding: 10px 0;
    justify-content: space-between;
    /* border-bottom: 2px solid #efecec; */


/* width: 1700px;
    max-width: 100%;
    margin: 0 auto;
    position: relative; */


/* } */

.category_items {
    display: flex;
    display: -ms-flexbox;
    flex-wrap: wrap;
    justify-content: center;
    -ms-flex-wrap: wrap;
    padding: 0px 0;
    width: 1700px;
    max-width: 100%;
    margin: -15px auto;
    position: relative;
}

#category-icon {
    background-color: #f8f4f4;
    padding-top: 20px;
    padding-bottom: 14px;
    border-bottom: solid 1px #c1bebe ;
    border-top: solid 1px #c1bebe ;
}





.item {
    border-bottom: 2px solid #efecec;
    border-top: 2px solid #efecec;
}

.category_item {
    width: 5.3%;
    text-align: center;
    padding-top:20px;
}

.category_item:last-child {
    border-left: none;
}

.category_item .category_pic {
    transition: all 300ms;
    min-height: 58px;
}

.category_item .category_pic>span {
    font-size: 3rem;
}

.category_item h6 {
    color: #777777;
    font-size: 12px;
    line-height: 25px;
    margin-top: 3px;
    transition: all 300ms;
}

.category_item:hover span:before {
    color: #00c5b6;
}

.category_item:hover {
    color: #00c5b6;
    border-left: 1.5px solid #efecec;
    border-right: 1.5px solid #efecec;
}

.category_item:hover h6 {
    border: 15px;
    color: #00c5b6;
}

.mobilecat_wrapper {
    background: #00c5b6;
    display: none;
    width: 100vw;
    position: relative;
    right: -15px;
}

.mobilecat_menuicon {
    position: relative;
    right: 18px;
    width: 30px;
    cursor: pointer;
    padding: 5px 0px;
    text-align: center;
    transition: all 300ms linear 0s;
}

.mobilecat_menuicon div {
    width: 28px;
    height: 2.2px;
    background: #ffffff;
    margin: 7px auto;
    cursor: pointer;
    position: relative;
    transition: all 300ms linear 0s;
}

.mobilecat_close div:first-child {
    transform: rotate(45deg);
    top: 5px;
}

.mobilecat_close div:nth-child(2) {
    display: none;
}

.mobilecat_close div:last-child {
    transform: rotate(-45deg);
    top: -5px;
}


/*---sub cat---*/

.sub-categoryleft .sub-category {
    left: 0px;
}

.sub-categoryleft .sub-category-item {
    flex-direction: row-reverse;
}

.sub-categoryleft .arrow_item {
    transform: rotate(-90deg) !important;
}

.sub-categoryleft .sub-sec-category {
    right: unset;
    left: 100%;
}

.category_item .sub-category {
    position: absolute;
    z-index: 1000;
    display: none;
    background: #f8f4f4;
    width: 100%;
    right: 0;
    text-align: right;
    border-radius: 3px;
    min-height: 200px;

}



.category_item:hover {
    cursor: pointer;
}


.sub-category.showsubcat
{
    display: block;

}



.category_item .sub-category>ul {
    display: inline-block;
    min-width: 400px;
    margin-bottom: 0;
}

.category_item .sub-category>ul>li {
    padding: 1px 10px;
    border-bottom: 0.2px solid #d4d4d4;
}

.category_item .sub-category>ul>li:hover {
    background: #fcfcfc;
}

.sub-category-item {
    color: #777777;
    margin: 3px auto;
    cursor: pointer;
    display: flex;
    display: -ms-flexbox;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
}

.sub-category>ul>li:hover .sub-category-item>span {
    font-size: 1rem;
}

.sub-category-item>span span {
    font-size: 1.5rem;
}


.hidden_icon {
    display: none !important;
}

.sub-category>ul>li:hover .sub-category-item>span .hidden_icon {
    display: block !important;
}

.sub-category>ul>li:hover .sub-category-item>span .icon-cat1-1 {
    display: none;
}

.sub-category-item span {
    font-size: 0;
    color: #00c5b6;
    float: right;
}

.sub-category-item h6 {
    margin: 0 10px;
    padding-top: 1px;
    color: #777777 !important;
    text-align: right;
}

.sub-category>ul>li:hover .sub-category-item h6 {
    color: #00c5b6 !important;
}

.sub-category-item .arrow_item {
    transition: all 300ms;
    filter: brightness(0);
    height: 10px;
    width: 10px;
    margin-top: 2px;
    transform: rotate(90deg);
}

.category_item:hover img.arrow_item {
    filter: brightness(0);
}

.sub-category>ul>li:hover .sub-category-item img.arrow_item {
    filter: unset;
}

.sub-sec-category {
    position: absolute;
    display: none;
    left: 0;
    padding: 15px;
    width: calc(100% - 400px);
    z-index: 1;
    top: 0;
    min-height: 100%;
    background: #fcfcfc;
}

.sub-sec-category ul {
    display: flex;
    display: -ms-flexbox;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
}

.category_item .sub-category>ul>li:hover .sub-sec-category {
    display: flex;
    display: -ms-flexbox;
    justify-content: center;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
}

.category_item .sub-category>ul>li:hover .sub-sec-category {
    display: block;
}

.sub-sec-category li {
    background: #f0f0f0;
    text-align: right;
    color: #777777;
    padding: 5px 20px;
    cursor: pointer;
    border-radius: 3px;
    margin: 10px;


}

.sub-sec-category li a {
    color: #777777;
}

.sub-sec-category li:hover {
    background: #00c5b6;
    color: #ffffff;
}

.sub-sec-category li:hover a {
    color: #ffffff;
}


/*----search----*/

.search_box {
    display: flex;
    display: -ms-flexbox;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    justify-content: space-between;
    background: var(--color-background-light);
    border-radius: 3px;
    margin-top: 20px;
    padding: 15px 15px 15px 15px;
    color: var(--main-color-darker);
    align-items: center;
}

.search_box-cat {
    display: flex;
    cursor: pointer;
}

.search_box-left-part{
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-grow: 1;
}

.search-drop-zone{
    border: 2px dashed #aaa;
    padding: 20px;
    text-align: center;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    max-width: 96%;
    align-items: flex-start;
}

.search_box-left-part-1{
    flex-grow: 1;
    max-width: 40%;
    margin-right: 20px;
    position: relative;
}

.search_box-left-part-2{
   display: flex;
    flex-grow: 1;
    justify-content: center;
}
.search_box-left-part-3{
    flex-grow: 1;
    max-width: 40%;
    margin-right: 20px;
    position: relative;
}


.search-drop-zone-input{
    padding-top: 15px;
    margin-bottom: -7px;
}

.search-box-left-part-button{
    border-radius: 7px;
    min-width: 18%;
    margin-left: 20px;
    border: none;
    padding: 23px 22px 20px 20px;
    background: var(--main-color);
}
.search_box-left-part-input{
    height: 50px;
    width: 95%;
    border: none;"
}

@media (max-width: 770px) {

    .search_box-left-part {
        gap: 10px;
        flex-direction: column;
    }
    .search_box-left-part-1{
        width: 100%;
    }
    .search_box-left-part-3{
        width: 100%;
        max-width: none;

    }
    .search-box-left-part-button{
        width: 95%;
        margin-left: 0;

    }

}


.all_cat {
    display: none;
    position: absolute;
    background: #f8f4f4;
    min-width: 35px;
    z-index: 1;
    margin-top: 30px;
}

.all_cat li {
    padding: 10px;
    transition: all 200ms;
}

.all_cat li:hover {
    background: #c6c0c0;
}

.search_cat {
    display: none;
    position: absolute !important;
    background: #f8f4f4;
    min-width: 100px;

    z-index: 1;
}

.search_cat ul {
    margin-bottom: 0;
    font-weight: 600;
    color:var(--main-color-darker)
}

.search_cat li {
    padding: 10px;
    transition: all 200ms;
}

.search_cat li:hover {
    background: #c6c0c0;
}


/*----products----*/

.products_wrapper {
    padding: 30px 0;
    display: flex;
    display: -ms-flexbox;
    justify-content: center;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    margin-right: 15px;
}

.products_wrapper .right_part {
    width: 290px;
}

.products_wrapper .left_part {
    width: calc(100% - 290px);
}


/*--right--*/

.search_word {
    background: #00c5b6;
    color: #ffffff;
    border-radius: 3px;
    text-align: center;
    padding: 10px 5px;
    display: none;
}

.search_word:hover {
    background: #525858;

}
.search_word2 {
    background: #00c5b6;
    color: #ffffff;
    border-radius: 3px;
    text-align: center;
    padding: 10px 5px;
    display: none;
    margin-top:5px;
    cursor: pointer;
}

.search_word2:hover {
    background: #525858;

}
.filter_items {
    border-bottom: 1px solid #f2f4f5;
}

.filter_items h4 {
    color: var(--main-color-darker);
    margin: 30px auto;
    font-weight: 700;
    font-size: 1.3rem;
    cursor: pointer;
}

.filter_item {
    display: flex;
    display: -ms-flexbox;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    justify-content: space-between;
    color: var(--main-color-darker);
    margin: 3px auto;
    padding: 4px 4px 6px 4px;
    border-radius: 5px;
    font-weight: 600;
    cursor: pointer;
    user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    font-size: 15px;
}

.filter_item input {
    display: none;
}

.filter_item input:checked~label:after {
    opacity: 1;
}

.filter_item input:checked~label:before {
    background: var(--main-color);
}

.filter_item label {
    position: relative;
    width: 100%;
    cursor: pointer;
}

.filter_item label:before,
.catmenu_item label:before{
    position: absolute;
    content: "";
    background: var(--main-color);
    width: 20px;
    height: 20px;
    border-radius: 3px;
    left: 0;
    top: 2px;
    border: solid 1px var(--main-color-darker);

}

.filter_item label:after,
.catmenu_item label:after
{
    position: absolute;
    content: "\f00c";
    font-family: "Font Awesome 6 Pro";
    width: 15px;
    height: 15px;
    left: 2px;
    top: 2px;
    color: var(--text-in-main-color);
    opacity: 0;

}


/*.catmenu_item label:before {*/
/*    background: var(--main-color);*/

/*    position: absolute;*/
/*    content: "";*/
/*    width: 20px;*/
/*    height: 20px;*/
/*    border-radius: 3px;*/
/*    left: 0;*/
/*    top: 2px;*/
/*    border: solid 1px var(--main-color-darker);*/
/*}*/

/*.catmenu_item label:after {*/
/*    position: absolute;*/
/*    content: "\f00c";*/
/*    font-family: "Font Awesome 6 Pro";*/
/*    width: 15px;*/
/*    height: 15px;*/
/*    left: 2px;*/
/*    top: 2px;*/
/*    color: #ffffff;*/
/*    opacity: 0;*/
/*}*/
.catmenu_item :hover{
    color: var(--main-color);

}

.filter_item:hover {
    color: var(--main-color);
}

.catmenu_items {
    border-bottom: 1px solid #f2f4f5;
}

.catmenu_items h4 {
    color: var(--main-color-darker);
    margin: 30px auto;
    font-weight: 700;
    font-size: 1.3rem;
    cursor: pointer;
    margin-bottom: 10px;
}

.catmenu_item {
    display: flex;
    display: -ms-flexbox;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    justify-content: right;
    color: #777777;
    padding: 4px;
    margin: 4px auto;
    cursor: pointer;
    border-radius: 4px;
}

.color-level-1{
    background: #f5f5f5;
}

.color-level-2{
    background: #e1e1e1;
}

.color-level-3{
    background: #eaeaea;
}

.color-filter{
    background: #f5f5f5;
}

.catmenu_item:hover span {
    font-size: 1rem;
}

.catmenu_item span span {
    font-size: 1.8rem;
}

.catmenu_item:hover span span {
    display: none;
}

.catmenu_item span {
    font-size: 0;
    color: var(--main-color-darker);
    width: 27px;
    height: 27px;
    display: inline-block;
}

.catmenu_item-h6
{
    color: var(--main-color-darker);
    font-weight:600 ;
    margin: 0 10px;
    padding-top: 1px;
    user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    flex: 1 0 100px;
    -ms-flex: 1 0 100px;
    font-size: 14px;
}

.sub_menu>.catmenu_intro {
    background: var(--main-color-lighter);
    border-radius: 5px;
    padding-right: 15px;
    padding-left: 15px;

    padding-top:5px ;
    padding-bottom:5px ;
    margin-top: 5px;
    margin-bottom: 5px;

}

.catmenu_intro>.catmenu_item .sub_menu {
    background: var(--color-background-light);
    margin-top: 10px;
    border-radius: 5px;
    padding: 5px 10px;
}

.catmenu_intro>.catmenu_item .sub_menu label {
    font-size: 0.9rem;
}

.sub_menu>.catmenu_intro h6 {
    font-size: 13px;
}

.catmenu_item .active_color {
    color: var(--main-color);
}

.catmenu_item .active_text {
    font-size: 1rem;
}

.catmenu_item .active_text span {
    display: none;
}

.catmenu_item .arrow_item {
    transition: all 300ms;
    transform: rotate(90deg);
    filter: brightness(0);
}

.catmenu_item .active_arrow {
    transform: rotate(0deg);
    filter: brightness(1);
}

.catmenu_item input {
    display: none;
}

.catmenu_item input:checked~label:after {
    opacity: 1;
}

.catmenu_item input:checked~label:before {
    background: var(--main-color);
}

.catmenu_item .sub_menu,
.catmenu_item .catsecmenu_item {
    display: none;
    width: 100%;
}

.catmenu_item .sub_menu label:after,
.catmenu_item .catsecmenu_item label:after {
    font-size: 1rem;
}

.catmenu_item .sub_menu:hover .subfilter_items,
.catmenu_item .catsecmenu_item:hover .subfilter_items {
    display: inline-block;
}

.catmenu_item .subfilter_items {
    display: none;
    width: 100%;
    padding-right: 10px;
}

.catmenu_item label {
    position: relative;
    height: 100%;
}


.company_items h4 {
    color: var(--main-color-darker);
    margin: 30px auto;
    font-weight: 700;
    font-size: 1.3rem;
    cursor: pointer;
    margin-bottom: 15px;
}

.company_items label {
    font-size: 14px;
}

.company_items label:after {
    font-size: 1rem;
}


/*--left---*/


/*------product filter------*/

.product_filters {
    display: flex;
    display: -ms-flexbox;
    justify-content: center;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    justify-content: space-between;
    padding: 0 20px;
    margin-bottom: 25px;
    font-weight: 600;
    color: var(--main-color-darker);

}

.product_filter ul .active_tab {
    background: var(--main-color);
    color: var(--main-color-lighter);
}

.product_filter ul li {
    float: right;
    font-weight: 600;
    margin-left: 7px;
    background: var(--main-color-lighter);
    border-radius: 3px;
    color: var(--main-color-darker);
    padding: 6px 15px;
    cursor: pointer;
}

.product_filter ul li:hover {
    background: var(--main-color);
    color: var(--main-color-lighter);
}

.product_filter>div {
    display: inline-block;
    margin-right: 7px;

}
.CopyAllLinkButton{
    padding: 5px 10px;
    background: var(--main-color);
    color: var(--text-in-main-color);
    font-size: 1rem;
    border: none;
    margin-right: 40px;
    margin-bottom: 15px;
    border-radius: 5px;
}
.CopyAllLinkButton:hover {
    background: var(--main-color-darker);
}
.product_filter>div select {
    background: var(--main-color-lighter) url(../images/icons/arrow.svg) no-repeat left 5px center;
    border-radius: 3px;
    color: var(--main-color-darker);
    border: none;
    padding: 6px 6px 6px 20px;
    appearance: none;
    font-weight: 600;
}

#selectitem {
    background: #f8f4f4;
    appearance: none;
    display: inline-block;
    border: none;
    color: var(--main-color-darker);
    margin-top: -6px;
}

.products_cart {
    display: flex;
    display: -ms-flexbox;
    justify-content: center;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
}

.product_cart {
    flex: 1 0 100px;
    -ms-flex: 1 0 100px;
    min-width: 16%;
    max-width: 16%;
    border-radius: 0px;
    margin: -0.5px;
    position: relative;
    overflow: hidden;
    border: 1px solid #f2f4f5;
    min-height: 200px;
    transition: all 300ms;
}

.biggerimg {
    position: fixed;
    width: auto;
    height: auto;
    display: block;
    opacity: 0;
    border: 1px solid #e8e3e3;
    border-radius: 5px;
    box-shadow: 0 0 50px rgba(0, 0, 0, .3);
    background-color: #ce8383b0;
    z-index: 500;
    left: 674px;
    top: 72px;
    max-height: 640px;
  	transition: "left 0.1s ease 0s";
    pointer-events:none;
}

.biggerimg-info {
    position: absolute;
    padding: 16px 18px 18px 32px;
    background: rgb(255, 255, 255);
    width: -webkit-fill-available
}

.biggerimg img {
    max-height: 640px;
    max-width: 640px;
    box-shadow: 0 0 10px #a9a9a9;
}


/* @media (min-width:992px) {
    .biggerimg {
        position: fixed;
        width: 100%;
        height: 105%;
        z-index: 1000;
        display: block;
        border-radius: 10px;
        overflow: hidden;
        pointer-events: none
    }
    .biggerimg img {
        max-width: 70%;
        max-height: 70%;
        box-shadow: 0 0 10px #a9a9a9;
        border-radius: 15px
    }
} */


/*
.product_pic:before {
position: absolute;
content: '';
top: 0;
right: 0;
width: 100%;
height: 100%;
background: linear-gradient(to bottom, rgba(72,76,97,0) 0%, rgba(72,76,97,0.8) 75%);
opacity: 0;
-webkit-transform: translate3d(0,100%,0);
transform: translate3d(0,100%,0);
}

.product_pic:hover:before {
opacity: 1;
-webkit-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);
}
*/

.productpic_intro:hover .overlay-product-container {
    /*opacity: 0.1;*/
    /*overflow: visible;*/
    /*position: relative;*/
    /*display: block*/
    opacity: 1;
}

.overlay-product{
    pointer-events: none;
    background: rgba(0,0,0,.3);
    position: absolute;
    padding-top: 8px;
    padding-left: 8px;
    padding-right: 8px;
    top: 8px;
    left: 8px;
    right: 8px;
    height: 100%;
    opacity: 1;
    transition: opacity .25s ease-out;
}
.overlay-product-container {
    opacity: 0;
}

.prev-product,
.next-product {
    cursor: pointer;
    position: absolute;
    top: 61px;
    width: auto;
    padding: 16px;
    /* margin-top: -50px; */
    color: #fcfcfc;
    font-weight: bold;
    font-size: 45px;
    border-radius: 3px 0 0 3px;
    user-select: none;
    -webkit-user-select: none;
    opacity: .9;
    transition: 0.4s;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -ms-transition: 0.4s;
    -o-transition: 0.4s;
}

.product_pic {
    width: 100%;
    position: relative;
    padding: 0px;
    /* border-style: solid;
    border-width: 1px;
    border-color: rgb(217, 217, 217) */
}

.product_pic img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    padding-top: 8px;
    padding-left: 8px;
    padding-right: 8px;
    /* border-style: solid; */
    /* border-width: 1px;
    border-color: rgb(217, 217, 217) */
}

.product_caption {
    display: none;
    justify-content: center;
    padding: 5px;
}

.product_caption span {
    font-size: 1.1rem;
    display: inline-block;
    width: 100%;
    text-align: left;
}

.product_caption span:last-child {
    color: #00c5b6;
}

.heart {
    position: absolute;
    top: 4px;
    right: 7px;
    font-size: 1.5rem;
}

.ai-article-info-heart {
    position: absolute;
    color: var(--main-color-darker);
    right: 12px;
    bottom: 1px;
    bottom: 2px;
    font-size: 1.2rem;
    font-weight: 330;
}

.ai-article-info-share {
    position: absolute;
    color: var(--main-color-darker);
    right: 38px;
    bottom: 2px;
    font-size: 1.2rem;
}

.ai-article-info-edit {
    position: absolute;
    color: var(--main-color-darker);
    right: 60px;
    bottom: 2px;
    font-size: 1.2rem;
}

.ai-article-info-edit-time {
    position: absolute;
    color: var(--main-color-darker);
    right: 83px;
    bottom: 2px;
    font-size: 1.2rem;
}
.ai-article-info-text {
    font-weight: 600;
    position: absolute;
    color: var(--main-color-darker);
    left: 8px;
    bottom: 8px;
    font-size: 1.1rem;
}

.share {
    position: absolute;
    top: 4px;
    right: 35px;
    font-size: 1.5rem;
}

.share a {
    color: #00c5b6;
}

.heart a {
    color: #00c5b6;
}

.heart:hover a {
    color: red;
}

.price_item {
    position: absolute;
    left: 0;
    top: 0px;
    background: #00c5b6;
    display: inline-block;
    text-align: center;
    width: 35px;
    color: #ffffff;
    padding: 0px;
    border-top: 3px;
    border-color: #434343;
}

.feature_item {
    position: absolute;
    left: 0;
    top: 17px;
    background: #707070;
    color: #ffffff;
    padding: 1px 5px 8px 5px;
}

.zoomimg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    overflow: hidden;
    z-index: 1000;
    pointer-events: none;
    transform: scale(0.5);
    transition: all 200ms;
}

.zoomimg img {
    max-height: 640px;
    max-width: 70%;
    /* position: absolute;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%); */
    border-radius: 5px;
    padding: 5px;
    background: #eaeaea;
    transition: 1s;
}

.productpic_intro {
    height: 100%;
}

.product_pagination .pagination {
    justify-content: center;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    direction: ltr;
    margin: 40px auto;
}

.product_pagination .pagination .page-item {
    background: var(--main-color-darker);
    margin: 5px;
    min-width: 40px;
    height: 40px;
    font-size: 1rem;
    padding-top: 3px;
    border: none;
    text-align: center;
}

.product_pagination .pagination .page-link {
    background: transparent;
    width: 100%;
    height: 100%;
    border: none;
    color: var(--main-color-lighter);
}

.product_pagination .pagination .active {
    background: var(--main-color);
}


/*-------responsive-------*/

@media (min-width: 1921px) {
    .product_cart {
        min-width: 13%;
        max-width: 13%;
    }
}

@media (max-width: 1650px) {
    .product_cart {
        min-width: 19%;
        max-width: 19%;
    }
}

@media (max-width: 1200px) {
    .mobile_wrapper {
        display: block;
    }
    .header_wrapper {
        padding: 0 0 10px 0;
    }
    .header_wrapper nav {
        position: absolute;
        width: 100%;
        background: rgba(0, 198, 172, 0.9);
        right: -15px;
        top: 53px;
        padding: 20px;
        display: none;
        z-index: 10;
    }
    .header_wrapper nav>ul>li {
        float: none;
        border-bottom: 1px solid rgba(255, 255, 255, 0.7);
        padding-bottom: 12px;
    }
    .header_wrapper nav>ul>li:last-child {
        border-bottom: none;
    }
    .header_wrapper nav>ul>li>a {
        color: #ffffff !important;
    }
    .header_wrapper .sub_topmenu {
        position: relative;
        background: transparent;
        border-top: none;
    }
    .header_wrapper .sub_topmenuitems {
        display: unset;
    }
    .header_wrapper .sub_topmenuitems ul {
        border: none !important;
    }
    .header_wrapper .sub_topmenu>div {
        min-width: 100%;
        text-align: right;
        border: none;
        margin: 0 auto;
    }
    .header_wrapper .sub_topmenuitems ul li {
        padding: 5px 0;
        text-align: right;
        margin: 0;
    }
    .header_wrapper .sub_topmenu>div h5 {
        margin: 10px auto;
    }
    .header_wrapper .sub_topmenu>div h6 {
        margin-top: 10px;
    }
    .header_wrapper .sub_topmenu>div>img {
        display: none;
    }
}

@media (max-width: 1431px) {
    .product_cart {
        min-width: 24%;
        max-width: 24%;
    }
}

@media (max-width: 1400px) {
    .category_items {
        justify-content: center;
        border: none;
    }
    .category_item {
        min-width: 8%;
        max-width: 8%;
    }
    .category_item:nth-child(7):before {
        display: none;
    }
}

@media (max-width: 1180px) {
    .product_cart {
        min-width: 32%;
        max-width: 32%;
    }
}

@media (max-width: 1181px) 
{
    .products_wrapper .left_part {
        width: 100%;
    }
    .product_cart {
        min-width: 32%;
        max-width: 32%;
    }
    .products_wrapper .right_part {
        width: 100%;
    }
    .products_wrapper {
        margin-right: 0;
    }
    .products_wrapper {
        padding: 0;
    }
    .filter_items {
        border: none;
    }
    .filter_items h4 {
        color: #ffffff;
        margin: 15px auto;
        font-weight: normal;
        background: #00c5b6;
        text-align: center;
        padding: 10px;
        cursor: pointer;
    }
    .company_items {
        border: none;
    }
    .company_items h4 {
        color: #ffffff;
        margin: 15px auto;
        font-weight: normal;
        background: #00c5b6;
        text-align: center;
        padding: 10px;
        cursor: pointer;
    }
    .catmenu_items {
        border: none;
    }
    .catmenu_items h4 {
        color: #ffffff;
        margin: 15px auto;
        font-weight: normal;
        background: #00c5b6;
        text-align: center;
        padding: 10px;
        cursor: pointer;
    }
    .search_word {
        padding: 12px 5px;
        margin-top: 15px;
    }
    .search_word2 {
        padding: 12px 5px;
        margin-top: 15px;
    }
    .catmenu_content,
    #data-companies,
    .filter_intro {
        display: none;
    }
}

@media (max-width: 992px) {
    .category_item {
        min-width: 8%;
        max-width: 8%;
    }
}

@media (max-width: 860px) {
    .product_cart {
        min-width: 33%;
        max-width: 33%;
    }
}

@media (max-width: 768px) {
    .footer_item {
        min-width: 100%;
        max-width: 100%;
        margin: 0px auto;
        border-left: none;
    }

    .footer_links {
        padding: 0;
    }
    .footer_links ul {
        min-width: 100%;
    }
    .category_item {
        min-width: 100%;
        max-width: 100%;
        padding: 0;
        text-align: right;
    }
    .category_item:before {
        display: none;
    }
    .category_pic {
        display: none;
    }
    #vipTypes{
        display: flex;
        margin: 0;
        padding: 0;
    }
    .product_filters{
        padding: 0;
    }
    .product_filter {
        display: flex;
        min-width: 100%;
        margin-bottom: 10px;
        justify-content: space-around;
    }
    .product_filter li {
        margin: 5px;
    }
    .product_filter>div {
        margin: 5px;
    }
    .category_items {
        display: none;
    }
}

@media (max-width: 610px) {
    .link_items {
        min-width: 100%;
    }
    /*.header_wrapper .link_items a:last-child {*/
    /*    float: left;*/
    /*    padding-left: 0;*/
    /*}*/
    .header_wrapper .link_items a:nth-child(2) {
        border-left: none;
    }
    .mobile_menuicon {
        float: left;
        right: 0;
    }
}

@media (max-width: 600px) {
    .product_cart {
        min-width: 48%;
        max-width: 48%;
    }
}

@media (max-width: 470px) {
    .header_wrapper nav {
        top: 110px;
    }
    .link_items {
        min-width: 100%;
    }
    /*.header_wrapper .link_items a:last-child {*/
    /*    float: left;*/
    /*    margin: -10px 0 0 -10px;*/
    /*}*/
    .header_wrapper .link_items {
        padding-top: 15px;
        border-top: 1px solid #efecec;
    }
    .header_wrapper .link_items a {
        border: none !important;
        padding: 5px;
    }
}

@media (max-width: 380px) {
    .product_cart {
        min-width: 100%;
        max-width: 100%;
    }
    .mobile_wrapper {
        flex: unset;
        -ms-flex: unset;
    }
    .header_wrapper {
        justify-content: space-between;
    }
}
.product_pic:hover div.ai-article-info {
    opacity: 1;
    transition: ease-in 0.1s;
    -webkit-transition: ease-in 0.2s;
    -o-transition: ease-in 0.1s;
    -moz-transition: ease-in 0.1s;
}

.ai-article-info {
    position: relative;
    /*background-color: #ffffff;*/
    bottom: 0px;
    height: 40px;
    opacity: 1;
    transition: ease-in 0.2s;
    -webkit-transition: ease-in 0.2s;
    -o-transition: ease-in 0.2s;
    -moz-transition: ease-in 0.2s;
    width: -webkit-fill-available;
}

.fal.fa-heart:hover {
    color: #434343;
}

.fal.fa-share-alt {
    color: inherit;
}

.fa.fa-pencil{
    color: #00c5b6;
}

.fa.fa-pencil:hover {
    color: #434343;
}

.fal.fa-share-alt:hover {
    color: #434343;
}

.far.fa-shopping-cart {
    font-size: 1.8rem;
    color: var(--main-color);
    position: relative;
}


.btn-link {
    color: #00c5b6;
}


/* Style The Dropdown Button */
.dropbtn {

    background-color: white;
    color: #00c5b6;
    padding-right: 10px;
    padding-top: 25px;
    font-size: 16px;
    border: none;
    cursor: pointer;
}

/* The container <div> - needed to position the dropdown content */
.dropdown2 {
    position: relative;
    display: inline-block;

}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
    display: none;
    position: absolute;
    left: 1px;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #f1f1f1}

/* Show the dropdown menu on hover */
.dropdown2:hover .dropdown-content {
    display: block;
}

.flag-icon{
    width: 30px;
    height: 30px;
}



/*########## product css##########*/



.popup_item {
    background: rgba(0, 0, 0, 0.5);
    position: fixed;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: none;
    padding: 20px;
    text-align: center;
}

.popup_item a {
    width: 100px;
    height: 100px;
    display: inline-block;
}

.popup_item img {
    max-width: 90vw;
    max-height: 90vh;
    border-radius: 10px;
}

.mySlides {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.mySlides3 {
    display: flex;
    align-items: center;
}
.mySlides2 {
    width: 100%;

}
.show {
    display: flex;
    align-items: center;
}

.inner_pane {
    background: #ffffff;
    color: var(--main-color-darker);
    font-weight: 600;
}
.User-Creat-Product{
    color:inherit;
}
.icon-share{
    color: inherit;
}
.breadcrumb {
    direction: ltr;
    /*background-color: #fcfcfc !important;*/
}

.breadcrumb a {
    color: inherit;
}

.detail-slider-contaner {
    position: relative;
}

.detail-content {
    background: var(--color-background-light);
    margin: 18px auto;
    padding: 20px;
    border-radius: 10px;
}

.detail-content-soft {
    /*background: var(--color-background-light);*/
    margin: 0px 0px 20px auto;
    /*padding: 20px;*/
    border-radius: 0px 0px 10px 10px;
}

.detail-content-soft-breadcrumb {
    display: flex;
    width: 100%;
    padding: 5px 20px;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}
.detail-content-soft-breadcrumb-right{
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    gap:10px;
}

.cursor {
    cursor: pointer;
}

/* Next & previous buttons */
.prev,
.next {
    cursor: pointer;
    position: absolute;
    /* top: 40%; */
    width: auto;
    padding: 16px;
    /* margin-top: -50px; */
    /*color: #fcfcfc;*/
    font-weight: bold;
    font-size: 45px;
    border-radius: 3px 0 0 3px;
    user-select: none;
    -webkit-user-select: none;
    opacity: 0.6;
    transition: 0.4s;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -ms-transition: 0.4s;
    -o-transition: 0.4s;
}

/* Position the "next button" to the right */
.prev {
    left: 0;
}

.next {
    right: 0;
    border-radius: 0 3px 3px 0;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover,
.next:hover {
    opacity: 1;
    /*color: #ffffff;*/
}

/* Container for image text */
.row:after {
    content: "";
    display: table;
    clear: both;
}

/* Six columns side by side */
.column {
    width: 14%;
    margin: 10px 5px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    overflow: hidden;
}

/* .column:nth-child(n + 7) {
  display: none;
} */

.demo {
    opacity: 0.6;
}

.active,
.demo:hover {
    opacity: 1;
}

.thumbnails {
    justify-content: center;
}

.more-six {
    position: relative;
    cursor: pointer;
    display: none;
}

.more-six::after {
    content: "...";
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.514);
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    /*color: #ffffff;*/
    top: 0;
    left: 0;
}

/* right coulumn */
.product-title {
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    width: 100%;
    margin-bottom: 20px;
}

.product-title h2 {
    font-weight: bold;
    margin-top: -40px;
    position: relative;
    font-size: 1.3rem;
    line-height: 30px;
}

.product-title h2::after {
    content: "";
    position: absolute;
    height: 1px;
    background: #dbdbdb;
    left: 0;
}

.product-title h2::after {
    bottom: -10px;
    width: 100%;
}

.Middle button {
    width: 100%;
    padding: 5px 10px;
    background: #00c5b6;
    /*color: #ffffff;*/
    font-size: 1rem;
    border-radius: 5px;
    border: none;
    margin-bottom: 20px;
}
.Middle button a {
    /*color: #ffffff;*/
}
.Middle button:hover {
    animation: pulse 1s;
    box-shadow: 0 0 0 1em rgba(255, 255, 255, 0);
}

.details-table .Top > ul {
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: flex-end;
}

.details-table .Top > ul li {
    margin-right: 15px;
    font-size: 25px;
    transition: 0.4s;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -ms-transition: 0.4s;
    -o-transition: 0.4s;
    cursor: pointer;
}

.details-table .Top > ul li button {
    background: none;
    border: none;
}

.details-table .Top > ul li button img {
    width: 25px;
    filter: grayscale(1);
}

.details-table .Top > ul li:hover img {
    filter: grayscale(0);
}

.details-table .Middle ul li {
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: space-between;
    border-top: 1px solid #dbdbdb;
    /*color: #858585;*/
    font-size: 16px;
    padding: 15px 0 0px 0;
}

.details-table .Middle ul li p span {
    font-size: 1.3rem;
    font-weight: bold;
    /*color: #333;*/
    margin-left: 5px;
}

.details-table .Middle ul li i {
    /*color: #00c5b6;*/
}

.tag-title {
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
}

.tag-title h4 {
    padding: 9px 30px;
    background: var(--main-color);
    color: var(--text-in-main-color);
    font-size: 1rem;
    border-radius: 8px;
}

.details-table .Bottom ul {
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    flex-wrap: wrap;
    padding-left: 0px;
}

.details-table .Bottom ul li {
    padding: 9px 2px;
    font-size: 0.86rem;
}

.Tag-a-link {
    background-color: #ffffff;
    color: var(--main-color-darker);
    padding: 1px 14px;
    border-radius: 20px;
    -webkit-border-radius: 11px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
    transition: all 300ms;
}

.Tag-a-link:hover {
    /*color: #00c5b6 !important;*/
    background-color: var(--main-color);
    box-shadow: 0 0 11px rgba(33, 33, 33, 0.2);
}



/* Style the tab */
.tab {
    overflow: hidden;
    margin-bottom: 10px;
    background-color: #fcfcfc;
    margin-top:40px;
    border-radius: 10px;
}

/*style download link */
.wtree{
    font-size: 12px;
    padding: 0px;
}

.wtree2-level {
    margin-right: -10px;
    counter-reset: item;
}

.wtree li {
    list-style-type: none;
    margin: 10px 0 10px 10px;
    position: relative;
}

.wtree1 .wtree2:before {
    content: "";
    counter-increment: item;
    position: absolute;
    top: -11px;
    right: -21px;
    border-right: 5px solid var(--main-color);
    border-bottom: 5px solid var(--main-color);
    width: 21px;
    height: 32px;
}
.wtree1 .wtree2:after {
    position: absolute;
    content: "";
    top: 20px;
    right: -21px;
    border-right: 5px solid var(--main-color);
    border-top: 5px solid var(--main-color);
    width: 0px;
    height: 100%;
}



.wtree1 li:last-child:after {
    display: none;
}
.span-wtree1 , .span-wtree2 {
    display: block;
    /*border: 1px solid #ddd;*/
    padding: 5px;
    color: #ffffff;
    text-decoration: none;
}
.firstTab{
    padding-left: 0px !important;
    padding-right: 0px !important;
    padding-top: 0px !important;
    /*padding: 0px !important;*/

}

.title-download{
    font-weight: 600;
    padding: 10px;
    background: #f0f0f0;
}
.wtree1 span:hover, .wtree1 span:focus {
    color: #000;
    /*border: 1px solid #474747;*/
}
.wtree2 span:hover, .wtree2 span:focus {
    color: #000;
    border: 1px solid #474747;
    background-color: #474747;
}
.wtree1 span:hover + ol .wtree1 span, .wtree1 li span:focus + ol li span {
    color: #000;
    border: 1px solid #474747;
}
.wtree1:hover + ol li:after, .wtree1:hover + ol li:before, .wtree1 li:focus + ol li:after, .wtree1 li:focus + ol li:before,
.wtree1:hover :after,.wtree1:hover :before,
.wtree1:hover .wtree2 span
{
    border-color: var(--main-color-darker);
}

.span-wtree1 {
    background-color: transparent!important;
    background-image: linear-gradient(45deg,transparent, rgba(225, 12, 12, 0.65));
}

.span-wtree2 {
    background: linear-gradient(90deg, var(--color-background-light), transparent) var(--main-color);
    transition: background-color 1s;

}

.span-wtree2:hover , .span-wtree2:focus   {
    background-color: #e91e63;
    color: #fff;

}

/* Style the buttons inside the tab */
.download_messageone {
    display: flex;
    display: -ms-flexbox;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    justify-content: space-between;
    background: rgba(129, 236, 236, 0.1);
    margin: 20px auto;
    padding: 25px;
    border-radius: 10px;
}

.download_messageone-p {
    margin-bottom: 30px;
}

.download_messageone-button {
    margin: 3px 10px;
    padding: 5px 10px;
    color: white;
    font-size: 1rem;
    border-radius: 5px;
    display: inline-block;
    font-weight: 600;
}

.download_messageone-button:hover{
    color:white;
    font-weight: 600;
}

.chestnut-red {
    background: #ff7675;
}

.download_messageone-button:hover {
    animation: pulse 1s;
    box-shadow: 0 0 0 1em rgba(255, 255, 255, 0);
}

.download_messageone-first-div {
    width: calc(100% - 200px);
}

.download_messageone-img {
    width: 80px;
}

.download_messagetwo {
    position: relative;
    z-index: auto;
    display: flex;
    display: -ms-flexbox;
    flex-wrap: nowrap;
    -ms-flex-wrap: wrap;
    justify-content: space-between;
    background: #f8f9fa;
    margin: 20px auto;
    padding: 25px;
    border-radius: 10px;
}

.download_messagetwo-p {
    margin-bottom: 30px;
}

.download_messagetwo-button {
    padding: 5px 10px;
    color: var(--text-in-main-color);
    font-size: 1rem;
    border-radius: 5px;
    margin: 3px 10px;
    display: inline-block;
}


.steel-blue {
    background: #193651;
}

.ice-green {
    background: #00c5b6;
}
.model-description{
    line-height: 3;
    font-weight: 200;
}
.download_messagetwo-button:hover {
    animation: pulse 1s;
    box-shadow: 0 0 0 1em rgba(255, 255, 255, 0);
    color:var(--text-in-main-color)
}

.download_messagetwo-first-div {
    width: calc(100% - 200px);
}

.download_messagetwo-img {
    width: 120px;
}

.download-link {
    background: #ffffff;
    border-radius: 20px;
    /* height: 31px; */
    text-align:center;
    padding: 0 10px 0px 3px;
    transition: all 300ms;
    margin: 6px;
    line-height: 31.2px;
}

.download-link a {
    color: inherit;
}

.download-link:hover {
    background: #00c5b6;
}

.download-link:hover .fa {
    /*color: #00c5b6;*/
    background: #ffffff;
}

.tab button {
    float: right;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 14px 30px;
    transition: 0.3s;
    font-size: 1rem;
}

.tab button .fa {
    /*color: #00c5b6;*/
    margin-left: 10px;
}

.tab button:hover .fa,
.tab button.active .fa {
    color: var(--text-in-main-color);
}

/* Change background color of buttons on hover */
.tab button:hover {
    background-color: var(--main-color);
}

/* Create an active/current tablink class */
.tab button.active {
    background-color: var(--main-color);
}

/* Style the tab content */
.tabcontent {
    display: none;
    padding: 30px 30px;
    background: var(--color-background-light);
    /*color: #555;*/
    margin-bottom: 25px;
    border-radius: 10px;
}
.download-list-ul-li {
    width: 100%;
    background: var(--main-color-lighter);
    border-radius: 35px;
    margin-bottom: 10px;
    /*color: #555;*/
    transition: all 300ms;
}
/*.download-list ul li {*/
/*    width: 100%;*/
/*    background: var(--main-color-lighter);*/
/*    border-radius: 35px;*/
/*    margin-bottom: 10px;*/
/*    !*color: #555;*!*/
/*    transition: all 300ms;*/
/*}*/
.product-download-link{
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: space-between;
    width: 100%;
    /*color: var(--main-color-darker);*/
    font-size:11px;
    font-weight: 600;
}
/*.download-list ul li a {*/
/*    display: -moz-flex;*/
/*    display: -ms-flex;*/
/*    display: -o-flex;*/
/*    display: flex;*/
/*    justify-content: space-between;*/
/*    width: 100%;*/
/*    color: var(--main-color-darker);*/
/*    font-size:11px;*/
/*    font-weight: 600;*/
/*}*/


/*.download-list ul li a:hover  {*/
/*    color:black;*/
/*}*/

/*.download-list ul li:hover {*/
/*    !*background: var(--main-color);*!*/
/*    box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, 0.6);*/
/*}*/

.download-list ul li img {
    width: 42px;
}

.download-list ul li .title {
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    align-items: center;
}
.download-list-title {
    color: #555;
    margin-right: 15px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 600;
}
/*.download-list ul li .title h6 {*/
/*    margin-right: 15px;*/
/*    margin-bottom: 0;*/
/*    font-size: 14px;*/
/*    font-weight: 600;*/
/*}*/

.download-list ul li .title a {
    /*color: #555;*/
}

.download-list ul li .title i {
    margin-left: 10px;
    /*color: #00c5b6;*/
}

.download-list ul li .title h6 span {
    display: block;
    font-size: 10px;
}

.download-list ul li .download-link span {
    font-size: 0;
}

.download-list ul li .download-link span i {
    font-size: 13px;
    /*color: #ffffff;*/
    background: #00c5b6;
    padding: 6px;
    border-radius: 20px;
    position: relative;
    top: 1.3px;
}

.download-list ul li.active .download-link {
    background: #00c5b6;
}

.download-list ul li.active .download-link .fa {
    /*color: #00c5b6;*/
    background: #ffffff;
}

.download-list ul li.active .download-link {
    font-size: 0;
}

.download-list ul li.active .download-link span {
    font-size: 14px;
}

/*------rating------*/
.tabcontent form {
    width: 650px;
    margin: 0 auto;
    max-width: 100%;
}

.comments_item {
    position: relative;
    width: 100%;
    margin-bottom: 15px;
}

.comments_item.comments_item
{
    position: relative;
    max-width: 650px;
    margin-bottom: 15px;
    margin-top: 15px;

    margin-left:auto;
    margin-right:auto;
}


.comments_item > label {
    position: absolute;
    background: #e6e4e4;
    /*color: #495057;*/
    width: 45px;
    height: 100%;
    border-radius: 0 3px 3px 0;
    text-align: center;
    padding-top: 8px;
    font-size: 1.1rem;
}

.comments_item input {
    border: 1px solid #ced4da;
    width: 100%;
    border-radius: 3px;
    min-height: 38px;
    padding: 0 50px 0 10px;
    /*color: #495057;*/
}

.comments_item textarea {
    border: 1px solid #ced4da;
    width: 100%;
    border-radius: 3px;
    min-height: 180px;
    padding: 15px;
    /*color: #495057;*/
}

.comments_item button {
    background: #545b62;
    width: 100%;
    padding: 10px;
    /*color: #ffffff;*/
    font-size: 1.1rem;
    border: none;
    border-radius: 3px;
}

.rating_items {
    display: inline-block;
}

.rating_items input {
    display: none;
}

.rating_items input:checked ~ label:before {
    /*color: #ffc700;*/
}

.rating_items label {
    position: relative;
    margin: 20px 10px;
    font-size: 1.7rem;
    cursor: pointer;
}

.rating_items label:before {
    position: absolute;
    content: "★ ";
    /*color: #ccc;*/
}

.rating_items label:hover:before {
    /*color: #ffc700;*/
}

@media (max-width: 992px) {
    .product-title h2 {
        margin-top: 0;
    }
}

@media (max-width: 576px) {
    .tab button {
        width: 100%;
    }
    .download_messageone,
    .download_messagetwo {
        flex-flow: column-reverse;
    }
    .download_messageone > div,
    .download_messagetwo > div {
        min-width: 100%;
        margin-bottom: 20px;
        text-align: center;
    }
    .download_messageone > div a,
    .download_messagetwo > div a {
        width: 100%;
    }
}
/*###############End of Product css################*/

/*######################top menu nav css####################*/

@charset 'UTF-8';

nav {
    display: block
}

.container-fluid {
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto
}

.dropdown,
.dropleft {
    position: relative
}


.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 10rem;
    padding: .5rem 0;
    margin: .125rem 0 0;
    font-size: 1rem;
    color: #f8f4f4;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: .25rem
}


.dropdown-menu-right {
    right: 0;
    left: auto
}


.dropleft .dropdown-menu {
    top: 0;
    right: 100%;
    left: auto;
    margin-top: 0;
    margin-right: .125rem
}

.dropdown-item {
    display: block;
    width: 100%;
    padding: .25rem 1.5rem;
    clear: both;
    font-weight: 400;
    color: #212529;
    text-align: inherit;
    white-space: nowrap;
    border: 0
}

.dropdown-item:focus,
.dropdown-item:hover {
    color: #16181b;
    text-decoration: none;
}

.dropdown-item:active {
    color: #fff;
    text-decoration: none;
}


.dropdown-item-text {
    display: block;
    padding: .25rem 1.5rem;
    color: #212529
}

.nav {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
}

.nav-link {
    display: block;
    padding: .5rem 1rem
}

.nav-link:focus,
.nav-link:hover {
    text-decoration: none
}

.navbar {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: .5rem 1rem
}

.navbar>.container,
.navbar>.container-fluid {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.navbar-nav {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none
}

.navbar-nav .nav-link {

    padding-top: 10px;

}
.fa-bars{
    color:var(--main-color-darker);
}

.navbar-nav .nav-link:hover {
    background-color:var(--main-color);

}
.navbar-nav .dropdown-menu {
    position: static;
    float: none
}

.navbar-text {
    display: inline-block;
    padding-top: .5rem;
    padding-bottom: .5rem
}

.navbar-collapse {
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -ms-flex-align: center;
    align-items: center
}
.dropdown-item.active, .dropdown-item:active {
    text-decoration: none;
     background-color: var(--main-color);
}

@media (max-width:992px) {
.width-nav{
    width: 96% !important;
    margin: auto;
}
    .navbar-expand-lg>.container,
    .navbar-expand-lg>.container-fluid {
        padding-right: 0;
        padding-left: 0;
    }
}

@media (min-width:992px) {
    .width-nav{
        width: 100% !important;
    }
    .navbar-expand-lg {
        -ms-flex-flow: row nowrap;
        flex-flow: row nowrap;
        -ms-flex-pack: start;
        justify-content: flex-start
    }

    .navbar-expand-lg .navbar-nav {
        -ms-flex-direction: row;
        flex-direction: row
    }

    .navbar-expand-lg .navbar-nav .dropdown-menu {
        position: absolute
    }

    .navbar-expand-lg .navbar-nav .nav-link {
        padding-right: .5rem;
        padding-left: .5rem
    }

    .navbar-expand-lg>.container,
    .navbar-expand-lg>.container-fluid {
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        max-width:fit-content;

    }

    .navbar-expand-lg .navbar-collapse {
        display: -ms-flexbox !important;
        display: flex !important;
        -ms-flex-preferred-size: auto;
        flex-basis: auto
    }

}

.d-none {
    display: none !important
}

.d-inline-block {
    display: inline-block !important
}

.d-block {
    display: block !important
}

@media (min-width:992px) {
    .d-lg-none {
        display: none !important
    }
    .d-lg-block {
        display: block !important
    }
}

@media (max-width: 992px) {

    .d-lg-block {
        display: none !important
    }
}

.overflow-hidden {
    overflow: hidden !important
}

.position-relative {
    position: relative !important;
    left: 10px;
}

/*.position-relative:hover {*/
/*    background-color: blue;*/
/*}*/
.item-menu :hover{
    background-color: var(--main-color);

}
.position-absolute {
    position: absolute !important
}

.text-center {
    text-align: center !important
}

.text-center h2{
    font-size: 13px;
    line-height: 20px;
    width: 60px;
    min-height: 40px;
    top: 3px;
    position: relative;
    font-weight: 600;
}

@media (min-width:992px) {

    .text-lg-right {
        text-align: right !important
    }

}

.bg-navbar {
    border-top: 1px solid rgb(224, 224, 224);
    border-bottom: 1px solid rgb(224, 224, 224);
    padding: 0px;
    background-color: var(--color-background-light);
}

#navbar-main {
    font-size: 13px !important
}

#navbar-main a {
    color: var(--main-color-darker) ;
    font-weight: 600;
    /*transition: all .1s ease*/
}


#navbar_header {
    font-size: 13px !important;
    color: #000 !important
}

#navbar_header a {
    color: #000 !important;
    transition: all .3s ease
}

.cus-dropdown {
    font-size: 13px !important;
    background-color: #f8f4f4   !important
}

/*.cus-dropdown a:focus {*/
/*    background: 0 0 !important*/
/*}*/

.cus-dropdown {
    border-bottom: 3px solid #f58221 !important;
    border-radius: 0 !important;
    text-align: right !important;
    user-select: none;
    overflow: hidden;
}

@media (min-width:992px) {
    .cus-dropdown {
        position: relative;
        top: 114px;
        display: block !important;
        /*transition: all .1s ease .1s;*/
        opacity: 0;
        overflow: unset;
        visibility: hidden
    }

    .dropdown-open-menu:hover .cus-dropdown {
        top: 110px !important;
        opacity: 1;
        visibility: visible;
    }

}

.dropleft-menu {
    position: relative;
    display: inline-block;
    left: -10px;
}

.dropleft-content {
    user-select: none;
    display: none;
    position: relative;
    margin-right: 35px;
    border: 1px solid #d9c8c8;
    background-color: #f8f4f4 ;
    border-bottom: 3px solid #f58221;
    margin-bottom: 10px;
    z-index: 1;
}

.level-3-item{
    color: #000;
    padding: 6px 16px;
    /* text-decoration: none; */
    display: block;
}

@media (min-width:992px) {
    .dropleft-content i.fa {
        display: none
    }

    .dropleft-content {
        display: none;
        position: absolute;
        margin-right: 0;
        right: 100%;
        top: -.5rem;
        min-width:160px ;
        width: max-content;
        z-index: 1;
        margin-bottom: 0
    }

    .dropleft-menu:hover .dropleft-content {
        display: block;
        color: #f58221
    }
}

.cursor-pointer {
    cursor: pointer
}

/*#########################End of css nav##########################*/
/*--------signing css---------*/

#login,
#register {
    padding-right: 0 !important;
    background: #fff;
}

.main {
    position: relative;
    border: none;
}

.main:before {
    position: absolute;
    content: "";
    background: #00c5b6;
    width: 50%;
    height: 100vh;
    left: 0;
    top: 0;
}

.main section {
    position: relative;
    width: 70%;
    right: 15%;
    min-height: 80vh;
    top: 10vh;
}

#register section {
    top: 5vh;
}

.main section:after {
    position: absolute;
    content: "";
    background: url("../images/signin/colordotptn.png") no-repeat center center;
    top: -192px;
    right: 61px;
    width: 90px;
    height: 400px;
    transform: rotate(90deg);
}

.main section:before {
    position: absolute;
    content: "";
    background: url("../images/signin/whitedotptn.png") no-repeat center center;
    bottom: -192px;
    left: 61px;
    width: 90px;
    height: 400px;
    transform: rotate(90deg);
}

.signin_items {
    display: flex;
    display: -ms-flexbox;
    justify-content: center;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.15);
    border-radius: 30px;
    background: #ffffff;
    position: relative;
    z-index: 1;
    min-height: 80vh;
    color: #707070;
}

.signin_items:before {
    position: absolute;
    content: "";
    background: rgba(78, 205, 196, 0.4);
    width: 50%;
    height: 100%;
    left: 0;
    top: 0;
}

.signin_item {
    min-width: 50%;
    max-width: 50%;
    padding: 30px 20px;
    position: relative;
}

.signin_item:nth-child(2) {
    text-align: center;
}

.signin_item:nth-child(2)>p a {
    padding: 1px 25px;
    border-radius: 30px;
    background: #00c5b6;
    color: #ffffff;
}

.signin_item h4 {
    color: #434343;
}

.signin_item>img {
    width: 400px;
    max-width: 100%;
    margin-top: 50px;
}

.signin_item form {
    width: auto;
    max-width: 100%;
    margin: 0 auto;
    padding: 10px;
    color: #707070;
}

.signin_item form .another_login {
    display: flex;
    display: -ms-flexbox;
    justify-content: center;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
}

.signin_item form .another_login a {
    border-radius: 30px;
    padding: 4px 15px 2px 15px;
    margin: 10px;
}

.signin_item form .another_login a img {
    margin-right: 5px;
}

.signin_item form .another_login a:nth-child(1) {
    border: 1px solid #7f40bd;
    color: #7f40bd;
}

.signin_item form .another_login a:nth-child(2) {
    border: 1px solid #cf2d48;
    color: #cf2d48;
}

.signin_item form p {
    margin-top: 20px;
    padding: 0 8px;
}

.signin_item form p a {
    color: #707070;
}

.signin_item form>div {
    position: relative;
    margin: 25px auto;
}

.signin_item form>div input {
    border-radius: 30px;
    border: 1px solid #e6e4e4;
    width: 100%;
    color: #777;
    padding: 6px 28px 6px 6px;
}

.signin_item form>div label {
    position: absolute;
    left: 20px;
    top: -10px;
    background: #ffffff;
    color: #707070;
    padding: 0 10px;
}

.signin_item form>div span {
    position: absolute;
    right: 10px;
    top: 10px;
    color: #00c5b6;
}

.signin_item form button {
    background: #00c5b6;
    border: none;
    border-radius: 30px;
    width: 100%;
    padding: 6px;
    color: #ffffff;
    font-size: 1.2rem;
}

.logo_item {
    display: inline-block;
    margin-top: 4px;
    margin-bottom: 10px;
}

#login_button,
.signin_item a {
    animation: pulse 1s;
    box-shadow: 0 0 0 1em rgba(255, 255, 255, 0);
}

.forgot {
    color: #00c5b6;
    font-size: 0.9rem;
}


/*--------responsive--------*/

@media (max-width: 1200px) {
    .main section::after,
    .main section::before,
    .signin_items::before,
    .main::before {
        display: none;
    }
    .signin_item {
        min-width: 100%;
    }
}

@media (max-width: 572px) {
    .main section {
        position: relative;
        width: 90%;
        min-height: 80vh;
        top: 10vh;
        right: 5%;
    }
}

/*############end signing css###########*/

.button-gateway-color1{
    background: #FF4742;
    border: 1px solid #FF4742;
}
.button-gateway-color2{
    background: #13aa52;
    border: 1px solid #13aa52;
}

.button-gateway {

    border-radius: 6px;
    box-shadow: rgba(0, 0, 0, 0.1) 1px 2px 4px;
    box-sizing: border-box;
    color: #FFFFFF;
    cursor: pointer;
    display: inline-block;
    width: 350px;
    line-height: 16px;
    min-height: 40px;
    outline: 0;
    padding: 12px 14px;
    text-align: center;
    text-rendering: geometricprecision;
    text-transform: none;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    vertical-align: middle;
}

.button-gateway:hover,
.button-gateway:active {
    background-color: initial;
    background-position: 0 0;
    background-position: 0 0;
    color: #FF4742;
}

.button-gateway:active {
    opacity: .5;
}

.thumbnails-soft{
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Next & previous buttons */
.prev-soft,
.next-soft {
    cursor: pointer;
    width: auto;
    /*padding: 16px;*/
    color: var(--main-color);
    margin-top: 10px;
    font-weight: bold;
    font-size: 30px;
    -webkit-user-select: none;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -ms-transition: 0.4s;
    -o-transition: 0.4s;
}


/* On hover, add a black background color with a little bit see-through */
.prev-soft:hover,
.next-soft:hover {
    color: var(--main-color-darker);

}

.right-part ul li {
    list-style-type: disc;
    margin-right:30px ;
    padding: 3px;
}
.model-guide{
    font-size: 12px;
}
.model-guide p{
    font-size: 16px;

}
.model-guide ul{
    background: #cecee0;
    padding-top: 20px;
    padding-right: 40px;
    padding-bottom: 20px;
    border-radius: 10px;
    line-height: 2;
}
.model-guide ul li{
    list-style-type: decimal;
}
.details-table{

}

@media (max-width: 750px) {
    .details-table {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }

    .right-part {
        width: 100% !important;
    }

    .left-part {
        width: 100% !important;
        max-width: unset !important;
    }
}
.right-part p {
    margin-bottom: 0;
}

.right-part{
    background: #f8f9fa;
    font-size: 14px;
    width: 70%;
    padding: 25px;
    gap: 30px;
    line-height: 2;
    flex-grow: 1;
    /*margin-bottom:40px*/
}
.left-part{
    /*background-color: #00c5b6;*/
    /*padding: 25px;*/
    display: flex;
    width: 30%;
    gap:10px;
    max-width: 370px;
    min-width: 325px;

    flex-direction: column;
    justify-content: space-between;
}
.left-part-top{
    display: flex;
    padding: 15px 25px 25px;
    gap: 30px;
    background: #f8f9fa;
    flex-direction: column;
    justify-content: space-around;

}

.price-alert {
    background: rgb(218 216 216);
    border-width: 2px;
    border-style: dashed;
    border-color: rgb(238, 238, 238);
    border-image: initial;
    border-radius: 6px;
    padding: 15px 6px !important;
}

.button-single-pay{
    display: flex;
    margin-top: -23px;
    padding: 15px 12px 14px 12px;
    border-radius: 6px;
    justify-content: center;

}

.button-single-pay:hover {
    animation: pulse 1s;
    box-shadow: 0 0 0 1em rgba(255, 255, 255, 0);
    color:var(--text-in-main-color)
}


.left-part-top-row{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.left-part-Bottom{
    padding: 15px 25px 25px;
    background: #f8f9fa;
    flex-grow: 1;

}


.description-content-title{
    direction: rtl;
    margin-top: 10px;
    font-size: 17px;
    font-weight: 600;
    margin-bottom: 20px;
    color: #5e5e5e;
}

.description-content-main{
    direction: rtl;
    line-height: 2.5;
    text-align: justify;
    font-size: 14px;
}


:root {
    --transitionLength: 0.4s;
    --transitionTiming: ease;
}
.accordion-animation-wrapper {
    display: grid;
    grid-template-rows: 0fr;
    overflow: hidden;
    transition: grid-template-rows var(--transitionLength) var(--transitionTiming);
    width: 99%;
    margin-left: 2.5%;
    margin-top: -5px;
    border-radius: 10px;
    background-color:#21103700
}

.accordion-trigger-input:checked ~ .accordion-animation-wrapper {
    grid-template-rows: 1fr;
}

.accordion-animation {
    min-height: 0;
}

.accordion-transform-wrapper {
    transform: translateY(-100%);
    visibility: hidden;
    transition: transform var(--transitionLength) var(--transitionTiming), visibility 0s var(--transitionLength) var(--transitionTiming);
}

.accordion-trigger-input:checked ~ .accordion-animation-wrapper .accordion-transform-wrapper {
    transform: translateY(0);
    visibility: visible;
    transition: transform var(--transitionLength) var(--transitionTiming), visibility 0s linear;
    background-color:#21103700
}

.accordion-content * {
    margin: 0;
}
.accordion {
    direction: rtl;
    min-width: 320px;
    width: 100%;
    margin: 30 auto;
    background: white;
    --bs-accordion-border-width: 0px !important;
}

.accordion-item {
    margin-bottom: -2px;
    overflow: hidden;
}

.accordion-trigger-input {
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    height: 1px !important;
    overflow: hidden !important;
    position: absolute !important;
    white-space: nowrap !important;
    width: 1px !important;
}


.accordion-trigger {
    display: block;
    position: relative;
    padding: 25px 40px 25px 25px;
    transition: box-shadow var(--transitionLength) var(--transitionTiming);
    z-index: 1;
    cursor: pointer;
    background: #00c5b6;
    border-radius: 10px;
    color: #0e0e0e;
    margin-top: 29px;
}

/*.accordion-trigger span:nth-child(1){*/
/*  position: absolute;*/
/*  right:40px;*/
/*  top:22px;*/
/*  font-style: normal;*/
/*  font-weight: 400;*/
/*  font-size: 20px;*/
/*  line-height: 31px;*/
/*  color: #45444A;*/
/*  direction: rtl;*/
/*}*/

/*.accordion-trigger span:nth-child(2){*/
/*  position: absolute;*/
/*  left:180px;*/
/*  top:22px;*/
/*  font-style: normal;*/
/*  font-weight: 400;*/
/*  font-size: 20px;*/
/*  line-height: 31px;*/
/*  color: #45444A;*/
/*  direction: rtl;*/
/*}*/

/*.accordion-trigger span:nth-child(3){*/
/*  position: absolute;*/
/*  left:40px;*/
/*  top:22px;*/
/*  font-style: normal;*/
/*  font-weight: 400;*/
/*  font-size: 20px;*/
/*  line-height: 31px;*/
/*  color: #45444A;*/
/*  direction: rtl;*/
/*}  */
.accordion-trigger-input:focus-visible ~ .accordion-trigger {
    outline: 2px solid;
    outline-offset: -2px;
}

.accordion-trigger::after {
    display: block;
    position: absolute;
    right: 16px;
    top: 33px;
    content: '';
    width: 8px;
    height: 8px;
    border: 2px solid #676767;
    border-bottom: transparent;
    border-left: transparent;
    transform: rotate(220deg);
    transition: transform var(--transitionLength) var(--transitionTiming);
}
.svg1ac{
    fill: #45444A;
}

.accordion-trigger-input:checked ~ .accordion-trigger::after {
    transform: rotate(135deg) rotateX(180deg) rotateY(180deg) translateY(4px) translateX(-4px);
}

.accordion-trigger-input:checked ~ .accordion-trigger {
    box-shadow: 0 1px 2px rgba(0,0,0,0.1);
    transition: box-shadow calc(var(--transitionLength) / 4) var(--transitionTiming);
    background-color:#211037
}

.accordion-trigger-input:checked ~ .accordion-trigger span:nth-child(1){
    color: white;
}

.accordion-trigger-input:checked ~ .accordion-trigger span:nth-child(2){
    color: white;
}

.accordion-trigger-input:checked ~ .accordion-trigger span:nth-child(3){
    color: white;
}
.accordion-trigger-input:checked ~ .accordion-trigger span:nth-child(2) svg path{
    fill: white;
}

.accordion-trigger-input:checked ~ .accordion-trigger span:nth-child(3) svg path{
    fill: white;
}

.accordion-trigger-input:checked ~ .accordion-trigger::after {
    display: block;
    position: absolute;
    right: 16px;
    top: 33px;
    content: '';
    width: 8px;
    height: 8px;
    border: 2px solid white;
    border-bottom: transparent;
    border-left: transparent;
    transform: rotate(135deg);
    transition: transform var(--transitionLength) var(--transitionTiming);
}
.accordion-content {
    padding: 0px;
}
.accordion-content h2 {
    padding-bottom: 0.75em;
}
.accordion-content p {
    padding-bottom: 1.5em;
}
.accordion-content p:last-of-type {
    padding-bottom: 0;
}
.accordion-content img {
    max-width: 100%;
}

#modal-overlay {
    align-items: center;
    display: none;
    position: fixed;
    justify-content: space-evenly;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 999;
    opacity: 0;
    overflow: scroll;
    transition: opacity 0.3s ease;
}

@media (max-width: 1200px) {
        #modal-overlay {
        align-items: flex-start;
    }
}

.class-my-modal{
    cursor: pointer;
}


.video-block .mb-3 {
    margin-bottom: 30px !important;
}

.video-card-image {
    border-radius: 2px;
    overflow: hidden;
    position: relative;
}

.time {
    background: #f5234a none repeat scroll 0 0;
    border-radius: 2px;
    bottom: 5px;
    color: #fff;
    font-size: 11px;
    font-weight: 500;
    opacity: 0.7;
    padding: 0 6px;
    position: absolute;
    right: 5px;
}

.video-card:hover .time {
    opacity: unset;
}

.video-card-image img {
    object-fit: cover;
    width: 100%;
    height: 250px;
}

.play-icon {
    opacity: 0;
    position: absolute;
}

.play-icon .fas {
    bottom: 0;
    height: 40px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 40px;
}

.product_cart_video:hover{
    background-color: #f4f4f4 !important;
}
.video-card:hover .play-icon {
    background: #000 none repeat scroll 0 0;
    border-radius: 2px;
    bottom: 0;
    color: #fff;
    font-size: 35px;
    left: 0;
    opacity: 0.4;
    position: absolute;
    right: 0;
    text-align: center;
    top: 0;
    transition-duration: 0.4s;
}

.video-title a {
    color: #000;
    font-weight: 600;
    text-decoration: none;
}

.video-title {
    margin-bottom: 5px;
}

.video-page {
    font-size: 11px;
}

.video-page2 {
    font-size: 18px;
}

.video-page3 {
    font-size: 12px;
}

.video-view {
    color: #acacac;
    font-size: 10px;
    font-weight: 500;
    margin: 2px 0 0;
}

.video-card {
    background: #fff none repeat scroll 0 0;
    border-radius: 2px;
    transition-duration: 0.4s;
    position: relative;
}

.video-card-body {
    padding: 0px 12px 0px 12px;
}

.video-card-list .video-card-image {
    float: left;
    height: 77px;
    margin: 0 12px 0 0;
    width: 122px;
}

.video-card-list .video-card-body {
    padding: 0;
}

.video-card-list {
    background: transparent none repeat scroll 0 0;
    box-shadow: none;
    display: inline-block;
    margin-bottom: 1rem;
    width: 100%;
}

.video-card-list .video-card-body .video-title a {
    font-size: 13px;
}

.video-card-list .video-card-body .video-title {
    line-height: 17px;
}

.video-card-list .video-card-body .right-action {
    opacity: 0;
}

.video-card-list:hover .video-card-body .right-action {
    opacity: unset;
}


/* Night mode styles */
body.night-mode {
    background-color: #222;
    color: #fff;
}

.night-mode{
    background-color: #222 !important;
    color: #fff !important;
}
.search_box.night-mode{
    background-color: #2c2c2c !important;
    color: #fff !important;
}
.bg-navbar.night-mode{
    background-color: #2c2c2c !important;
    color: #fff !important;
}
.cus-dropdown.night-mode{
    background-color: #2c2c2c !important;
    color: #fff !important;
}

.video-card-body.night-mode{
    background-color: #454545 !important;
    color: #fff !important;
}

.dropleft-content.night-mode{
    background-color: #454545 !important;
    color: #fff !important;
}
.filter_item.night-mode{
    background-color: #2c2c2c !important;
    color: var(--main-color-darker) !important;
}
.catmenu_item.night-mode{
    background-color: #2c2c2c !important;
    /*color: #fff !important;*/
}
.catmenu_intro.night-mode{
    background-color: #454545 !important;
    color: #fff !important;
}
.sub_menu.night-mode{
    background-color: #454545 !important;
    color: #fff !important;
}
.link-login-logout.night-mode{
    background-color: #222 !important;
    color: var(--main-color-darker) !important;
}
.inner_pane.night-mode{
    background-color: #222 !important;
    color: #fff !important;
}
.detail-content.night-mode{
    background-color: #2c2c2c !important;
    color: var(--main-color) !important;
}
.download_messagetwo.night-mode{
    background-color: #2c2c2c !important;
    color: var(--main-color) !important;
}
.tabcontent.night-mode{
    background-color: #2c2c2c !important;
    color: var(--main-color) !important;
}
.tab.night-mode{
    background-color: #2c2c2c !important;
    color: var(--main-color) !important;
}
.tablinks.night-mode{
    background-color: #2c2c2c !important;
    color: var(--main-color) !important;
}
.tablinks.night-mode:hover{
    background-color: #646464 !important;
    color: var(--main-color) !important;
}
.tablinks.night-mode.active{
    background-color: #646464 !important;
    color: var(--main-color) !important;
}
.Tag-a-link.night-mode{
    background-color: #646464 !important;
    color: var(--main-color) !important;
}
.download-list-ul-li.night-mode{
    background-color: #646464 !important;
    color: var(--main-color) !important;
}
.download-list-title.night-mode{
    background-color: #646464 !important;
    color: var(--main-color) !important;
}
.card-body.night-mode{
    background-color: #222 !important;
    color: var(--main-color-lighter) !important;
}
.card-header.night-mode{
    background-color: #2c2c2c !important;
    color: var(--main-color) !important;
}
.card.night-mode{
    background-color: #2c2c2c !important;
    color: var(--main-color-lighter) !important;
}
.detail-content-soft.night-mode{
    background-color: #2c2c2c !important;
    color: var(--main-color-lighter) !important;
}
.detail-content-soft-breadcrumb.night-mode{
    background-color: #444444 !important;
    color: var(--main-color-darker);
}
/*body {*/
/*    font: 14px/2 "Open sans", sans-serif;*/
/*    letter-spacing: 0.05em;*/
/*}*/

.btn-slider {
    display: inline-block;
    padding: 13px 20px;
    color: #fff;
    text-decoration: none;
    position: relative;
    background: transparent;
    border: 1px solid #e1e1e1;
    font-size: 16px;
    font-weight: 600;
    /*letter-spacing: 0.4em;*/
    text-align: center;
    text-indent: 2px;
    text-transform: uppercase;
    transition: color 0.1s linear 0.05s;
}
.btn-slider::before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 1px;
    background: #e1e1e1;
    z-index: 1;
    opacity: 0;
    transition: height 0.2s ease, top 0.2s ease, opacity 0s linear 0.2s;
}
.btn-slider::after {
    transition: border 0.1s linear 0.05s;
}
.btn-slider .btn-slider-inner {
    position: relative;
    z-index: 2;
}
.btn-slider:hover {
    color: #373737;
    transition: color 0.1s linear 0s;
}
.btn-slider:hover::before {
    top: 0;
    height: 100%;
    opacity: 1;
    transition: height 0.2s ease, top 0.2s ease, opacity 0s linear 0s;
}
.btn-slider:hover::after {
    border-color: #373737;
    transition: border 0.1s linear 0s;
}

.slideshow {
    overflow: hidden;
    position: relative;
    width: 100%;
    height: 400px;
    z-index: 1;
}
.slideshow .slideshow-inner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 400px;
}
.slideshow .slides {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 400px;
    z-index: 1;
}
.slideshow .slide {
    display: none;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
}
.slideshow .slide.is-active {
    display: block;
}
.slideshow .slide.is-loaded {
    opacity: 1;
}
.slideshow .slide .caption {
    padding: 0 100px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: center;
    flex-direction: column;
}
.slideshow .slide .image-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-position: center;
    z-index: 1;
    background-size: cover;
}
.slideshow .slide .image-container::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /*background: rgba(0, 0, 0, 0.5);*/
}
.slideshow .slide .image {
    width: 100%;
    width: 100%;
    object-fit: cover;
    height: 100%;
}
.slideshow .slide-content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    color: #fff;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: flex-start;
}
.slideshow .slide .title {
    height: 134px;
    margin: 0 auto 0px;
    max-width: 1000px;
    font-size: 50px;
    font-weight: 800;
    /*text-transform: uppercase;*/
}

.slideshow .slide .text {
    margin: 8px 0px auto 0;
    max-width: 1000px;
    font-size: 18px;
    line-height: 1.4;
}

@media (max-width: 1140px){
    .slideshow .slide .caption {
        padding: 0 20px;
    }
    .slideshow .slide .text {
        display: none;
    }
}
@media (max-width: 780px){
    .slideshow .slide .caption {
        padding: 0 20px;
    }
    .slideshow .slide .title {
        font-size: 40px;
    }
}

@media (max-width: 400px) {

    .slideshow .slide .title {
        margin: 0 auto 0px;
        max-width: 1000px;
        font-size: 35px;
        font-weight: 800;
    }

    .slideshow .slide .caption {
        padding: 0 20px;
    }

    .slideshow .slide .text {
        display: none;
    }
}


.slider-description{
    max-height: 100px;
    overflow: hidden;
    line-height: 2;
}
.slideshow .slide .btn-slider {
    position: absolute;
    bottom: 50px;
    margin: 15px 0 0;
    border-color: #fff;
}
.slideshow .slide .btn-slider::before {
    background: #fff;
}
.slideshow .pagination {
    display: flex;
    justify-content: center;
    margin-top: 360px;
}
.slideshow .pagination .item {
    display: inline-block;
    padding: 15px 5px;
    position: relative;
    width: 46px;
    height: 32px;
    cursor: pointer;
    text-indent: -999em;
    z-index: 1;
}
.slideshow .pagination .item + .page {
    margin-left: -2px;
}
.slideshow .pagination .item::before {
    content: "";
    display: block;
    position: absolute;
    top: 15px;
    left: 5px;
    width: 36px;
    height: 2px;
    background: rgba(255, 255, 255, 0.5);
    transition: background 0.2s ease;
}
.slideshow .pagination .item::after {
    width: 0;
    background: #fff;
    z-index: 2;
    transition: width 0.2s ease;
}
.slideshow .pagination .item:hover::before, .slideshow .pagination .item.is-active::before {
    background-color: #fff;
}
.slideshow .arrows .arrow {
    margin: -50px 0 0;
    padding: 20px;
    position: absolute;
    top: 50%;
    cursor: pointer;
    z-index: 3;
}
.slideshow .arrows .prev {
    left: 30px;
}
.slideshow .arrows .prev:hover .svg {
    left: -10px;
}
.slideshow .arrows .next {
    right: 30px;
}
.slideshow .arrows .next:hover .svg {
    left: 10px;
}
.slideshow .arrows .svg {
    position: relative;
    left: 0;
    width: 14px;
    height: 26px;
    fill: #fff;
    transition: left 0.2s ease;
}






.cart-wrap > button {
    background-color: transparent;
    border: none;
    align-items: center;
    display: flex;
    flex-direction: row-reverse;
    font-family: "Vazir" !important;
}

.cart-wrap > button span.icon-cart {
    font-size: 20px;
    position: relative;
    margin-left: 3px;
}

.cart-wrap > button span.icon-cart .count-style {
    position: absolute;
    right: -7px;
    top: -19px;
    background-color: #1f2226;
    color: #fff;
    font-size: 13px;
    display: inline-block;
    width: 22px;
    height: 22px;
    line-height: 22px;
    border-radius: 100%;
}

.cart-wrap > button span.cart-price {
    font-size: 16px;
    margin-left: 4px;
    display: block;
    line-height: 1;
}

.cart-wrap > button:hover span.icon-cart {
    color: #ff3535;
}

.cart-wrap .shopping-cart-content {
    background: #fff none repeat scroll 0 0;
    padding: 28px 30px 20px;
    position: absolute;
    left: 0px;
    top: 67px;
    width: 340px;
    z-index: 9999;
    box-shadow: 0 0 20px 0.4px rgba(0, 0, 0, 0.1);
    height: calc(100vh - 108px);
    transition: all 0.4s ease 0s;
    overflow-y: auto;
    opacity: 0;
    visibility: hidden;
}

.cart-wrap .shopping-cart-content.show {
    visibility: visible;
    opacity: 1;
    left: 16px;
}


.cart-wrap .shopping-cart-content .shopping-cart-top {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #cccccc;
    padding-bottom: 24px;
    margin-bottom: 20px;
}

.cart-wrap .shopping-cart-content .shopping-cart-top h4 {
    font-size: 16px;
    margin: 0;
    line-height: 1;
    color: #000000;
}

.cart-wrap .shopping-cart-content .shopping-cart-top a {
    color: #000000;
    font-size: 16px;
}

.cart-wrap .shopping-cart-content .shopping-cart-top a:hover {
    color: #ff3535;
}

.cart-wrap .shopping-cart-content ul {
    height: 450px;
    overflow-y: auto;
}

.shopping-cart-content{
    display: flex;
    flex-direction: column;
    align-items: stretch;
}


.product_image_cart{
    width: 80px;
}

.shopping-cart-title{
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}
.single-shopping-cart{
    display: flex;
    justify-content: space-between;

}

.shopping-cart-bottom{
    border-top: 1px solid #cccccc;
    margin-top: 15px;
    padding-top: 10px;
}

.shopping-cart-btns{
    display: flex;
    flex-direction: column;
    align-items: center;
    border-top: 1px solid #cccccc;
    margin-top: 10px;
    padding-top: 10px;
    gap:10px;
}

.default-btn-card{
    width: 100%;
    flex-grow: 1;
    border: 1px solid #cccccc;
    text-align: center;
    padding: 10px;
}

.shopping-cart-title{
    font-weight: 600;
    color: #585858;
}

.shopping-cart-title-a{
    color: #585858;
}


[id^="collapse-address-"] {
    display: none;
}