html{overflow-x: hidden !important;}
body{
    font-family: 'IRANSansXFaNum';
    font-size: 13pt;
    font-weight: 400;
    color: #2d2d2d;
    direction: rtl;
    margin: 0 auto !important;
    display: block;
    width: 100%;
    overflow-x: hidden !important;
    line-height: normal;
}

.container{
    direction: rtl;
    padding-left: 0;
    padding-right: 0;
}

@media (min-width: 576px) {
    .container-sm, .container {
      max-width: 540px;
    }
  }
@media (min-width: 768px) {
    .container-md, .container-sm, .container {
        max-width: 700px;
    }
}
@media (min-width: 992px) {
    .container-lg, .container-md, .container-sm, .container {
        max-width: 940px;
    }
}
@media (min-width: 1200px) {
    .container-xl, .container-lg, .container-md, .container-sm, .container {
        max-width: 1140px;
    }
}
@media (min-width: 1400px) {
    .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
        max-width: 1280px;
    }
}

li{list-style: none;padding: 0;}
ul{padding: 0;margin: 0;}
a,a:hover{text-decoration: none;color: inherit;outline: none;}
*,*::after,*::before{transition: all 0.3s ease-in-out;outline: none;}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

p{
    font-weight: normal;
}
header{
    background-color: white;
    color: black;
}
.header{
    padding: 0;
    position: relative;
    font-size: 12pt;
    z-index: 900;
}

.topVideoSlider{
    background: black;
    
}
.topVideoSlider video{
    height: auto;
    min-width: 700px;
}
.textBox .title{
    font-size: 14pt;
    font-weight: 600;
    color: #f7a349;
    padding: 30px 0;
}
.textBox p{
    text-align: justify;
    font-weight: 200;
}
.welcomeImage{
    display: flex;
    justify-content: center;
    align-items: center;
}
.welcomeImage img{
    width: 100%;
    height: auto;
}
.bgLightGray{background: #474747;}
.bgDarkGray{background: #252525;}
.bgDarker{background: #1e1e1e;}

.clear45px{width: 100%;height: 45px ;}
.clear25px{width: 100%;height: 25px ;}

.row.specialPost> *{
    padding: 0;
}
.specialPost{min-height: 50px;}
.specialPost figure{
    position: relative;
    overflow: hidden;
}
@keyframes _spPostAnim {
    from {margin-top:100%;}
    to {margin-top: 50%;}
}
.specialPost figure figcaption{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    text-align: center;
    height: max-content;
    font-size: 14pt;
    width: 100%;
    height: 100%;
    background: #f7a34938;
    text-align: center;
    display: none;
}
.specialPost figure figcaption > *{
    width: 90%;
    background: transparent;
    margin: 50% auto;
    transform: translateY(-100%);
    color: white;
    animation: _spPostAnim 0.5s linear;

}

.specialPost figure:hover figcaption{
    display: block;
}

.color-yellow{color: #f7a349 !important;}

h1{font-size: 19pt;font-weight: 900;}
h2{font-size: 16pt;font-weight: 700;}
h3{font-size: 14pt;font-weight: 500;}
h4{font-size: 12.5pt;font-weight: 400;}
h5{font-size: 11pt;font-weight: 200;}
h6{font-size: 9pt;font-weight: 100;}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6,p{margin: 0;}

.fixedImage{
    z-index: -1;
    padding: 0;
    position: fixed;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    height: 100%;
}

.fixedImage .imageContainer{
    background: url(../img/fixedImage.jpg) repeat;
    background-position: center;
    height: 100%;
}
.fixedImagePosition{
    height: 300px;
    background: transparent;
}
.centeredUL ul{
    transform:translateX(calc(-50% + 40px));
    padding: 0;
}
.centeredUL li{
    margin: 5px 0;
    font-weight: 200;
}
.aboutBox {
    text-align: center;
    z-index: 10;
    position: relative;
    padding: 0;
    background: #f0f0f0;
}
.aboutBox .welcome{
    background: #fff;
    padding: 25px;
    line-height: 26pt;
    margin-top: -60px;
    color: #1d1d1d;
    text-align: right;
    height: max-content;
    box-shadow: 0 0 10px -2px #666;
}
.aboutBox .welcome h3{
    font-size: 23pt;
    color: #f7a349;
}

.aboutBox .services{
    padding: 60px 20px;
    text-align: right;
    padding-right: 80px;
    background: #f0f0f0;
    position: relative;
}
.aboutBox .services > hr{
    height: 0.5px;
    background: #f7a349;
    opacity: 1;
    position: absolute;
    top: 30px;
    width: 180px;
    right: -20px;
}
.aboutBox .services ul{
    line-height: 32pt;
    font-size: 12pt;
    font-weight: 300;
}
.aboutBox .services ul li{
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
}
.aboutBox .services ul li::before{
    content: '';
    border-bottom: 2px solid #000;
    width: 20px;
    height: 4px;
    display: block;
    margin-left: 10px;
}
.aboutBox .best-category > div{
    padding: 10px;
    padding-bottom: 15px;
}
.aboutBox .best-category img{
    max-width: 100%;
    width: 100%;
    height: auto;
}
.aboutBox .best-category a{
    background: #fff;
    display: flex;
    padding: 0;
    color: #000;
    overflow: hidden;
    height: 100%;
}
.aboutBox .best-category a:hover{
    box-shadow: 0 1px 3px #bbb;
}
.aboutBox .best-category a figure{
    width: 100%;
    margin: 0;
    padding: 0;
}
.aboutBox .best-category figcaption{
    width: 100%;
    padding: 10px;
    text-align: right;
}
.aboutBox .best-category h3{
    font-size: 12pt;
    padding: 10px 0;
}
.aboutBox .best-category p{
    font-size: 10pt;
    color: #474747;
}
.aboutBox .best-category a:hover img{
    transform: scale(1.05);
}
.aboutBox .welcomeBox{
    display: flex;
    flex-direction: column;
    justify-content: start;
    padding: 0;
    padding-left: 10px;
}

.portfolioBox .post{
    padding: 10px;
    padding-bottom: 20px;
}
.portfolioBox .post > hr{
    margin: 0;
    margin-top: 10px;
    border: none;
    background: none;
    opacity: 1;
    border-bottom: 2px solid #eee;
}
.portfolioBox .post > a{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    background: #f0f0f0;
    position: relative;
    overflow: hidden;
}
.portfolioBox .post > a .postDetails{
    background: #f0f0f0;
    z-index: 10;
}
.portfolioBox .post > a img{
    width: 100%;
}
.portfolioBox .post > a h2{
    font-size: 12pt;
    font-weight: 500;
    padding: 20px 10px 10px 10px;
}
.portfolioBox .post > a p{
    font-size: 10pt;
    font-weight: 400;
    padding: 0px 10px 10px 50px;
    color: #474747;
}
.portfolioBox .post > a i{
    position: absolute;
    left: 15px;
    bottom: 20px;
    font-size: 10pt;
}
.portfolioBox .post > a:hover{
    box-shadow: 0 1px 3px #bbb;
}
.portfolioBox .post > a:hover img{
    transform: scale(1.05);
}
.portfolioBox .post > a:hover ~ hr{
    border-bottom: 2px solid #f7a349;
}
.portfolioBox .post > a:hover h2{
    color: #f7a349;
}
.FAQ .title,
.feedback .title,
.trustedBrands .title{
    text-align: center;
    padding: 40px;
    font-size: 20pt;
    color: #f7a349;
    font-weight: 300;
}

.trustedBrands .trust{
    padding: 10px;
}
.trustedBrands .trust img{
    background: transparent;
    max-width: 100%;
}
.trustedBrands .brandsRow{
    border-top: 2px solid #eee;
    border-bottom: 2px solid #eee;
    padding: 20px 100px;
}
.feedback .content{
    position: relative;
    min-height: 260px;
}
.feedback .feedbackSlide{
    padding: 10px 100px;
    position: absolute;
    top: 0;
}
.feedback .feedbackSlide .comment .text{
    padding: 10px 0;
    margin: 0;
    height: 130px;
}
.feedback .feedbackSlide .author{
    padding: 10px 0;
    color: white;
    font-size: 16pt;
}
.feedback .feedbackSlide .subtitle{
    padding: 0;
}

.feedback .feedbackSlide img{
    display: block;
    margin: auto;
    outline: 6px solid #252525;
    max-width: 100%;
}

.FAQ .title{
    font-size: 22pt;
    font-weight: 600;
}

.FAQ .faqBox{
    padding: 0 50px;
    margin-bottom: 4px;
}
.FAQ .faqBox .question{
    padding: 5px 10px;
    background: #474747;
    cursor: pointer;
}
.FAQ .faqBox .question i{
    display: inline-block;
    height: 14pt;
    vertical-align: middle;
}

@keyframes _answerAnim {
    from {max-height: 0;}
    to {max-height: 1000px;}
}
.FAQ .faqBox .answer{
    display: none;
    padding: 5px 35px;
    height: max-content;
    max-height: max-content;
    animation: _answerAnim 0.5s linear;
}
.pbottomText{
    padding: 20px 200px;
    text-align: center;
}
.gotoOrderForm{
    width: 310px;
    height: 60px;
    font-size: 16pt;
    font-weight: 300;
    color: black !important;
    background: #f7a349;
    padding: 10px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 40px auto;
}

body > main,.single-main{
    padding: 20px 0px;
}
main a:hover,.breadcrumb a:hover{
    color:#f7a349;
}
.breadcrumb{
    font-size: 12pt;
    margin-bottom: 15px;
    padding: 10px;
    background: #eef1f4;
    border-radius: 0;
}
.breadcrumb p{
    font-weight: 400;
}

.btn{
    background: #f7a349;
    border-radius: 0px;
    color: #fff;
    text-align: center;
    padding: 10px;
    margin: 10px;
    border: none;
    font-weight: 500;
}
.btn:hover{
    background: #eef1f4;
    color: #f7a349;
}

.single-main .btn{
    font-size: 16pt;
    margin: 20px auto;
    padding: 10px 20px;
}
.archive-main .posts .post{
    position: relative;
    margin-bottom: 20px;
    overflow: hidden;
}
.archive-main .posts .post > *{
    border-radius: 0;
    background: #eef1f4;
    display: flex;
    flex-direction: column;
    padding: 10px;
    height: 100%;
    overflow: hidden;
}
.archive-main .post .post-thumbnail img{
    width: 100%;
    height: auto;
    max-width: 100%;
}
.archive-tutorials .posts .post:hover img{
    transform: scale(1.1);
}
.archive-tutorials .post .videoTime{
    position: absolute;
    top:10px;
    left: 25px;
}
.archive-main .post .title{
    font-size: 12pt;
    padding: 10px 0;
}
.archive-main .post .description{
    font-size: 11pt;
    font-weight: 300
}
.archive-tutorials .posts .post .content{
    background: #eef1f4;
    z-index: 1;
    position: relative;
    margin: -10px;
    padding: 10px;
}
.archive-tutorials .post .content .post-info{
    color: #000;
}
/*.archive-tutorials .post .content .post-icon{
    width: 16%;
}*/
.archive-tutorials .post .content .post-icon i{
    display: flex;
    background: #f7a349;
    float: left;
    margin: 10px 0;
    width: 50px;
    height: 50px;
    text-align: center;
    padding: 0;
    color: black;
    justify-content: center;
    align-items: center;
    font-size: 17pt;
}

@keyframes _postContentAnim{
    from {bottom: -25%;}
    to {bottom: 0;}
}
.archive-projects .post .content{
    color: white;
    position: absolute;
    bottom: 0;
    padding: 20px 10px;
    display: none;
    animation: _postContentAnim 0.5s linear;
}
.archive-projects .post:hover .content{
    display: block;
}
.pagination{
    padding: 30px;
}

.pagination .nav-links{
    width: max-content;
    margin: auto;
    display: flex;
    justify-content: space-around;
}

.pagination .nav-links .page-numbers{
    color: #5c5c5c;
    background: #eee;
    display: flex;
    width: 30px;
    height: 30px;
    justify-content: center;
    align-items: center;
    margin: 0 5px;
    border-radius: 10px;
}

.pagination .nav-links .next,.pagination .nav-links .prev{
    color: black;
    background: #dedede;
}
.pagination .nav-links .next i,.pagination .nav-links .prev i{
    display: flex;
}
.pagination .nav-links .current,.pagination .nav-links .page-numbers:not(.dots,.prev,.next):hover{
    background: #f7a349aa;
    font-weight: bold;
    color: #fff;
}
.pagination .nav-links .next:hover,.pagination .nav-links .prev:hover{
    color: #fff;
}
.pagination .screen-reader-text{
    display: none !important;
}

.formPage{
    margin: 0 auto;
    font-size: 11pt;
}
.formPage > form,
.formPage .successRegister{
    width: max-content;
    margin: auto;
    padding: 20px 10px;
    max-width: 600px;
    position: relative;
    border: 2px solid #eef1f4;
}
.formPage .title{
    font-size: 14pt;
    color: #000;
    font-weight: 500;
    text-align: center;
    margin-bottom: 20px;
}
.formPage input,.formPage textarea,.formPage select{
    width: 100%;
    border:none;
    background: #eef1f4;
    margin-bottom: 10px;
    padding:10px;
    font-size: 11pt;
    color: #000;
}
.formPage input::placeholder,.formPage textarea::placeholder{
    color: #444;
}
/*.formPage input:focus,.formPage textarea:focus{
    border-bottom: 3px solid #f7a349;
}*/
.formPage textarea{
    resize: none;
}
.formPage form .text{
    margin: 20px;
    font-size: 11pt;
}
.formPage form p{font-weight: 300;}

.formPage input[type=submit],.formPage button{
    width: max-content;
    display: block;
    padding: 8px 25px;
    color: #fff;
    background: #f7a349;
    margin: auto;
    border: none;
    font-size: 13pt;
    font-weight: 500;
}
.formPage input[type=submit]:hover,.formPage button:hover{
    color: #f7a349;
    background: #f7a34922;
}
.formPage .buttons{
    display: flex;
    justify-content: space-around;
}
.formPage button.next,
.formPage button.prev{
    width: 130px;
    margin: 10px 20px;
    padding: 5px 10px;
}

.formPage .buttons .checkbox{
    margin: 10px 20px;
    height: max-content;
}

.formPage button i{
    display: inline-block;
    height: 14pt;
    vertical-align: bottom;
}

.formPage .otherButton{
    display: flex;
    justify-content: space-between;
    background: transparent;
    padding: 5px 0;
    margin: 10px;
      margin-bottom: 10px;
    margin-bottom: 0;
    border-radius: 13px;
}
.formPage .otherButton > *{
    width: max-content;
    background: transparent;
    color: #f7a349;
    padding: 8px;
    border-radius: 13px;
}
.formPage .otherButton a{
    border-bottom: 1px solid #00b884;
    color: #00b884;
}
.formPage .otherButton a:hover{
    color: #f7a349;
    border-bottom: 1px solid #f7a349;
}
/*
.formPage input[type=submit]:hover,.formPage button:hover{
    background: white;
}
*/
.formPage .error{
    font-size: 10pt;
    margin-top: 10px;
    color: #d82a3a;
}
.formPage .success{
    font-size: 10pt;
    margin-top: 10px;
    color: #00b884;
}
.formPage .successRegister{
    text-align: center;
    width: 600px;
    padding: 40px 20px;
    max-width: 100%;
}
.formPage .successRegister .title{
    font-size: 20pt;
    color: #00b884;
}

.projectOrderPage form{
    width: 800px;
    max-width: 100%;
}

.checkbox{
    position: relative;
    width: 100%;
    float: right;
    padding: 0;
    margin: 5px 10px;
}
.checkbox input{
    visibility: hidden;
    width: 24px;
    height: 24px;
    position: absolute;
    top: 0;
    right: 0;
}
.checkbox label{
    width: max-content;
    margin-left: 10px;
    display: inline-block;
    margin-right: 30px;
    cursor: pointer;
}

.checkbox label::before{
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    width: 24px;
    height: 24px;
    background: #ddd;
    border-radius: 50%;
}
.cbxsqr label::before{
    border-radius: 0;
}

.checkbox input:checked ~ label::after{
    content: '';
    position: absolute;
    right: 4px;
    top: 4px;
    width: 16px;
    height: 16px;
    background: #f7a349;
    border-radius: 50%;
    border: none;
}
.cbxsqr input:checked ~ label::after{
    border-radius: 0;
}
.formPage .question{
    padding: 15px 10px;
    background: #474747;
}

.fluid{
    width: 100%;
}

.formPage .question .fluid > div:first-child{margin: 10px 0;}

.col .checkbox{
    margin: 10px auto;
    width: 100%;
}

.projectOrderPage form input[type=submit]{
    background: #00ffea;
}
.error404page {
    padding: 130px 20px;
    text-align: center;
    color: #f7a349;
}
.error404page h1{
    font-size: 112pt;
    font-family: tahoma;
    font-weight: 300;
}
.error404page h2{
    font-weight: 300;
}
.error404page .btn{
    width: max-content;
    display: block;
    padding: 5px 10px;
    border: 2px solid #f7a349;
    margin: 20px auto;
    background: transparent;
    color: #f7a349;
}
.error404page .btn i{
    height: 12pt;
    display: inline-block;
    vertical-align: sub;
}

.archive-podcast .post .title {
    font-weight: 400;
    color: white;
}
.archive-podcast .post .more {
    direction: ltr;
    color: #f7a349;
    position: absolute;
    left: 0;
    bottom: 0;
}

.archive-podcast .podcast{
    background:#252525;
    padding: 10px;
    margin: 0;
}

.archive-podcast .post .more i{
    width: 32px;
height: 32px;
display: inline-block;
text-align: center;
background: #f7a349;
color: black;
font-size: 14pt;
padding: 5px 0;
}

audio{
    background: #252525;
}


@keyframes _searchAnim {
    from {width: 160px;}
    to {width: 800px;}
}

.archive-search .post .content{
    width: 80%;
    background: #000000b2;
    top: 50%;
    left: 50%;
    position: absolute;
    transform: translateX(-50%) translateY(-50%);
    height: max-content;
}

.archive-search .post .title{
    font-size: 11pt;
    text-align: center;
    color: white;
    font-weight: 300;
    line-height: normal;
}
.archive-search .post a:hover .title{
    color: #f7a349;
}

.archive-search .post .postIcon{
    position: absolute;
    width: 32px;
    height: 32px;
    background: #f7a349;
    padding: 2px;
    text-align: center;
    bottom: 10px;
    left: 20px;
    color: black;
}
.archive-search .post .postIcon i{
    height: 14pt;
    display: inline-block;
    vertical-align: middle;
}

.border-top-gray{
    border-top: 1px solid #252525;
}

.single-projects .softwares .title{
    text-align: center;
    font-size: 38pt;
    color: white;
    line-height: normal;
    margin-bottom: 25px;
}

.single-projects .softwares > .row{
    justify-content: center;
    margin: 0;
    padding: 0 20px;
}

.single-projects .softwares > .row > *{
    padding: 0 5px;
    margin: 5px 0;
}
.single-projects .softwares > .row  figure{
    background: black;
    display: flex;
    padding: 0;
    justify-content: center;
    margin: 0;
    line-height: normal;
}
.single-projects .softwares img{
    max-width: 100%;
    height: auto;
}
.single-main .thumbnail-full img{
    max-width: 100%;
    height: auto;
}
.zindex10{z-index: 10;}

.single-main .videoContainer .videoList{
    width: 100%;
} 

.single-main .videoContainer .videoList li {
    width: 100%;
    background: #252525;
    margin: 5px auto;
    color: #f7a349;
    cursor: pointer;
    text-align: right;
    font-size: 11pt;
}
.single-main .videoContainer .videoList li:hover{
    padding-right: 10px;
}
.single-main .videoContainer .videoList i{
    width: 45px;
    height: 45px;
    display: inline-block;
    background: #fd0;
    color: black;
    text-align: center;
    vertical-align: middle;
    padding: 13px 0;
    margin-left: 20px;
}
.single-main .videoContainer video{
    max-height: 80vh;
}
.single-main .videoContainer figcaption{
    text-align: center;
}

.wp-block-image img {
    max-width: 100%;
    height: auto;
}



/**** STORE AND PRODUCTS ***/
.productChapter{
    margin-top: 20px;
    margin-bottom: 20px;
}
.productChapter:nth-child(odd){
    flex-direction: row;
}
.productChapter:nth-child(even){
    flex-direction: row-reverse;
}

.productChapter:nth-child(even) .chapterCover{
    margin-right: 0 !important;
}
.chapterInfo{
    padding: 0 10px;
    font-size: 12pt;
    font-weight: 300;
}
.chapterHeader{
    border-bottom: 1px solid #919191;
}
.chapterHeader::before{
    content: '\0041';
    font-family: 'mrzx store icon';
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    width: 50px;
    height: 50px;
    background: #fd0;
    margin: auto 0 auto 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 22pt;
    color: black;
}
.chapterTitle{
    color: #f7a349;
    padding: 0;
}
.chapterSubtitle{
    font-size: 13pt;
    padding: 10px 0;
    

}
.chapterListTitle{
    color: #f7a349;
    margin: 10px 0;
}
.chapterList{
    margin-bottom: 40px;
}
.chapterList li{
    padding: 5px 0;
    display: flex;
}
.chapterList li::before{
    content: '\0045';
    font-family: 'mrzx store icon';
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: flex;
    width: 35px;
    height: 35px;
    background: #949494;
    color: black;
    justify-content: center;
    align-items: center;
    transform: rotate(180deg);
    margin-left: 10px;
}

.chapterLevel::before,.chapterSpeed::before{
    content: '';
    font-family: 'mrzx store icon';
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: flex;
    width: 45px;
    height: 45px;
    background: transparent;
    color: #fd0;
    justify-content: center;
    align-items: center;
    margin-left: 12px;
    float: right;
    font-size: 38pt;
}
.chapterLevel::before{
    content:'\0058';
}
.chapterSpeed::before{
    content:'\0062';
}
.chapterLevel h4,.chapterSpeed h4{
    font-size: 15pt;
    font-weight: 400;
    color: #f7a349;
    padding: 0;
}
.chapterCover{
    display: flex;
    align-items: center;
}

.single-main .productStudentsWorks{
    padding: 40px 10px;
}
.single-main .productStudentsWorks .title{
    text-align: center;
    font-size: 22pt;
    color: white;
    line-height: normal;
    margin-bottom: 25px;
    color: #f7a349;
}

.single-main  .productStudentsWorks figure{
    position: relative;
    cursor: pointer;
}
.single-main  .productStudentsWorks figure figcaption{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    color: white;
    background: #9998;
    padding: 4px;
    font-size: 11pt;
    display: none;
}
.single-main  .productStudentsWorks figure:hover figcaption{
    display: block;
}
.single-main  .productStudentsWorks figure img{
    max-width: 100%;
}
.single-main  .productStudentsWorks figure:hover img{
    outline: 8px solid #5c5c5c;
}
.single-main .producAddtoCart .button{
    width: max-content;
    padding: 10px 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fd0;
    border: none;
    font-size: 16pt;
    color: black;
}
@keyframes _addTocartAnim {
    0%{box-shadow: 0 0 0 0px  #f7a349ff;}
    50%{box-shadow: 0 0 0px 20px  #f7a34900;}
    
}
.single-main .producAddtoCart .button:hover,
.single-main .producAddtoCart .button:active,
.thePulsBTN:hover,.thePulsBTN:active{
    animation: _addTocartAnim linear 0.5s;
    background: #eef1f4;
    color: #f7a349;
}
.single-main .producAddtoCart .button:active{
    background: #f7a349;
}
.single-main .producAddtoCart .button i{
    margin: 0 10px;
    display: flex;
}

.single-store .single-main{
    padding-bottom: 0;
}



/** captcha **/

.theCaptcha{
    align-items: center;
    padding: 5px 0;
    background: transparent;
    max-width: 100%;
    margin: 0px auto 10px auto;
    display: flex;
    justify-content: start;
    width: 540px;
}
.theCaptcha input{
    margin: 0;
}
.theCaptcha .captcha-refresh{
    font-size: 18pt;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 10px;
    cursor: pointer;
}
.theCaptcha .captcha-refresh:hover{
    color: #f7a349;
}
.theCaptcha .captcha-refresh i{
    display: flex;
}
.loginPage form{
    width: 560px;
    max-width:100%;
}
.projectOrderPage .theCaptcha input{
    background: #2f2f2f;
}


.theTable {
    background: #fff;
    padding: 10px;
    border-radius: 20px;
}
.theTable .tableHeader,.theTable .tableRow{
    display: flex;
    justify-content: center;
    text-align: center;
    justify-content: space-around;
    text-align: center;
}
.theTable .tableRow{
    background: #eef1f488;
    border-radius: 15px;
    margin: 5px 0;
}
.theTable .tableHeader{
    font-weight: bold;
    background: #f7a349;
    border-radius: 15px;
    margin: 10px 0 0 0;
    color: #fff;
 
}
.theTable .tableHeader span,.theTable .tableRow span{
    display: flex;
    justify-content: center;
    display: flex;
    justify-content: space-around;
    align-items: center;
    flex-direction: column;
    padding: 5px 0;
}

.siteScorePage .theTable .tableHeader span,.siteScorePage .theTable .tableRow span{
    width: 18%;
}
.siteScorePage .theTable .tableHeader span:first-child,.siteScorePage .theTable .tableRow span:first-child{
    width: 5%;
}

.siteScorePage form{
    padding: 10px;
    background: #fff;
    border-radius: 0;
    box-shadow: 0 0 10px 1px #999;
}
/*.theTable .tableRow span{
    border: 1px solid #ccc;
}*/
/* .theTable .tableHeader span:nth-child(1),.theTable .tableRow span:nth-child(1){

    flex: 0 0 5%;
}
.theTable .tableHeader span:nth-child(2),.theTable .tableRow span:nth-child(2){
    flex: 0 0 30%;
}

.theTable .tableHeader span:nth-child(3),.theTable .tableRow span:nth-child(3){
    flex: 0 0 15%;
} */
.theTable a{
    color: #0599f1;
    text-shadow: 0 0 3px #fff;
}
.color-red{
    color: #d82a3a !important;
}
.color-green{
    color:#00b884  !important;
}

.color-orange{color: #d8b800;}


.header .userBTN{
    position: relative;
}
@keyframes _profMenuAnim {
    from{max-height: 0;}
    to{max-height: 200px;}
    
}
.header .profileMenu{
    display: none;
    flex-direction: column;
    position: absolute;
    background: #fd0;
    padding: 0;
    width: 150px;
    left: 8px;
    text-align: right;
    margin-top: 5px;
    font-size: 11pt;
    animation: _profMenuAnim 0.5s linear;
    overflow: hidden;
}
.header .userBTN:hover .profileMenu{
    display: flex;
}
.header .userBTN::after{
    content: '';
    width: 150px;
    height: 15px;
    position: absolute;
    left: 8px;
    background: transparent;
    top: 16px;
    z-index: 0;
}
.header .profileMenu li{
    padding: 5px 8px;
    display: flex;
    justify-content: start;
    align-items: center;
}
.header .profileMenu li a{
    display: flex;
    justify-content: start;
    align-items: center;
    width: 100%;
}
.header .profileMenu li:hover{
    background: white;
}
.header .profileMenu li:last-child:hover{
    background: #d82a3a;
    color: white;
}
.header .profileMenu i{
    font-size: 7pt;
    padding: 0;
    margin: 0;
    height: auto;
    margin-left: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: transparent;
}

.thePopUp{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 1100;
}
.thePopUp i.icon-exit{
    width: 35px;
    height: 35px;
    background: #d82a3a;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 5px;
    cursor: pointer;
}

.thePopUp .theView {
    width: 800px;
    height: 600Px;
    background: transparent;
    max-width: 100vw;
    max-height: 100vh;
    position: relative;
    display: flex;
    flex-direction: column;
}
.thePopUp .theView .content{
    width: 100%;
    height: auto;
    max-height: calc(100% - 40px);
    overflow: hidden;
    display: flex;
    justify-content: center;
}
.thePopUp .theView .content img{
    max-width: 100%;
}

.post .content a,.theBlueLink{
    color: #f7a349;
}

.formPage form span.time{
    width: max-content;
    font-weight: 500;
    font-weight: 500;
    display: inline !important;
}
.formPage .resendCode{
    display: flex;
    justify-content: center;
    align-items: center;
}
.formPage .resendCode .resend{
    display: none;
}
.formPage .resendCode .resend:hover{
    color:#0599f1;
    cursor: pointer;
}

.formPage .theCodeNumbers{
    display: flex;
    justify-content: space-between;
    width: 70%;
    margin: 20px auto;
    direction: ltr !important;
}
.formPage .theCodeNumbers input{
    display: flex;
    text-align: center;
    width: 50px;
    height: 60px;
    padding: 5px;
    font-size: 18pt;
    font-weight: 600;
    color: #f7a349;
}
.theVideoFromScript{
    width: 1200px;
    display: block;
    margin: auto;
    max-width: 100%;
}

.single-main .post .content p{
    margin-bottom: 10px;
}


/*******************************************************
********************************************************
                NEWWWWWWWWWWWWW STYLE
********************************************************
*******************************************************/
input:not(input[type=submit]),textarea,select{
    background-color: #eff1f5;
    border: none;
    border-radius: 0px;
    padding: 10px;
}
input:not(input[type=submit]):focus,textarea:focus{
    background: #fff;
    box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.3);
}


.blockBanner .banner{
    padding: 10px;
    background: transparent;
}
.blockBanner .banner a{
    border-radius: 20px;
    overflow: hidden;
    display: block;
}
.blockBanner .banner img{
    width: 100%;
    height: auto;
}

.archive-store .productblock{
    padding: 5px 0;
}

.row.storeFilter{
    padding: 10px;
    margin: 20px 10px 0px 10px;
    background: #fff;
    border-radius: 20px;
    font-size: 12pt;
}
.row.storeFilter > div{
    display: flex;
    align-items: center;
    padding: 5px;
}
.row.storeFilter fieldset{
    margin-left: 30px;
}
.row.storeFilter > div .btn{
    width: 80%;
    margin: auto;
    margin-left: 0;
}
.row.storeFilter select{
    border:1px solid #eef1f4;
    background: #eef1f4;
    border-radius: 10px;
    padding: 5px;
}

.boxTitle{
    padding: 40px 20px;
    padding-bottom: 15px;
    width: 100%;
    text-align: center;
    color: #000;
    font-size: 24pt;
    font-weight: 700;
    position: relative;
}
.boxTitle hr{
    position: absolute;
    top: 42px;
    right: -60%;
    width: 100%;
    height: 1px;
    opacity: 1;
    background: #f7a349;
}
.boxSubtitle{
    padding: 0 10px;
    padding-bottom: 40px;
    text-align: center;
    color: #666;
    font-weight: 300;
}
.boxMore{
    display: flex;
    justify-content: center;
    margin-top: 25px;
}
.btnMore{
    color: #000 !important;
    border: 1px solid #474747 !important;
    padding: 10px 30px !important;
    position: relative !important;
    background: transparent !important;
}
.btnMore::before{
    content: '';
    background: #f7a349;
    width: 0;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    right:0;
}
.btnMore::after{
    content: '';
    background: #f7a349;
    width: 70px;
    height: 1px;
    display: block;
    position: absolute;
    top: 50%;
    right:-55px;
}
.btnMore span{
    z-index: 1 !important;
    position: relative !important;
}
.btnMore:hover::before{
    width: 100%;
}
.btnMore:hover{
    color: #fff !important;
    border: 1px solid #f7a349;
}

.contactUsBox .formPage{
    margin: 0;
}
.contactUsBox .formPage > form,.contactUsBox .formPage .successRegister{
    max-width: 100%;
    border: none;
}
.contactUsBox .formPage > form input:not(input[type=submit]),.contactUsBox .formPage > form textarea{
    background: transparent;
    border:1px solid #474747;
    color: #ccc;
}
.contactUsBox .formPage > form input:not(input[type=submit]):focus::placeholder,.contactUsBox .formPage > form textarea:focus::placeholder{
    color: #fff;
}
.contactUsBox .formPage > form input:not(input[type=submit]):focus,.contactUsBox .formPage > form textarea:focus{
    border-color: #fff;
}
.contactUsBox .mapBox img{
    width: 100%;
    height: auto;
    max-width: 100%;
    position: relative;
    display: block;
}
.contactUsBox .mapBox a{
    display: block;
    position: relative;
}
/* .contactUsBox .mapBox a::after{
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: #f7a34955;
} */
.contactUsBox{
    background: #1a1a1a;
    color: #b6b6b6;
}
.contactUsBox .boxTitle{
    color: #fff;
    position: relative;
}
.contactUsBox .boxTitle::after{
    content: '';
    width: 1000px;
    height: 1px;
    background: #f7a349;
    position: absolute;
    bottom: 0;
    right: -800px;
}
.contactUsBox .contactBox .address li{
    font-size: 11pt;
    line-height: 25pt;
}
.contactUsBox .contactBox .address i{
    margin-left: 10px;
    display: inline-flex;
    vertical-align: middle;
}
.contactUsBox .contactBox .description{
    font-size: 11pt;
}

.portfolioBox .portfolioTop{
    width: calc(100% + 30px);
    display: flex;
    justify-content: center;
    margin-left: -15px;
    margin-right: -15px;
    margin-top: -25px;
}
.portfolioBox .portfolioTop img{
    width: 100%;
    height: auto;
}

.ourTeam img{
    width: 60%;
    border-radius: 50%;
    border: 3px solid #eee;
    box-shadow: 0 0 6px #666;
}
.ourTeam{
    justify-content: center;
}
.ourTeam .teamUser{
    text-align: center;
}

.text-justify {
    text-align: justify;
}

.aLink{
    padding: 4px;
    border-radius: 5px;
    background: #3bf;
    color: #fff;
    text-shadow: 0 0 2px #000;
}
.aLink:hover{
    color: #3bf;
    background: #fff;
}