.branding-page-container-row {

    display: flex;

    flex-wrap: wrap;
    padding: 0 4px;

    justify-content: center;
    gap: 20px;

  }

  /* Create four equal columns that sits next to each other */
  .branding-page-container-column {
    /*-ms-flex: 50%; !* IE10 *!*/
    /*!*flex: 50%;*!*/
    /*max-width: 50%;*/
    /*padding: 0 4px;*/
      display: flex;
      flex-direction: column;
      flex: 1;
      align-items: stretch;

  }

  .branding-page-container-column .branding-page-container {
    margin-bottom: 50px;
}

/* Ensure the last container within each column doesn't have a bottom margin */
.branding-page-container-column .branding-page-container:last-child {
    margin-bottom: 0;
}

  .branding-page-container {
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
      padding: 40px;

      border: 1px solid #ddd;
      border-radius: 10px;
      width: 95%;
      flex-direction: column;
      height: auto; /* Ensure each container takes 100% height of the column */
      margin-bottom: 20px;
      display: flex;

  }
.branding-page-containers {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    border: 1px solid #ddd;
    border-radius: 10px;
    width: 100%;
    flex-direction: column;
    height: auto; /* Ensure each container takes 100% height of the column */
    margin-bottom: 20px;
    display: flex;

}
.branding-page-container div {

    display: flex;
    flex-direction: column;
    justify-content: space-between; /* To push the content to the top and bottom */
}

  .branding-page-container-column:last-child {
    margin-bottom: 0;
}

.background-branding-agency{

    padding: 40px;
}

  .blank-height {
    height: 100px;
  }


  /* Responsive layout - makes a two column-layout instead of four columns */
  @media screen and (max-width: 800px) {
    .branding-page-container-column {
      -ms-flex: 50%;
      flex: 50%;
      max-width: 50%;
      /* margin-bottom: 50px; */
    }

    .background-branding-agency{

        padding: 20px;
    }

    .branding-page-container-row {

      display: flex;
  
      flex-wrap: wrap;
      padding: 0 4px;
  
      justify-content: center;

  
    }


  }

  /* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
  @media screen and (max-width: 600px) {
    .branding-page-container-column {
      -ms-flex: 100%;
      flex: 100%;
      max-width: 100%;
      /* margin-bottom: 50px; */
    }

     .background-branding-agency{

        padding: 20px;
    }


    .blank-height {
        display: none;
    }

    .branding-page-container-row {

      display: flex;
  
      flex-wrap: wrap;
      padding: 0 4px;
  
      justify-content: center;

  
    }

  }

  .paid-notice-margin-text-padding p {
    padding: 0 !important;
    margin: 0 !important;
  }

  .creative-insight {
    margin-top: 0 !important;
  }

  .services-item-title h2{
    font-size: 22px !important;
    color: #f26c23 !important;
    font-weight: 500 !important ;
  }

.seperator{
    margin-bottom: 30px;
    width:100px;
    height:3px;
    background: #f26c23   ;
    border:none;
}
.item-in {
    background: #fff;
    padding: 40px;
    position: relative;


    &:hover:before {
        width: 100%;
    }

    &::before {
        content: "";
        position: absolute;
        bottom: 0px;
        height: 4px;
        width: 0%;
        background:  #f26c23  ;
        right: 0px;
        -webkit-transition: width 0.4s;
        transition: width 0.4s;
    }
}







.seperators{
    margin-bottom: 30px;
    width:100px;
    height:3px;
    background:#053e59;
    border:none;
}
.item-ins {
    background: #fff;
    padding: 40px;
    position: relative;


    &:hover:before {
        width: 100%;
    }

    &::before {
        content: "";
        position: absolute;
        bottom: 0px;
        height: 4px;
        width: 0%;
        background: #053e59;
        right: 0px;
        -webkit-transition: width 0.4s;
        transition: width 0.4s;
    }
}



@media screen and (max-width: 730px) {
    .desktop-agency {
        display: none;
    }

}
@media screen and (min-width: 731px) {
    .mobile-agency{
        display: none;

    }
}
