styles.css

@font-face{
    font-family: AvertaBlack; src: url('./AvertaBlack');
    font-family: AvertaLight; src: url('./AvertaLight');
    font-family: Averta; src: url('./Averta');

  }
body{
  height:2000px;
  background: #E9ECEF;
}
.arrow{
  height: 15px;
  width: 50px;
  margin-left: 450px;

}
.footer{
   text-align: center;
   margin-top: 12px;
   margin-bottom: 12px;

}
#footerImg{
  background: url('./footer_end.png');
  width: 100%;
  height: 300px;
  background-repeat: no-repeat;
  margin-top: 0px;
  margin-bottom: 0px;
  background-position: bottom;

}
#resume{
  height:300px ;
  background: url('./circles.png');
  background-size: contain;
  background-position: center
}
.nav-name{
  color: white;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 25px;
  margin-left: 560px;
  margin-right: 1000px;

}
.download-resume-btn{
  border-radius: 100px;margin-left: 75%;
    height: 100px;
    width: 450px;
}
@media screen and (max-width: 1024px) {
    .download-resume-btn {
        border-radius: 100px;
        margin-left: 55% !important;
        height: 100px;
        width: 450px;
    }
}
@media screen and (max-width: 768px) {
    .download-resume-btn{
        border-radius: 100px;margin-left: 55% !important;
        height: 100px;
        width: 450px;
    }
    .nav-name {
        color: white;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 25px;
        margin-left: 0px;
        margin-right: 1000px;

    }

    .navbar{
        position: fixed !important;
        opacity:1 !important;


    }

}
    @media screen and (max-width: 600px) {
        .social-icons-panel{
            display:flex;
            flex-direction: row;
            margin-top: 50px !important;
        }
    .arrow{
        display: none !important;
    }
 .responsiveImgDivs{
   padding: 0px !important;
 }

  .navbar{
    position: fixed;
    opacity:1 !important;


  }
  div img.img-block{
    margin-top: 10px;
    border-radius: 6px !important;
    margin-bottom: 10px;
    height: 300px !important;
    padding: 0px !important;
    width: 100% !important;
    margin: 5px !important;
  }
a img.viewbtn{
  margin-top: 30px; 
  margin-left: 10px;
   }
  a img.download-resume-btn{
  border-radius: 100px;
      margin-left: 16% !important;
      margin-top: 10px;
      height: 60px !important;
      margin-bottom: -20px;
}
  #resume{
  height:200px ;
  background: url('./circles.png');
  background-size: contain;
  background-position: center
}
  .home{
    padding-top: 75px !important;
  margin-bottom: 0px;
  margin-right: -20px;
      width: 100%;
  /* background: url('./landing'); */
  background-image: url('./v.jpg') !important;
  background-size: 100% 100% !important;
  background-repeat: no-repeat;
  }
  .nav-name{
    margin-left: -10px !important;
  }
    .email{
        letter-spacing: 0.2em;
        font-size: 15px !important;
    }

}

.nav-other{
  color: white;
  margin-right: 20px;


}

.dummyImg{
  background: linear-gradient(to right,  rgba(108, 72, 169, 1) 0%,rgba(255, 40, 122, 1) 100%);
  }
.description{
  word-spacing: 0.3em;
  letter-spacing: 0.1em;
  line-height: 2em;
}
.see-more{
  color: black;
  align-self: center;
  margin-left: 10px;
    cursor: pointer;
}
a:hover{
  text-decoration: none;
}
.viewbtn{

   margin-top: 30px; 
   margin-left: 40%
}
.each-layout{
  margin-top: 0px;
  margin-bottom: 0px;
  /* padding-top: 10px;
  padding-left: 50px; */

}
.social-icon{
  width: 30px;
  height: 30px;
  margin-right: 15px;
}
.headings{
  font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
  font-size: 45px;
}
.social-icons-panel{
  display:flex;
   flex-direction: row;
   margin-top: 80px;
   margin-top: 150px;
}
.home{
  padding-top: 270px;
  padding-left: 50px;
  margin-bottom: 0px;
  background-image: url('./landing.jpg');
  background-size: 100% 105%;
  background-repeat: no-repeat;
}
 .email{
  letter-spacing: 0.2em;
  font-size: 20px;
 }
.aftername{
  /* font-family: Verdana, Geneva, Tahoma, sans-serif; */
  letter-spacing: 0.2em;
  font-size: 30px;
}
.navbar{
  padding: 0px 0px 0px 10px;
  display: flex;
  background: linear-gradient(to right,  rgba(108, 72, 169, 1) 0%,rgba(255, 40, 122, 1) 100%);
}

 .active-keep {
   border-bottom: 2px solid white;
  transition: all 0.3s ease;
  
}

/* .nav-towards {
  
    -webkit-animation: front 2s ; /* Safari 4.0 - 8.0 
    -webkit-animation-fill-mode: forwards;

    animation: front 2s ;
    animation-fill-mode:forwards;
}
.nav-backwards {
  
  -webkit-animation: back 2s ; /* Safari 4.0 - 8.0 
  -webkit-animation-fill-mode: forwards;

  animation: back 2s ;
  animation-fill-mode:forwards;
}
/* Safari 4.0 - 8.0 
@-webkit-keyframes front {
  0%   { opacity: 0.3;}
    100% { opacity: 1;}
}

@keyframes front {
    0%   { opacity: 0.3;}
    100% { opacity: 1;}
}
/* Safari 4.0 - 8.0 
@-webkit-keyframes back {
  100%   { opacity: 1;}
    0% { opacity: 0.3;}
}

@keyframes back {
  100%   { opacity: 1;}
    0% {opacity: 0.3;}
} */