#popup{  
    width:270px;
    min-height:300px;;
    border:1px solid white;
    background-color:white;
    top:20%;
    padding: 0 60px 40px 60px;
    position:relative;
    margin: 0 auto;
    font-size:13px !important;
    text-align:left;
    background: rgb(247, 247, 247);
    border: 1px solid rgba(147, 184, 189,0.8);
    -webkit-box-shadow: 0pt 2px 5px rgba(105, 108, 109,  0.7),	0px 0px 8px 5px rgba(208, 223, 226, 0.4) inset;
    -moz-box-shadow: 0pt 2px 5px rgba(105, 108, 109,  0.7),	0px 0px 8px 5px rgba(208, 223, 226, 0.4) inset;
    box-shadow: 0pt 2px 5px rgba(105, 108, 109,  0.7),	0px 0px 8px 5px rgba(208, 223, 226, 0.4) inset;
    -webkit-box-shadow: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    opacity:1;
}
#popup_social{  
    width:290px;
    min-height:220px;;
    border:1px solid white;
    background-color:white;
    top:20%;
    padding: 0 20px 40px 20px;
    position:relative;
    margin: 0 auto;
    font-size:13px !important;
    text-align:left;
    background: rgb(247, 247, 247);
    border: 1px solid rgba(147, 184, 189,0.8);
    -webkit-box-shadow: 0pt 2px 5px rgba(105, 108, 109,  0.7),  0px 0px 8px 5px rgba(208, 223, 226, 0.4) inset;
    -moz-box-shadow: 0pt 2px 5px rgba(105, 108, 109,  0.7), 0px 0px 8px 5px rgba(208, 223, 226, 0.4) inset;
    box-shadow: 0pt 2px 5px rgba(105, 108, 109,  0.7),  0px 0px 8px 5px rgba(208, 223, 226, 0.4) inset;
    -webkit-box-shadow: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    opacity:1;
}
#signup{
    position:absolute;
    top:0px;
    visibility:hidden;
    background-color:black;
    opacity:.95;
    left:0px;
    height:100%;
    width:100%;
    text-align:center;
}
#signup:target{
    visibility:visible;
    -webkit-animation: fade 400ms ease;
}
#signup:target > #popup{
    -webkit-animation: moveFromBottom 400ms ease;
}
#loginAuth{
    position:absolute;
    top:0px;
    visibility:hidden;
    background-color:black;
    opacity:.95;
    left:0px;
    height:100%;
    width:100%;
    text-align:center;
}
#loginAuth:target{
    visibility:visible;
    -webkit-animation: fade 400ms ease;
}
#loginAuth:target > #popup{
    -webkit-animation: moveFromBottom 400ms ease;
}


#loginAuthSocial{
    position:absolute;
    top:0px;
    visibility:hidden;
    background-color:black;
    opacity:.95;
    left:0px;
    height:100%;
    width:100%;
    text-align:center;
}
#loginAuthSocial:target{
    visibility:visible;
    -webkit-animation: fade 400ms ease;
}
#loginAuthSocial:target > #popup{
    -webkit-animation: moveFromBottom 400ms ease;
}

.div-social{
    clear: both;
}
.div-social span{
    margin: 40px 0 0 60px;
    font-weight: bold;
    font-size: 14px;
}
.loginSocial a {
    display: block;
    width: 250px;
    float: left;
    background-color: #E4E4E2;
    color: #777;
    padding: 15px 5px 15px 5px;
}
.loginSocial a:hover {
    background-color: #ccc;
    text-decoration: none;
}
.loginSocial a {
    position: relative;
    -webkit-transition: all linear 200ms;
    -moz-transition: all linear 200ms;
    -o-transition: all linear 200ms;
    transition: all linear 200ms;
    margin: 20px 0;
}
.loginSocial a img {
    border: none;
    display: block;
    filter: alpha(opacity=0);
    opacity: 0;
    position: absolute;
    top: 0;
    -webkit-transition: all linear 200ms;
    -moz-transition: all linear 200ms;
    -o-transition: all linear 200ms;
    transition: all linear 200ms;
}

.loginSocial a img:first-child,
.loginSocial a:hover img:first-child + img {
    opacity: 1;
    filter: alpha(opacity=100);
}

.loginSocial a:hover img{
    -webkit-box-shadow: 0 0 6px #333;
    -moz-box-shadow: 0 0 6px #333;
    box-shadow: 0 0 6px #333;
}


.login {
    padding:30px;
    margin-top:30px;
}
.login label{
    font-size:25px;
    font-family:sans-serif;
}
.close_button{
    position:absolute;
    right:1px;
    cursor:pointer;
    border:none;
    margin-top:-25px;
}
        @-webkit-keyframes fade
        {
            from {
               
               
                
                opacity: 0;
            }
            to {
                
                
                opacity: 1;        
            }
        }
        
        
        @-webkit-keyframes moveFromBottom
        {
            from {
               
               
                -webkit-transform: scale(.5);
                opacity: 0;
            }
            to {
                
                -webkit-transform: scale(1);
                opacity: 1;        
            }
        }
        
        
        @-moz-keyframes fade
        {
            from {
               
               
                
                opacity: 0;
            }
            to {
                
                
                opacity: 1;        
            }
        }
        
        
        @-moz-keyframes moveFromBottom
        {
            from {
               
               
                -webkit-transform: scale(.5);
                opacity: 0;
            }
            to {
                
                -webkit-transform: scale(1);
                opacity: 1;        
            }
        }
        
        
        @-ms-keyframes fade
        {
            from {
               
               
                
                opacity: 0;
            }
            to {
                
                
                opacity: 1;        
            }
        }
        
        
        @-ms-keyframes moveFromBottom
        {
            from {
               
               
                -webkit-transform: scale(.5);
                opacity: 0;
            }
            to {
                
                -webkit-transform: scale(1);
                opacity: 1;        
            }
        }
        
        
        @-o-keyframes fade
        {
            from {
               
               
                
                opacity: 0;
            }
            to {
                
                
                opacity: 1;        
            }
        }
        
        
        @-o-keyframes moveFromBottom
        {
            from {
               
               
                -webkit-transform: scale(.5);
                opacity: 0;
            }
            to {
                
                -webkit-transform: scale(1);
                opacity: 1;        
            }
        }
        
         @keyframes fade
        {
            from {
               
               
                
                opacity: 0;
            }
            to {
                
                
                opacity: 1;        
            }
        }
        
        
        @keyframes moveFromBottom
        {
            from {
               
               
                -webkit-transform: scale(.5);
                opacity: 0;
            }
            to {
                
                -webkit-transform: scale(1);
                opacity: 1;        
            }
        }