@font-face {
  font-family: 'Gravity-Bold';
  src: url('../fonts/Gravity-Bold.eot?#iefix') format('embedded-opentype'),
  		url('../fonts/Gravity-Bold.woff') format('woff'),
  		url('../fonts/Gravity-Bold.ttf')  format('truetype'),
  		url('../fonts/Gravity-Bold.svg#Gravity-Bold') format('svg');
  font-weight: normal;
  font-style: normal;
}
html, body, .container {
	background-color: #dedede;
    font-family: 'Maven Pro', sans-serif;
    height: 100%;
}
.vcenter {
	display: table-cell;
	vertical-align: middle;
}
.all-height {
	height: 100vh;
	padding-top: 10%;
}
.container h1, .container h1 img{
	margin: auto 0;
}
.content-area {
	min-height: 100vh;
}
.container::after {
	background: url('../img/indicou_ganhou.webp') no-repeat;
	content: " ";
	position: fixed;
	bottom: 0;
	left: 2%;
	width: 326px;
	height: 342px;
	z-index: 0;
}
.container::before {
	content: "";
	background: url('../img/arrows_background.png') no-repeat;
	position: fixed;
	bottom: -10px;
	right: 0;
	width: 593px;
	height: 191px;
	z-index: 0;
}
.sidebar {
	background-color: rgba(100,178,175,0.9);
	box-shadow: 0 0 10px grey;
	text-align: center;
	padding-bottom: 60px;
	z-index: 9;
}
.sidebar.white-bg {
	background-color: rgba(252,252,252,0.9);
}
.sidebar h3 {
	font-family: 'Gravity-Bold';
	color: #f4f4f4;
	font-size: 3rem;
	text-transform: uppercase;
}
.sidebar.white-bg h3 {
	background-color: rgba(100,178,175,0.9);
	font-size: 1.8rem;
	padding: 2em 30px 2em 30px;
	margin:0 0 1em 0;
}
.sidebar p {
	color: #FFF;
	font-size: 1.6rem;
	line-height: 1.9rem;
	margin: 60px 0;
}
.sidebar.white-bg p {
	color: #434040;
	font-size: 1.6rem;
	line-height: 1.9rem;
	margin: 40px 0 20px 0;
}
.sidebar .btn {
	color: #FFF;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	text-transform: uppercase;
	box-shadow: 0 8px 5px grey;
	font-style: italic;
	font-weight: bold;
	margin: 0;
	transition: 0.1s linear;
	-webkit-transition: 0.1s linear;
	-moz-transition: 0.1s linear;
}
.sidebar .comecar-agora, .sidebar .comecar-agora:hover {
	background-color: #f3ac5c;
	border: 1px solid #e6c89f;
	text-shadow: 0 3px 2px grey;
	padding: 10px 20px;
	font-size: 1.35em;
	margin-bottom: 25px;
}
.sidebar .comecar-agora:hover {
	padding: 12px 22px;
	margin-top:-2px;
	margin-bottom: 23px;
}
.sidebar .indicar, .sidebar .indicar:hover {
	background-color: #FFF;
	border: 1px solid #dbdcde;
	color: #70b6b3;
	box-shadow: 0 5px 5px grey;
}
.sidebar .indicar:hover {
	padding: 8px 14px;
	margin-top:-2px;
}
.sidebar.white-bg .btn {
	margin-top: 40px;
}
.sidebar.white-bg form label {
	display: block;
	width: 100%;
	color: #434040;
	padding: 0 10px;
	font-size: 1.2em;
	margin: 1em 0 0.2em 0;
	text-align: left;
}
.sidebar.white-bg form label.error {
	margin:0 0 1em 0;
	padding: 0;
	color: #cc0000;
}
.sidebar.white-bg form input, .sidebar.white-bg textarea {
	display: block;
	width: 100%;
	color: #434040;
	border:1px solid #d5d5d6;
	font-size: 1.2em;
	font-weight: normal;
	text-align: left;
	padding:10px;
}
.sidebar.white-bg textarea {
	resize: none;
	height: 100px;
}
.sidebar.white-bg span.share {
	margin-top: 1em;
	width: 100%;
	display: block;
}
.sidebar.white-bg span.share i {
	cursor: pointer;
	padding-right: 4px;
	font-size: 1.3em;
}
.sidebar.white-bg span.share i.fa-facebook {
	color: #3B5998;
}
.sidebar.white-bg span.share i.fa-whatsapp {
	color: #25D366;
}
.sidebar.white-bg span.share i.fa-twitter {
	color: #1DA1F2;
}
.no-padding {
	padding: 0 !important;
}
.main-frame {
}
.main-frame p {
	font-size: 1.5em;
	color: #434040;
	line-height: 1em;
	text-transform: uppercase;
	padding: 0;
	margin: 0;
	z-index: 1000;
}
.main-frame .example p b {
	font-family: 'Gravity-Bold';
}
.main-frame .example h2 {
	font-family: 'Gravity-Bold';
	font-weight: bold;
	color: #58a38b;
	margin: 0.4em 0 0 0;
	padding: 0;
	width: 100%;
	line-height: 1em;
	font-size: 1.5em;
	text-transform: uppercase;
}
@media screen and (min-width:768px) and (max-width: 992px) {
	.all-height {
		padding-top: 20%;
	}
	.sidebar .comecar-agora, .sidebar .comecar-agora:hover {
		padding: 8px 15px;
		font-size: 1.2em;
		margin-top: 0;
		margin-bottom: 25px;
	}
	.sidebar .indicar, .sidebar .indicar:hover {
		padding: 4px 10px;
		font-size: 0.8em;
		margin-top: 0;
	}
	.container::after {
		background: url('../img/indicou_ganhou.webp') no-repeat;
		content: " ";
		position: fixed;
		bottom: 0;
		left: 0;
		width: 326px;
		height: 342px;
		z-index: 0;
	}
	.container::before {
		content: "";
		background: url('../img/arrows_background.png') no-repeat;
		position: fixed;
		bottom: -10px;
		right: -5%;
		width: 593px;
		height: 191px;
		z-index: 0;
	}
}
@media screen and (max-width: 767px) {
	body {
		overflow: auto;
	}
	.container h1 img {
		margin: 40px 0;
	}
	.container::after {
		background: none;
	}
	.all-height {
		height: auto;
	}
	.sidebar {
		padding-top: 40px;
		padding-bottom: 40px;
	}
	.sidebar.white-bg {
		padding-top:0;
		padding-bottom: 40px;
	}
	.sidebar h3 {
		font-size: 2.5rem;
	}
	.sidebar p {
		margin: 40px 0;
	}
	.sidebar .btn:last-of-type {
		margin-bottom: 30px;
	}
	.container:before {
		background: none;
	}
	.sidebar::before {
		width: 100%;
	}
	.main-frame .example h2 {
		margin-bottom: 1.5em;
		font-size: 1.3em;
		line-height: 0.9em;
		margin-top: 0.4em;
	}
	.main-frame .example p {
		font-size: 1.3em;
		line-height: 0.9em;
	}
}