/*------------------------------------------------------------------
[Master Stylesheet Theme 1 (Default)]
Project: Restaurant - Multipurpose Html5 Template For Restaurant, Bar and Cafe
Version: 1.0.0
Assigned to: Themeforest
Primary use: Restaurant, Bar, Cafe, Food, Meals, Dishes, Cakes, Icecream
-------------------------------------------------------------------*/
/*------------------------------------------------------------------
[Table of contents]
1. Fonts
2. Body
3. Default Css
3.1 Reset Style
3.2 Form Inputs
3.3 Button Style
3.4 Padding Style
3.5 Margin Style
4. Social Icon
5. Custom Dropdown
6. Search bar
7. Header Style
7.1 Top Header
7.2 Navigation Bar
8. Main Slider
9. Heading Style
10. Services
11. Dishes Collection
12. Banner Section
13. Dishes Menu
14. Sticker Style
15. Opening Hours
16. Special menu
17. Our Team
18. Testimonials
19. Blog Section
20. Page Header
21. Register Page
22. Sidebar
23. Comment Area
24. Owl Carousel Style
25. Pagination
26. Preloader
27. Common Css
27.1 About
27.2 Admin Section
27.3 Theme Box
27.4 Theme Form
28. Service Detail
29. Gallery Page
30. FAQ Page
31. Dishes Page
32. Error Page
33. Contact Page
34. Comming Soon
35. Team Detail
36. Landing Page
37. Dish Filter
38. User Profile
39. Footer
-------------------------------------------------------------------*/
/*---bootstap.CSS ---*/
@import url("/restaurant/assets/css/bootstrap.min.css");
/*---mega menu .CSS ---*/
@import url("/restaurant/assets/plugin/megamenu/css/hover-dropdown-menu.css");
/*---fancybox.CSS ---*/
@import url("/restaurant/assets/plugin/fancyBox/css/jquery.fancybox.css");
/*---acordian.CSS ---*/
@import url("/restaurant/assets/plugin/acordian/css/jquery-ui.css");
/*---owl-carousal.CSS ---*/
@import url("/restaurant/assets/plugin/owl-carousel/css/owl.carousel.css");
@import url("/restaurant/assets/plugin/owl-carousel/css/owl.theme.default.css");
/*---fontawesome.CSS font ---*/
/*@import url("/restaurant/assets/plugin/font-awesome/css/font-awesome.min.css");*/
/* theme effect hover CSS*/
@import url("/restaurant/assets/plugin/hover-effect/css/themeHover.css");
/*---STYLE.CSS inluad style---*/
/*@import url("/restaurant/assets/css/style.css");*/
/*
==========================
1. Fonts
==========================
*/
@import url('https://fonts.googleapis.com/css?family=Lato:100,300,400,700,900|Satisfy');
/*
==========================
2. Body
==========================
*/
body {
font-family: 'Lato', sans-serif;
font-size: 16px;
color: #777;
line-height: 1.8em;
background: #ffffff;
-webkit-font-smoothing: antialiased;
max-width: 100%;
overflow-x: hidden;
}
/*
==========================
3. Default Css
==========================
*/
/* 3.1 Reset Style */
img {
max-width: 100%;
}
a {
text-decoration: none;
cursor: pointer;
color: inherit;
-webkit-transition: all 0.45s ease-in-out;
-moz-transition: all 0.45s ease-in-out;
-o-transition: all 0.45s ease-in-out;
-ms-transition: all 0.45s ease-in-out;
transition: all 0.45s ease-in-out;
}
a:hover,
a:focus,
a:visited {
text-decoration: none;
outline: none;
-webkit-transition: all 0.45s ease-in-out;
-moz-transition: all 0.45s ease-in-out;
-o-transition: all 0.45s ease-in-out;
-ms-transition: all 0.45s ease-in-out;
transition: all 0.45s ease-in-out;
}
p,
em {
font-family: 'Lato', sans-serif;
font-size: 16px;
line-height: 1.6em;
color: inherit;
}
h1,
h2,
h3,
h4,
h5,
h6 {
position: relative;
font-weight: normal;
margin: 0px;
background: none;
line-height: 1.6em;
font-family: 'Lato', sans-serif;
color: #262626;
text-transform: initial;
}
.small-text-center {
text-align: center;
}
.special-font {
font-size: 24px;
}
section {
position: relative;
width: 100%;
float: left;
}
.positionR {
position: relative;
}
.positionS {
position: static;
}
.positionA {
position: absolute;
}
.black-bg {
background: #000;
}
.white-bg {
background: White;
}
.grey-bg {
background: #f2f2f2;
}
.border-box {
border: 1px solid lightgray;
}
ul {
list-style: none;
padding: 0;
margin: 0;
}
ul li {
/* Commented style for better third-tier menu alignment */
/* font-size: 16px; */
}
.clear {
clear: both;
}
.theme-border-bottom {
border-bottom: 1px solid;
}
.parallax-style {
background-attachment: fixed;
}
.colorW {
color: #fff;
}
.colorB {
color: #000;
}
.colorG {
#777
}
.title {
text-transform: uppercase;
}
.fontB {
font-weight: 600;
}
.special-para {
font-size: 14px;
}
.slider-text h1,
.foot-sec h3,
.theme-heading h1,
.opening-hours h1,
.page-header-heading h3,
.sidebar-box h4,
.admin-section h3,
.comment-section h3,
.theme-form h3,
.comming-soon-content h2 {
font-family: 'Satisfy', cursive;
font-weight: bold;
}
/* 3.2 Form Inputs */
input[type=text],
input[type=email],
input[type=search],
input[type=password],
input[type=number],
select {
padding: 5px 20px;
border: 0;
display: inline-block;
width: 100%;
border: 1px solid #808080;
outline: none;
height: 40px;
font-size: 13px;
}
textarea {
padding: 5px 20px;
border: 0;
display: inline-block;
width: 100%;
border: 1px solid #808080;
outline: none;
font-size: 13px;
}
input[type=radio] {
position: absolute;
visibility: hidden;
}
input[type=checkbox] {
position: absolute;
visibility: hidden;
}
.box-check:before {
display: block;
position: absolute;
content: "\f00c";
border-radius: 0;
top: 0;
left: 1px;
margin: auto;
transition: background 0.25s linear;
-webkit-transition: background 0.25s linear;
font: normal normal normal 11px/1 FontAwesome;
opacity: 0;
}
.box-check {
display: block;
position: absolute;
border: 2px solid;
border-radius: 0;
height: 15px;
width: 15px;
top: 17px;
margin-top: -10px;
left: 0;
z-index: 5;
transition: border .25s linear;
-webkit-transition: border .25s linear;
}
.check {
border: 5px solid #FFFFFF;
}
.check::before {
display: block;
position: absolute;
content: '';
height: 10px;
width: 10px;
top: 4px;
left: 4px;
margin: auto;
transition: background 0.25s linear;
-webkit-transition: background 0.25s linear;
visibility: hidden;
}
.check {
display: block;
position: absolute;
border: 2px solid;
height: 20px;
width: 20px;
top: 50%;
margin-top: -10px;
left: 15px;
z-index: 5;
transition: border .25s linear;
-webkit-transition: border .25s linear;
}
input[type=radio]:checked ~ .check::before {
visibility: visible;
}
input[type=radio]:checked ~ label {
#color: #2e2e2e;
}
input[type=checkbox]:checked ~ .box-check {
border: 2px solid;
}
input[type=checkbox]:checked ~ label {
#color: #2e2e2e;
}
input[type=checkbox]:checked ~ .box-check:before {
opacity: 1;
}
ul.list label.radio-label,
label.radio-label {
display: block;
position: relative;
font-size: 16px;
padding: 5px 0px 0px 15px;
margin: 0 auto;
height: 30px;
z-index: 9;
cursor: pointer;
-webkit-transition: all 0.25s linear;
text-transform: capitalize;
}
label {
display: inline-block;
font-weight: 400;
margin: 0 0 5px 0px;
color: #777;
}
input::-webkit-input-placeholder,
select::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
color: #808080;
}
input::-moz-placeholder,
select::-moz-placeholder,
textarea::-moz-placeholder {
color: #808080;
}
input:-ms-input-placeholder,
select:-ms-input-placeholder,
textarea:-ms-input-placeholder {
color: #808080;
}
input:-moz-placeholder,
select:-moz-placeholder,
textarea:-moz-placeholder {
color: #808080;
}
.search_bar input::-webkit-input-placeholder,
.search_bar select::-webkit-input-placeholder,
.search_bar textarea::-webkit-input-placeholder {
color: #fff;
}
.search_bar input::-moz-placeholder,
.search_bar select::-moz-placeholder,
.search_bar textarea::-moz-placeholder {
color: #fff;
}
.search_bar input:-ms-input-placeholder,
.search_bar select:-ms-input-placeholder,
.search_bar textarea:-ms-input-placeholder {
color: #fff;
}
.search_bar input:-moz-placeholder,
.search_bar select:-moz-placeholder,
.search_bar textarea:-moz-placeholder {
color: #fff;
}
i.input {
position: absolute;
top: 0;
margin-top: 12px;
margin-left: 15px;
}
/* 3.3 Button Style */
.itg-button {
border: 1px solid #262626;
color: #262626;
display: inline-block;
line-height: 1em;
padding: 12px 30px;
font-size: 15px;
-webkit-transition: all 0.45s ease-in-out;
-moz-transition: all 0.45s ease-in-out;
-o-transition: all 0.45s ease-in-out;
-ms-transition: all 0.45s ease-in-out;
transition: all 0.45s ease-in-out;
background-color: transparent;
}
.itg-button.light:hover,
.itg-button:hover,
.itg-button.dark {
color: #fff;
}
.itg-button.light {
border-color: #fff;
color: #fff;
}
/* 3.4 Padding Style */
.pad0 {
padding: 0px;
}
.pad5 {
padding: 5px;
}
.pad10 {
padding: 10px;
}
.pad15 {
padding: 15px;
}
.pad20 {
padding: 20px;
}
.pad30 {
padding: 30px;
}
.pad40 {
padding: 40px;
}
.pad50 {
padding: 50px;
}
.pad60 {
padding: 60px;
}
.pad70 {
padding: 70px;
}
.pad80 {
padding: 80px;
}
.pad90 {
padding: 90px;
}
.pad100 {
padding: 100px;
}
.padTB0 {
padding: 0px 0;
}
.padTB5 {
padding: 5px 0;
}
.padTB10 {
padding: 10px 0;
}
.padTB15 {
padding: 15px 0;
}
.padTB20 {
padding: 20px 0;
}
.padTB30 {
padding: 30px 0;
}
.padTB40 {
padding: 40px 0;
}
.padTB50 {
padding: 50px 0;
}
.padTB60 {
padding: 60px 0;
}
.padTB70 {
padding: 70px 0;
}
.padTB80 {
padding: 80px 0;
}
.padTB90 {
padding: 90px 0;
}
.padTB100 {
padding: 100px 0;
}
.padT0 {
padding-top: 0px;
}
.padT5 {
padding-top: 5px;
}
.padT10 {
padding-top: 10px;
}
.padT15 {
padding-top: 15px;
}
.padT20 {
padding-top: 20px;
}
.padT30 {
padding-top: 30px;
}
.padT40 {
padding-top: 40px;
}
.padT50 {
padding-top: 50px;
}
.padT60 {
padding-top: 60px;
}
.padT70 {
padding-top: 70px;
}
.padT80 {
padding-top: 80px;
}
.padT90 {
padding-top: 90px;
}
.padT100 {
padding-top: 100px;
}
.padB0 {
padding-bottom: 0px;
}
.padB5 {
padding-bottom: 5px;
}
.padB10 {
padding-bottom: 10px;
}
.padB20 {
padding-bottom: 20px;
}
.padB30 {
padding-bottom: 30px;
}
.padB40 {
padding-bottom: 40px;
}
.padB50 {
padding-bottom: 50px;
}
.padB60 {
padding-bottom: 60px;
}
.padB70 {
padding-bottom: 70px;
}
.padB80 {
padding-bottom: 80px;
}
.padB90 {
padding-bottom: 90px;
}
.padB100 {
padding-bottom: 100px;
}
.padL0 {
padding-left: 0px;
}
.padL5 {
padding-left: 5px;
}
.padL10 {
padding-left: 10px;
}
.padL20 {
padding-left: 20px;
}
.padL30 {
padding-left: 30px;
}
.padL40 {
padding-left: 40px;
}
.padL50 {
padding-left: 50px;
}
.padL60 {
padding-left: 60px;
}
.padL70 {
padding-left: 70px;
}
.padL80 {
padding-left: 80px;
}
.padL90 {
padding-left: 90px;
}
.padL100 {
padding-left: 100px;
}
.padLR0 {
padding-left: 0px;
}
.padLR5 {
padding-left: 5px;
}
.padLR10 {
padding-left: 10px;
}
.padLR20 {
padding-left: 20px;
}
.padLR30 {
padding-left: 30px;
}
.padLR40 {
padding-left: 40px;
}
.padLR50 {
padding-left: 50px;
}
.padLR60 {
padding-left: 60px;
}
.padLR70 {
padding-left: 70px;
}
.padLR80 {
padding-left: 80px;
}
.padLR90 {
padding-left: 90px;
}
.padLR100 {
padding-left: 100px;
}
.padR0 {
padding-right: 0px;
}
.padR5 {
padding-right: 5px;
}
.padR10 {
padding-right: 10px;
}
.padR20 {
padding-right: 20px;
}
.padR30 {
padding-right: 30px;
}
.padR40 {
padding-right: 40px;
}
.padR50 {
padding-right: 50px;
}
.padR60 {
padding-right: 60px;
}
.padR70 {
padding-right: 70px;
}
.padR80 {
padding-right: 80px;
}
.padR90 {
padding-right: 90px;
}
.padR100 {
padding-right: 100px;
}
/* 3.5 Margin Style */
.mar0 {
margin: 0px;
}
.mar5 {
margin: 5px;
}
.mar10 {
margin: 10px;
}
.mar15 {
margin: 15px;
}
.mar20 {
margin: 20px;
}
.mar30 {
margin: 30px;
}
.mar40 {
margin: 40px;
}
.mar50 {
margin: 50px;
}
.mar60 {
margin: 60px;
}
.mar70 {
margin: 70px;
}
.mar80 {
margin: 80px;
}
.mar90 {
margin: 90px;
}
.mar100 {
margin: 100px;
}
.marT0 {
margin-top: 0px;
}
.marT5 {
margin-top: 5px;
}
.marT10 {
margin-top: 10px;
}
.marT15 {
margin-top: 15px;
}
.marT20 {
margin-top: 20px;
}
.marT30 {
margin-top: 30px;
}
.marT40 {
margin-top: 40px;
}
.marT50 {
margin-top: 50px;
}
.marT60 {
margin-top: 60px;
}
.marT70 {
margin-top: 70px;
}
.marT80 {
margin-top: 80px;
}
.marT90 {
margin-top: 90px;
}
.marT100 {
margin-top: 100px;
}
.marB0 {
margin-bottom: 0px;
}
.marB5 {
margin-bottom: 5px;
}
.marB10 {
margin-bottom: 10px;
}
.marB20 {
margin-bottom: 20px;
}
.marB30 {
margin-bottom: 30px;
}
.marB40 {
margin-bottom: 40px;
}
.marB50 {
margin-bottom: 50px;
}
.marB60 {
margin-bottom: 60px;
}
.marB70 {
margin-bottom: 70px;
}
.marB80 {
margin-bottom: 80px;
}
.marB90 {
margin-bottom: 90px;
}
.marB100 {
margin-bottom: 100px;
}
.marL0 {
margin-left: 0px;
}
.marL5 {
margin-left: 5px;
}
.marL10 {
margin-left: 10px;
}
.marL20 {
margin-left: 20px;
}
.marL30 {
margin-left: 30px;
}
.marL40 {
margin-left: 40px;
}
.marL50 {
margin-left: 50px;
}
.marL60 {
margin-left: 60px;
}
.marL70 {
margin-left: 70px;
}
.marL80 {
margin-left: 80px;
}
.marL90 {
margin-left: 90px;
}
.marL100 {
margin-left: 100px;
}
.marR0 {
margin-right: 0px;
}
.marR5 {
margin-right: 5px;
}
.marR10 {
margin-right: 10px;
}
.marR20 {
margin-right: 20px;
}
.marR30 {
margin-right: 30px;
}
.marR40 {
margin-right: 40px;
}
.marR50 {
margin-right: 50px;
}
.marR60 {
margin-right: 60px;
}
.marR70 {
margin-right: 70px;
}
.marR80 {
margin-right: 80px;
}
.marR90 {
margin-right: 90px;
}
.marR100 {
margin-right: 100px;
}
.marLR0 {
margin-right: 0px;
}
.marLR5 {
margin-right: 5px;
}
.marLR10 {
margin: 0 10px;
}
.marLR20 {
margin: 0 20px;
}
.marLR30 {
margin: 0 30px;
}
.marLR40 {
margin: 0 40px;
}
.marLR50 {
margin: 0 50px;
}
.marLR60 {
margin: 0 60px;
}
.marLR70 {
margin: 0 70px;
}
.marLR80 {
margin: 0 80px;
}
.marLR90 {
margin: 0 90px;
}
.marLR100 {
margin: 0 100px;
}
/*
==========================
4. Social Icon
==========================
*/
.social-icon {
width: 100%;
float: left;
}
.social-icon li {
float: left;
}
.theme-circle {
width: 35px;
height: 35px;
display: inline-block;
background: #404040;
text-align: center;
line-height: 2.1em;
border-radius: 100%;
color: #fff;
font-size: 16px;
-webkit-transition: all 0.45s ease-in-out;
-moz-transition: all 0.45s ease-in-out;
-o-transition: all 0.45s ease-in-out;
-ms-transition: all 0.45s ease-in-out;
transition: all 0.45s ease-in-out;
}
.theme-circle:hover,
.theme-circle:focus,
.theme-circle:visited {
color: #fff;
}
/*
==========================
5. Custom Dropdown
==========================
*/
.custom-dropdown {
opacity: 0;
visibility: hidden;
-webkit-transition: all 0.45s ease-in-out;
-moz-transition: all 0.45s ease-in-out;
-o-transition: all 0.45s ease-in-out;
-ms-transition: all 0.45s ease-in-out;
transition: all 0.45s ease-in-out;
}
.custom-drop ul li:hover .custom-dropdown {
opacity: 1;
visibility: visible;
}
/*
==========================
6. Search bar
==========================
*/
.search_bar {
position: relative;
}
.search_bar input {
background-color: #404040;
border: 0;
color: #fff;
}
.search_bar button {
position: absolute;
top: 0;
right: 0;
height: 100%;
line-height: 1em;
color: #fff;
background-color: #404040;
border: none;
padding: 0px 20px;
outline: none;
}
/*
==========================
7. Header Style
==========================
*/
/* 7.1 Top Header */
.contact-info {
width: auto;
float: right;
margin-left: 30px;
}
.contact-info p {
font-size: 14px;
margin: 0;
line-height: 1.2em;
}
.contact-info .theme-circle {
margin-top: 4px;
}
/* 7.2 Navigation Bar */
.navbar-nav {
float: left;
}
.navbar-nav>li>.dropdown-menu {
background-color: #0d0d0d;
}
.navbar-default .navbar-nav>li>a,
.navbar-default .navbar-nav>.open>a,
.navbar-default .navbar-nav>.open>a:focus,
.navbar-default .navbar-nav>.open>a:hover,
.navbar-default .navbar-nav>li>a:focus,
.navbar-default .navbar-nav>li>a:hover,
.navbar-default .navbar-nav .open .dropdown-menu>li>a:hover {
color: #fff;
}
.navbar-nav>li>a {
position: relative;
}
.navbar-nav>li>a,
.navbar-default .navbar-nav>li>a {
padding: 29px 15px;
font-size: 14px;
}
.dropdown-menu>li>a {
padding: 5px 20px;
}
.navbar-nav > li > a i,
.navbar-nav ul.sm-nowrap > li > a i {
margin-left: 5px;
float: right;
line-height: 1.4em;
}
.navbar-collapse.in {
overflow-y: initial;
}
.navbar-nav>li>a,
.navbar-nav ul.sm-nowrap > li > a {
text-transform: capitalize;
}
.navigation-icon ul li {
float: left;
}
.navigation-icon {
position: relative;
}
.navigation-icon .search_bar {
position: absolute;
width: 100%;
top: 100%;
z-index: 2;
right: 15px;
}
.nav .open>a,
.nav .open>a:focus,
.nav .open>a:hover {
border-color: #0d0d0d;
}
.top-bar-icon li a:hover > span {
opacity: 1;
color: #fff;
-webkit-transition: all 0.45s ease-in-out;
-moz-transition: all 0.45s ease-in-out;
-o-transition: all 0.45s ease-in-out;
-ms-transition: all 0.45s ease-in-out;
transition: all 0.45s ease-in-out;
visibility: visible;
}
.top-bar-icon li a {
position: relative;
}
.top-bar-icon li a span:before {
content: '';
width: 0;
height: 0;
border-bottom: 16px solid;
border-left: 20px solid transparent;
position: absolute;
top: -12px;
right: 50%;
margin-right: -20px;
}
.top-bar-icon li a span {
position: absolute;
bottom: -65px;
z-index: 5;
right: 0;
font-size: 15px;
padding: 5px 25px;
text-align: center;
opacity: 0;
-webkit-transition: all 0.45s ease-in-out;
-moz-transition: all 0.45s ease-in-out;
-o-transition: all 0.45s ease-in-out;
-ms-transition: all 0.45s ease-in-out;
transition: all 0.45s ease-in-out;
border-radius: 0px;
color: #fff;
visibility: hidden;
}
.navbar-default .navbar-nav>li>a {
text-transform: capitalize;
font-size: 16px;
}
/*
===================================
8. Main Slider
===================================
*/
.slider-text {
top: 0;
width: 100%;
left: 0;
}
.slider-text h1 {
font-weight: 500;
font-size: 50px;
color: #fff;
}
.slider-image:before {
position: absolute;
content: "";
top: 0;
right: 0;
bottom: 0;
left: 0;
background-color: rgba(0, 0, 0, 0.5);
}
.slider-text h2 {
color: #fff;
font-weight: 300;
padding-top: 20%;
}
.slider-text p {
font-size: 16px;
color: #fff;
margin-bottom: 30px;
}
/*
===================================
9. Heading Style
===================================
*/
.theme-heading h1 {
position: relative;
color: #262626;
display: inline-block;
}
.theme-heading.background p {
color: #fff;
}
.theme-heading h1:after {
content: "";
position: absolute;
width: 70px;
height: 2px;
top: 50%;
left: 100%;
margin-left: 10px;
}
.theme-heading h1:before {
content: "";
position: absolute;
width: 70px;
height: 2px;
top: 50%;
right: 100%;
margin-right: 10px;
}
.theme-heading p {
max-width: 450px;
font-size: 14px;
margin: auto;
}
.theme-heading.background h1 {
color: #fff;
}
/*
===================================
10. Services
===================================
*/
.service-circle {
width: 180px;
height: 180px;
margin: auto;
border-radius: 100%;
display: block;
-webkit-transition: all 0.45s ease-in-out;
-moz-transition: all 0.45s ease-in-out;
-o-transition: all 0.45s ease-in-out;
-ms-transition: all 0.45s ease-in-out;
transition: all 0.45s ease-in-out;
}
.big-circle {
width: 100%;
height: 100%;
background-color: #262626;
position: relative;
display: inline-block;
border-radius: 100%;
-webkit-transition: all 0.45s ease-in-out;
-moz-transition: all 0.45s ease-in-out;
-o-transition: all 0.45s ease-in-out;
-ms-transition: all 0.45s ease-in-out;
transition: all 0.45s ease-in-out;
}
.big-circle i {
width: 100%;
font-size: 50px;
color: #fff;
position: absolute;
top: 50%;
left: 0;
margin-top: -25px;
}
.service-box:hover .service-circle {
padding: 10px;
border: 3px solid #d4d4d4;
}
.service-box:hover .itg-button {
color: #fff;
}
.big-circle i {
font-size: 50px;
color: #fff;
}
.service-box p {
margin-bottom: 20px;
}
/*
===================================
11. Dishes Collection
===================================
*/
.collection-box {
width: 100%;
float: left;
}
.collection-box img {
width: 100%;
}
/*
===================================
12. Banner Section
===================================
*/
.special-style {
height: 100%;
overflow: hidden;
padding: 0;
width: 100%;
z-index: 0;
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
}
.special-banner-image {
background-image: url(../img/background/banner-back.jpg);
background-size: cover;
background-repeat: no-repeat;
opacity: 1;
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
}
.facts i {
font-size: 50px;
color: #fff;
margin-bottom: 10px;
}
.facts h3 {
color: #fff;
}
.facts h1 {
font-size: 60px;
}
.overlay:after {
position: absolute;
content: "";
top: 0;
bottom: 0;
right: 0;
left: 0;
background: rgba(0, 0, 0, 0.5);
}
/*
===================================
13. Dishes Menu
===================================
*/
.menu-background {
position: absolute;
bottom: 0;
right: 0;
z-index: -1;
}
/*
===================================
14. Sticker Style
===================================
*/
.sticker {
overflow: hidden;
position: relative;
}
.sticker-tag {
cursor: pointer;
background-color: #212121;
padding: 12px 15px;
display: inline-block;
line-height: 1.2em;
margin-bottom: 10px;
color: #fff;
-webkit-transition: all 0.45s ease-in-out;
-moz-transition: all 0.45s ease-in-out;
-o-transition: all 0.45s ease-in-out;
-ms-transition: all 0.45s ease-in-out;
transition: all 0.45s ease-in-out;
opacity: 0;
visibility: hidden;
width: 165px;
font-size: 14px;
text-align: center;
}
.sticker-box {
position: absolute;
top: 10%;
left: -60%;
visibility: hidden;
-webkit-transition: all 0.45s ease-in-out;
-moz-transition: all 0.45s ease-in-out;
-o-transition: all 0.45s ease-in-out;
-ms-transition: all 0.45s ease-in-out;
transition: all 0.45s ease-in-out;
}
.sticker-tag:hover {
width: 180px;
}
.sticker-box.simple {
left: 0;
visibility: visible;
}
.sticker-box.simple .sticker-tag {
opacity: 1;
visibility: visible;
}
/*
===================================
15. Opening Hours
===================================
*/
.opening-hours {
width: auto;
display: inline-block;
background: rgba(0, 0, 0, 0.5);
position: relative;
margin: 0 50px;
margin-bottom: 30px;
}
.special-video-image {
background-image: url(../restaurant/assets/img/background/video-back-sm.jpg);
background-size: cover;
background-repeat: no-repeat;
opacity: 1;
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
}
.opening-hours h1 {
font-size: 40px;
}
.opening-hours h2 {
color: #fff;
}
.opening-box {
margin: auto;
display: table;
}
/*
===================================
16. Special menu
===================================
*/
.menu-list-box {
width: 100%;
float: left;
}
.menu-list-box h3 {
line-height: 1.2em;
width: 100%;
margin-bottom: 20px;
}
.menu-list-box h3 span {
font-size: 18px;
float: right;
}
.menu-list-box figure img {
width: 100%;
}
.tabcontent {
display: none;
}
.tab a {
font-size: 24px;
margin: 0 15px;
color: #000;
display: inline-block;
}
.menu-list-box figure {
overflow: hidden;
position: relative;
}
.menu-list-box figure:after {
background-color: rgba(0, 0, 0, 0.5);
content: "";
top: 0;
right: 0;
bottom: 0;
left: 0;
position: absolute;
opacity: 0;
visibility: hidden;
-webkit-transition: all 0.45s ease-in-out;
-moz-transition: all 0.45s ease-in-out;
-o-transition: all 0.45s ease-in-out;
-ms-transition: all 0.45s ease-in-out;
transition: all 0.45s ease-in-out;
}
.menu-list-box:hover.menu-list-box figure:after {
opacity: 1;
visibility: visible;
}
.menu-list-box:hover img {
opacity: 1;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
.menu-list-box img {
opacity: 1;
-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
transition: opacity 0.35s, transform 0.35s;
-webkit-transform: scale3d(1.05, 1.05, 1);
transform: scale3d(1.05, 1.05, 1);
}
/*
===================================
17. Our Team
===================================
*/
.our-team {
width: 100%;
float: left;
margin-bottom: -192px;
}
.team {
margin-bottom: 262px;
}
.team-member {
width: 100%;
float: left;
-webkit-transition: all 0.45s ease-in-out;
-moz-transition: all 0.45s ease-in-out;
-o-transition: all 0.45s ease-in-out;
-ms-transition: all 0.45s ease-in-out;
transition: all 0.45s ease-in-out;
}
.team-member ul li {
display: inline-block;
}
.team-member ul li a {
margin: 0 15px;
color: #262626;
}
.team-member p {
margin-bottom: 30px;
}
.team-member hr {
border-top: 1px solid #dfdfdf;
margin: 10px 0;
}
.team-member:hover {
background-color: #fff;
box-shadow: 0px 7px 14px 3px rgba(0, 0, 0, 0.175);
}
#partner-slider img {
background-color: #f1f1f1;
}
/*
===================================
18. Testimonials
===================================
*/
.customer-section {
background-color: #212121;
}
.customer-box {
width: 100%;
float: left;
position: relative;
}
.customer-box blockquote {
padding: 90px 50px 70px;
margin: 0;
color: #fff;
border: 1px solid #fff;
}
.customer-box blockquote:before {
color: #fff;
content: "\f10d";
padding-right: 10px;
display: inline-block;
font: normal normal normal 14px/1 FontAwesome;
font-size: inherit;
}
.customer-detail {
width: auto;
display: inline-block;
background-color: #212121;
}
.customer-detail .customer-img {
display: inline-block;
border: 1px solid;
padding: 10px;
float: left;
}
.customer-detail .caption {
display: inline-block;
padding-top: 26px;
}
.customer-detail .caption h3 {
color: #fff;
margin-left: 20px;
}
.customer-detail .customer-img figure {
margin-right: -20px;
}
.customer-detail {
width: auto;
display: inline-block;
background-color: #212121;
position: absolute;
bottom: 100%;
left: 50%;
margin-left: -150px;
margin-bottom: -49px;
}
#customer-slider .owl-dots {
position: relative;
margin-top: 50px;
}
#customer-slider .owl-stage-outer {
padding-top: 70px;
margin-top: -70px;
}
.team-member img {
width: 100%;
}
#customer-slider {
z-index: 2;
}
.customer-background {
position: absolute;
bottom: 0;
right: 0;
z-index: 1;
}
/*
===================================
19. Blog Section
===================================
*/
.blog {
width: 100%;
float: left;
}
.blog.border-bottom {
border-bottom: 1px solid #e5e5e5;
}
#blog-slider .blog {
margin-bottom: 1px;
}
.blog.full p {
margin-bottom: 30px;
}
.blog figure img {
width: 100%;
}
.blog blockquote {
padding: 30px;
border: 0px;
font-size: 16px;
background-color: #f0f0f0;
position: relative;
}
.blog blockquote:before {
position: absolute;
top: 50%;
left: 50%;
color: #d9d9d9;
opacity: 1;
font-size: 80px;
content: "\f10e";
font-family: FontAwesome;
margin-left: -37px;
margin-top: -14px;
}
.blog blockquote i {
position: relative;
}
/*
===================================
20. Page Header
===================================
*/
.breadcrumb {
background-color: transparent;
padding: 0;
}
.bredcrumb-section {
background-image: url(../img/background/bredcrumb-back.jpg);
background-size: cover;
background-repeat: no-repeat;
}
.bredcrumb-section:after {
content: "";
position: absolute;
background: rgba(0, 0, 0, 0.5);
top: 0;
left: 0;
right: 0;
bottom: 0;
}
.page-head {
z-index: 1;
position: relative;
}
/*
===================================
21. Register Page
===================================
*/
.register-section .tablinks {
font-size: 16px;
display: inline-block;
line-height: 1em;
padding: 12px 30px;
text-align: center;
border: 1px solid #262626;
color: #262626;
margin: 0;
}
.register-section .tablinks.active,
.register-section .tablinks:hover {
color: #fff;
}
.register-section label.radio-label {
display: inline-block;
color: #000;
padding: 0 0 0 10px;
}
.register-section input[type=checkbox] {
position: relative;
visibility: visible;
}
/*
===================================
22. Sidebar
===================================
*/
.sidebar {
width: 100%;
float: left;
}
.sidebar-box {
float: left;
width: 100%;
border: 1px solid #e5e5e5;
padding: 20px 0;
margin-bottom: 30px;
}
.sidebar-box ul.meta-link li {
font-size: 15px;
margin: 5px 0;
}
.sidebar-box ul.meta-link li a:hover {
padding-left: 15px;
}
.sidebar-box h5 {
font-weight: bold;
}
.sidebar-box p {
font-size: 14px;
}
.feature-post {
width: 100%;
float: left;
}
.feature-post figure img {
width: 100%;
}
.feature-post p {
font-size: 12px;
margin-bottom: 0;
}
/*
===================================
23. Comment Area
===================================
*/
.comment-section {
width: 100%;
float: left;
}
.comment-box figure {
width: 80px;
margin: auto;
}
.comment-box figure img {
width: 100%;
}
.comment-section h4 span {
font-size: 14px;
}
.comment-section p {
margin-bottom: 0;
font-size: 14px;
}
/*
===================================
24. Owl Carousel Style
===================================
*/
.owl-dots {
position: absolute;
bottom: 3%;
width: 100%;
}
.owl-theme .owl-nav [class*='owl-'] {
width: 35px;
height: 35px;
border-radius: 100%;
line-height: 1.8em;
text-align: center;
padding: 5px 0px;
background-color: #404040;
-webkit-transition: all 0.45s ease-in-out;
-moz-transition: all 0.45s ease-in-out;
-o-transition: all 0.45s ease-in-out;
-ms-transition: all 0.45s ease-in-out;
transition: all 0.45s ease-in-out;
}
.owl-theme .owl-nav {
position: absolute;
top: 50%;
margin: 0;
margin-top: -22.5px;
width: 100%;
z-index: -1;
}
.owl-nav .owl-prev {
float: left;
margin-left: -50px !important;
}
.owl-nav .owl-next {
float: right;
margin-right: -50px !important;
}
.owl-theme .owl-nav .owl-prev i,
.owl-theme .owl-nav .owl-next i {
font-size: 20px;
padding: 2px 0;
width: 100%;
text-align: center;
}
.owl-theme .owl-dots .owl-dot span {
width: 15px;
height: 15px;
border: 1px solid #fff;
background-color: transparent;
}
/*
===================================
25. Pagination
===================================
*/
.pagination-box span {
display: inline-block;
text-align: center;
padding: 2px 12px;
background-color: transparent;
-webkit-transition: all .30s ease-in-out;
-moz-transition: all 0.30s ease-in-out;
-o-transition: all 0.30s ease-in-out;
-ms-transition: all 0.30s ease-in-out;
transition: all 0.30s ease-in-out;
width: 35px;
}
.pagination-box span:hover {
transform: scale(1.6);
}
/*
==========================
26. Preloader
==========================
*/
.preloader {
background-color: rgba(255, 255, 255, 1);
height: 100%;
width: 100%;
position: fixed;
z-index: 9;
margin-top: 0px;
top: 0px;
}
.preloader.loaderout {
top: -100%;
-webkit-transition: all 0.80s ease-in-out;
-moz-transition: all 0.80s ease-in-out;
-o-transition: all 0.80s ease-in-out;
-ms-transition: all 0.80s ease-in-out;
transition: all 0.80s ease-in-out;
}
#loading-center {
width: 100%;
height: 100%;
position: relative;
}
#loading-center-absolute {
position: absolute;
left: 50%;
top: 50%;
height: 100px;
width: 100px;
margin-top: -50px;
margin-left: -50px;
}
.object {
width: 15px;
height: 15px;
background-color: rgba(255, 255, 255, 0);
margin-right: auto;
margin-left: auto;
border: 4px solid #CF0008;
left: 42px;
top: 42px;
position: absolute;
}
#first_object {
-webkit-animation: first_object 1s infinite;
animation: first_object 1s infinite;
-webkit-animation-delay: 0.5s;
animation-delay: 0.5s;
}
#second_object {
-webkit-animation: second_object 1s infinite;
animation: second_object 1s infinite;
}
#third_object {
-webkit-animation: third_object 1s infinite;
animation: third_object 1s infinite;
-webkit-animation-delay: 0.5s;
animation-delay: 0.5s;
}
#forth_object {
-webkit-animation: forth_object 1s infinite;
animation: forth_object 1s infinite;
}
@-webkit-keyframes first_object {
0% {
-ms-transform: translate(1, 1) scale(1, 1);
-webkit-transform: translate(1, 1) scale(1, 1);
transform: translate(1, 1) scale(1, 1);
}
50% {
-ms-transform: translate(150%, 150%) scale(2, 2);
-webkit-transform: translate(150%, 150%) scale(2, 2);
transform: translate(150%, 150%) scale(2, 2);
}
100% {
-ms-transform: translate(1, 1) scale(1, 1);
-webkit-transform: translate(1, 1) scale(1, 1);
transform: translate(1, 1) scale(1, 1);
}
}
@keyframes first_object {
0% {
-ms-transform: translate(1, 1) scale(1, 1);
-webkit-transform: translate(1, 1) scale(1, 1);
transform: translate(1, 1) scale(1, 1);
}
50% {
-ms-transform: translate(150%, 150%) scale(2, 2);
-webkit-transform: translate(150%, 150%) scale(2, 2);
transform: translate(150%, 150%) scale(2, 2);
}
100% {
-ms-transform: translate(1, 1) scale(1, 1);
-webkit-transform: translate(1, 1) scale(1, 1);
transform: translate(1, 1) scale(1, 1);
}
}
@-webkit-keyframes second_object {
0% {
-ms-transform: translate(1, 1) scale(1, 1);
-webkit-transform: translate(1, 1) scale(1, 1);
transform: translate(1, 1) scale(1, 1);
}
50% {
-ms-transform: translate(-150%, 150%) scale(2, 2);
-webkit-transform: translate(-150%, 150%) scale(2, 2);
transform: translate(-150%, 150%) scale(2, 2);
}
100% {
-ms-transform: translate(1, 1) scale(1, 1);
-webkit-transform: translate(1, 1) scale(1, 1);
transform: translate(1, 1) scale(1, 1);
}
}
@keyframes second_object {
0% {
-ms-transform: translate(1, 1) scale(1, 1);
-webkit-transform: translate(1, 1) scale(1, 1);
transform: translate(1, 1) scale(1, 1);
}
50% {
-ms-transform: translate(-150%, 150%) scale(2, 2);
-webkit-transform: translate(-150%, 150%) scale(2, 2);
transform: translate(-150%, 150%) scale(2, 2);
}
100% {
-ms-transform: translate(1, 1) scale(1, 1);
-webkit-transform: translate(1, 1) scale(1, 1);
transform: translate(1, 1) scale(1, 1);
}
}
@-webkit-keyframes third_object {
0% {
-ms-transform: translate(1, 1) scale(1, 1);
-webkit-transform: translate(1, 1) scale(1, 1);
transform: translate(1, 1) scale(1, 1);
}
50% {
-ms-transform: translate(-150%, -150%) scale(2, 2);
-webkit-transform: translate(-150%, -150%) scale(2, 2);
transform: translate(-150%, -150%) scale(2, 2);
}
100% {
-ms-transform: translate(1, 1) scale(1, 1);
-webkit-transform: translate(1, 1) scale(1, 1);
transform: translate(1, 1) scale(1, 1);
}
}
@keyframes third_object {
0% {
-ms-transform: translate(1, 1) scale(1, 1);
-webkit-transform: translate(1, 1) scale(1, 1);
transform: translate(1, 1) scale(1, 1);
}
50% {
-ms-transform: translate(-150%, -150%) scale(2, 2);
-webkit-transform: translate(-150%, -150%) scale(2, 2);
transform: translate(-150%, -150%) scale(2, 2);
}
100% {
-ms-transform: translate(1, 1) scale(1, 1);
-webkit-transform: translate(1, 1) scale(1, 1);
transform: translate(1, 1) scale(1, 1);
}
}
@-webkit-keyframes forth_object {
0% {
-ms-transform: translate(1, 1) scale(1, 1);
-webkit-transform: translate(1, 1) scale(1, 1);
transform: translate(1, 1) scale(1, 1);
}
50% {
-ms-transform: translate(150%, -150%) scale(2, 2);
-webkit-transform: translate(150%, -150%) scale(2, 2);
transform: translate(150%, -150%) scale(2, 2);
}
100% {
-ms-transform: translate(1, 1) scale(1, 1);
-webkit-transform: translate(1, 1) scale(1, 1);
transform: translate(1, 1) scale(1, 1);
}
}
@keyframes forth_object {
0% {
-ms-transform: translate(1, 1) scale(1, 1);
-webkit-transform: translate(1, 1) scale(1, 1);
transform: translate(1, 1) scale(1, 1);
}
50% {
-ms-transform: translate(150%, -150%) scale(2, 2);
-webkit-transform: translate(150%, -150%) scale(2, 2);
transform: translate(150%, -150%) scale(2, 2);
}
100% {
-ms-transform: translate(1, 1) scale(1, 1);
-webkit-transform: translate(1, 1) scale(1, 1);
transform: translate(1, 1) scale(1, 1);
}
}
/*
===================================
27. Common Css
===================================
*/
/* 27.1 About */
.about-us {
width: 100%;
float: left;
}
.about-us p {
margin-bottom: 30px;
}
.about-us h3 {
padding-top: 60px;
}
.about-us figure {
overflow: hidden;
position: relative;
}
.about-us figure:after {
position: absolute;
content: "";
top: 0;
bottom: 0;
right: 0;
left: 0;
background: rgba(0, 0, 0, 0.5);
opacity: 0;
visibility: hidden;
-webkit-transition: all 0.80s ease-in-out;
-moz-transition: all 0.80s ease-in-out;
-o-transition: all 0.80s ease-in-out;
-ms-transition: all 0.80s ease-in-out;
transition: all 0.80s ease-in-out;
}
.about-us:hover img {
opacity: 1;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
.about-us img {
opacity: 1;
-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
transition: opacity 0.35s, transform 0.35s;
-webkit-transform: scale3d(1.05, 1.05, 1);
transform: scale3d(1.05, 1.05, 1);
}
.about-us:hover.about-us figure:after {
opacity: 1;
visibility: visible;
}
/* 27.2 Admin Section */
.admin-section {
width: 100%;
float: left;
}
.admin-box figure {
width: 75px;
margin: auto;
}
.admin-box figure img {
width: 100%;
}
/* 27.3 Theme Box */
.theme-box {
width: 100%;
float: left;
background-color: #e5e5e5;
padding: 0 20px;
}
.theme-box .social-icon {
width: auto;
float: right;
padding: 15px 0;
}
.theme-box span {
padding: 24px 0;
display: inline-block;
line-height: 1em;
margin-right: 30px;
}
/* 27.4 Theme Form */
.theme-form {
position: relative;
z-index: 2;
float: left;
width: 100%;
}
.theme-form-background .bottom-left {
bottom: 0;
left: 0;
position: absolute;
}
.theme-form-background .bottom-right {
right: 0;
bottom: 0;
position: absolute;
}
.theme-form input,
.theme-form textarea {
background-color: transparent;
padding: 5px 40px;
}
/*
===================================
28. Service Detail
===================================
*/
.service-detail {
width: 100%;
float: left;
}
.service-detail p {
margin-bottom: 30px;
}
.service-detail.single p {
margin-bottom: 15px;
}
.service-detail h3 i {
font-size: 40px;
}
.service-detail figure {
overflow: hidden;
position: relative;
}
.service-detail figure:after {
position: absolute;
content: "";
top: 0;
bottom: 0;
right: 0;
left: 0;
background: rgba(0, 0, 0, 0.5);
opacity: 0;
visibility: hidden;
-webkit-transition: all 0.80s ease-in-out;
-moz-transition: all 0.80s ease-in-out;
-o-transition: all 0.80s ease-in-out;
-ms-transition: all 0.80s ease-in-out;
transition: all 0.80s ease-in-out;
}
.service-detail:hover img {
opacity: 1;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
.service-detail img {
opacity: 1;
-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
transition: opacity 0.35s, transform 0.35s;
-webkit-transform: scale3d(1.05, 1.05, 1);
transform: scale3d(1.05, 1.05, 1);
}
.service-detail:hover.service-detail figure:after {
opacity: 1;
visibility: visible;
}
.service-detail h3 {
padding-top: 45px;
}
.service-detail.single h3 {
padding-top:0px;
}
/*
===================================
29. Gallery Page
===================================
*/
.gallery-img {
width: 100%;
float: left;
}
.gallery-img figure {
width: 100%;
position: relative;
}
.gallery-img figure img {
width: 100%;
}
.gallery-img figure figcaption {
position: absolute;
top: 0;
width: 100%;
text-align: center;
color: #fff;
font-size: 50px;
top: 50%;
margin-top: -25px;
z-index: 2;
-webkit-transition: all 0.80s ease-in-out;
-moz-transition: all 0.80s ease-in-out;
-o-transition: all 0.80s ease-in-out;
-ms-transition: all 0.80s ease-in-out;
transition: all 0.80s ease-in-out;
opacity: 0;
visibility: hidden;
}
.gallery-img figure:after {
background-color: rgba(91, 91, 91, 0.6);
top: 0;
left: 0;
right: 0;
bottom: 0;
position: absolute;
content: "";
-webkit-transition: all 0.80s ease-in-out;
-moz-transition: all 0.80s ease-in-out;
-o-transition: all 0.80s ease-in-out;
-ms-transition: all 0.80s ease-in-out;
transition: all 0.80s ease-in-out;
opacity: 0;
visibility: hidden;
}
.gallery-img:hover.gallery-img figure:after,
.gallery-img:hover.gallery-img figure figcaption {
opacity: 1;
visibility: visible;
}
/*
===================================
30. FAQ Page
===================================
*/
.ui-icon {
float: right;
margin-top: 5px;
}
.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-button:hover,
.ui-button:focus {
color: #fff;
}
.ui-accordion .ui-accordion-header {
outline: none;
border-radius: 0;
margin-top: 30px;
}
.ui-icon-triangle-1-s {
background-position: -65px 0;
}
.ui-icon-triangle-1-e {
background-position: -32px 0px;
}
/*
===================================
31. Dishes Page
===================================
*/
.dishes img {
width: 100%;
}
.dish blockquote {
padding: 30px;
border: 0px;
font-size: 16px;
background-color: #f0f0f0;
position: relative;
}
.dish blockquote:before {
position: absolute;
top: 50%;
left: 50%;
color: #d9d9d9;
opacity: 1;
font-size: 80px;
content: "\f10e";
font-family: FontAwesome;
margin-left: -37px;
margin-top: -14px;
}
.dish blockquote i {
position: relative;
}
/*
===================================
32. Error Page
===================================
*/
.error-page {
float: left;
width: 100%;
}
.error-page h2 {
font-size: 60px;
font-weight: 300;
}
.error-page h1 {
font-size: 70px;
font-weight: 300;
}
.error-page h1 {
font-size: 70px;
font-weight: 300;
}
.error-page h3 {
font-size: 40px;
font-weight: 300;
}
/*
===================================
33. Contact Page
===================================
*/
.contact-detail {
float: left;
width: 100%;
}
.contact-detail i {
font-size: 40px;
margin-bottom: 20px;
}
.location-map {
float: left;
width: 100%;
}
.location-map iframe {
width: 100%;
margin: 0;
border: 0px !important;
padding: 0;
height: 500px;
}
/*
===================================
34. Comming Soon
===================================
*/
.comming-soon-content {
padding: 20px 0;
z-index: 3;
position: relative;
}
.special-style-fixed {
position: fixed;
}
.comming-soon-style-1 {
background-image: url(../img/background/comming-soon-1-back.png);
background-size: cover;
background-repeat: no-repeat;
opacity: 1;
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
z-index: 1;
}
.comming-soon-style-2 {
background-image: url(../img/background/comming-soon-2-back.jpg);
background-size: cover;
background-repeat: no-repeat;
opacity: 1;
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
z-index: 1;
}
.special-section {
position: fixed;
right: 0;
top: 50%;
margin-top: -290px;
}
.dark-overlay:before {
content: "";
background-color: rgba(0, 0, 0, 0.9);
top: 0;
left: 0;
right: 0;
bottom: 0;
position: absolute;
z-index: 2;
}
.comming-soon-content h2 {
font-size: 30px;
}
.comming-soon-content h1 {
font-size: 60px;
}
.comming-soon-content .search_bar input {
background-color: transparent;
border: 1px solid #FFF;
}
.comming-soon-content .search_bar button {
top: 1px;
right: 1px;
height: 96%;
}
.timer {
width: 100%;
float: left;
margin-bottom: 30px;
}
.timer ul li {
float: left;
width: 25%;
text-align: center;
padding: 20px 0;
}
.timer ul li span {
font-size: 60px;
display: block;
}
.timer ul li span.normal {
font-size: 25px;
}
.after-border {
position: relative;
}
.after-border:after {
content: "";
height: 100%;
width: 1px;
background-color: #717171;
position: absolute;
right: 0;
top: 0;
}
/*
===================================
35. Team Detail
===================================
*/
.chef-detail {
float: left;
width: 100%;
}
.chef-detail img {
width: 100%;
}
/*
===================================
36. Landing Page
===================================
*/
.landing-page h3 {
width: 100%;
text-align: center;
margin-bottom: 30px;
}
.demo {
position: relative;
width: 100%;
float: left;
margin-bottom: 60px;
overflow: hidden;
}
.demo img {
width: 100%;
-webkit-transition: all .80s ease-in-out;
-moz-transition: all 0.80s ease-in-out;
-o-transition: all 0.80s ease-in-out;
-ms-transition: all 0.80s ease-in-out;
transition: all 0.80s ease-in-out;
}
.demo-img {
position: absolute;
top: 0;
left: 0;
-webkit-transition: all .80s ease-in-out;
-moz-transition: all 0.80s ease-in-out;
-o-transition: all 0.80s ease-in-out;
-ms-transition: all 0.80s ease-in-out;
transition: all 0.80s ease-in-out;
}
.demo:hover .demo-img {
top: -25%;
}
.demo-button {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
background-color: rgba(0, 0, 0, 0.5);
opacity: 0;
visibility: hidden;
-webkit-transition: all .45s ease-in-out;
-moz-transition: all 0.45s ease-in-out;
-o-transition: all 0.45s ease-in-out;
-ms-transition: all 0.45s ease-in-out;
transition: all 0.45s ease-in-out;
}
.demo-button .itg-button {
color: #fff;
position: absolute;
bottom:0;
text-align: center;
width: 100%;
}
.demo:hover .demo-button {
opacity: 1;
visibility: visible;
}
.preview-cover {
position: relative;
width: 100%;
float: left;
}
.preview-cover img {
width: 100%;
}
/*
===================================
37. Dish Filter
===================================
*/
.filter-section select {
line-height: 1.2em;
font-size: 16px;
color: #000;
}
.filter-section label {
margin-bottom: 15px;
font-size: 18px;
color: #000;
}
.filter-section p {
margin: 0;
}
.filter-section p span {
color: #000;
font-weight: 600;
}
.filter-section img {
width: 100%;
}
.serch-result {
width: 100%;
float: left;
}
.serch-result img {
width: 100%;
}
.serch-result p {
margin-bottom: 20px;
}
.detail {
padding-top: 6%;
}
.filter-slider {
border-radius: 10px;
}
.filter-slider span {
border-radius: 10px;
outline: none;
}
.filter-section input {
background-color: transparent;
border: 0;
}
.filter-section form {
display: inline-block;
width: 100%;
}
.filter-section input[type="checkbox"] {
display: none;
}
.filter-section label {
cursor: pointer;
}
.filter-section input[type="checkbox"] + label:before {
border: 1px solid #333;
content: "\00a0";
display: inline-block;
font: 16px/1em sans-serif;
height: 16px;
margin: 0 5px 0 0;
padding: 0;
vertical-align: middle;
width: 16px;
border-radius: 100%;
margin-top: -3px;
}
.filter-section input[type="checkbox"]:checked + label:before {
content: "\2713";
text-align: center;
}
.filter-section input[type="checkbox"]:checked + label:after {
font-weight: bold;
}
.filter-check-box ul li {
display: inline-block;
margin-right: 40px;
}
.filter-check-box label {
color: #777;
}
/*
===================================
38. User Profile
===================================
*/
.user-review {
float: left;
width: 100%;
padding: 20px 5px;
border: 1px solid #d9d9d9;
margin-bottom: 30px;
}
.user-review p {
margin-bottom: 0;
}
/*
===================================
39. Footer
===================================
*/
.foot-sec {
width: 100%;
float: left;
color: #cccccc;
position: relative;
z-index: 2;
}
.footer-box {
float: left;
width: 100%;
}
.foot-img-box img {
float: left;
width: 100%;
}
.main_footer {
background-color: #1a1a1a;
position: relative;
background-size: cover;
background-repeat: no-repeat;
}
.foot-sec ul li {
margin-bottom: 10px;
}
.foot-sec ul.text li span {
width: 88%;
float: right;
}
.foot-img-box ul li {
width: 21%;
float: left;
margin-right: 10px;
margin-bottom: 10px;
}
.foot-sec p {
margin-bottom: 10px;
clear: both;
}
.foot-sec h3 {
position: relative;
}
.foot-sec h3:after {
content: "";
position: absolute;
height: 2px;
background-color: red;
width: 70px;
top: 50%;
margin-top: -1px;
margin-left: 15px;
}
.foot-sec h3.line-hide:after {
display: none;
}
.bottom-footer p {
margin: 0;
}
.bottom-footer {
position: relative;
}
.footer-background .top-left {
position: absolute;
top: 0;
left: 0;
}
.footer-background .bottom-right {
position: absolute;
bottom: 105px;
right: 0;
}
/*---responsive.CSS inluad style---*/
/*@import url("/restaurant/assets/css/responsive.css");*/
@media screen and (min-width: 1441px) and (max-width: 1600px) {
.slider-text h2 {
padding-top: 15%;
}
.theme-form-background figure {
opacity: 0.2;
}
.theme-form input,
.theme-form textarea {
background-color: transparent;
}
}
@media screen and (min-width: 1200px) and (max-width: 1440px) {
.slider-text h2 {
padding-top: 12%;
}
.comming-soon-content h1 {
font-size: 40px;
}
.special-section {
margin-top: -284px;
}
}
@media screen and (max-width: 1440px) {
.footer-background figure {
opacity: 0.4;
}
.menu-background {
opacity: 0.2;
}
.customer-background {
opacity: 0.5;
}
.theme-form-background figure {
opacity: 0.2;
}
.theme-form input,
.theme-form textarea {
background-color: transparent;
}
}
@media screen and (max-width: 1300px) {
.owl-theme .owl-nav {
position: relative;
width: 100%;
margin-top: 20px;
}
.owl-nav .owl-prev {
float: none;
margin-left: 0;
}
.owl-nav .owl-next {
float: none;
margin-right: 0;
}
}
@media screen and (min-width: 1025px) and (max-width: 1199px) {
.slider-text h2 {
padding-top: 9%;
}
.slider-text h1 {
font-size: 45px;
}
.foot-sec h3:after {
width: 50px;
}
.comming-soon-content h1 {
font-size: 40px;
}
.special-section {
margin-top: -284px;
}
.detail {
padding-top: 0;
}
}
@media screen and (min-width: 992px) and (max-width: 1024px) {
.slider-text h2 {
padding-top: 8%;
}
.slider-text h1 {
font-size: 45px;
}
.foot-sec h3:after {
width: 50px;
}
.service-detail h3 {
padding-top: 0px;
}
.about-us h3 {
padding-top: 20px;
}
.theme-box span {
margin-right: 20px;
font-size: 14px;
}
.comming-soon-content h1 {
font-size: 40px;
}
.special-section {
margin-top: -284px;
}
.detail {
padding-top: 0;
}
}
@media screen and (min-width: 768px) and (max-width: 991px) {
.slider-text h1 {
font-size: 32px;
}
.slider-text h2 {
font-size: 22px;
padding-top: 5%;
}
.slider-text p {
margin-bottom: 15px;
}
.opening-hours {
margin: 0 20px;
margin-bottom: 30px;
}
.menu-list-box h3 {
margin-bottom: 10px;
}
.service-detail h3 {
padding-top: 0px;
}
.about-us h3 {
padding-top: 0px;
}
.theme-box span {
margin-right: 20px;
font-size: 12px;
}
.error-page h3 {
font-size: 30px;
}
.error-page h1 {
font-size: 50px;
}
.error-page h2 {
font-size: 45px;
}
.comming-soon-content h1 {
font-size: 40px;
}
.special-section {
margin-top: -284px;
}
.navbar-nav>li>a,
.navbar-default .navbar-nav>li>a {
padding: 29px 14px;
font-size: 14px;
}
.dropdown-menu>li>a{
font-size: 14px;
}
.detail {
padding-top: 0px;
}
.filter-section p {
font-size: 14px;
}
.user-review p {
font-size: 14px;
}
}
@media screen and (min-width: 768px) {
.dropdown-menu>li>a {
padding: 13px 20px;
}
.dropdown-menu li .dropdown-menu {
left: 0% !important;
box-shadow: none;
border-top: 2px solid;
}
.navbar-nav>li>a {
border-bottom: 2px solid #000;
}
.navigation-icon {
float: right;
padding: 22.5px 0;
padding-right: 15px;
}
.navbar-nav>li>.dropdown-menu {
border-top: 2px solid;
margin-top: -3px !important;
}
.dropdown-menu li.left-side .dropdown-menu {
margin-left: -200px !important;
}
.dropdown-menu>li>a:hover {
padding-left: 30px;
}
}
@media screen and (max-width: 767px) {
.service-single .itg-button {
margin-bottom: 5px;
width: 48%;
}
.filter-check-box ul li {
display: block;
}
h3 {
font-size: 20px;
}
.navbar-brand {
float: none;
}
.navbar-nav .open .dropdown-menu>li>a,
.dropdown-menu>li>a {
padding: 10px 15px;
}
.navbar-nav>li>a,
.navbar-default .navbar-nav>li>a {
padding: 10px 15px;
font-size: 16px;
}
.navbar-nav {
padding: 20px 0;
}
.navigation-icon {
float: left;
padding: 13.5px 0;
}
.navbar-toggle {
margin-bottom: 15px;
margin-top: 15px;
}
.navigation-icon .search_bar {
right: 0;
}
.slider-text p {
display: none;
}
.owl-dots {
bottom: 0;
}
.itg-button {
padding: 8px 25px;
font-size: 14px;
}
.theme-heading h1:before {
content: "";
position: absolute;
width: 40px;
height: 2px;
background-color: red;
top: 50%;
right: calc(100% - 40px);
margin-right: 0px;
}
.theme-heading h1 {
font-size: 30px;
padding: 0 52px;
line-height: 32px;
}
.theme-heading h1:after {
content: "";
position: absolute;
width: 40px;
height: 2px;
background-color: red;
top: 50%;
left: calc(100% - 40px);
margin-left: 0px;
}
.opening-hours {
margin: 0;
display: block;
margin-bottom: 40px;
}
.menu-list-box h3 {
margin-bottom: 10px;
}
.opening-hours h1 {
font-size: 30px;
}
.opening-hours h2 {
font-size: 24px;
}
.tab a {
font-size: 20px;
margin: 5px 14px;
color: #000;
display: inline-block;
}
.menu-list-box p {
text-align: left;
font-size: 15px;
}
.customer-detail .caption {
padding-top: 28px;
}
.customer-detail {
margin-left: -130px;
}
.top-bar-icon li a span {
left: 0;
right: initial;
}
.top-bar-icon li a span:before {
border-bottom: 16px solid;
border-right: 20px solid transparent;
border-left: 0px solid transparent;
left: 50%;
margin-left: -20px;
}
.service-detail h3 {
padding-top: 0px;
}
.about-us h3 {
padding-top: 0px;
}
.blog.full p a span {
font-size: 14px;
}
.theme-form-background .bottom-left {
display: none;
}
.error-page h1 {
font-size: 44px;
}
.error-page h2 {
font-size: 35px;
}
.error-page h3 {
font-size: 20px;
}
.location-map iframe {
height: 300px;
}
.special-section {
margin-top: -251.5px;
}
.comming-soon-content h2,
.timer ul li span.normal,
.comming-soon-content h3 {
font-size: 16px;
}
.comming-soon-content h1 {
font-size: 22px;
}
.timer ul li span {
font-size: 28px;
}
.detail {
padding-top: 0px;
}
}
@media screen and (min-width: 641px) and (max-width: 767px) {
.slider-text h2 {
padding-top: 10%;
}
}
@media screen and (min-width: 481px) and (max-width: 640px) {
.slider-text h1 {
font-size: 30px;
margin-bottom: 10px;
}
.slider-text h2 {
padding-top: 10%;
font-size: 25px;
}
}
@media screen and (min-width: 320px) and (max-width: 480px) {
.slider-text h2 {
font-size: 16px;
margin-bottom: 5px;
padding-top: 6%;
}
.slider-text h1 {
font-size: 24px;
line-height: 1.4em;
margin-bottom: 5px;
}
.opening-hours {
padding: 30px;
}
.bottom-footer p{
font-size:14px;
}
}
/*---color.CSS inluad color---*/
/*@import url("/restaurant/assets/css/color.css");*/
a:hover, a:focus,
.theme-color,
.facts h1,
.opening-hours h1,
.service-box:hover h3 a,
.tablinks.active,
.team-member ul li a:hover,
.breadcrumb>.active,
.service-detail:hover h3 a,
.pagination-box span:hover,
.sidebar-box h4,
.admin-section h3,
.comment-section h3,
.comment-section p a,
.theme-form h3,
i.red,
.error-page h2,
.contact-detail i,
.timer ul li span.normal,
.thecube h4,
.filter-section input,
.filter-section input[type="checkbox"]:checked + label:before{
color:#cf0008;
}
.theme-bg,
.itg-button:hover,
.theme-circle:hover,
.theme-circle:focus,
.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span ,
.service-box:hover .big-circle,
.owl-theme .owl-nav [class*='owl-']:hover,
.sticker-tag:hover,
.service-box:hover .itg-button,
.top-bar-icon li a span,
.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-button:hover, .ui-button:focus,
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active, .ui-button:active,
.ui-button.ui-state-active:hover,
.itg-button.dark,
.comming-soon-content .search_bar button,
.thecube .cube:before,
.demo-button .itg-button,
.theme-heading h1:before,
.theme-heading h1:after,
.filter-section .ui-state-default,
.filter-section .ui-widget-content .ui-state-default,
.filter-section .ui-widget-header .ui-state-default,
.filter-section .ui-button, html .ui-button.ui-state-disabled:hover,
.filter-section.ui-button.ui-state-disabled:active,
.filter-section input[type="checkbox"]:checked + label:before,
.register-section .tablinks.active,
.register-section .tablinks:hover{
background-color: #cf0008;
}
.navbar-nav>li>a:hover,
.itg-button:hover,
.service-box:hover .itg-button,
.customer-detail figure,
.customer-detail .customer-img,
.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span,
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active, .ui-button:active,
.ui-button.ui-state-active:hover,
.itg-button.dark,
.demo-button .itg-button,
.filter-section input[type="checkbox"]:checked + label:before,
.register-section .tablinks.active,
.register-section .tablinks:hover,
.navbar-nav>li>.dropdown-menu,
.dropdown-menu li .dropdown-menu{
border-color:#cf0008;
}
.top-bar-icon li a span:before{
border-bottom-color:#cf0008;
}
/*---Custom Styles---*/
.navbar-brand h1 {
font-family: 'Satisfy', cursive;
}
.main_footer h1.logo {
color: #fff;
font-family: 'Satisfy', cursive;
}
.menu-image {
border: 1px solid #f2f2f2;
}
.menu-image:hover {
border: 1px solid #000;
}
#map {
width:100%;height:400px;background-color:grey
}