body{
    font-family: sans-serif;
    height: 100%;
    /*background-color: #96897B;*/
    color:#f8f8ff;

    background-color: #c1b3a3;
    background-image: url("data:image/svg+xml,%3Csvg width='84' height='48' viewBox='0 0 84 48' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0h12v6H0V0zm28 8h12v6H28V8zm14-8h12v6H42V0zm14 0h12v6H56V0zm0 8h12v6H56V8zM42 8h12v6H42V8zm0 16h12v6H42v-6zm14-8h12v6H56v-6zm14 0h12v6H70v-6zm0-16h12v6H70V0zM28 32h12v6H28v-6zM14 16h12v6H14v-6zM0 24h12v6H0v-6zm0 8h12v6H0v-6zm14 0h12v6H14v-6zm14 8h12v6H28v-6zm-14 0h12v6H14v-6zm28 0h12v6H42v-6zm14-8h12v6H56v-6zm0-8h12v6H56v-6zm14 8h12v6H70v-6zm0 8h12v6H70v-6zM14 24h12v6H14v-6zm14-8h12v6H28v-6zM14 8h12v6H14V8zM0 8h12v6H0V8z' fill='%2396897b' fill-opacity='0.4' fill-rule='evenodd'/%3E%3C/svg%3E");
}

html{
    height: 100%;
    color: #DCDCDC;
}

a{
    color:#DCDCDC;
}

.Site {
  display: flex;
  min-height: 100vh;
  flex-direction: column;
  height:100%;
}

.Site-content {
  flex: 1 0 auto;
  /*min-height: auto;*/
}


h1{
    text-align:center;
    color:#DCDCDC;
    visibility:hidden;
}

h3{
    color:#DCDCDC;
}

h4{
    font-size: 15px;
    /*text-align:center;*/
    color:#DCDCDC !important;
}

.inlineLink{
    color: #DCDCDC;
    font-size:1.05rem;
}

.card-extra{
    font-size: 15px;
    text-align:center;
    color:#DCDCDC !important;
}


.btn,
.btn-primary:visited{
    border-color:#DCDCDC;
    color:#DCDCDC;
}



.border-light{
    border-color:#DCDCDC !important;
}

.bar-tri-container{
    margin-top:0px;
}

.bar{
    height:10px;
    width:70%;
    margin: auto;
    background-color:#567382;
    border-top: 4px solid #567382;
    margin-bottom:2px;
    margin-top:1px;
    transition: transform .4s;
}

@media (max-width: 30em){
    .bar{
        width:100%;
    }
}

.tri-container{
    position:relative;
}

.triangle{
    position:relative;
    width: 0;
    height: 0;
    border-left: 127.5px solid transparent;
    border-right: 127.5px solid transparent;
    border-bottom: 220.8px solid #628395;
    margin-left: auto;
    margin-right: auto;
}

.triangle-text{
    color:#549F93;
    position: absolute;
    font-size:20px;
    top: 97.5px;
    left: -135px;
    right: -135px;
    width: auto;
    height: auto;
    text-align:center;
    /*background-color:#000;*/
}


#balance-btn-div{
    position:relative;
    margin: auto;
}

#balance-button{
    text-align:center;
}

#nav{
    background-color: #628395 !important;
}

.navbar-brand{
    color:#DCDCDC !important;
}

.nav-link{
    color:#ffffff;
}

.row{
    position:relative;
    text-align:center;
}

.card{
    position:relative;
    background-color: #628395;
    color: #DCDCDC;
    border-width: 5px;
    transition: transform .40s;
}

.top-row-buffer{
    margin-top:5%;
}

.logo{
    width: 100%;
    height: auto;
}

.jobDescription{
    text-align: left;
    background-color:rgba(0, 0, 0, 0.15);
    padding-top:1rem;
}

.workLogosAndText{
    position:relative;
}

.workPageLIHeader{
    font-weight: bold;
    font-size:1.15rem;
}

.flex-container {
  align-items: center;
  justify-content: center;
  display: flex;
  flex-wrap: nowrap;
}

.flex-container > div {
  flex-grow: 1;
  margin: 1rem;
  max-width:180px;
  justify-content: center;
  text-align: center;
  font-size: 1.5rem;
}
.flex-container > div > button{
    width:100%;
    height:100%;
    /*background-color: rgba(0, 0, 0, 0.15);*/
    color:rgba(255,255,255,.85);
    /*box-shadow:inset 0 -0.6em 0 -0.35em rgba(0,0,0,0.25);*/
}

.workLists > li{
    /*margin:.1rem;*/
    padding:.50rem;
}


.experienceButton{
    background-color:rgba(0, 0, 0, 0.20);
}

.activeButton{
    background-color:rgba(0, 0, 0, 0.35)!important
}

.activeLI{
    background-color:rgba(0, 0, 0, 0.35);
}


@media (max-width: 30em){
    .flex-container > div{
        width:30%;
        margin:.5rem;
        font-size:1.15rem;
    }
}


#footer {
    background-color: #628395;
    /*position: absolute;*/
    padding-top: 7px;
    padding-bottom: 5px;
    text-align: center;
    bottom: 0;
    width: 100%;
    height: auto;
    margin-top:1rem;
}