/* =============================================================================

1. Fonts
2. General styles (Buttons, Inputs, Typography)
3. Page loading animation
4. Subpages changer
5. Site header (Panel with logo & navigation)
6. Site content
7. Subpages
  7.1. Home subpage
  7.2. About Me subpage
  7.3. Resume subpage
  7.4. Portfolio subpage
  7.5. Contact subpage
8. Sliders (testimonials & portfolio carousels)
9. Portfolio Full info page
10. Media Queries
11. Template Customization (Light or Dark style, Header background color, Header position)

============================================================================= */


/* ============================================================================= 
1. Fonts
============================================================================= */
/* 7 stroke icons font by Pixeden */
@import url('pe-icon-7-stroke.css'); /* Full icons list: 

/* Font awesome icons font */
@import url('font-awesome.css'); /* Full icons list: http://fontawesome.io/icons/ */

/* Google fonts */
@import url("http://fonts.googleapis.com/css?family=PT+Sans:400,700,400italic,700italic|Oxygen:300,400,700");


/* ============================================================================= 
2. General styles
============================================================================= */
html{height:100%;}
body{font-family:'PT Sans', Helvetica, sans-serif;color:#555;margin:0;height:100%;font-size:16px;line-height:1.5em;}
a{color:#ff724c;text-decoration:none;outline:none;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;-ms-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
a:hover{color:#e56845;text-decoration:none;outline:none;}
a:focus{outline:0;}
h1, h2, h3, h4, h5, h6{color:#222;font-family:'Oxygen', Helvetica, sans-serif;font-weight:700;line-height:1.5em;margin-top:0;margin-bottom:10px;}
p{font-size:0.875em;margin:0 0 10px;font-weight:300;}
p.lead{font-size:18px;margin:30px 0;}
img{vertical-align:bottom;max-width:100%;height:auto;border:0;-ms-interpolation-mode:bicubic;}
.page{position:relative;height:100%;}
.mobile-visible{display:none;visibility:hidden;}
.mobile-hidden{display:block;visibility:visible;}
/* Buttons */
input[type=submit], input[type=button], button, a.button{display:inline-block;position:relative;padding:0.8em 2em;margin-bottom:.25em;font-size:0.875em;line-height:1.2;border:0;outline:0;border:2px solid #ff724c;color:#222;text-shadow:none;background:none;border-radius:0;font-family:'PT Sans', Helvetica, sans-serif;}
.btn{border-radius:0;}
input[type=submit]:hover, input[type=submit]:focus, input[type=button]:focus, button:hover, button:focus, a.button:hover, a.button:focus{color:#fff;background-color:#ff724c;}
/* /Buttons */
/* Custom Scroll */
.mCSB_inside>.mCSB_container{margin-right:0;}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#ff724c;opacity:1;border-radius:0;}
.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,.mCSB_scrollTools .mCSB_dragger:focus .mCSB_dragger_bar{background-color:#ff724c;opacity:1;}
.mCSB_scrollTools .mCSB_draggerRail{background-color:#e5e5e5;}
/* /Custom Scroll */
/* Form controls */
.form-group{position:relative;margin:0 0 20px;}
.form-control,.form-control:focus{height:42px;}
.form-control,.form-control:focus,.has-error .form-control,.has-error .form-control:focus{position:relative;border:1px solid #bbb;border-radius:0;display:block;font-size:0.9em;margin:0;padding:10px 35px 10px 12px;width:100%;background:0 0;text-align:left;color:inherit;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;outline:none;font-family:'PT Sans', Helvetica, sans-serif;}
textarea.form-control, textarea.form-control:focus{height:auto;}
.form-control + .form-control-border{content:"";position:absolute;z-index:-1;left:50%;right:50%;bottom:0;background:#ff724c;height:2px;-webkit-transition:all 0.4s ease-in-out;-moz-transition:all 0.4s ease-in-out;-o-transition:all 0.4s ease-in-out;-ms-transition:all 0.4s ease-in-out;transition:all 0.4s ease-in-out;}
.form-control:focus + .form-control-border{left:0;right:0;z-index:1;}
.has-error .form-control + .form-control-border{background:#ff4c4c;}
.form-control-icon{position:absolute;top:9px;right:12px;font-size:24px;color:#aaa;}
.form-control:focus + .form-control-border + .form-control-icon{color:#ff724c;}
/* Placeholders */
.form-control::-moz-placeholder{color:#aaa;}
.form-control:-ms-input-placeholder{color:#aaa;}
.form-control::-webkit-input-placeholder{color:#aaa;}
/* /Placeholders */
.form-group .help-block{position:absolute;display:inline-block;padding:0px 5px;font-size:0.8em;line-height:1.5em;margin:-2px 0 0 10px;color:#fff;background:#ff4c4c;}
.form-group .help-block:after{content:" ";position:absolute;left:5px;bottom:100%;width:0;height:0;border-bottom:10px solid #ff4c4c;border-right:10px solid transparent;}
.form-group .help-block:empty{display:none;}
/* /Form controls */
.no-padding{padding:0;}
.subpage-block{margin-bottom:30px;}
.text-rotation{display:block;}
.border-block-top-40{display:inline-block;position:absolute;background:transparent;width:40px;height:40px;border-top:2px solid #ff724c;border-left:2px solid #ff724c;left:0;top:0;z-index:0;}
.border-block-bottom-40{display:inline-block;position:absolute;background:transparent;width:40px;height:40px;border-bottom:2px solid #ff724c;border-right:2px solid #ff724c;right:0;bottom:0;z-index:0;}
.border-block-bottom-60{display:inline-block;position:absolute;background:transparent;width:60px;height:60px;border-bottom:2px solid #ff724c;border-right:2px solid #ff724c;right:0;bottom:0;z-index:0;}
.border-block-top-110{display:inline-block;position:absolute;background:transparent;width:110px;height:110px;border-top:3px solid #ff724c;border-left:3px solid #ff724c;left:20px;top:10px;z-index:0;}
/* ============================================================================= 3. Page loadig animation============================================================================= */
.no-js .preloader{display:none;}
.preloader{position:fixed;left:0px;top:0px;width:100%;height:100%;z-index:9999;background:#fff;}
.preloader-animation{margin:-20px auto 0;top:50%;left:0;right:0;width:40px;height:40px;position:absolute;text-align:center;-webkit-animation:rotate 2.0s infinite linear;animation:rotate 2.0s infinite linear;}
.dot1, .dot2{width:60%;height:60%;display:inline-block;position:absolute;top:0;background-color:#ff724c;border-radius:100%;-webkit-animation:bounce 2.0s infinite ease-in-out;animation:bounce 2.0s infinite ease-in-out;}
.dot2{top:auto;bottom:0;-webkit-animation-delay:-1.0s;animation-delay:-1.0s;}
@-webkit-keyframes rotate{100%{-webkit-transform:rotate(360deg);}
}
@keyframes rotate{100%{transform:rotate(360deg);-webkit-transform:rotate(360deg) }
}
@-webkit-keyframes bounce{0%, 100%{-webkit-transform:scale(0.0);}
 50%{-webkit-transform:scale(1.0);}
}
@keyframes bounce{0%, 100%{transform:scale(0.0);-webkit-transform:scale(0.0);}
 50%{transform:scale(1.0);-webkit-transform:scale(1.0);}
}
/* ============================================================================= 4. Subpages changer============================================================================= */
.pt-wrapper{position:relative;width:100%;height:100%;padding:0;padding:25px 5%;background-color:#f5f5f5;background-attachment:fixed;background-position:50%;background-size:cover;-webkit-background-size:cover;background-attachment:scroll;background-position:center center;background-repeat:no-repeat;overflow:hidden;}
.subpages{position:relative;width:100%;height:100%;margin:0 auto;max-width:1240px;-webkit-perspective:1500px;-moz-perspective:1500px;perspective:1500px;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;backface-visibility:hidden;}
.pt-page{width:100%;height:100%;position:absolute;opacity:0;top:auto;padding:10px 0;left:0;background-color:#fff;overflow:hidden;visibility:hidden;-webkit-transform:translate3d(0, 0, 0);-o-transform:translate3d(0, 0, 0);-moz-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;-o-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-box-shadow:0 1px 33px rgba(0,0,0,0.15);-moz-box-shadow:0 1px 33px rgba(0,0,0,0.15);box-shadow:0 1px 33px rgba(0,0,0,0.15);}
.pt-page .section-inner{position:relative;padding:20px 60px 50px;}
.no-js .pt-page{position:relative;}
.pt-page-content{position:absolute;width:100%;}
.pt-page-current,.no-js .pt-page{visibility:visible;z-index:90;opacity:1;overflow:hidden;height:100%;min-height:100%;}
.pt-page.pt-page-current .portfolio-grid{display:block;}
.no-js .pt-page *{height:auto;}
.no-js body{overflow:auto;}
/*No Animation Support Message Style*/
.pt-message{display:none;position:absolute;z-index:99999;bottom:0;left:0;width:100%;background:#da475c;color:#fff;text-align:center;}
.pt-message p{margin:0;line-height:60px;font-size:26px;}
.no-cssanimations .pt-message{display:block;}
.section-with-bg{-webkit-backface-visibility:hidden;/* Chrome, Safari, Opera */
 backface-visibility:hidden;background-attachment:fixed;background-position:50%;background-size:cover;-webkit-background-size:cover;background-attachment:scroll;background-position:center center;background-repeat:no-repeat;}
.section-without-bg{background:transparent;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}
.section-paddings-0{padding:0;}
/* /Page changer */
/* ============================================================================= 5. Site header (Panel with logo & navigation)============================================================================= */
.header{position:fixed;width:150px;height:100%;background-color:#ff724c;overflow:auto;-webkit-box-shadow:0 1px 10px rgba(0,0,0,0.2);-moz-box-shadow:0 1px 10px rgba(0,0,0,0.2);box-shadow:0 1px 10px rgba(0,0,0,0.2);z-index:10;}
.my-photo{position:relative;margin:25px auto 10px;max-width:80px;text-align:center;z-index:0;}
.header .my-photo .border-block-bottom-40{border-color:#fff;}
.my-photo img{position:relative;border:2px solid #fff;}
.site-title-block{position:relative;z-index:1;margin:15px 20px 5px;text-align:center;}
.site-title{color:#fff;font-size:24px;font-weight:400;line-height:1.2em;margin:0;}
p.site-description{color:#f5f5f5;font-size:14px;font-weight:300;font-family:'Oxygen', Helvetica, sans-serif;margin:5px 0;}
/* Social links */
ul.social-links{display:block;list-style:none;margin:25px 0 5px;padding:0;text-align:left;}
ul.social-links li{display:inline-block;margin:0;padding:0;}
ul.social-links li a{display:inline-block;margin:0 1px;width:34px;height:34px;color:#555;background-color:transparent;border:1px solid #e5e5e5;text-align:center;}
ul.social-links li a:hover{color:#fff;background-color:#ff724c;border-color:transparent;}
ul.social-links li a i{font-size:16px;line-height:32px;}
ul.social-links li:last-child a{margin-right:0;}
/* /Social links */
.menu-toggle{display:block;width:50px;margin:0 4px;line-height:50px;height:50px;text-align:center;cursor:pointer;overflow:hidden;float:right;}
.menu-toggle i{color:#ff724c;font-size:21px;line-height:50px;}
/* ----- Header ----- */
/* ============================================================================= 6. Site content============================================================================= */
.site-main{height:100%;margin-left:150px;position:relative;background-color:#fff;}
/* Main menu */
.site-nav{display:block;padding:25px 0 30px;}
.site-main-menu{display:block;padding:0;margin:0;font-family:'Oxygen', Helvetica, sans-serif;}
.site-main-menu li{display:block;position:relative;padding:0;text-align:center;}
.site-main-menu li a,.site-main-menu li a:hover{display:block;position:relative;padding:10px 20px;text-align:center;color:#fff;font-size:15px;font-weight:400;position:relative;text-decoration:none;outline:none;opacity:0.6;border-bottom:1px solid rgba(255,255,255,0.12);}
.site-main-menu li:first-child a{border-top:1px solid rgba(255,255,255,0.12);}
.site-main-menu li a:hover,.site-main-menu li.active a{background-color:transparent;opacity:1;}
.site-main-menu li a:after{display:block;position:absolute;right:0;bottom:0;content:'';width:0;height:100%;margin:0 auto;background-color:#ff724c;-webkit-transition:all 0.2s ease-in-out;-moz-transition:all 0.2s ease-in-out;-o-transition:all 0.2s ease-in-out;-ms-transition:all 0.2s ease-in-out;transition:all 0.2s ease-in-out;}
.site-main-menu li a:hover:after,.site-main-menu li.active a:after{width:3px;}
.menu-icon{display:block;font-size:21px;margin-bottom:3px;text-align:center;}
/* /Main menu */
/* Main menu Top or Bottom Layout Styles*/
@media only screen and (min-width:992px){.layout-menu-top, .layout-menu-bottom{overflow:hidden;}
 .layout-menu-top .header, .layout-menu-bottom .header{top:0;height:80px;width:100%;padding:0 20px;}
 .layout-menu-top .site-main, .layout-menu-bottom .site-main{margin-top:80px;margin-left:0;height:calc(100% - 80px);}
 .layout-menu-top .my-photo, .layout-menu-bottom .my-photo{display:inline-block;float:left;margin:10px 25px 10px 0;width:60px;}
 .layout-menu-top .site-title-block, .layout-menu-bottom .site-title-block{position:relative;float:left;z-index:1;text-align:center;margin:0;}
 .layout-menu-top .site-title-block h1, .layout-menu-bottom .site-title-block h1{line-height:80px;}
 .layout-menu-top div.site-nav, .layout-menu-bottom div.site-nav{float:left;padding:0 0 0 40px;}
 .layout-menu-top .site-main-menu li, .layout-menu-bottom .site-main-menu li{display:inline-block;float:left;}
 .layout-menu-top .site-main-menu li a, .layout-menu-bottom .site-main-menu li a{height:80px;padding:18px 20px;border-top:0;border-bottom:0;}
 .layout-menu-top .site-main-menu li a:after, .layout-menu-bottom .site-main-menu li a:after, .layout-menu-top .site-main-menu li.active a:after, .layout-menu-bottom .site-main-menu li.active a:after{content:"";position:absolute;z-index:1;width:0;left:0;right:0;bottom:0;margin:0 auto;background-color:#ff724c;height:2px;-webkit-transition:width 0.3s ease-in-out;-moz-transition:width 0.3s ease-in-out;-o-transition:width 0.3s ease-in-out;-ms-transition:width 0.3s ease-in-out;transition:width 0.3s ease-in-out;}
 .layout-menu-top .site-main-menu li a:hover:after, .layout-menu-bottom .site-main-menu li a:hover:after{background-color:#ff724c;width:100%;height:2px;}
 .layout-menu-top .site-main-menu li.active a:after, .layout-menu-bottom .site-main-menu li.active a:after{background-color:#ff724c;width:100%;height:2px;}
 /* Main Menu Bottom Layout */
 .layout-menu-bottom .header{top:auto;bottom:0;}
 .layout-menu-bottom .site-main{margin-top:0;margin-bottom:80px;}
 .layout-menu-bottom .site-main-menu li a:after, .layout-menu-bottom .site-main-menu li a:hover:after, .layout-menu-bottom .site-main-menu li.active a:after{top:0;}
}
/* Section title */
.section-title-block{position:relative;margin-bottom:40px;text-align:center;}
.section-title-wrapper{display:inline-block;position:relative;text-align:right;}
.section-title{display:block;width:100%;position:relative;margin:12px 0 0;font-size:60px;line-height:1.1em;color:#eee;z-index:1;}
.section-description{display:inline-block;position:relative;margin:0;color:#fff;background-color:#ff724c;padding:0 10px;font-size:14px;font-weight:200;text-align:center;z-index:2;}
.block-title h3{display:inline-block;position:relative;margin:0 0 20px;padding:0;}
.block-title h3:after{content:'';display:block;position:absolute;width:2px;height:100%;left:-10px;bottom:0;background-color:#ff724c;}
/* ============================================================================= 7. Subpages============================================================================= */
/* =======================================7.1. Home subpage======================================= */
.table{display:table;table-layout:fixed;width:100%;min-height:100%;height:100%;overflow:hidden;margin:0;}
.table-v-align,.table > div{display:table-cell;vertical-align:middle;}
.home-page-block{position:relative;display:block;width:100%;z-index:1;}
.home-page-block h2{color:#ff724c;text-align:center;font-size:70px;margin:0;}
.home-page-description{color:#222;font-size:21px;font-weight:300;font-family:'Oxygen', Helvetica, sans-serif;margin:0 0 5px;text-align:center;}
/* =======================================7.2. About Me subpage======================================= */
.my-photo-block{position:relative;}
/* About me list */
.info-list{list-style:none;margin:0;padding:0;}
.info-list li{padding:5px 0;font-size:14px;}
.info-list li:first-child{padding-top:0;}
.info-list li .title{display:inline-block;font-family:'Oxygen', Helvetica, sans-serif;font-weight:700;margin-right:12px;color:#222;}
.info-list li .title:after{content:'';display:block;width:100%;height:2px;margin-top:-3px;background-color:#ff724c;}
.info-list li .value{font-family:'PT Sans', Helvetica, sans-serif;min-width:250px;}
/* /About me list */
/* Services */
.service-block{text-align:center;}
.service-block img{max-width:100px;max-height:74px;margin:0 0 18px;}
.service-icon{font-size:60px;color:#ff724c;margin:5px 0 18px;}
/* /Services */
/* Clients */
.client-block{text-align:center;padding:5px 0;opacity:0.4;-webkit-transition:all 0.2s ease-in-out;-moz-transition:all 0.2s ease-in-out;-o-transition:all 0.2s ease-in-out;-ms-transition:all 0.2s ease-in-out;transition:all 0.2s ease-in-out;}
.client-block:hover{opacity:1;}
.client-block img{max-width:80px;}
/* /Clients */
/* Fun Facts */
.fun-fact-block{position:relative;text-align:center;width:100%;display:block;margin:0;background:#fff;padding:20px 10px 15px;}
.fun-fact-block.gray-bg{background-color:#fafafa;}
.fun-fact-block h4{margin-top:10px;}
.fun-fact-block .pe-7s-icon{position:relative;font-size:56px;color:#888;}
.fun-fact-block .fun-value{font-size:24px;font-weight:300;display:block;margin:10px 0;color:#ff724c;}
/* /Fun Facts */
/* Testimonials */
.testimonials{width:100%;}
.testimonial-item{width:100%;margin:0 auto;}
.testimonial-credits{display:table;position:relative;margin:-15px auto 0;text-align:center;}
.testimonial-author{display:inline-block;font-size:15px;font-family:'Oxygen', Helvetica, sans-serif;color:#222;margin:0;font-weight:400;}
.testimonial-author-info{display:table-cell;position:relative;padding-left:12px;vertical-align:bottom;text-align:left;}
.testimonial-content{width:100%;height:auto;}
.testimonial-content .testimonial-text{padding:1em 1.2em 1.6em;font-style:italic;background-color:#fcfcfc;border:1px solid #e5e5e5;width:100%;position:relative;margin:0;z-index:-1;}
.testimonial-content .testimonial-text p{margin:0;}
.testimonial-picture{display:table-cell;width:60px;height:60px;background-color:#fcfcfc;overflow:hidden;margin:0;z-index:1;}
.testimonial-picture img{width:100%;border:1px solid #d5d5d5;}
.testimonial-firm{font-size:10px;line-height:1.5em;margin:0;text-transform:uppercase;font-style:italic;font-weight:lighter}
/* /Testimonials */
/* =======================================7.3. Resume subpage======================================= */
/* Timeline */
.timeline{position:relative;border-left:1px solid #f5f5f5;padding-bottom:10px;}
 .timeline-event{position:relative;padding-left:20px;padding-bottom:20px;}
 .timeline-event:last-child{padding-bottom:0px;}
.timeline-event > *{display:block;}
 .event-date{display:inline-block;position:relative;color:#fff;font-weight:300;line-height:1.1em;margin:0 0 3px;background-color:#ff724c;padding:5px 8px 5px 20px;margin-left:-20px;}
.event-date .event-icon{display:inline-block;position:absolute;top:-16px;left:-16px;background-color:#fff;z-index:1;height:26px;width:26px;text-align:center;border-top:1px solid #ff724c;border-left:1px solid #ff724c;}
.event-date .event-icon i{font-size:18px;line-height:26px;margin:0;color:#222;}
.event-name{margin:10px 0 0;}
.event-description{color:#a5a5a5;margin:0 0 4px;font-size:12px;font-weight:300;line-height:1.45em;}
/* Skills */
.skills-info{margin-bottom:30px;}
.skills-info h4{font-size:0.8em;line-height:1.1em;position:relative;margin:0 0 5px;}
.skill-container{background-color:transparent;border:1px solid #555;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;height:12px;margin-bottom:12px;width:100%;}
.skill-percentage{background-color:#ff724c;border:1px solid #fff;height:10px;padding:0;}
/* Animate skills on subpage load */
.pt-page .skill-percentage{-webkit-transition:all 2s ease-in-out;-moz-transition:all 2s ease-in-out;-o-transition:all 2s ease-in-out;-ms-transition:all 2s ease-in-out;transition:all 2s ease-in-out;}
.js .pt-page:not(.pt-page-current) .skill-percentage{width:0;}
.skill-percentage.skill-10{width:100%;}
/*Skill 1*/
.skill-percentage.skill-1{width:88%;}
/*Skill 2*/
.skill-percentage.skill-2{width:75%;}
/*Skill 3*/
.skill-percentage.skill-3{width:60%;}
/*Skill 4*/
.skill-percentage.skill-4{width:95%;}
/*Skill 5*/
.skill-percentage.skill-5{width:85%;}
/*Skill 6*/
.skill-percentage.skill-6{width:72%;}
/*Skill 7*/
.skill-percentage.skill-7{width:60%;}
/*Skill 8*/
.skill-percentage.skill-8{width:77%;}
/* Skills */
/* =======================================7.4. Portfolio subpage======================================= */
.portfolio-grid{margin-left:-0.5em;margin-right:-0.5em;}
.portfolio-grid figure{width:33.33333%;float:left;padding:3px;}
.portfolio-grid img{position:relative;display:block;width:100%;}
.portfolio-filters{list-style:none;padding:0;margin:0 0 2em;text-align:center;}
.portfolio-filters li{display:inline-block;}
.portfolio-filters li a,.portfolio-filters li a:hover{color:#888;text-decoration:none;}
.portfolio-filters li a:hover{background-color:#eee;}
.portfolio-filters li.active a,.portfolio-filters li.active a:hover{background-color:#ff724c;color:#fff;}
/* Direction-Aware Hover Effect */
.portfolio-grid figure a div{top:0px;left:-100%;padding:5px 20px;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;-ms-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
.portfolio-grid figure a:hover div{left:0px;}
.portfolio-grid figure{float:left;position:relative;}
.portfolio-grid figure a,.portfolio-rid figure a img{display:block;position:relative;}
.portfolio-grid figure a{position:relative;display:block;overflow:hidden;}
.portfolio-grid figure a div{position:absolute;background:#f5f5f5;background:rgba(245,245,245,0.95);width:100%;height:100%;color:#888;}
.portfolio-grid figure a div h5{display:inline-block;font-size:1rem;margin:10px 0;color:#222;}
.portfolio-grid figure a div small{color:#666;position:absolute;bottom:10px;left:20px;}
.portfolio-grid figure a div i{color:#ff724c;position:absolute;font-size:24px;bottom:14px;right:20px;margin:0;}
.portfolio-grid figure a div span{display:block;padding:10px 0;text-transform:uppercase;font-weight:normal;color:rgba(255,255,255,0.9);text-shadow:1px 1px 1px rgba(0,0,0,0.2);border-bottom:1px solid rgba(255,255,255,0.5);-webkit-box-shadow:0 1px 0 rgba(0,0,0,0.1), 0 -10px 0 rgba(255,255,255,0.3);-moz-box-shadow:0 1px 0 rgba(0,0,0,0.1), 0 -10px 0 rgba(255,255,255,0.3);box-shadow:0 1px 0 rgba(0,0,0,0.1), 0 -10px 0 rgba(255,255,255,0.3);}
/* End of Direction-Aware Hover Effect */
/* =======================================7.5. Contact subpage======================================= */
/* Contact info */
.contact-info-block{position:relative;text-align:left;width:100%;display:block;margin:0;padding:10px 10px 10px 0;}
.contact-info-block:last-child{margin-bottom:30px;}
.contact-info-block .ci-icon{position:absolute;top:50%;margin-top:-15px;}
.ci-text{position:relative;padding-left:50px;}
.contact-info-block h5{margin:5px 0;}
.contact-info-block .pe-7s-icon{position:relative;font-size:30px;color:#ff724c;}
/* /Contact info */
/* ============================================================================= 8. Sliders============================================================================= */
/* Testimonials Carousel */
.testimonials.owl-carousel .owl-nav{position:absolute;text-align:right;right:0;top:-48px;}
.testimonials.owl-carousel .owl-nav .owl-prev{margin-right:3px;}
.testimonials.owl-carousel .owl-nav .owl-prev,.testimonials.owl-carousel .owl-nav .owl-next{display:inline-block;background-color:#eee;-webkit-transition:all 0.2s ease-in-out;-moz-transition:all 0.2s ease-in-out;-o-transition:all 0.2s ease-in-out;-ms-transition:all 0.2s ease-in-out;transition:all 0.2s ease-in-out;}
.testimonials.owl-carousel .owl-nav .owl-prev:hover,.testimonials.owl-carousel .owl-nav .owl-next:hover{color:#fff;background-color:#ff724c;}
.testimonials.owl-carousel .owl-nav .owl-prev:before,.testimonials.owl-carousel .owl-nav .owl-next:before{position:relative;margin:2px;width:22px;height:22px;font-family:FontAwesome;font-size:21px;line-height:22px;text-align:center;display:block;cursor:pointer;}
.testimonials.owl-carousel .owl-nav .owl-prev:before{content:"\f104";}
.testimonials.owl-carousel .owl-nav .owl-next:before{content:"\f105";}
/* /Testimonials Carousel */
/* Portfolio Carousel */
.portfolio-page-carousel{overflow:hidden;}
.portfolio-page-carousel .owl-nav{position:absolute;top:50%;width:100%;margin-top:-20px;text-align:center;-webkit-tap-highlight-color:transparent;}
.portfolio-page-carousel .owl-nav [class*='owl-']{color:#888;margin:0;padding:4px 7px;background:#fff;display:inline-block;cursor:pointer;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;-ms-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
.portfolio-page-carousel .owl-nav [class*='owl-']:before{display:block;font-family:FontAwesome;font-size:30px;line-height:30px;}
.portfolio-page-carousel .owl-nav .owl-prev{position:absolute;margin-left:-50px;left:0;}
.portfolio-page-carousel:hover .owl-nav .owl-prev{margin-left:0;}
.portfolio-page-carousel .owl-nav .owl-next{position:absolute;margin-right:-50px;right:0;}
.portfolio-page-carousel:hover .owl-nav .owl-next{margin-right:0;}
.portfolio-page-carousel .owl-nav .owl-prev:before{content:"\f104";}
.portfolio-page-carousel .owl-nav .owl-next:before{content:"\f105";}
.portfolio-page-carousel .owl-dots{display:inline-block;position:absolute;bottom:0;right:0;margin:0 10px 5px;text-align:center;-webkit-tap-highlight-color:transparent;}
.portfolio-page-carousel .owl-dots .owl-dot{display:inline-block;}
.portfolio-page-carousel .owl-dots .owl-dot.active span, .portfolio-page-carousel .owl-dots .owl-dot:hover span{background:#888;}
.portfolio-page-carousel .owl-dots .owl-dot span{width:12px;height:12px;margin:5px;background:#f5f5f5;border:1px solid #888;display:block;-webkit-backface-visibility:visible;transition:opacity 200ms ease;border-radius:30px;}
/* Portfolio Carousel */
/* ============================================================================= 9. Portfolio Full info page============================================================================= */
.page-ajax-loaded{position:absolute;background-color:#fff;padding:10px 0;top:0;bottom:0;right:0;left:0;z-index:9999;overflow:hidden;}
.page-ajax-loaded:empty{display:none !important;}
.ajax-page-content{height:100%;overflow:auto;background-color:#fff;}
.ajax-page-wrapper{padding:20px 60px 30px;}
.ajax-page-nav{text-align:center;}
.ajax-page-nav > div.nav-item{position:relative;display:inline-block;margin:0 3px;}
.ajax-page-nav > div.nav-item a{display:inline-block;height:30px;width:30px;text-align:center;color:#888;}
.ajax-page-nav > div.nav-item a:hover{color:#ff724c;}
.ajax-page-nav > div.nav-item a i{line-height:30px;font-size:30px;}
.ajax-page-title{padding-top:10px;text-align:center;}
.ajax-page-title h1{display:inline-block;margin:0;}
.portfolio-block{padding-top:30px;}
.ajax-page-page-content img{max-width:100%;}
.portfolio-page-video,.portfolio-page-carousel,.portfolio-page-image{position:relative;width:100%;margin-bottom:20px;}
.project-general-info{list-style:none;padding:0;margin:0 0 15px;}
.project-general-info li{margin:0 0 10px;}
.project-general-info .fa{color:#ff724c;margin-right:5px;}
.project-general-info p{margin:0;}
.share-buttons{margin:25px 0 0;}
.share-buttons a{display:inline-block;margin:0 7px 0 0;padding:0;width:28px;height:28px;color:#888;background-color:#fff;border:1px solid #e5e5e5;text-align:center;}
.share-buttons a:hover{color:#fff;background-color:#ff724c;border-color:transparent;}
.share-buttons a:last-child{margin-right:0;}
.share-buttons a i{font-size:14px;line-height:26px;}
/* Tags Block */
.tags-block{margin:25px 0 0;}
.tags{list-style:none;margin:0;padding:0;}
.tags li{display:inline-block;margin:2px 0;}
.tags li a{font-size:13px;color:#555;padding:2px 7px;background-color:#fff;border:1px solid #e5e5e5;}
/* /Tags Block */
/* ============================================================================= 10. Media Queries ============================================================================= */
@media only screen and (max-width:1320px){.portfolio-grid figure{width:33.33333%;}
}
@media only screen and (max-width:991px){.mobile-visible{display:block;visibility:visible;}
 .mobile-hidden{display:none !important;visibility:hidden !important;}
 .border-block-top-110{display:none;}
 .header{width:100%;max-width:320px;height:calc(100% - 50px);top:50px;z-index:999;-webkit-box-shadow:5px 0px 20px 0px rgba(0,0,0,0.1);-moz-box-shadow:5px 0px 20px 0px rgba(0,0,0,0.1);box-shadow:5px 0px 20px 0px rgba(0,0,0,0.1);-webkit-transition:all 0.66s ease-in-out;-moz-transition:all 0.66s ease-in-out;-o-transition:all 0.66s ease-in-out;-ms-transition:all 0.66s ease-in-out;transition:all 0.66s ease-in-out;}
 .my-photo{margin-top:30px;}
 .site-title{font-size:27px;}
 .mobile-header{position:fixed;width:100%;height:50px;border-bottom:1px solid #eee;background-color:#fff;z-index:1000;}
 .mobile-logo-container{margin:0 20px;text-align:left;}
 .mobile-site-title{display:inline-block;float:left;font-size:18px;font-weight:400;font-family:'Oxygen', Helvetica, sans-serif;margin:0;line-height:50px;}
 .site-title-block .site-description{display:none;}
 .subpage-block{margin-bottom:40px;}
 .site-main{position:absolute;top:50px;bottom:0;width:100%;height:auto;margin:0;border:0;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}
 .section-title-block{margin-left:0;margin-right:0;margin-bottom:30px;}
 .section-title-wrapper{display:block;text-align:center;}
 .section-title{display:inline-block;position:relative;font-size:38px;}
 .section-title:after{display:none;}
 .section-title-block .section-description{position:relative;font-size:13px;margin-top:-10px;}
 p.site-description{color:#888;text-shadow:none;}
 .pt-wrapper{padding:0;margin:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
 .pt-page-current, .no-js .pt-page{overflow:auto;}
 .pt-page .section-inner{padding:5px 20px;}
 .mobile-menu-hide{margin-left:-100%;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}
 .home-page-block h2{font-size:60px;}
 .home-page-description{font-size:18px;}
 .ajax-page-wrapper{padding-left:20px;padding-right:20px;}
}
@media only screen and (max-width:769px){.portfolio-grid figure{width:50%;}
 .home-page-block h2{font-size:50px;}
 .home-page-description{font-size:18px;}
 .info-list{margin-top:20px;}
}
@media only screen and (max-width:480px){.portfolio-grid figure{width:100%;}
 .home-page-block h2{font-size:40px;}
 .home-page-description{font-size:16px;}
}
/* ============================================================================= 11. Template Customization============================================================================= */
/* Dark Template Style */
.template-style-dark .pt-page{background-color:#222;}
.template-style-dark .pt-page.section-without-bg{background-color:transparent;}
.template-style-dark h1,.template-style-dark h2,.template-style-dark h3,.template-style-dark h4,.template-style-dark h5,.template-style-dark h6{color:#fff;}
.template-style-dark p{color:#e5e5e5;}
.template-style-dark .section-title{color:#555;}
.template-style-dark input[type=submit],.template-style-dark input[type=button],.template-style-dark button,.template-style-dark a.button{color:#fff;}
.template-style-dark .form-control,.template-style-dark .form-control:focus,.template-style-dark .has-error .form-control,.template-style-dark .has-error .form-control:focus{color:#eee;border-color:#555;}
.template-style-dark .contact-info-block .pe-7s-icon{color:#aaa;}
.template-style-dark .home-page-block h2{color:#ff724c;}
.template-style-dark .home-page-description{color:#222;}
.template-style-dark .info-list li .title{color:#fff;}
.template-style-dark .info-list li .value{color:#eee;}
.template-style-dark ul.social-links li a{display:inline-block;margin:0 1px;width:34px;height:34px;color:#e5e5e5;background-color:transparent;border:1px solid #555;text-align:center;}
.template-style-dark ul.social-links li a:hover{color:#fff;background-color:#ff724c;border-color:transparent;}
.template-style-dark .testimonial-content .testimonial-text{background-color:#282828;border-color:#444;}
.template-style-dark .testimonial-picture img{border-color:#444;}
/* Invert Clients Logo Images (Black to White) */
.template-style-dark .client-block img{-webkit-filter:invert(100%);filter:invert(100%);}
.template-style-dark .fun-fact-block{background-color:transparent;}
.template-style-dark .fun-fact-block.gray-bg{background-color:#282828;}
.template-style-dark .skill-percentage{border-color:#222;}
.template-style-dark .timeline{border-color:#282828;}
.template-style-dark .ajax-page-nav > div.nav-item a{color:#aaa;}
.template-style-dark .mobile-header{background-color:#222;border-color:#444;}
.template-style-dark .mobile-header .mobile-site-title{color:#fff;}
.template-style-dark .page-ajax-loaded,.template-style-dark .ajax-page-content{background-color:#222;}
/* Header Light Color BG */
.header.header-color-light{background-color:#fff;}
.header.header-color-light .my-photo .border-block-bottom-40{border-color:#ff724c;}
.header.header-color-light .my-photo img{border:0;}
.header.header-color-light .site-title{color:#ff724c;}
.header.header-color-light .site-main-menu li a,.header.header-color-light .site-main-menu li a:hover{color:#222;border-color:#f5f5f5;}
.header.header-color-light .site-main-menu li a i,.header.header-color-light .site-main-menu li a:hover i{color:#ff724c;}
.header.header-color-light .site-main-menu li.active a:after{background-color:#ff724c;}
/* Header Light Color BG */
/* Header Dark Color BG */
.header.header-color-dark{background-color:#222;}
.header.header-color-dark .my-photo .border-block-bottom-40{border-color:#ff724c;}
/* /Header Dark Color */
/* Header Main Color BG */
.header-color-main .site-main-menu li a:after,.header-color-main .site-main-menu li a:hover:after,.header-color-main .site-main-menu li.active a:after{background-color:#fff;}
/* /Header Main Color BG */