/* Minification failed. Returning unminified contents.
(13,33): run-time error CSS1046: Expect comma, found '0'
(13,37): run-time error CSS1046: Expect comma, found '/'
(14,53): run-time error CSS1046: Expect comma, found '8'
(14,58): run-time error CSS1046: Expect comma, found '/'
(14,72): run-time error CSS1046: Expect comma, found '8'
(14,77): run-time error CSS1046: Expect comma, found '/'
(14,93): run-time error CSS1046: Expect comma, found '195'
(14,100): run-time error CSS1046: Expect comma, found '/'
 */
body {
    background-color: #fff;
}

.contact-bg {
    width: 100%;
    background-image: url('/Images/home-pre-order.jpg');
    background-position: bottom;
    background-size: cover;
    background-repeat: no-repeat;
}
    .contact-bg > .layer {
        background-color: rgb(0 0 0 / 0.70);
        background: linear-gradient(to bottom,rgb(1 8 90 / 0.70),rgb(1 8 90 / 0.70),rgb(255 195 27 / 0.20));
        padding: 100px 170px;
    }
        .contact-bg > .layer > .title {
            font-size: 70px;
            font-family: 'Roboto Condensed',sans-serif;
            font-weight: bold;
            color: #fff;
        }



.body-context {
    position: relative;
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
    border: 10px solid transparent;
}

        .body-context > .left-context {
            position:relative;
            float:left;
            width:66.66%;
            background-color: #fff;
            padding: 30px 10px;
        }

            .body-context > .left-context > .header {
                font-size: 45px;
                line-height:50px;
                font-family: 'Roboto', sans-serif;
                color: #a8a8a8;
                padding-left: 15px;
                font-weight: bold;
                margin-bottom:20px;
            }
            .body-context > .left-context > .sub-header {
                font-size: 15px;
                font-family: 'Roboto', sans-serif;
                color: #d80e0a;
                font-weight: 500;
                padding-left: 15px;
            }


    .body-context > .right-context {
        position: relative;
        float: left;
        width: 33.33%;
        padding: 15px;
        padding-left: 35px;
        padding-top: 80px;
    }

    .body-context > .right-context > .item {
        width:100%;
        display:table;
        margin-bottom:20px;
    }
        .body-context > .right-context > .item > .icon {
            width: 60px;
            display: table-cell;
            vertical-align: middle;
        }
            .body-context > .right-context > .item > .icon > i {
                width: 50px;
                height: 50px;
                border-radius: 50%;
                background-color: #f39c12;
                color: #fff;
                text-align: center;
                font-size: 25px;
                padding-top: 12px;
            }
            .body-context > .right-context > .item > .icon > .i-2 {
                background-color: #39b54a;
            }
            .body-context > .right-context > .item > .icon > .i-3 {
                background-color: #009aa9;
            }
        .body-context > .right-context > .item > .details {
            display: table-cell;
            vertical-align:middle;
        }
            .body-context > .right-context > .item > .details > .title {
                font-size: 14px;
                font-weight: 600;
                color: #2f2f2f;
                font-family: 'Roboto', sans-serif;
            }
            .body-context > .right-context > .item > .details > .address {
                font-size: 12px;
                font-weight: 500;
                color: #5e5e5e;
                font-family: 'Roboto', sans-serif;
            }

            .body-context > .right-context > .opening-houre {
                background-color:#eee;
                padding:10px;
            }
                .body-context > .right-context > .opening-houre > .title {
                    font-size: 15px;
                    font-weight: 600;
                    color: #2f2f2f;
                    font-family: 'Roboto', sans-serif;
                    padding-bottom:10px;
                }
                .body-context > .right-context > .opening-houre > .item {
                    display: table;
                    width: 100%;
                    padding: 4px 0px;
                }
                    .body-context > .right-context > .opening-houre > .item > .title {
                        display: table-cell;
                        width:100px;
                        font-size: 13px;
                        font-weight: 600;
                        color: #424242;
                        font-family: 'Roboto', sans-serif;
                    }
                    .body-context > .right-context > .opening-houre > .item > .time {
                        display: table-cell;
                        font-size: 13px;
                        font-weight: 400;
                        color: #8e8e8e;
                        font-family: 'Roboto', sans-serif;
                    }


.map-context {
    width: 100%;
    height: 500px;
    display: table;
}

    .map-context > iframe {
        height: 100%;
        width: 100%;
    }

    .body-context label {
        font-size: 12px;
        font-weight: normal;
        color: #99999f;
        margin-top: 10px;
    }

    .body-context .input {
        border: 1px solid #f6f6f6;
        padding: 12px;
        width: 100%;
        outline: none;
        background-color: #f6f6f6;
    }

    .body-context input[type="date"] {
        height: 40px;
    }

    .body-context .input:focus {
        border: 1px solid #ced6e6;
        box-shadow: 0px 3px 7px rgba(17, 33, 159, 0.09);
    }

.body-context .input-group-addon {
    background-color: #f6f6f6;
    color: #333;
    border: 1px solid #f6f6f6;
    padding-right:0px;
}
.body-context .button {
    background-color: #f26322;
    border-radius: 20px;
    border: none;
    color: #fff;
    float: right;
    padding: 10px 25px;
    box-shadow: 3px 4px 7px rgba(0, 7, 137, 0.20);
}

    .body-context .button:hover {
        background-color: #f14b00;
    }

    .body-context .button:focus {
        background-color: #f14b00;
        outline: none;
    }

    .body-context > .body > .right-context > .social-media > a > i {
        color: #fff;
        height: 25px;
        width: 25px;
        border: 1px solid #fff;
        padding: 4px;
        text-align: center;
        border-radius: 6px;
    }

    .body-context > .body > .right-context > .social-media > a:hover i {
        transform: rotateY(360deg);
        transition: 1000ms;
    }

    .body-context > .body > .right-context > .social-media > a > img {
        height: 25px;
        width: 25px;
        border: 1px solid #fff;
        padding: 4px;
        text-align: center;
        border-radius: 6px;
    }

    .body-context > .body > .right-context > .social-media > a:hover img {
        transform: rotateY(360deg);
        transition: 1000ms;
    }

@media (max-width:991px) {

    .message-bg {
        width: 100%;
        height: 400px;
        display: table;
    }
}

@media (max-width:600px) {
    .body-context > .body > .left-context {
        padding: 10px 0px;
    }

        .body-context > .body > .left-context > .header {
            font-size: 20px;
        }

    .body-context > .body > .right-context {
        padding: 10px;
        padding-top: 80px;
    }

        .body-context > .body > .right-context > .contact-no {
            font-size: 16px;
            width: 170px;
        }

            .body-context > .body > .right-context > .contact-no > i {
                height: 22px;
                width: 22px;
                font-size: 13px;
            }
}

@media (max-width:400px) {

    .message-bg {
        height: 200px;
    }

    .body-context {
        border: none;
    }

        .body-context > .body {
            position: unset;
            padding-top: 10px;
        }

            .body-context > .body > .right-context > .contact-no {
                font-size: 14px;
                width: 130px;
            }

                .body-context > .body > .right-context > .contact-no > i {
                    display: none;
                }
}

@media (max-width:991px){
    .contact-bg > .layer {
        padding:50px 100px;
    }
        .contact-bg > .layer > .title {
            font-size: 50px;
        }
    .map-context {
        height: 400px;
    }

}
@media (max-width:767px) {
    .contact-bg > .layer {
        padding:50px 80px;
    }
        .contact-bg > .layer > .title {
            font-size: 40px;
        }

    .body-context > .left-context > .header {
        font-size: 35px;
        line-height: 40px;
    }

    .body-context > .left-context > .sub-header {
        font-size: 14px;
    }

    .body-context > .left-context {
        width: 100%;
        padding:20px 0px;
    }

    .body-context > .right-context {
        width: 100%;
        padding: 10px;
        padding-top: 30px;
    }
    .map-context {
        height: 350px;
    }
}
@media (max-width:600px) {
    .contact-bg > .layer {
        padding: 40px 50px;
    }

        .contact-bg > .layer > .title {
            font-size: 30px;
        }

    .body-context > .left-context > .header {
        font-size: 25px;
        line-height: 30px;
    }

    .body-context > .left-context > .sub-header {
        font-size: 13px;
    }
    .map-context {
        height: 300px;
    }
}
@media (max-width:500px) {
    .contact-bg > .layer {
        padding: 50px 40px;
    }

        .contact-bg > .layer > .title {
            font-size: 25px;
        }
    .map-context {
        height: 250px;
    }
}
@media (max-width:400px) {
    .map-context {
        height: 200px;
    }
}