:root{
  --r:#d26f82;
  --b:#6380be;
  --y:#eab841;
  --branco:#ffffff;
}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin:0; padding:0; border:0; font-size:100%; font:inherit; vertical-align:baseline}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
body {line-height:1}
ol, ul {list-style:none}
blockquote, q {quotes: none}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none}
table {border-collapse: collapse; border-spacing:0}

html, body{min-width:100%; min-height:100%}
*, *:after, *:before, html, body{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; vertical-align:baseline}
html, body{font-family:'Roboto',sans-serif; font-weight:300; font-size:16px; line-height:1.3em; color:var(--branco)}
body{background:url('../img/bg.jpg') top left no-repeat; background-size:cover}

a, p, td, th, div, h1, h2, h3, h4, h5, h6, li, a{vertical-align:middle; text-align:left; text-decoration:none; color:inherit; font:inherit; line-height:inherit}
a:hover{text-decoration:none}
i{font-style:italic}
strong, b, .bold{font-weight:900}

h1, h1 *{font-size:40px}
h2, h2 *{font-size:36px}
h3, h3 *{font-size:32px}
h4, h4 *{font-size:28px}
h5, h5 *{font-size:24px}
h6, h6 *{font-size:20px}
h1, h1 *, h2, h2 *, h3, h3 *, h4, h4 *, h5, h5 *, h6, h6 *{line-height:1.5em}
@media screen and (max-width:600px){
  h1, h1 *{font-size:32px}
  h2, h2 *{font-size:28px}
  h3, h3 *{font-size:24px}
  h4, h4 *{font-size:22px}
  h5, h5 *{font-size:20px}
  h6, h6 *{font-size:18px}
  h1, h1 *, h2, h2 *, h3, h3 *, h4, h4 *, h5, h5 *, h6, h6 *{line-height:1.5em}
}


input, select, button, textarea, *.boxinput{font:inherit; width:100%; padding:.6em; margin:.6em auto; display:block; border-radius:.4em; background-color:#f0f0f0; font-size:16px; border:0}

.preto{color:var(--preto)}
.red{color:var(--r)}
.blue{color:var(--b)}
.yellow{color:var(--y)}
.branco{color:var(--branco)}
.bgred{background-color:var(--r)!important}
.bgblue{background-color:var(--b)!important}
.bgyellow{background-color:var(--y)!important}
.bgbranco{background-color:var(--branco)!important}

.space{padding:1em 10px}
.spacing{padding:2em 10px}
.descricao{margin:.7em 0}

ul.tricolor{display:table; width:100%; height:16px; position:absolute; z-index:999}
ul.tricolor li{display:table-cell; width:33.3%; height:12px}
ul#Top{top:0}
ul#Bottom{bottom:0}

section{width:100%; min-width:300px; clear:both; display:block}
div.content{width:90%; min-width:300px; max-width:1280px; margin:0 auto}

#Logo{width:80%; max-width:360px; position:absolute; top:50%; left:50%; transform: translate(-50%, -50%)}

#Base{padding-bottom:18px; bottom:0; position:absolute}
#Base h6{margin:6px 0}
#Base *{vertical-align:middle; text-shadow:1px 1px 1px var(--branco)}
#Base a:hover{text-decoration:underline}

.center{text-align:center}
.right{text-align:right}
.fleft{float:left}
.fright{float:right}
.padding{padding:.5em 0}

.margintitle{margin:.6em 0}
.pointer{cursor:pointer}
.upper{text-transform:uppercase}
.bold, *.bold *{font-weight:bold}
.italic, *.italic *{font-style:italic}
.post, *.post *{font-size:14px}
.little, *.little *{font-size:12px}
.mini, *.mini *{font-size:10px}

*.break{display:block}
*.clear{clear:both}