@charset "utf-8";

// import YUI reset so we work from common/clean baseline
@import "functions.less";
@import "reset.less";
@import "forms.less";

body {
    min-width: 1036px;
    width: 100%;
    #gradient > .linear(url(http://asset.parking.gkg.net/images/cloud_bg.png?481d1f5) center top no-repeat, #367fc5, #fff);
    font-family: Arial, Verdana, Helvetica, Geneva, Swiss, SunSans-Regular;
}

h1 {
    font-weight: bold;
}

#container {
    width: 1036px;
    margin: 0 auto;
}

#head {
    background-color: #fff;
    background-image: url(http://asset.parking.gkg.net/images/white_bg.gif?481d1f5);
    width: 964px;
    height: 115px;
    margin: 0 auto;
    padding: 15px 25px;
    border: 1px solid #666;
    border-width: 0 1px 0;
    position: relative;
    .box-shadow(0 0 25px #333);

    #login {
        .border-radius(0,0,5px,5px);
        background-color: #888888;
        background-color: rgba(0, 0, 0, 0.45);
        position: absolute;
        padding: 5px 10px;
        font-size: 14px;
        color: #fff;
        right: 25px;
        top: 0;

        form {
            display: inline-block;

            input {
                background-color: #f5f5f5;
                background-color: rgba(255, 255, 255, 0.95);
            }
        }

    }

    #logo {
        margin-top: 16px;
        display: block;

        img {
            float:left;
        }
    }

    ul {
        text-align: center;
        position: absolute;
        right: 25px;
        bottom: 0;
        padding: 6px 0 4px;
        background-color: #888;
        background: rgba(0, 0, 0, 0.45);
        border-radius: 5px 5px 0 0;

        li {
            display: inline-block;
            font-size: 16px;
            margin: 0 20px;

            a {
                color: #fff;
                text-decoration: none;

                &:hover {
                    color: #ecc483;
                }
            }
        }
    }
}

#banner {
    background-color: #fff;
    background: url(http://asset.parking.gkg.net/images/parking_bg.jpg?481d1f5);
    height: 166px;
    width: 1026px;
    border: 5px solid #2d5479;
    .border-radius(4px, 4px);
    .box-shadow(0 8px 11px -5px #000);
    position: relative;

    h1 {
        font-size: 32px;
        text-align: center;
        padding: 15px 0 0;
        color: #32394F;

        a {
            color: #2d5479;
            font-style: italic;
            text-decoration: underline;
            text-align: center;

            &:hover {
                color: #c58822;
            }
        }
    }

    p {
        padding: 21px 30px 0;
        margin: 18px 0;
        color: #fff;
        font-size: 16px;

        a {
            color: #ffff33;
            text-decoration: underline;
            text-align: center;

            &:hover {
                color: #99ffff;
            }
        }
    }

    hr {
        border: 1px solid #D29124;
        margin: 10px auto;
    }

    .hr1 {
        width: 575px;
    }

    .hr2 {
        width: 500px;
    }
}

#leftcorner {
    width: 0;
    height: 0;
    border-right: 10px solid #152737;
    border-bottom: 20px solid transparent;
    position: relative;
    top: 0;
    left: 0;
    float: left;
}

#rightcorner {
    width: 0;
    height: 0;
    border-left: 10px solid #152737;
    border-bottom: 20px solid transparent;
    position: relative;
    top: 0;
    right: 0;
    float: right;
}

#main {
    background-color: #fff;
    background: url(http://asset.parking.gkg.net/images/white_bg.gif?481d1f5);
    width: 1016px;
    margin: 0 auto;
    .box-shadow(0 5px 25px #333);
}

#partners {
    list-style: none;
    text-align: center;

    li {
        display: inline-block;
        margin: 30px;
        width: 125px;
        border: 1px solid #666;

        a {
            display: block;
        }
    }
}

#silentium {
    background: rgba(255, 255, 255, .6);
    width: 945px;
    margin: 0 auto;
    padding: 40px 15px;
    border: 4px solid #2d5479;
    border-width:4px 4px 0 4px;
    .border-radius(15px, 15px, 0, 0);

    p {
        color: #333;
        margin: 0 0 15px;
        line-height: 1.5em;
        font-size: 14px;

        a {
            color: #2d5479;

            &:hover {
                color: #c58822;
            }
        }
    }
}

#beforeandafter {
    float: left;
    margin: 25px 25px 25px 10px;
}

#silentium_logo {
    float: left;
    margin: 0 15px 15px;
    border: 0;
}

#services {
    .clearfix;

    ul {
        margin: 43px 34px 42px;
        width: 440px;
        float: left;

        li {
            a {
                text-decoration: none;

                img {
                    float: left;
                    border: none;
                }
            }

            p {
                padding-left: 120px;
                padding-top: 10px;
                color: #333;
            }
        }

        li.title {
            text-align: left;
            font-size: 26px;
            font-weight: normal;
            padding-left: 75px;
            margin-bottom: -1px;

            .domain {
                color: #0b2e9e;
            }

            .hosting {
                color: #3681C5;
            }

            .ssl {
                color: #AC5A2F;
            }

            .it {
                color: #C58722;
            }
        }

        li.detailed {
            font-size: 16px;
            color: #2d5479;
            height: 80px;
            margin-bottom: 8px;

            a {
                display: block;
                float: left;
                outline: none;
                background-image: url(http://asset.parking.gkg.net/images/main-sprite.png?481d1f5);
            }

            .domain {
                .sprite(79px, 80px, 0);
            }

            .hosting {
                .sprite(93px, 80px, -80px);
            }

            .ssl {
                .sprite(80px, 80px, -160px);
            }

            .it {
                .sprite(94px, 67px, -240px);
            }

            p {
                line-height: 1.2em;
            }
        }
    }
}

#footer {
    background: #2d5479;
    padding: 10px 75px;
    border-top: 1px solid #152839;
    .box-shadow(0 -1px 16px -4px);

    ul {
        .clearfix;
        width: 908px;
        margin: 0 auto;
    }

    li {
        float: left;
        margin: 0 12px;

        a {
            display: block;
            outline: none;
            background-image: url(http://asset.parking.gkg.net/images/footer-sprite.png?481d1f5);
        }

        .contact {
            .sprite(231px, 54px, 0);
        }

        .downtown {
            .sprite(111px, 56px, -54px);
        }

        .ithreat {
            .sprite(164px, 54px, -110px);
        }

        .silentium {
            .sprite(151px, 54px, -164px);
        }

        .gkg {
            .sprite(111px, 54px, -218px);
        }

        img {
            border: 0;
            padding: 2px 2px 1px 2px;
        }
    }
}
