body,html{
  height: 100%;
  margin: 0;
  font-family: serif;
  font-weight: bold;
}

.top{
  background-image: url("../urusha.jpg");
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  height:75vh;
}

.second-half{
  background-color: beige;
}

.grid-view{
  display: grid;
  padding: 15px;
  grid-template-columns: auto  auto;

}

.about-icon, .education-icon,.experience-icon{
  display: flex;
  align-items: center;
  justify-content: center;
}

.navbar {
   overflow: hidden;
  background-color:darkgrey; 
  opacity: 0.7;
}

.top #user{
  float: left;
  color:whitesmoke;
  /* color: black; */
  font-size: 20px;
  padding: 0px 16px;
  font-style: italic;
}

#desc{
  display: inline-block;
  position: absolute;
  top: 60%;
  right: 800px;
  color: whitesmoke;
}

.navbar a {
  float: right;
  font-size: 20px;
  color:whitesmoke;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

.dropdown {
  float: right;
  overflow: hidden;
}

.dropdown .dropbtn {
  font-weight: bold;
  font-size: 20px;  
  border: none;
  outline: none;
  color: whitesmoke;
  padding: 14px 16px;
  background-color: inherit;
  font-family: inherit;
  margin: 0;
}

.navbar a:hover, .dropdown:hover .dropbtn {
  background-color:rosybrown; 
  /* opacity: 0.6; */
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: initial;
  /* background-color:skyblue; */
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  float: none;
  color:whitesmoke;
  background-color: inherit;
  padding: 12px 16px;
  display: block;
  text-align: left;
}

.dropdown-content a:hover {
  background-color: #ddd;
}

.dropdown:hover .dropdown-content {
  display: block;
} 

.about-section{
  font-family: sans-serif;
  font-size: 16px;
  color: black;
  font-style: italic;
  display: block;
  text-align: justify;
  line-height: 1.5;
}

.about-title{
  /* font-family: sans-serif;
    font-size: 18px;
    color: black;
    font-style: italic;
    display: block;
    text-align: justify;
    line-height: 1.5; */
    text-decoration: underline;
    /* font-weight: bold; */
    font-size: 18px;
}

.about-lvl{
  padding: 25px;
  margin: 25px 0px;
}

.education-section{
    font-family: sans-serif;
    font-size: 16px;
    color: black;
    font-style: italic;
    display: block;
    text-align: justify;
    line-height: 1.5;
}

.education-lvl{
  border: 1px solid;
  margin: 25px 0px;
}

.education-title{
  text-decoration: underline;
  /* font-weight: bold; */
  font-size: 18px;
}

.experience-section{
  font-family: sans-serif;
  font-size: 16px;
  color: black;
  font-style: italic;
  display: block;
  text-align: justify;
  line-height: 1.5;
}

.experience-lvl{
border: 1px solid;
margin: 25px 0px;
}

.experience-title{
text-decoration: underline;
/* font-weight: bold; */
font-size: 18px;
}


/* @media screen and (min-width:960px)
{
  .top{
    height:50vh;
  }
}*/

@media  only screen and (min-width:255px)
{
  .navbar {
    overflow: hidden;
   /* background-color:darkgrey;  */
 }
  .top{
    height:40vh;
  }
  #desc{
    display: inline-block;
    position: absolute;
    top: 25%;
    color: whitesmoke;
    right: 300px;
  }
} 

@media only screen and (min-width : 992px ) 
{
  .navbar {
    overflow: hidden;
   /* background-color:darkgrey;  */
 }
  .top{
    height:50vh;
  }
  #desc{
    display: inline-block;
    position: absolute;
    top: 35%;
    right: 405px;
    color: whitesmoke;
  }
}