/* Sale Notification */
.wcsales-notification-content {
  position: fixed;
  bottom: 10px;
  background: #fff;
  display: flex;
  flex-flow: row wrap;
  left: -150px;
  align-items: center;
  box-shadow: 0 0 10px #ccc;
  width: 550px;
  border-radius: 10px;
  z-index: 999;
}
.wcsales-notification-content.topleft {
  left: 10px;
  top:10px;
  bottom: auto;
}
.wcsales-notification-content.topright {
  left: auto;
  right:10px;
  top:10px;
  bottom: auto;
}
.logged-in .wcsales-notification-content.topleft,.logged-in .wcsales-notification-content.topright {
  top:45px;
}
.wcsales-notification-content.bottomleft {
  left: 10px;
}
.wcsales-notification-content.bottomright {
  right: 10px;
  left: auto;
}
.wcsales-notification-content.imageright {
  flex-direction: row-reverse;
  padding-right: 0;
  padding-left: 20px;
}
.wcnotification_image {
  padding-right: 15px;
  flex: 0 0 25%;
}
.wcnotification_image img{
  border-radius: 5px;
}
.wcsales-notification-content.imageright .wcnotification_image {
  padding-right: 0;
  padding-left: 15px;
}
.wcnotification_content {
  flex: 0 0 75%;
}
.imageright .wcnotification_content {
  text-align: right;
}
.wcnotification_content h4,.wlnotification_content h6{
  margin: 0;
  color: #000;
}
.wcnotification_content h4{
  font-size: 18px;
  margin-bottom: 0px;
}
.wcnotification_content h6{
  font-size: 14px;
}
.wcnotification_content p {
  margin-bottom: 3px;
  max-width: 450px;
  font-size: 13px;
  font-weight: 300;
  color: #7e7e7e;
}
.wcsales-buyername {
  font-size: 12px;
  float: right;
}
.imageright .wcsales-buyername {
  float: left;
}
.wccross {
  position: absolute;
  right: 0px;
  top: 4px;
  color: #000;
  font-size: 20px;
  line-height: 0;
  padding: 10px;
  cursor: pointer;
  transition: 0.4s;
}
.wccross:hover{
  color: #f05b64;
}

/* Normal  :1366px. */
@media (min-width: 1200px) and (max-width: 1400px) {

}

/* Normal desktop :992px. */
@media (min-width: 992px) and (max-width: 1200px) {
    
}

/* Tablet desktop :768px. */
@media (min-width: 768px) and (max-width: 991px) {
    
}

/* small mobile :320px. */
@media (max-width: 767px) {
    .wcsales-notification-content {
      width: 90%;
    }
}

/* Large Mobile :480px. */
@media only screen and (min-width: 480px) and (max-width: 767px) {

}