*/body {
    color: #a5b3ce;
    background: #19202e;
    font-family: "Inter", sans-serif
}

h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6 {
    color: #d7dde9;
    color: #fff;
    font-weight: bold
}

a {
    color: #629feb;
    text-decoration: none
}

a:hover {
    color: #6ba5ec;
    text-decoration: underline
}

.text-highlight {
    color: #629feb !important;
    font-weight: 600
}

small,
.small {
    font-size: .75rem
}

.btn,
a.btn {
    font-weight: bold;
    padding: .675rem 1.5rem;
    font-size: 1rem;
    outline: none;
    border-radius: 2rem;
    text-decoration: none
}

.btn svg,
a.btn svg {
    stroke-width: 2px;
    margin-left: .25rem
}

.btn:focus,
.btn.focus,
.btn:active {
    box-shadow: none !important;
    transition: all .4s ease-in-out;
    outline: none
}

@media(prefers-reduced-motion: reduce) {
    .btn:focus,
    .btn.focus,
    .btn:active {
        transition: none
    }
}

.btn-primary {
    color: #fff;
    background: #fe655c
}

.btn-primary:hover,
.btn-primary:active {
    color: #fff;
    background: #fe4d43;
    border-color: #fe4d43
}

.btn-primary svg {
    stroke-width: 2px
}

.btn-secondary {
    color: #fff;
    background: #465981;
    border-color: #465981
}

.btn-secondary:hover,
.btn-secondary:active {
    color: #fff;
    background: #4f6591;
    border-color: #4f6591
}

.theme-btn-ghost {
    color: #fff;
    background: none;
    border-color: #fff
}

.form-control {
    padding-top: .875rem;
    padding-bottom: .875rem;
    border-color: #273248;
    background-color: #273248;
    color: #fff
}

.form-control::-webkit-input-placeholder {
    color: #a5b3ce
}

.form-control:-moz-placeholder {
    color: #a5b3ce
}

.form-control::-moz-placeholder {
    color: #a5b3ce
}

.form-control:-ms-input-placeholder {
    color: #a5b3ce
}

.form-control:focus {
    box-shadow: none;
    border: 1px solid #273248;
    background-color: #303e59;
    color: #fff
}

.form-text {
    font-size: .8rem
}

textarea.form-control {
    height: inherit
}

.error {
    color: #d9603c
}

.form-group label.error {
    font-size: .875rem;
    padding: .5rem 0
}

.form-group .btn {
    line-height: 1
}

.form-select {
    border-color: rgba(215, 221, 233, .1);
    height: 2.5rem;
    color: rgba(255, 255, 255, .3)
}

a.more-link {
    text-decoration: none;
    color: #629feb;
    font-weight: 600;
    font-size: .875rem
}

a.more-link:hover {
    text-decoration: underline;
    color: #4b91e8
}

a.more-link:hover .link-arrow {
    margin-left: .5rem
}

a.more-link .link-arrow {
    transition: all .2s ease-in-out;
    display: inline-block
}

@media(prefers-reduced-motion: reduce) {
    a.more-link .link-arrow {
        transition: none
    }
}

a.more-link .link-arrow .bi {
    position: relative;
    top: 1px
}

.limit-max-width {
    max-width: 500px;
    width:100%;
}

.top-bar {
    min-height: 60px;
    padding-top: 1rem
}

.top-bar .top-bar-cta {
    position: absolute;
    right: 0;
    padding: .5rem 1.25rem;
    font-size: .875rem
}

.menu-toggler {
    position: absolute;
    display: block;
    left: 0;
    top: 1rem;
    color: #d7dde9;
    border-radius: 6px;
    text-align: center;
    z-index: 1050
}

.menu-toggler:hover {
    color: #fff
}

.social-list a {
    width: 38px;
    height: 38px;
    padding-top: 6px;
    font-size: 17px;
    display: inline-block;
    text-align: center;
    border-radius: 50%;
    background: #9E2031;
    color: #fff;
}

.social-list a:hover,
.social-list a:focus {
    color: #000;
    background: #9E2031;
    transition: all .2s ease-in-out
}

@media(prefers-reduced-motion: reduce) {
    .social-list a:hover,
    .social-list a:focus {
        transition: none
    }
}

.side-panel .navbar {
    padding: 0
}

.side-panel .offcanvas {
    width: auto;
    border: none;
    background: none;
    color: #a5b3ce;
    top: 0
}

.side-panel .offcanvas-body {
    padding: 0;
    padding-left: 1rem
}

.side-panel .main-nav {
    background: rgba(0, 0, 0, .1);
    padding: 1rem .5rem;
    border-radius: 6px
}

.side-panel a {
    color: #a5b3ce
}

.side-panel a:hover {
    text-decoration: none
}

.side-panel .icon-holder {
    font-size: 1.125rem;
    min-height: 25px
}

.side-panel .nav-text {
    text-transform: uppercase;
    font-size: .675rem
}

.side-panel .navbar-nav .nav-link.active {
    color: #fe655c
}

.side-panel .navbar-nav .nav-link.active:hover {
    color: #fe655c
}

.side-panel .navbar-nav .nav-link:hover {
    color: #fff
}

.side-panel .nav-item-close .btn-close {
    color: #d7dde9;
    background-image: none;
    font-weight: 900;
    font-size: 2rem;
    outline: none
}

.side-panel .nav-item-close .btn-close:hover,
.side-panel .nav-item-close .btn-close:focus {
    color: #fff;
    box-shadow: none;
    -webkit-opacity: 1;
    -moz-opacity: 1;
    opacity: 1
}

.section {
    background: #1e2738;
    border-bottom: 10px solid #a61428;
    padding: 3rem;
    border-radius: .5rem;
    color: #a5b3ce;
    margin-bottom: 2.5rem;
    box-shadow: 0px 0px 10px 10px rgba(0,0,0,0.1);
}

.section.has-profile-image {
    margin-top: 90px;
    position: relative;
    padding-top: calc(75px + 1rem)
}

.btn-red {
    background:#9E2031;
    color:#fff;
}

.btn-red:hover {
    background:#871C2C;
    color:#fff;
}

.profile-intro {
    border-left:5px solid #9E2031;
    padding-left:25px;
    padding-right:25px;
    padding-top:25px;
    padding-bottom:25px;
    background:rgba(30,39,56,0.8);
}

.section-heading {
    font-size: 1.75rem;
    text-align: center;
    color: #fff;
    font-weight: 900;
    letter-spacing: .1rem
}

.section-subheading {
    font-size: 1.125rem;
    color: #fff
}

.section-intro {
    margin: 0 auto
}

.page-intro-section {
    background:url(../images/bg.png) center no-repeat #000 !important; 
    background-size:auto !important; 
    background-position:-820px 0px !important;
}

.page-intro-section .intro-name {
    font-size: 1.75rem;
    font-weight: 900;
    letter-spacing: .1rem
}

.page-intro-section .intro-content {
    margin-top: 1rem
}

.page-intro-section .profile-intro {
    position: relative
}

.footer .copyright a {
    color: #a5b3ce
}

.mode-toggle {
    position: absolute;
    left: 50px;
    top: 1.2rem
}

.mode-toggle .toggle {
    display: none
}

.mode-toggle .toggle+.toggle-btn {
    outline: 0;
    display: flex;
    align-items: center;
    justify-content: space-around;
    width: 47px;
    height: 26px;
    position: relative;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    transition: all .3s ease-in-out;
    border: 2px solid #a5b3ce;
    border-radius: 54px
}

@media(prefers-reduced-motion: reduce) {
    .mode-toggle .toggle+.toggle-btn {
        transition: none
    }
}

.mode-toggle .toggle+.toggle-btn .toggle-icon {
    color: #a5b3ce;
    font-size: 10.25px;
    display: flex
}

.mode-toggle .toggle+.toggle-btn::-moz-selection {
    background: none
}

.mode-toggle .toggle+.toggle-btn::selection {
    background: none
}

.mode-toggle .toggle+.toggle-btn:after,
.mode-toggle .toggle+.toggle-btn:before {
    position: absolute;
    display: block;
    content: "";
    width: 50%;
    height: 100%
}

.mode-toggle .toggle+.toggle-btn:after {
    left: 4px;
    top: 2.5px;
    transition: all .2s ease-in-out;
    content: "";
    border-radius: 50%;
    width: 16px;
    height: 16px;
    background: #d7dde9
}

@media(prefers-reduced-motion: reduce) {
    .mode-toggle .toggle+.toggle-btn:after {
        transition: none
    }
}

.mode-toggle .toggle+.toggle-btn:before {
    display: none
}

.mode-toggle .toggle:checked+.toggle-btn {
    border: 2px solid #354765;
    background: none
}

.mode-toggle .toggle:checked+.toggle-btn:after {
    left: 50%;
    background: #354765
}

.mode-toggle .toggle:checked+.toggle-btn .toggle-icon {
    color: #354765
}

.featured-project-list .card {
    background: none;
    border: none
}

.featured-project-list .card-title {
    font-size: 1.125rem
}

.featured-project-list .card-title a {
    color: #d7dde9;
    text-decoration: none
}

.featured-project-list .card-title a:hover {
    color: #629feb
}

.featured-project-list .card-text,
.featured-project-list .card-link {
    font-size: 1rem
}

.slider-container {
    position: relative
}

.slider-container .quote-holder {
    position: relative;
    padding-top: 1rem
}

.slider-container .quote-content {
    font-size: 1.125rem;
    line-height: 1.8;
    font-style: italic
}

.slider-container .quote-icon {
    position: absolute;
    font-size: 1.5rem;
    color: rgba(255, 255, 255, .1)
}

.slider-container .quote-icon.fa-quote-left {
    left: 0;
    top: 0
}

.slider-container .quote-icon.fa-quote-right {
    right: 0;
    top: 0
}

.slider-container .quote-highlight {
    color: #629feb;
    font-weight: bold
}

.slider-container .source-holder {
    font-size: .875rem;
    color: #a5b3ce
}

.slider-container .tns-nav {
    display: block;
    margin-top: 1rem
}

.slider-container .tns-nav button {
    width: 8px;
    height: 8px;
    padding: 0;
    margin: 0 5px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .3);
    border: 0
}

.slider-container .tns-nav button.tns-nav-active {
    background: rgba(255, 255, 255, .8)
}

.slider-container .slider-custom-controls div {
    font-size: 1.25rem;
    display: inline-block;
    color: rgba(255, 255, 255, .5);
    border-radius: 50%;
    width: 54px;
    height: 54px;
    position: absolute;
    top: 50%;
    margin: 0;
    margin-top: -46px;
    outline: none;
    cursor: pointer;
    text-align: center;
    background: rgba(0, 0, 0, .05)
}

.slider-container .slider-custom-controls div:hover {
    color: #629feb;
    background: rgba(0, 0, 0, .2)
}

.slider-container .slider-custom-controls div.prev {
    left: -1rem;
    padding-top: .75rem
}

.slider-container .slider-custom-controls div.next {
    right: -1rem;
    padding-top: .75rem
}

.client-logo-list .logo-holder {
    display: flex;
    height: 100%;
    max-height: 80px;
    padding: 1rem;
    background: rgba(0, 0, 0, .1);
    border-radius: 6px;
    justify-content: center
}

.client-logo-list .logo-holder img {
    max-width: 80px;
    width: 100%;
    height: auto;
    -webkit-opacity: .6;
    -moz-opacity: .6;
    opacity: .6
}

.tech-list .icon-item {
    width: 80px
}

.tech-list .icon-item img {
    max-width: 100%;
    height: auto
}

.skill-blocks .item {
    padding: 1rem;
    margin-bottom: 1.5rem
}

.skill-blocks .item-icon-holder {
    width: 70px;
    height: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, .3);
    color: #d7dde9;
    margin-bottom: 1.125rem
}

.skill-blocks .item:hover .item-icon-holder {
    border: 2px solid #9e2031;
}

.skill-blocks .item-icon-holder .item-icon {
    font-size: 2rem
}

.skill-blocks .item-title {
    font-size: 1.125rem
}

.projects-section .project-item {
    background:#111;
    padding:15px;
    border-radius:15px;
    border-bottom:2px solid #111;
}

.projects-section .project-item:hover {
    border-bottom:2px solid #A61428;
}

.projects-section .project-item .title {
    font-size: 1.125rem
}

.projects-section .project-item .title a {
    color: #fff;
    text-decoration: none
}

.projects-section .project-item .title a:hover {
    color: #629feb;
    text-decoration: underline
}

.projects-section .project-item .subtitle {
    font-size: .875rem
}

.projects-section .project-description .intro {
    margin-bottom:40px;
}

.projects-section .project-description {
    display:flex;
    flex-direction:column;
    min-height:230px;
    flex-grow:1;
}

.project-item-inner .date {
    color:#777;
    margin-top: auto;
}

.section-heading {
    color:#fff;
}

.projects-section .project-item .project-thumb {
    box-shadow: 0px 0px 10px 10px rgba(0,0,0,0.1);
    border-bottom:3px solid #A61428;
}

.featured-project-list .card img {
    box-shadow: 0px 0px 10px 10px rgba(0,0,0,0.1);
    border-bottom:3px solid #000;
}

.featured-project-list .card img:hover {
    border-bottom:3px solid #A61428;
}

.projects-section .project-thumb {
    max-width: 320px;
    width: 100%
}

.tech-stack img {
    width: auto;
    height: 25px
}

.tech-stack .list-label {
    color: #a5b3ce
}

.contact-cta .intro {
    max-width: 400px;
    margin: 0 auto
}

.case-study-heading {
    font-size: 1.65rem;
    color: #fff
}

.case-study-section-content h4,
.case-study-section-content .h4 {
    font-size: 1.125rem
}

.key-results .item .item-icon {
    font-size: 2rem
}

.key-results .item .key-data {
    font-weight: bold;
    font-size: 2rem;
    color: #fff
}

.key-results .item .key-data-desc {
    color: rgba(255, 255, 255, .3);
    font-size: .75rem
}

.result-item .result-data {
    width: 100px;
    height: 100px;
    border: 2px solid #fff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 1.5rem;
    color: #fff;
    font-weight: 700
}

.leadgen-section .section-heading {
    font-size: 1.5rem
}

.resume-wrapper {
    margin-top: 90px;
    position: relative;
    padding-top: calc(75px + 1rem);
    background: #1e2738
}

.resume-profile-pic {
    max-width: 160px;
    height: auto;
    position: absolute;
    left: 50%;
    margin-left: -80px;
    top: -80px;
    border: 8px solid #1e2738
}

.resume-name {
    letter-spacing: .5rem;
    font-size: 2.25rem;
    color: #fff;
    font-weight: 900
}

.resume-role-title {
    font-size: 1.125rem;
    letter-spacing: .25rem;
    color: #a5b3ce;
    font-weight: 500
}

.resume-body .col-main {
    border-right: 1px solid rgba(255, 255, 255, .2)
}

.resume-section {
    margin-bottom: 2rem
}

.resume-section-heading {
    font-size: 1.125rem;
    letter-spacing: .15rem;
    color: #fff;
    font-weight: 900;
    display: flex;
    align-items: center
}

.resume-section-heading-icon {
    border-radius: 50%;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 38px;
    height: 38px;
    padding-left: .15rem;
    background: rgba(0, 0, 0, .15);
    font-size: 1.125rem;
    color: #d7dde9
}

.resume-contact {
    border-top: 1px solid rgba(255, 255, 255, .2);
    border-bottom: 1px solid rgba(255, 255, 255, .2);
    padding: 1rem;
    font-size: .875rem
}

.resume-contact-icon {
    font-size: 1.125rem;
    vertical-align: middle
}

.resume-timeline {
    padding-left: 2.5rem
}

.resume-timeline:before {
    content: "";
    display: inline-block;
    width: 3px;
    height: 100%;
    background: rgba(0, 0, 0, .1);
    left: 13px;
    top: 16px;
    position: absolute
}

.resume-position-meta {
    font-size: .75rem
}

.resume-company-name {
    background: rgba(0, 0, 0, .1);
    padding: .2rem .5rem;
    border-radius: .25rem;
    font-weight: 600
}

.resume-position-title {
    font-size: 1.125rem;
    color: #fff
}

.resume-timeline-item:before {
    content: "";
    display: inline-block;
    position: absolute;
    left: -30px;
    top: 3px;
    width: 10px;
    height: 10px;
    border: 2px solid #a5b3ce;
    background: rgba(0, 0, 0, .3);
    border-radius: 50%
}

.resume-timeline-list {
    padding-left: 1rem
}

.resume-timeline-list li {
    margin-bottom: .5rem
}

.resume-degree {
    color: #fff;
    font-weight: bold;
    font-size: .875rem
}

.resume-degree-org {
    font-size: .85rem
}

.resume-degree-time {
    font-size: .85rem
}

.resume-skill-name {
    margin-bottom: .25rem;
    color: #fff;
    font-size: .875rem;
    font-weight: bold
}

.resume-progress {
    border-radius: .25rem;
    height: .3rem;
    background: #19202e;
    margin-bottom: 1rem
}

.resume-progress-bar {
    border-radius: .25rem;
    background-color: #8497bc
}

.resume-skill-badge {
    background: #19202e;
    background: rgba(0, 0, 0, .1);
    color: rgba(255, 255, 255, .8);
    padding: .5rem .65rem;
    margin-bottom: .5rem
}

.resume-projects-section {
    font-size: .875rem
}

.resume-projects-section .item {
    margin-bottom: 1rem
}

.resume-projects-section .item:last-child {
    margin-bottom: 0
}

.resume-projects-section .item-icon {
    font-size: .5rem;
    vertical-align: middle;
    position: relative;
    top: -1px
}

.resume-projects-section .item-heading {
    font-size: 1rem;
    margin-bottom: .25rem
}

.resume-projects-section .item-heading a {
    color: #fff;
    text-decoration: none
}

.resume-projects-section .item-heading a:hover {
    color: #629feb;
    text-decoration: underline
}

.resume-projects-section .item-desc {
    font-size: .85rem;
    padding-left: 1rem
}

.resume-lang-name {
    font-weight: bold;
    color: #fff;
    font-size: .875rem
}

.resume-level-indicator {
    margin-top: 2px
}

.resume-level-indicator .item {
    width: 85%;
    min-height: 10px;
    border-radius: 2px;
    display: inline-block;
    background: #19202e;
    position: relative
}

.resume-level-indicator .item:last-child {
    margin-right: 0
}

.resume-level-indicator .item.item-full {
    background: #8497bc
}

.resume-level-indicator .item.item-half:after {
    content: "";
    display: inline-block;
    position: absolute;
    width: 50%;
    height: 100%;
    left: 0;
    top: 0;
    background: #8497bc
}

.blog-breadcrumb {
    position: absolute;
    left: 2rem;
    top: 1.5rem;
    font-size: .875rem;
    color: #94a5c5
}

.blog-breadcrumb a {
    color: #94a5c5
}

.blog-breadcrumb a:hover {
    color: #629feb
}

.post-item .post-item-inner {
    background: #1e2738;
    border-radius: .5rem;
    position: relative;
    min-height: 100%
}

.post-item .post-item-inner:hover {
    background: #242e42;
    transition: all .2s ease-in-out
}

@media(prefers-reduced-motion: reduce) {
    .post-item .post-item-inner:hover {
        transition: none
    }
}

.post-item .post-item-inner:hover .title-icon-holder {
    visibility: visible;
    color: #629feb
}

.post-item .post-item-body {
    padding: 2rem
}

.post-item .post-item-footer {
    padding: 1rem 2rem;
    border-top: 1px solid rgba(0, 0, 0, .1);
    font-size: .875rem
}

.post-item .post-title {
    font-size: 1.25rem;
    line-height: 1.5;
    font-weight: 600
}

.post-item .title-icon-holder {
    font-size: 1.75rem;
    font-weight: 900;
    color: #fff;
    visibility: hidden
}

.post-item .link-mask {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0
}

.post-tags .tag-badge {
    background: #465981
}

.featured-post-item {
    background: #1e2738;
    position: relative
}

.featured-post-item:hover {
    background: #242e42;
    transition: all .2s ease-in-out
}

@media(prefers-reduced-motion: reduce) {
    .featured-post-item:hover {
        transition: none
    }
}

.featured-post-item:hover .title-icon-holder {
    visibility: visible;
    color: #629feb
}

.featured-post-item .post-item-body {
    padding: 0
}

.featured-post-item .post-item-image {
    background-image: url("../images/blog/blog-post-thumb.jpg");
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
    background-size: cover;
    min-height: 260px
}

.featured-post-item .content-holder-inner {
    padding: 2rem
}

.blog-entry .post-title {
    font-size: 2rem
}

.blog-entry .post-author {
    font-size: 1rem
}

.blog-entry .post-meta {
    font-size: .875rem;
    text-align: center
}

.blog-entry .post-meta li {
    margin-bottom: .5rem;
    border-right: 1px solid rgba(255, 255, 255, .1);
    margin-right: 0;
    padding: 0 1rem
}

.blog-entry .post-meta li:last-child {
    border-right: none
}

.blog-entry .post-content {
    line-height: 1.8;
    font-size: 1.125rem
}

.blog-entry .post-content p {
    margin-bottom: 2rem
}

.blog-entry .post-content .text-highlight {
    color: #fff !important
}

.blog-entry .post-content-heading {
    padding: 1.5rem 0
}

.blog-entry .post-content-link {
    color: #629feb
}

.blog-entry .post-list li {
    margin-bottom: 1rem
}

.blog-entry .post-list li:last-child {
    margin-bottom: 0
}

.blog-entry .post-nav a {
    text-decoration: none
}

.blog-quote-holder {
    background: #273248;
    position: relative
}

.blog-quote-holder .blockquote {
    font-weight: 600;
    color: #fff
}

.blog-quote-holder .blockquote .quote-icon {
    position: absolute;
    left: 1.5rem;
    top: 1.5rem;
    color: rgba(255, 255, 255, .3)
}

.blog-quote-holder .blockquote-footer {
    color: #a5b3ce;
    margin-bottom: 0
}

.blog-quote-holder .blockquote-footer cite {
    color: #a5b3ce
}

.comment-reply-holder {
    background: #1e2738
}

.comment-reply-holder .reply-title {
    font-size: 1.25rem
}

.comment-reply-holder .form-control {
    border-color: #273248
}

.blog-comment-area .title {
    font-size: 22px;
    font-family: "Open Sans", arial, sans-serif;
    font-weight: 700;
    margin-bottom: 30px
}

.blog-comment-area .comment-container {
    margin-bottom: 60px
}

.blog-comment-area .comment-container .comment-item {
    margin-bottom: 30px
}

.blog-comment-area .comment-container .comment-item .comment-item-box {
    background: #273248;
    margin-bottom: 1rem
}

.blog-comment-area .comment-container .comment-item .comment-author img {
    width: 50px;
    height: 50px;
    border-radius: 50%
}

.blog-comment-area .comment-container .comment-item .comment-body .name {
    color: #629feb;
    font-style: normal;
    font-size: .875rem
}

.blog-comment-area .comment-container .comment-item .comment-body .time {
    font-size: .75rem;
    margin-bottom: 15px;
    color: rgba(255, 255, 255, .3)
}

.blog-comment-area .comment-container .comment-item .comment-body .comment-reply-link {
    padding: .5rem 1rem;
    font-size: .875rem;
    border: #303e59;
    background: #303e59
}

.blog-comment-area .comment-container .comment-item .comment-body .comment-reply-link:hover {
    color: #19202e;
    background: #fff
}

.blog-comment-area .comment-container .comment-item .comment-body .content p {
    margin-bottom: 15px
}

.blog-comment-area .comment-container .comment-item .children {
    padding-left: 1rem
}

.blog-comment-area .comment-form .error {
    color: #d9603c;
    font-family: arial, sans-serif;
    display: block;
    font-size: 14px;
    text-align: left;
    padding-top: 5px
}

.comment-form-holder .title {
    font-size: 1.5rem
}

.theme-pagination-nav .pagination .page-item .page-link {
    border-radius: 4px;
    border: none;
    margin-right: .5rem;
    background: none;
    font-weight: 600;
    font-size: 1rem;
    color: #a5b3ce;
    font-size: .875rem;
    box-shadow: none
}

.theme-pagination-nav .pagination .page-item .page-link.active {
    background: #465981;
    color: #fff
}

.theme-pagination-nav .pagination .page-item .page-link.active:hover {
    color: #fff;
    background: #465981
}

.theme-pagination-nav .pagination .page-item .page-link:hover {
    color: #fff;
    background: #4f6591;
    text-decoration: none
}

.theme-pagination-nav .pagination .page-item.disabled .page-link {
    color: rgba(255, 255, 255, .3)
}

@media(min-width: 992px) {
    .section,
    .blog-list-wrapper,
    .resume-wrapper {
        max-width: 815px
    }
}

@media(min-width: 1200px) {
    .section,
    .blog-list-wrapper,
    .resume-wrapper {
        max-width: 940px
    }
}

@media(min-width: 1400px) {
    .section,
    .blog-list-wrapper,
    .resume-wrapper {
        max-width: 980px
    }
}

@media(max-width: 575.98px) {
    .skill-blocks .item:last-child {
        margin-bottom: 0
    }
    .skill-blocks .item-icon-holder {
        width: 50px;
        height: 50px
    }
    .skill-blocks .item-icon-holder .item-icon {
        font-size: 1.5rem
    }
}

@media(max-width: 991.98px) {
    body {
        padding-bottom: 70px
    }
    .side-panel .offcanvas {
        position: fixed;
        bottom: 0;
        top: auto;
        left: 0;
        right: 0;
        flex-direction: row;
        width: 100%;
        height: auto;
        transition: none
    }
    .side-panel .offcanvas .main-nav {
        background: rgba(7, 9, 13, .9);
        border-radius: 0;
        padding: 0
    }
    .side-panel .offcanvas .navbar {
        padding: 0
    }
    .side-panel .offcanvas .navbar-nav {
        flex-direction: row;
        width: 100%;
        justify-content: space-evenly
    }
    .side-panel .offcanvas .nav-item {
        padding: .3rem
    }
    .side-panel .offcanvas .nav-text {
        font-size: .65rem
    }
    .side-panel .offcanvas .nav-item-close {
        display: none
    }
    .side-panel .offcanvas-body {
        padding-left: 0
    }
    .section {
        padding: 3rem 1.5rem
    }
    .section.has-profile-image,
    .resume-wrapper {
        margin-top: 60px;
        padding-top: calc(75px + 1rem)
    }
    .tech-list .icon-item {
        max-width: 100%
    }
    .resume-body .col-main {
        border: none
    }
    .slider-container .quote-content {
        padding-top: 1rem;
        font-size: 1rem
    }
    .slider-container .slider-custom-controls div.prev {
        left: -2rem
    }
    .slider-container .slider-custom-controls div.next {
        right: -2rem
    }
    .blog-breadcrumb {
        position: static;
        padding: 0;
        margin-bottom: 1rem;
        text-align: center
    }
    .blog-entry .post-title {
        font-size: 1.5rem
    }
    .blog-comment-area .comment-container .comment-item .comment-item-box {
        background: none
    }
    .blog-comment-area .comment-container .comment-item .comment-author img {
        width: 30px;
        height: 30px
    }
    .key-results .item .key-data {
        font-size: 1.5rem
    }
    .key-results .item .data-desc {
        font-size: .875rem
    }
    .result-item .result-data {
        font-size: .875rem;
        width: 50px;
        height: 50px
    }
}

.light-mode {
    background: #f5f7fa;
    color: #354765
}

.light-mode hr {
    border-color: #c2cee1;
    -webkit-opacity: 1;
    -moz-opacity: 1;
    opacity: 1
}

.light-mode .form-control {
    background: none;
    border-color: #c2cee1;
    color: #354765
}

.light-mode .menu-toggler {
    color: #354765
}

.light-mode h1,
.light-mode .h1,
.light-mode h2,
.light-mode .h2,
.light-mode h3,
.light-mode .h3,
.light-mode h4,
.light-mode .h4,
.light-mode h5,
.light-mode .h5,
.light-mode h6,
.light-mode .h6 {
    color: #121822
}

.light-mode .footer .copyright a {
    color: #354765
}

.light-mode .social-list a {
    background: #fff;
    color: #4f6591;
    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .05)
}

.light-mode .social-list a:hover {
    color: #629feb
}

.light-mode .side-panel .main-nav {
    background: #fff;
    box-shadow: 0 0 .4rem .2rem rgba(0, 0, 0, .05)
}

.light-mode .side-panel .navbar-nav .nav-link {
    color: #354765
}

.light-mode .side-panel .navbar-nav .nav-link:hover {
    color: #121822
}

.light-mode .side-panel .navbar-nav .nav-link.active {
    color: #fe655c
}

.light-mode .side-panel .navbar-nav .nav-link.active:hover {
    color: #fe655c
}

.light-mode .side-panel .nav-item-close .btn-close {
    color: #354765
}

.light-mode .section {
    background: #fff;
    color: #354765;
    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .05)
}

.light-mode .section.has-profile-image .profile-pic {
    border-color: #fff
}

.light-mode .featured-project-list .card-title a {
    color: #000001
}

.light-mode .client-logo-list .logo-holder {
    background: #8fa5c7
}

.light-mode .client-logo-list .logo-holder .logo-image {
    -webkit-opacity: 1;
    -moz-opacity: 1;
    opacity: 1
}

.light-mode .slider-container .quote-icon {
    color: #b1c1d8
}

.light-mode .slider-container .source-holder {
    color: #5976a7
}

.light-mode .slider-container .slider-custom-controls div {
    background: #f5f7fa;
    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .08);
    color: #5976a7
}

.light-mode .slider-container .slider-custom-controls div:hover {
    color: #121822;
    background: #eef2f7
}

.light-mode .slider-container .tns-nav button.tns-nav-active {
    background-color: #5976a7
}

.light-mode .slider-container .tns-nav button {
    background-color: #d3dce9
}

.light-mode .projects-section .project-item .title a {
    color: #121822
}

.light-mode .projects-section .project-item .title a:hover {
    color: #629feb
}

.light-mode .skill-blocks .item-icon-holder {
    color: #4f6591;
    border-color: #d3dce9;
    background-color: #f5f7fa
}

.light-mode .skill-blocks .item-title {
    color: #354765
}

.light-mode .leadgen-section .section-heading {
    color: #121822
}

.light-mode .featured-post-item {
    background: #fff;
    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .08)
}

.light-mode .featured-post-item:hover {
    box-shadow: 0 .125rem .3rem rgba(0, 0, 0, .1)
}

.light-mode .post-item .post-item-inner {
    background: #fff;
    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .08)
}

.light-mode .post-item .post-item-inner:hover {
    box-shadow: 0 .125rem .3rem rgba(0, 0, 0, .1)
}

.light-mode .post-item .post-item-footer {
    color: #5976a7;
    border-color: #f5f7fa
}

.light-mode .blog-breadcrumb {
    color: #354765
}

.light-mode .blog-breadcrumb a {
    color: #354765
}

.light-mode .blog-entry .post-meta li {
    border-color: #e4e9f2;
    color: #5976a7
}

.light-mode .blog-quote-holder {
    background: #f5f7fa
}

.light-mode .blog-quote-holder .blockquote {
    color: #121822
}

.light-mode .blog-quote-holder .blockquote .quote-icon {
    color: #5976a7
}

.light-mode .blog-quote-holder .blockquote-footer {
    color: #4f6591
}

.light-mode .blog-quote-holder .blockquote-footer cite {
    color: #4f6591
}

.light-mode .blog-entry .post-content .text-highlight {
    color: #3583e5 !important
}

.light-mode .blog-comment-area .comment-container .comment-item .comment-item-box {
    background: #f5f7fa
}

.light-mode .blog-comment-area .comment-container .comment-item .comment-body .name {
    color: #354765
}

.light-mode .blog-comment-area .comment-container .comment-item .comment-body .time {
    color: #6d8ab6
}

.light-mode .blog-comment-area .comment-container .comment-item .comment-body .comment-reply-link {
    border-color: #5870a2;
    background-color: #5870a2
}

.light-mode .blog-comment-area .comment-container .comment-item .comment-body .comment-reply-link:hover {
    color: #fff;
    border-color: #4f6591;
    background-color: #4f6591
}

.light-mode .comment-reply-holder {
    background: #fff
}

.light-mode .comment-reply-holder .reply-title {
    color: #354765
}

.light-mode .key-results .item .key-data {
    color: #121822
}

.light-mode .result-item .result-data {
    color: #121822;
    border-color: #121822
}

.light-mode .resume-wrapper {
    background: #fff;
    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .05)
}

.light-mode .resume-profile-pic {
    border-color: #fff
}

.light-mode .resume-contact {
    border-color: #c2cee1
}

.light-mode .resume-role-title {
    color: #354765
}

.light-mode .resume-company-name {
    background: #e4e9f2
}

.light-mode .resume-section-heading-icon {
    background: #8497bc;
    color: #fff;
    font-weight: bold
}

.light-mode .resume-progress {
    background: #e4e9f2
}

.light-mode .resume-skill-name {
    color: #121822
}

.light-mode .resume-skill-badge {
    background: #4f6591;
    color: #fff
}

.light-mode .resume-level-indicator .item {
    background: #e4e9f2
}

.light-mode .resume-level-indicator .item.item-full {
    background: #8497bc
}

.light-mode .resume-projects-section .item-heading a {
    color: #354765
}

.light-mode .resume-degree {
    color: #121822
}

.light-mode .resume-lang-name {
    color: #121822
}

.light-mode .resume-timeline-item:before {
    border-color: #b1c1d8;
    background-color: #e4e9f2
}

.light-mode .resume-timeline:before {
    background: #b1c1d8;
    top: 12px
}

@media(max-width: 991.98px) {
    .light-mode .side-panel .offcanvas {
        box-shadow: 0 -0.125rem .25rem rgba(0, 0, 0, .07)
    }
    .light-mode .blog-comment-area .comment-container .comment-item .comment-item-box {
        background: none
    }
}

body {
    overflow-x: hidden
}

.config-trigger {
    position: absolute;
    top: 30px;
    left: -36px;
    width: 36px;
    height: 36px;
    background: rgba(0, 0, 0, .8);
    color: #fff;
    text-align: center;
    border-radius: 4px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    text-decoration: none;
    display: none !important
}

.config-trigger:hover {
    background: rgba(0, 0, 0, .9);
    text-decoration: none
}

.config-trigger:hover .fa-gear {
    color: #fff
}

.config-trigger .fa-gear {
    font-size: 1.25rem;
    display: block;
    color: #fff
}

.dark-mode .config-trigger {
    background: #000
}

.config-panel {
    position: fixed;
    top: 80px;
    z-index: 30;
    width: 150px;
    transition: all .4s ease-in-out
}

@media(prefers-reduced-motion: reduce) {
    .config-panel {
        transition: none
    }
}

.config-panel.config-panel-hide {
    right: -150px
}

.config-panel.config-panel-open {
    right: 0
}

.config-panel .panel-inner {
    position: relative;
    background: rgba(0, 0, 0, .8);
    color: #fff;
    padding: 15px;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px
}

.dark-mode .config-panel .panel-inner {
    background: #000
}

.config-panel .panel-title {
    font-weight: 600;
    margin-bottom: 10px;
    font-size: 14px;
    text-transform: uppercase;
    color: #fff
}

.config-panel label {
    color: #fff
}

.config-panel #color-options {
    margin-bottom: 0px
}

.config-panel #color-options li a {
    display: block;
    width: 20px;
    height: 20px;
    border: 2px solid rgba(0, 0, 0, 0);
    margin-top: 5px
}

.config-panel #color-options li a:hover {
    -webkit-opacity: .9;
    -moz-opacity: .9;
    opacity: .9;
    border: 2px solid rgba(255, 255, 255, .9)
}

.config-panel #color-options li.list-inline-item {
    margin-right: 5px
}

.config-panel #color-options li.active a {
    border: 2px solid #fff
}

.config-panel #color-options li.theme-1 a {
    background: #fe655c
}

.config-panel #color-options li.theme-2 a {
    background-color: #54b689
}

.config-panel #color-options li.theme-3 a {
    background-color: #3b7eeb
}

.config-panel #color-options li.theme-4 a {
    background-color: #d85888
}

.config-panel #color-options li.theme-5 a {
    background-color: #eea73b
}

.config-panel #color-options li.theme-6 a {
    background-color: #d7622e
}

.config-panel #color-options li.theme-7 a {
    background-color: #5dc5ea
}

.config-panel #color-options li.theme-8 a {
    background-color: #6c51a4
}

.config-panel .close {
    position: absolute;
    right: .5rem;
    top: .5rem;
    color: #fff;
    color: rgba(255, 255, 255, .8)
}