* {
  margin     : 0;
  padding    : 0;
  box-sizing : border-box;
  font-family: 'Courier New', Courier, monospace;
}


.navbar {


  width          : 100%;
  background     : rgb(0, 0, 0);
  color          : rgb(255, 255, 255);
  display        : flex;
  align-items    : center;
  justify-content: space-between;
}

.mainMenu {
  display   : flex;
  list-style: none;
}

.link {
  font-family    : Arial, sans-serif;
  border-radius  : 2.75px;
  display        : inline-block;
  padding        : 15px;
  text-decoration: none;
  text-transform : uppercase;
  color          : rgb(255, 255, 255);
  font-size      : 18px;
  transition     : 0.2s ease;
}

.link:hover {
  background: rgb(255, 255, 255);
  color     : rgb(0, 0, 0);
}

.openMenu {
  font-size: 2rem;
  margin   : 20px;
  display  : none;
  cursor   : pointer;
}

.mainMenu .closeMenu,
.icons i {

  font-size: 2rem;
  display  : none;
  cursor   : pointer;
}

.fa-facebook:hover {
  color: rgb(0, 110, 255);
}

.fa-twitter:hover {
  color: rgb(86, 154, 243);
}

.fa-instagram:hover {
  color: rgb(255, 0, 191);
}

.fa-github:hover {
  color: rgb(255, 123, 0);
}

@media (max-width: 800px) {


  .mainMenu {
    height         : 50vh;
    position       : fixed;
    top            : 0px;
    right          : 0px;
    left           : 0px;
    z-index        : 10;
    flex-direction : column;
    justify-content: center;
    align-items    : center;
    color          : #fff;
    background     : rgb(0, 0, 0);
    transition     : top 1s ease 0s;
    display        : none;
  }

  .mainMenu .closeMenu {
    display : block;
    position: absolute;
    top     : 20px;
    right   : 20px;
  }

  .openMenu {
    display: block;
  }

  .link:hover {
    background-color: #fff;
    color           : rgb(0, 0, 0);
  }

  .icons i {
    display: inline-block;
    padding: 12px;
  }

}

.logo_img {
  margin-left  : 5px;
  width        : 4rem;
  border-radius: 5.75px;
  height       : 50px;
}

.dropdown{
  background-color: #000;
  color: #fff;
}
.dropdown:hover{
  background-color: #fff;
  color: #000;
}

/* Navbar styling end  */

.container {

  height          : 40vh;
  width           : 100%;
  background-color: rgb(93, 93, 93);
  color           : #fff;
  display         : flex;
  justify-content : space-between;
  margin-bottom   : 2rem;

}

.heading {
  border-top    : 2px solid #fff;
  border-bottom : 2px solid #fff;
  text-transform: uppercase;
  position      : relative;
  font-size     : 2.5rem;
  padding-left  : 12.754px;
  width         : 17vw;
  margin        : auto 3rem;
}

.my_img {

  height       : 20vh;
  margin       : auto 0;
  border       : 5px solid #fff;
  border-radius: 25px;
  box-shadow   : 2px 5px 5px #fff;
}

.info {
  margin     : .5rem 0;
  color      : #fff;
  font-size  : 1.5rem;
  font-weight: 900;
}

.short_intro {

  display       : flex;
  flex-direction: row;

}

.basic_info {
  height: 20vh;
  margin: auto 1rem;
}

/* upper end  */


.more {
  width : 88vw;
  margin: auto 2rem;
}


.first_pera {
  font-size: 1.5rem;
}

.first {
  border-radius: 25px;
  padding      : 2rem;
  text-align   : center;
  width        : 40vw;
  border       : 2px solid rgb(116, 30, 255);

}

.second {
  margin       : 2rem 0;
  font-size    : 1.5rem;
  border       : 2px solid rgb(0, 255, 34);
  width        : 80%;
  padding      : 1rem;
  margin-left  : 20%;
  text-align   : center;
  border-radius: 55px 20px;

}

.third {
  width        : 70%;
  position     : relative;
  border       : 2px solid cyan;
  padding      : 1rem;
  margin       : 2rem auto;
  border-radius: 20px 4rem;
}

.soch {
  width    : 10.954rem;
  margin   : 1rem auto;
  font-size: 2rem;
}

.soch_pera {
  text-align: center;
  font-size : 1.5rem;
}



.martin {
  text-transform: uppercase;
  font-size     : 1.5rem;
  font-weight   : bold;
  margin-left   : 70%;
}


/* text end  */


.certi_heading {
  width        : 22vw;
  margin       : 5rem;
  border-bottom: 5px solid gray;
  padding-left : 5.626px;
}

.certi {
  border : 5px solid #000;
  margin : 1rem;
  display: flex;
}

.certi_3 {
  height: 40rem;
}

.udemy {
  height: 40rem;
}

.lets_python {
  font-size  : 1.5rem;
  font-weight: 900;
  height     : 19rem;
  margin     : auto;
  text-align : center;
}

.freecodecamp {
  font-weight: 900;
  font-size  : 1.5rem;
  height     : 20rem;
  margin     : auto;
  text-align : center;
}

.c6 {
  flex-direction: row-reverse;
}

/* certificate end  */













/* for mobil view */
@media (max-width: 800px) {
  .heading {
    width: 13rem;
  }

  .container {
    height        : 15rem;
    display       : flex;
    flex-direction: column;
  }

  .short_intro {

    display       : flex;
    flex-direction: row-reverse;

  }

  .basic_info {
    position      : relative;
    width         : 23rem;
    display       : flex;
    flex-direction: column;
    position      : relative;
  }

  .job {
    margin-top: -.2rem;
  }

  .first {
    width: 60vw;
  }

}