/**
 * =================================================================== 
 *
 *  Kards v1.0 Main Stylesheet
 *  url: styleshout.com
 *  03-01-2016
 *  ------------------------------------------------------------------
 *  TOC:
 *  01. webfonts and iconfonts
 *  02. base style overrides
 *  03. typography & general theme styles
 *  04. preloader
 *  05. forms
 *  06. buttons 
 *  07. other components
 *  08. common styles
 *  09. header styles
 *  10. intro
 *  11. about
 *  12. resume
 *  13. portfolio
 *  14. call-to-action section
 *  15. services
 *  16. stats
 *  17. contact
 *  18. footer
 *
 * =================================================================== 
 */


/** 
 * ===================================================================
 * 01. webfonts and iconfonts - (_document-setup.scss)
 *
 * ------------------------------------------------------------------- 
 */
@import url("/css/fonts.css");
@import url("/css/font-awesome.min.css");
@import url("/css/micons.css");


/** 
 * ===================================================================
 * 02. base style overrides - (_document-setup.scss)
 *
 * ------------------------------------------------------------------- 
 */
html {
	font-size: 10px;
}

@media only screen and (max-width:1024px) {
	html {
		font-size: 9.411764705882353px;
	}
}
@media only screen and (max-width:768px) {
	html {
		font-size: 10px;
	}
}
@media only screen and (max-width:500px) {
	html {
		font-size: 9.411764705882353px;
	}
	.mobileHide {display: none!important;}
	.resume-header h2 {left: auto!important;}
	#resume .asu i {top: 7px!important;}
	#resume .fiji i {top: 4px!important;}
	.slideshow-inner, .polaroidWrapper .item {width: 100%!important;}
	.owl-page.active, .dot:hover {background-color: transparent!important;}
	#resume .asu i {top: 1px !important;}
	#resume .asu i {2.15em;}
	.verifyPMI {position: relative; top: 20px;}
	.timeline-content h5 a {letter-spacing: 0;}
	footer ul.footer-profiles {display: table; width: 55%;}
	div.copyright {width: 80%;}
}

html, body {
	height: 100%;
}
body {
	background: #fff;
	font-family: "lora-regular", serif;
	font-size: 1.7rem;
	line-height: 3rem;
	color: #333;
}

/**
 * links - (_document-setup.scss)
 * -------------------------------------------------------------------
 */
a, a:visited {
	color: inherit;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
a:hover, a:focus, a:active {
	color: #67009C;
	outline: 0;
}

/** 
 * ===================================================================
 * 03. typography & general theme styles - (_document-setup.scss)
 *
 * ------------------------------------------------------------------- 
 */
h1, h2, h3, h4, h5, h6, .h01, .h02, .h03, .h04, .h05, .h06 {
	font-family: "poppins-semibold", sans-serif;
	color: #313131;
	font-style: normal;
	text-rendering: optimizeLegibility;
	margin-bottom: 2.1rem;
}
h3, .h03, h4, .h04 {
	margin-bottom: 1.8rem;
}
h5, .h05, h6, .h06 {
	font-family: "poppins-bold";
	margin-bottom: 1.2rem;
}
h1, .h01 {
	font-size: 3.1rem;
	line-height: 1.355;
	letter-spacing: -.1rem;
}
@media only screen and (max-width:600px) {
	h1, .h01 {
		font-size: 2.6rem;
		letter-spacing: -.07rem;
	}
}
h2, .h02 {
	font-size: 2.4rem;
	line-height: 1.25;
}
h3, .h03 {
	font-size: 2rem;
	line-height: 1.5;
}
h4, .h04 {
	font-size: 1.7rem;
/*	line-height: 1.5;*/
	line-height: initial;
}
h5, .h05 {
	font-size: 1.4rem;
	line-height: 1.714;
	text-transform: uppercase;
	letter-spacing: .15rem;
}
h6, .h06 {
	font-size: 1.3rem;
	line-height: 1.846;
	text-transform: uppercase;
	letter-spacing: .15rem;
}
p img {
	margin: 0;
}
p.lead {
	font-family: "lora-regular", serif;
	font-size: 2rem;
	line-height: 1.8;
	color: #888888;
}
@media only screen and (max-width:768px) {
	p.lead {
		font-size: 1.7rem;
	}
}
em, i, strong, b {
	font-size: 1.7rem;
	line-height: 3rem;
	font-style: normal;
	font-weight: normal;
}
em, i {
	font-family: "lora-italic", serif;
}
strong, b {
	font-family: "lora-bold", serif;
}
small {
	font-size: 1.2rem;
	line-height: inherit;
}
blockquote {
	margin: 3rem 0;
	padding-left: 4rem;
	position: relative;
}
blockquote:before {
	content: "\201C";
	font-size: 8rem;
	line-height: 0px;
	margin: 0;
	color: #313131;
	font-family: arial, sans-serif;
	position: absolute;
	top: 3rem;
	left: 0;
}
blockquote p {
	font-family: georgia, serif;
	font-style: italic;
	padding: 0;
	font-size: 1.9rem;
	line-height: 1.737;
}
blockquote cite {
	display: block;
	font-size: 1.3rem;
	font-style: normal;
	line-height: 1.616;
}
blockquote cite:before {
	content: "\2014 \0020";
}
blockquote cite a, blockquote cite a:visited {
	color: #888888;
	border: none;
}
abbr {
	font-family: "poppins-bold", serif;
	font-variant: small-caps;
	text-transform: lowercase;
	letter-spacing: .05rem;
	color: #888888;
}
var, kbd, samp, code, pre {
	font-family: Consolas, "Andale Mono", Courier, "Courier New", monospace;
}
pre {
	padding: 2.4rem 3rem 3rem;
	background: #F1F1F1;
}
code {
	font-size: 1.4rem;
	margin: 0 .2rem;
	padding: .3rem .6rem;
	white-space: nowrap;
	background: #F1F1F1;
	border: 1px solid #E1E1E1;
	border-radius: 3px;
}
pre > code {
	display: block;
	white-space: pre;
	line-height: 2;
	padding: 0;
	margin: 0;
}
pre.prettyprint > code {
	border: none;
}
del {
	text-decoration: line-through;
}
abbr[title], dfn[title] {
	border-bottom: 1px dotted;
	cursor: help;
}
mark {
	background: #FFF49B;
	color: #000;
}
hr {
	border: solid #d2d2d2;
	border-width: 1px 0 0;
	clear: both;
	margin: 2.4rem 0 1.5rem;
	height: 0;
}

/**
 * Lists - (_document-setup.scss)  
 * -------------------------------------------------------------------
 */
ol {
	list-style: decimal;
}
ul {
	list-style: disc;
}
li {
	display: list-item;
}
ol, ul {
	margin-left: 1.7rem;
}
ul li {
	padding-left: .4rem;
}
ul ul, ul ol, ol ol, ol ul {
	margin: .6rem 0 .6rem 1.7rem;
}
ul.disc li {
	display: list-item;
	list-style: none;
	padding: 0 0 0 .8rem;
	position: relative;
}
ul.disc li::before {
	content: "";
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #67009C;
	position: absolute;
	left: -17px;
	top: 11px;
	vertical-align: middle;
}
dt {
	margin: 0;
	color: #67009C;
}
dd {
	margin: 0 0 0 2rem;
}

/**
 * tables - (_document-setup.scss)  
 * -------------------------------------------------------------------
 */
table {
	border-width: 0;
	width: 100%;
	max-width: 100%;
	font-family: "lora-regular", sans-serif;
}
th, td {
	padding: 1.5rem 3rem;
	text-align: left;
	border-bottom: 1px solid #E8E8E8;
}
th {
	color: #313131;
	font-family: "poppins-bold", sans-serif;
}
td {
	line-height: 1.5;
}
th:first-child, td:first-child {
	padding-left: 0;
}
th:last-child, td:last-child {
	padding-right: 0;
}
.table-responsive {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

/**
 * Spacing - (_document-setup.scss)  
 * -------------------------------------------------------------------
 */
button, .button {
	margin-bottom: 1.2rem;
}
fieldset {
	margin-bottom: 1.5rem;
}
input,
textarea,
select,
pre,
blockquote,
figure,
table,
p,
ul,
ol,
dl,
form,
.fluid-video-wrapper,
.ss-custom-select {
	margin-bottom: 3rem;
}

/**
 * floated image - (_document-setup.scss)  
 * -------------------------------------------------------------------
 */
img.pull-right {
	margin: .9rem 0 0 2.4rem;
}
img.pull-left {
	margin: .9rem 2.4rem 0 0;
}

/**
 * block grid paddings - (_document-setup.scss) 
 * -------------------------------------------------------------------
 */
.bgrid {
	padding: 0 20px;
}
@media only screen and (max-width:1024px) {
	.bgrid {
		padding: 0 18px;
	}
}
@media only screen and (max-width:768px) {
	.bgrid {
		padding: 0 15px;
	}
}
@media only screen and (max-width:600px) {
	.bgrid {
		padding: 0 10px;
	}
}
@media only screen and (max-width:400px) {
	.bgrid {
		padding: 0;
	}
}

/**
 * pace.js styles - minimal  - (_document-setup.scss)
 * -------------------------------------------------------------------
 */
.pace {
	-webkit-pointer-events: none;
	pointer-events: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}
.pace-inactive {
	display: none;
}
.pace .pace-progress {
	background: #67009C;
	position: fixed;
	z-index: 900;
	top: 0;
	right: 100%;
	width: 100%;
	height: 6px;
}

/** 
 * ===================================================================
 * 04. preloader - (_preloader-1.scss)
 *
 * ------------------------------------------------------------------- 
 */
#preloader {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: #151515;
	z-index: 800;
	height: 100%;
	width: 100%;
}
.no-js #preloader, .oldie #preloader {
	display: none;
}
#loader {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 60px;
	height: 60px;
	margin: -30px 0 0 -30px;
	padding: 0;
}
#loader:before {
	content: "";
	border-top: 11px solid rgba(255, 255, 255, 0.1);
	border-right: 11px solid rgba(255, 255, 255, 0.1);
	border-bottom: 11px solid rgba(255, 255, 255, 0.1);
	border-left: 11px solid #67009C;
	-webkit-animation: load 1.1s infinite linear;
	animation: load 1.1s infinite linear;
	display: block;
	border-radius: 50%;
	width: 60px;
	height: 60px;
}
@-webkit-keyframes load {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}
@keyframes load {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

/** 
 * ===================================================================
 * 05. forms - (_forms.scss)
 *
 * ------------------------------------------------------------------- 
 */
fieldset {
	border: none;
}
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea,
select {
	display: block;
	height: 6rem;
	padding: 1.5rem 0;
	border: 0;
	outline: none;
	vertical-align: middle;
	color: #313131;
	font-family: "poppins-regular", sans-serif;
	font-size: 1.5rem;
	line-height: 3rem;
	max-width: 100%;
	background: transparent;
	border-bottom: 1px solid rgba(0, 0, 0, 0.3);
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.ss-custom-select {
	position: relative;
	padding: 0;
}
.ss-custom-select select {
	-webkit-appearance: none;
	-moz-appearance: none;
	-ms-appearance: none;
	-o-appearance: none;
	appearance: none;
	text-indent: 0.01px;
	text-overflow: '';
	margin: 0;
	line-height: 3rem;
	vertical-align: middle;
}
.ss-custom-select select option {
	padding-left: 2rem;
	padding-right: 2rem;
}
.ss-custom-select select::-ms-expand {
	display: none;
}
.ss-custom-select::after {
	content: '\f0d7';
	font-family: 'FontAwesome';
	position: absolute;
	top: 50%;
	right: 1.5rem;
	margin-top: -10px;
	bottom: auto;
	width: 20px;
	height: 20px;
	line-height: 20px;
	font-size: 18px;
	text-align: center;
	pointer-events: none;
	color: #252525;
}

/* IE9 and below */
.oldie .ss-custom-select::after {
	display: none;
}
textarea {
	min-height: 25rem;
}
input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
	color: #AE15FC;
	border-bottom: 1px solid #67009C;
}
label, legend {
	font-family: "poppins-bold", sans-serif;
	font-size: 1.4rem;
	margin-bottom: .6rem;
	color: #3b3b3b;
	display: block;
}
input[type="checkbox"], input[type="radio"] {
	display: inline;
}
label > .label-text {
	display: inline-block;
	margin-left: 1rem;
	font-family: "poppins-regular", sans-serif;
	line-height: inherit;
}
label > input[type="checkbox"], label > input[type="radio"] {
	margin: 0;
	position: relative;
	top: .15rem;
}

/**
 * Style Placeholder Text  
 * -
 */
::-webkit-input-placeholder {
	color: #a1a1a1;
	text-transform: capitalize;
}
:-moz-placeholder {
	color: #a1a1a1;  /* Firefox 18- */
	text-transform: capitalize;
}
::-moz-placeholder {
	color: #a1a1a1;  /* Firefox 19+ */
	text-transform: capitalize;
}
:-ms-input-placeholder {
	color: #a1a1a1;
	text-transform: capitalize;	
}
.placeholder {
	color: #a1a1a1 !important;
	text-transform: capitalize;
}

/** 
 * ===================================================================
 * 06. buttons - (_button-essentials.scss)
 *
 * ------------------------------------------------------------------- 
 */
.button,em.verifyCredential,
a.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"],.lbl-toggle {
	display: inline-block;
	font-family: "poppins-bold", sans-serif;
	font-size: 1.4rem;
	text-transform: uppercase;
	letter-spacing: .3rem;
	height: 5.4rem;
	line-height: 5.4rem;
	padding: 0 3rem;
	margin: 0 .3rem 1.2rem 0;
	background: #d8d8d8;
	color: #313131;
	text-decoration: none;
	cursor: pointer;
	text-align: center;
	white-space: nowrap;
	border: none;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
em.verifyCredential:hover,em.verifyCredential:focus,.button:hover,
a.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
.button:focus,
button:focus,
input[type="submit"]:focus,
input[type="reset"]:focus,
input[type="button"]:focus {
	background: #bebebe;
	color: #000000;
	outline: 0;
}
.button.button-primary,
a.button.button-primary,
button.button-primary,
input[type="submit"].button-primary,
input[type="reset"].button-primary,
input[type="button"].button-primary {
	background: #313131;
	color: #FFFFFF;
}
.button.button-primary:hover,.lbl-toggle:hover,
a.button.button-primary:hover,
button.button-primary:hover,
input[type="submit"].button-primary:hover,
input[type="reset"].button-primary:hover,
input[type="button"].button-primary:hover,
.button.button-primary:focus,
button.button-primary:focus,
input[type="submit"].button-primary:focus,
input[type="reset"].button-primary:focus,
input[type="button"].button-primary:focus {
	background: #1f1f1f;
}
button.full-width, .button.full-width {
	width: 100%;
	margin-right: 0;
}
button.medium, .button.medium {
	height: 5.7rem !important;
	line-height: 5.7rem !important;
	padding: 0 1.8rem !important;
}
button.large, .button.large {
	height: 6rem !important;
	line-height: 6rem !important;
	padding: 0rem 3rem !important;
}
button.stroke, .button.stroke {
	background: transparent !important;
	border: 3px solid #313131;
	line-height: 4.8rem;
}
button.stroke.medium, .button.stroke.medium {
	line-height: 5.1rem !important;
}
button.stroke.large, .button.stroke.large {
	line-height: 5.4rem !important;
}
button.stroke:hover, .button.stroke:hover {
	border: 3px solid #AE15FC;
}
button::-moz-focus-inner, input::-moz-focus-inner {
	border: 0;
	padding: 0;
}


/** 
 * ===================================================================
 * 07. other components - (_others.scss)
 *
 * ------------------------------------------------------------------- 
 */

/**
 * alert box - (_alert-box.scss)
 * -------------------------------------------------------------------
 */
.alert-box {
	padding: 2.1rem 4rem 2.1rem 3rem;
	position: relative;
	margin-bottom: 3rem;
	border-radius: 3px;
	font-family: "poppins-regular", sans-serif;
	font-size: 1.5rem;
}
.alert-box .close {
	position: absolute;
	right: 1.8rem;
	top: 1.8rem;
	cursor: pointer;
}
.ss-error {
	background-color: #ffd1d2;
	color: #e65153;
}
.ss-success {
	background-color: #c8e675;
	color: #758c36;
}
.ss-info {
	background-color: #d7ecfb;
	color: #4a95cc;
}
.ss-notice {
	background-color: #fff099;
	color: #bba31b;
}

/**
 * additional typo styles - (_additional-typo.scss)
 * -------------------------------------------------------------------
 */

/**
 * drop cap 
 */
.drop-cap:first-letter {
	float: left;
	margin: 0;
	padding: 1.5rem .6rem 0 0;
	font-size: 8.4rem;
	font-family: "poppins-bold", sans-serif;
	line-height: 6rem;
	text-indent: 0;
	background: transparent;
	color: #313131;
}

/**
 * line definition style
 */
.lining dt, .lining dd {
	display: inline;
	margin: 0;
}
.lining dt + dt:before, .lining dd + dt:before {
	content: "\A";
	white-space: pre;
}
.lining dd + dd:before {
	content: ", ";
}
.lining dd + dd:before {
	content: ", ";
}
.lining dd:before {
	content: ": ";
	margin-left: -0.2em;
}

/**
 * dictionary definition style
 */
.dictionary-style dt {
	display: inline;
	counter-reset: definitions;
}
.dictionary-style dt + dt:before {
	content: ", ";
	margin-left: -0.2em;
}
.dictionary-style dd {
	display: block;
	counter-increment: definitions;
}
.dictionary-style dd:before {
	content: counter(definitions, decimal) ". ";
}

/** 
 * Pull Quotes
 * -----------
 * markup:
 *
 * <aside class="pull-quote">
 *		<blockquote>
 *			<p></p>
 *		</blockquote>
 *	</aside>
 *
 * --------------------------------------------------------------------- 
 */
.pull-quote {
	position: relative;
	padding: 2.1rem 3rem 2.1rem 0px;
}
.pull-quote:before, .pull-quote:after {
	height: 1em;
	position: absolute;
	font-size: 8rem;
	font-family: Arial, Sans-Serif;
	color: #333;
}
.pull-quote:before {
	content: "\201C";
	top: 33px;
	left: 0;
}
.pull-quote:after {
	content: '\201D';
	bottom: -33px;
	right: 0;
}
.pull-quote blockquote {
	margin: 0;
}
.pull-quote blockquote:before {
	content: none;
}

/** 
 * Stats Tab
 * ---------
 * markup:
 *
 * <ul class="stats-tabs">
 *		<li><a href="#">[value]<em>[name]</em></a></li>
 *	</ul>
 *
 * Extend this object into your markup.
 *
 * ---------------------------------------------------------------------
 */
.stats-tabs {
	padding: 0;
	margin: 3rem 0;
}
.stats-tabs li {
	display: inline-block;
	margin: 0 1.5rem 3rem 0;
	padding: 0 1.5rem 0 0;
	border-right: 1px solid #ccc;
}
.stats-tabs li:last-child {
	margin: 0;
	padding: 0;
	border: none;
}
.stats-tabs li a {
	display: inline-block;
	font-size: 2.5rem;
	font-family: "poppins-bold", sans-serif;
	border: none;
	color: #252525;
}
.stats-tabs li a:hover {
	color: #67009C;
}
.stats-tabs li a em {
	display: block;
	margin: .6rem 0 0 0;
	font-size: 1.4rem;
	font-family: "poppins-regular", sans-serif;
	color: #888888;
}

/**
 * skillbars - (_skillbars.scss)
 * -------------------------------------------------------------------
 */
.skill-bars {
	list-style: none;
	margin: 6rem 0 3rem;
}
.skill-bars li {
	height: .6rem;
	background: #a1a1a1;
	width: 100%;
	margin-bottom: 6rem;
	padding: 0;
	position: relative;
}
.skill-bars li strong {
	position: absolute;
	left: 0;
	top: -3rem;
	font-family: "poppins-bold", sans-serif;
	color: #313131;
	text-transform: uppercase;
	letter-spacing: .2rem;
	font-size: 1.35rem;
	line-height: 2.4rem;
}
.skill-bars li .progress {
	background: #313131;
	position: relative;
	height: 100%;
}
.skill-bars li .progress span {
	position: absolute;
	right: 0;
	top: -3.6rem;
	display: block;
	font-family: "poppins-regular", sans-serif;
	color: white;
	font-size: 1.1rem;
	line-height: 1;
	background: #313131;
	padding: .6rem .6rem;
	border-radius: 3px;
}
.skill-bars li .progress span::after {
	position: absolute;
	left: 50%;
	bottom: -5px;
	margin-left: -5px;
	border-right: 5px solid transparent;
	border-left: 5px solid transparent;
	border-top: 5px solid #313131;
	content: "";
}

.skill-bars li .percent5   { width: 5%; }
.skill-bars li .percent10  { width: 10%; }
.skill-bars li .percent15  { width: 15%; }
.skill-bars li .percent20  { width: 20%; }
.skill-bars li .percent25  { width: 25%; }
.skill-bars li .percent30  { width: 30%; }
.skill-bars li .percent35  { width: 35%; }
.skill-bars li .percent40  { width: 40%; }
.skill-bars li .percent45  { width: 45%; }
.skill-bars li .percent50  { width: 50%; }
.skill-bars li .percent55  { width: 55%; }
.skill-bars li .percent60  { width: 60%; }
.skill-bars li .percent65  { width: 65%; }
.skill-bars li .percent70  { width: 70%; }
.skill-bars li .percent75  { width: 75%; }
.skill-bars li .percent80  { width: 80%; }
.skill-bars li .percent85  { width: 85%; }
.skill-bars li .percent90  { width: 90%; }
.skill-bars li .percent95  { width: 95%; }
.skill-bars li .percent100 { width: 100%; }


/** 
 * ===================================================================
 * 08. common styles (_layout.scss)
 *
 * ------------------------------------------------------------------- 
 */
.grey-section {
	/*background: #ebebeb;*/
	background-color: #fff;
}
.grey-section p.lead {
	color: #7d7d7d;
}
.section-intro {
	max-width: 700px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	margin-bottom: 3.6rem;
	position: relative;
}
.section-intro h1 {
	font-family: "poppins-semibold", serif;
	font-size: 3.6rem;
	color: #313131;
	line-height: 1.25;
	margin-bottom: 1.2rem;
}
.section-intro h5 {
	color: #67009C;
	font-size: 1.6rem;
	line-height: 1.875;
	margin-bottom: 0.3rem;
	letter-spacing: .4rem;
}

/**
 * responsive:
 * common styles
 * ------------------------------------------------------------------- 
 */
@media only screen and (max-width:768px) {
	.section-intro {
		max-width: 650px;
	}
	.section-intro h1 {
		font-size: 3rem;
	}
}
@media only screen and (max-width:600px) {
	.section-intro h1 {
		font-size: 2.6rem;
	}
	.section-intro h5 {
		font-size: 1.5rem;
		letter-spacing: .3rem;
	}
}
@media only screen and (max-width:400px) {
	.section-intro h1 {
		font-size: 2.4rem;
	}
}


/** 
 * ===================================================================
 * 09. header styles - (_layout.scss)
 *
 * ------------------------------------------------------------------- 
 */
header {
	position: fixed;
	width: 100%;
	min-height: 66px;
	z-index: 600;
}
header .row {
	position: relative;
	min-height: 66px;
}
header .top-bar {
	display: block;
	background: transparent;
	min-width: 140px;
	min-height: 36px;
	position: absolute;
	left: 90px;
	top: 0;
}
header .logo {
	float: left;
	margin-left: 5px;
	margin-right: 25px;
	margin-top: 20px;
	position: relative;
}

header .logo a {
	/*display: block;*/
	margin: 0;
	padding: 0;
	text-shadow: none;
	font-family: "poppins-bold";
	color: #fff;
	font-size: 2rem;
	text-transform: none;
	/*width: 92px;
	height: 15px;
	background: url("/images/logo.png") no-repeat center;
	background-size: 92px 15px;*/
}

/**
 * menu toggle - (_layout.css)
 * ------------------------------------------------------------------- 
 */
.menu-toggle {
	float: left;
	width: 27px;
	height: 40px;
	margin-left: 20px;
	margin-top: 13px;
	display: block;
	position: relative;
}
.menu-toggle span {
	display: block;
	background-color: #AE15FC;
	width: 34px;
	height: 3px;
	margin-top: -1.5px;
	font: 0/0 a;
	text-shadow: none;
	color: transparent;
	position: absolute;
	right: 8px;
	top: 50%;
	bottom: auto;
	left: auto;
	-moz-transition: background 0.2s ease-in-out;
	-o-transition: background 0.2s ease-in-out;
	-webkit-transition: background 0.2s ease-in-out;
	-ms-transition: background 0.2s ease-in-out;
	transition: background 0.2s ease-in-out;
}

/*.menu-toggle span::after {width: 4px solid pink; content: 'Menu'; width: 8rem; font-family: "poppins-medium", sans-serif; font-size: 1.5rem; color: #fff; display: block; left: 30px; position: relative; top: -1px; text-transform: uppercase; font-weight: bold; letter-spacing: 1px;}*/


.menu-toggle span::before, .menu-toggle span::after {
	content: '';
	width: 100%;
	height: 100%;
	background-color: inherit;
	position: absolute;
	left: 0;
	-moz-transition-duration: 0.2s, 0.2s;
	-o-transition-duration: 0.2s, 0.2s;
	-webkit-transition-duration: 0.2s, 0.2s;
	-ms-transition-duration: 0.2s, 0.2s;
	transition-duration: 0.2s, 0.2s;
	-moz-transition-delay: 0.2s, 0s;
	-o-transition-delay: 0.2s, 0s;
	-webkit-transition-delay: 0.2s, 0s;
	-ms-transition-delay: 0.2s, 0s;
	transition-delay: 0.2s, 0s;
}
.menu-toggle span::before {
	top: -8px;
	-moz-transition-property: top, transform;
	-o-transition-property: top, transform;
	-webkit-transition-property: top, transform;
	-ms-transition-property: top, transform;
	transition-property: top, transform;
}
.menu-toggle span::after {
	bottom: -8px;
	-moz-transition-property: bottom, transform;
	-o-transition-property: bottom, transform;
	-webkit-transition-property: bottom, transform;
	-ms-transition-property: bottom, transform;
	transition-property: bottom, transform;
}

/* is clicked */
.menu-toggle.is-clicked span {
	background-color: rgba(255, 0, 119, 0);
}
.menu-toggle.is-clicked span::before, .menu-toggle.is-clicked span::after {
	background-color: #67009C;
	-moz-transition-delay: 0s, 0.2s;
	-o-transition-delay: 0s, 0.2s;
	-webkit-transition-delay: 0s, 0.2s;
	-ms-transition-delay: 0s, 0.2s;
	transition-delay: 0s, 0.2s;
}
.menu-toggle.is-clicked span::before {
	top: 0;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}
.menu-toggle.is-clicked span::after {
	bottom: 0;
	-webkit-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

/* navigation panel */
#main-nav-wrap {
	display: block;
	width: 100%;
	font-family: "poppins-medium", sans-serif;
	font-size: 1.5rem;
	position: absolute;
	top: 100%;
	left: 0;	
}

/* dropdown nav */
.main-navigation {
	background: #000000;
	padding: 24px 20px 42px;
	margin: 0;
	width: 100%;
	height: auto;
	clear: both;
	display: none;
}
.main-navigation > li {
	display: block;
	height: auto;
	text-align: left;
	padding: 0;
}
.main-navigation li a {
	display: block;
	color: #FFFFFF;
	width: auto;
	padding: 15px 0;
	line-height: 16px;
	border: none;
}
.main-navigation li a:hover {
	color: #AE15FC;
	padding-left: .3rem;
}
.main-navigation li.current > a {
	background: none;
	color: #AE15FC;
}

/**
 * responsive:
 * header styles
 * --------------------------------------------------------------- 
 */
@media only screen and (max-width:1024px) {
	header .top-bar {
		left: 60px;
	}
}
@media only screen and (max-width:768px) {
	header .top-bar {
		left: 50px;
	}
}
@media only screen and (max-width:600px) {
	header .top-bar {
		left: 35px;
	}
}
@media only screen and (max-width:400px) {
	header .top-bar {
		left: 25px;
	}
}


/** 
 * ===================================================================
 * 10. intro - (_layout.scss) 
 *
 * ------------------------------------------------------------------- 
 */
#intro {
	background: #151515 url('/main/images/intro-bg.jpg') no-repeat center bottom;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	background-size: cover;
	background-attachment: fixed;
	width: 100%;
	height: 100%;
	min-height: 720px;
	display: table;
	position: relative;
	text-align: center;
}
.intro-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #111111;
	opacity: .85;
}

.intro-content {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	-webkit-transform: translateY(-2.1rem);
	-ms-transform: translateY(-2.1rem);
	transform: translateY(-2.1rem);
}
.intro-content h1 {
	color: #FFFFFF;
	font-family: "poppins-medium", sans-serif;
	font-size: 8.4rem;
	line-height: 1.071;
	max-width: 900px;
	margin-top: 0;
	margin-bottom: .6rem;
	margin-left: auto;
	margin-right: auto;
	text-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
}
.intro-content h5 {
	color: #AE15FC;
	font-family: "poppins-bold", sans-serif;
	font-size: 2.3rem;
	line-height: 1.565;
	margin-bottom: 0;
	text-transform: uppercase;
	letter-spacing: .3rem;
	text-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
}
.intro-content .intro-position {
	font-family: "lora-regular", serif;
	font-size: 1.5rem;
	line-height: 2.4rem;
	text-transform: uppercase;
	letter-spacing: .125rem;
	color: #FFFFFF;
	text-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
}
.intro-content .intro-position span {
	display: inline-block;
	color: #ccc;
}
.intro-content .intro-position span:not(:last-child)::after {
	content: "✦";
	text-align: center;
	display: inline-block;
	padding: 0 8px 0 8px;
	color: #fff;
	vertical-align: top;
	font-size: 1.25rem;
}
	/*.intro-content .intro-position span:first-child::before {
	content: "|";
	text-align: center;
	display: inline-block;
	padding: 0 14px 0 8px;
	color: rgba(255, 255, 255, 0.3);
}*/

.intro-position span:last-child::after {border: none;}

.intro-content .button {
	color: #FFFFFF !important;
	border-color: rgba(255, 255, 255, 0.3);
	height: 6rem !important;
	line-height: 5.4rem !important;
	padding: 0 3.5rem 0 3rem !important;
	margin-top: .6rem;
	font-size: 1.3rem;
	text-transform: uppercase;
	letter-spacing: .25rem;
}
.intro-content .button:hover, .intro-content .button:focus {
	border-color: #AE15FC;
}
.intro-content .button::after {
	display: inline-block;
	content: "\f107";
	font-family: fontAwesome;
	font-size: 1.6rem;
	line-height: inherit;
	text-align: center;
	position: relative;
	left: 1.2rem;
}

.introProfiles {
	display: block;
	position: absolute;
	width: 100%;
	left: 0;
	bottom: 7.2rem;
	font-size: 3.3rem;
	margin: 0;
	padding: 0;
}
.introProfiles li {
	display: inline-block;
	margin: 0 20px;
	padding: 0;
}
.introProfiles li a, .introProfiles li a:visited {
	color: #FFFFFF;
}
.introProfiles li a:hover, .introProfiles li a:focus {
	color: #AE15FC;
}

/**
 * responsive:
 * Intro
 * --------------------------------------------------------------- 
 */
@media only screen and (max-width:1024px) {
	.intro-content h1 {
		font-size: 7.6rem;
	}
	.introProfiles {
		font-size: 3rem;
	}
	.introProfiles li {
		margin: 0 15px;
	}
}
@media only screen and (max-width:768px) {
	#intro {
		min-height: 660px;
	}
	.intro-content h1 {
		font-size: 5.2rem;
	}
	.intro-content h5 {
		font-size: 1.8rem;
	}
	.intro-content .intro-position {
		font-size: 1.3rem;
	}
	.introProfiles {
		font-size: 2.5rem;
	}
	.introProfiles li {
		margin: 0 10px;
	}
}
@media only screen and (max-width:600px) {
	#intro {
		min-height: 600px;
	}
	.intro-content h1 {
		font-size: 4.6rem;
		margin-bottom: .6rem;
	}
	.intro-content h5 {
		font-size: 1.5rem;
		margin-bottom: .3rem;
		letter-spacing: .2rem;
	}
	.intro-content .intro-position {
		font-size: 1.2rem;
	}
	.intro-content .intro-position span {
		padding: 0 .6rem;
	}
	.intro-content .intro-position span::before, .intro-content .intro-position span::after {
		display: none !important;
	}
	.introProfiles {
		font-size: 2.4rem;
	}
}


/** 
 * ===================================================================
 * 11. about - (_layout.scss)
 *
 * ------------------------------------------------------------------- 
 */
#about {
	background: #FFFFFF;
	padding-top: 12rem;
	padding-bottom: 15rem;
}
#about .section-intro {
	margin-bottom: 3rem;
}

.intro-info {
	margin-top: 4.2rem;
	margin-right: -30px;
	margin-left: -30px;
}
.intro-info img {
	height: 17rem;
	width: 17rem;
	border-radius: 50%;
	margin: .9rem 3rem 0 0;
	float: left;  
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
}

.intro-info .lead {
	text-align: left;
	padding-left: 13rem;
	line-height: 1.55em;
}

p.lead strong, p.lead em {
	font-size: inherit!important;
}

.about-content {
	position: relative;
	text-align: left;
	max-width: 850px;
	margin-bottom: 3.6rem;
}
.about-content h3 {
	font-family: "poppins-bold", sans-serif;
	font-size: 1.8rem;
	text-transform: uppercase;
	letter-spacing: .25rem;
}
.about-content .info-list {
	list-style: none;
	margin-left: 0;
}
.about-content .info-list li {
	padding: 0 0 1.5rem 0;
	margin-bottom: .6rem;
}
.about-content .info-list li strong {
	font-family: "poppins-bold", sans-serif;
	color: #313131;
	text-transform: uppercase;
	letter-spacing: .2rem;
	font-size: 1.5rem;
	line-height: 3rem;
}
.about-content .info-list li span {
	/*display: block;*/
	font-family: "poppins-regular", sans-serif;
	color: #888888;
	font-size: 1.5rem;
	line-height: 1;
}
.about-content .skill-bars {
	margin-top: 6rem;
}

.button-section {
	text-align: center;
}
.button-section .button {
	width: 250px;
}
.button-section [class*="col-"] .button:first-child {
	margin-right: 4rem;
}

/**
 * responsive:
 * about
 * ------------------------------------------------------------------- 
 */
@media only screen and (max-width:1024px) {
	.intro-info {
		margin-right: 0;
		margin-left: 0;
	}
}
@media only screen and (max-width:768px) {
	.intro-info img {
		height: 7.8rem;
		width: 7.8rem;
	}
	.intro-info .lead {
		padding-left: 11rem;
	}
	.about-content h3 {
		text-align: center;
	}
	.about-content .info-list, .about-content .skill-bars {
		margin-bottom: 4.2rem;
	}
	.button-section .button {
		width: 100%;
		margin-bottom: 3rem;
	}
	.button-section [class*="col-"] .button:first-child {
		margin-right: 0;
	}
}
@media only screen and (max-width:600px) {
	.intro-info {
		text-align: center;
		margin-top: 3rem;
	}
	.intro-info img {
		/*height: 6.6rem;
		width: 6.6rem;*/
		float: none;
		display: block;		
		height: auto;
		width: 50%;
		margin: 0 auto 2.5rem auto;
	}
	.intro-info p.lead {
		padding-left: 0;
		text-align: center;
	}
}

/** 
 * ===================================================================
 * 12. resume - (_layout.scss)
 *
 * ------------------------------------------------------------------- 
 */
#resume {
	padding-top: 12rem;
	padding-bottom: 6rem;
}

#resume .resume-header {
	text-align: center;
}
#resume .resume-header h2 {
	color: #67009C;
}

#resume .resume-timeline {
	max-width: 980px;
}
#resume .timeline-wrap {
	position: relative;
	margin-top: 1.5rem;
	margin-bottom: 6rem;
}
#resume .timeline-wrap::before {
	content: "";
	display: block;
	width: 1px;
	height: 100%;
	background: rgba(0, 0, 0, 0.1);
	position: absolute;
	left: 35%;
	top: 0;
}
#resume .timeline-block {
	position: relative;
	padding-top: 1.5rem;
	/*margin-top: 1.5rem;*/
	padding-bottom: 1.5rem;
	opacity: 1;
	/*margin-bottom: 1.5rem;*/
}
/*#resume .timeline-block:hover {background-color: #ccc; cursor: pointer; -webkit-transition: opacity .4s ease-in;  -moz-transition: opacity .4s ease-in;  -o-transition: opacity .4s ease-in; opacity: .65;}*/
#resume .timeline-content h5 a:after {font-family: 'FontAwesome'; content: "\f05a"; margin: 0 0 0 .3em;}
#resume .timeline-content h5 a:link, #resume .timeline-content h5 a:visited {color: inherit; text-decoration: none;}
#resume .timeline-content h5 a:hover, #resume .timeline-content h5 a:active, #resume .timeline-content h5 a:focus {color: #67009C; text-decoration: none;}
.timeline-ico {
	height: 4.8rem;
	width: 4.8rem;
	line-height: 4.8rem;
	background: #313131;
	border-radius: 50%;
	text-align: center;
	color: #FFFFFF;
	position: absolute;
	left: 35%;
	top: .9rem;
	margin-left: -2.4rem;
}
.timeline-ico i {
	position: relative;
	left: .05rem;
	top: 0;
	font-size: 1.25em;
}
.timeline-ico i.fa-chalkboard-teacher {
	line-height: 2.25em;	
}
.fa-graduation-cap, .fa fa-briefcase {top: 0!important; font-size: 1.25em;}
#resume .timeline-header {
	float: left;
	width: 35%;
	padding-right: 60px;
	text-align: right;
}
#resume .timeline-header h3 {
	margin-bottom: 0;
}
#resume .timeline-header p {
	/*font-family: "poppins-regular", sans-serif;
	font-size: 1.6rem;
	color: #888888;*/
	position: relative;
padding-bottom: 1rem;
color: #999;
letter-spacing: 1.5px;
text-transform: none;
font-weight: bold;
font-size: 1.25rem!important;
line-height: 1.714;
font-family: "poppins-bold";
margin-bottom: 1.2rem;
font-style: normal;
text-rendering: optimizeLegibility;

}
#resume .timeline-content {
	margin-left: 35%;
	padding-left: 60px;
}
#resume .timeline-content h4 {font-size: 1.75rem; margin-bottom: .5rem;}

#resume .timeline-content h5 {
	position: relative;
	padding-bottom: 1rem;
	color: #999;
	letter-spacing: 1.5px;
	text-transform: none;
	font-weight: normal;
	font-size: 1.25rem;
}
#resume .timeline-content h5::after {
	content: "";
	display: block;
	height: 1px;
	width: 100%;
	background: rgba(0, 0, 0, 0.2);
	position: absolute;
	left: 0;
	bottom: 0;
}
#moreInfo .timeline-ico {
	height: 4.8rem;
	width: 4.8rem;
	line-height: 4.8rem;
	background: #fff;
	border-radius: 50%;
	text-align: center;
	color: #6bb373;
	position: absolute;
	left: 35%;
	top: .9rem;
	margin-left: -2.4rem;
}
#moreInfo .timeline-ico i {
	position: relative;
	left: .05rem;
	top: .2rem;
}
/**
 * responsive:
 * resume
 * ------------------------------------------------------------------- 
 */
@media only screen and (max-width:1024px) {
	#resume .timeline-header {
		padding-right: 50px;
	}
	#resume .timeline-header h3 {
		font-size: 1.8rem;
	}
	#resume .timeline-header p {
		font-size: 1.4rem;
	}
	#resume .timeline-content {
		padding-left: 50px;
	}
}
@media only screen and (max-width:768px) {
	#resume .timeline-wrap::before {
		left: 2.4rem;
	}
	#resume .timeline-ico {
		left: 2.4rem;
	}
	#resume .timeline-header {
		float: none;
		width: auto;
		padding-right: 15px;
		text-align: left;
	}
	#resume .timeline-header h3 {
		font-size: 2rem;
	}
	#resume .timeline-header p {
		font-size: 1.5rem;
		margin-bottom: 1.5rem;
	}
	#resume .timeline-content {
		margin: 0;
	}
	#resume .timeline-content h4 {
		padding-bottom: 0;
		padding-top: 2.1rem;
		margin-bottom: .6rem;
		font-size: 1.7rem;
	}
	#resume .timeline-content h4::after {
		bottom: auto;
		top: 0;
	}
	#resume .timeline-header, #resume .timeline-content {
		padding-left: 7rem;
	}
}
@media only screen and (max-width:480px) {
	#resume .resume-header h2 {
		font-size: 2.2rem;
	}
	#resume .timeline-wrap::before {
		left: 1.8rem;
	}
	#resume .timeline-ico {
		height: 3.6rem;
		width: 3.6rem;
		line-height: 3.6rem;
		left: 1.8rem;
		margin-left: -1.8rem;
		font-size: 1.5rem;
	}
	#resume .timeline-header, #resume .timeline-content {
		padding-left: 5.5rem;
	}
	.col-six.tab-full p {text-align: center;}
	.pmpCredential img {width: auto!important;}
	 span[id^='verify'] {display: none!important;}
	 .slideshow-inner {margin: 0 auto; width: 50%; text-align: center;}
}



/** 
 * ===================================================================
 * 13. portfolio - (_layout.scss)
 *
 * ------------------------------------------------------------------- 
 */
#portfolio {
	background: #FFFFFF;
/*	padding-top: 12rem;*/
	padding-bottom: 12rem;
}
#portfolio .folio-item {
	padding: 0;
	position: relative;
	overflow: hidden;
}
#portfolio .folio-item img {
	vertical-align: middle;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}

#portfolio .overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: transparent;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}

#portfolio .folio-item-table {
	display: table;
	width: 100%;
	height: 100%;
}
#portfolio .folio-item-cell {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
	position: relative;
	left: -100%;
}

#portfolio .folio-title {
	color: #FFFFFF;
	font-size: 3.3rem;
	padding: 0 3rem;
	margin-bottom: 0;
}
#portfolio .folio-types {
	margin: 0;
	padding: 0;
	text-transform: uppercase;
	font-family: "poppins-regular", sans-serif;
	font-size: 1.2rem;
	letter-spacing: .1rem;
	color: rgba(255, 255, 255, 0.6);
}
#portfolio .folio-item:hover .overlay {
	background: rgba(0, 0, 0, 0.8);
}
#portfolio .folio-item:hover .folio-item-cell {
	left: 0;
}
#portfolio .folio-item:hover img {
	-webkit-transform: scale(1.05);
	-ms-transform: scale(1.05);
	transform: scale(1.05);
}
/**
 * responsive:
 * portfolio
 * ------------------------------------------------------------------- 
 */
@media only screen and (max-width:1024px) {
	#portfolio .folio-title {
		font-size: 3.1rem;
	}
}
@media only screen and (max-width:768px) {
	#portfolio .folio-title {
		font-size: 2.5rem;
	}
}
@media only screen and (max-width:400px) {
	#portfolio .folio-title {
		font-size: 2.2rem;
	}
}

/**
 * Popup Modal - (_layout.scss)
 * ------------------------------------------------------------------
 */
.popup-modal {
	max-width: 550px;
	background: #FFFFFF;
	position: relative;
	margin: 0 auto;
}
.popup-modal .media {
	position: relative;
}
.popup-modal img {
	vertical-align: bottom;
}
.popup-modal .description-box {
	padding: 1.8rem 3.6rem 3rem;
}
.popup-modal .description-box h4 {
	font-family: "poppins-bold", sans-serif;
	font-size: 1.5rem;
	line-height: 2.4rem;
	margin-bottom: .6rem;
}
.popup-modal .description-box p {
	font-family: "poppins-regular", sans-serif;
	font-size: 1.4rem;
	line-height: 2.4rem;
	margin-bottom: 12px;
}
.popup-modal .categories {
	font-family: "poppins-bold", sans-serif;
	font-size: 1.1rem;
	line-height: 1.8rem;
	text-transform: uppercase;
	letter-spacing: .1rem;
	display: block;
	text-align: left;
	color: rgba(0, 0, 0, 0.5);
}
.popup-modal .link-box {
	overflow: hidden;
	background: #000000;
}
.popup-modal .link-box a {
	font-family: "poppins-bold", sans-serif;
	font-size: 1.2rem;
	line-height: 6rem;
	color: #FFFFFF;
	text-transform: uppercase;
	letter-spacing: 3px;
	cursor: pointer;
	display: block;
	text-align: center;
	float: left;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.popup-modal .dual.link-box a:first-child {
	border-right: 1px solid #fff;
}
.popup-modal .dual.link-box a:hover, .popup-modal .dual.link-box a:active, .popup-modal .dual.link-box a:focus {background-color: #AE15FC;}
.popup-modal .single.link-box a:hover, .popup-modal .single.link-box a:active {
	background: transparent;
	/*border: none;*/
	cursor: pointer;
}

@media only screen and (max-width:600px) {
	.popup-modal {
		width: auto;
		margin: 0 20px;
	}
}

/**
 * transition effect for modal popup - (_layout.scss)
 * ------------------------------------------------------------------ 
 */

/* overlay at start */
.mfp-fade.mfp-bg {
	opacity: 0;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

/* overlay animate in */
.mfp-fade.mfp-bg.mfp-ready {
	opacity: .9;
}

/* overlay animate out */
.mfp-fade.mfp-bg.mfp-removing {
	opacity: 0;
}

/* content at start */
.mfp-fade.mfp-wrap .mfp-content {
	opacity: 0;
	-webkit-transform: translateY(-100%);
	-ms-transform: translateY(-100%);
	transform: translateY(-100%);
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

/* content animate in */
.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
	opacity: 1;
	-webkit-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0);
}

/* content animate out */
.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
	opacity: 0;
	-webkit-transform: translateY(-100%);
	-ms-transform: translateY(-100%);
	transform: translateY(-100%);
}

/** 
 * ===================================================================
 * 14. call-to-action section - (_layout.scss)
 *
 * ------------------------------------------------------------------- 
 */
#cta {
	padding-top: 10.2rem;
	padding-bottom: 9rem;
	text-align: center;
}
#cta p.lead {
	color: #6e6e6e;
}
.cta-content {
	max-width: 640px;
}
.cta-thumb {
	display: inline-block;
	margin-bottom: 1.2rem;
}
.cta-thumb img {
	height: 7.8rem;
	width: 7.8rem;
	border-radius: 50%;
}

/**
 * section ads - (_layout.scss)
 * ------------------------------------------------------------------- 
 */
.section-ads h2 {
	position: relative;
	padding-bottom: 2.1rem;
}
.section-ads h2::after {
	content: "";
	display: block;
	height: 3px;
	width: 80px;
	background: rgba(0, 0, 0, 0.2);
	position: absolute;
	left: 50%;
	bottom: 0;
	margin-left: -40px;
}
.section-ads h2 a, .section-ads h2 a:visited {
	color: #313131;
}
.section-ads span {
	color: #3F0D39;
}

/**
 * responsive:
 * cta
 * -------------------------------------------------------------------
 */
@media only screen and (max-width:650px) {
	.cta-content {
		max-width: 650px;
	}
	.cta-content h2 {
		font-size: 2.4rem;
	}
}


/** 
 * ===================================================================
 * 15. services - (_layout.scss)
 *
 * ------------------------------------------------------------------- 
 */
#services {
	background: #313131 url(/images/bg.jpg) no-repeat center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	background-size: cover;
	padding-top: 12rem;
	padding-bottom: 12rem;
	color: white;
	position: relative;
}
#services .overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #151515;
	opacity: .9;
}

#services .section-intro {
	margin-bottom: 1.8rem;
}

#services .section-intro h1 {
	color: white;
}
#services .section-intro h5 {
	color: #AE15FC;
}
#services .section-intro p {
	color: rgba(255, 255, 255, 0.7);
}
.services-content {
	max-width: 1200px;
}
.services-list {
	margin-top: 1.2rem;
	text-align: center;
}
.services-list .service {
	margin-bottom: 1.2rem;
	padding: 0 30px;
}
.services-list .icon {
	display: inline-block;
	margin-bottom: 2.1rem;
}
.services-list .icon i {
	font-size: 5.4rem;
	color: #67009C;
}
.services-list h3 {
	color: #FFFFFF;
}
.services-list .desc {
	color: rgba(255, 255, 255, 0.6);
}

/* pagination */
.owl-pagination {
	text-align: center;
	width: 100%;
	margin: .6rem 0 0;
}
.owl-theme .owl-controls .owl-page {
	display: inline-block;
}
.owl-theme .owl-controls .owl-page span {
	display: block;
	width: 1.2rem;
	height: 1.2rem;
	margin: 1.2rem .8rem 0 .8rem;
	border-radius: 50%;
	display: inline-block;
	background: #FFFFFF;
}
.owl-theme .owl-controls .owl-page.active span {
	background: #67009C;
}


/** 
 * ===================================================================
 * 16. stats - (_layout.scss)
 *
 * ------------------------------------------------------------------- 
 */
#stats {
	background: #A705FA;
	padding-top: 4rem;
	padding-bottom: 0;
	text-align: center;
}
#stats .row {
	max-width: 1440px;
}
#stats .stat {
	border-left: 1px solid rgba(255, 255, 255, 0.12);
	min-height: 17.4rem;
}
#stats .stat:first-child {
	border: none;
}
#stats .icon-part i {
	font-size: 4.8rem;
	color: #000000;
}
#stats h3 {color: #FFFFFF;
	font-size: 2rem;
	margin-top: 1.2rem;
	margin-bottom: 0; text-transform: uppercase;
}


#stats .bgrid.stat a:hover h3, #stats .bgrid.stat a:hover h5 {cursor: pointer; color: #ff0!important;}


#stats .bgrid.stat:hover {cursor: pointer;}
#stats .bgrid.stat h3 {color: #fff; text-shadow: 1px 1px 1px #333;}
#stats .bgrid.stat h3 a:link, #stats .bgrid.stat h3 a:visited {color: #fff;}
#stats .bgrid.stat h3 a:hover, #stats .bgrid.stat h3 a:active, #stats .bgrid.stat h3 a:focus {color: #ff0;}
h5.stat-title a:link, h5.stat-title a:visited {color: #ffffff80;}
div.icon-part:hover + h3 a, h5.stat-title a:hover, h5.stat-title a:active {color: #ff0!important;}
div.icon-part:hover ~ h5 a {color: #ff0!important;}

#stats .stat-count {
	color: #FFFFFF;
	font-size: 3.6rem;
	margin-top: 1.2rem;
	margin-bottom: 0;
	font-family: "poppins-medium", sans-serif;
	color: white;
}
#stats .stat-title {
	color: rgba(255, 255, 255, 0.5);
}

/**
 * responsive:
 * stats
 * -------------------------------------------------------------------
 */
@media only screen and (max-width:1024px) {
	#stats .stat:nth-child(n) {
		border-left: 1px solid rgba(255, 255, 255, 0.12);
		padding-bottom: 1.5rem;
	}
	#stats .stat:nth-child(3n+1) {
		border: none;
	}
}
@media only screen and (max-width:768px) {
	#stats .stat:nth-child(n) {
		border-left: 1px solid rgba(255, 255, 255, 0.12);
	}
	#stats .stat:nth-child(2n+1) {
		border: none;
	}
}
@media only screen and (max-width:600px) {
	#stats .stat:nth-child(n) {
		border: none;
	}
}


/** 
 * ===================================================================
 * 17. contact - (_layout.scss)
 *
 * ------------------------------------------------------------------- 
 */
#contact {
	background: #151515;
	padding-top: 12rem;
	padding-bottom: 7.2rem;
}
#contact span {color: #666;}
#contact .section-intro h1 {
	color: white;
}
#contact .section-intro h5 {
	color: #67009C;
}
#contact .section-intro p {
	color: rgba(255, 255, 255, 0.7);
}

/* contact form */
.contact-form {
	max-width: 740px;
}

.contact-form ::-webkit-input-placeholder {
	color: rgba(204, 204, 204, .7);
}
.contact-form :-moz-placeholder {
	color: rgba(204, 204, 204, .7);  /* Firefox 18- */
}
.contact-form ::-moz-placeholder {
	color: rgba(204, 204, 204, .7);  /* Firefox 19+ */
}
.contact-form :-ms-input-placeholder {
	color: rgba(204, 204, 204, .7);
}
.contact-form .placeholder {
	color: rgba(204, 204, 204, .7) !important;
}

#contact form {
	margin-top: 0;
	margin-bottom: 3rem;
}
#contact form .form-field {
	position: relative;
}
#contact form .form-field:before, #contact form .form-field:after {
	content: "";
	display: table;
}
#contact form .form-field:after {
	clear: both;
}
#contact form .form-field label {
	font-family: "poppins-bold", sans-serif;
	font-size: 1.1rem;
	line-height: 2.4rem;
	position: absolute;
	bottom: -1.2rem;
	right: .6rem;
	text-transform: uppercase;
	letter-spacing: .1rem;
	padding: 0 2rem;
	margin: 0;
	color: #67009C;
	background: #ff0;
}
#contact form .form-field label::after {
	position: absolute;
	left: -5px;
	top: 50%;
	margin-top: -6px;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-right: 5px solid #67009C;
	content: "";
}
#contact input[type="text"],
#contact input[type="password"],
#contact input[type="email"],
#contact textarea {
	width: 100%;
	color: rgba(255, 255, 255, 0.7);
	margin-bottom: 0;
	border-top: 1px solid transparent;
	border-right: 1px solid transparent;
	border-bottom: 1px solid #67009C;
	border-left: 1px solid transparent;
}
#contact input[type="text"],
#contact input[type="password"],
#contact input[type="email"] {
	height: 6.6rem;
	padding: 1.8rem 2rem;
}
#contact input[type="text"]:focus,
#contact input[type="password"]:focus,
#contact input[type="email"]:focus {
	border-color: #67009C;
	color: #FFFFFF;
	font-weight: bold;
	content: "";
}

#contactName.error:focus {border: 1px solid #ff0!important;}


#contact textarea {
	min-height: 20rem;
	padding: 1.8rem 2rem;
}
#contact textarea:focus {
	border-color: #ccc;
	color: #FFFFFF;
	font-weight: bold;
	content: "";
}
#contact button.submitform {
	font-size: 1.5rem;
	display: block;
	letter-spacing: .2rem;
	height: 6.6rem;
	line-height: 6.6rem;
	padding: 0 3rem;
	margin-top: 4.8rem;
	width: 100%;
	background: #67009C;
	color: #FFFFFF;
}
#contact button.submitform:hover, #contact button.submitform:focus {
	background: #AE15FC;
}
#message-warning, #message-success {
	display: none;
	background: #0d0d0d;
	border-radius: 3px;
	padding: 3rem;
	margin-bottom: 3.6rem;
	width: 100%;
}
#message-warning {
	color: Red;
	border: 3px solid Red;
}
#message-success {
	text-align: center;
	font-weight: bold;
	font-size: 2.2rem;
	border: 3px solid #fff;
}
#message-warning i, #message-success i {
	margin-right: 14px;
}

/* form loader */
#submit-loader {
	display: none;
	position: relative;
	left: 0;
	top: 1.8rem;
	width: 100%;
	text-align: center;
}
#submit-loader .text-loader {
	display: none;
	font-family: "poppins-bold", sans-serif;
	color: #FFFFFF;
	letter-spacing: .3rem;
	text-transform: uppercase;
}
.oldie #submit-loader .s-loader {
	display: none;
}
.oldie #submit-loader .text-loader {
	display: block;
}
.contact-info {
	margin: 4.8rem auto 0;
	font-family: "poppins-regular", sans-serif;
	font-size: 1.5rem;
	text-align: center;
}
.contact-info .collapse {
	padding: 0;
}
.contact-info .icon {
	margin-bottom: 2.1rem;
}
.contact-info .icon i {
	font-size: 4.2rem;
	color: #FFFFFF;
}
.contact-info h5 {
	color: #AE15FC;
}

/**
 * loader animation - (_layout.scss)
 * --------------------------------------------------------------- 
 */
.s-loader {
	margin: 1.2rem auto 3rem;
	width: 70px;
	text-align: center;
	-webkit-transform: translateX(0.45rem);
	-ms-transform: translateX(0.45rem);
	transform: translateX(0.45rem);
}
.s-loader > div {
	width: 1rem;
	height: 1rem;
	background-color: #FFFFFF;
	border-radius: 100%;
	display: inline-block;
	margin-right: .9rem;
	-webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
	animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}
.s-loader .bounce1 {
	-webkit-animation-delay: -0.32s;
	animation-delay: -0.32s;
}
.s-loader .bounce2 {
	-webkit-animation-delay: -0.16s;
	animation-delay: -0.16s;
}
@-webkit-keyframes sk-bouncedelay {
	0%, 80%, 100% {
		-webkit-transform: scale(0);
		-ms-transform: scale(0);
		transform: scale(0);
	}
	40% {
		-webkit-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
	}
}
@keyframes sk-bouncedelay {
	0%, 80%, 100% {
		-webkit-transform: scale(0);
		-ms-transform: scale(0);
		transform: scale(0);
	}
	40% {
		-webkit-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
	}
}


/** 
 * ===================================================================
 * 18. footer - (_layout.scss)
 *
 * ------------------------------------------------------------------- 
 */
footer {
	padding-bottom: 3rem;
	font-size: 1.4rem;
	font-family: "poppins-regular", sans-serif;
	background-color: #151515!important;
}
footer div.social {
	padding: 0;
}
footer a, footer a:visited {
	color: #FFFFFF;
}
footer a:hover, footer a:focus {
	color: #67009C;
}
footer .row {
	max-width: 900px;
}
footer .social {
	text-align: right;
}
footer .footer-profiles {
	display: table!important;
/*	font-size: 2.1rem; */
	margin: 0 auto;
	padding: 0;
	position: relative;
	width: 33%;
}
footer .footer-profiles li {
	display: table-cell;
	padding: 0;
	vertical-align: top;
	width: 25%;
}
footer .footer-profiles li:first-child {vertical-align: middle; padding: 3px 0 0 0;}
footer .footer-profiles li:last-child {vertical-align: middle; padding: 2px 0 0 .80em;}
footer .footer-profiles li a.linkedIn .fa:before, footer .footer-profiles li a.rover .fa:before {
	font-size: 3rem;
}
footer .footer-profiles li a .fa:before {
	font-size: 2.7rem;
	color: #999;
}
footer .footer-profiles li a:hover .fa:before {
	color: #fff;	
}
div#preload_area::before {
 content: " ";
 background: url("/images/icon_wellfound_on.png") no-repeat;
}
footer .footer-profiles li a.wellfound {
	background-image: url("/images/icon_wellfound.png");
	background-size: contain;
	background-repeat: no-repeat;
	width: 44px;
	height: 24px;
	vertical-align: top;
	display: inline-block;
    padding: 0;
}
footer .footer-profiles li a.wellfound:hover {
	background-image: url("/images/icon_wellfound_on.png");
}
footer .footer-profiles li a {
	color: #FFFFFF;
}
.col-six.social, .copyrightRow {
	width: 100%!important; text-align: center; background-color: #151515;
}
div.copyright {
	border-top: 1px dotted #999;
	margin: .75em auto 0 auto;
	padding: .75em 0;
	width: 40%;
}
footer [class*="-social"] li a:link, footer .footer-profiles li a:visited {color: #FFFFFF;}
footer [class*="-social"] li a:hover, footer .footer-profiles li a:active {color: #AE15FC!important;}
/*footer .copyright {background-color: #151515;}*/
footer .copyright em {color: #fff; font-style: normal; display: block; font-size: 85%;}
footer .copyright span {
	display: inline-block;
	color: #999;
}
footer .copyright img {height: 13px; margin: -2px 0 0 .23em;}
footer .copyright span::after {
	content: "|";
	display: inline-block;
	padding: 0 1rem 0 1.2rem;
	color: rgba(255, 255, 255, 0.1);
}
footer .copyright span:last-child::after {
	display: none;
}

/**
 * responsive:
 * footer
 * -------------------------------------------------------------------
 */
@media only screen and (max-width:768px) {
	footer {
		text-align: center;
	}
	footer .social {
		display: block;
		width: 100%;
		text-align: center;
	}
	footer .copyright span {
		display: block;
	}
	footer .copyright span::after {
		display: none;
	}
}

/**
 * go to top - (_layout.scss)
 * ------------------------------------------------------------------- 
 */
#go-top {
	position: fixed;
	bottom: 0;
	right: 0;
	z-index: 600;
	display: none;
}
#go-top a {
	text-decoration: none;
	border: 0 none;
	display: block;
	height: 6.6rem;
	width: 6rem;
	line-height: 6.6rem;
	text-align: center;
	/*background: #AE15FC;*/
	color: #FFFFFF;
	text-align: center;
	text-transform: uppercase;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
#go-top a i {
	font-size: 3em;
	line-height: inherit;
	color: #67009C ;
}
#go-top a:hover i {
	color: #AE15FC!important;
	/*background: #000000;*/
}


/*a.menu-toggle:link, a.menu-toggle:visited {color: #67009C;}*/
a.menu-toggle:link span, a.menu-toggle:visited span {background-color: #AE15FC;}
a.menu-toggle:hover span {background-color: #fff!important; cursor: pointer;}

/*
a.menu-toggle:hover span {background-color: #fff;}
a.menu-toggle:hover > .logo strong {color: #fff;}
 header logo menu 

a.menu-toggle:hover strong + a.menu-toggle:hover span {background-color: #fff; color: #fff;}
a.menu-toggle span {left: 0!important;}
a.menu-toggle strong {left: 35px; top: 8px; position: relative; font-size: 2.5rem; text-transform: uppercase; font-family: "poppins-semibold", sans-serif;}/*
.menu-toggle {width: auto;}

div.top-bar:hover .logo a {cursor: pointer; color: #fff;}
div.logo a:link, div.logo a:visited {color: #AE15FC;}
div.logo a:hover, div.logo a:active {color: #fff;}
.top-bar a.menu-toggle:link span, .top-bar a.menu-toggle:visited span {background-color: #AE15FC;}
.top-bar a.menu-toggle:hover span, .top-bar a.menu-toggle:active span {background-color: #fff;}
*/


.wrap-collabsible {
  margin: 1.2rem 0;
}

.wrap-collabsible {display: inline-block; float: left; width: 25%;}

input[type='checkbox'] {
  display: none;
}

.lbl-toggle {
  display: inline-block;
  float: left;
  font-weight: bold;
  /*font-family: monospace;
  font-size: 1.2rem;
  text-transform: uppercase;
  text-align: center;
  margin: 0 .35em 0 0;

  padding: 1rem;

  color: #A77B0E;
  background: #FAE042;

  cursor: pointer;

  border-radius: 7px;*/
  transition: all 0.25s ease-out;
}

.lbl-toggle:hover {
  /*color: #7C5A0B;*/
}

.lbl-toggle::before {
  content: ' ';
  display: inline-block;

  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 5px solid currentColor;
  vertical-align: middle;
  margin-right: .7rem;
  transform: translateY(-2px);

  transition: transform .2s ease-out;
}

.toggle:checked + .lbl-toggle::before {
  transform: rotate(90deg) translateX(-3px);
}

.collapsible-content {
  max-height: 0px;
  overflow: hidden;
  transition: max-height .25s ease-in-out;
  clear: both;
}

.toggle:checked + .lbl-toggle + .collapsible-content {
  max-height: 600px;
  overflow-y: scroll;
}

.toggle:checked + .lbl-toggle {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.collapsible-content .content-inner {
  background: rgba(250, 224, 66, .2);
  border-bottom: 1px solid rgba(250, 224, 66, .45);
  border-bottom-left-radius: 7px;
  border-bottom-right-radius: 7px;
  padding: .5rem 1rem;
}
.resume-timeline h2 {text-align: left;/* position: relative; left: 34.5%;*/}
#resume .asu i {position: relative; left: 4%; top: 6px; vertical-align: top; font-size: 2.5em; font-family: 'pac-12'; line-height: .75em;}
.resume-timeline .recreation i {position: relative; left: .25rem; top: .82rem; vertical-align: top; font-size: 2.5em; font-family: 'sport_4_everregular';}
#resume .timeline-ico.linkedInIcon {background-color: #0072b1;}
#resume .timeline-ico.linkedInIcon i {color: #fff!important; top: .25rem; font-size: 1.5em;}
#resume .timeline-ico.petsOnWheels {background-color: #e11e26;}
#resume .timeline-ico.rover {background-color: #2EB372;}
#resume .timeline-ico.rover i {top: .3rem; font-size: 1.38em;}
#resume .timeline-ico.recreation i {left: .25rem; top: .82rem; font-size: 2.18em;}
#resume .timeline-ico.pmi {background-color: #0065BD;}
#resume .timeline-ico.asu {border: 2px solid #8E0C3A; background-color: #fff/*#FFC72C*/;}
#resume .timeline-ico.asu i {color: #8E0C3A;}
#resume .timeline-ico.asu span {
	height: 4.8rem;
	width: 4.8rem;
	line-height: 4.8rem;
	border-radius: 50%;
	text-align: center;
	color: #fff;
}
.timeline-ico.fiji {border-radius: 55%;}
#resume .fiji i {position: relative; top: .45em;}
#resume .fiji img {width: 52%; height: auto; vertical-align: top;}
.resumeBtns a svg {color: #fff; vertical-align: middle; font-size: 1.82em;}
.resumeBtns a.button-primary:hover, .resumeBtns a.button-primary:active {background-color: #AE15FC; color: #fff;}
/*.col-twelve, .col-full {overflow-x: hidden;}*/
#resume .timeline-header h3 {font-size: 80%; font-weight: normal;}
.degreeLink a {font-style: italic; text-decoration: none;}
.degreeLink a:link, .degreeLink a:visited {color: #67009C;}
.degreeLink a:hover, .degreeLink a:active {color: #FE61AB;}
#resume .timeline-header p {white-space: nowrap;}
.infoBox .graphic {float: left; text-align: left;}
.infoBox .graphic img {width: 100px;}
.infoBox .infoBoxDeets {padding-top: 12px; float: left; background-color: #67009C; border-radius: 50%; width: 75px; height: 75px; margin-left: 2%;}
.infoBox .infoBoxDeets h3 {text-align: center; text-shadow: 1px 1px 1px #000; color: #fff; text-transform: uppercase;}
.infoBox .infoBoxDeets h6 {color: #fff; font-variant: small-caps; font-size: 60%; display: block; letter-spacing: .5px; text-align: center; margin: 0; padding: 0; line-height: initial;}
.timeline-content ul li, .timeline-content p {font-size: 1.45rem; line-height: 1.65em;}
.timeline-content ul li {list-style-type: none;}
.timeline-content ul li:not(:last-child) {padding-bottom: 1em;}
.timeline-content ul li:before {content: "\f138"; font-family: FontAwesome; display: inline-block; margin-left: -1.3em; width: auto; padding: 0 6px 0 0;}
a.moreInfo {margin-left: 2px;}
a.moreInfo:link, a.moreInfo:visited {color: #313131!important;}
a.moreInfo:hover, a.moreInfo:active {color: #AE15FC!important;}
.skill-bars li strong .badgeTxt {float: left;}
.skill-bars li strong a.badge {float: right; position: relative; top: -5px; margin: 0 0 0 3px; display: inline-block;}
.skill-bars li strong a.badge img {width: 22%;}
.timeline-header p {margin-bottom: 0!important;}
a.dkLink:link,a.dkLink:visited {color: #a1a1a1;}
a.dkLink:hover,a.dkLink:active {color: #fff; text-decoration: none;}
.smoothscroll svg {font-size: 2em;}

/* testimonials */
.heading {
    text-align: center;
    color: #454343;
    font-size: 30px;
    font-weight: 700;
    position: relative;
    margin-bottom: 70px;
    text-transform: uppercase;
    z-index: 999;
}
.white-heading{
    color: #ffffff;
}
.heading:after {
    content: ' ';
    position: absolute;
    top: 100%;
    left: 50%;
    height: 40px;
    width: 180px;
    border-radius: 4px;
    transform: translateX(-50%);
    background: url(img/heading-line.png);
    background-repeat: no-repeat;
    background-position: center;
}
.white-heading:after {
    background: url(https://i.ibb.co/d7tSD1R/heading-line-white.png);
    background-repeat: no-repeat;
    background-position: center;
}

.heading span {
    font-size: 18px;
    display: block;
    font-weight: 500;
}
.white-heading span {
    color: #ffffff;
}


/* services */
.service .icon .svg-inline--fa {color: #67009C; font-size: 3em!important;}

/* protected homepage */
.homeIntro {text-align: center!important; padding-left: 0!important;}
.protectedIndex #about {padding-top: 5rem;padding-bottom: 2rem;}
.col-twelve.centeredBtns {text-align: center; margin: 0 auto; float: none;}
.centeredBtns a.button {color: #fff; background-color: #313131!important;}
.login-form .col-twelve {margin: 0 auto;}
.login-form .col-twelve fieldset {background-color: #fff;}
#message-success svg {margin-right: 5px;}
#message-success {color: #fff;}
.entryFtr {text-align: center; float: none;}

/* portfolio */
#portfolio .row.section-intro, #resume .row.section-intro {max-width: 980px;}
#portfolio .row.section-intro h5, #portfolio .row.section-intro h1 {text-align: center;}
#portfolio .row.section-intro p.lead {text-align: left;}
#portfolio .folio-item:hover .overlay {cursor: pointer;}
.description-box h4 {text-transform: uppercase;}
.description-box span svg {margin-right: 4px;}
.description-box span {float: right; text-transform: none!important; color: #666;}
.popup-modal .dual a {width: 50%; background-color: #67009C;}
.popup-modal .single.link-box a {border: 1px solid #fff; width: 100%;}
.popup-modal .single.link-box a i.fa:before {color: #fff;}
.popup-modal .single.link-box a {color: transparent;}
.popup-modal .single.link-box a:hover, .popup-modal .single.link-box a:active {color: #AE15FC; cursor: pointer;}
.popup-modal .single.link-box a i:before {content: "\f057"; font-family: FontAwesome; font-size: 3rem; line-height: 6rem; display: block; text-align: center; vertical-align: middle; position: relative; top: .5rem;}
.popup-modal .dual.link-box a:after {font-size: 85%;}

/* portfolio logos */
div#StoneAge .portfolioLogo img {margin: 0; width: 75%;}
a.portfolioLogo img.roverLogo, a.portfolioLogo img.petsOnWheels {width: 61%;}
img.pmiLogo {width: 140px;}
.portfolioLogo .nnLogo {width: auto;}
.portfolioLogo.networq {width: 159px;}
/*a.portfolioLogo {max-width: 150px;}*/
a.portfolioLogo img, img.portfolioLogo {margin: 10px 0 0 0;}
a.portfolioLogo:link, a.portfolioLogo:visited, img.portfolioLogo {opacity: .5;}
a.portfolioLogo:hover, a.portfolioLogo:active {opacity: 1;}
.portfolioLogo.fiji svg {width: 200px; height: 125px;}
.portfolioLogo.fiji svg img {width: 200px; height: 125px;}
.portfolioLogo.fiji {float: right;}
#MLB .portfolioLogo img {max-width: 65%;}
#Dinan .portfolioLogo img {max-width: 75%;}
#Networq .portfolioLogo img {max-width: 50%;} 
#ASU .portfolioLogo img {width: 75%;}
img.Cyberscope {width: 200px;}
a.portfolioLogo img.fijiLogo {width: auto!important;}

/* portfolio tags */
.categories > .tags{
	margin:0;
	padding:0;
	position:absolute;
	/*right:24px;
	bottom:-12px;*/
	list-style:none;
	letter-spacing: normal;
	}
	
	
	.categories > .tags li, .tags a{
	float:left;
	height:24px;
	line-height:24px;
	position:relative;
	font-size:11px;
	}
	
	.categories > .tags a{
	margin-left:20px;
	padding:0 10px 0 12px;
	background:#67009C;
	color:#fff;
	text-decoration:none;
	-moz-border-radius-bottomright:4px;
	-webkit-border-bottom-right-radius:4px;	
	border-bottom-right-radius:4px;
	-moz-border-radius-topright:4px;
	-webkit-border-top-right-radius:4px;	
	border-top-right-radius:4px;	
	} 
	
	.categories > .tags a:before{
	content:"";
	float:left;
	position:absolute;
	top:0;
	left:-12px;
	width:0;
	height:0;
	border-color:transparent #67009C transparent transparent;
	border-style:solid;
	border-width:12px 12px 12px 0;		
	}
	
	.categories > .tags a:after{
	content:"";
	position:absolute;
	top:10px;
	left:0;
	float:left;
	width:4px;
	height:4px;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	border-radius:2px;
	background:#fff;
	-moz-box-shadow:-1px -1px 2px #004977;
	-webkit-box-shadow:-1px -1px 2px #004977;
	box-shadow:-1px -1px 2px #004977;
	}
	
	.categories > .tags a:hover{cursor: default; background:#67009C;}	

.categories > .tags a:hover:before{border-color:transparent #67009C transparent transparent;}

/* contact */
ul.contact li {list-style-type: none;}
ul.contact li a:before {color: #fff; display: inline-block; font-size: 2em; font-family: 'icomoon' !important;}

/* PMI verification */
em.verifyCredential {line-height: initial; border: 1px solid #313131; display: inline; height: auto!important; padding: 3px 5px; letter-spacing: 0; font-size: .7em; margin: 0!important;} 
em.verifyCredential:hover {cursor: pointer;}
#resume .pmpCredential {width: 25%; float: right; margin: 0 0 0 1.5rem;}
#resume .pmpCredential span {font-style: italic; color: #333; display: block; font-size: 1rem; line-height: 1.1em; margin: 8px auto;}
.pmpCredential img {width: 55%; margin: 0 auto; display: block;}

/* resume */
#resume .pmpCredential span#verifyLinkOff {display:inline;}
#resume .pmpCredential:hover span#verifyLinkOff {display:none;}
#resume .pmpCredential span#verifyLinkOn {display:none;}
#resume .pmpCredential:hover span#verifyLinkOn {color: #67009C; cursor: pointer; display:inline;}
#resume p.lead {text-align: left;}
.resume-timeline h2 span {background: #000; padding: 5px 10px; border: 1px dotted #67009C; font-variant: small-caps; color: #fff;}
.resume-header h2:before {border-top: 1px solid #000;
        content:"";
        margin: 0 auto; /* this centers the line to the full width specified */
        position: absolute; /* positioning must be absolute here, and relative positioning must be applied to the parent */
        top: 50%; left: 0; right: 0; bottom: 0;
        width: 95%;
        z-index: -1;}
    
.resume-header h2 {
    position: relative;
    z-index: 1;
    text-align: center;    
   
}



.resume-header h2:before { 
    /* this is just to undo the :before styling from above */
    border-top: none; 
}

.resume-header h2:after {
    border-bottom: 1px solid #000;
    -webkit-box-shadow: 0 1px 0 0 #ccc;
    -moz-box-shadow: 0 1px 0 0 #ccc;
    box-shadow: 0 1px 0 0 #ccc;
    content: "";
    margin: 0 auto; /* this centers the line to the full width specified */
    position: absolute;
    top: 45%; left: 0; right: 0;
    width: 95%;
    z-index: -1;
}

p.lead a:link, p.lead a:visited, .timeline-content a:link, .timeline-content a:visited {color: #67009C!important; text-decoration: underline;}
p.lead a:hover, p.lead a:active, .timeline-content a:hover, .timeline-content a:active, .timeline-content a:focus {color: #AE15FC!important; text-decoration: underline;}
.form-field {margin: 2em 0;}
1.fa-award {line-height: 1.75em; font-size: 1.55em;}
/* hobbies */
.sliderBox .sliderCopy {/*float: left;width: 65%;*/}
.sliderBox .slideshow-container {/*float: right; */width: auto;}
.slideshow-inner {margin: 0; width: 300px; height: auto; text-align: center;}
.mySlides img {border-radius: 12px!important; width: 300px; height: 200px!important;}
.info-list span a:link, .info-list span a:visited {color: #67009C;}
.info-list span a:hover, .info-list span a:active, .info-list span a:focus {color: #AE15FC;}
.sliderCopy a i.fa.fa-instagram {margin-left: .35em;}
#message-warning {border: 3px solid #DAF7A6;}
#message-warning p {color: #DAF7A6; font-family: "poppins-regular", sans-serif; font-size: 2rem; line-height: 1.8;}
.infoLink strong:after {font-family: FontAwesome; content: "\f05a"; color: #313131; margin: 0 0 0 .35em; padding: 0 .35em 0 0; font-size: 1.25em;}
a.infoLink:hover strong, a.infoLink:active strong, a.infoLink:focus strong, a.infoLink:hover strong:after, a.infoLink:active strong:after, a.infoLink:focus strong:after {color: #67009C!important;}
.validators {border-top: 1px dotted #444; width: 55%; margin: 2em auto 0 auto; padding: 2em 0 0 0; text-align: center;}

/* slideshow */
* {box-sizing: border-box;}
/*body {font-family: Verdana, sans-serif;}*/
.mySlides {display: none;}
img {vertical-align: middle;}

/* Slideshow container */
.slideshow-container {
  max-width: 1000px;
  position: relative;
  margin: 0;
  width: 300px;
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;  
  text-align: center;
  width: 300px;
  font-weight: bold;
  text-shadow: 1px 1px 1px #333;
}

/* Number text (1/3 etc) */
.numbertext {
  /*color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;*/
  visibility: hidden;
}

/* The dots/bullets/indicators */
.dot {
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active {
  background-color: #717171;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

.dotControls {width: 300px; text-align: center; margin: 1em 0;}
a.close:after {font-family: 'FontAwesome'; content: "\f00d"; margin: 0 0 0 .3em;}
/*.lead a.pdf, .lead a.MSword {font-variant: small-caps;}*/
a.pdf:after {font-family: 'FontAwesome'; content: "\f1c1"; margin: 0 0 0 .3em; font-weight: normal;}
a.MSword:after {font-family: 'FontAwesome'; content: "\f1c2"; margin: 0 0 0 .3em; font-weight: normal;}
a.instagram:after {font-family: 'FontAwesome'; content: "\f16d"; margin: 0 0 0 .3em; font-weight: bold;}
a.htmlFile:after {font-family: 'FontAwesome'; content: "\f1c9"; margin: 0 0 0 .3em; font-weight: bold;}


@-webkit-keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .text {font-size: 11px}
}
.tooltipStyleOuter {color: purple;}
.tooltipStyle {background-color: purple; color: #fff; font-family:Arial, Helvetica, sans-serif;
    font-size:1.25em;
    line-height:1.2em;
    color:#fff;
    width:460px!important;
    padding:20px;
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
    border-radius:6px;
    background:#67009C!important;
    background:-webkit-linear-gradient(#67009C, #000)!important;
    background:-moz-linear-gradient(#67009C, #000)!important;
    background:-o-linear-gradient(#67009C, #000)!important;
    background:-ms-linear-gradient(#67009C, #000)!important;
    background:linear-gradient(#67009C, #000)!important;
    -moz-box-shadow: 3px 3px 4px rgba(0,0,0, .65)!important;
    -webkit-box-shadow: 3px 3px 4px rgba(0,0,0, .65)!important;
    box-shadow: 3px 3px 4px rgba(0,0,0, .65)!important;
    position:absolute;
    top:27px;
    left:-10px;}
    
/*    

body {
    background-color: #f6f6f6;
    width: 400px;
    margin: 20px auto;
    font: normal 13px/100% sans-serif;
    color: #444;
}*/
div.extraExp {
    display:none;
    padding: 10px;
    border-width: 0 1px 1px 0;
    border-style: solid;
    border-color: #fff;
    box-shadow: 0 1px 1px #ccc;
    margin-bottom: 5px;
    background-color: #f1f1f1;
	/*display: inline-block;*/
}
div.display {
	display: inline-block;
}
.totop {
    position: fixed;
    bottom: 10px;
    right: 20px;
}
.totop a {
    display: none;
}
a, a:visited {
    color: initial;
    text-decoration: none;
    /*display: block;
    margin: 10px 0;*/
}
a:hover {
    text-decoration: none;
}

.owl-prev {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

.owl-next {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}

.owl-carousel-block {
   margin: 0 auto;
   width: 640px;

   .item img {
      display: block;
      height: auto;
   }
   
   .js-owl-carousel-synced-thumbnails {
      margin-top: 20px;
      
      .synced {
         img {
            border: 3px solid red;
         }
      }
   }
}

p.intro-position span {text-shadow: 0 0 20px #fff, 0 0 15px #67009C, 0 0 20px #67009C, 0 0 25px #67009C, 0 0 30px #67009C, 0 0 35px #67009C, 0 0 40px #67009C;}


.mfp-wrap {
   .owl-carousel-block {
      width: 100vw;
   }
   .js-owl-carousel-synced-slides {
      .item img {
         width: 100vw;
         height: 600px;
      }
   }
}