@charset "utf-8";
/**
 *------------------------------------------------------------------------------
 * TEMPLATE SKY.CSS
 *------------------------------------------------------------------------------
 * @Template		SKY - J5
 * @authors     SKYTRAILS
 *------------------------------------------------------------------------------
 */


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

/ ESTRUTURA DO TEMPLATE
/////////////////////////////////////////////////////////////////////////////*/

#stage{
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
.system-debug {
  display:block
  }
.module {
  position: relative;
}
#nav-middle .module {
  width: 100%;
}
#page{
  width: 100%;
  margin: 0;
}
#stage{
  width: 100%;
  margin: 0;
}
  
/* 
  HEADER  
  =========================================================================== */
header { 
  position: relative;
  z-index: 10;
}
.container-top-bar .row{
  justify-content: left;
}
.container-head-top .row{
  justify-content: center;
}
.container-nav-top .row{
  display: flex;
  justify-content: center;
}
  
/*
  NAVBAR
------------------------------------------*/
#main-navbar .container-navbar{
  display: flex;
  flex-wrap: nowrap;
  }
  #nav-top{
    display: flex;
  }
  .container-nav-top {
    display: flex;
    justify-content: center;
    align-items: center;
  }
        .navbar-item{
        display: flex;
        min-height: 60px;
        /* align-items: center; */
        flex-grow: 1;
        flex-shrink: 1;
        }
        
        #nav-left{
        /* background-color: cornflowerblue; */
        justify-content: end;
        align-items: center;
        }
            .container-nav-left{
                /* background-color: #FF0000;  */
                /* display: flex;
                justify-content: start;  
                align-items: center; */
            }
        #nav-center{
        /* background-color: rgb(192, 255, 195); */
        justify-content: center;
        align-items: center;
        }
            .container-nav-center{
                /* background-color: #FF0000;  */
                /* display: flex;
                justify-content: center;
                align-items: center; */
            } 
        #nav-right{
        /* background-color: pink; */
        justify-content: start;
        align-items: center;
        }
            .container-nav-right{
                /* background-color:aqua; */
                /* display: flex;
                justify-content: flex-end;
                align-items: center; */
            }
  
  #nav-bottom{
    display: flex;
  }
  .container-nav-bottom {
    display: flex;
    justify-content: center;
    align-items: center;
  }  
  


  /*extras*/
  .nav-left.module{
    padding-right: 30px
  } 
  .nav-right.module{
    padding-left: 30px
  } 
/*
  MAIN CONTENT AREA
  =========================================================================== */
#main-content-area{
  /*background-color: rgb(255, 248, 183); */
  /* display: flex; */
  flex-flow: column wrap; 
  width:100%;
  margin-top: 0rem;
  margin-bottom: 2rem;
  /* border: 5px solid #e93fbe; */
}

#breadcrumbs.position {
  margin-top: 2rem;
  margin-bottom: 2rem;
}
#component-area{
  /* background-color: rgb(192, 255, 195); */
  /* flex-grow: 1; */
  width:100%;
  padding: 0;
}
#sidebar-left{
  /* background-color: cornflowerblue; */
  width:100%;
  order: 3;
  padding: 0;
}
#sidebar-right{
  /* background-color: pink; */
  width:100%;
  padding: 0;
}

/*Inspirado no theme-joomla REVER EM CONFLITO*/
 #sidebar-left, #sidebar-right {
  flex: none;
  order: 1;
  width: 100%;
}
@media (width >= 992px) {
  #sidebar-left, #sidebar-right {
    order: 0;
    width: calc(25% - 1em);
  }
}
/*********************************************/

@media (min-width: 992px) {
    #main-content-area{
      display: flex;
      flex-direction: row;
      flex-wrap: nowrap;
      column-gap: 1.2rem;
    }
    #component-area{
      width: 60%;
      flex-grow: 1; 
    }
    #sidebar-left{
      /* width: 20%; */
      min-width: 220px;
      order: 0;
      flex-grow: 1;
    }
    #sidebar-right{
      /* width: 20%; */
      min-width: 220px;
      flex-grow: 1; 
    }
}
  
/* .container-banner .row {
  justify-content: center;
} */
/* .container-top-a .row > div{
  width: 100%;
}
.container-top-b .row > div{
  width: 100%;
}
.container-bottom-a .row > div{
  width: 100%;
}
.container-bottom-b .row > div{
  width: 100%;
}
.container-footer .row > div{
  width: 100%;
}   */
  
/*
  FOOTER
  =========================================================================== */
  footer{
  margin-top: auto;
}