/**==============================================================================
IRANSans FONTS
=================================================================================**/

@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: bold;
    src: url('fonts/font-IRANSans5.5/eot/IRANSansWeb_Bold.eot');
    src: url('fonts/font-IRANSans5.5/eot/IRANSansWeb_Bold.eot?#iefix') format('embedded-opentype'), url('fonts/font-IRANSans5.5/woff2/IRANSansWeb_Bold.woff2') format('woff2'), url('fonts/font-IRANSans5.5/woff/IRANSansWeb_Bold.woff') format('woff'), url('fonts/font-IRANSans5.5/ttf/IRANSansWeb_Bold.ttf') format('truetype')
}

@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: 500;
    src: url('fonts/font-IRANSans5.5/eot/IRANSansWeb_Medium.eot');
    src: url('fonts/font-IRANSans5.5/eot/IRANSansWeb_Medium.eot?#iefix') format('embedded-opentype'), url('fonts/font-IRANSans5.5/woff2/IRANSansWeb_Medium.woff2') format('woff2'), url('fonts/font-IRANSans5.5/woff/IRANSansWeb_Medium.woff') format('woff'), url('fonts/font-IRANSans5.5/ttf/IRANSansWeb_Medium.ttf') format('truetype')
}

@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: 300;
    src: url('fonts/font-IRANSans5.5/eot/IRANSansWeb_Light.eot');
    src: url('fonts/font-IRANSans5.5/eot/IRANSansWeb_Light.eot?#iefix') format('embedded-opentype'), url('fonts/font-IRANSans5.5/woff2/IRANSansWeb_Light.woff2') format('woff2'), url('fonts/font-IRANSans5.5/woff/IRANSansWeb_Light.woff') format('woff'), url('fonts/font-IRANSans5.5/ttf/IRANSansWeb_Light.ttf') format('truetype')
}

@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: 200;
    src: url('fonts/font-IRANSans5.5/eot/IRANSansWeb_UltraLight.eot');
    src: url('fonts/font-IRANSans5.5/eot/IRANSansWeb_UltraLight.eot?#iefix') format('embedded-opentype'), url('fonts/font-IRANSans5.5/woff2/IRANSansWeb_UltraLight.woff2') format('woff2'), url('fonts/font-IRANSans5.5/woff/IRANSansWeb_UltraLight.woff') format('woff'), url('fonts/font-IRANSans5.5/ttf/IRANSansWeb_UltraLight.ttf') format('truetype')
}

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



@font-face {
    font-family: 'irsans';
    src: url('fonts/iransans/irsans-l.woff');
}

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */
/* Main-Style  ========================================================================== */
html {
    color: #222;
    font-size: 1em;
    line-height: 1.4;
    width: 100%;
    max-width: 100%;
    min-width: 100%;
    overflow-x: hidden;
}

html .mainWrapper svg{
    max-width: 100% !important;
}

*{
    margin: 0px;
    padding: 0px;
    outline: none !important;
}
*, ::after, ::before {
    box-sizing: border-box;
}
::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ddd;
    padding: 0;
}

audio, canvas, iframe, img, svg, video {
    vertical-align: middle;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

button:disabled,button:disabled *{
    opacity: 0.7;
}

button:disabled:hover{
    cursor: not-allowed;
}

input[type="file"]{
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
}

/* Author's custom styles ========================================================================== */

body{
    direction: rtl;
    text-align: right;
    color: #4e555b;
    font-family: "irsans";
    /*! overflow: hidden; */
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -ms-transition: all 1s;
    -o-transition: all 1s;
    transition: all 1s;
    margin: 0;
    padding:0;
    overflow-x: hidden;
    background-repeat: no-repeat;
    background-size: 100%;
    background-repeat: repeat-y;
    /*background-image: linear-gradient(to left, #901414, #e01624);*/
}

ul {
    list-style: none;
    padding: 0px;
}

ol{
    margin-bottom: 10px;
    margin-right: 10px;
    padding-right: 10px;
}
ol li{
    margin-bottom: 5px;
}

a:hover {
    text-decoration: none;
}

a {
    color: #000;
}

button:hover{
    cursor: pointer;
}

.chatraHeader{
    -webkit-box-shadow: 0px 3px 5px #999;
    -moz-box-shadow: 0px 3px 5px #999;
    box-shadow: 0px 3px 5px #999;
    position: fixed;
    right: 0;
    top: 0;
    width: 100%;
    height: 50px;
    background-color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0px 60px;
    z-index: 220;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.chatraHeader .chatraMenuLogo{
    height: 40px;
    width: auto;
    position: absolute;
    top: 5px;
    left: 25px;
}

.chatraMenu{
    flex: auto;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin: 0;
}

.chatraMenu,.chatraMenu > li,.chatraMenu > li > a{
    height: 100%;
}

.chatraMenu li{
    display: inline-block;
    flex: auto;
    padding: 0 10px;
}

.chatraMenu li:not(.profile).active a{
    background-color: #F08F00;
    border-radius: 18px;
}

.chatraMenu li:not(.profile).active a span::before{
    color: white;
}

.chatraMenu li.profile.active > div{
    background-color: #F08F00;
    border-radius: 18px;
}

.chatraMenu li.profile.active .profileMenuUserName{
    color: white;
}

.chatraMenu li:not(.profile).active *{
    color: white;
}

.chatraMenu > li{
    padding:5px 0;
}

.chatraMenu > li > a{
    display: block;
    font-size: 13px;
    font-weight: bold;
    text-align: center;
    color: #4D4D4D;
    line-height: 38px;
    /* overflow: hidden; */
}


.chatraMainWrapper{
    padding-top: 40px !important;
    min-height: calc(100vh - 131px);
}

/*log_in ===========================================> */

form iframe{
    display: none;
}

.chatraForm{
    display: none;
    max-width: 100%;
    padding: 20px 10px;
}

.chatraForm.show{
    display: block;
    width: 80%;
    max-width: 80%;
}

.chatraForm > *{
    flex: 100%;
}

.chatraFormTitle{
    font-size: 16px;
    font-weight: bold;
    color: #603813;
}

.chatraSectionTitle{
    font-size: 16px;
    font-weight: bold;
    color: #F19000;
}

.chatrInputWrap{
    background-color: white;
    border: 1px solid #603813;
    border-radius: 10px;
    padding: 5px 8px;
    margin-bottom: 5px;
    display: flex;
    overflow: hidden;
    height: 42px;
    align-items: center;
    padding-right: 10px;
}

.chatrInputWrap img{
    flex: 20px;
    width: 20px;
    max-width: 20px;
    height: 20px;
    object-fit: contain;
    margin-left: 5px;
}

.chatrInputWrap input,.chatrInputWrap select{
    display: block;
    border: unset;
    background: unset;
    flex: auto;
    text-align: right;
    font-size: 13px;
    height: 100%;
}

.loaderWrapper{
    display: none;
}

.chatraFullContainer,.chatraFullContainer > .row,.chatraFullContainer > .container,.chatraFullContainer > .container > .row{
    min-height: calc(100vh - 130px);
}

.publicFullContainer,.publicFullContainer > .row,.publicFullContainer > .container,.publicFullContainer > .container > .row{
    min-height: 100vh;
}

.publicFullContainer{
    padding-top: 50px;
}

.chatraFullContainer > .row > *{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    align-content: center;
    justify-content: center;
}

.chatraBtn{
    border-radius: 30px;
    background-color: #603813;
    text-align: center;
    padding: 10px;
    display: block;
    width: 100%;
    border: unset;
    font-size: 14px;
    font-weight: bold;
    color: white;
}

.chatraBtn.d-inline-block{
    width: auto;
    padding-right: 20px;
    padding-left: 20px;
}

.logInLinkBox{
    border-top: 1px solid #F19000;
}

.logInLinkBox > a{
    display: block;
    font-size: 14px;
    font-weight: bold;
    color: #000;
    margin-bottom: 5px;
}

.logInLeftCol{
    flex-wrap: wrap;
    align-content: unset !important;
    align-items: flex-end !important;
    background-image: url("img/background/login_background.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    justify-content:flex-start !important;
    position: relative;
}

.logInLeftCol > *{
    flex: 100%;
    width: 100%;
    max-width: 100%;
}

.logInLeftCol::before{
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.41);

}

.sideToggleBtns{
    position: absolute;
    top: 0;
    right: 0;
    z-index: 100;
    width: 100px;
    height: 100%;
    max-height: 100%;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    align-items: center;
}

.sideToggleBtns li{
    display: block;
    flex: 100%;
    max-width: 100%;
}

.sideToggleBtns li *{
    width: 100%;
    display: block;
}

.logInToggleBtn{
    border: unset;
    background: unset;
    text-align: center;
    padding: 10px;
    font-size: 14px;
    font-weight: bold;
    color: white;
}

.logInToggleBtn.active{
    position: relative;
    color: #603813;
    background-color: white;
    border-radius: 10px 0 0 10px;
}

.logInToggleBtn.active::before,.logInToggleBtn.active::after{
    content: "";
    position: absolute;
    width: 30px;
    height: 30px;
    background-repeat: no-repeat;
}

.logInToggleBtn.active::before{
    bottom: 92%;
    right: -7px;
    background-image: url(img/images/top_log_btn.svg);
}

.logInToggleBtn.active::after{
    top: 93%;
    right: -7px;
    background-image: url(img/images/bottom_log_btn.svg);
}

.mobileBoxWrap{
    display: block;
    flex: auto;
    font-size: 14px;
    font-weight: 500;
    color: #999;
}

.mobileBoxWrap > *{
    display: block;
    width: 100%;
    text-align: right;
}

.logInAboutLink{
    display: none;
    position: relative;
    padding: 10px;
}

.logInAboutLink a{
    display: inline-block;
    width: 60px;
    height: 50px;
    border-radius: 10px;
    background-color: #F19000;
    padding: 10px;
    text-align: center;
}

.footerSection{
    position: relative;
}

.footerSectionSocial{
    display: flex;
    justify-content: center;
}

.footerSectionSocial li{
    width: 20px;
    height: 20px;
    margin: 0 10px;
}

.footerSectionSocial li a{
    width: 100%;
    height: 100%;
    display: block;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center bottom;
}

.socialTelegram{
    background-image: url("img/icons/tell_icon.png");
}
.socialInstagram{
    background-image: url("img/icons/insta_icon.png");
}
.socialTwitter{
    background-image: url("img/icons/twitter_icon.png");
}
.socialFacebook{
    background-image: url("img/icons/facebook_icon.png");
}

.footerSectionLicense{
    font-size: 13px;
    font-weight: bold;
    color: white;
}

.chatraLogo{
    display: inline-block;
    margin: auto;
    max-width: 40%;
}


/*forget_pass =========================================> */

.chatraMiniForm{
    padding: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 50vh;
    background-color: white;
    border-radius: 20px;
}

.textForLogo{
    font-size: 18px;
    font-weight: bold;
    color: white;
    line-height: 30px;
}

.chatraForgetPassWrapper{
    background-image: url("img/background/forget_pass_background.png");
    background-repeat: no-repeat;
    background-size: cover;
}

.chatraPassLogo,.chatraMiniForm{
    display: flex !important;
    flex-wrap: wrap !important;
    width: 70%;
    max-width: 70%;
    margin: auto;
}

.chatraPassLogo > *,.chatraMiniForm > *{
    flex: 100%;
    width: 100%;
    max-width: 100%;
}

.questionBox{
    display: none;
}

.questionAlertBox{
    font-size: 14px;
    line-height: 25px;
    font-weight: bold;
    color: #000;
}

#pass_verify_code_get{
    font-size: 16px;
}

.chatraWhiteTitle{
    font-size: 18px;
    color: white;
    font-weight: bold;
    padding-top: 10px;
    border-top: 1px solid;
}

.contactUsWrapper{
    background-image: url("img/background/contact_background.png");
    background-repeat: no-repeat;
    background-size: cover;
}

.chatraGetComment{
    background-color: white;
    border-radius: 10px;
    padding: 10px;
    height: 150px;
    max-height: 150px;
    overflow: hidden;
    overflow-y: auto;
    display: block;
    width: 100%;
    margin-bottom: 5px;
}

.contactSocialList{
    display: flex;
    justify-content: center;
}

.contactSocialList li{
    display: inline-block;
    width: 30px;
    height: 30px;
    margin: 0 5px;
}

.contactSocialList li a{
    display: block;
    width: 100%;
    height: 100%;
}

.contactSocialList li a img{
    max-width: 100%;
}

/*about_us ========================================> */

.aboutUsWrapper{
    background-image: url(img/background/about_background.png);
    background-repeat: no-repeat;
    background-size: auto 102%;
    background-position: right;
}

.aboutUsContent{
    padding: 20px;
}

.aboutUsContent .aboutUsTitle{
    text-align: right;
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 10px;
}

.aboutUsContent .aboutUsText{
    font-size: 15px;
    line-height: 30px;
    text-align: justify;
}

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

.centeredContent > *{
    flex: 100%;
    max-width: 100%;
}

/*profile ==========================================> */

.profileHeader{
    height: 20vw;
    background-image: url(img/background/profile_top_background.png);
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position-y: -8vw;
    display: flex;
    align-items: center;
    justify-content: center;
}

.profileHeader .chatraLogo{
    max-width: 80px;
}

.profileInputBox{
    border: 1px solid #000;
    border-radius: 10px;
    /*padding: 10px 20px;*/
    display: flex;
}

.profileInputBox label{
    /*flex: auto;*/
    /*width: 20%;*/
    /*max-width: 20%;*/
    margin: 0;
    text-align: right;
    font-size: 13px;
    color: #000;
    font-weight: 500;
    white-space: nowrap;
    display: flex;
    align-items: center;
    font-weight: bold;
    padding: 10px 20px;
    padding-left: 5px;
}

.filedRequired{
    position: relative;
}

.filedRequired::before{
    content: "*";
    /* width: 20px; */
    /* height: 20px; */
    font-size: 15px;
    font-weight: bold;
    color: red;
    position: absolute;
    bottom: 70%;
    right: 10px;
    line-height: 0;
}

.profileInputBox *:not(label){
    display: block;
    flex: auto;
    border: none;
    background: unset;
    font-size: 13px;
}

.alertTitle{
    font-size: 14px;
    font-weight: bold;
    color: #000;
}

.profileFileBox label{
    flex: 100%;
    width: 100%;
    max-width: 100%;
}

.profileFileBox{
    position: relative;
}

.profileFileBox::after{
    content: "\f0c6";
    font-family: FontAwesome;
    font-size: 20px;
    color: #000;
    position: absolute;
    top: 10%;
    left: 10%;
}

.chatr_row{
    margin-left: -5px;
    margin-right: -5px;
}

.chatr_row > *{
    padding: 0 5px;
}

.alertTitleRed{
    color: #C91920;
}

.profileHeader .chatraPassLogoProfile{
    flex: auto !important;
    width: auto !important;
    max-width: unset !important;
    display: inline-block !important;
}

.profileHeader .chatraPassLogoProfile .textForLogo{
    display: block;
}

.chatraPassLogoProfile > *{
    position: relative;
    padding-left: 10px;
    display: inline-block;
    width: auto;
    flex: auto !important;
    max-width: unset !important;
}

.chatraPassLogoProfile > *::after{
    content: "";
    position: absolute;
    top: 0;
    right: 100%;
    width: 40px;
    height: 40px;
    background-image: url("img/logo/chatra_white_logo.png");
    background-repeat: no-repeat;
    background-size: cover;
}

.profileHeaderWithImg{
    position: relative;
}

.profileImgBoxWrap{
    position: absolute;
    top: 70%;
    right: 0;
    width: 100%;
}

.profileImgBox{
    position: relative;
    display: inline-block;
    margin: auto;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    border: 1px solid #603813;
    background-color: white;
    background-image: url("img/logo/profile_logo.png");
    background-repeat: no-repeat;
    background-size: 60%;
    background-position: center;
}

.profileImgBox img{
    border-radius: 50%;
    background-color: white;
}

.profileHeaderWithImg{
    margin-bottom: 80px;
}

.chProfileImg{
    position: absolute;
    top: 80%;
    right: 10px;
    width: 30px;
    height: 30px;
    background-color: #F19000;
    background-image: url("img/icons/edit_icon.png");
    background-size: 60%;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 50%;
}

.chProfileImg > input[type="file"]{
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
}

.chProfileImg > input[type="file"]:hover{
    cursor: pointer;
}

.chatrTwoBtn{
    margin-left: -5px;
    margin-right: -5px;
}

.chatrTwoBtn > *{
    padding: 0 5px;
}

/*ticket ============================================> */

.ticketBackground{
    background-image: url(img/background/ticket_background.png);
    background-repeat: no-repeat;
    background-size: auto 120%;
    background-position: left;
}

.ticketContainer{
    position: relative;
}

.ticketContainer .container{
    padding-top: 30px;
    padding-bottom: 30px;
}

.ticketContainer > .row{
    margin: 0;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.ticketBox{
    padding: 10px;
    border-radius: 10px;
    border: 1px solid #603813;
    background-color: white;
    margin-bottom: 10px;
}

.ticketBox span{
    display: block;
    font-size: 13px;
    color: #000;
    font-weight: bold;
    margin-bottom: 10px;
}

.ticketBtn{
    background-color: #E99800;
}

.chatraPager{
    display: flex;
    justify-content: center;
    flex-direction: row-reverse;
}

.chatraPager > .chatraBtn,.numberPage.sanFormBtn{
    display: inline-block;
    margin: 0 3px;
    height: 35px;
    padding: 4px 0;
    border-radius: 8px;
}

.chatraPager > .chatraBtn:not(.activePagerBtn){
    /*background-image: linear-gradient(to left,#d4d1d1,#9a9a9a);*/
    /*background-color: #a035c4;*/
}

.chatraPager > .chatraBtn.activePagerBtn{
    /*background-image: linear-gradient(to left,#9a9a9a,#d4d1d1);*/
    /*color: #881718 !important;*/
    background-color: #E99800;
}
.chatraPager > .chatraBtn > *{
    font-weight: bold;
}

.chatraPager > .basePagerBtn{
    flex: 60px;
    max-width: 60px;
}

.chatraPager > .chatraBtn:not(.basePagerBtn){
    flex: 30px;
    max-width: 30px;
}

.ticketDetailsBox{
    border: 1px solid #603813;
    border-radius: 10px;
    padding: 5px;
    display: flex;
    margin-bottom: 5px;
    background-color: white;
}

.ticketDetailsBox img{
    display: inline-block;
    flex: 25px;
    width: 25px;
    max-width: 25px;
    height: 25px;
    object-fit: contain;
    margin-left: 5px;
}

.ticketDetailsBox :not(img){
    border: none;
    background: unset;
    display: block;
    flex: auto;
    font-size: 13px;
    color: #000;
    font-weight: bold;
    line-height: 25px;
}

#ticket_content{
    height: 150px;
    overflow: hidden;
    overflow-y: auto;
}

.ticketCreateBox{
    flex: 100%;
}

.chatraFooter{
    background-color: #371E09;
    padding-top: 30px;
    position: relative;
}

.footerSocailWrap{
    display: flex;
    justify-content: center;
    margin: 0;
    width: 100%;
    max-width: 100%;
}

.footerSocailWrap > li{
    display: inline-block;
    width: 35px;
    height: 35px;
    margin: 0 3px;
}

.footerSocailWrap > li a{
    display: block;
    width: 100%;
    height: 100%;
}

.footerSocailWrap > li a img{
    max-width: 100%;
}

.footerChatraLicense{
    font-size: 14px;
    font-weight: bold;
    color: white;
    width: 100%;
}

.footerRow > div{
    display: flex;
    align-items: center;
}

.pulseLicense{
    background-color: #F08F00;
    padding: 10px;
}

.pulseLicense,.pulseLicense *{
    font-size: 14px;
    font-weight: bold;
    color: white;
}

/*header_style ==================================> */

/*overlay======================================> */

.overlay {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 230;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.9);
    overflow-y: auto;
    overflow-x: hidden;
    text-align: center;
    opacity: 0;
    -webkit-transition: opacity 0.5s;: opacity 0.5 s;
    -ms-transition: opacity 0.5s;: opacity 0.5 s;
    transition: opacity 0.5s;
}

.overlay.opened{
    width: 100%;
    opacity: 0.8;
}

/*sidenav==============================================================> */

.sidenav {
    height: 100%;
    width: 180px;
    transform: translateX(250px);
    position: fixed;
    z-index: 600;
    top: 0;
    right: 0;
    background-color: #fff;
    overflow-x: hidden;
    -webkit-transition: all 0.5s;: all 0.5 s;
    -ms-transition: all 0.5s;: all 0.5 s;
    transition: all 0.5s;
    padding-top: -6px;
}

.sidenav.opened{
    -webkit-transform: unset;
    -moz-transform: unset;
    -ms-transform: unset;
    -o-transform: unset;
    transform: unset;
}

.sidenav .logoSideNav {
    background-image: url(img/logo/chatr_choob_logo.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: auto 80px;
    margin: 0 25px 0 29px;
    height: 90px;
    border-bottom: 1px solid #e5e5ea;
}

.sidenav > button {
    color: #404e65;
    border: none;
    background: none;
    transition: 0.5s;
}

.sidenav > ul {
    position: relative;
}

.sidenav ul {
    overflow: hidden;
    display: block;
    margin: 0;
}

.sidenav ul li , .sidenav .mainLink{
    overflow: hidden;
    display: block;
}

.sidenav ul li a , .sidenav .mainLink a{
    display: block;
    width: 100%;
    text-align: center;
    color: #603813;
    font-size: 13px;
    line-height: 40px;
    font-weight: 700;
}

.sidenav ul li.menu-item-has-children{
    position: relative;
}


.responsiveMenuBtn{
    width: 40px;
    height: 40px;
    border: none;
    background: unset;
    position: absolute;
    top: 5%;
    right: 30px;
    display: none;
}

.responsiveMenuBtn i{
    font-size: 30px;
    color: #000;
}

.owl-carousel{
    direction: ltr;
}

.mainOwl{
    height: inherit;
    max-height: 100%;
}

.mainOwl .item{
    height: inherit;
}

.mainOwl .item img{
    /*filter: brightness(0.5);*/
    width:100%;
    height: inherit;
    min-height: 55px;
    max-height: 100%;
    display: block;
    background-color: white;
}

.stickyMainWrapper{
    padding-top: 0 !important;

}

/*.mainOwl{*/
/*    margin-bottom: -25px;*/
/*}*/

.mainOwl .owl-dots{
    padding: 10px 0;
    text-align: center;
    /*background: rgba(255, 255, 255, 0.71);*/
    position: absolute;
    /*width: 100%;*/
    /*right: 0;*/
    /*bottom: 0;*/
    /*min-height: 65px;*/
    width: 60px;
    top: 0;
    right: 0;
    height: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    align-content: center;
    justify-content: center;
}

.mainOwl .owl-dots button{
    text-align: center;
    display: inline-block;
    margin: 0 5px;
    /*width: 20px;*/
    /*height: 20px;*/
    /*border-radius: 50%;*/
    /*background-color: #5c3411;*/
    flex: 100%;
    width: 100%;
}

.mainOwl .owl-dots button.active span{
    background-color: #F08F00;
    border-color: white;
}

.mainOwl .owl-dots button span{
    display: inline-block;
    border-radius: 50%;
    background-color: #5c3411;
    width: 20px;
    height: 20px;
    border: 1px solid;
}





.stickyHeader{
    display: inline-block;
    width: auto;
    min-width: 80%;
    border-radius: 30px;
    position: relative !important;
    -webkit-box-shadow: 0px 3px 5px #999;
    -moz-box-shadow: 0px 3px 5px #999;
    box-shadow: 0px 3px 5px #999;
    z-index: 100;
}

.mainPageLinks{
    /*margin-top: 50px;*/
    /*height: 600px;*/
    margin-top: 20px;
}

.mainLinkItem{
    display: block;
    border-radius: 20px;
    padding: 10px;
    background-color: #603813;
    margin-bottom: 10px;
}

.mainLinkItem:hover{
    cursor: pointer;
}

.mainLinkItem img{
    height: 45px;
    width: 50px;
    object-fit: contain;
    margin-bottom: 0 !important;
}

.mainLinkItem .mainLinkTitle{
    font-size: 14px;
    font-weight: bold;
    color: white;
    padding-top: 5px;
}

.filterBarBox{
    height: 40px;
    display: flex;
}

.filterBarBox *{
    height: 100%;
}

.searchBox{
    flex: auto;
    border: 1px solid #F08F00;
    border-radius: 40px;
    overflow: hidden;
    display: flex;
    height: 41px;
}

.searchBarBtn{
    background-color: #F08F00;
    border: unset;
    padding: 5px;
}

.searchBarBtn > span{
    text-align: center;
    font-size: 13px;
    font-weight: bold;
    color: white;
    position: relative;
    padding-left: 10px;
}

.searchBarBtn > span::after{
    content: "";
    position: absolute;
    top: 0;
    left: -24px;
    width: 20px;
    height: 20px;

    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.searchBtn > span::after{
    background-image: url("img/icons/search_icon.png");
}

.searchBtn{
    flex: 100px;
    width: 100px;
    max-width: 100px;
    min-width: 100px;
}


.searchBox > input[type="text"]{
    border: none;
    flex: auto;
    padding: 0 5px;
}

.filterBtn{
    flex: 100px;
    /*width: 100px;*/
    /*max-width: 100px;*/
    border-radius: 30px;
    margin-right: 5px;
}

.filterBtn span::after{
    background-image: url("img/icons/filter_icon.png");
}

.productSlider{
    background-image: url("img/background/product_slider_background.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding: 25px;
}

.productSliderTitle{
    font-size: 20px;
    font-weight: bold;
    color: white;
}

.productSliderShowAll{
    display: block;
    font-size: 14px;
    font-weight: bold;
    color: white;
    padding: 10px;
    border: 1px solid white;
    border-radius: 30px;
}

.owlProduct .item{
    background-color: white;
    border-radius: 20px;
    padding: 10px;
    position: relative;
}

.productItemTitle{
    font-size: 16px;
    line-height: 25px;
    color: #000;
}

.owlProduct .item > img{
    display: inline-block;
    width: auto;
    height: 150px;
    object-fit: cover;
}

.productPriceBox {
    direction: rtl;
    display: flex;
    justify-content: space-between;
}

.productPriceBox span{
    font-size: 10px;
    direction: rtl;
}

.discountBox{
    width: 60px;
    background-color: #F08F00;
    padding: 5px;
    border-radius: 0 20px 20px 20px;
    position: absolute;
    top: 10px;
    left: 10px;
    font-size: 12px;
    color: white;
}

.productTimeIcon,.productTimeText{
    display: inline-block !important;
    margin-left: 5px;
    font-size: 10px;
    color: #000;
}

.owlProduct .productTimeIcon{
    width: 20px !important;
    height: 20px !important;
    object-fit: contain;
}

.owlProduct .owl-nav{
    display: block !important;
}

.owlProduct .owl-nav button{
    position: absolute;
    bottom: 10%;
    width: 30px;
    height: 30px;
    background-color: #F08F00 !important;
    border-radius: 50%;
}

.owlProduct .owl-nav button.owl-prev{
    left: -35px;
}

.owlProduct .owl-nav button.owl-next{
    right: -35px;
}

.owlProduct .owl-nav button span{
    font-size: 30px;
    font-weight: bold;
    color: white;
    line-height: 30px;
}

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

.bestSeller{
    background-image: unset;
}

.bestSeller .productSliderTitle{
    color: #5C3411;
}

.bestSeller .productSliderShowAll{
    background-color: #F08F00;
    color: white;
    border-color: #F08F00;
}

.bestSeller .owlProduct .item{
    border: 1px solid #5C3411;
}

.bestSeller .owl-nav button{
    background-color: #5C3411 !important;
}

.rightWoodCategory{
    /*background-color: #ECECEC;*/
    /*border-radius: 20px;*/
    /*padding: 10px;*/
    margin-bottom: 30px;
    max-height: 100%;
    overflow: hidden;
    overflow-y: auto;
}

.woodCategoryTitle{
    font-size: 16px;
    border-bottom: 1px solid #000;
}

.woodCategoryBox{
    overflow: hidden;
    overflow-y: auto;
    max-height: 200px;
    padding: 5px 10px;
    margin-bottom: 0;
}

.woodCategoryBox:not(:last-child){
    border-bottom: 1px solid #999;
}

.woodCategoryBox li{
    display: block;
    padding: 0 10px;
    font-size: 13px;
    text-align: right;
}

.woodCategoryBox li a{
    display: block;
    text-align: right;
    color: #000;
    font-size: 13px;
}

.woodCategoryBox li .moreLink{
    color: #999;
}

/*category ========================================= > */

.cardCategoryBox{
    display: block;
    padding: 30px;
    border-radius: 30px;
    background-image: url("img/background/product_slider_background.png");
    background-repeat: no-repeat;
    background-position: center;
}

.cardCategoryBox img{
    width: 100%;
    height: 150px;
    object-fit: fill;
    border-radius: 20px;
}

.cardCategoryTitle{
    font-size: 18px;
    font-weight: bold;
    color: white;
}

.cardCategoryRow > *{
    margin-bottom: 10px;
}

/*subCategory =====================================>*/

.subCategory.cardCategoryBox{
    padding: 20px;
}

.subCategoryText{
    margin: 0;
    font-size: 13px;
    font-weight: bold;
    color: white;
    line-height: 30px;
    text-align: justify;
}

/*details_slider =================================>*/

/*#big img,#thumbs .current:not(.active) img{*/
/*filter: brightness(0.7);*/
/*}*/


.outer { margin:0 auto; max-width:800px;text-align: center}
#big .item { background: #ec6e46; padding: 0px; margin:2px; color: #FFF; border-radius: 3px; text-align: center; }
#thumbs .item { background: #C9C9C9; height:70px; line-height:70px; padding: 0px; margin:2px; color: #FFF; border-radius: 3px; text-align: center; cursor: pointer; }
#thumbs .item h1 { font-size: 18px; }
#thumbs .current .item { background:#FF5722; }
.owl-theme .owl-nav [class*='owl-'] { -webkit-transition: all .3s ease; transition: all .3s ease; }
.owl-theme .owl-nav [class*='owl-'].disabled:hover { background-color: #D6D6D6; }
#big.owl-theme { position: relative; }
#big.owl-theme .owl-next, #big.owl-theme .owl-prev { width: 22px; line-height:40px; height: 40px; margin-top: -20px; position: absolute; text-align:center; top: 50%; }

#big.owl-theme .owl-next span, #big.owl-theme .owl-prev span{
    color: white;
    font-size: 80px;
}

#big.owl-theme .owl-prev { left: 10px; }
#big.owl-theme .owl-next { right: 10px; }
#thumbs.owl-theme .owl-next, #thumbs.owl-theme .owl-prev { width:30px;height: 30px }


#big{
    height: 400px;
    overflow: hidden;
    margin-bottom: 20px;
}

#big *{
    height: 100%;
    max-height: 100% !important;
}

#big .item{
    border-radius: 20px;
    overflow: hidden;
}

#thumbs{
    display: inline-block;
    max-width: 80%;
    margin: auto;
    position: relative;
}

#thumbs .owl-nav button{
    position: absolute;
    top: 20%;
}

#thumbs .owl-nav button.owl-prev{
    right: calc(100% + 5px);
}
#thumbs .owl-nav button.owl-next{
    left: calc(100% + 5px);
}

#thumbs .item{
    border: 1px solid #999;
    border-radius: 5px;
    /*padding: 5px;*/
    background: unset !important;
    overflow: hidden;
}

#thumbs .item img{
    filter: brightness(0.7);
    border-radius: 5px;
}

#thumbs .current .item{
    border-color: #f08f00 !important;
}

#thumbs .current .item img{
    filter: unset;
}

.item a{
    height: 100%;
}


.basketTitle{
    padding-bottom: 5px;
    border-bottom: 2px solid #5c3411;
    flex: 100%;
    width: 100%;
    align-self: flex-start;
}

.basketTitle span{
    font-size: 16px;
    font-weight: bold;
    color: #5c3411;
    height: 100%;
}

.basketTitle img{
    width: 40px;
}

.shortDetails li{
    font-size: 14px;
    font-weight: bold;
    color: #000;
    text-align: right;
}

.productDetails{
    /* flex-flow: column; */
    border-bottom: 2px solid #5c3411;
}

.leftCol{
    display: flex;
    flex-wrap: wrap;
    /* flex-flow: column; */
    align-content: space-around;
}

.shortDetails{
    flex: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    /*height: 100%;*/
}


#chat_rom_btns .col-6.text-right{
    padding-right: 15px;
}

#chat_rom_btns .col-6.text-left{
    padding-left: 0;
}

#chat_rom_btns .col-6{
    flex: unset !important;
    flex-grow: 0;
    width: 250px !important;
    max-width: unset;
    display: inline-block;
    padding: 0 !important;
}

#chat_rom_btns button.sanFormBtn{
    position: relative;
    margin-bottom: 0 !important;
    border-bottom-left-radius: unset;
    border-bottom-right-radius: unset;
    max-width: 80% !important;
    padding: 10px 3px;
    margin: auto;
    font-size: 14px;
    font-weight: bold;
}

#chat_rom_btns{
    overflow: hidden;
    border-bottom: 2px solid #f08f00;
    align-self: baseline;
    /*padding-bottom: 1px;*/
    margin: 0;
}

#chat_rom_btns button::after{
    content: "";
    position: absolute;
    top: -72%;
    bottom: 0;
    right: 103%;
    height: 220%;
    /* width: 30px; */
    border-width: 35px;
    border-style: solid;
    border-color: transparent transparent transparent #ececec;
    -webkit-transform: rotateZ(35deg) translateX(50px) scaleX(0.8);
    -moz-transform: rotateZ(35deg) translateX(50px) scaleX(0.8);
    -ms-transform: rotateZ(35deg) translateX(50px) scaleX(0.8);
    -o-transform: rotateZ(35deg) translateX(50px) scaleX(0.8);
    transform: rotateZ(35deg) translateX(54px) scaleX(0.8);
}

.sanFormBtn {
    background-color: #ececec !important;
    margin-bottom: 10px;
    z-index: 50;
    height: 35px;
    border: unset;
}

.sanFormBtn.active{
    background-color: #f08f00 !important;
}

.sanFormBtn.active::after{
    border-color: transparent transparent transparent #f08f00 !important;
}

.sanFormBtn.active::before {
    border-color: #f08f00 transparent transparent transparent !important;
}

#chat_rom_btns button::before{
    content: "";
    position: absolute;
    top: 153%;
    bottom: 0;
    right: auto;
    left: 102%;
    height: 220%;
    /* width: 30px; */
    border-width: 30px;
    border-style: solid;
    border-color: #ececec transparent transparent transparent;
    -webkit-transform: rotateZ(54deg) translateX(-74px) scaleY(0.7);
    -moz-transform: rotateZ(54deg) translateX(-74px) scaleY(0.7);
    -ms-transform: rotateZ(54deg) translateX(-74px) scaleY(0.7);
    -o-transform: rotateZ(54deg) translateX(-74px) scaleY(0.7);
    transform: rotateZ(54deg) translateX(-66px) scaleY(0.7);
}

.commentsWrap{
    background-color: #ececec;
}

.commentsSection{
    display: none;
    padding: 10px;
}

.p_comments_section{
    border-bottom: 2px solid #5c3411;
}

#p_details{
    display: block;
}

/*#p_comments{*/
/*    padding-bottom: 0;*/
/*}*/

.p_comments_title{
    text-align: right;
    font-size: 18px;
}

.p_comments_text{
    font-size: 13px;
    line-height: 30px;
}

.productComments p{
    font-size: 14px;
    color: #000;
    text-align: right;
}

.inputMsgWrap{
    padding: 10px;
    border: 1px solid #f08f00;
    border-radius: 5px;
    background: white;
}

.inputMsgWrap input{
    flex: auto;
    border: unset;
    max-width: calc(100% - 40px);
}

.inputMsgWrap button{
    width: 40px;
    background: url("img/icons/send_msg_btn.png") no-repeat center;
    background-size: contain;
}

.overlayCover,.overlayCoverAction,.moduleCover,.payModuleCover{
    z-index: 900;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 1;
    display: none;
    -webkit-transition: unset;
    -moz-transition: unset;
    -ms-transition: unset;
    -o-transition: unset;
    transition: unset;
    background-color: #00000094;
}

.overlayCover,.payModuleCover{
    z-index: 800;
}

.overlayCover{
    z-index: 1000;
}

.overlayAlert,.moduleAlert{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    -webkit-transition: unset;
    -moz-transition: unset;
    -ms-transition: unset;
    -o-transition: unset;
    transition: unset;
    background-color: #00000000;
    padding: 10px;
}

.homeNewsBoxAlert {
    display: inline-block;
    align-items: center;
    justify-content: center;
    margin: auto;
    height: 300px !important;
    width: 600px;
    max-width: 100%;
    position: relative;
    border-radius: 10px;
    background-color: #ffe8c7;
    padding:40px 20px;
    text-align: center;
    font-size: 14px;
    color: red;
    height: auto !important;
    max-width: 90%;
    min-height: 150px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    background-color: #fff;
    /*min-height: 65vh;*/
    align-content: center;
}

.homeNewsBoxAlert span {
    display: inline-block;
    margin: auto;
    color: #000;
    text-align: center;
}

.homeNewsCloseAlert{
    position: absolute;
    top: 5px;
    right: 5px;
    display: inline-block;
    border-radius: 50%;
    background-image: linear-gradient(to right,#b71920,#f55d17c9,#f16919);
    width: 30px;
    height: 30px !important;
    background: unset;
}

.homeNewsCloseAlert:hover{
    cursor: pointer
}

.homeNewsCloseAlert::before,
.homeNewsCloseAlert::after{
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%
}

.homeNewsCloseAlert::after{
    content: "\f00d";
    font-family: FontAwesome;
    color: #820303;
    font-size: 22px;
    line-height: 30px;
    /*transform: scale(0.9) rotateZ(-45deg);*/
    background-position: center;
    background-repeat: no-repeat;
    background-size: 50%;
    /*background-image: linear-gradient(to top left, #c53210, #820303);*/
    border-radius: 50%;
    z-index: 1
}

.moduleAlert .homeNewsBoxAlert{
    min-width: 60%;
    min-height: 60%;
    background-image: url("img/background/service_model_img.png");
    background-size: 55vh 100%;
    background-position: top left;
    background-repeat:no-repeat;
}

.payModuleAlert .homeNewsBoxAlert{
    min-width: 40%;
    min-height: 40%;
    background-color: #f08f00;
    background-position: center;
    background-size: cover;
    background-image: url("img/background/payment_background.png");
}

.loaderWrapper{
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    height: 100%;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.61);
    z-index: 1000;
}

.loader{
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.loader img{
    width: 100px;
    height: 100px;
}

.overlayCover .homeNewsBoxAlert .chatraBtn,.overlayCoverAction .homeNewsBoxAlert .chatraBtn,.moduleCover .homeNewsBoxAlert .chatraBtn{
    background-color: #f08f00;
}

.payModuleAlert .homeNewsCloseAlert{
    background-color: white;
}

.orderTbl{
    min-width: 510px;
}

.orderTbl td,.orderTbl th{
    padding: 10px;
    font-size: 14px;
    text-align: center;
    border: 2px solid white;
    color: #000;
}

.orderTbl th{
    color: white;
    background-image: linear-gradient(to right,#5c3411, #9b5c1a);
}

.orderTbl th:first-child{

    border-top-left-radius: 20px;
}

.orderTbl th:last-child{
    border-top-right-radius: 20px;
}

.table:not(#order_tbl) thead th{
    width: 1%;
}

.table-striped tr td:first-of-type,.table-striped tr td:last-of-type{
    border-radius: unset !important;
}

.orderTbl tbody > tr:last-child > td:first-child{

    border-bottom-left-radius: 20px !important;
}
.orderTbl tbody > tr:last-child > td:last-child{
    border-bottom-right-radius: 20px !important;
}

.orderTbl tbody > tr:last-child{
    box-shadow: 2px 3px 4px transparent;
}

.orderTblParent{
    padding: 20px 0;
}

.tblRow{
    margin: 0;
}

.tblRow > *{
    padding: 0;
}

#tbl_adder{
    width: auto;
    font-size: 15px;
}
.rowDelete{
    font-size: 13px;
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgb(0 0 0 / 12%);
}

.table-striped tbody tr:nth-of-type(even) {
    background-color: rgb(0 0 0 / 5%);
}

.orderAlert{
    font-size: 14px;
    font-weight: bold;
    color: #5c3411;
    line-height: 30px;
    text-align: right;
}

.orderAlert.text-danger{
    font-size: 16px;
}

.chatraTextArea{
    height: 150px;
    overflow: hidden;
    overflow-y: auto;
    border: 1px solid #5c3411;
    border-radius: 20px;
    padding: 10px;
}


.fileAdderLabel{
    flex: auto;
    position: relative;
}

.fileAdderLabel input[type="file"]:not(:disabled):hover{
    cursor: pointer;
}

.fileAdderLabel input[type="file"]{
    opacity: 0;
    position: absolute;
    top: 0;
    right: 0;
}



.chapBtn{
    background-color: #81a73e !important;
    font-size: 13px !important;
    font-weight: bold !important;
    text-align: center !important;
    color: white !important;
    padding: 10px 30px !important;
    border-radius: 5px !important;
    border: none !important;
}

.fileAdder{
    width: 50px;
    max-width: 50px;
    font-size: 20px !important;
    padding: 0 !important;
}

.uploadFileParent .chapBtn{
    background-color: #ffa513 !important;
}

.centrBtn > .chatraBtn{
    width: auto !important;
    padding-right: 20px;
    padding-left: 20px;
}

.orderTblWrap{
    overflow: hidden;
    overflow-x: auto;
}

#order_tbl{
    min-width: 900px;
    direction: ltr;
}


::-webkit-scrollbar {
    -webkit-appearance: none;
}
::-webkit-scrollbar:vertical {
    width: 12px;
}
::-webkit-scrollbar:horizontal {
    height: 12px;
}
::-webkit-scrollbar-thumb {
    background-color: #5c3411;
    border-radius: 10px;
    border: 2px solid #ffffff;
}
::-webkit-scrollbar-track {
    padding-top: 5px;
    border-radius: 10px;
    background-color: #ffffff;
}


.woodCategoryBox::-webkit-scrollbar-track{
    background-color: transparent !important;
}

.woodCategoryBoxWrap{
    overflow: hidden;
    background-color: #ECECEC;
    border-radius: 20px;
    padding: 5px 10px;
    /* margin-bottom: 10px; */
}

.orderCaption{
    font-size: 14px;
    font-weight: bold;
    color: #5c3411;
}

.classDetailsTitle{
    display: flex;
    align-items: center;
    padding: 0 !important;
}

.classDetailsTitle *{
    flex: auto;
}

.classDetailsTitle span{
    flex-grow: 0;
    margin-left: 10px;
    font-size: 22px;
    color: #5c3411;
    font-weight: bold;
}

.classDetailsTitle div{
    border: 1px solid #5c3411;
    height: 2px;
    background: #5c3411;
}

/*.showDetailsLink{*/
/*    min-width: 200px;*/
/*}*/

.orderItem{
    border: 1px solid #5c3411;
    border-radius: 10px;
    padding: 10px;
}

.orderItemContent{
    flex: auto;
    padding-right: 10px;
}

.orderItemIcon{
    border: 1px solid #f08f00;
    border-radius: 10px;
    padding: 20px;
    width: 200px;
}

.orderItemIcon img{
    object-fit: contain;
}

.orderNumWrap{
    border-bottom: 1px solid #000;
}

.orderNumWrap *{
    color: #000 !important;
}

.reviewedOrder .orderStatus,.reviewedOrder .orderNumWrap{
    color: #f08f00 !important;
    border-color: #f08f00;
}
.reviewingOrder .orderStatus,.reviewingOrder .orderNumWrap{
    color: #25b2ca !important;
    border-color: #25b2ca;
}
.postedOrder .orderStatus,.postedOrder .orderNumWrap{
    color: #39a64a !important;
    border-color: #39a64a;
}
.deliveredOrder .orderStatus,.deliveredOrder .orderNumWrap{
    color: #39a64a !important;
    border-color: #39a64a;
}

.orderStatusRow .orderStatus{
    width: 12.5%;
    max-width: 12.5%;
    flex: 12.5%;
    overflow: hidden;
}

.orderStatusIcon{
    width: 40px;
    height: 40px;
    padding: 6px;
    border-radius: 50%;
    border: 2px solid #5c3411;
    margin-bottom: 10px !important;
    position: relative;
    display: inline-flex !important;
    align-items: center;
}

.orderStatus:not(:last-child) .orderStatusIcon::after,.orderCurrentStatusImg::after{
    content: '';
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    height: 1px;
    width: 200%;
    border: 1px solid #5c3411;
}
.orderStatus:not(:first-child) .orderStatusIcon::before,.orderCurrentStatusImg::before{
    content: '';
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    height: 1px;
    width: 200%;
    border: 1px solid #5c3411;
}

.first .orderStatusIcon::before{
    width: 0!important;
    height: 0!important;
    position: unset !important;
    border: unset !important;
    -webkit-transform: unset !important;
    -moz-transform: unset !important;
    -ms-transform: unset !important;
    -o-transform: unset !important;
    transform: unset !important;
}


.orderStatusIcon::before,.orderCurrentStatusImg::before{
    left: 100%;
}

.orderStatusIcon::after,.orderCurrentStatusImg::after{
    right: 100%;
}

.orderStatusText{
    font-size: 11px;
    font-weight: bold;
    color: #5c3411;
}

.mainSlider{
    overflow: unset;
    min-height: 55px;
    padding-bottom: 10px;
    -webkit-transition: height 0.5s;
    -moz-transition: height 0.5s;
    -ms-transition: height 0.5s;
    -o-transition: height 0.5s;
    transition: height 0.5s;
}

.orderStatus.active .orderStatusIcon,.orderStatus.active .orderStatusIcon::before,.orderStatus.active .orderStatusIcon::after,.orderCurrentStatusImg::after,.orderCurrentStatusImg::before{
    border-color: #eca13b !important;
}

.orderCurrent .orderItemIcon{
    padding: 0;
    border: unset;
    box-shadow: 0px 1px 7px #0000008c;
    -ms-box-shadow: 0px 1px 7px #0000008c;
    -webkit-box-shadow: 0px 1px 7px #0000008c;
}

.orderCurrent .orderItemIcon img{
    width: 100%;
    height: 100%;
}

.orderCurrentTitle{
    font-size: 18px;
    color:#5c3411;
}

.orderCurrentClose{
    width: 30px;
    height: 30px;
    border: unset;
    background: unset;
}

.orderCurrent .orderCurrentShow{
    width: auto !important;
    padding-right: 20px;
    padding-left: 20px;
    background-color: #eca13b;
}

.orderCurrentTextDetails span{
    font-size: 14px;
}

.orangBtn{
    background-color: #eca13b !important;
}

.orderNum input{
    width: 40px;
    max-width: 40px;
}

input[type=number]::-webkit-inner-spin-button{
    opacity: 1;
}

input[type=number]::-webkit-outer-spin-button {
    opacity: 1;
}

.chatWrapper .chatItem{
    min-width: 50%;
    max-width: 70%;
    padding: 10px;
    border-radius: 10px;
}

.chatWrapper .fromUser{
    border: 1px solid #999;
}
.chatWrapper .fromAdmin{
    background: #99999978;
}

.footerLogo{
    max-width: 180px !important;
}

.heartAnim{
    -webkit-animation: 3s infinite heart;
    -o-animation: 3s infinite heart;
    animation: 3s infinite heart;
}

@keyframes heart {
    0%{
        transform: scale(1);
    }
    20%{
        transform: scale(1.2);
    }
    30%{
        transform: scale(1);
    }
    40%{
        transform: scale(1.2);
    }
    50%{
        transform: scale(1);
    }
    100%{
        transform: scale(1);
    }
}

.orderCurrentStatus{
    overflow: hidden;
}

.orderCurrentStatusImg{
    position: relative;
    padding: 5px;
    border-radius: 50%;
    border: 2px solid #eca13b;
    width: 45px;
    max-width: 45px;
    height: 45px;
}

.orderCurrentStatus img{
    max-width: 100%;
}

.orderCurrentStatus{
    border: 2px solid #eca13b;
    border-radius: 5px;
    padding: 5px;
}

#factor_tbl .comment_tr td{
    height: 100px;
}

.payModuleSection img{
    width: 40px;
}

.payModuleSection{
    display: none;
}

.payModulePrimary{
    display: block;
}

#webmenu{
    width:280px;
    max-width: 90%;
}

.ddcommon span,.dd span{
    width: 100%;
    text-align: center !important;
}

.ddcommon .ddChild li img,.ddcommon .ddTitle .ddTitleText img{
    width: 40px;
}

.pdp-default .pdp-header{
    margin-bottom: 5px;
}

/*blog ===================================================> */


.blogItemWrap{
    border: 1px solid #662483;
    border-radius: 40px;
    padding: 20px;
    margin-bottom: 10px;
}

.blogItemWrap .row{
    margin: 0;
}

.blogItemWrap .row > *{
    padding: 0 3px;
}

.blogItemList{
    margin: 0;
    flex: 100%;
    display: block;
}

.blogItemList li{
    display: flex;
    margin-bottom: 10px;
}
.blogItemList li img{
    flex: 25px;
    height: 25px;
    width: 25px;
    max-width: 25px;
    object-fit: contain;
    margin-left: 5px;
}

.blogItemList li span{
    font-size: 13px;
    line-height: 25px;
    color: #000;
    font-weight: 500;
}

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

.blogItemWrap p{
    font-size: 13px;
    color: #000;
    line-height: 25px;
}

.blogItemWrap .sanFormBtn{
    background-color: #662483;
}

/*blogDetails ================================= > */

#blog_details_box{
    max-width: 800px;
    margin: auto;
}

.blogDetailsItems > *{
    display: flex;
    margin-bottom: 10px;
}

.blogDetailsItems > * img{
    flex: 25px;
    height: 25px;
    width: 25px;
    max-width: 25px;
    object-fit: contain;
    margin-left: 5px;
}

.blogDetailsItems > * span{
    font-size: 13px;
    line-height: 25px;
    color: #000;
    font-weight: 500;
    text-align: right;
}

#blog_details_box p{
    font-size: 14px;
    line-height: 25px;
}

.requiredInfo{
    position: relative;
}

.requiredInfo::before{
    content: '*';
    position: absolute;
    top: 2px;
    right: -3px;
    width: 20px;
    font-size: 18px;
    font-weight: bold;
    color: red;
}

.isEmpety{
    border-color: red !important;
}

#exit:not(.show),#product_num_wrap{
    display: none;
}

.CNC input{
    width: 20px;
    height: 20px;
}

#order_tbl th,#order_tbl td{
    font-weight: bold;

}

#order_tbl td{
    color: #000;
}

.delAlert{
    display: none;
}

#payment_btn{
    display: none;
}

.fileImg{
    border-radius: 20px;
    overflow: hidden;
    height: 150px;
    box-shadow: 0px 1px 7px #0000009e;
}

#by_update{
    display: none;
}

.chatraMiniFormContent{
    display: none;
}

#forget_get_user{
    display: block;
}


.requiredInfo{
    position: relative;
}

.requiredInfo::before{
    content: '*';
    position: absolute;
    top: 3px;
    right: -2px;
    width: 20px;
    font-size: 18px;
    font-weight: bold;
    color: red;
}

.isEmpety{
    border-color: red !important;
}

.chatra_menu .profile:not(.show),.chatra_menu .ordersListLink:not(.show),.chatra_menu .basketLink:not(.show),.reProfileMenuWrap:not(.show){
    display: none;
}

#form_change_pass{
    display: block;
}

.alertData{
    font-size: 16px;
    padding: 10px;
}

.notShow{
    display: none !important;
}

.loadingList{
    height: 220px;
    max-height: 220px;
    max-width: 100%;
    background-color: white;
    background-image: url("img/images/loader.gif");
    background-repeat: no-repeat;
    background-size: 100px;
    background-position: center;
    overflow: hidden;
}

#ticket_pager{
    display: none;
}

.numberPage.sanFormBtn{
    max-width: 30px;
    z-index: 0;
}

.chatraMainWrapper.pt-0{
    padding-top: 0 !important;
}

#blog_details_img{
    /*display: inline-block;*/
    /*height: 100px;*/
    display: block;
    width: 100%;
}

.blogItemSubject{
    text-align: right;
}

.chatrBtnsRow .chatraBtn{
    padding: 10px;
    margin: 0 10px;
    width: 130px;
}

.showDetailsLink{
    /*height: 100%;*/
    display: inline-flex !important;
    flex-wrap: wrap;
    align-content: space-between;
}

.showDetailsLink > *{
    flex: 100%;
    width: 100%;
    align-self: baseline;
}

.unReadMsg{
    /*width: 20px;*/
    /*height: 20px;*/
    /*background-color: white !important;*/
    border-radius: 50%;
    padding: 3px;
    text-align: center;
    /*color: #F08F00 !important;*/
    display: inline-flex !important;
    justify-content: center;
    align-items: center;
}

.innerContainer{
    min-height: calc(100vh - 150px);
    padding-top: 10px;
}

#ordered_list .showDetailsLink{
    height: 100%;
}

.chatraBtn:not(.unReadMsgBtn):hover{
    box-shadow: 0px 1px 6px #3e3e3e;
    color: #fff;
}

.commentWrap{
    background-color: white;
    border: 1px solid #603813;
    border-radius: 10px;
}

.commentWrap textarea{
    border: none !important;
}

#long_details,#long_details *{
    text-align: right;
    color: #000;
    font-size: 14px;
    font-weight: bold;
}

.blogImg{
    /*height: 170px;*/
    width: 100%;
}

.firstWoodCategoryTitle{
    font-size: 15px !important;
    font-weight: bolder;
    display: none;
}

.p_details{
    display: flex !important;
    align-items: center;
}

h2.classDetailsTitle span{
    font-size: 18px;
}

.productBoxDetailsLink{
    max-width: 100%;
}

.productItemBox{
    border-radius: 10px;
    border: 1px solid #603813;
    padding: 10px;
}

.productItemBox img{
    height: 130px;
    object-fit: contain;
}

.productBoxTitle{
    font-size: 15px;
    line-height: 25px;
    padding: 10px;
}

.productBoxDetails{
    font-size: 14px;
    line-height: 15px;
    color: #603813;
    display: -webkit-box;
    max-width: 400px;
    height: 40px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.chatraHeader .menuProductList{
    top: 100%;
    right: 0;
    min-width: 700px;
    max-width: 700px;
    background-color: white;
    -moz-box-shadow: inset 0 20px 20px -20px rgba(0,0,0,0.8);
    border-radius: 0px 0px 15px 15px;
    box-shadow: 0px 8px 8px 0px #6d6b6ba8;
    height: auto;
    padding-top: 0;
    /* z-index: -1; */
    min-height: 200px;
}

.chatraHeader .menuProductTitle{
    font-size: 14px;
    padding: 10px;
    /*background-color: #ECECEC;*/
    margin: 0;
    text-align: center;
    position: relative;
    padding-left: 20px;
}

.chatraHeader .menuProductTitle::after{
    content: "\f104";
    font-family: FontAwesome;
    height: 100%;
    font-size: 16px;
    font-weight: bold;
    display: flex;
    align-items: center;
    position: absolute;
    top: 0;
    left: 8%;
}

.chatraHeader .menuProductList ul li{
    padding: 0 5px;
}

.chatraHeader .menuProductList ul li a{
    padding: 5px 10PX;
    font-size: 13px;
    position: relative;
    text-align: right;
}
.chatraHeader .menuProductList ul li a::before{
    content: '';
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background-color: #F08F00;
    position: absolute;
    top: 40%;
    right: 0;
    display: flex;
    align-items: center;
}

.chatraHeader .menuProductList .menuProductCol {
    flex:auto;
    width: 1%;
    /* max-width: 130px; */
    padding: 0;
}

/*.chatraHeader .menuProductList .menuProductCol:not(:last-child){*/
/*    border-left:1px solid #999;*/

/*}*/

.chatraHeader .menuProductList .menuProductCol .menuProductTitle{
    /*border-bottom:1px solid #999;*/
    font-weight: bold;
    box-shadow: inset 0 20px 11px -20px rgb(86 85 85 / 80%);
}

.chatraHeader ul li.menu-item-has-children::after{
    content: "\f107";
    font-family: FontAwesome;
    position: absolute;
    font-size: 16px;
    font-weight: bold;
    left: 10%;
    top: 0;
    height: 100%;
    display: flex;
    align-items: center;
}

.chatraMenu .menuProductList{
    display: none;
}

.chatraHeader ul li.menu-item-has-children:hover .menuProductList{
    display: block;
}

.menuProductCol ul{
    max-height: 400px;
    overflow: hidden;
    overflow-y: auto;
    padding: 0 5px;
}

/*.p_details_sub_cat a::after{*/
/*    content: "\f104";*/
/*    font-family: FontAwesome;*/
/*    font-size: 14px;*/
/*    position: absolute;*/
/*    top: 0;*/
/*    left: 10%;*/
/*}*/

.innerList{
    padding-right: 5px;
}

#wood_category{
    /* max-height: 80vh; */
    /* overflow: hidden; */
    /* overflow-y: auto; */
    background-color: #ECECEC;
    border-radius: 20px;
    /* padding: 10px; */
    /* margin: 10px; */
}

.mainLinkItem.active{
    background-color: #F08F00;
}

.resMenuHasChildTitle::after,.resHasChild .resMenuProductTitle::after{
    content: "\f107";
    font-family: FontAwesome;
    height: 100%;
    font-size: 16px;
    font-weight: bold;
    display: flex;
    align-items: center;
    position: absolute;
    top: 0;
    left: 8%;
}

.resMenuHasChildTitle::after{
    content: "\f104";
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.resMenuHasChildTitle.opened::after{
    -webkit-transform: rotateZ(-90deg);
    -moz-transform: rotateZ(-90deg);
    -ms-transform: rotateZ(-90deg);
    -o-transform: rotateZ(-90deg);
    transform: rotateZ(-90deg);
}

.sidenav .resMenuProductCol a{
    font-size: 12px;
}

#res_product_list_link ul{
    display: none;
    background-color: #99999970;
}
.resHasChilds ul{
    display: none;
    background-color: #99999970;
}

.sidenav .resMenuProductCol ul a{
    padding-left: 30px;
}

.basketLink span{
    position: relative;
    font-size: 13px;
}

.basketLink span::before{
    content: "\f07a";
    font-family: FontAwesome;
    font-size: 16px;
    color: #4D4D4D;
    position: absolute;
    padding: 0 5px;
    left: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    font-weight: bold;
}

#product_color{
    display: none;
}

.profileMenu img{
    width: 35px;
    height: 35px;
    object-fit: contain;
    border-radius: 5px;
    max-height: 100%;
}

.profileMenu{
    padding: 5px;
    max-height: 100%;
    display: flex;
    align-items: center;
}

.profileMenuUserName,.resProfileMenuUserName{
    font-size: 13px;
    font-weight: bold;
}

.profileMenuUserName::after{
    content: "\f107";
    font-family: FontAwesome;
    position: absolute;
    font-size: 16px;
    font-weight: bold;
    right: 105%;
    top: 0;
    height: 100%;
    display: flex;
    align-items: center;
}

.profileMenu ul{
    top: 100%;
    right: 0;
    width: 100%;
    border: 1px solid #999;
    border-radius: 0px 0px 10px 10px;
    box-shadow: 0px 5px 3px #999 inset;
    display: none;
}

.profileMenu ul li{
    padding: 5px;
}

.profileMenu ul li a{
    font-size: 13px;
    font-weight: bold;
    text-align: center;
    color: #4D4D4D;
    line-height: 25px;
}

.has_child:hover ul{
    display: block;
}

.chatra_menu #exit.show,.chatra_menu .profile.show{
    display: block !important;
}

.reProfileMenuWrap,.sidenav .chatra_menu > li{
    padding: 0 5px;
}

.reProfileMenuWrap > div{
    border-bottom: 1px solid #603813;
}

.searchResultWrap{
    display: none;
}

.searchResultLabel{
    font-size: 15px;
}

.searchResultText{
    font-size: 14px;
}

.productCodeTitle,.productCode{
    font-size: 15px;
}

.resProfileMenuUserName{
    padding: 10px 0;
}

.owlProduct .productItemTitle{
    display: -webkit-box;
    height: 46px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.625;
    font-size: 15px;
    direction: rtl;
}

.uploadFileAdder .fileAdder{
    position: relative;
    width: 100% !important;
    max-width: unset;
    font-size: 13px !important;
    height: 100%;
    padding: 10px 30px !important;
}

.uploadFileAdder .fileAdder:hover{
    cursor: pointer;
}

.uploadFileAdder .fileAdder::after{
    content: '+';
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
}

#tape_size,#unit_type{
    width: 250px;
    max-width: 100%;
    font-size: 14px;
    color: #000;
    font-weight: bold;
}

.resMainTitle{
    font-size: 16px;
    color: #5c3411;
}

.inputTd{
    vertical-align: middle !important;
    valign:middle
}

.blogDetailsTitle{
    color: #000;
}

.contacts_info{
    padding-top: 10px;
}

.contacts_info img{
    width: 25px;
    max-width: 25px;
    flex: 25px;
}

.contacts_info span{
    flex: auto;
    padding: 0 5px;
}

.inventoryStatus{
    border-radius: 20px;
    padding: 5px;
    text-align: center;
    font-size: 14px;
    background-color: red;
    position: absolute;
    top: -10px;
    right: -5px;
    z-index: 100;
}

#add_cut_order{
    min-width: 150px;
}

#order_tbl th:not(:first-child):not(.DesColumn){
    width: auto;
}

#order_tbl th.DesColumn{
    width: 220px;
    max-width: 220px;
}

#order_tbl th:first-child, #order_tbl td:first-child{
    width: 50px;
    max-width: 50px;
}

#order_tbl td:first-child{
    vertical-align: middle;
}

.p_description{
    height: 100px;
    border-radius: 10px;
    font-size: 13px;
}

.excelLink > *{
    font-size: 13px;
}

.listDots{
    list-style: disc;
    padding-right: 10px;
}

.aboutUsTitle{
    margin-top: 55px;
}

.uploadFileParent .isFile{
    background-color:#ffa513a8 !important;
}