/*!
Theme Name: Dinner Lite
Theme URI: https://astaporthemes.com/downloads/dinner-free-wordpress-theme/
Author: Astapor Themes
Author URI: https://astaporthemes.com/
Description: Dinner Lite is beautiful, clean and professional WordPress theme for restaurants, cafe, coffee house or any food drinks related business. Its easy to use, polished, feature-rich and fully responsive which looks perfect on any devices like mobile, pc and tablet and cross browser compatible. With its customizer options, one can easily set up homepage section perfectly without any hassle. You can check theme demo at: https://astaporthemes.com/demo/dinner-lite
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: dinner-lite
Tags: one-column, two-columns, right-sidebar, custom-background, custom-logo, custom-menu, featured-image-header, featured-images, threaded-comments, translation-ready, theme-options, footer-widgets, blog, full-width-template, custom-colors , e-commerce, food-and-drink 

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Dinner Lite is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Normalize
# Typography
# Elements
# Forms
# Navigation
	## Links
	## Menus
# Accessibility
# Alignments
# Clearings
# Widgets
# Content
	## Posts and pages
	## Comments
# Infinite scroll
# Media
	## Captions
	## Galleries
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/
html {
	font-family: 'Source Sans Pro', sans-serif;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}

body {
	margin: 0;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
	display: block;
}

audio,
canvas,
progress,
video {
	display: inline-block;
	vertical-align: baseline;
}

audio:not([controls]) {
	display: none;
	height: 0;
}

[hidden],
template {
	display: none;
}

a {
	background-color: transparent;
}

a:active,
a:hover {
	outline: 0;
}

abbr[title] {
	border-bottom: 1px dotted;
}

b,
strong {
	font-weight: bold;
}

dfn {
	font-style: italic;
}

h1 {
	font-size: 36px;
	line-height: 38px;
}

h1, h2, h3, h4, h5, h6 {
	margin: 0;
	padding: 0;
}

mark {
	background: #ff0;
	color: #000;
}

small {
	font-size: 80%;
}

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	top: -0.5em;
}

sub {
	bottom: -0.25em;
}

img {
	border: 0;
}

svg:not(:root) {
	overflow: hidden;
}

figure {
	margin: 1em 40px;
}

hr {
	box-sizing: content-box;
	height: 0;
}

pre {
	overflow: auto;
}

code,
kbd,
pre,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}

button,
input,
optgroup,
select,
textarea {
	color: inherit;
	font: inherit;
	margin: 0;
}

button {
	overflow: visible;
}

button,
select {
	text-transform: none;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
	-webkit-appearance: button;
	cursor: pointer;
}

button[disabled],
html input[disabled] {
	cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

input {
	line-height: normal;
}

input[type="checkbox"],
input[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

fieldset {
	border: 1px solid #c0c0c0;
	margin: 0 2px;
	padding: 0.35em 0.625em 0.75em;
}

legend {
	border: 0;
	padding: 0;
}

textarea {
	overflow: auto;
}

optgroup {
	font-weight: bold;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

td,
th {
	padding: 0;
}

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
body,
button,
input,
select,
optgroup,
textarea {
	color: #000;
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 16px;
	font-size: 1rem;
	line-height: 1.5;
}

h1, h2, h3, h4, h5, h6 {
	clear: both;
}

p {
	font-size: 16px;
    font-weight: 200;
    line-height: 25px;
    letter-spacing: 1px;
}

dfn, cite, em, i {
	font-style: italic;
}

blockquote {
	margin: 0 1.5em;
}

address {
	margin: 0 0 1.5em;
}

pre {
	background: #eee;
	font-family: "Courier 10 Pitch", Courier, monospace;
	font-size: 15px;
	font-size: 0.9375rem;
	line-height: 1.6;
	margin-bottom: 1.6em;
	max-width: 100%;
	overflow: auto;
	padding: 1.6em;
}

code, kbd, tt, var {
	font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
	font-size: 15px;
	font-size: 0.9375rem;
}

abbr, acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}

mark, ins {
	background: #fff9c0;
	text-decoration: none;
}

big {
	font-size: 125%;
}

/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/
html {
	box-sizing: border-box;
}

*,
*:before,
*:after {
	/* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
	box-sizing: inherit;
}

body {
	background: #fff;
	/* Fallback for when there is no custom background color defined. */
}


blockquote:before,
blockquote:after,
q:before,
q:after {
	content: "";
}

blockquote,
q {
	quotes: "" "";
	background: url(images/quote-icon.jpg) no-repeat 0 16px;
	padding: 35px;
}



hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin-bottom: 1.5em;
}

ul, ol {
	margin: 0 0 1.5em 3em;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

li > ul,
li > ol {
	margin-bottom: 0;
	margin-left: 1.5em;
}

dt {
	font-weight: bold;
}

dd {
	margin: 0 1.5em 1.5em;
}

img {
	height: auto;
	/* Make sure images are scaled correctly. */
	max-width: 100%;
	/* Adhere to container width. */
}

figure {
	margin: 1em 0;
	/* Extra wide images within figure tags don't overflow the content area. */
}

table {
	margin: 0 0 1.5em;
	width: 100%;
}

/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	border: 1px solid;
	border-color: #ccc #ccc #bbb;
	border-radius: 3px;
	background: #e6e6e6;
	color: rgba(0, 0, 0, 0.8);
	font-size: 12px;
	font-size: 0.75rem;
	line-height: 1;
	padding: .6em 1em .4em;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	border-color: #ccc #bbb #aaa;
}

button:active, button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus {
	border-color: #aaa #bbb #bbb;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: #666;
	border: 1px solid #ccc;
	border-radius: 3px;
	padding: 3px;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	color: #111;
}

select {
	border: 1px solid #ccc;
}

textarea {
	width: 100%;
}

/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/
a {
	color: #ff8a43;
	text-decoration: none;
}

a:visited {
	/*color: #ff8a43;*/
}

a:hover, a:focus, a:active {
	color: #ff8a43;
}

a:focus {
	outline: thin dotted;
}

a:hover, a:active {
	outline: 0;
}

/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/
.main-navigation{
	float: right;
	margin: 30px 0 0;
}

.main-navigation a{
	text-decoration: none;
}

.main-navigation ul{
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 16px;
	line-height: 18px;
	text-transform: uppercase;
}

.main-navigation ul:after{
	content: '';
	display: block;
	clear: both;
}

.main-navigation ul li{
	float: left;
	margin-left: 44px;
	position: relative;
}

.main-navigation ul li:first-child{margin-left: 0;}

.main-navigation ul li a{
	color: #fff;
	display: block;
	padding-bottom: 25px;
	font-weight: 700;
}

.main-navigation ul li a:hover,
.main-navigation ul li a:focus,
.main-navigation ul li:hover > a{
	text-decoration: none;
	color: #F8893B;
}

.main-navigation .current_page_item > a,
.main-navigation .current-menu-item > a,
.main-navigation .current_page_ancestor > a,
.main-navigation .current-menu-ancestor > a {
	text-decoration: none;
	color: #F8893B;
}

.main-navigation ul ul{
	border-top: 2px solid #f8893b;
	position: absolute;
	top: 100%;
	right: -50px;
	width: 250px;
	background: #000;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
	z-index: 2;
	display: none;
	text-align: center;
}

.main-navigation ul li:hover ul{display: block;}

.main-navigation ul li:hover ul ul{display: none;}

.main-navigation ul ul li:hover > ul{display: block;}

.main-navigation ul ul:before{
	width: 0;
	height: 0;
	content: '';
	position: absolute;
	top: -9px;
	left: 10px;
}

.main-navigation ul ul li{
	float: none;
	display: block;
	margin: 0;
}

.main-navigation ul ul li a{
	color: #fff;
	display: block;
	border-bottom: 1px solid #4a4a4a;
	padding: 16px 25px;
}

.main-navigation ul ul li a:hover,
.main-navigation ul ul li a:focus,
.main-navigation ul ul li:hover > a{
	background: #000;
	color: #F8893B;
}

.main-navigation ul ul ul{
	right: 100%;
	top: -2px;
}

.main-navigation ul ul ul:before{display: none;}

.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {
	margin: 0 0 1.5em;
	overflow: hidden;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	float: left;
	width: 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
	float: right;
	text-align: right;
	width: 50%;
}



/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-size: 0.875rem;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
	/* Above WP toolbar. */
}

/* Do not show the outline on the skip link target. */
#content[tabindex="-1"]:focus {
	outline: 0;
}

/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/
.alignleft {
	display: inline;
	float: left;
	margin-right: 1.5em;
}

.alignright {
	display: inline;
	float: right;
	margin-left: 1.5em;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/*--------------------------------------------------------------
# Clearings
--------------------------------------------------------------*/
.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
	content: "";
	display: table;
	table-layout: fixed;
}

.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after {
	clear: both;
}

/*--------------------------------------------------------------
# Widgets
--------------------------------------------------------------*/
.widget {
	margin: 0 0 1.5em;
	/* Make sure select elements fit in widgets. */
}

.widget select {
	max-width: 100%;
}

/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Posts and pages
--------------------------------------------------------------*/
.sticky {
	display: block;
}

.hentry {
	margin: 0 0 1.5em;
}

.updated:not(.published) {
	display: none;
}

.page-content,
.entry-content,
.entry-summary {
	margin: .5em 0 1.5em;
}

.post .entry-content {
    padding: 0 25px;
}

.post footer.entry-footer {
    padding: 0 25px 25px 25px;
}

.page-links {
	clear: both;
	margin: 0 0 1.5em;
}

/*--------------------------------------------------------------
## Comments
--------------------------------------------------------------*/
.comment-content a {
	word-wrap: break-word;
}

.bypostauthor {
	display: block;
}

/*--------------------------------------------------------------
# Infinite scroll
--------------------------------------------------------------*/
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
	/* Theme Footer (when set to scrolling) */
	display: none;
}

/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */
.infinity-end.neverending .site-footer {
	display: block;
}

/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
	display: inline-block;
}

/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

.wp-caption-text {
	text-align: center;
}

/*--------------------------------------------------------------
## Galleries
--------------------------------------------------------------*/
.gallery {
	margin-bottom: 1.5em;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	vertical-align: top;
	width: 100%;
}

.gallery-columns-2 .gallery-item {
	max-width: 50%;
}

.gallery-columns-3 .gallery-item {
	max-width: 33.33%;
}

.gallery-columns-4 .gallery-item {
	max-width: 25%;
}

.gallery-columns-5 .gallery-item {
	max-width: 20%;
}

.gallery-columns-6 .gallery-item {
	max-width: 16.66%;
}

.gallery-columns-7 .gallery-item {
	max-width: 14.28%;
}

.gallery-columns-8 .gallery-item {
	max-width: 12.5%;
}

.gallery-columns-9 .gallery-item {
	max-width: 11.11%;
}

.gallery-caption {
	display: block;
}





/*--------------------------------------------------------------
## Custom CSS
--------------------------------------------------------------*/

.container{
	width: 1170px;
	margin: 0 auto;
	padding: 0 15px;
}

.container:after{
	display: block;
	content: '';
	clear: both;
}

.row{
	margin: 0 -15px;
}

.row:after{
	display: block;
	content: '';
	clear: both;
}

/* column */
.col-3, .col-4, .col-6, .col-8, .col-9{
float: left;
padding-left: 15px;
padding-right: 15px;
}


.col-3{ 
width: 25%;
}

.col-4{
width: 33.3333333%;
}

.col-6{
	width: 50%;
}

.col-8{
	width: 66.66%;
}

.col-9{
	width: 75%;
}

.left {
    float: left;
}

.right {
    float: right;
}

img{
	vertical-align: top;
}

.coffee {
    background: #100a01;
    color: #d2831f;
    border: 2px solid #482a03;
}

.top-bar {
    background: #111;
    text-align: center;
    color: #f8660c;
    padding: 50px 0;
    text-transform: capitalize;
}

.error-holder {
    text-align: center;
    max-width: 700px;
    margin: auto;
    padding: 70px 0;
    display: flex;
}

#mobile-header{
	display: none;
}

.site-branding{
	margin-right: 10px;
}

.text-logo {
    float: right;
}

a.read-more {
    background: #f5c07b;
    padding: 10px 20px;
    text-decoration: none;
    border-radius: 5px;
    font-weight: bold;
}

a.read-more:hover, a.read-more:focus  {
    background: #f9d8af;
    padding: 10px 20px;
    text-decoration: none;
    border-radius: 5px;
}

.site-branding {
    display: inline-block;
}

.site-branding .site-title a {
    text-decoration: none;
}

.site-branding .site-title {
    padding-top: 20px;
}

.entry-header {
    padding: 25px 25px 0 25px;
}

.site-branding .site-title a,
.entry-header .entry-title a,
.widget-title{
	font-family: 'Source Sans Pro', sans-serif;
	text-decoration: none;
	font-weight: 200;
}

.entry-header .entry-title a{
    font-size: 36px;
    margin-bottom: 10px;
    text-transform: capitalize;
}

.post .entry-title {
    font-weight: 400;
}

.site-footer .widget-title{
	font-family: 'Merienda', cursive;
	text-decoration: none;
	font-weight: 200;
}

.section-sub-title{
	font-family: 'Merienda', cursive;
}

h3.section-sub-title {
    font-size: 24px;
    margin-bottom: 5px;
}

/*meta*/

.entry-meta{
	padding-bottom: 5px;
	margin-top: 5px;
	font-weight: bold;
}

.content-area .entry-meta a {
    text-decoration: none;
    color: #0056b3;
}

.content-area .entry-meta a:hover {
    text-decoration: none;
    color: #f8893b;
}

.entry-meta span {
    border-left: 1px solid #777;
    padding: 0px 10px;
    font-size: 18px;
    font-weight: 200;
}

.entry-meta span.author.vcard {
    padding: 0;
}

.entry-meta span:first-child {
    border-left: 0;
    padding-left: 0px;
}

/* primary */
#primary{
	float: left;
	width: 66.6667%;
    margin-top: 50px;
    padding: 0 15px;
}


.full-width #primary{
	width:100%;
}

#secondary {
    float: left;
    width: 33.3333%;
    padding: 0 15px;
    padding-top: 50px;
}

/* widgets */

#secondary.widget-area .widget {
    color: #333;
    padding: 15px;
    border: 1px solid #eaeaea;
    box-shadow: 0px 0px 14px -6px rgba(0,0,0,0.37);
    border-radius: 5px;
}

.calendar_wrap {
   text-align: center;
}

.content-area a {
    color: #000;
}

.content-area a:hover {
    color: #3a3a3a;
}

.content-area .post-thumbnail {
    /*margin: 15px 0;*/
}

h2.widget-title a {
    text-decoration: none;
}

.widget-area select {
    border: 1px solid #c7c7c9;
    border-radius: 5px;
    padding: 8px 2px;
    margin: 0 15px 0 0;
    width: 100%;
}

.search-form{
	background: #fff;
	border: 1px solid #e5e5e5;
	overflow: hidden;
	padding: 7px 0 8px 14px;
}

.search-form input[type="search"]{
    width: 85%;
	background: none;
	border: 0;
	border-radius: 0;
	font-size: 14px;
}

.search-form input[type="submit"]{
    float: right;
    background: url(images/icon-search.png) no-repeat;
    width: 15px;
    height: 15px;
    border: 0;
    border-radius: 0;
    padding: 0;
    text-indent: -9999px;
    box-shadow: none;
    margin: 6px 14px 0 0;

}

.search .search-form{
	max-width: 400px;
}

.site-footer .site-info a, .site-footer .site-info a:visited{
	color: #f8883f;
}

.site-footer .site-info a:hover, .site-footer .site-info a:focus{
	color: #f09747;
}

.site-footer .widget-area{
	font-size: 16px;;
	line-height: 26px;
	color: #fff;
	padding-bottom: 40px;
	padding-top: 60px;
}


.site-footer .widget-area a {
    color: #fff;
}

.widget{
	width: 100%;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	float: left;
}
.widget-area .widget-title{
	font-size: 25px;
    line-height: 32px;
    margin: 0;
    position: relative;
    padding: 10px 15px;
}

#secondary.widget-area .widget-title{
	font-size: 24px;
    background-color: #F8F8F8;
    font-weight: 600;
    text-transform: uppercase;
    padding: 15px;
    border-bottom: 1px solid #f0f0f0;
    margin-left: -15px;
    margin-right: -15px;
    margin-top: -15px;
    margin-bottom: 15px;
}

.site-footer .widget-area .widget-title{
	padding: 10px 15px 10px 0;
}

.widget-area .calendar_wrap caption,
.widget-area .calendar_wrap thead,
.widget-area .calendar_wrap tfoot,
.widget-area .calendar_wrap td
{
	border: 1px solid;
}


#secondary .widget .text-holder a {
    text-decoration: none;
    color: #000;
}

#secondary .widget .text-holder a:hover,
#secondary .widget .text-holder a:focus,
#secondary .widget .text-holder a:visited{
    text-decoration: underline;
}

.widget-area ul{
	margin: 0;
	padding: 0;

}
.widget-area ul li{
	list-style: none;
	padding: 0 0 10px 25px;
	position: relative;
}
.widget-area ul li:after{
	position: absolute;
	top: 0;
	font-family: 'FontAwesome';
	left:0;
	content: "\F101";
}
.widget-area ul li a{
	color: #cecece;
	text-decoration: none;
} 

#secondary.widget-area ul li a {
    color: #333;
}

#secondary.widget-area ul li a:hover {
    color: #FF7115;
}

a.rsswidget{
	color: #cdcdcd;
}

.widget-area ul li a:hover{
	color: #b0b0b0;
}

.site-info {
	text-align: center;
    color: #fff;
    padding: 20px 0;
}


#mobile-header-top,
#mobile-header{display: none;}

#mobile-header a {
    color: #fffff8;
    background: #fdbded;
    padding: 4px 10px;
    border-radius: 5px;
    opacity: 0.8;
    margin: 5px;
}


/*comments section style*/
#comments {
    margin: 0 0 45px;
}

.comments-area{
	background: #fff;
}

.comments-area .comments-title{
	font-size: 24px;
	line-height: 28px;
	font-weight: 400;
	color: #333;
}

.comments-area ol{
	margin: 0;
	padding: 0;
	list-style: none;
}

.comments-area .comment-body{
	padding-bottom: 27px;
	margin-bottom: 27px;
	border-bottom: 1px solid #f2f2f2;
}

.comments-area .comment-body .avatar{
	float: left;
	width: 70px;
	margin-right: 23px;
}

.comments-area .comment-body .says{display: none;}

.comments-area .comment-body .fn{
	font-size: 18px;
	line-height: 22px;
	display: block;
	color: #333;
	margin: 0 0 3px;
	overflow: hidden;
}

.comments-area .comment-body .comment-metadata{
	font-size: 14px;
	line-height: 17px;
	color: #999;
	overflow: hidden;
}

.comments-area .comment-body .comment-metadata a{color: #999;}

.comments-area .comment-body .comment-metadata a:hover,
.comments-area .comment-body .comment-metadata a:focus{
	color: #63b03e;
	text-decoration: none;
}

.comments-area .comment-body .comment-content{
	margin-left: 93px;
	margin-top: 10px;
}

.comments-area .comment-body .reply{
	margin-left: 93px;
	overflow: hidden;
}

.comments-area .comment-body .reply a{
	border: 1px solid #63b03e;
	float: left;
	font-size: 14px;
	width: 69px;
	height: 25px;
	line-height: 23px;
	text-align: center;
	text-transform: uppercase;
}

.comments-area .comment-body .reply a:hover,
.comments-area .comment-body .reply a:focus{
	background: #63b03e;
	color: #fff;
	text-decoration: none;
}

.comments-area .children{
	margin-left: 93px;
}

.comments-area .comment-reply-title{
	font-size: 24px;
	line-height: 28px;
	font-weight: 400;
	color: #333;
}

.comments-area .comment-form label{display: none;}

.comments-area .comment-form .comment-form-author{
	float: left;
	width: 32%;
	margin-right: 2%;
}

.comments-area .comment-form .comment-form-email{
	float: left;
	width: 32%;
	margin-right: 2%;
}

.comments-area .comment-form .comment-form-url{
	float: left;
	width: 32%;
}

.comments-area .comment-form input[type="text"],
.comments-area .comment-form input[type="email"],
.comments-area .comment-form input[type="url"]{
	width: 100%;
	padding: 10px 15px;
}


/* button */
.button-holder {
    width: 100%;
    padding-top: 50px;
}

a.btn-primary {
    padding: 12px 60px;
    border-radius: 30px;
    text-decoration: none;
    display: inline-block;
    font-size: 18px;
}

.orange {
    background: #F8883F;
    color: #fff;
    border: 2px solid #F8883F;
}


a:hover.btn-primary.orange {
    background: #fff;
    color: #F8883F;
}


/*header style*/

/*header-bottom*/
.header-bottom{
	width: 100%;
	z-index: 3;
	padding: 5px 0px;
	background: #000;
}

.has-slider .header-bottom{
	position: absolute;
	width: 100%;
	background: transparent;
}
.site-header .header-bottom.sticky {
    position: fixed;
    top: 0;
    background: #03082b;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    z-index: 999;
    width: 100%;
}

.header-bottom .site-branding{float: left;}


.header-bottom .site-branding .site-title{
	font-size: 28px;
	line-height: 29px;
	margin: 0;
	font-weight: 200;
	color: #fff;
	text-transform: uppercase;
}

.header-bottom .site-branding .site-title a{color: #fff; text-decoration: none;}

.header-bottom .site-branding .site-title a:hover,
.header-bottom .site-branding .site-title a:focus{text-decoration: none; opacity: 0.8;}

.header-bottom .site-branding .site-description{
	color: #fefefe;
	font-size: 14px;
	line-height: 17px;
}

#responsive-menu-button-top {
    float: left;
}

#responsive-menu-button {
    float: right;
}

.section-title{
 	color: #EE8546;
 	font-family: 'Merienda', cursive;
 	font-size: 28px;
 	margin-bottom: 50px;
}



/* Banner */

.banner-section {
    display: block;
    background: #000;
}

.banner-text-holder {
    /*position: absolute;*/
    top: 0;
    left: 0;
    width: 100%;
    background: rgba(0,0,0,.3);
}
.banner-text {
    color: #fff;
    text-align: center;
    padding-top: 12%;
}

.banner-text h2 {
    font-family: 'Merienda', cursive;
    font-style: italic;
}

.banner-text h1 {
    color: #F8893B;
    font-family: 'Merienda', cursive;
    font-size: 75px;
    line-height: 85px;
    padding-top: 40px;
    font-style: italic;
}

.banner-section:after{
	content: '';
	display: block;
	clear: both;
}

.banner-section a:hover.btn-primary.coffee {
    background: #100a01;
    color: #d2831f;
    border: 2px solid #482a03;
    box-shadow: 0px 15px 27px 0px #000;
}

.banner-section .section-content {
    padding: 60px 0;
    max-width: 500px;
    margin: auto;
}

.banner-section a.btn-primary.coffee {
    margin-bottom: 50px;
    display: inline-block;
}

/* About section */
.product-section,
.about-section, 
.portfolio-section,
.testimonial-section,
.blog-section
{
	padding: 100px 0;
}

/** About Section */
.about-banner {
	position: relative;
    border-radius: 0px 100px;
    overflow: hidden;
    border-bottom: 5px solid #f89400;
    background: #000;
}

.about-text {
    color: #fff;
    padding: 150px 15px;
    text-align: center;
}

.about-item img {
    height: 50px;
    width: 50px;
}

.about-text h2.section-title{
    margin-bottom: 25px;
}

.about-text h2.section-title:after {
    content: ' ';
    display: block;
    background-color: #EC843F;
    height: 2px;
    width: 25%;
    margin: 0 auto;
    margin-top: 20px;
}

.about-service {
    padding: 60px 0;
}

.about-title h4 {
    padding: 5px 0px;
}

a.about-title {
    color: #101010;
    text-decoration: none;
}

.about-item {
    padding: 30px 15px;
    border: 1px solid #eaeaea;
    margin: 15px 0;
}

.about-item:hover {
    background: #ffbd6a;
}

.about-item img.post-thumbnail {
    margin-bottom: 20px;
}

.service-text p {
    font-size: 14px;
    line-height: 18px;
    padding: 0;
    margin: 0;
}

/** Product section */
.product-section {
    text-align: center;
    color: #ffffff;
    background: #000;
}

.product-slider-item {
    display: inline-block;
}

.product-info {
    text-align: left;
    margin-bottom: 30px;
}

.product-info h2 {
    font-weight: 200;
}

.product-info a{
    text-decoration: none;
    color: #fff;
}

.product-info a:hover{
    text-decoration: none;
    color: #ff8c38;
}

.product-section .price {
    float: right;
    color: #d2831f;
}

#testimonial{
	background: #000;
	color: #fff;
}

.about-section  header.main-header,
.portfolio-section  header.main-header,
.testimonial-section  header.main-header {
	
	text-align: center;
	margin-bottom: 65px;
}

/** portfolio */

.portfolio-section{
    text-align: center;
}

.portfolio-section .col-3 {
    padding-left: 5px;
    padding-right: 5px;
}

.portfolio-item{
	margin-bottom: 30px;
	position: relative;
	overflow: hidden;
}

.portfolio-item img{
	width: 100%;
	transition: all 0.2s linear;
}


.portfolio-mask{
	display: block;
	position: absolute;
	top: 0;
	background: rgba(0, 0, 0, 0.2);
	width: 100%;
    height: 100%;
    opacity: 0;
    transition: all 0.4s ease-in-out;
}

.portfolio-item h2 {
    transform: translateY(-100px);
    opacity: 0;
    transition: all 0.2s ease-in-out;
    background: rgba(0, 0, 0, 0.7);
    color: #fff;
}
.portfolio-item p { 
    transform: translateY(100px);
    opacity: 0;
	transition: all 0.2s linear;
}
.portfolio-item a.btn{
    opacity: 0;
	transition: all 0.2s ease-in-out;
}


.portfolio-item:hover img { 
	transform: scale(1.1);
} 
.portfolio-item:hover .portfolio-mask { 
	opacity: 1;
}
.portfolio-item:hover h2,
.portfolio-item:hover p,
.portfolio-item:hover a.btn {
    opacity: 1;
    transform: translateY(0px);
}
.portfolio-item:hover p {
    transition-delay: 0.1s;
}
.portfolio-item:hover a.btn {
    transition-delay: 0.2s;
}

/* Testimonial */

.testimonial-holder {
    background: #fff;
    text-align: center;
    color: #000;
    padding: 15px;
    margin-bottom: 30px;
}

.testimonial-thumbnail{
	text-align: center;
	background: #efefef;
	color: #000;
	height:70px;
	width: 70px;
	border-radius: 50%;
	overflow: hidden;
	margin: auto; 
}

.testimonial-info {
	margin: 10px 0;
}

.testimonial-text {
    margin: 20px 0;
}

#testimonial .owl-prev {
    float: left;
    position: absolute;
    top: 50%;
}

#testimonial .owl-next {
    float: right;
    position: absolute;
    top: 50%;
}

/* widgets */
.site-footer .widget-area{
	background: #272727;
	font-size: 16px;;
	line-height: 26px;
	padding-bottom: 40px;
	padding-top: 60px;
}
.site-footer .widget{
	width: 100%;
	padding: 0 15px;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	float: left;
}
.site-footer .widget-area .widget-title{
	font-size: 25px;
	line-height: 32px;
	margin: 0 0 16px;
	color: #ffffff;
    font-style: italic;
}
.widget-area ul{
	margin: 0;
	padding: 0;

}
.widget-area ul li{
	list-style: none;
	padding: 0 0 10px 15px;
	position: relative;
}
.widget-area ul li:after {
    position: absolute;
    top: 0;
    font-family: 'FontAwesome';
    left: 0;
    content: "\F0da";
    color: #f8660c;
}
.widget-area ul li a{
	color: #cecece;
	font-size: 17px;
	line-height: 22px;
}
#secondary ul li a{
	color: #383838;
}

.widget-area ul li a:hover{
	color: #b0b0b0;
}

.site-info {
	background: #1D1D1D;
	text-align: center;
    color: #fff;
    padding: 20px 0;
    font-weight: 300;
}

#mobile-header-top,
#mobile-header{display: none;}

#mobile-header a {
    color: #fff;
}

#mobile-header a {
    opacity: 0.8;
}

/** Blog Section*/
.blog-section{
	background: #eaeaea;
	text-align: center;
}

.blog-holder {
    display: block;
    background: #fff;
    padding: 10px;
    margin-bottom: 30px;
}


.blog-info .category a {
    color: #8f8f8f;
    font-weight: 700;
	font-size: 14px;
	display: inline-block;
}

.blog-info .category:after {
    content: "";
    border: .5px solid #8f8f8f;
    display: block;
    width: 20%;
    margin: auto;
    margin-top: 5px;
    margin-bottom: 15px;
}

.blog-info {
    padding: 15px 0 5px;
}

.blog-info a{
	color: #000;
}

.product-slider-item img,
.blog-thumbnail img {
    width: 100%;
}

article.post {
    border: 1px solid #eaeaea;
    border-radius: 15px;
    overflow: hidden;
}

/*responsive style*/
@media only screen and (max-width: 1199px){
	.container{
		width: 970px;
	}

	.main-navigation ul li{margin-left: 25px;}

	.banner .banner-text{}

	.banner .banner-text .title{
		font-size: 40px;
		line-height: 49px;
	}

	.banner-text p{margin: 0 0 20px;}

	.banner .btn-scroll-down{padding: 0 0 37px;}
}

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

	.about-section, .portfolio-section, .testimonial-section {
	    padding: 100px 0;
	}
	p{
    	margin: 5px 0;
    	line-height: 23px;
	}


	.container{width: 750px;}
	
	#mobile-header-top{
		display: block;
		float: left;
	}

	.header-top .today-date{
		float: right;
	}

	#mobile-header{
		display: block;
		float: right;
		margin-top: 20px;
	}

	#mobile-header span{
		width: 22px;
		height: 3px;
		background: #fff;
		display: block;
		margin-bottom: 3px;
	}

	#mobile-header a{display: block;}

	.top-menu,
	.main-navigation{display: none;}

	.site-header{padding: 0px;}

	.about-section, .portfolio-section, .testimonial-section {
	    padding: 100px 0;
	}

	.about-section header.main-header, .portfolio-section header.main-header, .testimonial-section header.main-header{
	    text-align: center;
	    margin-bottom: 35px;
	}

	.banner .banner-text .title{
		font-size: 30px;
		line-height: 36px;
	}

	.banner .btn-scroll-down{padding: 0 0 30px;}

	.banner .btn-scroll-down span:after{
		background-size: 25px 12px;
		left: 25px;
	}

	.banner .btn-scroll-down span{
		background-size: 25px 36px;
		background-position: 50% 15px;
		font-size: 10px;
	}

	#primary,
	#secondary{width: 100%;}
	#primary .site-main{padding-right: 0;}
}

@media only screen and (max-width: 768px){
	.mean-container .mean-bar {
    	margin-top: 15px;
	    float: left;
	    width: 100%;
	    position: absolute;
	    background: transparent;
	    padding: 4px 0;
	    min-height: 42px;
	    z-index: 999999;
	}
	
	.site-branding .site-title {
    	padding-top: 5px;
	}

	.col-3, .col-4, .col-6, .col-8, .col-9{
		width: 50%;
	}

	.container{width: 100%;}

	.header-bottom {
	    padding: 10px 0px 0;
	}

	.header-bottom{
		background: #000;
	}

	.banner .banner-text{
		position: relative;
		top: 0;
		background: #3c3c3c;
	}

	.banner .banner-text{padding: 20px 0 200px;}

	#testimonial .owl-theme .owl-prev {
	    top: 200px;
	}

	#testimonial .owl-theme .owl-next {
	    top: 200px;
	}

	#testimonial .col-4{
		width: 100%;
		text-align: center;
	}

	.testimonial-thumbnail {
	    margin-left: auto;
	    margin-right: auto;
	}

	.blog-section .post .post-thumbnail{margin: 0 0 30px;}
	#primary .author .text-holder{width: 100%;}
	.comments-area .comment-list .comment-body .comment-content,
	.comments-area .comment-list .comment-body .reply{
		top: 0;
		left: 0;
	}
	.comments-area .comment-list .comment-body .comment-author,
	.comments-area .comment-list .comment-body .fn,
	.comments-area .comment-list .comment-body .comment-metadata{
		float: none;
		display: block;
	}
	.comments-area .comment-list .children{margin: 0 0 0 20px;}
	.search #primary .post .text-holder, .search #primary .page .text-holder{width: 100%;}
}


@media only screen and (max-width: 480px){
	.banner-text {
    	color: #fff;
    	text-align: center;
    	padding-top: 20%;
	}

	.banner-text h1 {
	    color: #F8893B;
	    font-family: 'Merienda', cursive;
	    font-size: 60px;
	    line-height: 70px;
	    padding-top: 25px;
	    font-style: italic;
	}

	.banner-section .section-content {
    	padding: 40px 0;
	}

	h1{
		font-size: 32px;
	}

	#testimonial .owl-theme .owl-prev {
	    top: 200px;
	}

	#testimonial .owl-theme .owl-next {
	    top: 200px;
	}


	.col-3, .col-4, .col-6, .col-8, .col-9{
		width: 100%;
	}

	.site-info .left,
	.site-info .right
	{
		float: none;
	}
}