@media only screen and (min-width:0px){
  /************************************************************ ESTRUTURA GERAL *************************************************************/
  /**                                                                                                                                      **/
  /**                                             ESTRUTURA QUE SE APLICA A TODOS OS TAMANHOS                                              **/
  /**                                                                                                                                      **/
  /******************************************************************************************************************************************/

  /************************************************************* VARIAVEIS CSS **************************************************************/
  /**                                                                                                                                      **/
  /**                                     VARIAVEIS PARA ESTRUTURA DEFAULT (MARGINS/PADDINGS DEFAULT)                                      **/
  /**                                                                                                                                      **/
  /******************************************************************************************************************************************/
  :root{
    --margintopdefault: 56px;
    --marginrightdefault: 40px;
    --marginbottomdefault: 62px;
    --marginleftdefault: 40px;
  }
  /*********************************************************** FIM VARIAVEIS CSS ************************************************************/

  /************************************************************* DEFAUTLS LENIS *************************************************************/

  /**                                                                                                                                      **/
  /**                                          CLASES DEFAULT LENIS (SMOOTH SCROLL) NAO MODIFICAR                                          **/
  /**                                                                                                                                      **/
  /******************************************************************************************************************************************/
  html.lenis, html.lenis body { height: auto; }
  .lenis.lenis-smooth { scroll-behavior: auto !important; }
  .lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
  .lenis.lenis-stopped { overflow: hidden; }
  .lenis.lenis-scrolling iframe { pointer-events: none; }
  /*********************************************************** FIM DEFAUTLS LENIS ***********************************************************/

  /************************************************************ DEFAULT ELEMENTS ************************************************************/
  /**                                                                                                                                      **/
  /**                                             CLASES DEFAULT ELEMENTOS BASE NAO MODIFICAR                                              **/
  /**                                                                                                                                      **/
  /******************************************************************************************************************************************/
  section{position: relative; float: left; width: 100%; clear: both;}
  .div{ position: relative; float: left; clear: none; }
  .divboth{ position: relative; float: left; clear: both; }
  .divbothright{ position: relative; float: right; clear: both; }
  .divright{ position: relative; float: right; clear: none; }
  .divdefault{ float: left; position: relative; width: 100%; clear: both; }

  .gridContainer{ margin-left:auto;margin-right:auto;width:100%; padding-left:0%; padding-right:0%; overflow:hidden; z-index: 0; }
  #LayoutDiv{ clear:both; float:left; margin-left:0; width:100%; display: block; position: relative; background: #fff; z-index: 100; }
  /********************************************************** FIM DEFAULT ELEMENTS **********************************************************/

  /******************************************************** DEFAULT MARGINS/PADDINGS ********************************************************/
  /**                                                                                                                                      **/
  /**                                  CLASES DEFAULT MARGINS/PADDINGS NAO MODIFICAR, USAR VARIAVEIS CSS                                   **/
  /**                                                                                                                                      **/
  /******************************************************************************************************************************************/
  .margindefault{margin-left: var(--marginleftdefault); margin-right: var(--marginrightdefault); width: calc(100% - ( var(--marginleftdefault) + var(--marginrightdefault))); }
  .margindefaulttop{margin-top: var(--margintop); }
  .margindefaultright{margin-right: var(--marginrightdefault); width: calc(100% - var(--marginrightdefault)); }
  .margindefaultbottom{margin-bottom: calc(var(--marginbottom)); }
  .margindefaultleft{margin-left: var(--marginleftdefault); width: calc(100% - var(--marginleftdefault)); }

  .margindefault section.nomargin{width: calc(100% + ( var(--marginleftdefault) + var(--marginrightdefault))); margin-left: calc(var(--marginleftdefault) * (-1))}

  .marginfooterdefault{margin: 0 var(--marginfooter); width: calc(100% - ( var(--marginfooter) * 2)); }
  .marginfooterdefaultleft{margin-left: var(--marginfooter); width: calc(100% - var(--marginfooter)); }
  .marginfooterdefaultright{margin-right: var(--marginfooter); width: calc(100% - var(--marginfooter)); }

  .paddingdefault{padding-left: var(--paddingleftdefault); padding-right: var(--paddingrightdefault); }
  .paddingdefaulttop{margin-top: var(--paddingtop); }
  .paddingdefaultright{padding-right: var(--paddingrightdefault); }
  .paddingdefaultbottom{padding-bottom: calc(var(--paddingbottom)); }
  .paddingdefaultleft{padding-left: var(--paddingleftdefault); }
  /****************************************************** FIM DEFAULT MARGINS/PADDINGS ******************************************************/

  /********************************************************* CONTROLOS SHOW / HIDE **********************************************************/
  .showmobile, .showmobile481, .showmobile769, .showmobile1024, .showmobile1280{display: block;}
  .showmobileflex, .showmobileflex481, .showmobileflex769, .showmobileflex1024, .showmobileflex1280{display: flex;}
  .showmobiletr, .showmobiletr481, .showmobiletr769, .showmobiletr1024, .showmobiletr1280{display: table-row;},
  .showmobiletd, .showmobiletd481, .showmobiletd769, .showmobiletd1024, .showmobiletd1280{display: table-cell;}
  .showmobileinline, .showmobileinline481, .showmobileinline769, .showmobileinline1024, .showmobileinline1280{display: inline;}
  .showmobiletable, .showmobiletable481, .showmobiletable769, .showmobiletable1024, .showmobiletable1280{display: table;}

  .hidemobile1280, .hidemobile1280flex, .hidemobile1280tr, .hidemobile1280td, .hidemobile1280inline, .hidemobile1280table{ display:none; }
  .hidemobile1024, .hidemobile1024flex, .hidemobile1024tr, .hidemobile1024td, .hidemobile1024inline, .hidemobile1024table{ display:none; }
  .hidemobile769, .hidemobile769flex, .hidemobile769tr, .hidemobile769td, .hidemobile769inline, .hidemobile769table{ display:none; }
  .hidemobile481, .hidemobile481flex, .hidemobile481tr, .hidemobile481td, .hidemobile481inline, .hidemobile481table{ display:none; }
  .hidemobile, .hidemobileflex, .hidemobiletr, .hidemobiletd, .hidemobileinline, .hidemobiletable{ display:none; }
  /******************************************************* FIM CONTROLOS SHOW / HIDE ********************************************************/

  /*************************************************************** MAX WIDTHS ***************************************************************/

  /************************************************************* FIM MAX WIDTHS *************************************************************/

  /************************************************************* DEFAULTS FLEX **************************************************************/
  .flex{ display: flex; }
  .flex.wrap{ flex-wrap: wrap; }
  .flex.nowrap{ flex-wrap: nowrap; }
  .flex.grow{ flex-grow: 1; }

  .flex.column{ flex-direction: column; }
  .flex.row{ flex-direction: row; }
  .flex.reversecolums{ flex-direction: column-reverse; }
  .flex.reverserow{ flex-direction: row-reverse; }

  .flex.align-start{align-items: flex-start}
  .flex.align-end{align-items: flex-end}
  .flex.align-center{align-items: center}
  .flex.align-stretch{align-items: stretch}
  .flex.align-base{align-items: baseline}

  .flex-justify-start{justify-content: flex-start}
  .flex-justify-end{justify-content: flex-end}
  .flex-justify-center{justify-content: center}
  .flex-justify-between{justify-content: space-between}
  .flex-justify-around{justify-content: space-around}
  .flex-justify-evenly{justify-content: space-evenly}

  .flex.justify-center{ justify-content: center; }
  .flex.space-between{ justify-content: space-between; }
  /*********************************************************** FIM DEFAULTS FLEX ************************************************************/

  /************************************************************ DEFAULTS COLUNAS ************************************************************/
  .colunas2, .colunas3, .colunas4, .colunas5, .colunas20, .colunas30, .colunas35, .colunas40, .colunas60, .colunas65, .colunas70, .colunas80{clear:both; float:left; width:100%; margin-bottom: var(--marginbottomcolunas);}
  .colunas2.nomarginmobile, .colunas3.nomarginmobile, .colunas4.nomarginmobile, .colunas5.nomarginmobile, .colunas20.nomarginmobile, .colunas30.nomarginmobile, .colunas35.nomarginmobile, .colunas40.nomarginmobile, .colunas60.nomarginmobile, .colunas65.nomarginmobile, .colunas70.nomarginmobile, .colunas80.nomarginmobile{margin-bottom: 0px;}
  /********************************************************** FIM DEFAULTS COLUNAS **********************************************************/

  /********************************************************** FIM ESTRUTURA GERAL ***********************************************************/
}



@media only screen and (max-width:768px){
  /********************************************************** ESTRUTURA SO MOBILE ***********************************************************/
  /**                                                                                                                                      **/
  /**                                            ESTILOS QUE SO SE APLICAM AO MOBILE (MAX 768)                                             **/
  /**                                                                                                                                      **/
  /******************************************************************************************************************************************/
  /******************************************************** DEFAULTS FLEX SO MOBILE *********************************************************/
  .flex-mobile{ display: flex; }
  .flex.wrap-mobile{ flex-wrap: wrap; }
  .flex.nowrap-mobile{ flex-wrap: nowrap; }
  .flex.grow-mobile{ flex-grow: 1; }

  .flex.column-mobile{ flex-direction: column; }
  .flex.row-mobile{ flex-direction: row; }
  .flex.reversecolums-mobile{ flex-direction: column-reverse; }
  .flex.reverserow-mobile{ flex-direction: row-reverse; }

  .flex.align-start-mobile{align-items: flex-start}
  .flex.align-end-mobile{align-items: flex-end}
  .flex.align-center-mobile{align-items: center}
  .flex.align-stretch-mobile{align-items: stretch}
  .flex.align-base-mobile{align-items: baseline}

  .flex-justify-start-mobile{justify-content: flex-start}
  .flex-justify-end-mobile{justify-content: flex-end}
  .flex-justify-center-mobile{justify-content: center}
  .flex-justify-between-mobile{justify-content: space-between}
  .flex-justify-around-mobile{justify-content: space-around}
  .flex-justify-evenly-mobile{justify-content: space-evenly}

  .flex.justify-center-mobile{ justify-content: center; }
  .flex.space-between-mobile{ justify-content: space-between; }
  /****************************************************** FIM DEFAULTS FLEX SO MOBILE *******************************************************/

  /******************************************************** FIM ESTRUTURA SO MOBILE *********************************************************/
}

@media only screen and (min-width:481px){
  /********************************************************** ESTRUTURA BIG MOBILE **********************************************************/

  /********************************************************* CONTROLOS SHOW / HIDE **********************************************************/
  .showmobile481, .showmobileflex481, .showmobiletr481, .showmobiletd481, .showmobileinline481, .showmobiletable481{ display: none; }

  .hidemobile481{display: block;}
  .hidemobileflex481{display: flex;}
  .hidemobiletr481{display: table-row;},
  .hidemobiletd481{display: table-cell;}
  .hidemobileinline481{display: inline;}
  .hidemobiletable481{display: table;}
  /******************************************************* FIM CONTROLOS SHOW / HIDE ********************************************************/
}

@media only screen and (min-width:600px){

}

@media only screen and (min-width:769px){
  /************************************************************ ESTRUTURA TABLET ************************************************************/
  /**                                                                                                                                      **/
  /**                                                        ESTRUTURA PARA TABLET                                                         **/
  /**                                                                                                                                      **/
  /******************************************************************************************************************************************/
  /************************************************************* VARIAVEIS CSS **************************************************************/
  /************************************************************* VARIAVEIS CSS **************************************************************/
  /**                                                                                                                                      **/
  /**                                     VARIAVEIS PARA ESTRUTURA DEFAULT (MARGINS/PADDINGS DEFAULT)                                      **/
  /**                                                                                                                                      **/
  /******************************************************************************************************************************************/
  :root{
    --margintopdefault: 56px;
    --marginrightdefault: 40px;
    --marginbottomdefault: 62px;
    --marginleftdefault: 40px;
  }
  /*********************************************************** FIM VARIAVEIS CSS ************************************************************/

  /********************************************************* CONTROLOS SHOW / HIDE **********************************************************/
  .showmobile769, .showmobileflex769, .showmobiletr769, .showmobiletd769, .showmobileinline769, .showmobiletable769{ display: none; }

  .hidemobile769{display: block;}
  .hidemobileflex769{display: flex;}
  .hidemobiletr769{display: table-row;},
  .hidemobiletd769{display: table-cell;}
  .hidemobileinline769{display: inline;}
  .hidemobiletable769{display: table;}
  /******************************************************* FIM CONTROLOS SHOW / HIDE ********************************************************/

  /*************************************************************** MAX WIDTHS ***************************************************************/

  /************************************************************* FIM MAX WIDTHS *************************************************************/


  /************************************************************ DEFAULTS COLUNAS ************************************************************/
  .colunas2:nth-child(2n+1){clear: both; width: 50%; margin-bottom: var(--marginbottomcolunas);}
  .colunas2:nth-child(2n+2){clear: none; width: 50%; margin-bottom: var(--marginbottomcolunas);}

  .colunas3:nth-child(3n+1){clear: both; width: calc(100% / 3); margin-bottom: var(--marginbottomcolunas);}
  .colunas3:nth-child(3n+2){clear: none; width: calc(100% / 3); margin-bottom: var(--marginbottomcolunas);}
  .colunas3:nth-child(3n+3){clear: none; width: calc(100% / 3); margin-bottom: var(--marginbottomcolunas);}

  .colunas4:nth-child(2n+1){clear: both; width: 50%; margin-bottom: var(--marginbottomcolunas);}
  .colunas4:nth-child(2n+2){clear: none; width: 50%; margin-bottom: var(--marginbottomcolunas);}

  .colunas5:nth-child(3n+1){clear: both; width: calc(100% / 3); margin-bottom: var(--marginbottomcolunas);}
  .colunas5:nth-child(3n+2){clear: none; width: calc(100% / 3); margin-bottom: var(--marginbottomcolunas);}
  .colunas5:nth-child(3n+3){clear: none; width: calc(100% / 3); margin-bottom: var(--marginbottomcolunas);}

  .colunas20:nth-child(2n+1){clear: both; width: 20%; margin-bottom: var(--marginbottomcolunas);}
  .colunas20:nth-child(2n+2){clear: none; width: 20%; margin-bottom: var(--marginbottomcolunas);}
  .colunas30:nth-child(2n+1){clear: both; width: 30%; margin-bottom: var(--marginbottomcolunas);}
  .colunas30:nth-child(2n+2){clear: none; width: 30%; margin-bottom: var(--marginbottomcolunas);}
  .colunas35:nth-child(2n+1){clear: both; width: 35%; margin-bottom: var(--marginbottomcolunas);}
  .colunas35:nth-child(2n+2){clear: none; width: 35%; margin-bottom: var(--marginbottomcolunas);}
  .colunas40:nth-child(2n+1){clear: both; width: 40%; margin-bottom: var(--marginbottomcolunas);}
  .colunas40:nth-child(2n+2){clear: none; width: 40%; margin-bottom: var(--marginbottomcolunas);}
  .colunas60:nth-child(2n+1){clear: both; width: 60%; margin-bottom: var(--marginbottomcolunas);}
  .colunas60:nth-child(2n+2){clear: none; width: 60%; margin-bottom: var(--marginbottomcolunas);}
  .colunas65:nth-child(2n+1){clear: both; width: 65%; margin-bottom: var(--marginbottomcolunas);}
  .colunas65:nth-child(2n+2){clear: none; width: 65%; margin-bottom: var(--marginbottomcolunas);}
  .colunas70:nth-child(2n+1){clear: both; width: 70%; margin-bottom: var(--marginbottomcolunas);}
  .colunas70:nth-child(2n+2){clear: none; width: 70%; margin-bottom: var(--marginbottomcolunas);}
  .colunas80:nth-child(2n+1){clear: both; width: 80%; margin-bottom: var(--marginbottomcolunas);}
  .colunas80:nth-child(2n+2){clear: none; width: 80%; margin-bottom: var(--marginbottomcolunas);}
  .colunas2.nomargin, .colunas3.nomargin, .colunas4.nomargin, .colunas5.nomargin, .colunas20.nomargin, .colunas30.nomargin, .colunas35.nomargin, .colunas40.nomargin, .colunas60.nomargin, .colunas65.nomargin, .colunas70.nomargin, .colunas80.nomargin{margin-bottom: 0px;}
  /********************************************************** FIM DEFAULTS COLUNAS **********************************************************/

  /********************************************************** FIM ESTRUTURA TABLET **********************************************************/
}

@media only screen and (min-width:900px){

}

@media only screen and (min-width:932px){

}

@media only screen and (min-width:1024px){
  /************************************************************ ESTRUTURA LAPTOP ************************************************************/
  /**                                                                                                                                      **/
  /**                                                    PRIMEIROS ESTRUTURA DE DESKTOP                                                    **/
  /**                                                                                                                                      **/
  /******************************************************************************************************************************************/

  /************************************************************* VARIAVEIS CSS **************************************************************/
  /**                                                                                                                                      **/
  /**                                     VARIAVEIS PARA ESTRUTURA DEFAULT (MARGINS/PADDINGS DEFAULT)                                      **/
  /**                                                                                                                                      **/
  /******************************************************************************************************************************************/
  :root{
    --margintopdefault: 125px;
    --marginrightdefault: 80px;
    --marginbottomdefault: 70px;
    --marginleftdefault: 80px;
  }
  /*********************************************************** FIM VARIAVEIS CSS ************************************************************/

  /********************************************************* CONTROLOS SHOW / HIDE **********************************************************/
  .showmobile, .showmobileflex, .showmobiletr, .showmobiletd, .showmobileinline, .showmobiletable{ display: none; }
  .showmobile1024, .showmobileflex1024, .showmobiletr1024, .showmobiletd1024, .showmobileinline1024, .showmobiletable1024{ display: none; }

  .hidemobile, .hidemobile1024 { display: block; }
  .hidemobileflex, .hidemobileflex1024 { display: flex; }
  .hidemobiletr, .hidemobiletr1024 { display: table-row; }
  .hidemobiletd, .hidemobiletd1024 { display: table-cell; }
  .hidemobileinline, .hidemobileinline1024 { display: inline; }
  .hidemobiletable, .hidemobiletable1024 { display: table; }
  /******************************************************* FIM CONTROLOS SHOW / HIDE ********************************************************/

  /******************************************************** DEFAULTS FLEX SO DESKTOP ********************************************************/
  .flex-desktop{ display: flex; }
  .flex.wrap-desktop{ flex-wrap: wrap; }
  .flex.nowrap-desktop{ flex-wrap: nowrap; }
  .flex.grow-desktop{ flex-grow: 1; }

  .flex.column-desktop{ flex-direction: column; }
  .flex.row-desktop{ flex-direction: row; }
  .flex.reversecolums-desktop{ flex-direction: column-reverse; }
  .flex.reverserow-desktop{ flex-direction: row-reverse; }

  .flex.align-start-desktop{align-items: flex-start}
  .flex.align-end-desktop{align-items: flex-end}
  .flex.align-center-desktop{align-items: center}
  .flex.align-stretch-desktop{align-items: stretch}
  .flex.align-base-desktop{align-items: baseline}

  .flex-justify-start-desktop{justify-content: flex-start}
  .flex-justify-end-desktop{justify-content: flex-end}
  .flex-justify-center-desktop{justify-content: center}
  .flex-justify-between-desktop{justify-content: space-between}
  .flex-justify-around-desktop{justify-content: space-around}
  .flex-justify-evenly-desktop{justify-content: space-evenly}

  .flex.justify-center-desktop{ justify-content: center; }
  .flex.space-between-desktop{ justify-content: space-between; }
  /****************************************************** FIM DEFAULTS FLEX SO DESKTOP ******************************************************/

  /************************************************************ DEFAULTS COLUNAS ************************************************************/
  .colunas4:nth-child(4n+1){clear: both; width: 25%; margin-bottom: var(--marginbottomcolunas);}
  .colunas4:nth-child(4n+2){clear: none; width: 25%; margin-bottom: var(--marginbottomcolunas);}
  .colunas4:nth-child(4n+3){clear: none; width: 25%; margin-bottom: var(--marginbottomcolunas);}
  .colunas4:nth-child(4n+4){clear: none; width: 25%; margin-bottom: var(--marginbottomcolunas);}

  .colunas5:nth-child(5n+1){clear: both; width: 20%; margin-bottom: var(--marginbottomcolunas);}
  .colunas5:nth-child(5n+2){clear: none; width: 20%; margin-bottom: var(--marginbottomcolunas);}
  .colunas5:nth-child(5n+3){clear: none; width: 20%; margin-bottom: var(--marginbottomcolunas);}
  .colunas5:nth-child(5n+4){clear: none; width: 20%; margin-bottom: var(--marginbottomcolunas);}
  .colunas5:nth-child(5n+5){clear: none; width: 20%; margin-bottom: var(--marginbottomcolunas);}
  /********************************************************** FIM DEFAULTS COLUNAS **********************************************************/
  /********************************************************** FIM ESTRUTURA LAPTOP **********************************************************/
}

@media only screen and (min-width:1280px){
  /*************************************************************** ESTILOS PC ***************************************************************/
  /************************************************************* VARIAVEIS CSS **************************************************************/
  /**                                                                                                                                      **/
  /**                                     VARIAVEIS PARA ESTRUTURA DEFAULT (MARGINS/PADDINGS DEFAULT)                                      **/
  /**                                                                                                                                      **/
  /******************************************************************************************************************************************/

  /*********************************************************** FIM VARIAVEIS CSS ************************************************************/

  /********************************************************* CONTROLOS SHOW / HIDE **********************************************************/
  .showmobile1280, .showmobileflex1280, .showmobiletr1280, .showmobiletd1280, .showmobileinline1280, .showmobiletable1280{ display: none; }

  .hidemobile1280{display: block;}
  .hidemobileflex1280{display: flex;}
  .hidemobiletr1280{display: table-row;},
  .hidemobiletd1280{display: table-cell;}
  .hidemobileinline1280{display: inline;}
  .hidemobiletable1280{display: table;}
  /******************************************************* FIM CONTROLOS SHOW / HIDE ********************************************************/
}

@media only screen and (min-width:1800px){

}

@media only screen and (min-width:2200px){

}
