/**** GENERAL & PSEUDO CLASSES *****/

body{ -webkit-font-smoothing: antialiased; }
#main-container{ opacity: 0; transition: all .4s ease; -moz-transition: all .4s ease; -webkit-transition: all .4s ease;  }
.show-container{ opacity: 1 !important; }

.text-white{ color: #fff; }
.alt-text{ font-family: 'Playfair Display','Times New Roman', serif; font-weight: bold; font-style: italic; }
p{ font-size: 14px; color: #a6a5a5; line-height: 1.75  }
.facebook{ color: #3c5a97 !important; }
.twitter{ color: #55abed !important; }


.pad-large{ padding: 99px 0px 99px 0px; }
.pad-top{ padding-top: 99px; }
.pad-medium{ padding: 66px 0px 66px 0px; }

#loader{ opacity: 0; position: fixed; top: 0px; height: 100%; width: 100%; background: #ffffff; z-index: 999; }
#loader span{ display: block; margin-top: 22px; }
.show-loader{ opacity: 1 !important; }


/*** SLIDERS ****/

.slide-content h1{ font-size: 39px; font-weight: normal; color: #fff; line-height: 1.1; }

/**** COMMON PAGE ELEMENTS ****/

.page-title h6{ text-transform: uppercase; font-size: 14px; position: relative; }
.line{ width: 100%; background: #222; height: 4px; margin: 2px 0px 20px 0px; }

.adjectives{ font-family: 'Playfair Display','Times New Roman', serif; font-style: italic; font-size: 39px; }
.adjectives li{ list-style: none; line-height: 1.25; }

.dropcap { float: left; font-size: 75px; line-height: 60px; padding-top: 4px; padding-right: 8px; padding-left: 3px;  }

.btn{ cursor: pointer; display: inline-block; border: 3px solid #222222; padding: 22px 28px 22px 28px; text-align: center; text-transform: uppercase; letter-spacing: 3px; font-size: 14px; }



/***** NAVIGATION *****/

#navigation{ height: 147px; overflow: hidden; padding-top: 36px; position: fixed; top:0px; width: 100%; z-index: 998; background: #fff; transition: all .2s ease; -moz-transition: all .2s ease; -webkit-transition: all .2s ease; }
#navigation i{ font-size: 20px; color: #a6a5a5; position: relative; bottom: 5px;}

.shrink-nav{ height: 80px !important; padding-top: 16px !important; }
.shrink-nav #logo img{ max-width: 35px !important; }
.shrink-nav #menu{ padding-top: 12px; }

#logo img{ max-width: 55px; transition: all .2s ease; -moz-transition: all .2s ease; -webkit-transition: all .2s ease; }

#menu{ margin: 0px; list-style: none; display: inline-block; padding-top: 22px; }
#menu li{ float: left; margin-right: 9px; font-weight: bold;  }
#menu li a{ font-size: 12px; color: #222222; }

#mobile-toggle{ position: absolute; top: 60px; right: 22px; display: none; }
#mobile-toggle i{ cursor: pointer; font-size: 25px; color: #222222; }


/***** HOME ******/

#home-slider{ position: relative; margin-top: 147px; }
#home-slider .slides li{ height: 468px; background-size: cover !important; background-attachment: fixed !important; position: relative;  }
#home-slider .slides li:before{ content: ''; position: absolute; height: 100%; width: 100%; background-color: #222222; opacity: 0.4; }

/***** PROFILE *****/

.profile-paragraph{ padding-top: 48px; }
.profile-paragraph p{ font-size: 14px; color: #a6a5a5; text-align: justify; line-height: 1.75  }

/***** SKILLS *****/

#skills{ background: #eeeeee; }

#achievements-slider .slides li h1{ font-size: 100px; line-height: 0.9; }
#achievements-slider .slides li i{ position: relative; right: 20px; font-size: 85px; }
#achievements-slider .title{ display: block; font-family: 'Playfair Display','Times New Roman', serif; font-size: 22px; font-style: italic; line-height: 1.4}
#achievements-slider .since{ font-family:'Montserrat'; text-transform: uppercase; letter-spacing: 1px; font-size: 12px; font-weight: bold; }

.skill{ overflow: hidden; margin-bottom: 32px; }
.skill span{ font-size: 14px; font-weight: bold; }
.skill-points{ list-style: none; margin: 0; overflow: hidden; display: inline-block; }
.skill-points li{ float: left; width: 12px; height: 12px; border-radius: 50%; margin-right: 11px; }
.skill-points li:last-child{ margin-right: 0px; }
.skill-points .filled{ background: #222222; }
.skill-points .un-filled{ border: 2px solid #222; }

/***** CLIENTS *****/

#clients{ background: url('../img/cm_home5.jpg'); background-attachment: fixed; background-size: cover; padding: 130px 0px 130px 0px; }

#client-text{ font-size: 18px; color: #fff; display: inline-block; margin-top: 11px; }
#client-text i{ color: #e82646; font-size: 22px; } 

.client{ text-align: center; }
.client img{ max-width: 90%; opacity: 0.7	3; }

/**** EDUCATION & EMPLOYMENT *****/

#education{ margin-bottom: 99px; }

.milestones{ overflow: hidden; list-style: none; padding-top: 0px; }
.milestones li{ overflow: hidden; border-bottom: 2px solid #eaebeb; padding-bottom: 11px; margin-bottom: 22px; }
.milestones li .title{ font-size: 14px; line-height: 1;  }
.milestones li .institution{ font-size: 14px; font-family: 'Playfair Display','Times New Roman', serif; font-style: italic; color: #949494; position: relative; bottom: 4px;  }
.milestones li .time{ text-transform: uppercase; font-size: 12px; }

.milestones .icon-holder{ margin-right: 11px; float: left; }
.milestones .icon-holder i{ font-size: 36px; }

/**** SERVICES ****/

.service-p{ opacity: 0; display: block; float: none; clear: both; max-height: 0px; margin-bottom: 0px !important; transition: all .2s ease; -moz-transition: all .2s ease; -webkit-transition: all .2s ease; overflow: hidden; }
.open-service{ max-height: 350px !important; margin-top: 22px !important; margin-bottom: 22px !important; opacity: 1 !important; }

.service-more{ cursor: pointer; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; }

/***** QUOTE DIVIDER *****/

#quote-divider{ position: relative; }

#quote-slider .slides li{ height: 368px; position: relative; background-size: cover !important; background-attachment: fixed !important; }
#quote-slider .slides li:before{ content: ''; position: absolute; height: 100%; width: 100%; background: #ffffff; opacity: 0.5; }
#quote-slider .flex-control-paging li a{ border: 2px solid #222222; }
#quote-slider .flex-control-paging li a:hover{ background: #222222; }
#quote-slider .flex-control-paging li a.flex-active{ background: #222222; }
#quote-slider .slides li h1{ color: #222222; }

/***** WORK *****/

#projects-container{ overflow: hidden; padding-top: 44px; margin-bottom: 130px; }

.project-wrapper{ float: left; margin-bottom: 30px; }
.project{ display: inline-block; width: 90%; position: relative; z-index: 1; }
.project-overlay{ position: absolute; z-index: 2; height: 100%; width: 100%; text-align: center; background: rgba(0,0,0,0.8); color: #fff; opacity: 0; transition: all .2s ease; -webkit-transition: all .2s ease; -moz-transition: all .2s ease;  }
.project-overlay .title{ display: block; }
.project-overlay .thin-line{ height: 1px; background: #ffffff; width: 30px; display: inline-block; padding: 0px 11px 0px 11px; position: relative; bottom: 4px; }

.project:hover .project-overlay{ opacity: 1; padding: 22px; top: -7px; left: -7px; transition: all .2s ease; -webkit-transition: all .2s ease; -moz-transition: all .2s ease;  }

.view-btn{ font-family: 'Playfair Display','Times New Roman', serif; font-style: italic; margin-top: 4px; display: inline-block;  }

/***** PROJECT SINGLE *****/

.project-single-top .line{ height:2px; width: 100%; margin: 0px auto; opacity: 0.1; }
.project-single-top .close-project{ display: inline-block; margin: 0px 0px 44px 0px; font-size: 32px; cursor: pointer; opacity: 0.1; }

.project-details{ margin: 0; list-style: none; overflow: hidden; }
.project-details .date{ font-family: 'Playfair Display','Times New Roman', serif; font-style: italic; color: #949494; position: relative; bottom: 4px; }

.project-single{  padding-bottom: 99px; }

.project-single p{ font-size: 14px; color: #a6a5a5; line-height: 1.75; margin-top: 22px;  }

.closep-container{ text-align: center; opacity: 0.6; margin-top: 138px; }

.closep-container .line{ width: 38%; height: 2px; background: #222222; margin: 0; display: inline-block; position: relative; bottom: 9px; }
.closep-container i{ font-size: 26px; width: 20%; display: inline-block; cursor: pointer;  }

.project-slider .flex-control-paging li a{ border: 2px solid #222222; }
.project-slider .flex-control-paging li a:hover{ background: #222222; }
.project-slider .flex-control-paging li a.flex-active{ background: #222222; }

#ajax-container{ 
	overflow: hidden; 
	-webkit-transition: max-height 1s, opacity 0.5s; 
	transition: max-height 1s, opacity 0.5s; 
	-moz-transition: max-height 1s, opacity 0.5s;
	max-height: 1000px;
	opacity: 1;
}

.closed-container{ max-height: 0px !important; opacity: 0 !important;  }



/***** CONTACT *****/

#contact{ background: #eeeeee; padding: 130px 0px 130px 0px; }

#contact-text{ font-size: 18px; display: inline-block; }
#contact-text .btn{ margin-left: 27px; }
#contact-text a{ color: #222222; }


/***** FOOTER *****/

#footer{ padding-top: 77px; padding-bottom: 99px; background: #222222; }
#uppercopy{ color: #bdc0c2; font-size: 12px; }
#lowercopy{ color: #6f7071; font-size: 12px; padding-top: 4px; display: inline-block; }
#lowercopy i{ color: #e82646; font-size: 16px; }

#footer-social{ list-style: none; display: inline-block; overflow: hidden; margin: 0; }
#footer-social li{ float: left; margin-right: 11px; font-size: 14px; }
#footer-social li a{ color: #9c9fa0; }