/* responsive-menu.css + MyThumbnail.css, na ordem original do header. */
/* DIAS E TUTORIAIS - www.agenciapush.com.br */

.menu > ul:after { content: ""; display: table; clear: both; }
body { -webkit-animation: bugfix infinite 1s; }
 @-webkit-keyframes bugfix {
 from {
 padding: 0;
}
 to {
 padding: 0;
}
}
.menu { font: bold 13px Arial, Helvetica; }
.menu * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.menu ul { margin: 0; padding: 0; list-style: none; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; }
.menu li { position: relative; }
.menu li:hover > ul { opacity: 1; visibility: visible; margin: 0; }
.menu li:hover > a { color: #FFFFFF; }
.menu li:last-child { border-right:none }
.menu input[type=checkbox] { position: absolute; top: -9999px; left: -9999px; }
/* O checkbox fica fora da tela para o rotulo poder ser estilizado como botao.
   Ele continua no percurso do teclado, entao sem esta regra quem navega por
   teclado foca o menu e nao ve nada. O contorno vai no rotulo, que e o que
   esta visivel. */
.menu input[type=checkbox]:focus-visible ~ label { outline: 2px solid #12B300; outline-offset: 2px; }
.menu label { display: none; cursor: pointer; user-select: none; }
.menu > ul > li { float: left; }
.menu > ul > li > a { float: left; padding: 0.6em 0.8em; font-size: 16px; }
.menu > ul a { color: #444444; text-decoration: none; text-shadow: 0 1px 0 #FFFFF; }
.menu > ul ul { position: absolute; top: 100%; left: 0; z-index: 1; opacity: 0; visibility: hidden; margin: 2em 0 0 0; background-color: #373737; background-image: none; -webkit-transition-property: margin, opacity; -moz-transition-property: margin, opacity; -o-transition-property: margin, opacity; transition-property: margin, opacity; -webkit-transition-duration: .15s; -moz-transition-duration: .15s; -o-transition-duration: .15s; transition-duration: .15s; -webkit-transition-timing-function: ease-in-out; -moz-transition-timing-function: ease-in-out; -o-transition-timing-function: ease-in-out; transition-timing-function: ease-in-out; }
.menu > ul ul li { display: block; -webkit-box-shadow: 0 1px 0 #1e1e1e, 0 2px 0 #515151; -moz-box-shadow: 0 1px 0 #1e1e1e, 0 2px 0 #515151; box-shadow: 0 1px 0 #1e1e1e, 0 2px 0 #515151; }
.menu > ul ul li:first-child > a { -webkit-border-radius: 3px 3px 0 0; -moz-border-radius: 3px 3px 0 0; -ms-border-radius: 3px 3px 0 0; -o-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; }
.menu > ul ul li:first-child > a:after { content: ''; position: absolute; left: 4em; top: -12px; border: 6px solid transparent; border-bottom-color: inherit; }
.menu > ul ul li:last-child { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; border-right:none }
.menu > ul ul li:last-child > a { -webkit-border-radius: 0 0 3px 3px; -moz-border-radius: 0 0 3px 3px; -ms-border-radius: 0 0 3px 3px; -o-border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px; }
.menu > ul ul a { padding: 1em; width: 175px; display: block; border-color: #373737; }
.menu > ul ul a:hover { background-color: #0186ba; border-color: #0186ba; }

@media screen and (max-width: 860px) {
.menu > ul, .menu > ul ul { visibility: visible; opacity: 1; display: none; }
.menu input[type=checkbox]:checked ~ label,  .menu input[type=checkbox] ~ label:hover { color: white; }
.menu label { border: 1px solid #040404; background-color: #111111; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255, 255, 255, 0.2)), color-stop(100%, rgba(255, 255, 255, 0))); background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0)); background-image: -moz-linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0)); background-image: -o-linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0)); background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0)); -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset; -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset; color: #999999; text-shadow: 0 1px 0 #111111; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; text-transform: uppercase; position: relative; display: block; padding: 1em 3em; }
.menu label:before { position: absolute; left: 0.5em; top: 5px; content: "\2261"; font-size: 2em; line-height: 36px; }
.menu > ul { position: relative; border-color: #111111; margin: 0.5em 0 !important; padding: 0.25em; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; background-color: #111111; background-image: none; }
.menu > ul:after { content: ''; position: absolute; left: 2em; top: -12px; border: 6px solid transparent; border-bottom-color: inherit; }
.menu > ul li { display: block; }
.menu > ul > li { float: none; border: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; background-color: #111111; background-image: none; }
.menu > ul > li > a { float: none; display: block; padding: 1em; }
.menu > ul ul { position: static; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; background-color: #2b2b2b; background-image: none; margin: 0; -webkit-transition-property: none; -moz-transition-property: none; -o-transition-property: none; transition-property: none; }
.menu > ul ul li:first-child > a { -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; }
.menu > ul ul li:first-child > a:after { content: none; }
.menu > ul ul li:last-child > a { -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; }
.menu > ul ul a { padding-left: 2em; display: block; width: auto; }
.menu input[type=checkbox]:checked ~ ul { display: block; }
.menu input[type=checkbox]:checked ~ ul ul { display: block; }
}

@media screen and (max-width: 600px) {
.menu > ul > li > a { padding: 1em 2em; }
}

.polegarsquare {
	max-width: 100%;
	height: 150px;
}
.polegarsquare img {
	  -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
}

/* Data da listagem: vermelho generico do Bootstrap trocado pela cor da marca, pedido do dono em 17/09/2026. Cor ja usada no --cor-link deste portal. */
.label-important{background-color:#427f42}

/* ===== COMENTARIOS SEM O BOOTSTRAP 3 (18/09/2026) =====================================
   O inc-comentarios.asp carregava o bootstrap 3.3.6 inteiro so para desenhar os comentarios,
   e a pagina ja tem o bootstrap 2. Aqui estao, presas a .spfc-comments, so as classes do 3
   que o arquivo usa, com os valores lidos do proprio bootstrap.min.css 3.3.6 e conferidos
   contra o gabarito medido no navegador (enviar/GABARITO-COMENTARIOS-TUDOTIMAO-2026-09-18.md).
   Nada disto alcanca o resto da pagina. */

/* Grade de 12 colunas. O bootstrap 3 punha box-sizing:border-box em TODO elemento; sem ele,
   a largura em percentual somada ao padding de 15px estouraria a linha, entao o border-box
   volta aqui, so nas pecas da grade e do painel. */
.spfc-comments .row,.spfc-comments .col-xs-12,.spfc-comments .col-sm-2,.spfc-comments .col-sm-10,
.spfc-comments .col-md-2,.spfc-comments .col-md-10,.spfc-comments .col-md-12,
.spfc-comments .panel,.spfc-comments .panel-body{box-sizing:border-box}
.spfc-comments .row{margin-left:-15px;margin-right:-15px}
.spfc-comments .row:before,.spfc-comments .row:after{display:table;content:" "}
.spfc-comments .row:after{clear:both}
.spfc-comments .col-xs-12,.spfc-comments .col-sm-2,.spfc-comments .col-sm-10,
.spfc-comments .col-md-2,.spfc-comments .col-md-10,.spfc-comments .col-md-12{
position:relative;min-height:1px;padding-left:15px;padding-right:15px}
.spfc-comments .col-xs-12{float:left;width:100%}
@media (min-width:768px){
.spfc-comments .col-sm-2{float:left;width:16.66666667%}
.spfc-comments .col-sm-10{float:left;width:83.33333333%}
.spfc-comments .col-sm-offset-0{margin-left:0}
.spfc-comments .col-sm-offset-1{margin-left:8.33333333%}
}
@media (min-width:992px){
.spfc-comments .col-md-2{float:left;width:16.66666667%}
.spfc-comments .col-md-10{float:left;width:83.33333333%}
.spfc-comments .col-md-12{float:left;width:100%}
.spfc-comments .col-md-offset-1{margin-left:8.33333333%}
.spfc-comments .col-md-offset-2{margin-left:16.66666667%}
}
@media (max-width:767px){
.spfc-comments .hidden-xs{display:none!important}
}

/* Painel */
.spfc-comments .panel{margin-bottom:20px;background-color:#fff;border:1px solid #ddd;
border-radius:4px;-webkit-box-shadow:0 1px 1px rgba(0,0,0,.05);box-shadow:0 1px 1px rgba(0,0,0,.05)}
.spfc-comments .panel-body{padding:15px}

/* Titulo "Comentarios (N)". O bootstrap 2 da ao .page-header margem de 20px 0 30px e ao h2
   31,5px em negrito; o 3, que era quem desenhava, dava 40px 0 20px e 30px com peso 500. */
.spfc-comments .page-header{padding-bottom:9px;margin:40px 0 20px;border-bottom:1px solid #eee}
.spfc-comments h2.page-header{font-size:30px;font-weight:500;line-height:1.1}

/* Imagem, utilitarias e botao */
.spfc-comments .img-responsive{display:block;max-width:100%;height:auto}
.spfc-comments .text-left{text-align:left}
.spfc-comments .text-right{text-align:right}
.spfc-comments .pull-right{float:right!important}
/* Sem o bootstrap 3 a <figure> voltava a margem do navegador, 1em 40px, que comia 80px de
   uma coluna de 100px uteis e espremia o avatar a 10x10 (medido no ar em 18/09/2026). O 3
   zerava essa margem no normalize; as regras abaixo sao as dele, lidas do 3.3.6. */
.spfc-comments figure{margin:0}
.spfc-comments .thumbnail{display:block;padding:4px;margin-bottom:20px;line-height:1.42857143;
background-color:#fff;border:1px solid #ddd;border-radius:4px;
-webkit-transition:border .2s ease-in-out;-o-transition:border .2s ease-in-out;transition:border .2s ease-in-out}
.spfc-comments .thumbnail>img,.spfc-comments .thumbnail a>img{display:block;max-width:100%;height:auto;
margin-right:auto;margin-left:auto}
.spfc-comments .btn-default{color:#333;background-color:#fff;border-color:#ccc}
.spfc-comments .btn-default:hover{color:#333;background-color:#e6e6e6;border-color:#adadad}
.spfc-comments .btn-sm{padding:5px 10px;font-size:12px;line-height:1.5;border-radius:3px}
