h1 {
  animation-duration: 3s;
  animation-name: slidein;
  
}

@keyframes slidein {
  from {
    margin-right: 300%;
    width: 300%
  }

  to {
    margin-right: 100%;
    width: 100%;
  }
}



            .header{
                background-color: #808080;
                height: 100px;
                border: 0px black solid;
               box-shadow:10px 10px 16px #000; 
             
            }
            .menu{
                background-color: #808080;
                height: 60px;
                direction: rtl;
                border: 0px black solid;
               border-radius: 15px;
            }
            .enteruser{
                background-color: #808080;
                height: 60px;
                border: 1px black solid;
            }
            a:hover{color:#e91414;background-color:#77d5f7;text-decoration: none;font-size:130% }
             .right{
                background-color: #FF66CC;
                height: 100px;
                border: 1px black solid;
                width: 600px;
                float: right;
            }
            
            .proboxtitle, .proboxcontent, .proboxmain{
    position:relative;
}
.proboxtitle{
    width:190px;    
    height:30px;
    overflow:hidden;
 
    display:block;
    cursor:pointer;
    background-color:#B0C4DE;
  
    color:#FFF;
    direction:rtl;
    padding:0px;
    text-align:center;
  
}
.proboxcontent{
    width:190px;    
    height:auto;
    text-align: center; 
    display:none;
    background-color:#B0C4DE;
    padding:10px;
    direction:rtl;
    overflow:scroll;
}
.proboxmain{
    border:1px solid #F0F0F0;
    width:190px; 
 background-color:#B0C4DE;
    
}
 .test
{
 color:red;
 font-size:120%;
}