/* --------------------------------------
=========================================
RESPONSIVE FIXES
=========================================
-----------------------------------------*/
@media (max-width: 1199px) {
	#footer img.logo {
	  width: 45%;
	}
	#footer p.copyright {
	  margin-top: 37px;
	  margin-bottom: 14px;
	}
}
@media (max-width: 991px) {
	#solution .selectors select {
	  font-size: 15px;
	}
	#footer img.logo {
	  width: 50%;
	}
	#trendsPage #welcome .panel p.small, #homeCraftPage #welcome .panel p.small {
	  margin-top: 16px;
	  margin-right: 40%;
	}
}
@media only screen and (max-width: 767px) {
	header .menuContainer .navbar {
		margin-bottom: 0;
	}
	.header .navbar-default .navbar-collapse {
		border: none;
		box-shadow: none;
	}
	#welcome h1 {
	  font-size: 68px;
	}
	#welcome img.bpLogo {
	  width: 40%;
	}
	#welcome p {
	  margin-top: 18px;
	}
	#footer img.logo {
	  width: 40%;
	}
	#footer img.masthead {
	  width: 150%;
	  overflow-x: hidden;
	  margin-left: -43%;
	}
	#modal-content h3 {
	  margin-top: 17px;
	  margin-left: 0;
	}
	#modal-content p {
	  margin-left: 0;
	}
	#modal-content a.btn {
	  float: left;
	  margin-left: 0;
	  margin-right: 10px;
	  font-size: 19px;
	  color: #f47b20;
	  line-height: 1.2;
	}
	#trendsPage #welcome h1, #homeCraftPage #welcome h1, #novationPage #welcome h1 {
	  font-size: 60px;
	}
	#trendsPage #welcome .leftContainer, #novationPage #welcome .leftContainer {
	  border-right: none;
	}
	#trendsPage #welcome .rightContainer, #novationPage #welcome .rightContainer {
	  border-left: none;
	}
	#trendsPage #welcome p.small {
	  text-align: center;
	}
	#trendsPage #welcome .panel p.small {
	  text-align:left;
	}
	#trendsPage #welcome .panel p.small {
	  margin-top: 0;
	}
	#homeCraftPage #welcome p.small {
	  text-align: left;
	}
	#homeCraftPage #welcome img.pulseFlours {
	  margin-bottom: 30px;
	}
	#novationPage #welcome img.nativeStarches {
	  width: 80%;
	  float: none;
	}
	#novationPage #welcome img.nonGmo {
	  width: 40%;
	  float: none;
	  margin-left: 0;
	  margin-top: 30px;
	}

	/* Force table to not be like tables anymore */
	table, thead, tbody, th, td, tr { 
		display: block; 
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	tr { border: 1px solid #ccc; }
	.table-striped>tbody>tr:nth-child(odd)>td {
	  background-color: transparent;
	  border: none;
	}
	.table-striped>tbody>tr:nth-child(even)>td {
	  background-color: transparent;
	  border: none;
	}
	.table-striped>tbody>tr:nth-child(odd) {
	  background-color: #feece4;
	  border: none;
	}
	.table-striped>tbody>tr:nth-child(even) {
	  background-color: #ffffff;
	  border: none;
	}
	tr.solutionHeaderMobile {
		background-color: #ffffff !important;
	}
	td.solutionName { 
		/* Behave  like a "row" */
		border: none;
		/*border-bottom: 1px solid #eee; */
		position: relative;
		padding-left: 50%;
	}
	.table>tbody>tr>td.functionContainer {
		width: 100%;
		display:block;
		text-align: center;
		line-height: 1;
		padding-bottom: 0;
		padding-top: 0;
		margin-bottom: 8px;
	}
	.table>tbody>tr>td.labelContainer {
		width: 50%;
		display:inline-block;
		border-right: 1px solid #f47b20 !important;
		text-align: right;
		line-height: 1;
		padding-bottom: 0;
		padding-top: 0;
		margin-bottom: 8px;
	}
	.table>tbody>tr>td.typeContainer {
		width: 50%;
		display:inline-block;
		text-align: left;
		line-height: 1;
		padding-bottom: 0;
		padding-top: 0;
		margin-bottom: 8px;
	}
	
	td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
	}
	#solution .selectors {
	  padding-top: 5px;
	  padding-bottom: 5px;
	}
	#solution .selectors select {
	  margin-top: 5px;
	  margin-bottom: 5px;
	}
	#applicationSelect {
	  width: calc(100% - 30px);
	  margin-left: 15px;
	  margin-right: 15px;
	}
	#functionalitySelect {
	  width: calc(100% - 30px);
	  margin-left: 15px;
	  margin-right: 15px;
	}
	#labelSelect {
	  width: calc(100% - 30px);
	  margin-left: 15px;
	  margin-right: 15px;
	}
	#typeSelect {
	  width: calc(100% - 30px);
	  margin-left: 15px;
	  margin-right: 15px;
	}
	#itemList td {
		font-size: 17px;
	}
	#itemList td.solutionName {
	  font-size: 24px;
	  text-align: center;
	  padding-left: 0;
	}
}
@media (max-width: 600px) {
	.header .navbar .nav,.header .navbar .nav > li {
	  display: block;
	  text-align: right;
	}
	.header .navbar-default .navbar-nav > li > a:hover {
	  border-bottom: none;
	}
	.header .navbar-default .navbar-nav > li > a.active {
	  border: none;
	  cursor: default;
	  color: #fbb595;
	  font-style: italic;
	}
	.header .navbar-inner {
	  text-align: right;
	}
	#welcome h1 {
	  font-size: 57px;
	}
	#trendsPage #welcome h1, #homeCraftPage #welcome h1, #novationPage #welcome h1 {
	  font-size: 50px;
	}
	#welcome img.bpLogo {
	  width: 47%;
	}
	#footer img.logo {
	  width: 50%;
	}
	#footer img.masthead {
	  width: 180%;
	  overflow-x: hidden;
	  margin-left: -68%;
	}
	#trendsPage #welcome .panel p.small {
	  margin-right: 19px;
	  margin-top: 10px;
	}
}
@media (max-width: 480px) {
	#welcome h1 {
	  font-size: 46px;
	}
	#trendsPage #welcome h1, #homeCraftPage #welcome h1, #novationPage #welcome h1 {
	  font-size: 40px;
	}
	#footer img.logo {
	  width: 60%;
	  margin-top: 42px;
	}
	#trendsPage #welcome h4 {
	  margin-left: 12px;
	}
	#homeCraftPage #welcome h4 {
	  margin-left: 12px;
	}
	#trendsPage #welcome .panel h3 {
	  font-size: 75px;
	}
	#trendsPage #welcome .panel p {
	  margin-left: 12px;
	}
	#trendsPage #welcome .panel p.small {
	  margin-left: 0;
	}
	#homeCraftPage #welcome h3 {
		text-align: center;
	}
	#homeCraftPage #welcome p.small {
		text-align: center;
	}
}
@media (max-width: 375px) {
	#welcome h1 {
	  font-size: 40px;
	}
	#trendsPage #welcome h1, #homeCraftPage #welcome h1, #novationPage #welcome h1 {
	  font-size: 35px;
	}
	#welcome img.bpLogo {
	  width: 42%;
	}
	#welcome p {
	  font-size: 17px;
	}
	#trendsPage #welcome .panel h3 {
	  margin-top: 20px;
	}
}