/*
Theme Name: Vanilla Shake Media v.2
Theme URI: http://wordpress.org/
Description: Vanilla Shake Media
Author: Jonathan Vasquez
Author URI: www.jmvdesign.com
Version: 2.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: black, blue, white, fixed-width, custom-header, custom-background, sticky-post, custom-menu
Text Domain: vanillashakemedia
*/

@import "fonts/opensans/opensans.css";
@import "fonts/vanillashake/style.css";
@import "css/reset.css";

body {
	color: #000;
	/*font: 14px/20px 'OpenSansRegular', Arial, sans-serif;*/
	font-family: 'OpenSansLight';
	font-size: 14px;
	line-height: 1.6em;
	background: #fff;
	-webkit-font-smoothing: antialiased; /* fixing font issue when using transparency or animation */
}
body, html { height: 100%; }

/* NEW CLEARFIX METHOD */
.clearfix:after {
	visibility: hidden;
	display: block;
	height: 0;
	font-size: 0;
	content: " ";
	clear: both;
}

/* Trigger HasLayout for IE versions 6 and 7 */
/* IE6 */
* html .clearfix { zoom: 1; } 

/* IE7 */
*:first-child+html .clearfix { zoom: 1; } 
/* --------------------------------------------------------------------------------------------------------- */


/* responsive images */
img {
	max-width: 100%;
	height: auto;
}
/* ie8 hack */
@media \0screen {
  img { 
  	width: auto; /* for ie 8 */
  }
}
/* --------------------------------------------------------------------------------------------------------- */


/* Anchors */
a { outline: 0; }
a img { border: 0px; text-decoration: none; }
a:link, a:visited {
	color: #16bebe;
	text-decoration: none;
}
a:hover, a:active {
	color: #000;
	text-decoration: underline;
}
/* --------------------------------------------------------------------------------------------------------- */

 
/* Paragraphs */
p { margin-bottom: 1.143em; }
* p:last-child { margin-bottom: 0; }
/* --------------------------------------------------------------------------------------------------------- */

.brand-color {
	color: #16bebe;
}

mark {
	color: #000;
	background: none;
}
.top-line {
	border-top: solid 1px #e6e6e6;
}

/* Headings */
h1, h2, h3 {
	display: block;
	font-weight: normal;
}
h1 {
	color: #000;
	font-family: "proxima-nova",sans-serif;
	font-size: 45px;
	line-height: 1em;
	font-weight: 300;
	margin-bottom: 30px;
}
h2 {
	color: #9e9e9e;
	font-family: "proxima-nova",sans-serif;
	font-size: 40px;
	line-height: 1em;
	font-weight: 300;
	margin-bottom: 24px;
}
h4 {
	color: #16bebe;
	font-family: "proxima-nova",sans-serif;
	font-size: 24px;
	line-height: 1em;
	font-weight: 400;
	margin-bottom: 20px;
}
/* --------------------------------------------------------------------------------------------------------- */


/* HTML5 tags */
header, section, footer,
aside, nav, article, figure {
	display: block;
}
/* --------------------------------------------------------------------------------------------------------- */


/* LAYOUT */
.layout-container {
	position: relative;
	width: 940px;
	max-width: 100%;
	margin: 0 auto;
}
header {
	margin-bottom: 60px;
}
#top {
	/*height: 75px;*/
	padding-top: 17px;
}

/* logo */
#logo {
	display: block;
	font-size: 52px;
	color: #000;
	text-decoration: none;
	margin-top: 25px;
	float: left;
}
#logo i {
	display: none;
}

.menu-handle {
	display: none;
	width: 25px;
	height: 25px;
	font-size: 16px;
	cursor: pointer;
	position: absolute;
	top: 50px;
	right: 0;
}
.main-navigation-close {
	display: none;
}

.vsh-stamp-logo {
	display: block;
	font-size: 224px;
	color: #bcbdc0;
	text-align: center;
	margin: 50px auto;
}
.vsh-stamp-logo.desktop-mode {
	display: none;
	margin: 0 50px 0 0;
	float: left;
}
/* ------------------------------------------------------------ */


/* back to top button */
#backtotop {
	display: none; /*hid the button first*/
	position: fixed;
	right: 100px;
	bottom: 250px;
}
#backtotop a {
	display: block;
	width: 42px;
	height: 22px;
}
#backtotop a:hover {
	opacity: .8; /*mouse over fade effect*/
}
/* ------------------------------------------------------------ */


/* button style */
.btn, .btn:link,
.btn:visited,
input[type="submit"],
input[type="button"] {
	display: block;
	color: #fff;
	/*font: 14px/14px 'OpenSansLight', Arial, sans-serif;*/
	text-align: center;
	text-indent: 0;
	background: #c1c1c1 none 0 0;
	text-decoration: none;
	border: none;
	padding: 12px 50px;
	cursor: pointer;

	-webkit-appearance: none;

	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	border-radius: 0;
	-khtml-border-radius: 0;
}
.btn:hover,
.btn:active,
input[type="submit"]:hover,
input[type="button"]:hover {
	background-color: #16bebe;
}

/* button sizes */
.btn-mid {
	width: 150px;
}
.btn-center {
	margin: 10px auto;
}
/* ------------------------------------------------------------ */


/* FORMS */
form {
	display: block;
}
form fieldset {}
form fieldset legend {}

form input[type="text"],
form input[type="email"],
form input[type="tel"],
form select,
form textarea {
	width: 200px;
	color: #b4b4b4;
	font: 12px/14px 'OpenSansLight', Arial, sans-serif;
	background: #fff;
	border: #ccc solid 1px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	padding: 7px 10px;
	margin: 0;
}
form fieldset div {
	float: left;
}
form fieldset div label {
	display: block;
	clear: both;
	padding: 0 0 0 20px;
}
form fieldset div span.desc {
	display: block;
	clear: both;
	font-size: 12px;
	line-height: 12px;
	padding-left: 20px;
}
form input[type="radio"],
form input[type="checkbox"] { 
}
/* --------------------------------------------------------------------------------------------------------- */


/* contact form 7 - plugin custom styles */
.wpcf7-form fieldset br { display: none; } /* removing the line brake (<br>) added by contact form 7 plugin */
div.wpcf7-response-output {
	border: none;
	padding: 0;
	margin: 0;
}
/* --------------------------------------------------------------------------------------------------------- */


/* navigation */
.main-navigation {
	max-height: none;
	padding-top: 40px;
	float: right;
}
.main-navigation ul {
	display: block;
	list-style-type: none;
}
.main-navigation ul li {
	margin: 0 30px;
	display: inline-block;
	*display: inline;
	zoom: 1;
}
.main-navigation ul li a,
.main-navigation ul li a:link,
.main-navigation ul li a:visited {
	color: #000;
	font: 15px/19px 'OpenSansRegular', Arial, sans-serif;
	text-transform: lowercase;
	text-decoration: none;
}
.main-navigation ul li a:hover,
.main-navigation ul li a:active,
.main-navigation ul li.current_page_item a {
	color: #16bebe;
}
.main-navigation ul li.highlight-green a {
	color: #95ab28;
}
/* --------------------------------------------------------------------------------------------------------- */


/* expand link */
.hiddencontent {
	display: none;
	padding-bottom: 20px;
}
.expand {
	display: none;/* hiding expand link*/
	padding-right: 18px;
	float: right;
}
/*.arrowdown { background: url("images/arrows_down_big.jpg") right center no-repeat; }
.arrowup { background: url("images/arrows_up_big.jpg") right center no-repeat; }*/
a.expand:link,
a.expand:visited {
	text-decoration: none; 
}
a.expand:hover,
a.expand:active {
	text-decoration: underline; 
}
/* --------------------------------------------------------------------------------------------------------- */


/* bxslider script overrides */
.bx-wrapper {
	margin: 0;
}
.bx-wrapper .bx-viewport {
	box-shadow: none;
	border: none;
	left: auto;
	background: none;
}
.bx-wrapper .bx-pager {
	text-align: center;
	padding-top: 10px;
}
.bx-wrapper .bx-pager.bx-default-pager a {
	width: 9px;
	height: 9px;
	background: #ececec;
}
.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active {
	background: #16bebe;
}

/* DIRECTION CONTROLS (NEXT / PREV) */
.bx-wrapper .bx-prev {
	left: -100px;
	background: url("images/controls.png") no-repeat 0 0px;
}
.bx-wrapper .bx-next {
	right: -90px;
	background: url("images/controls.png") no-repeat -22px 0px;
}
.bx-wrapper .bx-prev:hover {
	background-position: 0 0;
}
.bx-wrapper .bx-next:hover {
	background-position: -22px 0px;
}
.bx-wrapper .bx-controls-direction a {
	width: 22px;
	height: 42px;
	margin-top: -16px;
}
/* --------------------------------------------------------------------------------------------------------- */


/* blocks */
.blocks {
	margin-bottom: 6%;
}
.blocks article {
	/*margin: 0 2.22%;*/
	float: left;
}
.contact-container .blocks article {
	float: none;
}
.blocks article:first-child {
	margin-left: 0;
}
.blocks article:last-child {
	margin-right: 0;
}
.blocks-two article {
	width: 49%;
	margin: 0 1%;
}
.blocks-three article {
	width: 31.7%;
	margin: 0 1.2%;
}
.blocks-four article {
	width: 23%;
	margin: 0 1.2%;
}
/* --------------------------------------------------------------------------------------------------------- */


/* message slider */
.message-slider-wrap {
	margin: 0px auto 65px;
}
.message-slider {
	font-size: 15px;
	text-align: center;
}
.message-slider article {
	margin-top: 4%;
}
.message-slider h1 {
	font-size: 42px;
	line-height: 1em;
	letter-spacing: -2px;
}
.message-slider h1 span {
	display: block;
}
.message-slider a {
	text-decoration: none;
}
.message-slider a:hover {
	text-decoration: underline;
}

/* bxslider script overrides */
.message-slider-wrap .bx-wrapper .bx-viewport {
	/*height: 350px !important;*/
	height: 235px !important;
}
.message-slider-wrap .bx-wrapper .bx-pager {
	bottom: 115px;
	padding-top: 0;
}
/* --------------------------------------------------------------------------------------------------------- */


/* projects thumbnails */
#main-projects {
	margin-bottom: 30px;
}
#main-projects article {
	width: 29.78%;
	/*border-bottom: #e9e9e9 solid 1px;*/
	padding-bottom: 5%;
	margin: 0 3.5% 5% 0;
	float: left;
}
#main-projects article span {
	display: block;
	text-align: center;
	/* black and white effect - css3 
	-webkit-transition: all 0.4s ease;
	   -moz-transition: all 0.4s ease;
		 -o-transition: all 0.4s ease;
		-ms-transition: all 0.4s ease;
			transition: all 0.4s ease;*/

	-webkit-transition: opacity 0.2s ease-in-out;
	   -moz-transition: opacity 0.2s ease-in-out;
		-ms-transition: opacity 0.2s ease-in-out;
		 -o-transition: opacity 0.2s ease-in-out;
			transition: opacity 0.2s ease-in-out;
}
#main-projects article span:hover {
	/* black and white effect - css3 
	-webkit-filter: grayscale(100%);*/

	zoom: 1;
	filter: alpha(opacity=80);
	opacity: 0.8;
}
#main-projects article mark {
	display: block;
	font-family: "proxima-nova",sans-serif;
	font-size: 18px;
	line-height: 1em;
	font-weight: 300;
	padding: 20px 0 14px;
}
#main-projects article p {
	color: #000;
	/*font-family: 'OpenSansLight';*/
}
/* --------------------------------------------------------------------------------------------------------- */


/* top intro */
.top-intro {
	text-align: center;
	margin-bottom: 5%;
}
.top-intro article {
	font-size: 18px;
	line-height: 35px;
	float: left;
}
.top-intro-left {
	width: 62%;
}
.top-intro-right {
	width: 38%;
	text-align: right;
	padding-top: 0%;
}
.top-intro h1 {
	font-size: 62px;
	color: #000;
	margin-bottom: 20px;
}
.top-intro h1 span {
	display: block;
	color: #adadad;
}
/* --------------------------------------------------------------------------------------------------------- */


/* people */
.people article {
	position: relative;
}
.people article div {
	/*width: 80%;*/
	width: 100%;
	height: 100%;
	color: #fff;
	/*padding: 10%;*/
	background: #000;
	filter: alpha(opacity=0);
	opacity: 0;
	zoom: 1;
	position: absolute;
	top: 0;
	left: 0;
}
.people article div span.info {
	display: block;
	height: 100%;
	padding: 10%;
}
.people article div:hover {
	filter: alpha(opacity=80);
	opacity: 0.8;
}
/* --------------------------------------------------------------------------------------------------------- */


/* inside VSH */
/* process slider */
.process-slider-container {
	text-align: center;
	margin: 40px 0;
}
.process-header {
	margin-bottom: 2%;
}
.process-header-title {
	font-size: 37px;
}

.process-slider {
	width: 100%;
	position: relative;
	overflow: auto;
}
.process-slider-info {
	font-size: 18px;
	line-height: 35px;
}
.process-slider ul li {
	list-style: none;
	padding-bottom: 50px;
	float: left;
}
.process-slider .num {
	display: block;
	color: #16bebe;
	font-family: "effra",sans-serif;
	font-size: 68px;
	line-height: 1em;
}
.process-slider-title {
	margin-bottom: 10px;
}

.process-slider .dots {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
}
.process-slider .dots li {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 5px;
  text-indent: -999em;
  background: #ececec;
  margin: 0 4px;
  cursor: pointer;
  -webkit-transition: background .5s, opacity .5s;
  -moz-transition: background .5s, opacity .5s;
  transition: background .5s, opacity .5s;
}
.process-slider .dots li.active {
  background: #16bebe;
}
/* ---------------------------------------------------------- */


/* BIO blocks */
.bio {
	text-align: left;
	margin-bottom: 90px;
}
.bio img {
	display: block;
	margin-bottom: 80px;
}
.bio-title {
	width: 20%;
	margin-right: 14px;
	float: left;
}
.bio-title h1 {
	font-size: 38px;
}
.bio-title h1 span {
	display: block;
	font-size: 13px;
	line-height: 1em;
	padding-top: 14px;
}

.bio-desc {
	width: 75%;
	font-size: 18px;
	/*font-family: 'OpenSansLight';*/
	font-weight: 300;
	line-height: 35px;
	margin: 0 0 20px 30px;
	float: left;
}
.bio-desc.sm {
	width: 36%;
}
.bio-inst {
	display: block;
	font-size: 13px;
	line-height: 1em;
	margin-top: 20px;
}

.shaker-img-desktop,
.insidevsh-img-desktop {
	display: none;
}
/* ------------------------------------------------ */


/* clients list */
.clients {
	margin-bottom: 60px;
}
.clients h1 {
	text-align: center;
}
.clients-list {
	display: block;
	font-size: 18px;
	text-align: center;
}
.clients-list li {
	display: block;
	margin-bottom: 30px;
}
.clients-list a {
	color: #000;
	text-decoration: none;
}
.clients-list a:hover {
	text-decoration: underline;
}
/* --------------------------------------------------------------------------------------------------------- */


/* testimonials */
.testimonial-slider-wrap {
	margin-top: -4%;
}
.testimonial-slider-wrap .up-peak {
	display: block;
	width: 0;
	height: 0;
	border-left: 38px solid transparent;
	border-right: 38px solid transparent;
	border-bottom: 28px solid #16bebe;
	text-indent: -9999px;
	margin: 0 auto;
}
.testimonials-box {
	width: 100%;
	color: #fff;
	font-size: 16px;
	line-height: 32px;
	font-weight: 700;
	background: #16bebe;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
          	box-sizing: border-box;
	padding: 5%;
}
.testimonials-box mark {
	display: block;
	color: #fff;
	text-align: center;
}
/* --------------------------------------------------------------------------------------------------------- */


/* work */
.work-img {
	text-align: center;
	padding: 30px 0 80px;
}
/* --------------------------------------------------------------------------------------------------------- */


/* blog */
.blogpost-container {
	margin-bottom: 100px;
}
.blogpost-section {
	margin: 30px 0 75px;
}
.blogpost-section-img {
	position: relative;
	text-align: right;
}
.blogpost-section-img img {
	display: block;
}
.blogpost-section-img .img-hover span {
	display: none;
	color: #fff;
	font-family: "proxima-nova",sans-serif;
	font-size: 42px;
	line-height: 1em;
	font-weight: 300;
	padding-right: 50px;
	position: relative;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
}
.blogpost-section-img:hover .img-hover span {
	display: block;
}
.blogpost-section-img:hover .img-hover {
	display: block;
	width: 100%;
	height: 100%;
	text-decoration: none;
	background: #000;
	opacity: .8;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}
.blogpost-section .top-intro {
	margin-bottom: 35px;
}
.blogpost-section .top-intro h1 {
	margin: 0;
}
.blogpost-section .top-intro h1 a {
	color: #000;
	text-decoration: none;
}
.blogpost-section .top-intro h1 a:hover {
	color: #16bebe;
}
.blogpost-section .top-intro h1 .post-date {
	display: block;
	font-family: 'OpenSansSemibold';
	font-size: 14px;
	line-height: 1em;
	color: #000;
	padding-top: 30px;
}
.blogpost-content {
	margin: 30px auto;
}
.blogpost-content img {
	margin: 20px auto;
}

.blogpost-footer {
	text-align: center;
	margin: 100px 0 30px;
}

.blogpost-footer-share {
	text-align: center;
}
.blogpost-footer-share mark,
.blogpost-footer-share .sep {
	display: none;
}
.blogpost-footer-share a {
	display: block;
	width: 100%;
	color: #fff;
	font-weight: 700;
	background: #16bebe;
	text-align: center;
	padding: 14px 0;
	margin: 10px 0;
}

.blogpost-back-btn,
.blogpost-back-btn:link,
.blogpost-back-btn:visited {
	display: block;
	color: #000;
	font-family: "proxima-nova",sans-serif;
	font-size: 38px;
	line-height: 1em;
	font-weight: 300;
}
.blogpost-back-btn:hover {
	color: #16bebe;
	text-decoration: none;
}
/* --------------------------------------------------------------------------------------------------------- */


/* paging navigation */
.paged-nav {
	overflow: hidden;
	font-family: "proxima-nova",sans-serif;
	font-size: 38px;
	line-height: 1em;
	font-weight: 300;
	margin: 0 0 20px;
}
.paged-nav-prev,
.paged-nav-next {
	width: 50%;
	float: left;
}
.paged-nav-next {
	text-align: right;
	float: right;
}
.paged-nav a {
	color: #000;
	text-decoration: none;
}
.paged-nav a:hover {
	color: #16bebe;
}
/* --------------------------------------------------------------------------------------------------------- */


/* sign up form */
.signup-form form fieldset div {
	float: none;
}
.signup-form form input[type="text"],
.signup-form form input[type="email"] {
	width: 100%;
	padding: 20px 0 20px 20px;
	margin-bottom: 10px;

	-webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
.signup-form input[type="submit"],
.signup-form input[type="button"] {
	display: block;
	width: 100%;
	font-size: 14px;
	background-color: #16bebe;
	padding: 18px 0;
	margin: 0;
}
/* --------------------------------------------------------------------------------------------------------- */


/* contact info */
.contact-intro {
	margin-bottom: 3%;
}
.contact-intro h1 {
	margin-bottom: 1%;
}
.contact-info,
.contact-map {
	width: 100%;
	text-align: center;
	margin: 0;
}
.contact-info .col {
	display: none;
	width: 50%;
	float: left;
}
.contact-map iframe {
	max-width: 100%;
	height: 300px;
}
/* --------------------------------------------------------------------------------------------------------- */


footer {
	line-height: 28px;
	text-align: center;
}

.social-links {
	margin-bottom: 38px;
}
.social-links i {
	display: none;
}
.social-links a {
	display: block;
	color: #000;
	text-decoration: none;
	border-top: #bcbdc0 solid 1px;
	padding: 22px 0;
}
.social-links a:hover {
	color: #16bebe;
}
.social-links span:last-child a {
	border-bottom: #bcbdc0 solid 1px;
}

.disc span {
	display: block;
	margin-bottom: 40px;
}
.contact-vitals-title {
	font-size: 40px;
	font-weight: 300;
}

.contact-vitals {
	margin-bottom: 38px;
}
.contact-vitals-section {
	padding: 0 0 14px 0;
}
.contact-vitals-section h4 {
	margin: 0;
}
.contact-vitals-section span {
	display: block;
}
.contact-vitals-section-email {
	padding-top: 12px;
}