.sidepanel {
width: 600px;
position: fixed;
z-index: 100000;
height: 100%;
top: 0;
right: 0;
overflow-x: hidden;
transition: 0.5s;
padding-top: 30px;
background: url('../img/bg-siedepanel.png') repeat-y;
background-position: top left;
color: #fff !important;
display: none;
}
.sidepanel a {
color: #fff !important;
}
.sidepanel-pd {
width: 100%;
padding: 30px;
padding-top: 0px;
padding-left: 60px;
}
.sidebar-pd-clx {
width: 16px;
float: right;
color: #fff;
cursor: pointer;
margin-top: 0px;
margin-right: -5px;
z-index: 10000;
}
.sidepanel h2 {
font-size: 22px;
}
.ex-enter-a {
margin-top: 15px;
padding-top: 18px;
padding-left: 17px;
padding-bottom: 13px;
border-top: 1px solid #333;
border-bottom: 1px solid #333;
}
.ex-enter-a-next {
padding-top: 18px;
padding-bottom: 15px;
padding-left: 12px;
border-bottom: 1px solid #333;
}
.ext:hover {
background: #111;
}

@keyframes slide1 {
0%,
100% {
transform: translate(0, 0);
}
50% {
transform: translate(5px, 0);
}
}

@media (max-width: 768px) {
.sidepanel {
width: 350px !important;
}
.sidepanel h2 {
font-size: 14px;
font-weight: 700;
}
.ex-enter-a a, .ex-enter-a-next a {
font-size: 12px;
}
}