

/***********************************************/

/** Font families used across the site         */



@import url('https://fonts.googleapis.com/css?family=Open+Sans');

@import url('https://fonts.googleapis.com/css?family=Bitter');

@import url('https://fonts.googleapis.com/css?family=Itim');



@font-face {

    font-family: 'Old Press';

    src: url('./../fonts/OldPress.ttf');

}



@font-face {

    font-family: 'Stencil Std';

    src: url('./../fonts/StencilStd.otf');

}



@font-face {

    font-family: 'Wawa TC';

    src: url('./../fonts/WawaTC-Regular.otf');

}



.font-old-press {

    font-family: 'Old Press';

}



.font-stencil {

    font-family: 'Stencil Std';

}



.font-wawa {

    font-family: 'Wawa TC';

}



.font-itim {

    font-family: 'Itim', 'cursive';

}



.font-bitter {

    font-family: 'Bitter', serif;

}





/***********************************************/

/** Global elements                            */



body {

    background-image: url('./../img/photos/background_mataor.jpg');

    font-family: 'Open Sans', sans-serif;

}



a, a:active, a:hover, a:visited {

    color: #FBBA2F;

    text-decoration: none;

    cursor: pointer;

}





/***********************************************/

/** Common background colors                   */



.background-brown {

    background: #371F11;

}



.background-brown-50 {

    background-color: rgba(55, 31, 17, 0.5);

}



.background-brown-80 {

    background-color: rgba(55, 31, 17, 0.8);

}



.background-brown-95 {

    background-color: rgba(55, 31, 17, 0.95);

}



.background-brown-dark {

    background: #2D1904;

}



.background-cream {

    background: #997251;

}



.background-yellow {

    background: #FBBA2F;

}





/***********************************************/

/** Common text colors                         */



.color-brown {

    color: #371F11;

}



.color-brown-dark {

    color: #2D1904;

}



.color-cream {

    color: #997251;

}



.color-yellow {

    color: #FBBA2F;

}



.color-white {

    color: #fff;

}





/***********************************************/

/** Reusable across components                 */



.dashed-left {

    border-left: 2px dashed white;

}



.dashed-left-right {

    border-left: 2px dashed white;

    border-right: 2px dashed white;

}



.dashed-right {

    border-right: 2px dashed white;

}



.dashed-sm-up {

    border-right: 2px dashed white;

    border-left: 2px dashed white;

}



.text-underline {

    text-decoration: underline;

}





/***********************************************/

/** Buttons                                    */



.btn-yellow {

    background-color: #fbba2f;

    box-shadow: 0 5px 15px #222;

    color: #371F11 !important;

    letter-spacing: 2px;

    font-family: 'Old Press';

    font-size: 2em;

    padding: 4px 12px 0;

}



.btn-yellow:active,

.btn-yellow:hover {

    background-color: #c39022;

    color: #FFF;

}





/***********************************************/

/** Admin Navbar                               */



.navbar-default {

    margin-bottom: 0;

}





/***********************************************/

/** Main Navbar                                */



.navbar-mataor {

    background: rgba(55, 31, 17, 0.8);

    border-color: rgba(55, 31, 17, 0.8);

    border-radius: 0;

    height: 56px;

    margin-bottom: 6px;

    z-index: 2; /* Ensure positioning above home carousel */

}



.navbar-mataor  .navbar-nav {

    clear: both;

    display: inline-block;

    float: none;

}



/* Mataor logo */

.navbar-mataor .mataor-logo {

    border-bottom-left-radius: 24px;

    border-bottom-right-radius: 24px;

    left: calc(50% - 108px);

    position: absolute;

    top: 0;

}



/* Navbar links and items */

.navbar-mataor .navbar-nav > li {

    background-color: transparent;

    border-left: 2px solid #FFF;

    border-right: 2px solid #FFF;

    height: 56px;

    margin: 0 24px 0 24px;

    min-width: 75px;

    position: relative;

    width: 75px;

}



.navbar-mataor .navbar-nav > li > a {

    background: #371F11;

    bottom: 0;

    border-radius: 2px;

    color: #FFFFFF;

    font-family: 'Old Press';

    font-size: 1.8em;

    left: -12px;

    padding: 10px 0;

    position: absolute;

    right: -12px;

    text-align: center;

    text-transform: uppercase;

}



.navbar-mataor .navbar-nav > li > a:hover,

.navbar-mataor .navbar-nav > li > a:focus,

.navbar-mataor .navbar-nav > li.active > a,

.navbar-mataor .navbar-nav > li.active > a:hover,

.navbar-mataor .navbar-nav > li.active > a:active,

.navbar-mataor .navbar-nav > li.active > a:focus {

    background: #FBBA2F;

    color: #FFFFFF;

}



/* Social links */

.navbar-mataor .social-links {

    padding-top: 16px;

}



.navbar-mataor .social-links img {

    width: 26px;

}



/* Mataor phone */

.navbar-mataor .mataor-phone {

    font-family: 'Stencil Std';

}





/***********************************************/

/** Main Navbar (XS Devices)                   */



.navbar-mataor-xs .dropdown-toggle {

    background: #371F11;

    border: none;

    -webkit-border-radius: 0;

    -moz-border-radius: 0;

    border-radius: 0;

    font-size: 1.3em;

    color: #FFF;

    outline: none;

}



.navbar-mataor-xs .dropdown-toggle,

.navbar-mataor-xs .dropdown-toggle:active {

    border: none;

    outline: none;

}



.navbar-mataor-xs.open > .dropdown-toggle.btn-default {

    background: #2D1904;

    color: #FFF;

}



.navbar-mataor-xs .dropdown-menu {

    color: #FFF;

    width: 100%;

}



.navbar-mataor-xs .dropdown-menu > li {

    margin-top: 8px;

    text-align: center;

}



.navbar-mataor-xs .dropdown-menu > li > a {

    color: #FFF;

    font-size: 1.3em;

}



.navbar-mataor-xs .dropdown-menu > li.active > a {

    background-color: #FBBA2F;

    padding: 8px;

}

/***********************************************/
/** Promotions                                 */

.promos-container,
.promos-descriptions {
    padding: 32px 64px;
}

.promos-container .promo-img {
    max-width: 320px;
    width: 80%;
}

.promos-container .promo-text-container {
    font-family: 'Old Press';
    color: #FFF;
    font-size: 2em;
    background: #FBBA2F;
    border-bottom-left-radius: 10px ;
    border-bottom-right-radius: 10px;
    max-width: 300px;
    margin: 0 auto;
	margin-bottom: 10px;
}

.promos-descriptions {
    margin-bottom: 96px;
}

.promos-descriptions .description {
    padding: 32px;
}

/***********************************************/

/** Main content on home page                  */



.main-content .img-instagram {

    border: 2px solid white;

    height: 150px;

    margin-bottom: 16px;

    width: 150px;

}



.main-content .panel-yellow {

    border: 3px solid #ffcc33;

}



.main-content .panel-yellow .panel-heading {

    background-color: #ffcc33;

    text-align: center;

}



.main-content .panel-yellow h5 {

    color: #371F11;

    font-weight: bold;

    font-style: italic;

}



.main-content .panel-yellow h5 small {

    color: #371F11;

    font-style: normal;

}

.main-content #container {
    position: relative;
}

.main-content #box {
    position: absolute;
    top: 20px;
    width: 100%;
}

.main-content .social-network-link {
    font-size: 24px;
    font-weight: bold;
}



.main-content .social-network-link img {

    width: 30px;

    margin-right: 8px;

}



.main-content .dashed {

    border-right: 2px dashed white;

    border-left: 2px dashed white;

}



#CDSWIDWRL {

    text-align: center !important;

    width: 100% !important;

    max-width: 100% !important;

}



#CDSWIDWRL .widWRLBranding dt img {

    margin: auto !important;

}



#CDSWIDWRL .widWRLRating {

    margin: 5px auto !important;

    width: 82px;

}



#CDSWIDWRL .widWRLRating span {

    clear: both !important;

    display: block;

}



#CDSWIDLNKR {

    width: 100%;

}



#CDSWIDLNKR.border {

    margin: auto;

}

/***********************************************/
/** Carousel                                   */

.no-padding {
    padding: 0px;
}

.owl-carousel .item {
    height: 400px;
    background: no-repeat center;
    background-size: cover;
}

.owl-theme .owl-dots .owl-dot.active,
.owl-theme .owl-dots .owl-dot:hover {
    background-size: 25px;
    background-image: url("../img/icons/ico-toro-home.png");
    background-repeat: no-repeat; /* Avoid merge with background to preserve size */
}

.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
    background: transparent;
    box-shadow: none;
}

.owl-dot span{
    box-shadow: 0 5px 15px black;
}

.owl-carousel .owl-stage-outer {
    box-shadow: 0 5px 15px black;
}

/***********************************************/
/** Contact form                               */

.contact-form > textarea {
    resize: none;
}

.contact-form .control-label {
    color: #FFF;
    font-family: 'Itim';
    font-size: 1.4em;
}

.contact-form .form-control {
    border-radius: 1px;
}

/***********************************************/
/** Contact page map                           */

.map .mataor-map {
    height: 400px;
    border: 4px solid #FCBA30;
}

/***********************************************/
/** Social networks links on contact page      */

.social-networks img {
    width: 64px;
    margin-bottom: 32px;
    margin-right: 10px;
    margin-left: 10px;
    box-shadow: 0 5px 15px #222;
}

.social-networks > h3 {
    text-shadow: 2px 2px #222;
    font-style: italic;
    font-weight: bold;
}

/***********************************************/
/** Vertical navigation menu (Services & menu) */

.vertical-navbar .vertical-navbar-link-wrapper {
    margin-top: 16px;
}

.vertical-navbar .vertical-navbar-link,
.vertical-navbar .vertical-navbar-link:hover {
    border-bottom-left-radius: 5px;
    border-top-left-radius: 5px;
    color: #371F11;
    font-family: 'Old Press';
    font-size: 2em;
    margin-top: 500px;
    padding: 8px;
    text-transform: uppercase;
}

.vertical-navbar .vertical-navbar-side-menu-open {
    background: #FBBA2F;
    border-bottom-left-radius: 4px;
    border-top-left-radius: 4px;
    color: #371F11;
    font-size: 2em;
    font-weight: bold;
    margin-right: -15px;
    padding: 0 16px;
}

.vertical-navbar .vertical-navbar-side-menu-close {
    background: #FBBA2F;
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px;
    color: #371F11;
    font-size: 1.5em;
    padding: 0 8px;
}

.vertical-navbar .vertical-navbar-xs-wrapper {
    position: fixed;
    height: 100%;
    right: 0;
    top: 0;
    overflow: auto;
    width: 280px;
    z-index: 3;
}

/***********************************************/
/** Restaurant menu */

.menu-restaurant .category-title {
    font-size: 5em;
    text-transform: uppercase;
    word-wrap: break-word;
}

.menu-restaurant .category-title > span {
    display: inline-block; /* force to wrap whole syllabus */
}

.menu-restaurant .category-image {
    width: 100%;
}

/***********************************************/
/** Restaurant services */

.restaurant-services .service-title {
    font-family: 'Old Press';
}

.restaurant-services .call-us {
    font-family: 'Stencil Std';
    font-size: 1.25em;
    text-align: center;
}







/**************************************************************/

/*****************             Media queries                  */





/** Everything before xxs */

@media screen and (max-width: 424px) {



    /***********************************************/

    /** Main Navbar                                */



    /* Mataor logo */

    .navbar-mataor .mataor-logo {

        border-bottom-left-radius: 5px;

        border-bottom-right-radius: 5px;

    }



    .navbar-mataor .mataor-logo > img {

        width: 70px;

    }



    /* Mataor call us */

    .navbar-mataor .mataor-phone {

        font-size: 0.7em;

        padding: 4px;

        right: 5px;

        width: 80px;

    }



    .navbar-mataor .mataor-phone > img {

        width: 30px;

    }





    /***********************************************/

    /** Main content on home page                  */



    .main-content .img-instagram {

        height: 120px;

        width: 120px;

    }





    /***********************************************/

    /** Carousel                                   */



    .owl-carousel .item {

        height: 200px;

    }

}



/** Everything after xxs */

@media screen and (min-width: 425px) {



    /***********************************************/

    /** Main Navbar                                */



    /* Mataor logo */

    .navbar-mataor .mataor-logo > img {

        width: 120px;

    }



    /* Mataor call us */

    .navbar-mataor .mataor-phone {

        font-size: 0.95em;

        padding: 8px 8px 4px;

        right: 12px;

        width: 120px;

    }



    .navbar-mataor .mataor-phone > img {

        width: 55px;

    }





    /***********************************************/

    /** Carousel                                   */



    .owl-carousel .item {

        height: 300px;

    }

}



@media screen and (max-width: 992px) and (min-width: 500px) {

    .content-offset-md {

        padding: 0 100px 0 100px !important;

    }

}



/** Everything before sm */

@media screen and (max-width: 767px) {



    /***********************************************/

    /** Reusable components*/



    .dashed-sm-up {

        border: none;

    }



    .dashed-sm-down {

        border-right: 2px dashed white;

        border-left: 2px dashed white;

    }



    /***********************************************/

    /** Main Navbar                                */



    /* Mataor logo */

    .navbar-mataor .mataor-logo {

        left: 5px;

    }



    /* Mataor call us */

    .navbar-mataor .mataor-phone {

        border-bottom-left-radius: 8px;

        border-bottom-right-radius: 8px;

        line-height: 1.25;

        position: absolute;

        top: 0;

    }



    .navbar-mataor .mataor-phone > img {

        margin-bottom: 4px;

    }

    /***********************************************/
    /** Promotions                                 */

    .promos-container {
        padding: 32px 0;
    }

    .promos-container .promo-img {
        max-width: 320px;
        width: 80%;
    }

    .promos-container .promo-text-container {
        font-family: 'Old Press';
        color: #FFF;
        font-size: 2em;
        background: #FBBA2F;
        border-bottom-left-radius: 10px ;
        border-bottom-right-radius: 10px;
        max-width: 230px;
        margin: 0 auto;
    }

    .promos-descriptions {
        margin-bottom: 96px;
    }

    .promos-descriptions .description {
        padding: 32px;
    }

    /***********************************************/

    /** Mataor info sections                       */



    .mataor-info {

        padding: 16px;

    }



    .mataor-info .text-right-sm-up {

        text-align: center;

    }



    .mataor-info .row {

        margin: 16px !important;

    }





    /***********************************************/

    /** Contact form                               */



    #contact-form input {

        height: 32px;

    }



    #contact-form label {

        font-size: 16px;

    }





    /***********************************************/

    /** Carousel                                   */



    .owl-theme .owl-dots {

        display: none;

    }





    /***********************************************/

    /** Restaurant menu                            */



    .menu-restaurant .category-image {

        max-width: 400px;

    }

}



/** Everything after xs */

@media screen and (min-width: 768px) {



    /***********************************************/

    /** Main Navbar                                */



    /* Mataor logo */

    .navbar-mataor .mataor-logo {

        left: calc(50% - 83px);

    }



    .navbar-mataor .mataor-logo > img {

        width: 150px;

    }





    /***********************************************/

    /** Carousel                                   */



    .owl-carousel .item {

        height: 400px;

    }





    /***********************************************/

    /** Restaurant menu                            */



    .menu-restaurant .category-title {

        font-size: 3.5em;

    }

}



/** Everything before md */

@media screen and (max-width: 991px) {



    /***********************************************/

    /** Main Navbar                                */



    /* Navbar links and items */

    .navbar-mataor .navbar-nav > li {

        margin: 0 16px;

        min-width: 55px;

        width: 55px;

    }



    .navbar-mataor .navbar-nav > li {

        font-size: 0.9em;

    }



    /* Social links */

    .navbar-mataor .social-links {

        padding-right: 0px;

        padding-top: 16px;

    }



    .navbar-mataor .social-links img {

        width: 24px;

    }





    /***********************************************/

    /** Main content on home page                  */



    .main-content #box {

        position: relative;

    }





    /***********************************************/

    /** Restaurant menu                            */



    .menu-restaurant .dish-icon {

        width: 20px;

    }

}



/** Everything on md and after */

@media screen and (min-width: 992px) {



    /***********************************************/

    /** Main Navbar                                */



    /* Mataor logo */

    .navbar-mataor .mataor-logo {

        left: calc(50% - 108px);

    }



    .navbar-mataor .mataor-logo > img {

        width: 200px;

    }



    /* Social links */

    .navbar-mataor .social-links {

        padding-right: 8px;

    }





    /***********************************************/

    /** Restaurant menu                            */



    .menu-restaurant .category-title {

        font-size: 5em;

    }



}



@media screen and (min-width: 1200px) {



    /***********************************************/

    /** Main Navbar                                */



    /* Navbar links and items */

    .navbar-mataor .navbar-nav > li {

        background-color: transparent;

        min-width: 108px;

        width: 108px;

    }



    .navbar-mataor .navbar-nav > li > a {

        font-size: 2.4em;

    }



    /* Social links */

    .navbar-mataor .social-links {

        padding-top: 8px;

    }



    .navbar-mataor .social-links img {

        width: 32px;

    }





    /***********************************************/

    /** Carousel                                   */



    .owl-carousel .item {

        height: 450px;

    }

}



@media screen and (min-width: 1700px) {



    /***********************************************/

    /** Main Navbar                                */



    /* Navbar links and items */

    .navbar-mataor .navbar-nav > li {

        background-color: transparent;

        min-width: 132px;

        width: 132px;

    }





    /***********************************************/

    /** Carousel                                   */



    .owl-carousel .item {

        height: 600px;

    }

}



@media (max-width: 991px) and (min-width: 768px) {

    .menu_fix span{

        font-size: 99%;

    }

}



