
html {
	width: 100%;
	/*height: 100%;*/
	overflow-x:hidden;
	
	font-size: 16px !important;
}
@media (min-width:1921px) {
html {
	font-size: 22px !important;
}
}
body {
	margin: 0;
	text-align: center;
	font-family: 'Oswald', sans-serif;
	font-weight: bold;
	font-size: 1rem;
	color: white;
	/*height: 100%;*/
	width: 100%;
	overflow-x: hidden;
	background: #222 url('/images/bg-texture.png') repeat;
	}
	
	p { 
	letter-spacing: 1px;}

body h1, body .h1-mimic { margin: 1.5rem 0 2rem 0; font-size: 1.5rem; text-transform: uppercase; line-height: 1.2rem;}

body.home h1 > span, body.home h1 > a { text-decoration: none !important; cursor: pointer !important;}
body.home h1 > span, body.home h1 > a span { font-size: 1.1rem; letter-spacing: -1px; line-height: 0.6rem; display: inline-block; margin-right: 0.3rem; vertical-align: 0.15rem;}

h2 { font-size: 1.3rem; }
h3 { font-size: 1.1rem; }
h4 { font-size: 1rem; }

.pad-top { padding-top: 15px; }
.pad-btm { padding-bottom: 15px; }

body.home h2 {
	display: none;
}

iframe.instagram-media { margin: 0 auto !important; max-width: 540px;}
@media (max-width:539px) {
iframe.instagram-media { max-width: 100%;}
}
.container-slides {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-top: 60%;
}

/* Then style the iframe to fit in the container div with full height and width */
.responsive-slides {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
img.instagram { max-width: 1080px; margin: 0 auto;}
img.old-portfolio, .old-portfolio img { max-width: 764px; margin: 0 auto;}

.row.portfolio-select > div:first-child { box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
border-right: 1px solid #fff;
}
.row.portfolio-select > div:last-child { box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
border-left: 1px solid #fff;
}

@media (min-width:1200px) {
    .container.portfolio {max-width:60%;}
}

@media (min-width:1920px) {
    .container.portfolio {max-width:1170px;}
}

.portfolio img {width: 100%; height: auto;}
.portfolio p {margin: 2rem 0;}
.portfolio p img:first-of-type {margin-top: 1rem;}
.portfolio .row {margin-right:0; margin-left: 0;}

.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; margin-bottom:2.1rem; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.wistia_responsive_padding {margin-bottom:2.1rem;}

.project-container {
	margin-top:2rem; padding: 0.4rem 20px 1px 20px; font-family:'Arial', sans-serif;font-weight:normal; border-radius: 1rem;
}
.project-container:nth-child(even) {
	
	background: url("/images/halftones-background-gray.jpg") repeat 0 0 #ccc;
	background-size: 80%;
}
.project-container:nth-child(even) p, .project-container:nth-child(even) div, .project-container:nth-child(even) p *, .project-container:nth-child(even) .video-header, .project-container:nth-child(even) .video-header * {
	color: #191919 !important ;
}
.project-container p:first-child {
	margin-top:0;
	padding:0.7em 0 0 0;
}
.project-container p, .project-container div {
	letter-spacing:0;
    font-weight: bold !important;
}
.project-container .small {
	font-size:0.8em;
	opacity: 0.8;
    font-weight: normal !important;
}
.project-container .button a {
	font-size: 12px !important;
	border-radius: 44px;
	background-color: white;
	color: #747474 !important;
	margin: 2.5em 0 2.3em 0;
	text-decoration: none;
	padding:8px 16px;
	display: inline-block;
    font-weight: normal !important;
}
.project-container img, .project-container video {
	border-radius: 1rem;
}

.project-container video {
	 max-height: 1130px;
    background:#000;
} 

.project-container:nth-child(odd) {
	background: url("/images/halftones-background-invert.jpg") repeat 0 0 #333;
	background-size: 80%; 
}
.video-header {margin:0.7em 0 1em 0;letter-spacing:1px;}
video{margin-bottom:1.6em;}

body.home h3 { text-transform: uppercase; font-size: 1.3rem; margin: 0; }
	
a:link, a:active, a:visited, a:hover {color: #fff !important; text-decoration: underline; }

#new-footer a:link, #new-footer a:active, #new-footer a:visited, #new-footer a:hover { cursor: pointer !important; }
#new-footer {padding-bottom: 3rem; line-height: 2.8rem}
@media (max-width:767px) {
	#new-footer {font-size:1.4rem; line-height: 2.5rem; }
}

img {border: 0;}

ul.portfolio-type-list, ul.portfolio-type-list li { list-style: none; margin: 0; padding: 0;}
ul.portfolio-type-list li { padding: 0.5rem 0;}


ul.portfolio-type-list li a {text-transform: uppercase; border: 2px solid #fff; display: block; color: #fff !important; overflow: hidden;
  height: 0;
  padding-top: 56.25%;background: #ccc;
  position: relative;border-radius: 1rem}


ul.portfolio-type-list li img {position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;}
ul.portfolio-type-list li a > span {position:absolute; top:calc(50% - 1.1rem);left: 0;right:0;font-size:1.5rem;line-height:1.6rem; }
ul.portfolio-type-list span span {display:inline-block; margin: 0 auto; background: #191919; padding: 0.1rem 0.3rem 0.2rem 0.3rem; }
@media (max-width:767px) {
	ul.portfolio-type-list li a > span {top:calc(50% - 0.75rem);font-size:1rem;line-height:1.1rem; }
	ul.portfolio-type-list span span {padding: 0.1rem 0.3rem 0.2rem 0.3rem; }
}


.floatleft {
	float: left;
}

.floatright {
	float: right;
}

.clear {
	clear:both;
}
.alert {
	line-height: normal;
	padding: 10px;
	font-weight: normal;
	text-align: left;
	color: #191919;
}
.alert a {
	color: #0099ff;
}
.alert-warning {
	background-color: #b08922;
	color: white;
}
.alert-error {
	background-color: red;
	color: white;
}


/*font-awesome*/
.fa { color: white; }


.btn-normal a {
    color: #fff;
    display: inline-block;
    font-size: 1.35rem;
    font-weight: 400;
    letter-spacing: 1px;
	cursor: pointer;
    margin: 15px 0;
    outline: medium none;
    padding: 13px 10px 7px 15px;
    position: relative;
    text-decoration: none;
    text-shadow: 0 0 1px rgba(255, 255, 255, 0.3);
    text-transform: uppercase;
	box-sizing: border-box;
}

.btn-normal a:before, .btn-normal a:after {
    border: 3px solid #fff;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transition: transform 0.3s ease 0s, opacity 0.3s ease 0s;
    width: 100%;
}
.btn-normal a:after {
    border-color: #fff;
    opacity: 0;
    transform: translateY(-7px) translateX(6px);
}
.btn-normal a:hover:before, .btn-normal a:focus:before {
    opacity: 0;
    transform: translateY(5px) translateX(-5px);
}
.btn-normal a:hover:after, .btn-normal a:focus:after {
    opacity: 1;
    transform: translateY(0px) translateX(0px);
}
.btn-normal a:hover {
    color: #fff;
}
.btn-normal a img {
	vertical-align: middle;
}
.btn-normal a.shop-submit {
	margin: 0.7rem 0 2rem 0;
}
body.store .img-thumbnail {
	background: 0; border:0;
}
@media (max-width:767px) {
body.shop .row .img-responsive {
	width:100%;
	height: auto;
}
}
.store-subtitle {
	color: #ccc;
	font-weight: normal;
	font-style: italic;
	padding: 1em;
}

.text-left { text-align: left; }
.text-right { text-align: right; }
.text-center { text-align: center; }
.text-justify { text-align: justify; }
.text-white { color: white; } .text-white a { color: white; }

#footer {
	padding: 10px 0 20px 0;
}

/*contact*/ 

.social-links {
	margin:3rem 0 4rem 0;
}

.social-links a {
	display: inline-block;
	padding: 0.2rem 0.6rem;
}

.social-links a img {
	max-width:25px; height: auto;
}

form#contact {
	max-width:700px;
	width:50%;
	margin: 3rem auto 0 auto;
}
@media (max-width:991px) {
form#contact {
	width:80%;
}	
}
@media (max-width:767px) {
    
.social-links {
	margin-top:2rem;
}

form#contact {
	padding: 0 40px;
	width:100%;
}
form#contact input {
	width:100% !important;
	display: block;
}
.social-links a {
	margin-top:0.5rem;
	margin-left: 0.6rem;
	margin-right: 0.6rem;
}
}


form#contact textarea.form-control {
	width:100%;
	height: 200px;
	padding: 12px !important;
	font-weight: normal;
	letter-spacing: 1px;
	border-radius: 0.3rem;
}
form#contact input {
	width:46%;
	padding: 12px !important;
	min-height:48px;
	font-weight: normal;
	letter-spacing: 1px;
	border-radius: 0.3rem;
}
form#contact #name {
	float:left;
	margin-bottom:22px;
}
form#contact #email {
	float:right;
	margin-bottom:22px;
}

.form-horizontal {
    text-align: center;

}
.form-control {
    border-color: #dfdfdf;
    border-radius: 0;
	border-width: 1px;
    box-shadow: none;
    height: 30px;
    margin-bottom: 15px;
	padding: 1%;
	font-family: inherit;
	font-size: 1.1rem;
	color: #555;
}
.btn-normal a {
    color: #fff;
    display: inline-block;
    font-size: 1.35rem;
    font-weight: 400;
    letter-spacing: 1px;
	cursor: pointer;
    margin: 15px 0;
    outline: medium none;
    padding: 7px 15px;
    position: relative;
    text-decoration: none;
    text-shadow: 0 0 1px rgba(255, 255, 255, 0.3);
    text-transform: uppercase;
	box-sizing: border-box;
	border-radius: 0.3rem;
}

.btn-normal a:before, .btn-normal a:after {
    border: 3px solid #fff;
	
	border-radius: 0.3rem;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transition: transform 0.3s ease 0s, opacity 0.3s ease 0s;
    width: 100%;
}
.btn-normal a:after {
    border-color: #fff;
    opacity: 0;
    transform: translateY(-7px) translateX(6px);
}
.btn-normal a:hover:before, .btn-normal a:focus:before {
    opacity: 0;
    transform: translateY(5px) translateX(-5px);
}
.btn-normal a:hover:after, .btn-normal a:focus:after {
    opacity: 1;
    transform: translateY(0px) translateX(0px);
}
.btn-normal a:hover {
    color: #fff;
}
.btn-normal a img {
	vertical-align: middle;
}
.btn-normal a.shop-submit {
	margin: 0.7rem 0 2rem 0;
}

#thanks {
	padding: 1rem;
	color: #fff;
}
#thanks a {
	color: #fff;
}

