#ppb {
width: auto;
height: auto;
position: fixed!important;
margin-left: 10px;
margin-right: 10px;
background-color: none;
color: #fff;
display: none;
z-index: 9999;    
} .Sidebar-Btn a {
position: fixed!important;
top: 50%;
transition: 0.3s;
padding: 10px 7px 10px 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;
white-space: nowrap!important;
}
.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 15px 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;
} @media only screen and (max-width: 600px) {
#ppb {
width: 50%;
height: 50%;
top: 40%;
}
}