/* Media Queries
---------------------------------------------------------------------------------------------------- */
/* Just smaller than set size of site ----------- */
@media only screen 
and (max-width : 1145px) {

	#container,
	#footer,
	#header,
	#menu-top,
	#form,
	table,
	ul,
	.wrapper,
	.pagetitle,
	.cycle,
	blockquote {
		max-width: 100%!important;
	}
	
	.wrapper,
	.pagetitle {width: 94%!important; padding-left: 3%; padding-right: 3%;}

	.right-side {width: 100%!important;}
	
	.social {position: absolute; top: 20px; right: 20px;}
	
	.list-item {width: 18%;}

#main-menu a {padding-left: 25px; padding-right: 25px;}
}

/* Smaller computers ----------- */
@media only screen 
and (max-width : 1050px) {

	.responsive-menu-icon,
	.responsive-menu-admin-icon{
		background:#75797e;
		cursor: pointer;
		display: block;
		text-align: center;
		padding: 5px;
	}
	
	.responsive-menu-icon {
		color: #fff;
	}
	
	.responsive-menu-admin-icon{
		background:#ccc;
	}
	
	#admin-menu.responsive-menu-admin ul li a  {
		background-color: #fff!important;
		color: #333;
		border-bottom: 1px solid #ccc; 
	}
	
	#admin-menu.responsive-menu-admin ul li ul {
		width: 100%!important;
	}

	#admin-menu.responsive-menu-admin ul li ul li a {
		border-bottom: 1px solid #ccc; 
		background-color: #efefef!important;
		color: #333;
	}

	#admin-menu.responsive-menu-admin ul li ul li a:hover {
		background-color: #ccc!important;
	}
	
	.responsive-menu,
	.responsive-menu-admin {
		display: none;
		margin: 0px;
	}

	.responsive-menu ul,
	.responsive-menu-admin ul {
		width:100%;
	}

	.responsive-menu li {
		width:100%;
		float:left;
		list-style: none;
		padding: 0px!important;
	}
	
	.responsive-menu-admin li {
		width:100%;
		display: block!important;
		list-style: none;
		padding: 0px!important;
	}
	
	.responsive-menu li:first-child,
	.responsive-menu-admin li:first-child {
		border-top: 1px solid #333!important;
	}

	.responsive-menu li:last-child,
	.responsive-menu-admin li:last-child {
		margin-bottom: 10px!important;
	}

	.responsive-menu li a {
		display: block;
		background:#75797e;
		padding:5px 10px 5px 10px;
		text-decoration: none;
		border-bottom: 1px dotted #fff;
		color: #fff!important;
	}
	
	.responsive-menu li a:hover {
		color: #333!important;
	}
	
	.responsive-menu-admin li a {
		display: block;
		background:#75797e;
		padding:5px 10px 5px 10px;
		text-decoration: none;
		border-bottom: 1px dotted #fff;
	}	

	.responsive-menu li a:hover,
	.responsive-menu-admin li a:hover {
		background:#999;
	}
	
	.responsive-menu li.home a {
		padding-left:50px!important;
	}
	
	nav#menu-top {display: none;}
	
	.social {width: auto; position: relative; top: auto;}
	
	.item {width: 28%; min-height: 360px;}
	.list-item {width: 36%; min-height: 340px;}
}


/* Smaller computers 950 ----------- */
@media only screen 
and (max-width : 950px) {

}

/* Smaller computers 900 ----------- */
@media only screen 
and (max-width : 900px) {

}

/* Old computers 800x600 ----------- */
@media only screen 
and (max-width : 800px) {
	.item {width: 44%;}
	.half {width: 100%; margin: 0;}
}

/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
	
	
}

/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
	
	
}

/* Android in Landscape ----------- */
@media only screen
and (max-width: 720px)
and (orientation : landscape) {

	
}

/* small tablet (portrait) ----------- */
@media only screen 
and (max-device-width : 600px) 
and (orientation : portrait) {

	
}

@media only screen 
and (max-width: 480px)  {
	
	/* Force table to not be like tables anymore */
	table, thead, tbody, th, td, tr { 
		display: block; 
	}
	
	table.shopping td:empty {
		display: none; 
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	thead tr, th { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	tr { border: 1px solid #ccc; }
	
	td { 
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee; 
		position: relative;
		padding-left: 50%; 
	}
	
	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;
		text-align: left;
		font-weight: bold;
	}
	
	/* Admin Table Styles */
	#productform td input.textfield-sm {width: 40%!important; display: inline-block!important;}
	#productform td {clear: both;}
	#productform td select {margin-top: 10px; margin-left: 0px!important;}
	#productform td input,
	#productform td select,
	#productform td textarea {display: block!important; float: none!important; } 
	
	/*
	Label the Agents Fees data
	*/
	table.agentsfees td:nth-of-type(1):before { content: "Price"; }
	table.agentsfees td:nth-of-type(2):before { content: "Agent Fee"; }
	table.agentsfees td:nth-of-type(3):before { content: "Admin"; }
	table.agentsfees td:nth-of-type(4):before { content: "Total Fee"; }
	table.agentsfees td:nth-of-type(5):before { content: ""; }
	table.agentsfees td:nth-of-type(6):before { content: "Price"; }
	table.agentsfees td:nth-of-type(7):before { content: "Agent Fee"; }
	table.agentsfees td:nth-of-type(8):before { content: "Price"; }
	table.agentsfees td:nth-of-type(9):before { content: "Total Fee"; }
	
	/* Label the Product Order Fields */
	table.shopping td.quantity {text-align: right;}
	table.shopping td.quantity:before { content: "Quantity"; }
	table.shopping td.price:before { content: "Price"; }
	table.shopping td.total-price:before { content: "Total Price"; }
	table.shopping td.sub.price:before { content: "Sub Total"; }
	table.shopping td.item:before { content: "Item"; }
	table.shopping td.total-price-title {display: none;}
	
	form input, form textarea, form select,
	#productform .selectfield, 
	#surveyform .selectfield,
	#contactform .textarea, #productform .textarea, #surveyform .textarea,
	#contactform .textfield, #productform .textfield, #surveyform .textfield {
		clear: left;
		width: 90%;
	}	
	
	table.prods td:nth-of-type(4):before { content: "Cost (each)"; }

	#designBrochures td textarea {margin-left: -350px; width: 250px!important;}
	
	.featured-listing ul,
	.paid-listing ul {
		-webkit-column-count: 1;
		-moz-column-count: 1;
		column-count: 1;
	}
	
	.social span {display: none;}

	.cycle blockquote:before {display: none;}
	.cycle blockquote p {padding-left: 50px; padding-top: 0px;}
	
	.inside-wrapper {min-height: 300px;}
	
	.item {width: 90%; margin-right: 0;}
	.list-item {width: 87%; min-height: auto;}
	
}

/* Smartphones (landscape) ----------- */
@media only screen 
and (max-width : 321px) {

	#container,
	#footer,
	#header,
	#menu-top,
	#form,
	table {
		max-width: 280px!important;
	}
	
	#facebook {display: none;}

	.left-column.top,
	.middle-column.top {clear: both; width: 250px!important;}
	
	#designBrochures td textarea {margin-left: -140px; width: 250px!important;}
	
	footer .left-side,
	footer .right-side {width: 100%; display: block; text-align: center;}
	blockquote:before {display: none;}
	
	.inside-wrapper {min-height: 350px;}
}

@media screen and (min-width: 1050px) {
	.responsive-menu-icon,
	.responsive-menu-admin-icon {
		display: none;
	}
}