/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */

/*NAVBAR STYLING*/
.navbar {
  background: gray;
  font-family: calibri;
  padding-right: 15px;
  padding-left: 15px;
}

.navdiv {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.logo a{
  font-size: 40px;
  font-weight: 600;
  color: white;
  text-decoration: none;
}

.headerlist li{
    list-style: none;
  display: inline-block;
}

.headerlist li a{
   color: white;
  font-size: 25px;
  font-weight: bold;
  margin-right: 25px;
}

/* linkedin logo sizing */
.incontainer {
    width: 30px;
    height: 30px;
}

/* Resize images */
.incontainer img {
    width: 100%;
    height: auto;
}

/*NAVBAR STYLING END*/

/*POST CARD STYLING ROW 1*/
.postcards {
  background: #3333;
  align-items: center;
  justify-content: center;
  display: flex;
}

.cover{
  width: 1600px;
  height: 450px;
 /* background: #000;*/
  margin-top: 30px;
  display: flex;
}

.box {
  margin: 15px;
  width: 1000px;
  height: 400px;
  align-items: center;
  justify-content: center;
  text-align: center;
  
}

.cover img{
  width: 500px;
  height: 300px;
  display: flex;
  border-radius: 5px
}

/*SPACING BETWEEN LINES*/
.boxheader {
  line-height: 10px;
}

/*POST CARD STYLING ROW 1 END*/

/*POST CARD STYLING ROW 2*/
.cover2{
  width: 1600px;
  height: 500px;
 /* background: #000;*/
  /*margin-top: 10px;*/
  display: flex;
}

.cover2 img{
  width: 500px;
  height: 300px;
  display: flex;
  border-radius: 5px
}

/*ABOUT ME CSS*/
.about {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100vh;
  /*background-color: #121212;*/
  padding: 0 20px;
  max-width: 1200px;
  margin: 0 auto;
  /*display: flex;*/
  gap: 100px;
  color: black;
}

.about a{
  text-decoration: none;
}

.about__img{
  display: block;
  max-width: 350px;
  border-radius: 5px
}

.about__title{
  color: #ffc100;
  font-size: 60px;
}

/*VERTICAL TEXT SPACING DOUBLE SPACING CONTROL CODE*/
.about__subtitle{
  padding: 10px 0 20px;
}

.about__text{
  line-height: 28px;
  
}

.about__social{
  padding: 30px 0;
  display: flex;
  align-items: center;
  gap: 10px;
}

.about__social-img{
  display: block;
  width: 100%;
}

/*BORDER RADIUS, OUTLINE CODE*/
.about__social-link{
  padding: 10px;
  width: 60px;
  display: block;
  border-radius: 15px;
  border: 3px solid #ffc100;
  transition: background-color 0.3s;
}

.about_social-link:hover
{
  background-color: #ffc100;
}



/*ABOUT ME CSS END*/

/*FOOTER*/

footer{
  background-color: gray;
}

.footerContainer{

  padding: 20px 30px 20px;
}

.footerBottom p{
  text-align:center;
  justify-content: center;
}

body {
  background-color: white;
  color: black;
  font-family: Verdana;
}