/* CSS Document */


@media screen and (min-width:1080px){


html{font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif"; font-size: 16px;}
body{padding: 0; margin: 0; background-color: #f5f5f5}
header{width:100%; height: 60px; background-color:darkorange; position: fixed; top: 0; left: 0; right: 0; border-bottom: 5px solid #996633}

.wrap{margin: 0 auto; width: 100%; max-width: 1366px; height: auto; position: relative; overflow: hidden;}
.corpo{margin:0 auto; width:90%; height: auto}

#logo{margin:0; width:110px; height: 60px; position: relative; float: left; display: flex; align-items: center}
#logo img{width:100%; height: auto}

#menus{margin:0; width:150px; height: 60px; position: relative; float: right;}
#iconResp{display: none}

#iconContato{margin:0; width: 40px; height: 60px; position: relative; float: right; display: flex; align-items: center; cursor: pointer}
#iconContato img{width:100%; height: auto}

#container{margin:0; width: 100%; height: calc(100vh - 80px); position: relative; float: left; margin-top: 80px;}


/*PAGINA INICIAL*/

#inicial{margin:0; width: 100%; height: auto; position: relative; float: left; display: grid; grid-template-columns:40% 60%; justify-content: space-around}
.conteudo{margin:0; width:100%; height: auto; position: relative; float: left; display: flex; align-items: center;}
#banner1{margin:0; width:100%; height: calc(100vh - 95px); min-height:600px; position: relative; float: left}
#banner1 img{width:auto; height:100%}
#banner2{margin:0; width: 100%; height: auto; position: relative; float: left;  color: #666; }
.titulo1{display: none}
.titulo2{margin:0; width: 100%; height: auto; position: relative; float: left; font-size: 2rem; color: #666; margin-bottom: 2rem}
.texto{margin:0; width: 100%; height: auto; position: relative; float: left; color: #666; font-size: 1.5rem; margin-top: 1rem;}
#divContato2{display:none}
#divContato{margin:0; width: 100%; height: auto; position: relative; float: left; text-align: center; margin-top: 5rem; display: block}
.botao{margin:0 auto; width: 100%; max-width: 400px; position: relative; overflow: hidden; background-color: darkorange; padding: 10px; box-sizing: border-box; border-radius: 5px; font-size: 1.2rem; box-shadow: 1px 2px 3px black; cursor: pointer; }
.botao img{height:1.2rem; width:auto; margin-left: 5px}	
.botao:active{box-shadow: -1px 0 3px black}


/*FORMULARIO*/

.formulario{margin:0; width:100%; height: auto; position: relative; float: left; display: grid; grid-template-columns: repeat(4,24%); justify-content: space-around; grid-gap: 10px; margin-bottom: 40px}

.formTitle{margin:0; width: 100%; height: auto; position: relative; float: left; text-align: left; margin-bottom: 5px; font-size: 1rem; color:#666;}
.boxInputs{margin:0; width: 100%; height: auto; position: relative; float: left; text-align: left;}
.boxInputs input[type=text]{width:100%; height: 50px; outline:none; border: none; border: 1px solid #999; border-radius: 5px; padding: 10px; box-sizing: border-box; font-size: 1rem; color: #666}
.boxInputs input[type=password]{width:100%; height: 50px; outline:none; border: none; border: 1px solid #999; border-radius: 5px; padding: 10px; box-sizing: border-box; font-size: 1rem; color: #666}
.boxInputs input[type=tel]{width:100%; height: 50px; outline:none; border: none; border: 1px solid #999; border-radius: 5px; padding: 10px; box-sizing: border-box; font-size: 1rem; color: #666}
.boxInputs select{width:100%; height: 50px; outline:none; border: none; border: 1px solid #999; border-radius: 5px; padding: 10px; box-sizing: border-box; font-size: 1rem; color: #666}
#boxButton{margin:0; width: 100%; height: auto; position: relative; float: left; text-align: center}
#boxButton button{width:100%; max-width: 400px; height: 50px; outline:none; border: none; border-radius: 5px; background-color: darkorange; font-size: 1rem; box-shadow: 2px 3px 5px black; cursor: pointer}
#boxButton button:active{box-shadow: -2px 0 5px black}
#boxButton button:hover{opacity:0.9}



/*ALERTAS*/
#cover{width:100%; height: 100vh; position: fixed; top:0; left: 0; right: 0; bottom: 0; background-color: rgba(0,0,0,0.7); display: none}
#msg{width:100%; max-width: 400px; height: auto; position: fixed; background-color: #ffff; padding: 10px; box-sizing: border-box; border-radius: 5px; font-size: 1rem; color: #666; top:50%; margin-left: 50%; transform: translate(-50%,-50%); text-align: center; display: none}
#imgAlerta{height: 50px; width: auto}
#msg a{text-decoration: none; outline:none; font-size: 1rem}

}



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


html{font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif"; font-size: 16px;}
body{padding: 0; margin: 0; background-color: #f5f5f5}
header{width:100%; height: 60px; background-color:darkorange; position: fixed; top: 0; left: 0; right: 0; border-bottom: 5px solid #996633}

.wrap{margin: 0 auto; width: 100%; height: auto; position: relative; overflow: hidden;}
.corpo{margin:0 auto; width:90%; height: auto}

#logo{margin:0; width:110px; height: 60px; position: relative; float: left; display: flex; align-items: center}
#logo img{width:100%; height: auto}

#menus{margin:0; width:150px; height: 60px; position: relative; float: right;}
#iconResp{display: none}

#iconContato{margin:0; width: 40px; height: 60px; position: relative; float: right; display: flex; align-items: center; justify-content: flex-end; cursor: pointer}
#iconContato img{width:100%; height: auto}

#container{margin:0; width: 100%; height: calc(100vh - 80px); position: relative; float: left; margin-top: 80px;}


/*PAGINA INICIAL*/

#inicial{margin:0; width: 100%; height: auto; position: relative; float: left; display: grid; grid-template-columns:300px calc(100% - 300px); justify-content: space-around}
.conteudo{margin:0; width:100%; height: calc(100vh - 95px); position: relative; float: left; display: flex; align-items: center;}
#banner1{margin:0; width:100%; height: auto; position: relative; float: left}
#banner1 img{width:100%; height:auto}
#banner2{margin:0; width: 100%; height: auto; position: relative; float: left;  color: #666; padding-left: 20px; box-sizing: border-box}
.titulo1{display:none}
.titulo2{margin:0; width: 100%; height: auto; position: relative; float: left; font-size: 1.5rem; color: #666; font-weight: bold; margin-bottom: 1.5rem}
.texto{margin:0; width: 100%; height: auto; position: relative; float: left; color: #666; font-size: 1.5rem; margin-top: 1rem;}
#divContato{margin:0; width: 100%; height: auto; position: relative; float: left; text-align: center; margin-top: 4rem;}
#divContato2{display: none}
.botao{margin:0 auto; width: 100%; max-width: 400px; position: relative; overflow: hidden; background-color: darkorange; padding: 10px; box-sizing: border-box; border-radius: 5px; font-size: 1.2rem; box-shadow: 1px 2px 3px black; cursor: pointer}
.botao img{height: 1.2rem; width: auto; margin-left: 5px}	
.botao:active{box-shadow: -1px 0 3px black}


/*FORMULARIO*/

.formulario{margin:0; width:100%; height: auto; position: relative; float: left; display: grid; grid-template-columns: repeat(4,24%); justify-content: space-around; grid-gap: 10px; margin-bottom: 40px}

.formTitle{margin:0; width: 100%; height: auto; position: relative; float: left; text-align: left; margin-bottom: 5px; font-size: 1rem; color:#666;}
.boxInputs{margin:0; width: 100%; height: auto; position: relative; float: left; text-align: left;}
.boxInputs input[type=text]{width:100%; height: 50px; outline:none; border: none; border: 1px solid #999; border-radius: 5px; padding: 10px; box-sizing: border-box; font-size: 1rem; color: #666}
.boxInputs input[type=password]{width:100%; height: 50px; outline:none; border: none; border: 1px solid #999; border-radius: 5px; padding: 10px; box-sizing: border-box; font-size: 1rem; color: #666}
.boxInputs input[type=tel]{width:100%; height: 50px; outline:none; border: none; border: 1px solid #999; border-radius: 5px; padding: 10px; box-sizing: border-box; font-size: 1rem; color: #666}
.boxInputs select{width:100%; height: 50px; outline:none; border: none; border: 1px solid #999; border-radius: 5px; padding: 10px; box-sizing: border-box; font-size: 1rem; color: #666}
#boxButton{margin:0; width: 100%; height: auto; position: relative; float: left; text-align: center}
#boxButton button{width:100%; max-width: 400px; height: 50px; outline:none; border: none; border-radius: 5px; background-color: darkorange; font-size: 1rem; box-shadow: 2px 3px 5px black; cursor: pointer}
#boxButton button:active{box-shadow: -2px 0 5px black}
#boxButton button:hover{opacity:0.9}



/*ALERTAS*/
#cover{width:100%; height: 100vh; position: fixed; top:0; left: 0; right: 0; bottom: 0; background-color: rgba(0,0,0,0.7); display: none}
#msg{width:100%; max-width: 400px; height: auto; position: fixed; background-color: #ffff; padding: 10px; box-sizing: border-box; border-radius: 5px; font-size: 1rem; color: #666; top:50%; margin-left: 50%; transform: translate(-50%,-50%); text-align: center; display: none}
#imgAlerta{height: 50px; width: auto}
#msg a{text-decoration: none; outline:none; font-size: 1rem}

}



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


html{font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif"; font-size: 16px;}
body{padding: 0; margin: 0; background-color: #f5f5f5}
header{width:100%; height: 60px; background-color:darkorange; position: fixed; top: 0; left: 0; right: 0; border-bottom: 5px solid #996633}

.wrap{margin: 0 auto; width: 100%; height: auto; position: relative; overflow: hidden;}
.corpo{margin:0 auto; width:90%; height: auto}

#logo{margin:0; width:100px; height: 60px; position: relative; float: left; display: flex; align-items: center}
#logo img{width:100%; height: auto}

#menus{margin:0; width:150px; height: 60px; position: relative; float: right;}
#iconResp{display: none}

#iconContato{margin:0; width: 30px; height: 60px; position: relative; float: right; display: flex; align-items: center; justify-content: flex-end; cursor: pointer}
#iconContato img{width:100%; height: auto}

#container{margin:0; width: 100%; height: calc(100vh - 80px); position: relative; float: left; margin-top: 80px;}


/*PAGINA INICIAL*/

#inicial{margin:0; width: 100%; height:calc(100vh - 200px);  position: relative; float: left; overflow-x: auto; }
.conteudo{margin:0; width:100%; height:auto; position: relative; float: left; display: flex; align-items: center; margin-bottom: 10px}
#banner1{margin:0; width:100%; height: auto; position: relative; float: left; text-align: center}
#banner1 img{width:200px; height:auto}
#banner2{margin:0; width: 100%; height: auto; position: relative; float: left;  color: #666; padding-left: 10px; box-sizing: border-box}
.titulo1{margin:0; width: 100%; height: auto; position: relative; float: left; font-size: 1.2rem; font-weight: bold; color: #666; margin-bottom: 2rem;}
.titulo2{display: none}
.texto{margin:0; width: 100%; height: auto; position: relative; float: left; color: #666; font-size: 1rem; margin-top: 1rem;}
#divContato{display: none}
#divContato2{margin:0; width: 90%; height: auto; position: fixed; bottom:0; left: 0; right: 0; margin-bottom: 10px; margin-left: 50%; transform: translate(-50%)}
.botao{margin:0; width: 100%; position: relative; float: left; background-color: darkorange; padding: 10px; box-sizing: border-box; border-radius: 5px; font-size: 1rem; color: #666; font-weight: bold; box-shadow: 1px 2px 3px black; text-align: center; cursor: pointer}
.botao img{height: 1rem; width: auto; margin-left: 5px}
.botao:active{box-shadow: -1px 0 3px black}
	
	


/*FORMULARIO*/

.formulario{margin:0; width:100%; height: auto; position: relative; float: left; display: grid; grid-template-columns: repeat(4,24%); justify-content: space-around; grid-gap: 10px; margin-bottom: 40px}

.formTitle{margin:0; width: 100%; height: auto; position: relative; float: left; text-align: left; margin-bottom: 5px; font-size: 1rem; color:#666;}
.boxInputs{margin:0; width: 100%; height: auto; position: relative; float: left; text-align: left;}
.boxInputs input[type=text]{width:100%; height: 50px; outline:none; border: none; border: 1px solid #999; border-radius: 5px; padding: 10px; box-sizing: border-box; font-size: 1rem; color: #666}
.boxInputs input[type=password]{width:100%; height: 50px; outline:none; border: none; border: 1px solid #999; border-radius: 5px; padding: 10px; box-sizing: border-box; font-size: 1rem; color: #666}
.boxInputs input[type=tel]{width:100%; height: 50px; outline:none; border: none; border: 1px solid #999; border-radius: 5px; padding: 10px; box-sizing: border-box; font-size: 1rem; color: #666}
.boxInputs select{width:100%; height: 50px; outline:none; border: none; border: 1px solid #999; border-radius: 5px; padding: 10px; box-sizing: border-box; font-size: 1rem; color: #666}
#boxButton{margin:0; width: 100%; height: auto; position: relative; float: left; text-align: center}
#boxButton button{width:100%; max-width: 400px; height: 50px; outline:none; border: none; border-radius: 5px; background-color: darkorange; font-size: 1rem; box-shadow: 2px 3px 5px black; cursor: pointer}
#boxButton button:active{box-shadow: -2px 0 5px black}
#boxButton button:hover{opacity:0.9}



/*ALERTAS*/
#cover{width:100%; height: 100vh; position: fixed; top:0; left: 0; right: 0; bottom: 0; background-color: rgba(0,0,0,0.7); display: none}
#msg{width:100%; max-width: 400px; height: auto; position: fixed; background-color: #ffff; padding: 10px; box-sizing: border-box; border-radius: 5px; font-size: 1rem; color: #666; top:50%; margin-left: 50%; transform: translate(-50%,-50%); text-align: center; display: none}
#imgAlerta{height: 50px; width: auto}
#msg a{text-decoration: none; outline:none; font-size: 1rem}

}