.contentCard
{
    background-color:#e3e3e3;
    padding: 30px;
    border-radius: 10px;
    border: 3px solid grey;
    margin: auto;
    margin-top: 50px;
}

.messageCard
{
    background-color:#e3e3e3;
    padding: 10px;
    border-radius: 10px;
    border: 3px solid grey;
    margin: auto;
    margin-top: 50px;
}

.messageCard.error
{
    background-color: #ff737d;
}

.contentCard > .cardTitle
{
    background-color:#28C2FB;

    position: relative;
    top: -30px;
    left : -30px;
    width : calc(100% + 60px);
    padding : 10px 30px;
    border-radius: 7px 7px 0 0;
    font-size: 1.4em;
}

input:not([type=button]):not([type=reset]):not([type=submit]):not([type=image])
{
    border: 1px solid gray;
    margin-top : 5px;
    padding : 5px;
    border-radius : 5px;
    box-shadow:2px 2px 2px grey;
}

input:not([type=button]):not([type=reset]):not([type=submit]):not([type=image]):focus
{
    outline: 3px solid #28C2FB;
}

input[type=submit]
{
    margin-top : calc(1em + 5px);
    width : 100%;
    padding : 5px;
    margin-right : 0;
    background-color : #28C2FB;
    border-radius : 5px;
    box-shadow:2px 2px 2px grey;

    position:relative;
}

input[type=submit]:hover
{
    cursor:pointer;
    background-color:#299bdb;
}

input[type=submit]:active
{
    box-shadow:-2px -2px 2px grey;
}

.forgetPasswordLink
{
    font-size:0.8em;
    color:grey;
    width:100%;
    text-align: center;
    display: inline-block;
}

.noCompteLink
{
    font-size:1em;
    color:grey;
    width:100%;
    text-align: center;
    display: inline-block;
}

.forgetPasswordLink:hover, .noCompteLink:hover
{
    color:black;
}