/*	

	Less+ by Jimmy Rosén, http://www.angrycreative.se/projekt/less-framework
	Based on Less Framework 4 by Joni Korpi, http://lessframework.com
	
*/

/*		Mobile Layout: 320px.
		Gutters: 24px.
		Outer margins: 34px.
---------------------------------------------
cols    1     2      3
px      68    160    252    */

body { }
header { width: 100%; height: 130px; }
#Logo { float: none; display: block; position:relative; top: 40px; }
#ProcurarArea { margin: 0; }
#ProcurarArea input[type='text'] { width: 300px; height: 36px; position: absolute; top: 0; left: 0px; background: #ddd url('../img/procurar.png') no-repeat 2px 9px; border: 1px solid white; border-radious: 0; }

#Banner { max-width: 100%; }
#Banner .indexCaminho { padding: 10px; margin: 10px 5px; font-size: 60%; width: 90%;}

#Info,
#Info .paginas { width: auto; }
.paginas {  padding: 0 5px; }
#Promocoes ul li,
.lista ul li { min-height: auto; }

#Caminho { width: 100%; }

/*Experimental menu */

#nav { position: fixed; top: 0; right: 0px; z-index: 50; }
#nav > a { width: 40px; height: 32px; text-align: left; text-indent: -9999px; background-color: #ddd; }
#nav > a:before,
 #nav > a:after { position: absolute; border: 2px solid #999; top: 35%; left: 25%; right: 25%; content: ''; }
#nav > a:after { top: 60%; }
#nav:not( :target ) > a:first-of-type,
 #nav:target > a:last-of-type { display: block; }
/* first level */

#nav > ul { height: auto; display: none; position: absolute; right: 0; width: 100%; background-color: #fff; border: 4px solid #ddd; border-top: none; }
#nav:target > ul { display: block; width: 300px;  }
#nav > ul > li { width: 100%; float: none; }
#nav > ul > li > a { width: 276px; height: auto; text-align: left; padding: 7px 10px; /* 20 (24) */ }
/* second level */

#nav li ul { position: static; width: 100%; background-color: #ddd; padding: 20px; /* 20 */ padding-top: 0; }