.clearfix:before,
.clearfix:after,
.row:before,
.row:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after,
.row:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix,
.row {
    *zoom: 1;
}

body {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	font-family:  'Montserrat', sans-serif;
	font-weight: 100; 
	background-color: #262626;
	color: #fff;
}

.respImg {
	width: 100%;
	height: auto;
}

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

p,
main li {
	font-size: 4vw;
	line-height: 6vw;
	font-weight: 400; 
}

main li {
	margin-bottom: .5em;
}

main a:link,
main a:visited,
footer a:link,
footer a:visited {
	color: #99ffff;
	text-decoration: none;
}

main a:hover,
main a:active,
footer a:hover,
footer a:active {
	color: #99ffff;
	text-decoration: underline;
}

footer p {
	font-size: 3vw;
}

main h1 {
	margin-top: 2vw;
	font-size: 6.1vw;
	font-weight: 100; 
	margin-bottom: 1vw;
}

main h2 {
	font-size: 8vw;
	font-weight: 100; 
	margin-bottom: 1vw;
}

main .textContent h2 {
	font-size: 1.8em;
	font-weight: 100; 
	margin: 1em 0 .5em 0;
}

main h3 {
	font-size: 3vw;
	font-weight: 100; 
	margin-bottom: 1vw;
}

main h4 {
	font-size: 2.5vw;
	font-weight: 100; 
	margin-bottom: 1vw;
}

main h5 {
	font-size: 2vw;
	font-weight: 100; 
	margin-bottom: 1vw;
}

main h6 {
	font-size: 6vw;
	font-weight: 100; 
	margin-bottom: 1vw;
}



.centerText {
	text-align: center;
}

.aspectRatio {
  	width: 100%;
  	position: relative; /* If you want text inside of it */
}

.aspectRatioContentWrap {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}

.attributeinput input {
	font-size: 1.6em;
}

div.required > label {
	font-size: 1.6em;
}

input[name=subscribe] {
	font-size: 1.6em;
}

form[name=subscribeform] a:last-child {
	font-size: 1.6em;
}

#aspectRatio {
	padding-top: 34.0625%; /* 1:1 Aspect Ratio */
}

#map,
#map2 {
	padding-top: 75%;
}



.sliderAspectRatio {
	padding-top: 42.5%;
}



.homePic {
	padding-top: 53.65309537%;
}

.sliderContent img {
	width: 100%;
	height: auto;
}

.videoContainer {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
}

.video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.homeSlide {
	background-size: cover;
}

main.home .row:first-child  {
	margin-bottom: 6vw;
}

.slick-dots li button:before {
    color: #fff;
  }

 .slick-dots li.slick-active button:before {
    color: #fff;
  }

  .sliderContent {
  	border-bottom: 1px solid #fff;
  }

header {
	height: 15vw;
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 100;
	border-bottom: 1px solid #fff;
}

header section {
	background-color: #262626;
	color: #fff;
	width: 100%;
	height: 15vw;
	box-sizing: border-box;
}

header section .row,
header section .row .col {
	margin-bottom: 0;
	height: 15vw;
}

header section .row .col h1 {
	margin: 0;
	height: 15vw;
}

.logo {
	fill:#FFFFFF;
	font-family:'Montserrat';
	font-weight: 300;
}

.logoTop {
	/*
	font-size: 2.35em;
	letter-spacing: .18em;
	*/
	font-size: 3.53rem;
  	letter-spacing: .63rem;
}

.logoBottom {
	/*
	font-size: 1.35em;
	letter-spacing: .79em;
	*/
	font-size: 2.04rem;
  	letter-spacing: 1.61rem;
}

header section ul {
	position: absolute;
	list-style: none;
	margin: 0;
	padding: 0;
	right: 10px;
	top: 15vw;
	width: 100vw;
	z-index: 100;
	background-color: #262626;
	left: 0;
}

#ulMainNav {
	height: 0;
	overflow: hidden;
}

#ulMainNav.navOpen {
	height: auto;
	border-bottom: 1px solid #fff;
}

header section ul li {
	display: block;
	text-transform: uppercase;
	font-size: 4vw;
	font-weight: 500;
	margin: 3vw 0;
	text-indent: 5vw;
}

#ulMainNav li a:link,
#ulMainNav li a:visited {
	color: #fff;
	text-decoration: none;
}

#ulMainNav li a:hover,
#ulMainNav li a:active {
	color: #99ffff;
	text-decoration: underline;
}

#ulMainNav li.here a:link,
#ulMainNav li.here a:visited {
	color: #99ffff;
}


#hamburger {
	display: block;
	position: absolute;
	top: 3vw;
	right: 1vw;
	cursor: pointer;
}

.hamburger {
    position: relative;
    display: inline-block;
    width: 9vw;
    height: 5.76vw;
    margin-right: 2.16vw;
    border-top: 1.44vw solid #fff;
    border-bottom: 1.44vw solid #fff;
}

.hamburger:before {
    content: "";
    position: absolute;
    top: 2.16vw;
    left: 0px;
    width: 100%;
    border-top: 1.44vw solid #fff;
}










main {
	margin-top: 15vw;
	margin-bottom: 4vw;
}

main.home {
	margin-top: 15vw;
	margin-bottom: 0;
}

.sectionMenus {
	padding-top: 50%;
	margin-bottom: 1vw;
	border: 1px solid #fff;
}

.sectionMenus h2 {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
	width: 100%;
}

main.sectionPage .sectionMenus .section {
 	background-size: cover;
 	background-repeat: no-repeat;
 	background-position: center center;
}

main.sectionPage .sectionMenus .section img,
.homeSlide img {
	width: 100%;
	height: auto;
}



.sectionMenuText {
	fill:#FFFFFF;
	stroke:#000000;
	stroke-miterlimit:10;
	font-family:'Montserrat';
	font-weight:900;
	font-size:101px;
}

.sectionMenu p {
	display: inline-block;
	vertical-align: bottom;
	margin-bottom: 0;
}

.sectionMenu .span_4 {
	padding-top: 1.8vw;
}

.sectionTitle {
	font-size: 6vw;
	height: 8vw;
	margin-bottom: .5vw;
	letter-spacing: .2vw;
	font-weight: 300;
	margin-top: 4vw;
}

#form-signup {
	width: 90%;
	margin: 1vw auto;
	font-size: 1.2vw;
	line-height: 1.6vw;
	font-weight: 400; 
}

#form-signup input {
	font-size: 4vw;
	line-height: 1.6vw;
	font-weight: 400; 
}

#form-signup input[type=text] {
	width: 70%;
	padding: 1vw;
	box-sizing: border-box;
}

#form-signup input[type=submit] {
	width: 29%;
	padding: 2.7vw;
	box-sizing: border-box;
}

.divCategories {
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
	padding: 3vw 0 1.5vw 0;
	margin: 2.5vw 0;
}


.divInstagram .col img {
	margin-bottom: 2.5vw;
}

main.home .divCategories .row,
main.home .divInstagram .row,
.row.gallery {
	margin-bottom: 0;
}

.gallery .col {
	margin-bottom: 2.5vw;
}

.divInstagram h2 {
	margin-bottom: 4vw;
}

.hlinks {
	position: relative;
	margin-bottom: 2vw;
}

.hlinks p {
	position: absolute;
	z-index: 10;
	width: auto;
	bottom: 4vw;
	left: 2.5vw;
	margin: 0;
	font-size: 8vw;
	text-shadow: 2px 2px 4px #000000;
	font-weight: 400;
	letter-spacing: .4vw;
}

.hlinks a:link p,
.hlinks a:visited p {
	color: #fff;
}

.hlinks a:hover p,
.hlinks a:active p {
	color: #99ffff;
}

footer {
	padding: 4vw 0 3vw 0;
	border-top: 1px solid #fff;
}

.h1_float {
	float: left;
	padding: 0 1.5%;
}

header h1 a {
	text-decoration: none;
}

#slide0 {
	background-image: url(../img/slider/slider0000.jpg);
	background-position: center;
}

#slide1 {
	background-image: url(../img/slider/slider1.jpg);
	background-position: center;
}

#slide2 {
	background-image: url(../img/slider/slider2.jpg);
	background-position: left;
}

#slide3 {
	background-image: url(../img/slider/slider3.jpg);
	background-position: center;
}

#slide4 {
	background-image: url(../img/slider/slider4.jpg);
	background-position: center;
}

#slide5 {
	background-image: url(../img/slider/slider5.jpg);
	background-position: center;
}

#slide6 {
	background-image: url(../img/slider/slider6.jpg);
	background-position: left;
}

#slide7 {
	background-image: url(../img/slider/slider7.jpg);
	background-position: center;
}

#slide8 {
	background-image: url(../img/slider/slider8.jpg);
	background-position: center;
}

#brushwork_pottery {
	background-image: url(../img/section-brushed.jpg);
}

#etched_pottery {
	background-image: url(../img/section-etched.jpg);
}

#sgraffito_pottery {
	background-image: url(../img/section-sgraffito.jpg);
}


#monroe {
	background-image: url(../img/section-monroe.jpg);
}

#ann_klein {
	background-image: url(../img/section-ann-klein.jpg);
}

#nat_turner {
	background-image: url(../img/section-nat-turner.jpg);
}

#somerville {
	background-image: url(../img/section-somerville.jpg);
}

#trenton {
	background-image: url(../img/section-trenton.jpg);
}

#princeton {
	background-image: url(../img/section-princeton.jpg);
}

#state_house {
	background-image: url(../img/section-state-house.jpg);
}

#river_line {
	background-image: url(../img/section-river-line.jpg);
}

#batsto {
	background-image: url(../img/section-batsto.jpg);
}

#pinelands {
	background-image: url(../img/section-pinelands.jpg);
}

#roosevelt {
	background-image: url(../img/section-roosevelt.jpg);
}

#remembrance_park {
	background-image: url(../img/section-remembrance-park.jpg);
}

#edison {
	background-image: url(../img/section-edison.jpg);
}

#bayonne {
	background-image: url(../img/section-bayonne.jpg);
}

#kitchens {
	background-image: url(../img/section-kitchens.jpg);
}

#bathrooms {
	background-image: url(../img/section-bathrooms.jpg);
}

#fireplaces {
	background-image: url(../img/section-fireplaces.jpg);
}

#thomas-edison {
	background-image: url(../img/section-thomas-edison-university.jpg);
}

#mudflat-studios {
	background-image: url(../img/section-mudflat-studios.jpg);
}



#biography {
	background-image: url(../img/section-biography.jpg);
}

#statement {
	background-image: url(../img/section-artist-statement.jpg);
}

#news {
	background-image: url(../img/section-news.jpg);
}

#studio {
	background-image: url(../img/section-studio.jpg);
}

#videos {
	background-image: url(../img/section-videos.jpg);
}

#faq {
	background-image: url(../img/section-faq.jpg);
}

#contact {
	background-image: url(../img/section-contact.jpg);
}

#directions {
	background-image: url(../img/section-directions.jpg);
}

#events {
	background-image: url(../img/section-events.jpg);
}

#contactForm {
	width: 90%;
	font-size: 4vw;
	line-height: 6vw;
}

#contactForm p { 
	clear: both;  
}

#contactForm div.required, 
#contactForm div.nonRequired { 
	clear: both; 
	padding-bottom: 1vw;  
}

#contactForm label { 
	margin-right: 1%; 
	float: left; clear: left; 
	width: 28%; 
	font-weight: bold; 
	color: #d4d1d8; 
	text-align: right; 
}

#contactForm input, 
#contactForm textarea { 
	border: 1px solid #333; 
	padding: .5vw; 
	color: #333; 
	width: 65%; 
	float: left; 
}
#contactForm input.submitButton { 
	margin-left: 29%; 
	float: none; width: auto !important; 
	background-color: #d4d1d8; 
	color: #001433; 
	padding: .5vw; 
	border: .1vw solid #333; 
	font-weight: bold; 
}

#contactForm div.error { 
	clear: both;
	margin-left: 29%;
	color: #ff53e1;
	padding-top: .5vw;
	font-weight: 700;
}

#contactForm div.valid { 
	clear: none !important; 
	float: left; 
	width: 20px !important;
	color: #7F0000; font-size: 15px; 
	background: url(/images/ok.gif) no-repeat center left !important; 
	padding-left: 0 !important; 
	font-size: 9px; 
	margin: 0; 
	height: 16px; 
	margin-left: 3px !important; 
	padding-top: 0 !important; 
}

#contactForm input.error { 
	border:1px solid #7F0000; 
	background-color:#F8E5E5;
}

#contactForm textarea.error{ 
	border: 1px solid #7F0000; 
	background-color: #F8E5E5; 
}

#contactForm p.required { 
	background: url(/img/required.gif) no-repeat 100% 3px; 
}

#contactForm div.required { 
	background: url(/img/required.gif) no-repeat 100% 3px; 
}


/* ************************************************************************************************************* */

/* Reusable column setup */
.col {
	border: 0px solid rgba(0,0,0,0);
	float: left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-moz-background-clip: padding-box !important;
	-webkit-background-clip: padding-box !important;
	background-clip: padding-box !important;
}

.row_r .col {
	float: right;
}

.col {
	margin-left:0%;
	padding:0 1.5%;
}

.col.no-padding {
	padding: 0 !important;
}
    
.row .col:first-child {
	margin-left:0;
}

.row .col .row .col:first-child {
	padding-left:0;
}  

.row .col .row .col:last-child {
	padding-right: 0;
} 

main.home .row {
	margin-bottom: 2.5vw;
}

main .row,
footer .row {
	padding: 0 2.5vw;
}

main .row.no-padding {
	padding:  0;
}

/* ----------------------------------------------------------------------------- 
    
	Column Default Names and Sizes
	
    Span 1:    8.33333333333%
    Span 2:    16.6666666667%
    Span 3:    25.0%
    Span 4:    33.3333333333%
    Span 5:    41.6666666667%
    Span 6:    50.0%
    Span 7:    58.3333333333%
    Span 8:    66.6666666667%
    Span 9:    75.0%
    Span 10:    83.3333333333%
    Span 11:    91.6666666667%
    Span 12:    100%
    
----------------------------------------------------------------------------- */   
    
.span_1 {
	width:100%;
}
.span_2 {
	width:100%;
}
.span_3 {
	width:100%;
}
.span_4 {
	width:100%;
}
.span_5 {
	width:100%;
}
.span_6 {
	width:100%;
}
.span_7 {
	width:100%;
}
.span_8 {
	width:100%;
}
.span_9 {
	width:100%;
}
.span_10 {
	width:100%;
}
.span_11 {
	width:100%;
}
.span_12 {
	margin-left:0;
	width:100%;
}

.header_1 {
	width: 83.3333333333%;
}

.header_2 {
	width: 16.6666666667%;
}

.span_ig {
	width: 50%;
}



@media screen and (min-width: 768px)  /* ≥ 768px */
{

	.col {
		margin-left:0%;
		padding:0 1.5%;
	}

	.col.no-padding {
		padding: 0 !important;
	}
        
	.row .col:first-child {
		margin-left:0;
	}    
        
	.span_1 {
		width:8.33333333333%;
	}
	.span_2,
	.span_ig {
		width:16.6666666667%;
	}
	.span_3 {
		width:25.0%;
	}
	.span_4,
	.header_1 {
		width:33.3333333333%;
	}
	.span_5 {
		width:41.6666666667%;
	}
	.span_6 {
		width:50.0%;
	}
	.span_7 {
		width:58.3333333333%;
	}
	.span_8,
	.header_2 {
		width:66.6666666667%;
	}
	.span_9 {
		width:75.0%;
	}
	.span_10 {
		width:83.3333333333%;
	}
	.span_11 {
		width:91.6666666667%;
	}
	.span_12 {
		margin-left:0;
		width:100%;
	}

	header {
		height: 6.5vw;
	}

	header section {
		height: 6.5vw;
	}

	header section .row,
	header section .row .col {
		height: 6.5vw;
	}

	header section .row .col h1 {
		height: 6.5vw;
	}

	main {
		margin-top: 6.5vw;
	}

	main.home {
		margin-top: 6vw;
	}

	header section ul {
		width: auto;
		position: absolute;
		list-style: none;
		margin: 0;
		padding: 0;
		right: 10px;
		top: 40%;
		left: auto;
		display: block;
		border-bottom: none;
	}

	#ulMainNav {
		height: auto;
	}

	#ulMainNav.navOpen {
		border-bottom: none;
	}

	header section ul li {
		display: inline-block;
		text-transform: uppercase;
		font-size: 1vw;
		font-weight: 500;
		margin: 0 1vw;
		text-indent: 0;
	}

	#hamburger {
		display: none;
	}

	main h1 {
		font-size: 3.2vw;
	}

	p, 
	main li {
		font-size: 1.2vw;
		line-height: 1.6vw;
	}

	footer p {
		font-size: 1.2vw;
	}

	main h6 {
		font-size: 1.6vw;
		font-weight: 100; 
		margin-bottom: 1vw;
	}

	#form-signup {
		width: 60%;
		margin: 1vw auto;
		font-size: 1.2vw;
		line-height: 1.6vw;
		font-weight: 400; 
	}

	#form-signup input {
		font-size: 1.2vw;
		line-height: 1.6vw;
		font-weight: 400; 
	}

	#form-signup input[type=text] {
		width: 70%;
		padding: 1vw;
		box-sizing: border-box;
	}

	#form-signup input[type=submit] {
		width: 29%;
		padding: 1vw;
		box-sizing: border-box;
	}

	main.home .divCategories .row,
	main.home .divInstagram .row,
	.gallery .col {
		margin-bottom: 2.5vw;
	}

	.gallery {
		margin-bottom: 0;
	}


	.hlinks {
		margin-bottom: 0;
	}

	.hlinks p {
		bottom: 1vw;
		left: 2.5vw;
		font-size: 2vw;
		letter-spacing: .2vw;
	}

	main h2 {
		font-size: 3.5vw;
	}

	main .textContent h2 {
		font-size: 1.8vw;
		font-weight: 100; 
		margin: 2vw 0 1vw 0;
	}

	.divInstagram h2 {
		margin-bottom: 0;
	}

	.divCategories {
		border-top: 1px solid #fff;
		border-bottom: 1px solid #fff;
		padding: 2.5vw 0 0 0;
		margin:  2.5vw 0;
	}

	.divInstagram .col img {
		margin-bottom: 0;
	}

	main h1 {
		margin-top: 0;
	}

	.sectionTitle {
		font-size: 1.4vw;
		height: 1.6vw;
		margin-bottom: .5vw;
		letter-spacing: .2vw;
		font-weight: 300;
		margin-top: 0;
	}

	footer {
		padding: 1vw 0 3vw 0;
		border-top: 1px solid #fff;
	}

	main {
		margin-bottom: 2vw;
	}

	main .row,
	footer .row {
		padding: 0;
	}

	.sectionMenus {
		padding-top: 25%;
	}

	main.sectionPage .sectionMenus .section {
	 	background-size: contain;
	 	background-repeat: no-repeat;
	 	background-position: center center;
	}

	.sliderAspectRatio {
		padding-top: 42.5%;
	}

	.homeSlide {
		background-size: cover;
	}

	#contactForm {
		width: 90%;
		font-size: 1.2vw;
		line-height: 1.6vw;
	}
}