section#momento 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;
}

section#momento {
    margin: 0 auto;
    width: 90%;
    border-bottom: 1px solid #808080;
    border-left: 1px solid #808080;
    padding: 5px;
}

section#momento ul li {
	font-size:25px;
    font-family: TimesNewRoman, "Times New Roman", Times, Baskerville, Georgia, serif;
    text-shadow:  #C0C0C0 1px 1px 1px, #ccc -1px -1px 1px;
   margin:5px;
    text-align: left;
	padding-top:10px;
	clear:both;
}

div.tabela {
    margin-top: 10px;
    display: none;
    width: 1000px;
    height:100%;
	   
}


h3.par-03{
font-size:22px;	
margin:10px;	
text-align:center;
}

div#momento{
margin:0 auto;
width:90%;
height:430px;
 box-shadow: 10px 10px 10px 5px black;
 margin-bottom:20px;
}

div#momento-03{
margin:0 auto;
width:90%;
height:430px;
 box-shadow: 10px 10px 10px 5px black;
 margin-bottom:20px;
}


canvas#myCanvas-09{
margin-top:5%;

}

canvas#myCanvas-10{
	margin-left: 5%;
	}

	canvas#myCanvas-12{
		margin-top: 15px;
		}

		canvas#myCanvas-15{
			margin-top: 15px;

			}


div#momento-02{
margin:0 auto;
width:90%;
height:530px;
 box-shadow: 10px 10px 10px 5px black;
 margin-bottom:20px;
 padding:5px;
}

div#momento-04{
margin:0 auto;
width:90%;
height:530px;
 box-shadow: 10px 10px 10px 5px black;
 margin-bottom:20px;
 padding:5px;
}

div#momento-02 span#span-01{ 
	font-size:18px;
	width:40%;
}

div#momento-04 span#span-01{ 
	font-size:18px;
	width:40%;
}

p#paragrafo{
	text-align:left;
	font-size:20px;
	    text-shadow:none;
		font-style:italic;

}

span#span-01{
	float:left;
	width:45%;
	 text-shadow:none;
font-style:;
	  margin:10px;
	  text-align:left;
	  padding:10px;
	  font-size:16px;
}


div#momento span#span-01{
	margin:auto;
	width:42%;
	height:;
    margin:10px;
	  padding:10px;
	 font-size:15px;

}

div#momento-03 span#span-01{
	margin:auto;
	width:42%;
	height:;
    margin:10px;
	  padding:10px;
	 font-size:15px;

}

div#momento span#span-02{
	margin:auto;
	width:45%;
	height:100%;
    margin:10px;
	  padding:10px;
	 
	   
	  
}

div#momento-03 span#span-02{
	margin:auto;
	width:45%;
	height:100%;
    margin:10px;
	  padding:10px;
	 
	   
	  
}

span#span-03{
	float:left;
	width:45%;
	height:100%;
    margin:10px;
	  padding:10px;
	  

}

span#span-04{
	float:left;
	width:45%;
	height:100%;
    margin:10px;
	  padding:10px;
	 
}

span#span-05{
	float:left;
	width:45%;
	height:100%;
    margin:10px;
	  padding:10px;
	

}

span#span-06{
	float:left;
	width:50%;
	height:90%;
    margin:;
	  padding:10px; 
border: 1px solid #000;
}

span#span-07{
	float:left;
	width:45%;
	height:90%;
    margin:;
	  padding:10px; 
border: 1px solid #000;
}

span#span-08{
	height:100%;
	  float:left;
	width:40%;
	 text-shadow:none;
font-style:;
	  margin:10px;
	  text-align:left;
	  padding:10px;
	  font-size:20px;

}

span#span-09{
	float:left;
	width:45%;
	height:100%;
    margin:10px;
	  padding:10px;
}

span#span-10{
	float:left;
	width:45%;
	height:90%;
    margin:;
	  padding:10px; 
border: 1px solid #000;
}

span#span-11{
	float:left;
	width:45%;
	height:90%;
    margin:;
	  padding:10px; 
	  border: 1px solid #000;
}

span#span-12{
	float:left;
	width:45%;
	height:90%;
    margin:;
	  padding:10px;
border: 1px solid #000;	  
}

span#span-13{
	float:left;
	width:45%;
	height:;
    margin:10px;
	  padding:10px;
	  border:2px solid #000;

}

span#span-14{
	float:left;
	width:45%;
	height:100%;
    margin:10px;
	  padding:10px; 
}

table, th, td {
    border: 1px solid black;
	margin:auto;
	text-align: center;
}

div#divResultado{
	width:0;
	height:0;
clear:both;	
margin:0 auto;
border-radius:5px;
background-color:#fff;
-webkit-transition: all 1500ms linear 250ms;
transition: all 1500ms linear 250ms;
}

p#resp{
font-size: 20px;
color:#fff;
text-align:;
padding:5px;
 text-shadow:none;
font-style:italic;
}

div#divResultado-02{
width:0;
	height:0;
clear:both;	
margin:0 auto;
border-radius:5px;
}

p#resp-02{
font-size: 20px;
color:#000;
text-align:;
padding:5px;
 text-shadow:none;
font-style:italic;
}

p#resp-05{
font-size: 20px;
color:#fff;
text-align:;
padding:5px;
 text-shadow:none;
font-style:italic;
}

div#divResultado-03{
	width:0;
	height:0;
clear:both;	
margin:0 auto;
border-radius:5px;
background-color:#fff;

}

p#resp-03{
font-size: 18px;
color:#fff;
text-align:;
padding:5px;
 text-shadow:none;
font-style:italic;
}

p#resposta-04{
font-size: 18px;
color:#000;
text-align:;
padding:5px;
 text-shadow:none;
font-style:italic;
}

div#divResultado-04{
	width:0;
	height:0;
clear:both;	
margin:0 auto;
border-radius:5px;
background-color:#fff;
-webkit-transition: all 1500ms linear 250ms;
transition: all 1500ms linear 250ms;
}

p#resp-04{
font-size: 20px;
color:#fff;
text-align:;
padding:5px;
 text-shadow:none;
font-style:italic;
}

div#divResultado-05{
	width:0;
	height:0;
clear:both;	
margin:0 auto;
border-radius:5px;
background-color:#fff;
-webkit-transition: all 1500ms linear 250ms;
transition: all 1500ms linear 250ms;
}

div#divResultado-01{
	width:0;
	height:0;
clear:both;	
margin:0 auto;
border-radius:5px;

}

div#divResultado-03{
	width:0;
	height:0;
clear:both;	
margin:0 auto;
border-radius:5px;

}

p#resp-01{
font-size: 20px;
color:#fff;
text-align:center;
padding:5px;
 text-shadow:none;
font-style:italic;

}

p#resp-04{
font-size: 17px;
color:#fff;
text-align:center;
 text-shadow:none;
font-style:italic;

}

label{
color: #000;
	text-shadow: #C0C0C0 1px 1px 1px, #ccc -1px -1px 1px;
	}
	
input{
border-radius:5px;
}

canvas#myCanvas{
	display:none;
}

canvas#myCanvas-02{
	display:none;
}

canvas#myCanvas-03{
	display:none;
}

canvas#myCanvas-04{
	display:none;
}

canvas#myCanvas-05{
margin:10px;
background-image: url("../imagens/mola.GIF");
	   background-repeat: no-repeat;
	       background-position: top right; 
}

canvas#myCanvas-06{
	margin:5px;
	}

#container {
	display:none;
  width: 350px;
  height: 260px;
  position: relative;
 border:2px solid #000;
}

#animate {
  width: 50px;
  height: 50px;
  position: absolute;
  background-color: red;
 margin-left: 10px;
 margin-top: 10px;
  transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  
  
}



#animate-04 {
	width: 60px;
	height: 50px;
	float:left;
	background-color: red;
   margin-left:120px;
   margin-top: 30px;
	
}

  #animate-05 {
	width: 50px;
	height: 60px;
	position: absolute;
	background-color: red;
   margin-left: 255px;
   margin-top: 90px;
  }

#container-02 {
	display:none;
  width: ;
  height: 260px;
  position: relative;
}

#container-02 p{
	font-size:18px;
	padding:5px;
	margin-top: 10%;
	border: 2px solid #000;
	
}


#container-01 {
	display:none;
  width:;
  height: 350px;
  position: relative;
 border:;

}

#container-03 {
	display:none;
  width:;
  height: 350px;
  position: relative;
 border:;

}

#animate-01 {
	width:40px;
	height:40px;
	border-radius:;
	background:blue;
margin-top:190px;
margin-left:55px;
text-align:center;
position: absolute;

}

#animate-02 {
	width:50px;
	height:50px;
	border-radius:;
	background:red;
margin-top:250px;
text-align:center;
margin-left:55px;
position: absolute;

}


	#animate-03 {
		margin-top:40px;
		margin-left:55px;
		position: absolute;
		}

#container-04 {
	display:none;
  width:;
  height: 350px;
  position: relative;
 border:;

}

#container-05 {
 display:none;
  width: 350px;
  height: 300px;
  position: relative;
 border:2px solid #000;

}


#container-06 {
	display:none;
	 width: 350px;
	 height: 300px;
	 position: relative;
	border:2px solid #000;
   
   }

#animate-04 {
margin-top:;
margin-left:155px;
position: absolute;
}

div#div{
	margin-top:10%;
width:400px;
height:150px;
border:1px solid #000;

}

div#div-02 {
float:left;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: red;
  position: relative;
  -webkit-animation-name: example; /* Safari 4.0 - 8.0 */
  -webkit-animation-duration: 8s; /* Safari 4.0 - 8.0 */
  animation-name: example;
  animation-duration: 8s;
}


/* Safari 4.0 - 8.0 */
@-webkit-keyframes example {
  0%   {background-color:red; left:0px; top:0px;}
  33%  {background-color:red; left:150px; top:0px;}
  66%  {background-color:red; right:150px; top:0px;}
  100%  {background-color:red; left:0px; top:0px;}
  
}

/* Standard syntax */
@keyframes example {
  0%   {background-color:red; left:0px; top:0px;}
  33%  {background-color:red; left:150px; top:0px;}
  66%  {background-color:red; right:150px; top:0px;}
  100%  {background-color:red; left:0px; top:0px;}

}


div#div-03 {
float:left;
margin-left:150px;
  width: 50px;
  height: 50px;
  border-radius:50%;
  background-color: blue;
  position: relative;
  -webkit-animation-name: example02; /* Safari 4.0 - 8.0 */
  -webkit-animation-duration: 8s; /* Safari 4.0 - 8.0 */
  animation-name: example02;
  animation-duration: 8s;
}


/* Safari 4.0 - 8.0 */
@-webkit-keyframes example02 {
  0%   {background-color:blue; left:150px; top:0px;}
  33%  {background-color:blue; left:0px; top:0px;}
  66%  {background-color:blue; right:150px; top:0px;}
  100%  {background-color:blue; left:150px; top:0px;}
  
}

/* Standard syntax */
@keyframes example02 {
  0%   {background-color:blue; left:150px; top:0px;}
  33%  {background-color:blue; left:0px; top:0px;}
  66%  {background-color:blue; right:150px; top:0px;}
  100%  {background-color:blue; left:150px; top:0px;}

}



@media only screen and (max-width: 1200px) {

div.tabela{
width:900px;
}

p#paragrafo{
	font-size:18px;

}

span#span-01{
	  font-size:14px;
}


span#span-02{
    margin:5px;
	  padding:5px;
	  }
	  
	  span#span-03{
    margin:5px;
	  padding:5px;
	  }
	  
	  
	  span#span-04{
    margin:5px;
	  padding:5px;
	  }

span#span-08{
	 margin:5px;
	  padding:5px;
	  font-size:18px;
}

span#span-09{
	width:100%;
}

canvas#myCanvas{
	width:100%;
}

canvas#myCanvas-02{
width:100%;
}

canvas#myCanvas-03{
	width:100%;
}

canvas#myCanvas-04{
	width:90%;
}

canvas#myCanvas-18{
	width:100%;
}

canvas#myCanvas-08{
	width:100%;
}


canvas#myCanvas-10{
	width:100%;

}

canvas#myCanvas-13{
	width:100%;
}


	
	div#momento-02 span#span-01{ 
	font-size:18px;
	width:35%;
}

div#momento-02 span#span-06{ 
	width:55%;
}

div#momento-04 span#span-06{ 
	width:;
}

div#div{
width:100%;

}

}

@media only screen and (max-width: 1000px) {

div.tabela{
width:800px;
}

canvas#myCanvas-09{
width:100%;
}

canvas#myCanvas-12{
width:100%;
}

canvas#myCanvas-10{
margin-left: 2%;
}

canvas#myCanvas-14{
width:90%;
	}
	

#container {
  width: 100%;
}


#container-02 {
  width: 100%;
}

span#span-05{
	float:left;
	width:45%;
	height:100%;
    margin:5px;
	  padding:5px; 

}

span#span-02{
	float:left;
	width:45%;
	height:100%;
    margin:5px;
	  padding:5px; 

}


p#resp{
font-size: 18px;
text-align:center;
}

p#resp-03{
font-size: 17px;
text-align:center;
}

span#span-01{
	  font-size:17px;
}

span#span-13{
	width:55%;
}


	div#momento-02 span#span-01{ 
	font-size:16px;
	width:30%;
}

	div#momento-04 span#span-01{ 
	font-size:16px;
	width:30%;
}

div#momento-02 span#span-06{ 
	width:60%;
}

div#momento-04 span#span-06{ 
	width:60%;
}

div#momento span#span-01{

}

}

@media only screen and (max-width: 900px) {

div.tabela{
width:700px;
}

span#span-13{
	clear:both;
	width:60%;
	margin-left:20%;
}

canvas#myCanvas-09{
	
}

canvas#myCanvas-10{
width:100%;	

}


div#momento span#span-01{

font-size:13px;	
}

div#momento-03 span#span-01{

font-size:13px;	
}

}

@media only screen and (max-width: 800px) {

div.tabela{
width:600px;
}



div#momento-03{
height:770px;
}

div#momento span#span-01{
border:2px solid #000;
width:45%;
height:;
	margin-left:15%;
}

div#momento-03 span#span-01{
border:2px solid #000;
width:45%;
height:;
	margin-left:15%;
}

div#momento span#span-02{
	clear:both;
	width:80%;
	margin-left:15%;
	height:350px;
	 
}

div#momento-02 span#span-01{
	clear:both;
	width:80%;
	margin-left:10%;
	height:;
	border: 1px solid #000;
	 
}

div#momento-04 span#span-01{
	clear:both;
	width:80%;
	margin-left:10%;
	height:;
	border: 1px solid #000;
	 
}

div#momento-02 span#span-06{
	clear:both;
	width:80%;
	margin-left:10%;
	height:450px;
	 
}

div#momento-04 span#span-06{
	clear:both;
	width:80%;
	margin-left:10%;
	height:450px;
	 
}



div#momento-02{
height:750px;
}

div#momento-04{
height:800px;
}

div#momento span#span-01{
border:2px solid #000;
width:70%;
height:;
	margin-left:15%;
}


	div#momento span#span-02{
	clear:both;
	width:70%;
	margin-left:15%;
	height:250px;
	}


	div#momento{
height:770px;
}

div#momento span#span-01{
border:2px solid #000;
width:70%;
height:;
	margin-left:15%;
}

div#momento-03 span#span-01{
border:2px solid #000;
width:80%;
height:;
	margin-left:10%;
}


canvas#myCanvas-09{
	width:100%;
	
	
}

canvas#myCanvas-10{
	width:400px;

}

canvas#myCanvas-11{
	height: 290px;
}



}


