@charset "UTF-8";
/* CSS Document */
body {
 font-family:'Playpen Sans', cursive;
 font-family: 'Yantramanav', sans-serif;
  margin: 0;
  padding: 0;
  background-color: lightgray;
}

header {
  background-color: dimgrey;
  color: whitesmoke;
  text-align: center;
  padding: 10px;
}

header h1 {
  margin: 0;
  font-family:'Playpen Sans', cursive;
 font-family: 'Yantramanav', sans-serif;
 color: whitesmoke; 
}

nav ul {
  list-style-type:georgian;
	font-family:'Playpen Sans', cursive;
 font-family: 'Yantramanav', sans-serif; 
  padding: 10px;
}

nav ul li {
  display: inline;
  margin-right: 10px;
	font-family:'Playpen Sans', cursive;
 font-family: 'Yantramanav', sans-serif; 
}

nav a {
  text-decoration: none;
  color: #fff;
}

main {
  padding: 20px;
}

footer {
  background-color: dimgrey;
  color: whitesmoke;
  text-align: center;
  padding: 10px;
}

a:hover{  
font-weight: bold; 
color:black; 
}

/* Home Page */
.home-section {
  text-align: center;
  color: #333;
}

.home-section h2 {
  font-family: 'Georgia', serif;
  color: #0077cc;
}

/* Work Page Styles */
.work-section {
  text-align: center;
  color: black;
  font-family:'Yantramanav', sans-serif;  
}

.work-section h2 {
  font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
  color: black;
}

.work-section ul {
  list-style-type:armenian;
  padding: 0;
}

.work-section li {
  margin-bottom: 10px;
}

.work-section a {
  color: black;
}

/* ABout Me Styles */
.container {
  width: 1500px;
  margin: 20px auto;
  display: flex;
}

.text-section {
  flex: 1;
  padding: 20px;
}

.text-section h2 {
  color: black;
}

.text-section p {
  color: black;
font-family: "articulat-cf", sans-serif;
font-weight: 350;
font-size: 18px;
font-style: normal;
}

.image-section {
  flex: 1;
  display: flex;
  justify-content: space-around;
  align-items: center;
}

.image-section img {
  width: 100%;
  height: auto;
  border: 1px solid none;
  border-radius: 8px;
  margin-bottom: 10px;
  align-items: center
}

.image-section img {
  width: 100%;
  height: auto;
  border: 1px solid none;
  border-radius: 8px;
  margin-bottom: 10px;
  align-items: center;
  display: flex;
}

footer {
  background-color: darkgray;
  color:whitesmoke;
  text-align: center;
  padding: 10px;
margin-bottom:auto;
	position: fixed;
	bottom: 0px;
	width: 100%;
}

/*Wide Screen Style*/
@media screen and (min-width: 768px) {
  header {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  nav ul {
    text-align: center;
  }

  nav ul li {
    display: inline;
    margin: 0;
  }

  main {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
  }

.content {
    width: 35%;
  }

	
	
/*Mobile Style*/
@media screen and (max-width: 767px) {
  nav ul {
    text-align: center;
  }
  main {
    flex-direction: column;
  }