@import "../global.css";

/*		Default Layout:992px. 
		Gutters:24px.
		Outer margins:48px.
		Leftover space for scrollbars @1024px:32px.
-------------------------------------------------------------------------------
cols		1		 2			3			4			5			6			7			8			9			10
px			68		160		252		344		436		528		620		712		804		896		*/

	ul.projetos-list{ width:630px; list-style:none; }
		ul.projetos-list li{
			position:relative; float:none; width:630px; height:220px; margin:0 0 20px 0; background:#EEE;
		}
			ul.projetos-list li div.info{
				position:relative; float:left; width:200px; height:220px; padding:0 30px; margin:0 0 0 0;
				font-size:16px; font-weight:400; color:#FFF; text-decoration:none;
			}
			ul.projetos-list li.repeater_1 div.info{ background:url(../../images/bg/bg_green_tsp.png) repeat; }
			ul.projetos-list li.repeater_2 div.info{ background:url(../../images/bg/bg_brown_tsp.png) repeat; }
				ul.projetos-list li div.info h3{ margin:70px 0 0 0; font-size:10px; color:#FFF; }
				ul.projetos-list li div.info p{ font-size:17px; line-height:17px; font-weight:bold; color:#FFF; }
			ul.projetos-list li div.goto{
				float:right; width:110px; height:50px; padding:170px 0 0 0;
				background:#EEE;
			}
				ul.projetos-list li div.goto a img{ margin:0 0 0 15px; }
				
/*		Tablet Layout:768px.
		Gutters:24px.
		Outer margins:28px.
		Inherits styles from:Default Layout.
-----------------------------------------------------------------
cols    1     2      3      4      5      6      7      8
px      68    160    252    344    436    528    620    712    */

@media only screen and (min-width:768px) and (max-width:991px) {

	ul.projetos-list{ width:90%; list-style:none; padding:0 5%; margin:0 0 0 15px; }
		ul.projetos-list li{
			position:relative; float:none; width:100%; height:220px; margin:0 0 20px 0; background:#EEE;
		}
			ul.projetos-list li div.info{
				position:relative; float:left; width:200px; height:220px; padding:0 30px; margin:0 0 0 0;
				font-size:16px; font-weight:400; color:#FFF; text-decoration:none;
			}
			ul.projetos-list li.repeater_1 div.info{ background:url(../../images/bg/bg_green_tsp.png) repeat; }
			ul.projetos-list li.repeater_2 div.info{ background:url(../../images/bg/bg_brown_tsp.png) repeat; }
				ul.projetos-list li div.info h3{ margin:70px 0 0 0; font-size:10px; color:#FFF; }
				ul.projetos-list li div.info p{ font-size:17px; line-height:17px; font-weight:bold; color:#FFF; }
			ul.projetos-list li div.goto{
				float:right; width:110px; height:50px; padding:170px 0 0 0;
				background:#EEE;
			}
				ul.projetos-list li div.goto a img{ margin:0 0 0 15px; }
	
}

/*		
	Mobile Layout:480px.
	Gutters:24px.
	Outer margins:22px.
	Inherits styles from:Default Layout
*/

@media only screen and (max-width:767px) {
	
	ul.projetos-list{ width:100%; list-style:none; padding:0; margin:0 0 0 0; }
		ul.projetos-list li{
			position:relative; float:none; width:100%; height:220px; margin:0 0 20px 0; background:#EEE;
		}
			ul.projetos-list li div.info{
				position:relative; float:left; width:90px; height:220px; padding:0 20px; margin:0 0 0 0;
				font-size:13px; font-weight:400; color:#FFF; text-decoration:none;
			}
			ul.projetos-list li.repeater_1 div.info{ background:url(../../images/bg/bg_green_tsp.png) repeat; }
			ul.projetos-list li.repeater_2 div.info{ background:url(../../images/bg/bg_brown_tsp.png) repeat; }
				ul.projetos-list li div.info h3{ margin:70px 0 0 0; font-size:9px; color:#FFF; }
				ul.projetos-list li div.info p{ font-size:12px; line-height:15px; font-weight:bold; color:#FFF; }
			ul.projetos-list li div.goto{
				float:right; width:110px; height:50px; padding:170px 0 0 0;
				background:#EEE;
			}
				ul.projetos-list li div.goto a img{ margin:0 0 0 15px; }
	
}
/*		
	Wide Mobile Layout:480px.
	Gutters:24px.
	Outer margins:22px.
	Inherits styles from:Default Layout, Mobile Layout.
*/

@media only screen and (min-width:480px) and (max-width:767px) {
	
	ul.projetos-list{ width:100%; list-style:none; padding:0 0; margin:0 0 0 0; }
		ul.projetos-list li{
			position:relative; float:none; width:100%; height:220px; margin:0 0 20px 0; background:#EEE;
		}
			ul.projetos-list li div.info{
				position:relative; float:left; width:200px; height:220px; padding:0 30px; margin:0 0 0 0;
				font-size:16px; font-weight:400; color:#FFF; text-decoration:none;
			}
			ul.projetos-list li.repeater_1 div.info{ background:url(../../images/bg/bg_green_tsp.png) repeat; }
			ul.projetos-list li.repeater_2 div.info{ background:url(../../images/bg/bg_brown_tsp.png) repeat; }
				ul.projetos-list li div.info h3{ margin:70px 0 0 0; font-size:10px; color:#FFF; }
				ul.projetos-list li div.info p{ font-size:17px; line-height:17px; font-weight:bold; color:#FFF; }
			ul.projetos-list li div.goto{
				float:right; width:110px; height:50px; padding:170px 0 0 0;
				background:#EEE;
			}
				ul.projetos-list li div.goto a img{ margin:0 0 0 15px; }
	
}