.status-dot {
            display: inline-block;
            max-width: 10px;
            max-height: 10px;
            min-width: 10px;
            min-height: 10px;
            background: #2ecc71; /* Success Green */
            border-radius: 50%;
            margin-right: 15px;
            animation: pulse 2s infinite;
        }

    /* Pulse Status Dot (Green) */
        @keyframes pulse {
            0% { box-shadow: 0 0 0 0 rgba(46, 204, 113, 0.7); }
            70% { box-shadow: 0 0 0 10px rgba(46, 204, 113, 0); }
            100% { box-shadow: 0 0 0 0 rgba(46, 204, 113, 0); }
        }
/* Container - Ensure it stays visible and centered */
.coming-soon-container {
    margin: 20px 0;
    padding: 15px;
    background: rgba(0,0,0,0.5);
    border: 1px solid #333;
    border-radius: 4px;
    /* Ensure it doesn't vanish in portrait/mobile */
    display: block !important; 
}

.feature-label {
    font-size: 0.75rem;
    letter-spacing: 3px;
    color: #8fbc8f;
    margin-bottom: 15px;
    text-align: center;
    border-bottom: 1px solid #222;
    padding-bottom: 5px;
}

/* The Portrait Frame - The "Contain" Strategy */
.portrait-frame {
    position: relative;
    width: 100%;
    /* Maintain vertical height without cropping */
    aspect-ratio: 9 / 16; 
    background: #050505; /* Black bars if screenshot is slightly off-ratio */
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #222;
}

.portrait-frame img {
    max-width: 100%;
    max-height: 100%;
    /* Switched to 'contain' so you see the WHOLE screenshot */
    object-fit: contain; 
    transition: transform 0.3s ease;
}

.portrait-frame:hover img {
    transform: scale(1.02); /* Subtle zoom on hover */
}

/* Overlay refinement */
.portrait-overlay {
    position: absolute;
    bottom: 0;
    width: 100%;
    background: rgba(0,0,0,0.8);
    padding: 8px;
    text-align: center;
    border-top: 1px solid #333;
}

.portrait-overlay span {
    font-size: 0.7rem;
    color: #0dcaf0; /* Light Blue for contrast */
    font-family: 'Consolas', monospace;
}

/* Specific Media Query for Portrait/Mobile */

    
    .coming-soon-container {
        max-width: 320px; /* Keep it focused on mobile */
        margin: 30px auto; /* Center it in the stack */
    }



/* Container for the scrollable table */
.tcu-log-container {
    max-height: 700px; /* Adjusted for longer lists */
    overflow-y: auto;
    border: 1px solid #ccc;
    border-radius: 4px;
    margin: 20px 0;
}

/* Base table styles */
.tcu-log-table {
    width: 100%;
    border-collapse: collapse;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 0.9rem;
    color: #333;
}

/* Sticky Header Logic */
.tcu-log-table thead th {
    position: sticky;
    top: 0;
    background-color: #4f2683; /* TCU Purple */
    color: white;
    padding: 12px;
    text-align: left;
    z-index: 10;
    border-bottom: 2px solid #333;
}

/* Cell Styling */
.tcu-log-table td {
    padding: 10px;
    border-bottom: 1px solid #ddd;
    vertical-align: top;
}

/* Light Gray Zebra Striping */
.tcu-log-table tbody tr:nth-child(odd) {
    background-color: #f2f2f2; /* Light Gray */
}

.tcu-log-table tbody tr:nth-child(even) {
    background-color: #e9e9e9; /* Slightly darker gray for contrast */
}

/* Hover effect */
.tcu-log-table tbody tr:hover {
    background-color: #dcdcdc;
}

/* Date Column Accent */
.tcu-log-table td:first-child {
    font-weight: bold;
    color: #4f2683;
    width: 120px;
}


h3{
text-align:center;
}



/* Unified Presentation Box with Acorn */
#presentation-box {
    display: flex;
    align-items: flex-start;
    gap: 1.2rem;
    padding: 1.5rem;
padding-top: 6rem;
margin-top: 12rem;
    margin: 0rem;
    border: 1px solid transparent;
    border-radius: 8px;
    background-color: rgba(0, 0, 0, 0.01);
    transition: all 0.3s ease;
}

#presentation-box:hover {
    border-color: #d1d1d1;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    transform: translateY(-2px);
}

.fact-icon {
    width: 40px;
    height: auto;
    flex-shrink: 0;
    margin-top: 4px;
    transition: transform 0.2s ease-in-out;
}

#presentation-box:hover .fact-icon {
    transform: rotate(12deg) scale(1.1);
}

.fact-content h5 {
    margin-top: 0;
}














#presentation-box{
background-color:rgba(37, 37, 37, 0.491)!important;
margin-left:auto;
margin-right:auto;
padding-left:10px;
padding-right:10px;
padding-top:20px;
margin-top:2rem;
padding-bottom:15px;
border: 1px solid rgba(78, 78, 78, 0.883);
border-radius: 9px;
max-width:50rem;
overflow-wrap: break-word;

color:rgba(208, 208, 208, 0.883);
margin-bottom:2em;

}

#presentation-box-short{
background-color:rgba(37, 37, 37, 0.491)!important;
margin-left:1px;
padding-left:10px;
padding-right:5px;
padding-top:5px;
padding-bottom:5px;
border: 1px solid rgba(78, 78, 78, 0.883);
border-left: 1px solid rgba(0, 0, 0, 0.883);
border-radius: 1px;
border-top-right-radius: 15px;
border-bottom-right-radius: 15px;
max-width:20rem;
overflow-wrap: break-word;
margin-top:0.4rem;
color:rgba(136, 136, 136, 0.883);


}

#presentation-box-short2{
background-color:rgba(37, 37, 37, 0.491)!important;
margin-left:1px;
padding-left:10px;
padding-right:5px;
padding-top:5px;
padding-bottom:5px;
border: 1px solid rgba(78, 78, 78, 0.883);

border-radius: 10px;

max-width:30rem;
overflow-wrap: break-word;
margin-top:0.4rem;
color:rgba(136, 136, 136, 0.883);
margin-bottom:2em;
}


#presentation-box-top{
background-color:rgba(37, 37, 37, 0.491)!important;
margin-left:1px;
padding-left:10px;
padding-right:5px;
padding-top:0px;
margin-top:0rem;
padding-bottom:5px;
border: 1px solid rgba(78, 78, 78, 0.883);
border-top: 1px solid rgba(0, 0, 0, 0.883);
border-radius: 1px;
border-bottom-right-radius: 15px;
border-bottom-left-radius: 15px;
max-width:20rem;
max-height:10rem;
overflow-wrap: break-word;

color:rgba(136, 136, 136, 0.883);
}







/* 1. The Outer Container (The Grey Box) */
pre[class*="language-"] {
    background: #2d2d2d !important; /* Prism's default dark grey */
    padding: 1rem !important;
    margin: 1.5rem 0 !important;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    
    /* Ensures the container stays within your grid/article width */
    max-width: 100%;
    overflow: hidden; 
}

/* 2. The Inner Code (The Text & Wrapping Logic) */
code[class*="language-"], 
code {
    /* Changed to inline-block so it respects width/padding while wrapping */
    display: inline-block !important; 
    
    /* Fixes 'run-off' by respecting line breaks but wrapping at the edge */
    white-space: pre-wrap !important; 
    max-width: 100%;

    /* Break long, unbreakable strings (like nested Java logic or URLs) */
    overflow-wrap: anywhere !important; 
    word-break: break-word !important;
    
    /* Ensure text doesn't override the container's background */
    background: transparent !important; 
    color: #ccc;
    text-shadow: none !important;
    
    /* Font and Scroll settings */
    font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
    overflow-x: auto;
}

/* 3. The 'Nowrap' Fix (Keep this commented out or deleted) */
/* 
code, span.no-break {
    white-space: nowrap;
} 
*/


/* Styling for superscript reference links */
sup a {
    color: #4da6ff; /* Matches your outsideLink color */
    text-decoration: none;
    padding: 0 2px;
    font-weight: bold;
}

sup a:hover {
    color: #80bfff;
    text-decoration: underline;
}



/* Shrink the container to fit the code length */
pre[class*="language-"] {
    display: table; /* Shrink-wraps to the widest line */
    margin: 1.5rem 0 !important;
    padding: 0 !important; /* Let the <code> tag handle padding */
    width: auto;
    max-width: 100%;
}

/* Ensure the code block inside stays consistent */
pre[class*="language-"] code {
    display: block;
    padding: 15px 20px !important;
    white-space: pre; /* Keeps code structure but allows scroll if too long */
    overflow-x: auto;
}

/* Styling for standalone command lines */
.command-line {
    display: inline-block;
    background-color: #2d2d2d; /* Match your Prism grey */
    color: #ccc;
    padding: 2px 8px;
    border-radius: 4px;
    margin: 5px 0;
    font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
    font-size: 0.95em;
    border: 1px solid rgba(255,255,255,0.1);
}

/* Tighten the gap between a description and its command */
.command-group p {
    margin-bottom: 2px !important; 
}

.command-group {
    margin-bottom: 1.5rem; /* Space between different command sets */
}
















/* Custom Cisco IOS Console Style */
.cisco-console {
    background-color: rgba(20, 20, 20, 0.9); /* Deepest charcoal */
    border-left: 4px solid rgb(165, 165, 165); /* Your teal accent */
    padding: 15px;
    margin: 20px 0;
    font-family: "Courier New", monospace !important;
    border-radius: 2px;
}

.cisco-prompt {
    color: rgb(196, 196, 196); /* Your signature light blue */
    font-weight: bold;
}

.cisco-command {
    color: #e2cd61; /* Stark white for the actual input */
}

.cisco-output {
    color: rgba(151, 149, 146, 0.8); /* Your #font2 grey for the router's response */
    display: block;
    margin-top: 5px;
    font-size: 0.95rem;
}
















/* Chapter Style Update */
.prompt-user {
    color: rgb(108, 145, 214); /* Your custom blue */
    font-weight: bold;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
}

.prompt-system {
    color: #4ec9b0; /* Clean terminal green */
}

.console-container {
    background-color: #1a1a1a;
    border-left: 5px solid rgb(108, 145, 214);
    margin: 20px 0;
}













.blog-signoff {
    margin-top: 4rem;
    margin-bottom: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(101, 101, 101, 0.3); /* Subtle divider */
    color: rgba(208, 208, 208, 0.6); /* Faded text */
    font-style: italic;
    font-weight: 300;
    letter-spacing: 1px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.blog-signoff::after {
    content: "";
    flex: 1;
    height: 1px;
    background: linear-gradient(to right, rgba(101, 101, 101, 0.3), transparent);
}




/* Base state for your Bootstrap images */
.img-fluid.rounded.border-secondary {
    filter: brightness(90%) saturate(100%);
    transition: filter 0.3s ease-in-out, transform 0.3s ease-in-out;
    cursor: pointer;
}

/* Hover state: Brighter and Bolder */
.img-fluid.rounded.border-secondary:hover {
    filter: brightness(120%) saturate(150%);
    /* Optional: subtle lift effect to make it feel 'bolder' */
    transform: translateY(-5px); 
    border-color: rgba(77, 166, 255, 0.8) !important; /* Optional: highlights the border blue */
}





section {
  margin-top: 2rem;
  padding-top: 1.40rem;

  border-top: 1px solid rgba(101, 101, 101, 0.883);
}


/* Update to increase vertical separation between documentation modules */
section {
    margin-bottom: 2rem; /* Adjust this value for more or less space */
    padding-bottom: 0rem;
    border-bottom: 1px solid rgba(0,0,0,0.1); /* Optional: adds a subtle divider */
}

section h3 {
  
margin-top:0rem;
padding-top:0rem;
margin-top:0rem;
padding-bottom: 1rem;


}




.ledger-entry {
    margin-bottom: 4rem;
}



h3{
padding-bottom:0rem;
margin-bottom:0rem;
}


#top-grid{
  grid-template-columns:auto 1fr 1fr 1fr 1fr; 

    display: grid;
    margin-top:0rem;
    width:100%;
gap:0!important;
 color: rgb(42, 40, 40);


}
#top-grid-column1{
  grid-column:1 / 1!important;
    
  margin: 0;
  padding: auto;
text-align:left;
font-size:85%;
padding-right:5px;
align-items: center; 

}

#top-grid-column1 a{

font-size:120%;
}

#top-grid-column2{
  grid-column:2 / 2!important;

  margin: 0;
  padding: auto;
text-align:left;
font-size:90%;
padding-left:5px;
align-items: center; 
}

#top-grid-column3{
  grid-column:3 / 3!important;
  
    
}

#top-grid-column4{
  grid-column:3 /  6!important;
    text-align:right!important;

font-size:70%;
padding-top:4px;
min-width:1rem;
white-space: nowrap!important;
}



#filler{
height:2rem;
background-color:rgb(16, 8, 0);
}

#filler td{
height:2rem;

border-left: 1px solid rgb(16, 8, 0)!important;
border-right: 1px solid rgb(16, 8, 0)!important;
}

#section-credit{
margin-top:5.5rem;
}

#section-h2{
margin-top:5.5rem;
}


#split-grid-a{
  overflow-wrap: break-all;
  /* Ensures long, unbreakable strings (like URLs) break within the container */
  word-break: break-word;
  /* For older browser compatibility */
  -ms-word-break: break-all;
  /* Ensure no other styles are interfering */
  white-space: normal; 

}

#split-grid-nav-dual{

margin-top:0px!important;

  overflow-wrap: break-all;
  /* Ensures long, unbreakable strings (like URLs) break within the container */
  word-break: break-word;
  /* For older browser compatibility */
  -ms-word-break: break-all;
  /* Ensure no other styles are interfering */
  white-space: normal; 

}


html {
  -webkit-text-size-adjust: 100%; /* Prevents text from changing size on orientation/zoom */
  text-size-adjust: 100%;
}






#accessibility-statement-span{
color:rgba(165, 156, 141, 0.932)!important;
}


#cushion-left{
margin-left: 17px;
}


#cushion-top{
margin-top: 7px;
}

#cushion-top-large{
margin-top: 2rem;
padding-top: 0.40rem;
border-top: 1px solid rgba(101, 101, 101, 0.883);
}



  #pre-nobreak pre{
    margin: 0;
  }


#topclock{
display:block;

text-align:right!important;
color:rgba(165, 156, 141, 0.932)!important;
body {
    font-family: 'Cascadia Code', Consolas, 'Courier New', monospace;
}


}



#desk-image-div{
text-align:center;
}



#elec-image-vertical{
  width: 650px!important;
  height: auto!important;
  margin-left:1.5rem;
}


#gen-image-horizontal{
  width: 550px!important;
  height: auto!important;
  margin-left:1.5rem;
  margin-top:10px;
margin-bottom:40px;
}


#desk-image-vertical{
  width: 500px!important;
  height: auto!important;
}


#desk-image-horizontal{
  width: 500px!important;
  height: auto!important;

}


#image-horizontal-300{
  max-width:300px!important;
  height: auto!important;

}



/*squirrel-both.css*/

#shrink-image-span img{
  width: 200px!important;
  height: 500px!important;
}

#shrink-image-span-100x100 img{
  width: 50px!important;
  height: auto!important;
}



#small-text{
font-size:80%;
color:rgba(143, 141, 141, 0.903);
}



#shrink-image-span img{
  width: 300px!important;
  height: 500px!important;
}



body{
background-color:rgb(0, 0, 0)!important;
color:rgba(212, 210, 210, 0.903)!important;
min-height: 100%;
max-width: 98%;
overflow-x: auto;

-webkit-text-size-adjust: none; /* Use with caution as it impacts accessibility */



}


body h1{
color:rgba(154, 150, 144, 0.903)!important;
}





#login-link-span{
font-size:80%;
padding-left:5px;
color:rgb(166, 105, 35) !important;
color:rgba(167, 167, 167, 0.849)!important;

}


#login-link-span a{
color:rgba(144, 144, 144, 0.849)!important;
text-decoration:none!important;
font-size:90%;
}

#login-link-span a:hover{
color:rgb(128, 81, 27) !important;
text-decoration:none;
}

#login-link-span a.current{
color:rgba(51, 255, 0, 0.729) !important;
font-size:110%;
}



#copyright-span{
font-size:75%;
color: rgba(94, 94, 94, 0.989)!important;
}


footer{
/*border-top: 1px solid rgba(255, 0, 0, 0.276);*/
/*border-left: 1px solid rgba(255, 255, 255, 0.276);*/

padding-top:1rem;
padding-bottom:1rem;
padding-left:10px;
color: rgba(52, 54, 52, 0.345);

}


footer a{
color: rgba(124, 124, 124, 0.989)!important;

}


/*start paste from htdocs 11-14-25*/
#landing-heading{
color:rgba(55, 55, 55, 0.849)!important;
color:rgb(166, 105, 35) !important;

margin-bottom:1rem;
opacity:0.5;
border: 1px solid rgb(0, 0, 0);
border-radius: 15px; 
padding-left:2rem;

}

#landing-heading-tighter-old{

color:rgba(248, 248, 248, 0.942) !important;
opacity:0.5;
border: 1px solid rgb(0, 0, 0);
border-radius: 15px; 
padding:auto;
padding-left:2rem;
padding-right:1em;
padding-top:2em;

text-align:right!important

}

#landing-heading-tighter-old2{
color:rgba(207, 207, 207, 0.942) !important;

text-align:right!important;
align-content:right!important;
padding-right:1px;
padding-left:auto;
margin-bottom:1px!important;
padding-bottom:1px!important;

}

#landing-heading-tighter{
color:rgba(207, 207, 207, 0.942) !important;



}

.text-glow {text-shadow: 0 0 0px #664200, 0 0 100px #e7e7e7, 0 0 70px #59450d, 0 0 10px #574603, 0 0 10px #403000; 

}

.text-glow2 {text-shadow: 0 0 50px #9f9219, 0 0 10px #1589a0, 0 0 8px #007a85, 0 0 1px #003e85, 0 0 10px #008578; 
}



.typing-demo {
  /* The number of characters in the text */
  width: 13.3ch; 
  animation: typing 2s steps(14) forwards, blink .4s step-end infinite alternate!important;
  white-space: nowrap;
  overflow: hidden;
  border-right: .15em solid rgb(13, 101, 51)!important; /* The blinking cursor */
font-family: "Courier New", monospace;


  font-size: 2em;
margin-top:1em;
padding-top:1em;
color:rgb(197, 197, 197);

}

@keyframes typing {
  from { width: 0 }
  to { width: 13.3ch } /* Match this to the width above */
}

@keyframes blink {
  from, to { border-color: transparent }
  50% { border-color: rgb(145, 159, 146) }

}


.wrapper.four {
  
    font-size: 3rem;
    font-family: "Play", sans-serif;
color:rgba(205, 205, 205, 0.863);
padding-bottom:0rem;
margin-bottom:0rem!important;
padding-top:0px!important;
padding-bottom:0px!important;

}
.four .type{
    padding: 2rem 1rem;
    width: auto;
    margin: auto;
margin:1px!important;
padding:1px!important;
padding-top:0px!important;
padding-bottom:0px!important;
}
.four h3 {
    width: 11ch;
    border-right: 4px solid rgb(39, 132, 67);
    margin: 2rem auto;
    white-space: nowrap;
    overflow: hidden;
    animation: typing 2s steps(10, end), blink-caret 0.5s step-end infinite alternate;
}
@-webkit-keyframes typing {
    from {
        width: 0;
    }
}
@-webkit-keyframes blink-caret {
    50% {
        border-color: transparent;
    }
}


#table-for-login table{
max-width:50%;
height:auto;
overflow-x:auto;
overflow-y:hidden;
border-collapse: separate;
border: 1px solid rgb(7, 34, 29);
border-radius: 5px; 
padding-top:1rem;
padding-bottom:1rem;
padding-left:1rem;
padding-right:4rem;

/*uncenter
margin-left: auto;
margin-right: auto;
*/
 
}

#table-body-div{

overflow:hidden!important;
}


input[type=text] {  
  background-color: #000000;
  color: white;
}

input[type=password] {
  background-color: #000000;
  color: white;
}


/*end paste from htdocs 11-14-25*/



 /*start paste from htdocs 11-13-25*/

#fade-pic-div img{
opacity:0.2;
}

.referencesBufferTop{
position:fixed;
margin-top:25rem;
}


#table-width-compress-div{
overflow-x:auto;

}


#done-link-div{
padding-left:15rem;
color: rgb(211, 211, 211)!important;
}

#done-link-div a{
color: rgb(211, 211, 211)!important;
}

#done-link-div a:hover{
color: rgb(25, 134, 0)!important;
}


#section-decorate{
padding-left:2rem;
padding-right:2rem;
padding-top:2rem;
padding-bottom:1rem;
border: 1px solid rgb(90, 84, 84);
color: rgb(211, 211, 211);
background-color:rgb(1, 1, 1);
margin-top:5rem;
}

#checkmark-span{
color: rgb(35, 231, 17);
}

#mouseFeatureDiv{
padding-left:2rem;
padding-right:2rem;
padding-top:2rem;
padding-bottom:6rem;
border: 1px solid rgb(255, 255, 255);
color: rgb(211, 211, 211);
background-color:rgb(62, 23, 9);
}

#mouseFeatureDiv img{
width: 20rem;
height:20rem;
}

blockquote{
      margin-left: 40px!important; /* Adjust the value as needed */
      margin-right: 40px; /* Optional, for symmetrical indentation */
        font-size:80%;
    }




#tableStyles{
border: 1px solid rgb(142, 115, 115);
padding: 50px;
padding-left:10px;
border-spacing: 3px;
padding-top:1px;
color: rgb(199, 192, 174);
/*cells are fixed width*/
table-layout:fixed!important;
width:100%;
overflow-x: auto!important;



}
/* TIGHT & PROFESSIONAL TABLE GLOBAL STYLE */
#tableStyles {
    border: 1px solid rgb(142, 115, 115);
    padding: 10px !important; /* Small outer margin */
    border-spacing: 0px; 
    width: 100%;
    margin-top: 15px;
    margin-bottom: 15px;
}

#tableStyles table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.95rem !important; /* Restoration to normal size */
    color: rgb(199, 192, 174);
}

#tableStyles th {
    background-color: #2a2a2a;
    color: rgb(152, 152, 152); /* Cyan pop for headers */
    border: 1px solid rgb(73, 88, 108) !important;
    padding: 6px 12px;
    text-align: center;
    font-weight: bold;
}

#tableStyles td {
    border: 1px solid rgb(50, 50, 50);
    padding: 5px 12px; /* Tight vertical, comfortable horizontal */
    text-align: left !important;
    vertical-align: top;
}

#tableStyles2{

padding: 50px;
padding-left:10px;
border-spacing: 3px;
padding-top:1px;
color: rgb(199, 192, 174);
/*cells are fixed width*/
table-layout:fixed!important;
width:100%;
overflow-x: auto!important;

}

#tableStyles2 th{
color: rgb(0, 0, 0)!important;
position: sticky;
top: 0; /* Sticks to the top of the scroll container/viewport */
background-color: #383838; /* Important for covering content below */
z-index: 1; /* Ensures the header stays above table body content */
color: rgb(199, 192, 174);
border: 1px solid rgb(12, 100, 21)!important;
padding:10px;
text-align:center;
}

#tableStyles2 td{
border: 1px solid rgb(73, 88, 108);
padding:10px;
text-align:left!important;
}



/*end paste from htdocs 11-13-25*/





/*start disable 11-15-Sat
#login-table {
  padding: 100px;
  padding-bottom:20px;
  text-align: left;
  border: 5px solid #000000b3!important; 

}


#login-table td {

  text-align: left;
  border: 5px solid #000000b3!important; 
}
end disable 11-15-Sat*/





#running-squirrel{
float:right!important; 
padding-right:15rem; 
padding-bottom:2rem;
height:60px;
width:auto;
/*filter: drop-shadow(0 0 5px rgb(118, 114, 114));*/
/*filter: blur(2px);*/
/*filter: brightness(170%);*/
/*filter: contrast(100%);*/
/*filter: drop-shadow(-120px 0 5px rgb(60, 36, 3));*/
}

#running-squirrel{
 &:hover {
 filter: brightness(100%) saturate(200%);
 }
}

#squirrelHeading{
font-size:200%;
padding-top:1rem;
padding-bottom:3rem;
color:#353535!important;
text-shadow: 0px 0px 0 rgba(0, 0, 0, 0.743), 0px 0px 0 rgba(91, 57, 46, 0.977), 0px 0px 0 rgba(0, 0, 0, 0.977), 0px 0.5px 0 rgb(111, 109, 109);
text-align:center;
}



blockquote{
      margin-left: 40px!important; /* Adjust the value as needed */
      margin-right: 40px; /* Optional, for symmetrical indentation */
        font-size:80%;
    }





#tableStyles{
border: 1px solid rgb(142, 115, 115);
padding: 100px;
padding-left:10px;
border-spacing: 3px;
}
#tableStyles th{
border: 1px solid rgb(73, 88, 108);
padding:10px;
text-align:center;
}
#tableStyles tr {
border-top: 1px solid rgb(72, 72, 61);
border-bottom: 1px solid rgb(72, 72, 61);
}
#tableStyles td {
border-left: 1px solid rgb(72, 72, 61);
border-right: 1px solid rgb(72, 72, 61);
text-align:center;
padding:10px;
}

#skyline{
width:100%;
background-color:rgb(0, 0, 0);
}




a.current{
color:rgb(185, 156, 117) !important;
font-size:105%;
}


a{
color:rgb(99, 121, 101)!important;
text-decoration:none!important;       
font-size:90%;
}

a:hover{
color:rgb(156, 138, 116) !important;
text-decoration:none;
}



#error{
color:rgba(255, 119, 0, 0.899);
}










#concept-large{
color:rgb(112, 210, 223);
font-size:30px;
}

#concept{
color:rgb(164, 130, 71);
font-size:18px;
}


#concept2-div{
border-bottom: 2px solid rgb(112, 1, 1);
padding-bottom:1px;
margin-bottom:10px;
}


#concept2{
font-family: "Times New Roman", cursive !important;
color:rgb(255, 252, 246);
font-size:25px;
}

#concept25px{
font-family: "Times New Roman", cursive !important;
color:rgb(255, 252, 246);
font-size:25px;
}









#concept-large-brown{
color:rgb(171, 159, 151);
font-size: 200%;
font-weight: 700;
}

#blog-article-div{
margin-top:30px;
padding-top:1px;
border-bottom: 2px solid rgb(66, 65, 65);
padding-bottom:50px;
}

#blog-article-div h3{
text-align: center;
color:rgb(109, 109, 109)!important;
}

/*
#blog-article-div sup a:hover{/*the sups are not tagged with links anymore 12-7-25..
color:rgb(21, 255, 0)!important;
}
*/

#blog-article-div sup {
font-size:50%!important;
color:rgb(146, 20, 20)!important;
}

#blog-article-div ol li::marker {
color:rgb(78, 5, 5)!important;
font-size:60%!important;
font-weight: bold;
}


#blog-article-div ul li:hover::marker {
font-weight: bold;
color:rgb(154, 117, 16)!important;
}

#blog-article-div ol li:hover::marker {
font-size:200%;
font-weight: bold;
color:rgb(154, 117, 16)!important;
}


#ol-links-div sup {
font-size:50%!important;
color:rgb(18, 81, 168)!important;
}

#ol-links-div ol li::marker {
color:rgb(11, 54, 124)!important;
font-size:60%!important;
font-weight: bold;
}


#ol-links-div ol li:hover::marker {
font-size:200%;
font-weight: bold;
color:rgb(16, 101, 154)!important;
}

#ol-links-div{
padding-top:1rem;
padding-bottom:1rem;

overflow-wrap: break-word;
}

#ol-links-div a:hover{
color:rgb(18, 81, 168)!important;
}





/*all sups*/
sup {
font-size:50%!important;
color:rgb(18, 81, 168)!important;
}
/*all markers */
#ol li::marker {
color:rgb(11, 54, 124)!important;
font-size:60%!important;
font-weight: bold;
}
/*all marker hovers*/
#ol li:hover::marker {
font-size:200%;
font-weight: bold;
color:rgb(154, 117, 16)!important;
}



#otherStoriesDiv a{
color:rgba(56, 142, 218, 0.638)!important;
font-size:90%;
font-weight: 600;
}

#otherStoriesDiv{
color:rgb(139, 139, 139)!important;
font-size:90%;
font-weight: 600;
}

#outsideLink{
color:rgba(82, 174, 255, 0.853)!important;
}

#outsideLink:hover{
color:rgb(179, 148, 62) !important;
text-decoration:underline!important;
} 




#font1{
/*font-family: Verdana, sans-serif;*/
font-family: Helvetica, sans-serif;
color:rgba(151, 149, 146, 0.932)!important;
font-size:95%;
}



#font2{
/*font-family: Verdana, sans-serif;*/
font-family: Helvetica, sans-serif;
color:rgba(151, 149, 146, 0.932)!important;
font-size:130%;
}

#screencap-spacing{
filter: brightness(90%) saturate(100%);
margin-top:25px;
margin-bottom:150px;

 &:hover {
 filter: brightness(120%) saturate(150%);



}
}


#arg2{
color:rgb(121, 141, 166)!important;
}





#inline-code-span{
background-color:rgba(31, 136, 149, 0.552);
border-radius:5px;
padding:3px;
}

#inline-code-span2{
background-color:rgba(45, 45, 45, 0.552);
border-radius:1px;
padding:3px;
color:rgb(42, 220, 255);
 font-family: "Courier New", "Lucida Console", monospace!important;
}

#inline-code-span-cisco{
background-color:rgba(28, 28, 28, 0.552);
border-radius:1px;
padding:3px;
color:rgb(210, 214, 15);
 font-family: "Courier New", "Lucida Console", monospace!important;
font-size:110%;
}

#markupGridContainer{
display: grid;
grid-template-columns: 1fr 1fr;	
margin-top:10rem;

border-top: 1px solid rgb(104, 70, 102);
}

#markupGridLeft{
margin-top:5rem;/*should match other*/
grid-column:1 / 2;
width:100%;
border: 1px solid rgb(104, 70, 102);
border: 1px solid rgb(0, 0, 0);
padding: 20px;
}


#markupGridRight{
margin-top:5rem;/*should match other*/
grid-column:2/3;
width:100%;
border: 1px solid rgb(97, 78, 62);
border: 1px solid rgb(0, 0, 0);
padding: 20px;
}

.language-markdown{
text-align:left!important;
font-size:200%
}