@charset "utf-8";
/* CSS Document */

body {
	font-family: 'Inter', sans-serif;
	background-color: #fff;
	margin: 0px;
	padding: 0px;
}

p, ul {
	font-size: 1.2vw;
}

#hideMenu {
	display: none;
}

.menu {
	display: none;
	width: 100%;
	text-align: center;
}

.menu ul {
	margin: 0;
	padding: 0;
	background-color: #fff;
	width: 100%;
	text-align: center;
}

.menu ul li {
	font-size: 1.5vw;
	font-weight: bold;
	list-style: none;
	border-bottom: 1px solid #aaa;
}

.menu ul li span {
	margin: 0px;
	padding: 0px;
	display: block;
}

.menu ul li span a {
	display: block;
	text-decoration: none;
	color: #000;
	margin: 1.5vw 0;
}

.menu ul li span a:hover {
	color:#cdac6d;
}

.header {
	position: sticky;
	top: 0px;
	left: 0px;
	margin: 0;
	font-size: 2.5vw;
	color: #000;
	background-color: #fff;
	width: 2.25vw;
	padding: 10px 20px;
	text-align: center;
	z-index: 999;
}

.header a {
	text-decoration: none;
	color: #000;
}

.footer ul {
	margin: 20px 0px 0px 20px;
	padding: 0;
}

.social {
	float: right;
	font-size: 2.5vw;
	margin: 20px;
}

.social a {
	text-decoration: none;
	color: #000;
}

.footer ul li {
	display: inline;
	margin-right: 10px;
}

.footer a {
	color: #000;
}

.logo-set {
	width: 100%;
	text-align: center;
	margin: 0px 0px 40px 0px;
	padding: 0px;
	display: flex;
}

.logo {
	width: 12vw;
	height: 12vw;
	border: 0.2vw #000 solid;
	margin: 0 auto;
	padding: 0px;
	cursor: pointer;
}

.logo img {
	padding: 0px;
	margin-top: 1vw;
	margin-bottom: 0.2vw;
	max-width: 65%;
	height: auto;
}

.logo h1 {
	font-size: 1.35vw;
	line-height: 1.3vw;
	margin:0px;
	padding:0px;
}

.float-left {
	float: left;
}

.float-right {
	float: right;
}

.logo-list {
	color: #cdac6d;
	margin: 3vw;
	padding: 0px;
}

.logo-list li {
	display: block;
	line-height: 3vw;
	font-size: 1.75vw;
}

.list-inline {
	float: left;
	margin-left: 1vw;
}

.hero {
	height: 30.7vw;
	margin: 0px;
	padding: 0px;
	display: flex;
}

.conical {
	background-color: #e5c394;
}

.conical-gradient {
	background: conic-gradient(from 45deg at 50% 50%, rgba(233, 199, 154, 1) 0%, rgba(204, 171, 107, 1) 100%);
}

.conical-gradient-sec {
	background: conic-gradient(from 45deg at 50% 50%, rgba(255, 255, 255, 1) 0%, rgba(207, 232, 252, 1) 100%);
}

.conical-gradient-sec-2 {
	background: conic-gradient(from -135deg at 50% 50%, rgba(255, 255, 255, 1) 0%, rgba(207, 232, 252, 1) 100%);
}

.sub-page-hero-bg {
	background: url("../images/headstones-designer-hero-sub-page-bg.webp")
}

.hero-headstone {
	position: relative;
	top: -3vw;
	left: 4vw;
	max-width: 85%;
	height: auto;
}

.hero-video {
	position: relative;
	top: 0;
	left: 6vw;
	max-width: 95%;
	height: auto;
}

.content-image {
	max-width: 100%;
	height: auto;
}

.content {
	display: flex;
}

.content-left {
	width: 50%;
	flex: 1;
	margin: 0px;
	padding: 0px;
	display: grid;
	align-items: center;
}

.content-right {
	width: 50%;
	flex: 1;
	margin: 0px;
	padding: 0px;
	display: grid;
	align-items: center;
}

.align-items-top {
	align-items: start !important;
}

.align-right {
	float: right;
	font-size: 2vw;
}

.padding {
	padding: 3vw 3vw 0 3vw;
}

.padding-right {
	padding: 0 3vw 0 0;
}

.h2 {
	font-size: 4vw;
	margin: 0px;
	padding: 0px;
}

.no-padding {
	padding: 0 0 2vw 0;
	margin: 0px;
}

.space {
	clear: both;
	padding: 2vw;
}

h2 {
	font-size: 4vw;
	margin: 0px;
	padding: 0px;
}

h3 {
	clear: both;
	font-size: 1.55vw;
	font-weight: 100;
}

h4 {
	clear: both;
	font-size: 1.55vw;
	font-weight: 100;
}

button {
	font-size: 1.25vw;
	font-weight: normal;
	color: #fff;
	background-color: #000;
	border-radius: 20px;
	border: 0px;
	padding: 0.75vw 2.5vw;
	cursor: pointer;
	margin-right: 1vw;
	width: 10vw;
}

.sec_button {
	background-color: #72ccc9;
	color: #000;
	font-weight: bold;
}

.third_button {
	background-color: #72ccc9;
	color: #000;
	font-weight: bold;
	width: 100%;
	padding: 1.75vw 2.5vw;
}

.center {
	text-align: center;
}

.guide {
	text-align: center;
}

video {
	width: 75%;
}

#laser-etched-black-granite-headstone {
	display: flex;
}

#traditional-engraved-headstone {
	display: flex;
}

hr {
	border: 1px solid #000;
	margin: 30px 0px 10px 0px;
}

.img-padding {
	width: 30vw !important;
	height: auto;
	margin: 0px 30px 20px 30px;
}

.img-padding-2 {
	width: 30vw !important;
	height: auto;
	margin: 0px 30px 0px 0px;
}

.i {
	display: inline-block;
	margin-bottom: 20px;
}

.i h3 {
	font-size: 10px;
	font-weight: normal;
	width: 65px;
	text-align: center;
	margin: 0;
	padding: 0;
}


.i h2 {
	font-size: 1vw;
	font-weight: normal;
	text-align: center;
	margin: 0;
	padding: 0;
}

.i img {
	max-height: 55%;
}

.j {
	display: inline-block;
	margin-bottom: 20px;
	width: 33%;
	text-align: center;
	align-items: center;
}

.button_o {
	padding: 10px 20px;
	margin: 0px 0px 20px 0px !important;
	border-radius: 20px;
	border: 3px solid #000000;	
	text-decoration: none;
	color: #000000;
	font-size: 1.5em;
	clear: both;
	display: block;
	width: 50%;
}
.button_o:hover {
	background-color: #72ccc9;
}

.feature {
	background-color: #cfe8fc;
	padding: 20px;
	border-radius: 20px;
}

.disabled {
	color: grey;
	text-decoration: line-through;
}

.row {
	width: 75%;
	margin: auto;
}

.content-left ul li, .content-right ul li {
	margin-bottom: 2vw;
}

.half-size {
	width: 25% !important;
}


input[type=text], select, textarea {
	width: 100%;
	padding: 12px;
	border: 1px solid #ccc;
	border-radius: 4px;
	box-sizing: border-box;
	margin-top: 6px;
	margin-bottom: 16px;
	resize: vertical;
  }
  
  input[type=submit] {
	background-color: #04AA6D;
	color: white;
	padding: 12px 20px;
	border: none;
	border-radius: 4px;
	cursor: pointer;
  }
  
  input[type=submit]:hover {
	background-color: #45a049;
  }
  
  .container {
	width: 60%;
	border-radius: 5px;
	background-color: #f2f2f2;
	padding: 20px;
	margin: 50px auto 50px auto;
	text-align: left;
  }

/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuI6fAZFhiI2B.woff2) format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}