.table-paging {
    text-align: center;
}

.pagination {
    display: inline-block;
    padding-left: 0;
    margin: 20px 0;
    border-radius: 4px;
}

.pagination > li {
    display: inline;
}

.pagination > li:last-child > a, .pagination > li:last-child > span {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.pagination > li:first-child > a, .pagination > li:first-child > span {
    margin-left: 0;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

    .pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover {
        z-index: 3;
        color: #fff;
        cursor: default;
        background-color: var(--mainColor);
    }

.pagination > li > a, .pagination > li > span {
    position: relative;
    display:flex;
    align-items: center;
    justify-content: center;
    float: left;
    color: #FFF;
    height: 42.64px;
    border-radius: 4px;
    padding: 0 15px;
    text-decoration: none;
    transition: 0.3s;
    font-weight:500;
    font-size: 18px;
    background-color: rgba(0, 162, 181, 0.3);        
    border: 1px solid #E8E9EC;
}


/* Login Page */
.login-page {
    display: flex;
    align-items: center;
    justify-content: center;
}

.login-page .login-background {
    width: 797.08px;
    height: 100%;
    object-fit: cover;
}

.login-page .login-content {
    width: 822px;
    padding: 0 96px;
}

.login-page .login-content .logo-login {
    margin-bottom: 32px;
}

.login-page .login-content h5 {
    font-family: 'Poppins SemiBold';
    font-size: 32px;
    font-weight: 600;
    line-height: 40px;
    color: #231F20;
    margin-bottom: 8px;
}

.login-page .login-content p {
    margin-bottom: 0px;
}

.login-page .login-content .form-login {
    border-top: 1px solid #BFBFBF;
    margin-top: 32px;
    padding-top: 32px;
    display: flex;
    align-items: start;
    justify-content: start;
    gap: 24px;
    flex-direction: column;
    width: 100%;
}

.btn-submit {
    height: 60px;
    padding: 10px 64px;
    color: #FFFFFF;
    border-radius: 88px;
}

.login-page .login-content .form-login .form-set {
    width: 100%;
}

.login-page .login-content .form-login .form-set label {
    font-family: 'Poppins Regular';
    font-size: 18px;
    font-weight: 400;
    line-height: 40px;
    color: #8C8C8C;
}

.login-page .login-content .form-login .form-set input {
    font-family: 'Poppins Regular';
    font-size: 18px;
    font-weight: 400;
    line-height: 40px;
    color: #000000;
    padding: 0px 24px;
}

.login-page .login-content .form-login .form-set input:focus-visible {
    border: 1px solid #BFBFBF;
    box-shadow: none;
}

.login-page .login-content .form-login .form-set input::placeholder {
    color: #8C8C8C;
}

.login-page .login-content .form-login .form-set .input-email {
    border: 1px solid #BFBFBF;
    height: 80px;
    background: #ffffff;
    border-radius: 9px;
}

.login-page .login-content .form-login .form-set .fx-password-login {
    border: 1px solid #BFBFBF;
    height: 80px;
    background: #ffffff;
    border-radius: 9px;
    padding: 0 24px;
}

.login-page .login-content .form-login .form-set .fx-password-login img {
    cursor: pointer;
}

.login-page .login-content .form-login .form-set .fx-password-login input {
    background: none;
    border: none;
    height: 100%;
    padding: 0px;
}

.login-page .login-content .form-login .fx-remeber {
    width: 100%;
}

.login-page .login-content .form-login .fx-remeber-checkbox {
    gap: 16px;
    cursor: pointer;
}

.login-page .login-content .form-login .fx-remeber-checkbox input {
    width: 30px;
    height: 30px;
    border-radius: 6px;
    border-color: #BFBFBF;
    cursor: pointer
}

.login-page .login-content .form-login .fx-remeber-checkbox label,
.login-page .login-content .form-login .fx-remeber a {
    font-family: 'Poppins Regular';
    font-size: 20px;
    font-weight: 400;
    line-height: 40px;
    cursor: pointer;
    text-decoration: none;
}

.login-page .login-content .form-login .fx-remeber a {
    color: var(--mainColor);
}

.login-page .login-content .form-login .fx-remeber-checkbox label {
    color: #000000;
}

.login-page .login-content .form-login .btn-submit {
    width: 100%;
    font-size: 24px;
}


/* Scroll */
::-webkit-scrollbar {
    width: 10px;
    background: #f0f0f0;
}

::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 5px;
}

::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 5px;
}

@media (min-width: 1000px) {
    .apply-modal .modal-dialog {
        max-width: 1151px;
    }
}
@media (min-width:1700px) {
    .text-nav{font-size: 20px;}
    
    .nav-width{width: 100%;}

    .menu-links  .text-nav{font-size: 20px;}

    .banner__slider  .slide .slide__content--headings .title{font-size: 60px ; }
    .banner__slider .slide .slide__content--headings .top-title{font-size: 32px;}

    .sty-text{font-size: 24px !important;}
    footer .fx-footer .links-footer a{font-size: 20px;}
    .section-product-detail .product-detail-images{
        margin-top: -120px;
    }
    .card-ourTeam .sty-Subtext {
        font-size: 16px;
        line-height: 32px;
    }
    .card-ourTeam .sty-text{font-size:24px ;}
    .section-product-detail .product-detail-description .fx-product-detail-texts p{font-size: 26px;}
    .message-content img{width: 648.03px;}
    .section-page-about h3{font-size: 48px;}
    .section-page-about p{font-size: 24px;line-height: 40px;}
    .section-contact .fx-contact-one{
    width: 752.76px;
    }
    .section-FAQ .fx-faq .fx-faq-box p,
    .section-FAQ .fx-faq .fx-faq-box .fx-faq-box-title h5{font-size: 24px;}
    .login-page .login-content{
        width: 922px;
    }
    .login-page .login-background{
        width: 850.08px;
    }
}
@media (min-width:1710px) {            
    .login-page .login-background{
        width: 1007.08px;
    }
}
@media (max-width:1400px){
  .section-categories,
  .section-about,
  .section-latest-news,
  footer .fx-footer,
  .section-categories-products,
  .section-product-detail,
  .section-ourTeam,
  .about-content,.message-content,
  .section-page-about .mission-content .mission-content-texts,
   .section-careers,
   .section-content,
   .section-contact,
   .section-FAQ{
    width: 100%;
    padding: 0 36px;
  }
  .section-product-detail .product-detail-images .product-detail-main{
   width: 436.91px;
    height: 336.77px;
  }
  .section-product-detail .product-detail-images .fx-product-detail-images img {
    width: 150.69px;
    height: 100px;
  }
  .login-page .login-content{
    padding: 80px;
  }
  .login-page .login-background {
    width: 700.08px;
    height: 140vh;
}
    main .cards-categories .card-categorie h6{font-size: 17px;}
    main .cards-categories .card-categorie .card-categorie-content img{
        width: 50px ;
        height: 50px;
    }
    main .cards-categories .card-categorie .card-categorie-content{min-height: 80px;}
    .card-categorie-hover .text-categories-toggle p{line-height: normal;}
    .cards-categories .card-categorie .card-categorie-content{padding: 8px 16px;}
    .section-latest-news .card-latest-news img{height: 300px;}
    .card-career .fx-title-careers h4{font-size: 22px;}
    .card-career .fx-sections-careers p{font-size: 20px;}
    .card-career .fx-sections-careers h6{font-size: 16px;}
    .card-career .fx-title-careers button{padding: 0 22px; font-size: 18px;}
    .card-career .fx-title-careers button {
        height: 40px;
    }

    .card-career .attachments-div-files .attachments-file{padding: 10px 16px;}
    .card-career .attachments-div-files .attachments-file span{font-size: 18px;}
}
@media (max-width:1300px){
  
    .login-page .login-content{
        padding: 80px;
    }

    .login-page .login-background {
        width: 600.08px;
        height: 155vh;
    }    
  }
@media (max-width:1150px) {
  .banner__slider{
    top: -110px;
  }
  .flex-head img{width: 200px;}
  .main-top{padding-top: 100px;}
  .fx-title-page{margin-bottom: 32px; align-items: start;}
    .message-content{
    flex-direction: column;
    gap: 32px;
  }
  .message-content img{
    order: 1;
    width: 100%;
  }
  .message-content .message-content-texts{
    order: 2;
  }
    .login-page .login-background{display: none;}
          .login-page .login-content{
                width: 100%;
                padding: 32px;
            }
}
@media (max-width:1000px) {
    .jq-toast-single {
        width: 350px !important;
    }
  .login-page .login-content{
    width: 100%;
    padding: 24px;
    }
    .login-page .login-content .logo-login{width: 100%;}
    .login-page .login-content .form-login .form-set .input-email,
    .login-page .login-content .form-login .form-set .fx-password-login{
      height: 60px;
    }
    .login-page .login-content .form-login .form-set .fx-password-login,
    .login-page .login-content .form-login .form-set input{padding: 0 16px;}
    .login-page .login-content .form-login .form-set input{font-size: 15px;}
    .login-page .login-content .form-login .fx-remeber-checkbox label, .login-page .login-content .form-login .fx-remeber a{font-size: 14px;}
    .login-page .login-content .form-login .fx-remeber-checkbox input{
      width: 20px;
      height: 20px;
    }
    .login-page .login-content .form-login .fx-remeber-checkbox{gap: 8px;}
    .login-page .login-content .form-login .btn-submit{font-size: 20px;}
    .section-contact .fx-contact-one .fx-mobile .dropdown-numberCountry{
      font-size: 14px;
      height: 50px;
    }
}
