@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,700);

*{margin:0;padding:0;}

body{
    background:#fff;
    font-family:'Open Sans',sans-serif;
}

.button{
    width:100px;
    background:#3399cc;
    display:block;
    margin:0 auto;
    margin-top:1%;
    padding:10px;
    text-align:center;
    text-decoration:none;
    color:#fff;
    cursor:pointer;
    transition:background .3s;
    -webkit-transition:background .3s;
}

.button:hover{
    background:#2288bb;
}

#login{
    width:400px;
    margin:0 auto;
    margin-top:8px;
    margin-bottom:2%;
    transition:opacity 1s;
    -webkit-transition:opacity 1s;
    border:1px solid grey;

}

#triangle{
    width:0;
    border-top:12x solid transparent;
    border-right:12px solid transparent;
    border-bottom:12px solid #3399cc;
    border-left:12px solid transparent;
    margin:0 auto;
}

#login h1{
    background:#f9f9f9;
    padding:20px 0;
    font-size:140%;
    font-weight:300;
    text-align:center;
    color:#blue;
    -webkit-border-bottom-right-radius: 5px;
    -webkit-border-bottom-left-radius: 30px;
    -moz-border-radius-bottomright: 5px;
    -moz-border-radius-bottomleft: 30px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 30px;
}

form{
    background:#f0f0f0;
    padding:6% 4%;

}

input[type="text"],input[type="password"]{
    width:92%;
    background:#fff;
    margin-bottom:4%;
    border:1px solid #ccc;
    padding:4%;
    font-family:'Open Sans',sans-serif;
    font-size:95%;
    color:#555;
}

input[type="submit"]{
    width:100%;
    background:#3399cc;
    border:0;
    padding:4%;
    font-family:'Open Sans',sans-serif;
    font-size:100%;
    color:#fff;
    cursor:pointer;
    transition:background .3s;
    -webkit-transition:background .3s;
}

input[type="submit"]:hover{
    background:#2288bb;
}