/* Styling of the whole page */
*{
  background-color: #FFF8F3;
  font-family: Verdana, Geneva, Tahoma, sans-serif;
  color: #112B3C
}

/* Getting rid of the underline on the links */

a:link { text-decoration: none; }


a:visited { text-decoration: none; }


a:hover { text-decoration: none; }


a:active { text-decoration: none; }


/* Styling of the header */
header{
  padding: 25px 50px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #68A7AD;
}
   
.title{
  background-color: #68A7AD;
  color:#EFEAD8 ;
  
  }

.title:hover {
  color: #FFF8F3;
}

h1{
  color: #68A7AD;
}

/* Styling of the nav links */

.link-navbar {
  background-color: #68A7AD;
}
nav{
 background-color: #68A7AD;
 text-decoration: none;
 display: flex;
 justify-content: space-between;
 color: #6998AB;
 cursor: grab;
}

nav a:hover {
 color: #FFF8F3;
}

.nav-link {
 background-color: #68A7AD;
 display: flex;
 justify-content:space-between;
}

.ul {
 background-color: #68A7AD;
 list-style: none;
 display: flex;
 justify-content: space-between;
 min-width: 300px;
}

ul{
 background-color: #F7E2E2 ;
}

li{
 background-color: #F7E2E2 ;
}

/* Styling of the container1, which includes bio and profile picture */

.bio{
  padding: 100px 50px 0px 200px;
  display: flex;
  flex-direction: column;
  line-height: 2;
}

.image {
  width: 200px;
  height: 200px;
  height: auto;
  float: right;
  margin: 100px 200px 0px 0px ;
  padding: 3px;
}

.container1{
  padding-bottom: 80px;
}


/* Styling of the pictures */

/* Titles */
.title-1{
  padding-left: 350px;
}

.title-2{
  padding-left: 150px;
}

.title-3{
  padding-left: 165px;
}

.title-4{
  padding-left: 180px;
}

.title-5{
  padding-left:300px;
}

.title-6 {
  padding-left: 250px;

}

.container-6{
  padding-left: 100px;

}
.my-work {
  margin-bottom: 50px ;
  background-color: #68A7AD; 
  color:#EFEAD8 ;
  font-size: 30px;
  padding: 25px 50px;
}

.my-work:hover {
  color: #FFF8F3;
}

.parent-container{
  padding-left: 280px;
}

.flex-parent {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
}
.project-2{
  width: 80%;
}

.project-1{
 width: 70%;
}

a{
  background-color: #FFF8F3 ;
}

.image1 {
  padding: 30px;
  width: 70%;
}

.image1:hover {
  opacity: 0.5;
}
/* Paragraphs */

.two{
 padding: 0px 10px 30px 200px;
 line-height: 1;
}

.three{
  padding: 0px 10px 30px 80px;
  line-height: 1;
 }

 .four{
  padding: 0px 10px 30px 80px;
  line-height: 1;
 }
 
 .five{
  padding: 0px 10px 30px 80px;
  line-height: 1;
 }
 
 .five-{
  padding: 20px 10px 30px 110px;
  line-height: 1;

 }
.puppy{
  padding: 30px ;
}
 
.puppy:hover {
  opacity: 0.5;
}

.flying{
  padding: 30px ;
}
  
.flying:hover {
    opacity: 0.5;
  }

.late{
   padding: 30px ;
     
    }
    
.late:hover {
      opacity: 0.5;
    }


/* Sections from the nav bar */
section {
  margin: 200px ;
}

h3 {
 background-color: #F7E2E2;

}

.about-me {
  margin-bottom: 50px ;
  background-color: #F7E2E2 ;
  
}
#about-me {
  background-color: #F7E2E2 ;

}
.contact {
  margin-bottom: 50px ;
  background-color: #F7E2E2 ;
}

article{
  background-color: #F7E2E2 ;
  padding: 35px;
}

.one{
  background-color: #F7E2E2 ;
}


/* Styling of the footer */

.email{
  background-color: #F7E2E2 ;
}

footer{
    padding: 25px 50px;
    background:#68A7AD;;
    text-align: center;
    display: block;  
}

.footer{
  background: #68A7AD;
  color: #EFEAD8 ;
}

.thank-you::before{
  content:"Thank you ";
  background: #68A7AD;
  color: #EFEAD8 ;
}
.thank-you{
  background: #68A7AD;
  color: #EFEAD8 ;
}

/* Media Queries */

/* 992px or smaller */
@media screen and (max-width: 992px) {
  .flex-parent {
    width: 50%;
    display: flex;
    align-items: center;
    flex-flow: column;
  }

}

/* 768px or smaller */
@media screen and (max-width: 768px) {
  .flex-parent {
    width: 100%;
    display: flex;
    align-items: center;
    flex-flow: column;
  }

}