section
{
  overflow: hidden;
}
.contact-title-section
{
    margin-top:72px;

    background-image: linear-gradient(to right, #c9c8c8 1px, transparent 1px),
     linear-gradient(to bottom, #c9c8c8 1px, transparent 1px);
     background-size: 60px 20px;

}

.breadcrumb-contact-page
{

  background-color: #fff;
  box-shadow: 0px 0px 4px 4px rgba(0,0,0,0.2);

  padding: 12px 24px;

  margin-top: 24px;
  margin-bottom: 80px;

  

}

.breadcrumb-menu-item
{
  color: #2217bf;
  font-size: 16px;
  font-weight: bold;
  cursor:pointer;

  display: inline-block;

  text-overflow: ellipsis;
}

.breadcrumb-menu-item::hover
{
  color:#0C0840;
}


.breadcrumb-menu-item::after
{
  content: '';
  vertical-align: middle;
  display: inline-block;
  width: 24px;
  height: 24px;

  background-image:url('../images/icons/chevron-forward-grey.svg') ;

  background-size: 24px 24px;

  background-repeat: no-repeat;

  margin-left: 24px;
  margin-right: 24px;
}

.breadcrumb-menu-item.active::after
{
  display: none;
}

.breadcrumb-menu-item.active

{
  color: #7e7e7e;


}


.contact-page-section
{
    padding-top: 24px;
    padding-bottom: 120px;
    background-color: #fff;

     background-image: linear-gradient(to right, #c9c8c8 1px, transparent 1px),
     linear-gradient(to bottom, #c9c8c8 1px, transparent 1px);
     background-size: 40px 40px;

     
    
}

.contact-page-title
{
  font-weight: 300;

  font-size: 48px;

}



.contact-section-grid
{
    width: 100%;
  display: grid;

  grid-template-columns: repeat(12,minmax(12px,1fr));

  gap:24px;

}

.contact-section-sub-grid
{
  display: grid;

  grid-template-columns: repeat(12,minmax(0px,1fr));

  gap:24px;

  height: 100%;


}

.contact-information-section-row
{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.contact-information-section-column-1
{

    width: calc(100% - 144px);

}
.contact-information-section-column-2
{


}

.contact-information-section-column-2 img
{
   width: 120px;
   height: auto;
}

.contact-section-grid-column-1
{
  grid-column: span 6;
  background-color: transparent;


  
}

.contact-section-grid-column-2
{
  grid-column: span 6;
 
   padding: 24px;
  
      background-color: #3723D2;
    box-shadow: -8px -8px 8px 0px rgba(0,0,0,0.25);


}
.contact-section-sub-grid-col-1
{
  grid-column: span 12;

  background-color: #b6da16;
    padding: 24px;
  height: 100%;

    box-shadow: -8px -8px 8px 0px rgba(0,0,0,0.25);


    
}

.contact-section-sub-grid-col-2
{
  grid-column: span 12;

    background-color: #0C0840;
    padding: 24px;

  height: 100%;

    box-shadow: -8px -8px 8px 0px rgba(0,0,0,0.2);



}

.contact-page-cta-image-wrapper
{
    text-align: center;
}

.contact-page-cta-image-wrapper img
{
    width: 240px;
    height: auto;
}

.contact-page-cta-image-title
{
    text-align: center;
}
.contact-page-cta-information-part
{
    padding: 24px;
    margin-left: auto;
    margin-right: auto;
}
.booking-btn-contact-page-wrapper
{
  text-align: center;

  display: flex;
  justify-content: center;
  



}
.booking-btn-contact-page
{
  position: relative;
    min-width: 240px;
    overflow: hidden;

    display: flex;
    justify-content: space-around;

    gap:12px;
    align-items: center;

    padding: 16px 16px;
    border-radius: 6px;
    
    font-size: 20px;
    line-height: 24px;

    font-weight: bold;

    cursor: pointer;

}






.booking-btn-contact-page img
{
  width:24px;
  height: 24px;
}


.booking-btn-contact-page 
{

  background-color: none;

  position: relative;
  z-index: 1;

}

.booking-btn-contact-page::after
{
    content: '';
    z-index: -2;
    background-color: #000;

    top:0px;
    left: 0px;
    position: absolute;
    width: 100%;
    height: 100%;

         pointer-events: none;

    transition: transform cubic-bezier(0.175, 0.885, 0.32, 1) 1s ;
    transform: translate(0%, 0%);
    transition-delay: 0s;

  
}

.booking-btn-contact-page::before
{
    content: '';
    z-index: -1;
    background-color:blue;
    border-top: 2px solid #fff;
    top:0px;
    left: 0px;
    position: absolute;
    width: 100%;
    height: 100%;
    transform: translate(-101%, 0);


    transition: transform cubic-bezier(0.175, 0.885, 0.32, 1) 1s ;

    pointer-events: none;
        
    transition-delay: 0s;

    
}

.booking-btn-contact-page:hover::before

{

    transform: translate(0%, 0%);



}

.booking-btn-contact-page:hover::after

{

    transform: translate(-101%, 0%);



}

@media (max-width:1260px)  { 





}
@media (max-width: 1080px) {
    
}

@media (max-width:720px)  { 


  .contact-information-section-column-1
{

    width: 100%;

}
.contact-information-section-column-2
{

    width: 100%;
    margin-top: 24px;
   
}

  .contact-section-grid
  {
    gap:0px;
  
  }
.contact-section-grid-column-1
{
  grid-column: span 12;
  background-color: transparent;

  
}

.contact-section-sub-grid
{
   gap:0px;
}

.contact-page-cta-information-part-notes
{
  font-style: italic;
}

.contact-section-grid-column-2
{
  grid-column: span 12;
 
   padding: 24px;
  
      background-color: #2217bf;

      margin-top: 24px;


}


}