DIV.phoneGrid 				{margin:50px 0; font-size:0;}

DIV.phoneGrid DIV.filterBy	{font-size:18px; line-height:100%; margin-bottom:5px; color:#363636;}

DIV.phoneGrid DIV.phoneColumn				{display:none;}
DIV.phoneGrid DIV.noResults 				{display:none;}
DIV.phoneGrid DIV.noResults	P				{font-size:16px; max-width:600px;}
DIV.phoneGrid DIV.noResults BUTTON			{font-size:16px; display:inline; background:none; border:none; text-decoration:underline; cursor:pointer;}


@media (max-width: 599px) {
DIV.phoneGrid DIV.filterColumn 			{display:block; margin-bottom:20px;}
DIV.phoneGrid DIV.phoneColumn.visible 	{display:block; margin-left:-20px;} 
DIV.phoneGrid DIV.noResults.visible		{display:block;}

DIV.phoneGrid #phoneGridFilters.open BUTTON.header		{border-bottom:1px solid #b7b7b7;}

DIV.phoneGrid #phoneGridFilters DIV.category			{display:none;}
DIV.phoneGrid #phoneGridFilters.open DIV.category		{display:block;}

DIV.phoneGrid #phoneGridFilters BUTTON.reset			{display:none;}
DIV.phoneGrid #phoneGridFilters.open BUTTON.reset		{display:block;}
DIV.phoneGrid DIV.filterBy								{display:none;}
}

@media (min-width: 600px) {
DIV.phoneGrid DIV.filterColumn 	{display:inline-block; vertical-align:top; width:230px;}
DIV.phoneGrid DIV.phoneColumn.visible, 
DIV.phoneGrid DIV.noResults.visible		{display:inline-block; vertical-align:top; width:calc(100% - 230px);}
DIV.phoneGrid DIV.noResults	P 			{margin-left:20px;}

DIV.phoneGrid #phoneGridFilters BUTTON.header		{display:none;}
}


DIV.phoneGrid DIV.phone				{display:inline-block; vertical-align:top; background:linear-gradient(to bottom, #e7e7e7 0%, #ffffff 100%);}

@media (max-width: 767px) {
DIV.phoneGrid DIV.phone				{width:calc(50% - 20px); margin-left:20px; margin-bottom:20px;}
}

@media (min-width: 768px) and (max-width:1023px) {
DIV.phoneGrid DIV.phone				{width:calc(33.33% - 20px); margin-left:20px; margin-bottom:20px;}
}

@media (min-width: 1024px) {
DIV.phoneGrid DIV.phone				{width:calc(25% - 20px); margin-left:20px; margin-bottom:20px;}
}

DIV.phoneGrid DIV.phone A.phone 	{display:block; text-decoration:none;}


DIV.phoneGrid DIV.phone	DIV.image	{height:230px; position:relative; background-size:auto 200px; background-position:center center; background-repeat:no-repeat;}

DIV.phoneGrid DIV.phone DIV.banner 	{position:absolute; left:0; top:0; background-image:url(/img/phones/banner.png);
									width:63px; height:63px; background-repeat:no-repeat; background-position:-100% -100%;}

DIV.phoneGrid DIV.phone DIV.banner.new 		{background-position:100% 0;}
DIV.phoneGrid DIV.phone DIV.banner.soon 	{background-position:0 0;}

DIV.phoneGrid DIV.phone DIV.margin		{margin:0 15px;}
DIV.phoneGrid DIV.phone	DIV.name		{color:#336699; font-size:24px; line-height:normal; margin:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
DIV.phoneGrid DIV.phone DIV.name SUP 	{font-size:0.6em; line-height:130%; display:inline-block; vertical-align:top;}
DIV.phoneGrid DIV.phone	DIV.model		{color:#336699; font-size:18px; line-height:normal; margin:0 0 20px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

DIV.phoneGrid DIV.phone DIV.features							{text-justify:distribute; text-align:justify; margin:0 0 20px;}
DIV.phoneGrid DIV.phone DIV.features:after						{content:""; display:inline-block; width:100%;}
DIV.phoneGrid DIV.phone DIV.features DIV.feature 				{display:inline-block; width:calc((100% - 12px)/3); vertical-align:top;}
DIV.phoneGrid DIV.phone DIV.features DIV.feature DIV.icon		{width:100%; padding-bottom:100%; position:relative; margin-bottom:4px;}
DIV.phoneGrid DIV.phone DIV.features DIV.feature DIV.icon>DIV 	
	{width:100%; height:100%; background:#cecece; border-radius:100%; 
	position:absolute; left:0; top:0;}
DIV.phoneGrid DIV.phone DIV.features DIV.feature DIV.icon>DIV>DIV
	{position:absolute; width:60%; height:60%; left:20%; top:20%; background-repeat:no-repeat;
	background-image:url(/img/global/phone/features-sprite.png); background-size:800% 100%; background-position:-100% 0;}

DIV.phoneGrid DIV.phone DIV.features DIV.feature.android DIV.icon>DIV>DIV		{background-position:0 0;}
DIV.phoneGrid DIV.phone DIV.features DIV.feature.smartphone DIV.icon>DIV>DIV	{background-position:14.2857% 0;}
DIV.phoneGrid DIV.phone DIV.features DIV.feature.camera DIV.icon>DIV>DIV		{background-position:28.5714% 0;}
DIV.phoneGrid DIV.phone DIV.features DIV.feature.flip DIV.icon>DIV>DIV			{background-position:42.8571% 0;}
DIV.phoneGrid DIV.phone DIV.features DIV.feature.bar DIV.icon>DIV>DIV			{background-position:57.1429% 0;}
DIV.phoneGrid DIV.phone DIV.features DIV.feature.qwerty DIV.icon>DIV>DIV		{background-position:71.4287% 0;}
DIV.phoneGrid DIV.phone DIV.features DIV.feature.brew DIV.icon>DIV>DIV			{background-position:85.7143% 0;}

DIV.phoneGrid DIV.phone DIV.features DIV.feature DIV.label		{font-size:12px; color:#363636; line-height:100%; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

DIV.phoneGrid DIV.filters 										{border:1px solid #b7b7b7;}
DIV.phoneGrid DIV.filters BUTTON 								{display:block; width:100%; text-align:left; text-indent:20px;
																font-size:15px; line-height:48px; height:48px; text-transform:uppercase; color:363636;
																position:relative; background:#dadada; cursor:pointer;}
DIV.phoneGrid DIV.filters BUTTON:before							{position:absolute; width:13px; height:8px; content:""; background:url(/img/phones/carat.gif); right:15px; top:20px;}
DIV.phoneGrid DIV.filters BUTTON.header 						{background:linear-gradient(to bottom, #ffffff 0%, #e6e6e6 100%);}
DIV.phoneGrid DIV.filters FORM.open BUTTON.header:before		{transform:rotate(180deg);}
DIV.phoneGrid DIV.filters BUTTON.reset	 						{background:#e6e6e6; color:#336699; border-bottom:none;}
DIV.phoneGrid DIV.filters BUTTON.reset:before					{display:none;}
DIV.phoneGrid DIV.filters DIV.category							{background:#f3f3f3; border-bottom:1px solid #b7b7b7;}
DIV.phoneGrid DIV.filters DIV.category.open BUTTON 				{margin-bottom:18px; border-bottom:1px solid #b7b7b7;}
DIV.phoneGrid DIV.filters DIV.category.open BUTTON:before		{transform:rotate(180deg);}
DIV.phoneGrid DIV.filters DIV.category DIV.checkbox					{display:none;}
DIV.phoneGrid DIV.filters DIV.category.open DIV.checkbox.visible	{display:block;}
DIV.phoneGrid DIV.filters DIV.category DIV.subcategory			{display:none;}
DIV.phoneGrid DIV.filters DIV.category.open DIV.subcategory		{display:block;}
DIV.phoneGrid DIV.filters DIV.checkbox 							{margin:0 18px 18px 18px;}
DIV.phoneGrid DIV.filters DIV.checkbox INPUT[type=checkbox] 	{display:inline-block; vertical-align:top; margin:2px 4px 0 0;}
DIV.phoneGrid DIV.filters DIV.checkbox LABEL					{display:inline-block; vertical-align:top; font-size:15px; color:#363636;}
DIV.phoneGrid DIV.filters DIV.subcategory						{font-size:21px; margin:25px 20px 12px 20px;}
DIV.phoneGrid DIV.filters DIV.subcategory:first-of-type			{margin-top:0;}

DIV.phoneGrid DIV.businessPromo				{margin-top:15px; background:#f3f3f3; border:1px solid #b7b7b7; padding:15px;}
DIV.phoneGrid DIV.businessPromo	P.header	{font-size:30px; color:#292929; margin:0 0 10px 0;}
DIV.phoneGrid DIV.businessPromo P.copy		{font-size:16px; color:#292929; margin:0 0 10px 0;}
DIV.phoneGrid DIV.businessPromo DIV.cta		{font-size:18px; text-transform:uppercase;}
DIV.phoneGrid DIV.businessPromo DIV.cta A 	{color:#336699; text-decoration:none; background:url(/img/phones/circle-arrow.png) no-repeat left 2px; text-indent:22px; display:inline-block;}
@media (max-width: 599px) {
DIV.phoneGrid DIV.businessPromo				{display:none;}
}

/*
		<div class="businessPromo">
			<p class="header">Looking for Business Phones?</p>
			<p class="copy">Visit our Business section to equip your workforce with the right basic phones and smartphones.</p>
			<div class="cta"><a href="/business/phones/">Business phones</a></div>
		</div>
*/