body {
      background-color: #fff;
      color: #c9d1d9;
      font-family: Arial, sans-serif;
      margin: 0;
      padding: 0;
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
    }
    .container {
   max-width: 800px;
margin-bottom:10px ;
margin-top:10px;
margin-left:auto;
margin-right:auto;
      padding: 0px;
    }

    .tab {
      background-color: #2d2d2d;
      color: #ffffff;
      font-size: 1rem;
      padding-top: 7px;
		padding-bottom: 10px;
		padding-left: 20px;
		padding-right:20px;
      border-radius: 8px 8px 0 0;
      display:  inline-block;
      align-items: center;
      margin:0;
      font-family: monospace;
	    border: 2px solid #2d2d2d;
			    box-shadow:
  0 0 0 5px #2d2d2d,
  0 0 0 7px #FAE7A4;
    }
    .tab img {
      width: 24px;
      height: 24px;
      margin-right: 10px;
    }
	.tab span{
		position:relative;
		vertical-align:top;
	}
    .code-wrapper {
      background-color: #282c34;
      border-radius: 0 0 8px 8px;
      border: 2px solid #2d2d2d;
      padding: 0px;
      position: relative;
      overflow: auto;
	    box-shadow:
  0 0 0 5px #2d2d2d,
  0 0 0 7px #FAE7A4
    }
    pre {
      margin: 0;
      font-size: 1rem;
    }
    .ad-title {
      background-color: #ff4757;
      color: #ffffff;
      padding: 15px 20px;
      border-radius: 8px;
      font-weight: bold;
      font-size: 1.2rem;
      display: flex;
      align-items: center;
      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.5);
      writing-mode: horizontal-tb;
      position: absolute;
      top: 50%;
      right: -200px;
      transform: translateY(-50%);
    }
    .ad-title::before {
      content: '';
      position: absolute;
      right: 100%;
      top: 50%;
      transform: translateY(-50%);
      border-width: 10px;
      border-style: solid;
      border-color: transparent #ff4757 transparent transparent;
    }

    .snippet-title {
		
	font-family:monospace,sans-serif;	 
      font-size: 1.8rem;
      color: #58a6ff;
      margin-bottom: 20px;
margin-top:0px;
    }
	
	.file-title{
		 font-size: 1.2rem;
	}


.hljs-ln-n {	

 color: #ccc;
		
   vertical-align: top;
    padding-right: 3px;
     margin-right:10px;
    border-right: 1px solid #CCC;


 }

  .hljs-ln-n::before{
  display: inline-block;
  width: 2em; 
  text-align: right;
  margin-right: 0.5em; 
  color: #999; 
}  


/* for block of code */
    .hljs-ln-code {
    padding-left: 10px;
	
    }

.output-class{
	margin-top:10px;
	margin-left : 25px; 
}