﻿@charset "utf-8";
/*@table-bg-hover:                #f5f5f5;*/
/* ---------------------------------------------------------------

 	Standard Bootstrap Media Queries 
    http://css-tricks.com/snippets/css/media-queries-for-standard-devices/    
    http://www.stephentgilbert.com/mediaqueries/
	http://code-tricks.com/css-media-queries-for-common-devices/
	http://scotch.io/quick-tips/css3-quick-tips/default-sizes-for-twitter-bootstraps-media-queries
	For "Mobile First" design approach - remove max-width and allow to cascade

	--------------------------------------------------------------- */
@media screen and (max-width: 767px) {
  /* --------------------------------------------------------------
	 * Heading Resizing
	 --------------------------------------------------------------- */
  h1 {
    font-size: 43px;
  }
  /* --------------------------------------------------------------
	 * Header
	 --------------------------------------------------------------- */
  #TopHeader .navbar-nav,
  #LogoBrand {
    float: none;
    text-align: center;
  }
  #LogoBrand {
    margin-bottom: 20px;
  }
  /* --------------------------------------------------------------
	 * Top Header - Dropdown Menu
	 --------------------------------------------------------------- */
  #TopHeader .navbar-nav > li {
    display: block;
    vertical-align: top;
  }
  #TopHeader .navbar-nav > li.dropdown ul.dropdown-menu {
    margin-bottom: 10px;
  }
  #TopHeader .navbar-nav > li.dropdown ul.dropdown-menu li a {
    text-align: center;
  }
  /* --------------------------------------------------------------
	 * Main Header - with cart, account toolbars
	 --------------------------------------------------------------- */
  #MainHeader .my-toolbar-container,
  #MainHeader .my-toolbar,
  #MainHeader .btn-group {
    /*float: none;*/
    text-align: center;
  }
  /* --------------------------------------------------------------
	 * Admin + CollectionBar - move the collection bar below the admin.
	 --------------------------------------------------------------- */
  #MenuNavBar + #CollectionNavBar.navbar-fixed-top {
    top: 94px !important;
    /* height of admin collapsed menu */
  }
  /* --------------------------------------------------------------
	 * Main Navigation - admin menu
	 --------------------------------------------------------------- */
  #MenuNavBar .navbar-header {
    padding: 10px 0 10px 0;
  }
  #MenuNavBar .navbar-header button.navbar-toggle span.icon-bar {
    width: 30px;
    border: 2px solid white;
    border-radius: 4px;
  }
  #MenuNavBar .navbar-collapse {
    border: none;
  }
  #MenuNavBar .navbar-nav {
    display: block;
    margin-top: 0;
    margin-bottom: 0;
  }
  #MenuNavBar .navbar-nav > li > a {
    float: left;
    width: 50%;
    display: block;
    padding: 12px 0 12px 0;
    font-size: 12px;
    border: solid 1px rgba(0, 0, 0, 0.1);
  }
  #MenuNavBar .navbar-nav > li.open > a {
    background-color: #0044fe;
  }
  #MenuNavBar .navbar-nav > li.open .dropdown-menu {
    display: inline;
  }
  /* --------------------------------------------------------------
	 * Main Shopping Navigation - collection links
	 --------------------------------------------------------------- */
  #CollectionNavBar {
    z-index: 90;
  }
  #CollectionNavBar .navbar-header {
    padding: 5px;
  }
  #CollectionNavBar .navbar-header button.navbar-toggle span.icon-bar {
    width: 30px;
    border: 2px solid #3269ff;
    border-radius: 4px;
  }
  #CollectionNavBar .navbar-nav {
    display: block !important;
    margin-top: 0;
    margin-bottom: 0;
  }
  #CollectionNavBar .navbar-collapse {
    text-align: center;
    border-top: none;
  }
  /* --------------------------------------------------------------
	 * ShopByMenu
	 --------------------------------------------------------------- */
  #ShopByMenuSection {
    text-align: center;
    padding-top: 20px;
    padding-bottom: 20px;
  }
  #ShopByMenuSection .row > div {
    padding-top: 40px;
    padding-bottom: 40px;
    text-align: center;
  }
  #ShopByMenuSection #ShopFor .row > div {
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: center;
  }
  #ShopByMenuSection #ShopFor hr {
    display: none;
  }
  #ShopByMenuSection #ShopFor .tag-list > li {
    float: left;
    width: 50%;
  }
  #ShopByMenuSection #CustomerCare .row > div {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  /* --------------------------------------------------------------
	 * Footer
	 --------------------------------------------------------------- */
  #Footer {
    text-align: center;
  }
  #Footer #FooterHead .row > div {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  #Footer #FooterHead .row > div.col-xs-24 {
    text-align: left;
  }
  #Footer #FooterFoot .row > div.col-xs-48 {
    text-align: center !important;
  }
  /* --------------------------------------------------------------
	 * Product Listing
	 --------------------------------------------------------------- */
  .product-container .row.row-product .col-image .product-image-container {
    margin: 0 auto;
    max-width: 80%;
  }
  .product-container .row.row-product .col-product {
    padding-top: 40px;
    text-align: center;
  }
  .product-container .row.row-product .col-product form {
    margin: 0 auto;
  }
  .product-container .row.row-product .col-product form .input-group {
    width: 100%;
    max-width: 100%;
  }
  .product-container .row.row-product .col-product form .form-actions {
    margin-top: 0;
    padding-top: 15px;
  }
  .product-container .row.row-product .col-product form .form-actions button {
    width: 100%;
  }
  /* --------------------------------------------------------------
	 * General Classes
	 --------------------------------------------------------------- */
  .wizard .tabbable a[data-toggle="tab"] h3 {
    margin-top: 10px;
    margin-bottom: 10px;
  }
  .wizard .tabbable a[data-toggle="tab"] p {
    display: none;
  }
  .form-entity h3 {
    text-align: center;
  }
  .row-upload [class*="col-"] {
    float: left;
  }
  .row-upload h5 small {
    display: block;
  }
  .row-upload a {
    white-space: normal;
  }
}
@media screen and (max-width: 480px) {
  /* --------------------------------------------------------------
	 * Grid Product Listing
	 --------------------------------------------------------------- */
  .product-list-container .grid .grid-item {
    height: 340px;
    max-height: 340px;
  }
}