@import "../vars.less";

// ---------------------------------------------------------
// VIRTUEMART COMPATIBLITY
// ---------------------------------------------------------

// FANCYBOX
// -----------------------------
#fancybox-wrap {

  #fancybox-outer {

    .fancybox-bg {
      display: none;
    }

    #fancybox-content {
      background: @gray-lightest;
      border: none !important;
      padding: @t3-global-padding @t3-global-padding/3 @t3-global-padding/3;

      & > div {
        padding: 10px;
      }
    }

    .continue_link,
    .showcart {
      border: 1px solid @gray-dark;
      color: @gray-dark;
      display: inline-block;
      font-size: @t3-font-size-small;
      font-weight: @font-weight-normal;
      margin-bottom: 20px;
      padding: 5px (@t3-global-padding / 2);
      text-transform: uppercase;

      &:hover, &:focus, &:active {
        background-color: @gray-dark;
        color: @white;
      }
    }

    .showcart {
      border-color: @gray-light;
      color: @gray;
      &:hover, &:focus, &:active {
        background-color: @brand-primary;
        border-color: @brand-primary;
      }
    }

    h4 {
      font-weight: @font-weight-normal;
      font-size: @font-size-base;
      clear: both;
    }
  }

  #fancybox-title {
    background: @gray-lightest;
    margin: -10px 0 0 0 !important;
    padding: 0 @t3-global-padding/3;
  }

  #fancybox-close {
    background: url("../@{t3-image-path}/ico/closelabel.png") no-repeat center center;
    top: 0;
    right: -20px;
    width: 30px;
    height: 30px;
    opacity: 0.5;

    &:hover {
      opacity: 1;
    }
  }

  #fancybox-right {
    right: -20px;
  }
}

.com_virtuemart {

  // GENERIC STYLES 
  // --------------------
  span.addtocart-button input.addtocart-button, 
  span.addtocart-button input.notify-button {
    .button-variant(@btn-primary-color; @btn-primary-bg; @btn-primary-border);
    border-radius: 0;
    font-size: @t3-font-size-smaller;
    text-transform: uppercase;

    &:hover, &:active, &:focus {
      border-color: transparent;
    }
  }

  input.custom-attribute, 
  input.quantity-input,
  input.vm-default {
    background-color: @input-bg;
    border-color: @input-border;
    border-radius: @input-border-radius;
    color: @input-color;
  }

  .ratingbox {
    background-image: url("../@{t3-image-path}/ico/star-off.png");
    height: 16px;
    line-height: 16px;
    width: 80px !important;
    overflow: hidden;

    div, span {
      background-image: url("../@{t3-image-path}/ico/star-on.png");
      height: 16px;
    }
  }

  // Login Form
  // ---------------------------
  #com-form-login {

    input[type="checkbox"] {
      display: inline-block;
      line-height: 1;
      vertical-align: middle;
    }

    input[type="submit"] {
      .button-variant(@btn-inverse-color; @btn-inverse-bg; @btn-inverse-border);
      border-radius: 0;
      border-style: inherit;
      display: inline-block;
      padding: (@t3-global-padding / 4) @t3-global-padding/2;
      font-size: @font-size-small;
      font-family: @font-family-sans-serif;
      font-weight: @font-weight-bold;
      text-transform: uppercase;
      margin-bottom: @t3-global-margin/2;
      margin-right: 5px;
    }

    #com-form-login-username,
    #com-form-login-password {
      .inputbox {
        width: 100%;
        background: @white;
        color: @gray;
      }
    }
  }

  
  // CATEGORY VIEW
  // ----------------------------------------

  // Category View
  // ---------------------------
  .category-view {
    > h1 {
      color: @black;
      font-size: @font-size-h2;
      margin: 0 0 @t3-global-margin;
      text-transform: uppercase;
    }

    .row .category .spacer h2 {
      color: @black;
      font-weight: @font-weight-bold;
      margin: 0;
      text-align: center;
      text-transform: uppercase;

      > a {
        background: @gray-light-max;
        color: @gray-dark;
        display: block;
        border: none;
        font-size: @font-size-h5;
        padding-bottom: @t3-global-padding/2;

        &:hover {
          color: @link-color;
        }

        img {
          margin-bottom: @t3-global-margin/2;
          margin-top: 0;
          .transition(0.2s);
          max-width: 100%;
          width: 100%;
        }
      }
    }

    .horizontal-separator {
      display: none;
    }

    .category .spacer {
      padding: @t3-global-padding/2;
    }

    .row {
      margin-bottom: @t3-global-margin;
    }

    // Browse View
    // -------------------
    .browse-view {
      > h3 {
        border-bottom: 1px solid @t3-border-color;
        color: @black;
        font-size: @font-size-h2;
        padding-bottom: @t3-global-margin/2;
        margin: 0;
        text-transform: uppercase;
      }

      .virtuemart_search {
        margin-bottom: @t3-global-margin;

        .inputbox {
          display: inline-block;
          vertical-align: top;
        }

        .button {
          font-size: @font-size-base;

          @media (max-width: @screen-xs-max) {
            margin-top: @t3-global-margin/2;
          }
        }
      }
    }
  }

  .orderby-displaynumber {
    .clearfix();
    border-bottom: 0;
    padding-top: @t3-global-padding;
    padding-bottom: @t3-global-padding;
    margin-bottom: 0;

    .orderlistcontainer {
      position: relative;
    }

    .orderlist {
      right: 0;
      top: @input-height-base;
      min-width: 150px;

      div:hover {
        background-color: transparent;
      }

      a {
        color: @input-color;

        &:hover, &:focus, &:active {
          color: @brand-primary;
          text-decoration: none;          
        }
      }
    }

    .title {
      float: left;
      margin-right: 5px;
      margin-top: 8px;

      // Mobile view
      @media (max-width: @screen-xs-max) {
        float: none;
      }
    }

    .display-number select {
      float: right;
      margin-left: 5px;
    }

    .orderlistcontainer div.activeOrder {
      float: left;
      -moz-appearance: none;
      background-color: @input-bg;
      border: 1px solid @input-border;
      color: @input-color;
      background-image: url("../@{t3-image-path}/ico/shorting.png");
      background-position: right center;
      background-repeat: no-repeat;
      height: @input-height-base;
      line-height: @input-height-base;
      border-radius: @input-border-radius;
      padding-right: 30px; 
      padding-top: 0;
      padding-bottom: 0;

      &:hover {
        border-color: @input-border-focus;
      }

      a {
        color: @input-color;

        &:hover, &:focus, &:active {
          color: @input-color;
          text-decoration: none;          
        }
      }
    }
  }

  // VM PRODUCT GRID
  // -------------------
  div[class*="-view"] .row {
    display: block;
    margin-left: -@grid-gutter-width/2;
    margin-right: -@grid-gutter-width/2;

    .vm-col {
      padding-right: @grid-gutter-width/2;
      padding-left: @grid-gutter-width/2;
      margin: 0;
      border: 0;

      .spacer {
        .clearfix();
        padding: @t3-global-padding/2;
        background-color: @gray-light-max;
      }

      .vm-product-media-container {
        margin-top: -@t3-global-margin/2;
        margin-left: -@t3-global-margin/2;
        margin-right: -@t3-global-margin/2;
        max-width: none;
      }

      .browseProductImage {
        max-height: none;
      }

      .vm-product-descr-container-1 {
        height: auto;
        margin-bottom: @t3-global-margin;

        h2 {
          margin: 0;
          text-transform: uppercase;
          font-weight: @font-weight-bold;
          margin-bottom: 5px;
          line-height: 2;

          a {
            color: @gray-dark-lv2;

            &:hover, &:focus, &:active {
              color: @link-hover-color;
            }
          }
        }

        .product_s_desc {
          overflow: hidden;
          height: 4em;
        }
      }

      .vm-nodisplay {
        display: none;
      }

      .product-price {
        height: auto;
      }

      .PricebasePrice,
      .PricesalesPrice {
        display: inline-block;
        font-weight: @font-weight-bold;
        font-size: @font-size-base;
        color: @black;

        .vm-price-desc {
          display: none;
        }
      }

      .vm-details-button {
        display: none;
      }

      .vm3pr-1,
      .vm3pr-2,
      .vm3pr-4 {
        float: left;
      }

      .vm3pr-0 {
        float: right;

        .addtocart-area {
          height: auto;
          margin: 0;
        }

        .addtocart-bar {
          position: static;
        }

        .quantity-box,
        .quantity-controls {
          display: none;
        }
      }
    }

    div.product {
      @media screen and (max-width: @screen-md) {
        width: 100%;
        margin-bottom: @t3-global-margin;
      }
    }
  }

  .horizontal-separator {
    background-color: transparent;
    margin-top: @grid-gutter-width/2;
    margin-bottom: @grid-gutter-width/2;
  }

  .vm-col-3 {
    float: left;
    width: 33.333%;
  }


  // VM PRODUCT DETAIL
  // --------------------
  .productdetails-view {

    // display none category-child
    .category-view {
      display: none;
    }

    .vm-product-container {
      clear: both;
    }

    .main-image img {
      max-height: none;
    }

    .spacer-buy-area {
      padding: 0;

      .ratingbox {
        float: left;
        margin: 0;
      }

      h1 {
        margin-top: 0;
      }

      .addtocart-area {
        margin-bottom: @t3-global-margin;

        .vm-customfields-wrap {
          .radio, .checkbox {
            margin-top: 0;
            margin-bottom: 0;
          }

          .radio input[type="radio"], 
          .radio-inline input[type="radio"], 
          .checkbox input[type="checkbox"], 
          .checkbox-inline input[type="checkbox"] {
            margin-left: 0;
            margin-right: @t3-global-margin/2;
            position: static;
          }
        }
      }

      .icons {
        margin-bottom: 0;
        line-height: normal;
        float: right;
      }
    }

    // Additional images
    .additional-images img {
      width: 80px;
    }

    // Back to category
    .back-to-category {
      margin: @t3-global-margin 0;

      > .product-details {
        .button-variant(@btn-default-color; @btn-default-bg; @btn-default-border);
      }
    }

    // Price sales Price
    span.PricesalesPrice {
      font-size: @font-size-h3;
      color: @link-color;
    }

    // Product Neighbours
    .product-neighbours {
      border-bottom: 1px solid @t3-border-color;
      padding-bottom: @t3-global-padding/2;
      margin: 0;
    }

    // manufacturer
    .manufacturer {
      > a {
        background: @gray-lightest;
        border: 1px solid @t3-border-color;
        padding: 5px 10px;
      }
    }

    .product-short-description {
      border-top: 1px solid @t3-border-color;
      padding-top: @t3-global-padding*0.75;
      margin-top: @t3-global-margin*0.75;
    }

    .product-price {
      clear: both;
      text-align: left;
      float: none;
    }

    span.quantity-controls {
      height: 35px;
      line-height: 17px;
    }

    .shop-tab-ct {
      background-color: @well-bg;
      padding: @t3-global-padding*1.5 @t3-global-padding;

      .customer-reviews {
        margin-top: 0;
      }

      .product-description .title,
      .customer-reviews h4 {
        font-size: @font-size-h3;
        text-transform: uppercase;
        font-family: @headings-font-family;
        line-height: @headings-line-height;
        border-bottom: 0;
        padding: 0;
        margin-bottom: @t3-global-margin;
        display: block;
      }
    }

    // Related Products
    .product-related-products {

      .prdct-name {
        margin-top: @t3-global-margin/2;
      }

      .product-field .vm-price-desc {
        display: inline-block;
        margin-bottom: 0;
        font-weight: @font-weight-normal;
      }

      span.PricesalesPrice {
        font-size: @font-size-base;
        vertical-align: top;
      }

      .product-field p.product_s_desc {
        margin-bottom: 0;
      }
    }
  }

  .vm-product-tabs {
    margin-top: @t3-global-margin*2;

    .nav-tabs {
      margin-bottom: 0;
    }
  }


  // PRODUCT RELATED 
  // -----------------
  .product-related-products {
    margin: 0 -@grid-gutter-width/2;
    border: 0;
    padding: 0;
    
    .product-fields-title-wrapper {
      padding-right: @grid-gutter-width/2;
      padding-left: @grid-gutter-width/2;
      margin: @t3-global-margin 0;

      &:after {
        content: "";
        display: block;
        background: url("../@{t3-image-path}/ico/divide-side.png") repeat center center;
        height: 13px;
        max-width: 992px;
      }
    }

    .product-fields-title {
      font-family: @font-family-sans-serif;
      font-size: 18px;
      text-transform: uppercase;

      strong {
        font-weight: @font-weight-normal;
      }
    }

    .product-field {
      float: left;
      margin: 0 0 @grid-gutter-width;
      width: 33.333%;
      padding-right: @grid-gutter-width/2;
      padding-left: @grid-gutter-width/2;

      .product-field-display {
        background-color: @well-bg;
        padding-bottom: @t3-global-padding;
      }

      .vm-display,
      .product_s_desc {
        padding-right: @t3-global-padding/2;
        padding-left: @t3-global-padding/2;
      }

      .prdct-name {
        padding-right: @t3-global-padding/2;
        padding-left: @t3-global-padding/2;
        font-size: @font-size-base;

        a {
          color: @gray-dark-lv2;
          .text-overflow();

          &:hover, &:focus, &:active {
            color: @link-hover-color;
          }
        }
      }

      .vm-price-desc {
        display: none;
      }

      .PricesalesPrice {
        display: inline-block;
        vertical-align: middle;
        font-weight: @font-weight-bold;
      }

      img {
        max-width: 100%;
      }

      p.product_s_desc {
        height: auto;
        margin-bottom: @t3-global-margin/2;
      }
    }
  }


  // PRODUCT REVIEW
  // ------------------
  #reviewform {
    margin-bottom: @t3-global-margin;

    .rating {
      text-align: left;
      margin-bottom: 0;

      .ratingbox {
        margin-bottom: 0;
      }
    }

    .write-reviews {
      margin-top: 0;
      text-align: left;

      span {
        display: block;
        margin-bottom: @t3-global-margin/2;

        input {
          display: inline-block;
          background: none;
          border: 0;
          padding: 0;
        }

        & ~ br {
          display: none;
        }
      }
    }
  }


  // Button
  // --------------------------

  a.product-details,
  div.details,
  button.default,
  span.details-button input.details-button {
    .button-variant(@btn-inverse-color; @btn-inverse-bg; @btn-inverse-border);
    background-image: none;
    border-radius: 0;
    font-size: @t3-font-size-smaller;
    padding: @t3-global-padding/4 @t3-global-padding/2;
    letter-spacing: 0;
    text-transform: uppercase;
  }

  .button,
  a.ask-a-question,
  .highlight-button,
  .manufacturer-product-link > a {
    background-image: none;
    .button-variant(@btn-primary-color; @btn-primary-bg; @btn-primary-border);
    border-radius: 0;
    border-style: inherit;
    border-width: 1px;
    display: inline-block;
    font-size: @t3-font-size-smaller;
    padding: (@t3-global-padding / 4) @t3-global-padding/2;
    text-transform: uppercase;

      & + .button {
      .button-variant(@btn-inverse-color; @btn-inverse-bg; @btn-inverse-border);
      }
  }

  // ACCOUNT MAINTENACE
  // -----------------------------
  &.view-user,
  &.view-cart,
  &.view-orders,
  &.view-productdetails {
    h1 {
      color: @gray-darker;
      margin-bottom: @t3-global-margin;
      font-size: @font-size-h2;
    }

    h2 {
      font-size: @font-size-h5;
      color: @gray-darker;
      border-bottom: 1px solid @t3-border-color;
      padding-bottom: @t3-global-padding/3;
    }

    #com-form-login,
    #form-login {
      background: @gray-lightest;
      border: 1px solid @t3-border-color;
      padding: @t3-global-padding;
      font-size: @t3-font-size-smaller;

      label {
        font-weight: @font-weight-normal;
        margin-left: @t3-global-padding/3;
      }

      &+#checkoutForm .billto-shipto {
        border-top: none;
      }
    }

    #form-login .button {
      margin-left: @t3-global-margin/2;
    }

    .userdata {
      margin-bottom: 10px;

      > p {

        @media screen and (max-width: @screen-sm-max) {
          width: 45%;
        }

        &#com-form-login-remember {
          margin: 0;

          @media screen and (max-width: @screen-sm-max) {
            width: 100%;
            margin-top: @t3-global-padding/2;
          }
        }

        @media screen and (max-width: @screen-xs-max) {
          width: 100%;
          margin-bottom: 10px !important;
        }
      } 

      h2 {
        font-size: @font-size-h5;
        margin-top: 0;
        font-weight: @font-weight-normal;
        padding: 0;
        border: none;
      }

      .inputbox[type="text"],
      .inputbox[type="password"]{
        width: 100%;
      }

      .default {
        .button-variant(@btn-primary-color; @btn-primary-bg; @btn-primary-border);

        @media screen and (min-width: @screen-md) {
          margin-top: 0;
        }
      }

      #com-form-login-remember .inputbox {
        display: inline-block;
        height: auto;
        width: auto;
      }
    }

    .user-details {

      @media screen and (max-width: @screen-xs-max) {
        width: 100%;
      }

      tr td {
        border: none;
        padding: 5px;

        @media screen and (max-width: @screen-xs-max) {
          display: block;
        }

        &.key {
          padding: 10px 10px 0 0;

          @media screen and (max-width: @screen-xs-max) {
            .clearfix();
          }
        }

        input, select {
          border-radius: 0;
          background: none;
          margin-left: 0;
          border: 1px solid @input-border;
          box-shadow: none;

          @media screen and (min-width: @screen-sm) {
            width: 250px !important;
          }

          &:focus {
            box-shadow: none;
          }

          &.default:hover {
            color: @gray;
          }
        }

        label {
          width: 200px;
          font-weight: @font-weight-normal;

          @media screen and (max-width: @screen-xs-max) {
            width: 100%;
            text-align: left;
          }
        }
      }
    }

    .default {
      .button-variant(@btn-inverse-color; @btn-inverse-bg; @btn-inverse-border);
      border-radius: 0;
      border-style: inherit;
      display: inline-block;
      padding: (@t3-global-padding / 4) @t3-global-padding/2;
      font-size: @font-size-small;
      font-family: @font-family-sans-serif;
      font-weight: @font-weight-bold;
      text-transform: uppercase;
    }

    .buttonBar-right {
      vertical-align: top;
    }

    .userfields_info {
      border-bottom: 1px solid @t3-border-color;
      border-top: 1px solid @t3-border-color;
      margin: 20px 0;
      padding: 10px 0;
      text-transform: uppercase;
    }

    .form-validate {
      padding-top: @t3-global-padding;
    }

    fieldset > legend {
      border: none;
      font-size: @font-size-base;
      color: @text-color;
      margin: 0;
    }
  }


  // VIEW ORDER
  // -----------------------------
  &.view-orders {

    .order-view {
      .inputbox {
        width: 97%;
      }
    }

    #com-form-order-submit {
      .button {
        .button-variant(@btn-inverse-color; @btn-inverse-bg; @btn-inverse-border);

        @media screen and (min-width: @screen-md) {
          margin-top: (@t3-global-margin + 6px);
        }
      }
    }
  }


  // VIEW USER
  // -----------------------------
  &.view-user {

    #userForm {
      .control-buttons {
        margin: 0;
        text-align: left !important;

        #reg_text {
          float: none;
          margin: 0 0 @t3-global-margin/2;
        }

        button.default {
          margin: 0 @t3-global-margin/3 @t3-global-margin/3 0;

          @media screen and (min-width: @screen-xs-max) {
            margin: 0 @t3-global-margin/3 0 0;
          }
        }
      }
    }

    #ui-tabs {
      ul#tabs {
        margin-bottom: -1px;

        li {
          border: 1px solid darken(@gray-lighter, 5%);
          margin-left: -1px;
        }

        li.current {
          background: @white;
          border-bottom-color: @white;
        }
      }

      > .tabs {
        border-top: 1px solid darken(@gray-lighter, 5%);
        padding: @t3-global-padding 0;
        overflow: inherit;
      }

      .buttonBar-right {
        float: none;
      }
    }

    // Tab2
    #tab-2 {
      td.key {
        width: 200px;
      }

      td {
        padding: 5px;
        border: 0;

        &.labelcell {
          width: 30%;
        }
      }

      .inputbox,
      input[type="text"] {
        width: 250px;

        &[type="checkbox"] {
          width: auto;
        }

        &#upload {
          border: none;
          box-shadow: none;
          width: auto;
          height: auto;
        }
      }

      .checkboxes {
        .radio {
          padding-left: 20px;
          font-weight: @font-weight-light;
        }

        button {
          .button-variant(@btn-inverse-color; @btn-inverse-bg; @btn-inverse-border);
          background-image: none;
          border-radius: 0;
          border-style: inherit;
          display: inline-block;
          padding: (@t3-global-padding / 4) @t3-global-padding/2;
          text-transform: uppercase;
          height: 40px !important;
        }
      }

      legend {
        font-size: @font-size-base;
        font-weight: @font-weight-bold;
        padding-bottom: 5px;
      }

      .ui-autocomplete-input {
        display: inline-block;
        height: 40px !important;
      }

      #ImagesContainer {
        margin: @t3-global-margin 0;
      }
    }

    #adminForm >.buttonBar-right {
      float: none;

      + a {
      margin-right: @t3-global-margin;
      }
    }
  }

  // SHOPPING CART
  // -----------------------------
  &.view-cart {

    .vm-button-correct {
      .button-variant(@btn-primary-color; @btn-primary-bg; @btn-primary-border);
      border-radius: 0;
      border-style: inherit;
      display: inline-block;
      font-size: @t3-font-size-smaller;
      padding: (@t3-global-padding / 4) @t3-global-padding / 2;
      text-transform: uppercase;
    }

    .continue_link {
      .button-variant(@btn-default-color; @btn-default-bg; @btn-default-border);
      border-radius: 0;
      border-style: solid;
      border-width: 1px;
      display: inline-block;
      font-size: @t3-font-size-small;
      padding: (@t3-global-padding / 4) @t3-global-padding/2;
      text-transform: uppercase;
      margin-bottom: @t3-global-margin/2;
    }

    .post_payment_order_total {
      margin-bottom: @t3-global-margin;
    }

    .cart-view {

      h1 {
        color: @gray-darker;
        margin-bottom: @t3-global-margin;
        font-size: @font-size-h1;
        text-transform: uppercase;
      }

      > h3 {
        font-size: @font-size-h4;
        margin-bottom: @t3-global-margin;
      }

      .vm-cart-header-container {
        .vm-continue-shopping {
          margin: 0;
        }
      }

      .vm-fieldset-pricelist {
        border: 0;
        
        h3 {
          font-size: @t3-font-size-smaller;
          font-weight: @font-weight-normal;
          margin-top: @t3-global-margin/3;
          color: @gray-light;
        }

        .sectiontableentry2 {
          .coupon {
            @media screen and (max-width: @screen-xs-max) {
              width: auto;
            }
          }
        }
      }

      .vm-display {
        white-space: nowrap;
      }

      textarea#customer_note_field {
        min-height: 200px;
      }

      form.inline {
        table {
          @media screen and (max-width: @screen-xs-max) {
            width: 100%;
          }

          td {
            padding-right: 10px;
            @media screen and (max-width: @screen-xs-max) {
              display: block;
              padding-top: 10px;
            }
          }
        }

        input[type="text"] {
          display: inline-block;
          vertical-align: top;

          @media screen and (max-width: @screen-xs-max) {
            width: auto;
          }
        }

        .button {
          @media screen and (max-width: @screen-xs-max) {
            margin-left: 0;
          }
        }
      }

      // Bill to - Ship to
      // -----------------
      .billto-shipto {
        border-bottom: 0;
        margin-bottom: @t3-global-margin;

        span {
          font-size: @font-size-large;
          .vmicon {
            display: none;
          }
        }

        .output-billto span {
          font-size: @font-size-base;
        }

        .output-shipto {
          color: @gray-light;
        }

        a.details {
          background: transparent;
          border: 0;
          border-radius: 0;
          color: @link-color;
          padding: 0;

          &:hover, &:focus, &:active {
            color: @link-hover-color;
          }
        }

      }

      // Cart Summary Table
      .cart-summary {

        tr th {
          background: @gray-dark;
          color: @white;
          font-weight: normal;
          padding: 10px (@t3-global-padding / 2);
          text-align: center;

          &:nth-child(4) {
            width: 180px !important;
          }

          @media screen and (max-width: @screen-xs-max) {
            padding-right: @t3-global-padding/10;
            font-size: @font-size-small - 1px;
          }
        }

        tr td {
          border-color: @t3-border-color;
          padding: 10px (@t3-global-padding / 2);
          text-align: center;

          &:nth-child(1) {
            text-align: left;
          }

          hr {
            display: none;
          }

          @media screen and (max-width: @screen-xs-max) {
            font-size: @font-size-small - 1px;
          }
        }

        .quantity-input {
          display: inline-block;
          vertical-align: middle;
          border-radius: 0;
        }

        .cart-images {
          display: block;
          float: left;
          margin: 5px 10px 0 0;

          img {
            border: 1px solid lighten(@gray-light, 15%);
            float: none;
            margin: 0;
            padding: 0;
          }
        }

        .PricesalesPrice {
          font-weight: @font-weight-medium;
          text-transform: uppercase;
        }

        .vm-customfield-cart {
          font-size: @font-size-small;
        }

        span.vm-price-desc {
          margin: 0;
        }

        .coupon {
          display: inline;
          vertical-align: top;
        }

        span.details-button input.details-button {
          .button-variant(@btn-inverse-color; @btn-inverse-bg; @btn-inverse-border);
          border-radius: 0;
          border-style: inherit;
          display: inline-block;
          padding: 6px 12px;
          font-size: @font-size-small;
          font-family: @font-family-sans-serif;
          font-weight: @font-weight-bold;
          text-transform: uppercase;
          background-image: none;
          height: @input-height-base;
        }
      }

      div.terms-of-service {
        display: block;
        margin: 0;
      }

      .billto-shipto {
        padding-top: @t3-global-padding;
        
        label.radio {
          padding-left: 20px;
        }

        .output-shipto input[type="checkbox"] {
          margin-left: @t3-global-margin/3;
        }
      }
    }

    #com-form-login {

      input[type="checkbox"] {
        display: inline-block;
        line-height: 1;
        vertical-align: middle;
      }

      input[type="submit"] {
        .button-variant(@btn-inverse-color; @btn-inverse-bg; @btn-inverse-border);
        border-radius: 0;
        border-style: inherit;
        display: inline-block;
        padding: (@t3-global-padding / 4) @t3-global-padding/2;
        font-size: @font-size-small;
        font-family: @font-family-sans-serif;
        font-weight: @font-weight-bold;
        text-transform: uppercase;
        margin-bottom: @t3-global-margin/2;
        margin-right: 5px;
      }

      #com-form-login-username,
      #com-form-login-password {
        .inputbox {
          width: 100%;
        }
      }
    }

  // end view cart
  }


  // Pagination
  // ---------------------------
  .vm-pagination {
    float: none;

    ul {
      float: left;
      padding: 0;
      margin: 0;
    }

    .vm-page-counter {
      color: @gray-light;
      font-family: @font-family-sans-serif;
    }

    &.vm-pagination-top {
      float: left;
      margin-left: @t3-global-margin/2;

      ul {
        line-height: 40px;
        > li {
          > a,
          > span {
            background: none;
            border: 0;
            color: @gray;
            font-size: @t3-font-size-small;
            margin-right: @t3-global-margin/3;
            padding-left: 0;
            padding-right: 0;
            
            &:hover,
            &:focus {
              color: @link-color;
            }
          }

          > span {
              color: @link-color;
          }

          &.pagination-start,
          &.pagination-prev,
          &.pagination-next,
          &.pagination-end {
            span {
              color: @gray-light;
            }
          }
        }
      }

      .vm-page-counter {
        display: none;
      }
    }

    &.vm-pagination-bottom {
      .clearfix();

      @media screen and (min-width: @screen-md) {
        margin-top:@t3-global-padding*3;
      }

      ul {
        .clearfix();
        float: none;

        > li {
          display: inline-block;
          margin: 0 8px 10px 8px;
          > a {
            background-color: @gray-light-lv3;
            border: none;
            color: @text-color;
            float: left;
            line-height: 2;
            padding: 5px 15px;
            margin: 0;
            position: relative;
            text-decoration: none;
            text-transform: uppercase;
            
            &:hover,
            &:focus {
              background-color: @gray-lighter;
              color: @link-hover-color;
            }
          }

          > span {
            background-color: @brand-primary;
            border: none;
            color: @white;
            float: left;
            line-height: 2;
            padding: 5px 15px;
            margin: 0;
            position: relative;
            text-decoration: none;
            text-transform: uppercase;
          }

          &.pagination-start,
          &.pagination-prev,
          &.pagination-next,
          &.pagination-end {
            span {
              background-color: @gray-light-lv3;
              color: @gray-light;
            }
          }
        }
      }

      ul + .vm-page-counter {
        color: @gray-light;
        float: none;
      }
    }

  }
}


// ---------------------------------------------------------
// VIRTUEMART HOME
// ---------------------------------------------------------
#shop {
	padding-top: 75px;
	padding-bottom: 75px;
	background: #f0f3f8;
}

#shop.new-home {
	padding-top: 125px;
	padding-bottom: 85px;
	background: #f0f3f8;
}

.shop-title {
	text-align: center;
}

.shop-title .main-title h2 {
	
}
.shop-title .main-title h2 a {
	color: @text-color;
  font-weight: @font-weight-bold;
}

.shop-title .main-title h2 a:hover {
	color: #f89777 ;
}

.new-home .shop-title .main-title h2 a {
	color: @text-color;
  font-size: 35px;
  font-weight: @font-weight-bold;
}

.shop-title .main-title h2 span {
	color: @text-color;
   font-weight: @font-weight-normal;
}

.new-home .shop-title .main-title h2 span {
	color: @text-color;
  font-weight: @font-weight-normal;
}

.new-home .shop-title {
    max-width:540px;
    margin:0 auto;
}

.new-home .shop-title .main-title {
    margin-bottom:15px;
}

.divide-short-bl {
	max-width: 220px;
	height: 17px;
	background: url(images/divide-sh-bl.png) center;
	margin: 20px auto 50px;
}

.shop-fade-wrap {
	position: relative;
}

.shop-fade-wrap:after {
	content:"";
	display:block;
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	background:#FFFFFF;
	padding-bottom:75px;
	opacity:0;
	transition:all .3s ease;
	-moz-transition:all .3s ease;
	-webkit-transition:all .3s ease;
}

.shop-fade:hover .shop-fade-wrap:after {
	opacity: 0;
	transition:all .3s ease;
	-moz-transition:all .3s ease;
	-webkit-transition:all .3s ease;
}

.shop-fade-ct {
	position:absolute;
	margin:0 auto;
	left:0;
	right:0;
	bottom:0;
	z-index:1;
	opacity:0;
	transition:all .3s ease;
	-moz-transition:all .3s ease;
	-webkit-transition:all .3s ease;
}

.shop-fade:hover .shop-fade-ct {
	opacity:10;
}

.shop-fade-wrap img {
	width:100%;
	height:auto;
}

.product-box {
    background: @white;
    box-shadow: 2px 2px 1px rgba(84,84,84, .1);
    -moz-box-shadow: 2px 2px 1px rgba(84,84,84, .1);
    -webkit-box-shadow: 2px 2px 1px rgba(84,84,84, .1);
    border-top: 3px solid @link-hover-color;
}

.prdct-desc {
    padding: 0px @t3-global-padding;
}

.prdct-desc .inner{
    border-bottom: 1px solid #dfdfdf;
}

.prdct-name {
    font-size: 18px;
    text-transform: uppercase;
    color: @text-color;
    font-family: @font-family-sans-serif;
    font-weight: @font-weight-bold;
    margin-top: 5px;

    a {
      display: block;
      .text-overflow();
    }
}

.prdct-box-outer{
  margin-top:50px;

  .vmheader {
    float: none;
    margin-left: auto;
    margin-right: auto;
  }
}

.pricing {
    padding:15px 0;
}

.prdct-price {
    font-size: 21px;
    color: @text-color;
    font-family: @font-family-sans-serif;
    font-weight: @font-weight-normal;
    float: left;
    padding-top: 5px;
}

.btn-buy {
    background: #fee253;
    float: right;
    font-family: @font-family-sans-serif;
    color: #fff;
    text-transform: uppercase;
    font-weight: @font-weight-bold;
    padding: 10px 20px;
}

.btn-buy:hover {
  background: #f5d013 ;
  color: #fff;
}

.prdct-thumb {
  text-align: center;
  padding: 0 5px;
}

.prdct-thumb img {
  display: inline-block;
  max-width: 100%;
}

span.quantity-controls input.quantity-plus,
span.quantity-controls input.quantity-minus {
  padding: 0;
}


// Virtuemart Modules
// ------------------
.vmgroup {
  .vmheader {
    text-align: center;
    margin-bottom: @grid-gutter-width;
    margin-top: -@grid-gutter-width;
  }

  .vmproduct {
    &.productdetails {
      clear: both;

    	.shop-ct {
        margin-bottom: @grid-gutter-width;
        
	      .product-box {
	        .prdct-desc {
	          .prdct-name {
	            a {
	              color: @text-color;
	              .transition(all .2s linear);
	            }
	          }
	        }

	        &:hover {
		        .prdct-name a {
		          color: @link-hover-color;
		        }
		      }
	      }

	     .post-content {
        	border-bottom: 1px solid @t3-border-color;
        	padding-bottom: @t3-global-padding/2;
        	margin-bottom: @t3-global-padding/2;
        }

        .PricesalesPrice {
        	display: inline-block;
        	vertical-align: middle;
        	font-size: @font-size-h4;
        }

        .addtocart-area {
        	display: inline-block;
        	float: right;
        	margin-bottom: @t3-global-margin;
          margin-top: 0;

          .vm-customfields-wrap {
            .radio, .checkbox {
              margin-top: 0;
              margin-bottom: 0;
            }

            .radio input[type="radio"], 
            .radio-inline input[type="radio"], 
            .checkbox input[type="checkbox"], 
            .checkbox-inline input[type="checkbox"] {
              margin-left: 0;
              margin-right: @t3-global-margin/2;
              position: static;
            }
          }

        	.quantity-box,
        	.quantity-controls {
        		display: none;
        	}

        	.addtocart-bar {
        		margin: 0;
            text-align: left;
        	}

        	input.addtocart-button {
        		border-radius: 0;
            .button-variant(@btn-primary-color; @btn-primary-bg; @btn-primary-border);
        	}
        }

	      &:first-child {
	      	.product-box {
		      	border-color: @orange;

            &:hover {
              .prdct-name a {
                color: @orange;
              }
            }

		      	input.addtocart-button {
              .button-variant(@btn-danger-color; @btn-danger-bg; @btn-danger-border);
		      	}
		      }
	      }

	      .inner {
	      	border: 0;
	      	.clearfix();
	      }
      }
     
    }
  }
}


// ---------------------------------------------------------
// VIRTUEMART MODULES
// ---------------------------------------------------------

// VM CURRENCY
// -------------
.vm-currency-selector {
  #virtuemart_currency_id_chzn {
    margin: @t3-global-margin 0 @t3-global-margin/2;
  }
}


// VM SEARCH
// --------------
#mod_virtuemart_search {
  padding-right: @t3-global-padding;
  background-image: url("../@{t3-image-path}/ico/magnify.png");
  background-repeat: no-repeat;
  background-position: right center;
  width: 100%;
}


// VM MENU
// -----------
ul.VMmenu {
  list-style-image: url("../@{t3-image-path}/ico/list-7_ltr.png");
  margin: 0;
  padding-left: @t3-global-padding/2;

  li {
    padding: 0;
    
    a {
      color: @gray;

      &:hover, &:focus, &:active {
        color: @link-hover-color;
      }
    }
  }
}


// VM SHOPPING CART
// -------------------
.vmCartModule {
  .vm_cart_products {
    border-bottom: 1px solid @t3-border-color;
    padding-bottom: @t3-global-padding/2;
    margin-bottom: @t3-global-margin/2;

    br {
      display: none;
    }
  }

  .product_row {
    .clearfix();

    .customProductData {
      clear: both;
    }
  }

  .show_cart a {
    display: block;
    padding: @t3-global-padding/3;
    text-transform: uppercase;
    background: @brand-primary;
    border-color: @brand-primary;
    line-height: 1;
    font-size: @font-size-base;
    color: @gray-dark-lv2;
    text-align: center;
    width: 100%;
    float: none;
    margin-top: @t3-global-margin;

    &:hover, &:focus, &:active {
      background-color: darken(@brand-primary, 10%);
    }
  }
}


// VM PRODUCT IN SIDEBAR
// -------------------------
.t3-sidebar {
  .vmproduct {
    padding: 0;
    list-style: none;
    margin-bottom: @t3-global-margin;
    .clearfix();

    &:last-child {
      display: none;
    }

    .center {
      text-align: left;
    }

   .clear {
      display: none;
    }

    > li > a,
    .spacer > a {
      float: left;
      font-size: @font-size-h5;
      text-transform: uppercase;
      color: @gray-dark-lv2;

      &:hover, &:focus, &:active {
        color: @link-hover-color;
      }

      & ~ a {
        float: none;
      }

      img {
        width: 66px;
        margin-right: @t3-global-margin/2;
      }
    }

    .addtocart-area {
      margin: 0;
    }

    .addtocart-bar {
      margin-top: @t3-global-margin/2;
    }

    span.quantity-box,
    .quantity-controls {
      display: none;
    }

    .PricesalesPrice {
      font-weight: @font-weight-bold;
    }
  }
}

// POPUP
.window-mainbody {
  // Mobile view
  @media (max-width: @screen-xs-max) {
    .manufacturer-description,
    .manufacturer-product-link {
      display: none;
    }

    .manufacturer-image img {
      margin: 0;
      width: 100%;
    }
  }
}