@charset "UTF-8";

@font-face {
	font-family: HaveHeartOne;
	src: url(HaveHeartOne.otf)
}

@font-face {
	font-family: FuturaStd;
	src: url(FuturaStd-Book.otf)
}

@font-face {
	font-family: FuturaStd2;
	src: url(FuturaStd-CondensedOblique.otf)
}

/*-------------------Corpo do Site-------------------*/
body {
    font-size: 62.5%;
    line-height: 1.5;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #444;
    width: 1910px;
    height: 1040px;
}

*, *:before, *:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}


.container {
    width: 800px;
    margin: auto;
    box-shadow: 0em .1em 0.4em .4em rgba(255,255,255,.4);
    background: #FFF; /* fundo branco para navegadores que não suportam rgba */
    background: rgba(0,0,0,0.4);
    position: relative;
	float: left;
}
.container li{
	font-size: 2.5em;
	color: white;
	underline: none;
	
}	

.container ul{
	list-style-type: none;
	underline: none;
	
}	

/*-------------------Imagem de Fundo do Site-------------------*/
#fundo-externo {
    overflow: hidden; /* para que não tenha rolagem se a imagem de fundo for maior que a tela */
    width: 100%;
    position: relative; /* criamos um contexto para posicionamento */
}

#fundo {
    position: fixed; /* posição fixa para que a possível rolagem da tela não revele espaços em branco */
    width: 100%;
	 
}

#fundo img {
    width: 1910px;
	height: 1070px;
    position: absolute;

}
/*-------------------Fim Imagem de Fundo do Site-------------------*/

label#titport {
	font-size: 8em;
    color: rgb(128,80,66);
    margin-left: 0px;
    margin-bottom: -50px;
    font-family: HaveHeartOne;
}
label#titing {
	font-size: 4em;
    color: rgb(128,80,66);
    margin-left: 0px;
    padding-top: 80px;
    font-family: HaveHeartOne;
}

label#titportcha {
	font-size: 8em;
    color: rgb(128,80,66);
    margin-left: 0px;
    margin-bottom: -50px;
    font-family: HaveHeartOne;
}
label#titingcha {
	font-size: 4em;
    color: rgb(128,80,66);
    margin-left: 30px;
    padding-top: 80px;
    font-family: HaveHeartOne;
}

label#tittport {
	font-size: 3.8em;
	font-weight: bold;
    margin-left: 0%;
    margin-top: -50px;
    color: rgb(128,80,66);
    font-family: FuturaStd;
}
label#tittportb {
	font-size: 3.8em;
	font-weight: bold;
	margin-left: 20%;
    color: rgb(128,80,66);
    font-family: FuturaStd;
}
label#titting {
	font-size: 2em;
	font-weight: bold;
	margin-left: 4%;
    color: rgb(128,80,66);
    font-family: FuturaStd;
}
label#tittingb {
	font-size: 2em;
	font-weight: bold;
	margin-left: 15%;
    color: rgb(128,80,66);
    font-family: FuturaStd;
}

.container1 {
    width: 57%;
    margin-top: 3%;
	margin-left: 8.5%;
    position: relative;
    float: left;
}

.container1cha {
    width: 57%;
    margin-top: 5%;
	margin-left: 2.5%;
    position: relative;
    float: left;
}

.container1n {
    width: 57%;
    margin-top: -14px;
	margin-left: 8.5%;
    position: relative;
    float: left;
}

.container12n {
    width: 24%;
    margin-top: -95px;
	margin-left: 36.5%;
    position: relative;
    float: left;
  
}
.container22n {
    width: 57%;
    margin-top: -50px;
	margin-left: 6.5%;
    position: relative;
    float: left;
}

h3#titcafeport {
	font-size: 2.6em;
	font-weight: bold;
	color: rgb(128,80,66);
	margin-bottom: 0%;
    margin-top: 12%;
    font-family: FuturaStd;
}
h3#titcafeport2{
	font-size: 2.6em;
	font-weight: bold;
	color: rgb(128,80,66);
	margin-bottom: 0%;
    margin-top: 2.5%;
    font-family: FuturaStd;
}

h3#titcapport2{
	font-size: 2.6em;
	font-weight: bold;
	color: rgb(128,80,66);
	margin-bottom: 1%;
    margin-top: 2.2%;
    font-family: FuturaStd;
}
h3#titcafeport3{
	font-size: 2.6em;
	font-weight: bold;
	color: rgb(128,80,66);
	margin-bottom: -4%;
    margin-top: 5.5%;
    margin-left: 0%;
    font-family: FuturaStd;
}

h3#titpequeno {
	font-size: 4em;
	font-weight: bold;
	margin-left: -45%;
	padding-top: 10%;
    color: rgb(128,80,66);
    font-family: FuturaStd;
}
h3#titpequeno2 {
	font-size: 4em;
	font-weight: bold;
	margin-left: -45%;
	margin-top: 27%;
    color: rgb(128,80,66);
    font-family: FuturaStd;
}
h3#titgrande {
	font-size: 4em;
	font-weight: bold;
	margin-left: -130px;
	padding-top: 10%;
    color: rgb(128,80,66);
    font-family: FuturaStd;
}
h3#titgrande2 {
	font-size: 4em;
	font-weight: bold;
	margin-left: -130px;
	margin-top: 27%;
    color: rgb(128,80,66);
    font-family: FuturaStd;
}
h3#invisivel {
	font-size: 4em;
	font-weight: bold;
	margin-left: -130px;
	margin-top: 27%;
    color: rgb(245,237,190);
    font-family: FuturaStd;
}
h3#titgrande3 {
	font-size: 4em;
	font-weight: bold;
	margin-left: -130px;
	margin-top: 15%;
    color: rgb(128,80,66);
    font-family: FuturaStd;
}
label#titcafeing {
	font-size: 2em;
    color: rgb(128,80,66);
    font-family: FuturaStd;
}
label#titcafeing2 {
	font-size: 2em;
    color: rgb(128,80,66);
    font-family: FuturaStd;
}
h3#titcafeing3 {
	font-size: 2em;
    color: rgb(128,80,66);
    font-family: FuturaStd;
    margin-bottom: -20px;
    margin-left: 0%;
}
.container2 {
    width: 650px;
	height: 600px;
    margin-top: 155px;
	margin-left: 170px;
    position: absolute;
	float: left;
}

.container3 {
    width: 220px;
	height: 600px;
    margin-top: 185px;
	margin-left: 815px;
    position: absolute;
	float: left;
	
}

.container4 {
    width: 220px;
	height: 600px;
    margin-top: 185px;
	margin-left: 1088px;
    position: absolute;
	float: left;
	
}

/*Telab */
.container1b {
    width: 57%;
    margin-top: 240px;
	margin-left: 150px;
    position: absolute;
	float: left;
}

label#titportb {
	font-size: 7em;
	font-weight: bold;
	color: rgb(128,80,66);
}

h3#titcafeportb {
	font-size: 3.8em;
	font-weight: bold;
	color: rgb(128,80,66);
	margin-bottom: -2%;
	margin-top: 10%;
}
h3#titcafeingb {
	font-size: 8em;
	color: rgb(128,80,66);
	margin-top: 90px;
}

.container2b {
    width: 700px;
	height: 600px;
    margin-top: 350px;
	margin-left: 155px;
    position: absolute;
	float: left;
	
}

.botaotela{
	border: solid;
	width: 300px;
	height: 150px;
	margin-bottom: 100px;
	float: center;
	position: relative;
	padding-top:40px;
	padding-left:75px;
	font-size: 4em;
	color: white;
	background-color: black;
}

a {
	text-decoration: none;
	padding-top: 100px;
}

 ul{
	list-style-type: none;
	underline: none;
}	

.menutelas {
	width: 100vw;
    height: 100vh;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center
}
.menutelas2 {
	width: 100%;
    height: 100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center
}

button#btn{
	width:150px;
	height:100px;
	background-color: red;
	color: white;
	font-size:4em;
}