:root {
	--sidebar-width: 20rem;
	--theme-color: #f44336
}

.markdown-section iframe[src*="buttons.github.io"] {
margin: 0;
}
.embed-responsive {
height: 585px;

}
@media (max-width: 992px) {
.embed-responsive {
height: 275px;

}
}

figure.thumbnails img {
margin: 0.75em 0;
border-radius: 3px;
box-shadow: 0 2px 6px rgba(0,0,0,0.1), 0 4px 12px rgba(0,0,0,0.15);
}

@media (min-width: 30em) {
figure.thumbnails:after {
content: "";
display: table;
clear: both;
}

figure.thumbnails img {
float: left;
width: calc(50% - 0.75em);
}

figure.thumbnails img:nth-child(even) {
margin-left: 1.5em;
}

@supports (display: flex) {
figure.thumbnails {
display: flex;
align-items: center;
}

figure.thumbnails img {
flex-grow: 1;
width: 0;
}

figure.thumbnails img + img {
margin: 0 0 0 1.5em;
}
}
}


.cover h1 span {
font-weight:700;
color: #1e1e1e
}

.cover:before {
content: none !important
}

.embed-responsive {
position:relative;
display:block;
width:100%;
padding:0;
overflow:hidden
}

.embed-responsive:before {
display:block;
content:""
}

.embed-responsive .embed-responsive-item,.embed-responsive embed,.embed-responsive iframe,.embed-responsive object,.embed-responsive video {
position:absolute;
top:0;
bottom:0;
left:0;
width:100%;
height:100%;
border:0
}

.embed-responsive-21by9:before {
padding-top:42.85714%
}

.embed-responsive-16by9:before {
padding-top:56.25%
}

.embed-responsive-4by3:before {
padding-top:75%
}

.embed-responsive-1by1:before {
padding-top:100%
}


.sidebar-nav a, .sidebar nav a {
white-space: break-spaces;
}

.markdown-section a:not(:hover) {
text-decoration:none
}
.markdown-section {
margin: 0 auto;
width: 90%;
max-width: 2000px;
padding: 3em;
position: relative;
}

@media (max-width: 992px) {
.markdown-section {
width: 100%
}
}

.app-sub-sidebar a {
font-size: 14px;
}
.app-sub-sidebar a:before {
content: '-' !important;
display: inline-block;
margin-right: 5px
}

.markdown-section h2, .markdown-section h3 {
margin-top: 3.5rem
}
.markdown-section p a:not(:hover), .markdown-section li a:not(:hover) {
color: var(--theme-color)
}
.divider {								/* minor cosmetics */
display: table; 
font-size: 20px; 
text-align: center; 
width: 100%; 						/* divider width */
margin: 60px 0 0px;					/* spacing above/below */
}
.divider span { display: table-cell; position: relative; }
.divider span:first-child, .divider span:last-child {
width: 50%;
top: 13px;							/* adjust vertical align */
-moz-background-size: 100% 2px; 	/* line width */
background-size: 100% 2px; 			/* line width */
background-position: 0 0, 0 100%;
background-repeat: no-repeat;
}
.divider span:first-child {				/* color changes in here */
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(transparent), to(#000));
background-image: -webkit-linear-gradient(180deg, transparent, #000);
background-image: -moz-linear-gradient(180deg, transparent, #000);
background-image: -o-linear-gradient(180deg, transparent, #000);
background-image: linear-gradient(90deg, transparent, #000);
 position: relative;
}
.divider span:nth-child(2) {
color: #000;
padding: 0px 25px;
width: auto;
position: relative;
white-space: nowrap;
top: -5px;
}
.divider span:last-child {				/* color changes in here */
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#000), to(transparent));
background-image: -webkit-linear-gradient(180deg, #000, transparent);
background-image: -moz-linear-gradient(180deg, #000, transparent);
background-image: -o-linear-gradient(180deg, #000, transparent);
background-image: linear-gradient(90deg, #000, transparent);
}

.markdown-section img {
height: auto
}