/* PRO Theme Responsive CSS 
-------------------------------------------------------------- */

@media (max-width: 480px) {
  body {
    padding-left: 0px;
    padding-right: 0px;
  }
	.outercontainer {
	  width: auto;
		margin: 0 auto;
		padding-left: 10px;
		padding-right: 10px;
	}
  .aq-template-wrapper [class*="aq_span"] {
    margin-bottom: 10px;
    float: none !important;
    width: 100% !important;
  }
  .span-box-container .span-box {
      margin: 0px !important; 
      float: none !important;
      width: 100% !important;
  }
  form.sa-form [class*="width"] {
    width: 100% !important;
    *width: 99.94680851063829% !important;
    float: none;
  }
  .cross-selling-modal.modal {
    max-width: 460px !important;
    top: 10px !important;
    left: 10px !important;
    right: 10px !important;
  }
  .cross-selling-modal .modal-header .close {
    padding: 10px;
    margin: -10px;
  }
  #header-wrapper.header-style-3 .pro-site-logo {
    margin: 0px;
    margin-bottom: 15px;
    float: none;
    text-align: center;
  }
  #header-wrapper.header-style-3 .pro-site-logo .pro-logo-tagline {
    display: block;
    margin: 5px 0px;
  }
  #header-wrapper.header-style-3 .main-menu-holder .tinynav {
    width: 100%;
    display: block;
  }
  #header-wrapper.header-style-3 .main-menu-holder #main-nav-menu { 
    display: none;
  }
}

@media (min-width: 481px) and (max-width: 575px) {

}

@media (min-width: 481px) and (max-width: 767px) {
	body {
  	padding-left: 0px;
  	padding-right: 0px;
	}
	.outercontainer {
  	width: auto;
	  margin: 0 auto;
	  padding-left: 10px;
	  padding-right: 10px;
	}
  .aq-template-wrapper [class*="aq_span"] {
    margin-bottom: 10px;
    float: none !important;
    width: 100% !important;
  }
  .span-box-container .span-box {
    margin: 0px !important;
    width: 49.888889999% !important;
    *width: 49.888889999% !important;
  }
  #pro-product-grid > .row-fluid > .span6,
  #pro-product-grid > .row-fluid > .span3 {
    float: left;
    margin: 0.498888%;
    margin-bottom: 10px;
    width: 48.93617021276595%;
    *width: 48.88297872340425%;
  }
  form.sa-form [class*="width"].mobile-full-width {
    width: 100% !important;
    *width: 99.94680851063829% !important;
    float: none;
  }
  form.sa-form [class*="width"] {
    width: 49.888889999% !important;
    *width: 49.888889999% !important;
    float: none;
  }
  .cross-selling-modal.modal {
    position: fixed !important;
    max-width: 560px !important;
    top: 20px !important;
    left: 20px !important;
    right: 20px !important;
    width: auto !important;
    margin: 0 !important;
  }
  .cross-selling-modal.modal.fade {
    top: -100px;
  }
  .cross-selling-modal.modal.fade.in {
    top: 20px;
  }
  #header-wrapper.header-style-3 .pro-site-logo {
    margin: 0px;
    margin-bottom: 15px;
    float: none;
    text-align: center;
  }
  #header-wrapper.header-style-3 .pro-site-logo .pro-logo-tagline {
    display: block;
    margin: 5px 0px;
  }
  #header-wrapper.header-style-3 .main-menu-holder .tinynav {
    width: 100%;
    display: block;
  }
  #header-wrapper.header-style-3 .main-menu-holder #main-nav-menu { 
    display: none;
  }
}

@media (min-width: 768px) and (max-width: 979px) {
  	.outercontainer {
    	width: 754px;
	   margin: 0 auto;
  	}
    .span-box-container .span-box {
      margin: 0px !important;
    }
}

@media (min-width: 980px) and (max-width: 1200px) {
    .span-box-container .span-box {
      margin: 0px !important;
    }
}

@media (min-width: 1200px) {
  	.outercontainer {
    	width: 1210px;
		  margin: 0 auto;
  	}
    .span-box-container .span-box {
      margin: 0px !important;
    }
}