:root {
	--font1:'Itim', cursive;
	--font2:'Lobster', cursive;
}
::selection { background:var(--dark); color:var(--primary); }

html,
body { min-height:100vh; font-family:var(--font1); font-size:18px; line-height:1; color:var(--dark); }
a { color:inherit; transition:all 0.3s ease-out; }
a:hover { text-decoration:none; }
img { width:100%; }
h1,
h2,
h3,
h4,
h5,
h6 { margin:0 0 30px; font-family:var(--font2); color:var(--primary); font-weight:400; }
h2 { font-size:50px; color:var(--primary); margin:0 0 15px; line-height:0.8; }
h6 { font-family:var(--font1); color:var(--dark); text-align:center; margin:0 0 15px; font-size:18px; font-weight:400; text-transform:uppercase; }
p { font-size:20px; margin:0 0 30px; letter-spacing:0.05em; line-height:1.25; }
@media (max-width:992px) {
	h2 { margin:0 0 30px; }
}

.color-light { color:var(--light) !important; }
.btn { padding:10px 15px; outline:1px solid var(--primary); outline-offset:2px; border:1px solid var(--primary); border-radius:0; font-size:15px; font-weight:400; letter-spacing:0.19em; text-transform:uppercase; color:var(--primary); background:transparent; }
.btn.btn-dark { outline-color:var(--dark); border-color:var(--dark); background:var(--dark); color:var(--light); }
.btn.btn-light { outline-color:var(--light); border-color:var(--light); background:var(--light); color:var(--dark); }
.btn:hover { background:var(--primary); color:var(--light); }
.btn.btn-dark:hover { background:var(--light); color:var(--dark); }
.btn.btn-light:hover { background:var(--dark); color:var(--light); }
@media (max-width:992px) {
	.btn { font-size:14px; }
}

svg.underline { width:200px; display:table; margin:0 auto 25px; }
svg.underline rect { fill:var(--primary); }

header { position:absolute; left:0; top:0; width:100%; z-index:900; background:transparent; }
header .add { background:var(--dark); display:flex; justify-content:space-between; padding:2px 10px 5px; }
header .add a { color:var(--light); font-size:14px; font-weight:700; }
header .navbar { padding:10px 30px; }
header .navbar .navbar-brand { padding:0; height:80px; }
header .navbar .navbar-brand img { width:auto; height:100%; }
header .navbar .navbar-brand span { font-family:var(--font2); color:var(--primary); font-weight:400; font-size:30px; }
header .navbar .navbar-nav a { color:var(--light); font-size:13px; text-transform:uppercase; letter-spacing:0.19em; font-weight:400; padding:8px 15px; position:relative; }
header .navbar .navbar-nav a:after { content:""; position:absolute; bottom:2px; left:50%; transform:translateX(-50%); width:0; height:2px; background:var(--primary); transition:all 0.1s ease-out; }
header .navbar .navbar-nav a:before { bottom:auto; top:6px; transition:all 0.5s ease-in; }
header .navbar .navbar-nav a.active:before,
header .navbar .navbar-nav a.active:after,
header .navbar .navbar-nav a:hover:before,
header .navbar .navbar-nav a:hover:after { width:30px; }
header .navbar .navbar-nav a.active { pointer-events:none; cursor:default; }
header .navbar .navbar-toggler { border:1px solid var(--primary); outline:1px solid var(--primary); outline-offset:2px; padding:8px 8px 4px; border-radius:0; transition:all 0.3s; position:relative; z-index:1100; }
header .navbar .navbar-toggler span { display:block; width:30px; height:4px; margin:0 0 4px; background:var(--primary); border-radius:2px; transition:all 0.3s; }
header .navbar .navbar-toggler:hover span:nth-child(1) { width:23px; margin-left:0; }
header .navbar .navbar-toggler:hover span:nth-child(3) { width:23px; margin-left:7px; }
header.fixed { position:fixed; top:-200px; box-shadow:0 0 6px rgba(0,0,0,0.1), 0 0 10px rgba(0,0,0,0.15); background:var(--primary); }
header.fixed .add { display:none; }
header.fixed.animate { top:0px; background:var(--primary); transition:all 1s ease-out; }
header.fixed .navbar .navbar-nav a { color:var(--light); }
header.fixed .navbar .navbar-nav a:after { background:var(--light); }
header.fixed .navbar .navbar-toggler { border:1px solid var(--light); outline:1px solid var(--light); }
header.fixed .navbar .navbar-toggler span { background:var(--light); }
header #order { display:block; line-height:20px; background:var(--light); color:var(--primary); padding:0 15px; text-align:center; font-size:16px; font-weight:400; outline:1px solid var(--light); outline-offset:2px; }
@media (max-width:992px) {
	header { background:var(--primary); }
	header .add { background:var(--dark); }
	header .navbar .navbar-toggler { border-color:var(--light); outline-color:var(--light); }
	header .navbar .navbar-toggler span { background:var(--light); }
	header #order { display:block; }
}

.banner .owl-carousel .owl-item .item { display:flex; align-items:center; justify-content:flex-end; background:var(--light); height:60vw; background-position:50% 50%; background-size:cover; background-repeat:no-repeat; }
.banner .owl-carousel .owl-item .text { width:50%; padding:0 30px; text-align:center; }
.banner .owl-carousel .owl-item h2 { margin:0; color:var(--light); }
.banner .owl-carousel .owl-item h1 { color:var(--light); display:block; font-size:100px; font-family:var(--font1); text-transform:uppercase; margin:-20px 0 0; font-weight:400; }
.banner .owl-carousel .owl-item.active h2 { animation-duration:1.5s; animation-fill-mode:both; animation-name:fadeInDown; animation-delay:250ms; }
.banner .owl-carousel .owl-item.active h1 { animation-duration:1.5s; animation-fill-mode:both; animation-name:fadeInDown; animation-delay:400ms; }
.banner .owl-carousel .owl-item.active svg { animation-duration:1.5s; animation-fill-mode:both; animation-name:fadeInRight; animation-delay:750ms; }
.banner .owl-carousel .owl-item.active .btn { animation-duration:1.5s; animation-fill-mode:both; animation-name:fadeInUp; animation-delay:1000ms; }
@media (max-width:992px) {
	.banner { margin-top:100px; }
	.banner .owl-carousel .owl-item .text { padding:10px; }
	.banner .owl-carousel .owl-item .text h1,
	.banner .owl-carousel .owl-item .text h2,
	.banner .owl-carousel .owl-item .text svg { display:none; }
	.banner .owl-carousel .owl-item.active .btn { animation-name:none; margin-bottom:20px; }
	.banner .owl-carousel .owl-item .item { height:60vh; background-position:0 0; align-items:flex-end; justify-content:center; }
}

.about { display:flex; align-items:center; justify-content:center; padding:100px 0; }
.about .btn { display:table; margin:10px 0 60px; }
@media (max-width:992px) {
	.about { text-align:center; padding:40px 0; }
	.about .btn { display:inline-block; }
}

.testimonial { display:flex; align-items:center; justify-content:center; min-height:70vh; padding:60px 0; }
.testimonial h2 { text-align:left; }
.testimonial h6 { text-align:left; color:var(--dark); }
.testimonial svg.underline { margin-left:0; }
.testimonial .item { text-align:center; max-width:400px; }
.testimonial .item .quote { text-align:left; font-size:24px; color:var(--dark); font-family:var(--font1); font-weight:400; margin:0; font-style:italic; }
.testimonial .item .quote:after { content:"\f10e"; font-family:'Line Awesome Free'; font-weight:900; color:var(--primary); }
.testimonial .item .quote:before { content:"\f10d"; font-family:'Line Awesome Free'; font-weight:900; color:var(--primary); }
.testimonial .item p { text-align:left; color:var(--dark); font-size:15px; text-transform:uppercase; letter-spacing:0.2em; font-weight:400; margin:25px 0 0; }
.testimonial .btn { display:table; margin:0 auto; }
.testimonial .owl-dots { }
.testimonial .owl-dots .owl-dot { width:10px; height:10px; border:1px solid var(--primary); transform:rotate(45deg); margin:10px; transition:all 0.3s; }
.testimonial .owl-dots .owl-dot.active { background:var(--primary); transform:rotate(135deg); }
.testimonial .owl-dots .owl-dot:focus { outline:none; }

.types { padding:35px 0 5px; background-color:var(--dark); }
.types .d-lg-flex { margin:0 0 30px; }
.types .d-lg-flex img { width:100%; border:1px solid #eee; }
.types .text { display:flex; height:100%; align-items:center; border:1px solid var(--light); padding:0 10%; outline:3px solid var(--light); outline-offset:-10px; }
.types .text div h3 { font-size:50px; text-align:center; color:var(--light); line-height:0.8; }
.types .text div p { text-align:center; color:var(--light); }
.types .text div p:last-child { margin:0; }
@media (max-width:992px) {
	.types .text { height:auto; padding:40px 20px; }
}

.news { display:flex; align-items:center; justify-content:center; min-height:70vh; padding:60px 0; }
.news h2,
.news h6 { text-align:left; }
.news svg.underline { margin-left:0; }
.news p { text-align:left; color:var(--dark); max-width:400px; }
.news form { max-width:400px; width:100%; }
.news form input { display:block; width:100%; height:60px; line-height:60px; border:0; box-shadow:0 0 0 1px var(--primary) inset; border-right:0; padding:0 20px; color:var(--dark); background:transparent; }
.news form input:first-child { border-radius:5px 5px 0 0; margin-bottom:-1px; }
.news form input:focus { background:#eee; outline:none; }
.news form button { display:block; width:100%; height:60px; line-height:60px; border:1px solid var(--primary); padding:0 20px; background:var(--primary); color:var(--light); border-radius:0 0 5px 5px; }

footer { }
footer .content { background:var(--dark); padding:30px 0; }
footer .content p { margin:0 0 10px; color:var(--light); font-weight:400; }
footer .content a { display:block; margin:0 0 10px; color:var(--light); font-weight:400; font-size:14px; }
footer .content a:hover { color:var(--primary); }
footer .content a:last-child { margin:0; }
footer .content .contact { margin-bottom:10px; }
footer .content .contact img { width:100%; max-width:100px; margin:0 0 15px; }
footer .content .link { display:flex; justify-content:space-around; }
footer .content .time p { margin:0 0 10px; font-size:20px; }
footer .content .time table tr td { padding:2px 10px; color:var(--light); }
footer .content .time table tr td:first-child { text-align:right; }
footer .content .time table tr.active td { background:var(--light); color:var(--dark); }
footer .copy { background:var(--dark); padding:10px; font-size:12px; text-align:center; color:var(--light); }
@media (max-width:992px) {
	footer { margin:0; }
	footer .content a,
	footer .content p { display:block; text-align:center; }
	footer .content .contact img { max-width:200px; margin:0 auto 30px; display:table; }
	footer .content .time { display:none; }
	footer .content .time { display:none; }
}

.booking { padding:200px 0 80px; }
.booking .text { margin-bottom:10px; }
.booking .text .btn { display:table;  }
@media (max-width:992px) {
	.booking { padding-top:140px; text-align:center; }
	.booking .text .btn { display:inline-block; margin:0; }
}

.contact { position:relative; }
.contact-details { padding:0 0 100px; }
.contact-details iframe { width:100%; border:0; height:350px; position:relative; z-index:10; }
.contact-details > p { text-align:center; }
.contact-details form input,
.contact-details form textarea { width:100%; height:40px; line-height:40px; padding:0 10px; color:var(--dark); border:1px solid var(--dark); border-bottom:0; margin:0; background:transparent; }
.contact-details form textarea { height:150px; min-height:150px; resize:vertical; }
.contact-details form input:focus,
.contact-details form textarea:focus { box-shadow:none; outline:none; background:#ddd; }
.contact-details form button { width:100%; height:40px; line-height:40px; padding:0 15px; border:1px solid var(--dark); margin-top:-4px; border-radius:0; }
.contact-details .social a { font-size:30px; color:var(--primary); margin-right:5px; }
.contact-details a:hover { color:var(--dark); }
.contact-details .msg { margin-top:20px; }
.contact-details .msg.success { color:green; }
.contact-details .msg.error { color:red; }

.gallery { padding:0 0 100px; }
.gallery #gallery { display:flex; flex-wrap:wrap; }
.gallery #gallery a { display:block; background:var(--dark); margin:10px; position:relative; width:calc(33% - 20px); box-shadow:0 0 0 3px var(--primary) inset; }
.gallery #gallery a img { width:100%; transition:all 0.4s; opacity:0.8; }
.gallery #gallery a:hover img { opacity:1; }
@media (max-width:992px) {
	.gallery { padding:50px 0; }
	.gallery #gallery a { width:calc(50% - 10px); margin:0 5px 10px; }
	.contact-details { padding:150px 0 50px; }
}

.order { padding:20px 0 60px; }
.order label { display:block; width:100%; margin:30px 0 3px; font-size:16px; }
.order select,
.order input { display:block; width:100%; height:40px; line-height:40px; border:1px solid var(--primary); padding:0 15px; }
.order select:focus,
.order input:focus { outline:1px solid var(--primary); outline-offset:2px; }

.menu { padding:0 0 100px; }
.menu a { pointer-events:none; cursor:default; }
.menu ul { list-style:none; padding:0; }
.menu .menu-active { width:calc(33.333% - 30px); margin:0 15px 30px; border:2px solid var(--primary); }
.menu .menu-active .sub-menu { padding:0 10px 10px; }
.menu .menu-active > a { font-size:18px; line-height:18px; font-weight:400; background:var(--light5); border-bottom:2px solid var(--primary); color:var(--light); display:block; padding:10px; margin:0 0 20px; text-transform:capitalize; color:var(--dark); }
.menu .menu-active .meal { display:flex; align-items:center; justify-content:space-between; margin:0 0 10px; flex-grow:1; }
.menu .menu-active .meal h5 { font-family:var(--font1); font-size:14px; margin:0; font-weight:400; text-transform:capitalize; color:var(--dark); }
.menu .menu-active .meal h5.sub-item { margin:0 0 0 10px; color:var(--dark8); }
.menu .menu-active .meal h5.sub-item:before { content:"▪ "; color:var(--dark4); }
.menu .menu-active .meal h4 { font-family:var(--font1); font-size:16px; margin:0; font-weight:400; text-transform:capitalize; color:var(--dark); }
.menu .menu-active .meal .dots { height:10px; border-bottom:1px dashed var(--dark4); flex-grow:1; margin:0 5px; }
.menu .menu-active .meal .price { font-size:14px; font-weight:400; color:var(--dark); }
.menu .menu-active .productdescription,
.menu .menu-active .subproductdescription,
.menu .menu-active .sub-menu > .menucatdescription { font-size:11px; line-height:12px; font-style:italic; margin:-10px 0 10px; color:var(--dark); text-align:justify; text-transform:capitalize; }
.menu .menu-active .subproductdescription { margin-left:20px; }
.menu .btn { display:table; margin:0 auto 30px; }

#menu .item { width:100%; padding:0 10px 20px; }
#menu .item .title { color:var(--dark); padding:10px; border:1px solid var(--primary); }
#menu .item .title p { font-size:20px; font-weight:700; margin:0; text-transform:capitalize; }
#menu .item .title small { font-size:12px; display:block; margin:0; font-weight:700; font-style:italic; opacity:0.8; }
#menu .content { padding:20px 15px 10px; border:1px solid var(--primary); border-top:0; }
#menu .content .meal { display:flex; align-items:center; justify-content:space-between; margin:0 0 15px; }
#menu .content .meal .name { font-size:14px; font-weight:600; text-transform:capitalize; }
#menu .content .meal .dots { flex-grow:1; border-bottom:2px dashed var(--dark); height:15px; margin:0 10px; }
#menu .content .meal .price { font-size:14px; font-weight:700;  }
#menu .content .detail { font-size:13px; font-weight:400; font-style:italic; margin:-15px 0 15px; color:#f76005; margin-top: 2px;}
#menu .content .meal.sub { padding-left:15px; }

@media (max-width:992px) {
	.menu { padding:50px 0; }
	.menu .menu-active { width:100%; margin:0 0 15px; }
}

@media (max-width:992px) {
	header .navbar-collapse { background:var(--dark); position:fixed; left:0; top:0; width:100%; height:100%; z-index:1000; padding:100px 0 30px; }
	header .navbar .navbar-nav { height:100%; }
	header .navbar .navbar-nav .nav-item { height:20%; display:flex; align-items:center; }
	header .navbar .navbar-nav a { display:block; font-size:6vw; width:100%; color:var(--light) !important; text-align:center !important; }
	header .navbar .navbar-nav .nav-item.active { background:var(--light); }
	header .navbar .navbar-nav .nav-item.active a { color:var(--dark) !important; }
	header .navbar .navbar-nav a:after { display:none; }
}