/* --------------------------------------------------
   PTPT Platform
   Main Stylesheet
--------------------------------------------------- */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{

    font-family:Arial, Helvetica, sans-serif;
    background:linear-gradient(135deg,#0f2747,#183d68);
    color:#333;
    min-height:100vh;

    display:flex;
    justify-content:center;
    align-items:flex-start;

    padding:40px 30px;

}

.container{

    width:100%;
    max-width:520px;

    background:#ffffff;

    border-radius:18px;

    box-shadow:0 20px 45px rgba(0,0,0,.25);

    overflow:hidden;

    margin:30px auto;

    padding-bottom:25px;

    animation:fadeIn .7s ease;

}

@keyframes fadeIn {

    from {

        opacity: 0;

        transform: translateY(25px);

    }

    to {

        opacity: 1;

        transform: translateY(0);

    }

}

input[type="email"]{

    width:100%;

    padding:22px;

    font-size:1.4rem;

    border:2px solid #d9d9d9;

    border-radius:18px;

    outline:none;

    transition:.25s;

    box-sizing:border-box;

    box-shadow:0 2px 8px rgba(0,0,0,.05);
    
    margin-bottom:10px;

}

input[type="email"]::placeholder{

    font-size:1.0rem;
    
    color:#888;

}

input[type="email"]:focus{

    border-color:#2e8b57;

    box-shadow:0 0 0 5px rgba(46,139,87,.15);

}

button{

    width:100%;

    margin-top:0px;

    padding:14px;

    border:none;

    border-radius:10px;

    background:#2e8b57;

    color:#fff;

    font-size:18px;

    transition:.2s ease;
    
    cursor:pointer;

}

button:hover{

    transform:translateY(-2px);

    box-shadow:0 8px 18px rgba(0,0,0,.18);

}

button:active{

    transform:translateY(1px);

}