html, body{
    padding: 0px;
    margin: 0px;
    transition: .3s;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -o-transition: .3s;
    -ms-transition: .3s;
    animation: smoothFd1 .5s;
    -webkit-animation: smoothFd1 .5s;
    -moz-animation: smoothFd1 .5s;
    -o-animation: smoothFd1 .5s;
    -ms-animation: smoothFd1 .5s;
}

/* Home page */
header{
    width: 100%;
    height: 100vh;
    background-image: url('../../imgs/header1.jpg');
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    background-attachment: fixed;
    margin-top: -125px;
}
header .glass{
    width: 100%;
    height: calc(100vh - 0px);
    position: absolute;
    top: 0px;
    left: 0px;
    background-color: rgba(0,10,0,0.2);
    z-index: 100;
}
.header-inner{
    height: 100%;
    display: table;
    margin-left: auto;
    margin-right: auto;
}
.header-inner div{
    display: table-cell;
    vertical-align: middle;
    position: relative;
    text-align: center;
    z-index: 110;
}
.header-inner div .ttl1{
    color: #fff;
    font-weight: 100;
    font-size: 38px;
    margin-bottom: 30px;
}

.comps .inner div{
    margin-top: auto;
    margin-bottom: auto;
}
.comps{
    padding-top: 50px;
    padding-bottom: 50px;
}
.comp3 .inner{
    display: grid;
    grid-template-columns: 2fr 1.5fr;
    grid-gap: 30px;
}
.cont-img img{
    width: calc(100% - 10px);
}
.cont-txt p{
    text-align: justify;
}

.comp4{
    background-color: #242c2f;
}
.comp4 .inner{
    display: grid;
    grid-template-columns: 1.5fr 2fr;
    grid-gap: 30px;
}
.comp4 .cont-txt p{
    color: #aaa;
}

.comp3 .cont-img img{
    box-shadow: 0px 0px 0px 2px #fff, 10px 10px 10px 0px rgba(0,0,0,0.5), 15px 15px 0px 0px #3d4a50;
}
.comp4 .cont-img img{
    box-shadow:  0px 0px 0px 2px #242c2f, 5px 5px 10px 0px #242c2f, 15px 15px 0px 0px #47575c;
}

.comp5{
    background-color: #242c2f;
    background-image: url('../../imgs/rview.jpg');
    background-attachment: fixed;
}
.comp5 h2{
    color: #70be50;
}
.review-comp{
    display: grid;
    grid-template-columns: 150px 1fr;
    grid-gap: 30px;
    height: 350px;
}
.review-comp div{
    margin-top: auto;
    margin-bottom: auto;
}
.review-comp div:nth-child(1){
    width: 150px;
    height: 150px;
    border-radius: 100%;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    -o-border-radius: 100%;
    overflow: hidden;
    box-shadow: 0px 0px 0px 8px rgba(0,0,0,0.5);
}
.review-comp div:nth-child(1) img{
    min-width: 155px;
    min-height: 155px;
    max-width: 110%;
    margin-left: auto;
    margin-right: auto;
}
.review-comp div:nth-child(2){
    padding: 30px 50px;
    background-color: rgba(0,0,0,0.6);
    border-radius: 15px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    -o-border-radius: 15px;
}
.review-comp div:nth-child(2) p{
    color: #aaa;
    font-family: ltI;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: 0px;
}
.review-comp div:nth-child(2) span{
    color: #70be50;
    font-size: 22px;
    font-family: tom;
    text-transform: capitalize;
    float: right;
}
.review-comp div:nth-child(2) p::before, .review-comp div:nth-child(2) p::after{
    content: '';
    position: absolute;
    width: 50px;
    height: 50px;
    background-size: 100% auto;
    background-position: 0px -28px;
}
.review-comp div:nth-child(2) p::after{
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    margin-top: 10px;
    margin-left: 5px;
}

.review-comp div:nth-child(2) p::before{
    margin-left: -45px;
    margin-top: -45px;
}


/* ======== About Page ======== */
.about-comp3{
    background-image: url('../../imgs/abtbg1.jpg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
    padding-top: 50px;
    padding-bottom: 50px;
}
.about-comp3 .inner{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 10px;
}
.about-comp3 .inner div{
    margin-top: auto;
    margin-bottom: auto;
    text-align: center;
    padding: 15px;
}
.about-comp3 .inner div p{
    opacity: 0.9;
    color: #fff;
}
.about-comp3 .inner div p::after{
    content: '';
    position: relative;
    display: block;
    width: 60%;
    height: 2px;
    background-color: #70be50;
    margin-left: auto;
    margin-right: auto;
    margin-top: 30px;
    border-radius: 5px;
}
.about-comp3 .inner div h4{
    color: #70be50;
    font-size: 20px;
}



/* =========== Explore our tea ============= */
.explore-comp1{
    width: 100%;
    height: 100vh !important;
    max-height: 100vh !important;
    background-image: url('../../imgs/explore-bg.jpg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    margin-top: -125px;
    overflow: hidden;
    background-color: #ddd;
    background-attachment: fixed;
}
.explore-comp1 .glass{
    width: 100%;
    height: calc(100vh - 0px);
    position: absolute;
    top: 0px;
    left: 0px;
    background-color: rgba(0,10,0,0.4);
    z-index: 100;
}
.explore-comp1 h2, .explore-comp1 p{
    color: #fff !important;
    position: relative;
    z-index: 200;
}
.explore-comp1 .ttl1{
    font-weight: 100;
    font-size: 38px;
}
.explore-comp1 .body-top-padd{
    display: table;
    height: 100%;
    position: relative;
    margin-left: auto;
    margin-right: auto;
}
.explore-comp1 .body-top-padd div{
    display: table-cell;
    vertical-align: middle;
}

/* Single explore tea comp */
.explore-post-comp{
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 20px;
    margin-bottom: 15px;
    padding: 20px;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
    background-color: #fff;
    transition: .3s;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -o-transition: .3s;
}
.explore-post-comp:hover{
    box-shadow: 0px 5px 15px rgba(0,0,0,0.3);
}
.explore-post-comp:nth-child(2n){
    background-color: #242c2f;
}
.explore-post-comp:nth-child(2n) p{
    color: #aaa;
}
.explore-post-comp div{
    margin-top: auto;
    margin-bottom: auto;
}
.explore-post-comp div:nth-child(1) h2{
    color: #70be50;
}
.explore-post-comp div img{
    width: 100%;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -o-border-radius: 5px;
}
/* ecplore comp 2 */
.explore-comp2 .first-p{
    padding: 50px 100px;
    text-align: center;
}


/* =========== Blog posts ============= */
/* Top Blog Posts */
.recent-blogs{
    padding-top: 50px;
    padding-bottom: 50px;
    background-color: #f5f5f5;
    border-top: 1px solid #ddd;
}
.recent-blogs .inner{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 20px;
}
.recent-blogs .blog-post1{
    height: 450px;
    text-align: center;
    display: grid;
    grid-template-rows: auto 1fr auto;
    padding-bottom: 20px;
    box-shadow: 0px 0px 20px rgba(0,0,0,0.1);
    background-color: #fff;
    cursor: pointer;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -o-transition: .5s;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    overflow: hidden;
}
.recent-blogs .blog-post1 button{
    margin-left: auto;
    margin-right: auto;
    margin-top: -20px;
}
.recent-blogs .img-cont1{
    height: 200px;
    width: 100%;
    overflow: hidden;
}
.recent-blogs .inner div img{
    width: 100%;
    min-height: 200px;
    max-width: 110%;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -o-transition: .5s;
}
.blog-post1 .ttl3{
    padding-top: 0px;
    margin-top: 0px;
}
.recent-blogs .blog-post1 div:nth-child(2){
    padding: 20px;
}
.recent-blogs .blog-post1:hover img{
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
}
.recent-blogs .blog-post1:hover{
    box-shadow: 0px 0px 20px rgba(0,0,0,0.2);
}

/* ============== Tea And Health =============== */
.health-single-post{
    display: flex;
    flex: 2;
    margin: 90px 0px;
}
.health-single-post div{
    margin-top: auto;
    margin-bottom: auto;
}
.health-single-post .health-cont{
    width: 45%;
    padding: 30px;
}
.health-single-post .health-img{
    width: 55%;
}
.health-single-post:nth-child(2n+1) .health-img{
    order: 1;
}
.health-single-post:nth-child(2n+1) .health-cont{
    order: 2;
}
.health-single-post:nth-child(2n) .health-cont, .health-single-post:nth-child(2n+1) .health-img{
    animation: slideFLeft .8s;
    -webkit-animation: slideFLeft .8s;
    -moz-animation: slideFLeft .8s;
    -o-animation: slideFLeft .8s;
    -ms-animation: slideFLeft .8s;
}
.health-single-post:nth-child(2n+1) .health-cont, .health-single-post:nth-child(2n) .health-img{
    animation: slideFRight .8s;
    -webkit-animation: slideFRight .8s;
    -moz-animation: slideFRight .8s;
    -o-animation: slideFRight .8s;
    -ms-animation: slideFRight .8s;
}
.health-single-post div img{
    width: 100%;
    box-shadow: -5px 5px 10px rgba(0,0,0,0.4), -20px 20px 0px 0px #242c2f;
    transition: .3s;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -o-transition: .3s;
    -ms-transition: .3s;
}


/* ============ Shop ============= */
.shop-comp1{
    background-color: #f5f5f5;
}
.products-comp{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 30px;
    margin-top: 60px;
}
.one-product{
    background-color: #fff;
    padding: 10px;
    padding-bottom: 20px;
    box-shadow: 0px 0px 20px rgba(0,0,0,0.1);
    border: 1px solid #ddd;
    transition: .3s;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -o-transition: .3s;
    -ms-transition: .3s;
    cursor: pointer;
}
.one-product:hover{
    box-shadow: 0px 0px 20px rgba(0,0,0,0.2);
}
.one-product .pro-img{
    width: 100%;
    height: 200px;
    overflow: hidden;
}
.one-product .pro-img img{
    width: 100%;
    min-height: 100%;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -o-transition: .5s;
    -ms-transition: .5s;
}
.one-product{
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    -ms-border-radius: 10px;
}
.cart-btn1::after{
    content: '';
    position: absolute;
    width: 30px;
    height: 30px;
    margin-left: 0px;
    margin-top: -5px;
    background-image: url('../img/icnset1.png');
    background-size: 100% auto;
    background-position: 0px 26px;
}
.cart-btn1{
    padding-right: 45px;
    color: #fff;
}
.cart-btn1:hover{
    color: #fff;
}
.cart-btn1:hover::after{
    opacity: 1;
}
.one-product .pro-img{
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -o-border-radius: 5px;
    -ms-border-radius: 5px;
}
.one-product:hover .pro-img img{
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
}
.pro-details{
    text-align: center;
}
.pro-details h4{
    font-family: lt;
    font-size: 20px;
    color: #242c2f;
    margin-top: 10px;
    margin-bottom: 0px;
}
.pro-details p{
    margin-top: 5px;
    margin-bottom: 10px;
}
.pro-details p s{
    font-size: 14px;
}
.pro-details .actualPrc{
    font-size: 18px;
    color: #5fa93f;
    font-family: ltB;
}
.pro-details .p1{
    padding: 0px;
    margin: 0px;
}
.offer-tag1{
    position: relative;
    float: right;
    margin-top: -306px;
    margin-right: -10px;
    right: 0px;
    width: 60px;
    height: 55px;
    background-color: #ebff75;
    color: #242c2f;
    text-align: center;
    padding: 15px 3px;
    font-family: ltB;
    font-size: 24px;
    z-index: 1000;
    border-radius: 0px 10px 0px 50px;
    -webkit-border-radius: 0px 10px 0px 50px;
    -moz-border-radius: 0px 10px 0px 50px;
    -o-border-radius: 0px 10px 0px 50px;
    -ms-border-radius: 0px 10px 0px 50px;
    box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(255,255,255,1) inset;
}
.offer-tag1 span{
    font-size: 12px;
    margin-top: 0px;
}
.one-product a.morelink1{
    color: #5fa93f;
    font-family: lt;
    font-size: 14px;
    text-decoration: none;
    display: block;
    padding-top: 5px;
}
.disable-btn-cls{
    background-color: #bbb;
}
.disable-btn-cls:hover{
    background-color: #aaa;
}


/* ========= Cart and checkout ========= */
.cart-and-checkout{
    display: grid;
    grid-template-columns: 2fr 1.3fr;
    grid-gap: 0px 10px;
}
.empty-cart{
    background-color: #fff;
    padding: 60px 20px 60px 20px;
    border-radius: 10px;
    font-family: lt;
    color: #888;
    font-size: 14px;
    box-shadow: 0px 5px 15px rgba(0,0,0,0.1);
}

/* ========= Cart ======== */
.mobile{
    display: none;
}
.desktop{
    display: block;
}
.single-cart-item, .single-cart-item-total{
    display: grid;
    grid-gap: 0px 6px;
    height: 60px;
    background-color: #fff;
    padding: 10px;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    -ms-border-radius: 10px;
    margin-bottom: 10px;
    font-family: lt;
    transition: .3s; 
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -o-transition: .3s;
    -ms-transition: .3s;
    color: #242c2f;
}
.single-cart-item{
    grid-template-columns: 100px 1fr 135px 90px 20px;
    height: 60px;
    box-shadow: 0px 5px 15px rgba(0,0,0,0.1);
    cursor: pointer;
}
/* Total */
.single-cart-item-total{
    grid-template-columns: 2fr 1fr 1fr;
    height: 60px;
    text-align: right;
    box-shadow: 0px 2px 5px rgba(0,0,0,0.1);
}
.single-cart-item-total a{
    color: #242c2f;
    text-decoration: none;
}
.single-cart-item:hover{
    box-shadow: 0px 5px 15px rgba(0,0,0,0.2);
}
.single-cart-item h4, .single-cart-item p{
    height: 60px;
    margin: 0px;
    padding: 0px;
}
.single-cart-item h4{
    text-align: left;
    font-size: 16px;
    font-weight: 200;
    height: 100%;
    display: block;
    margin-top: auto;
    margin-bottom: auto;
    padding-top: 18px;
}
.single-cart-item p{
    font-size: 16px;
    line-height: 3.5em;
}
.single-cart-item .img-cont{
    width: 100px;
    height: 60px;
    overflow: hidden;
    text-align: left;
}
.single-cart-item img{
    height: 60px;
    max-height: 100px;
}
.qtty-set{
    display: grid;
    grid-template-columns: 25px 75px 25px;
    grid-gap: 0px;
    margin-bottom: auto;
    margin-top: 15px;
    padding: 0px;
    text-align: center;
}
.qtty-set input, .qtty-set button{
    height: 25px !important;
    margin: 0px !important;
    text-align: center;
    font-family: lt;
}
.qtty-set .inp{
    overflow: hidden;
}
.qtty-set input{
    padding: 0px !important;
    border: 0px;
    background-color: #f5f5f5;
    color: #242c2f;
    font-size: 18px;
    width: 95px;
}
.qtty-set button{
    background-color: #f5f5f5;
    color: #fff;
    border: 0px;
    background-image: url('../img/icnset1.png');
    background-size: 100% auto;
    background-position: center -105px;
    background-repeat: no-repeat;
    padding: 15px;
}
.qtty-set button:hover{
    background-color: #70be50;
}
.single-cart-item .closer, .single-cart-item-mob .closer{
    background-color: #aaa;
    height: 10px;
    width: 10px;
    padding: 5px;
    background-image: url('../img/icnset1.png');
    background-size: 100%;
    background-position: center -52px;
    cursor: pointer;
}
.single-cart-item .closer:hover, .single-cart-item-mob .closer:hover{
    background-color: #dd5145;
}
.qtty-set button, .closer, .single-cart-item img, .single-cart-item-mob img{
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    -ms-border-radius: 3px;
}
.single-cart-item .closer{
    margin-top: 18px;
}
.single-cart-item-mob .closer{
    position: absolute;
    right: 25px;
    margin-top: 0px;
}
.btnleft{
    transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
}
.btnright{
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
}
.cart-header{
    display: grid;
    grid-template-columns: 100px 1fr 135px 100px 30px;
    grid-gap: 0px 10px;
    padding: 10px 8px;
    border-radius: 5px 5px 0px 0px;
    -webkit-border-radius: 5px 5px 0px 0px;
    -moz-border-radius: 5px 5px 0px 0px;
    -o-border-radius: 5px 5px 0px 0px;
    -ms-border-radius: 5px 5px 0px 0px;
    font-family: lt;
    background-color: #242c2f;
    box-shadow: none;
    height: 20px;
    color: #aaa;
    font-size: 14px;
    margin-bottom: 10px;
}


/* cart Mobile */
.single-cart-item-mob{
    display: grid;
    grid-template-columns: 1fr 2fr;
    font-family: lt;
    grid-gap: 0px 10px;
    background-color: #fff;
    box-shadow: 0px 5px 15px rgba(0,0,0,0.1);
    padding: 10px;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    -ms-border-radius: 10px;
    margin-bottom: 10px;
}
.single-cart-item-mob .img-cont{
    width: 100%;
    margin-top: auto;
    margin-bottom: auto;
}
.single-cart-item-mob .img-cont img{
    width: 100%;
}
.single-cart-item-mob h4, .single-cart-item-mob p{
    padding: 0px;
    margin: 3px 0px;
}
.single-cart-item-mob .dtls-mob{
    text-align: left;
}
.single-cart-item-mob .dtls-mob p{
    text-align: right;
    font-size: 18px;
}


/* ========== Check Out ========= */
.cart-comp1{
    text-align: center;
    background-color: #f5f5f5;
}
.cart-area{
    display: grid;
    grid-template-columns: 2fr 1.3fr;
    margin-top: 20px;
    grid-gap: 10px;
}

.cart-form, .items-table{
    background-color: #fff;
    box-shadow: 0px 5px 15px rgba(0,0,0,0.1);
    padding: 20px;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    -ms-border-radius: 10px;
}
/* Cart Form */
.cart-form{
    text-align: left;
    font-family: lt;
    font-size: 16px;
    margin-bottom: auto;
}
.cart-form h4{
    text-align: center;
    font-size: 14px;
    color: #aaa;
    background-color: #242c2f;
    padding: 11px 10px;
    border-radius: 5px 5px 0px 0px;
    -webkit-border-radius: 5px 5px 0px 0px;
    -moz-border-radius: 5px 5px 0px 0px;
    -o-border-radius: 5px 5px 0px 0px;
    -ms-border-radius: 5px 5px 0px 0px;
    font-family: lt;
    font-weight: 200;
    margin-bottom: 10px;
    margin-left: -20px;
    margin-top: -20px;
    width: calc(100% + 20px);
}
.cart-form label{
    display: table-cell;
    text-align: left;
    padding-bottom: 5px;
}
.cart-form input{
    display: table-cell;
    margin-bottom: 10px;
    width: calc(100% - 20px);
    padding: 10px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -o-border-radius: 5px;
    -ms-border-radius: 5px;
    border: 1px solid #ddd;
    background-color: #f5f5f5;
    transition: .3s;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -o-transition: .3s;
    -ms-transition: .3s;
}
.cart-form input:hover{
    background-color: #eee;
}
.cart-form input:focus{
    background-color: #e8e8e8;
}

/* Cart table */
.items-table{
    height: auto;
    margin-bottom: auto;
    padding-bottom: 20px;
}
.items-table h4{
    color: #aaa;
    font-family: ltB;
    font-weight: 400;
    font-size: 16px;
    background-color: #242c2f;
    padding: 10px 20px;
    margin: 0px;
    margin-bottom: 10px;
    margin-top: -10px;
    width: calc(100% - 20px);
    margin-left: -10px;
}
.items-table h4:nth-child(2){
    text-align: right;
}
.items-li{
    display: grid;
    grid-template-columns: 2fr 1.5fr;
    text-align: left;
    font-family: lt;
    font-size: 14px;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    -ms-border-radius: 3px;
}
.items-li:hover{
    background-color: #f5f5f5;
}
.items-li li{
    list-style: none;
    padding: 13px 10px;
    margin: 0px;
    border-bottom: 0px solid #ddd;
}
.items-li:nth-child(2n){
    background-color: #f2f2f2;
}
.items-li li:nth-child(2n){
    border-left: 1px solid #ccc;
    text-align: right !important;
}
.total-comp{
    display: grid;
    grid-template-columns: 2fr 1fr;
    color: #242c2f;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    -ms-border-radius: 3px;
    margin-top: 5px;
}
.total-comp h5{
    font-family: ltB;
    margin: 10px;
}
.total-comp h5:nth-child(1){
    text-align: left;
    font-size: 16px;
}
.total-comp h5:nth-child(2){
    text-align: right;
    font-size: 18px;
}

#itemsInfo, #itemsInfoM{
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 5px 0px;
    margin-bottom: 10px;
}
#itemsInfo div:nth-child(1), #itemsInfoM div:nth-child(1){
    text-align: left;
}
#itemsInfo p, #itemsInfoM p{
    text-align: right;
    margin: 3px 0px;
}
#itemsInfo button, #itemsInfoM button{
    background-color: #aaaaaa;
    border: 0px;
    padding: 5px 10px;
    border-radius: 5px;
    color: #fff;
}
#itemsInfo button:hover, #itemsInfoM button:hover{
    background-color: #dd4f43;
}


/* =============== Product ================ */
.product-comp1{
    background-color: #f5f5f5;
}
.single-product-comp{
    display: grid;
    grid-template-columns: 2fr 1fr;
    grid-gap: 0px 10px;
    color: #242c2f;
}
.single-product-comp h4{
    font-family: lt;
    font-size: 14px;
    margin-top: 0px;
    background-color: #242c2f;
    color: #aaa;
    padding: 10px 20px;
    margin-top: -20px;
    width: 100%;
    margin-left: -20px;
    border-radius: 5px 5px 0px 0px;
    font-weight: 200;
}
.single-product-comp div{
    background-color: #fff;
    padding: 20px;
    box-shadow: 0px 5px 15px rgba(0,0,0,0.1);
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    -ms-border-radius: 10px;
    margin-bottom: 10px;
    margin-top: 0px;
}
.single-product-comp div:nth-child(1) img{
    max-width: 300px;
    max-height: 400px;
    border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px;
}
.single-product-comp div:nth-child(2){
    text-align: center;
    margin-bottom: auto;
}
.single-product-comp div:nth-child(2) .inner{
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 0px;
    font-family: lt;
    font-size: 16px;
    box-shadow: none;
}
.single-product-comp div:nth-child(2) .inner span{
    margin-bottom: 20px;
    border-bottom: 1px solid #ddd;
    padding-bottom: 5px;
}
.single-product-comp div:nth-child(2) .inner span:nth-child(2n+1){
    text-align: left !important;
}
.single-product-comp div:nth-child(2) .inner span:nth-child(2n){
    text-align: right !important;
}

.share-product{
    margin-top: 10px; 
    display: grid; 
    grid-template-columns: 50px 3.5fr 1fr; 
    grid-gap:0px 10px;
    font-family: lt;
    font-size: 16px !important;
    margin-top: auto;
    margin-bottom: auto;
}
.share-product input, .share-product button{
    padding: 8px;
    border: 1px solid #ddd;
    color: #242c2f;
    font-family: lt;
    font-size: 16px !important;
    border-radius: 5px; -webkit-border-radius: 5px;
    -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px;
}
.share-product input{
    background-color: #f5f5f5;
}
.share-product button{
    background-color: #70be50;
}
.share-product span{
    margin-top: auto;
    margin-bottom: auto;
}

/* Small Alert Classes */
#set-alert{
    position: absolute;
    transform: translate(60px, -25px);
    -webkit-transform: translate(60px, -25px);
    -moz-transform: translate(60px, -25px);
    -o-transform: translate(60px, -25px);
    font-family: lt;
}
.alert-cls1::after{
    position: absolute;
    background-color: #333;
    padding: 5px 10px;
    color: #ddd;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    font-size: 12px;
}
.alert-cls1::after{
    content: 'Copied';
}


/* ============= Post Component ============ */
.post-comp1{
    background-color: #f5f5f5;
}
.post-comp1 .c-padd{
    display: grid;
    grid-template-columns: 3fr 1.2fr;
    grid-gap: 10px;
    height: auto;
}
.post-inner, .other-posts{
    background-color: #fff;
    padding: 20px;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    -ms-border-radius: 10px;
    box-shadow: 0px 5px 15px rgba(0,0,0,0.1);
}
.other-posts a{
    color: #242c2f;
    text-decoration: none;
    font-size: 14px;
}
.post-inner .p1{
    margin-bottom: 30px;
    text-align: justify;
}
.post-inner span{
    color: #47575c;
    font-family: lt;
    font-size: 14px;
}
.post-inner .para img{
    max-width: 100% !important;
    max-height: 400px !important;
}
.other-posts{
    font-family: lt;
}
.other-posts ul{
    margin: 0px;
    padding: 0px;
}
.other-posts ul li{
    list-style: none;
    font-size: 16px;
    padding: 10px 5px;
    border-bottom: 1px solid #ddd;
    cursor: pointer;
}
.other-posts ul li:hover{
    background-color: #f1f1f1;
}
.other-posts{
    height: auto;
    margin-bottom: auto;
}


/* =============== Blog Page ================ */
.blog-comp1{
    background-color: #f5f5f5;
}
.one-blog-pst{
    margin-bottom: 30px;
    padding-bottom: 20px;
    text-align: left;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    background-color: #fff;
    padding: 20px;
    box-shadow: 0px 0px 20px rgba(0,0,0,0.1);
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    -ms-border-radius: 10px;
    border: 1px solid #ddd;
}
.one-blog-pst h2{
    text-align: left;
}
.one-blog-pst p{
    text-align: justify;
    border-bottom: 1px solid #ccc;
    padding-bottom: 20px;
}
.one-blog-pst img{
    width: 100%;
    max-width: 600px;
    max-height: 400px;
    position: relative;
    display: block;
    margin-left: auto !important;
    margin-right: auto !important;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -o-border-radius: 5px;
    -ms-border-radius: 5px;
}
.one-blog-pst span{
    font-family: lt;
    font-size: 14px;
    color: #888;
    float: left;
}
.one-blog-pst button{
    margin-top: 20px;
}


/* ========== Contact ========= */
.contactform-comp{
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin-top: 30px;
    grid-gap: 30px;
}
.contact-dtls h4{
    font-size: 18px;
    margin-bottom: 5px;
    padding-bottom: 0px;
    line-height: 22px;
}
.contact-form label, .contact-form input, .contact-form textarea{
    display: table-cell;
    font-family: lt;
    font-size: 16px;
    color: #242c2f;
}
.contact-form label{
    padding-bottom: 6px;
    font-weight: 500;
}
.contact-form input, .contact-form textarea{
    width: calc(100% - 10px);
    padding: 10px 5px;
    border: 1px solid #ccc;
    border-radius: 3px;
    background-color: #f5f5f5;
    transition: .3s;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -o-transition: .3s;
}
.contact-form input:focus, .contact-form textarea:focus{
    background-color: #e9e9e9;
}
.contact-form input{
    margin-bottom: 10px;
}
.contact-form button{
    margin-top: 20px;
}



/* comps Set*/
.anim-com-l, .anim-com-r{
    visibility: hidden;
}
.actv-div-l{
    visibility: visible;
    animation: fadeDivs-l .5s;
}
.actv-div-r{
    visibility: visible;
    animation: fadeDivs-r .5s;
}

@keyframes fadeDivs-l{
    0%{transform: translate(-50px, 0px); opacity: 0;}
    100%{transform: translate(0px, 0px); opacity: 1;}
}
@keyframes fadeDivs-r{
    0%{transform: translate(50px, 0px); opacity: 0;}
    100%{transform: translate(0px, 0px); opacity: 1;}
}

/* 
Colors
Dark 01     = #101415
dark 02     = #242c2f
gray 01     = #3d4a50
Green 01    = #70be50

*/