* {
    box-sizing: border-box;
  }
.top{
    grid-area: header;
    justify-self: center;
    place-self: start;
    font-size: xx-large;
 }
.left_column{
    grid-area: sidebar;
    justify-self: start;
    place-self: center;
    gap: 10px;
    min-width: 20%;
 }
.main_content{
    grid-area: main;
    justify-self: center;
    place-self: center;
    min-width: 0;
 }
.footer{
    grid-area: footer;
    justify-self: center;
    place-self: center;
 }  
.container {
    display: grid;
    grid-template-columns: min(1fr, 10%) minmax(auto, 30%) minmax(auto, 30%) minmax(auto, 30%);
    grid-template-rows: auto;
    grid-template-areas: 
      "header header header header"
      "sidebar main main main"
      "footer footer footer footer";
    align-content: start;    
    justify-content: center;   
    gap: 15px 20px;
    justify-items: center;
    align-items: stretch;
 }
body{
    user-select: none;
    -webkit-user-drag: none;
    background-color: rgb(63, 63, 63);
    color: snow;
    width: max(85%);
    margin-top: 2%;
    margin-left: 10%;
    margin-right: 10%;
}
.photo-frame{
    background-color: black;
    height: 1in;
    width: 0.9in;
    box-shadow: 8px 8px 5px #000000;
    white-space:nowrap;
    text-shadow: 8px 8px 5px #000000;
    font-size: clamp(1.3rem, 3vw, 3rem);
}
.thumb-pic{
    margin-left: 8%;
    margin-top: 8%;
    height: 0.84in;
    width: 0.75in;
}
.left_column{
    align-self: first baseline;
    margin-left: 8%;
    margin-top: 8%;
}
.hidden_list{
    display: none;
}
.main_content{
    align-self: auto;
    text-shadow: 8px 8px 5px #000000;
}
.work_exp{
    border-bottom: solid, 1in, #fff;
}
.no_padding{
    padding-left: 0;
}
p{
    color: rgb(41, 168, 168);
    text-shadow: none;
    font-size: clamp(0.9rem, 2vw, 1rem)
}
.hidden_text{
    display: none;
    color: rgb(41, 168, 168);
}
hr{
    width: clamp(100%, 100%, 1000px);
}
.dense{
    width: clamp(100%, 100%, 1000px);
    height: 8px;
    background-color: rgb(39, 39, 39);
}
.transparent_divider{
    width: 100%;
    height: 8px;
    background-color: rgb(63, 63, 63);
}
h1{
    font-size: clamp(1rem, 2vw, 2rem);
}
h2{
    font-size: clamp(1rem, 2vw, 2rem);
}
h4{
    font-size: clamp(0.85rem, 1.5vw, 3rem);
}
h5{
    margin-top:20px;
    margin-bottom:10px;
    font-size: clamp(1rem, 2vw, 2rem);
}
h6{
    justify-self: center;
    align-self: center;
}
a:link{
    color: rgb(255, 255, 255);
    background-color: transparent;
    text-decoration: none;
  }
  
a:visited{
    color: pink;
    background-color: transparent;
    text-decoration: none;
  }
  
a:hover{
    color: rgb(41, 168, 168);
    background-color: transparent;
    text-decoration: underline;
  }
  
a:active{
    color: rgb(41, 168, 168);
    background-color: transparent;
    text-decoration: underline;
  }
li{
    font-size: clamp(0.8rem, 2vw, 1rem);
}
li:not(:last-child) {
    margin-bottom: 5px;
}
.no_bullet{
    list-style-type: none;
}
.animatedText{
    opacity: 0.3;
}