.wfull{
    width:100%;
}

/*
    Personalização de onsen-ui
*/
.toolbar-button--outline{
    border:1px solid darkslategrey;
}
/*-----------------------------------------------------------*/
.page-content{
  display: contents;
  
  overflow: hidden;
  margin: 0px;  
}
.page-title {
  font-family: 'Orbitron', sans-serif;
  font-size: 16px;
  margin-left: 5px;
  margin-right: 5px;
  color: coral;
  font-weight: bold;
}
.page-header {
  display: block;
  background-color: midnightblue;
}
.page-footer {
  display: flex;
  background-color:#282828;
  line-height: 35px;
}
.dialog {
  width: 90%; /* Largura da dialog */
}
@media (min-width: 768px) {
  .dialog {
    max-width: 30%; /* definimos a largura máxima em 80% */
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3); /* Sombra da dialog */
  }
}
/*------------------------------------------------------------------------------*/
.dialog-title{
  font-family: monospace;
  font-size: 16px;
  font-weight: bold;
  background-color: black;
  color: #00FF09;
  height: 35px;
  line-height: 35px;
}
.dialog-content{
  font-family: monospace;
  font-size: 14px;
  font-weight: bold;
  margin: 5px;
}
.dialog-footer{
    margin:3px;
    padding: 2px;
    border-top: 2px solid #404040;
}

.div-input-1{
  display: inline-flex;
  margin-right: 5px;
  margin-left: 5px;
  width: -webkit-fill-available;
  align-items: center;
}
.div-input-2{
  display: grid;
  margin-right: 15px;
  margin-left: 5px;
  width: -webkit-fill-available;
  align-items: center;
}

.input-title{
  font-family: 'Orbitron', sans-serif;
  font-size: 16px;

  font-weight: bold;
  color: #00FF09;
  vertical-align:middle;


  white-space: nowrap;
}
.input-text{
  box-sizing: border-box; 
  border: 1px solid dodgerblue;
    color: yellow;
    font-family: monospace;
    background-color: #424242;
    border-radius: 2px;   
    height: 25px;
    font-size: 16px;
    font-weight: bold;
    
}

.center{
  text-align: center;
  white-space: nowrap;
}

.label-title{
    font-family: 'Orbitron', sans-serif;
    font-size: 16px;
    font-weight: bold;
    color: #00FF09;
    vertical-align:middle;
    display:inline-flex;
    white-space: nowrap;
    margin-bottom: 2px;
}

.textarea{
    -webkit-touch-callout: none;
    -moz-user-select: none;
    -ms-user-select: none;
    box-sizing: border-box; 
  border: 1px solid dodgerblue;
  background-color: #424242;
  color: yellow;
  font-size: 14px;
  font-family: monospace;    

}
.button_upload{
  color: white;
  font-weight: bold;
  font-family: 'Orbitron';
  font-size: 20px;
  white-space: nowrap;
}
.button2{
    
    background-color: orange;
    color: white;
    height: 25px;
    font-size: 16px;
    border: none;
    border-radius: 2px;
}
.btn1X{
    background-color: darkgreen;
    color:white;
    width:50px;
    border-radius: 2px;
    margin:2px;
    padding: 3px;
    text-align: center;
    font-family:  'Orbitron';
    font-size: 14px;
}
.btn2X{
    background-color: darkgreen;
    color:white;
     border-radius: 2px;
     margin:2px;
    padding: 3px;
    width: 100%;
    text-align: left;
    font-family:  'Orbitron';
    font-size: 12px;
    font-weight: bold;
    
}

.btn11X{
    background-color: darkgreen;
    color:white;
    border-radius: 2px;
    margin:2px;
    padding: 3px;
    text-align: center;
    font-family:  'Orbitron';
    font-size: 14px;
}

.btnBack{
    background-color: mediumblue;
    color: white;
    font-family: 'Orbitron';

    font-weight: bold;
    margin:5px;
    width: 100%;
    display: flex;
    cursor: pointer;
}
.onu {
    background-color:grey;
    color:white;
    border-radius:3px;
    padding:3px;
    cursor: pointer;
    margin:3px;
    flex:auto;
}
.fluid{
    display: flex; /* Cria um layout flexível */
    justify-content: space-between; /* Distribui os elementos uniformemente */
    align-items: center; /* Centraliza verticalmente os elementos */
    flex-wrap: wrap;
}
.menuFlixButton{
    background-color: darkgreen;
    color: white;
    border-radius: 3px;
    padding-top: 5px;
    padding-bottom: 5px;
    margin: 3px;
    flex: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-wrap: wrap;
  
}
.menuFlixLabel{
    font-family: 'Orbitron', sans-serif;
    font-size: 16px;
    font-weight: bold;
    color:#00FF09;
}
.menuFlixIcon{
    color: white;
    padding: 3px;
}
/* Estilo para o container do efeito de ripple */
.ripple-container {
    position: relative;
    width: 200px;
    height: 200px;
    background-color: #007bff;
    cursor: pointer;
    overflow: hidden;
  }
  
  /* Estilo para a ondulação */
  .ripple {
    position: absolute;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.4);
    transform: scale(0);
    animation: ripple-animation 0.6s linear;
  }
  
  /* Animação para a ondulação */
  @keyframes ripple-animation {
    to {
      transform: scale(4);
      opacity: 0;
    }
  }

.pointer{
    cursor: pointer;
}
.gallery{
    cursor: pointer;
    display: flex;
    flex-direction: row;
    align-content: center;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-around; /* space-between*/
}
/****************************************/

.window-page {
    background-color: #0d0d0d; /* Cor de fundo */

    color: #333; /* Cor de texto */
    font-family: "Helvetica Neue", sans-serif; /* Fonte */
    display:flex;
    flex-direction:column;
    box-sizing: border-box;
    padding: 3px;

  }

  /* Classes do Onsen UI aplicadas ao div */
  .window-page .center {
    text-align: center; /* Centraliza o texto */
  }

  
  .window-page-content{
   
      display:flex;
      width: 100%;      
      height:calc(100% - 84px);
  }
  .window-page-header{
    top: 0;
    background-color: #333;
    line-height: 44px;
    padding-left: 5px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    height: 50px;
  }

  .window-page-footer{
 
    background-color: #333;
    display: flex;
    width: 100%;
    line-height: 17px;
    color: white;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    height: 34px;
  }
  .window-dialog-footer{
    position: absolute;
    bottom: 0;
    background-color: #333;
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: space-between;
    align-items: center;

  }
  .window-dialog-header{
    top: 0;
    background-color: #333;
    line-height: 44px;
    padding-left: 5px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
  }
  .window-dialog-content{
    color:white;
  }

  
  .p3{
    padding: 3px;
 }
  .p5{
    padding: 5px;
  }
  .p10{
    padding: 10px;
  }
  .p20{
    padding: 20px;
  }
*::-webkit-scrollbar {
    width: 5px;
  }
  
  *::-webkit-scrollbar-track {
    background-color: transparent;
  }
  
  *::-webkit-scrollbar-thumb {
    background-color: #ffc107;
    border: 2px solid rgba(0, 0, 0, 0);
    border-radius: 10px;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
  }
  

.l100{
    width:100%;
 
}

.tag{
    color: white;
    font-family: monospace;
    font-weight: bold;
    padding-top: 2px;
    border-radius: 2px;
    margin-right: 5px;
}

.tagBlue{
    background-color: royalblue;
}

.tagGreen{
    background-color: green;
}

.tagIndigo{
    background-color: indigo;
}

.tagOrange{
    background-color: orangered;
}

.tagGrey{
    background-color: grey;
}

.tagCoral{
    background-color: coral;
}
.cWhite{
    color:white;
}
.cGreen{
    color:lawngreen;
}

.cBlue{
    color:royalblue;
}
.cCoral{
    color:coral;
}
.cRed{
    color:red;
}
.cYellow{
    color:yellow;
}



._input{    
    box-sizing: border-box;
    border: 1px solid dodgerblue;
    color: yellow;
    font-family: monospace;
    background-color: #424242;
    border-radius: 2px;
    height: 25px;
    font-size: 16px;
    font-weight: bold;
    width: 100%;
}