@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800&display=swap");
:root {
  --themecolor: #2d3542;
  --hovercolor: black;
  --bgcolor: #fffdfd;
}

* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  list-style: none;
  font-family: 'Montserrat', sans-serif;
}

body {
  color: #555;
  background: var(--bgcolor);
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.resume {
  width: 8.5in;
  height: 12in;
  border-radius: 5px;
  background: var(--bgcolor);
  -webkit-box-shadow: 13px 13px 20px #cbced1,
 -13px -13px 20px #1a1a1a48;
          box-shadow: 13px 13px 20px #cbced1,
 -13px -13px 20px #1a1a1a48;
  margin: 0px auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

/* ---------------------------------------------------------- */
#top-left {
  float: left;
  height: 185px;
  width: 515px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.blankBorder {
  margin-top: 8px;
  height: 60px;
  width: 320px;
  background-color: transparent;
  border: 3px solid var(--themecolor);
}

.name {
  margin-top: -50px;
  font-size: 32px;
  font-weight: 700;
  color: var(--themecolor);
}

.blankOverlay {
  width: 250px;
  height: 50px;
  background-color: var(--bgcolor);
}

.title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  justify-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  font-size: 17px;
  color: var(--themecolor);
  margin-top: -52.5px;
  font-weight: 700;
}

.title p {
  margin-bottom: 2.5px;
}

.lineBreak {
  margin-top: 6.5px;
  margin-bottom: 9px;
  height: 3px;
  width: 250px;
  background-color: var(--themecolor);
}

.about {
  border-left: 40px solid var(--bgcolor);
  border-right: 30px solid var(--bgcolor);
  font-weight: 700;
  font-size: 14px;
}

#top-right {
  display: block;
  float: right;
  height: 185px;
  width: 300px;
  background-color: var(--themecolor);
}

.top .image {
  width: 160px;
  height: 160px;
}

.image img {
  margin-left: 65px;
  margin-top: 10px;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: 2px solid #ebebeb;
}

/*------------------------------------------------------------*/
.line #line-left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  float: left;
  width: 515px;
  height: 40px;
  background-color: var(--themecolor);
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
}

.line #line-right {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  float: right;
  width: 300px;
  height: 40px;
  background-color: var(--bgcolor);
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
}

/* .................................................. */
.fa-envelope {
  color: white;
  margin-left: 10px;
  margin-top: 12.5px;
}

.email {
  margin-top: 13.5px;
  margin-left: 10px;
  color: white;
  letter-spacing: 1.0px;
  font-size: 12px;
  font-weight: bolder;
}

.email a {
  color: white;
}

.email:hover {
  -webkit-text-decoration-color: white;
          text-decoration-color: white;
  text-decoration: underline;
}

/*.....................................*/
.fa-mobile {
  color: white;
  margin-left: 15px;
  margin-top: 12.5px;
}

.phone {
  margin-top: 13.5px;
  margin-left: 10px;
  color: white;
  font-size: 12px;
  letter-spacing: 1.0px;
  font-weight: 500;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

/*------------------*/
.fa-map-marker {
  color: white;
  margin-left: 15px;
  margin-top: 12.5px;
}

.map {
  margin-top: 13.5px;
  margin-left: 10px;
  color: white;
  font-size: 12px;
  letter-spacing: 1.0px;
  font-weight: 500;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

/*------------------*/
a {
  color: var(--themecolor);
  text-decoration: none;
  font-weight: 500;
}

.fa-linkedin-square {
  color: var(--themecolor);
  margin-left: 15px;
  margin-top: 12px;
}

.linkedin {
  margin-top: 13.5px;
  margin-left: 10px;
  color: var(--themecolor);
  font-size: 12px;
  letter-spacing: 1.0px;
  font-weight: 300;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.linkedin:hover {
  -webkit-text-decoration-color: var(--themecolor);
          text-decoration-color: var(--themecolor);
  text-decoration: underline;
}

/*------------------*/
.fa-github {
  color: var(--themecolor);
  margin-left: 25px;
  margin-top: 12.5px;
}

.git {
  margin-top: 13.5px;
  margin-left: 10px;
  color: white;
  font-size: 12px;
  letter-spacing: 1.0px;
  font-weight: 300;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.git:hover {
  -webkit-text-decoration-color: white;
          text-decoration-color: white;
  text-decoration: underline;
}

/*-------------------------------------------------------------------------------*/
#left {
  float: left;
  width: 515px;
  height: 40px;
  background-color: var(--bgcolor);
  display: block;
  /* ------------------------------------------------------- */
  /* ---------------------------------------------------------------- */
}

#left .box {
  height: 32px;
  width: 28px;
  background-color: var(--themecolor);
}

#left .angledBox {
  margin-top: -27.5px;
  margin-left: 16.5px;
  height: 22.627px;
  width: 22.627px;
  background-color: var(--themecolor);
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}

#left .forwardArrow {
  margin-top: -22.5px;
  margin-left: 25px;
  height: 24px;
  width: 24px;
  background-color: transparent;
  border-top: 3px solid var(--themecolor);
  border-right: 3px solid var(--themecolor);
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}

#left .iconBox {
  position: absolute;
  color: var(--bgcolor);
  margin-top: -22px;
  margin-left: 9px;
  z-index: 1;
}

.sectionGap {
  margin-bottom: 15px;
}

.sectionGapAfter {
  margin-top: 20px;
}

/* .........................workDesc............................... */
.workDesc a:hover, .capstoneProject a:hover, .projects a:hover, .education a:hover, .achi a:hover, .references a:hover {
  text-decoration: underline;
  font-size: 15px;
}

.workDesc #leftGraphics, .capstoneProject #leftGraphics, .projects #leftGraphics, .education #leftGraphics, .achi #leftGraphics, .references #leftGraphics {
  float: left;
}

.workDesc .workTitle, .capstoneProject .workTitle, .projects .workTitle, .education .workTitle, .achi .workTitle, .references .workTitle {
  margin-top: 7px;
  font-size: 14.8px;
  letter-spacing: 0.2px;
  font-weight: 700;
}

.workDesc .workTitle a, .capstoneProject .workTitle a, .projects .workTitle a, .education .workTitle a, .achi .workTitle a, .references .workTitle a {
  font-weight: 700;
}

.workDesc .workDeignation, .capstoneProject .workDeignation, .projects .workDeignation, .education .workDeignation, .achi .workDeignation, .references .workDeignation {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.1px;
}

.workDesc .workDescription, .workDesc ul, .capstoneProject .workDescription, .capstoneProject ul, .projects .workDescription, .projects ul, .education .workDescription, .education ul, .achi .workDescription, .achi ul, .references .workDescription, .references ul {
  font-size: 11.5px;
  margin-top: 1px;
  letter-spacing: 0.2px;
  font-weight: 500;
}

.workDesc .workDescription li, .workDesc ul li, .capstoneProject .workDescription li, .capstoneProject ul li, .projects .workDescription li, .projects ul li, .education .workDescription li, .education ul li, .achi .workDescription li, .achi ul li, .references .workDescription li, .references ul li {
  margin-top: 1px;
  color: var(--themecolor);
  font-size: 11px;
  list-style-type: disc;
  list-style-position: inside;
}

.timelineCircle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 13px;
  height: 13px;
  border: 2px solid var(--themecolor);
  border-radius: 50%;
  color: var(--themecolor);
}

.timelineCircle .innerCircle {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: var(--themecolor);
}

.timeLine {
  margin-left: 20px;
  border-left: 2px solid var(--themecolor);
}

.workplace1 .timelineCircle {
  margin: 3px 15px 0px 15px;
}

.workplace1 .timeLine {
  height: 147px;
  margin-top: 5px;
}

.workplace2 .timelineCircle {
  margin: 3px 15px 0px 15px;
}

.workplace2 .timeLine {
  height: 57px;
  margin-top: 5px;
}

.workplace3 .timelineCircle {
  margin: 2px 15px 0px 15px;
}

.workplace3 .timeLine {
  height: 75px;
  margin-top: 5px;
}

.workplace4 .timelineCircle {
  margin: 2px 15px 0px 15px;
}

.workplace4 .timeLine {
  height: 100px;
  margin-top: 5px;
}

/* ---------------CapStone Project------------------ */
.capstoneProject .timelineCircle {
  margin: 3px 15px 0px 15px;
}

.capstoneProject .timeLine {
  height: 130px;
  margin-top: 5px;
}

.projectDesc {
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: 0.15px;
}

.projLinkIcons {
  margin-top: 8px;
}

.projLinkIcons a {
  margin-right: 15px;
}

.projLinkIcons a:hover {
  font-size: 14px;
}

/* ------------------------capstone ends---------------- */
/* ------------------Projects/ new certifications start-------------- */
.projects .projLinkIcons {
  margin-top: 5px;
}

.projects .fa-github {
  margin-top: 0px;
  margin-left: 0px;
}

.project1 .timelineCircle {
  margin: 2px 15px 0px 15px;
}

.project1 .timeLine {
  height: 30px;
  margin-top: 5px;
}

.project2 .timelineCircle {
  margin: 1px 15px 0px 15px;
}

.project2 .timeLine {
  height: 43px;
  margin-top: 5px;
}

.project3 .timelineCircle {
  margin: 1px 15px 0px 15px;
}

.project3 .timeLine {
  height: 30px;
  margin-top: 5px;
}

.project4 .timelineCircle {
  margin: 1px 15px 0px 15px;
}

.project4 .timeLine {
  height: 30px;
  margin-top: 5px;
}

.project5 .timelineCircle {
  margin: 1px 15px 0px 15px;
}

.project5 .timeLine {
  height: 31px;
  margin-top: 5px;
}

.cert1 .workTitle a, .cert2 .workTitle a, .cert3 .workTitle a {
  font-size: 14px;
  font-weight: 600;
}

.cert1 .workTitle a:hover, .cert2 .workTitle a:hover, .cert3 .workTitle a:hover {
  font-size: 14px;
  font-weight: 600;
}

.cert1 .timelineCircle, .cert2 .timelineCircle, .cert3 .timelineCircle {
  margin: 1px 15px 0px 15px;
}

.cert1 .timeLine, .cert2 .timeLine, .cert3 .timeLine {
  height: 15px;
  margin-top: 5px;
}

.cert2 .timelineCircle {
  margin: -3px 15px 0px 15px;
}

.cert2 .timeLine {
  height: 10px;
  margin-top: 3px;
}

/* ------------------Projects/ new certifications end------------------ */
/* --------------------------------------------------------- */
.rightGraphics {
  color: var(--themecolor);
  border-top: 3px solid var(--themecolor);
  border-bottom: 3px solid var(--themecolor);
  margin-top: -28px;
  margin-left: 60px;
  max-width: 440px;
}

.rightGraphics .sectionHeader {
  margin: 3px 10px;
  font-size: 17px;
  font-weight: 700;
}

/* --------------------------------------------------------- */
/*..................................................................................................*/
#right {
  float: right;
  width: 300px;
  height: 927px;
  background-color: var(--themecolor);
  display: block;
  /* --------------------------------tech skills----------------------- */
  /* -----------------------------education--------------------------------------------- */
  /* ----------------------softskills------------- */
  /* ------------------------achievements-------------- */
  /* -------------------achievements end------------- */
  /* -------------------Language------------------ */
  /* ------------references----------------------- */
}

#right .box {
  height: 28px;
  width: 28px;
  margin-left: 10px;
  background-color: var(--bgcolor);
}

#right .angledBox {
  margin-top: -24px;
  margin-left: 28px;
  height: 20px;
  width: 20px;
  background-color: var(--bgcolor);
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}

#right .forwardArrow {
  margin-top: -20.5px;
  margin-left: 35px;
  height: 21px;
  width: 21px;
  background-color: transparent;
  border-top: 3px solid var(--bgcolor);
  border-right: 3px solid var(--bgcolor);
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}

#right .iconBox {
  position: absolute;
  color: var(--themecolor);
  margin-top: -20px;
  margin-left: 18px;
  z-index: 1;
}

#right .rightGraphics {
  color: var(--bgcolor);
  border-top: 2px solid var(--bgcolor);
  border-bottom: 2px solid var(--bgcolor);
  margin-top: -25px;
  margin-left: 65px;
  max-width: 225px;
}

#right .rightGraphics .sectionHeader {
  margin: 3.5px 10px;
  font-size: 14px;
  font-weight: 600;
}

#right .timelineCircle {
  border: 2px solid var(--bgcolor);
  color: var(--bgcolor);
}

#right .timelineCircle .innerCircle {
  background-color: var(--bgcolor);
}

#right .timeLine {
  margin-left: 20px;
  border-left: 2px solid var(--bgcolor);
}

#right .techSkills, #right ul {
  font-size: 12px;
  margin-top: 10px;
  margin-left: 15px;
  letter-spacing: 0.2px;
  font-weight: 450;
  color: var(--bgcolor);
}

#right .techSkills li, #right ul li {
  margin-top: 5px;
  color: var(--bgcolor);
  font-size: 11.5px;
  list-style-type: disc;
  list-style-position: outside;
}

#right .education {
  font-size: 12.5px;
  margin-top: 5px;
  color: var(--bgcolor);
}

#right .education .degree {
  font-size: 12px;
}

#right .education .uniName {
  margin-top: 1px;
  font-size: 12.2px;
  font-weight: 400;
}

#right .education .uniName a {
  font-size: 12px;
}

#right .education .timeGPA {
  font-size: 9px;
  font-weight: 300;
  margin-top: 2.5px;
  margin-bottom: 25px;
}

#right .education .timeGPA #timeGPALeft {
  float: left;
}

#right .education .timeGPA #timeGPARight {
  float: right;
  margin-right: 15px;
}

#right .education a {
  font-size: 10px;
  color: var(--bgcolor);
}

#right .education .timelineCircle {
  margin: 2px 15px 0px 15px;
}

#right .education .timeLine {
  height: 40px;
  margin-top: 5px;
}

#right .masterEdu .timeLine {
  height: 25px;
}

#right .softSkills > ul {
  display: -ms-grid;
  display: grid;
  text-align: start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
  justify-items: start;
      grid-template-areas: "soft1 soft2 soft3 "
 "soft4 soft5 soft6 "
 "soft7 soft8 soft8";
  max-width: 300px;
  font-size: 10px;
  margin-left: 25px;
}

#right .softSkills > ul li {
  margin: 0px 5px 2.5px 5px;
}

#right .softSkills > ul .soft1 {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
  grid-area: soft1;
}

#right .softSkills > ul .soft2 {
  -ms-grid-row: 1;
  -ms-grid-column: 2;
  grid-area: soft2;
}

#right .softSkills > ul .soft3 {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
  grid-area: soft3;
}

#right .softSkills > ul .soft4 {
  -ms-grid-row: 2;
  -ms-grid-column: 1;
  grid-area: soft4;
}

#right .softSkills > ul .soft5 {
  margin-top: -8px;
  margin-left: 8px;
  -ms-grid-row: 2;
  -ms-grid-column: 2;
  grid-area: soft5;
}

#right .softSkills > ul .soft6 {
  -ms-grid-row: 2;
  -ms-grid-column: 3;
  grid-area: soft6;
}

#right .softSkills > ul .soft7 {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
  grid-area: soft7;
}

#right .softSkills > ul .soft8 {
  -ms-grid-row: 3;
  -ms-grid-column: 2;
  -ms-grid-column-span: 2;
  grid-area: soft8;
}

#right .softSkills > ul .soft9 {
  grid-area: soft9;
}

#right .achi {
  margin-top: 0px;
}

#right .achi p {
  color: var(--bgcolor);
  font-size: 12px;
  font-weight: 500;
}

#right .achi .achi1 {
  margin-top: 3px;
}

#right .achi .achi1 a {
  color: var(--bgcolor);
  font-size: 12px;
}

#right .achi .achi1 a:hover {
  text-decoration: underline;
}

#right .achi .achi1 .timelineCircle {
  margin: 5px 15px 0px 15px;
}

#right .achi .achi1 .timeLine {
  height: 19px;
  margin-top: 4px;
}

#right .achi .achi2 {
  margin-top: 7.5px;
}

#right .achi .achi2 .timelineCircle {
  margin: 4px 15px 0px 15px;
}

#right .achi .achi2 .timeLine {
  height: 19px;
  margin-top: 4px;
}

#right .achi .achi2 a {
  color: var(--bgcolor);
  font-size: 12px;
}

#right .achi .achi2 a:hover {
  text-decoration: underline;
}

#right .achi .achi2 #rightInfo {
  margin-top: -5px;
}

#right .lang li {
  margin-left: 15px;
  letter-spacing: 0.2px;
  font-size: 12px;
}

#right .lang li .langSkill {
  margin-top: 5px;
  height: 12px;
  width: 240px;
  border: 1px solid var(--bgcolor);
  background-color: var(--bgcolor);
}

#right .lang li .langSkillToGo {
  margin-top: -12px;
  margin-left: 200px;
  height: 12px;
  width: 39px;
  border: 1px solid var(--bgcolor);
}

#right .lang li:nth-child(2) .langSkill {
  width: 200px;
}

#right .lang .langSec .langRight {
  float: right;
  margin-right: 30px;
}

#right .lang .langSec .langRight p {
  font-size: 11px;
}

#right .references p {
  color: var(--bgcolor);
  font-size: 12px;
}

#right .references .refdes p {
  font-size: 10px;
}

#right .references .refcon, #right .references .refcon a {
  color: var(--bgcolor);
  font-size: 10.5px;
}

#right .references .refer1 {
  margin-top: 15px;
}

#right .references .refer1 .timelineCircle {
  margin: 2px 15px 0px 15px;
}

#right .references .refer1 .timeLine {
  height: 35px;
  margin-top: 4px;
}

#right .references .refer1S {
  margin-top: 5px;
}

#right .references .refer1S .timelineCircle {
  margin: 2px 15px 0px 15px;
}

#right .references .refer1S .timeLine {
  height: 50px;
  margin-top: 4px;
}

#right .references .refer1S a {
  color: var(--bgcolor);
}

#right .references .refer1S a:hover {
  font-size: 10px;
  font-weight: 600;
  text-decoration: underline;
}

#right .references .refer2 .refName {
  margin-top: 4px;
}

#right .references .refer2 .timelineCircle {
  margin: 1px 15px 0px 15px;
}

#right .references .refer2 .timeLine {
  height: 25px;
  margin-top: 4px;
}

/* ------------------------------------------------------------------------------- */
@media print {
  html {
    height: 11in;
    width: 8.5in;
    overflow: hidden;
  }
  body {
    margin: 0;
  }
  .resume {
    width: 100%;
    -webkit-box-shadow: none;
            box-shadow: none;
  }
}
/*# sourceMappingURL=index.css.map */