/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 17/01/2017, 11:16:06 AM
    Author     : Jasweb
*/
section{
  margin: 10px 0 30px;
}
img{
  max-width: 100%;
}

@media (min-width: 768px) {
  .col-qtr{
    width: 25%;
    float: left;
  }
  .col-thirds{
    width: 33.3%;
    float: left;
  }
  .col-half{
    position:relative;
    width: 50%;
    float: left;
  }
  .pageHeading{
    color: #22B24C;
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 0;
  }
}
.btn{
  display: block;
  padding: 8px 15px;
  font-size: 1.2em;
}

#top-actions{
  background: #EDEDED;
  font-weight: 600;
  font-size: 0.9em;
  margin: 10px 0;
  /*padding: 10px 0;*/
}
#top-actions img{
  width: 30px;
  vertical-align: middle;
  /*float: left;*/
}
#top-actions a::before {
  content: " ";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  width: 1%;
}
#top-actions a{   
  display: block;
  height: 50px;
  padding: 5px;
  position: relative;
  text-align: center;
  transform-style: preserve-3d;
  vertical-align: middle;
  width: 100%;
}
#top-actions a span{
  color: #000;
  display: inline-block;
  padding-left: 5px;
  text-align: center;
  vertical-align: middle;
}
#top-actions a:hover span{
  color: #22B24C;
}
#top-actions a.noRollover span{
  color: #000;
}
#banner .col-half:first-child, .banner .col-half:first-child{
  padding-right: 5px;
  width: 49%;
}
#banner .col-half:last-child, .banner .col-half:last-child{
  padding-left: 5px;
  width: 49%;
}
.banner{
  margin-bottom: 0;
}
#banner a{
  color:#000;
}
#banner a:hover{
  color: #000;
}
#banner{
  text-shadow: 1px 1px 0px rgba(0,0,0,0.4);
  margin-bottom: 10px;
}
#bannerBtn{
  position:absolute;
  bottom: 15px;
  right: 20px;
}
#banner .homeSlide{
  background-size: 397px 290px;
  background-position: center center;
  border-radius: 0 !important;
  height: 250px;
  padding: 20px;
  position: relative;
  overflow:hidden;
}
.effect6 {
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 20px rgba(0, 0, 0, 0.1) inset;
  position: relative;
}
.effect6::before, .effect6::after {
  border-radius: 100px / 10px;
  bottom: 0;
  content: "";
  left: 10px;
  position: absolute;
  right: 10px;
  top: 50%;
  z-index: -1;
}
#cotn-banner{
  border: solid thin #CCC;
  margin: 10px 0;
  padding: 0 10px;
}
#cotn-christmas-banner{
  margin: 10px 0;
  padding: 0 10px;
  background: #0093D0;
}
#cotn-christmas-banner img{
  padding-top: 10px;
  width: 40%;
  /*height: 100px;*/
  float: left;
}
#cotn-banner img{
  width: 20%;
  /*height: 100px;*/
  float: left;
}
#cotnTxt{
  padding: 10px 0;
  font-size: 1.7em;
  text-align: center;
  font-weight:600;
  color:#0093D0;
}
#cotn-christmas-banner #cotnTxt{
  color:#FFF;
  text-align: center;
  margin: 0;
}
#cotn-banner #cotnTxt{
  float: left;
  width: 60%;
}
#cotn-banner #cotnBtn{
  padding: 25px 0;
  float: left;
  width: 20%;
}
#cotn-christmas-banner #cotnBtn{
  float: none;
  text-align: center;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}
#cotn-christmas-banner #cotnBtn p{
  margin: 0 0 0 0;
  padding: 0 0 10px 0;
}
#cotn-christmas-banner #cotnBtn span{
  color: #0093D0 !important;
  background: #FFF;
}
#cotnBtn a{
  margin-right: 10px;
  float:right;
}

.productItem{
  position: relative;
  margin-bottom: 20px;
}
.productItem .title{
  color:#333;
  padding: 0 20px;
  height: 35px;
}
.productItem a:hover .title{
  color:#0093D0;
}
.productItem .image{
  display: block;
  padding: 0 20px;
}
.productItem p{
  display: block;
  height: 40px;
  padding: 0 20px;  
}
.productItem .image img{
  width: 100%;
  height: 280px;
}

#main-content div{
  padding: 0 10px;
}
.text-red{
  color: #BD252C;
}
.text-sale{
  color: #BD252C;
  font-size:26px; 
  text-align: center;
}
.productItem .salePrice{
  display:block;
  position:absolute;
  right: 0;
  bottom: 55px;
  background: url(../images/sale-price.png) center no-repeat;
  background-size: contain;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  color: #FFF;
  padding-top: 15px;
  padding-left: 2px;
}
.productItem .bestSellerProd{
  right: 0;
  top: 5px; 
  left: auto;
}