@import url('https://fonts.googleapis.com/css2?family=Holtwood+One+SC&family=Inder&family=Montserrat:wght@400;700&display=swap');


/* first and main section of home page starts from here*/

/* adjusting width of main row */
.main-section .row {
    width: 100%;
    margin: 0;
    
}
/* setting height and position of both columns content */
.main-section .row .col1 {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 0;
    margin: 0;
    position: relative;
  }

  .main-section .row .col12 {
    align-items: center;
  }
  /* first column img */ 
  .main-section .row .col1 img {
    width: 60%;
    height: 60%;
    margin-top: 20px;
  }
  /* first column background vector */
  .main-section .row .col1 .first-vector {
    position: absolute;
    z-index: -1;
    top: 0;
    margin-top: -20px;
  }
  /* 2nd column styling*/
  .main-section .row .col11 {
    padding: max(3vw, 20px);
  }


  .main-section .row .col1 h3 {
    font-family: 'Holtwood One SC', serif;
    font-weight: 700;
    font-size: max(1.8vw,15px);
    /* align-self: center; */
    letter-spacing: 2px;
    border-style: solid;
    padding: 0.5vw;
    border-radius: 40px;
    height: max(3.5vw,30px);
    width: max(13vw,200px);
    text-align: center;
    color: var(--primary-color);
    border-color: #000000;
  }
  .main-section .row .col1 h2 {
    font-family: 'Montserrat', sans-serif;
    font-weight: 900;
    font-size: 40px;
    margin-top: 20px;
  }

  .main-section .row .col1 h2 span {
    color: var(--primary-color);
  }

  .main-section .row .col1 h4 {
    font-weight: 600;
    margin-top: 20px;
  }

  .main-section .row .col1 h4 span {
    color: var(--primary-color);
  }

  .main-section .row .col1 p {
    margin-top: 20px;
    font-family: 'Montserrat', sans-serif;
    padding: 5px;
    font-size: 17px;
    font-weight: 500;
  }
















  .recommended-articles h2{
    font-family: 'Holtwood One SC', serif;
    padding-left: 5vw;
  }

  .recommended-articles h2 span{
    color: var(--primary-color);
  }

  .recommended-articles .row {
    width: 100%;
    margin-top: max(2vw,20px);
    padding: 10px 4vw;
  }

  .recommended-articles .row img {
    width: 100%;
  }

  .recommended-articles .row .col-md-7 div {
    padding: 0 4vw;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .recommended-articles .row .col-md-7 div h3 {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: 30px;
  }

  .recommended-articles .row .col-md-7 div h3 span {
    color: var(--primary-color);
  }

  .recommended-articles .row .col-md-7 div p {
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    font-size: 20px;
    margin-top: 20px;
  }

  .blogs {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
 }

 .blogs .row2 {
     margin-top: max(4vw,25px);
     width: 85%;
 }
 
 .blogs .row2 .col-md-4 div{
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
     width: 100%;
 }
 
 .blogs .row2 .col-md-4 div img {
     width: 100%;
 }
 
 .blogs .row2 .col-md-4 div h4 {
     margin-top: 20px;
     font-weight: 700;
     font-size: max(1.5vw,15px);
     font-family: 'Montserrat', sans-serif;
 }
 
 .blogs .row2 .col-md-4 div h4 span {
     color: var(--primary-color);
 }
 
 .blogs .row2 .col-md-4 div p {
     margin-top: 10px;
     font-family: 'Montserrat', sans-serif;
     font-weight: 400;
     font-size: max(1.1vw,12px);
 }