ul{list-style: none;margin: 0;padding: 0;}
h1, h2, h3, h4, h5 {font-weight: 400;font-family: 'Oswald', sans-serif;color: #080808;text-transform: uppercase;}
.main-wrap{float: left;width: 100%;padding: 0 0 0 800px;}
.layout{float: left;width: 100%;position: relative;overflow: hidden;}
.profile-img-wrap{position: fixed;left:400px;top: 0;height: 100%;width: 400px;background: #eee;display: table;}
.profile-content{display: table-cell;width: 100%;vertical-align: middle;text-align: center;}
.profile-content h2{margin: 0 15px 30px;border-top: 1px solid #fff;border-bottom: 1px solid #fff;padding: 20px 0;line-height: 34px;}
.profile-content h2 span{display: block;font-size:16px;line-height: 34px;}
.profile-content h3{font-size: 16px;line-height: 21px;margin: 20px 15px;border-top: 1px solid #fff;border-bottom: 1px solid #fff;padding: 20px 0;}
.profile-img{width:250px;height:250px;display: inline-block;padding: 5px;background:#fff;position: relative;}
.profile-img img{float: left;width: 100%;max-width: 100%;position: relative;z-index: 2;}
.dot {border: 10px solid #08398f;background: transparent;height:400px;width:400px;position: absolute;top:-75px;left:-75px;z-index: 1;opacity: 0;}
#header{position: fixed;width:400px;left:0;top: 0;height: 100%;background: #08398f;}
#logo{padding: 50px 15px;margin: 0;color: #fff;text-transform: uppercase;text-align: center;background: #0b207d;}
.menu-wrap{float: left;width: 100%;padding:50px 15px;}
.hamberg{float:right;margin:8px 10px 0 0;position:relative; width:25px;height:25px;font-size:25px;line-height:25px;color:#fff;text-align:center;display:none;}
.hamberg .fa{position:absolute;left:0;top:0;}
.hamberg .fa.fa-window-close{display:none;}
.hamberg.active .fa.fa-bars{display:none;}
.hamberg.active .fa.fa-window-close{display:block;}
.force-show {
    display: block !important
}
ul#menu{float: left;width:100%;text-align: center;}
ul#menu li{float: left;width: 100%;border-bottom: 1px solid #162a86;font-family: 'Oswald', sans-serif;font-size: 14px;font-weight: 300;color: #FFF;text-transform: uppercase;line-height: 21px;}
ul#menu li:last-child{border-bottom:none;}
ul#menu li a{float: left;width: 100%;padding: 12px 0;color: #FFF;}
ul#menu li.active a{font-weight:500;color: #080808;}
#footer{position: fixed;width: 400px;left: 0;bottom: 0;padding: 15px 0;text-align: center;}
#footer p{text-transform: uppercase;font-family: 'Oswald', sans-serif;font-size: 11px;color: #fff;line-height: 18px;letter-spacing: 1px;font-weight: 300;}
ul.social{float: left;width: 100%;margin: 0 0 25px;}
ul.social li{float: left;width: 20%;height:60px;background:rgba(0, 0, 0, 0.075);border-right: 1px solid #162a86;position: relative;}
ul.social li a{float: left;width:100%;height:60px;text-indent: -99999px;position:relative;z-index: 2;}
ul.social li:last-child{border-right:none;}
ul.social li::after{color:#fff;left:50%;top:0;margin:0 0 0 -20px;width:40px;font-family: 'FontAwesome';position: absolute;font-size:25px;line-height:60px;text-align: center;height:60px;z-index: 1;}
ul.social li:nth-of-type(1)::after{content:"\f09a";}
ul.social li:nth-of-type(2)::after{content:"\f099";}
ul.social li:nth-of-type(3)::after{content:"\f0e1";}
ul.social li:nth-of-type(4)::after{content:"\f0d5";}
ul.social li:nth-of-type(5)::after{content:"\f16a";}
ul.social li:nth-of-type(1):hover{background: #3b579d;}
ul.social li:nth-of-type(2):hover{background: #1da1f2;}
ul.social li:nth-of-type(3):hover{background: #0177b5;}
ul.social li:nth-of-type(4):hover{background: #da4835;}
ul.social li:nth-of-type(5):hover{background: #ee1c1b;}
.slide {position: absolute;left: 0;top: 0;width: 100%;height: 100%;}
.slide.ng-enter {left: 100%;}
.slide.ng-enter-active {left: 0;}
.slide.ng-leave {left: 0;}
.slide.ng-leave-active {left: -100%;}
.content-hold{padding:70px;float: left;width: 100%;}
.content-block{float: left;width: 100%;}
.content-block .mCSB_outside+.mCSB_scrollTools {right: 0;}
.home-content{padding:300px 70px 70px;float: left;width: 100%;height: 100%;text-align: center;}
.home-content h1{line-height:50px;padding: 0;margin: 0;}
.key-skill-animation {font-weight:700;margin:50px 0 0 0;float:left;width:100%;color: #080808;font-size:60px;line-height:110px;letter-spacing: 2px;padding:20px;}
.key-skill-animation .word2{color: #08398f;}
ul.texts{float:left;width:100%;display: none;}
ul.texts li{float:left;width:100%;}
.about-colum{float: left;width: 100%;height: 100%;}
.about-colum h1{line-height:50px;padding: 0;margin: 0;}
ul.inform-list{float: left;width: 100%;margin: 50px 0 80px 0;padding: 0 50% 0 0;}
ul.inform-list li{float: left;width: 100%;border-bottom:1px solid #f3f1f1;line-height: 21px;padding: 10px 0;}
ul.inform-list li:last-child{border-bottom:none;}
ul.inform-list li strong,
ul.inform-list li span{display: inline-block;margin: 0 5px 0 0;}
ul.inform-list li strong{font-weight:500;}
.about-colum h3{padding: 0;margin: 0 0 15px;}
.about-colum p{padding: 0 15% 0 0;margin: 0 0 15px;}
.about-colum .btn-default{background: #080808;border: 1px solid #000;color: #fff;text-transform: uppercase;}
.about-colum .btn-default:hover{background: #08398f;border: 1px solid #e4a202;}
.skill-colum{float: left;width: 100%;height: 100%;}
.skill-colum h1{line-height:50px;padding: 0;margin: 0;}
.awesome-skill{padding:50px 0;float: left;width: 100%;border-bottom:1px solid #f3f1f1;}
.skill-colum h3{font-size:16px;line-height:23px;padding: 0;margin: 0 0 15px;}
.skill-chart{float: left;width:250px;position: relative;margin: 50px 0 0 0;}
.skill-chart canvas{float: left;}
.skill-char-text{position: absolute;left: 0;top: 0;width: 100%;height:250px;display: table;}
.skill-table{display: table-cell;width: 100%;vertical-align: middle;padding: 15px;}
.skill-table span{position: relative;display:inline-block;font-weight: 400;font-family: 'Oswald', sans-serif;font-size: 30px;line-height: 36px;margin: 0 0 5px;color: #08398f;}
.skill-table span::after{font-weight: 100;content: '%';}
.skill-table small{font-weight: 400;font-size: 14px;line-height: 21px;}
.works-well-colum{padding:50px 0;float: left;width: 100%;border-bottom:1px solid #f3f1f1;}
ul.work-well-row{float: left;width: 100%;margin:15px 0 0 0;}
ul.work-well-row li{float: left;width: 100%;margin:15px 0 0 0;padding: 30px 0 0 0;}
.skillbar{float: left;width: 100%;position:relative;background:#eee;height:6px;}
.skillbar-title {position:absolute;bottom:10px;left:0;font-weight:500;font-size:16px;color:#080800;line-height:23px;}
.skillbar-title span {display:inline-block;line-height:23px;}
.skillbar-bar {height:6px;width:0px;background:#8f8f8f;}
.skill-bar-percent {position:absolute;right:0px;bottom:10px;font-weight:500;font-size:20px;line-height:23px;color:#080800;}
.apps-tools-colum{padding:50px 0;float: left;width: 100%;border-bottom:1px solid #f3f1f1;}
ul.apps-tools-list{float: left;width: 100%;margin:15px 0 0 0;}
ul.apps-tools-list li{font-size: 14px;line-height: 21px;float: left;width:33.333%;margin:0 0 10px 0;position: relative;padding: 0 15px 0 13px;}
ul.apps-tools-list li::before{color: #080808;position: absolute;left: 0;top:0;content:"\f058";font-family: 'FontAwesome';font-size: 11px;line-height: 22px;}
.workflow-colum{padding:50px 0;float: left;width: 100%;}
.experience-colum{float: left;width: 100%;height: 100%;}
.experience-colum h1{line-height:50px;padding: 0;margin: 0;}
.experience-colum h3{font-size:18px;line-height:25px;padding: 0;margin: 0 0 10px;}
.experience-top-colum{padding: 50px 0;float: left;width: 100%;}
.experience-top-colum h2 {font-size: 16px;line-height: 23px;padding: 0;margin: 0 0 15px;}
ul.experience-list{float: left;width: 100%;}
ul.experience-list li{float: left;width: 100%;border-top:1px solid #f3f1f1;padding: 30px 0 20px 0;}
.company-img{float: left;width:105px; height: 105px;border: 5px solid #08398f;padding: 15px;position: relative;overflow: hidden;}
.company-img img{float: left;width:100%;max-width: 100%;}
.experience-right{float: left;width:60%;padding:5px 0 0 25px;}
.experience-bottom{float: left;width:100%;padding:25px 0 0 0;}
.experience-colum h4{font-size:25px;line-height:30px;padding: 0;margin: 0 0 5px;font-weight: 100;}
.experience-right span {font-size: 16px;color: #000;}
.education-colum{float: left;width: 100%;height: 100%;}
.education-colum h1{line-height:50px;padding: 0;margin: 0;}
.education-top-colum{padding: 50px 0;float: left;width: 100%;}
.education-top-colum h2 {font-size: 16px;line-height: 23px;padding: 0;margin: 0 0 15px;}
.education-colum h3{font-size:18px;line-height:25px;padding: 0;margin: 0 0 10px;}
.education-colum h4{font-size:21px;line-height:25px;padding: 0;margin: 0 0 5px;font-weight: 100;}
.portfolio-colum{float: left;width: 100%;height: 100%;}
.portfolio-colum h1{line-height:50px;padding: 0;margin: 0;}
.portfolio-top-colum{padding: 50px 0;float: left;width: 100%;}
.portfolio-top-colum h2 {font-size: 16px;line-height: 23px;padding: 0;margin: 0 0 15px;}
.contact-colum{float: left;width: 100%;height: 100%;}
.contact-colum h1{line-height:50px;padding: 0;margin: 0;}
.contact-top-colum{padding: 50px 0;float: left;width: 100%;}
.contact-top-colum h2 {font-size: 16px;line-height: 23px;padding: 0;margin: 0 0 15px;}
.contact-top-colum p{padding: 0 25% 0 0;}
ul.contact-details{float: left;width:60%;}
ul.contact-details li{float: left;width: 100%; position: relative;margin: 0 0 10px;padding: 0 0 0 50px;}
ul.contact-details li h4 {font-size: 14px;line-height: 19px;padding: 0;margin: 0 0 5px;}
ul.contact-details li::before{color:#08398f;left: 0;top:0;font-family: 'FontAwesome';position: absolute;}
ul.contact-details li:nth-of-type(1)::before{content: "\f041";font-size:40px;line-height:40px;}
ul.contact-details li:nth-of-type(2)::before{content:"\f095";font-size:35px;line-height:35px;}
ul.contact-details li:nth-of-type(3)::before{content:"\f0e0";font-size:30px;line-height:30px;}
ul.contact-details li:nth-of-type(4)::before{content:"\f17e";font-size:35px;line-height:35px;}
.contact-form-colum{float: left;width: 100%;margin:25px 0 0 0;border: 1px solid #eee;padding: 25px;}
.contact-form-colum h3{font-size:18px;line-height:25px;padding: 0;margin: 0 0 25px;}
.contact-form-colum textarea.form-control{height: 132px;}
.result-msg{float: left;width: 100%;}
.result-msg p.bg-success{background: #5cb85c;padding: 10px;margin: 0;color: #fff;}
.contact-colum ul.social{margin: 30px 0 0 0;}
.contact-colum ul.social li{background: #162a86;width: 60px;}
.social-network h4{margin: 0 0 15px;}
.grid-gallery {float: left;width: 100%;}
.grid-wrap{float: left;width: 100%;}
.grid-wrap ul {float: left;width: 100%; margin: 0 0 0 -15px;position: relative;}
.grid-wrap ul li {float: left;width:50%;padding: 15px;}
.grid-wrap ul li figure {float: left;width: 100%; margin:0;position: relative;cursor: pointer;padding: 10px;border: 1px solid #eee;}
.grid-wrap ul li figure img {float: left;width: 100%;max-width: 100%;border: 1px solid #eee;}
.grid-wrap ul li figure {-webkit-transition: opacity 0.2s;transition: opacity 0.2s;}
.grid-wrap ul li:hover figure {opacity: 1;}
.grid-wrap ul li figcaption {background: #162a86;opacity: 0;position: absolute;top: 0;left:0;width: 100%;height: 100%;}
.grid li:hover figcaption {opacity: 1;}
.figcaption-table{float: left;width: 100%;height: 100%;display: table;text-align: center;}
.figcaption-details {display: table-cell;width: 100%;vertical-align: middle;padding: 15px;}
.grid-wrap ul li figure figcaption img {float: none;display: inline-block;width: 50px;margin: 0 0 15px;}
.grid-wrap ul li figure figcaption h3 {margin: 0 0 10px;font-weight: 500;font-size: 20px;color: #080808;text-transform: uppercase;padding:0;}
.grid-wrap ul li figure figcaption span {border-bottom: 3px solid #162a86;color: #080808;display: block;font-size: 12px;margin:0;padding:0;text-transform: uppercase;}
.slideshow {position: fixed;;width: 100%;height: 100%;top: 0;left: 0;z-index: 500;opacity: 0;visibility: hidden;overflow: hidden;}
.slideshow-open .slideshow {opacity: 1;visibility: visible;}
.slideshow ul {width: 100%;height: 100%;float: left;}
.slideshow ul li {width: 700px;height: 630px;position: absolute;top:50%;left: 50%;margin: -315px 0 0 -350px;visibility: hidden;}
.slideshow ul li.show {visibility: visible;}
.slideshow ul li:after {content: '';position: absolute;width: 114%;height: 114%;top: 0;left: 0;background: rgba(255,255,255,0.8);}
.slideshow ul li.current:after {visibility: hidden;opacity: 0;}
.slideshow ul li figure {float: left;width: 100%;height: 100%;background: #fff;border:30px solid #fff;overflow: hidden;}
.slideshow ul li figure img {float: left;width: 100%;max-width: 100%;}
.slideshow ul li figure figcaption {float: left;width: 100%;margin: 0 0 20px;}
.slideshow ul li figure figcaption small{font-size:16px;line-height:21px;}
.slideshow ul li figure figcaption small a{color:#08398f;}
.slideshow ul li figure figcaption h3 {font-weight: 300;font-size: 25px;line-height: 32px;padding: 0;margin: 0 0 15px;}
.slideshow ul li figure figcaption span {border-bottom: 3px solid #08398f;color: #080808;display: block;font-size: 15px;line-height: 23px;margin:0 0 20px;padding:5px 0;text-transform: uppercase;}
.slideshow nav span {position: fixed;z-index: 1000;color: #080808;text-align: center;padding: 3%;cursor: pointer;font-size: 2.2em;}
.slideshow nav span:hover {color: #FFF}
.slideshow nav span.nav-prev, 
.slideshow nav span.nav-next {top: 50%;-webkit-transform: translateY(-50%);transform: translateY(-50%);}
.slideshow nav span.nav-close {top: 0;right: 0;padding: 0.5em 0.7em;color: #fff;background-color: #000;}
.slideshow nav span.nav-close:hover {background-color: #FFF;color: #000}
.icon:before, .icon:after {font-family: 'FontAwesome';speak: none;font-style: normal;font-weight: normal;font-variant: normal;text-transform: none;line-height: 1;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
span.nav-prev {left: 50%;margin-left: -537px;}
span.nav-prev:before {content: "\f053";}
span.nav-next {right: 50%;margin-right: -537px;}
span.nav-next:before {content: "\f054";}
span.nav-close:before {content: "\f00d";}