.main {
    display: flex
}

.rt-box {
    flex: 0 0 auto;
    width: 280px;
    padding-left: 50px;
    margin-left: auto
}

.rt-row {
    margin-bottom: 35px
}

.rt-row h3 {
    text-transform: uppercase;
    font-size: 1.5rem;
    position: relative;
    border-bottom: 1px solid #F1F1F1;
    padding-bottom: 14px;
    margin-bottom: 16px
}

.rt-row h3::after {
    content: "";
    display: block;
    position: absolute;
    bottom: -1px;
    left: 0px;
    height: 1px;
    background: #646464;
    width: 50px
}

.rt-row-1 {
    display: flex
}

.rt-row-1 input {
    background: #f7f7f7;
    padding: 0px 14px;
    height: 52px;
    font-size: 1rem;
    border: 0px;
    outline: 0;
    width: 100%;
    color: #666
}

.rt-row-1 input::placeholder {
    color: #848484
}

.rt-row-1 button {
    background: #f7f7f7;
    border: 0px;
    outline: 0;
    width: 52px;
    flex: 0 0 auto
}

.rt-row-1 button:hover,
.rt-row-1 input:focus,
.rt-row-1 input:hover {
    background: #EEEEEE
}

.rt-row-2 a {
    transition: all .3s;
    position: relative;
    box-sizing: border-box;
    border: 1px solid #d5d5d5;
    margin-bottom: 10px;
    border-radius: 0 7px 0 0
}

.rt-row-2 a::after {
    transition: all .3s;
    content: "";
    display: block;
    position: absolute;
    height: 6px;
    width: 6px;
    background: grey;
    transform: translateY(-50%) rotate(45deg);
    transform-origin: center;
    top: 50%;
    left: 12px
}

.rt-row-2 a {
    font-size: .9375rem;
    color: #6f6f6f;
    transition: all .3s;
    padding: 10px 30px;
    display: block
}

.rt-row-2 li ul {
    display: none
}

.rt-row-2 li ul a {
    border: 0px;
    border-radius: 0
}

.rt-row-2 li ul a::after {
    display: none
}

.rt-row-2 li:hover a,
.rt-row-2 li:hover ul a:hover {
    color: #FFF
}

.rt-row-2 li:hover a::after {
    background: #FFF
}

.rt-row-2 li:hover ul {
    display: block
}

.rt-row-2 li:hover ul a {
    background: #FFF;
    color: grey
}

.rt-row-3 li {
    display: flex;
    margin-bottom: 30px;
    align-items: center
}

.rt-row-3 li>div {
    flex: 1;
}

.rt-row-3 img {
    width: 100px;
    height: 100px;
    object-fit: cover;
    margin-right: 14px;
    flex: 0 0 auto
}

.rt-row-3 a {
    font-size: 1rem;
    color: #070707;
    line-height: 20px
}

.rt-row-3 p {
    color: #6f6f6f;
    font-size: .8125rem;
    margin-top: 10px
}

.rt-row-4 ul {
    display: flex;
    flex-wrap: wrap
}

.rt-row-4 li {
    position: relative;
    width: 85px;
    height: 85px;
    border: 1px solid #ececec;
    box-sizing: border-box;
    margin-bottom: 8px;
    margin-right: 8px
}

.rt-row-4 img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.rt-row-4 a {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: #464646;
    opacity: 0
}

.rt-row-4 i {
    color: #FFF;
    font-size: 1.5rem
}

.rt-row-4 li:hover a {
    opacity: .7
}

.rt-row-5 ul {
    display: flex;
    flex-wrap: wrap;
    white-space: nowrap
}

.rt-row-5 li {
    margin-right: 12px;
    margin-bottom: 18px;
    border: 1px solid #ececec;
    transition: all .3s;
    background: #ececec
}

.rt-row-5 li:hover {
    background: #FFF
}

.rt-row-5 a {
    display: block;
    padding: 0px 15px;
    line-height: 38px;
    font-size: .8125rem;
    color: #646464
}

.rt-row-6 ul {
    display: flex;
    flex-wrap: wrap
}

.rt-row-6 li {
    display: flex;
    height: 35px;
    width: 35px;
    text-align: center;
    border-radius: 2px;
    align-items: center;
    justify-content: center;
    background: #1882d6;
    margin-right: 10px;
    margin-bottom: 10px
}

.rt-row-6 li a {
    display: block
}

.rt-row-6 i {
    color: #FFF;
    font-size: 1.25rem
}

.rt-row-6 li:nth-child(2) {
    background: #20c1f5
}

.rt-row-6 li:nth-child(3) {
    background: #ec594f
}

.rt-row-6 li:nth-child(4) {
    background: #2c3f50
}

.rt-row-6 li:nth-child(5) {
    background: #436990
}

.rt-row-6 li:nth-child(6) {
    background: #eb5d8b
}


.common-page {
    display: flex;
    flex-wrap: wrap;
    justify-content: center
}


.common-page li {
    min-width: 45px;
    height: 45px;
    padding: 0px 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #FFFFFF;
    border: 1px solid #E0E0E0;
    margin: 5px;
    transition: all .1s linear
}


.common-page li.active {
    background: var(--color);
    border-color: var(--color);
    
}
.common-page li.active a {
    color: #FFFFFF
}
.common-page li a {
    width: 100%;
    height: 100%;
    line-height: 45px;
    text-align: center;
}

.common-page li:hover {
    border-color: var(--color);
    cursor: pointer;
}

.aboutus h3 {
    font-size: 1.5625rem;
    border-bottom: 1px dashed #d9d9d9;
    padding-bottom: 15px;
    margin-bottom: 25px
}

.aboutus p {
    margin-bottom: 25px;
    line-height: 25px;
    color: #4f4f4f;
    font-size: .9375rem
}

@media screen and (max-width:960px) {
    .main {
        flex-direction: column-reverse
    }

    .rt-box {
        width: 100%;
        padding: 0px
    }

    .rt-row {
        margin-bottom: 20px
    }
}

.description::after,
.morelink a,
.news-more a,
.pro_lb .readmore::before,
.rt-row-2 li:hover a,
.rt-row-2 li:hover ul a:hover {
    background: var(--color)
}

.nav a:hover {
    color: #FFF
}

.product-tags p.active,
.product-tags p:hover,
.rt-row-1 button,
.rt-row-3 a:hover {
    color: var(--color)
}

.pro_lb .readmore:hover i {
    background: var(--color)
}

.inner-banner {
    max-width: 100%;
    display: block
}

.p-hottags,
.prenext-products {
    max-width: 1200px;
    margin: 30px auto;
    padding: 0px 15px;
    color: #666666;
    line-height: 1.8;
    font-size: 14px
}

.feedbackForm #msg,
.feedbackForm .fput,
.feedbackForm .ftxt {
    max-width: none;
    padding: 0px;
    margin: auto;
    border: 0px;
    height: auto;
    font-size: auto;
    line-height: 1.5;
    font-family: Arial;
    color: #333333;
    background: 0 0;
    text-align: left
}

.feedbackForm {
    margin-bottom: 3.25rem;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px
}

.feed-title {
    font-size: 1.875rem;
    color: #2c2c2c;
    margin-top: 2.5rem;
    margin-bottom: 1.25rem;
    font-weight: 600;
    text-transform: uppercase
}

.lable {
    white-space: nowrap
}

.sidebar-item * {
    box-sizing: border-box
}

.sidebar-item {
    box-sizing: border-box;
    width: 100%;
    position: relative
}

.sidebar-item.sidebar-search {
    background: #f7f7f7;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: none;
    padding: 20px 14px
}

.email-subscription {
    display: flex;
    flex-direction: column;
    width: 100%
}

.email-subscription input {
    width: 100%;
    outline: 0;
    border: 1px solid #CCCCCC;
    height: 40px;
    border-radius: 0;
    padding: 0 10px;
    transition: all .1s linear
}

.email-subscription button {
    margin-top: 10px;
    width: 100%;
    height: 40px;
    background: var(--color);
    color: #FFFFFF;
    border: none;
    border-radius: 0;
    cursor: pointer;
    transition: all .1s linear
}

.company-intro {
    border: none
}

.company-intro p {
    padding: 10px 14px 15px;
    border: 1px solid #d5d5d5;
    font-size: 13px;
    color: #8c8c8c
}

.sidebar-item .sidebar-list .item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1em
}

.sidebar-item .sidebar-list .item:last-child {
    margin-bottom: 0em
}

.sidebar-item .sidebar-list .item:hover .img img {
    transform: scale(1.02)
}

.sidebar-item .sidebar-list .item:hover .info .title {
    color: var(--color)
}

.sidebar-item .sidebar-list .item .img {
    width: 100px;
    height: 80px;
    background: #FFFFFF;
    border: 1px solid #d5d5d5;
    border-radius: 3px;
    overflow: hidden
}

.sidebar-item .sidebar-list .item .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all .1s linear
}

.sidebar-item .sidebar-list .item .info {
    flex: 1;
    padding-left: 15px
}

.sidebar-item .sidebar-list .item .info .title {
    font-size: 15px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    line-height: 1.2;
    transition: all .1s linear
}

.sidebar-item .sidebar-list .item .info .more {
    margin-top: 4px;
    text-transform: capitalize;
    color: var(--color);
    font-size: 14px
}

.blogflex {
    display: flex;
    align-items: flex-start;
    padding: 20px 12px;
    border: none;
    background: #f7f7f7
}

.blogflex .blogflex-img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: 1px solid #EEEEEE;
    overflow: hidden
}

.blogflex .blogflex-img img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.blogflex .blogflex-info {
    flex: 1;
    padding-left: 10px
}

.blogflex .blogflex-info .blogflex-name {
    font-size: 17px;
    line-height: 1.4;
    font-weight: 700
}

.blogflex .blogflex-info .blogflex-content {
    font-size: 13px;
    line-height: 1.4;
    color: #8c8c8c;
    margin-top: 5px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 30;
    overflow: hidden
}