* {
    margin: 0;
    padding: 0;
   }
   body {
    color: #000;
    background: url(bg.gif);
    border-top: 2px solid #000;
    font: 16px verdana, tahoma, arial, sans-serif;
   }
   a {
    color: #303030;
    text-decoration: none;
   }
   a:hover {
    text-decoration: underline;
   }
   a img {
    border: none;
   }
   textarea, input {
    width: 400px;
    border: 1px groove #fff;
    font: 12px "Courier New", Courier, monospace;
    padding: 0px 2px;
   }
   textarea {
    height: 48px;
    background-color: #ffffef;
   }
   input {
    height: 20px;
    margin-top: 2px;
   }
   @font-face {
     font-family: 'FontSite';
     src: url('font-site.woff2') format('woff2'),
          url('font-site.woff') format('woff'),
          url('font-site.ttf') format('truetype');
   }
   @font-face {
     font-family: 'FontDesc';
     src: url('font-desc.woff') format('woff'),
          url('font-desc.ttf') format('truetype');
   }
    #navup, #navdw, #navin {
        position: fixed;
        z-index: 1;
        width: 32px;
        height: 32px;
        right: 18px;
        padding: 10px;
        cursor: pointer;
        border: 1px solid #e1e1;
        background-color: #e1e1;
        background-repeat: no-repeat;
        background-position: 9px 10px;
    }  
     #navup {
        top: 220px;
        border-radius: 0px 0px 45px 45px;
        background-image: url(arrowdw.png);
    }
    #navdw {
        top: 170px;
        border-radius: 45px 45px 0px 0px;
        background-image: url(arrowup.png);
    }
    #navin {
        bottom: 10px;
        border-radius: 45px;
        background-image: url(arrowin.png);
    }
   header {
    width: 100%;
    height: 160px;
    background-color: #255826;
    background-image: url(bgtop-7.gif);
    background-repeat: no-repeat;
    border-top: 1px solid #fff;
   }
   header #site {
    font-family: FontSite;
    font-size: 60px;
    color: #fff;
    position: relative;
    left: 340px;
    top: 30px;
    max-width: 65vw;
    text-shadow: 1px 0 0 #000, -1px 0 0 #000, 0 1px 0 #000, 0 -1px 0 #000;
   }
   header #desc {
    font-family: FontDesc;
    font-size: 60px;
    line-height: 40px;
    color: #fff;
    position: relative;
    left: 330px;
    top: 25px;
    max-width: 65vw;
    text-shadow: 1px 0 0 #000, -1px 0 0 #000, 0 1px 0 #000, 0 -1px 0 #000;
   }
   main {
       width: 99%;
       display: grid;
       grid-template-columns: 69.5% 30%;
       justify-content: space-between;
       grid-gap: 0.5%;
       margin: 0 auto;
       position: relative;
       left: -1px;
   }
   article {
       width: 99.6%;
       display: block;
       text-align: center;
       align-items: center;
       background: #fff;
       overflow: hidden;
       border: 2px solid #000;
   }
   aside {
       width: 100%;
       display: block;
       text-align: left;
       align-items: center;
       background: transparent;
   }
   aside ul {
       width: 99.6%;
       background: #fff;
       margin-bottom: 15px;
       border: 2px solid #000;
       overflow: hidden;
   }
   #aviso {
    width: 100px;
    height: 100px;
    position: fixed;
    right: 0px;
    bottom: -2px;
    z-index: 100000;
    background-color: transparent;
    background-size: 100px;
    cursor: context-menu;
    background-color: transparent;
    border-radius: 100px 0 0 0;
   }
   #menu {
    width: 100%;
   }
   #menu ul {
    width: 100%;
    float: left;
    height: 28px;
    text-align: justify;
    margin: 45px 0px 5px 0px;
    border-top: 3px double #000;
    border-bottom: 1px double #000;
    background-color: #52703F;
    background-image: url(m-bg.gif);
    background-repeat: repeat-x;
    list-style-type: none;
   }
   #menu ul li {
    float: left;
    width: 14%;
    overflow: hidden;
    text-align: center;
    border-left: 1px solid #666;
    height: 24px;
   }
   #menu ul li a {
    color: #fff;
    height: 26px;
    width: 93%;
    overflow: hidden;
    line-height: 26px;
    font-size: 13px;
    padding-left: 2px;
    text-decoration: none;
    text-transform: uppercase;
    text-align: center;
    display: inline-block;
    font-family: "opensans-regular", sans-serif;
   }
   #menu ul li:hover, #menu ul li.current {
    background-color: #52703F;
    text-shadow: 2px 0 0 #000, -2px 0 0 #000, 0 2px 0 #000, 0 -2px 0 #000, 1px 1px #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000;
   }
   #barra {
    position:absolute;
    top: 2px;
    width:100%;
    z-index: 1000;
   }
   #tema {
    width: 100px;
    float: right;
    margin: 0px 20px;
    padding: 0px 2px 2px 2px;
    border: 1px solid #fff;
   }
   #tema span {
    background-image: url("scor.png");
    background-repeat: no-repeat;
    background-position: 4px;
    background-color: #fff;
    padding: 2px 2px 2px 21px;
    display: block;
    cursor: pointer;
    height: 18px;
   }
   #tema div {
    cursor: pointer;
    display: block;
    padding: 2px;
    height: 16px;
    border: 1px solid #fff;
   }
   #tema div:hover {
    height: 26px;
   }
   #tema form {
    height: 20px;
    overflow: hidden;
   }
   #tema form:hover {
    height: auto;
    overflow: visible;
   }
   .view {
    float: left;
    width: 47.6%;
    margin: 1%;
    display: table-column;
    height: 460px;
    border: 1px solid #fff;
    box-shadow: 1px 1px 3px black;
   }
   .view img {
   height: 313px;
   max-width: 99%;
   padding: 0.6%;
   }
   .view span {
    background-color: #eee;
    display: block;
    padding: 1px 0px 4px 0px;
    text-transform: full-width;
   }
   .view:hover {
    background-color; #eee;
   }  
   #msg_pas {
    font-size: 20px;
    margin-top: 10px;
    padding: 10px;
   }
   #msg_pas i {
    font-family: emoji;
    color: crimson;
    font-size: 18px;
   }
   #nameuser {
    margin-top: 5px;
    border-radius: 5px;
    height: 18px;
    border: groove;
    padding: 5px;
    width: 86%;
    box-shadow: 5px 5px 5px #999;
    font-size: 23px;
    color: crimson;
    text-align: center;
    font-variant: petite-caps;
   }
   #ctg h1 {
    color: #fff;
    height: -moz-max-content;
    position: relative;
    border: #fff 3px solid;
    background-color: #52703F;
    background-image: url(m-bg.gif);
    background-repeat: repeat-x;    
    padding: 12px 0px 2px 5px;
    font: 20px/27px verdana, 'trebuchet ms', sans-serif;
    text-transform: uppercase;
    text-align: compa;
    background-position-y: -13px;
    text-align: center;
    text-shadow: 1px 0 0 #000, -1px 0 0 #000, 0 1px 0 #000, 0 -1px 0 #000;
   }
   #ctg li {
    list-style: none;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
   }
   #ctg li:nth-child(even) {background: #f9f9f9}
   #ctg li:nth-child(odd)  {background: #eee}
   #ctg span li:nth-child(even) {background: #fff3f3}
   #ctg span li:nth-child(odd)  {background: #FDE9E8}
   #ctg li:hover, #ctg span li:hover  {
    -webkit-transition: all 0s linear;
    -moz-transition: all 0s linear;
    -o-transition: all 0s linear;
    transition: all 0s linear;
    background: #ffe;
   }
   #ctg li a {
    display: block;
    width: 100%;
    padding-left: 8px;
    font: 18px/34px Verdana, Tahoma;
    border-bottom: 1px solid #ddd;
   }
   #ctg li a span {
    color: #52703F;
    vertical-align: text-top;
    font: 9px/6px verdana, tahoma, arial, sans-serif;
   }
   #ctg .obs {
    cursor: pointer;
    color: #ffffff;
    font-weight: bold;
    margin-bottom: 4px;
    text-transform: uppercase;
    text-align: center;
    padding: 10px;
    background-color: red !important;
   }
   #ads_l ins, #ads_c ins, #ads_r ins {
    display: inline-block !important;
    width: 100% !important;
    min-height: 20px !important;
   }
   #ads_l {
    display: inline-table;
    width: 100%;
   }
   #ads_c {
    margin-bottom: 30px;
    display: inline-table;
    width: 100%;
   }
   #ads_r {
    margin-top: 50px;
    display: inline-block;
    width: 100%;
    max-height: 1024px !important;
    overflow: hidden;
   }
   #link_ctg, .title {
    width: 99.8%;
    display: inline-table;
    margin-top: 30px;
   }
   #link_ctg span, .title a {
    width: 96.5%;
    padding: 5px;
    text-align: left;
    margin: 0px 1%;
    background-color: #f3f3f3;
    text-shadow: 2px 0 0 #fff, -2px 0 0 #fff, 0 2px 0 #fff, 0 -2px 0 #fff, 1px 1px #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff;
    display: table-caption;
    min-height: 20px;
    border: 1px solid #eee;
    font-size: 15px;
    font-weight: 100;
   }
   #link_xat{
    color: #575859;
    font-size: 22px;
    line-height: 28px;
    letter-spacing: -0.5px;
    font-weight: normal;
    background-color: #fff;
    font-family: "opensans-semibold", sans-serif;
    text-align: left;
    position: relative;
    z-index: 100;
    left: 5px;
    top: 35px;
   }
   #tx {
    text-align: left;
    width: 99%;
   }
   #tx input {
    width: 91.6%;
    font: 13px Georgia;
    padding-left: 23px;
    background-position: 1px 1px !important;
    background-size: 20px 18px !important;
   }
   #tx textarea {
    width: 90%;
    height: 27px;
    display: block;
    padding: 0px 0px 0px 23px;
    background-size: 20px 25px;
    font-size: 12px;
    font-family: initial;
    margin-top: 2px;
    background-repeat: no-repeat;
    background-position: 1px 1px;
    overflow: auto;
   }
   #tx-rea {
     float: left;
     width: 65%;
   }
   #tx-viw {
    height: 62px;
    width: 33%;
    float: right;
    cursor: pointer;
   }
   #tx-en,#tx-es,#tx-pt,#tx-de,#tx-th {
    height: 100%;
    width: 100%;
    display: block;
    margin: 2px;
    padding-top: 17px;
    background-size: 100%;
    background-position-x: left;
    background-repeat: no-repeat;
    overflow: hidden;
   }
   #tx-en {
    background-image: url(tx-en.gif);
   }
   #tx-es {
    background-image: url(tx-es.gif);
   }
   #tx-pt {
    background-image: url(tx-pt.gif);
   }
   #tx-de {
    background-image: url(tx-de.gif);
   }
   #tx-th {
    background-image: url(tx-th.gif);
   }
   #ic {
    width: 101%;
    text-align: left;
    display: table;
    margin: 2px 0px 0px -2px;
   }
   #ic img {
    cursor: pointer;
    float: left;
    height: 44px;
    width: 15.4%;
   }
   #ic img:hover {
    height: 51px;
    margin-top: -4px;
   }
   .pg {
    width: 98.6%;
    margin: 0px auto 30px auto;
    display: table;
    text-align: left;
    font-size: 21.8px;
    text-shadow: 2px 0 0 #fff, -2px 0 0 #fff, 0 2px 0 #eee, 0 -2px 0 #eee, 1px 1px #aaa, -1px -1px 0 #aaa, 1px -1px 0 #aaa, -1px 1px 0 #aaa;
   }
   .pg a {
    margin: 2px;
    color: #4f82cb;
    padding: 4px 1.1%;
    background: #e9f1f8;
    text-decoration: none;
    border: 1px solid #c7e2f8;
    display: block;
    float: left;
   }
   .pg a:hover {
    color: #4f82cb;
    border-color: #4f82cb;
   }
   .pg .pg_now {
    color: #cacaca;
    background: #f3f3f3;
    border: 1px solid #dadada;
   }
   #page_fim {
    margin-top: 20px;
    display: inline-block;
    width: 100%;
   }
   footer {
    color: #fff;
    clear: both;
    width: 100%;
    font-size: 12px;
    padding: 15px 0px;
    margin-top: 10px;
    text-align:center;
    background: #52703F;
    border-top: 4px double #fff;
   }
   footer a {
    color: #fff;
    font-weight:bold;
   }
   @media (max-width:990px) {
       header {
          height: 160px;
          background-size: auto auto;
          background-size: contain !important;
       }
       header #site {
          letter-spacing: 1px;
          font-size: 6vw;
          left: 35vw;
          top: 3vw;
       }
       header #desc {
          font-size: 6vw;
          height: 4vw;
          line-height: 4vw;
          left: 35vw;
          top: 2.6vw;
       }  
       main {
           grid-template-columns: 100%;
           grid-gap: 10px;
       } 
       aside section {
           width: 99.6%;
           margin: 0.2%;
       }
       .view {
           width: 31%;
       }
       #ic img {
           width: 15.3%;
       }
       #tx input {
          width: 90%;   
       }
       #tema {
           width: 24px;
           margin-right: 15px;
           font-size: 0px;
       }
       #menu ul {
          overflow: hidden;
          height: 28px;
          margin: 5.6% 0px 10px 0px !important;
       }    
   }
   @media (max-width:820px) {
       header {
          height: 140px;
       }  
       .view {
           width: 47.6%;
       }
       #tx input {
          width: 92.4%;   
       }
   }
   @media (max-width:650px) {
       header {
           height: 110px;
       }
       #ic img {
           width: 15.6%;
       }
       .view img {
            padding: 0.44%;
       }
       #tx input {
          width: 89%;   
       }
   }
   @media (max-width:500px) {
       header {
           height: 95px;
       }       
       .view {
           width: 97%;
           margin-top: 20px;
       }
       #ic img {
           width: 15.5%;
       }
       #tx input {
          width: 93%;   
       }
   }
   @media (max-width:380px) {  
       #tx input {
          width: 92%;   
       }
   }
   @media (max-width:300px) {  
       #tx input {
          width: 89%;   
       }
   }