body { padding-top: 56px; }
.left-aligned { margin-left: auto; }
.bg-dark { background-color: #343a40 !important; }
.bg-hero { background-color: #45b06cff; }

/* CALLOUT */
.bd-callout { padding:1.25rem; margin-top:1.25rem; margin-bottom:1.25rem; border:1px solid #e9ecef; border-left-width:.25rem; border-radius:.25rem }
.bd-callout h4 { margin-bottom:.25rem }
.bd-callout p:last-child { margin-bottom:0 }
.bd-callout code { border-radius:.25rem }
.bd-callout+.bd-callout { margin-top:-.25rem }
.bd-callout-info { border-left-color:#5bc0de }
.bd-callout-warning { border-left-color:#f0ad4e } */
.bd-callout-danger { border-left-color:#d9534f }

/* footer */
footer a { color: white; font-weight: bold; text-decoration: none; } 
footer a:hover { color: white; text-decoration: underline; }




body { padding-top: 56px; }
.left-aligned { margin-left: auto; }
.bg-dark { background-color: rgb(52, 58, 64) !important; }
.bg-hero { background-color: rgb(69, 176, 108); }
.bd-callout { padding: 1.25rem; margin-top: 1.25rem; margin-bottom: 1.25rem; border-width: 1px 1px 1px 0.25rem; border-style: solid; border-color: rgb(233, 236, 239); border-image: initial; border-radius: 0.25rem; }
.bd-callout h4 { margin-bottom: 0.25rem; }
.bd-callout p:last-child { margin-bottom: 0px; }
.bd-callout code { border-radius: 0.25rem; }
.bd-callout + .bd-callout { margin-top: -0.25rem; }
.bd-callout-info { border-left-color: rgb(91, 192, 222); }
.bd-callout-warning { border-left-color: rgb(240, 173, 78); }
.bd-callout-danger { border-left-color: rgb(217, 83, 79); }
.footer-bg { position: relative; width: 100vw; height: 13.1vw; background-size: cover; background-image: url(""); }
.footer-hard { width: 100vw; height: 6.5vw; position: absolute; top: 0px; left: 0px; }
.footer-hard img { width: 100%; }
.f-b { display: block; width: 2.5vw; height: 2.5vw; position: absolute; left: 47vw; top: 7.3vw; }
.f-t { display: block; width: 2.5vw; height: 2.5vw; position: absolute; left: 50.5vw; top: 7.3vw; }
.f-w { display: block; width: 2.5vw; height: 2.5vw; position: absolute; left: 54vw; top: 7.3vw; }
.f-img img { width: 100%; opacity: 0.6; }
.f-img img:hover { animation: 1s ease 0s 1 normal none running fadenum; }
@keyframes fadenum { 
  100% { transform: rotateY(360deg); }
}
.f-content { height: 4vw; width: 20vw; position: absolute; left: 61.7vw; top: 7.3vw; text-align: left; font-family: fontTitle; font-size: 1.35vw; color: grey; }
.f-content-left { height: 5vw; width: 14vw; position: absolute; right: 2vw; top: 3vw; text-align: left; font-family: fontContent; font-size: 1.5vw; color: grey; }
