
:root {
    --color-dark-bg: #04040c;
    --color-primary-text: #ffffff;
    --color-primary-text-muted: #666666;
    --color-accent-text: #6594ad;
    --font-family: "Manrope", sans-serif;
    --font-optical-sizing: auto;
    --font-weight: 400;
    --font-style: normal;
}

body {
    background-color: var( --color-dark-bg );
    color: var( --color-primary-text );
}

body, .text-body {
    font-family: var( --font-family );
    font-optical-sizing: var( --font-optical-sizing );
    font-weight: var( --font-weight );
    font-style: var( --font-style );
}

body > .container {
    max-width: 800px;
}

img#pic {
    background-image:url("img/me-500x500.jpg");
    background-size:cover;
}

a {
    text-decoration:none;
}
a:hover {
    color:#ccc;
}
.link {
    border-left: 5px solid #f59b14;
    color:#FFF;
    padding-left:.8rem;
    font-size:1rem;
}
.list-group {
    background-color:transparent;
    border:0;
    color:inherit;
}
.list-group-item {
    font-size:.9rem!important;
    padding:0;
    background-color:transparent;
    border-left:0;
    border-right:0;
    border-color:#333;
    color:inherit;
}
.list-group-item>a {
    display:block;
    padding:10 0;
    color:inherit;
}
.list-group-item>a:hover {
    color:#ccc;
}
.list-group-item>a.active {
    color:#FFF;
    border-left:5px solid #f59b14;
    padding-left:1rem;
}

.tag {
    border-style: dashed;
    border-width: 1px;
    border-color: #999;
    color:#999;
    font-size:.9rem;
    padding:3 10;
    line-height:2rem;
    white-space:nowrap;
}

.accordion {
    padding:0;
}

.accordion-item {
    background-color:transparent!important;
    color: var( --color-primary-text-muted );
    border-color:#333;
}
.accordion-header {
    border:none!important;
}
.accordion-button {
    background-color:transparent!important;
    padding:10 0;
    border:none!important;
    font-size:1.1rem;
}
.accordion-button:focus, .form-control:focus {
    outline:none;
    box-shadow: none;
}
.accordion-body {
    padding:0 0 10 0;
}

.btn-primary {
    background-color:#6594ad;
    border:none;
}
.btn-primary:hover {
    background-color:#999;
}

input, textarea {
    background-color:#333!important;
    border:none!important;
    color:#FFF!important;
}
.form-control::placeholder, textarea::placeholder {
    color:#999!important;
}
.input-group-text {
    background-color:#222;
    border:none;
    color:#999!important;
}

h1, h2, h3, h4, h5, h6 .manrope-semi-bold {
    font-weight: 600;
}

.font-bold {
    font-weight: 800;
}

.font-light {
    font-weight: 300;
}
.invalid-feedback {
    color:#f8d7da;
    font-weight:600;
}

.text-accent {
    color: var( --color-accent-text );
}
.text-primary-muted {
    color: var( --color-primary-text-muted );
}

/* LAYOUT HELPERS */
.bg-red { background-color:red!important; }
.bg-green { background-color:green!important; }
.bg-blue { background-color:blue!important; }
.bg-yellow { background-color:yellow!important; color:#333!important; }
