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

	*{
		font-size: 100%;
		width: 100%;
		/*overflow-x: hidden;*/

	}
	#container {
		width: 90%;
	}

/*<============== INDEX ===========>*/
	/*--------------- header------------------*/
		/* top right bottom left; */

		#tel{
			margin-top:5px;
			position: absolute;
			top: 0;
			background-color: #e6eaea;
			height:25px;
			width:100%;
			font-size: 70%;
			text-align:center;
		}

		.logo{
			max-width: 200px;
			max-height: 80px;	
		}

		.trapz{
			display: none;
		}

	/*--------------- body------------------*/
		/* top right bottom left; */

		#Body{
			margin-top:-3%;
		}

		#Body h1{
			font-size: 80%;
		}

		.produto{
			position: relative;
			height: 60px;
			width: 95%;
		}

		/*Cx 1 e 2 */
		.produto:nth-child(1), .produto:nth-child(2){
			margin: 1%;
			border: 3px solid black;
		}

		.produto:nth-child(1) p:first-child, .produto:nth-child(2) p:first-child{
			height: 45px;
			width: 45px;
		}

		.prodTxt{
			position: absolute;
			top: 5px;
			width:75%;
		}

		.prodTxt h1{
			margin-top: 0px;
		}

		.prodTxt p{
			margin-top: 2px;
			font-size:65%;
		}


		/*Cx 3 e 4 */
		.produto:nth-child(3), .produto:nth-child(4){
			height: 50px;
		}

		.produto:nth-child(3) p:first-child{
			height: 50px;
			width: 65px;
		}

		.produto:nth-child(3){
			position: relative;
			padding-left:2px;
		}

		.produto:nth-child(3) .prodTxt{
			position: absolute;
			top: 12%;
			left: 22%;
		}

		.produto:nth-child(3) .prodTxt h2{
			margin: 0;
			padding: 0;
			width: 160px;
			font-size: 60%;
		}

		.produto:nth-child(3) p:nth-child(2){
			margin:0;
			margin-top: 2px;
			width: 200px;
		}

		.produto:nth-child(4) a p{
			position: absolute;
			top: 15px;
			left: 0;
			font-size: 60%;
			width: 200px;
			padding: 0;
		}

	/*--------------- NEWS---------------------------*/
		/* top right bottom left */

		#newsArea{
			display:none;
		}

	/*--------------- FOOTER---------------------------*/
		/* top right bottom left */

		#footer{
			margin-top: 0px;
			padding-top: 0px;
			margin-bottom: 14px;
		}

		.FootMenu{
			width: 90%;
			margin-top:5%;
			border-right : none;
		}

		.FootMenu h3{
			text-align:left;
		}

		#nav{
			margin-top: 10px;
		}

		#nav a:nth-child(1) li {
			display: inline;
		}

		.FootMenu:nth-child(1){
			height:22%;
		}

		.FootMenu:nth-child(1) ul{
			list-style-type: none;
			width: 90%;
			padding: 1px;
			clear: float;
		}

		.FootMenu:nth-child(1) ul a li{
			float:left;
			height:55px;
			width:22%;
			text-indent: -9999Px;
			padding: 2em;
		}

		.FootMenu:nth-child(1) ul a:nth-child(1) li{
			display: block;
			background: url( ../Images/Mobile/Icon-Home2.png) center center no-repeat;
			background-size: 80%;
		}

		.FootMenu:nth-child(1) ul a:nth-child(2) li{
			background: url( ../Images/Mobile/Icon-mail2.png) center center no-repeat;
			background-size: 100%; 
		}

		.FootMenu:nth-child(1) ul a:nth-child(3) li{
			background: url( ../Images/Mobile/Icon-Agendamento.png) center center no-repeat;
			background-size: cover; 
		}

		.FootMenu:nth-child(1) ul a:nth-child(4) li{
			background: url( ../Images/Mobile/Icon-Perguntas-Frequentes.png) center center no-repeat;
			background-size: 80%; 
		}

		.FootMenu:nth-child(1) ul a:nth-child(5) li{
			background: url( ../Images/Mobile/Icon-Google+.png) center center no-repeat;
			background-size: 90%; 
		}

		.FootMenu:nth-child(2){
			display:none;
		} 

		#navHorario{
			margin-left:40px;
		}

		.FootMenu:nth-child(3) h3, .FootMenu:nth-child(4) h3{
			text-indent:40px;
		}

		.FootMenu a.mail{
			padding-bottom:10px;
			/*border: solid 1px grey;*/
		}

		.FootMenu .mapa{
			/*border: solid 1px blue;*/
			margin-top: 3.5%;
		}

		.FootMenu:nth-child(4) .contato{
			margin-left:30px;
		}

		.FootMenu:nth-child(4) span:nth-child(1), .FootMenu:nth-child(4) .tel{
		    display: block;
		}

/*<============== FAQ ===========>*/
		/* top right bottom left */

			#banner{
			display: block;
			height:85px;
		}

/*<============== PAWebDANFE ===========>*/	
		/* top right bottom left */

/*<============== Agendamentos ===========>*/	
	/* top right bottom left */

	.AgndBody{
		  margin-top: 10px;
		  width: 100%;
		  border-collapse: collapse;
	}

	/*https://css-tricks.com/responsive-data-tables/*/
	/* Force table to not be like tables anymore */
	/*.table, thead, tbody, th, td, tr { */
	/*.tableh1, .tableh1 thead, #tblBodyAgnd, .tableAgnd th, .tableAgnd td, .tableAgnd tr { 
		display: block; 
	}*/

	.tblBodyAgnd{}

	.tableh1{
		/*font-size: 110%;*/
		width: 100%;
	}

	#tableAgnd caption{
		/*width: 21em;*/
		/*largura de 380px*/
		text-align:left;
	}

 	/* Force table to not be like tables anymore */
	.tableAgnd table, .tableAgnd thead, .tableAgnd tbody, .tableAgnd th,  .tableAgnd td, .tableAgnd tr { 
		display: block; 
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	.tableAgnd thead tr { 
		position: absolute;
		/*top: -9999px;*/
		/*left: -9999px;*/
	}
	
	.tableAgnd th {
		width: 15%;
		background-color: red;
	}
	.tableAgnd tr { border: 1px solid #ccc; }
	
	.tableAgnd td { 
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee; 
		position: relative;
		padding-left: 50%; 
	}
	
	.tableAgnd th:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 10%; 
		padding-right: 10px; 
		white-space: nowrap;
	}
	
	/*Label the data*/
	.tableAgnd th:nth-of-type(1):before { content: "Validações Externas"; }
	.tableAgnd th:nth-of-type(2):before { content: "Valor"; }
	.tableAgnd th:nth-of-type(3):before { content: "Descrição"; }

/*<============== Bck_to_Top ===========>*/
	/* top right bottom left */

	.Topo{
		right: 20px;
	}


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


	/*--------------- FOOTER---------------------------*/
		/* top right bottom left */

		.FootMenu:nth-child(1) ul a:nth-child(1) li{
			display: block;
			background: url( ../Images/Mobile/Icon-Home2.png) center center no-repeat;
			background-size: 80%;
		}

		.FootMenu:nth-child(1) ul a:nth-child(2) li{
			background: url( ../Images/Mobile/Icon-mail2.png) center center no-repeat;
			background-size: 100%; 
		}

		.FootMenu:nth-child(1) ul a:nth-child(3) li{
			background: url( ../Images/Mobile/Icon-Agendamento.png) center center no-repeat;
			background-size: cover; 
		}

		.FootMenu:nth-child(1) ul a:nth-child(4) li{
			background: url( ../Images/Mobile/Icon-Perguntas-Frequentes.png) center center no-repeat;
			background-size: 80%; 
		}

		.FootMenu:nth-child(1) ul a:nth-child(5) li{
			background: url( ../Images/Mobile/Icon-Google+.png) center center no-repeat;
			background-size: 90%; 
		}


}