/*
Title: "TaylorBarton.com" responsive styles
Date Modified: 6/4/2016
Date Created: 5/21/2016
--
Author: Fervr Design
Contact: http://fervr.co/contact
--
*/


/* Responsive styles 
------------------------------------- */

@media all and (min-width: 1480px) { /* large screen size */

	#wrapper {
		max-width: 1200px;
	}

}


@media all and (max-width: 930px) { /* medium screen size */

	/* 12 column grid */
	.column, 
	.column.span1-med {
		width: 8.33%;
		}

	.column.span2-med {
		width: 16.66%;
		}

	.column.span3-med {
		width: 24.99%;
		}
	
	.column.span4-med {
		width: 33.32%;
		}
	
	.column.span5-med {
		width: 41.65%;
		}
	
	.column.span6-med {
		width: 49.98%;
		}
	
	.column.span7-med {
		width: 58.31%;
		}
	
	.column.span8-med {
		width: 66.64%;
		}
	
	.column.span9-med {
		width: 74.97%;
		}
	
	.column.span10-med {
		width: 83.3%;
		}
	
	.column.span11-med {
		width: 91.63%;
		}
	
	.column.span12-med {
		width: 99.96%;
		}

	.hide-med {
		display: none;
		}

}


@media all and (max-width: 820px) {

	#logo, 
	#logo a {	
		font-size: 32px;
		display: block;
		position: static;
		left: 0;
		top: 0;
		margin: 10px 10px;
		width: 100%;
		}

	#main-navigation-trigger {
		display: block;
		}


	#main-nav {
		display: none;
		z-index: 1;
		position: absolute;
		top: 75px;
		left: 0;
		right: 0;
		float: none;
		width: 100%;
		margin: 0 auto;
		padding: 0;
		}

	#main-nav ul {
		list-style: none;
		margin: 0 auto;
		padding: 0;
		overflow: auto;
		border: 1px solid rgba(0,0,0,0.25);
		border-width: 1px 0 0;
		box-shadow: 1px 1px 5px rgba(0,0,0,0.5);
		border-radius: 0;
		}

	#main-nav ul li {
		float: none;
		margin: 0;
		padding: 0;
		list-style: none;
		font-size: 20px;
		text-align: left;
		line-height: 1.4;
		height: auto;
		background-color: rgba(255,255,255,0.95);
		}

	#main-nav ul li a {
		display: block;
		padding: 10px 15px;
		background-color: rgba(255,255,255,0.05);
		border: 1px solid rgba(0,0,0,0.25);
		border-width: 0 0 1px;
		}

	#main-nav ul li:first-child a {
		padding-left: 15px;
		}

	#main-nav ul li:last-child a {
		padding-right: 15px;
		}

		
}


@media all and (max-width: 680px) { /* small screen size */
		
	/* 12 column grid */
	.column, 
	.column.span1-sm {
		width: 8.33%;
		}

	.column.span2-sm {
		width: 16.66%;
		}

	.column.span3-sm {
		width: 24.99%;
		}
	
	.column.span4-sm {
		width: 33.32%;
		}
	
	.column.span5-sm {
		width: 41.65%;
		}
	
	.column.span6-sm {
		width: 49.98%;
		}
	
	.column.span7-sm {
		width: 58.31%;
		}
	
	.column.span8-sm {
		width: 66.64%;
		}
	
	.column.span9-sm {
		width: 74.97%;
		}
	
	.column.span10-sm {
		width: 83.3%;
		}
	
	.column.span11-sm {
		width: 91.63%;
		}
	
	.column.span12-sm {
		width: 99.96%;
		}

	.hide-sm {
		display: none;
		}


	#logo a img {
		margin-left: auto;
		margin-right: auto;
		text-align: center;
		display: block;
		}	

	table thead {
		display: none;
		}
	table tr,
	table th,
	table td {
		display: block;
		border: none;
		}
	table td {
		border-top: none;
		width: 100% !important;
		}
	table tr td:first-child {
		border-top: 1px solid #ccc;
		font-weight: bold;
		}
	
	.table-content.truncate {
		display: inline;
		max-width: auto;
		white-space: nowrap;
		overflow: visible;
		text-overflow: none;
		}

	.product .image { 
		width: 100% !important;
		position: static !important;
		left: 0 !important;
		top: 0 !important;
		text-align: center !important;
		margin-top: 7px !important;
		}

	.product .image img { 
		width: 80% !important;
		text-align: center !important;
		}

	.product .card-header, 
	.product .card-content { 
		margin-left: 0 !important;
		}
		
	.button {
		width: 100% !important;
	}
	
	.buy-widget {
		max-width: 100%;
	}
}

@media all and (min-width: 821px) {

	#main-nav {
		display: block !important;
		}
		
}