@import url(https://fonts.googleapis.com/css?family=Roboto:300,400,700);
@import url(https://fonts.googleapis.com/css?family=Tangerine:400,700);
@import url(/lib/fonts/topping_icn2/topping_icn.css);
@import url(https://fonts.googleapis.com/css?family=Roboto:300,400,700);
@import url(https://fonts.googleapis.com/css?family=Tangerine:400,700);
@import url(/lib/fonts/topping_icn2/topping_icn.css);
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; }

/* HTML5 display-role reset for older browsers */
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; }

* {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box; }

.padded {
  padding: 0 20px !important; }

.clear {
  clear: both; }

.fixed-scroll {
  overflow: hidden; }

.mb-only {
  display: block; }

.tb-only, .dt-only {
  display: none; }

img.mb-only {
  width: 100%;
  height: 50vw; }

#content {
  padding: 80px 20px 20px 20px; }
  #content p, #content h1 {
    font-family: 'Roboto', sans-serif;
    margin: 20px 0; }
  #content h1 {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 1.5em;
    line-height: 1; }
  #content ul {
    padding-left: 1.5em; }
  #content p, #content li {
    font-family: 'Roboto', sans-serif;
    line-height: 1.25;
    color: #1E1E1E;
    font-weight: 300; }
  #content li {
    line-height: 1.4; }
  #content a {
    text-decoration: underline; }
  #content a:hover {
    color: #000;
    text-decoration: underline; }
  #content.content2 h1, #content.content2 a {
    color: #008940; }
  #content.content3 h1, #content.content3 a {
    color: #403280; }
  #content.content4 h1, #content.content4 a {
    color: #D60613; }
  #content.content5 h1, #content.content5 a {
    color: #008940; }

@media only screen and (min-width: 768px) {
  .tb-only {
    display: block; }

  .mb-only, .dt-only {
    display: none; } }
@media only screen and (min-width: 1024px) {
  .dt-only {
    display: block; }

  .tb-only, .mb-only {
    display: none; } }
@media only screen and (min-width: 1240px) {
  .padded {
    width: 1200px !important;
    margin: 0 auto;
    padding: 0 !important; } }
/* CSS Document */
p, h1, h2, h3, h4, h5, h6 {
  font-family: 'Roboto', sans-serif;
  margin: 20px 0; }

div {
  font-family: 'Roboto', sans-serif;
  font-size: 16px; }

h1 {
  font-weight: 700;
  text-transform: uppercase;
  color: #403280;
  font-size: 1.5em;
  line-height: 1; }

h2 {
  font-weight: 700;
  text-transform: uppercase;
  color: #403280;
  font-size: 1.4em;
  line-height: 1; }

h3 {
  font-weight: 700;
  text-transform: uppercase;
  color: #403280;
  font-size: 1.3em;
  line-height: 1; }

h4 {
  font-weight: 700;
  text-transform: uppercase;
  color: #403280;
  font-size: 1.2em;
  line-height: 1; }

h5 {
  font-weight: 700;
  text-transform: uppercase;
  color: #403280;
  font-size: 1.1em;
  line-height: 1; }

h6 {
  font-weight: 700;
  text-transform: uppercase;
  color: #403280;
  font-size: 1em;
  line-height: 1; }

ul {
  padding-left: 1.5em; }

p, li {
  font-family: 'Roboto', sans-serif;
  font-size: 16px;
  line-height: 1.25;
  color: #1E1E1E;
  font-weight: 300; }

li {
  line-height: 1.4; }

.red {
  color: #D60613; }

.red_light {
  color: #d65159; }

.purple {
  color: #403280; }

.purple_light {
  color: #5e49bc; }

.green {
  color: #008940; }

.green_light {
  color: #00b956; }

.black {
  color: #000; }

a {
  color: #403280;
  text-decoration: underline; }

a:hover {
  color: #000; }

strong {
  font-weight: 700; }

img {
  max-width: 100%; }

#pattern {
  position: fixed;
  left: 0;
  top: 0;
  height: 3px;
  width: 100%;
  background-repeat: repeat-x;
  z-index: 1004;
  background-size: auto 100%; }
  #pattern.pattern1 {
    background-image: url(/imagens/pattern1-@3px.png); }
  #pattern.pattern2 {
    background-image: url(/imagens/pattern2-@3px.png); }
  #pattern.pattern3 {
    background-image: url(/imagens/pattern3-@3px.png); }
  #pattern.pattern4 {
    background-image: url(/imagens/pattern4-@3px.png); }
  #pattern.pattern5 {
    background-image: url(/imagens/pattern5-@3px.png); }

#f-topo {
  height: 73px;
  z-index: 1; }

#topo {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 73px;
  z-index: 1003;
  background-color: #FFF; }
  #topo .inner {
    width: 100%;
    position: relative;
    margin: 0 auto; }
    #topo .inner #logo {
      width: 57px;
      height: 50px;
      position: absolute;
      background-size: 100% 100%;
      background-repeat: no-repeat;
      left: 10px;
      top: 13px; }
      #topo .inner #logo.logo1, #topo .inner #logo.logo3 {
        background-image: url(/imagens/logo1_mb.png); }
      #topo .inner #logo.logo2, #topo .inner #logo.logo5 {
        background-image: url(/imagens/logo2_mb.png); }
      #topo .inner #logo.logo4 {
        background-image: url(/imagens/logo3_mb.png); }
      #topo .inner #logo a {
        display: block;
        width: 100%;
        height: 100%; }
    #topo .inner #menuToggle {
      position: absolute;
      right: 10px;
      top: 28px;
      font-family: "Roboto", sans-serif;
      font-weight: 700;
      cursor: pointer;
      font-size: 1em; }
      #topo .inner #menuToggle.menuToggle1, #topo .inner #menuToggle.menuToggle3 {
        color: #403280; }
      #topo .inner #menuToggle.menuToggle2, #topo .inner #menuToggle.menuToggle5 {
        color: #008940; }
      #topo .inner #menuToggle.menuToggle4 {
        color: #D60613; }
    #topo .inner #menu {
      display: none; }

#menu_mobile {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 4;
  z-index: 1002;
  width: 100%;
  height: 100%;
  padding-top: 73px;
  display: none;
  overflow-y: scroll; }
  #menu_mobile ul {
    padding: 0; }
  #menu_mobile.menu_mobile1, #menu_mobile.menu_mobile3 {
    background-color: #403280; }
    #menu_mobile.menu_mobile1 > ul li ul, #menu_mobile.menu_mobile3 > ul li ul {
      background-color: #5e49bc; }
  #menu_mobile.menu_mobile2, #menu_mobile.menu_mobile5 {
    background-color: #008940; }
    #menu_mobile.menu_mobile2 > ul li ul, #menu_mobile.menu_mobile5 > ul li ul {
      background-color: #00b956; }
  #menu_mobile.menu_mobile4 {
    background-color: #D60613; }
    #menu_mobile.menu_mobile4 > ul li ul {
      background-color: #d65159; }
  #menu_mobile a {
    color: #FFF;
    font-family: "Roboto", sans-serif;
    text-decoration: none;
    display: block;
    padding: 20px;
    border-bottom: solid 1px #FFF; }
    #menu_mobile a span {
      float: right; }
  #menu_mobile > ul li {
    list-style: none; }
    #menu_mobile > ul li > ul {
      display: none; }
      #menu_mobile > ul li > ul a {
        border-bottom: solid 1px rgba(255, 255, 255, 0.7); }

@media only screen and (min-width: 768px) {
  #pattern {
    height: 5px; }
    #pattern.pattern1 {
      background-image: url(/imagens/pattern1-@5px.png); }
    #pattern.pattern2 {
      background-image: url(/imagens/pattern2-@5px.png); }
    #pattern.pattern3 {
      background-image: url(/imagens/pattern3-@5px.png); }
    #pattern.pattern4 {
      background-image: url(/imagens/pattern4-@5px.png); }
    #pattern.pattern5 {
      background-image: url(/imagens/pattern5-@5px.png); }

  #f-topo {
    display: none; }

  #topo {
    position: relative;
    z-index: 1002;
    height: 125px; }
    #topo .inner {
      position: relative;
      width: 100%;
      height: 100%; }
      #topo .inner #logo {
        width: 91px;
        height: 80px;
        left: 20px;
        top: 25px; }
        #topo .inner #logo.logo1, #topo .inner #logo.logo3 {
          background-image: url(/imagens/logo1_tb.png); }
        #topo .inner #logo.logo2, #topo .inner #logo.logo5 {
          background-image: url(/imagens/logo2_tb.png); }
        #topo .inner #logo.logo4 {
          background-image: url(/imagens/logo3_tb.png); }
      #topo .inner #menuToggle {
        display: none; }
      #topo .inner #menu {
        display: block;
        position: absolute;
        right: 0px;
        bottom: 0;
        height: 50px; }
        #topo .inner #menu li {
          text-transform: uppercase;
          font-family: "Roboto", sans-serif;
          font-weight: 700; }
        #topo .inner #menu > ul {
          text-align: right; }
          #topo .inner #menu > ul > li {
            display: inline-block;
            margin-right: 30px;
            position: relative;
            /* SUBMENU */ }
            #topo .inner #menu > ul > li:nth-child(1) a:before {
              background: url(/imagens/subpattern1.png) repeat-x; }
            #topo .inner #menu > ul > li:nth-child(1).on a:after {
              border-bottom-color: #000; }
            #topo .inner #menu > ul > li:nth-child(2) ul {
              background-color: #008940; }
              #topo .inner #menu > ul > li:nth-child(2) ul li a:hover {
                color: #008940; }
            #topo .inner #menu > ul > li:nth-child(2) a:before {
              background-color: #008940; }
            #topo .inner #menu > ul > li:nth-child(2):hover > a.expandable:after {
              border-bottom-color: #008940; }
            #topo .inner #menu > ul > li:nth-child(2).on a:after {
              border-bottom-color: #008940; }
            #topo .inner #menu > ul > li:nth-child(3) > ul {
              background-color: #403280; }
              #topo .inner #menu > ul > li:nth-child(3) > ul > li a:hover {
                color: #403280; }
            #topo .inner #menu > ul > li:nth-child(3) a:before {
              background-color: #403280; }
            #topo .inner #menu > ul > li:nth-child(3):hover > a.expandable:after {
              border-bottom-color: #403280; }
            #topo .inner #menu > ul > li:nth-child(3).on a:after {
              border-bottom-color: #403280; }
            #topo .inner #menu > ul > li:nth-child(4) a:before {
              background-color: #D60613; }
            #topo .inner #menu > ul > li:nth-child(4).on a:after {
              border-bottom-color: #D60613; }
            #topo .inner #menu > ul > li:nth-child(5) a:before {
              background: url(/imagens/subpattern2.png) repeat-x; }
            #topo .inner #menu > ul > li:nth-child(5).on a:after {
              border-bottom-color: #008940; }
            #topo .inner #menu > ul > li:hover > a {
              color: #808080; }
              #topo .inner #menu > ul > li:hover > a.expandable:after {
                content: "";
                display: block;
                border: 12px solid transparent;
                position: absolute;
                bottom: 0px;
                left: 50%;
                margin-left: -12px; }
            #topo .inner #menu > ul > li a {
              color: #000;
              padding: 10px 0 0 0;
              position: relative;
              height: 50px;
              font-size: 14px;
              display: block;
              text-decoration: none; }
              #topo .inner #menu > ul > li a:before {
                content: '';
                width: 100%;
                height: 4px;
                position: absolute;
                left: 0;
                bottom: 100%; }
              #topo .inner #menu > ul > li a:hover {
                color: #808080; }
            #topo .inner #menu > ul > li.on > a {
              color: #808080; }
              #topo .inner #menu > ul > li.on > a:after {
                content: "";
                display: block;
                border: 12px solid transparent;
                position: absolute;
                bottom: 0px;
                left: 50%;
                margin-left: -12px; }
            #topo .inner #menu > ul > li ul {
              position: absolute;
              left: 0;
              top: 100%;
              padding: 0;
              display: none; }
              #topo .inner #menu > ul > li ul li {
                display: block;
                border: none !important;
                background-color: transparent !important;
                text-align: left;
                height: auto;
                padding: 0;
                border-bottom: solid 1px #CCC !important; }
                #topo .inner #menu > ul > li ul li a {
                  padding: 20px 20px;
                  height: auto;
                  white-space: nowrap;
                  color: #FFF;
                  font-size: .8em; }
                  #topo .inner #menu > ul > li ul li a:before {
                    background: none !important; }
                  #topo .inner #menu > ul > li ul li a:hover {
                    background-color: #FFF; }
                #topo .inner #menu > ul > li ul li:last-child {
                  border-bottom: none; } }
@media only screen and (min-width: 1024px) {
  #pattern {
    height: 10px; }
    #pattern.pattern1 {
      background-image: url(/imagens/pattern1-@10px.png); }
    #pattern.pattern2 {
      background-image: url(/imagens/pattern2-@10px.png); }
    #pattern.pattern3 {
      background-image: url(/imagens/pattern3-@10px.png); }
    #pattern.pattern4 {
      background-image: url(/imagens/pattern4-@10px.png); }
    #pattern.pattern5 {
      background-image: url(/imagens/pattern5-@10px.png); }

  #topo {
    height: 165px; }
    #topo .inner #logo {
      width: 120px;
      height: 105px;
      left: 25px;
      top: 35px; }
      #topo .inner #logo.logo1, #topo .inner #logo.logo3 {
        background-image: url(/imagens/logo1_dt.png); }
      #topo .inner #logo.logo2, #topo .inner #logo.logo5 {
        background-image: url(/imagens/logo2_dt.png); }
      #topo .inner #logo.logo4 {
        background-image: url(/imagens/logo3_dt.png); }
    #topo #menu > ul > li {
      margin-right: 40px; }
      #topo #menu > ul > li > a {
        font-size: 17px !important; } }
@media only screen and (min-width: 1240px) {
  #topo .inner {
    width: 1200px; }
    #topo .inner #logo {
      left: 0; }
    #topo .inner #menu > ul > li:last-child {
      margin-right: 0; } }
#ban-ph {
  padding-top: 2px;
  position: relative; }
  #ban-ph #topo-rotativo {
    z-index: 1; }
    #ban-ph #topo-rotativo div a {
      width: 100%;
      height: 100%;
      position: absolute;
      left: 0;
      top: 0; }
    #ban-ph #topo-rotativo span {
      width: 100%;
      height: 50vw; }
    #ban-ph #topo-rotativo .mb-only {
      background-size: cover;
      background-position: center center;
      width: 100%;
      height: 50vw; }
    #ban-ph #topo-rotativo .tb-only {
      background-size: cover;
      background-position: center center;
      width: 100%;
      height: 40vw; }
    #ban-ph #topo-rotativo .dt-only {
      background-size: cover;
      background-position: center center;
      width: 100%;
      height: 25vw; }
    #ban-ph #topo-rotativo a {
      width: 100%; }
    #ban-ph #topo-rotativo img {
      width: 100%;
      height: auto; }
  #ban-ph #paginacao {
    position: absolute;
    color: #FFF;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 10px;
    z-index: 1001;
    /* '' */ }
    #ban-ph #paginacao .pager {
      width: 20px;
      height: 15px;
      line-height: 15px;
      font-size: 11px;
      color: #FFF;
      /*background: url(/imagens/pager-off.png) no-repeat center center;*/
      text-align: center;
      display: inline-block; }
    #ban-ph #paginacao .icon-circle:before {
      content: '\e813' !important; }
  #ban-ph .words {
    height: 25.5vw; }
    #ban-ph .words div {
      height: 100%; }
      #ban-ph .words div ul {
        display: flex;
        justify-content: space-around; }
        #ban-ph .words div ul li {
          line-height: 25.5vw;
          display: inline-block;
          font-family: "Roboto", sans-serif;
          font-weight: 300;
          color: #FFF;
          font-size: 1.1em; }
        #ban-ph .words div ul li:last-child {
          display: none; }
  #ban-ph .img-home-2 {
    width: 100%;
    height: auto;
    display: block; }
  #ban-ph.ban1 {
    background-color: #000; }
  #ban-ph.ban2, #ban-ph.ban5 {
    background-color: #008940; }
  #ban-ph.ban3 {
    background-color: #403280; }
  #ban-ph.ban4 {
    background-color: #D60613; }

@media only screen and (min-width: 768px) {
  #ban-ph {
    padding: 5px 0 0 0;
    position: relative; }
    #ban-ph #topo-rotativo span {
      width: 100%;
      height: 40vw; }
    #ban-ph .img-home-2 {
      width: 50%;
      height: auto;
      display: block;
      float: right; }
    #ban-ph #paginacao {
      padding: 20px; }
      #ban-ph #paginacao .pager {
        width: 25px;
        height: 20px;
        line-height: 20px;
        font-size: 15px; }
    #ban-ph .words {
      width: 50%;
      height: auto;
      position: absolute;
      left: 0;
      bottom: 20px; }
      #ban-ph .words div ul li {
        line-height: normal; } }
@media only screen and (min-width: 1024px) {
  #ban-ph #paginacao {
    padding: 20px; }
  #ban-ph #topo-rotativo span {
    width: 100%;
    height: 25vw; } }
#footer {
  height: 73px; }
  #footer #toTop-holder {
    height: 45px; }
    #footer #toTop-holder #toTop {
      background-color: #CCC;
      text-align: center;
      color: #333;
      font-family: "Roboto", sans-serif;
      line-height: 45px;
      height: 45px;
      font-size: 1.1em;
      font-weight: 700;
      display: none;
      cursor: pointer; }
      #footer #toTop-holder #toTop span {
        font-size: 1.5em; }
  #footer #copy {
    color: #FFF;
    line-height: 25px;
    height: 25px;
    text-align: center;
    font-family: "Montserrat", sans-serif;
    font-size: 0.7em;
    font-weight: 300; }
    #footer #copy a {
      color: inherit;
      text-decoration: none; }
      #footer #copy a:hover {
        color: #CCC;
        text-decoration: underline; }
    #footer #copy.copy1, #footer #copy.copy3 {
      background-color: #403280; }
    #footer #copy.copy2, #footer #copy.copy5 {
      background-color: #008940; }
    #footer #copy.copy4 {
      background-color: #D60613; }
  #footer #bPattern {
    height: 3px;
    width: 100%;
    background-repeat: repeat-x;
    z-index: 3;
    background-size: auto 100%; }
    #footer #bPattern.bPattern1 {
      background-image: url(/imagens/pattern1-@3px.png); }
    #footer #bPattern.bPattern2 {
      background-image: url(/imagens/pattern1-@3px.png); }
    #footer #bPattern.bPattern3 {
      background-image: url(/imagens/pattern1-@3px.png); }
    #footer #bPattern.bPattern4 {
      background-image: url(/imagens/pattern1-@3px.png); }
    #footer #bPattern.bPattern5 {
      background-image: url(/imagens/pattern1-@3px.png); }

@media only screen and (min-width: 768px) {
  #footer {
    height: 85px; }
    #footer #toTop-holder {
      height: 55px; }
      #footer #toTop-holder #toTop {
        line-height: 55px;
        height: 55px; }
    #footer #bPattern {
      height: 5px; }
      #footer #bPattern.bPattern1 {
        background-image: url(/imagens/pattern1-@5px.png); }
      #footer #bPattern.bPattern2 {
        background-image: url(/imagens/pattern1-@5px.png); }
      #footer #bPattern.bPattern3 {
        background-image: url(/imagens/pattern1-@5px.png); }
      #footer #bPattern.bPattern4 {
        background-image: url(/imagens/pattern1-@5px.png); }
      #footer #bPattern.bPattern5 {
        background-image: url(/imagens/pattern1-@5px.png); } }
@media only screen and (min-width: 1024px) {
  #footer {
    height: 100px; }
    #footer #toTop-holder {
      height: 65px; }
      #footer #toTop-holder #toTop {
        line-height: 65px;
        height: 65px; }
    #footer #bPattern {
      height: 10px; }
      #footer #bPattern.bPattern1 {
        background-image: url(/imagens/pattern1-@10px.png); }
      #footer #bPattern.bPattern2 {
        background-image: url(/imagens/pattern1-@10px.png); }
      #footer #bPattern.bPattern3 {
        background-image: url(/imagens/pattern1-@10px.png); }
      #footer #bPattern.bPattern4 {
        background-image: url(/imagens/pattern1-@10px.png); }
      #footer #bPattern.bPattern5 {
        background-image: url(/imagens/pattern1-@10px.png); } }
.frase {
  background-color: #E1E1E1;
  padding: 20px; }
  .frase p {
    font-family: "Tangerine", cursive;
    color: #403280;
    font-size: 32px;
    font-weight: 700;
    text-align: center;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto; }

.img-frase {
  position: relative;
  width: auto;
  height: auto;
  z-index: 0; }
  .img-frase .frase2-ph {
    background-color: #403280;
    padding: 20px; }
    .img-frase .frase2-ph p {
      color: #FFF;
      font-family: "Roboto", sans-serif;
      font-weight: 300;
      font-style: italic;
      width: 100%;
      max-width: 1200px;
      margin: 0 auto;
      line-height: 2;
      text-align: center; }
  .img-frase .frase2-ph {
    position: absolute;
    left: 50%;
    width: 50%;
    height: 100%;
    z-index: 5; }
    .img-frase .frase2-ph .frase2 {
      position: relative;
      display: table;
      width: 100%;
      height: 100%; }
      .img-frase .frase2-ph .frase2 p {
        display: table-cell;
        width: 100%;
        height: 100%;
        vertical-align: middle;
        font-size: 3vw; }
  .img-frase img {
    width: 100%;
    height: auto;
    display: block; }

.download {
  font-family: "Roboto", sans-serif;
  background-color: #E1E1E1;
  font-weight: 400;
  padding: 30px 20px; }
  .download .title {
    color: #403280;
    font-size: 20px;
    height: auto;
    padding-left: 40px;
    width: 190px;
    margin: 0 auto;
    background: url(/imagens/arrow-d.png) no-repeat left center;
    background-size: auto 90%; }
  .download .lista {
    color: #333;
    font-size: 1em;
    -webkit-column-count: 2;
    /* Chrome, Safari, Opera */
    -moz-column-count: 2;
    /* Firefox */
    column-count: 2;
    -webkit-column-gap: 40px;
    /* Chrome, Safari, Opera */
    -moz-column-gap: 40px;
    /* Firefox */
    column-gap: 40px;
    padding: 30px; }
    .download .lista ul {
      padding: 0 50px; }
      .download .lista ul li {
        line-height: 1.25; }
        .download .lista ul li a {
          color: inherit; }
  .download strong {
    font-weight: 700; }

@media only screen and (min-width: 768px) {
  .frase {
    padding: 30px; }
    .frase p {
      font-size: 62px; }

  .img-frase {
    position: relative;
    width: auto;
    height: auto; }
    .img-frase .frase2-ph {
      height: 49.4%; }
      .img-frase .frase2-ph .frase2 p {
        font-size: 1.75vw; }

  .download .ph {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto; }
    .download .ph .title {
      font-size: 23px;
      float: left;
      width: 220px; }
    .download .ph .lista {
      -webkit-column-count: 5;
      /* Chrome, Safari, Opera */
      -moz-column-count: 5;
      /* Firefox */
      column-count: 5;
      -webkit-column-gap: 20px;
      /* Chrome, Safari, Opera */
      -moz-column-gap: 20px;
      /* Firefox */
      column-gap: 20px;
      padding: 00px; } }
@media only screen and (min-width: 1024px) {
  .frase p {
    font-size: 62px; } }
#content {
  padding: 50px 0; }
  #content .col-r ul {
    background-color: #E1E1E1;
    padding: 0 !important; }
    #content .col-r ul li {
      display: block;
      padding: 10px 20px;
      border-bottom: solid 1px #FFF;
      font-family: "Roboto", sans-serif;
      color: #333;
      line-height: 1.1;
      font-size: .9em; }
      #content .col-r ul li a {
        text-decoration: none;
        color: inherit;
        display: block; }
      #content .col-r ul li a:hover, #content .col-r ul li a.on {
        color: pink; }
      #content .col-r ul li a.on {
        font-weight: 700; }
      #content .col-r ul li.indent {
        padding: 10px 20px 10px 40px;
        font-size: 13px; }
  #content .col-r > ul > li:first-child {
    background-color: pink;
    color: #FFF;
    padding: 20px;
    text-transform: uppercase; }
  #content .col-r.col1 ul li a:hover, #content .col-r.col1 ul li a.on {
    color: #000; }
  #content .col-r.col1 > ul > li:first-child {
    background-color: #000; }
  #content .col-r.col2 ul li a:hover, #content .col-r.col2 ul li a.on {
    color: #008940; }
  #content .col-r.col2 > ul > li:first-child {
    background-color: #008940; }
  #content .col-r.col3 ul li a:hover, #content .col-r.col3 ul li a.on {
    color: #403280; }
  #content .col-r.col3 > ul > li:first-child {
    background-color: #403280; }
  #content .col-r.col4 ul li a:hover, #content .col-r.col4 ul li a.on {
    color: #D60613; }
  #content .col-r.col4 > ul > li:first-child {
    background-color: #D60613; }
  #content .col-r.col5 ul li a:hover, #content .col-r.col5 ul li a.on {
    color: #403280; }
  #content .col-r.col5 > ul > li:first-child {
    background-color: #403280; }

@media only screen and (min-width: 768px) {
  #content .col-l {
    width: 65%;
    float: left; }
  #content .col-r {
    width: 30%;
    float: right; } }
/* CSS Document */
#form_contactos_ph {
  margin-top: 30px; }
  #form_contactos_ph form {
    width: 100%;
    max-width: 600px;
    font-family: 'Roboto', sans-serif;
    font-size: 1em; }
    #form_contactos_ph form label {
      font-weight: 700;
      display: block;
      margin-bottom: 5px;
      margin-top: 10px; }
      #form_contactos_ph form label:first-of-type {
        margin-top: 0; }
    #form_contactos_ph form input, #form_contactos_ph form textarea {
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
      width: 100%;
      border: solid 1px #999;
      padding: 5px;
      font-size: .9em; }
      #form_contactos_ph form input.error, #form_contactos_ph form textarea.error {
        background-color: #AE0C0C; }
    #form_contactos_ph form textarea {
      height: 200px;
      font-family: 'Roboto', sans-serif;
      font-size: 1em; }
    #form_contactos_ph form button.submit {
      margin-top: 10px;
      border-radius: 5px;
      border: solid 1px #008940;
      background-color: #008940;
      color: #FFF;
      cursor: pointer;
      padding: 5px 10px;
      font-size: .9em; }
      #form_contactos_ph form button.submit:hover {
        opacity: 0.75; }

html, body {
  height: 100%;
  background-color: #FFF; }

#wrapper {
  min-height: 100%;
  margin-bottom: -73px; }

#wrapper.home {
  background: linear-gradient(180deg, black, black 700px, #FFF 100%); }

#wrapper:after {
  content: "";
  display: block;
  height: 73px; }

@media only screen and (min-width: 768px) {
  #wrapper {
    margin-bottom: -85px; }

  #wrapper:after {
    height: 85px; } }
@media only screen and (min-width: 1024px) {
  #wrapper {
    margin-bottom: -100px; }

  #wrapper:after {
    height: 100px; } }