/* CSS Document */
/* reset */
html, body, div, img, table, tr, td, span, h1, h2, h3, h4, p, a, figure, aside, header, footer, nav {
  margin: 0;
  padding: 0;
}
html {}
body {
  height:calc(100% - 120px);
  padding-top:120px;
  color: #262626;
}
* {
  outline: none;
}

a {
	border: none;
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
	text-decoration: none;
	cursor: pointer;
}

img {
  display: block;
  border: none;
  max-width: 100%;
}

.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px; /* Preferred icon size */
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;
  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;
  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;
  /* Support for IE. */
  font-feature-settings: 'liga';
}

h1 {
 font-family: gillsans-regular;
 font-size:2em;
 margin-bottom: 2em; 
 text-transform: uppercase;
 letter-spacing: .15em;
}

h2 {
  font-family: gillsans-regular;
  text-transform: uppercase;
  margin-bottom:1em;
  letter-spacing: .15em;

}

h3 {
    font-family: gillsans-semibold;
    text-transform: capitalize;
    margin-bottom: 1.5em;
    font-size: 0.9em;
    text-transform: uppercase;
    letter-spacing: .065em;
}

p {
  font-family: helvetica-neue;
  margin-bottom:1em;
  font-size:0.85em;
  line-height: 1.85em;
}

span.p {
	font-family: gillsans-regular;
  font-size:0.9em;
  line-height: 1.5em;
	 font-size: 0.85em;
}

/* main nav */

nav.main-nav ul {
  margin:0px auto;
  position:relative;
  float:left;
}

nav.main-nav ul li {
  display:inline;
  margin:0;
  padding:0;
  float:left;
  position:relative;
  margin-left:0;
}

nav.main-nav ul > li > a {
  padding:10px;
  text-transform: uppercase;
  color:#262626;
  font-family: gillsans-regular;
  font-size: 0.75em;
  letter-spacing: 0.05em;
  text-decoration:none;
  display:inline-block;
  -webkit-transition:color 0.2s linear, background 0.2s linear;
  -moz-transition:color 0.2s linear, background 0.2s linear;
  -o-transition:color 0.2s linear, background 0.2s linear;
  transition:color 0.2s linear, background 0.2s linear;
  position: relative;
}

nav.main-nav ul li a:first-child:nth-last-child(2) {
  padding-right:1.5em;
  margin-right:1em;
}

nav.main-nav ul li a:first-child:nth-last-child(2):after {
  font-family: 'Material Icons';
  content: '\e313';
  position: absolute;
  right: 0;
  font-size: 1.2em;
  display: block;
  top: 0.7em;
}

nav.main-nav ul li a:hover {
  color:#D4225D;
}

/* Drop-Down Navigation */

nav.main-nav li:hover > ul {
  visibility:visible;
  opacity:1;
  padding-bottom: 1em;
}

nav.main-nav ul li ul {
  list-style: none;
  margin: 0;
  padding: 0;
  visibility:hidden;
  opacity:0;
  position: absolute;
  left:0;
  top: 2em;
  padding-top:1em;
  z-index: 99999;
  background:#fff;
  -webkit-transition:opacity 0.2s linear, visibility 0.2s linear;
  -moz-transition:opacity 0.2s linear, visibility 0.2s linear;
  -o-transition:opacity 0.2s linear, visibility 0.2s linear;
  transition:opacity 0.2s linear, visibility 0.2s linear;
}

nav.main-nav ul li ul li {
  margin: 0;
  padding:0;
  display: block;
}

nav.main-nav ul li ul li a {
  width:200px;
  border-bottom:1px solid #eee;
  padding:1em;
  margin:0 1em;
}

nav.main-nav ul li ul li:last-of-type  a{
  border-bottom:none;
}

/* breadcrumbs */

div.breadcrumb {
  width: 100%;
  height: auto;
  overflow: hidden;
  padding: 1.2em 0;
  background-color: #f9f9f9;
  position: fixed;
  top: 70px;
  font-size: .8em;
   font-family: gillsans-semibold;
}

ul.breadcrumbs {
  margin:0;
  padding:0;
}

ul.breadcrumbs li {
  display: inline;
  float: left;
  list-style: none;
  margin-left:1em;
  font-size: 1em;
  color: #262626;
  text-transform: capitalize;
}

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

ul.breadcrumbs li a {
  color: #262626;
  margin-right:1em;
}

/* structure */

header {
  width: calc(100% - 6em);
  height: 70px;
  position: fixed;
  top: 0;
  z-index: 10;
  background-color: #fff;
  padding: 0 3em;
  display: flex;
  align-items: center;
  justify-content: space-between;

  border-bottom: 1px solid #e5e5e5;
}

/* home page slideshow */
div.slider-wrapper {
  height: 70%;
  width: 100%;
  position: relative;
  top: -50px;
}
.slider {
  background-size: cover;
  background-position: center center;
}
.homepageSlider {
  width:100%;
  height: 100%;
  position: absolute;
  z-index: 1;
}
.homepageSlider.active {
  z-index: 3;
}
.homepageSlider img {
  max-width: 100%;
  min-height: 100%;
}
div.caption-mask {
  width: 100%;
  height: calc(100vh - 70px);
  position: relative;
  overflow: hidden;
}

div.filter {
 width:100%;
 height: 100%;
 background: rgba(0,0,0,0.5);
 display: flex;
 flex-direction: column;
 align-items: center;
 justify-content: center;
}

span.headline {
  font-family: gillsans-semibold;
  font-size: 4em;
  color: #fff;
  text-transform: uppercase;
  margin-bottom: 1em;
  width: 90%;
  max-width: 1200px;
  text-align: center;
}


div.slider-wrapper a.default-btn {
 width:300px;
}

div.slider-wrapper a.default-ghost-btn, 
div.slider-wrapper a.default-btn {
 width:340px;
 padding:1em 0;
 text-align: center;
}

div.slider-wrapper a.default-btn {
 margin-bottom: 1em;
}

div.content-wrapper {
  width: 90%;
  max-width: 1200px;
  margin: 0 auto;
}

div.content-wrapper-small {
  width: 90%;
  max-width: 800px;
  margin: 0 auto;
}

ul.default-list {
  margin:0;
  padding:0;
}

ul.default-list li {
font-family: helvetica-neue;
  margin-bottom:1em;
  font-size:0.9em;
  line-height: 1.5em;
  padding-left:1.5em;
  list-style: none;
  position: relative;
}

ul.default-list li::before {
content:'-';
position: absolute;
left:0;
color: #D4225D;
}

section {
  padding:4em 0;
}

div.card-wrapper {
	width:100%;
	height: auto;
	overflow: hidden;
  display: grid;
 grid-template-columns: repeat(3, 33.3% [col-start]);
}

div.card-wrapper-double {
  width:100%;
  height: auto;
  overflow: hidden;
  display: grid;
 grid-template-columns: repeat(2, 50% [col-start]);
}

a.card {
  width:98%;
	margin-right:2%;
	float: left;
  margin-bottom: 30px;
  color: #262626;
}

a.card:nth-of-type(3n) {
	margin-right:0;
}

a.card img {
  width:100%;
  height:500px;
  object-fit: cover;
  background-color: #f2f2f2;
}

a.card p {
  width:90%;
}

a.card h3 {
  margin-bottom: 0.5em;
}

.img-hover-zoom {
  height: 500px; /* [1.1] Set it as per your need */
  overflow: hidden; 
  margin-bottom: 1.5em;
}

.img-hover-zoom img {
  transition: transform 1s ease;
}

.img-hover-zoom:hover img {
  transform: scale(1.3);
}

a.twin-card {
  width:49%;
}

a.twin-card img {
  width:100%;
  height:400px;
  object-fit: cover;
  background-color: #f2f2f2;
  margin-bottom: 1em;
}


section.proposition {
  padding: 2em;
  width: 60%;
  margin: 0 auto;
}

section.proposition h1 {
  font-size: 1.5em;
  font-weight: normal;
  text-align: center;
  line-height: 1.4em;
  margin-bottom: 0;
  text-transform: capitalize;
  letter-spacing: 0;
}

section.home-styles {
  padding-top:-6em;
}

section.home-styles a.card,
section.home-styles a.card p,
section.home-ranges a.card,
section.home-ranges a.card p,
section.design-installation a.card,
section.design-installation a.card p  {
 margin-bottom:0;
}

section.home-ranges, 
section.inspiration-ideas, 
section.other-ranges {
  background-color: #f9f9f9;
}

section.inspiration-ideas {
  padding-top: 20em;
}

section.inspiration-ideas img {
  width:98%;
  height:300px;
  object-fit:cover;
  margin-bottom:0.5em;
}

section.design-installation a.card {
  width:99%;
	margin-right: 2%;
}

section.design-installation a.card:last-of-type {
	margin-right: 0;
}

section.design-installation a.card img {
 width:100%;
 height:300px;
 object-fit: cover;
 background-color: #f2f2f2;
 margin-bottom: 1.5em;
}

section.showroom {
  padding:0;
}

a.showroom {
  display:block;
  width:100%;
  height:300px;
  background-image: url(/img/showroom.png);
  background-size: cover;
  background-position: center center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
	text-align: center;
}

div.newsletter-bg {
  width: 100%;
  height: 400px;
  background-color: #f2f2f2;
  background-image: url(/img/newsletter.png);
  background-position: bottom;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

div.newsletter-wrap {
  width:80%;
  padding:3em 0;
  background-color: #fff;
  position: absolute;;
  bottom:-290px;
  left:10%;
  z-index: 9;
  text-align: center;
}

form.js-cm-form input[type="email"] {
  border:none;
  border-bottom: 1px solid #d8d8d8;
  padding:1em;
  width: 40%;
  margin:2em auto;
  text-align: center;
}

button.newsletter-submit {
  padding:1em;
  background-color: #EA1F75;
  color: #fff;
  border:none;
  cursor: pointer;
  font-size: 0.8em;
  letter-spacing: 0.2em;
  text-transform: uppercase;;
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
}

/*button::after {
  content:'\e5ca';
  }*/

  a.logo {
    width:143px;
    height: 50px;
    background-image: url(/img/logo.png);
    background-size: cover;
  }

/******************** HOME PAGE INSPIRATION ********************/


.row {
  display: flex;
  flex-wrap: wrap;
}

/* Create four equal columns that sits next to each other */
.column {
  max-width: 33%;
  padding: 0 4px;
}

.column img {
  margin-top: 8px;
  vertical-align: middle;
  width: 100%;
}


  /******************** PRODUCT PAGES ********************/

  div.product-filters {
    display: flex;
    flex-flow: row;
    justify-content: space-between;
    margin-bottom: 3em;
  }

  div.product-filters select {
   width:18%;
 }

a.showFilters {
		display: none;
	}

 span.price {
   font-family: helvetica-neue;
   display: block;
   padding: 1em 0;
   font-size:1.2em;
 }

 div.product-intro p {
  border-bottom:1px solid #e2e2e2;
  padding:0 0 2em 0;
  margin:2em 0;
}

h1.product-detail {
  margin-bottom: 0;
}

div.finish {
  width:100%;
  height: auto;
  overflow: hidden;
  margin-bottom: 3em;
}

div.finish-box {
  border:1px solid #e5e5e5;
  padding:1em;
  float: left;
  margin-right: 1em;
  font-family: gillsans-regular;
  text-transform: capitalize;
  margin-bottom:1em;
  font-size:.85em;
  text-transform: uppercase;
}

div.product-box:last-of-type {
  margin-right: 0;
}

div.product-details {
 width:100%;
	height: auto;
	overflow: hidden;
	 border-top:1px solid #e5e5e5;
	padding:3em 0;
}


div.product-details div.left-col
{
	width:48%;
  float:left;
}

div.product-details div.right-col
{
	width:calc(48% - 4em);
   float:right;
	background-color: #f5f5f5;
	padding:2em;
}




/******************** CUSTOM SELECT ********************/



.custom-select {
  position: relative;
  font-family: Arial;
  position: relative;
  width: 24%;
  font-family: gillsans-regular;
  color: #262626;
  font-size: 0.9em;
  text-transform: uppercase;
}

.custom-select select {
  display: none; /*hide original SELECT element: */
}

.select-selected {
  background-color: #fff;
}

/* Style the arrow inside the select element: */
.select-selected:after {
  position: absolute;
  content: "";
  top: 22px;
  right: 10px;
  width: 0;
  height: 0;
  border: 6px solid transparent;
  border-color: #262626 transparent transparent transparent;
}

/* Point the arrow upwards when the select box is open (active): */
.select-selected.select-arrow-active:after {
  border-color: transparent transparent #fff transparent;
  top: 7px;
}

/* style the items (options), including the selected item: */
.select-items div,.select-selected {
  padding: 16px;
  border: 1px solid transparent;
  border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
  cursor: pointer;
}

/* Style items (options): */
.select-items {
  position: absolute;
  background-color: #f9f9f9;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 99;
}

/* Hide the items when the select box is closed: */
.select-hide {
  display: none;
}

.select-items div:hover, .same-as-selected {
  background-color: rgba(0, 0, 0, 0.1);
}

/******************** COLOUR SWATCHES ********************/

div.swatches {
  display: flex;
  flex-flow: row wrap;
  margin-bottom: 2em;
  border-bottom:1px solid #e5e5e5;
  padding-bottom: 2em;
  margin-bottom: 2em;
}


a.swatch {
  width:30px;
  height: 30px;
  display: block;
  border-radius: 50px;
  margin-right:10px;
  margin-bottom:10px;
}

a.swatch-black {
 background-color: #000;
}

a.swatch-white {
 background-color: #fff;
 border:1px solid #CCC;
 box-sizing: border-box;
 -moz-box-sizing: border-box;
 -webkit-box-sizing: border-box;
}



a.swatch-light-grey {
 background-color: #E6E6DC;
}

a.swatch-mid-grey {
 background-color: #7b7b7b;
}

a.swatch-dark-grey {
 background-color: #707068;
}




a.swatch-light-blue {
 background-color: #C7D8DF;
}

a.swatch-mid-blue {
 background-color: #506C81;
}

a.swatch-dark-blue {
 background-color: #004054;
}




a.swatch-light-green {
 background-color: #8EABA7;
}

a.swatch-mid-green {
 background-color: #61797B;
}

a.swatch-dark-green {
 background-color: #203935;
}




a.swatch-light-wood {
 background-image: url(/img/light-wood.jpg);
}

a.swatch-mid-wood {
  background-image: url(/img/mid-wood.jpg);
}

a.swatch-dark-wood {
 background-image: url(/img/dark-wood.jpg);
}



a.swatch-light-cream {
 background-color: #FFFEF1;
}

a.swatch-mid-cream {
 background-color: #FDFBE2;
}

a.swatch-dark-cream {
 background-color: #EBECDE;
}



a.swatch-light-beige {
 background-color: #F9F2E0;
}

a.swatch-mid-beige {
 background-color: #DEDCCD;
}

a.swatch-dark-beige {
 background-color: #B1ADA4;
}




a.swatch-light-purple {
 background-color: #DDD5C8;
}

a.swatch-mid-purple {
 background-color: #9B98A9;
}

a.swatch-dark-purple {
 background-color: #401D3B;
}

div.paint-to-order {
  margin-bottom: 2em;
  border-bottom:1px solid #e5e5e5;
  padding-bottom: 2em;
  margin-bottom: 2em;
}


/******************** FINISH ********************/

div.finish {
 margin-bottom: 2em;
}

/******************** FOOTER ********************/

footer {
  padding: 3em 0;
  background-color: #111112;
	margin-top: 3em;
}

footer h3 {
  color:#fff;
  margin-bottom: 2em;
}

footer p {
  color:#fff;
}

div.footer-nav-wrap {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
}

nav.footer-nav {
}

nav.footer-nav ul {
  margin:0;
  padding: 0;
}

nav.footer-nav ul li {
  list-style: none;
  margin-bottom: 1em;
  padding-left:1.5em;
  list-style: none;
  position: relative;
}

nav.footer-nav li a {
  color: #ccc;
  font-size:.9em;
  text-transform: capitalize;
  font-family: helvetica-neue;
}

nav.footer-nav li a:hover {
  color: #fff;
  font-size:.9em;
  text-transform: capitalize;
  font-family: helvetica-neue;
}

nav.footer-nav li::before {
content:'-';
position: absolute;
left:0;
color: #D4225D;
}

footer hr {
    margin: 3em 0 1em 0;
    border: 1px solid #222;
}

/******************** SITEMAP ********************/

nav.sitemap ul {
  margin:0;
  padding: 0;
}

nav.sitemap ul li {
  list-style: none;
  margin-bottom: 1em;
  padding-left:1.5em;
  list-style: none;
  position: relative;
}

nav.sitemap li a {
  color: #444;
  font-size:.9em;
  text-transform: capitalize;
  font-family: helvetica-neue;
}

nav.sitemap li::before {
content:'-';
position: absolute;
left:0;
color: #D4225D;
}

/******************** PAGE CONTENT TEMPLATE ********************/

div.rte-text p {
	margin-bottom: 2.5em;
}
img.full-width-img {
  width:100%;
  height: 400px;
  object-fit:cover;
  margin-bottom:2.5em;
}

div.half-width-images {
  overflow:hidden;
  margin-bottom:2.5em;
}

img.half-width-img1 {
  width:49%;
  height: 340px;
  object-fit:cover;
  float: left;
}

img.half-width-img2 {
  width:49%;
  height: 340px;
  object-fit:cover;
  float: right;
}

div.triple-image-set {
  overflow:hidden;
  margin-bottom:2.5em;
}

img.image-set1 {
  width:100%;
  height: 400px;
  object-fit:cover;
  float: left;
  margin-bottom: 1em;
}

.image-set2 {
  width:49%;
  height: 340px;
  object-fit:cover;
  float: left;
  margin-right: 2%;
}

.image-set3 {
  width:49%;
  height: 340px;
  object-fit:cover;
  float: left;
}



/* contact form */
.contact-form {
  max-width: 500px;
}
.contact-form input[type="text"], 
.contact-form input[type="email"] {
  width: calc(100% - 1.5em);
  padding: 0.75em 0;
  border: 1px solid #666;
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
  margin-bottom: 1.5em;
  background-color: transparent;
  font-size: 1em;
}
.contact-form textarea {
  width: calc(100% - 2.2em);
  height: auto;
  background-color: transparent;
  border:0;
  font-size: 1em;
  margin-bottom: 1.5em;

}
.contact-form input[type="text"]:focus, 
.contact-form input[type="email"]:focus {
  border-bottom: 2px solid #262626;
}

input:-webkit-autofill {
  -webkit-box-shadow: inset 0 0 0px 9999px #F0EFEA;
}

.custom-submit {
	background-color:#D4225D;
  color:#fff;
  text-align:center;
  text-transform: uppercase;
  letter-spacing: .35em;
  padding:1em 2em;
}

.custom-submit:hover {
	background-color: #466054;
}

/******************** SIDENAV ********************/

/* sidenav */

.sidenav {
 width: 500px; 
 position: fixed;
 z-index: 10;
 top: 0;
 bottom: 0;
 right: -500px;
 background-color: #f2f2f2;
 padding-top: 120px;
 transition: 0.4s;
 overflow-y: scroll;
 padding-bottom: 60px;
}

/* Position and style the close button (top right corner) */
.sidenav .closebtn {
  position: absolute;
  top: 20px;
  right: 1em;
  font-size: 2em;
  margin-left: 50px;
  color: #262626;
}

/******************** MOBILE NAV ********************/

.mob-nav {
 width: 500px; 
 position: fixed;
 z-index: 10;
 top: 0;
 bottom: 0;
 right: -500px;
 background-color: #f2f2f2;
 padding-top: 90px;
 transition: 0.4s;
 overflow-y: scroll;
 padding-bottom: 60px;
}

.mob-nav p {
font-size:0.8em;
}

/* Position and style the close button (top right corner) */
.mob-nav .closebtn {
  position: absolute;
  top: 20px;
  right: 1em;
  font-size: 2em;
  margin-left: 50px;
  color: #262626;
}

a.burger  {
  display: none;
}

nav.mobile-nav > ul {
  display: block;
  padding: 0;
  width: 100%;
  max-width: 400px;
  margin: 0 auto 2em auto;
}
nav.mobile-nav > ul > li {
  display: block;
  margin: 0;
  position: relative;
  padding-bottom: 1em;
  margin-bottom: 1em;
  border-bottom: 1px solid #e5e5e5;
}

nav.mobile-nav > ul > li:last-of-type {
  border-bottom: none;
}


nav.mobile-nav ul > li > a {
  text-transform: uppercase;
  color:#262626;
  font-family: gillsans-regular;
  font-size: 0.9em;
  letter-spacing: 0.1em;
	display:block;
}
nav.mobile-nav ul > li > a:hover {
  color: #262626;
}
nav.mobile-nav ul li a:first-child:nth-last-child(2):before {
  font-family: 'Material Icons';
  content: '\e313';
  position: absolute;
  right: 0;
  font-size: 1.2em;
  display: block;
}

nav.mobile-nav ul li ul {
  display: none;
  border-bottom: none;
  margin: 1em 0 2em 0;
  padding: 0 0 0 .5em;
}

nav.mobile-nav ul > li > ul > li {
  line-height: 40px;
  list-style: none;
}
nav.mobile-nav ul > li > ul > li:last-of-type {
  border-bottom: none;
}
nav.mobile-nav ul li ul li a {
  font-family: helvetica-neue;
  text-transform: capitalize;
  margin-bottom: 0;
  color: #333;
  font-size: 0.9em;
}
nav.mobile-nav ul li ul li a::after {
  content: ' '
}

/* When you mouse over the navigation links, change their color */
.mobile-nav a:hover, .offcanvas a:focus{
  color: #262626;
}

/* Position and style the close button (top right corner) */
.mobile-nav .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
  color: #262626;
}

/******************** CONTACT FORM ********************/

/* contact form */

.contact-form {
  width:90%;
  max-width: 360px;
  margin:0 auto;
  opacity:0;
  color: #fff;
}

.contact-form p {
  margin-bottom:1.5em; 
}

.contact-form h3 {
  color:#fff; 
  margin-bottom: 2em;
}

.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form input[type="number"] {
  width: calc(100% - 1.5em);
  padding: 0.75em;
  border: none;
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
  margin-bottom: 1.5em;
  font-size: 1em;
  color:#333;
}

.contact-form select {
  width:100%;
  padding: 0.75em;
  border: none;
  margin-bottom: .4em;
  font-size: 1em;
  color:#333;
}

input:-webkit-autofill {
  -webkit-box-shadow: inset 0 0 0px 9999px #F0EFEA;
}

.contact-form .button {
  width:100%;
  padding:1.5em 1em;
  background-color: #EA1F75;
  color: #fff;
  border:none;
  cursor: pointer;
  font-size: 1em;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;;
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
}

/******************** ENQUIRY FORM ********************/

.form-wrapper {
  margin-top:2em;
}

.enquiry-form {
  width: 90%;
  max-width: 360px;
  margin: 0 auto;
  color: #262626;
}

.enquiry-form input[type="text"],
.enquiry-form input[type="email"],
.enquiry-form input[type="number"],
.enquiry-form input[type="date"]  {
  width: calc(100% - 2em);
  padding: 1em;
  border: 1px solid #ccc;
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
  margin-bottom: 1.5em;
  font-size: 1em;
  color:#262626;
  font-size: 0.85em;
  font-family: helvetica-neue;

}

.enquiry-form input[type="submit"] {
  background-color:#D4225D;
  color:#fff;
  text-align:center;
  text-transform: uppercase;
  letter-spacing: .35em;
  padding:1.5em 0;
  width:100%;
  border:none;
  cursor: pointer;
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
}

.enquiry-form input[type="submit"]:hover {
  background-color:#B52454;
}

::-webkit-input-placeholder { /* Edge */
  color: #262626;
}

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

::placeholder {
  color: #262626;
}

div.radiowrapper {
  display: flex;
  flex-direction: row;
  float: left;
  margin-right: 0.85em;
  margin-bottom: 2em;
}

div.radiowrapper label {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 0.85em;
}

/******************** DATEPICKER ********************/

.pika-single {
  z-index: 9999;
  display: block;
  position: relative;
  color: #262626;
  background: #fff;
  border: none;
  border-bottom-color: #bbb;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/*
clear child float (pika-lendar), using the famous micro clearfix hack
http://nicolasgallagher.com/micro-clearfix-hack/
*/
.pika-single:before,
.pika-single:after {
  content: " ";
  display: table;
}
.pika-single:after { clear: both }
.pika-single { *zoom: 1 }

.pika-single.is-hidden {
  display: none;
}

.pika-single.is-bound {
  position: absolute;
  box-shadow: 0 5px 15px -5px rgba(0,0,0,.5);
}

.pika-lendar {
  float: left;
  width: 240px;
  margin: 8px;
}

.pika-title {
  position: relative;
  text-align: center;
}

.pika-label {
  display: inline-block;
  *display: inline;
  position: relative;
  z-index: 9999;
  overflow: hidden;
  margin: 0;
  padding: 5px 3px;
  font-size: 14px;
  line-height: 20px;
  font-weight: bold;
  background-color: #fff;
}
.pika-title select {
  cursor: pointer;
  position: absolute;
  z-index: 9998;
  margin: 0;
  left: 0;
  top: 5px;
  filter: alpha(opacity=0);
  opacity: 0;
}

.pika-prev,
.pika-next {
  display: block;
  cursor: pointer;
  position: relative;
  outline: none;
  border: 0;
  padding: 0;
  width: 20px;
  height: 30px;
  /* hide text using text-indent trick, using width value (it's enough) */
  text-indent: 20px;
  white-space: nowrap;
  overflow: hidden;
  background-color: transparent;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 75% 75%;
  opacity: .5;
  *position: absolute;
  *top: 0;
}

.pika-prev:hover,
.pika-next:hover {
  opacity: 1;
}

.pika-prev,
.is-rtl .pika-next {
  float: left;
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAUklEQVR42u3VMQoAIBADQf8Pgj+OD9hG2CtONJB2ymQkKe0HbwAP0xucDiQWARITIDEBEnMgMQ8S8+AqBIl6kKgHiXqQqAeJepBo/z38J/U0uAHlaBkBl9I4GwAAAABJRU5ErkJggg==');
  *left: 0;
}

.pika-next,
.is-rtl .pika-prev {
  float: right;
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAU0lEQVR42u3VOwoAMAgE0dwfAnNjU26bYkBCFGwfiL9VVWoO+BJ4Gf3gtsEKKoFBNTCoCAYVwaAiGNQGMUHMkjGbgjk2mIONuXo0nC8XnCf1JXgArVIZAQh5TKYAAAAASUVORK5CYII=');
  *right: 0;
}

.pika-prev.is-disabled,
.pika-next.is-disabled {
  cursor: default;
  opacity: .2;
}

.pika-select {
  display: inline-block;
  *display: inline;
}

.pika-table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  border: 0;
}

.pika-table th,
.pika-table td {
  width: 14.285714285714286%;
  padding: 0;
}

.pika-table th {
  color: #999;
  font-size: 12px;
  line-height: 25px;
  font-weight: bold;
  text-align: center;
}

.pika-button {
  cursor: pointer;
  display: block;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  outline: none;
  border: 0;
  margin: 0;
  width: 100%;
  padding: 5px;
  color: #262626;
  font-size: 0.9em;
  line-height: 15px;
  text-align: right;
  background: #f5f5f5;
}

.pika-week {
  font-size: 11px;
  color: #999;
}

.is-today .pika-button {
  color: #33aaff;
  font-weight: bold;
}

.is-selected .pika-button,
.has-event .pika-button {
  color: #fff;
  font-weight: bold;
  background: #33aaff;
  box-shadow: inset 0 1px 3px #178fe5;
  border-radius: 3px;
}

.has-event .pika-button {
  background: #005da9;
  box-shadow: inset 0 1px 3px #0076c9;
}

.is-disabled .pika-button,
.is-inrange .pika-button {
  background: #D5E9F7;
}

.is-startrange .pika-button {
  color: #fff;
  background: #6CB31D;
  box-shadow: none;
  border-radius: 3px;
}

.is-endrange .pika-button {
  color: #fff;
  background: #33aaff;
  box-shadow: none;
  border-radius: 3px;
}

.is-disabled .pika-button {
  pointer-events: none;
  cursor: default;
  color: #999;
  opacity: .3;
}

.is-outside-current-month .pika-button {
  color: #999;
  opacity: .3;
}

.is-selection-disabled {
  pointer-events: none;
  cursor: default;
}

.pika-button:hover,
.pika-row.pick-whole-week:hover .pika-button {
  color: #fff;
  background: #ff8000;
  box-shadow: none;
  border-radius: 3px;
}

/* styling for abbr */
.pika-table abbr {
  border-bottom: none;
  cursor: help;
}

/* kitchen detail */

div.kitchen-detail {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  margin-bottom: 4em;
}

div.kitchen-detail div.left-col {
 width:59%;
}

div.kitchen-detail div.right-col {
 width:36%;
}

/* gallery */

div.kitchen-gallery {
  display: flex;
  flex-wrap: wrap;
}

div.kitchen-gallery a img{
 object-fit: cover;
}

div.kitchen-gallery a:nth-of-type(1) {
  width: 100%;
  height: 454px;
  margin-bottom: 10px;
  display: flex;
}

div.kitchen-gallery a:nth-of-type(2), 
div.kitchen-gallery a:nth-of-type(3), 
div.kitchen-gallery a:nth-of-type(4), 
div.kitchen-gallery a:nth-of-type(5),
div.kitchen-gallery a:nth-of-type(6)  
{
  width: 19%;
  height: 90px;
  display:flex;
  margin-right: 10px;
}

div.kitchen-gallery a:last-of-type {
 margin-right: 10px;
}

/******************** PRIVACY POLICY ********************/

div.privacy section {
	margin-bottom: 4em;
	padding: 0;
}

/******************** SHOWROOM GALLERY ********************/

div.showroom-gallery {
	width:100%;
	height: auto;
	overflow: hidden;
}

div.showroom-gallery img {
    width: 24%;
    height: 230px;
    margin-bottom: 15px;
    margin-right: 1%;
    float: left;
    display: inline-block;
    object-fit: cover;
}

div.showroom-gallery a:nth-of-type(3n) {
	margin-right:0;
}

/******************** BUTTON STYLES ********************/

a.default-btn {
  background-color: #D4225D;
  color: #fff;
  text-align: center;
	text-decoration: none;
  text-transform: uppercase;
  letter-spacing: .15em;
  padding: 1em 2em;
  font-family: gillsans-semibold;
  font-size: 0.9em;
}

a.default-ghost-btn {
 border:2px solid #fff;
 color:#fff;
 text-align:center;
 text-transform: uppercase;
 letter-spacing: .15em;
 font-family: gillsans-semibold;
 font-size: 0.9em;
 padding:1em 2em;
 box-sizing: border-box;
 -moz-box-sizing: border-box;
 -webkit-box-sizing: border-box;
}

a.default-hyperlink {
 color: #D4225D;
}

/* colours */

div.colours span {
  width:20px;
  height: 20px;
}

span.black {
  background-color: #000;
}

/* footer */

footer {
  width:100%;
  height:auto;
}

/* cookie popup */

div.cookies {
  position:fixed; 
  bottom: 0;
  left: 0;
  z-index: 999;
  width: 100%;
  padding: 4em 0;
  font-size: 12px;
  line-height: 16px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background: rgba(255,255,255,0.9);
}

div.cookies p {
  color: #444;
	margin-bottom: 0;
	font-family: helvetica-neue;
  margin-bottom:2em;
  font-size:1.2em;
  line-height: 1.5em;
}

div.cookies .container {
  position: relative;
}

div.cookies .container div {
  padding-left: 60px;
  padding-right:10px;
}

div.cookies a.close-cookie-warning {
 float:right;
}


@font-face {
  font-family: gillsans-regular;
  src: url(/css/fonts/gillsans/gillsans-regular.woff) format('woff'),
  url(/css/fonts/gillsans/gillsans-regular.ttf) format('truetype');
}

@font-face {
  font-family: gillsans-semibold;
  src: url(/css/fonts/gillsans/gillsans-semibold.woff) format('woff'),
  url(/css/fonts/gillsans/gillsans-semibold.ttf) format('truetype');
}

@font-face {
  font-family: helvetica-neue;
  src: url(/css/fonts/helvetica-neue/helvetica-neue.woff) format('woff'),
  url(/css/fonts/helvetica-neue/helvetica-neue.ttf) format('truetype');
}

