html, body { scroll-behavior: smooth; }
body { margin: 0; }
.headerBar { display: none; }

#navLeft, h1, h2 { font-family: 'Raleway', sans-serif; }

/*--- Messages ---*/
#rmsg { top: 0; right: 0; margin: 0; width: 100vw; max-width: calc(100vw - var(--navLeftWidth)); border-radius: 0; box-shadow: none; }
.loginBox #rmsg { width: 100%; position: absolute; }
#rmsg:after { display: none; }

/*--- Buttons ---*/
.formBtn { background-color: #346569; color: #fff; border: 2px solid #346569; }
.formBtn:hover, input[type="button"]:hover { background-color: #6E9367; border-color: #6E9367; }
.formBtn.secondaryBtn { background-color: transparent; color: #000; border: 2px solid #E7EAD7; }
.formBtn.secondaryBtn:hover { background-color: #E7EAD7; color: #000; }

#bttBtn { display: none; position: fixed; bottom: 15px; right: 20px; width: auto; border-radius: 50%; padding: 8px 14px; color: #ffffff; background-color: #3a6569; font-size: 1.3em; z-index: 10; cursor: pointer; opacity: 30%; transition: opacity 500ms ease }
#bttBtn.show { display: block; }
#bttBtn:hover, .bttBtn:focus { opacity: 1; background-color: #6E9367; }
#bttBtn .tooltiptext { visibility: hidden; width: 150px; font-size: 1rem; background-color: #3a6569; color: #ffffff; text-align: center; padding: 5px 0; border-radius: 6px; position: absolute; z-index: 9; right: 140%; bottom: 10px; }
#bttBtn:hover .tooltiptext { visibility: visible; }
#bttBtn .tooltiptext::after { content: " "; position: absolute; top: 50%; left: 100%; margin-top: -5px; border-width: 5px; border-style: solid; border-color: transparent transparent transparent #3a6569; }

/*--- Sidebar navigation ---*/
#navLeft { background-color: #3a6569; }
#navLeft > div:first-of-type, #navLogo { background-color: #fff; }
#navLogo { padding: 0 10px; height: 140px; }
#navLogo img {width: 100%;}
#navLeft > .btn { background-color: #346569; color: #fff; height: auto;}
#navLeft > .btn > div { height: auto; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; font-size: 1.2em; padding: 5px; }
#navLeft > .btn > div.expand { display: none; }
.navLeft .btn .primary:hover, .navLeft .btn .primary.active { background-color: #6E9367; }
.navLeft .childBtn { display: none; }
.navLeftFooter { display: flex; flex-direction: row-reverse; justify-content: space-evenly; padding: 0; position: absolute; bottom: 0; width: 100%; height: 60px; align-items: center; background-color: #E7EAD7; }
.navLeftFooter > .btn { height: 60px; line-height: 60px; }
.navLeftFooter > .btn:hover { cursor: pointer; background-color: #6E9367; color: #fff; }

#navLeft, .main { margin-top: 0; height: 100vh; box-sizing: border-box; }
.navRight {margin-top: 0; height: 100vh; background-color: #E7EAD7; padding: 5px 15px 15px;}
.navRight > *:not(h1) { font-family: 'Open Sans', sans-serif; }

/*--- Help Guide ---*/
.navRight { line-height: 1.5em; }
.navRight ol { padding-left: 20px; }
.navRight ol li { padding-bottom: 10px; }

.main .directions { text-align: left; }
.main .directions .initial-steps, .main .directions .later-steps { display: none; }
.main .directions .initial-steps.active, .main .directions .later-steps.active { display: block; }

/*--- Main ---*/
.main {padding: 0; background: none;}
.main.filled > div, .main.filled > form { max-width: 100%; }
.main, .main.filled > div, .main.filled > form, section, html { background-color: #FEFEFE;}
section.block.long.narrow > div {height: unset;}

/*--- Page Header ---*/
.main.filled section.pageHeader{padding-top: 100px;}
.main.filled section.pageHeaderV2{padding-top: 100px;}
.main.filled section.pageHeader .headerCTAs { display: flex; flex-wrap: nowrap; flex-direction: row; justify-content: space-between; margin: 0 auto; padding: 0 20px; }
.main .pageHeader .headerCTAs > div { display: flex; align-items: center; }
.main .pageHeader .headerCTAs > div > * { padding: 0 10px; font-size: 1.5em; }


/*--- Login ---*/
.loginBox section{background-color: #FFFFFF;}
.loginBox section img{width: 100%; padding: 15px 0;}

.loading{width: 100%;height: 100%;margin-top: 0;margin-left: 0; top: 0;}

/*--- Tables ---*/
.horizontalScrollable.hsHeader { top: 0; }
.smTable { max-width: 800px; width: 100%; }
.mdTable { max-width: 1200px; width: 100%; }