/* ==========================================================================
  Doc Specific Changes
   ========================================================================== */
.menu-getstarted {display: inline-block !important; vertical-align: middle; text-align: center;}
.menu-getstarted:after {content:'Back to Tyk' !important;}

.submenu-toggle {top:60px !important;}
.submenu-toggle span {top:0px !important;}

/*.hasSidebar .container:before{ width: 397px; left: 49%; margin-left: -720px; }
/*.hasSidebar aside { padding-right: 124px; margin-right: -65px;}*/
/*.hasSidebar aside:before, .blog-sidebar:before { right: 73%; }

/* Edit on GitHub button */
.button.medium { color: white; margin: 10px; padding-top: 0; height: 25px; padding-bottom: 0; min-width: 0; line-height: 26px}

/* iframe display */
iframe { margin-top: 20px; margin-bottom: 20px; }

/* Table top margin */
.wysiwyg table { margin-top: 20px; }

/* Anchor tags */
:target:before {
content:"";
height:90px;
margin:-90px 0 0;
}

/* Link icon */
#main-content h2 > a > img,
#main-content h3 > a > img,
#main-content h4 > a > img,
#main-content h5 > a > img {vertical-align: middle; border:none !important; height: 17px; display: inline-block; margin-left: 5px; }

/* Footer */
.footer-logos {position: absolute; left: 0; right: 0; margin: auto; bottom: 60px; margin: auto; border-top: 1px solid #eee; padding: 30px;}
.footer-logos a {display: inline-block; padding: 0 13px; margin: auto;}
.footer-menu {margin-bottom: 150px; text-transform: none;}
.footer-copyright {position: absolute; right: 32px; line-height: 50px; bottom: 16px; text-align: right; }
.footer-copyright small {color: #505071; letter-spacing: 0.1em; font-size: 11px; text-transform: none;}
.footer-social {margin: auto; text-align: center; clear: both; display: inline-block;}
.footer-social a {width: 35px; height: 44px; line-height: 44px; font-size: 28px; color: #505071; text-align: center; display: inline-block;}
.footer-social a:hover {color: #FFF;}
.footer h3 > a > img {display: none;}

/* Hero image */
.hero-sidebyside img{ margin-right: 20px; width: auto; margin-top: 10px;}
.hero-sidebyside h1, .hero-sidebyside .hero-text {margin-top: 10px;}
#doc-icon {font-size: 32px; width:400px;}

@media only screen and (max-width : 1100px) {
  /* Fix Sidebar */
  .hasSidebar .container:before  { width: 420px; left: 50%; margin-left: -668px;}
}

@media only screen and (max-width: 1000px) {
  .menu-getstarted { top:15px !important; }
}

.st-treed {font-size: 16px; position: relative; right: 160px; background: #eee; width: 400px;}
.st-treed li {background-color:#eee;}

/* Suggest an Edit */
.suggest-edit {float: right; width: auto; padding: 0 30px; cursor: pointer; } 
.suggest-edit:before {padding-right: 10px;}


/* Inline Images */
.wysiwyg img {border: 0px solid #e2e2e2;}

/* Code Blocks */
.wysiwyg pre {padding: 20px;}
.wysiwyg code {overflow-wrap: break-word;}
.hljs { overflow-x: initial !important; }
.button.copy {background: #dfdfed; color: #000; height: 20px; width: 150px; border-radius: 18px; line-height: 1px; padding: 0 16px; text-transform: none; font-size: 11px; letter-spacing: 0.025em; }

/* Blockquote */ 
.wysiwyg blockquote:before {font-size: 20px; left: 20px; top: 30px;}
.wysiwyg blockquote { padding: 23px 0px 1px 60px; background: #e1e1e1; margin-bottom:20px;}
.wysiwyg blockquote p {margin-top: 7px; margin-bottom: 27px;}


/* Lists */
.wysiwyg ul {padding-left: 26px;}
.wysiwyg li {list-style-position: initial; margin-top: 10px;}
.wysiwyg ol {padding-left: 26px; margin-bottom: 32px;}


/* Documentation : Navigation */
.docs-navigation {border-top: 1px solid #e2e2e2; padding: 30px 0;}
.docs-navigation #previousArticle {float: left; max-width:50%; text-align: center;}
.docs-navigation #nextArticle {float: right; max-width:50%; text-align: center;}
.docs-navigation .button {margin-bottom: 0;}
.icon-right:before {float: right; margin-left: 5px;}

/* Return to Top buttons */

#return-to-top { position: fixed; bottom: 20px; right: 20px; background: #e1e1e1; width: 50px; height: 50px; -webkit-border-radius: 35px; -moz-border-radius: 35px; border-radius: 35px; display: none; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;}

#return-to-top:hover { background: #2f3f9e; color: white; }

#return-to-top:before { float: none; margin-left: 20px; margin-top: 1px; font-size: 31px; transform: rotate(271deg);}

.button.grey.medium.bottom { float: right; display: none;}

.return-top {border-top: 1px solid #E1E1E1; }

@media only screen and (max-width: 1340px) {
  #return-to-top{ visibility: hidden; }  
}


/* Documentation : Table of Contents */
.documentation-table-of-contents { font-size: 5px; padding: 10px 30px; overflow-y: scroll; position: fixed; right: 0; top: 250px; max-height: 400px; width: 9%; border-left: 1px solid #E1E1E1; border-bottom: 1px solid #E1E1E1; margin-right: 11px; }
.documentation-table-of-contents a { padding: 10px 0; font-size: 10px; color: #2f3f9e;}
.documentation-table-of-contents label { text-transform: uppercase; color: #676773; letter-spacing: 0.15em; display: block; }
.toc-content { height: 100%; }
.toc-label { position: fixed; top: 220px; }

/* Documentation : Share - Print*/
.docs-share-print { border-top: 1px solid #c8c8c8; padding: 10px 0; margin-top: 0; clear:both; /*overflow: auto;*/  margin-bottom: 30px;}
.docs-share-print a {display: inline-block; margin-right: 50px;}
.share-print a:before { padding-right: 12px; }

@media print {

body * { visibility: hidden; }
.hasSidebar .page-content * { visibility: visible; }
.button.medium {visibility: hidden;}
.docs-navigation {display: none;}
.docs-share-print {display: none;}
.documentation-table-of-contents {display: none;}
.hasSidebar .page-content { position: absolute; top:-300px; left: 30px; }
}


/* ==========================================================================
  Hero
   ========================================================================== */
.hero {background: #fff; color: #FFF; height: 90px; min-height: 0; overflow: visible; border-bottom: 1px solid #04A118 !important;}
.hero-sidebyside {padding-top: 30px;}
.hero-sidebyside h1, .hero-sidebyside .hero-text {float: left; width: 50%;}
.hero .search {margin-top: 10px; max-width: 100%;}
.media-body-body {margin-top: 5px; }
.media-body-title {border-top: 1px solid #E1E1E1;}
.media-body-title a {font-weight: bold;}
.media-body:hover { background: #e1e1e1; margin: 0; padding: 0; }

/* Structure */

.aside-submenu { padding-top: 32px; }
.page-content { padding-top: 0px; }
.page-content a{ color: #04A118; }
.hasSidebar .page-content { padding-left: 20px; }

/* Search Container */
.documentation-search-container { position: relative; line-height: normal; width:100%; margin-top: 10px; color: #000;  border-radius:5px;  box-shadow: 0px 5px 6px 0px rgba(0, 0, 0, 0.15); overflow: hidden; z-index: 2;}
.documentation-search-results {padding: 20px; margin:0; background: #FFF; display: none;}
.documentation-search-pagination  {padding: 20px; background: #FFF; display: none; border-top: 1px solid #E1E1E1;}
.documentation-search-pagination .pagination {padding: 0; text-align: left;}
.documentation-search-pagination .pagination a {width: 40px; height: 40px; line-height: 38px;}
.documentation-search input {max-width: 400px; -webkit-transition: all 0.3s ease-in; transition: all 0.3s ease-in;}
.documentation-search input:focus {max-width: 100%; background-color: #e1e1e1; color: #010017;}
.documentation-search input:focus + button {color: #010017;}
.icon-search {cursor: auto;}
#algolia-logo {float:right; background-color: #FFF; width:100%;}
#algolia-logo img {float:right;}
#algolia-logo span {float: right; width: 48px; margin-top: 10px; font-size: 13px; width: 65px; margin-top: 9px;}


/* Search Result */
.ais-hits--item {margin-bottom: 16px;}
.ais-hits--item:last-of-type {margin-bottom: 0;}
.ais-hits--item .media-heading em{font-weight: bold; color: #2f3f9e; font-style: normal;}
.ais-hits--item .media-heading.em { font-weight: normal; font-style: normal; }
.ais-hits--item .media-heading.em em {color: #2f3f9e;}

/* Search Result : Pagination */
.ais-pagination--item {padding: 0;}
.ais-pagination--item__disabled, .ais-pagination--item__first, .ais-pagination--item__last, .ais-pagination--item__next, .ais-pagination--item__previous {display: none;}
.ais-pagination--item__active a {color: #2f3f9e; border-color: #2f3f9e;}

/* ==========================================================================
  Tree View
   ========================================================================== */
.st-treed li {padding-left: 30px; list-style-type: none; line-height: 20px; margin-bottom: 20px; position: relative; }
.st-treed .st-collapsed {height: 20px; overflow: hidden;} 
.st-treed ul {margin-top: 20px; position: relative; pointer-events:none; color: #04A118; }
.st-treed a {display: block; position: relative; pointer-events:auto;}
.st-treed a:hover {color: #04A118; text-decoration: underline;}
.st-treed li:before { pointer-events:auto; content: ''; width: 20px; height: 20px; line-height: 20px; text-align: center; position: absolute; top:0; left:0; cursor: pointer;}


/* Tree : Vertical lines */
.st-treed ul:before {content: ''; background: #b7b7b7; width: 2px; top: -10px; left: -22px; bottom: -10px; display: block; position: absolute;}
.st-treed ul:first-child:before {display: none;}
.st-treed .st-open:last-child ul:last-child:before {display: none;}

/* Tree : Active */
.st-treed .active > a {color: #04A118;}
.st-treed .active > a:after {background: #04A118;}

/* Tree : Icons */
.st-treed .st-file:after {width: 8px; height: 8px; background: #000018; border-radius: 50%; position: absolute; top:6px; left:6px; content: '';}
.st-treed .st-collapses:before, .st-treed .st-open:before {background: #666; border-radius: 50%; content:'\2212'; color: #FFF; font-weight: bold; font-size: 18px;}
.st-treed .st-collapsed:before { content:'\002B'; background: transparent; border-radius: 50%; border: 2px solid #04A118; line-height: 16px; color: #04A118; padding-left: 1px;  }


@media only screen and (max-width: 1428px) {
  .documentation-table-of-contents {display: none !important;}
}
@media only screen and (max-width: 1000px) {
  
  .hasSidebar .page-content {padding-top: 0;}
  
  .hero-sidebyside h1, .hero-sidebyside .hero-text { float: none; width: 100%;}

  #doc-icon {margin-bottom: auto; line-height: 16px; margin-top: 6px;}
  
  .docs-share-print {position: static;}
  .docs-share-print a {margin-right: 0;}

  .wysiwyg h1, .wysiwyg h2 { font-size: 29px;}
  .wysiwyg img {padding: 0;}
  
  .documentation-search {width: 100%; max-width: 400px;}
  
  .docs-navigation a {text-align: center;}
  .docs-navigation #previousArticle, .docs-navigation #nextArticle {float: none; width: 100%; max-width: 100%;}
  
  .aside-submenu {padding-top: 40px;}
  .st-treed {right: 0px}

  .button.medium {min-width: 205px;}

  .wysiwyg {margin-right: 0;}

  .hasSidebar .page-content { padding-left: 0; }

  .burger {width: 60px; height: 60px; position: fixed; top:34px; right: 0; background: #04A118; z-index: 3; display: inline-block; }
  .burger:before, .burger:after {content: ''; width: 23px; margin: auto;  position: absolute; top:0; bottom: 0; left:0; right:0;}
  .burger:before { height: 16px; border-top:2px solid #FFF; border-bottom: 2px solid #FFF; }
  .burger:after { height: 2px;  background: #FFF; }

  .docs-navigation .button {margin-bottom: 5px; }

  .icon-right:before {float: none;}

  .button.copy { visibility: hidden; } 
}


@media only screen and (max-width: 425px) {
  .button.medium { min-width: 174px; margin-right: 4px; font-size: 10px;}

  .share-print span {display: none;}

  .docs-navigation .button {padding:0; letter-spacing: 0.1em;}
}

@media only screen and (max-width: 768px) {
  .documentation-table-of-contents a {width: 100%; text-align: center;}
}

