@import url("https://fonts.googleapis.com/css?family=Open+Sans:400,400italic,700,800");

@import url("fontawesome.min.css");
body{ margin:0px; overflow-x:hidden;}
	a {color:#333;}
	a:hover {color:#666;}
	

h1, h2, h3, h4, h5, h6 {
		text-transform: uppercase;
		font-weight: 800;
		letter-spacing: 0.04em;
		
		margin: 0 0 1em 0;
	}
	
h1 {
		font-size: 2.5em;
		margin: 0 0 .5em 0;
		line-height: 1em;
	}
	h2 {
		font-size: 2em;
		margin: 0 0 1.5em 0;
		line-height: 1em;
	}
	body, input, select, textarea {
		font-family: 'Open Sans', sans-serif;
		/*font-family: "Source Sans Pro", "sans-serif";
		font-family: 'Oswald', sans-serif;
font-family: 'Roboto Condensed', sans-serif;*/
		color: #333;
		font-weight: 400;
		font-size: 1.3em;
		
		line-height: 1.9em;font-display: swap;
	}
	.header{max-width:100%; width:100%; text-align:center;  background-color:#eee; Color:#333;background-color:white; background-image:url('/client/quartz-countertops/calacatta-idillio-quartz.jpg'); background-size:cover; background-position:center; }
	.headertext {  }
	.footer{width:100%;  text-align:center;  }
	.footer img{max-width:100%}
	.container{ max-width:1000px; margin-left:auto; margin-right:auto;   }
	.twothird { width:60%; padding:10px; }
	.onethird { padding:10px;width:31%; }
.oneforth{padding:10px;width:22%;}
	.coupon { border:thick dashed #333; padding:10px; margin:10px;}
.verticlecenter{display:flex;padding:10%; align-items: stretch}
.formstyle{ background-color:rgba(255,255,255,.3); border-radius:3px; padding:20px;}
.displayflex{ display:flex; align-items: stretch;  flex-direction: row; flex-wrap: wrap;}
.textalignleft { text-align:left}
.nav{ z-index:2; position:fixed;}
.padtext{  padding-left:5%; padding-right:5%;}
.headerlogo{ max-height:50px;}
.imagegallery{ display:flex; flex-wrap: wrap; align-items:center}
.imagegallery img{ }
.imagegallery .img{padding-left:-50%;}
.imagegallery .img:hover{width:120%}
.bigheader{ font-size:3em; line-height:1em; margin-bottom:.2em;}
.productimage{ max-width:100%}
input{ width:100%;margin:3px;}
offer span{ font-size:2em; font-weight:900; }
offer exp{ font-size:1em; font-weight:900;}
#Coupon{border:thick solid #333;  margin:10px; max-width:31%; flex-grow: 4; flex-shrink: 3;  background-color:#fff;}
#Coupon img{ max-width:100%}
#Coupon Span{ font-size:2em;  font-weight:900; padding:5%; }
#Coupon{ border-color:#333;  text-align:center}

.text{ padding:5%}
.terms{padding:5%; font-size:.7em;}
#Coupon exp{ font-size:1em; font-weight:900; }
nav { background-color:navy;}

.displyitmes{margin-top:5px; border-radius:3px; border: thin solid #333; overflow:hidden;padding:0px; text-align:center; background-color:#fff;}
.displyitmes img{width:100%; }
.imglabel{ margin-top:-125px; }
.fit {width:250px;  text-align:center; overflow:hidden; }

.flex{display:flex; align-items: stretch;  flex-direction: row; flex-wrap: wrap;}
.onethird{ margin-left:10px; max-width:31%; flex-grow: 4; flex-shrink: 3; }
.onefifth{ margin-left:10px; max-width:18%; flex-grow: 5; flex-shrink: 3; }
.article{  text-align:center; overflow:hidden; border:thin solid #ccc; background-color:white; margin:1%; padding:0%}
.article img{ margin-bottom:4%;}
.navbar{ position:fixed; z-index:1001; width:100%}
img{ max-width:100%}
@media only screen and (max-width: 900px) {
	body{ margin:0px; overflow-x:hidden;}
	
	h1.headertext {
		font-size: 1.0em;
	}
	h2 {
		font-size: 1.5em;
		margin: 0 0 .5em 0;
		
	}
 	#Coupon{ max-width:100%;}
	.twothird { min-width:100%; text-align:center; }
	.onethird { min-width:100%; text-align:left; }
	.oneforth{min-width:100%; text-align:left;}
	.onefifth{min-width:100%; text-align:left; }
	.imagegallery .image{ width:100%;}
	.displayflex{display:flex; flex-wrap: wrap;}
	.fit {width:100%;}
.fit img{width:100%;}
	h1 {	font-size: 2em;}
	.bigheader{font-size: 2em; }
	#Coupon{width:100%; }
	.header{ background-image:url('/client/calacatta-idillio-quartz-mobile.jpg'); 
}
.navbar-toggler{color:#333}

/* CSS */
.button-39 {
  background-color: #FFFFFF;
  border: 1px solid rgb(33,33,33);
  border-radius: .5rem;
  box-sizing: border-box;
 
   line-height:4rem;
  color: #111827;
  font-family: "Inter var",ui-sans-serif,system-ui,-apple-system,system-ui,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
  font-size: 1.4rem;
  font-weight: 600;
 
  padding: .75rem 1rem;
  text-align: center;
  text-decoration: none #D1D5DB solid;
  text-decoration-thickness: auto;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
}

.button-39:hover {
  background-color: rgb(66,66,66);
}

.button-39:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
}

.button-39:focus-visible {
  box-shadow: none;
}