@import url(fonts.css?v=1.1);

.clear { clear:both;}
p { font-family: 'Cabin'; font-size:16px; font-weight:400; color: #000000; line-height: 24px; letter-spacing: 0.5px;}

/*--------------------
   1. BASE CSS
----------------------*/

.alignleft { float: left; margin-right: 15px;}
.alignright { float: right; margin-left: 15px;}
.aligncenter { display: block; margin: 0 auto 15px;}

a { color: #212324; -webkit-transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; transition: 0.3s;}
a:hover { color: #ca3d26;}
a:focus, a:hover { outline: 0; text-decoration: none;}

img { max-width: 100%; height: auto;}

h1, h2, h3, h4, h5, h6 { font-family: 'Source Sans Pro'; font-weight: 700; margin: 0 0 15px;}

html,
body { height: 100%}
body { font-family: 'Cabin'; font-size: 15px; font-weight: 400; color: #555555;}

/* Remove Chrome Input Field's Unwanted Yellow Background Color */

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0px 1000px white inset !important;
}

.navbar-toggle { border: 2px solid #fff; border-radius: 0;}
.navbar-toggle .icon-bar { background: #fff none repeat scroll 0 0;}

.is-sticky .navbar-header .collapse,
.is-sticky .navbar-toggle { border: 2px solid #1a1a1a;}
.is-sticky .navbar-toggle .icon-bar { background: #1a1a1a none repeat scroll 0 0;}

.area-title { margin-bottom: 35px;}
.area-title h2 { font-family: 'Herr Von Muellerhoff';  font-weight:400;
    color: #c59d5f; font-size: 100px; margin: 0; margin-bottom: -45px; position: relative;}
.area-title h2 span { font-size:120px;}
.area-title h1 { font-size:46px; font-weight:900; letter-spacing: 9.5px; text-transform:uppercase; color: #000000;}
.area-title .seprator { color: #515150; opacity: 0.8; font-size: 18px;}

.section-padding { padding: 100px 0;}
.no-padding { padding: 0;}
.no-margin { margin: 0;}

.margin-top { margin-top: 40px;}
.margin-bottom { margin-bottom: 40px;}
.gray-bg { background: #f3f4f4;}


/*--------------------------
    2. TOP AREA
---------------------------*/

.top-area { width: 100%; height: 100%; position: relative;}

/*---------------------------------
    2.1 MAINMENU AREA
-----------------------------------*/

.mainmenu-area { position: relative; z-index: 9999;
    -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s;}

.is-sticky .mainmenu-area {
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28);
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28);
    z-index: 99999;}

.mainmenu-area::after { background: rgba(0, 0, 0, 0) url("../img/icons/tri-promo-bottom-white.png") repeat scroll 0 0;
    content: ""; width: 100%; height: 7px; position: absolute; left: 0; bottom: -7px; opacity: 0;}

.is-sticky .mainmenu-area::after { opacity: 1;}

.navbar-header { -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s;
    -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s;}

.navbar-brand { display: none;}
.navbar-brand.white { display: block;}

.is-sticky .navbar-brand.white { display: none;}
.is-sticky .navbar-brand { display: block;}

.navbar { border-bottom: 0 none; border-top: 0 none; margin-bottom: 0;}
.navbar .navbar-collapse { padding-left:0; padding-right:0;}

ul#nav { float: right; -webkit-transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; transition: 0.3s;}
ul#nav li a { background: rgba(0, 0, 0, 0) none repeat scroll 0 0; color: #ffffff;
    font-size: 13px; font-weight: 400; letter-spacing: 1px; padding: 48px 15px; text-transform: uppercase;
    -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s;}
ul#nav li.active a::before { background: #ca3d26 none repeat scroll 0 0;
    content: ""; width: 100%; height: 2px; position: absolute; top: 0; left: 0;
    -webkit-transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; transition: 0.3s;}

ul#nav li:hover a,
ul#nav li.active a { color: #ca3d26;}

.top-bar { border-bottom: 1px solid rgba(255, 255, 255, 0.4);}

.is-sticky ul#nav li a { padding: 45px 20px; color: #000000;}
.is-sticky ul#nav li.active a,
.is-sticky ul#nav li:hover a { color: #ca3d26;}
.is-sticky .signup-and-login-button ul li { padding: 14px 0;}
.is-sticky .signup-and-login-button ul li a { background: #d64332 none repeat scroll 0 0; color: #fff;}
.is-sticky .mainmenu-area { background: #ffffff none repeat scroll 0 0;}
.is-sticky .navbar-header { margin-top: -7px;}


/*-----------------------------------
    2.2 SLIDER AREA
-------------------------------------*/

.header-top-area { position: absolute; width: 100%; z-index: 999;}

.slider-area { position: relative; width: 100%; height: 100%;}

/*.slider-area h1 { font-size: 65px; font-weight: 300; letter-spacing: 2px; text-transform: uppercase;}
.slider-area h1 span { font-weight: 700;}
.slider-area h2 { font-family: 'Herr Von Muellerhoff'; font-size: 82px;
	letter-spacing: 2px; text-transform: capitalize;}
.slider-area h3 { line-height:inherit;}*/

/*.slider-area h3 a,
a.home-reservation-button {
    border: 1px solid;
    color: #fff;
    display: inline-block;
    font-size: 13px;
    margin-top: 15px;
    padding: 10px 30px;
}

.slider-area h3 a:hover,
a.home-reservation-button:hover {
    color: #fff;
    background: #ca3d26 none repeat scroll 0 0;
    border-color: #ca3d26;
}*/

.pogoSlider { width: 100%; height: 100%; 
	position: relative; overflow: hidden; text-align: center; padding-bottom: 0;}

.pogoSlider-slide {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-size: cover;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    opacity: 0;
    overflow: hidden;
    -webkit-perspective: 1300px;
    perspective: 1300px;
    position: absolute;
    width: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-top: 5%
}

.pogoSlider-slide::after { background: #000 url("../img/pattarn.png") repeat scroll 0 0;
    content: ""; width: 100%; height: 100%; opacity: 0.6; position: absolute; left: 0; top: 0; z-index: -1;}


/*----------------------------
    3. About Area
------------------------------*/

.about-area { position: relative;}

/*.about-area::after,
.about-area::before,
.gallery-area::after,
.blog-area::before {
    background: rgba(0, 0, 0, 0) url("../img/icons/tri-promo-bottom-white.png") repeat scroll 0 0;
    content: ""; width: 100%; height: 7px; position: absolute; top: -7px; left: 0; z-index: 9;	
    -webkit-transform: rotateX(180deg); -moz-transform: rotateX(180deg); transform: rotateX(180deg);}

.about-area::before { bottom: -7px; top: auto;
	-webkit-transform: rotateX(360deg); -moz-transform: rotateX(360deg); transform: rotateX(360deg);}
.blog-area::before { top: 0px;
	-webkit-transform: rotateX(360deg); -moz-transform: rotateX(360deg); transform: rotateX(360deg);}

.about-area::after, 
.about-area::before,
.gallery-area::after,
.blog-area::before { 
	background-size:contain; -webkit-background-size:contain; -moz-background-size:contain; -ms-background-size:contain;}*/


/*-----------------------------
    4. Promotions Area
------------------------------*/

.promotions-area { position: relative;}

.banner-area-bg,
.promotion-area-bg,
.blog-area-bg {
    background: rgba(0, 0, 0, 0) url("../img/promotions/promotions_area_bg_2.jpg?v=1.1") no-repeat scroll center center / cover;
    width: 100%; height: 100%; position: absolute; top: 0; left: 0;}

.banner-area-bg:after,
.promotion-area-bg:after,
.blog-area-bg:after { background: #000 url(../img/pattarn.png); width: 100%; height: 100%;
    content: ""; position: absolute; top: 0; left: 0; opacity: 0.6;}

.promotions-area .area-title h1 { color:#FFFFFF;}
.promotions-area .promotions-section a.reservation-button { background: #FFFFFF none repeat scroll 0 0;
    color: #252525;}
.promotions-area .promotions-section a.reservation-button:hover { background: #c59d5f none repeat scroll 0 0;
    color: #ffffff;}	


/*-------------------------------
    6. Reservation Button Area
---------------------------------*/

a.reservation-button { font-family: 'Cabin'; font-weight:400; font-size:15px; color: #ffffff;
    background: #252525 none repeat scroll 0 0; display: inline-block; min-width: 300px;
    letter-spacing: 3px; padding: 10px 14px; margin-top:15px; text-transform: uppercase;
	border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; -ms-border-radius:3px;}
a.reservation-button:hover { background: #c59d5f none repeat scroll 0 0; color: #ffffff;}


/*-----------------------------
    8. BLOG AREA
------------------------------*/

.blog-area { position: relative;}
.blog-area-bg { background: rgba(0, 0, 0, 0) url("../img/promotions/promotions_area_bg_3.jpg") no-repeat scroll center center / cover;}

.post-details { background: transparent; padding: 15px 20px; min-height:300px;}
.post-details h3 { font-size: 22px; font-weight: 600; margin-bottom: 20px; padding-bottom: 20px; 
	position: relative; color: #FFFFFF; text-transform: uppercase; letter-spacing: 2px;}
.post-details h3::after { background: #FFFFFF; content: ""; width: 50px; height: 2px; 
	position: absolute; bottom: 0;  left: 0; right: 0; margin: 0 auto;}
.post-details p { font-size:16px; margin:0; color: #FFFFFF; font-weight: 400; line-height:26px;}

.row.post-slider { margin: 0;}
.row.post-slider .col-lg-4 { padding: 0; width: 100%;}

.blog-area .owl-controls,
.menus-area .owl-controls { margin-top: -30px; position: absolute; top: 50%; width: 100%;}

.blog-area .owl-nav>div,
.menus-area .owl-nav>div { background: #c59d5f none repeat scroll 0 0; text-align: center;
    color: #fff; display: inline-block; margin-top: -20px; position: absolute; top: 50%;
	width: 40px; height: 40px; line-height:40px; font-size: 40px; opacity: 0;
    -webkit-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s;}

.blog-area .owl-nav>div.owl-next,
.menus-area .owl-nav>div.owl-next { right: -50px;}

.blog-area .owl-nav>div.owl-prev,
.menus-area .owl-nav>div.owl-prev { left: -50px;}

.post-slider:hover .owl-nav>div ,
.food-menu-list:hover .owl-nav>div { opacity: 1;}

.post-details { background: transparent; padding: 15px 10px; min-height:300px;}
.post-details h3 { font-size: 22px; font-weight: 600; margin-bottom: 20px; padding-bottom: 20px; 
	position: relative; color: #FFFFFF; text-transform: uppercase; letter-spacing: 2px;}
.post-details h3::after { background: #FFFFFF; content: ""; width: 50px; height: 2px; 
	position: absolute; bottom: 0;  left: 0; right: 0; margin: 0 auto;}
.post-details p { font-size:16px; margin:0; color: #FFFFFF; font-weight: 400; line-height:26px;}


/*------------------------------
    9. GALLERY AREA
-------------------------------*/

.gallery-area { position: relative;}


/*------------------------------
    10. FOOTER AREA
-------------------------------*/

.footer-area { background: #121212 none repeat scroll 0 0; position: relative;}
.footer-logo img { display:inline-block;}

.footer-area .footer-hours, .footer-area .footer-logo { text-align:center;}
.footer-area .footer-hours h3 { font-family: 'Cabin'; color:#FFFFFF; font-weight: 400; font-size: 22px;}
.footer-area .footer-hours h3 i { font-size: 26px; vertical-align: middle; margin-right:10px;}

.footer-area .footer-hours ul { list-style-type:none; padding:0; margin:0;}
.footer-area .footer-hours ul li { display:block; margin-bottom:10px; font-size:16px; color:#FFFFFF; text-align:right;}
.footer-area .footer-hours ul li span { width:50%; text-align:center; float: left;}
.footer-area .footer-hours ul li strong { width:100%; text-align:center; display: block; background: #c59d5f;}

.footer-area .footer-logo { margin-top:40px;} 

.footer-area .footer-social { margin-top:30px; text-align:center;} 
.footer-area .footer-social a { width: 36px; height: 36px; line-height: 36px; font-size: 20px;
    background: rgba(255, 255, 255, 0.70); display: inline-block; margin: 0 3px; color:#000000;
	border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%;}
.footer-area .footer-social a:hover	{ background: rgba(255, 255, 255, 1);}

.footer-bottom-area { background: #252525 none repeat scroll 0 0; padding:40px 0; text-align:center;} 
.footer-bottom-area p { margin:0; color: rgba(255, 255, 255, 0.65);}
.footer-bottom-area p a { color: rgba(255, 255, 255, 0.65);}
.footer-bottom-area p a:hover { color: #fff;}



/*------------------------------
    11. SCROLL TO TOP
-------------------------------*/

a.scrolltotop { background: #C59D5F none repeat scroll 0 0; color: #fff;
    border: 1px solid transparent; text-align: center; display: none;
	width: 40px; height: 40px; padding-top: 5px; font-size: 20px;
    position: fixed; bottom: 20px; right: 20px; z-index: 99;}
a.scrolltotop:hover { background: #121212; border: 1px solid;}






/*==================================
        END OF MAIN STYLESHEET
====================================*/


.slider-area .pogoSlider span.delivery-tag { position: absolute; bottom: 0; right: 0px;}
.promotions-area.section-padding{ text-align:center;}
.promotions-area.section-padding h3{ color:rgba(255, 255, 255, 0.8); font-weight:500; font-size:28px;}


body.navbar-change ul#nav li a { padding-left:15px; padding-right:15px;}
body.navbar-change .is-sticky ul#nav li a { padding-left:15px; padding-right:15px;}
body.navbar-change .navbar-nav { margin:0;}
body.navbar-change ul#nav li.order-online-btn a { /*display:none;*/}

body.navbar-change .is-sticky ul#nav li.order-online-btn a { display:block; padding: 10px 14px; margin-top: 35px;
    background: #ca3d26; color:#FFFFFF;}
body.navbar-change .is-sticky ul#nav li.order-online-btn a:hover { color:#FFFFFF;}	

body.navbar-change ul#nav.navleft { float:left!important;}
body.navbar-change ul#nav.navright { float:right!important;}
/*body.navbar-change .navbar-header { text-align:center;}
body.navbar-change .navbar-header a { position: absolute; right: 0; left: 0; float: none; padding: 12px 0 10px 0; height: auto;
	width: 200px; margin: 0 auto; display: inline-block;}
body.navbar-change .navbar-header a img { display: inline-block;}*/
body.navbar-change .header-top-area .top-ordering-btn { display:none;}	
	
body.navbar-change .navbar>.container .navbar-brand, body.navbar-change .navbar>.container-fluid .navbar-brand {  margin-left: auto!important;}

body.navbar-change ul#nav { display:block; text-align:right;}
body.navbar-change ul#nav li { float:none; display:inline-block;}
body.navbar-change ul#nav li a, body.navbar-change .is-sticky ul#nav li a { /*padding: 25px 12px;*/ padding:45px 12px;}
body.navbar-change .is-sticky ul#nav li.order-online-btn a { margin-top: 0; padding: 10px 12px;}

body.navbar-change .navbar-header a.header-order { display:none;}
.book-table-popup a.catering { background: #25a261;}
.book-table-popup a.catering:hover { color: #25a261; background:#fff;}

ul#nav .dropdown {
  position: relative;
  display: inline-block;
}
ul#nav .dropdown-content {
  display: none;
  position: absolute;
  background-color: #f1f1f1;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}
ul#nav .dropdown-content a {
  color: #333;
  padding: 12px 16px !important;
  text-decoration: none;
  display: block;
}
ul#nav .dropdown-content a:hover {background-color: #ddd;color:#000;}
ul#nav .dropdown:hover .dropdown-content {display: block;}

.banner-area-bg{ background: rgba(0, 0, 0, 0) url("../img/promotions/promotions_area_bg_1.jpg?v=1.1") no-repeat scroll center center / cover;}
.promotion-area-bg{ background: rgba(0, 0, 0, 0) url("../img/promotions/promotions_area_bg_2.jpg?v=1.1") no-repeat scroll center center / cover;}


/*==================================
        New Layout Version 3 STYLESHEET
====================================*/


body.navbar-change { padding:12px;}
.is-sticky .mainmenu-area { -webkit-box-shadow:none; box-shadow:none;}
.is-sticky .mainmenu-area::after { display:none;}

body.navbar-change .navbar-brand { height:auto; padding: 15px 0;}
body.navbar-change .navbar-brand>img { max-height: 90px;}

body.navbar-change ul#nav li:hover a { color: #C59D5F;}
body.navbar-change ul#nav li.active a { color: #FFFFFF;}
body.navbar-change .is-sticky ul#nav li:hover a {}
body.navbar-change .is-sticky ul#nav li.active a { color: #000000;}
body.navbar-change .is-sticky ul#nav li.active a::before { background: #000000 none repeat scroll 0 0;}

body.navbar-change ul#nav li.active a::before { background: #FFFFFF none repeat scroll 0 0; bottom: 30px; top:auto;}

.banner-area {}
.slider-area .area-title { margin:0;}
.slider-area .area-title h1 { color: #FFFFFF; margin:0;}
.slider-area .banner-section { margin-top:0;}
.slider-area .banner-section p { color: #FFFFFF; text-transform:uppercase; letter-spacing:4px; font-size:15px;}
.slider-area .banner-section a.reservation-button { margin-left:6px; margin-right:6px;}
.slider-area .banner-section a.reservation-button { background: #FFFFFF none repeat scroll 0 0; color: #252525;}
.slider-area .banner-section a.reservation-button:hover { background: #c59d5f none repeat scroll 0 0; color: #ffffff;}	

.separator-line { position:relative; width: 480px; margin: 0 auto;}
.separator-line .star { color: #c59d5f; font-size: 18px;}
.separator-line .line { content: ""; position: absolute; top: 50%; width: 42%; border: 1px solid #FFFFFF;
    -webkit-transform: translateY(-50%); transform: translateY(-50%); opacity: 0.8;}
.separator-line .line-left { right: 58%; width: 42%; opacity: 1; color: #FFFFFF;}
.separator-line .line-right { left: 58%; width: 42%; opacity: 1; color: #FFFFFF;}

.separator-line .arrow { content: ""; position: absolute; top: 50%; width: 0; height: 0; border: 5px solid transparent;
    -webkit-transform: translateY(-50%); transform: translateY(-50%);}
.separator-line .arrow-left { left: 0; border-left: 7px solid #FFFFFF;}
.separator-line .arrow-right { right: 0; border-right: 7px solid #FFFFFF;}


.gallery-sect { text-align: center;}
.gallery-sect img { display: inline-block; width: 43%; margin: 2%;}

.blog-area .area-title h1 { color: #FFFFFF; margin:0;}

.online-ordering-section { text-align:center;}
.online-ordering-section p strong { display:block; margin-top: 10px; font-size:18px; font-weight: 700;}


body.navbar-change.innerpage .top-area { height: 60%;}
body.navbar-change.innerpage .banner-area .area-title h1 { letter-spacing: 6px;}