* {
  box-sizing: border-box;
}
body
        {
        background-color: /**#F0FFF0;**/ ;
     }

#wrapper
	{width:100%;
	height: auto;
	border-radius: 8px;
	box-sizing: border-box;
	background:white;
	}
#header
	{float:left;
	background: white;/**#7FFFD4;  controla a cor de fundo do titulo principal  **/	
	margin:0 10px;
	padding: 0 0 0 55px; /** use o padding right ou left para centrar os links **/
	width:100%;
	height:auto;
	text-align:right;
	border-radius: 8px;
	}	
.imgtitle
	{
  display: centre;
	}
/** Navigation styles change the header/links on the ponto de referencia part and breacrumbs from vertical-align to horizontal**/
/*img {
  float: right;
}
*/	
.imgsupport	
	{
  float: right;
	}
/* Create two unequal columns that floats next to each other */
.column {
  float: left;
  padding: 10px;
 
}

.left {
  width: 25%;
}

.right {
  width: 75%;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

.nav
	{
	margin:	auto;
	width:25%; /** this will allow to centre the nav bar **/
	padding:3px;
	}
.nav li  /** make the navigation buttons go horizontal by floting to the left and take away the items bullet **/
	{float:left;
	list-style:none; /** takes away the items bullet **/
	margin:auto;
	padding:6px 10px; /** distance between the words **/
	display:inline;
	}
	
.nav li a 

	{float:left;
	color: 	#7FFFD4; /** links and breadcrumbs text colour **/
	text-decoration:none; /** removes the underline **/
	border-right:0px solid #333;
	font-size:18px; /** controls the size of the link font **/
	font-family: arial, helvetica, sans-serif;
	}
	
.nav li a:hover
	{background-color:#333; /** cor do fundo da area das letras **/
	color:Pink; /** cor das letra when it hovers on the link**/
	border-radius: 10px;
	}
.p
	{
	font-size:20px;
	}	
	
/** Ponto de referencia is affected by the headers' (h1, h2...) style below **/
h1	{
	font-family:	arial, helvetica, sans-serif;
	font-weight:	bold;
	font-size:		24px;
	color:   		/**#4B0082; **/ Green;
	margin:			0px; 
	text-align:		center; /** this will make all h1 header centred **/
	}	

h2
	{
	font-family: comic sans-serif, sans-serif, arial, helvetic;
	font-size:22px;
	color: 	blue;
	/**padding: 0 0 0 0; **/
	margin: 0px;
	text-align: center;
	}
	
h3
	{
	color:Green;
	text-align: center;
    font-family: comic sans-serif, sans-serif, arial, helvetic;
	font-size:20px;
	}
	
h4
	{
	color: blue;
	text-align:center;
    font-family: comic sans-serif, sans-serif, arial, helvetic;
	font-size:12px;
	}

h5
	{
	color: Gray;
	text-align:left;
    font-family: comic sans-serif, sans-serif, arial, helvetic;
	font-size:10px;
	}



/* Responsive layout - when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other */
/*@media screen and (max-width: 600px) {
  .column {
    width: 100%;
  }
}
*/










#footer 
	{clear:both;
	float:left;
	background: orange;/**#7FFFD4;#ADD8E6;/**#F5F5F5;/**#8FBC8F;#f1f1f1**/
	margin:0px 0 0 0;
	width:100%;
	height:50px;
	 border-radius: 8px;
	}
#footer p
	{
	font-family: Comic Sans MS; arial, helvetica, sans-serif;
	
	}