.header.py-md-5{padding-bottom: 0 !important;}
.breadcrumb-item + .breadcrumb-item::before {  float: right;  padding-left: 5px;  padding-right: 0;  }
.line-title{width: 65px;height: 6px;background-color: rgba(255,255,255,.4);}
.style-hr-title{width: 40px;  border-top: 2px solid #000;  opacity: .2;}
.card-mid{bottom: 50px}
.form-switch {padding-left: 0;  padding-right: 3.5em;  }
.form-check .form-check-input {  float: right;}
.form-switch .form-check-input{height: 1.7em;margin-left: 0;}
.form-switch .form-check-input {  width: 3em;margin-left: 1em;  margin-right: -3em;}
.form-select {background-position: left 0.75rem center;padding: 10px 15px;color: #bbb}
.form-search .btn-search {  z-index: 10;  }
.form-search .form-control{padding: 10px;}
.form-search .input-group .form-control::placeholder{color: #c8ced3}
.label-select-search{position: absolute;  background: #fff;  right: 35px;  top: -18px;  padding: 1px 5px;}
.sort .btn-active,.sort .btn-light:hover{background-color: #e1f8fe !important;border-color: #e1f8fe !important;color: #096a83 !important;}
.sort .btn-light:after{  content: "";  background: url("../img/icon/arrow-down.jpg") no-repeat;
    background-size: 100%;
    width: 34px;
    height: 20px;
    position: absolute;
    top: 34px;
    left: 0;right: 0;margin: auto;
    opacity: 0;
}
.sort .btn-light.btn-active:after{opacity: 1}
.number-pro{background-color: #f5f4fc !important;color: #8276db !important;transition: .5s;border-radius: 20px;padding:2px 10px}
.brand-items img{opacity: 1;transition: .5s}
.title-brand{font-size: 18px;font-weight: 600}
.brand-items .card:hover{box-shadow: 0 .5rem 1rem rgba(0,0,0,.1) ;transition: .5s}
.brand-items .card:hover img{opacity: .2}
.brand-items .card:hover .number-pro{background-color: #ffe0e8 !important;color: #e96083 !important;}
hr.style-four {width: 80%;
    height: 40px;
    border: 0;
    box-shadow: inset 0 40px 40px -40px rgba(0 ,0 ,0 , .3);
}
.category-span{background-color: #fdf3f1;color: #fb7046;}
.category-box .icon-box{width: 100px}
.carousel-control-next, .carousel-control-prev {width: 10%;}
.articles.articles-p .card .time-icon{filter: brightness(0) invert(.5);}
.articles.articles-p .card .date {
    border-top: 1px solid rgba(0,0,0,.2);
    border-bottom: 1px solid rgba(0,0,0,.2);
}
.share .icon{width:44px;height:44px;background-color: #f4f3fb;transition:.5s;border-radius:30px;font-size: 1.5rem;color: #9086cf;margin:0 5px}
.share.pro-share .icon{background-color: #3f3f3f;margin-bottom: 5px}
.share.pro-share .icon img,.share.pro-share .icon i{filter:brightness(0) invert(1);opacity: .5;;transition:.5s;}
.share .icon:hover{background: #2354bd;color: #ffffff;}
.share .icon:hover img,.share .icon:hover i{ filter:brightness(0) invert(1);opacity: 1}

.box-membership{background-color: #f5f4fc;border-radius: 60px;color: #9188cb;font-size: 20px;}

.box-membership input::placeholder{color: #9188cb !important;opacity: 1}
.box-membership img{box-shadow: 0 1rem 1rem rgba(73,54,196,.25) !important;}
.box-question-search{border-radius: 50px}
.box-question-search .form-control{background-color: #f5f6fa;}
.box-question-search .btn-question{border-radius: 50px;background: linear-gradient(111deg, rgba(254,146,151,1) 0%, rgba(250,206,195,1) 100%);}
.card-question{bottom: 75px}
.btn-success-2{background-color: #67b930 !important;font-size: 16px;padding: 12px}
.accordion-button::after{margin-right: auto;margin-left: 0}
.accordion-flush .accordion-item .accordion-button,.accordion-flush .accordion-item .accordion-button.collapsed{border-radius: 15px;padding:30px 50px;}
.accordion-flush .accordion-item .accordion-button.collapsed{background: #f8f9fb;color: #373b3e}
.accordion-flush .accordion-item .accordion-button{background: #2354bd;color: #cfa968;border-radius: 15px 15px 0 0;box-shadow: none}
.accordion-flush .accordion-item .accordion-button::after{filter: brightness(0) invert(.5);}
.accordion-body{background: #2354bd;color: #ffffff;border-radius:  0 0 15px 15px}
.form-question input.form-control,.form-register input.form-control{padding: 12px}
.question-page h5{font-size: 1rem}
.form-control{padding: .75rem 1rem;font-size: .9rem}
.title-card{line-height: 1.6;font-size: 1.3rem}
.job h3{font-size: 1.2rem}
.job .share i {  background-color: #ffffff;  color: #b3b9c5;  }
.job .bg-light-purple{font-size: 14px}
.job .alert-danger{background: #fef3f1}
.job .alert-danger .fa{background: #ff8a67}
.title-filter-box{top: -11px}
.icons-more{right: -25px}
.select-card{border: 4px dashed #ccc;}
.product-detail h1{font-size: 1.8rem}
.description #more {display: none;}
.product-detail .des-icon{line-height: 1;}
.product-detail .select-size{width: 25%}
.product-detail .nav-pills .nav-link.active{border-radius: 30px;background-color: #263a96;padding:5px 25px;box-shadow:0 0rem 1rem rgba(24,76,222,.3) }
.table-light{--bs-table-bg: #f9fafe;}
.table-striped > tbody > tr:nth-of-type(2n+1) > *{--bs-table-accent-bg: #f5f6fa}
.comments-box .stars i{font-size: 1.2rem}
.btn-light-blue{background: #e4f8ff;color: #3d8da6}
.compare-content .table-striped.table-warning > tbody > tr:nth-of-type(2n+1) > * {
    --bs-table-accent-bg: #fff3cd;
}
.compare-content .table-striped > tbody > tr:nth-of-type(2n) > * {
    --bs-table-accent-bg: #fff;
}
.compare-content .owl-carousel .owl-nav button.owl-prev{right: -20px;top: 20%;}
.compare-content .owl-carousel .owl-nav button.owl-next{left: -20px;top: 20%;}
.compare-content .title-box{height:70px;}
.compare-content .title-box .title{line-height: 2rem}
.compare-content .titr-table{margin-top: 414px}
.page-item:first-child .page-link,.page-item:last-child .page-link,.page-link{border-radius:50px;margin: 0 5px !important;padding-top: 0;padding-bottom: 0}
.margin-header{margin-top: 175px}
.el-input__inner{border-radius: 50px;height: 46px;direction: rtl;}
.el-checkbox__input.is-checked + .el-checkbox__label{color: #333}
.el-checkbox__inner{width: 18px;height:18px;border-radius: 4px}
.el-checkbox__inner::after{width: 5px;height: 10px}
.py-danger-header{padding-top:2.5rem;padding-bottom: 2.5rem }
.table-warning > :not(caption) > * > *{border-bottom-color: var(--bs-table-bg);}
.back-complete{background: url("../img/back-complete.jpg") no-repeat;  background-size: 100% 100%;}
.back-complete .card img.img-card{border-radius: 38px;border-bottom: 10px solid rgba(255,255,255,.2)}
.back-complete .card .title {  font-size: 1.2rem; line-height:2 }
.back-complete .card .bg-dark-opacity{background:rgb(21,23,46);}
.back-complete .card .star-icon {  width: 20px;  }
.back-complete .card .text-success{font-size: 1.2rem}
.back-complete .card .icons-more{right: 80%;top:40px;width: 40px}
.back-complete .owl-theme .owl-nav {  position: absolute;  margin-top: 0;  left: 50px;  top: -46px;  }
.back-complete .owl-carousel .owl-nav button.owl-prev {  right: -95px;  }
.back-complete .owl-carousel .owl-nav button.owl-next{left: -45px;}
.back-complete .owl-carousel .owl-nav button.owl-next,.owl-carousel .owl-nav button.owl-prev {
    /*background: #ffff !important;  */
    color: #9087ce;  border-radius: 30px;  width:62px;  }
.back-complete .show-all{border: 1px solid rgba(255,255,255,.1);border-radius: 20px;width: 280px;color:#868ac3 }
@media (min-width: 1201px) {
    .col-xl-20 {  width: 20% !important;  }
}
@media (max-width: 1399px) {
    .compare-content .titr-table {
        margin-top: 375px;
    }
    .compare-content .table .label-w.w-50{width: 57% !important;font-size: 13px}
}
@media (max-width: 1366px) {
    .margin-header{margin-top: 165px}
    .sort .btn-light::after{top: 30px;}
    .title-brand {  font-size: 16px;}
    .label-select-search{top:-14px}
    .back-complete .card .title {  font-size: 1rem;}
    .back-complete .owl-theme .owl-nav {top: -42px;}
}
@media (max-width: 1200px) {
    .box-form-login{top: 35%;}
    .back-complete .owl-theme .owl-nav {  top: -40px;  }
}
@media (max-width: 1024px) {
    .box-form-login{top:25%;}
    .job h3{font-size: 1rem}
    .box-membership{font-size: 16px}
    .margin-header{margin-top: 160px}
    .label-select-search{top:-12px}
    .back-complete .owl-theme .owl-nav {  top: -37px;  }
}
@media (max-width: 992px) {
    .box-form-login{top:10%;}
    .icons-more{right: 5px}
}
@media (max-width: 600px) {
    .xzoom-gallery, .xzoom-gallery2, .xzoom-gallery3, .xzoom-gallery4, .xzoom-gallery5,.more-btn img{width: 80px;}
    .product-detail .select-size{width: 35%}
    .product-detail h1 {  font-size: 1.5rem;  }
    .back-complete .owl-theme .owl-nav {  top: -41px;  }
    .back-complete .show-all {width: 250px}
    .back-complete .owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev{width: 60px;}
    .back-complete .card .title {  font-size: .9rem;  }
}
@media (max-width: 480px) {
    .line-title {width: 45px;}
    .title-brand {  font-size: 15px;}
    .product-p .card h3.title-product{ font-size: 15px;}
    .icons-more{right: 20px}
    .icons-more img{width: 35px;}
    .xzoom-gallery, .xzoom-gallery2, .xzoom-gallery3, .xzoom-gallery4, .xzoom-gallery5,.more-btn img{width: 70px;}
    .product-detail .select-size{width: 50%}
    .back-complete .show-all {  width: 220px;  }
    .back-complete .owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev {  width: 55px;  }
    .back-complete .owl-carousel .owl-nav button.owl-prev {  right: -82px;  }
    .back-complete .owl-theme .owl-nav {  top: -39px;  }
    .number-pro {padding: 2px 5px;}
    .brand-items {font-size: 10px}
    .label-select-search {
        top: -14px;
    }
    .el-checkbox__label{font-size: 9px}
}
@media (max-width: 428px) {
    .product-p .card h3.title-product{ font-size: 12px;}
    .xzoom-gallery, .xzoom-gallery2, .xzoom-gallery3, .xzoom-gallery4, .xzoom-gallery5,.more-btn img{width: 65px;}
    .product-detail h1 {  font-size: 1.2rem;  }
    .compare-content .table .label-w.w-50{width: 65% !important;}
    .back-complete .card .title {  font-size: .8rem;  }
}
@media (max-width: 375px) {
    .back-complete .show-all {  width: 200px;  }
    .back-complete .owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev {
        width: 50px;
    }
    .back-complete .owl-carousel .owl-nav button.owl-prev {
        right: -70px;
    }
}
@media (max-width:320px) {
    .brand-items {font-size: 8px}
}
