a,
a:link,
a:visited { color: #336699; text-decoration: none; }
a:hover { color: #7093b7; text-decoration: none; }

a.btn-primary,
a.btn-primary:link,
a.btn-primary:visited { background-color: #336699; border: 1px solid #23476b; color: #ffffff; }
a.btn-primary:hover { background-color: #7093b7; border: 1px solid #336699; color: #23476b; }

.toast-header { background-color: #336699; }

h1 { border-bottom: 1px solid #999999; margin-top: 10px; padding-bottom: 5px; font-weight: bold; }
h3 { text-transform: uppercase; color: #336699; }

#address1, #phoneemail { display: block; text-align: right; }
#lastname { color: #336699; }
#summary, #experience { margin: 20px 0; }
#highlights th { vertical-align: top; }

.company { font-weight: bold; }
.company-rule { width: 3px; color: darkblue; }
.vr { width: 5px; color: #336699; }

.title { font-style: italic; }
.ref-src { text-transform: uppercase; color: #336699; }
.ref-desc { font-weight: bold; }

.bold { font-weight: bold; }
.indent { padding-left: 20px; }

.vertical-rule { height: 100%; margin-left: 1.5rem; }
.icon-status { position: absolute; margin-left: -5.4rem; }
.icon-current { color: darkblue; }
.icon-past { color: grey; }

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
    .vertical-rule { display: none; }
    .icon-status { display: none; }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    .vertical-rule { display: flex; height: 100%; margin-left: 1.5rem; }
    .icon-status { display: flex; position: absolute; margin-left: -2.3rem; }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
    .vertical-rule { display: flex; height: 100%; margin-left: 1.5rem; }
    .icon-status { display: flex; position: absolute; margin-left: -3.5rem; }
}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    .vertical-rule { display: flex; height: 100%; margin-left: 1.5rem; }
    .icon-status { display: flex; position: absolute; margin-left: -4.5rem; }
}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {
    .vertical-rule { display: flex; height: 100%; margin-left: 1.5rem; }
    .icon-status { display: flex; position: absolute; margin-left: -5.4rem; }
}

@media print {
    .noprint { display: none; }
}