
/* global styles-------------------------------------- */
body {
	padding-top: 130px;
	padding-bottom: 0;
	color: #413B3C; /* almost black */
	background-color: #E9E3D9; /* lt sand */
	font-family: 'Quicksand', sans-serif;
	font-size: 17px;
}

hr {
	margin-top: 0;
	margin-bottom: 5px;
	height: 1px;
	background-color: #FFF;
}

h1 {
	font-size: 35px;
}

h2 {
	font-size: 30px;
}

h3 {
	font-size: 24px;
}

h4 {
	font-size: 22px;
}

h5 {
	font-size: 20px;
}

h6 {
	font-size: 19px;
}

/* allows top padding for all anchor so not hidden behind fixed navbar */
a.anchor {
	display: block;
  position: relative;
  top: -100px;
  visibility: hidden;
}

/* tools -----------------------------------------*/

.wrap {
	margin: 0 auto;
	width: 100%;
	max-width: 1500px;
}

/* stops line breaks (add span around text and add this class) */
.nowrap {
	white-space: nowrap;
}

/* back-to-top links */
.backToTop {
  padding: 15px 50px 35px 0;
	margin-bottom: 20px;
	font-size: 2em;
}

.backToTop a {
  color: #9D8D6A; /* dk sand */
	float: right;
}

.backToTop a:hover {
	text-decoration: none;
	color: #413B3C; /* almost black */
}

.signature {
	color: #413B3C; /* amost black */
	font-size: 28px;
	font-family: 'Homemade Apple', cursive;
	margin-left: 15px;
}

/* shadow around images */
.myShadow {
	box-shadow: 4px 5px 8px rgba(97, 92, 85, 1.0);
}

.special-txt {
	color: #9D8D6A; /* dk sand */
	text-shadow: 1px 1px #FFF;
}

/* center text */
.center {
	text-align: center;
}

.move-rt {
  float: right;
}

.bg-color1 {
	background-color: #9D8D6A; /* dk sand */
}

.bg-color2 {
	background-image: linear-gradient(to bottom, #53EADF 30%, #9D8D6A 70%); /* aqua / dk sand*/
}

/* a zig-zag stitch effect on divs --------*/
.stitchV {
	width: 100%;
	overflow: hidden;
	letter-spacing: -2px;
	color: #413B3C; /* almost black */
}

.stitchV::before {
	content: "VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV"
}

.stitchV-bot {
	margin-top: -13px;
}

.stitchV-top {
	margin-bottom: -13px;
}

/* buttons -----------*/

.btn-primary {
	color: #216863; /* dk aqua */
  background-color: #53EADF; /* aqua */
  display: block;
	width: 100%;
	max-width: 205px;
	margin: 0 auto;
  border: none;
	outline: none;
}

.btn-primary:visited,
.btn-primary:focus {
  background-color: #53EADF; /* aqua */
}

.btn-primary:hover {
	color: #FFF;
  background-color: #53EADF; /* aqua */
	border: none;
	outline: none;
}

.btn-primary:active {
  background-color: #53EADF !important; /* aqua */
}

.banner-btn {
	max-width: 1500px;
	font-family: 'Montserrat', sans-serif;
	font-size: 32px;
	padding: 0;
}

.banner-btn span {
	text-decoration: underline;
}

/* paypal buttons */
.paypal-but {
	width: 100%;
	max-width: 180px;
	margin: 10px auto;
}

.paypal-but:hover {
	transform: scale(1.1);
}

/* navbar--------------------------------------------*/

.navbar {
	min-height: 100px;
	background-image: url("/images/site/nav-bg.png");
	background-position: top left;
	background-repeat: repeat-x;
	padding-bottom: 0;
	font-family: 'Montserrat', sans-serif;
	text-transform: uppercase;
	letter-spacing: 1px;
}

/* navbar page links */
.navbar-light .navbar-nav .nav-link:focus,
.navbar-light .navbar-nav .nav-link:hover {
  color: rgba(65, 59, 60, 1);
}

/* color of main active link */
.navbar-light .navbar-nav .show>.nav-link,
.navbar-light .navbar-nav .active>.nav-link {
	color: #413B3C; /* almost black */
}

/* not using bg color for main nav active so this code instead */
.navbar-nav a {
	color: #413B3C; /* almost black */
}

/* same as above notes */
.navbar-nav a:focus,
.navbar-nav a:hover {
	color: #413B3C; /* almost black */
	opacity: .7;
}

/* active link */
.navbar .navbar-nav>.active>a,
.navbar .navbar-nav>.active>a:focus,
.navbar .navbar-nav>.active>a:hover {
	color: #413B3C; /* almost black */
	opacity: .7;
}

/* bg color of collapse (hamburger) toggler */
.navbar .navbar-toggler {
	background-color: #53EADF; /* aqua */
}

/* dropdown nav link padding on left if using bg active square */
.navbar-nav .nav-link {
	padding-left: 10px;
}

/* navbar page links */
.navbar-light .navbar-nav .nav-link {
	color: #413B3C; /* almost black */
	margin: 0 8px;
	font-size: 1em;
	font-weight: 600;
}

/* hamburger collapse toggler custom sizing */
.navbar-toggler {
  margin-top: 0;
  padding: 9px 10px !important;
}

/* brand (logo) custom sizing */
.navbar-brand {
	height: 90px;
	line-height: 90px;
}

/* brand logo link */
.navbar-brand img {
	display: block;
	width: 100%;
	max-width: 200px;
}

.navbar-brand img:hover {
	transform: scale(1.1);
}

.navbar-brand img.active {
	transform: scale(1.1);
}


/* HOME PAGE------------------------------------------*/

/* header typing animation --------------------*/
.typewrite p {
	font-size: 27px;
	color: #413B3C; /* almost black */
  overflow: hidden; /* Ensures the content is not revealed until the animation */
  border-right: .10em solid #9D8D6A; /* The typwriter cursor */
  white-space: nowrap; /* Keeps the content on a single line */
  margin: 0 auto; /* Gives that scrolling effect as the typing happens */
  letter-spacing: .1em; /* Adjust as needed */
  animation:
    typing 3.5s steps(40, end),
    blink-caret .75s step-end infinite;
}

/* The typing effect */
@keyframes typing {
  from { width: 0 }
  to { width: 100% }
}

/* The typewrite cursor effect */
@keyframes blink-caret {
  from, to { border-color: transparent }
  50% { border-color: #9D8D6A;} /* dk sand */
}
/* ----------------------------------------*/

.hm-header {
	margin-top: -40px;
}

.hm-header img {
	display: block;
	width: 100%;
	max-width: 400px;
	margin: 0 auto;
}

.hm-header a {
	margin-top: 40px;
	margin-bottom: 25px;
}

.main-title p {
	font-family: 'Montserrat', sans-serif;
	font-size: 45px;
	font-weight: bold;
	margin-top: 20px;
}

.hm1 {
	background: #9D8D6A; /* dk sand */
	border-top: 2px solid #FFF;
	color: #FFF;
}

.hm1 .row {
	padding-top: 35px;
	padding-bottom: 25px;
}

.hm1 h2,
.hm2 h1,
.hm3 h2 {
	font-family: 'Montserrat', sans-serif;
}

.hm2 h1 {
	color: #9D8D6A; /* dk sand */
}

.hm2 {
	margin-top: 35px;
	margin-bottom: 20px;
}

.hm2 img {
	display: block;
  width: 100%;
	max-width: 470px;
  margin: 0 auto;
}

.hm3 {
	background: #9D8D6A; /* dk sand */
	color: #FFF;
}

.hm3 .row {
	padding-top: 40px;
	padding-bottom: 30px;
}

.hm3 .btn {
	margin-top: 40px;
	margin-bottom: 20px;

}

.hm4 {
  margin-top: 35px;
	margin-bottom: 15px;
}

.hm4 p {
	text-align: justify;
}

.hm4 h3 {
	font-family: 'Montserrat', sans-serif;
  text-align: center;
  padding-top: 20px;
}

.hm4 img {
  display: block;
  width: 100%;
  margin: 0 auto;
}

.hm4 .btn {
	margin-top: 30px;
	margin-bottom: 20px;
}

.hm5 {
	background: #9D8D6A; /* dk sand */
}

.hm5 span {
	font-weight: bold;
}

.hm5 img {
  width: 100%;
  max-width: 160px;
}

.hm5 .row {
	padding-top: 40px;
	padding-bottom: 25px;
}

/* latest blog post */
.hm-article img {
	width: 100%;
	max-width: 1000px;
}

.hm6 {
	margin-top: 35px;
}

/* read more... link for latest blog post */
.rt-marg-link {
	float:right;
}

.rt-marg-link h5 {
	padding-bottom: 30px;
}

/* aside - right column */
aside {
	margin-top: -13px;
}

.aside-content {
	padding: 40px 20px;
}

.aside-book h1 {
	color: #53EADF; /* aqua */
	font-weight: bold;
}

.aside-book h6 {
	color: #53EADF; /* aqua */
}

.aside-book p {
	color: #FFF;
}

/* book thumbnail img */
.book-thumb {
	display: block;
	width: 100%;
	max-width: 350px;
	margin: 0 auto;
}

.aside-book2 {
	padding-top: 20px;
}

.aside-book2 p {
	color: #FFF;
}

.aside-book2 h1 {
	font-family: 'Montserrat', sans-serif;
	font-weight: bold;
	color: #FFF;
}

.aside-book2 span {
	font-weight: bold;
	color: #53EADF; /* aqua */
}

/* COPY PAGE --------------------------------------------- */

.copy1 {
	margin-top: -40px;
	padding-top: 40px;
	background-image: linear-gradient(to bottom right, #53EADF, #9D8D6A 55%); /* aqua / dk sand*/
}

.copy1 img {
	display: block;
	width: 100%;
	max-width: 800px;
	margin: 0 auto;
}

.copy2,
.copy4 {
	margin-top: 35px;
}

.copy2 .row{
	margin-top: 25px;
	margin-bottom: 25px;
}

.copy2 h1,
.copy2 h3,
.copy3 h3,
.copy4 h1 {
	font-family: 'Montserrat', sans-serif;
}

.copy2 h1,
.copy4 h1 {
	text-align: center;
	padding-bottom: 20px;
	color: #9D8D6A; /* dk sand */
}

.copy3 {
	background: #9D8D6A; /* dk sand */
}

.copy3 .row {
	padding-top: 50px;
	padding-bottom: 30px;
}

.copy3 .btn {
	margin-top: 35px;
	margin-bottom: 20px;
}

.copy3 img {
	display: block;
	width: 100%;
	max-width: 600px;
	margin: 0 auto;
}

/* DESIGN PAGE (portfolio)-------------------------------- */

.design1 {
	color: #FFF;
	padding: 25px 0 50px 0;
	margin-top: -40px;
}

.design1 .row {
  padding-top: 50px;
}

.design1 h1 {
	font-family: 'Montserrat', sans-serif;
	color: #413B3C; /* almost black */
	font-weight: bold;
}

.design2 h1,
.design4 h1,
.design5 h1 {
	font-family: 'Montserrat', sans-serif;
	color: #9D8D6A; /* dk sand */
}

.design1 h4 {
	color: #413B3C; /* almost black */
}

.design1 img,
.design3 img,
.design4 img,
.design5 img,
.design6 img {
	width: 100%;
}

.design1 img {
  max-width: 700px;
	padding-bottom: 10px;
}

.design2 {
  margin-top: 35px;
}

.design2 .row {
	padding: 10px;
}

.design2 h1 {
 text-align: center;
}

.design2 a {
  text-decoration: none;
}

.design2,
.design4,
.design5 {
	margin-bottom: 50px;
}

.design3 {
	background-color: #9D8D6A; /* dk sand */
}

.design3 .row {
	padding-top: 50px;
	padding-bottom: 30px;
}

.design3 h2{
	font-family: 'Montserrat', sans-serif;
}

.design3 img {
	margin-bottom: 20px;
}

.design4 {
	margin-top: 35px;
}

.design4 h3 {
	padding-top: 15px;
}

.design4 p {
	text-align: justify;
}

.design6 {
	color: #FFF;
	background: #9D8D6A; /* dk sand */
}

.design6 span {
	font-weight: bold;
}

.design6 img {
  max-width: 160px;
}

.design6 .row {
	padding-top: 40px;
	padding-bottom: 25px;
}

/* text: portfolio */
.port {
  width: 100%;
  text-align: center;
	color: #FFF;
	word-spacing: 4px;
	letter-spacing: 2px;
  padding: 15px 0 10px 0;
}

/* hover img overlay animation */
.port-container {
  position: relative;
	background: linear-gradient(to right, #9D8D6A, #FFF, #9D8D6A);
}

.port-img {
  display: block;
  width: 100%;
	padding: 15px;
}

.port-txt h3,
.design5 span {
	font-weight: bold;
}

.port-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(83, 234, 223, 0.6); /* aqua */
	opacity: 1;
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: .5s ease;
}

.port-container:hover .port-overlay {
  height: 100%;
}

.port-txt {
  color: #413B3C; /* almost black */
  font-size: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}

/* MODALS ------------------*/

.modal-dialog-right {
  margin-right: 0;
  margin-top: 0;
  margin-bottom: 0;
}

.modal-content,
.modal-copy {
  border: none;
  border-radius: 0;
  color: #413B3C; /* almost black */
	width: 100%;
  height: 100%;
	padding: 25px;
	background: #E9E3D9; /* lt sand */
}

.modal-content img {
  display: block;
  width: 100%;
  max-width: 640px;
  margin: 0 auto;
}

.modal-content h4 {
  padding-bottom: 20px;
	color: #9D8D6A; /* dk sand */
}

.modal-content h1 {
	color: #9D8D6A; /* dk sand */
}

.modal-content p,
.modal-content ul {
  font-size: 15px;
}

/* close 'X' on modal */
.close {
  position: absolute;
  top: 20px;
  right: 20px;
  font-size: 2rem;
}

/* modal main text */
.description {
  text-align: justify;
	padding-left: 0;
}

/* modal facts: date, client, role, url, etc */
.facts {
  color: #9D8D6A; /* dk sand */
	padding: 5px 0;
}

/* BOOK PAGE----------------------------------------------------------*/

.book1 {
	margin-top: -40px;
	padding-top: 35px;
	padding-bottom: 35px;
	background-color: #9D8D6A; /* dk sand */
	color: #FFF;
}

.book1 p {
	font-size: 18px;
}

.book1 h1 {
	font-weight: bold;
}

.book1 h1,
.book1 h2 {
	color: #53EADF; /* aqua */
	text-align: center;
}

.book1 img {
	display: block;
	width: 100%;
	max-width: 450px;
	margin: 0 auto;
	margin-bottom: 20px;
}

.book2,
.book3 {
	margin-top: 40px;
}

.book3 h1 {
	font-family: 'Montserrat', sans-serif;
	color: #9D8D6A; /* dk sand */
}

.book3 span {
	font-weight: bold;
}

.book2 img,
.book3 img {
	display: block;
	width: 100%;
	max-width: 600px;
	margin: 0 auto;
}

/* BLOG PAGE (blog.html)----------------------------------------------------------*/

.blog-main li.bg-color1 {
	padding-bottom: 15px;
}

.blog-main h1 {
	font-family: 'Montserrat', sans-serif;
	padding-bottom: 15px;
}

.blog-main h3 {
	color: #53EADF; /* aqua */
	padding-top: 15px;
	text-decoration: underline;
	font-weight: bold;
}

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

.blog-main li {
	padding-left: 15px;
}

.blog-main li a {
	color: #FFF;
}

/* POSTS (post.html)----------------------------------------------------------------*/

.blog-image {
  margin-top: -40px;
  margin-bottom: .5em;
}

.blog-image img {
  width: 100%;
}

.blog-arrows {
  margin: 0 auto;
  margin-bottom: .5em;
  width: 90%;
  font-size: 2em;
}

.blog-arrows a {
  color: #9D8D6A; /* dk sand */
}

.blog-arrows a:hover {
  text-decoration: none;
	opacity: .7;
}

/* bottom arrows */
.bot-arrows {
	text-align: center;
}

/* blog post date */
.mini-txt {
	font-size: 16px;
}

/* admin/post.html */
.posts img {
	display: block;
	width: 100%;
	margin: 0 auto;
	padding-bottom: 35px;
}

/* ABOUT PAGE ------------------------------------------------------*/

.about1 img {
	display: block;
	width: 100%;
	max-width: 400px;
	margin: 15px auto;
}

.about1 h1 {
	font-family: 'Montserrat', sans-serif;
	padding-bottom: 15px;
}

.about2 img {
	display: block;
	width: 100%;
	max-width: 500px;
	margin: 0 auto;
}

/* CONTACT PAGE -----------------------------------------------------*/

.contact1 .row {
	margin-bottom: 30px;
}

.contact1 h1 {
	font-family: 'Montserrat', sans-serif;
	padding-bottom: 15px;
}

.myPic {
  display: block;
  width: 100%;
  max-width: 450px;
	margin: 0 auto;
	margin-bottom: 20px;
}

.faq-sec {
	color: #FFF;
}

.faq-sec .row {
	padding-bottom: 30px;
}

.faq-sec h4 {
	font-weight: bold;
}

.faq-sec h1 {
	font-family: 'Montserrat', sans-serif;
  color: #53EADF; /* aqua */
	padding-top: 35px;
	padding-bottom: 50px;
	word-spacing: 4px;
}

.faq-sec span {
	text-decoration: underline;
}

.contact-form h1 {
	font-family: 'Montserrat', sans-serif;
  color: #53EADF; /* aqua */
	word-spacing: 4px;
	padding-top: 30px;
	padding-bottom: 35px;
}

.contact-form form {
	padding-bottom: 50px;
}

/* form code ---------------*/
.contacts-table {
    width: 100%;
}
.contacts-table th {
    text-align: center;
}
.contacts-table th.message {
    text-align: left;
}
.contacts-table td {
    border: solid 1px black;
    padding: 3px;
    vertical-align: top;
}
.contacts-table td pre {
    font-family: 'Quicksand', sans-serif;
    font-size: 17px;
}

.name input,
.email input,
.phone input,
.website input {
	width: 100%;
	max-width: 300px;
	border: 2px solid #7C6F53; /* super dark sand */
}

.message textarea {
	width: 100%;
	max-width: 500px;
	border: 2px solid #7C6F53; /* super dark sand */
}

/* footer----------------------------------------------*/

footer {
	text-align: center;
	display: block;
	width: 100%;
	max-width: 1500px;
	margin: 0 auto;
}

footer p {
	padding-bottom: 0;
}

.sitemap-links {
	display: block;
	margin: 0 auto;
	width: 100%;
	text-align: center;
	padding: 25px;
}

.sitemap-links a {
	color: #9D8D6A; /* dk sand */
	padding-left: 10px;
	padding-right: 10px;
}

.sitemap-links a:hover {
	color: #413B3C; /* almost black */
}

/* copyright */
.copyright {
	font-size: 10px;
	padding: 0 20px;
}

/* RESPONSIVE------------------------------------------------------*/

/* Large Devices, Large Desktops, Wide Screens */
@media screen
and (min-width: 1500px){
	body {
		background-image:  url("/images/site/footprint.trans.png");
		background-position: top right;
		background-repeat: repeat-y;
	}
}

@media screen
and (min-width: 1090px) {
	.intro {
		padding-top: 10px;
		padding-bottom: 20px;
	}
	.header-col {
		padding-right: 50px;
	}
	.main-title p {
		margin-top: 130px;
	}
}

@media screen
and (max-width: 1024px) {
	.navbar .nav-item {
	background-color: #E9E3D9; /* lt sand */
	}
	/* active link */
	.navbar .navbar-nav>.active>a,
	.navbar .navbar-nav>.active>a:focus,
	.navbar .navbar-nav>.active>a:hover {
		background-color: #FFF;
		color: #413B3C; /* almost black */
		border-radius: 4px;
	}
}

@media screen
and (min-width: 1024px)
and (max-width:1089px) {
	.main-title p {
		margin-top: 100px;
		font-size: 39px;
	}
}

/* Medium Devices, Landscape Tablets, Laptops, Desktops */
@media screen
and (min-width: 992px)
and (max-width: 1199px){

}

/* myMedia */
@media screen
and (min-width: 768px){
	.modal-dialog-right {
	margin-right: -15px;
	}
}

/* Small Devices, Landscape Phones and Phablets, Portrait Tablets, Small Desktops */
@media screen
and (min-width: 768px)
and (max-width: 991px){

}

/* myMedia */
@media screen
and (max-width: 768px){
	.hm-header img {
		max-width: 250px;
	}
	.main-title p{
		font-size: 30px;
	}
	.typewrite p {
		font-size: 1em;
	}
	.mediaPad {
		padding-top: 20px;
	}
	.port-container {
		margin-bottom: 20px;
	}
	.copy3-sec .btn {
		margin-bottom: 25px;
	}
	.fa-icon-social i {
		font-size: 2em;
	}
	.connect {
		font-size: 25px;
	}
	.book-sec img {
		margin-bottom: 25px;
	}
	.banner-btn {
		font-size: 1em;
	}
}

/* Extra Small Devices, Portrait Phones */
@media screen
and (min-width: 480px)
and (max-width: 767px){

}

/* Custom, iPhone Retina */
@media screen
and (max-width: 359px){
	.typewrite p {
		white-space: normal;
	}
	.port h1 {
		font-size: 25px;
	}
}
