// load global styles
@import "global.less";

// header styles
.header-wrapper {
    background:url('../images/404-background.png') no-repeat scroll center bottom transparent !important;
    height: 390px;
    overflow: hidden;
    border-bottom: 1px solid #e9e9e9;

    .logotype {
        background:none transparent !important;
        margin-top: 33px !important;
    }
    .code {
        .block();
        .on-center();
        .text-center();
        width:400px;
        font-family: "OpenSans-Semibold";
        font-weight: bold;
        font-size: 136px;
        line-height: 140px;
        color: #11549f;
        position: relative;
        top: 155px;
        left: -10px;
    }
}

// message-wrapper
.message-wrapper {
    .block();
    .on-center();
    width: 540px;
    overflow: hidden !important;

    h1 {
        .block();
        .full-width();
        .on-center();
        font-family: "OpenSans-Semibold";
        font-size: 24px;
        line-height: 24px;
        color: @color333;  
        font-weight: lighter !important;  
        margin:40px 0px 25px;    
    }
    p {
        .block();
        width: 370px;
        font-size: 15px;
        line-height: 20px;
        color: @color333;
        margin-bottom: 25px;
    }
    a {
        text-decoration: none;
        border-bottom: 1px solid #caddff;
        color: #11549f;
        .transition(~"border-color, color", 0.3s);

        &:hover , 
        &:active {
            border-bottom: 1px solid #0066ff;
            color: #0066ff;
            .transition(~"border-color, color", 0.3s);
        }
        &:visited {
            color:@colorVisited;
            border-color:@colorVisitedBorder;
            .transition(~"border-color, color", 0.3s);

            &:hover , 
            &:active {
                border-bottom: 1px solid #0066ff;
                color: #0066ff;
                .transition(~"border-color, color", 0.3s);
            }            
        }
    }
}