html, body {
  height: 100%;
  width: 100%;
  overflow: hidden;
  padding: 0;
  margin: 0; 
  background-color: #f7f7f7; }

body {
  overflow-y: scroll;
  color: #333;
  -webkit-font-smoothing: antialiased; }

.container {
  max-width:700px;
  margin: auto;
  padding: 60px 60px;
  padding-top: 0px; 
  font-family: 'Open Sans', sans-serif;
}

.profile {
  max-width:200px;
  float: left;
  margin: auto;
  padding: 50px;
  padding-left: 85px;
}

h1 {
  font-size: 40px;
  font-weight: 100;
  line-height: 1.6; 
}

h3 {
  margin: 5px 0px;
}

h4 {
  margin: 5px;
}

p {
  margin-top: 8px;
}


.intro__links {
  display: flex;
  justify-content: start;
  border-bottom: 2px solid;
  border-color: #003EE8;
  font-size: 16px; }


.intro li {
  list-style: none;
  
}

.img_center {
  text-align: center;
}

button {
  border: none;
  background-color: #ddd;
  padding: 14px 28px;
  font-size: 16px;
  cursor: pointer;
  display: inline-block;
}

/* On mouse-over */
button:hover {background: #eee;}
button:focus {outline:none;}


#button {
  display: inline-block;
  background-color: #FF9800;
  width: 50px;
  height: 50px;
  text-align: center;
  border-radius: 4px;
  position: fixed;
  bottom: 30px;
  right: 30px;
  transition: background-color .3s, 
    opacity .5s, visibility .5s;
  opacity: 0;
  visibility: hidden;
  z-index: 1000;
}

#button::after {
  content: "\f077";
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  font-size: 2em;
  line-height: 50px;
  color: #fff;
}
#button:hover {
  cursor: pointer;
  background-color: #333;
}
#button:active {
  background-color: #555;
}
#button.show {
  opacity: 1;
  visibility: visible;
}


#Div2 {
  display: none;
}

#ButtonProfessional {
  display: none;
  border-color:green;
  border-bottom: 4px solid;
}

.project {
  margin-bottom: 50px;
}

/*.intro__links li {
  flex: 1;
  list-style: none;
  text-align: center; }


.intro__links a {
  text-decoration: none; }


.intro__links a:hover {
  color: #003EE8; }*/


/*----------------- Social Media css ----------------------*/

.social_media {
  text-align: center;
  margin: auto;
  padding: 20px;
  padding-bottom: 5px;
}

.fa {
  padding: 10px;
  font-size: 20px;
  width: 20px;
  text-align: center;
  text-decoration: none;
  margin: 5px 2px;
  border-radius: 50%;
}

.fa:hover {
    opacity: 0.7;
}

.fa-facebook {
  background: #3B5998;
  color: white;
}

.fa-github {
  background: black;
  text-align: center;
  color: white;
}

.fa-twitter {
  background: #55ACEE;
  color: white;
}

.fa-google {
  background: #dd4b39;
  color: white;
}

.fa-linkedin {
  background: #007bb5;
  color: white;
}

.fa-youtube {
  background: #bb0000;
  color: white;
}

.fa-instagram {
  background: #125688;
  color: white;
}