/*
  Theme Name: WOW Food
  Theme URL: http://www.joinwebs.com/
  Author: JoinWebs
  Author URI: http://www.joinwebs.com/
  Description: WOWFood - A Template For Food Resturants and Hotles using Responsive HTML5 css3 bootstrap3 Template
  Version: 1.0.0
*/

/*=======================================================================
[Table of contents]
=========================================================================

1. Top Bar
2. Header (menu)
3. Slider
4. Services
5. Special Dishes
    i)overlay
    ii) css3 lightbox
6. popular dishes
7. subscriber
8. footer
    i)footer widget
    ii)footer testimonial
    iii)footer bar
9. Gallery
10.Blog
    i)blog content
    ii)Sidebar
11.Blog single Post
12.Menu Card
13.About Us


==========================================================================*/
/*=========================================================================
// generic css
===========================================================================*/
*{
    margin: 0;
    padding: 0;
}
body{
    background: #f7f6f5;
}
@font-face {
    font-family: museo;
    src: url(../fonts/Museo_Slab_500.otf);
}
@font-face {
    font-family: museobold;
    src: url(../fonts/Museo_Slab_9.otf);
}
.clr{
    clear: both;
}
h1,h2,
h3,h4,
h5,h6{
    font-family: museo !important;
}

/*=========================================================================
// 1. Top Bar
===========================================================================*/
#top-bar{
    padding: 4px 0;
    background: #222222;
    padding-top: 5px;
}
    #top-bar .top i{
        display: inline-block;
        width: 32px;
        height: 32px;
        text-align: center;
        background: #2f2f2f;
        border-radius: 5px;
        padding: 8px 0 0 0;
        color: #cccccc;
        vertical-align: top;
    }
    #top-bar .top p{
        display: inline-block;
        color: #cccccc;
        margin-left: 10px;
        vertical-align: bottom;
    }
/*=========================================================================
// 2. Header
===========================================================================*/
#menu header{
    padding: 0px 0;
}
    #menu header .logo{
        overflow: hidden;
    }
    #menu header nav{
        font-family: museo;
    }
    #menu header .navbar-default{
        background: none;
        border: none;
        margin-top: 20px;
    }
    #menu header .navbar-default .navbar-nav > .active > a,
    .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus{
        background: none;
        color: #94221f;
    }
    #menu header .navbar-default .navbar-nav > li > a{
        color: #666666;
    }
    #menu header .navbar-default .navbar-nav > li > a:hover{
        color: #94221f;
    }
    #menu header ul.nav li.dropdown:hover > ul.dropdown-menu {
        display: block;
    }
    #menu header .dropdown-menu > li > a:hover,
    .dropdown-menu > li > a:focus {
        color: #94221f;
        text-decoration: none;
        background-color: #f5f5f5;
    }
    #menu .navbar-nav > li:last-child > a{
        padding-right: 0px;
    }

    #menu .navbar-collapse{
        padding: 0;
    }
/*=========================================================================
// 3. Slider
===========================================================================*/
/*=========================================================================
// 4. Services
===========================================================================*/
#services{
    padding: 90px 0;
}
    #services .service{
        text-align: center;
        margin-bottom: 20px;
    }
        #services .service i{
            display: inline-block;
            width: 64px;
            height: 64px;
            border-radius: 50%;
            text-align: center;
            background: #cccccc;
            color: #ffffff;
            padding: 18px 0 0 0;
            transition: all 1s ease;
            -webkit-transition: all 1s ease;
            -moz-transition: all 1s ease;
            -o-transition: all 1s ease;
        }
        #services .service h4{
            font-family: museo;
            color: #666666;
            font-weight: normal;
            transition: all 1s ease;
            -webkit-transition: all 1s ease;
            -moz-transition: all 1s ease;
            -o-transition: all 1s ease;
            margin-top: 20px;
        }
        #services .service p{
            color: #666666;
            padding: 0 50px;
            margin-bottom: 20px;
        }
            #services .service p i{
                width: 30px;
                height: 30px;
                background: #cccccc;
                border-radius: 50%;
                padding: 8px 12px;
                text-align: center;
                margin-left: 15px;
            }
            #services .service p a{
                text-decoration: none;
                color: #666666;
            }
            #services .service:hover i{
                background: #94221f;
            }
            #services .service:hover h4{
                color: #94221f;
            }
/*=========================================================================
// 5. Special Dishes
===========================================================================*/
#special-dishes{
    border-top: 1px solid #e1e1e1;
    border-bottom: 1px solid #e1e1e1;
    padding:5px 0;
}
    #special-dishes .this-section-bg{
        background: #94221f;
        padding: 85px 0;
        position: relative;
    }

    /*special head*/
    #special-dishes .this-section-bg .dishes-head{
        background: rgba(161,168,101,1);
        background: -moz-linear-gradient(top, rgba(161,168,101,1) 0%, rgba(172,179,113,1) 15%, rgba(176,183,118,1) 25%, rgba(182,189,124,1) 45%, rgba(182,189,124,1) 100%, rgba(161,168,101,1) 100%);
        background: -webkit-linear-gradient(top, rgba(161,168,101,1) 0%, rgba(172,179,113,1) 15%, rgba(176,183,118,1) 25%, rgba(182,189,124,1) 45%, rgba(182,189,124,1) 100%, rgba(161,168,101,1) 100%);
        background: -o-linear-gradient(top, rgba(161,168,101,1) 0%, rgba(172,179,113,1) 15%, rgba(176,183,118,1) 25%, rgba(182,189,124,1) 45%, rgba(182,189,124,1) 100%, rgba(161,168,101,1) 100%);
        background: -ms-linear-gradient(top, rgba(161,168,101,1) 0%, rgba(172,179,113,1) 15%, rgba(176,183,118,1) 25%, rgba(182,189,124,1) 45%, rgba(182,189,124,1) 100%, rgba(161,168,101,1) 100%);
        background: linear-gradient(to bottom, rgba(161,168,101,1) 0%, rgba(172,179,113,1) 15%, rgba(176,183,118,1) 25%, rgba(182,189,124,1) 45%, rgba(182,189,124,1) 100%, rgba(161,168,101,1) 100%);
        border-radius: 5px;
        position: absolute;
        top: -45px;
        left: 0;
        right: 0;
        margin: 0 auto;
        padding: 7px 15px;
        width: 340px;
        z-index: 3;
        box-shadow: 6px 0 4px -4px rgba(151, 157, 103, 1), -6px 0 4px -4px rgba(151, 157, 103, 1);
        -moz-box-shadow: 6px 0 4px -4px rgba(151, 157, 103, 1), -6px 0 4px -4px rgba(151, 157, 103, 1);
        -webkit-box-shadow: 6px 0 4px -4px rgba(151, 157, 103, 1), -6px 0 4px -4px rgba(151, 157, 103, 1);
        font-family: museo;
        text-align: center;
    }
    #special-dishes .this-section-bg .dishes-head h3{
        color: rgba(228, 233, 185, 1);
        font-weight: normal;
    }
    #special-dishes .this-section-bg .dishes-head p{
        color: rgba(228, 233, 185, 1);
    }

    /*carousel*/
#special-dishes .this-section-bg .carousel .ind{
        display: inline-block;
        width: 28px;
        height: 28px;
        background: rgba(228, 233, 185, 1);
        color: #94221f;
        margin-bottom: 20px;
        text-align: center;
        border-radius: 50%;
        padding: 8px 10px;
        text-decoration: none;
        transition: all 0.5s ease;
    }
    #special-dishes .this-section-bg .carousel .ind:nth-of-type(1){
        margin-right: 50px;
    }
    #special-dishes .this-section-bg .carousel .ind:hover{
        display: inline-block;
        width: 28px;
        height: 28px;
        background: rgba(206, 59, 59, 1);
        color: rgba(255, 255, 255, 1);
        margin-bottom: 20px;
        text-align: center;
        border-radius: 50%;
        padding: 8px;
        text-decoration: none;
    }
    #special-dishes .this-section-bg .carousel h4{
        color: #e4e9b9;
        font-family: museo;
    }
    #special-dishes .this-section-bg .carousel p{
        color: #e4e9b9;
        font-size: 12px;
        padding-right: 39px;
    }

    /*overlay*/
    .image{
        position: relative;
        width: 220px;
        height: 200px;
        overflow: hidden;
        text-align: center;
    }
    .overlay{
        background: rgba(255, 255, 255, 0.7);
        width: 100%;
        height: 100%;
        position: absolute;
        z-index: 2;
        left: 0;
        top: 0;
        z-index: 2;
        display: none;

    }
    .overlay-icon{
        width: 64px;
        height: 64px;
        border-radius: 50%;
        background: #94221f;
        color: #ffffff;
        position: absolute;
        z-index: 4;
        top: 36%;
        left: 0;
        right: 0;
        margin: 0 auto;
        text-decoration: none;
        text-align: center;
    }
    .overlay-icon:hover{
        color: #ffffff;
    }
    .overlay-icon i{
        padding-top: 20px;
        font-size: 20px;
    }

    /* Styles the lightbox, removes it from sight and adds the fade-in transition */

    .lightbox-target {
        position: fixed;
        top: -100%;
        width: 100%;
        background: rgba(0,0,0,.9);
        width: 100%;
        opacity: 0;
        -webkit-transition: opacity 1s ease-in-out;
        -moz-transition: opacity 1s ease-in-out;
        -o-transition: opacity 1s ease-in-out;
        transition: opacity 1s ease-in-out;
        overflow: hidden;
        z-index: 3;
    }

    /* Styles the lightbox image, centers it vertically and horizontally, adds the zoom-in transition and makes it responsive using a combination of margin and absolute positioning */

    .lightbox-target img {
        margin: auto;
        position: absolute;
        top: 0;
        left:0;
        right:0;
        bottom: 0;
        max-height: 0%;
        max-width: 0%;
        border: 3px solid white;
        box-shadow: 0px 0px 8px rgba(0,0,0,.3);
        box-sizing: border-box;
        -webkit-transition: 1s ease-in-out;
        -moz-transition: 1s ease-in-out;
        -o-transition: 1s ease-in-out;
        transition: 1s ease-in-out;
    }

    /* Styles the close link, adds the slide down transition */

    a.lightbox-close {
        display: block;
        width:50px;
        height:50px;
        box-sizing: border-box;
        background: white;
        color: black;
        text-decoration: none;
        position: absolute;
        top: -80px;
        right: 0;
        -webkit-transition: 1s ease-in-out;
        -moz-transition: 1s ease-in-out;
        -o-transition: 1s ease-in-out;
        transition: 1s ease-in-out;
    }

    /* Provides part of the "X" to eliminate an image from the close link */

    a.lightbox-close:before {
        content: "";
        display: block;
        height: 30px;
        width: 1px;
        background: black;
        position: absolute;
        left: 26px;
        top:10px;
        -webkit-transform:rotate(45deg);
        -moz-transform:rotate(45deg);
        -o-transform:rotate(45deg);
        transform:rotate(45deg);
    }

    /* Provides part of the "X" to eliminate an image from the close link */

    a.lightbox-close:after {
        content: "";
        display: block;
        height: 30px;
        width: 1px;
        background: black;
        position: absolute;
        left: 26px;
        top:10px;
        -webkit-transform:rotate(-45deg);
        -moz-transform:rotate(-45deg);
        -o-transform:rotate(-45deg);
        transform:rotate(-45deg);
    }

    /* Uses the :target pseudo-class to perform the animations upon clicking the .lightbox-target anchor */

    .lightbox-target:target {
        opacity: 1;
        top: 0;
        bottom: 0;
        z-index: 3;
    }

    .lightbox-target:target img {
        max-height: 100%;
        max-width: 100%;
    }

    .lightbox-target:target a.lightbox-close {
        top: 0px;
    }
/*=========================================================================
// 6. popular Dishes
===========================================================================*/
    #popular{
        padding: 50px 0;
    }
    #popular .popular-heading{
        text-align: center;
        margin-bottom: 45px;
    }
    #popular .popular-heading .h-icon{
        width: 64px;
        height: 64px;
        background: rgba(206, 59, 59, 1);
        border-radius: 50%;
        color: rgba(255, 255, 255, 1);
        margin: 0 auto;
        margin-bottom: 30px;
        font-size: 18px;
    }
    #popular .popular-heading .h-icon i{
        padding: 25px 0 0 0;
    }

    #popular .popular-heading h3{
        color: rgba(206, 59, 59, 1);
        font-family: museo;
        margin-bottom: 20px;
    }
    #popular .popular-heading p{
        color: rgba(102, 102, 102, 1);
        padding: 0 75px;
        font-size: 12px;
    }
    #popular .popular-heading span{
        color: rgba(136, 136, 136, 1);
        font-size: 11px;
        display: inline-block;
        font-family: museo;
        padding: 10px 0;
        border-top: 1px solid rgba(225, 225, 225, 1);
        border-bottom: 1px solid rgba(225, 225, 225, 1);
    }

    .food-menu{
        padding: 20px 0px 0px 0px;
        border: 1px solid rgba(225, 225, 225, 1);
        margin-bottom: 20px;
        border-radius: 5px;

    }
    .food-menu .food-img{
        border-radius: 5px;
        overflow: hidden;
        margin-bottom: 20px;
        width: 80px;
        height: 80px;
        overflow: hidden;
        position: relative;
    }
    .food-menu .food-img .blur{
        position: absolute;
        width: 100%;
        height: 100%;
        background: rgba(255, 255, 255, 0.8);
        top: 0;
        left: 0;
        display: inline-block;
    }
    .food-menu .food-det{
        color: rgba(102, 102, 102, 1);
    }
    .food-menu .food-det h4 a{
        color: rgba(102, 102, 102, 1);
        font-family: museo;
        text-decoration: none;
    }
    .food-menu .col-md-12{
        padding: 0;
    }
    .food-menu .food-price{
        background: #94221f;
        text-align: center;
        border: 1px solid rgba(161, 168, 101, 1);
        padding: 10px 0;
        border-radius: 5px;
        -webkit-transition: background-color 0.5s ease;
        -moz-transition: background-color 0.5s ease;
        -ms-transition: background-color 0.5s ease;
        -o-transition: background-color 0.5s ease;
        transition: background-color 0.5s ease;
    }
    .food-menu .food-price p{
        margin: 0;
        color: rgba(235, 239, 206, 1);
        transition: all 0.5s ease;
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -ms-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;

    }
    .food-menu:hover h4>a{
        color: rgba(206, 59, 59, 1);
    }
    .food-menu:hover .food-price{
        background: rgba(206, 59, 59, 1);
        text-align: center;
        border: 1px solid rgba(183, 32, 32, 1);
        padding: 10px 0;
        border-radius: 5px;
        color: rgba(255, 255, 255, 1);
    }
    #popular .all-menu{
        text-align: center;
    }
    #popular .all-food{
        display: inline-block;
        border: 1px solid rgba(225, 225, 225, 1);
        margin: 0 auto;
        padding: 5px;
        border-radius: 5px;
        height: 65px;
        margin-top: 40px;
    }
    #popular .all-food a{
        font-family: museo;
        font-size: 18px;
        background: #94221f;
        text-align: center;
        color: rgba(255, 255, 255, 1);
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -ms-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        transition: all 0.5s ease;
        padding: 13px 42px;
        display: inline-block;
        border-radius: 5px;
        text-decoration: none;

    }
    #popular .all-food a:hover{
        background: rgba(206, 59, 59, 1);
    }
/*=========================================================================
// 7. subscriber
===========================================================================*/
#subscribe{
    padding: 50px 0;
    background: #F7F6F5;
}

#subscribe .subs{
background: url(/diner-club-icon-red.png) no-repeat;
background-position: left center;
height: 290px;
}
#subscribe .subs h4{
    color: rgba(34, 34, 34, 1)
    font-family: museo;
}
#subscribe .subs p{
    color: rgba(34, 34, 34, 1)
    font-size: 12px;
    margin: 0;
}
#subscribe .subs p:nth-of-type(2){
    margin-bottom: 10px;
}
#subscribe .subs input[type="email"]{
    width: 100%;
    border: 2px solid rgba(148, 34, 31, 1);
    padding: 10px;
    color: #94221f;
    border-radius: 5px;
    margin-bottom: 20px;

}
#subscribe .subs input[type="text"]{
    width: 100%;
    border: 2px solid rgba(148, 34, 31, 1);
    padding: 10px;
    color: #94221f;
    border-radius: 5px;
    margin-bottom: 20px;

}
#subscribe .subs input[type="submit"]{
    width: 30%;
    border: 5px solid rgba(255, 255, 255, 1);
    background: #94221f;
    padding: 10px;
    color: rgba(255, 255, 255, 1);
    border-radius: 5px;
    font-family: museo;
    text-transform: capitalize;
    font-size: 20px;
    transition: all 1s ease;
}
#subscribe .subs input[type="submit"]:hover{
    background: rgba(206, 59, 59, 1);
}
/*=========================================================================
// 8. Footer
===========================================================================*/
    #footer footer{
        background: rgba(34, 34, 34, 1);
        padding: 40px 0 40px 0;
    }
    /*footer widget*/
    #footer footer .footer-widget h3{
        color: rgba(255, 255, 255, 1);
        margin-bottom: 30px;
        font-family: museo;
        font-weight: normal;

    }
    #footer footer .footer-widget h5{
        color: rgba(179, 179, 179, 1);
        font-family: museo;
        margin-bottom: 30px;
    }
    #footer footer .footer-widget img{
        margin: 10px 0;
    }
    #footer footer .footer-widget p{
        color: rgba(179, 179, 179, 1);
        font-size: 12px;
        padding: 0 41px 0 0;
    }
    #footer footer .footer-widget p i{
        display: inline-block;
        width: 32px;
        height: 32px;
        border-radius: 5px;
        background: rgba(47, 47, 47, 1);
        margin-right: 10px;
        padding: 10px 10px 10px 10px;
    }
    #footer footer .footer-widget p:nth-of-type(4){
        color: rgba(255, 255, 255, 1);
    }
    #footer footer .footer-widget p:nth-of-type(4) i{
        background: #94221f;
        color: rgba(255, 255, 255, 1);

    }
    #footer footer .footer-widget p span{
        display: inline-block;
    }

    #footer footer .footer-widget .carousel{
        padding: 0;
    }
    #footer footer .footer-widget input{
        width: 100%;
        border: 1px solid rgba(34, 34, 34, 1);
        color: rgba(179, 179, 179, 1);
        padding: 10px;
        border-radius: 5px;
        margin-bottom: 10px;
    }

    #footer footer .footer-widget input:nth-of-type(5){
        width: 49%;
        border: 1px solid rgba(34, 34, 34, 1);
        color: rgba(179, 179, 179, 1);
        padding: 10px;
        border-radius: 5px;
        margin-bottom: 10px;
    }

    #footer footer .footer-widget input:nth-of-type(6){
        width: 49%;
        border: 1px solid rgba(34, 34, 34, 1);
        color: rgba(179, 179, 179, 1);
        padding: 10px;
        border-radius: 5px;
        margin-bottom: 10px;
    }

    #footer footer .footer-widget input[type="submit"]{
        width: 100%;
        border: 1px solid rgba(34, 34, 34, 1);
        background: #94221f;
        color: rgba(255, 255, 255, 1);
        padding: 10px;
        border-radius: 5px;
        margin-bottom: 10px;
    }

    /*testimonial slider*/
    .testimonial {
        margin: 10px 0;
        width: 210px; /* Update to your slider width */
        height: 300px; /* Update to your slider height */
        position: relative;
        overflow: hidden;
    }

        .testimonial .test {
            display: none;
            position: absolute;
            top: 0;
            left: 0;
        }
            .testimonial .test p{
                border-bottom: 0px solid #e1e1e1;
                padding-bottom: 20px !important;
                width: 250px;
            }
            .testimonial .test .img{
                padding: 0;
            }
                .testimonial .test .img img{
                    margin-right: 20px;
                }
                .testimonial .test .img span{
                    display: inline-block;
                    margin-left: 20px;
                    margin-right: 20px;
                    color: #b8bf7e;
                }
        .testimonial .bar{
            position: relative;
            width: 100%;
            height: 5px;
            background: #e1e1e1;
            top:95%;

        }
            .testimonial .bar .progress{
                position: absolute;
                top: 0;
                left: 0;
                height: 5px;
                width: 0;
                background: #b8bf7e;
            }


    /*footer bar*/

    #footer #footer-bar{
        padding: 0px 0;
        background: #fff;
    }
    #footer #footer-bar p{
        color: rgba(34, 34, 34, 1);
        padding: 20px 0 0 0;
    }
    #footer #footer-bar p a{
        text-decoration: none;
        color: rgba(34, 34,34, 1 );
    }
    #footer #footer-bar .container .col-md-6{
        padding: 0;
    }
    #footer #footer-bar .footer-icon .icon{
        width: 46px;
        height: 46px;
        border: 1px solid rgb(214, 221, 158);
        border-radius: 100%;
        padding: 5px;
        display: inline-block;
        margin-right: 10px;
        margin-bottom: 10px;
    }
    #footer #footer-bar .footer-icon{
        padding: 10px 0 0 0;
    }
    #footer #footer-bar .footer-icon .icon i{
        display: inline-block;
        width: 34px;
        height: 34px;
        background: #d6dd9e;
        border-radius: 100%;
        text-align: center;
        color: #94221f;
        margin: 0;
        padding: 11px 0 0 0;

    }
    #footer #footer-bar .footer-icon .icon:hover{
        width: 46px;
        height: 46px;
        border: 1px solid rgba(248, 255,195, 1);
        border-radius: 100%;
        padding: 5px;
        display: inline-block;
        margin-right: 10px;

    }
    #footer #footer-bar .footer-icon .icon:hover i{
        display: inline-block;
        width: 34px;
        height: 34px;
        background: rgba(248, 255,195, 1);
        border-radius: 100%;
        text-align: center;
        color: #94221f;
        margin: 0;
        padding: 11px 0 0 0;
    }
    .back-to-top {
        position: fixed;
        bottom: 2em;
        right: 40px;
        text-decoration: none;
        color: #fff;
        background-color: #222222;
        font-size: 14px;
        padding: 20px;
        display: none;
        border-radius: 5px;

    }

    .back-to-top:hover {
        background-color:#94221f ;
        color: #fff;
        text-decoration: none;
    }
/*=========================================================================
// 9. Gallery
===========================================================================*/

/*Title Bar*/
#title-bar{
    padding: 20px 0;
    background: #94221f;
}
    #title-bar p{
         color: #ffffff;
         display: inline-block;
         margin-bottom: 0;
         margin-right: 10px;
    }
/*gallery*/
#gallery{
    padding: 40px 0 60px 0;
}
    .main-title{
        width: 400px;
        margin: 0 auto;
        text-align: center;
        margin-bottom: 60px;
    }
        .main-title i{
            display: inline-block;
            width: 64px;
            height: 64px;
            background: #94221f;
            color: #ffffff;
            padding: 20px 0 0 0;
            font-size: 24px;
            border-radius: 50%;
            margin-bottom: 10px;
        }
        .main-title h3{
            font-family: museo;
            color: #94221f;
        }
        .main-title p{
            color: #666666;
            position: relative;
            padding: 0 0 20px 0;
        }
        .main-title p:before{
            content: "";
            width: 200px;
            border-bottom: 1px solid #e1e1e1;
            position: absolute;
            top: 100%;
            left: 0;
            right: 0;
            margin: 0 auto;
        }
        .main-title span{
            display: inline-block;
            padding: 0 0 10px 0;
            border-bottom: 1px solid #e1e1e1;
            color: #888888;
            font-size: 12px;
        }
/*=========================================================================
// 10. Blog
===========================================================================*/
#main-blog-content{
    padding: 40px 0 80px 0;
}
    .blog-content .date{
        display: inline-block;
        border: 1px solid #e1e1e1;
        border-radius: 5px;
        background: #94221f;
        text-align: center;
        color: #ffffff;
        width: 60px;
        height: 60px;
        padding: 5px 0 0 0;
        margin-bottom: 10px;
    }
        .blog-content .date p{
            font-size: 18px;
            font-family: museo;
            margin: 0;
        }
    .blog-content .like{
        display: inline-block;
        border: 1px solid #e1e1e1;
        border-radius: 5px;
        text-align: center;
        color: #94221f;
        width: 60px;
        height: 60px;
        padding: 8px 0 0 0;
    }
    .blog-content .blog-post{
        padding-bottom: 40px;
        border-bottom: 1px solid #e1e1e1;
        margin-bottom: 40px;
    }
    .blog-content .post-img{
        width: 100%;
        border: 1px solid #e1e1e1;
        padding: 5px;
        border-radius: 5px;
        margin-bottom: 25px;
        overflow: hidden;
    }
        .blog-content .post-img img{
            width: 100%;
        }
        .blog-content .post-content h3{
            margin-top:0px;
            margin-bottom: 20px;
        }
        .blog-content .post-content h3 a{
            color: #666;
            text-decoration: none;
        }

        .blog-content .post-content .post-title span{
            margin-right: 5px;
            margin-bottom: 20px;
            display: inline-block;
            color: #888;
            padding: 0 15px 0 0;
        }
        .blog-content .post-content .post-title span a{
            color: #94221f;
            text-decoration: none;
            transition: all 1s ease;
        }
        .blog-content .post-content .post-title span a:hover{
            color: #94221f;
        }
        .blog-content .post-content .post-des p{
            margin-bottom: 30px;
            color: #666;
        }
        .blog-content .post-content .post-tags p{
             color: #666666;
        }
            .blog-content .post-content .post-tags p a{
                color: #999;
                text-decoration: none;
                transition: all 1s ease;
            }
            .blog-content .post-content .post-tags p a:hover{
                color: #94221f;
            }
    .blog-content .post-content .read-more{
        display: inline-block;
        border: 1px solid #e1e1e1;
        border-radius: 5px;
        padding: 5px;
    }
        .blog-content .post-content .read-more a{
            display: inline-block;
            background: #94221f;
            color: #fff;
            border-radius: 5px;
            padding: 15px 50px;
            text-decoration: none;
            transition: all 1s ease;
        }
        .blog-content .post-content .read-more a:hover{
            background: #94221f;
            color: #fff;
            border-radius: 5px;
            padding: 15px 50px;
        }

    .blog-content .post-video{
        width: 100%;
        border: 1px solid #e1e1e1;
        padding: 5px;
        border-radius: 5px;
        margin-bottom: 25px;
        overflow: hidden;
    }
        .blog-content .post-video iframe{
            border: none;
            width: 100%;
            height: 340px;
        }
    .blog-content .post-audio{
        width: 100%;
        border: 1px solid #e1e1e1;
        margin-bottom: 25px;
    }
        .blog-content .post-audio iframe{
            border: none;
            width: 100%;
            height: 130px;
        }

       /*pagination*/
    .pagi .pagination > li > a, .pagination > li > span{
        background: transparent;
        color: #999999;
    }

    .pagi .pagination > .active > a{
        background: #94221f;
        border: 1px solid #94221f;
    }
.pagi .pagination > li > a:hover{
    background: #94221f;
    border-color: #94221f;
    color: #999999;
}
    /*========side-bar========*/
    .sidebar .col-md-12{
        padding: 0;
    }
    .sidebar .widget{
        width: 100%;
        margin-bottom: 40px;
    }
    .sidebar .search input[type="search"]{
        width: 100%;
        padding: 14px 10px;
        background: transparent;
        color: #cccccc;
        border: 1px solid #e1e1e1;
        border-radius: 5px;
        background: url("../images/searchicon_03.png") no-repeat;
        background-position: right;
    }

    .sidebar .widget .widget-title{
        width: 100%;
        border: 1px solid #e1e1e1;
        text-align: center;
        border-radius: 5px;
        margin-bottom: 25px;
    }
        .sidebar .widget .widget-title p{
            font-size: 18px;
            font-family: museo;
            color: #94221f;
            padding: 10px 0 0 0;
        }

        .sidebar .widget ul li{
            list-style: none;
            color: #888888;
            padding: 0 0 10px 10px;
            border-bottom: 1px solid #e1e1e1;
            margin-bottom: 10px;
        }
        .sidebar .widget ul li:last-child{
            border: none;
        }
            .sidebar .widget ul li a{
                text-decoration: none;
                color: #888888;
                padding: 0 0 10px 20px;
            }
            .sidebar .widget ul li a:hover{
                color: #94221f;
                padding: 0 0 10px 20px;
            }
        .sidebar .widget .post{
            border-bottom: 1px solid #e1e1e1;
            padding-bottom: 15px;
            margin-bottom: 15px;
        }
        .sidebar .widget .post:last-of-type{
            border: none;
        }
            .sidebar .widget .post .pimage{
                border: 1px solid #e1e1e1;
                padding: 5px;
                border-radius: 5px;
            }
                .sidebar .widget .post .pimage img{
                    width: 100%;
                }
            .sidebar .widget .post p{
                color: #888888;
            }
                .sidebar .widget .post p a{
                    text-decoration: none;
                    color: #888;
                    transition: all 1s ease;
                }
                .sidebar .widget .post p a:hover{
                    color: #94221f;
                }
                .sidebar .reservation input{
                    width: 100%;
                    background: transparent;
                    border: 1px solid #e1e1e1;
                    padding: 10px;
                    color: #888888;
                    margin-bottom: 10px;
                    border-radius: 5px;
                }
                .sidebar .reservation input[type="date"]{
                    width: 49%;
                }
                .sidebar .reservation input[type="time"]{
                    width: 49%;
                }
                .sidebar .reservation input[type="submit"]{
                    background: #94221f;
                    color: #ffffff;
                    font-family: museo;
                }
    .sidebar .tags p a{
        text-decoration: none;
        background: transparent;
        display: inline-block;
        border: 1px solid #e1e1e1;
        border-radius: 5px;
        padding: 10px 20px;
        color: #888888;
        margin: 0 0 10px 0;
        transition: all 0.5s ease;
    }
        .sidebar .tags p a:hover{
            background: #94221f;
            color: #ffffff;
            border: 1px solid #94221f;
            border-radius: 5px;
            padding: 10px 20px;
        }

/*=========================================================================
// 11. Blog Single Post
===========================================================================*/
#blog-post{
    padding: 40px 0 80px 0;
}
    .blog-content .post-content .post-des blockquote{
        font-size: 13px;
        color: #999;
        padding: 0 50px;
        margin-bottom: 40px;
    }

    .about-author{
        color: #999999;
        border-bottom: 1px solid #e1e1e1;
        padding: 0 0 30px 0;
        margin-bottom: 30px;
    }
        .about-author h4{
            font-family: museo;
            color: #94221f;
            margin-bottom: 30px;
        }
    .about-author .author-image{
        border: 1px solid #e1e1e1;
        border-radius: 5px;
        padding: 3px;
    }
        .about-author .author-image img{
            width: 100%;
        }
        .bio{
            color: #888888;
        }
        .bio p{
            padding: 10px 0 0 0;
            margin-bottom: 10px;
        }
        .bio p a{
            text-decoration: none;
            color: #94221f;
            display: inline-block;
        }
        .bio p span{
            display: inline-block;
            margin-left: 15px;
        }
    .pager{
        text-align: center;
        margin-bottom: 30px;
    }
        .pager a{
            border: 1px solid #e1e1e1;
            background: transparent;
            color: #cccccc;
            padding: 20px 44px;
            text-decoration: none;
            transition: all 1s ease;
            border-radius: 5px;
            display: inline-block;
            margin-right: 5px;
        }
        .pager a:hover{
            background: #94221f;
            border: 1px solid #94221f;
            color: #ffffff;
            padding: 20px 44px;
            text-decoration: none;
        }
    /*======comments======*/
    .comments h4{
        color: #94221f;
        border-bottom: 1px solid #e1e1e1;
        margin-bottom: 30px;
        padding-bottom: 20px;
    }
    .comments .comment{
        padding-bottom: 20px;
        border-bottom: 1px solid #e1e1e1;
        margin-bottom: 20px;
    }
    .comments .comment .pad{
        padding-left: 40px !important;
    }
    .comments .comment .commenter-image{
        border: 1px solid #e1e1e1;
        border-radius: 5px;
        padding: 3px;

    }
        .comments .comment .commenter-image img{
            width: 100%;
        }
    .prev-comments{
        margin-bottom: 40px;
        text-align: center;
    }
        .prev-comments .prev-btn{
            border: 1px solid #e1e1e1;
            border-radius: 5px;
            padding: 5px;
            display: inline-block;
        }
            .prev-comments .prev-btn a{
                display: inline-block;
                padding: 15px 50px;
                text-decoration: none;
                background: #94221f;
                color: #ffffff;
                border-radius: 5px;
            }
    /*======comment box======*/
    .comment-box{
        width: 100%;
        border: 1px solid #e1e1e1;
        border-radius: 5px;
        padding: 40px;
        background: transparent;
    }
        .comment-box input{
            width: 49%;
            background: #ffffff;
            color: #999;
            margin-bottom: 20px;
            border-radius: 5px;
            border: 1px solid #e1e1e1;
            padding: 15px;
        }
        .comment-box input:nth-of-type(1){
            margin-right: 10px;
        }
            .comment-box textarea{
                width: 100%;
                height: 170px;
                margin-bottom: 20px;
                border-radius: 5px;
                border: 1px solid #e1e1e1;
                padding: 15px;
                color: #999;
            }
        .comment-box .comment-submit{
            width: 40%;
            display: inline-block;
            border: 1px solid #e1e1e1;
            padding: 5px;
            border-radius: 5px;
        }
            .comment-box .comment-submit input{
                width: 100%;
                background: #94221f;
                color: #ffffff;
                border-radius: 5px;
                margin: 0;
            }
        .form-control{
            display: inline-block !important;
        }
        .form-control:focus{
            box-shadow: 0 1px 1px rgba(206, 59, 59, 0.75) inset, 0 0 8px rgba(206, 59, 59, 0.6) !important;
        }
/*=========================================================================
// 12. Menu Card
===========================================================================*/
#menu-card{
    padding: 40px 0 80px 0;
}
/*=========================================================================
// 13. About US
===========================================================================*/
#about-us {
    padding: 40px 0 80px 0;
}
    #about-us .info{
        padding-bottom: 50px;
        border-bottom: 1px solid #e1e1e1;
        margin-bottom: 50px;
    }
    #about-us .about-des p{
        color: #888888;
        margin-bottom: 20px;
    }
    #about-us .about-des blockquote{
        color: #bbb;
        font-size: 12px;
        margin-bottom: 20px;
    }
    #about-us .about-img{
        width: 100%;
        border: 1px solid #e1e1e1;
        padding: 5px;
        border-radius: 5px;
    }
    #about-us .about-img img{
        width: 100%;
        border-radius: 5px;
    }
    .team .team-img{
        border: 1px solid #e1e1e1;
        border-radius: 5px;
        padding: 5px;
    }
    .team .team-img img{
        width: 100%;
    }
    .team .team-social{
        text-align: center;
    }
    .team .team-social .team-icon{
        display: inline-block;
        width: 42px;
        height: 42px;
        border-radius: 50%;
        border: 1px solid #e1e1e1;
        padding: 4px;
        transition: all 0.5s ease;
    }
        .team .team-social .team-icon a{
            display: inline-block;
            width: 32px;
            height: 32px;
            background: #cccccc;
            color: #ffffff;
            border-radius: 50%;
            padding-top: 5px;
            transition: all 0.5s ease;
        }
    .team .team-social .team-icon:hover{
        border: 1px solid #94221f;
    }
    .team .team-social .team-icon:hover a{
        background: #94221f;
    }
/*=========================================================================
// 13. Contact US
===========================================================================*/
#map{
    position: relative;
    overflow: hidden;
}

    .google-map-canvas{
        background:transparent;
        position:relative;
        width:100%;
        height:450px; /* your iframe height */

    }
    .google-map-canvas:before{
        content: "";
        position: absolute;
        width: 400px;
        height: 20px;
        background: transparent;
        -webkit-box-shadow: 0 12px 24px 3px rgba(0, 0, 0, 0.75);
        -moz-box-shadow: 0 12px 24px 3px rgba(0, 0, 0, 0.75);
        box-shadow: 0 12px 24px 3px rgba(0, 0, 0, 0.75);
        z-index: -1;
        left:0;
        right:0;
        margin: 0 auto;
        bottom:30px;

    }
    .map-overlay{
        position: absolute;
        background: transparent;
        width: 100%;
        height: 450px;/* your iframe height */
        top:0;
        left: 0;
    }
    #map-canvas iframe{
        width: 100%;
        height: 450px;
        border: 0;
    }
#contact{
    padding: 60px 0 80px 0;
}
    #contact h3{
        color: #94221f;
        margin-bottom: 30px;
    }
    #contact .contact-info p{
        color: #888;
        margin-bottom: 20px;
    }
        #contact .contact-info p i{
            display: inline-block;
            width: 30px;
            height: 30px;
            background: #cccccc;
            color: #ffffff;
            padding: 8px 0 0 0;
            text-align: center;
            border-radius: 5px;
            margin-right: 20px;
        }
        #contact .contact-info p:nth-of-type(3){
            color: #94221f;
        }
        #contact .contact-info p:nth-of-type(3) i{
            background: #94221f;
        }
    #contact .contact-info h5{
        color: #888888;
    }
    #contact .contact-info span{
        font-size: 12px;
        display: block;
        color: #888888;
    }
    #contact .contact-info p:last-child{
        margin-top: 30px;
    }

    .git .contact-form{
        border: 1px solid #e1e1e1;
        padding: 40px;
        background: #f8f8f8;
    }
        .git .contact-form input{
            width:49%;
            border: 1px solid #e1e1e1;
            background: #ffffff;
            margin-bottom: 10px;
            border-radius: 5px;
            margin-right: 5px;
            color: #888888;
        }
        .git .contact-form textarea{
            border: 1px solid #e1e1e1;
            background: #ffffff;
            padding: 15px;
            width: 99%;
            height: 160px;
            border-radius: 5px;
            margin-bottom: 10px;
            color: #888888;
        }
        .git .contact-form .submit-contact{
            border: 1px solid #e1e1e1;
            border-radius: 5px;
            padding: 4px;
            display: inline-block;
            width: 200px;
        }
        .git .contact-form .submit-contact input[type="submit"]{
            background: #94221f;
            color: #ffffff;
            width: 100%;
            margin: 0;
            padding: 15px;
        }