/* Index Page ------------------------------------------------------------------ */

.HomeIntro { display: inline; float: left; width: 100%; font-size: 80px; text-align: center; line-height: 120px; margin-top: 100px; margin-bottom: 50px;}
.HomeDesc { display: inline; float: left; width: 100%; position: relative; height: 250px;}
.HomeDescTxt { width: 500px; position: absolute; left: 50%; margin-left: -250px;}
.HomeImages, .HomeTag { display: inline; float: left; width: 100%; text-align: center; margin-bottom: 50px; margin-top: 50px;}
.StandardBtn { color: #fafafa; background-color:#666; padding: 20px; font-size: 18px; 	border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px;}
.ApiLogoImg { width: 100%;  max-width: 600px;}
.HomeH1 { text-align: center;}

/* Nav Bar -------------------------------------------------------------------- */
.NavCol { position: sticky; top:10px; display: inline; float: left;
width:230px; height:calc(100vh - 100px); padding-bottom: 20px; overflow-y: auto;}
.NavCol > .Title { display: inline; float: left; padding-left: 15px;}
.NavCol > .Title.Sub { margin-top: 10px;}
.NavBn { display: inline; float: left; width:calc(100% - 35px); padding-left: 35px; color: #414141; line-height: 40px; font-size: 18px;}
.NavIcon { display: inline-flex; vertical-align: middle; font-size: 20px;}

/* Universal Styles ----------------------------------------------------------- */
.ContentFrame { display: inline; float: left; margin-left: 100px; width: calc(100% - 400px);}



H1, H2 { font-size: 30px; color: #666; margin-bottom: 30px;}
H2 { margin-top: 50px; line-height: 40px;}

/* Code Box Styles -------------------------------------------------------------*/

.CodeBox, .hljs { display: inline; float: left; width:calc(100% - 20px); background-color: #eff0f1; padding:10px; margin-top: 20px; margin-bottom: 30px; 	border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px; color:#00a79d;
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;  font-size: 16px; max-height: 500px; overflow-y: auto;}
.DescBox { display: inline; float: left; width: 100%; border-top: 1px dashed #ccc; border-bottom: 1px dashed #ccc; margin-bottom: 30px; padding-top: 10px; padding-bottom: 10px;}
.hljs-string { color: #666;}
.CodeBox { word-break: break-all;}


/* Universal Tags --------------------------------------------------------------- */
.TagGET, .TagDelete, .TagPatch, .TagPost { background-color: #339900; padding:2px 5px 2px 5px; 	border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; color: #fff; font-size: 13px;}
.TagDelete { background-color: #e06b6a;}
.TagPatch { background-color: #f0b833;}
.TagPost {background-color: #00a79d;}

/* Media Queries -------------------------------------------------------------- */

/* Mobile */
@media only screen and (max-width: 722px) {
  .NavCol { display: none;}
  .ContentFrame { margin-left: 5%; width: 90%;}
  /* Home Splash Screen */
  .HomeDescTxt { width: 90%; margin-left: 5%; left: 0; display:inline; float: left; position: relative;}
  .HomeDesc { height: auto;}

}