/*
	Criado por Guilherme Giannoulakis - twitter.com/giannoulakis
*/
* {margin:0; padding:0; box-sizing:border-box; }
*:after, *:before { box-sizing:border-box; }
html {scroll-behavior: smooth; }
body {font-family:Lato, sans-serif; font-size:17px; line-height:1.4; color:#414D5C; }
ul { list-style: none;  }
a { text-decoration: none; }
img { max-width: 100%; height:auto; }

.flex { display: flex;  }
@media(min-width: 992px){
	.is-mobile { display: none; }
	.d-flex { display: flex;  }
}
@media(max-width: 991px){
	.is-desktop { display: none; }
}

.container{max-width:1170px; padding-left:15px; padding-right:15px; margin:0 auto; }

.btn {display: inline-block; padding:10px 30px; background:#FF901E; color:#fff; box-shadow: 1px 1px 5px rgba(0,0,0,.05); transition: .3s; text-align: center; border-radius:3px;}
.btn a:hover {box-shadow: 1px 1px 5px rgba(0,0,0,.2); filter: brightness(1.05); }
.btn-alt {background:#FAFAFB; color:#2A323C; }

header { padding:15px 0; position: fixed; z-index:10; top:0; left:0; right:0; background: #FAFAFB; box-shadow: 1px 1px 5px rgba(0,0,0,.05); transition: .3s; }

.logo { color:#2A323C; font-size:30px; height:50px; transition: .3s; }
.logo svg { height:50px; width:50px; display: inline-block; transition: .3s;   }
.logo strong { font-family: Marcellus SC; }
/*.logo strong { font-family: Germania One; font-weight: 400 }*/
.logo a { color:inherit; display: flex; align-items: center; }

header .container{ align-items:center; justify-content: space-between; }
.responsive-menu { position: relative; }

header ul a {display: block; color:inherit; padding:10px 30px;  transition: .3s;}
header ul a:hover {text-decoration: underline; }
.header-actions {}

header.floating { padding:10px 0; 	}
header.floating .logo { height:40px; }
header.floating .logo svg { height:40px; }

@media(min-width: 992px){
	.responsive-menu .toggle {display:none; }
	header ul  {display: flex; }
	.header-actions {margin:0 0 0 40px; }
}
@media(max-width: 991px){
	header ul a {text-align: center; padding:10px 30px; }
	.header-actions {margin:10px 0 0 0; }
	.responsive-menu .toggle {display: block; width:40px; height: 40px; margin-right: -10px; font-size:26px;}
	.responsive-menu .toggle:before {display: block; content: '≡'; text-align: center; line-height: 40px; }
	.responsive-menu.active .toggle:before {content:'×'; }
	.responsive-menu .content {display: none; position: absolute; top:100%; right:0; background: #FAFAFB; padding:20px; box-shadow: 1px 1px 5px rgba(0,0,0,.05); transition: .3s;}
	.responsive-menu.active .content {display: block; }
}

.hero { margin-top:80px; padding:40px 0; background:#FAFAFB; color:#414D5C;}
.hero .hero-info { margin-bottom:40px; text-align:center; }
.hero h1 { margin-bottom:20px; line-height: 1.1;  }
.hero p { margin-bottom:20px;  }
.hero .video { position:relative; width:100%; flex-shrink: 0; width:calc(100% + 30px); margin-left:-15px; margin-right:-15px; background:#fff; }
.hero .video:before { content:''; position:absolute; top:calc(50% - 30px); left:calc(50% - 30px); width:60px; height:60px; background:url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"%3E%3Cpath fill="%23000" d="M12,4V2A10,10 0 0,0 2,12H4A8,8 0 0,1 12,4Z" /%3E%3C/svg%3E') no-repeat center; background-size:60px; animation: rotating 0.6s linear infinite; }
.hero .video video {position:relative; z-index:3; display:block; width:100%; }


@media(min-width: 992px){
.hero { padding:60px 0; }
	.hero .container { justify-content: space-between; align-items: center; }
	.hero .hero-info {text-align:left; width:50%; margin:0 40px 0 0;  }
	.hero .video { width: 550px; height: 440px; margin:0; }
}

.features{ padding:60px 0; }
.feature { padding:20px; text-align: center; }
.feature img {  display: inline-block; width:30px; height:30px; }
.feature img { display:none; }
.feature h3 { font-weight: bold; font-size:18px; margin-bottom:10px; }
.feature p { font-size:13px; margin:0; }


@media(min-width: 992px){
	.features .container { justify-content: center; flex-wrap: wrap; }
	.feature { width:25%; padding:35px;}
}

.templates{ padding:60px 0; }
.templates h2 { text-align:center; margin-bottom:40px; }
.template { padding:15px 5px; text-align: center; width:50%; position: relative; }
.template img { display: block; width:100%; margin-bottom:10px; transition: .3s }
.template h4 { font-weight: bold; font-size:18px; margin-bottom:10px; }
.template a {}
.templates .container { justify-content: center; flex-wrap: wrap; }


@media(min-width: 992px){
	.template a {
		transition: .3s .2s;
		opacity: 0;
		position: absolute;
		bottom: 44px;
		left: calc(50% - 60px);
		width: 120px;
		height: 44px;
	 }
	.template:hover a { opacity: 1; }
	.template:hover img { filter:brightness(0.5); }
	.template { width:25%; }
}


.plans{ padding:60px 0; background:#FAFAFB; color:#414D5C;}
.plans h2 { text-align:center; margin-bottom:10px; }
.plans .subtitle { text-align:center; margin-bottom:40px; }

.plans .item { padding:0 0 15px; }
.plans .plan{ background:#fff;  box-shadow: 1px 1px 5px rgba(0,0,0,.05); border-radius:3px; text-align:center; color:#414D5C; height:100%; padding:20px 20px;}
.plans .plan:hover{  box-shadow: 1px 1px 5px rgba(0,0,0,.2); }

.plans .plan span { display:block; text-transform: uppercase; font-size:14px; margin-bottom:10px; }
.plans .plan strong { display:block; font-size:32px; margin-bottom:30px; }
.plans .plan ul { text-align:left; margin-left:40px; }
.plans .plan li { margin-bottom:5px; position:relative; }
.plans .plan li.check:before { content:''; position:absolute; left:-30px; top:0; width:20px; height:20px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 155 139.56'%3E%3Cpath fill='none' stroke='%23FF901E' stroke-linecap='round' stroke-linejoin='round' stroke-width='20' d='M10,54.86s36.31,25.46,50.49,74.7c0,0,25.25-72.82,84.51-119.56'/%3E%3C/svg%3E") no-repeat center; background-size:contain;  }
.plans .plan del{color:rgba(0,0,0,.4);}

@media(min-width: 992px){
	.plans .container { justify-content: center; flex-wrap: wrap; }
	.plans .item {  padding:15px; width:50%; }
	.plans .plan{ padding:30px 30px; }
}

.plans-cta { text-align: center; margin-top:30px; }
.plans-cta a { width:160px;; }
.plans-cta a + a { margin-left:10px;  }

.soon {color:rgba(0,0,0,.4); position: relative; }
.soon:after {content:"(em breve)"; font-size:12px; font-weight: bold; display:inline-block; margin-left:5px; }


.contact { padding:100px 0; background:#fff; color:#333; text-align: center;}
.contact h2 { margin-bottom:40px;  }
.contact p { margin-bottom:20px;  }
.contact .btn { background-color:#27a91f; display:inline-flex; align-items:center; }
.contact .btn:before {
	content: '';
	background: url(images/svg/whatsapp-white.svg) no-repeat center;
	background-size: contain;
	width: 20px;
	height: 20px;
	margin-right: 5px;
	align-items: center;
}

footer {background:#000; color:#999; padding:20px; text-align: center; font-size:12px; }


@keyframes rotating {from {transform: rotate(0deg); } to {transform: rotate(360deg); } }