* {
  margin: 0;
  padding: 0;
}

/* html, body {
  height: 100%;
  margin: 0;
  background-color: chocolate;
}
body {
  height: 100%;
  margin: 0;
  background-color: chocolate;
} */

body {
  font-family: 'Roboto Slab', serif;
  color: var(--body);
  line-height: 1.7;
}

.about-marging {
  margin-top: 26%;
}

.footer {
  position: relative;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 60px;
  background-color: #212529;
  /* position: fixed; */
}

.foot-p {
  color: wheat;
  margin-top: 10px;
}

.foot-p a {
  color: white;
  /* margin-top: 10px; */
}

/* main logo */
.foot-img {
  display: inline;
  margin-right: 150px;
  /* display: block; */
}

@media screen and (max-width: 768px) {
  .foot-img {
    display: inline;
  }
}

@media screen and (max-width: 351px) {
  .foot-img {
    margin-right: 30px;
  }
}

@media screen and (max-width: 237px) {
  .foot-img {
    margin-right: 5px;
    height: 30px;
    width: 60px;
  }
}

@media screen and (max-width: 237px) {
  button#openbtn {
    margin-right: 7px;
    height: 20px;
    padding: 2px 4px;
  }
}


/* timeline-page */
/* //REMOVE THE LINE OF THE TIMELINE */
@media screen and (max-width: 995px) {
  /* makes the line to move to the top of the page */
  /* .timeline-page {
    display: contents;
  } */
}

.how-it-works-img {
  border-radius: 100%;
  margin-top: 25px;
  border: 2px solid rgb(237, 50, 55);
}



#adminRoute,
.engage {
  margin-top: 50px;
}

.navbar>.container,
.navbar>.container-fluid {
  flex-wrap: unset;
}

h3,
h3 ul {
  text-align: center;
  display: inline-block;
}

h3 ul {}

h2 {
  color: rgb(138, 61, 7);
  text-align: center;
  display: block;
  padding-top: 1%;
  font-family: 'Lato', sans-serif;
  font-weight: 700;
}

p {
  color: rgb(82, 61, 61);
  text-align: center;
  display: block;

}

.head-p {
  text-align: center;
  display: block;
  background-color: chocolate;
  color: white;
}

a {
  color: white;
  text-align: center;
  /* display: block; */
}

img {
  display: block;
  margin: auto;
}



/* ===CREATING MY OWN col-md-12,6,4 and 3==== */
/* display to 4 */
.sty {
  display: inline;
  border-radius: 10px;
  height: 300px;
  float: left;
  margin-top: 30px;
  box-shadow: 4px 4px 4px 4px rgba(0, 0, 0, .5);
  margin-bottom: 0%;
  width: 17.5%;
  margin: 3.75%;
  background-color: rgba(149, 150, 143, 0.5);

}

/* display to 3 */
@media screen and (max-width: 1030px) {
  .sty {
    width: 25%;
    margin: 4.1666666666666%;
  }
}

/* display to 2 */
@media screen and (max-width: 768px) {
  .sty {
    width: 40%;
    margin: 5%;
  }
}

/* display to 1 */
@media screen and (max-width: 468px) {
  .sty {
    width: 80%;
    margin: 10%;
    /* text-align: center; */
  }
}

.animated:hover {
  transform-origin: top;
  transform: scale(1.13);
  background: rgb(250, 172, 116);
  box-shadow: 4px 4px 4px 4px rgba(149, 150, 143, 0.5);
  color: white !important;
}

.a-sty:hover {
  color: white !important;
}

.animated {
  transition-duration: 1s;
}

.navbar-light .navbar-nav .active>.nav-link,
.navbar-light .navbar-nav .nav-link.active,
.navbar-light .navbar-nav .nav-link.show,
.navbar-light .navbar-nav .show>.nav-link {
  color: white !important;
}

.navbar-light .navbar-brand {
  color: white !important;
}

.navbar-light .navbar-nav .nav-link {
  color: white !important;
}

.navbar-light .navbar-toggler-icon {
  background-color: wheat;
}


.myh4 {
  text-align: center;
}

.our-services {
  border: chocolate 1px solid;
  border-radius: 5px;
  text-align: center;
  margin-bottom: 30px;
}

h4 {
  font-family: 'Yanone Kaffeesatz', sans-serif;
  font-weight: 400;
  color: rgb(138, 61, 7);
}

.myh4-contact {
  color: rgb(237, 50, 55);
  font-family: 'Yanone Kaffeesatz', sans-serif;
  margin-top: 35px;
  /* margin-top: 20px; */
}

.social a {
  color: rgb(1, 1, 26) !important;
}

.myh44 {
  background-color: chocolate;
  padding: 10px;
  border-top-left-radius: 20px;
  border-bottom-right-radius: 20px;
  font-size: 18px;
}

.myh44_p {
  padding: 10px;
  font-size: 40px;
  color: chocolate;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

.portfolio-text {
  text-shadow: 1px 1px chocolate;
}

.hr-line {
  color: white;
  margin-bottom: 20px;
}

.hr-linee {
  color: white;
}

.cont-work {
  border: 2px solid chocolate;
  border-top-left-radius: 20px;
  border-bottom-right-radius: 20px;
  /* padding-bottom: 20px; */
}

#site-footerr {
  background-color: white;
  background-color: gray;
  margin-top: 30px;
}



.h3-footer {
  color: black !important;
  color: rgb(237, 50, 55) !important;
  color: chocolate !important;
  color: white !important;
  margin: 20px;
}

/* .my-foot-disabled{
  color: white !important;
  background-color: red;
  border: none;
} */

#site-footerr a,
#site-footerr p {
  text-align: center;
  display: block;
  color: black !important;
  color: rgb(2, 2, 54) !important;
  color: rgb(1, 1, 26) !important;
  font-weight: 600;
  font-size: 13px;
  /* text-decoration: rgb(237, 50, 55) solid 2px; */
}

.testi {
  /* background-color: red; */
  color: rgb(237, 50, 55);
  color: chocolate;
  font-size: 25px;
  /* background-color: #000; */
  font-family: 'Times New Roman', Times, serif;
  line-height: 27px;
  margin: 10px;
  border-left: solid 3px rgb(139, 133, 133);
}


/* rgb(237, 50, 55) */
.a-sty {
  color: chocolate !important;
  text-decoration: none;
  font-size: large;
  font-weight: 500;
  margin-top: 20px;
  font-family: 'Nerko One', cursive;
  /* text-align: center; */
}

.msg-style {
  width: 100%;
}

.msg-style2,
.msg-p {
  width: 70%;
  margin: auto;
  color: white;
}

.msg-p {
  margin: auto;
  color: white;
  width: 100%;
}

.msg-p-margin {
  margin-top: 40px;
}


.msg-style3 {
  border-left: 1px solid rgb(104, 49, 10);
  margin-bottom: 10px;
  /* width: 70%; */
}

button.btn.btn-primary.my-button-style {
  background-color: chocolate;
  color: white;
}

@media screen and (max-width: 309px) {
  button.btn.btn-primary.my-button-style {
    font-size: 14px;
  }
}

@media screen and (max-width: 265px) {
  button.btn.btn-primary.my-button-style {
    font-size: 9px;
  }
}

.my-button-style {
  background-color: chocolate;
}

#my-button-style-1 {
  margin-bottom: 30px;
}

.my-button-style-1 a {
  color: white;
}

#my-button-style-1:hover {
  background-color: chocolate;
}

.about-h2 {
  color: white;
  text-align: center;
  margin-top: 10px;
  font-size: larger;
}

.about-h22 {
  text-align: center;
  background-color: rgb(158, 147, 147);
  font-size: 175%;
  font-weight: 900;
  border-bottom-right-radius: 20px;
  border-top-left-radius: 20px;
  border: white 4px solid;
}

.engege-h22 {
  text-align: center;
  background-color: rgb(158, 147, 147);
  font-size: 250%;
  font-weight: 500;
}

.engage {
  padding: 180px 0px 80px 0px;
  background-image: url("/images/engage-us-bg.jpg");
  background-size: cover;
  position: relative;
  background-position: center center;
  min-height: 100vh;
}

.channel-bg {
  background-image: url("/images/channel.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 100vh;
}


.contact_us {
  /* padding: 180px 0px 80px 0px; */
  padding: 80px 0px 80px 0px;
  background-image: url("/images/contact_us.jpg");
  background-size: cover;
  position: relative;
  background-position: center center;
  min-height: 100vh;
}

.centered {
  width: 100px;
  height: 100px;
  background-color: red;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.about-p-span {
  background-color: rgb(158, 147, 147);
  border-bottom-right-radius: 5px;
  border-top-left-radius: 5px;
}

.hr-line-about {
  /* width: 50%; */
  margin-left: auto;
  margin-right: auto;
  margin-top: 25px;
}

.hr-line-admin {
  margin-top: 25px;
}

.msg-pp {
  margin-top: 25px;
}

.about-mg {
  margin-top: 90px;
}

.about-p {
  color: white;
  text-align: left;
}

.about-p_main {
  color: black;
  text-align: center;
  font-size: large;
  /* font-family: 'Cormorant Garamond', serif; */
  font-family: 'Redressed', cursive;
  margin-bottom: 0%;
}

.themecolor-upcomming {
  color: black;
}


.my-form {
  display: none;
}

.my-form-toggle {
  display: block;
}

#request {
  width: 70%;
  margin: auto;
}

.testi-img {
  border-radius: 100%;
  margin-top: 25px;
  border: 2px solid chocolate;
}

@media screen and (max-width: 468px) {
  .testi-img {
    width: 55%;
  }
}


.my-aline-left p a,
.my-aline-left p {
  text-align: left;
  margin-left: 30px;
  margin-right: 30px;
}


.contact-div {
  /* padding: 30px; */
  margin-top: 50px;
  box-shadow: 1px 2px 9px gray;
  /* background-color: green; */
}


.fa-phone-square,
.fa-envelope,
.fa-facebook-official,
.fa-twitter,
.fa-instagram,
.fa-linkedin {
  background-color: white;
  color: chocolate;
  border-radius: 50px;
  padding: 10px;
  font-size: 40px;
  border: 1px solid chocolate;
}

.fa-sty {
  border: 1px solid chocolate;
  border-radius: 50px;
  width: 37px;
  height: 37px;
  background-color: white;
}

.upcomming {
  background-color: white;
  padding: 55px 55px;
  /* margin-bottom: 100px; */

}

.upcommin_img {
  border-radius: 100px;
  border: white solid 2px;
  margin-top: 5px;
}


.my-aline-left,
.msg-style3 {
  padding: 15px;
}

.show-sty {
  margin-bottom: 20px;
  margin-top: 60px;
}

.show-sty2 {
  margin-top: 20px;
  margin-bottom: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
}

.show-sty2 p {
  text-align: left;
  /* line-height: 10px; */
}

.text-title {
  color: rgb(237, 50, 55) !important;
}

.text-content {
  color: chocolate !important;
  font-weight: 500;
}

.show-border {
  border: solid 2px gray;
  border-radius: 5px;

}

p #pmsg {
  /* line-height: 20px; */
  text-align: justify;
}

#error {
  margin-top: 90px;
  margin-bottom: 20px;
}

.sty-more-btn {
  margin-bottom: 25px;
}

.sty-container {
  margin-bottom: 0%;
}


div .btn-admin {
  background-color: chocolate;
  color: white;
}

.btn-div {
  text-align: center;
  width: 70%;
  margin: auto;
  margin-top: 20px;
}

.pw {
  margin-top: 20px;
}

.input-group-btn {
  text-align: center;
  background-color: darkgreen;
}

.mod-footer,
.mod-haeder {
  text-align: center;
  width: 70%;
  margin: auto;
  background-color: chocolate;
  color: white;
}

.nav-mg {
  margin-left: 20px;
}

.ad_p {
  font-weight: 600;
  font-size: small;
  /* color: darkgoldenrod; */
  /* color: darkolivegreen; */
  margin-top: 20px;
}

.adbtn-sty {
  color: white;
  text-align: center;
  margin: auto;
}

#adminPage {
  display: none;
}

.main-heading-text-addded {
  /* text-shadow: #fafafa; */
  color: chocolate !important;
  /* text-decoration: underline solid white; */
  text-shadow: 2px 2px #5a3d3d !important;
}


@media screen and (max-width: 390px) {
  .main-heading-text-addded em {
    font-size: x-small;
  }

  .main-heading-text-addded {
    width: 90%;
  }


  /* .btn {
    font-size: xx-small;
  }

  .btn-custom{
    padding: 0.2em 1.2em;
    font-size: xx-small;
  }

  .btn-custom-outline {
    padding: 0.2em 1.2em;
  } */


}

/* Hide the priceTable when screen size is 775px */
@media screen and (max-width: 775px) {
  #styledTable {
    display: none;
  }
}


/* my nav bar */
.overlay-nav {
  height: 0%;
  width: 100%;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: rgb(0, 0, 0);
  background-color: rgba(0, 0, 0, 0.9);
  overflow-y: hidden;
  transition: 0.5s;
}

.overlay-nav-content {
  position: relative;
  top: 15%;
  width: 100%;
  text-align: center;
  margin-top: 30px;
}

.overlay-nav a {
  padding: 15px;
  text-decoration: none;
  display: block;
  transition: 0.3s;

  color: #fafafa;
  letter-spacing: 1px;
  font-size: 1.5em;
  text-shadow: 1px 0px rgba(0, 0, 0, 0.5);
  background-color: #000;
  /* border: solid  rgb(237, 50, 55) 2px; */
  border: solid white 2px;
  line-height: 80px;
  height: 9vh;
}

.overlay-nav a:hover,
.overlay-nav a:focus {
  color: rgb(237, 50, 55);
}

.overlay-nav .closebtn,
.container #closebtn {
  right: 45px;
  position: absolute;
  /* top: 0; */
  top: 10;
  left: 42%;
  font-size: 36px;
  margin-left: 120px;
  color: rgb(237, 50, 55) !important;
}

@media screen and (max-height: 450px) {
  .overlay-nav {
    overflow-y: auto;
  }

  .overlay-nav a {
    font-size: 20px
  }

  .overlay-nav .closebtn {
    font-size: 40px;
    top: 15px;
    right: 35px;
    /* margin-top: 40px; */
  }
}

#closebtn {
  display: none;
}

/* close embargo icon */
@media screen and (max-width: 274px) {

  .overlay-nav .closebtn,
  .container #closebtn {
    /* margin-left: 0%;
  right: 10px; */
    left: 24%;
  }
}


/* close embargo icon */
@media screen and (max-width: 172px) {

  .overlay-nav .closebtn,
  .container #closebtn {
    /* margin-left: 30px;
  right: 10px; */
    left: 10%;
  }
}

/* close embargo icon */
@media screen and (max-width: 199px) {

  .overlay-nav .closebtn,
  .container #closebtn {
    /* margin-left: 0%;
  right: 10px; */
    left: 5%;
  }
}

/* close embargo icon */
@media screen and (max-width: 164px) {

  .overlay-nav .closebtn,
  .container #closebtn {
    /* margin-left: 0%;
  right: 10px; */
    left: 1%;
  }
}


/* Upcomming software ribbon */

.parent {
  overflow: hidden;
  /* required */
  width: 100%;
  /* for demo only */
  height: 550px
    /* some non-zero number */
  ;
  margin: 25px auto;
  /* for demo only */
  border: 1px solid grey;
  /* for demo only */
  position: relative;
  /* required for demo*/
}

@media screen and (max-width: 410px) {
  .parent {
    /* overflow:scroll; */
    height: 600px
  }
}

@media screen and (max-width: 372px) {
  .parent {
    overflow: scroll;
    /* height: 650px */
  }
}

@media screen and (max-width: 261px) {
  .parent {
    overflow: scroll;
    /* height: 800px */
  }
}

.features {
  width: 85%;
  margin: 20px;
  text-align: justify;

}

.features-btn {
  margin: 5px;
}

.ribbon {
  margin: 0;
  padding: 0;
  background-color: #808080;
  color: white;
  padding: 1em 0;
  position: absolute;
  top: 0;
  right: 0;
  transform: translateX(30%) translateY(0%) rotate(45deg);
  transform-origin: top left;
}

.ribbon:before,
.ribbon:after {
  content: '';
  position: absolute;
  top: 0;
  margin: 0 -1px;
  /* tweak */
  width: 100%;
  height: 100%;
  background-color: #808080;
}

.ribbon:before {
  right: 100%;
}

.ribbon:after {
  left: 100%;
}


.ribbon3 {
  font-size: 16px !important;
  /* This ribbon33 is based on a 16px font side and a 24px vertical rhythm. I've used em's to position each element for scalability. If you want to use a different font size you may have to play with the position of the ribbon3 elements */
  width: 80%;
  position: relative;
  background-color: #808080;
  color: #fff;
  text-align: center;
  padding: 1em 2em;
  /* Adjust to suit */
  margin: 2em auto 3em;
  /* Based on 24px vertical rhythm. 48px bottom margin - normally 24 but the ribbon3 'graphics' take up 24px themselves so we double it. */
}

.ribbon3:before,
.ribbon3:after {
  content: "";
  position: absolute;
  display: block;
  bottom: -1em;
  border: 1.5em solid #986794;
  z-index: -1;
}

.ribbon3:before {
  left: -2em;
  border-right-width: 1.5em;
  border-left-color: transparent;
}

.ribbon3:after {
  right: -2em;
  border-left-width: 1.5em;
  border-right-color: transparent;
}

.ribbon3 .ribbon3-content:before,
.ribbon3 .ribbon3-content:after {
  content: "";
  position: absolute;
  display: block;
  border-style: solid;
  border-color: black transparent transparent transparent;
  bottom: -1em;
}

.ribbon3 .ribbon3-content:before {
  left: 0;
  border-width: 1em 0 0 1em;
}

.ribbon3 .ribbon3-content:after {
  right: 0;
  border-width: 1em 1em 0 0;
}




/* //landingPageBlog */
#landingPageBlog {
  background-color: #fefefe;
  /* padding: 40px; */
  /* padding-top: 120px; */
}


#landingPageBlog #blogHeader h3 {
  padding: 40px;
  padding-left: 0px;
  padding-right: 0px;
  color: black;
}

#landingPageBlog h2 {
  line-height: 30px;
}

#landingPageBlog #blogHeader {
  text-align: center;
  text-decoration: black;
}

#landingPageBlog a {
  color: rgb(237, 50, 55) !important;
  color: chocolate !important;
}

#landingPageBlog button {
  color: rgb(237, 50, 55) !important;
}

#landingPageBlog article span {
  /* background-color: darkolivegreen; */
  color: #000;
}

#landingPageBlog article .post-meta {
  margin-top: 5px;
  margin-bottom: 40px;
  padding: 5px;
  border-bottom: solid 3px rgb(237, 50, 55) !important;
}

#landingPageBlog .blogInfo {
  border-left: solid 1px black !important;
  padding: 4px;
}

/* .mycolor{
  color: rgb(237, 50, 55) !important ;
} */

#landingPageBlog .mySpan {
  /* font-size: xx-large; */
  color: blue !important;
}


.landingPageBlogShow {
  /* margin-top: 100px; */
}


#blogBody p,
#blogBody li {
  text-align: left;
  font-size: 21px;
  color: #000;
  margin-bottom: 25px;
  /* font-weight: 400; */
  font-family: Georgia, 'Times New Roman', Times, serif;
}

#blogBody li {
  text-align: left;
  font-size: 21px;
  color: #000;
  margin-bottom: 25px;
  margin-left: 20px;
  font-family: Georgia, 'Times New Roman', Times, serif;
}

article #blogTitle {
  font-family: 'Times New Roman', Times, serif !important;
  /* font-size: xx-large; */
  font-size: 42px !important;
  font-weight: 600 !important;
}

article .paragraphLineLeft {
  border-left: solid 4px rgb(139, 133, 133);
  margin: 10px;
}

#blogHeader {
  margin-top: 70px;
  background-color: rgb(143, 134, 134);
}

.blogHeader {
  margin: 60px 0px 0px 0px;
  color: black;
  /* background-color: rgb(143, 134, 134); */
}

.blogCategory {
  background-color: rgb(143, 134, 134);
}

.blogHeadInfo {
  color: chocolate !important;
}

.quoteSection {
  background-color: rgb(22, 18, 18);
}

#sideQuote {
  /* border-left: dotted 9px rgb(237, 50, 55) !important;
      border-left: dashed 9px rgb(237, 50, 55) !important; */
}

#sideQuote h3 {
  text-decoration: dashed 9px rgb(237, 50, 55) !important;
  border-bottom: dashed 9px rgb(237, 50, 55) !important;
}

/* section .quoteSubHeader,
.bestHeader {
  font-family: Georgia, 'Times New Roman', Times, serif;
  font-weight: 100;
  font-size: x-large;
  line-height: 40px;
} */

section .quoteSubHeader,
.bestHeader {
  font-family: Georgia, 'Times New Roman', Times, serif;
  font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
  font-weight: 100;
  font-size: large;
  line-height: 30px;
}



.myTextFormat {
  font-family: 'Roboto Slab', serif;
  font-size: 18px;
  line-height: 30px;
  /* line-height: 1.80857; */
}



#site-footerr ul li a {
  /* color: white !important; */
  font-family: 'Roboto Slab', serif;
  font-weight: 500;
  font-size: 18px;
  line-height: 30px;
  margin-top: 10px;
  border-left: chocolate solid 1px;
}

#site-footerr p {
  border-left: chocolate solid 1px;
}

#site-footerr ul p a {
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  font-weight: 500;
  font-size: 18px;
  line-height: 30px;
  margin-top: 10px;
}

.quoteWithoutImg {
  font-family: Georgia, 'Times New Roman', Times, serif;
  font-weight: 100;
  font-size: x-large;
  line-height: 40px;
  border-radius: 5px;
  border: 5px white solid;
  padding: 10px;
  /* color: white; */
}

.quoteDate {
  border-left: solid 5px white !important;
  border-right: solid 5px white !important;
}


.quoteBody p {
  text-align: center;
  color: rgb(61, 14, 14);
  margin-bottom: 25px;
  font-weight: 400;
  font-family: Georgia, 'Times New Roman', Times, serif;
  font-size: 29px;
  line-height: 50px;
  border-left: solid 6px rgb(139, 133, 133);
  border-right: solid 6px rgb(139, 133, 133);
  padding: 10px;
}

.popUpQuote {
  font-weight: 900;
}

ul .categoryList {
  display: inline-block;
  border-left: solid 3px rgb(237, 50, 55) !important;
  margin: 0px 3px 3px 3px;
}


.categoryLenght {
  border-radius: 50px;
  background-color: #000;
}

.categoryLenghtH3 {
  line-height: 30px;
}


h1 .main-heading-title {
  font-size: xx-large;
}

#my-header-h1 {
  font-size: x-large;
}


.header2CreateMarginTop {
  margin-top: 80px;
}


#editorImage {
  /* border: 4px maroon solid; border-radius: 20%; */
  border: 2px rgb(73, 36, 36) solid;
  border-radius: 50%;
  height: 150px;
  /* margin-top: 0%; */
}



* {
  box-sizing: border-box;
}



/* NEW EXPERTISE LIST
https://www.bootdey.com/snippets/view/bs4-light-resume-page */
body {
  margin-top: 20px;
}

.candidates-profile-bg {
  padding: 180px 0px 80px 0px;
  background-image: url("https://www.bootdey.com/img/Content/bg1.jpg");
  background-size: cover;
  position: relative;
  background-position: center center;
  min-height: 100vh;
}

.candidates-profile-details img {
  max-width: 130px;
  background: transparent;
}

.candidates-profile-details .candidates-profile-name {
  font-weight: 300;
}

.candidates-profile-icons .list-inline-item {
  margin: 0 1px !important;
}

.candidates-profile-social-icons li a {
  height: 32px;
  width: 32px;
  color: rgba(255, 255, 255, 0.7);
  text-align: center;
  font-size: 15px;
  display: inline-block;
  line-height: 30px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.7);
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

.candidates-profile-social-icons li a:hover {
  background-color: #ff4f6c;
  color: #ffffff;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  border-color: #ff4f6c;
}

.profile-education-icon {
  border: 1px solid #ececec;
  position: absolute;
  width: 90px;
  height: 90px;
  line-height: 90px;
  font-size: 42px;
  border-radius: 50px;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  background-color: #ffffff;
  color: #ff4f6c;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

.candidates-profile-education {
  padding: 64px 24px 24px;
}

.candidates-profile-education:hover .profile-education-icon {
  background-color: #ff4f6c;
  border: 1px solid #ff4f6c;
  color: #ffffff;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

.job-details {
  padding: 210px 0px 60px 0px;
  background-image: url("../images/job-details-bg.jpg");
  background-size: cover;
  position: relative;
  background-position: center center;
}

.job-detail {
  border: 1px solid #ececec;
  border-radius: 6px;
}

.job-details-desc-item p {
  overflow: hidden;
}

.job-detail-icons li {
  margin: 2px !important;
}

.job-detail-icons li a {
  height: 32px;
  width: 32px;
  color: #ff4f6c;
  text-align: center;
  font-size: 15px;
  display: inline-block;
  line-height: 30px;
  border-radius: 50%;
  border: 1px solid #ff4f6c;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

.job-detail-icons li a:hover {
  background-color: #ff4f6c;
  color: #ffffff;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

.job-detail-time li {
  padding: 10px 4px;
  border-top: 1px solid #ececec;
}

.job-detail-time li:first-child {
  border-top: none;
}

.section {
  padding-bottom: 80px;
  padding-top: 80px;
  position: relative;
}



/* NEW HOW IT Works
https://www.bootdey.com/snippets/view/bs4-how-it-works-page */
body {
  margin-top: 20px;
  background: #F0F8FF;
}

.timeline-page {
  padding: 10px 0;
  position: relative;
  margin-top: 35px;
}

.timeline-page::after {
  content: "";
  height: 95%;
  left: 0;
  margin: auto;
  position: absolute;
  right: 0;
  top: 0;
  width: 1px;
  background-color: #e8e8e8;
}

.timeline-item {
  margin-bottom: 80px;
}

.timeline-page .timeline-item .date-label-left {
  text-align: center;
  margin-right: 20px;
  position: relative;
}

.timeline-page .timeline-item .date-label-left::after,
.timeline-page .timeline-item .duration-right::after {
  border: 3px solid rgba(255, 255, 255, 0.8);
  border-radius: 50%;
  content: "";
  height: 20px;
  position: absolute;
  top: 20px;
  width: 20px;
  z-index: 1;
}

.timeline-page .timeline-item .date-label-left::after {
  right: -45px;
}

.timeline-page .timeline-item .duration-right::after {
  left: -45px;
}

.timeline-page .timeline-item .works-description-right {
  text-align: left;
  margin-left: 15px;
  float: left;
  border-radius: 0;
  padding: 20px 0;
}

.timeline-page .timeline-item .duration-right {
  text-align: center;
  margin-left: 20px;
  position: relative;
}

.timeline-page .timeline-item .works-description-left {
  text-align: right;
  margin-right: 15px;
  float: right;
  border-radius: 0;
  padding: 20px 0;
}

.timeline-page h4,
.works-description-left h4 {
  font-size: 18px;
  margin-top: 0;
  text-transform: capitalize;
}

.timeline-subtitle {
  line-height: 26px;
  color: #666;
}

.bg-custom,
.btn-custom,
.timeline-page .timeline-item .date-label-left::after,
.timeline-page .timeline-item .duration-right::after,
.back-to-top:hover {
  background-color: #f6576e;
}





/* NEW ABOUT US
  https://www.bootdey.com/snippets/view/bs4-light-resume-page */
/* body {
  margin-top: 20px;
} */

.candidates-profile-bg {
  padding: 180px 0px 80px 0px;
  background-image: url("/images/ab2.jpg");
  background-size: cover;
  position: relative;
  background-position: center center;
}


.candidates-profile-details img {
  max-width: 200px;
  background: transparent;
}

.candidates-profile-details .candidates-profile-name {
  font-weight: 300;
}

.candidates-profile-icons .list-inline-item {
  margin: 0 1px !important;
}


.section {
  padding-bottom: 80px;
  padding-top: 80px;
  position: relative;
}