@import "https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700";
body {
    font-family: 'Poppins', sans-serif;
    background: #fafafa;
}

p {
    font-family: 'Poppins', sans-serif;
    font-size: 1.1em;
    font-weight: 300;
    line-height: 1.7em;
    color: #999;
}

a,
a:hover,
a:focus {
    color: inherit;
    text-decoration: none;
    transition: all 0.3s;
}

.navbar{
    padding: 20px 20px;
    background: #fff;
    border: none;
    border-radius: 0;
    margin-bottom: 40px;
}

.navbar-btn {
    box-shadow: none;
    outline: none !important;
    border: none;
}

.bg-gray{
  background-color: #eee;
}

.line {
    width: 100%;
    height: 1px;
    border-bottom: 1px dashed #ddd;
    margin: 40px 0;
}

/* ---------------------------------------------------
    SIDEBAR STYLE
----------------------------------------------------- */

/*
    DEMO STYLE
*/

@import "https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700";
body {
    font-family: 'Poppins', sans-serif;
    background: #fafafa;
}

p {
    font-family: 'Poppins', sans-serif;
    font-size: 1.1em;
    font-weight: 300;
    line-height: 1.7em;
    color: #999;
}


.navbar {
    padding: 15px 10px;
    background: #fff;
    border: none;
    border-radius: 0;
    margin-bottom: 40px;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
}

.navbar-btn {
    box-shadow: none;
    outline: none !important;
    border: none;
}

.line {
    width: 100%;
    height: 1px;
    border-bottom: 1px dashed #ddd;
    margin: 40px 0;
}

/* ---------------------------------------------------
    SIDEBAR STYLE
----------------------------------------------------- */

/* The side navigation menu */
.sidebar {
  margin: 0;
  padding: 0;
  width: 220px;
  background-color: #CECECE;
  border-radius: 20px;
  position: fixed;
  height: auto;
  overflow: auto;
}


/* Sidebar links */
.sidebar a {
  display: block;
  color: black;
  padding: 10px;
  text-decoration: none;
}

/* Active/current link */
.sidebar a.active {
  background-color: #04AA6D;
  color: white;
}

/* Links on mouse-over */
.sidebar a:hover:not(.active) {
  background-color: #555;
  color: white;
}

/* Page content. The value of the margin-left property should match the value of the sidebar's width property */
div.content {
  margin-left: 200px;
  padding: 1px 16px;
  height: 1000px;
}

/* On screens that are less than 700px wide, make the sidebar into a topbar */
@media screen and (max-width: 700px) {
  .sidebar {
    width: 100%;
    height: auto;
    position: relative;
  }
  .sidebar a {float: left;}
  div.content {margin-left: 0;}
}

/* On screens that are less than 400px, display the bar vertically, instead of horizontally */
@media screen and (max-width: 400px) {
  .sidebar a {
    text-align: center;
    float: none;
  }
}

p.card-price{
  font-weight: 900;
}

.card-product:hover{
  border: 1px solid transparent;
  -webkit-box-shadow: 0 3px 7px 0 #a8a8a8;
  -moz-box-shadow: 0 3px 7px 0 #a8a8a8;
  box-shadow: 0 10px 10px 0 #a8a8a8;
  
  margin-left: 10px;
}

.card-img-top {
    width: 100%;
    height: 20vw;
    object-fit: cover;
}

.card-img-top_pro {
    width: 50%;
    height: 20vw;
    object-fit: cover;
}

.des_img {
    width: 30%;
    height: 25vw;
    object-fit: cover;
}

@media only screen and (max-width: 480px){
  .card-img-top {
        height: 70vw;
    }
}

@media only screen and (max-width: 720px){
  .card-img-top {
        height: 70vw;
    }
}
  /* Small devices (landscape phones, 576px and up) */
  @media (min-width: 576px) {
    .card-img-top {
        height: 19vw;
    }
  }
  /* Medium devices (tablets, 768px and up) */
  @media (min-width: 772px) {
    .card-img-top {
        height: 16vw;
    }
  }
 
.product-description{
  width: 100%;
}

.product-imitation {
  text-align: center;
  padding: 5px 0;
  background-color: #eee;
  color: #bebec3;
}

.product-imitation img{
    display: initial;
    width: 180px;
    height: 250px;
}
.cart-product-imitation {
  text-align: center;
  padding-top: 30px;
  height: 80px;
  width: 80px;
  background-color: #f8f8f9;
}
.product-imitation.xl {
  padding: 120px 0;
}
.product-desc {
  padding: 20px;
  position: relative;
}

.card-title{
  font-size: 18px;
  font-weight: 600;
  color: #676a6c;
  width: 100%;
  text-align: justify-all;
  overflow: hidden;
  display: block;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin: 2px 0 5px 0;
}

.card-title1{
  font-size: 18px;
  font-weight: 600;
  color: #676a6c;
  width: 100%;
  text-align: justify-all;
  overflow: hidden;
  display: block;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin: 2px 0 5px 0;
}

.card-text{
  font-size: 15px;
  width: 100%;
  height: auto;
  text-align: justify-all;
  overflow: hidden;
  display: block;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.card-text1{
  font-size: 16.8px;
  width: 100%;
  height: auto;
  color: #000;
  text-align: justify-all;
  overflow: hidden;
  display: block;
  word-wrap: break-word;
  text-overflow: clip;
}

.product_name1{
  font-size: 23.5px;
  width: 100%;
  height: auto;
  text-align: justify-all;
  overflow: hidden;
  display: block;
  word-wrap: break-word;
  text-overflow: clip;
}

.product-name:hover,
.product-name:focus {
  color: #1ab394;
}
.product-price {
    font-size: 14px;
    font-weight: 600;
    color: #ffffff;
    background-color: #1ab394;
    padding: 6px 12px;
    position: absolute;
    top: 213.5px;
    right: 0;
}
.product-detail .ibox-content {
    padding: 30px 30px 50px 30px;
}

.image-imitation {
    background-color: #f8f8f9;
    text-align: center;
    padding: 200px 0;
}

.product-main-price small {
  font-size: 10px;
}
.product-images {
  margin: 0 20px;
}

.ibox-conten {
    display: flex;
    padding: 0;
    width: 95%;
    background-color: #eee;
    margin-top: 10px;
}

.ibox.collapsed .ibox-content {
  display: none;
}
.ibox.collapsed .fa.fa-chevron-up:before {
  content: "\f078";
}
.ibox.collapsed .fa.fa-chevron-down:before {
  content: "\f077";
}

.ibox:after,
.ibox:before {
  display: table;
}

.ibox-title {
  background-color: #ffffff;
  border-color: #e7eaec;
  border-image: none;
  border-style: solid solid none;
  border-width: 3px 0 0;
  color: inherit;
  margin-bottom: 0;
  padding: 14px 15px 7px;
  min-height: 48px;
}

.ibox-content {
  background-color: #ffffff;
  color: inherit;
  margin-left: 50px;
  border-color: #e7eaec;
  border-image: none;
  border-style: solid solid none;
  border-width: 1px 0;
  width: 300px;
}


.ibox-content:last-child {
  margin-right: 50px;
}
.ibox-footer {
  color: inherit;
  border-top: 1px solid #e7eaec;
  font-size: 90%;
  background: #ffffff;
  padding: 10px 15px;
}


.main-body {
    padding: 15px;
}


.card {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: none
    border-radius: .25rem;
}


.card-body {
    flex: 1 1 auto;
    min-height: 1px;
    padding: 1rem;
}

.gutters-sm {
    margin-right: -8px;
    margin-left: -8px;
}

.gutters-sm>.col, .gutters-sm>[class*=col-] {
    padding-right: 8px;
    padding-left: 8px;
}
.mb-3, .my-3 {
    margin-bottom: 1rem!important;
}

.bg-gray-300 {
    background-color: #e2e8f0;
}
.h-100 {
    height: 100%!important;
}
.shadow-none {
    box-shadow: none!important;
}