body{
width:90%;
margin:0 auto;
}

div#principal{
width:60%;
margin:0 auto;
}

section{
width:90%;
margin:0 auto;
margin-top:20px;
}

div.janela-01 a.titulo{
text-decoration:none;
color:#FF0000;
font-size:23px;
font-weight:bold;
margin-left:25%;
}

div.janela-01 a:hover{
color:#0000FF;
}

div.janela-01{
width:280px;
height:300px;
float:left;
margin:5px;
}

div.janela-01 a#imagem-01{
background-image:url(../imagens/cinematica.gif);
float:left;
  width:100%;
  height:90%;
  border:#000 2px solid;
  border-radius: 5px;
box-shadow: #000 2px 2px 1px;
  display:inline;
}

div.janela-01 a#imagem-01:hover{
border:#00008B 4px solid;
box-shadow: #000 4px 4px 2px;
opacity:0.6;
  }

div.janela-01 a#imagem-02{
background-image:url(../imagens/newtom.jpg);
float:left;
width:100%;
height:90%;
border:#000 2px solid;
border-radius: 5px;
box-shadow: #000 2px 2px 1px;
display:inline;
}

div.janela-01 a#imagem-02:hover{
border:#00008B 4px solid;
box-shadow: #000 4px 4px 2px;
opacity:0.6;
}
 
div.janela-01 a#imagem-03{
background-image:url(../imagens/gravitacao.jpg);
float:left;
width:100%;
height:90%;
border:#000 2px solid;
border-radius: 5px;
box-shadow: #000 2px 2px 1px;
display:inline;
}

div.janela-01 a#imagem-03:hover{
border:#00008B 4px solid;
box-shadow: #000 4px 4px 2px;
opacity:0.6;
 }

div.janela-01 a#imagem-04{
background-image:url(../imagens/momento.jpg);
float:left;
  width:100%;
height:90%;
  border:#000 2px solid;
  border-radius: 5px;
box-shadow: #000 2px 2px 1px;
  display:inline;
 }

div.janela-01 a#imagem-04:hover{
border:#00008B 4px solid;
box-shadow: #000 4px 4px 2px;
opacity:0.6;
 }

div.janela-01 a#imagem-05{
background-image:url(../imagens/energia.jpg);
float:left;
   width:100%;
height:90%;
 border:#000 2px solid;
  border-radius: 5px;
box-shadow: #000 2px 2px 1px;
  display:inline;
}

div.janela-01 a#imagem-05:hover{
border:#00008B 4px solid;
box-shadow: #000 4px 4px 2px;
opacity:0.6;
 }
 
div.janela-01 a#imagem-06{ 
background-image:url(../imagens/derivada.png);
float:left;
  width:100%;
height:90%;
  border:#000 2px solid;
  border-radius: 5px;
   box-shadow: #000 2px 2px 1px;
  display:inline;
}

div.janela-01 a#imagem-06:hover{
border:#00008B 4px solid;
box-shadow: #000 4px 4px 2px;
opacity:0.6;
}

article.fis-01{
margin:0 auto;
width:90%;
border-bottom:1px solid #808080;
border-left:1px solid #808080;
padding:5px;
}

article.fis-01 p{
font-family: "Times New Roman", Times, serif;
font-size: 20px;
text-align:justify;
text-shadow: #C0C0C0 1px 1px 1px, #ccc -1px -1px 1px;
margin: 0 auto;
margin-top:10px;
}

article.fis-01 h2{
font-family: TimesNewRoman, "Times New Roman", Times, Baskerville, Georgia, serif;
text-shadow: #C0C0C0 1px 1px 1px, #ccc -1px -1px 1px;
 font-weight: bold;
text-align:left;
}

div.coluna-01 {
margin: 5px auto;
width:100%;
}


	@media only screen and (max-width: 1800px) {

div#principal{
width:65%;
}
}

@media only screen and (max-width: 1700px) {

div#principal{
width:70%
}

}

@media only screen and (max-width: 1600px) {

div#principal{
width:75%;
}

}

@media only screen and (max-width: 1500px) {

div#principal{
width:80%;
}

}


@media only screen and (max-width: 1400px) {

div#principal{
width:85%;
}

}

@media only screen and (max-width: 1300px) {
div#principal{
width:90%;
}

}

@media only screen and (max-width: 1210px) {

div.janela-01{
width:270px;
}
div#principal{
width:95%;
}
}

@media only screen and (max-width: 1110px) {

div.janela-01{
width:260px;
}

div#principal{
width:100%;
}
}

@media only screen and (max-width: 1020px) {

div.janela-01{
width:35%;
height:280px;
margin:10px;
}
div.coluna-01{
margin-left:10%;
}
}

@media only screen and (max-width: 900px) {

div.janela-01{
width:40%;
}
div.coluna-01{
margin-left:5%;
}
article.fis-01 p{
font-size: 18px;
}
article.fis-01 h2{
font-size: 1.3em;
}
}

@media only screen and (max-width: 800px) {

div.janela-01{
height: 250px;
}
div.janela-01 a.titulo{
font-size:21px;
}
article.fis-01 p{
font-size: 17px;
}
article.fis-01 h2{
font-size: 1.2em;
}
}

@media only screen and (max-width: 700px) {

div.janela-01{
height:230px;
}
div.janela-01 a.titulo{
font-size:20px;
}
}

@media only screen and (max-width: 600px) {

div.janela-01{
height:220px;
}
div.janela-01 a.titulo{
font-size:18px;
}
}

@media only screen and (max-width: 550px) {

div.janela-01{
height:200px;
}
div.janela-01 a.titulo{
font-size:16px;
}
}