/*Documento CSS - style_menu_lateral_responsivo.css*/

/*Pra dispositivos que tem uma largura mínima de 768 pixels. Tablets, por exemplo.*/
@media screen and (max-width: 720px) {
      .body.front-page, span, a{
	   min-width: 240px;
	   width: 240px;
	   /*background-color: aqua;*/
  }
}

.wrap {
max-width: 1200px;
margin: 0 auto;
}
 
.nav {
background: #FFF;
z-index: 200;
position: relative;
width: 20%;
font-size: 1em;
float: left;
background: #444;
}
 
.nav ul {
padding: 1em;
}
 
li {
display: block;
width: 100%;
margin: 1em 2em 1em 0;
}
 
a {
text-decoration: none;
color: #FFF;
}
 
a:hover {
color: red;
}
 
.nav-toggle {
display: none;
}
 
.foto {
 width: 80%;
float: right;
}
 
/*Media Queries*/
@media only screen and (max-width: 800px) {
.wrap {
max-width: 100%;
margin: 0;
}
 
.nav {
width: 175px;
position: absolute;
top: 0;
left: 0;
}
 
.nav ul {
padding: .5em;
margin: 0;
background: #444;
}		
 
li {
margin: 0;
padding: 0;
display: block;
}
 
li a {
padding: 0.5em 0 0.5em 0;
display: block;
color: #FFF;
}
 
.nav-toggle {
position: absolute;
top: 0;
right: -56px;
color: #FFF;
cursor: pointer;
width: 44px;
height: 24px;
z-index: 1000;
display: block;
background: #444;
padding: 12px 6px 6px 6px;
}
 
.foto {
width: 100%;
position: relative;
float: none;
}
}


/*==========================================================================================================*/


/*===============================================================================================================*/

/* front page */

.front-page{ text-align: center; }

.front-page h1 object { float: none; display: block; margin: 0 auto 0.25em; padding; 0; }
.front-page h1 img { float: none; display: block; margin: 0 auto; padding: 0; }
.front-page h1 { margin: 0; padding: 0; font-size: 2em; font-weight: bold; }
.front-page h2 { font: inherit; margin: 0; padding: 0; font-style: italic; }

.front-page > a {margin: 1em 2em; border: solid thick; text-align: center; display: inline-block; vertical-align: bottom; text-decoration: none; }
.front-page > a > p { text-decoration: none; width: 10em; min-height: 7em; padding: 1em 1.4em; }/*10em largura box da tabela*/
.front-page > a > p strong { font-size: 2em; font-style: normal; display: block; text-decoration: underline; }
.front-page > a > p span { white-space: nowrap; text-decoration: none; }

.front-page > a                                              { color: black; background: #FFFF99; border-color: #FFFF00; }
.front-page > a + a                                          { color: black; background: #99FFFF; border-color: #00FFFF; }
.front-page > a + a + a                                      { color: black; background: #FF99CC; border-color: #FF0099; }
.front-page > a + a + a + a                                  { color: black; background: #99FF99; border-color: #00FF00; }
.front-page > a + a + a + a + a                              { color: black; background: #FF9999; border-color: #FF0000; }
.front-page > a + a + a + a + a + a                          { color: black; background: #99CCFF; border-color: #0099FF; }
.front-page > a + a + a + a + a + a + a                      { color: black; background: #CC99FF; border-color: #9900FF; }
.front-page > a + a + a + a + a + a + a + a                  { color: black; background: #FFCC99; border-color: #FF9900; }
.front-page > a + a + a + a + a + a + a + a + a              { color: black; background: #FF99FF; border-color: #FF00FF; }
.front-page > a + a + a + a + a + a + a + a + a + a          { color: black; background: #99FFCC; border-color: #00FF99; }
.front-page > a + a + a + a + a + a + a + a + a + a + a      { color: white; background: #999999; border-color: #000000; }
.front-page > a + a + a + a + a + a + a + a + a + a + a + a  { color: black; background: #CCFF99; border-color: #99FF00; }

.front-page > a {
  box-shadow:         0 0 0.5em black;
  transition: box-shadow 0.05s linear;
}

.front-page > a:hover {
  box-shadow: 0 0 1.4em black;
}

.front-page address { clear: both; padding-top: 2em; }