
body{
    display: grid;
    background-image: url("/img/advertisement.jpg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-attachment: scroll;
    grid-template-rows: repeat(15);
    grid-template-columns: 1fr, 1fr, 1fr, 1fr, 1fr, 1fr, 1fr, 1fr;
    grid-column: 8;
    grid-column-start: 1;
    padding: 0;
    margin: 10px;
    font-family: 'Courier New', Courier, monospace;
    
     

 
}
a{
    text-decoration: none;
    color: #000000;
}
a:hover{
    color:  #211d1f;
    font-weight: 500;
    text-decoration: underline;
    
}
header{
    font-family: 'Courier New', Courier, monospace;
    text-align: center;
    position: center; 
    font-weight: 600;
    border: 10px none;
    column-span:2,3, 4, 5, 6, 7;
    grid-template-rows: 1;
    font-size: 40px;
    border-radius: 5px;
    line-height: 1;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    max-width: 50%;
    max-height: 50%;
    padding: 20px 40px;
}
 
header ul{
   align-items: center;
   display: flex;
   justify-content: center;
   height: 100%;
   width: 100%;
   list-style:disc;
   padding: 5px;
   margin: 2.5px;
    
}
header ul li{
   display: inline-block;
   align-items: center;
 }

h1{
    font-size: 90px;
    text-align: center;
    position: relative top = 500px;
    font-weight: 600;
}


h1 sub{
        column-span: 2, 3, 4, 5, 6, 7;
        font-size: 22px;
        font-weight: 600;
        text-align: center;
        font-style: italic;
        
}
.extra{
    columns: 4;
    list-style-type: none;

}
.home-button{
    grid-row: 1;
    font-family: 'Courier New', Courier, monospace;
    background-color: #b14b4b91;
    border: none;
    color: rgb(0, 0, 0);
    border: 10px;
    text-align: center;
    border-radius: 25px;
  
    font-size: 16px;
    margin: 2px;
 

}   
.weeklylover{
    background-color: #000000;
    color: white;
    font-size: 30px;

}
.weeklylover:hover{
    background-color: white;
    color: #ff0000;
}
nav{
    
    border-spacing: 10px;
    display: inline-flex;
    align-items: stretch;
    font-family: 'Courier New', Courier, monospace;
    list-style-type: none;
    columns: 10;
    margin: 0;
    padding: 10px;
    -ms-flex-align: start;
    overflow: hidden;
    font-size: 25px;
    text-align: center;

}
nav li{
    display: contents;

}
nav .lost{
    display: inline;
    font-family: 'Courier New', Courier, monospace;
    list-style-type: none;
    margin: 0;
    padding: 10px;
    overflow: hidden;
    font-size: 25px;
    text-align: center;
    border: groove 5px;
    border-radius: 25px;
}
nav .index{
    display: inline;
    font-family: 'Courier New', Courier, monospace;
    list-style-type: none;
    margin: 0;
    padding: 10px;
    overflow: hidden;
    font-size: 25px;
    text-align: center;
    border:  #a9d2ffab dotted 5px;
    border-radius: 25px;
}
nav .NEW{
    display: inline;
    font-family: 'Courier New', Courier, monospace;
    list-style-type: none;
    margin: 0;
    padding: 10px;
    overflow: hidden;
    font-size: 25px;
    text-align: center;
    border: rgb(255, 234, 95) dotted 5px;
    border-radius: 25px;
}
nav .vrac{
    display: inline;
    font-family: 'Courier New', Courier, monospace;
    list-style-type: none;
    margin: 0;
    padding: 10px;
    overflow: hidden;
    font-size: 25px;
    text-align: center;

    color: #ff0000;
    border: #6f353d dotted 5px;
    border-radius: 25px;
}
nav .vrac:hover{
    box-shadow: #000000 5px 5px 5px;
    background-color:#df525282; 
    color: hsl(0, 0%, 0%);
    font-weight: 500;
    text-decoration: underline;
}
nav .lost:hover{
    box-shadow:   5px 5px 5px  #4e203bf0;
    color: rgb(244, 190, 16);
    font-weight: 600;
    border: rgba(65, 7, 65, 0.974) dotted 5px;
    background-color: #7d315f7c;
    padding: 10px;
 
}
nav .NEW:hover{
    box-shadow: inset 5px 5px 5px #997d36, 5px 5px 5px  #997d36;
    color: #000000;
    border: rgba(235, 235, 114, 0.833) dotted 5px;
    background-color: #ffea7175;
    padding: 10px;
}
nav .index:hover{
    box-shadow: inset 5px 5px 5px #267276, 5px 5px 5px  #267276;
    color: #000000;
    background-color: #4694e87a;
    padding: 10px;
}
nav .not_displayed{
    box-shadow: inset;

}
nav .not_displayed:hover{
    background-color: #a3a1cb;
    box-shadow: inset 5px 5px 5px #42264e, 5px 5px 5px gray;
    padding: 10px;
    
}

.nodes{
    column-span: 5,6;
    inline-size: fit-content;
    inset-block-start: 100px;
    font-family: 'Courier New', Courier, monospace;
    margin: 10px;
    padding: 10px;
    background-color: rgba(201, 249, 255, 0.834);
    overflow: hidden;
    font-size: 25px;
    text-align: center;
    align-content: center;
    border: rgb(68, 106, 159) solid 5px;
    border-radius: 25px;    
}
.nodes:hover{
    text-align: center;
 border-top-left-radius: 25px; 
 border-bottom-right-radius: 25px;
    color: #000000;
}   
        
.disclaimer{
    font-family: 'Courier New', Courier, monospace;
    color: rgb(255, 0, 0);
    font-size: 45px;
    text-align: center;
    font-weight: 900;
    font-display: swap;
}
.disclaimer li{
    border: solid 5px rgb(0, 0, 0);
    border-radius: 25px;
    background-color: rgba(255, 255, 255, 0.5);
}
.disclaimer li:hover{
    border: none

}

.dropdown-content{
    display: flow-root;
}


.footercontainer{
    grid-row-start: span 4,5;
    display: flex;
    flex-direction: row;
    position: absolute;
    position: left;
    font-family: 'Courier New', Courier, monospace;
    list-style-type: none;
    block-size: auto;
    align-content: center;
    writing-mode: horizontal-tb;
    list-style-type: none;
    margin: 0;
    padding: 10px;
    overflow: hidden;
    background-color: #ffffff00;
    font-size: 15px;
}
.dropdown{ 
    column-span: 7,8;
    margin: 1px;
    padding: 5px;
}
.qr{
    display: block ;
    align-content: center;
    margin: 1px;
    padding: 10px;

}

