@import url("https://fonts.googleapis.com/earlyaccess/droidarabickufi.css");

html, body
{
    height: 100%;
    background-color: #2B416C;    
}

body
{
    font-family: droid arabic kufi;
    /*min-width: 600px;
    width: auto !important;*/
}

/* Login */
#wrapper
{
    /*background-color: #17334C;*/
    height: 100%;
}

/* Login Header */
.header
{
    margin-top: 50px;
    height: 215px;
    text-align: center;
}

    .header .logo
    {
        text-align: center;
    }

        .header .logo img
        {
            height: 105px;
        }

    .header .title
    {
        margin-top: 16px;
        padding: 0 20px;
        font-size: 12pt;
        color: #CBD7F1;
    }
    
        .header .title .app-title
        {
            color: #C48A58;
            font-size: 15pt;
        }

@media (min-width: 768px)
{
    .header .title
    {
        font-size: 20pt;
    }
}

/* Login Body */
.content
{
    height: 300px;
}

.content-container
{
    /*min-height: 300px;
    width: 500px;
    margin: 60px auto -40px;*/
    background-color: white;
    border-radius: 10px;
}

    .content-container .logo
    {
        text-align: center;
        padding: 20px;
    }

        .content-container .logo .logo-icon
        {
            font-size: 32pt;
        }

        .content-container .logo .logo-text
        {
            font-size: 14pt;
            font-weight: bold;
        }

    .content-container .login-textbox
    {
        /*text-align: center;*/
        margin: 20px 0;
        text-align: center;
    }

    .content-container .login-button
    {   
        text-align: center;     
        margin-bottom: 20px;
    }

/* Login Footer */
.login-footer
{
    color: #CBD7F1;
    height: 40px;
    padding: 10px 0;
    margin-top: 40px;
    text-align: center;
    width: 100%;
    background-color: #2B416C;
}

@media (min-height: 700px)
{
    /* Login Footer */
    .login-footer
    {
        left: 0;
        bottom: 0;
        position: absolute;
    }
}