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

KEVIN M HOFFMAN
General Screen Styles

Created by the smiling SuperFriendly team.
http://superfriend.ly/

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

/*-------------------------------------------    
    Flag
	(Thanks Jeremy: http://adactio.com/journal/5429/)
-------------------------------------------*/
body:after { content: 'small'; display: none; }


/*-------------------------------------------    
    Fonts
-------------------------------------------*/

@import url(http://fonts.googleapis.com/css?family=Merriweather);


/*-------------------------------------------    
    Base     
-------------------------------------------*/
* { margin: 0; padding: 0; }
body { font: normal 62.5%/1.5 'Merriweather', Georgia, 'Times New Roman', serif; color: #8d8d8d; background: #fff; }


/* block level */

h1 { font: bold 22px Helvetica, Arial, sans-serif; text-transform: uppercase; }
h2 { }

p, ul, dl, ol { font-size: 14px; margin: 0 0 1.5em; }


/* inline */

input, select, textarea { font-family: "ff-clan-web-pro-1", "ff-clan-web-pro-2", Helvetica, Arial, sans-serif; font-weight: 600; font-size: 18px;}

.error { color: red; }

select { font-weight: 500; }

em { font-style: italic; }
strong { font-weight: bold; }

a { text-decoration: none; transition: all 0.25s linear; -moz-transition: all 0.25s linear; -webkit-transition: all 0.25s linear; -o-transition: all 0.25s linear; color: #48aa00; }
a:hover, a:focus { color: #242424; }

img { display: block; margin: 0 10px 10px 0; max-width: 100%; }

a img { border: none; }

abbr, abbr[title], acronym { font-size: 75%; letter-spacing: 0.2em; text-transform: uppercase; border: none; }

code { font: 13px/1 Consolas, 'Courier New', Courier, monospace; color: #999; }

sub, sup { line-height: 0; }

::selection { background: #000; color: #fff; }
::-moz-selection { background: #000; color: #fff; }




/*-------------------------------------------    
    Global
-------------------------------------------*/
 
/* Phark Image Replacement - http://phark.typepad.com/phark/2003/08/accessible_imag.html */
.phark { display: block; text-indent: -9999px; background-position: 0 0; background-repeat: no-repeat; background-color: transparent; }

/* Trimming Outline in Firefox - http://snook.ca/archives/html_and_css/trimming_long_o  */
/*\*/ .phark-link { overflow: hidden; } /**/

/* Easy Clearing - http://www.positioniseverything.net/easyclearing.html */ 
.clearfix:after, .drawer:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }

.offscreen { position: absolute; left: -9999px; display: block; }

.hide { display: none; }

.no-bullets { list-style: none; }


/*-------------------------------------------    
    Modules
-------------------------------------------*/

.slide { text-align: center; padding: 3em 0; /*min-height: 100px;*/ }

.slideRow { /*background: #333 url(/i/screen/kevron-yellow-down.png) no-repeat 95% 3em;*/ position: relative; }
/*.slideRow:first-child { border-bottom: 1px solid #666; }*/
	.slideRow header { /*padding: 2em 25% 3em 15px; background: #242424 url(/i/screen/kevron-yellow-down.png) no-repeat 95% 3em; */}
	.is-active header { border-bottom: 5px solid rgba(255, 255, 255, 0.05); /*background-image: url(/i/screen/kevron-yellow-collapse.png);*/ }
/*.slideRow:hover { cursor: pointer; }*/
	.slideRow p { margin: 0 auto; color: #aaa; font-size: 12px; color: #000; width: 75%; }
	.slideRow h1 { font: 18px "ff-clan-web-pro-1", "ff-clan-web-pro-2", Helvetica, Arial, sans-serif; font-weight: 600; font-weight: 800; margin: 0 0 0.25em; color: #fff; color: #000; }
	/*.slideRow:hover h1 { color: #fdf135; }*/
    .slideRow .slide a, .row a  { border-bottom: 1px solid rgba(0, 0, 0, 0.2); color: #000; }
    .slideRow .slide a:hover, .slideRow .slide a:focus, .row a:hover, .row a:focus { border-bottom: 1px solid rgba(0, 0, 0, 0.8); }	    
    
	
	.trigger { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
	
	.slide h2 { color: #ddd; color: #222; color: rgba(34, 34, 34, 0.4); font: 12px "ff-clan-web-pro-1", "ff-clan-web-pro-2", Helvetica, Arial, sans-serif; font-weight: 600; text-transform: uppercase; margin: 0 0 0.75em; }
        .slide h2 strong { display: block; font-size: 15px; color: #222; }
	article.slide { position: relative; /*padding: 130px 15px 0; margin: 0 0 3em;*/ }
		article.slide p { font-size: 13px; }
		/*article.slide img { position: absolute; left: 15px; top: 0; max-width: 80%; }*/
		.slide img { max-width: 311px; max-width: 95%; margin-left: auto; margin-right: auto; }
		/*article.slide img { display: none !important; }*/
	
.flexslider { margin: 0; }
	
.insetSection { padding: 0 15px; }
	.insetSection h1 { font: 18px "ff-clan-web-pro-1", "ff-clan-web-pro-2", Helvetica, Arial, sans-serif; font-weight: 600; margin: 0 0 0.25em; }
	.insetSection p { font-size: 12px; }


.fullpageForm { margin: 0 0 2em; width: 90%; max-width: 550px; margin: 3em auto; }
.initialFormState:after { content: "or don’t  :(";  font-size: 12px; position: relative; left: 10px; }
	.fullpageForm .formRow { margin: 0 0 5px; }
	.fullpageForm input[type="text"], .fullpageForm input[type="email"], .fullpageForm textarea { display: block; background: transparent; border: none; width: 96%; padding: 1em 2% 1em 0; font-size: 18px; border-bottom: 1px solid #979797; font-weight:700; -webkit-appearance: none;  -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; border-radius:0;}
	
	.fullpageForm select { 
  	outline: none;
    overflow: hidden;
    text-overflow: '';
  	display: block;
  	width: 100%; 
  	font-size: 18px;
  	background: transparent url(../i/arrow-down.png) right center no-repeat;;
  	padding: 20px 0;
  	font-weight: 700;
  	color: #979797;
  	border:0;
  	border-bottom: 1px solid #979797;
  	border-radius: 0;
  	width: 98%;
  	opacity: 1;
  	
  	-webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;}
  	
  	.fullpageForm select:focus {
    	outline:none;
    }
    
    .fullpageform select::-ms-expand {
      display: none;
    }
    

  	
  	
	
	.fullpageForm input[type="submit"] { color: #fff; background: #00ABED; border: none; padding: 1em; font-size: 18px; font-weight: bold; margin: 1em 0; transition: all 0.25s linear; -moz-transition: all 0.25s linear; -webkit-transition: all 0.25s linear; -o-transition: all 0.25s linear; -webkit-appearance: none;  -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none;}
    
	.fullpageForm input[type="submit"]:hover { background: #48aa00; cursor: pointer; }



.slide .other-social-networks { width: 90%; margin-top: 20px; }
    .slide .other-social-networks a { border: none; }
    .slide .other-social-networks a:hover, .slide .other-social-networks a:focus { border: none; }
[class^="icon"] { width: 40px; height: 40px; display: inline-block; vertical-align: top; position: relative; top: -10px; margin: 0 0 0 5px; }
.icon-linkedin { background-image: url(/i/screen/icon-linkedin.png); }
.icon-twitter { background-image: url(/i/screen/icon-twitter2.png); left: -4px; top: -13px; }
.icon-flickr { background-image: url(/i/screen/icon-flickr.png); }

.backToTop a { font: 13px "ff-clan-web-pro-1", "ff-clan-web-pro-2", Helvetica, Arial, sans-serif; font-weight: 600; margin: 2000px 0 100px; color: #999; text-transform: uppercase; padding: 0 15px 70px; display: block; background: transparent url(/i/screen/kevron-top.png) no-repeat 15px bottom; }

.split-list { margin: 0 auto; text-align: center; }
    .split-list li { display: inline; border-left: 1px solid rgba(0, 0, 0, 0.2); padding: 0 10px 0 15px; font-size: 13px; color: #000; }
    .split-list li:first-child { border: none; padding-left: 0; }

p.cta { margin-top: 3em; }
    .cta a { font: 18px "ff-clan-web-pro-1", "ff-clan-web-pro-2", Helvetica, Arial, sans-serif; font-weight: 800; color: #000; text-transform: uppercase; padding: 1em 0 2.5em 0; background: transparent url(/i/screen/kevron-black.png) no-repeat center bottom; min-height: 25px; border: none !important; }
    .cta a.last-link { background-image: url(/i/screen/kevron-black-down.png); }

.row li { margin: 0 0 3em; }
    .row h2 { color: #000; font: 14px "ff-clan-web-pro-1", "ff-clan-web-pro-2", Helvetica, Arial, sans-serif; font-weight: 600; text-align: center; margin: 0 0 0.25em; }
    .row p { text-align: center; max-width: 100%; font-size: 11px; }

/*-------------------------------------------    
    Section Colors
-------------------------------------------*/
.information-design { background: #fdf135; }
.meeting-design { background: #e98334; background: #00abf0; }
.speaking-writing { background: #73cefd; background: #00abf0; background: #e98334; }
	.speaking-writing p { margin-bottom: 0.5em; }
	.speaking-writing article.slide a { color: #73cefd; background: rgba(0, 0, 0, 0.8); padding: 4px 8px; }
	.speaking-writing article.slide a:hover, .speaking-writing article.slide a:focus { color: #fff; }
.about { background: #fdc4f0; background: #eee; }
	.about p { margin-bottom: 0.5em; text-align: left;}
	.about .slide a { color: #fdc4f0; background: rgba(0, 0, 0, 0.8); padding: 4px 8px; }
	.about .slide a:hover, .about .slide a:focus { color: #fff; }	
.contact { background: #e8fded; background: #eee; border-top: 1px solid #ccc; }
	.contact img { max-width: 32px; }
	.contact p { margin-bottom: 0.75em; }
.copyright { background: #fff; }
	.copyright .slide p { color: #a3a3a3; max-width: 100%; width: 90%; font: 10px "ff-clan-web-pro-1", "ff-clan-web-pro-2", Helvetica, Arial, sans-serif; font-weight: 600; text-transform: uppercase; }

/*-------------------------------------------    
    Layout
-------------------------------------------*/
.masthead { padding: 6em 0 3em; }
	/* .masthead h1 { background-image: url(/i/screen/logo.png); width: 200px; height: 28px; margin: 0 auto; } */
	.masthead h1 { background-image: url(/i/kevin-m-hoffman.svg); background-size: 200px 18px; width: 200px; height: 28px; margin: 0 auto; }
	.masthead p { text-align: center; }
	
/*#meeting-design header { background-image: url(/i/screen/kevron-orange-down.png); }
#meeting-design.is-active header { background-image: url(/i/screen/kevron-orange-collapse.png); }*/
	/*#meeting-design:hover h1 { color: #e98334; }*/

#contact { max-width: 500px; /*margin: 0 auto; */}
	#contact h1 { color: #242424; }
	.loadingGraphic { margin: 15px 0; }



/*-------------------------------------------    
    About
-------------------------------------------*/
#about { max-width: 570px; }



/*-------------------------------------------    
    Thanks
-------------------------------------------*/
#page-thanks { padding: 15px; }
	#page-thanks h1 { font: 18px "ff-clan-web-pro-1", "ff-clan-web-pro-2", Helvetica, Arial, sans-serif; font-weight: 600; margin: 0 0 0.25em; }	


/*-------------------------------------------    
    4/29/15 gjh
-------------------------------------------*/
/*
 * Hide only visually, but have it available for screen readers:
 * http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 */

.vh {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element
 * to be focusable when navigated to via the keyboard:
 * https://www.drupal.org/node/897638
 */

.vh.focusable:active,
.vh.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/* Mailchimp */
#mc_embed_signup div#mce-responses {float:left; top:-1.4em; padding:0em .5em 0em .5em; overflow:hidden; width:90%;margin: 0 5%; clear: both;}
#mc_embed_signup div.response {margin:1em 0; padding:1em .5em .5em 0; font-weight:bold; float:left; top:-1.5em; z-index:1; width:80%;}
#mc_embed_signup #mce-error-response {display:none;}
#mc_embed_signup #mce-success-response {color:#529214; display:none;}
#mc_embed_signup label.error {display:block; float:none; width:auto; margin-left:1.05em; text-align:left; padding:.5em 0;}

#mc-embedded-subscribe {clear:both; width:auto; display:block; }
#mc_embed_signup #num-subscribers {font-size:1.1em;}
#mc_embed_signup #num-subscribers span {padding:.5em; border:1px solid #ccc; margin-right:.5em; font-weight:bold;}

#mc_embed_signup div.mce_inline_error {width: 100% !important; padding: 5px 0 !important;}
#mc_embed_signup input.mce_inline_error {border-color: #979797 !important;}

// Placeholder text is a jerk and needs all of this stuff to be styled - each individually - cannot combine selectors.
   
input::-webkit-input-placeholder {
	font-family: "ff-clan-web-pro-1", "ff-clan-web-pro-2", Helvetica, Arial, sans-serif;
	font-weight: 700;
	font-size: 18px;
	font-style: none;
	text-transform: none;
	color: #979797;
	opacity:1;
}

input::-moz-placeholder {
	font-family: "ff-clan-web-pro-1", "ff-clan-web-pro-2", Helvetica, Arial, sans-serif;
	font-weight: 700;
	font-size: 18px;
	font-style: none;
	text-transform: none;
	color: #979797;
	opacity:1;
}

input:-moz-placeholder {   /* Older versions of Firefox */
	font-family: "ff-clan-web-pro-1", "ff-clan-web-pro-2", Helvetica, Arial, sans-serif;
	font-weight: 700;
	font-size: 18px;
	font-style: none;
	text-transform: none;
	color: #979797;
	opacity:1;
}

input:-ms-input-placeholder { 
	font-family: "ff-clan-web-pro-1", "ff-clan-web-pro-2", Helvetica, Arial, sans-serif;
	font-weight: 700;
	font-size: 18px;
	font-style: none;
	text-transform: none;
	color: #979797;
	opacity:1;
} 


.newsletter { background: #1A1919;}
.newsletter h1 {color: #ffffff;}

.newsletter input::-webkit-input-placeholder {
	color: #8d8c8c;
}

.newsletter input::-moz-placeholder {
	color: #8d8c8c;
}

.newsletter input:-moz-placeholder {   /* Older versions of Firefox */
	color: #8d8c8c;
}

.newsletter input:-ms-input-placeholder { 
	color: #8d8c8c;
} 

.newsletter .fullpageForm input[type="text"], .newsletter .fullpageForm input[type="email"], .newsletter .fullpageForm textarea { 
  color: #8d8c8c;
  width: 98%;
}

.newsletter .fullpageForm input[type="submit"] {
  color: #000000; background: #fef250; margin:0;
}

  .newsletter .fullpageForm input[type="submit"]:hover { background: #48aa00;}
  
  .newsletter .nlField {
    margin-bottom: 20px;
  }
  
  .newsletter .nlSubmit input.button {
    margin: 0 auto;
  }
  

@media screen and (min-width: 480px) {
  .newsletter .nlField {
    width: calc(100% - 140px);
    float: left;
    margin-bottom: auto;
  }
  
  .newsletter .nlSubmit {
    float: right;
    width: 125px;
  }
  
    .newsletter .nlSubmit input.button {
      margin: 0;
    }
  
}
  
  

input:focus {outline:none;}
