@media only screen and (max-device-width: 980px) {
/* .menu { width:600px; } */
}

body {width:980px;
      margin:0 auto;
      padding:10px; /* quantos px do alto começa a página */
      text-align:center; /* hack para o IE */
      background-color: rgb(31,73,127);
      overflow-y: shwon;
    
	
	}

a	{color:#f0ff00;
	}

a:hover {
	text-transform:italic;
	font-style:italic;
  	color: black;
	font-size:105%;
  	background-color: #ff9900;
	transition:1.0s;}

H1 {
 		 /* clamp(mínimo, ideal, máximo) */
 	font-size: clamp(1.0rem, 4vw + 1rem, 2rem);
	color: #ffa500;	
	font-family:"helvetica";
	}

H2 {
 		 /* clamp(mínimo, ideal, máximo) */
 	font-size: clamp(0.3rem, 4vw + 1rem, 1.0rem);
	color: yellow;	
	font-family:"cambria";
	margin-left:120px;
	 text-align: justify;
	}

H3 {
 		 /* clamp(mínimo, ideal, máximo) */
 	font-size: clamp(0.3rem, 4vw + 1rem, 1.5rem);
	color: orange;	
	font-family: helvetica;
	margin-left: 400px;
	 text-align: justify;
	}

H4 {
 		 /* clamp(mínimo, ideal, máximo) */
 	font-size: clamp(0.3rem, 4vw + 1rem, 1.5rem);
	color: orange;	
	font-family: helvetica;
	margin-left: 460px;
	 text-align: justify;
	}

 ul.sobe5{position: relative;
     	  margin-top:-50px;}

x	{color:orange;
        font-size:22px;
        font-family:"cambria", "Trebuchet MS Regular", "Verdana";
        font-weight: bold;
        font-style:italic;
        margin-left:3px;
	margin-right: 2px;
        }

x2	{color:orange;
        font-size:20px;
        font-family:"cambria", "Trebuchet MS Regular", "Verdana";
        font-weight: bold;
        margin-left:3px;
	margin-right: 2px;
        }


.item {
	/* O flex: 1; é necessário para que cada item se expanda ocupando o 	tamanho máximo do container 2. usado em q_somos*/
	flex: 1;
	border: 2px solid red;
	border-radius: 10px;
	background: blue;
	text-align: center;
	font-size: 1.1em;
	margin-left: 85px;
	
}

	.item:hover {
            border: 3px solid red;
            transform: scale(1.05); 
            box-shadow: 0 5px 25px rgba(0,0,0,0.6);
	    opacity: 0.5;
        }



.items1{
		/* usado em topo41 - O flex: 1; é necessário para que cada item se expanda ocupando o tamanho 
	máximo do container 1. usado em topo41*/
	flex: 1;
	border: 0px solid red;
	justify-content: space-between;

}

.items2{
		/* O flex: 1; é necessário para que cada item se expanda ocupando o tamanho máximo do container 1. usado em topo41*/
	border: 3px solid white;
	justify-content: center;
	align-items: center;
	width: 300px;
	height: 55px;
	margin-top: 10px;
}

	.items4{
		/* O flex: 1; é necessário para que cada item se expanda ocupando o tamanho máximo do container 1. usado em topo41*/
	border: 4px solid yellow;
	justify-content: center;
	align-items: left;
	width: 750px;
	height: 150px;
	margin-top: 30px;
	margin-left: 0px;
}

	.container{
            width: 90%;
            height: auto;
            display: flex;     
	    flex-wrap: wrap;
	    gap: 20px;
            align-items: center;
            justify-content: flex-start;
            margin-top:30px;
	    margin-left:69px;
	    border: 0px solid white;
	}

	.container8{
		width: 60%;
		display: flex;
 		flex-wrap: wrap;
		align-items: center;
		justify-content: center;
		margin-left: 200px;
		gap: 20px;
		}


	.container1{
		display: flex;
 		flex-wrap: wrap;
		align-items: center;
		width: 980px;
		border: 0px;
		justify-content: center;
		margin-left: 10px;
		}

	.container2{
		display: flex;
		flex-wrap: wrap;
		width: 68%;
		border: 2px;
		align-items: flex-start;
		justify-content: space-between;
		margin-top: -27px;
		margin-left: 270px;
	}

	.container3{
		display: flex;
 		flex-wrap: wrap;
		align-items: center;
		width: 150px;
		height:100px;
		justify-content: center;
		margin-left: 422px;
		}



	.container4{
           	width: 24%;
           	height: auto;
           	display: flex;     
           	flex-wrap: wrap;
	   	gap: 30px;
           	align-items: center;
           	justify-content: flex-start;
           	margin-top:-20px;
	   	margin-left:80px;
	    	border: 0px solid white;
	}

	.container9{
           	width: 50%;
           	height: auto;
           	display: flex;     
           	flex-wrap: wrap;
	   	gap: 80px;
           	align-items: center;
           	justify-content: flex-start;
           	margin-top:-20px;
	   	margin-left:420px;
	    	border: 0px solid white;
	}

	.container5{
            width: 88%;
            height: auto;
            display:flex;     
            flex-wrap: wrap;
            align-items: center;
	    justify-content: flex-start;
            margin-top:30px;
	    margin-left:60px;
	    border: 0px solid white;
		gap:20px;}

	.container6{
		display: flex;
 		flex-wrap: wrap;
		flex-direction: row;
		align-items: center;
		width: 100%;
		justify-content: center;
		border: 0px solid white;
		margin-top:30px;
		}

	.container7{
		 width: 90%;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		 justify-content: flex-start;
		margin-left: 0px;
		}



 	.box{
            color: #fff;
            width:150px;
            height:100px;
            border: 3px solid white;
            background-color: red;
        }

        .box:hover {
            border: 4px solid red;
            transform: scale(1.0);
			 box-shadow: 0 5px 25px rgba(0,0,0,0.6);
	        opacity: 0.5;
        }

	.box1{    
	    border: 3px solid white;
	    width: 150px;
	    height:100px;
	    margin-top:20px;
	    justify-content: center;
	    align-items: center;
        }

	 .box1:hover {
            border: 4px solid red;
            transform: scale(1.05); 
            box-shadow: 0 5px 25px rgba(0,0,0,0.6);
	    opacity: 0.5;
        }

	.box2{
            opacity: 0.0;
	    margin-left: 5px;
        }

	.box3{    
	    border: 2px solid white;
	    width: 50px;
	    height:30px;
	    margin-top:20px;
	    justify-content: center;
	    align-items: center;
        }

	.box3:hover {
            border: 3px solid yellow;
            transform: scale(1.05); 
            box-shadow: 0 5px 25px rgba(0,0,0,0.6);
	    opacity: 0.5;
        }
	



	 ul.texto5{
		font-family: Helvetica, Arial;
     		position: relative;
     		margin-top: 20px;
     		margin-left: 70px;
		margin-right: 110px;
     		text-align:justify;
     		font-size:22px;
     		color:white
		}


			/*texto normal*/	
	ul.texto7{
		font-family:Helvetica, Arial;
     		position: relative;
     		margin-top: 0px;
     		margin-left: 25px;
     		margin-right:55px;
     		text-align:justify;
     		font-size:20px;
     		color:white;
		text-indent:30px;
		}

	ul.texto10{
		font-family: Helvetica, Arial;
		position: relative;
     		margin-left: -50px;
		margin-right:85px;
     		text-align:center;
     		font-size:30px;
     		}

	ul.texto19{
		font-family: Helvetica, Arial;
		position: relative
		margin-top: 0px;
     		margin-left: 0px;
		margin-right:85px;
     		text-align:center;
     		font-size:30px;
		color:yellow;
     		}

	

	k2	{color: blue;
		font-size: 20px;
		margin-right: 3px;
		margin-left: 3px;
		font-weight:bold;
		font-family:"Suruma","cambria";
		font-style:italic;
		}