
@font-face {
	font-family: 'font-1';
	src: url("../font/Pentay-Book-ffp.ttf");
}

@font-face {
	font-family: 'font-2';
	src: url("../font/BlackLabel-Light.ttf");
}

* {
  box-sizing: border-box;
}

/* Base */
body {
  margin: 0;
  font-family: Arial;
  padding: 0;
 background-color: #FFFFFC;
}

/* Figura responsiva */
img {
	max-width: 100%;
	height: auto;
	border-radius: 6px;
}

h1 {
	color: #E88D67;
	font-family: 'font-1';
	text-shadow: 2px 2px 4px #000000;
	margin-bottom: 7px;
	text-align: center;
	font-size: 3.5rem;
}

h2 {
	color: #DA1212;
	font-family: 'font-2';
	text-shadow: 2px 2px 4px #000000;
	margin-bottom: 7px;
}

h3 {
	color: #000;
	font-family: Arial;
	text-align: center;
}


        /* CABEÇALHO */
        header {
            background-color: #FFF;
            color: #ffffff;
            padding: 1rem 2rem;
            position: sticky;
            top: 0;
            z-index: 100;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
        }

        .header-container {
            max-width: 1200px;
            margin: 0 auto;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

/* container1 */
.container1 {
	background: #C0E6DE;
	margin-top: 0;
	padding: 30px 0;
}

.small-container1 {
	max-width: 1080px;
	margin: auto;
	padding-left: 25px;
	padding-right: 25px;
	text-align: center;
}

/* -------- */

/* Estrutura do corpo da página com três colunas */
.nave3 {
  padding: 15px;
  background: none;
  margin: 15px;
}
.nave3-a {
	float: left;
	width: 15%;
	padding: 15px;
	text-align: justify;
	background: none;
}
.nave3-b {
	float: left;
	width: 70%;
	padding: 15px;
	text-align: justify;
	background: none;
} 
.nave3-c {
	float: left;
	width: 15%;
	padding: 15px;
	text-align: justify;
	background: none;
}
@media only screen and (max-width:620px) {
  /* For mobile phones: */
  .nave3-a, .nave3-b, .nave3-c {
    width:100%;
  }
}
/* ----- */

/* Create two equal columns that floats next to each other */
.column {
  float: left;
  width: 33%;
  padding: 10px;
  height: auto; /* Should be removed. Only for demonstration */
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .column {
    width: 100%;
  }
}
/* ----- */
/* Figura em movimento */
.img-1 img:hover {
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
}
/* ------ */

/* ------------ offer ------------ */

.offer {
	background: radial-gradient(#FFF,#FFD6D6);
	margin-top: 0;
	padding: 30px 0;
	text-align: center;
}
.col-2 .offer-img {
	padding: 50px;
}
small {
	color: #555;
}
.small-container {
	max-width: 1080px;
	margin: auto;
	padding-left: 25px;
	padding-right: 25px;
}
.row {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	justify-content: space-around;
}
.col-2 {
	flex-basis: 50%;
	min-width: 300px;
}
.col-2 img {
	max-width: 100%;
	padding: 50px 0;
}
.col-2 h1 {
	font-size: 50px;
	line-height: 60px;
	margin: 25px 0;
}
/* ------ */

/* --- menu --- */
ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  width: 100%;
  background: none;
}

li a {
  display: block;
  color: #000;
  padding: 8px 16px;
  text-decoration: none;
  border-radius: 6px;
  border: 1px solid  #532567;
}

.active {
	background-color: #BEB7A4;
	border-radius: 6px;
	border: 1px solid  #532567;
	opacity: .7;
 }

/* Change the link color on hover */
li a:hover {
  background-color: #E8EBE4;
  opacity: .7;
  color: #532567;
}
/* ----- */

/* para link em palavra ou frase */
.estilo1 {
	color: #696969;
	text-decoration: none;
	font-family: Arial;
}
a:hover{
 text-decoration: none;
 color: #CCC;
}

/* botão x */
.button-x {
background: none;
color: #70A1FF;
border: 1px solid #70A1FF;
border-radius: 25px;
padding: 12px 40px;
text-transform: uppercase;
font-size: 14px;
transition: 0.4s linear;
cursor: pointer;
-webkit-transitio: backgound-color 1s;
	-moz-transitio: backgound-color 1s;
	-o-transitio: backgound-color 1s;
	-ms-transitio: backgound-color 1s;
	transition: background-color 4s;
}
.button-x:hover {
background-color: #70A1FF;
border: 1px solid #70A1FF;
color: #FFF;
box-shadow: 0 12px 15px 0 rgba(0,0,0,0.24),0 12px 15px 0 rgba(0,0,0,0.19);
}
/* ----- */

/* --- Rodapé --- */
footer {
            background-color: #1a1a2e;
            text-align: center;
            padding: 2rem;
            margin-top: 0;
            font-size: 0 9rem;
        }
footer p {
				color: #FFF;
}

/* ---------- */


