body, a, p, h1, h2, h3, h4, h5, h6, div {
	font-family: helvetica, arial, verdana;
}

.learn-page-container {
	display: flex;
  		padding: 70px 32px 160px 32px;
  		justify-content: space-around;
}

.learn-page-container .learn-sidebar ul {
	list-style: none;
}

.learn-page-container .learn-sidebar ul ul {
	margin-top: 8px;
}

.learn-sidebar {
	min-width: 200px;
}

.learn-sidebar > ul > li {
	padding: 8px 0px;
	position: relative;
}

.learn-sidebar > ul > li ul li {
	padding: 3px 0px;
}

.learn-sidebar > ul {
	padding: 0px;
}

.learn-sidebar > ul > li:after {
	content: " ";
	background: grey;
	height: 3px;
	width: 100%;
}

.learn-sidebar > ul > li {
    border-bottom: solid 2px #e2e2e2;
}
		
.learn-page-container .learn-sidebar a, .learn-page-container .learn-sidebar a:hover {
	text-decoration: none;
	color: black;
}

.sidebar-title {
	color: #5f5f5f;
	text-transform: uppercase;
	display: inline-block;
	position: relative;
}

.learn-content {
	width: 75%;
  		min-width: 800px;
  		padding-top: 10px;
}

.learn-content h4 {
	font-size: 17px;
    line-height: 21px;
    margin-bottom: 30px;
    display: block;
    font-weight: bold;
}

.learn-content h1, .learn-content h3, .learn-content h2{
	color: black;
}

.learn-content h2 {
	background: none;
	font-weight: bold;
}

.dark-mode header {
	background: #212121;
	color: white;
}

.dark-mode header h1 {
	color: white;
	font-size: 50px;
}

.top-link {
	font-weight: bold;
	font-size: 14px;
}

.clpse{
	position: absolute;
    right: 5px;
    padding: 10px;
          top: 5.5px;
}

.clpse.closed:before {
    content: '';
    position: absolute;
    top: 11px;
    right: 9px;
    transform: translate(-50%, -50%);
    background: #212121;
    height: 13px;
    width: 1.5px;
}

.clpse.closed:after {
    content: '';
    position: absolute;
    transform: translate(-50%, -50%);
    height: 1.5px;
    width: 13.5px;
    background: #212121;
    top: 11px;
    right: -3px;
}

.clpse.opened:after {
	content: '';
	background: #212121;
	cursor: pointer;
	height: 1.5px;
	width: 13px;
	top: 10px;
	position: absolute;
	right: 4px;
}

.learn-sidebar hr {
	margin: 10px 0px 2px 0px;
}

.learn-page h1 {
	background: none;
	color: black;
}

.learn-content h1, .learn-content h2 {
	padding: 0px;
	font-weight: bold;
}

.learn-page-container {
	min-height: 500px;
}

.learn-page p, .learn-page li, .learn-page h3, .learn-page th, .learn-page td {
	color: black;
	font-size: 14px;
  		line-height: 18px;
}

.learn-page h1 {
   	font-size: 19px;
  	    margin-bottom: 19px;
}

.learn-page h2 {
	font-size: 15px;
  		margin-bottom: 20px;
}

.learn-page .staticpage {
	margin-left: 0px !important;
	padding: initial !important;
}

.learn-page p {
	font-weight: 400;
}

.sub-link {
	font-size: 12px;
}

.learn-page-container .learn-sidebar a.active-link {
	text-decoration: underline;
}

.learn-sidebar .show-more {
	display: none;
}

.dot {
     height: 4px;
 		  width: 4px;
  background-color: black;
  border-radius: 50%;
  display: inline-block;
}

.show-more.open .dot {
	background-color: #a22d01;
}

.learn-content input, .learn-content textarea {
	max-width: 100%;
	width: 400px;
}

.learn-content img {
	max-width: 100%;
	height: auto;	
}

.learn-content * {
	word-break: break-word !important;
}

@media(min-width: 992px){
	.learn-content{
	    padding-left: 5%;		
	}
}
		
@media(min-width: 768px){
	.sidebar-body { /* Ensure this is never hidden on desktop even if toggled at narrow width */
		display: block !important;
	}
}

@media(max-width: 1200px){
	.learn-content {
		min-width: initial;
	}
}

@media(max-width: 991px){
	.learn-content {
		width: 100%;
	}
	
	.learn-page-container {
		display: block;
		padding: 35px 15px;
	}
	
	.learn-content input, .learn-content textarea {
		width: 100%;
	}
}

@media(max-width: 768px){
	.learn-sidebar .show-more {
		text-align: center;
		display: block;
 				position: absolute;
	    right: 100%;
	    top: 50%;
	    width: 50px;
	    left: 109%;
        transform: translatey(-50%);
        line-height: 2px;
        cursor: pointer;
	}
}

.learn-page header ul {
	padding: 0px;
}

.learn-page .breadcrumbs a {
	color: white !important;
}

.learn-page .breadcrumbs li:after {
	color: white !important;
}

.back-to-top {
	background-color: black;
	z-index: 9999;
	position: fixed;
	right: 25px;
	bottom: 100px;
	padding: 17px 24px;
	border-radius: 50%;
	cursor: pointer;
}

@media(min-width: 768px){
	.back-to-top {
		display: none !important;
	}
}

