/*Welcome to my CSS File! Hire me for your next project. dt.digitals.dev@gmail.com, thanks! Dan*/

@font-face {
    font-family: 'Edu';
    src: url('../fonts/EduVICWANTBeginner-VariableFont_wght.ttf') format('truetype');
    font-weight: 100 900;
}

@font-face {
    font-family: 'Inconsolata';
    src: url('../fonts/Inconsolata-VariableFont_wdth,wght.ttf') format('truetype');
    font-weight: 100 900;
}

@font-face {
    font-family: 'Nunito';
    src: url('../fonts/Nunito-VariableFont_wght.ttf') format('truetype');
    font-weight: 100 900;
}

@font-face {
    font-family: 'Lora';
    src: url('../fonts/Lora-VariableFont_wght.ttf') format('truetype');
    font-weight: 100 900;
}

img {
    height: auto;     
    max-width: 100%;
  }

.DanIMG {
    max-width: 600px;
}


.Site-Container {

        max-width: 1000px;
        margin: auto;
}

.Title {
    font-family: Edu;
}


.Site-Nav-Grid {
    width: 92%;
    display: grid;
    grid-template-columns: auto auto;
    padding-bottom: 50px;
}

@media (max-width: 700px) {
    .Site-Nav-Grid {
      grid-template-columns: 1fr; 
      text-align: center;
      width: 100%;
      padding-bottom: 0px;
    }
    .Site-Nav-Grid .ExampleNav {
        padding-top: 0px;
        text-align: center;
    }
    
  }

.ExampleNav {
    padding-top: 5px;
    text-align: right;
    font-family: Inconsolata;

}

.Main {

    margin-left: auto;
    margin-right: auto;
    width: 85%;
    max-width: 1465px;
    text-align: center;
    font-family: Nunito;
}


.WorkLink:hover {
    text-decoration: underline;
}

.ContactLink:hover {
    text-decoration: underline;
}

.ServicesLink:hover {
    text-decoration: underline;
}

a {
    text-decoration: inherit; 
    color: inherit; 
}

.Footer {
    padding-top: 75px;
    display: flex;
    justify-content: center;
}

.wrapper {

    margin-left: auto;
    margin-right: auto;
    text-align: center;
    font-family: Nunito;
    width: 80%;
}

.block-container {
    display: block;
    margin-left: auto;
    margin-right: auto;
    opacity: 0;
    transition: opacity 1.3s ease-out; 
    padding-bottom: 25px;

}

.block-container.visible {
    opacity: 1;
}


.blockbox {
    margin-left: auto;
    margin-right: auto;
    max-width: 850px;
}

#ElitePBSExplainBlockBox {
    max-width: 1000px;
    padding-top: 10px;
    padding-bottom: 20px;
    
}

#ElitePBSHeading {
    font-size: 1.3em;
}

hr {
    height: auto;
    width: 80%;
}