
/*

Gold:  #c29f2e;
Grey:  #6d6e71;
Purple: #8d84a0;

*/

.row .column,
.row .columns {
	font-family: bilo, sans-serif;
	font-weight: 300;
	font-size: 18px;
	line-height: 25px;
	text-align: left;
	color:  #6d6e71;
}

a img {
	border: none;
}

h1,
h2,
h3 {
	margin-top: 0;
}

h1 {
	margin-bottom: 15px;
	font-family: playfair-display, serif;
	font-weight: 400;
	font-style: normal;
	font-size: 35px;
	line-height: 45px;
	color: #8d84a0;
}

h2 {
	margin-bottom: 15px;
	font-family: playfair-display, serif;
	font-weight: 400;
	font-style: normal;
	font-size: 35px;
	line-height: 45px;
	color: #8d84a0;
}

h3 {
	margin-bottom: 5px;
	font-family: liana, script;
	font-weight: 400;
	font-style: normal;
	font-size: 35px;
	line-height: 45px;
}

span {
	color:  #c29f2e;
}

p, 
.main ul, 
.main ol, 
table {
	margin-bottom: 15px;
}

p strong {
	font-family: bilo, sans-serif;
	font-weight: 500;
}

a {
	color:  #c29f2e;
	text-decoration: underline;	
}

a:hover {
	text-decoration: none;	
}


header {
	background-image: url(../img/custom-website-design.jpg);
	height: 550px;
	position: relative;
	background-size: cover;
	background-position: center;
}

header svg {
	position: absolute;
	top: 50%;
	transform: translate(-50%,-50%);
	max-width: 600px;
	left: 50%;
	width: 100%;
}

hr {
	max-width: 200px;
	margin: 30px auto;
	border: 0px;
	border-top: 2px solid #c29f2e;
}

.fullWidth.normal {
	padding: 100px 20px;
}

.fullWidth.reduced {
	padding: 50px 20px;
}

.fullWidth.noTop {
	padding: 0px 20px 100px;
	margin-top: -75px;
}

.fullWidth.white {
	background-color: #fff;
}

.fullWidth.grey {
	background-color: #f5f4f0;
}

.fullWidth.purple {
	background-color: #8d84a0;
}

.fullWidth.purple,
.fullWidth.purple h2,
.fullWidth.purple h3,
.fullWidth.purple p,
.fullWidth.purple ul,
.fullWidth.purple a {
	color: #fff;
}

.services h3,
.services h2,
.past h3,
.past h2,
.intro h3,
.intro h1 {
	text-align: center;
}

.twoCol .large-6:first-of-type {
	padding-right: 50px;
}

.twoCol .large-6:last-of-type {
	padding-left: 50px;
}

a.button,
form input.button {
	background-color: #c29f2e;
	color:  #fff;
	font-family: playfair-display, serif;
	display: inline-block;
	padding:  10px 20px !important;
	border:  0px;
	letter-spacing: 1px;
	font-size:  18px;
	line-height: 25px;
}

a.button:hover {
	background-color: #8d84a0;
}

form input.button:hover {
	background-color: #fff;
	color: #c29f2e;
}

.past .column h3 {
	background-color: #8d84a0;
	padding: 10px 20px;
	text-align: center;
	margin: 0;
	color: #fff;
}

.past .column.logo h3 {
	background-color: #aba5b7;
}

.past .column h4 {
	background-color: #c29f2e;
	color:  #fff;
	font-family: playfair-display, serif;
	padding: 10px 20px;
	text-align: center;
	margin: 0;
	font-size: 18px;
	line-height: 22px;
}

.past .column.logo h4 {
	background-color: #d4b759;
}

.past .column a,
.past .column img {
	display: block;
}

.past .column a:hover {
	opacity: 0.6;
}

.past .column {
	padding: 0 10px 20px;
}

.past img {
	display: block;
	width: 100%;
}

.sevriceList ul {
	list-style: none;
	padding-left: 0;
}

.sevriceList ul li:before {
  content: "\f058"; /* FontAwesome Unicode */
  font-family: "Font Awesome 6 Pro";
  display: inline-block;
  margin-right: 10px;
  color: #d4b759;
}

.row.sevriceList {
	max-width: 700px;
}


footer .large-12 h2,
footer .large-12 h3,
footer .large-6:first-of-type {
	text-align: center;
}

form strong {
	display: block;
	text-align: left;
	color: #fff;
}

form .large-6 input {
	width: 100%;
	padding: 10px 20px;
	border: 0;
	margin-bottom: 10px;
}

form textarea {
	width: 100%;
	padding: 10px 20px;
	border: 0;
	margin-bottom: 10px;
}


/* =MEDIA QUERIES
-------------------------------------------------------------- */
@media only screen and (max-width: 1445px) {
	.past .column {
		width: 33.3%;
		clear: none !important;
	}
}

@media only screen and (max-width: 1080px) {
	.past .column {
		width: 50%;
	}
}

@media only screen and (max-width: 1024px) {
	.twoCol .large-6:first-of-type {
    	padding-right: 0px;
	}
	.twoCol .large-6:last-of-type {
    	padding-left: 0px;
	}

	.twoCol form .large-6:first-of-type {
    	padding-right: 10px;
	}
	.twoCol form .large-6:last-of-type {
    	padding-left: 10px;
	}

}

@media only screen and (max-width: 740px) {
	header svg {
		width: calc(100% - 40px);
	}
}

@media only screen and (max-width: 710px) {
	.past .column {
		width: 100%;
		max-width: 400px;
		margin: 0 auto;
		float: none !important;
	}
}

@media only screen and (max-width: 640px) {
	.twoCol form .large-6:first-of-type {
    	padding-right: 0px;
	}
	.twoCol form .large-6:last-of-type {
    	padding-left: 0px;
	}
}
