@charset "utf-8";

@font-family: Tahoma, Verdana, Arial;
@font-size: 12px;
@color: #333;

@hdr-font-family: Georgia;

@gray: #dadada;
@blue: #2e83ff;

.default-font {
    font-family: @font-family;
    font-size: @font-size;
    color: @color;
}

body {
    .default-font;
    margin: 0;
    padding:0;
    background: #fff;
    background: url(../images/background-alt.jpg) repeat-x center; 
    width: 100%;
    line-height: 2em;
}

header {
    height: 30px;
}

section {
    padding-top: 20px;
    
    & > div {
        margin-top: 7%;
        padding: 20px 30px;
        box-shadow: 0px 1px 5px #8E8E8E;
        border-radius: 10px;
        background: #ffffff;
    }

    form {
        
        label {
            font-size: 1.2em;
            width: 20%;
            display: inline-block;
        }
        
        input {
            width: 75%;
            padding: 8px;
            border: 1px solid @gray;
            
            &[type=submit] {
                width: auto;
            }

            &:focus {
                border-color: @blue;
            }

            &[type="radio"], &[type="checkbox"] {
                width: 30px;
            }
        }
        
        a {
            &:link, &:visited {
                color: #fff;
                font-size: 10px;
                font-style: italic;
                font-weight: bold;
                text-decoration: none;
            }
            
            &:hover {
                color: #000;
            }
        }
        
        div.msg, div.ui-state-error {
            clear: both;
            padding: 6px;
            
            span.ui-icon {
                float: left;
                margin-top: 5px;
                margin-right: 10px;
            }
        }
    }
}

footer {
    margin-top:8%;
    border-top: 3px solid #8A8A8A;

    div.line {
        padding-top: 20px;
        color: darken(@gray, 40%);
        font-size: 1em;
    }
}