/*--------------------------------------------------------------------------------------*/
/* Left Sticky Nav
/*--------------------------------------------------------------------------------------*/
.left-sticky-nav ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

.left-sticky-nav ul li {
	margin: 0;
	padding: 0;
	float: left;
}

.left-sticky-nav ul li a {
	display: block;
	text-decoration: none;
	color: #fff;
	border: solid 1px #fff;
	margin-left: -1px;
	padding: 20px 25px;
	font-size: 12px;
	font-weight: 500;
	font-family: 'sweet_sansbold', helvetica, sans-serif;
	letter-spacing: 1px;
	word-spacing: 0px;
	text-transform: uppercase;
	transition: 0.2s;
	background-color: rgba(41, 34, 29, 0.05);
}

.left-sticky-nav ul li a:hover, .left-sticky-nav ul li a:focus {
	color:#bda98f;
	background-color: rgba(41, 34, 29, 0.05);
}

.left-nav-container {
	width: 358px;
	height: auto;
	background-color: none;
	-ms-transform: rotate(-90deg); /* IE 9 */
    -webkit-transform: rotate(-90deg); /* Safari */
    transform: rotate(-90deg); /* Standard syntax */
    position: fixed;
    z-index: 999;
    margin-left: -151px;
    margin-top: 290px;
}

.home-icon-container a {
	max-width: 59px;
	padding: 13px;
	float: left;
	border: solid 1px #fff;
	margin-left: -1px;
	-ms-transform: rotate(90deg); /* IE 9 */
    -webkit-transform: rotate(90deg); /* Safari */
    transform: rotate(90deg); /* Standard syntax */
    transition: 0.2s;
    background-color: rgba(41, 34, 29, 0.05);
}

.home-icon-container a:hover {
	padding: 15px;
	background-color: rgba(41, 34, 29, 0.05);
}

@media (max-width: 768px) {
	.left-sticky-nav {
		display: none;
	}
}


/*--------------------------------------------------------------------------------------*/
/* Right Sticky Nav
/*--------------------------------------------------------------------------------------*/
.right-sticky-nav {
	width: 303px;
	height: auto;
	position: absolute;
	right: 0;
	z-index: 9;
	margin-right: -116px;
	margin-top: 290px;
	-ms-transform: rotate(90deg); /* IE 9 */
    -webkit-transform: rotate(90deg); /* Safari */
    transform: rotate(90deg); /* Standard syntax */
}
@media (max-width: 768px) {
	.right-sticky-nav {
		margin-right: -116px;
		width: 286px;
	}
}
.shed-builder-side-button a {
	display: inline-block;
	text-decoration: none;
	background-color: #bda98f;
	color: #fff;
	text-align: center;
	padding: 25px 30px;
	font-size: 15px;
	font-weight: 500;
	font-family: 'sweet_sansbold', helvetica, sans-serif;
	letter-spacing: 10px;
	word-spacing: 0px;
	text-transform: uppercase;
	float: left;
	transition: 0.2s;
}
@media (max-width: 768px) {
	.shed-builder-side-button a {
		padding: 17px 21px;
	}
}

.shed-builder-side-button a:hover, .shed-builder-side-button a:focus {
	background-color: #676867;
}

@media (max-width: 768px) {
	.right-sticky-nav {
		display: none;
	}
}

/*--------------------------------------------------------------------------------------*/
/* Page Up Arrow Nav
/*--------------------------------------------------------------------------------------*/
.page-up-arrow a {
	background-color: #bda98f;
	width: 71px;
	height: 71px;
	padding: 14px;
	position: fixed;
	right: 0;
	bottom: 10%;
	z-index: 99;
	transition: 0.2s;
}

.page-up-arrow a:hover, .page-up-arrow a:focus {
	background-color: #676867;
}

@media (max-width: 768px) {
	.page-up-arrow a {
		width: 50px;
		height: 50px;
		padding: 8px;
	}
}

/*--------------------------------------------------------------------------------------*/
/* Main Nav
/*--------------------------------------------------------------------------------------*/
/* Logo */
.nav-brand a img {
	max-width: 160px;
	height: auto;
	margin: 0 auto;
	margin-top: -30px;
	z-index: 2;
	position: relative;
}

.nav-brand-mobile {
	max-width: 150px;
	height: auto;
	margin: 0 auto;
	margin-top: -50px;
	padding-bottom: 15px;
	display: none;
}

/* Navbar */
.navigation {
  height: 70px;
  margin-bottom: -70px;
}

.nav-container {
  max-width: 1020px;
  margin: 0 auto;
  background-color: pink;
}

nav {
	position: absolute;
	z-index: 999;
	margin-top: 60px;
}
nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
nav ul li {
  float: left;
  position: relative;
}
nav ul li a,
nav ul li a:visited {
  display: block;
  padding: 0 15px;
  line-height: 60px;
  background: none;
  color: #fff;
  text-decoration: none;
  font-size: 12px;
  font-family: 'sweet_sansregular', helvetica, sans-serif;
  text-transform: uppercase;
  -webkit-transition: 0.2s ease;
  -moz-transition: 0.2s ease;
  -o-transition: 0.2s ease;
  transition: 0.2s ease;
}
nav ul li a:hover,
nav ul li a:visited:hover {
  color: #d8d8d8;
}
nav ul li a:not(:only-child):after,
nav ul li a:visited:not(:only-child):after {
  padding-left: 4px;
  content: ' ▾';
}
nav ul li ul li {
  min-width: 190px;
}
nav ul li ul li a {
  padding: 15px;
  line-height: 20px;
}

.nav-dropdown {
  position: absolute;
  display: none;
  z-index: 1;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.15);
  background-color: #191919;
}
nav ul.nav-dropdown li a {
  border-bottom: solid 1px #131313;
  background-color: #191919;
  color: #bda98f;
}

/* Building Nav Dropdown */
li .building-dropdown {
	width: 25%;
	height: auto;
	text-align: center;
	float: left;
}

li .building-dropdown img {
	padding-bottom: 10px;
	margin: 0 auto;
}

nav ul li ul.building-dropdown-container {
  	min-width: 1010px;
  	left: -110px;
  	padding: 50px;
}

/* Mobile navigation */
.nav-mobile {
  display: none;
  position: absolute;
  top: 0;
  right: 0;
  background: none;
  height: 70px;
  width: 70px;
}

@media only screen and (max-width: 1035px) {
  .nav-brand  {
	  display: none;
  }
  .nav-brand-mobile {
	  display: block;
  }
  .nav-mobile {
    display: block;
  }
  nav {
    width: 100%;
    padding: 70px 0 15px;
    margin-top: 0;
  }
  nav ul {
    display: none;
  }
  nav ul li {
    float: none;
  }
  nav ul li a {
    padding: 15px;
    line-height: 20px;
  }
  nav ul li ul li a {
    padding-left: 30px;
  }
  nav ul li a,
  nav ul li a:visited {
	background-color: #131313;
  }
  .nav-dropdown {
    position: static;
  }
  nav ul.nav-dropdown li a {
  	border-bottom: solid 1px #131313;
  	background-color: #191919;
  	color: #bda98f;
  }
  li .building-dropdown {
	width: auto;
	text-align: left;
	float: none;
  }
  li .building-dropdown img {
	padding-bottom: 10px;
	margin: 0 auto;
	display: none;
  }
  nav ul li ul.building-dropdown-container {
	min-width: 150px;
	left: 0px;
	padding: 0;
  }
}
@media screen and (min-width: 1036px) {
  .nav-list {
    display: block !important;
  }
}
#nav-toggle {
  position: absolute;
  left: 18px;
  top: 22px;
  cursor: pointer;
  padding: 10px 35px 16px 0px;
}
#nav-toggle span,
#nav-toggle span:before,
#nav-toggle span:after {
  cursor: pointer;
  border-radius: 1px;
  height: 2px;
  width: 35px;
  background: #ffffff;
  position: absolute;
  display: block;
  content: '';
  transition: all 300ms ease-in-out;
}
#nav-toggle span:before {
  top: -10px;
}
#nav-toggle span:after {
  bottom: -10px;
}
#nav-toggle.active span {
  background-color: transparent;
}
#nav-toggle.active span:before, #nav-toggle.active span:after {
  top: 0;
}
#nav-toggle.active span:before {
  transform: rotate(45deg);
}
#nav-toggle.active span:after {
  transform: rotate(-45deg);
}

@media (max-width: 768px) {
	.nav-brand-mobile {
		max-width: 120px;
	}
}

/* Show Gallery Link on Mobile */
.show-on-mobile {display: none;}

@media (max-width: 1035px) {
	.show-on-mobile {display: block;}
}