@import url(https://fonts.googleapis.com/css?family=Roboto:400,300,300italic,400italic,700,700italic);
@import url(https://fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700);
@import url(https://fonts.googleapis.com/css2?family=Libre+Baskerville:wght@700);
@import url(https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Fira+Code:wght@300..700&display=swap);

body, html {
	background-color: #282c34;
	color: #52aeee;
  font-size: 17px;
}


.sticky{
position: sticky;
top: 0;
left: 0;
bottom: 0;
margin-top: 0;
margin-bottom: 0;
z-index: 10;
}

.stickybutton{
    position: sticky !important;
    z-index: 4 !important;
    top: 60px;
}

.stickymain{
	position: sticky !important;
	/*top: 0;*/
	/*left: 0;*/
	/*bottom: 0;*/
	/*margin-top: 0;*/
	/*margin-bottom: 0;*/
	z-index: 4 !important;
	}

.stickydoc{
    background-color: #1fe11f;
	position: sticky !important;
	top: 120px;
	/*left: 0;*/
	/*bottom: 0;*/
	/*margin-top: 0;*/
	/*margin-bottom: 0;*/
	z-index: 3 !important;
	max-height: 800px; /* Set your desired height */
    overflow-y: auto;
    overflow-x: hidden;
	}



@media (max-width: 576px) {
  .sticky .navbar .container {
    width: 100%;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

.post-navigation {
  display: flex;
  justify-content: space-evenly;
}


.main-link{
    font-weight: bold;
}

.main-link.active {
background-color: rgba(64, 72, 89, 0.25) !important;
color: #d55fde !important;
text-decoration: underline !important;
}


.container-fluid{
padding-left: 0 !important;
padding-right: 0 !important;
}

.scaled-svg {
    width: 90%;
    height: 90%;
}

.scaled-svg-nav {
  width: 45%;
  height: 45%;
}

.navbar-toggler,
.navbar-brand a {
  display: inline-block;
}

a:link {
  color: #559f6f;
}


a:visited {
  /* color: #666099 ; */
  color: #559f6f;
}

/* mouse over link */
a:hover {
  color: #d55fde;
  
}

a{
font-family: "Fira Code", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

li:not(:last-child) {
  margin-bottom: 8px;
}

.text-muted {
  color: #96b5e1 !important;
}

.myptag{
  color: #bbbbbb;
  font-family: "Fira Code", Helvetica, Arial, sans-serif;
  font-weight: 400;
  font-size: 21px;
}

.myptagspaced{
  color: #bbbbbb;
  font-family: "Fira Code", Helvetica, Arial, sans-serif;
  font-weight: 400;
  font-size: 21px;
  padding-left: 31px;
}

p{
  color: #bbbbbb;
  font-family: "Fira Code", Helvetica, Arial, sans-serif;
  font-weight: 400;
  font-size: 21px;
}

.myptagnew{
  margin: 5px;
  color: #000000;
  font-size: 28px; 
}

.myreadmore{
  margin: 5px;
  color: #000000;
  font-size: 20px;
}

.nextpage{
  color: #4c7ae5 !important;
  font-size: 16px;
  float:right;
}

.prevpage{
  color: #34692f !important;
  font-size: 16px;
  text-align: left;
}

.headercool{
  /*background-color: #eaefff; */  
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f7fffb+35,dbeeff+75 */
  /* background: rgb(247,255,251); /* Old browsers */
  /* background: -moz-radial-gradient(center, ellipse cover, rgba(247,255,251,1) 35%, rgba(219,238,255,1) 75%);  FF3.6-15 */
  background: -webkit-radial-gradient(center, ellipse cover, rgba(47, 51, 61, 1) 35%, rgba(40, 44, 52, 1) 75%); /* Chrome10-25,Safari5.1-6 */
  background: radial-gradient(ellipse at center, rgb(56, 58, 75,0.5) 35%, rgba(40, 44, 52, 1) 75%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7fffb', endColorstr='#dbeeff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    /* padding-top: 3em;
    /* padding-bottom: 2.5em; */
  z-index: 1;
  }


.mynav{
background: black;  
font-family: "JetBrains Mono", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 2rem;
  line-height: 2.4;
  letter-spacing: 0;
  text-transform: none;
  
}


.nav-link{
color: #559f6f !important;
font-family: "JetBrains Mono", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 1.4rem;
}

.nav-link:visited{
  color: #559f6f;
  }

.nav-link:hover {
  color: #d55fde !important;
}


.polaroid {
  position: static;
  width: 355px;
}

.polaroid img {
  border: 10px solid #edeef3;
  border-bottom: 70px solid #eaedf1;
  -webkit-box-shadow: 8.5px 25px 35px #777;
     -moz-box-shadow: 8.5px 25px 35px #777;
          box-shadow: 8.5px 25px 35px #777;
}

.polaroid p {
  position: relative;
  text-align: center;
  width: 100%;
  bottom: 5000px;
  font: 400 18px/1 'Kaushan Script', cursive;
  color: #7a7878;
}


.mymarginleft {
  padding-left: 30px !important;
}

.mymarginright {
  padding-right: 30px !important;
}

.box {
  text-align: center;
  border: 2px solid #1e476376;
  padding: 20px;
  background-color: #1e476376;
  border-radius: 10px;
}

blockquote{
  border-left: 1px solid #bbbab3;
  color: #212522;
  font-style: italic;

  margin: 0 0 1.25rem 3rem;
  padding: 0.5625rem 1.25rem 0 1.1875rem;
  border-left: 1.4px solid #585555;

  display: block;
  font-size: 0.99rem !important;
  /*color: #515b54;*/
  color: #9995be;


}

blockquote cite:before { content: "\2014 \0020"; }

.tbcite {
  display: block;
  font-size: 0.99rem;
  /* color: #07f84f; */
  color: #9995be;
  
}

/*.tbcite a:link {*/
/*  color: #484562;*/
/*}*/

/*.tbcite a:visited {*/
/*  color: #565279;*/
/*}*/

.tbcite a:hover {
  color: #0d81fe;
}

.tbh1{
  color: white;
  font-family:'JetBrains Mono', serif;
  font-weight: 1100;
  font-size: 2.5rem;
  line-height: 1.5;



}

.tbh2{
  
  font-family:'JetBrains Mono', serif;;
  font-weight: 700;
  font-style: bold;
  line-height: 1.4;
  
  
}

.tbh3{
  
  font-family: "JetBrains Mono", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: bold;
  font-style: normal;
  line-height: 1.4;
  
  
}

.tbh3diff{
  color: #d55fde;
  font-family: "JetBrains Mono", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: bold;
  font-style: normal;
  line-height: 1.4;


}

.tbh4{
  color: #d08b4e;
  font-family: "JetBrains Mono", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 350;
  font-style: normal;
  line-height: 1.4;
  
  
}

h5{
  color: #ff5e76;
  font-family: "JetBrains Mono", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 300;
  font-style: normal;
  line-height: 1.2;
}

/* .code{
  color: #1fe11f; !important;
  background-color: #f2efe7;
} */


.bg-tbbg{

  background-color: #22282d;

}

.bg-tbbh{

  background-color: #282c34;

}

.bg-card{

  background-color: rgba(64, 72, 89, 0.25);

}

.btn-info{
background-color: rgba(91, 178, 252, 0.14);
}

#search-input {
  width: 100%;
  font-size: 1.1em;
  padding: 0.2em;
  color: blue !important;
  background-color: #ffffff;
}

.search-preview {
  margin-left: 2em;
}
/*.single .main a, .single .main h2 {*/
/*  border-bottom: 2px;*/
/*}*/



table {
  border-collapse: collapse; /* Removes space between cells */
  width: 100%; /* Makes table fill container width */
}

th,
td {
  border: 1px solid #ddd; /* Adds borders to cells */
  padding: 8px; /* Adds padding for content spacing */
  text-align: left; /* Aligns text to the left */
}

th {
  background-color: #171717; /* Light background for headers */
  font-weight: bold; /* Bold text for headers */
}

tr:nth-child(even) {
  background-color: #323742; /* Alternating row colors (zebra stripes) */
}

tr:last-child {
  border-bottom: 1px solid #ddd; /* Add border only to the last row */
}


/* 
 * Styles for a video wrapper.
 * To be used by generators like vimeo, youtube...
 */
 .videowrapper {
  position:relative;
  overflow:hidden;
  height:0;
  width:100%;
  padding-bottom:56.25%;
}
.videowrapper iframe {
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:100%;
}

/* Admonition styles */
div.admonition {
  padding: 0 !important;
  margin-bottom: 20px;
  background-color: #fcf8e3;
  border: 1px solid;
  border-bottom-left-radius: var(--border-radius);
  border-bottom-right-radius: var(--border-radius);
}

div.admonition p {
  margin: 0.5em 1em 0.5em 1em;
  padding: 0;
}

div.admonition p a {
  color: inherit !important;
}

div.admonition div.highlight {
  margin-left: 1em;
  margin-right: 1em;
}

div.admonition table.highlighttable {
  padding-left: 1em;
  padding-right: 1em;
}

div.admonition table.highlighttable div.highlight {
  margin-left: 0;
  margin-right: 0;
}

div.admonition p.admonition-title {
  color: #fff;
  margin: 0;
  padding: 0.1em 0 0.1em 0.5em;
  font-weight: bold;
  display: block;
}

div.admonition ul,
div.admonition ol {
  margin: 0.1em 0.5em 0.5em 3em;
  padding: 0;
}

/* -- danger, error -- */
div.danger,
div.error {
  color: #b94a48;
  background-color: #f2dede;
}

div.danger p.admonition-title,
div.error p.admonition-title {
  background-color: #b94a48;
}

/* -- warning, caution, attention -- */
div.warning,
div.caution,
div.attention {
  color: #c09853;
}
div.warning p.admonition-title,
div.caution p.admonition-title,
div.attention p.admonition-title {
  background-color: #c09853;
}

/* -- note, important -- */
div.note,
div.important {
  color: #468847 !important;
  background-color: #26323880 !important;
}

div.note p.admonition-title,
div.important p.admonition-title {
  background-color: #468847;
}

/* -- hint, tip -- */
div.hint,
div.tip {
  color: #52aeee;
  background-color: #263238c7;
}

div.hint p.admonition-title,
div.tip p.admonition-title {
  background-color: #52aeee;
}

div.danger p.admonition-title:before,
div.error p.admonition-title:before,
div.warning p.admonition-title:before,
div.caution p.admonition-title:before,
div.attention p.admonition-title:before,
div.important p.admonition-title:before,
div.note p.admonition-title:before,
div.hint p.admonition-title:before,
div.tip p.admonition-title:before {
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

div.danger p.admonition-title:before,
div.error p.admonition-title:before {
  height: 20px;
  width: 23px;
  background-size: 20px 20px;
  content: "";
  background-repeat: no-repeat;
  background-image: url('data:image/svg+xml; utf8, <svg aria-hidden="true" focusable="false" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="white" d="M504 256c0 136.997-111.043 248-248 248S8 392.997 8 256C8 119.083 119.043 8 256 8s248 111.083 248 248zm-248 50c-25.405 0-46 20.595-46 46s20.595 46 46 46 46-20.595 46-46-20.595-46-46-46zm-43.673-165.346l7.418 136c.347 6.364 5.609 11.346 11.982 11.346h48.546c6.373 0 11.635-4.982 11.982-11.346l7.418-136c.375-6.874-5.098-12.654-11.982-12.654h-63.383c-6.884 0-12.356 5.78-11.981 12.654z"></path></svg>');
  vertical-align: -20%;
}
div.warning p.admonition-title:before,
div.caution p.admonition-title:before,
div.attention p.admonition-title:before {
  height: 20px;
  width: 23px;
  background-size: 20px 20px;
  content: "";
  background-repeat: no-repeat;
  background-image: url('data:image/svg+xml; utf8, <svg aria-hidden="true" focusable="false" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="white" d="M569.517 440.013C587.975 472.007 564.806 512 527.94 512H48.054c-36.937 0-59.999-40.055-41.577-71.987L246.423 23.985c18.467-32.009 64.72-31.951 83.154 0l239.94 416.028zM288 354c-25.405 0-46 20.595-46 46s20.595 46 46 46 46-20.595 46-46-20.595-46-46-46zm-43.673-165.346l7.418 136c.347 6.364 5.609 11.346 11.982 11.346h48.546c6.373 0 11.635-4.982 11.982-11.346l7.418-136c.375-6.874-5.098-12.654-11.982-12.654h-63.383c-6.884 0-12.356 5.78-11.981 12.654z"></path></svg>');
  vertical-align: -20%;
}
div.important p.admonition-title:before,
div.note p.admonition-title:before {
  height: 20px;
  width: 23px;
  background-size: 20px 20px;
  content: "";
  background-repeat: no-repeat;
  background-image: url('data:image/svg+xml; utf8, <svg aria-hidden="true" focusable="false" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="white" d="M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z"></path></svg>');
  vertical-align: -20%;
}
div.hint p.admonition-title:before,
div.tip p.admonition-title:before {
  height: 20px;
  width: 23px;
  background-size: 20px 20px;
  content: "";
  background-repeat: no-repeat;
  background-image: url('data:image/svg+xml; utf8, <svg aria-hidden="true" focusable="false" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 352 512"><path fill="white" d="M176 80c-52.94 0-96 43.06-96 96 0 8.84 7.16 16 16 16s16-7.16 16-16c0-35.3 28.72-64 64-64 8.84 0 16-7.16 16-16s-7.16-16-16-16zM96.06 459.17c0 3.15.93 6.22 2.68 8.84l24.51 36.84c2.97 4.46 7.97 7.14 13.32 7.14h78.85c5.36 0 10.36-2.68 13.32-7.14l24.51-36.84c1.74-2.62 2.67-5.7 2.68-8.84l.05-43.18H96.02l.04 43.18zM176 0C73.72 0 0 82.97 0 176c0 44.37 16.45 84.85 43.56 115.78 16.64 18.99 42.74 58.8 52.42 92.16v.06h48v-.12c-.01-4.77-.72-9.51-2.15-14.07-5.59-17.81-22.82-64.77-62.17-109.67-20.54-23.43-31.52-53.15-31.61-84.14-.2-73.64 59.67-128 127.95-128 70.58 0 128 57.42 128 128 0 30.97-11.24 60.85-31.65 84.14-39.11 44.61-56.42 91.47-62.1 109.46a47.507 47.507 0 0 0-2.22 14.3v.1h48v-.05c9.68-33.37 35.78-73.18 52.42-92.16C335.55 260.85 352 220.37 352 176 352 78.8 273.2 0 176 0z"></path></svg>');
  vertical-align: -20%;
}

figure {
 border: 2pt solid #d55fde;
 background: #212529;
 color: #1e9c4f;
 padding: 3pt;
 display: inline-block;
}
figure figcaption {
 width: 100%;
 text-align: center;
}
figure img {
 object-fit: contain;
 margin: auto !important;
 max-width: 100%;
 max-height: 100%;
 width: 100%;
}
figure.lightbox {
 transition: 0.5s;
 transition-property: background;
}
figure.lightbox:target {
 transition: 0.5s;
 transition-property: background;
 z-index: 99999;
 position: fixed;
 top: 0;
 bottom: 0;
 left: 0;
 right: 0;
 background: black;
 background: rgba(0,0,0,.9);
 color: grey;
 height: 100% !important;
 width: 100% !important;
 padding: 0;
 margin: 0;
 border: none;
}
figure.lightbox .lightbox-background {
 display: none;
}
figure.lightbox:target .lightbox-background {
 position: absolute;
 display: block;
 width: 100%;
 height: 100%;
}
figure.lightbox:target img {
 display: block;
 margin: auto;
 background: transparent;
 width: 100vw;
 height: auto;
 max-width: 90%;
 max-height: 80%;
 padding: 2% 0;
 border: 0;
}

hr{
  border: 2px solid rgb(6, 121, 232);
}