.theme-font{
  color: #dd4814;
}
.navbar-default {
	background-color: #d24714;
}
.jumbotron {
  background-color: transparent;
}
.jumbotron h1{
  color: #dd4814;
}
.jumbotron .p{
  color: black;
}
.carousel {
  margin-bottom: 20px;
}
.carousel img{
  width: 100%;
  max-height: 430px;
  min-height:400px;
  opacity:0.7;
}
.carousel-control {
  width: 50px;
}
.carousel-caption {
  position: absolute;
  margin: 5% -10% 5% -10%;
  max-width: 1200px;
  max-height: 600px;
}
a.carousel-control.left, a.carousel-control.right {
    display: flex;
    align-items: center;
    justify-content: center;
}
a.carousel-control.left:focus, a.carousel-control.right:focus {
    background-color: rgba(0, 0, 0, 0.25);
    border-style: solid;
    border-color: black;
}

.dropdown-toggle:focus {
  outline:dotted;
}
.st-default-search-input::-webkit-input-placeholder{
	color: #000000 !important; 
}
.st-default-search-input{
	color: #000000 !important; 
}
.st-default-search-input:focus {
        border-color: #3a98e3 !important;
}
@media screen and (-ms-high-contrast: black-on-white) {
  .brand
  {
	  background-color: #000000;
  }
}
.btn-default {
    color: #ffffff;
    background-color: #d23714;
    border-color: #d23714;
}
.btn-secondary {
  padding: 10px 20px;
  color: #ffffff;
  background-color: #6c757d;
  border-color: #6c757d;
  cursor: pointer;
}
.btn-secondary:hover {
  background-color: #272b2e;
}
.label-success{
	background-color: #277a33;
}
.brand{
	padding-top: 1px !important;
	padding-bottom: 1px !important;
}
.alert-success {
  background-color: #3DAA27;
  border-color: #282b26;
  color: #000000;
}
.alert-success .alert-link {
  color: #000000;
}
.nav-tabs>li.active>a, .nav-tabs>li.active>a:hover, .nav-tabs>li.active>a:focus {
    color: #706f6f;
    background-color: #ffffff;
    border: 1px solid #dddddd;
    border-bottom-color: transparent;
    cursor: default;
}
.nav-pills>li.active>a, .nav-pills>li.active>a:hover, .nav-pills>li.active>a:focus {
    color: #ffffff;
    background-color: #d23714;
}
.btn-primary {
    color: #ffffff;
    background-color: #d23714;
    border-color: #d23714;
}
a {
  color: #d23000;
  text-decoration: underline;
  text-decoration-color:#d23000;
}
a[role=menuitem]{
  text-decoration: none;
}
td > a {
	color:#d23000;
}
code {
    padding: 2px 4px;
    font-size: 90%;
    color: #ce3512;
    background-color: #f9f2f4;
    border-radius: 4px;
    overflow-wrap: break-word;
}
.table {
  width: 100%;
  font-size-adjust: auto;
}

.uri-conventions-table > tbody > tr > td {
  word-break: break-all;
}

#index-guide{
  padding-left: 60px;
  padding-right: 60px;
}

.github-logo{
    float: left;
    max-width: 100px;
    max-height: 100px;
}
.floating-box {
    float: left;
    width: auto;
    height: auto;
    margin: 0px -20px 10px -20px;
    border: 3px solid #dd4814;
}

/* styles for basic tutorails*/
.tutorial-sidebar.affix {
    position: static;
}
.tutorial-sidebar .nav>li>a {
    display: block;
    font-size: 15px;
    font-weight: 500;
    color: #bf3e11;
    padding: 4px 20px;
    word-wrap:break-word;
    overflow-wrap: break-word;
}
.tutorial-sidebar .nav>li>a:hover, .tutorial-sidebar .nav>li>a:focus {
    padding-left: 19px;
    color: #563d7c;
    text-decoration: none;
    background-color: transparent;
    border-left: 1px solid #563d7c;
    word-wrap:break-word;
    overflow-wrap: break-word;
}
.tutorial-sidebar .nav>.active>a, .tutorial-sidebar .nav>.active:hover>a, .tutorial-sidebar .nav>.active:focus>a {
    padding-left: 18px;
    font-weight: 700;
    color: #563d7c;
    background-color: transparent;
    border-left: 2px solid #563d7c;
    word-wrap:break-word;
    overflow-wrap: break-word;
}
.tutorial-sidebar .nav .nav {
    display: none;
    padding-bottom: 10px;
}
.tutorial-sidebar .nav .nav>li>a {
    padding-top: 1px;
    padding-bottom: 1px;
    padding-left: 30px;
    font-size: 14px;
    font-weight: 400;
    word-wrap:break-word;
    overflow-wrap: break-word;
}
.tutorial-sidebar .nav .nav>li>a:hover, .tutorial-sidebar .nav .nav>li>a:focus {
    padding-left: 29px;
}
.tutorial-sidebar .nav .nav>.active>a, .tutorial-sidebar .nav .nav>.active:hover>a, .tutorial-sidebar .nav .nav>.active:focus>a {
    font-weight: 500;
    padding-left: 28px;
}
.tutorial-sidebar.affix, .tutorial-sidebar.affix-bottom {
    word-wrap: break-word;
}
.tutorial-sidebar.affix {
    position: fixed;
}
.tutorial-sidebar.affix-bottom {
    position: absolute;
}
.tutorial-sidebar.affix-bottom .tutorial-sidenav, .tutorial-sidebar.affix .tutorial-sidenav {
    margin-top: 0;
    margin-bottom: 0;
}
.tutorial-sidenav {
    margin-top: 20px;
    margin-bottom: 20px;
}
.dropMenu .skip-nav-elements {
	background:  #bf3e11;
	left: 50px;
	top: 50px;
}

.tutorial-sidebar .nav > .active > ul {
  display: block;
}

@media (max-width: 767px) {
  .affix {
    position: static;
  	display: block;
  	float:right;
    top: 50%;
  }
}

/* URL styling */
    /* specific for IE10 & 11, they do not support these declarations with "a" or ".wrapped" selector
      also, must use "word-wrap" property rather than "overflow-wrap" */
  
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  * {
    word-wrap: break-word;
  }
}

/* for all Edge, does not support these declarations with "a" or ".wrapped" selector, so must use "*" selector */
@supports (-ms-ime-align:auto) {
  * {
    word-wrap: break-word;
    overflow-wrap: break-word;
  }
}
/* all other browsers long url styling */

.wrapped {
  word-wrap:break-word;
  overflow-wrap: break-word;
}

table.reflows{
  width: 100%;
}

table.reflows th{
  text-align: left;
  border-bottom: 1px dashed silver;
}

table.reflows.cell-label {
  display: none;
}

@media screen and (max-width: 640px) {
  table.reflows th {
        display: none;
      }

   table.reflows tr td {
        float: left;
        clear: left;
        display: block;
        width: 100%;
      }

  table.reflows tr td:last-child {
        padding-bottom: 20px;
        border-bottom: 0;
      }

  table.reflows .cell-label {
        display: block;
        float:left;
      }
  table.reflows .cell-content {
        display: block;
        float:right;
      }

  table.reflows tr:nth-child(even) {
        background-color: rgba(255, 255, 255, 0.25);
  }
  table.reflows tr:nth-child(odd) {
        background-color: #F9F9F9;
  }
}

body {
  overflow-x: hidden;
}

[class*='col-'] {
  float: left;
  padding-right: $pad;
  .grid &:last-of-type {
    padding-right: 0;
  }
}
.col-2-3 {
  width: 66.66%;
}
.col-1-3 {
  width: 33.33%;
}
.col-1-2 {
  width: 50%;
}
.col-1-4 {
  width: 25%;
}
.col-1-8 {
  width: 12.5%;
}
.col-1-12 {
  width: 8.33%;
}
.col-3-4 {
  width: 75%;
}
.col-3-8 {
  width: 37.5%;
}

pre {
  border: 1px solid #424242;
}

.image-modal {
  display: none;
  z-index: 1;
  padding-top: 100px;
  left: 0;
  top: 0;
  background-color: black;
}

.screenshot1Lightbox {
  width: 800;
  height: 490;
  background-color: black;
}

.postcollection {
  margin-left: 20%;
  margin-right: auto;
}

.dropdown-menu li a:hover, .dropdown-menu li a:focus {
  background-color: #c34113;
}

/* Mouse navigation.*/
.postman:hover {
  color: white;
  text-decoration: underline;
}

/* Keyboard navigation.*/
.postman:focus {
  color: white;
  text-decoration: underline;
}

.affix-top-50 {
    top: 50%;
  }

.affix-top-30 {
    top: 30%;
  }

@media screen and (-ms-high-contrast: active) {
  .tab-link {
    -ms-high-contrast-adjust:none;
    color: LinkText;
  }
}

strong {
  color: #000;
  font-weight: bold;
  font-size: 1.5rem;
}

.alert.alert-success {
    background-color: #FFF1DA;
}

figure img {
    max-width: 100%;
    height: auto;
}

p a {
   word-wrap: break-word;
}

td {
    word-wrap: break-word;
}

.visually-hidden {
    clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%); /* browsers in the future */
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

.nav-tabs>li.active>a, .nav-tabs>li.active>a:hover, .nav-tabs>li.active>a:focus{
  border-color: #737373;
  border-bottom-color: transparent;
  border-width: 2px;
}

.table>thead>tr>th, .table>tbody>tr>th, .table>tfoot>tr>th, .table>thead>tr>td, .table>tbody>tr>td, .table>tfoot>tr>td,  .page-header, .nav-tabs {
  border-bottom-color: #737373;
}

.table>thead>tr>th, .table>tbody>tr>th, .table>tfoot>tr>th, .table>thead>tr>td, .table>tbody>tr>td, .table>tfoot>tr>td {
  border-top-color: #737373;
}

.post-content>p> img {
    max-width: 100%; /* Ensures images scale with the container */
    height: auto; /* Maintains aspect ratio */
    display: block; /* Prevents inline spacing issues */
    margin: 0 auto; /* Centers images */
    image-rendering: crisp-edges;
    image-rendering: -webkit-optimize-contrast;
}

@media (max-width: 768px) {
    .post-content>p> img {
        width: 100%; /* Ensures images fit smaller screens */
        height: auto;
    }
}

.other-protocols-container {
  display: flex;
  flex-direction: column;
  text-align: center;
}

.other-protocols-table {
  width: 60%;
  border-collapse: collapse;
  margin-bottom: 5px;
}

.other-protocols-table th, .other-protocols-table td {
  border: 1px solid black;
  padding: 5px;
}

.other-protocols-table th {
  text-align: center;
}

.other-protocols-item {
  background-color: #f2f2f2;
}

#feedback {
  margin: 10px;
  font-weight: bold;
  color: green;
}