/**************************************************************************
	CSS DOCUMENT
 
	Project:		www.bernerstavern.com
	Version:		1.0
	Last change:	00.00.18 [Created]
	Assigned to:	Rand Studio (Dev)		
	Designed & Handcrafted by RAND STUDIO

***************************************************************************

	[ I N D E X ]

	1.  HTML and Body Styles
	2.  Heading Styles
	3.  Anchor Styles
	4.  Generic Styles
	5.  Menu Icon styles
	6.  Left Panel (Sidebar) styles
	7.  Main Menu styles
	8.  Social Icons styles
	9.  Secondary Menu styles
	10. Subscribe styles
	11. Footer Menu styles
	12. Common Inner Pages Styles
	13. About Page styles
	14. Menu Page styles
	15. Reservations Page styles
	16. Private Dining Page styles
	17. News Page styles
	18. Team Page styles
	19. Contact Page styles
	20. Coockies Pop-up styles

****************************************************************************
   [ COLOR GUIDE ]
****************************************************************************

	white        : #FFF;

****************************************************************************	
	[ F O N T S ]
***************************************************************************/

@font-face {
	font-family: 'Gotham Book Regular';
	src: url url('../fonts/Gotham Book Regular.eot');
	src: local('☺'), 
	url('../fonts/Gotham-Book.woff') format('woff'), 
	url('../fonts/Gotham-Book.ttf') format('truetype'), 
	url('../fonts/Gotham-Book.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Font Awesome 5 Brands';
	font-style: normal;
	font-weight: normal;
	src: url("../fonts/fontawesome-webfont.eot");
	src: url("../fonts/fontawesome-webfont.eot?#iefix") format("embedded-opentype"), 
	url("../fonts/fontawesome-webfont.woff2") format("woff2"), 
	url("../fonts/fontawesome-webfont.woff") format("woff"), 
	url("../fonts/fontawesome-webfont.ttf") format("truetype"), 
	url("../fonts/fontawesome-webfont.svg#fontawesome") format("svg"); }

	
/*	1. HTML and Body Styles
****************************************************************************/
body {
	background-color: #dcdcdc;
	background-repeat: no-repeat;
	background-position: bottom center;
	background-size: cover;
	color: #fff;
	font-family: 'Gotham Book Regular';
	font-size: 12px;
	line-height: 16px;
	overflow-x: hidden;
}
.mobile  { 
	display: none; /* hiding mobile version */
}

/*	2. Heading Styles
***************************************************************************/

h1, h2, h3, h4, h5, h6 {
	font-weight: bold;
	margin-top: 0;
	margin-bottom: 23px;
	text-align: center;
	text-transform: uppercase;
}
h1 {
	font-size: 12px;	
}
h2 {
	font-size: 10px;
}
/*h3 {
	font-size: 24px;
	line-height: 35px;
}
h4 {
	font-size: 20px;
	line-height: 30px;
}
h5 {
	font-size: 18px;
}
h6 {
	font-size: 16px;
}*/

/*	3. Anchor Styles
***************************************************************************/
a:link,  a {
	color: #fff;
	text-decoration: none;
	transition: 0.3s ease-in-out;
}
a:visited {
	color: #fff;
	text-decoration: none;
}
a:hover {
	color: #fff;
	text-decoration: underline;
	transition: 0.3s ease-in-out;
}
a:active {
	color: #fff;
	text-decoration: none;
}
a:focus {
	outline: none;
}
*:focus,  textarea:focus,  input:focus {
	outline: none;
}

/*	4. Generic Styles
***************************************************************************/
.no-gutter {
	padding-left: 0;
	padding-right: 0;
}
.no-gutter-left {
	padding-left: 0;
}
.no-gutter-right {
	padding-right: 0;
}
p {
	margin-bottom: 24px;
}
ul {
	padding-left: 0;
}
ul li {
	list-style-image: url("../images/arrow.png");
	list-style-position: outside;
}
ol li {
}
figure {
	background:transparent;
}
input,  select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
select option {
    background-color: #eeeeee;
    color: #000;
}
.hide {
	display: none;
}

/*	5. Menu Icon styles
***************************************************************************/
.header  { 
	display: none;
	box-shadow: 0px 0px 25px 70px rgba(0, 0, 0, 0.50);
}
.menu-icon {
	font-size:16px;
	position: absolute;
	right: 30px;
	top: 17px;
	z-index: 1;
}
.menu-icon p a {
	color:#fff;
}
.menu-icon .fa {
	font-size: 20px;
	margin-left: 10px;
}

/*	6. Left Panel (Sidebar) styles
***************************************************************************/
.sidebar,
.mobile-sidebar {
	background-color: #eeeeee;
	color: #575756;
	font-size: 12px;
	line-height: 30px;
	padding-top: 30px;
	width: 100%;
	min-height: 100%;
	height: 100%;
}
.sidebar a,
.mobile-sidebar a {
	color: #575756;
}
.sidebar a:hover,
.mobile-sidebar a:hover {
	color: #000;
}
.mobile-sidebar .logo,
.logo {
	margin: 0 auto 20px auto;
}
.mobile-sidebar .logo img,
.logo img {
	height: auto;
	width: 150px
}
.logo-home {
	position: absolute;
	left: 5px;
	top: 30px;
	text-align: center;
	width: 100%;
	height: auto;
	z-index: 1;
}
.logo-home img {
	height: auto;
	width: 150px
}
.mobile-sidebar .calender,
.calender {
	color: #282828;
	display: none;
	font-size: 25px;
	float: right;
	margin-top: -6px;
}
.fa-calendar-minus-o,
.calender a {
	color: #282828;
}

/*	7. Main Menu styles
***************************************************************************/
.primary-menu {
	margin-bottom: 243px;
}
.sidebar ul li,
.mobile-sidebar ul li {
	list-style: none;
	text-transform: uppercase;
}

/*	8. Social Icons styles
***************************************************************************/
.social-icons {
	margin-bottom:8px;
	padding-left: 10px;
}
.social-icons .fa {
	font-size: 14px;
	margin-right: 8px;
}
.social-icons a:hover {
	text-decoration: none;
}
	

/*	9. Secondary Menu styles
***************************************************************************/
.secondary-menu {
	margin-bottom: 15px;
}

/*	10. Subscribe styles
***************************************************************************/
.subscribe span,
.footer .subscribe span {
	font-size: 11px;
	font-weight: bold;
	text-transform: none;
}
.subscribe .es_textbox,
.footer .subscribe .es_textbox {
	padding-bottom: 5px;
}
.subscribe  input.es_textbox_class,
.footer .subscribe  input.es_textbox_class {
	border: 1px solid #575656;
	color: #575756;
	font-size: 9px;
	line-height: 5px;
	padding: 2px;
	width: 140px;
	height: 20px;
}
.subscribe .es_button,
.footer .subscribe .es_button {
	padding-top: 0px;
}
.subscribe .es_submit_button,
.footer .subscribe .es_submit_button {
	background-color: #575656;
	border: 0;
	color: #fff;
	width: 140px;
}
.footer .subscribe .es_submit_button {
	font-size: 15px;
	padding: 5px 0;
	text-transform: uppercase;
}
.es_msg,
.footer .es_msg {
	color: #575756;
}
#es_txt_name {
    display: none;
}
#es_msg {
    line-height: 16px;
    font-size: 10px;
    width: 76%;
    display: block;
    margin: 0 auto;
}
.footer a {
	color: #575756;
}
.es_lablebox,
#es_txt_name_pg {
	display: none;
}
.credit {
	/*text-align: right;
	padding: 0 30px;*/
	line-height: 12px;
	margin-top: -15px;
}
.credit a {
	color: #575756;
	font-size: 9px;
}

/* mobile footer */
footer {
	background-color: #eeeeee;
	color: #575756;
	display: none;
	line-height: 30px;
	padding-top: 20px;
}
footer a {
	color: #575756 !important;
	font-size: 11px;
}
footer .footer-menu ul {
	margin-top: -15px;
}

/*	11. Footer Menu styles
***************************************************************************/
.footer-menu ul {
	text-align: center;
	width: 100%;
}
.footer-menu ul li {
	font-size: 9px;
	display: inline-block;
	text-transform: none;
	margin-right: 10px;
	margin-top: 10px;
}
#menu-footer-menu li:first-child a {
	text-decoration: none;
}
#menu-footer-menu li:first-child a:hover {
	color: #575756;
}

/*	12. Common Inner Pages Styles
***************************************************************************/
.content {
	padding: 110px 20px 10px;
	position: relative;
	left: -400px;
	width: 400px;
	min-height: 100%;
	height: 100vh;
	z-index: -1;
}
.content img {
	margin-bottom: 5px;
}

/*	13. About Page styles
***************************************************************************/
.about-content p:last-of-type {
	margin-bottom: 65px;
}

/*	14. Menu Page styles
***************************************************************************/
.menus-page .content {
	background-color: rgba(29, 29, 27, 0.6);
	padding: 110px 20px 10px;
	width: 200px;
}
.menus-page h2 {
	font-size: 12px;
	font-weight: normal;
	margin-bottom: 15px;
}
.menus-page a {
	color: #fff;
}

/*	15. Reservations Page styles
***************************************************************************/
.reservations-page h1 {
	margin-bottom: 10px;
}
.reservations-page .content {
	background-color: rgba(29, 29, 27, 0.6);
	padding: 40px 20px 10px !important;
	width: 400px;
}
.contact-page .date-picker,
.contact-page .persons,
.contact-page .time,
.contact-page .find-table-btn,

.reservations-page .date-picker,
.reservations-page .persons,
.reservations-page .time,
.reservations-page .find-table-btn {
	background-color: transparent;
	border: 1px solid #fff;
	border-radius: 0;
	color: #fff;
	margin-bottom: 6px;
	text-align: center;
	width: 142px;
	height: 30px;
}
.contact-page .find-table-btn,
.reservations-page .find-table-btn {
	background-color: #fff;
	color: #575656;
	margin-bottom: 37px;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
	
	.contact-page .persons,
	.reservations-page .persons {
		padding-left: 47px;
	}
	
	.reservations-page .time,
	.contact-page .time {
		padding-left: 54px;
	}
	
	.contact-page ::-webkit-input-placeholder
	.reservations-page ::-webkit-input-placeholder {
		text-indent: 153px;
	 }
	 
	 ::i-block-chrome, .contact-page select
	 ::i-block-chrome, .reservations-page select {
		padding-left: 0 !important;
		text-indent: 33%;
	}
	
	.contact-page .find-table-btn,
	.reservations-page .find-table-btn {
		margin-left: -3px;
	}
	
}

::-webkit-input-placeholder { color: white; }  /* WebKit, Blink, Edge */
:-moz-placeholder { color: white; opacity: 1; }  /* Mozilla Firefox 4 to 18 */
::-moz-placeholder { color: white; opacity: 1; }  /* Mozilla Firefox 19+ */
:-ms-input-placeholder { color: white; }  /* Internet Explorer 10-11 */
::-ms-input-placeholder { color: white; }  /* Microsoft Edge */

/*	16. Private Dining Page styles
***************************************************************************/
#private-dining {
	margin: 0 auto;
	width: 185px;
}
.private-dining-page span.title {
	display: inline-block;
	font-size: 11px;
	margin-bottom: 8px;
}
#private-dining input {
	background-color: transparent;
	border: 1px solid #fff;
	color: #9d9d9c !important;
	margin-bottom: 5px;
	padding-left: 5px;
	width: 182px;
	height: 32px;
}
#private-dining textarea {
	background-color: transparent;
	border: 1px solid #fff;
	color: #9d9d9c !important;
	padding-top: 8px;
	padding-left: 5px;
	min-width: 182px;
	max-width: 182px;
	max-height: 120px;
}
#private-dining #datepicker {
	float: left;
	margin-left: 2px;
	width: 48% !important;
}
#private-dining #your_time {
	float: right;
	margin-right: 1px;
	width: 48% !important;
}
#private-dining button {
	background-color: #fff;
	border: 1px solid #fff;
	color: #575656;
	margin-top: 4px;
	width: 182px;
	height: 30px;
}

#private-dining input::-webkit-input-placeholder { color: #9d9d9c !important; }  /* WebKit, Blink, Edge */
#private-dining input:-moz-placeholder { color: #9d9d9c !important;; opacity: 1; }  /* Mozilla Firefox 4 to 18 */
#private-dining input::-moz-placeholder { color: #9d9d9c !important;; opacity: 1; }  /* Mozilla Firefox 19+ */
#private-dining input:-ms-input-placeholder { color: #9d9d9c !important;; }  /* Internet Explorer 10-11 */
#private-dining input::-ms-input-placeholder { color: #9d9d9c !important;; }  /* Microsoft Edge */

#private-dining textarea::-webkit-input-placeholder { color: #9d9d9c !important; }  /* WebKit, Blink, Edge */
#private-dining textarea:-moz-placeholder { color: #9d9d9c !important;; opacity: 1; }  /* Mozilla Firefox 4 to 18 */
#private-dining textarea::-moz-placeholder { color: #9d9d9c !important;; opacity: 1; }  /* Mozilla Firefox 19+ */
#private-dining textarea:-ms-input-placeholder { color: #9d9d9c !important;; }  /* Internet Explorer 10-11 */
#private-dining textarea::-ms-input-placeholder { color: #9d9d9c !important;; }  /* Microsoft Edge */

.private-dining-page #feedback {
	font-size: 11px;
	margin-top:10px
}

/*	17. News Page styles
***************************************************************************/
.news-page {
	padding: 40px 10px 30px 35px;
	min-height: 100vh;
	height: 100%;
	max-width: 786px;
}
.news-page h1 {
	color: #535353;
	margin-bottom: 35px;
	text-align: left;
}
.news-posts {
	-webkit-column-count: 2;
	-moz-column-count: 2;
	column-count: 2;
	height: auto;
}
.news-posts .news-post {
	display: inline-block;
	width: 100%;
}
.news-post {
	margin-bottom: 35px;
}
.post-image-thumb {
	background-color: #313131;
	margin-bottom: 8px;
	width: 325px;
	min-height: 200px;
	height: auto;
}
.post-image-thumb img {
	width: 100%;
	height: auto;
}
.post-info {
	background-color: #fff;
	padding: 12px 25px;
	text-align: left;
	width: 325px;
	height: auto;
}
.post-info span,
.post-info a {
	color: #000;
	font-size: 8px;
	text-transform: uppercase;
}
.post-info h2 {
	font-size: 10px;
	color: #535353;
	line-height: 14px;
	margin-bottom: 11px;
	text-align: left;
	text-transform: uppercase;
}
.news-single {
	color: #535353;
}
.news-single .heading {
	font-weight: bold;
	margin-bottom: 30px;
}
.news-single .date {
	margin-bottom: 0;
}
.news-single h1 {
	font-size: 16px;
	font-weight: normal;
	line-height: 20px;
	margin-bottom: 32px;
	text-align: left !important;
}
.news-single .share {
	margin-bottom: 10px;
}
.news-single .share a {
	color: #1d1d1b;
	font-size: 11px;
	text-decoration: underline;
}
.news-single .post-single-img {
	margin-bottom: 35px;
	max-width: 760px;
	height: auto;
}
.news-single .post-single-img img {
	width: 100%;
	height: auto;
}
.content-single-post {
	line-height: 20px;
	-webkit-column-count: 2;
		-moz-column-count: 2;
		column-count: 2;
}
.post-content {
	border: 1px solid #ccc;
	color: #535353;
	display: none;
	font-size: 11px;
	margin: 15px 0;
	padding: 10px 10px 0 10px;
}
.post-content p:last-child {
	margin-bottom: 12px;
}

/*	18. Team Page styles
***************************************************************************/
.team-page {
	color: #666666;
	padding-top: 50px;
}
.profile-wrap {
	border-right: 1px solid #7d7d7d;
	float: left;
}
.profile {
	border: 1px solid #dcdcdc;
	float: left;
	margin-left: 5%;
	margin-bottom: 20px;
	min-height: 418px;
	width: 26.5%;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
	.profile {
		width: 26%;
	}
}
.profile-pic {
	background-color: #313131;
	margin-bottom: 4px;
	width: 100%;
	height: auto;
}
.profile-pic img {
	width: 100%;
	height: auto;
}
.name-position {
	background-color: #a0a0a0;
	color: #fff;
	font-size: 10px;
	padding: 11px 8px;
	text-transform: uppercase;
	width: 100%;
	height: 50px;
}
.name-position strong {
	font-size: 11px;
}
.introduction {
	font-size: 9.5px;
	padding: 12px 0;
	width: 100%;
}

/*** vacancy section styles ***/
.vacancy {
	color: #666666;
	font-size: 9.5px;
	padding-top: 50px;
	min-height: 100%;
	height: 100vh;
}
.vacancy h1,
.vacancy h2 {
	text-align: left;
	font-size: 12px;
	font-weight: normal;
	margin-bottom: 24px;
}
.vacancy h2 {
	margin-bottom: 20px;
}
.vacancy ul.positions li {
	list-style: none;
}
ul.positions li:first-child {
	color: #313131;
	font-weight: bold;
	font-size: 10px;
}
.vacancy ul.positions li a {
	color: #666666;
}
.vacancy  #job-apply {
	margin-top: -10px;
}
.vacancy input,
.vacancy select {
	background-color: transparent;
	border: 1px solid #575656;
	color: #a1a1a0;
	margin-bottom: 5px;
	padding-left: 5px;
	width: 182px;
	height: 26px;
} 
.vacancy select {
	background:url("http://www.bernerstavern.com/wp-content/themes/bernerstavern/images/down-arrow.jpg") no-repeat 94% 50%;
}
.vacancy textarea {
	background-color: transparent;
	border: 1px solid #575656;
	color: #a1a1a0;
	padding-top: 8px;
	padding-left: 5px;
	min-width: 182px;
	max-width: 182px;
	max-height: 120px;
}
.vacancy .job-vacancy-btn {
	background-color: #575656;
	border: 0px;
	color: #fff;
	margin-top: 4px;
	text-transform: uppercase;
	width: 182px;
	height: 30px;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) { }

.vacancy input::-webkit-input-placeholder,
.vacancy select::-webkit-input-placeholder,
.vacancy textarea::-webkit-input-placeholder { 
	color: #a1a1a0 !important; /* WebKit, Blink, Edge */
}
.vacancy input:-moz-placeholder,
.vacancy select:-moz-placeholder,
.vacancy textarea:-moz-placeholder { 
	color: #a1a1a0 !important; 
	opacity: 1; /* Mozilla Firefox 4 to 18 */
}
.vacancy input::-moz-placeholder,
.vacancy select::-moz-placeholder,
.vacancy textarea::-moz-placeholder { 
	color: #a1a1a0 !important;
	opacity: 1; /* Mozilla Firefox 19+ */
}
.vacancy input:-ms-input-placeholder,
.vacancy select:-ms-input-placeholder,
.vacancy textarea:-ms-input-placeholder { 
	color: #a1a1a0 !important;;  /* Internet Explorer 10-11 */
}
.vacancy input::-ms-input-placeholder,
.vacancy select::-ms-input-placeholder,
.vacancy textarea::-ms-input-placeholder { 
	color: #a1a1a0 !important; /* Microsoft Edge */
}

.vacancy #job_feedback {
	font-size: 11px;
	padding-top:10px
}

/*	19. Contact Page styles
***************************************************************************/
.fa-map-marker {
	font-size: 25px;
	margin-top: 5px;
}

/*	20. Coockies Pop-up styles
***************************************************************************/
#cookies {
	background-color: #333333;
	color: #ffff;
	display: none;
	font-size: 13px;
	padding-top: 6px;
	padding-bottom: 10px;
	height: auto;
}
#cookies p.text {
	line-height: 17px;
    margin: 0 auto;
    width: 60%;
}
#cookies p.close-btn {
    cursor: pointer;
    opacity: 1;
    font-size: 20px;
    padding: 14px 0 0 28px;
	margin: 0;
}

/* subscribtion pop-up */
.modal-backdrop {
	background-color: rgba(0,0,0,.0001) !important;
    opacity: 0 !important;
}
.modal {
	padding-right: 10px !important;
	padding-left: 10px !important;
}
.modal-dialog {
	margin: 200px auto;
	max-width: 450px;
}
.modal-content {
	background-color: transparent;
}
.modal-body {
	background-color: rgba(0, 0, 0, 0.8);
	padding: 0.5rem;
	text-align: center;
}
.modal-body .close {
	color: #fff;
	font-size: 25px;
	font-weight: 500;
	opacity: 1;
	text-align: right;
	width: 100%;
}
.modal-body p {
	font-size: 12px;
	line-height: 18px;
	padding: 0 40px 0;
	word-spacing: 1px;
}
.modal-body .es_shortcode_form {
    margin-top: -10px;
}
.modal-body .es_textbox_class {
    border: 1px solid #ececec;
    color: #ececec;
    background-color: #00d0;
    font-size: 11px;
    padding: 1px 5px;
	width: 173px;
}
.modal-body .es_textbox_button {
    width: 175px;
    background-color: #ececec;
    border: 0px;
    padding: 10px;
}
.modal-body .es_button {
    padding-top: 0;
}

/* Legal notice on mobile */
div#legal table td {
	border: 1px solid #fff;
	padding: 5px;
}

