@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap");

body {
  background: #f2f2f2;
  /* font-family: "Poppins", arial, sans-serif; */
  color: #222222;
  font-size: 1.1rem;
  line-height: 1.4;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: #e50012;
  font-family: "Open Sans", sans-serif;
  font-weight: 600;
}

a {
  color: #e50012;
  font-weight: bold;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  text-decoration: none;
}

a:hover {
  /* color: rgba(130, 193, 245, 1); */
  color: #82c1f5;
}

a:focus {
  text-decoration: none;
}

.btn,
a.btn {
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  font-family: "Open Sans", arial, sans-serif;
  padding: 8px 16px;
  font-weight: bold;
}

.btn:hover,
a.btn:hover {
  text-decoration: none;
}

.btn:focus,
a.btn:focus {
  color: #fff;
  box-shadow: none;
}

/* ======= Header ======= */
.header {
  padding: 30px 0;
  background: #e1e1e1;
  border-bottom: 20px solid #a8a8a8;
}

.header .btn {
  font-weight: bold;
}

.header .profile-image {
  margin-right: 30px;
}

.header .profile-content .name {
  color: #060808; /* header text collor */
  font-size: 38px;
  margin-bottom: 5px;
  margin-top: 30px;
}

.header .profile-content .desc {
  font-size: 24px;
  margin-top: 0;
  margin-bottom: 15px;
}

.header .profile-content .social a {
  background: #555555;
  width: 36px;
  height: 36px;
  display: inline-block;
  border-radius: 50%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  color: #e50012;
  text-align: center;
}

.header .profile-content .social a:hover {
  background: #060808;
  /* background: none;
  border: 2px solid #060808; */
}

.header .profile-content .social a .svg-inline--fa {
  font-size: 20px;
  margin-top: 8px;
}

/* ======= Sections======= */
.section {
  margin-bottom: 30px;
}

.section .section-inner {
  background: #fff;
  padding: 30px;
}

.section .heading {
  margin-top: 0;
  margin-bottom: 30px;
  color: #545e69;
  font-size: 32px;
  font-weight: bold;
}

/* Make text bold */
.boldText {
  font-weight: bolder;
}

/* Question paragrapgy */
.question {
  font-style: italic;
  color: #303030;
}

/* Resource items */
#resources ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
}

/* Drop down header */
#reportWra .accordion-button:not(.collapsed) {
  /* color: #444444; */
  background-color: #fce4e4;
}

/* Work Section */
.experience .item {
  margin-bottom: 30px;
}

.siteMapImg img {
  width: 100%;
}

.experience .item .title {
  font-size: 16px;
  margin-top: 0;
  margin-bottom: 5px;
  line-height: 1.5;
}

.experience .item .title .place {
  color: #999;
  font-weight: normal;
}

.experience .item .title .place a {
  color: #999;
}

.experience .item .title .place a:hover {
  color: #666666;
}

.experience .item .title .year {
  color: #999;
  font-weight: normal;
}

/* Info Section */
.info .svg-inline--fa {
  margin-right: 15px;
  color: #ccd1d6;
}

.info .svg-inline--fa.fa-envelope-o {
  font-size: 14px;
}

.info ul {
  margin-bottom: 0;
}

.info li {
  margin-bottom: 15px;
}

.info li:last-child {
  margin-bottom: 0;
}

/* Skills Section */
.skills .intro {
  margin-bottom: 30px;
}

.skills .skillset .item {
  margin-bottom: 30px;
}

.skills .skillset .level-title {
  font-size: 16px;
  position: relative;
  margin-top: 0;
  margin-bottom: 10;
}

.skills .skillset .level-title .level-label {
  color: #9c9c9c;
  font-size: 14px;
  font-weight: 400;
  font-family: "Lato", arial, sans-serif;
  position: absolute;
  right: 0;
  top: 0;
}

.skills .skillset .level-bar {
  height: 15px;
  background: #e8e8e8;
}

.skills .skillset .level-bar-inner {
  height: 15px;
  background: #82c1f5;
}

.skills .svg-inline--fa {
  margin-right: 3px;
  position: relative;
  top: 0;
}

/* List section */
.list ul li {
  margin-bottom: 10px;
}

.list ul li .svg-inline--fa {
  margin-right: 5px;
}

.list ul li a {
  color: #778492;
}

.list ul li a:hover {
  color: #49515a;
}

/* references */
.references ul li {
  margin-bottom: 10px;
}

.references ul li .svg-inline--fa {
  margin-right: 5px;
  position: relative;
  top: -2px;
}

.references ul li a {
  color: #778492;
}

.references ul li a .svg-inline--fa {
  color: #b0b7bf;
}

.references ul li a:hover {
  color: #49515a;
}

.references .btn {
  margin-bottom: 15px;
}

.aside .subheading {
  font-size: 18px;
  color: #545e69;
}

/* ======= Footer ======= */
.footer {
  background: #32383e;
  color: #fff;
  padding: 10px 0;
  text-align: center;
}

.footer .copyright {
  line-height: 1.6;
  color: #a1aab4;
  font-size: 14px;
}

.footer a {
  color: #fff;
}

.footer .fa-heart {
  color: #fb866a;
}

.dark-mode-switch {
  margin-bottom: 1rem;
}

.dark-mode-switch .form-switch {
  display: -webkit-flex;
  display: flex;
}

.dark-mode-switch label {
  font-size: 0.875rem;
  font-weight: bold;
}

.dark-mode-switch .form-switch .form-check-input {
  border-radius: 1em;
  border-color: #dae3e7;
}

.dark-mode-switch .form-check-input:checked {
  background-color: #fc5421;
}

.dark-mode-switch .form-check-input:focus {
  box-shadow: none;
  border-color: #dae3e7;
}

/**
 Dark Mode
 https://github.com/coliff/dark-mode-switch
 */

body[data-theme="dark"] {
  background: #17191c;
}

body[data-theme="dark"] a:hover {
  color: #e50012;
}

body[data-theme="dark"] a.btn:hover {
  color: #fff;
}

body[data-theme="dark"] .dark-mode-switch .form-check-input:focus {
  border-color: #fc5421;
}

body[data-theme="dark"] .header {
  background: #1e2124;
  color: rgba(255, 255, 255, 0.9);
}

body[data-theme="dark"] .header .profile-content .name {
  color: rgba(255, 255, 255, 0.9);
}

body[data-theme="dark"] .header .profile-content .desc {
  color: rgba(255, 255, 255, 0.7);
}

body[data-theme="dark"] .header .profile-content .social a {
  background: #2e3238;
  color: rgba(230, 230, 230, 0.7);
}

body[data-theme="dark"] .header .profile-content .social a:hover {
  color: rgba(255, 255, 255, 0.9);
}

body[data-theme="dark"] .section .section-inner {
  background: #1e2124;
  color: rgba(255, 255, 255, 0.7);
}

body[data-theme="dark"] .section .heading {
  color: rgba(255, 255, 255, 0.9);
}

body[data-theme="dark"] .experience .item .title {
  color: rgba(255, 255, 255, 0.9);
}

body[data-theme="dark"] .testimonials .item .quote {
  color: rgba(255, 255, 255, 0.9);
}

body[data-theme="dark"] .latest .item .title a,
body[data-theme="dark"] .projects .item .title a,
body[data-theme="dark"] .blog .item .title a {
  color: rgba(255, 255, 255, 0.9);
}

body[data-theme="dark"] .latest .item .title a:hover,
body[data-theme="dark"] .projects .item .title a:hover,
body[data-theme="dark"] .blog .item .title a:hover {
  color: #fff;
}

body[data-theme="dark"] .testimonials .item .source .name {
  color: rgba(255, 255, 255, 0.9);
}

body[data-theme="dark"] .education .item .title {
  color: rgba(255, 255, 255, 0.9);
}

body[data-theme="dark"] .languages .item .title {
  color: rgba(255, 255, 255, 0.9);
}

body[data-theme="dark"] .list ul li a,
body[data-theme="dark"] .references ul li a {
  color: inherit;
}

body[data-theme="dark"] .experience .item .title .place a {
  color: rgba(255, 255, 255, 0.7);
}

body[data-theme="dark"] .experience .item .title .place a:hover {
  color: rgba(255, 255, 255, 0.9);
}

body[data-theme="dark"] .aside .subheading {
  color: rgba(255, 255, 255, 0.9);
}

body[data-theme="dark"] .gha-header,
body[data-theme="dark"] .gha-footer,
body[data-theme="dark"] .gha-feed {
  background: #17191c;
  border-color: rgba(255, 255, 255, 0.1);
  color: #3aaa64;
}

body[data-theme="dark"] .gha-feed a {
  color: #fc5421;
}

body[data-theme="dark"] .gha-header > .gha-github-icon,
body[data-theme="dark"] .gha-header > .gha-user-info > a,
body[data-theme="dark"] .gha-header > .gha-user-info > p > a {
  color: rgba(255, 255, 255, 0.9);
}

body[data-theme="dark"] .gha-activity {
  border-color: #333;
}

body[data-theme="dark"] .gha-gravatar img {
  border: 3px solid #333;
  box-shadow: 0 0 0 #ccc;
}

body[data-theme="dark"] .gha-message-merge {
  background: #2e3238;
}

body[data-theme="dark"] .gha-feed small {
  color: rgba(255, 255, 255, 0.7);
}

body[data-theme="dark"] .github-graph {
  background: #17191c;
}

body[data-theme="dark"] .contrib-number {
  color: rgba(255, 255, 255, 0.9);
}

body[data-theme="dark"] .border,
body[data-theme="dark"] .contrib-column {
  border: 1px solid rgba(255, 255, 255, 0.1);
}

body[data-theme="dark"] .text-muted {
  color: rgba(255, 255, 255, 0.6);
}

@media (max-width: 767.98px) {
  .header {
    text-align: center;
  }
  .header .profile-image {
    float: none;
    margin: 0 auto;
  }
  .header .profile-content {
    float: none;
    text-align: center;
  }
  .header .btn {
    margin-top: 30px;
    float: none;
  }
  .project-image {
    margin-bottom: 15px;
  }
}

@media (min-width: 1400px) {
  .container {
    width: 1360px;
    max-width: inherit;
  }
}