/** Document created by Isaac bucknell October, 2022.
    Last Edited: 03/11/2024  **/

                           

:root{
    --mainColor: #6f6f6f;
    --hoverColor: black;
    --bgGradient: linear-gradient( white, black);
}

header{
    padding-bottom: 50px;
    
    
}



                            /* HEADER TEXT */

.nav{
    background-image: --bgGradient;
    color: var(--mainColor);
    font-family: monospace;
    text-align: center;
    overflow: hidden;
}

.nav h1 a{
    font-size: 20px;
    margin-bottom: 25px;
}

.header-divide{
    position:absolute;
    left: 0px;
    width: 200px;
    padding: 12px;

    margin-left: 2%;
}

                            /* HEADER BUTTONS */

.nav-button{
  font-family: monospace;
  color: var(--mainColor);
  background-color: white;
  padding: 12px;
  font-size: 20px;
  border: none;
    
}

.nav-button:hover{
    text-decoration: underline;
    color: var(--hoverColor);
    background-color: #b0afaf;
    cursor: pointer;
}

.topbar-buttons{
    
    position:absolute;
    right: 2.5%
}

                                /* BODY */

body{
    font-family: monospace;
    height:100%;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-image: linear-gradient(45deg, white, gray);
    padding-bottom: 100px;
    margin:0;
}

.main-body{
    background-image: linear-gradient(45deg, black, gray);
    color: white;
    max-width: 95%;
    text-align: center;
    font-family: monospace;
    margin-top: 25px;
    margin-left: auto;
    margin-right: auto;
}

section{
    padding-top: 5px;
    padding-bottom: 5px;
}

h1{
    font-size: 35px;
}

h2{
    font-size: 30px;
}

p{
    font-size: 20px;
    max-width: 70%;
    text-align: center;
    margin: auto;
}

.p-break{
    border-color: transparent;
    background-color: transparent;
    height: 10px;
}

.skill-button{
    background-image: linear-gradient( white, gray);
    max-width: 90%;
    font-size: 18px;
    font-family: monospace;
    cursor: pointer;
}




                            /* Hyperlinks */
a{
    color: #9e0687;
}

a:hover{
    color: #f211d0
}


                            /* LINE BREAK */
hr{
    background-color: var(--mainColor);
    height: 1px;
    width: 99%;
    
}
/*
<style type="text/css"> 
        .br { 
            display: block; 
            margin-bottom: 0em; 
        } 
          
        .brmedium { 
            display: block; 
            margin-bottom: 1em; 
        } 
          
        .brlarge { 
            display: block; 
            margin-bottom: 2em; 
        }

*/