@dir_images: '../images/';

@width: 980px;

@import 'globals';

.clearfix(@height: 1%) {
    overflow: hidden;
    height: @height;
}
.opacity(@percent) {
    -ms-filter: ~`"progid:DXImageTransform.Microsoft.Alpha(Opacity=@{percent})"`; // IE 8
    filter: ~`"alpha(opacity=@{percent})"`; // IE 5-7
    -moz-opacity: @percent / 100;
    -khtml-opacity: @percent / 100;
    opacity: @percent / 100;
}
.box_shadow(@params: 0 0 5px #CCC) {
    -webkit-box-shadow: @params;
    -moz-box-shadow: @params;
            box-shadow: @params;
}

/* GENERAL */

body {
    text-align: center;
}


/* LAYOUT */

#wrapper {
    position: relative;
    width: @width;
    padding-top: 20px;
    margin: 0 auto;
    text-align: left;
}

#header {
    height: 85px;
}
    #logo {
        float: left;
        margin-left: -10px;
    }
    #nav {
        float: right;
        height: 18px;
        padding-top: 53px;
        font-size: 14px;
        text-transform: uppercase;
        
        li {
            position: relative;
            float: left;
            padding-left: 15px;
            
            a {
                position: relative;
                border-bottom: 1px dotted #FFF;
                text-decoration: none;
                
                &:hover {
                    border-bottom-color: @color_link !important;
                }
            }
            &.current_page_item a,
            &.current_page_ancestor a {
                border-bottom-style: solid;
                border-bottom-color: @color_link;
            }
                &.current_page_item ul a,
                &.current_page_ancestor ul a {
                    border-bottom-style: dotted;
                    border-bottom-color: #FFF;
                }
            
            ul {
                display: none;
                width: 240px;
                position: absolute;
                top: 100%; left: 0;
                z-index: 9999;
                padding-top: 12px;
                margin-top: 5px;
                border: 1px solid @color_text;
                border-top: 0;
                border-left: 0;
                background-color: #FFF;
                
                li {
                    float: none;
                    display: block;
                    padding: 0 15px 12px;
                    line-height: 1.3;
                    
                    &.current_page_item a {
                        border-bottom-style: solid;
                        border-bottom-color: @color_link;
                    }
                }
            }
        }
    }
    .rgba #nav ul {
        border: 0;
        .box_shadow(5px 7px 12px rgba(0, 0, 0, 0.07));
    }

#slider {
    @slider_h: 420px;
    
    position: relative;
    height: @slider_h;
    margin-bottom: 15px;
    
    .box_shadow;
    
    .slides {
        height: @slider_h;
        
        li {
            width: @width; height: @slider_h;
            background-position: center center;
            background-repeat: no-repeat;
            
            .common() {
                position: absolute;
                bottom: 60px; left: 70px;
            }
            .caption-bg {
                .common;
                background-color: #2E78C5;
                .opacity(30);
            }
            .caption {
                .common; 
                width: 280px;
                padding: 40px 20px 30px;  
                color: #FFF;
                
                h2 {
                    font-size: 36px;
                    text-transform: uppercase;
                    line-height: 1.1;
                }
                
                p {
                    padding-top: 5px;
                    font-size: 15px;
                    line-height: 1.5;
                }

                a {
                    color: #FFF;
                }
            }
        }
    }

    .pagination {
        .clearfix(13px);
        position: absolute;
        bottom: 20px; left: 70px;
        z-index: 9999;
        
        li {
            float: left;
            padding-right: 12px;
            
            a {
                display: block;
                width: 13px; height: 13px;
                background: url('@{dir_images}slider_pagination.png') no-repeat 0 0;
                text-indent: -9999em;
            }
            
            &.current a {
                background-position: 0 -23px;
            }
        }
    }
    
    @control_h: 100px;
    @control_w: 60px;
    .prev,
    .next {
        position: absolute;
        left: -(@control_w / 2); top: (@slider_h / 2) - (@control_h / 2);
        z-index: 9999;
        width: @control_w; height: @control_h;
        background-color: #CDC09F;
        .opacity(60);
        text-indent: -9999em;
    }
        .next {
            left: auto;
            right: -(@control_w / 2);
        }
}

#separator {
    position: relative;
    height: 50px;
    margin-bottom: 15px;
    background-repeat: no-repeat;
    background-position: center center;
    
    .box_shadow;
}

#breadcrumbs {
    padding: 7px 0;
    color: #AAA;
    font-size: 12px;
}
    #breadcrumbs a {
        color: #AAA;
    }

#main {
    padding: 10px 0 30px;
}
    #services {
        .clearfix;
        margin-right: -12px;
        margin-bottom: 50px;
        
        li {
            float: left;
            width: 228px;
            padding: 5px 8px 5px 0;
            margin-right: 11px;
            border-right: 1px solid #DDD;
            
            h2 a {
                display: block;
                height: 17px;
                padding: 19px 0 0 50px;
                margin-bottom: 12px;
                background-image: url('@{dir_images}services.gif');
                background-repeat: no-repeat;
                color: #A7A9AC;
                font-size: 18px;
                font-weight: bold;
                text-decoration: none;
            }
            
            @sprite_icon_h: 46px;
            &.hand h2 a {
                background-position: 0 -(@sprite_icon_h * 0);
            }
            &.heart h2 a {
                background-position: 0 -(@sprite_icon_h * 1);
            }
            &.lotus h2 a {
                background-position: 0 -(@sprite_icon_h * 2);
            }
            &.stones h2 a {
                background-position: 0 -(@sprite_icon_h * 3);
            }
            &.yin-yang h2 a {
                background-position: 0 -(@sprite_icon_h * 4);
            }
            &.apple h2 a {
                background-position: 0 -(@sprite_icon_h * 5);
            }
            
            &.last {
                border-right: 0;
            }
            
            p {
                margin-bottom: 0;
                font-size: 15px;
                line-height: 1.2;
            }
        }
    }
    .slider {
        position: relative;
        padding: 0 55px;
        line-height: 1;

        .slides_control {
            min-height: 240px;
        }

        .divup-wrap {
            display: none;

            .divup {
                width: 870px;
                font-size: 15px !important;
                
                h2 {
                    padding: 3px 0 2px;
                    margin-bottom: 0;
                    font-size: 22px;
                    font-weight: bold;
                    text-transform: uppercase;
                    
                    a {
                        color: #A7A9AC;
                        text-decoration: none;
                    }
                }
                
                h3 {
                    padding-bottom: 25px;
                    margin-bottom: 0;
                    color: @color_text;
                    font-size: 15px;
                    font-weight: bold;
                }

                table {
                    margin: -15px;

                    td {
                        padding: 15px;
                        vertical-align: top;
                    }
                }
                
                img {
                    margin-top: 0;
                    border: 1px solid @color_text;
                    border-top: 0;
                    border-left: 0;
                }
            }
        }
        
        @control_h: 100px;
        @control_w: 60px;
        .prev,
        .next {
            position: absolute;
            left: -(@control_w / 2); top: 70px;
            z-index: 9999;
            width: @control_w; height: @control_h;
            background: #CDC09F url('@{dir_images}arrows.png') no-repeat 35px 30px;
            .opacity(60);
            text-indent: -9999em;
        }
            .next {
                left: auto;
                right: -(@control_w / 2);
                background-position: -25px 30px;
            }
    }
    .rgba #service-info li img {
        border: 0;
        .box_shadow(4px 4px 5px rgba(0, 0, 0, 0.07));
    }

#search {
    position: absolute;
    bottom: 12px; right: 15px;
    z-index: 9998;

    .input-text {
        float: right;
        padding: 3px 5px;
        border: 1px solid #A7A9AC;
        border-top-color: #BDBFC1;
        color: @color_text;
        font-size: 15px;
        outline: 0;
    }
    .input-submit {
        float: right;
        width: 1px; height: 1px;
        visibility: hidden;
    }
}

#footer {
    padding-bottom: 40px;
    font-size: 10px;
    text-align: right;
    
    .icon {
        vertical-align: middle;
    }
}

#lastminute {
    display: none;
    position: absolute;
    top: 93px; right: -55px;
    z-index: 9999;
    width: 315px; height: 135px;
    background: url('@{dir_images}lastminute.png') no-repeat 0 0;

    a {
        position: absolute;
        text-indent: -9999em;

        &.close {
            top: 4px; right: 14px;
            width: 11px; height: 11px;
        }
        &.view {
            bottom: 23px; left: 50%;
            width: 215px; height: 37px;
            margin-left: -107px;
        }
    }
}


/* OTHER */

.ws-schedule {
    font-size: 12px;
    
    table {
        border: 1px solid #EEE;

        th,
        td {
            border-right: 1px solid #EEE;
            border-bottom: 1px solid #EEE;
        }
            th {
                text-align: center;
            }
    }
}