﻿/* Future Vision Restaurants
===================================================================================
- These locations should have the "fvr" body class on their pages
- The following files should be added to the location's "Design" Image Folder: iconOrange.png, markerOrange.png
- Nov 2019: Per client, all locations are taking on this styling. Remove ".fvr " from each item below



/* General
===================================================================================
=================================================================================== */
body {
     font-family: 'Montserrat', sans-serif;
}



/* IBE
===================================================================================
=================================================================================== */
#ibe {
     background: #f68b1f;
}
#ibe p small,
#ibe p small a {
    color: #000;
}
#ibe p small a:focus,
#ibe p small a:hover {
    text-decoration: none;
}



/* Headings
===================================================================================
=================================================================================== */
h1 {
     font-family: 'house-script', 'Oswald', sans-serif;
     text-transform: none;
}
.Slide1 h2, .Slide1 h3, .Slide1 h4 {
     text-shadow: 2px 2px 2px #000;
}    
h5 {
     color: #231f20;
     font-family: 'Montserrat', sans-serif;
     font-weight: 700;
}
h6 {
     font-family: 'Montserrat', sans-serif;
     font-weight: 400;
}

/** ADA 5/26/22 - the grey background of the restaurant section on location home pages cannot have the orange #c25700 text - updating that area only to have darker orange **/
#restaurant h5 {
     color: #231f20;
}

/* Links and Buttons
===================================================================================
=================================================================================== */
a, a:focus, a:hover {
     color: #b2012d;
}
.btn-default,
.btn-primary,
.btn-secondary {
     background: #f68b1f;
     color: #000 !important;
}
.btn-default:focus,
.btn-default:hover,
.btn-primary:focus,
.btn-primary:hover,
.btn-secondary:focus,
.btn-secondary:hover {
     background: #c25700;
}



/* Header
===================================================================================
=================================================================================== */
#mainNavLinks > li > a,
#mainNavLinks2 > li > a,
#mainNavLinks2 > li .loc,
#locNavLinks > li > a,
#locNavLinks2 > li > a {
     font-family: 'Montserrat', sans-serif;
     font-weight: 700;
}
header .ResponsiveNavWidget,
#showRight2 {
     font-family: 'Montserrat', sans-serif;
     font-weight: 700;
}
.cbp-spmenu-vertical .close-button:focus,
.cbp-spmenu-vertical .close-button:hover {
     color: #f68b1f;
}
.cbp-spmenu .nav a:focus,
.cbp-spmenu .nav a:hover,
.cbp-spmenu .nav a.current:focus,
.cbp-spmenu .nav a.current:hover {
     background: #f68b1f;
     color: #000;
}
.navbar-collapse.collapse {
     display: block !important;
}
#mainNavLinks2 > li .fa {
    font-size: 16px;
}
.fvrNavIcon {
    position: relative;
    width:  30px;
    height: 22px;
    
}
.fvrNavIcon:before {
    position: absolute;
    content: '';
    display: block;
    width:  30px;
    height: 22px;
    background-image: url('navIconOrange01.png');
    background-size: contain;
    background-repeat: no-repeat;
}
header.fixed .fvrNavIcon:before {
    background-image: url('navIconOrange02.png');
}



/* Hero
===================================================================================
=================================================================================== */
.MPVerticalSliderWidget .content,
#hero .slideCaption,
#hero .powerphrase {
     text-shadow: 2px 2px 2px #000 !important;
}
.MPVerticalSliderWidget .content .btn,
#hero .slideCaption .btn,
#hero .powerphrase .btn {
     text-shadow: none !important;
}
.ResFlexSlider2Widget .carousel-caption h3,
.ResFlexSlider2Widget .carousel-caption h1,
.slickHeroCarousel .slideCaption h3,
.slickHeroCarousel .slideCaption h1,
.TMPHeroWidget .powerphrase h1 {
     font-size: 45px;
     margin: 0;
}
.MPVerticalSliderWidget .content p:after,
.homepage .ResFlexSlider2Widget .carousel-caption p:after,
.tall-hero .ResFlexSlider2Widget .carousel-caption p:after,
.ResFlexSlider2Widget .tall-hero .carousel-caption p:after,
.homepage .slickHeroCarousel .slideCaption p:after,
.tall-hero .slickHeroCarousel .slideCaption p:after,
.slickHeroCarousel .tall-hero .slideCaption p:after,
.TMPHeroWidget .powerphrase:after {
     background: url('dividerOrange.png') repeat-x;
     background-size: 180px 14px;
}
.slickHeroCarousel .slideCaption p {
    margin-bottom: 25px;
    line-height: 1.5em;
}



/* Content
===================================================================================
=================================================================================== */
#content h1 {
    font-size: 42px;
}
#contentX h3 {
    font-size: 34px;
}



/* WIDGET - Melting Pot Intro
===================================================================================
=================================================================================== */
.MPIntroWidget .mpIntroHeading {
     font-size: 48px;
}
.MPIntroWidget .mpIntroHeading:after {
     background-image: url('dividerOrange.png');
     background-repeat: repeat-x;
     background-size: 180px 14px;
}

.MPIntroWidget .links ul {padding:0;margin:0;}
.MPIntroWidget .links li {list-style-type:none; display:inline-block;}

/* WIDGET - Melting Pot Restaurant Information
===================================================================================
=================================================================================== */
.MPLocInfoWidget .moLocInfoHeading {
     font-family: 'house-script', 'Oswald', sans-serif;
     font-size: 48px;
     text-transform: none;
}
.MPLocInfoWidget .social a:focus,
.MPLocInfoWidget .social a:hover {
     background: #c25700;
     border-color: #c25700;
     color: #000;
}



/* WIDGET - Melting Pot HTML
===================================================================================
=================================================================================== */
.MPHTMLWidget h4 {
     font-family: 'house-script', 'Oswald', sans-serif;
}



/* WIDGET - Melting Pot Map
===================================================================================
=================================================================================== */
.MPMapWidget #mapContent {
     font-family: 'Montserrat', sans-serif;
}
.MPMapWidget #mapContent h3 {
     font-family: 'Montserrat', sans-serif;
     font-weight: 700;
     text-transform: none;
}
.MPMapWidget a {
     text-decoration: underline;
     text-transform: none;
}
.MPMapWidget a:focus,
.MPMapWidget a:hover {
     text-decoration: none;
}
.MPMapWidget .gm-style .gm-style-mtc div {
     font-size: 13px !important;
     padding: 0 10px !important;
     height: 35px !important;
}



/* WIDGET - Melting Pot Events
===================================================================================
=================================================================================== */
.MPEventsWidget .filters .btn.active {
     background: #f68b1f;
     color: #000;
}
.MPEventsWidget .filters .btn.active:focus,
.MPEventsWidget .filters .btn.active:hover {
     background: #c25700;
}
.MPEventsWidget .featured .info {
     background: #f68b1f;
     color: #000;
}
.MPEventsWidget h4 {
     font-family: 'house-script', 'Oswald', sans-serif;
     font-size: 36px;
     text-transform: none;
}
.MPEventsWidget .btnMenu {
     color: #000 !important;
}
.MPEventsWidget .featured .btnMenu,
.MPEventsWidget .featured .btnDetails {
    background: #fff !important;
}
.MPEventsWidget .featured .btnMenu:focus,
.MPEventsWidget .featured .btnMenu:hover,
.MPEventsWidget .featured .btnDetails:focus,
.MPEventsWidget .featured .btnDetails:hover {
     background: #e6e6e6 !important;
}
.MPEventsWidget .btnDetails {
     background: #f68b1f !important;
     color: #000 !important;
}
.MPEventsWidget .btnDetails:focus,
.MPEventsWidget .btnDetails:hover {
     background: #c25700 !important;
}
.MPEventsWidget .btnMenu {
     background: #f68b1f !important;
}
.MPEventsWidget .btnMenu:focus,
.MPEventsWidget .btnMenu:hover {
     background: #c25700 !important;
}



/* WIDGET - Melting Pot Create Your Night
===================================================================================
=================================================================================== */
.MPCreateWidget h4 {
     font-family: 'house-script', 'Oswald', sans-serif;
     font-size: 36px;
     text-transform: none;
}



/* WIDGET - Accordion 3.0
===================================================================================
=================================================================================== */
.viz-accordionWidget .panel-default > .panel-heading {
     background: #f68b1f;
}
.viz-accordionWidget .panel-title > a {
     color: #000;
     font-family: 'Montserrat', sans-serif;
     font-size: 1.1rem !important;
     min-height: 44px;
     text-transform: none;
}
.viz-accordionWidget .panel-title > a .iconFont:after {
     color: inherit !important;
}



/* WIDGET - Melting Pot Menu
===================================================================================
=================================================================================== */
.MPMenuWidget .links .nav-pills > li > a {
     text-decoration: underline;
}
.MPMenuWidget .links .nav-pills > li > a:focus,
.MPMenuWidget .links .nav-pills > li > a:hover {
     background-color: transparent;
     color: #f68b1f;
     text-decoration: none;
}
.MPMenuWidget .panel .nav-pills > li.active > a,
.MPMenuWidget .panel .tab-style {
     background-color: #f68b1f;
     color: #000;
}
.MPMenuWidget .panel .nav-pills > li.active > a:focus,
.MPMenuWidget .panel .nav-pills > li.active > a:hover {
     background-color: #c25700;
}
.MPMenuWidget h2.panel-title {
     text-transform: none;
}
.MPMenuWidget .panel-title > a.collapsed {
     background: #e0e0e0;
     color: #000;
}
.MPMenuWidget .panel-title > a.collapsed:hover {
     background: #ccc;
}
.MPMenuWidget .panel-title > a {
     background: #f68b1f;
     font-family: 'house-script', 'Oswald', sans-serif;
}
.MPMenuWidget .panel-title > a:focus,
.MPMenuWidget .panel-title > a:hover {
     color: #000;
}
.MPMenuWidget .tab-pane .signature {
     background: url('menu-signatureOrange.png') 0 11px no-repeat;
}
.MPMenuWidget h3.menu-item {
     font-family: 'Montserrat', sans-serif;
     font-weight: bold;
     text-transform: none;
}
.MPMenuWidget .legend {
     text-transform: capitalize;
}



/* WIDGET - Melting Pot Tabs
===================================================================================
=================================================================================== */
.TMPtabsWidget .nav-pills > li.active > a,
.TMPtabsWidget .nav-pills > li.active > a:focus,
.TMPtabsWidget .nav-pills > li.active > a:hover,
.TMPtabsWidget .nav > li > a:focus,
.TMPtabsWidget .nav > li > a:hover {
    background: #f68b1f;
    color: #000;
}
.TMPtabsWidget h4 {
     font-size: 28px;
}



/* WIDGET - Melting Pot Book a Table
===================================================================================
=================================================================================== */
.MPdrsbWidget #IBEcollapse a.btn {
    background: #fff !important;
    color: #000;
}
.MPdrsbWidget #IBEcollapse a.btn:focus,
.MPdrsbWidget #IBEcollapse a.btn:hover {
    background: #e6e6e6 !important;
}



/* Form
===================================================================================
=================================================================================== */
#rfp h2,
#rfp .dateFormat {
     color: #f68b1f !important;
}
#rfp .submit {
     background: #f68b1f;
     color: #000;
}
#rfp .submit:focus,
#rfp .submit:hover {
     background: #c25700;
}



/* Footer
===================================================================================
=================================================================================== */
footer .ResponsiveNavWidget {
     font-family: 'Montserrat', sans-serif;
     font-weight: 700;
}
footer .ResponsiveNavWidget a {
     padding: 10px;
}
footer .bottom a:focus,
footer .bottom a:hover {
     color: #f68b1f;
}



/* Media Queries
===================================================================================
=================================================================================== */
@media (min-width: 768px) {
     /*** Hero ***/
     .ResFlexSlider2Widget .carousel-caption h3,
     .ResFlexSlider2Widget .carousel-caption h1,
     .slickHeroCarousel .slideCaption h3,
     .slickHeroCarousel .slideCaption h1,
     .TMPHeroWidget .powerphrase h1 {
          font-size: 70px;
     }
     
     /*** Melting Pot Menu ***/
     .MPMenuWidget .panel-title > a {
          padding: 55px 20px 45px;
     }
}
@media (min-width: 992px) {
     /*** Header ***/
     .cbp-spmenu #mainNavLinks,
     .cbp-spmenu #mainNavLinks2 {
          display: block;
     }
     #locNavLinks > li > a,
     #locNavLinks2 > li > a {
         text-shadow: none;
     }
     .MPResNavWidget {
         display: none;
     }
} /* end min-width: 992px */

@media (max-width: 1199px) {
     .navbar-collapse.collapse {
          display: none !important;
     }
     .navbar-nav {
          float: none !important;
     }
} /* end max-width: 1199px */

@media (min-width: 1200px) {
     /*** Header ***/
     .cbp-spmenu #mainNavLinks,
     .cbp-spmenu #mainNavLinks2 {
           display: none;
     }
     #mainNavLinks2 > li .loc {
          font-size: 70%;
     }
     #locNavLinks > li > a,
     #locNavLinks2 > li > a {
          font-size: 0.75em;
          text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.74);
     }
     .MPResNavWidget {
          display: block;
     }
     .navbar #mainNavLinks > li > a,
     .navbar #mainNavLinks2 > li > a {
          font-size: 0.75em;
          padding: 15px 5px;
     }
} /* end min-width: 1200px */

@media (min-width: 1400px) {
     /*** Header ***/
     #mainNavLinks2 > li .fa {
          font-size: 16px;
     }
     #locNavLinks > li > a,
     #locNavLinks2 > li > a {
          font-size: 0.85em;
     }
     .navbar #mainNavLinks > li > a,
     .navbar #mainNavLinks2 > li > a {
          font-size: 0.85em;
          padding: 15px 10px;
     }
     #mainNavLinks2 > li .loc {
          font-size: 80%;
     }
} /* end min-width: 1400px */

@media (min-width: 1500px) {
     /*** Header ***/
     .navbar #mainNavLinks > li > a,
     .navbar #mainNavLinks2 > li > a {
          padding: 15px;
     }
} /* end min-width: 1500px */