#ppb {
width: auto;
height: auto;
position: fixed!important;
margin-left: 10px;
margin-right: 10px;
background-color: none;
color: #fff;
z-index: 9999;    display: none;
} .Sidebar-Btn a {
position: fixed!important;
top: 50%;
transition: 0.3s;
padding: 0px 7px 0px 10px;
width: auto;
text-decoration: none;
text-align: right;
font-size: 20px;
color: #fff;
border-radius: 0;
z-index: 9999;
background-color: var(--dynamic-color-value);
}
.hideSidebar-Btn { display: none;	
} :root {
--dynamic-width-value: -70px;
--dynamic-color-value: #a31b00;
--dynamic-hov-color-value: #125924;
--dynamic-txt-color-value: #fff;
--dynamic-font-art-value: ;
--dynamic-bg-color-value: #bd2615;
} .item1_content, .item2_content {
font-family: var(--dynamic-font-art-value), Calibri;		
}
.Sidebar-Btn_left a {
left: var(--dynamic-width-value);
}
.Sidebar-Btn_right a {
right: var(--dynamic-width-value);
}
.Sidebar-Btn_left_hover a:hover {
left: 0; 
background-color: var(--dynamic-hov-color-value);
color: var(--dynamic-txt-color-value);
}
.Sidebar-Btn_right_hover a:hover {
right: 0;
background-color: var(--dynamic-hov-color-value);
color: var(--dynamic-txt-color-value);
}
.Sidebar-Btn {
background-color: var(--dynamic-color-value);
}
.Sidebar-Btn:hover {
background-color: var(--dynamic-hov-color-value);
}
.Sidebar-Btn a table, th, td {
border:none !important;
}
.Sidebar-Btn table td {
text-align: left;	
}
.grid-container {
display: grid;
grid-gap: 0;
padding: 0px;
text-align: center;
}
.item2 {
grid-column: 2;
grid-row: 1 / span 2;
display: flex;
align-items: center; 
padding: 0px 0px 0px 10px;
} .arrow {
border: solid var(--dynamic-txt-color-value);
border-width: 0px 5px 5px 0px;
display: inline-block;
margin: 0px 0px 0px 0px;
padding: 7px;
} .item2_right_side {
grid-column: 1;
padding: 0px 10px 0px 0px;
}
.Sidebar-Btn_right_side a {
right: -70px;  
}
.Sidebar-Btn_right_side a:hover {
right: 0;
}
.item1_right_side {
grid-column: 2;
}
.item3_right_side {
grid-column: 2;
}
.arrow_right_side {
border-width: 5px 0px 0px 5px;
} .side {
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
}  .close-container {
position: absolute;
right: -45px; 
top: 0px;
margin: 0;
width: 35px;
height: 32px;
margin: 0px;
cursor: pointer;
background-color: #D90614;
}
.leftright {
height: 4px;
width: 35px;
position: absolute;
margin-top: 14px;
background-color: #FFF;
border-radius: 2px;
transform: rotate(45deg);
transition: all .3s ease-in;
}
.rightleft {
height: 4px;
width: 35px;
position: absolute;
margin-top: 14px;
background-color: #FFF;
border-radius: 2px;
transform: rotate(-45deg);
transition: all .3s ease-in;
}
.close {
margin: 10px 0 0 5px;
position: absolute;
}
.close-container:hover .leftright {
transform: rotate(-45deg);
background-color: #bd2615;
}
.close-container:hover .rightleft {
transform: rotate(45deg);
background-color: #bd2615;
}
.close-container:hover label {
opacity: 1;
}
.close-container:hover {
background: transparent;
}  .mdRech {
display: none; position: fixed!important;
top: 0;
left: 0;
margin: 0px;
padding: 0px;
width: 100vw!important;
height: 100vh!important;
background-color: rgba(0, 0, 0, 0.5); z-index: 99999!important;
justify-content: center;
align-items: center;
} .md-cnt {
background-color: #fff;
padding: 20px;
border-radius: 8px;
border: 4px solid #d4710f;
width: 80%;
max-width: 500px;
text-align: center;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
} .cls-btn-rech {
position: absolute;
top: 10px;
right: 15px;
font-size: 20px;
color: #333;
cursor: pointer;
}
.md-cnt p a {
text-decoration: none!important;
}
.md-cnt p a:hover {
text-decoration: underline!important;
} @media only screen and (max-width: 600px) {
#ppb {
width: 50%;
height: 50%;
top: 40%;
}
}