
.subClientSectionHeader {
    background: linear-gradient(180deg, #FFF 20%, var(--JustPhysio-LightBG) 100%);
    height:auto;
    padding: 11vh 0 5vh 0;
    position:relative;
    width:100%;
    /* overflow: hidden; */
    text-align: center;
    min-height: 400px;
}

.clientHeader {

    display:flex;
    align-items: center;
    justify-content: center;
    position:relative;
    flex-direction: column;
    gap:20px;
    text-align: center;

}

.clientHeaderImageHolder {
    
    width:100%;
    background: url('./src/clientPicsAni.svg') center center no-repeat;
    background-size:contain;
    height: 280px;
    margin:10px 0 30px 0;
    position: relative;
    right: 0px;
    filter: drop-shadow(0px 0px 30px #33e0a02b);

}

@media (min-width: 991px) { 
    
    .clientHeaderImageHolder {

        height: 450px;
        margin:0;
        position: absolute;
        top: 0px;
        right: 0px;

    }
    
}
.clientHeaderImageFlex {

    display:flex;
    justify-content: center;
    align-items: center;
    width:100%;

}

.clientHeaderImageContainer {
    
    width:360px;
    height: 280px;
    margin:10px 0 30px 0;
    position: relative;
    right: 0px;
    overflow:hidden;

}

.clientHeaderImageContainer div { 
  
    border-radius:5px; 
    position:absolute;
    transition: all 0.5s;

}

.clientHeaderImageContainer #imgbox2 { background: #c1f1e8;width:180px;height:120px;top:0px;left:140px; }
.clientHeaderImageContainer #imgbox2b { opacity:0; background: url("./src/medi-client-1.png") center center no-repeat; background-size: cover; width:180px;height:120px;top:0px;left:140px;}

.clientHeaderImageContainer #imgbox3 { background: #33e0a0;width:130px;height:100px;top:40px;left:460px; }
.clientHeaderImageContainer #imgbox3b { opacity:0; background: url("./src/jpClientPro5.png") center center no-repeat; background-size: cover; width:130px;height:100px;top:40px;left:460px; }

.clientHeaderImageContainer #imgbox1 { background: #dafcf6;width:100px;height:140px;top:20px;left:20px; }
.clientHeaderImageContainer #imgbox1b { opacity:0; background: url("./src/medi-client-3.png") center center no-repeat; background-size: cover; width:100px;height:140px;top:20px;left:20px;}

.clientHeaderImageContainer #imgbox4 { background: #c4f7e4;width:220px;height:140px;top:140px;left:140px; }
.clientHeaderImageContainer #imgbox4b { opacity:0; background: url("./src/clientPro1.png") center center no-repeat; background-size: cover; width:220px;height:140px;top:140px;left:140px; }

.clientHeaderImageContainer #imgbox5 { background: #c1f1e8;width:120px;height:80px;top:180px;left:0px; }
.clientHeaderImageContainer #imgbox5b { opacity:0; background: url("./src/clientPro2.png") center center no-repeat; background-size: cover; width:120px;height:80px;top:180px;left:0px; }

.clientHeaderImageContainer #imgbox6 { display:none; background-color: white;}
.clientHeaderImageContainer #imgbox6b { display:none; opacity:0; background: url("./src/medi-client-2.png") top center no-repeat; background-size: cover; }

.clientHeaderImageContainer #imgbox7 { display:none; background: #fff; }
.clientHeaderImageContainer #imgbox7b { display:none; opacity:0; background: #fff url("./src/clientPro7.jpg") center center no-repeat; background-size: cover; }

@media (min-width: 991px) {

    .clientHeaderImageContainer {
        width:490px;
        height: 450px;
        margin:0;
        position: absolute;
        top: -20px;
        right: 0px;
    }

    .clientHeaderImageContainer #imgbox2,
    .clientHeaderImageContainer #imgbox2b
     {

        width:200px;
        height:140px;
        top:0px;
        left:180px;
    
    }

    .clientHeaderImageContainer #imgbox3,
    .clientHeaderImageContainer #imgbox3b {
    
        width:90px;
        height:80px;
        top:60px;
        left:400px;
    
    }
    
    .clientHeaderImageContainer #imgbox1,
    .clientHeaderImageContainer #imgbox1b {
    
        width:120px;
        height:220px;
        top:30px;
        left:40px;
    
    }
        
    .clientHeaderImageContainer #imgbox4,
    .clientHeaderImageContainer #imgbox4b {
    
        width:310px;
        height:180px;
        top:160px;
        left:180px;
    
    }
    
    .clientHeaderImageContainer #imgbox5,
    .clientHeaderImageContainer #imgbox5b {
    
        width:160px;
        height:120px;
        top:270px;
        left:0px;
    
    }
    
    .clientHeaderImageContainer #imgbox6,
    .clientHeaderImageContainer #imgbox6b {
    
        display:inline;
        width:140px;
        height:90px;
        top:360px;
        left:180px;
    
    }
    
    .clientHeaderImageContainer #imgbox7,
    .clientHeaderImageContainer #imgbox7b {
    
        width:120px;
        height:140px;
        top:160px;
        left:540px;
    
    }  

}

@media (min-width: 1200px) { 

    .clientHeaderImageContainer {
        width:600px;
        height: 430px;
        margin:0;
        position: absolute;
        top: 0px;
        right: 0px;
    }
    
    .clientHeaderImageContainer #imgbox2,
    .clientHeaderImageContainer #imgbox2b {
    
        width:200px;
        height:140px;
        top:0px;
        left:180px;
    
    }
    
    .clientHeaderImageContainer #imgbox3,
    .clientHeaderImageContainer #imgbox3b {
    
        width:90px;
        height:80px;
        top:60px;
        left:400px;
    
    }
    
    .clientHeaderImageContainer #imgbox1,
    .clientHeaderImageContainer #imgbox1b {
        
        width:120px;
        height:220px;
        top:30px;
        left:40px;
    
    }
        
    .clientHeaderImageContainer #imgbox4,
    .clientHeaderImageContainer #imgbox4b {
    
        width:310px;
        height:180px;
        top:160px;
        left:180px;
    
    }
    
    .clientHeaderImageContainer #imgbox5,
    .clientHeaderImageContainer #imgbox5b {
    
        width:160px;
        height:120px;
        top:270px;
        left:0px;
    
    }
    
    .clientHeaderImageContainer #imgbox6,
    .clientHeaderImageContainer #imgbox6b {
    
        display:inline;
        width:140px;
        height:70px;
        top:360px;
        left:180px;
    
    }
    
    .clientHeaderImageContainer #imgbox7,
    .clientHeaderImageContainer #imgbox7b {
    
        display:inline;
        width:90px;
        height:120px;
        top:160px;
        left:510px;
        
    }  

}

.clientHeader h1 {

    text-align: center;
    color:var(--JustPhysio-DarkBlue);
    padding:0 8vw;
    font-size: 5.2vw;
    font-weight: 800;

}

.clientHeader h2 {

    color:var(--JustPhysio-LightBlue);
    padding:0 10vw;
    font-size: 4.0vw;

}

@media (min-width: 768px) { 

    .clientHeader h2 {

        padding:0 18vw;
        font-size: 3.2vw;
    
    }

}

@media (min-width: 991px) { 

    .subClientSectionHeader {
        height: 72svh;
        min-height: 600px;
        max-height: 680px;
        gap:40px;
        padding: 3vh 0 0 0;
    }

    .subClientSectionHeader h1 {
        
        padding: 30px 0 0 0;
        font-size: 42px;
        line-height: 1.1;
        margin:0;
        font-weight: 700;
        text-align: left;
        
    }

    .subClientSectionHeader h2 {
        
        color:var(--JustPhysio-LightBlue);
        padding:0;
        font-size: 2.2vw;
        line-height: 1.2;
        padding-right: 5vw;
    
    }

    .clientHeader {

        display: flex;
        flex-direction: column;
        gap: 20px;
        text-align: left;
        align-items: flex-start;

    }

}

@media (min-width: 1200px) { 

    .subClientSectionHeader h1 {

        font-size: 48px;

    }

}

@media (min-width: 1400px) { 

    .subClientSectionHeader {
        
        height:80svh;
        gap:40px;
        max-height: 760px;
    
    }

    .subClientSectionHeader h1 {
        
        padding: 40px 0 0 0;
        font-weight: 800;
        letter-spacing: 1px;
        font-size: 52px;
        
    }

    .subClientSectionHeader h2 {
      
        font-size: 2.2vw;
        line-height: 1.2;
    
    } 

}

@media (min-width: 1600px) { 

    .subClientSectionHeader {
        
        padding: 8vh 0 0vh 0;
        height: 88svh;
        max-height: fit-content;
        gap:60px;
        max-height: 800px;
    
    }
    
    .subClientSectionHeader h2 {

        font-size: 40px;
        padding-right: 1vw;
        
    } 

     .clientHeader {

        gap: 30px;

    }

}

/* TESTIMONIAL SLIDER */

.clientHolder {

    width: 100%;
    height: 380px;
    margin:0 0 20px 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    align-content: center; 
    justify-content: center;

}

@media (min-width: 991px) { 

    .clientHolder {
        
        margin:0 0 0 0 ;
        height:440px;
        overflow: visible;
    
    }

}
.fullWidth {

    width:100% !important;
    display: flex !important;

}

.swiperClient {
    
    width: 240px;
    height: 300px;
    
}

@media (min-width: 991px) { 

    .swiperClient {
        
        width: 300px;
        height: 340px;
        
    }

}

.swiperClient .swiper-slide {
    
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 18px;
    font-size: 22px;
    font-weight: bold;
    color: #fff;
    flex-direction: column;
    padding: 20px;
    
}

.swiperClient .swiper-slide p {

    font-size:14px;
    font-weight:500;
    
}

.swiperClient .swiper-slide p:nth-child(2) {

    font-weight:800;
    padding:0;
    margin:0;
    
}

.swiperClient .swiper-slide p:nth-child(1):before {

    content:"\201C";
    padding:0px;
    margin:0;
    width:100%;
    float:left;
    font-size:30px;
    height:35px;
    opacity:0.4;
    
}

.swiperClient .swiper-slide p:nth-child(1):after {

    content:"\201D";
    padding:0px;
    margin:0;
    width:100%;
    float:left;
    font-size:30px;
    height:5px;
    opacity:0.4;
        
}

.swiperClient .swiper-slide:nth-child(odd) {
    background-color:  #e1fff5;
}

.swiperClient .swiper-slide:nth-child(odd) p {
    color:  #387d41;
}

.swiperClient .swiper-slide:nth-child(even) {
    background-color: #f8f0ff;
}

.swiperClient .swiper-slide:nth-child(even) p {
    color:  #191132;
}

.swiperClient .swiper-slide {
    filter: blur(5px);
}

.swiperClient .swiper-slide-visible {
    filter: blur(0px);
}

.swiperClient.swiper-3d .swiper-slide-shadow {
    background: rgb(131 221 230 / 15%);
}

/* Client section 2 */

.clientTwo {
    background: var(--JustPhysio-LightBG);
}

.clientHolder {
    width: 100%;
    height:var(--SubAniCircleOuter);
    margin: 0px 0 30px 0;
    /* overflow: hidden; */
    display: flex;
    flex-direction: column;
    align-items: center;
    align-content: center;
    position: relative;
}

@media (min-width: 576px) { 

    .clientHolder {
        width: var(--SubAniCircleOuter);
        
    }

}

.noOverflow {

    overflow:hidden;

}

.clientTwoCircle {
    
    height: var(--SubAniCircleInner);
    width: var(--SubAniCircleInner);
    position: relative;
    border-radius: var(--SubAniCircleInner);
    background: var(--JustPhysio-DarkBlue);
    background: url('./src/otSquad.png') top center repeat;
    background-size:cover;
    -webkit-animation: slide 120s linear infinite;
    transform: rotate(-10deg);

}

@media (min-width: 991px) { 

    .clientHolder {
        margin: 0 0 0px 0;
        height:var(--DeskSubAniCircleOuter);
        width:var(--DeskSubAniCircleOuter);
    }

}

.numberOne {
    display:none;
    height:130px;
    width:100px;
    background: url('./src/numberOne.svg') top center repeat;
    background-size:cover;
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 1;
    filter: drop-shadow(0px 0px 8px #ff560620);
    -webkit-animation: fadeInHp 0.5s ease-in-out forwards;
    animation: fadeInHp 0.5s ease-in-out forwards;

}

.enable .numberOne {

    display:inline;
    -webkit-animation: fadeInHp 0.5s ease-in-out forwards;
    animation: fadeInHp 0.5s ease-in-out forwards;

}

@media (min-width: 991px) { 

    .numberOne {
      
        top: 45px;
        right: 45px;
    
    }

}

/* Client section 3 */

.clientThree {
    background: #fff;
}

.clientThreeCircle {
    
    height: var(--SubAniCircleInner);
    width: var(--SubAniCircleInner);
    border-radius: 340px;
    background: var(--JustPhysio-DarkBlue);

}

/* Client section 4 */

.clientFour {
    background: var(--JustPhysio-LightBG);
}


.clientFourAni object { 
    
    display:none; 

}

.clientFourAni { 
    
    overflow: hidden; 
    height:var(--SubAniCircleOuter);
    width: var(--SubAniCircleOuter);

}

.enable .clientFourAni object {

    display:inline;
    height:var(--SubAniCircleOuter);
    width: var(--SubAniCircleOuter);
    object-fit: contain;
    filter: drop-shadow(0px 0px 8px #33e0a070);
    
}

@media (min-width: 991px) { 

    .clientFourAni {

        height:var(--DeskSubAniCircleOuter);
        width:var(--DeskSubAniCircleOuter);
       
    }

    .enable .clientFourAni object { 
        
        height:var(--DeskSubAniCircleOuter);
        width:var(--DeskSubAniCircleOuter);
    
    }

}

/* Client section 5 */

.clientFive {
    background: #fff;
    
}

.clientFiveAni {

    height:var(--SubAniCircleOuter);
    display: flex;
    width: 100%;
    z-index: 1;
    overflow: hidden;
    justify-content: center;

}

.sectionRotateRadar {
    
    background: url('./src/clientAttractingBG.svg') center center no-repeat;
    background-size: contain;
    animation: fadeInHp 0.5s ease-in-out forwards, spin 60s linear infinite;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 0;
    top:0;
    overflow: hidden;

}

.clientFiveAni object { 
    
    display:none;

}

.enable .clientFiveAni object { 

    position: relative; 
    display: block;
    top:0;
    height:var(--SubAniCircleOuter);
    width: var(--SubAniCircleOuter);
    object-fit: contain;
    z-index: 1;

}

@media (min-width: 991px) { 

    .clientFiveAni {

        height:var(--DeskSubAniCircleOuter);
        width:var(--DeskSubAniCircleOuter);
       
    }

    .enable .clientFiveAni object { 
        
        height:var(--DeskSubAniCircleOuter);
        width:var(--DeskSubAniCircleOuter);
    
    }

}

/* SUBMIT VACANCY FORM */

.generalDivider {
    
    padding:30px 0 0 0;
    margin:20px 0 0 0;
    color:#97a3dd;
    width:100%;
    
}

.generalFormPara {

    padding:0 0 30px 0 !important;
    margin:0 !important; 

}

#submitVacancy,
#submitVacancy2,
#submitVacancy3 {

    background: #671616;
    border: none;
    padding:45px 50px 40px 50px;
    font-size:14px;
    text-align:left;
    color: #bc4e4e;
    border-radius:20px;


}

#submitVacancy h4,
#submitVacancy2 h4,
#submitVacancy3 h4  {

    width: 100%;
    font-weight: 700;
    font-size: 20px;
    color: #005fd8;
    padding: 0 0 25px 0;

}

#submitVacancy h5,
#submitVacancy2 h5,
#submitVacancy3 h5  {

    width: 100%;
    font-weight: 700;
    font-size: 14px;
    letter-spacing:2px;
    color: #009666;
    padding: 0 0 25px 0;
    text-transform:uppercase;

}

#submitVacancy p,
#submitVacancy2 p,
#submitVacancy3 p {width:100%;font-size:16px;color: #ffe8e6;padding: 10px 0;}

#submitVacancy input,
#submitVacancy2 input,
#submitVacancy3 input {
    display:inline-flex;
    font-size: 16px;
    padding: 0.5rem 0.9rem 0.5rem 0.9rem !important;
    height: 40px;
}

#submitVacancy select,
#submitVacancy2 select,
#submitVacancy3 select {
    display:inline-flex;
    font-size: 16px;
    padding: 0.5rem 0.9rem 0.5rem 0.9rem !important;
    height: 40px;
}

#submitVacancy textarea,
#submitVacancy2 textarea,
#submitVacancy3 textarea {

    display:inline-flex;
    font-size: 16px;
    padding: 0.5rem 0.9rem 0.5rem 0.9rem !important;

}

#submitVacancy .form-check-input,
#submitVacancy2 .form-check-input, 
#submitVacancy3 .form-check-input {
    
    font-size: 16px;
    padding: 0.3rem 0 0.7rem 0 !important;
    margin:0 10px 0 0 0 !important;
    height: 24px;
    width:24px;

}

.form-check-label  {

    margin: 2px 0 0 10px !important;
    
}

#submitVacancy label,
#submitVacancy2 label,
#submitVacancy3 label {

    display:inline-flex;
    font-size:16px;
    flex-direction: column;

}

#submitVacancy .form-check {
    
    padding: 0 20px;

}

#submitVacancy .btn,
#submitVacancy2 .btn,
#submitVacancy3 .btn {
    
    width:100%;
    padding:16px;
    margin:20px 0px 10px 0px;
    border-radius:8px;
    font-size: 16px;
    font-weight:700;
    
}

#submitVacancy .col-lg-6,
#submitVacancy2 .col-lg-6,
#submitVacancy3 .col-lg-6  {

    padding: 0 0 15px 0;
    
}

.formTPG {
    padding: 5px;
}

.formDivider {
    
    width:100%;
    height: 30px;
    float: left;
    margin: 0px 0 30px 0 !important;
    border-bottom: 1px #cc4c4c45 dotted;

}

.form-control.dateIcon.is-invalid, .was-validated .form-control.dateIcon:invalid,
.form-control.dateIcon.is-valid, .was-validated .form-control.dateIcon:valid {

    background-position: right calc(2em + 0.1875rem) center;
}

.form-lg-xp {
    
    padding: 0 0 20px 0px !important;
    
}

#submitVacancy .tickOne li {

    color:#203C60;
    
}

@media (min-width: 991px) { 

    .formTPG {
        padding:0px;
    }
    
    #submitVacancy,
    #submitVacancy2,
    #submitVacancy3  {background: #671616;border: none;padding:45px 50px 40px 50px;font-size:14px;text-align:left;color: #ffe0e0;border-radius:20px;}

    
    .form-lg-rp {

        padding: 0 20px 20px 0 !important;
        
    }
    
    .form-lg-lp {
    
        padding: 0 0 20px 20px !important;
        
    }

    #submitVacancy .form-check,
    #submitVacancy2 .form-check,
    #submitVacancy3 .form-check {
    
        padding: 0 25px;
    
    }

    #submitVacancy p,
    #submitVacancy2 p,
    #submitVacancy3 p {
    
        padding: 5px 0 25px 0;
    
    }

    .doublePadd  {
    
        padding-top:20px;
    
    }
    
    #submitVacancy label,
    #submitVacancy2 label,
    #submitVacancy3 label {
        display:inline-flex;
        font-size:16px;
        flex-direction: row;
        gap: 5px;
    }
    
    .widerGdpr #submitVacancy label {
        
        display:inline-flex !important;
        flex-direction: column;
        gap:10px;
        
    }
    
    .widerGdpr .col-12 {
        
        padding:0 0 15px 0;
        
    }


}

#submitVacancy .largerForm,
#submitVacancy2 .largerForm,
#submitVacancy3 .largerForm {

    font-size: 16px !important;
    height: auto !important;
    
}

@media (max-width: 380px) {

    #submitVacancy .largerForm {

        font-size: 12px !important;
        height: auto !important;
        
    }

}

/* STEVE ANI */

.movingImageSteve {
    
    position:absolute;
    bottom: 0px;
    left:0;
    z-index:5;
    width: var(--SubAniCircleInner);
    height: var(--SubAniCircleInner);
    background: url("./src/steve-image.png") bottom right no-repeat;
    background-size: auto 90%;

}

@media (min-width: 991px) { 

    .movingImageSteve {
        
        width: var(--DeskSubAniCircleInner);
        height: var(--DeskSubAniCircleInner);

    }

}

.spinCircleText {

    position:absolute;
    top: 40px;
    right: 20px;
    z-index: 5;
    width: 120px;
    height: 120px;
    background:  url("./src/medical-recruitment-since-1995.svg") top center no-repeat;
    background-size:cover;
    filter: drop-shadow(0px 0px 8px #33e0a070);
    
}

.steveTitle {

    position:absolute;
    bottom: 40px;
    left: 20px;
    z-index: 5;
    filter: drop-shadow(0px 0px 8px #3378e059);
    background:#0347ae;
    padding:20px;
    border-radius:5px;
    color:#fff;
    font-weight:700;
    font-size:16px;
    
}

.steveTitle span {

    display:block;
    font-size:12px;

}

.aniTitle {

    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);

}

#DOBDay,
#DOBMonth,
#DOBYear {

    width:31%;
    margin:0 3px 0 0;
    
}

.fullWidth {

    width:100%;
}

.form-bottom {

    padding:0 0 20px 0;

}

.btn.disabled, .btn:disabled, fieldset:disabled .btn {
    color: #ffffff !important;

}