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

html, body
{
    height: 100%;
}

body
{
    font-family: 'Open Sans', sans-serif;
    background: url('../imgs/pattern.jpg') #d8e3e8;
    text-align: center;
    color: #777;
}

.loginform
{
    width: 300px;
    max-width: 100%;
    margin: auto;
}

.loginformbox
{
    padding: 15px;
    background: #fff;
    position: relative;
    margin: 0 0 15px 0;
}

.loginform img
{
    max-width: 100%;
}


.toffset15
{
    margin-top: 15px;
}


.loginform input, .loginform button
{
    border-radius: 0 !important;
}

h3
{
    padding: 6px !important;
    margin: 15px -15px 0 -15px !important;
    font-weight: 300;
    background: #475162;
    color: #fff;
    position: relative;
    width: calc(100% + 30px);
}

h3:before, h3:after
{
    position: absolute;
    bottom: -15px;
    content: '0';
    font-size: 0;
    width: 0;
    height: 0;
    border-style: solid;

}

h3:before
{
    left: 0;
    border-width: 0 15px 15px 0;
    border-color: transparent #2b323d transparent transparent;
}

h3:after
{
    right: 0;
    border-width: 15px 15px 0 0;
    border-color: #2b323d transparent transparent transparent;
}


.loginform .btn-login
{
    background: #475162;
    border: 1px solid #2b323d;
    color: #fff !important;
}


.loginform .btn-login:hover
{
    background: #2b323d;
}

footer
{
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 6px;
    color: #a2adb2;
    font-size: 15px;
    line-height: 20px;
}
a
{
    color: #138496 !important;
}