*{
    
    --palletColor1 : #282B57;
    --palletColor2 : #443482;
    --palletColor3 : #703E9C;
    --palletColor4 : #C2469D;
    --palletColor5 : #E35F8D;
    --palletColor6 : #EB7A7E;
    --palletColor7 : #F59182;
    --palletColor8 : #FAB88E;
    
    --lavenderShade1 : #777696;
    --lavenderShade2 : #695887;
    
    --sectionTitleColor: #d0bcff;
}

@font-face {
  font-family: 'guignolet-kirsch-lat';
  src: url('../../assets/fonts/guignolet-kirsch-lat.otf');
}

@font-face {
  font-family: 'rounded-blocks-filled';
  src: url('../../assets/fonts/rounded-blocks-filled.otf');
}

@font-face {
  font-family: 'Cosmo Corner';
  src: url('../../assets/fonts/Cosmo Corner.ttf');
}

@font-face {
  font-family: 'Milkyway DEMO';
  src: url('../../assets/fonts/Milkyway DEMO.ttf');
}

@font-face {
  font-family: 'Mochi Boom DEMO';
  src: url('../../assets/fonts/Mochi Boom DEMO.ttf');
}

.custom-button
{
    border-radius: 50px;
    background-color: var(--lavenderShade2);
    background-size:cover;
    /*font-family: pixel;*/
    /*font-size: 1.1em;*/
    font-size: 14px;
    margin-top: 5px;
    margin-left: 3px;
    text-align: center;
    padding: 8px;
}

.custom-button a
{
    font-size: large;
    color: white;
}

/*
li 
{
  list-style-image: url("https://i.imgur.com/hdOddDH.gif");
  list-style-image: url("https://i.imgur.com/PFJ9KCl.gif");
  padding-inline-start: 1ch;
}
*/

/*::-webkit-scrollbar 
{
    width: 0; /* remove scrollbar space */
    /*background: transparent; /* to make scrollbar invisible */
/*}

::-webkit-scrollbar-thumb 
{
    background: transparent;
}
*/

::-webkit-scrollbar
{
    width: 8px;
    border-radius: 100px;
    background: transparent;
}

::-webkit-scrollbar-track
{
    background-color: var(--sectionTitleColor);
}

::-webkit-scrollbar-thumb 
{
    background-color: var(--sectionTitleOutlineColor);
    border-radius: 100px;
}

::selection 
{
    /* Change highlight background color */
    background: #f7abcf;
    
    /* Change highlight text color */
    color: #FFFFFF;
}
 
a 
{
    text-decoration: none;
    width:fit-content;
    transition: .2s ease; 
    color:black;
}

a:hover
{
    color:hotpink;
    text-decoration-line: underline;
    text-decoration-style: wavy;
}

img
{
    max-width: 100%;
}