/* sign in FORM */

#portfolio{

    width:412px;

    margin:10vh auto;

    background-color: transparent !important;

    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);

  transition: all 0.3s cubic-bezier(.25,.8,.25,1);

}

#portfolio h3{

 font-size: 2rem;

 letter-spacing: -1.42px;

 line-height: 64px;

 opacity: 0.8916015625;

}

#portfolio form {

    width: 100%;

    max-width: 410px;

    padding: 15px;

    margin: auto;

}

#portfolio .form-control {

    position: relative;

    box-sizing: border-box;

    height: auto;

    padding: 11px;

    font-size: 16px;

}

#portfolio .form-control {

    background-color:#202020;

    border: thin solid #202020;

}

.modal .cancel{

  color: white !important;
  opacity: 0.5449451264880952;
  
}

#portfolio .form-control:focus { z-index: 2; }

#portfolio .form-signin input[type="email"] {

    margin-bottom: -1px;

    border-bottom-right-radius: 0;

    border-bottom-left-radius: 0;

}

#portfolio .form-signin input[type="password"] {

    border-top-left-radius: 0;

    border-top-right-radius: 0;

}



#portfolio .social-login{

    width:390px;

    margin:0 auto;

    margin-bottom: 14px;

}

#portfolio .social-btn{

    font-weight: 100;

    color:white;

    width:190px;

    font-size: 0.9rem;

}



#portfolio a{

    display: block;

    padding-top:10px;

    color:lightseagreen;

}



#logreg-form .lines{

    width:200px;

    border:1px solid red;

}





#portfolio button[type="submit"]{ margin-top:10px; }



#portfolio .facebook-btn{  background-color:#3C589C; }



#portfolio .google-btn{ background-color: #DF4B3B; }



#portfolio .form-reset, #portfolio .form-signup{ display: none; }



#portfolio .form-signup .social-btn{ width:210px; }



#portfolio .form-signup input { margin-bottom: 2px;}



.form-signup .social-login{

    width:210px !important;

    margin: 0 auto;

}



/* Mobile */



@media screen and (max-width:500px){

    #portfolio{

        width:300px;

    }

    

    #portfolio  .social-login{

        width:200px;

        margin:0 auto;

        margin-bottom: 10px;

    }

    #portfolio  .social-btn{

        font-size: 1.3rem;

        font-weight: 100;

        color:white;

        width:200px;

        height: 56px;

        

    }

    #portfolio .social-btn:nth-child(1){

        margin-bottom: 5px;

    }

    #portfolio .social-btn span{

        display: none;

    }

    #portfolio  .facebook-btn:after{

        content:'Facebook';

    }

  

    #portfolio  .google-btn:after{

        content:'Google+';

    }

    

}