@keyframes sitemove {
  from {left :-400px} 
  to { left : 0px}
}

@keyframes sitemoveout {
  from {left :0px} 
  to { left : -400px}
}
/*
  from {transform:scale(0)} 
  to {transform:scale(1)}
*/


/*-------- Site --------*/
dt hr
{
  margin:0 0 16px 0;
}

dd dl
{
  margin-left:8px;
}

dd dl dt
{
  margin-bottom:12px;
}

dl
{
  margin-bottom:0;
}

dd a
{

}

dd a:hover
{
  color:var(--pam-primary-light);
}

dd a:active
{
  color:var(--pam-primary-light);
}

dd a:focus
{
  color:var(--pam-primary-light);
}

dt a
{
  
}

dt a:hover
{
    color:var(--pam-primary-light);
}

dt a:active
{
    color:var(--pam-primary-light);
}

dt a:focus
{
    color:var(--pam-primary-light);
}

#site2
{
  display:block;
  padding:0 16px; 
  width:280px;
}

.accordion-button
{
  padding:8px 16px;
}

.accordion-button:hover
{
  color:var(--pam-primary);
  font-weight:500;
  
  transition: 200ms ease;
}

.accordion-button:not(.collapsed) 
{
  background:white;
}




/* ----------- lg ----------- */
@media only screen and (min-width: 992px) 
{
 
  #overlay-1
{
  	display:none;
}

	#site1
{
  	display:none;
}
  
  	#site1 i
{
  	display:none;
}
  
  #site2
{
  display:block !important;
}
  
}
  


/* ----------- md ----------- */
@media only screen and (max-width: 991px) 
{
  
    #site1
{

  text-align:center;
 	display:block;
    margin-left:16px;
  width:40px; 
  height:40px; 
  border-radius:50%; 
  background:#252525;
  color:white;
  cursor: pointer;
  transition:opacity 400ms;
}
  
#site1:hover
{	
	opacity:0.6;
}
  
  #site2
{
 	display:none;
  
  	z-index:10001;
  	//position:relative;
  	position: fixed;
    top: 80px;
  
  	animation-name: sitemove;
    animation-duration: 0.3s;
}
  
  #overlay-1
  {
    display:none;
    position: fixed;
    z-index: 10000;
    height: 100%;
    width: 100%;
    background: black;
    opacity: 0.3;
    top: 0;
    left: 0;
    cursor: pointer;
  }
  
  
}
  


/* ----------- sm ----------- */
@media only screen and (max-width: 575px) 
{
  
  
  
  
}