.container{
        max-width: 1700px;
    }


/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
body {
font-family: 'Crimson Text', serif; font-weight:300; font-size:18px; line-height:24px; color:#000; 
}

a {
  color: #000; font-weight:600;
}

a:hover {
  color: #999;
  text-decoration: none;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Poppins', sans-serif;
}

.highlight1 {padding:35px 15px; text-align:center; border-right:1px solid #eee; width:50%; float:right; position:relative}

.highlight2 {padding:35px 15px; text-align:center; border-right:1px solid #eee; width:50%; float:right; position:relative}

.highlight3 {padding:35px 15px; text-align:center; border-right:1px solid #eee; width:50%; float:right; position:relative}

.highlight4 {padding:35px 15px; text-align:center;  width:50%; float:right; position:relative}

.highlight {padding:0; margin:0 auto}

.highlight h3 {font-size:20px; line-height:26px; color:#000; margin-top:15px}

@media screen and (max-width: 992px) {
.highlight1 {border-right:1px solid #eee !important; border-bottom:1px solid #eee !important}

.highlight2 {border-right: none !important; border-bottom:1px solid #eee !important}

.highlight3 {border-right:1px solid #eee !important; }

.highlight4 {border:none !important}

.highlight h3 {font-size:16px; line-height:20px; color:#000; margin-top:12px}
}

.container{ 
  max-width:1450px; 
 
}

.homeintro {background:#C90}

.download {background-image:url("../../img/icon-sm-pdf.svg"); background-repeat:no-repeat; background-size: 35px 35px;   padding-left:50px ; font-family: 'Poppins', sans-serif; text-transform:uppercase; font-size:14px; line-hight:45px; font-weight:500; min-height:35px; color:#000; letter-spacing:2px; margin-top:35px; width:100%; display:block }

.download a {border-bottom:1px solid #000; padding-bottom:3px}

.sminfo {background-image:url("../../img/icon-sm-info.svg"); background-repeat:no-repeat; background-size: 35px 35px; min-height:35px;    color:#000; margin-top:15px; padding:auto; width:100%; display:block;    }

.smsize {background-image:url("../../img/icon-sm-size.svg"); background-repeat:no-repeat; background-size: 35px 35px; min-height:35px;    color:#000; margin-top:15px; padding:auto; width:100%; display:block }

.smchevron {background-image:url("../../img/icon-sm-chevron.svg"); background-repeat:no-repeat; background-size: 35px 35px; min-height:35px;    color:#000; margin-top:15px; padding:auto;width:100%; display:block  }

.smhb {background-image:url("../../img/icon-sm-hb.svg"); background-repeat:no-repeat; background-size: 35px 35px; min-height:35px;    color:#000; margin-top:15px; padding:auto; width:100%; display:block }

.smswatch {background-image:url("../../img/icon-sm-swatch.svg"); background-repeat:no-repeat; background-size: 35px 35px; min-height:35px;    color:#000; margin-top:15px; padding:auto; width:100%; display:block }

.infocontent {; font-family: 'Poppins', sans-serif; text-transform:normal; font-size:13px; line-height:20px; font-weight:500;  padding-left:35px; margin-top:auto; margin-bottom:auto}

.newflash {background-image: url("../../img/new.svg"); background-repeat:no-repeat; position: absolute; z-index:2; height:100%; width:15%; background-size:100% auto; margin:0;   }

.brochurebg {background-color:#21201E; padding:45px auto; background-size:cover; background-position: center; background-repeat:no-repeat; background-image: url("../../img/hbpattern.svg"); }

.brochurecontainer {padding:auto}

.brochureleft {  margin-top:auto; margin-bottom:auto}

@media (max-width: 992px) {.brochureleft {text-align:center  }}

.brochureleft h2 {color:#fff; margin-bottom:45px;}

@media (max-width: 992px) {.brochureleft h2 {color:#fff; margin-bottom:15px; margin-top:0px}}  

.brochureleft p {color:#fff; font-family: 'Poppins', sans-serif; text-transform:normal; font-size:18px; line-height:26px; font-weight:400; margin-bottom:35px  }
    
@media (max-width: 992px) {.brochureleft p {color:#fff; font-family: 'Poppins', sans-serif; text-transform:normal; font-size:16px; line-height:22px; font-weight:400; margin-bottom:15px   }}

.brochurebtn {
  font-family: 'Poppins', sans-serif;
  text-transform: uppercase;
  font-weight: 400;
  font-size: 14px;
  letter-spacing: 1px;
  display: inline-block;
  padding: 10px 14px;
  border-radius: 3px;
  transition: 0.5s;
  margin: 10px 0 25px 0;
  color: #fff;
  background: #666;
}

    
.brochurebtn:hover {
  background: #ccc;
  color: #000;
}

.personalise {width:350px; margin-bottom:35px}

@media (max-width: 768px) {.personalise {width:250px; margin-bottom:35px}}

.jebreadcrumb {background:none; padding:0; margin:10px 0 10px 0; font-family: 'Poppins', sans-serif;  font-size: 12px; line-height:14px; font-weight: 400; }

.jebreadcrumb a {font-weight: 400; color:#000}

.jebreadcrumb a:hover {color:#666}

@media (max-width: 992px) {.jebreadcrumb {  font-size: 11px; line-height:13px; }}

/*--------------------------------------------------------------
# Back to top button
--------------------------------------------------------------*/

.blogicon {width:75px; margin-bottom:15px}

/*--------------------------------------------------------------
# Back to top button
--------------------------------------------------------------*/
.back-to-top {
  position: fixed;
  display: none;
  right: 15px;;
  bottom: 15px;
  z-index: 99999;
}

.back-to-top i {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  width: 40px;
  height: 40px;
  border-radius: 4px;
  background: #000;
  color: #fff;
  transition: all 0.4s;
}

.back-to-top i:hover {
  color: #fff;
}


.collectionsframe {padding:0;margin:0}

.collections {width:50%; float:left; position:relative; }

/*--------------------------------------------------------------
# Disable AOS delay on mobile
--------------------------------------------------------------*/
@media screen and (max-width: 768px) {
  [data-aos-delay] {
    transition-delay: 0 !important;
  }
}

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
#header {
  height: 100px;
  transition: all 0.5s;
  z-index: 997;
  transition: all 0.5s;
  background: #fff;
  box-shadow: 0 4px 10px -3px rgba(191, 191, 191, 0.5);
}

#header .logo h1 {
  font-size: 28px;
  margin: 0;
  line-height: 1;
  font-weight: 400;
  letter-spacing: 3px;
  text-transform: uppercase;
}

#header .logo h1 a, #header .logo h1 a:hover {
  color: #fff;
  text-decoration: none;
}

#header .logo img {
  padding: 0;
  margin: 0 auto;
  max-height: 40px; display:block
}

@media (max-width: 992px) {
  #header {
    height: 70px;
  }
}

/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
/* Desktop Navigation */
.nav-menu {
  width: 100%;
}

.nav-menu, .nav-menu * {
  margin: 0;
  padding: 0;
  list-style: none;
}

.nav-menu > ul > li {
  position: relative;
  white-space: nowrap;
  float: left;
}

.nav-menu .nav-inner {
  display: flex;
  justify-content: center;
  align-items: center;
}

.nav-menu .nav-logo {
  padding: 0 20px; margin:0 25px; 
}

@media (max-width: 1200px) {.nav-menu .nav-logo {
  padding: 0 0px; margin:0 15px; 
}

.nav-menu a {
  padding: 0 !important;
}}

.nav-menu a {
  display: block;
  position: relative;
  color: #151515;
  padding: 15px 0;
  transition: 0.3s;
  font-size: 17px;
  font-family: 'Poppins', sans-serif; font-weight:500; width:165px; text-align:center;

}

@media (max-width: 1200px) {
	.nav-menu a {
 width:130px; 
}}

.nav-menu a:hover, .nav-menu .active > a, .nav-menu li:hover > a {
  color: #000;
  text-decoration: none;
}

.nav-menu .drop-down ul {
width:240px;
  display: block;
  position: absolute;
  left: 25px;
  top: calc(100% - 0px);
  z-index: 99;
  opacity: 0;
  visibility: hidden;
  padding: 0;
  background: #fff;
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
  transition: ease all 0.3s;
    text-align:left
}

.nav-menu .drop-down:hover > ul {
  opacity: 1;
  top: 100%;
  visibility: visible;
}

.nav-menu .drop-down li {
  
  position: relative; 
}

.nav-menu .drop-down ul a {
width:240px;
  padding: 7px 15px;
  font-size: 15px;
  font-weight: 400;
  color: #000;
    text-align:left; border-bottom:1px solid #efefef
}

.nav-menu .drop-down ul a:hover, .nav-menu .drop-down ul .active > a, .nav-menu .drop-down ul li:hover > a {
  color: #000; background-color: #f8f8f8
}

.nav-menu .drop-down > a:after {
  content: "\ea99";
  font-family: IcoFont;
  padding-left: 5px;
}

.nav-menu .drop-down .drop-down ul {
  top: 0;
  left: calc(100% - 30px);
}

.nav-menu .drop-down .drop-down:hover > ul {
  opacity: 1;
  top: 0;
  left: 100%;
}

.nav-menu .drop-down .drop-down > a {
  padding-right: 35px;
}

.nav-menu .drop-down .drop-down > a:after {
  content: "\eaa0";
  font-family: IcoFont;
  position: absolute;
  right: 15px;
}

@media (max-width: 1200px) {
	.nav-menu a {
 width:130px; 
}

.nav-menu .drop-down ul a {
  padding: 7px 15px !important;

}
    
    .nav-menu .drop-down ul {

  left: 5px !important;
  top: 35px !important;
 
}


}

/* Mobile Navigation */
.mobile-nav-toggle {
  position: fixed;
  right: 5px;
  top: 14px;
  z-index: 9998;
  border: 0;
  background: none;
  font-size: 24px;
  transition: all 0.4s;
  outline: none !important;
  line-height: 1;
  cursor: pointer;
  text-align: right;

}

.mobile-nav-toggle i {
  color: #000;
}

.mobile-nav {
  position: fixed;
  top: 35px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  z-index: 9999;
  overflow-y: auto;
  background: #fff;
  transition: ease-in-out 0.2s;
  opacity: 0;
  visibility: hidden;
  border-radius: 0px;
  padding: 20px 0;text-align:left
}

.mobile-nav * {
  margin: 0;
  padding: 0;
  list-style: none;
}

.mobile-nav a {
  display: block;
  position: relative;
  color: #151515;
  padding: 10px 20px;
  font-weight:500; 
  outline: none;font-family: 'Poppins', sans-serif !important; font-size:18px !important; border-bottom:1px solid #ccc
}

.mobile-nav a:hover, .mobile-nav .active > a, .mobile-nav li:hover > a {
  color: #000;
  text-decoration: none;
}

.mobile-nav .drop-down > a:after {
  content: "\ea99";
  font-family: IcoFont;
  padding-left: 10px;
  position: absolute;
  right: 15px;
}

.mobile-nav .active.drop-down > a:after {
  content: "\eaa1";
}

.mobile-nav .drop-down > a {
  padding-right: 35px;
}

.mobile-nav .drop-down ul {
  display: none;
  overflow: hidden;
}

.mobile-nav .drop-down li {
  padding-left: 20px;
}

.mobile-nav-overly {
  width: 100%;
  height: 100%;
  z-index: 9997;
  top: 0;
  left: 0;
  position: fixed;
  background:#fff;
  overflow: hidden;
  display: none;
  transition: ease-in-out 0.2s;
}

.mobile-nav-active {
  overflow: hidden;
}

.mobile-nav-active .mobile-nav {
  opacity: 1;
  visibility: visible;
}

.mobile-nav-active .mobile-nav-toggle i {
  color: #000;
}

.button {
  background-color: #000; /* Green */
  border: none;
  color: white;
  padding: 10px 22px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 14px; line-height:16px; font-family: 'Poppins', sans-serif;font-weight:500; margin-top:25px; margin-bottom:25px; transition: 0.3s;   border-radius:2px
}

.button:hover {
  background-color: #666;
  color: white;
}

.buttonwhite {
  background-color: #fff; /* Green */
  border: none;
  color: #000;
  padding: 10px 25px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;font-family: 'Poppins', sans-serif;font-weight:600; margin-top:25px; border-radius:2px
}

.buttonwhite:hover {
  background-color: #666;
  color: white;transition: 0.3s;
}

.samplebtn {
  font-family: 'Poppins', sans-serif;
  text-transform: uppercase;height:auto;
  font-weight: 400;
  font-size: 16px;line-height:16px;
  letter-spacing: 1px;
  display: inline-block; padding:10px 30px !important;
   transition: 0.5s;
  border: 1px solid #000;
  color: #000; margin-bottom:35px; margin-top:15px
}

.samplebtn:hover {
  border: 1px solid #000;color: #fff;background:#000
}

@media (max-width: 768px) {.samplebtn {margin-bottom:25px; margin-top:5px}}

.spec {padding:25px 0; margin-bottom:0 !important; background:#a89b78; height:auto;}

.spec-thickness10 {background: url( "../../img/spec-thickness10.svg"); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative;  }

.spec-thickness14 {background:url(../../img/spec-thickness14.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative;  }

.spec-thickness15 {background:url(../../img/spec-thickness15.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative;  }

.spec-thickness16 {background:url(../../img/spec-thickness16.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative; }

.spec-thickness21 {background:url(../../img/spec-thickness21.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative; }

.spec-thickness22 {background:url(../../img/spec-thickness22.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative; }

.spec-wear3 {background:url(../../img/spec-wear3.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative;  }

.spec-wear4 {background:url(../../img/spec-wear4.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative; }

.spec-wear5 {background:url(../../img/spec-wear5.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative;  }

.spec-wear6 {background:url(../../img/spec-wear6.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative; }

.spec-wear12 {background:url(../../img/spec-wear12.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative; }

 .spec-matt {background:url(../../img/spec-matt.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative;  }
 
 .spec-oil {background:url(../../img/spec-oil.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative; }
 
  .spec-bevelled {background:url(../../img/spec-bevel.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative;  }

 .spec-uk {background:url(../../img/spec-uk.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative;  }

 .spec-tongue {background:url(../../img/spec-tongue.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative;  }
 
  .spec-underfloor {background:url(../../img/spec-underfloor.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative; }
  
 .spec-cobbled {background:url(../../img/spec-cobbled.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative; }

.spec-tumbled {background:url("../../img/spec-tumbled.svg"); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative; }

.spec-square {background:url("../../img/spec-square.svg"); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative; }
 
  .spec-engineered {background:url(../../img/spec-engineered.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative; }
  
  .spec-solid {background:url(../../img/spec-solid.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative; }
  
 .spec-mixed {background:url(../../img/spec-mixed.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative; }
   
 .spec-herringbone {background:url(../../img/spec-herringbone.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative; }
 
  .spec-plank {background:url(../../img/spec-plank.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative; }
  
  .spec-parquet {background:url(../../img/spec-parquet.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative; }
  
  .spec-chevron {background:url(../../img/spec-chevron.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative; }
  
   .spec-diamond {background:url(../../img/spec-diamond.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative; }

.spec-natural {background:url(../../img/spec-natural.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative; }
  
  .spec-rustic {background:url(../../img/spec-rustic.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative; }
  
   .spec-super {background:url(../../img/spec-super.svg); background-size:70px 70px; height:70px; width: 70px;background-repeat: no-repeat; float:left; position:relative; }

@media (max-width: 768px) {
    
    .spec-thickness10 {background-size:65px 65px; height:65px; width: 65px;}

.spec-thickness14 {background-size:65px 65px; height:65px; width: 65px;}

.spec-thickness15 {background-size:65px 65px; height:65px; width: 65px;}

.spec-thickness16 {background-size:65px 65px; height:65px; width: 65px;}

.spec-wear3 {background-size:65px 65px; height:65px; width: 65px;}

.spec-wear4 {background-size:65px 65px; height:65px; width: 65px;}

.spec-wear5 {background-size:65px 65px; height:65px; width: 65px;}

.spec-wear6 {background-size:65px 65px; height:65px; width: 65px;}

 .spec-matt {background-size:65px 65px; height:65px; width: 65px;}
 
 .spec-oil {background-size:65px 65px; height:65px; width: 65px;}
 
  .spec-bevelled {background-size:65px 65px; height:65px; width: 65px;}

 .spec-uk {background-size:65px 65px; height:65px; width: 65px;}

 .spec-tongue {background-size:65px 65px; height:65px; width: 65px;}
 
  .spec-underfloor {background-size:65px 65px; height:65px; width: 65px;}
  
 .spec-cobbled {background-size:65px 65px; height:65px; width: 65px;}
 
  .spec-engineered {background-size:65px 65px; height:65px; width: 65px;}
  
  .spec-solid {background-size:65px 65px; height:65px; width: 65px;}
  
 .spec-mixed {background-size:65px 65px; height:65px; width: 65px;}
   
 .spec-herringbone {background-size:65px 65px; height:65px; width: 65px;}
 
  .spec-plank {background-size:65px 65px; height:65px; width: 65px;}
  
  .spec-parquet {background-size:65px 65px; height:65px; width: 65px;}
  
  .spec-chevron {background-size:65px 65px; height:65px; width: 65px;}
  
   .spec-diamond {background-size:65px 65px; height:65px; width: 65px;}

.spec-natural {background-size:65px 65px; height:65px; width: 65px;}
  
  .spec-rustic {background-size:65px 65px; height:65px; width: 65px;}
  
   .spec-super {background-size:65px 65px; height:65px; width: 65px;}
    

  }

/*--------------------------------------------------------------
# BLOG
--------------------------------------------------------------*/

.blogcontent {padding:25px 25px 35px 25px}

@media (max-width: 992px) {.blogcontent {background-color: #efefef}}

.blogcontent p {margin:0 0 35px 0}

.blogcontent h2 { font-weight:600 !important; font-size:28px; line-height:36px;  margin-top: 25px; position: relative; margin-bottom: 15px}

.blogcontent h2::after {
  content: '';
  position: absolute;
  display: block;
  width: 60px;
  height: 2px;
  background: #000;
  top: -25px;
  left: calc(0 - 50px);
}

.blogcontent h2 a {font-weight:600}

.blogcontent h2 a:hover {color:#000;}

@media (max-width: 992px) {.blogcontent h2 { font-size:22px; line-height:28px;}}

.blogcontent-btn {background-color: #000; padding:7px 15px; color:#fff; font-family: 'Poppins', sans-serif; text-transform: uppercase; font-size:16px; line-height:16px; font-weight:400; letter-spacing:1px}

.blogcontent-date {font-family: 'Poppins', sans-serif; text-transform: uppercase; font-size:14px; line-height:14px; font-weight:400; letter-spacing:1px; color: #666; padding-bottom: 25px}

.pagination {
  display: inline-block;font-family: 'Poppins', sans-serif; font-weight:400
}

.pagination a {
  color: black;font-weight:400; font-size:14px;
  float: left;
  padding: 8px 16px;
  text-decoration: none; transition: background-color .3s;
}

.pagination a.active {
  background-color: #000;
  color: white;
}

.pagination a:hover:not(.active) {background-color: #efefef;}

.bloginfo h2 {font-size: 28px; line-height:36px; margin-top:30px; margin-bottom:15px; font-weight:600}

.bloginfo h3 {font-size: 22px; line-height:28px; margin-top:30px; margin-bottom:15px}

.bloginfo p a {text-decoration: underline}

.bloginfo li {margin:10px auto}



/*--------------------------------------------------------------
# Commercial
--------------------------------------------------------------*/

.comms {height:auto; padding:0; margin:0 auto; position: relative; background-color: #000; background-position: center; background-repeat: no-repeat; background-size: cover}

.commoverlay {
  background-color: rgba(0, 0, 0, 0.3);
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 1;
}

.commboost {background-color: #efefef; text-align: center; padding-bottom: 10px; margin-bottom: 15px}

.commboost h4 {font-weight:500; text-transform: uppercase; font-size:22px; line-height:24px;padding: 15px }

.commboost h4 a {font-weight:500}


.commscontent { text-align:center; margin:0 auto; padding:145px 25px 145px 25px; color:#fff}



.commscontent h1 {
  font-size: 52px;
  lineheight:58px;
  font-weight: 600;
  margin-bottom: 25px;
  padding-bottom:25px;
  color: #fff;
  position: relative;

}

.commscontent h1::after {
  content: '';
  position: absolute;
  display: block;
  width: 70px;
  height: 4px;
  background: #fff;
  bottom: 0;
  left: calc(50% - 35px);
}

@media (max-width: 768px) {.comms-title h1 {
  font-size: 28px;
  lineheight:32px;
  font-weight: 600;
  margin-bottom: 15px;
  padding-bottom:15px;
  color: #151515;
  position: relative;

}

.comms-title h1::after {
  content: '';
  position: absolute;
  display: block;
  width: 70px;
  height: 3px;
  background: #ccc;
  bottom: 0;
  left: calc(50% - 35px);
    }}

.commsbg {background-color:#fff}

.commsblockpic { padding:0; min-height:400px ; background-position: center; background-repeat: no-repeat; background-size: cover }
    
.commsblocktext {background-color:#efefef; padding:145px; }

.commsblocktext p:last-child {margin-bottom:0 }

@media (max-width: 1400px) {.commsblocktext { padding:90px; }}

@media (max-width: 1200px) {.commsblocktext { padding:50px; }}

@media (max-width: 768px) {.commsblocktext { padding:25px; }

.commsblockpic { padding:0; min-height:280px ; }}

.commsblocktext h2 {font-size:28px; line-height:36px; margin-bottom:25px}

@media (max-width: 768px) {.commsblocktext h2 {font-size:22px; line-height:28px; margin-bottom:25px} }

.commercial {background-image:url("../../img/skip-sawn.jpg"); background-size:cover; background-position: center; background-repeat:no-repeat; }

.hotel1 {background-image:url("../../img/hotel1.jpg"); background-size:cover; background-position: center; background-repeat:no-repeat;}

.trade {background-color: #000; text-align: center; padding:45px; color:#fff;}

@media (max-width: 992px){.trade {margin-bottom:25px}}

.trade h4 {font-weight:300; font-size:18px; line-height:20px; text-transform: uppercase; margin-bottom: 0}


.comcontact {border:1px solid #000; padding:45px 35px; text-align: center }

.comcontact a {font-weight: 300}

@media (max-width: 992px) {.comcontact {margin-bottom: 25px }}

.comcontact h4 {font-weight:300; font-size:20px; line-height:22px; text-transform: uppercase; margin-bottom: 0}

.comicon {width:55px; margin-bottom: 15px}

/* Tabs*/



#tabs{
	background: #efefef;
    color: #000;padding: 55px 0;
}

#tabs h2 {
  font-size: 18px;
  font-weight: 600;
  position: relative;
  padding-bottom: 25px;margin-bottom:35px;
  color: #000;font-family: 'Poppins', sans-serif;text-transform:uppercase; letter-spacing:3px
}

#tabs h2::before {
  content: '';
 
}

#tabs h2::after {
  content: '';
  position: absolute;
  display: block;
  width: 60px;
  height: 2px;
  background: #000;
  bottom: 0;
  left: calc(50% - 30px);
}


#tabs .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: #fff;
    background-color: transparent;
    border-color: transparent transparent #fff;
    border-bottom: 2px solid !important;
    font-family: 'Poppins', sans-serif !important; font-size: 16px; line-height:22px; letter-spacing:2px; text-transform:uppercase
}
#tabs .nav-tabs .nav-link {
    border: 1px solid transparent;
    color: #000;
 font-family: 'Poppins', sans-serif; font-size: 16px; line-height:22px; letter-spacing:2px; text-transform:uppercase
}

@media (max-width: 768px) {
    
    #tabs{
	padding: 35px 0;
}
	
	#tabs .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: #fff;
    background-color: transparent;
    border-color: transparent transparent #fff;
    border-bottom: 2px solid !important;
    font-family: 'Poppins', sans-serif !important; font-size: 12px; line-height:18px; letter-spacing:2px; text-transform:uppercase
}
#tabs .nav-tabs .nav-link {
    border: 1px solid transparent;
    color: #000;
 font-family: 'Poppins', sans-serif; font-size: 12px; line-height:18px; letter-spacing:2px; text-transform:uppercase
}}

.newspec td {font-family: 'Poppins', sans-serif; font-size: 14px; line-height:20px; color: #000; font-weight:300; background-color: #fff}

@media (max-width: 768px) {

    
.newspec td {font-size: 12px; line-height:18px; padding:7px}
    
.newspec td span {font-size: 12px; line-height:18px;}
}

.newspec td span {text-transform:uppercase; font-size: 14px; line-height:20px; color: #000; font-weight:600}

.newspec h3 {
  font-size: 24px;
  font-weight: 600;
  position: relative;
  margin-bottom:25px;
  color: #000;font-family: 'Poppins', sans-serif;
}

.newspec li {background-image: url("../../img/tick.svg"); background-repeat: no-repeat; padding-left:35px;background-size:20px auto;  list-style: none; margin-left: -25px; margin-bottom: 10px}

.newspec ul {margin-bottom: 35px} 




/*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/
#hero {
  width: 100%;
  height: 100vh;
  background: url("../img/hero-bg.png");
  position: relative;
}

#hero .hero-container {
  position: absolute;
  bottom: 0;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  text-align: center;
  padding: 0 15px;
}

#hero .hero-logo {
  margin-bottom: 30px;
}

#hero h1 {
  margin: 0 0 30px 0;
  font-size: 48px;
  font-weight: 500;
  line-height: 56px;
  color: #fff;
}

#hero h2 {
  color: #aeaeae;
  margin-bottom: 30px;
  font-size: 14px;
  font-weight: 400;
  text-transform: uppercase;
}

#hero .btn-get-started {
  font-family: 'Poppins', sans-serif;
  text-transform: uppercase;
  font-weight: 400;
  font-size: 16px;
  letter-spacing: 1px;
  display: inline-block;
  padding: 14px 30px;
  border-radius: 3px;
  transition: 0.5s;
  margin: 10px;
  color: #fff;
  background: #000;
}

#hero .btn-get-started:hover {
  background: #fff;
  color: #000;
}

@media (min-width: 1024px) {
  #hero {
    background-attachment: fixed;
  }
}

@media (max-width: 768px) {
  #hero h1 {
    font-size: 28px;
    line-height: 36px;
  }
  #hero h2 {
    line-height: 22px;
  }
}


.biglink {background: #efefef; text-align: center; padding:35px 25px; margin-bottom: 35px; font-family: 'Poppins', sans-serif; font-weight:400; text-transform: uppercase; letter-spacing: 1px; font-size: 20px; line-height: 24px}

.biglink a {font-weight:400;}



/*--------------------------------------------------------------
# Frequently Asked Questions
--------------------------------------------------------------*/
.faq .faq-list {
  padding: 0;
  list-style: none;
}

.faq .faq-list li {
  border-bottom: 1px solid #000;
  margin-bottom: 20px;
  padding-bottom: 20px;
}

@media (max-width: 768px) {
.faq .faq-list li {
  margin-bottom: 10px;
  padding-bottom: 10px;
}
}

.faq .faq-list a {
  display: block;
  position: relative;
  font-family: #000;
  font-size: 18px;
  line-height: 24px;
  font-weight: 400;
  padding-right: 25px;
  cursor: pointer;font-family: 'Poppins', sans-serif; font-weight:500
}

@media (max-width: 768px) {
    
.faq .faq-list a {

  font-size: 16px;
  line-height: 22px;
  
}
}

.faq .faq-list i {
  font-size: 24px;
  position: absolute;
  right: 0;
  top: 0;
}

.faq .faq-list p {
  margin-bottom: 0;
  padding: 10px 0 0 0;
}

.faq .faq-list .icon-show {
  display: none;
}

.faq .faq-list a.collapsed {
  color: #343a40;
}

.faq .faq-list a.collapsed:hover {
  color: #000;
}

.faq .faq-list a.collapsed .icon-show {
  display: inline-block;
}

.faq .faq-list a.collapsed .icon-close {
  display: none;
}

.faq h2 {
  font-size: 18px;
  font-weight: 600;
  position: relative;
  padding-bottom: 25px;margin-bottom:35px;
  color: #000;font-family: 'Poppins', sans-serif;text-transform:uppercase; letter-spacing:3px
}

.faq h2::before {
  content: '';
 
}

.faq h2::after {
  content: '';
  position: absolute;
  display: block;
  width: 60px;
  height: 2px;
  background: #000;
  bottom: 0;
  left: calc(50% - 30px);
}


.landingpage h2 {font-size:22px ; line-height:24px ;  font-family: 'Poppins', serif  ; font-weight:300; text-transform: uppercase; position: relative; letter-spacing:1px; margin-bottom: 45px; }


.landingpage h2::after {
  content: '';
  position: absolute;
  display: block;
  width: 90px;
  height: 2px;
  background: #000;
  bottom: -25px;
  left: calc(0);
}

.designbox {padding:0; background-color: #efefef; margin-bottom: 25px; text-align: center}



.designboxleft {padding:0; width:50%; text-align:center; padding:35px }

.designboxleft h4 {font-family: 'Poppins', serif  ; font-size: 28px; line-height:32px; color:#000; font-weight: 400; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 15px}

.designboxleft a {font-family: 'Poppins', serif  ; font-size: 28px; line-height:32px; color:#000; font-weight: 400; text-transform: uppercase; letter-spacing: 1px;  transition: 0.5s; margin-bottom: 15px; display: block; margin-left:auto; margin-right: auto }


.designboxleft a:hover {color:#666; }

.designboxleft p {font-family: 'Poppins', serif  ; font-size: 15px; line-height:22px; color:#000; font-weight: 400; margin-bottom:15px;  width:100%; display: block; margin-left:auto; margin-right: auto }

.designboxleft p:last-child {margin-bottom:0}

.designboxleftbtn {
  font-family: 'Poppins', sans-serif;
  text-transform: uppercase;
  font-weight: 400;
  font-size: 14px;
  letter-spacing: 1px;
  display: inline-block;
  padding: 8px 35px;
  transition: 0.5s;
  margin: 10px 0;
  color: #000;
    border:1px solid #000
  
}

    
.designboxleftbtn:hover {
  background: #000;
  color: #fff;
}

.designboxright {padding:0;  width:50%}

@media (max-width: 992px) {
    
.designboxleft a {font-size: 28px; line-height:32px;  margin-bottom: 10px; width:90%;}

.designboxleft p {font-size: 14px; line-height:22px;  margin-bottom:15px; width:80%;}

.designboxleftbtn {
  
  font-size: 14px;

  padding: 8px 35px;

  margin: 10px 0;
  
}
  
  
}}

@media (max-width: 768px) {
    
   .designboxleft {padding:15px } 
    
 .designboxleft a {font-size: 18px; line-height:12px; margin-bottom: 10px}

.designboxleft p {font-size: 12px; line-height:16px; margin-bottom: 0px}

.designboxleftbtn {
  
  font-size: 10px;

  padding: 3px 10px !important;
  transition: 0.5s;
  margin: 7px 0 0 0;
  
  
}}

@media (max-width: 640px) {
    
   .designboxleft {padding:15px } 
    
 .designboxleft a {font-size: 16px; line-height:20px; margin-bottom: 5px; width:100%;}

.designboxleft p {font-size: 10px; line-height:14px; margin-bottom: 0px; width:90%;}

.designboxleftbtn {
  
  font-size: 10px;

  padding: 3px 10px !important;
  transition: 0.5s;
  margin: 7px 0 0 0;
  
  
}}


/*--------------------------------------------------------------
# Sections General
--------------------------------------------------------------*/
section {
  padding: 60px 35px;
  overflow: hidden;
}

.section-bg {
  background-color: whitesmoke;
}

.section-title {
  text-align: center;
  padding-bottom: 40px;
}


.section-title h1 {
  font-size: 38px;
  lineheight:42px;
  font-weight: 600;
  margin-bottom: 25px;
  padding-bottom:25px;
  color: #151515;
  position: relative;

}



.section-title h1::after {
  content: '';
  position: absolute;
  display: block;
  width: 70px;
  height: 4px;
  background: #ccc;
  bottom: 0;
  left: calc(50% - 35px);
}

.section-title h2 {
  font-size: 38px;
  lineheight:42px;
  font-weight: 600;
  margin-bottom: 15px;
  padding-bottom:15px;
  color: #151515;
  position: relative;

}



.section-title h2::after {
  content: '';
  position: absolute;
  display: block;
  width: 70px;
  height: 4px;
  background: #ccc;
  bottom: 0;
  left: calc(50% - 35px);
}



.section-title p {
  margin-bottom: 0;
  color: #000;font-family: 'Crimson Text', serif; font-style:italic; font-weight:300; font-size:26px; line-height:32px
}

@media (max-width: 992px) {.section-title h2 {
  font-size: 32px;
  lineheight:36px;
  font-weight: 600;
  margin-bottom: 15px;
  padding-bottom: 15px;
  color: #151515;
}

.section-title p {
  margin-bottom: 0;
  color: #000;font-family: 'Crimson Text', serif; font-style:italic; font-weight:300; font-size:22px; line-height:26px; margin:0 15px
}}

/*--------------------------------------------------------------
# Portfolio Details
--------------------------------------------------------------*/
.portfolio-details {
  padding: 0;
}

.portfolio-details .portfolio-details-container {
  position: relative;
}

.portfolio-details .portfolio-details-carousel {
  position: relative;
  z-index: 1;
}

.portfolio-details .portfolio-details-carousel .owl-nav, .portfolio-details .portfolio-details-carousel .owl-dots {
  margin-top: 5px;
  text-align: left;
}

.portfolio-details .portfolio-details-carousel .owl-dot {
  display: inline-block;
  margin: 0 10px 0 0;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: #ddd !important;
}

.portfolio-details .portfolio-details-carousel .owl-dot.active {
  background-color: #000 !important;
}

.portfolio-details .portfolio-info {
  padding: 30px;
  position: absolute;
  right: 0;
  bottom: -70px;
  background: #fff;
  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
  z-index: 2;
}

.portfolio-details .portfolio-info h3 {
  font-size: 22px;
  font-weight: 400;
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #eee;
}

.portfolio-details .portfolio-info ul {
  list-style: none;
  padding: 0;
  font-size: 15px;
}

.portfolio-details .portfolio-info ul li + li {
  margin-top: 10px;
}

.portfolio-details .portfolio-description {
  padding-top: 50px;
}

.portfolio-details .portfolio-description h2 {
  width: 50%;
  font-size: 26px;
  font-weight: 400;
  margin-bottom: 20px;
}

.portfolio-details .portfolio-description p {
  padding: 0 0 0 0;
}

@media (max-width: 768px) {
  .portfolio-details .portfolio-info {
    position: static;
    margin-top: 30px;
  }
}

.storybg {background: url( "../../img/naturebg.jpg") ; background-repeat: no-repeat; background-position: center;  background-size: cover;  }

/*--------------------------------------------------------------
# New Commercial
--------------------------------------------------------------*/


.commercial h2 {font-size:26px ; line-height:32px ;  font-family: 'Poppins', serif  ; font-weight:300; text-transform: uppercase; position: relative; letter-spacing:1px; margin-bottom: 55px}


.commercial h2::after {
  content: '';
  position: absolute;
  display: block;
  width: 90px;
  height: 2px;
  background: #000;
  bottom: -25px;
  left: calc(0);
}


@media (max-width: 768px) {

.commercial h2 {font-size:20px ; line-height:26px ;  font-family: 'Poppins', serif  ; font-weight:300; text-transform: uppercase; position: relative; letter-spacing:1px; margin-bottom: 45px}


.commercial h2::after {
  content: '';
  position: absolute;
  display: block;
  width: 70px;
  height: 2px;
  background: #000;
  bottom: -20px !important;
  left: calc(0);
    }
}

.commercial li {font-size:18px ; line-height:22px ;  font-family: 'Poppins', serif  ; font-weight:300;}

    
.commercialleft img {
    width: 100%;
    height: 100%;
}

.commercialleft img {
    object-fit: cover; object-position: center; padding:0
}






/*--------------------------------------------------------------
# New Bespoke
--------------------------------------------------------------*/

.newbespokeitem { text-align:center; margin-bottom:25px; padding:0 45px; border-right:1px solid #eee}

.newbespokeitem:last-child {border:none}

@media (max-width: 1200px) {.newbespokeitem { padding:0 55px; border:none}}

@media (max-width: 992px) {.newbespokeitem { padding:0 45px; border:none}}

@media (max-width: 768px) {.newbespokeitem { padding:0 25px; border:none}}

.newbespokeitem h2 {font-size: 22px; font-family: 'Poppins', sans-serif; font-weight:600; color:#000; margin:0 0 10px 0}

.newbespokeitem p {font-family: 'Crimson Text', serif; font-weight:300; font-size:18px; line-height:24px; color:#000; }

.newbespokeimage {
  border-radius: 50%; width:230px; height:230px; margin:0 auto 25px auto}

.bespokeproductimage {background: url(../img/bespoke.jpg);background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;}
  
 .claddingimage {background: url(../img/cladding.jpg);background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;}
  
   .supportimage {background: url(../img/support.jpg);background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;}

 .optionsimage {background: url(../img/options.jpg);background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;}
  
/*--------------------------------------------------------------
# New Contact
--------------------------------------------------------------*/

.newcontactframe {padding:0 0 0 75px; }

@media (max-width: 768px) {.newcontactframe {padding:0 0 0 0  !important;}}


@media (max-width: 1200px) {.newcontactframe {padding:0 0 0 15px  !important}}

.newcontact {margin-bottom:25px;  padding:0 !important}

.newcontact h2 {font-size: 22px; font-family: 'Poppins', sans-serif; font-weight:600; color:#000; margin:0 0 10px 0}

.newcontact p {font-family: 'Crimson Text', serif; font-weight:300; font-size:18px; line-height:24px; color:#000; }


.newcontacttext {font-family: 'Crimson Text', serif; font-weight:300; font-size:18px; line-height:24px; color:#000; }

.newcontact h4  {font-size: 28px; font-family: 'Poppins', sans-serif; font-weight:600; color:#000; margin:0 0 20px 0}
/*--------------------------------------------------------------
# Bespoke
--------------------------------------------------------------*/

.sectionmargin {margin:0 15px; padding:10px 0 30px 0; }

.bespokecontainer {padding:35px 0 35px 0;  margin:0 !important; width:100% }

.floorplan {background: url(../img/floorplan.jpg);background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;}
  
.bespokesection {margin:0; padding:35px 0 0 0}

.bespokeimage {margin-bottom:25px; padding:35px 15px 0 15px}
    
.bespokecontent {padding:45px 110px  45px 70px; margin:25px 0 }

@media (max-width: 1200px) {.bespokecontent {padding:35px 35px  45px 35px;}}

@media (max-width: 768px) {.bespokecontent {padding:25px 15px  0 15px !important ; }}

.bespokecontent h3 {font-size:36px ; line-height:40px ;  font-family: 'Poppins', serif  ; font-weight:300; text-transform: uppercase; position: relative; letter-spacing:1px; margin-bottom: 55px}


.bespokecontent h3::after {
  content: '';
  position: absolute;
  display: block;
  width: 90px;
  height: 2px;
  background: #000;
  bottom: -25px;
  left: calc(0);
}


@media (max-width: 768px) {

.bespokecontent h3 {font-size:28px ; line-height:32px ;  font-family: 'Poppins', serif  ; font-weight:300; text-transform: uppercase; position: relative; letter-spacing:1px; margin-bottom: 55px}


.bespokecontent h3::after {
  content: '';
  position: absolute;
  display: block;
  width: 70px;
  height: 2px;
  background: #000;
  bottom: -25px;
  left: calc(0);
}



}

.bespokecontent p {font-family: 'Crimson Text', serif;  font-weight:300; font-size:18px; line-height:26px;  margin:0 0 15px 0;  color:#000}




.bespokeimage {margin-bottom:25px}



.design {background:url(../img/design.svg) !important; background-size:85% auto  !important; background-repeat: no-repeat !important}

.create {background:url(../img/create.svg) !important; background-size:85% auto  !important; background-repeat: no-repeat !important}

.supply {background:url(../img/supply.svg) !important; background-size:85% auto  !important; background-repeat: no-repeat !important}
 

 

  
  .hometitle {margin-top:50px; margin-bottom:15px;}
  
  @media (max-width: 992px) {  .hometitle {margin-top:30px; margin-bottom:0;}}

/*--------------------------------------------------------------
# About Us
--------------------------------------------------------------*/
.about .image {
  padding: 20px;
  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
}

.about .content h3 {
  font-weight: 600;
  font-size: 26px;
}

.about .content ul {
  list-style: none;
  padding: 0;
}

.about .content ul li {
  padding-bottom: 10px;
  display: flex;
  align-items: flex-start;
}

.about .content ul i {
  font-size: 24px;
  padding: 2px 6px 0 0;
  color: #000;
}

.about .content p:last-child {
  margin-bottom: 0;
}





/*--------------------------------------------------------------
# Portfolio
--------------------------------------------------------------*/


.portfolio .portfolio-item {
  margin-bottom: 30px;
}

.portfolio #portfolio-flters {
  padding: 0;
  margin: 0 auto 25px auto;
  list-style: none;
  text-align: center;
}

.portfolio #portfolio-flters li {
  cursor: pointer;
  display: inline-block;
  padding: 10px 15px 12px 15px;
  font-size: 12px;
  font-weight: 400;
  line-height: 1;
  text-transform: uppercase;
  color: #555555;
  transition: all 0.3s ease-in-out;
  margin: 0 4px 10px 4px;
  background: whitesmoke;
  border-radius: 4px;
}

.portfolio #portfolio-flters li:hover, .portfolio #portfolio-flters li.filter-active {
  background: #000;
  color: #fff;
}

.portfolio #portfolio-flters li:last-child {
  margin-right: 0;
}

.portfolio .portfolio-wrap {
  transition: 0.3s;
  position: relative;
  overflow: hidden;
  z-index: 1;
  background: rgba(0, 0, 0, 0.6);width:50%; float:left
}

.portfolio .portfolio-wrap::before {
  content: "";
  background: rgba(21, 21, 21, 0.6);
  position: absolute;
  left: 30px;
  right: 30px;
  top: 30px;
  bottom: 30px;
  transition: all ease-in-out 0.3s;
  z-index: 2;
  opacity: 0;
}

.portfolio .portfolio-wrap .portfolio-info {
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  text-align: center;
  z-index: 3;
  transition: all ease-in-out 0.3s;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.portfolio .portfolio-wrap .portfolio-info::before {
  display: block;
  content: "";
  width: 48px;
  height: 48px;
  position: absolute;
  top: 35px;
  left: 35px;

  transition: all 0.5s ease 0s;
  z-index: 9994;
}

.portfolio .portfolio-wrap .portfolio-info::after {
  display: block;
  content: "";
  width: 48px;
  height: 48px;
  position: absolute;
  bottom: 35px;
  right: 35px;
  transition: all 0.5s ease 0s;
  z-index: 9994;
}

.portfolio .portfolio-wrap .portfolio-info h4 {
  font-size: 20px;
  color: #fff;
  font-weight: 600;
}

.portfolio .portfolio-wrap .portfolio-info p {
  color: #ffffff;
  font-size: 14px;
  text-transform: uppercase;
  padding: 0;
  margin: 0;
}

.portfolio .portfolio-wrap .portfolio-links {
  text-align: center;
  z-index: 4;
}

.portfolio .portfolio-wrap .portfolio-links a {
  color: #fff;
  margin: 0 2px;
  font-size: 28px;
  display: inline-block;
  transition: 0.3s;
}

.portfolio .portfolio-wrap .portfolio-links a:hover {
  color: #000;
}

.portfolio .portfolio-wrap:hover::before {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 1;
}

.portfolio .portfolio-wrap:hover .portfolio-info {
  opacity: 1;
}

.portfolio .portfolio-wrap:hover .portfolio-info::before {
  top: 15px;
  left: 15px;
}

.portfolio .portfolio-wrap:hover .portfolio-info::after {
  bottom: 15px;
  right: 15px;
}

/*--------------------------------------------------------------
# Testimonials
--------------------------------------------------------------*/
.testimonials {
  padding: 60px 0;
  background: url("../img/floorcloseup.jpg") no-repeat;
  background-position: center center;
  background-size: cover;
  position: relative;
}

.testimonials::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.1);
}





.testimonials .testimonial-item {
  text-align: center;width:75%;
  color: #fff;margin:0 auto; padding:45px; display:block
}

.testimonials .testimonial-item p {
  
  margin: 0 auto 30px auto;
  font-size:36px; line-height:42px; font-family: 'Crimson Text', serif; font-weight:600; 
}

@media (max-width: 992px) {
.testimonials .testimonial-item p {
  
  margin: 0 auto 30px auto;
  font-size:26px; line-height:32px; font-family: 'Crimson Text', serif; font-weight:600; 
}

.testimonials .testimonial-item {
  text-align: center;width:100%;
  color: #fff;margin:0 auto; padding:35px 20px; display:block
}
}

.testimonials .testimonial-item .testimonial-img {
  width: 100px;
  border-radius: 50%;
  border: 6px solid rgba(255, 255, 255, 0.15);
  margin: 0 auto;
}

.testimonials .testimonial-item h3 {
  font-size: 18px;
  font-weight: bold;
  margin: 10px 0 5px 0;
  color: #fff;font-family: 'Crimson Text', serif; font-style:italic
}

.testimonials .testimonial-item h4 {
  font-size: 14px;
  color: #ddd;
  margin: 0 0 15px 0;
}



.testimonials .owl-dot {
  display: inline-block;
  margin: 0 5px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.4) !important;
}

.testimonials .owl-dot.active {
  background-color: #000 !important;
}

@media (min-width: 1024px) {
  .testimonials {
    background-attachment: fixed;
  }
}

@media (min-width: 992px) {
  .testimonials .testimonial-item p {
    width: 80%;
  }
}

/*--------------------------------------------------------------
# Clients
--------------------------------------------------------------*/
.clients {
  background: whitesmoke;
  padding: 15px 0;
  text-align: center;
}

.clients img {
  width: 50%;
  -webkit-filter: grayscale(100);
  filter: grayscale(100);
  transition: all 0.4s ease-in-out;
  display: inline-block;
  padding: 15px 0;
}

.clients img:hover {
  -webkit-filter: none;
  filter: none;
  transform: scale(1.2);
}

@media (max-width: 768px) {
  .clients img {
    width: 40%;
  }
}

@media (max-width: 575px) {
  .clients img {
    width: 50%;
  }
}




/*--------------------------------------------------------------
# Contact
--------------------------------------------------------------*/
.contact .info {
  width: 100%;
  height: 100%;
  background: #fff;
  padding: 20px;
  border-radius: 5px;
}

.contact .info i {
  font-size: 20px;
  color: #000;
  float: left;
  width: 44px;
  height: 44px;
  background: #eaf6e9;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50px;
  transition: all 0.3s ease-in-out;
}

.contact .info h4 {
  padding: 0 0 0 60px;
  font-size: 22px;
  font-weight: 600;
  margin-bottom: 5px;
  color: #151515;
}

.contact .info p {
  padding: 0 0 0 60px;
  margin-bottom: 0;
  font-size: 14px;
  color: #484848;
}

.contact .info .email, .contact .info .phone {
  margin-top: 40px;
}

.contact .info .email:hover i, .contact .info .address:hover i, .contact .info .phone:hover i {
  background: #000;
  color: #fff;
}

.contact .php-email-form {
  width: 100%;
  background: #fff;
  padding: 20px;
  border-radius: 5px;
}

.contact .php-email-form .form-group {
  padding-bottom: 8px;
}

.contact .php-email-form .validate {
  display: none;
  color: red;
  margin: 0 0 15px 0;
  font-weight: 400;
  font-size: 13px;
}

.contact .php-email-form .error-message {
  display: none;
  color: #fff;
  background: #ed3c0d;
  text-align: left;
  padding: 15px;
  font-weight: 600;
}

.contact .php-email-form .error-message br + br {
  margin-top: 25px;
}

.contact .php-email-form .sent-message {
  display: none;
  color: #fff;
  background: #18d26e;
  text-align: center;
  padding: 15px;
  font-weight: 600;
}

.contact .php-email-form .loading {
  display: none;
  background: #fff;
  text-align: center;
  padding: 15px;
}

.contact .php-email-form .loading:before {
  content: "";
  display: inline-block;
  border-radius: 50%;
  width: 24px;
  height: 24px;
  margin: 0 10px -6px 0;
  border: 3px solid #18d26e;
  border-top-color: #eee;
  -webkit-animation: animate-loading 1s linear infinite;
  animation: animate-loading 1s linear infinite;
}

.contact .php-email-form input, .contact .php-email-form textarea {
  border-radius: 0;
  box-shadow: none;
  font-size: 14px;
}

.contact .php-email-form input {
  height: 44px;
}

.contact .php-email-form textarea {
  padding: 10px 12px;
}

.contact .php-email-form button[type="submit"] {
  background: #000;
  border: 0;
  padding: 10px 24px;
  color: #fff;
  transition: 0.4s;
  border-radius: 4px;
}

.contact .php-email-form button[type="submit"]:hover {
  background: #61b959;
}

@-webkit-keyframes animate-loading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes animate-loading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}



/*--------------------------------------------------------------
# Breadcrumbs
--------------------------------------------------------------*/
.breadcrumbs {
  padding: 40px 0;
}

.breadcrumbs h2 {
  font-size: 26px;
  font-weight: 300;
}

.breadcrumbs ol {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 15px;
}

.breadcrumbs ol li + li {
  padding-left: 10px;
}

.breadcrumbs ol li + li::before {
  display: inline-block;
  padding-right: 10px;
  color: #2f2f2f;
  content: "/";
}

@media (max-width: 768px) {
  .breadcrumbs .d-flex {
    display: block !important;
  }
  .breadcrumbs ol {
    display: block;
  }
  .breadcrumbs ol li {
    display: inline-block;
  }
}

/*--------------------------------------------------------------
# Portfolio Details
--------------------------------------------------------------*/
.portfolio-details {
  padding-top: 0;
}

.portfolio-details .portfolio-details-container {
  position: relative;
}

.portfolio-details .portfolio-details-carousel {
  position: relative;
  z-index: 1;
}

.portfolio-details .portfolio-details-carousel .owl-nav, .portfolio-details .portfolio-details-carousel .owl-dots {
  margin-top: 5px;
  text-align: left;
}

.portfolio-details .portfolio-details-carousel .owl-dot {
  display: inline-block;
  margin: 0 10px 0 0;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: #ddd !important;
}

.portfolio-details .portfolio-details-carousel .owl-dot.active {
  background-color: #000 !important;
}

.portfolio-details .portfolio-info {
  padding: 30px;
  position: absolute;
  right: 0;
  bottom: -70px;
  background: #fff;
  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
  z-index: 2;
}

.portfolio-details .portfolio-info h3 {
  font-size: 22px;
  font-weight: 400;
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #eee;
}

.portfolio-details .portfolio-info ul {
  list-style: none;
  padding: 0;
  font-size: 15px;
}

.portfolio-details .portfolio-info ul li + li {
  margin-top: 10px;
}

.portfolio-details .portfolio-description {
  padding-top: 50px;
}

.portfolio-details .portfolio-description h2 {
  width: 50%;
  font-size: 26px;
  font-weight: 400;
  margin-bottom: 20px;
}

.portfolio-details .portfolio-description p {
  padding: 0 0 0 0;
}

@media (max-width: 768px) {
  .portfolio-details .portfolio-info {
    position: static;
    margin-top: 30px;
  }
}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
#footer {
  background: #000;
  color: #fff;
  font-size: 14px;
  position: relative; margin:0; padding:0
}

#footer::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.85);
  z-index: 1;
}

#footer .footer-top {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: 30px 0;
}

#footer .footer-top .footer-logo img {
  height: 80px;
}

#footer .footer-top h3 {
  font-size: 36px;
  font-weight: 700;
  color: #fff;
  position: relative;
  font-family: "Poppins", sans-serif;
  padding: 30px 0 0 0;
  margin-bottom: 0;
}

#footer .footer-top p {
  font-size: 15;
  font-style: italic;
  margin: 30px 0 0 0;
  padding: 0;
}

#footer .footer-top .footer-newsletter {
  text-align: center;
  font-size: 15px;
  margin-top: 30px;
}

#footer .footer-top .footer-newsletter form {
  background: #fff;
  padding: 6px 10px;
  position: relative;
  border-radius: 50px;
  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
  text-align: left;
}

#footer .footer-top .footer-newsletter form input[type="email"] {
  border: 0;
  padding: 4px 8px;
  width: calc(100% - 100px);
}

#footer .footer-top .footer-newsletter form input[type="submit"] {
  position: absolute;
  top: 0;
  right: -1px;
  bottom: 0;
  border: 0;
  background: none;
  font-size: 16px;
  padding: 0 20px;
  background: #000;
  color: #fff;
  transition: 0.3s;
  border-radius: 50px;
  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
}

#footer .footer-top .footer-newsletter form input[type="submit"]:hover {
  background: #5ab652;
}

#footer .footer-top .social-links {
  margin-top: 0;
}

#footer .footer-top .social-links a {
  font-size: 38px;
  display: inline-block;
  background: #000;
  color: #fff;
  line-height: 1;
  padding: 9px 9px;
  margin-right:4px;
  border-radius: 50%;
  text-align: center;
  width: 46px;
  height: 46px;
  transition: 0.3s;
}

#footer .footer-top .social-links a:hover {
  color: #fff;
  text-decoration: none;
}

#footer .footer-bottom {
  
  z-index: 2;
  position: relative;
  padding-top: 40px;
  padding-bottom: 40px;
}

#footer .copyright {
  text-align: center; color:#FFF !important
}

#footer .copyright a {
 color:#FFF !important
}

#footer .credits {
  text-align: center;
  font-size: 13px;
  padding-top: 5px;
}



.stickytel { position:fixed; top:18px; left:15px;  z-index:999;  }

@media (min-width: 768px) {.stickytel {display:none} }

.stickyemail { position:fixed; top:18px; left:55px;  z-index:999;  }

@media (min-width: 768px) {.stickyemail {display:none} }



/*--------------------------------------------------------------
# Base Footer
--------------------------------------------------------------*/

.basefooterframe {background:#000; padding:35px 35px 0 35px}

@media (max-width: 768px) {.basefooterframe {background:#000; padding:0 35px 0 35px}

.basefooter h2 {font-family: 'Poppins', sans-serif; color:#FFF; font-size:24px !important; line-height:30px !important; font-weight:500; margin:0}

}


.basefooter h2 {font-family: 'Poppins', sans-serif; color:#FFF; font-size:28px; line-height:36px; font-weight:500; margin:0}

.basefooterleft {text-align:center; padding:45px 0px; border-right:1px solid #FFF}

@media (max-width: 768px) {.basefooterleft {text-align:center; padding:15px 30px;  border-right: none; }}

.basefooterright {text-align:center; padding:45px 0; }

@media (max-width: 768px) {.basefooterright {text-align:center; padding:15px 30px;  border-right: none; }}




.basefooterlogo { 
            width: 100%;
                        position: relative;padding:0;  margin:25px 0 0 0; 
        }

.basefooterlogo:before { content: '';
        position: absolute;
        bottom: 50%;
        border-bottom: 1px solid #FFF;
        width: 100%;
        z-index:1;
    }
	
.jackeviewhite { text-align:center; z-index:2; position: relative; width: 100%;}

.collectionsitem  { width:100%;  background-image:url(../img/chevron.svg); background-size:auto 20px; background-repeat: no-repeat; background-position:right top; margin:15px 25px 25px 0; padding-right:30px; }

.collectionsitem h4 {font-family: 'Poppins', sans-serif; color:#000; font-size:22px; line-height:24px; font-weight:600; margin:15px 0 5px 0; padding-right:20px}

.collectionsitem h5 {font-family: 'Poppins', serif; font-weight:100; color:#999; font-size:16px; line-height:20px; font-weight:500; margin:0 0 5px 0; padding-right:20px}

.collectionsitem h6 {font-family: 'Crimson Text', serif; font-weight:300; color:#000; font-size:16px; line-height:22px; font-weight:500; margin:0 0 0 0; padding-right:20px; font-style:italic}

@media (max-width: 768px) {.collectionsitem  { width:100%;  background-image:url(../img/chevron.svg); background-size:auto 20px; background-repeat: no-repeat; background-position:right top; margin:15px 25px 25px 0; padding-right:30px; }

.collectionsitem h4 {font-family: 'Poppins', sans-serif; color:#000; font-size:18px !important; line-height:20px !important; font-weight:600; margin:15px 0 5px 0; padding-right:20px}

.collectionsitem h5 {font-family: 'Poppins', serif; font-weight:100; color:#999; font-size:13px !important; line-height:20px !important; font-weight:500; margin:0 0 5px 0; padding-right:20px}

.collectionsitem h6 {font-family: 'Crimson Text', serif; font-weight:300; color:#000; font-size:15px !important; line-height:20px !important; font-weight:500; margin:0 0 0 0; padding-right:20px; font-style:italic}}

.productinfo {font-size: 16px; line-height:21px; font-family: 'Crimson Text', serif; font-weight:300; color:#666; margin:0 0 10px 0}

.productinfo span {font-size: 14px; line-height:16px; font-family: 'Poppins', sans-serif; font-weight:500; color:#000; margin:0 0 10px 0; text-transform:uppercase; letter-spacing:1px}

.productinfo td {
  
  vertical-align: top;
}

.productdescription {padding:35px}

@media (max-width: 992px) {.productdescription {padding:0px 15px}}


.productdescription h1 {font-family: 'Poppins', sans-serif; color:#000; font-size:32px; line-height:38px; font-weight:600; margin:0px 0 15px 0;}

.productdescription h1 span {font-weight:300;}

@media (max-width: 992px) {.productdescription h1 {font-size:28px; line-height:32px;  }}

@media (max-width: 768px) {.productdescription h1 {font-size:22px; line-height:28px; margin:0px 0 10px 0;}}




.productdescription h2 {font-family: 'Poppins', sans-serif; color:#000; font-size:32px; line-height:42px; font-weight:600; margin:10px 0 15px 0; text-align: center}

.productdescription h2 span {font-weight:300;}

@media (max-width: 992px) {.productdescription h2 {font-family: 'Poppins', sans-serif; color:#000; font-size:28px; line-height:32px; font-weight:600; margin:5px 0 2px 0;}}

@media (max-width: 768px) {.productdescription h2 {font-family: 'Poppins', sans-serif; color:#000; font-size:24px; line-height:28px; font-weight:600; margin:5px 0 2px 0;}}

.productdescription h3 {font-family: 'Poppins', sans-serif; color:#CCC; font-size:18px !important; line-height:22px !important; font-weight:500; margin:0 0 20px 0; padding-right:20px; }

.productdescription h3 a {color:#CCC;  text-decoration:none; border:none; transition: 0.5s;}

.productdescription h3 a:hover {color:#000; }


.productdescription h4 {font-family: 'Crimson Text', serif; font-weight:300; color:#000; font-size:22px !important; line-height:22px !important; font-weight:500; margin:0 0 25px 0; padding-right:20px; font-style:italic}

@media (max-width: 768px) {.productdescription h2 {font-family: 'Poppins', sans-serif; color:#000; font-size:26px; line-height:32px; font-weight:600; margin:0 0 10px 0;}

.productdescription h3 {font-family: 'Poppins', sans-serif; color:#CCC; font-size:16px !important; line-height18px !important; font-weight:500; margin:0 0 10px 0; padding-right:20px}

.productdescription p {font-family: 'Crimson Text', serif; font-weight:300; color:#000; font-size:14px; line-height:18px; font-weight:300; margin:0 0 15px 0; }}

.productdescription p {font-family: 'Crimson Text', serif; font-weight:300; color:#000; font-size:18px; line-height:26px; font-weight:300; margin:0 0 15px 0; }

.productdescription a {border-bottom:1px solid #000; padding-bottom:2px}

.collectionsboost {padding:45px 100px; text-align:center;    }

@media (max-width: 1200px) {.collectionsboost  { padding:15px 55px; }}

@media (max-width: 992px) {.collectionsboost  { padding:25px 35px 35px 35px !important;  }}

@media (max-width: 768px) {.collectionsboost  { padding:15px 25px 25px 25px !important; }}

.collectionsboost h4 {font-family: 'Poppins', sans-serif;  font-weight:300; text-transform:none; color:#000 ; font-size:18px; line-height:18px;margin:25px 0 30px 0; letter-spacing:3px; position:relative; padding-bottom:15px}

.collectionsboost h4::before {
  content: '';
 
}

.collectionsboost h4::after {
  content: '';
  position: absolute;
  display: block;
  width: 40px;
  height: 2px;
  background: #ccc;
  bottom: 0;
  left: calc(50% - 20px);
}

.collectionsboost h6 {font-family: 'Poppins', sans-serif;  font-weight:500; text-transform:none; color:#999 ; font-size:16px; line-height:18px;margin:25px 0 10px 0; letter-spacing:3px; position:relative; }

.collectionsboost h3 {font-family: 'Poppins', sans-serif; color:#000; font-size:38px; line-height:42px; font-weight:600; margin:15px 0 25px 0;}

@media (max-width: 992px) {.collectionsboost h3 {font-size:32px; line-height:36px;}}

.collectionsboost p {font-family: 'Crimson Text', serif; font-weight:300; color:#000; font-size:18px; line-height:26px; font-weight:300; margin:0 0 15px 0; }

.collectionsboost p:last-child {margin-bottom:0}

.iconstyle {width:40px; height:40px; margin:6px 6px; }

.iconstyles {text-align:center}

.homeborder {border-top:1px solid #eee}

@media (max-width: 992px) {.homeborder {border-top:none}}




<!----FORMNEW------>

#contacta form {
	padding: 0 25px;
	margin-top: 0px !important; 
}

#contacta {text-align:center}

#contacta .container {max-width:1250px}

#contacta h4 { font-family: 'poppins', sans-serif;  font-weight:normal; font-size:24px; line-height:28px; padding:15px 25px; color:#000; margin:25px auto;   text-transform:uppercase; letter-spacing:2px}

#contacta .text-danger {
	color: #cc0033;
	text-align: left;
}
label {
	font-size: 16px;
	font-weight: 300;
	 font-family: 'poppins', sans-serif;
	float: left;
}
#contacta .form-control {
	display: block;
	width: 100%;
	padding: 20px 20px;
	font-size: 18px;
	line-height: 1.42857143;
	color: #444;
	background-color: #fff;
	background-image: none;
	border: 1px solid #ddd;
	border-radius: 0;
	-webkit-box-shadow: none;
	box-shadow: none;
	-webkit-transition: none;
	-o-transition: none;
	transition: none;
}
#contacta .form-control:focus {
	outline: 0;
	-webkit-box-shadow: 0 0 15px #ddd;
	box-shadow: 0 0 15px #ddd;
}
.form-control::-webkit-input-placeholder {
color: #777;
}
.form-control:-moz-placeholder {
color: #777;
}
.form-control::-moz-placeholder {
color: #777;
}
.form-control:-ms-input-placeholder {
color: #777;
}
#contacta .contact-info {
	margin-bottom: 30px;
}
#contacta .contact-info hr {
	background: #ddd;
}
#contacta .contact-item {
	margin: 20px 0 40px 0;
}

.sendbutton {background:#fff; font-family: 'poppins', sans-serif;  font-weight:normal; font-size:18px; line-height:18px; padding:12px 25px; display:block; color:#000; margin:25px auto; transition: 0.4s; border:1px solid #000; text-align:center; text-transform:uppercase; letter-spacing:2px}

.sendbutton a {
  color: #bcb296;
}

.sendbutton a:hover {
  color: #fff;
  text-decoration: none; background:#a89b78;
  
}

.newprojecttitle {border-top:1px solid #eee;border-bottom:1px solid #eee;position: relative;display: flex;}

.newprojecttitle h3 {font-family: 'poppins', sans-serif;  font-weight:normal; font-size:48px; line-height:52px; color:#000; margin:15px 0 0 0;   font-weight:600; padding:0}

.newprojecttitle h4 {font-family: 'poppins', sans-serif;  font-weight:normal; font-size:32px; line-height:36px; color:#CCC ; font-weight:500; padding:0; margin:15px 0 0 0}

.newprojecttitle span {font-family: 'poppins', sans-serif;  font-weight:normal; font-size:14px; line-height:20px; color:#666;  text-transform:uppercase; letter-spacing:4px; font-weight:500}

.newprojecttitleleft {width:20%; float:left; position:relative}

.newprojecttitleright {width:80%;height:100%; float:left; position:relative; margin-left:35px}

.newprojecttitlerightinfo {position: relative;}

@media (max-width: 1200px) {.newprojecttitleright {width:80%;height:100%; float:left; position:relative; margin-left:15px}

.newprojecttitle h3 {font-family: 'poppins', sans-serif;  font-weight:normal; font-size:42px; line-height:46px; color:#000; margin:15px 0 0 0;   font-weight:600; padding:0}

.newprojecttitle h4 {font-family: 'poppins', sans-serif;  font-weight:normal; font-size:28px; line-height:32px; color:#CCC ; font-weight:500; padding:0; margin:15px 0 0 0}

.newprojecttitle span {font-family: 'poppins', sans-serif;  font-weight:normal; font-size:14px; line-height:20px; color:#666;  text-transform:uppercase; letter-spacing:4px; font-weight:500}

}

@media (max-width: 992px) {

.newprojecttitle h3 {font-family: 'poppins', sans-serif;  font-weight:normal; font-size:38px; line-height:42px; color:#000; margin:12px 0 0 0;   font-weight:600; padding:0}

.newprojecttitle h4 {font-family: 'poppins', sans-serif;  font-weight:normal; font-size:26px; line-height:28px; color:#CCC ; font-weight:500; padding:0; margin:12px 0 0 0}

.newprojecttitle span {font-family: 'poppins', sans-serif;  font-weight:normal; font-size:14px; line-height:20px; color:#666;  text-transform:uppercase; letter-spacing:4px; font-weight:500}

.newprojecttitleleft {width:30%; float:left; position:relative}

.newprojecttitleright {width:70%;height:100%; float:left; position:relative; margin-left:5px}

}

@media (max-width: 768px) {

.newprojecttitle h3 {font-family: 'poppins', sans-serif;  font-weight:normal; font-size:32px; line-height:36px; color:#000; margin:10px 0 0 0;   font-weight:600; padding:0}

.newprojecttitle h4 {font-family: 'poppins', sans-serif;  font-weight:normal; font-size:22px; line-height:24px; color:#CCC ; font-weight:500; padding:0; margin:8px 0 0 0}

.newprojecttitle span {font-family: 'poppins', sans-serif;  font-weight:normal; font-size:10px; line-height:12px; color:#666;  text-transform:uppercase; letter-spacing:3px; font-weight:500}

.newprojecttitleleft {width:30%; float:left; position:relative}

.newprojecttitleright {width:70%;height:100%; float:left; position:relative; margin-left:5px}

}

@media (max-width: 600px) {

.newprojecttitle h3 {font-family: 'poppins', sans-serif;  font-weight:normal; font-size:24px; line-height:27px; color:#000; margin:0 0 0 0;   font-weight:600; padding:0}

.newprojecttitle h4 {font-family: 'poppins', sans-serif;  font-weight:normal; font-size:16px; line-height:18px; color:#CCC ; font-weight:500; padding:0; margin:8px 0 0 0}}

.spectitle  {font-family: 'Poppins', sans-serif; color:#fff; font-size:14px !important; line-height:14px !important; font-weight:600 !important; margin:0 0 25px 0; text-transform:uppercase !important; letter-spacing:3px; display:block; background:#000; padding:5px 12px; text-align:center}

.newbespokeproductimage {position:relative; z-index:1;}

.newproductflash {background-image: url("../../img/new.svg"); background-repeat:no-repeat; position: absolute; z-index:2; height:100%; width:15%; background-size:100% auto; margin:0;  }

.productcaption {position:relative; z-index:1;}

.productcaptionoverlay {position:absolute; z-index:2; background:#fff; height:auto; width:35%; background-size:100% auto; margin:15px; padding:10px; box-shadow: 0px 0px 8px #000;}

.productcaptionoverlay h4 {font-family: 'poppins', sans-serif;  font-weight:normal; font-size:12px; line-height:16px; color:#000 ; font-weight:500; padding:0; margin:8px 0 0 0}


/* Style the Image Used to Trigger the Modal */
#myImg {
  border-radius: 5px;
  cursor: pointer;
  transition: 0.3s;
}

#myImg:hover {opacity: 0.7;}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.5); /* Black w/ opacity */
}

/* Modal Content (Image) */
.modal-content {
  margin: auto;
  display: block;
  width: 80%;
  max-width: 700px;
}

/* Caption of Modal Image (Image Text) - Same Width as the Image */
#caption {
  margin: auto;
  display: block;
  width: 80%;
  max-width: 700px;
  text-align: center;
  color: #ccc;
  padding: 10px 0;
  height: 150px;
}

/* Add Animation - Zoom in the Modal */
.modal-content, #caption {
  animation-name: zoom;
  animation-duration: 0.6s;
}

@keyframes zoom {
  from {transform:scale(0)}
  to {transform:scale(1)}
}

/* The Close Button */
.close {
  position: absolute;
  top: 15px;
  right: 35px;
  color: #f1f1f1;
  font-size: 40px;
  font-weight: bold;
  transition: 0.3s;
}

.close:hover,
.close:focus {
  color: #bbb;
  text-decoration: none;
  cursor: pointer;
}

/* 100% Image Width on Smaller Screens */
@media only screen and (max-width: 700px){
  .modal-content {
    width: 100%;
  }
}

#campaign { padding:75px 15px}

.campaignheader {padding:0}

.campaignheader h2 {color:#000; font-size:48px; line-height:52px; margin-bottom: 25px}

.campaignheader h3 {font-family: 'Crimson Text', serif; font-weight:300; font-size:32px; line-height:38px; color:#000; margin-bottom: 35px}


@media only screen and (max-width: 992px){ .campaignheader h2 {color:#000; font-size:32px; line-height:38px; margin-bottom: 25px}

.campaignheader h3 {font-family: 'Crimson Text', serif; font-weight:300; font-size:22px; line-height:28px; color:#000; margin-bottom: 35px}



}

.campaigncontent {background-color:#FFF; position:relative; z-index:2; top:-100px; padding:45px}

.campaignpic {position:relative; z-index:1; margin:35px 0}

.campaignpicover {position:absolute; background:#FFF; width:35%; padding: 0 20px 20px 0; font-family: 'Crimson Text', serif; font-weight:300; font-size:18px; line-height:22px; color:#000;  z-index:2; font-style:italic}



@media only screen and (max-width: 992px){ .campaigncontent {top:0px; margin:30px 0 0 0; padding:0; }

#campaign { padding:35px 15px}




}

@media only screen and (max-width:768px){
.campaignbox {background-color:#eee;border-right:none !important; border-bottom:2px solid #000; padding:0; margin:35px 0 !important}

.campaignleft { padding: 0 0 0 0 !important}

.campaignright { padding:25px !important}}

.campaignleft {  padding: 0 25px 0 0}

.campaignbox {background-color:#eee;  border-right:2px solid #000; padding:0; margin:45px 0 !important}

.campaignright {  padding-right:25px}

.campaignright h2 {color:#000; font-size:28px; line-height:32px; margin-bottom: 10px}

.campaignright h3 {color:#999; font-size:18px; line-height:22px; margin-bottom: 10px}

.campaignright h4 {font-family: 'Crimson Text', serif; font-weight:300; font-size:18px; line-height:22px; color:#000;  font-style:italic; margin-bottom: 20px}



.extralargepic {background: url(../../newproducts/extralargepic.jpg); background-repeat: no-repeat; background-position:center center; background-size:cover}

.extralarge {color:#fff; text-align:center; padding:125px 55px; background:url(../../newproducts/chevronlarge.svg); background-repeat: no-repeat; background-position:center center;  background-size:auto 100%}

.extralarge h2 {font-family:'Poppins', Sans-serif; font-size:42px; line-height:44px; font-weight:300; text-transform:uppercase; color:#FFF; letter-spacing:1px; margin:25px 0 15px 0}

.extralarge h3 {color:#FFF; border-bottom:1px solid #FFF; padding:7px 0px; font-family:'Poppins', Sans-serif;  text-transform:uppercase; display:inline-block; margin:0 0 25px 0; font-size:16px; line-height:16px; }

.extralarge h3 a {color:#FFF;  font-weight:300; font-size:16px; line-height:16px; letter-spacing:2px;}

.mixedboxbig {padding:65px; margin:auto auto 25px auto; background:#000; text-align:center; height:600px; position:relative}

.mixedboxsmall {padding:45px; margin:auto auto 25px auto; background:#000; text-align:center; height:300px; position:relative}

.mixedcontent {color:#FFF; text-align:center !important; width:100%;}

.mixedcontent p {color:#FFF}

.mixedcontent h3 {color:#fff; text-align:center !important; margin-top:15px; font-family: 'Crimson Text', sans-serif;  font-weight:normal; font-size:28px; line-height:32px; text-transform:uppercase}

@media (max-width: 1200px) {
	
.mixedcontent h3 {font-size:22px; line-height:26px}

.mixedboxbig {padding:25px}

.mixedboxsmall {padding:25px;}}

.mixedcontent h2 {color:#fff; text-align:center !important; margin-top:15px; font-family: 'Crimson Text', sans-serif;  font-weight:normal; font-size:36px; line-height:40px; text-transform:uppercase}

@media (max-width: 1200px) {
	
.mixedcontent h2 {font-size:22px; line-height:26px}}

.mixedcontent span {letter-spacing: 2px !important;font-family: 'Poppins', sans-serif; text-transform:uppercase; color:#FFF; font-size:14px !important; line-height:16px !important; font-weight:400}





@media (max-width: 992px) {
	
.mixedboxbig {height:300px}

.mixedboxsmall {height:300px}}

.vertical-align {
    display: flex;
    align-items: center;text-align:center; 
}

.pubfloor {background: url(../../projects/artisan-collection.jpg) center center; background-size:cover; }

.browns {background: url("../../blog/browns-restaurant.jpg") center center; background-size:cover; }

.woodcloseup {background: url(../img/woodcloseup.jpg) center center; background-size:cover; }

.woodcloseup2 {background: url("../../img/moorlands-collection2.jpg") center center; background-size:cover; }

.walnut {background: url("../../blog/walnut-oak-collection.jpg") center center; background-size:cover; }

.craftsman {background: url(../img/craftsman.jpg) center bottom; background-size:cover; }

.cherry {background: url("../../products2023/roman-way.jpg") center center; background-size:cover; }

.newport {background: url("../../blog/newport-collection.jpg") center center; background-size:cover; }


.greywood {background: url(../img/greywood.jpg) center center; background-size:cover; }


.choosing-title h2 {
  font-size: 32px;
  lineheight:32px;
  font-weight: 300;
  margin-bottom: 18px;
  padding-bottom:18px;
  color: #151515;

}

.choosing-title h2::before {
  content: '';
 
}

.choosing-title h2::after {
  content: '';
  position: relative;
  display: block;
  width: 70px;
  height: 3px;
  background: #000;
  bottom: -10px;
  left: calc(50% - 35px);
}


.chooseframe {margin:0 auto}


.newhighlight {text-align:center}

.newhighlight h3 {font-family: 'Crimson Text', serif; font-size:28px; line-height:32px; margin:15px auto 25px auto; font-weight:normal}