.gridBot{ display: grid; grid-template-columns: 1fr 1fr 0.5fr; grid-gap: 15px;}

@media (max-width:768px){
    .gridBot{ grid-template-columns: 1fr 1fr;}
    .bgBot{display: none;}
}

@media (max-width:576px){
    .gridBot{ grid-template-columns: 1fr;}
    .gridBot>*{ border-bottom: 1px dashed var(--clBlackGray); padding-bottom: 15px;}
    .gridBot>*:last-child{ border-bottom: 0; padding-bottom: 0;}
    .bgBot, .bgAdress{ padding: 25px 15px !important;}
}

.gridCareerIndex{ display: grid; grid-template-columns: 1fr 1fr; grid-gap: 5px 15px;}
.gridCareerIndex a{ color: var(--clBlackGray); font-size: var(--fontSubText);}
.gridCareerIndex a:hover{ color: var(--clRed); text-decoration: underline !important;}

.flexAbout{ display: flex; flex-direction: column;}
.flexAbout a{ color: var(--clBlackGray); font-size: var(--fontSubText);}
.flexAbout a:hover{ color: var(--clRed); text-decoration: underline !important;}

.gridAdress{ display: grid; grid-template-columns: 1fr 0.5fr; grid-gap: 15px;}
.flexAdress{ display: flex; font-size: var(--fontSubText); color: var(--clWhite);}
.flexAdress>*{ margin-right: 30px; margin-bottom: 15px;}
.flexAdress>*:last-child{ margin-right: 0;}
.flexAdress img{ max-width: 250px;}

.social{ display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap;}
.social>*{ margin-right: 15px;}
.social>*:last-child{ margin-right: 0;}
.social a{ display: inline-block; width: 35px; height: 35px;}
.social a:hover{ transform: scale(1.5);}
.social a.fb{ background: url(../images/social-01.svg) top center no-repeat; background-size: cover;}
.social a.tw{ background: url(../images/social_10.svg) top center no-repeat; background-size: cover;}
.social a.yt{ background: url(../images/social-03.svg) top center no-repeat; background-size: cover;}
.social a.ig{ background: url(../images/social-04.svg) top center no-repeat; background-size: cover;}
.social a.in{ background: url(../images/social-05.svg) top center no-repeat; background-size: cover;}
.social a.line{ background: url(../images/social-06.svg) top center no-repeat; background-size: cover;}
.social a.tiktok { background: url(../images/social-09.svg) top center no-repeat; background-size: cover;}

.app{ display: flex; align-items: center; justify-content: flex-end;}
.app>*{ margin-right: 15px;}
.app>*:last-child{ margin-right: 0;}
.app img{ max-width: 100px;}

@media (max-width:991px){
    .gridAdress{ grid-template-columns: 1fr;}
    .social, .app{ justify-content: center;}
}

@media (max-width:768px){
    .flexAdress{ flex-direction: column; justify-content: center; align-items: center; text-align: center;}
    .flexAdress>*{ margin-right: 0;}
    .social, .app{ justify-content: center; align-items: center; flex-wrap: wrap;}
}
 /* Modal Line */
 .rounded-box-black {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: background-color 0.3s !important;
    border-radius: var(--Spacing-spacing-2, 8px) !important;
    gap: var(--Spacing-spacing-1, 4px) !important;
    background: #39CD00 !important;
    height: 40px !important;
    box-sizing: border-box !important;
  }
  
  
  a:hover .rounded-box-black {
    background: #2FA200 !important;
    border-radius: var(--Spacing-spacing-2, 8px) !important;
  }
  
  .modal-center-line {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    height: 100% !important;
  }
  
  .modal-background-line {
    width: 383px !important;
    height: 369px !important;
  }
  
  .box1-line {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-around !important;
    align-items: center !important;
  }
  
  .box1-line a {
    width: 237px !important;
    height: 48px !important;
  }
  
  .box1-line p {
    color: #A29292 !important;
  }
  
  .boximageline {
    width: 70px !important;
    height: 70px !important;
    background-color: #00C300 !important;
    border-radius: 10px !important;
  }
  
  .body-line {
    width: 100% !important;
    height: 80% !important;
    display: flex !important;
    flex-direction: column !important;
  }
  
  .custom-modal-header-line {
    display: flex !important;
    flex-direction: column !important;
    height: 30px !important;
    position: relative !important;
    border-top-left-radius: 8px !important;
    border-top-right-radius: 8px !important;
  }
  
  .button-close-line {
    position: absolute !important;
    right: 10px !important;
    top: 50% !important;
  }
  
  .custom-header-box-line {
    flex: 1 !important;
    width: 100% !important;
    border-radius: 7px 7px 0 0 !important;
  }
  
  .box1-line .content {
    display: flex !important;
    justify-content: space-around !important;
    align-items: center !important;
  }
  
  .box1-line .content p {
    font-size: 18px !important;
    margin-left: 10px !important;
    color: #fff !important;
  }
  
  .icon-user-line-modal {
    width: 18px !important;
    height: 20px !important;
  }
  
  .icon-building-line-modal {
    width: 20px !important;
    height: 20px !important;
  }
  /* EndModal Line */