@charset "UTF-8";
/* CSS Document */
/* Devonshire */
/* Jan 25 */

	

		
div {
  outline: 0px solid red;
}

html {
  scroll-behavior: smooth;
}
	
body 					{padding: 0px; margin: 0px;background: #fff7d7; color: #34533b;}	
	
.mustard				{background: #d4922a;}
.yellow					{background: #f4d96c;}
.red					{background: #941215; color: #f4d96c;}
.green					{background: #34533b; color: #f4d96c;}
.dgreen					{background: #133621; color: #f4d96c;}
.deepgrey				{background: #34533b; color: #fff;}	

.img					{width: 100%}	
.img_rr					{width: 100%;margin-bottom: -10px;}	
.img_bg 				{width: 100%;height: 100%;object-fit: cover; /*magic*/}	

/* ---------- Lead ---------- */	
	
.lead					{position: relative;top:0px:left:0px;right:0px;height: 100vh;}
	
#bar 					{position:absolute;top:0px;left:0px; width: 50%; height: 100%;}
#restaurant 			{position:absolute;top:0px;left:50%;width: 50%;height: 100%;}	
#cta 					{position: absolute; top: 50%; width: 100%; text-align: center;}
#leadcta 				{width: 250px; margin: auto; background: #34533b;color: #f4d96c;
  padding: 10px 0px 8px 0px;
  text-align: center;text-decoration: none;
  width: 250px;display: inline-block;
  border: #f4d96c 1px solid;	
  font-family: avenir-med; font-size: 16px; text-transform: uppercase; letter-spacing: 3px; margin: font-style: normal;}	
#bar:hover #leadcta 	{background: #f4d96c; color: #34533b;border: #f4d96c 1px solid;}
#restaurant:hover #leadcta {background: #f4d96c; color: #34533b;border: #f4d96c 1px solid;}	
		
.address				{position: absolute; bottom: 60px; width: 100%; text-align: center; z-index: 7}
	
/* ---------- Core ---------- */	
	
.grad_top				{position: fixed; top:0px; left: 0px; right:0px; z-index:50;opacity: 0.4}
.grad					{width:100%;height: 110px;}
		
.core					{width: 100vw; padding-bottom: 100px;}	
.inner					{padding-top: 170px; max-width:1000px; margin: auto}		
.body					{padding:0px 25px 40px 25px; max-width:750px; margin: auto}
.devonshire_menus		{padding: 170px 0 120px 0 ; width: 100%; max-width:600px; margin: auto;}	
.devonshire_faq		{padding: 135px 0px 135px 0px; width: 100%; max-width:640px; margin: auto;}	
.faq_inner				{padding: 0px 20px 0px 20px;}	

.devonshire_hours		{padding-top: 170px; width: 100%; max-width:300px; margin: auto; padding-left: 0px;}
.restaurantgiftvouchers	{background: #f4d96c; padding: 150px 0 0 0;}
.devonshire_hire		{width: 100vw; padding: 0px 0px 100px 0px;}	
.devonshire_careers		{width: 100vw; padding: 0px 0px 170px 0px;}	

.table_hours			{width="100%" border="0" cellspacing="0" cellpadding="0" padding-left: -5px;}
.table_hours_kitchen	{width="100%" border="0" cellspacing="0" cellpadding="0" margin-left: 5px;}
.footer					{padding-top: 20px; width: 100%; max-width:1000px; padding-bottom: 75px; margin: auto;}	
.hours_title			{padding-left: -10px;}
.kitchen-hours-group	{margin-bottom: 15px;}
.kitchen-hours-group:last-child {margin-bottom: 0;}

.a_c					{text-align: center;}
.a_l					{text-align: left;}
.a_r					{text-align: right;}	
		
.book_online			{position: fixed; bottom: 0px; width: 100%; z-index: 99; text-align: center}

div:focus, section:focus, textarea:focus, input:focus{outline: none;}	
	
/* ---------- Desk ---------- */	
	
@media (min-width: 651px) {
.logo					{position: absolute; top: 85px; left: 125px;right: 125px; z-index: 99;text-align: center;}
.menu					{position: fixed; top: 40px;left:40px; z-index: 97;text-align: left;}
.hours					{position: fixed; top: 40px; left: 125px;right: 125px; z-index: 99;text-align: center;}
.faq					{position: fixed; top: 40px;right:40px; z-index: 97;text-align: right;}
.logotype				{max-width: 300px;}			
.flex-container 		{display: flex;flex-direction: row;text-align: center;}
.dv              		{display:block; visibility:visible;}
.mv             		{display:none; visibility:hidden;}	
.guinness				{max-width: 500px; width: 100%; margin: auto;}

.border					{border-top: #34533b solid 15px;border-left: #34533b solid 15px;border-right: #34533b solid 15px;border-bottom: #34533b solid 18px}
	
.landing				{position: absolute; left: 49.5%; right: 49.5%; height: 100vh; background: #34533b; margin: auto; z-index: 7;}
	
/* ----- Primary nav ----- */	
	
a.nav:link, a.nav:visited {
  color: #fff;
  font-family: avenir-med; font-size: 16px; text-transform: uppercase; letter-spacing: 3px; margin: font-style: normal;text-decoration: none;}

a.nav:hover, a.nav:active {
  color: #f4d96c; border-bottom: 2px solid #f4d96c; padding-bottom: 5px;text-decoration: none;
}	

/* ----- Book button ----- */	
	
a.book:link, a.book:visited {
  background: #941215;color: #fff;
  padding: 10px 0px 8px 0px;
  text-align: center;text-decoration: none;
  width: 252px;display: inline-block;
  font-family: avenir-med; font-size: 16px; text-transform: uppercase; letter-spacing: 3px; margin: font-style: normal;}

a.book:hover, a.book:active {
  background: #f4d96c; color: #34533b;
}		
	
}

.column4 				{padding: 10px 20px;flex: 25%;}	
.flex-wrap				{display: flex;flex-wrap: wrap;}
.flex-wrap > div 		{width: 50%;text-align: left;}


/* ---------- Mobile ---------- */	
	
@media (max-width: 650px) {
.logo					{position: absolute; top: 65px; left: 75px;right: 75px; z-index: 99;text-align: center;}		
.logotype				{max-width: 180px;}		
.menu					{position: fixed; top: 23px;left:18px; z-index: 97;text-align: left;}
.hours					{position: fixed; top: 25px; left: 75px;right: 75px; z-index: 99;text-align: center;}
.faq					{position: fixed; top: 23px;right:18px; z-index: 97;text-align: right;}
.flex-container	 		{flex-direction: column;}
.dv             		{display:none; visibility:hidden;}		
.mv              		{display:block; visibility:visible;}
.guinness				{width: 100%; margin: auto;}

.border					{border-top: #34533b solid 9px;border-left: #34533b solid 9px;border-right: #34533b solid 9px;border-bottom: #34533b solid 12px;}

.landing				{position: absolute; top: 49.5%; bottom: 49.5%; height:9px; width: 100%; background: #34533b; z-index: 8;}
	
#bar 					{position:absolute;top:0px;left:0px; width: 100%; height: 50%;}
#restaurant 			{position:absolute;top:50%;left:0px;width: 100%;height: 50%;}		
#cta 					{position: absolute; top: 48%; width: 100%; text-align: center;}
.core					{width: 100vw; padding-bottom: 10px;}	
	
.devonshire_menus		{padding: 120px 0 170px 0; width: 100%; max-width:600px; margin: auto;}	
.devonshire_hours		{padding-top: 120px; width: 100%; max-width:300px; margin: auto; padding-left: 10px;}
.restaurantgiftvouchers	{background: #f4d96c; padding: 150px 0 100px 0;}	
.devonshire_hire		{width: 100vw; padding: 60px 0px 170px 0px;}	
.devonshire_careers		{padding-top: 120px;width: 100vw;}	
		
	
/* ----- Book button ----- */	
	
a.book:link, a.book:visited {
  background: #941215;color: #fff;
  padding: 10px 0px 8px 0px;
  text-align: center;text-decoration: none;
  width: 252px;display: inline-block;
  font-family: avenir-med; font-size: 16px; text-transform: uppercase; letter-spacing: 3px; margin: font-style: normal;}

a.book:hover, a.book:active {
  background: #f4d96c; color: #34533b;
}	
	
/* ----- Primary nav ----- */	
	
a.nav:link, a.nav:visited {
  color: #fff;
  font-family: avenir-med; font-size: 12px; text-transform: uppercase; letter-spacing: 3px; margin: font-style: normal;}

a.nav:hover, a.nav:active {
  color: #f4d96c; border-bottom: 2px solid #f4d96c; padding-bottom: 5px;
}	
	
}

/* ---------- Subscribe form ---------- */	

.stag 				{width: 60px; margin: auto; padding-bottom: 25px}	
	
#subscribe			{padding:75px 25px; max-width: 500px; margin: auto}	
	
#mce-EMAIL				{width: 100%;font-family:"Times New Roman", "serif"; font-size: 21px; font-weight: 400; font-style: italic;padding:10px 0px; margin-bottom: 18px; line-height: 30px; border-bottom: 1px solid #000; border-top: none;border-left: none;border-right: none; background: none; text-align: center;}

/* Button Styling  */

.button	{background: none;color: inherit; border: #34533b 1px solid;
  padding: 8px 0px;
  text-align: center;text-decoration: none;
  width: 250px;display: inline-block; margin: auto; clear: both;
  font-family:"Times New Roman", "serif"; font-size: 21px; font-weight: 400; font-style: italic;}

.button:hover {background: #f4d96c; color: #34533b;border: #34533b 1px solid;
} 

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #34533b;
  opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #34533b;
}

::-ms-input-placeholder { /* Microsoft Edge */
  color: #34533b;
}

div:focus, textarea:focus, input:focus{outline: none;}







/* ---------- Fonts + Links ---------- */	
	
h1						{font-family: avenir-med; font-size: 18px; text-transform: uppercase; letter-spacing: 3px; margin: auto; width: 248px;font-style: normal; padding-bottom: 25px;}		
h2						{font-family:"Times New Roman", "serif"; font-size: 21px; font-weight: 400; font-style: italic;padding:20px 0px;}		
h3						{font-family:"Times New Roman", "serif"; font-size: 17px; font-weight: 400; font-style: normal;padding:20px 0px;}		
	
	

.san					{font-family: avenir-med; font-size: 18px; text-transform: uppercase; letter-spacing: 3px; margin: font-style: normal;}		
	
.ser					{font-family:"Times New Roman", "serif"; font-size: 21px; font-weight: 400; font-style: italic;}		
		


a:link, a:visited {
  background: #none;color: inherit;
  text-decoration: none;
  display: inline-block;
}

a:hover, a:active {
  color: #941215; text-decoration: underline;
}	

	
	
/* ----- Address (lead) ----- */	
	
a.denmanst:link, a.denmanst:visited {
  color: #fff;
  font-family:"Times New Roman", "serif"; font-size: 21px; font-weight: 400; font-style: italic;}

a.denmanst:hover, a.denmanst:active {
  color: #f4d96c;
}	
			
	
/* ----- Modal link ----- */	
	
a.modal_li:link, a.modal_li:visited {
  color: #f4d96c;}

a.modal_li:hover, a.modal_li:active {
  color: #fff;
}	
	


/* ----- Menus ----- */	
	
.menus {margin-bottom: 20px;}	
a.menus:link, a.menus:visited {
  background: none;color: inherit; border: #34533b 1px solid;
  padding: 8px 0px;
  text-align: center;text-decoration: none;
  width: 250px;display: inline-block; margin: auto; clear: both;
  font-family:"Times New Roman", "serif"; font-size: 21px; font-weight: 400; font-style: italic;
}

a.menus:hover, a.menus:active {
background: #f4d96c; color: #34533b;border: #34533b 1px solid;
}


.vouchers {margin-bottom: 20px;}	
a.vouchers:link, a.vouchers:visited {
  background: none;color: inherit; border: #34533b 1px solid;
  padding: 8px 0px;
  text-align: center;text-decoration: none;
  width: 250px;display: inline-block; margin: auto; clear: both;
  font-family:"Times New Roman", "serif"; font-size: 21px; font-weight: 400; font-style: italic;
}

a.vouchers:hover, a.vouchers:active {
background: #34533b; color: #f4d96c;border: #34533b 1px solid;
}



	
/* ----- Footer links ----- */	
	
.li {font-family: avenir-med; font-size: 11px; line-height: 17px; text-transform: uppercase; letter-spacing: 2px; font-style: normal;}	
a.li:link, a.li:visited {
  background: #none;color: inherit;
  text-decoration: none;
  display: inline-block;	
}

a.li:hover, a.li:active {
  color: #941215; text-decoration: underline;
}	


/* ----- Booking ----- */	

.dmnbooking {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 98;
  top: 0;
  left: 0;
  background-color: #34533b;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 60px;
  text-align:center;opacity: 0.96;
}

.dmnbooking a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 25px;
  color: #fff;
  display: block;
  transition: 0.3s;

}

.dmnbooking a:hover{
  color: #f4d96c;
}

@media (min-width: 651px) {
.dmnbooking .closebtn {
  position: absolute;
  top: 20px;;
  right: 35px;
  font-size: 36px;
  margin-left: 50px;
}
.widget_container	{width: 250px; text-align: center; padding-top: 100px;margin:auto;}
}

@media (max-width: 650px) {
.dmnbooking .closebtn {
  position: absolute;
  top: 4px;
  right: 15px;
  font-size: 36px;
  margin-left: 50px;
}
.widget_container	{width: 250px; text-align: center; padding-top: 28px;margin:auto;}

}
	
@media screen and (max-height: 450px) {
  .dmnbooking {padding-top: 15px;}
  .dmnbooking a {font-size: 18px;}
}

#reveal				{width: 100vw; height: 100vh; position: fixed; top:0px; left: 0px; background: #34533b; z-index:10}



/* ----- Modal ----- */	

.container		{position: fixed;top:0px; left: 0px;right: 0px;bottom: 0px;text-align: center; background: rgba(0, 0, 0, 0.6);z-index: 8;}	
.centre			{display: flex;justify-content: center;align-items: center; position: absolute;top:0px; left: 0px;right: 0px;bottom: 0px;}
button			{background: none; border: 0;color: #fff;font-size: 35px;text-decoration: none;padding: 0px; margin: 0px;}
button:hover	{color: #f4d96c; border-bottom: 2px solid #f4d96c}
.modal			{width:400px;height:350px;background: #34533b; color: #f4d96c; border: 1px solid #f4d96c;position: relative;}
.closebutton	{position: absolute; top:0px;right:12px; padding: 3px 0px; text-align: right; padding: 0px; margin: 0px;}
.modal_message	{padding-top: 15%}
.modal_body		{line-height: 17px; font-family: avenir-med; font-size: 11px; text-transform: uppercase; letter-spacing: 2px; margin: auto; font-style: normal;margin-top:-18px;padding: 0 20px;}