@media only screen and (max-width: 600px) {
  /* Styles for small screens go here */
  body {
  overflow-x: hidden;
}

}

.warpper-html-content-home4k{
 width: 120%;
 
 }
 .warpper-Html-HomePagephj{
    display: block;
     width: 86.8%;
     margin-right: -1500px;
     margin-left:5px;
     
    }
 
@media all and (min-width:1000px) {
    
    .warpper-html-content-home4k{
 width: 130%;
 
 }
  .simple-Content2{
    padding: 10px;
    font-size: 18px;
}
 .warpper-Html-HomePagephj{
    display: block;
     width: 86.8%;
     margin-right: -10px;
     margin-left:85px;
     
    }
}

 .section_rightCode {
      display: block;
      background-color: var(--bs-codeEditor-outside);
      width: 100%;
      box-shadow: -5px -5px 10px rgba(0, 0, 0, 0.1),
          5px 5px 10px rgba(0, 0, 0, 0.1);
      border-radius: 5px;
      padding: 10px 20px;
      padding-bottom: 20px;
      color: var(--bs-black);
      /* background-color: red; */
  }
 .warpper-html-content-home4k{
 width: 120%;
 
 }
 .warpper-Html-HomePagephj{
    display: block;
     width: 86.8%;
     margin-right: -100px;
     margin-left:1px;
     
    }
 
@media all and (min-width:1000px) {
    
    .warpper-html-content-home4k{
 width: 130%;
 
 }
  .simple-Content2{
    padding: 10px;
    font-size: 18px;
}
 .warpper-Html-HomePagephj{
    display: block;
     width: 86.8%;
     margin-right: -10px;
     margin-left:85px;
     
    }
}

.w3-black, .w3-hover-black:hover {
    color: #fff!important;
    background-color: #000!important;
}
.w3-example .w3-btn, .w3-example .ws-btn {
  background-color:#04AA6D!important;
  border-radius:5px;
  font-size: 17px;
  font-family: 'Source Sans Pro', sans-serif;
  padding:6px 18px;
  color: #FFFFFF;
}

.w3-btn, .w3-btn:link, .w3-btn:visited {
    color: #FFFFFF;
    background-color: #4CAF50;

}
.w3-btn,.w3-button{border:none;display:inline-block;padding:8px 16px;vertical-align:middle;overflow:hidden;text-decoration:none;color:inherit;background-color:inherit;text-align:center;cursor:pointer;white-space:nowrap}
.w3-example {
    background-color: #E7E9EB;
    border-radius: 5px;
    padding: 0.01em 16px;
    margin: 20px 0;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12)!important;
}
.w3-code {
    width: auto;
    background-color: #fff;
    color: #000;
    padding: 8px 12px;
    border-left: 4px solid #4CAF50;
    word-wrap: break-word;
    margin-top: 16px!important;
    margin-bottom: 16px!important;
    }
    .w3-code a {
    color: #fff!important;
    text-decoration : none;
    }
    
    .w3-margin-bottom {
    margin-bottom: 16px!important;
    }
    
  #dtref td:nth-child(1) {
  font-family: Consolas,"courier new";
  font-size: 110%;
}  
.ws-table-all {border:1;border-spacing:0;width:100%;display:table;border:1px solid #ccc}
.ws-table-all tr {border-bottom:1px solid #ddd}
.ws-table-all tr:nth-child(odd) {background-color:#fff}.ws-table-all tr:nth-child(even){background-color:#E7E9EB}
.ws-table-all td,.ws-table-all th {padding:8px 8px;display:table-cell;text-align:left;vertical-align:top}
.ws-table-all th:first-child, .ws-table-all td:first-child{padding-left:16px}
.w3-btn, .w3-btn:link, .w3-btn:visited {color:#FFFFFF;background-color:#4CAF50}
a.btnsmall {
  background-color:#04AA6D!important;
  color:white;
  border-radius:5px;
}

@media only screen and (max-width: 500px) {
#main {padding:24px;padding:16px}
h1 {
  font-size: 20px;
}
h2 {
  font-size: 20px;
}
.w3-example {
  padding: 8px 16px;
  margin: 24px -16px;
}
#w3-exerciseform {
  padding: 8px 16px 16px 16px;
  margin: 24px -16px;
}
/*.w3-panel,.w3-info {*/
.w3-note,.w3-info,.w3-warning {
  margin-left:-16px;
  margin-right:-16px;
  padding-left:16px!important;
  padding-right:16px!important;
}

}

#w3-exerciseform {background-color:#282A35;padding:16px;color:#ffffff;border-radius:5px;}
#w3-exerciseform .exercisewindow {background-color:#ffffff;padding:16px;color:#000000;}
#w3-exerciseform .exerciseprecontainer {background-color:#E7E9EB;padding:16px;font-size:120%;font-family:Consolas,Menlo,"Courier New", Courier, monospace;overflow:auto;}
#w3-exerciseform .exerciseprecontainer pre[class*="language-"] {padding:1px;}
#w3-exerciseform .exerciseprecontainer pre {display: block;}
#w3-exerciseform .exerciseprecontainer textarea {width:100%;border:none;overflow:hidden}
#w3-exerciseform .exerciseprecontainer input {padding:1px;border: 1px solid transparent;height:1.3em;}
#w3-exerciseform .w3-btn {background-color:#04AA6D;border-radius:5px;font-size: 17px;font-family: 'Source Sans Pro', sans-serif;padding:7px 18px;}

.w3-pale-red,.w3-hover-pale-red:hover{color:#000!important;background-color:#ffdddd!important}

/*@media only screen and (max-device-width: 480px) {*/
@media only screen and (max-width: 500px) {
    
/*.w3-panel,.w3-info {*/
.w3-note,.w3-info,.w3-warning {
  margin-left:-16px;
  margin-right:-16px;
  padding-left:16px!important;
  padding-right:16px!important;
}

}

.w3-note, .w3-warning {
  margin-top: 24px;
  margin-bottom: 24px;
  margin-left:-32px;
  margin-right:-32px;
  padding:16px 32px;
}
.w3-note{background-color:#ffffcc;border-left:6px solid #ffeb3b}
.w3-warning{background-color:#ffdddd;border-left:6px solid #f44336}
.w3-info{background-color:#04AA6D;border-left:6px solid #4CAF50}
.w3-codespan{color:crimson;background-color:#f1f1f1;padding-left:4px;padding-right:4px;font-size:106%}
.w3-codespan-blue{color:blue;background-color:#f1f1f1;padding-left:4px;padding-right:4px;font-size:106%}
.w3-codespan-green{color:green;background-color:#f1f1f1;padding-left:4px;padding-right:4px;font-size:106%}