@font-face{
    font-family: 'Pixearg'; 
    src: url(../general/PIXEARG.TTF) format('truetype');
  }

  @font-face{
    font-family: 'Pixel Script'; 
    src: url(../general/PixelScriptRegular-0WnDG.otf) format('opentype');
  }

  @font-face{
    font-family: 'Console'; 
    src: url(../general/consola.ttf) format('opentype');
  }

  
/*Header*/



body{
    background-image: url(bg.png);
    background-repeat: no-repeat; 
    background-size: cover; 
    background-attachment: fixed; 
    background-position: center; 
    justify-content: center;
    align-items: center;
    height: 100vh;
    font-family: 'Pixearg';
    margin: 0%;
    padding: 0%;
}

p{
    color: white;
    font-family: 'Console';
}


a{
    color: #a1aa6b;
}

.uiBorders {
    position:relative; 
    padding:0px 1px 1px 1px; 
    background: #7b7253;
    border:2px solid #4b4a38; 
    box-shadow: 0.0px 1px 0 #000;
    border-bottom-left-radius: 2px; 
    border-bottom-right-radius: 2px;   
    height: fit-content;

}

.contentBorders{
    position:relative; 
    z-index:10; 
    padding:1%; 
    background-image: url(windowBg.png);
    border:1px solid #4b4a38; 
    flex: 1;
}

.contentBorders p{
    margin: 1.5%;
}

.contentBorders::before{
    content:""; 
    display:block; 
    position:absolute; 
    z-index:-1; 
    top:0px; 
    left:0px; 
    right:0px; 
    bottom:0px; 
    border-top: 1px solid #000000; 
    border-left: 1px solid #000000; 
    border-right: 1px solid #000000; 
    border-bottom: none; 
}

.uiTitle{
    min-height: 24px;
    width: 100%;
    text-align: center;
    position: relative;
    background-image: url(linesTitle.png);        
    background-repeat: repeat-x;
    background-position: center;
    display: flex;
    align-items: center; 
    justify-content: center; 


}

.uiTitle-hideLines {
    background: #7b7253; 
    padding: 0 10px;
    position: relative;
    /*z-index: 1; */
    font-size: smaller;    
    
}

.uiTitle2{
    min-height: 24px;
    width: 100%;
    text-align: center;
    position: relative;
    background-image: url(linesTitle.png);        
    background-repeat: repeat-x;
    background-position: center;



}


/*Thoughts*/

.thoughtsBorders{
    padding:0.5%; 
    background-image: url(thoughtsBg.png);
    border:1px solid #4b4a38; 
    color: white;
    flex: 1;
    

}

.thoughtContainer{
    display: inline-flex;
    width: 100%;
    align-items: center;
}

.thoughtContainer span marquee{
   width: 100%;
   display: flex;
}

.currentlyThinking{
    text-decoration: none;
    color: white;
}


.uiTitle-noHideLines {
    color: white;
}

/*Links*/

ul li a{
    color:#a1aa6b;
}

/*Buttons*/
    
.buttonThanks{
    color: white;
    margin-top: 1%;
    display: flex;
    justify-content: center;
}


.hotlinkButton{
    display: flex;
    flex-direction: column;
    align-items: center;
    padding:1%;
  }  

  
.buttonClose{
    background: #7b7253;
    border-top: 2px solid #b6a97b; 
    border-left: 2px solid #b6a97b; 
    border-right: 2px solid #4b4a38;
    border-bottom: 2px solid #4b4a38;
    position: absolute; 
    right: 0; 
    top: 50%; 
    transform: translateY(-50%);
    cursor: pointer;
}

.buttonClose:hover{
    background-color: #988d67;
    border-top: 2px solid #b6a97b; 
    border-left: 2px solid #b6a97b; 
    border-right: 2px solid #4b4a38;
    border-bottom: 2px solid #4b4a38;
}

.buttonClose:active{
    background-color: #6e664b;
    border-top: 2px solid black; 
    border-left: 2px solid black; 
    border-right: 2px solid #4b4a38;
    border-bottom: 2px solid #4b4a38;
}

#navBar{
    margin-bottom: 2%;
}

.uiButton{
    background-color: #7b7253;
    border-top: 3px solid #b6a97b; 
    border-left: 3px solid #b6a97b; 
    border-right: 3px solid #4b4a38;
    border-bottom: 3px solid #4b4a38;
    color: white;
    text-align: center;

    min-width: 95px;
    min-height: 27px;

    max-width: 100%;
    cursor: pointer;
}

.uiButton:hover{
    background-color: #988d67;
    border-top: 4px solid #b6a97b; 
    border-left: 4px solid #b6a97b; 
    border-right: 4px solid #4b4a38;
    border-bottom: 4px solid #4b4a38;
    color: white;
    text-align: center;
}

.uiButton:active{
    background-color: #6e664b;
    border-top: 3px solid black; 
    border-left: 3px solid black; 
    border-right: 3px solid #4b4a38;
    border-bottom: 3px solid #4b4a38;
    color: white;
    text-align: center;
}

.uiBorders-allRound {   
    position:relative; 
    padding:0px 1px 1px 1px; 
    background: #7b7253;
    border:2px solid #4b4a38; 
    box-shadow: 0.0px 1px 0 #000;
    border-bottom-left-radius: 2px; 
    border-bottom-right-radius: 2px; 
    border-top-left-radius: 2px; 
    border-top-right-radius: 2px;   
    height: fit-content;
}


.uiButton-active{
    background-color: #6e664b;
    border-top: 3px solid black; 
    border-left: 3px solid black; 
    border-right: 3px solid #4b4a38;
    border-bottom: 3px solid #4b4a38;
    color: white;
    text-align: center;

}

/*  Dialog  */
.dialog {
    position: relative;
    background: #ffffcb;
    padding: 15px;
    border-radius: 10px;
    width: max-content;
    max-width: 300px;
    font-size: 12px;
    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1);
    font-family: 'Consolas';
    margin-bottom: 3%;
    color: black;
  }
  
  .closeDialog{
    float: inline-end;
    margin-top: 5%;
    background: #ffffcb;
    font-size: smaller;
  }

  .closeDialog:hover{
    background: #dedeae;
    cursor: pointer;
  }

  .closeDialog:active{
    background: #dedeae;

  }