@charset "utf-8";
@import "error.css";

/**
 *------------------------------------------------------------------------------
 * rally J5-55
 *------------------------------------------------------------------------------
 * @website		  rallyfans.net
 * @authors     SKYTRAILS
 *------------------------------------------------------------------------------
 */

body.pag-home,
body.pag-pec1{
  background-image: url(img/cover-flag-a.webp);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
body.pag-home #stage,
body.pag-pec1 #stage{
  background-color: rgba(61, 62, 63, 0.3);
  background-image: url(img/cover-text.png);
  background-repeat: no-repeat;
  background-size:70vh;
  background-position: top 1.2vh center;
}
@media (min-width: 600px) {
  body.pag-home #stage,
  body.pag-pec1 #stage{
  background-size:70vh;
  background-position: top 1.5vh center;
  }
}
@media (min-width: 768px) {
  body.pag-home #stage,
  body.pag-pec1 #stage{
  background-size:contain;
  background-position: top 0px center;
  }
}
@media (min-width: 992px) {
  body.pag-home #stage,
  body.pag-pec1 #stage{
  background-size:105vh;
  background-position: top -1.5vh center;
  }
}

/* body.pag-home.home-01 #stage{
  background-color: rgba(61, 62, 63, 0.3);
  background-image: url(img/cover-text.png);
  background-repeat: no-repeat;
  background-size:70vh;
  background-position: top 1.2vh center;
} */

body {
  background-image: url(img/bandeira.jpg);
  background-repeat: no-repeat;
  background-size: initial;
  background-position: initial;
  background-color: #F7F7F8 !important;
  /* background: url(img/baseimage.jpg) center bottom no-repeat, url(img/bandeira.jpg) left top no-repeat; */
}


/*
  REGRAS GERAIS CRIADAS POR MIM
============================================== */

/*Existe uma regra .sitcky, esta regra é aplicada à secção "head" com "top: 0px" alterar este valor altera o posicionamento da secção "head"
  Para elementos que devem ficar stiky abaixo da secção "head" criei esta regra ".sticky-element".
*/
.sticky-element{
  position: sticky;
  top: 190px;
  /* z-index: 1020; */
}
.position-sticky {
  position: sticky;
}
.aside {
  border: 1px solid gray;
  background-color: #f0f0f0;
  padding: 0 20px 20px 20px;
}
.overlay {
  background-color: rgba(22, 22, 22, 0.5);
  width: 100%;
  height: 100%;
}

/*
  TEXTO DOS ARTIGOS
============================================== */
 /*
  .container
  .contain
  .content
*/
.contain {
  width: 100%;
  padding-right: 0;
  padding-left: 0;
  margin: 0 auto;
}
.content {
  max-width: 800px;
  padding-right: 0;
  padding-left: 0;
  margin: 0 auto;
}
.category-page {
  max-width: 1370px;
  padding-bottom: 90px;
  margin: 0 auto;
}

.article{
  max-width: 1300px;
  padding-right: calc(var(--gutter-x) * 0.5);
  padding-left: calc(var(--gutter-x) * 0.5);
  margin: 0 auto;
}
.article dl,
.article ol, 
.article ul {
  padding-left: 1rem;
  margin-bottom: 1rem;
  list-style-type: disc;
}
.article li{
  padding-left: .2rem;
}
.article a{
  text-decoration:underline;
}
.article .pagenavigation a{
  text-decoration:none;
}
.article ul{
  list-style-type: disc;
  line-height: 1.4;
  padding-left: 1.3rem;
}
.article ul li {
  margin-bottom: .6rem;
}




/* .position, #component-area{
  border: 1px dashed magenta;
}
#main-area {
  border: 1px dashed blue;
}
main {
  border: 1px dashed green;
}
.pag-modules .position{
  background-color: aqua;
}
.pag-modules .position > div {
  background-color: beige;
}
.pag-modules .position .module {
  background-color: chartreuse;
} */

/*////////////////////////////////////////////////
_ TPL SKY - Layout improvements and tests
/////////////////////////////////////////////////*/
/*CORREÇÕES AO MODULO SEARCH - Dar uma largura defenida ao campo*/
/*Form onde o campo está*/
.center-anything{
  display: grid;
  place-items: center;
}

/*////////////////////////////////////////////////
_ Old Layout tests
/////////////////////////////////////////////////*/

/*CENAS PARA SEGURAR O LAYOUT DOS BLOCOS HERO*/
.relative {
  position: relative;
}
.flex-vertical-center {
  display: flex;
  align-items: center;
  height: 100%;
  width: 100%;
}
.flex-vertical-end {
  display: flex;
  align-items: end;
  height: 100%;
  width: 100%;
}



/*=================================================/
   Tool tips e Joomedit
*/
/*Frontoffice edit articles*/
.icons a {
  color: var(--link-color);
}
.float-end {
  float: right !important;
}
/*Front-office edit modules*/
.btn.jmodedit {
  background-color: hsla(51.4, 5.2%, 73.5%, 0.16);
  border: 0px solid #234fa836;
  border-radius: .25rem;
  color: #234fa8;
  left: auto;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 900;
  padding: .4rem .5rem .4rem .7rem;
}
[role="tooltip"]:not(.show) {
  background: #fff;
  border: 1px solid #6d757e3d;
  border-radius: .25rem;
  box-shadow: 0 0 .5rem rgba(0, 0, 0, 0.44);
  color: #828282;
  display: none;
  margin: .5em;
  max-width: 100%;
  padding: .5em;
  right: 5em;
  text-align: start;
  z-index: 1070;
  font-size: .85rem;
}
.sr-only, .visually-hidden, .visually-hidden-focusable:not(:focus):not(:focus-within) {
  clip: rect(0,0,0,0) !important;
  border: 0 !important;
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important; 
  white-space: nowrap !important;
  width: 1px !important;
}

/*////////////////////////////////////////////////////////////////////////

/ PEDRO'S CRAZY RULES (Verificar)
////////////////////////////////////////////////////////////////////////*/
.view-categories main > div,
.view-featured main > div,
.view-category main > div,
.view-article main > div {
  width: 100%;
  /* max-width: 1140px; */ /*Isto tem que ficar definido numa classe partir do texto do artigo ou modulo*/
  padding-right: 0;
  padding-left: 0;
  margin-right: auto;
  margin-left: auto;
}
/*Regra para estreitar a largura dos textos de blog deve ser aplicada no menu, ou no proprio artigo
e não na classe do template comentada na linha abaixo*/
/* .com-content-article,  */
.content{
  max-width: 1300px;
  padding-left: 5%;
  padding-right: 5%;
  margin: 0 auto;
}
#main-content-area main {
  padding-top: clamp(1.5rem, 2vw + 1rem, 2.5rem);
  padding-bottom: clamp(3.5rem, 2vw + 3rem, 5rem);
}
.wrapper-fluid .container {
  max-width: 100% !important;
}
.container-fluid {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
.full-width {
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  padding-left: 8px;
  padding-right: 8px;
}
.center-text,
.text-center {
  text-align: center;
}
.no-gutters {
  margin-right: 0;
  margin-left: 0;
}
.no-gutters > .col,
.no-gutters > [class*="col-"] {
  padding-right: 0;
  padding-left: 0;
}
div[class*="txt-col"] {
  column-count: 1;
  column-gap: 2.5em;
}
.img-100{
  width: 100%;
}
.img-cover{
  object-fit: cover;
}
.clearfix::after {
  display: block;
  clear: both;
  content: "";
}
.modal iframe {
width:100%;
}
.visible {
  visibility: visible !important;
}
.visually-hidden {
  visibility: hidden;
  position: absolute;
}

:target{
  outline: 0px solid rgb(212, 53, 53);
  outline-offset: 5px;
}

@media (min-width: 768px) {
  .txt-col-1 {
    column-count: 1 !important;
  }
  .txt-col-2 {
    column-count: 2 !important;
  }
  .txt-col-3 {
    column-count: 3 !important;
  }
}

/*RETIRADO DO ANTERIOR FICHEIRO JOOMLA.CSS*/
/*parecem ser regras criadas por mim*/

.form-group {
  margin-bottom: 1rem !important;
}


.mod-menu {
  flex-direction:column
}
.hidden {
  visibility:hidden;
  display:none
}
.table-row {
  display:table-row
}
.element-invisible {
  clip:rect(0,0,0,0);
  white-space:nowrap;
  clip-path:inset(50%);
  border:0;
  width:1px;
  height:1px;
  padding:0;
  position:absolute;
  overflow:hidden
}


/*Ajustar os menus - largura fixa para o logotipo*/

#nav-left, #nav-center, #nav-right{
  position: relative;
}
#nav-center {
  width: 240px;
  max-width: 240px;
  /* background-color: aquamarine; */
}
#nav-middle {
  margin-top: 40px !important;
  color: white;
}
.container-nav-left, .container-nav-center, .container-nav-right{
  position: absolute;
}
.container-nav-left{
  right: 0px;
}
.container-nav-center{
  bottom: -25px;
}
.container-nav-right{
  right: 0px;
  padding-right: 3px;
}
.nav-left.module {
  padding-right: 20px !important;
}
.nav-right.module {
  padding-left: 20px !important;
}
@media (min-width: 992px) {
  .container-nav-right{
     left: 0px;
     right: inherit;
     padding-right: 0px;
  }
}
/*RALLY CAMÉLIAS 2026*/
/*BANNER NA PÁGINA DAS TABELAS DE TEMPOS*/
.pag-tempos #main-content-area main {
  padding-top: 0.25rem;
}
.horizontal-banner {
  margin: 0;
  margin-top: 0.25rem;
  background-color: #fff;
}
.horizontal-banner {
  box-shadow: rgba(125, 128, 136, 0.54) 0px 0px 10px 0px;
}
.horizontal-banner {
  padding: 10px;
}
.horizontal-banner img {
  width: 100%;
  max-height: 100px;
  object-fit: cover;
  min-height: 100px;
}
/*BANNER NA PÁGINA DO PROGRAMA*/
.container-main-top .horizontal-banner {
  margin-top: 4rem;
  margin-bottom: 0px;
}
@media (min-width: 992px) {
  .container-main-top .horizontal-banner {
    margin-top: 2rem;
    /* margin-bottom: -20px; */
}
}

/*MENU OFFCANVAS JEITINHO*/
.mod-menu.mod-list.nav.menu-y.menu-y-1 {
  margin-top: 40px;
}

@media (max-width: 768px) {
  .pag-tempos table .marca {
    display: none;
  }
  .pag-tempos table .tcol-03 {
    display: none;
  }
}

/*-------------------------------------------------------/
BLOCO PARCEIROS TODAS AS PÁGINAS
*/
.row.partners{
  max-width: 1100px;
  margin: auto;
  padding-bottom: 50px;
}
.col.partner-div {
  min-width: 190px;
  width: 205px;
  max-width: 205px;
  padding: 0px !important;
  margin: 3px;
  overflow: hidden;
  border: 1px solid #999;
}
.col.partner-div img {
  transition: transform .2s;
}
.col.partner-div a:hover img {
  transform: scale(1.08);
}

/*Parceiros Oficiais*/
.row-container.partners-oficial {
  display: flex;
  justify-content: space-around !important;
  padding: 20px 0 40px 0;
  max-width: 1100px;
  margin: auto;
}
.partners-oficial .col-item {
  display: inline-block;  
  padding: 0 8px;
  /* background-color: pink; */
}
.partners-oficial .col-item img {
  width: auto;
  max-height: 60px;
  /* background-color: aqua; */
}