@font-face {
    font-family: HelveticaNeueBold;
    src: url(/content/dam/intelligentcontent/unbranded/connect360psp/ca/fonts/HelveticaNeueBold.ttf);
}
@font-face {
    font-family: HelveticaNeueLight;
    src: url(/content/dam/intelligentcontent/unbranded/connect360psp/ca/fonts/HelveticaNeueLight.ttf);
}  
@font-face {
    font-family: HelveticaNeue;
    src: url(/content/dam/intelligentcontent/unbranded/connect360psp/ca/fonts/HelveticaNeue.ttf);
} 
body{font-family: HelveticaNeue, Open Sans;font-size: 20px;line-height: 24px;color: #07306C;letter-spacing: -0.2px;}
a, div, ul, p{font-family: HelveticaNeue, Open Sans;} 
h1, h2, h3, h4, h5, b,strong{font-family: HelveticaNeueBold, Open Sans;}

#parent-container {max-width: 1366px;margin: auto;}
.mobile-visible{display: none;}

/****** Header block ******/
#parent-container .cmp-container__backgroundImage--enabled {background-size: contain;margin: 0;background-repeat: no-repeat;}
.header-wrap {display: flex;align-items: end;gap: 40px;padding: 165px 20px 30px;}
.header-wrap h1 {margin: 10px auto 0;font-size: 60px;line-height: 65px;font-family: HelveticaNeueBold, Open Sans;} 
.header-wrap .img-block {width: 401px;} 
.header-wrap .data-block {width: calc(100% - 401px);} 
#header-sec {position: relative;} 
#header-sec .language {font-size: 16px;font-weight: 600;color: #000;}
#header-sec .language-wrap {position: absolute;width: 85px;right: 0;}
#header-sec .language + .language {padding-left: 10px;margin-left: 10px;border-left: 2px solid #000;}

/*** Header content ***/
.header-content-wrap {padding: 30px 50px 10px;}
.header-content-wrap p {margin-bottom: 15px;}
.header-content-wrap ul {margin-bottom: 15px !important;} 
.header-content-wrap ul li {padding-left: 20px;position: relative;margin-bottom: 5px;} 
.header-content-wrap ul li:before {content: '';height: 6px;width: 6px;background: #F9A745;position: absolute;border-radius: 100%;left: 2px;top: 10px;}

/****** Light Blue block ******/
div#light-blue-block .cmp-text {padding: 0px;}
.light-blue-box-wrap {background: rgb(7 48 108 / 10%);display: flex;gap: 40px;align-items: center;padding: 65px 20px 65px 50px;}
.light-blue-box-wrap .content-block {width: calc(100% - 400px);}
.light-blue-box-wrap .img-wrap {width: 350px;position: relative;}
.light-blue-box-wrap .img-wrap img {position: absolute;}
.light-blue-box-wrap .img-wrap .img-male {top: -165px;left: 0;}
.light-blue-box-wrap .img-wrap .img-female {top: -10px;right: 0;}

/****** Calling block ******/
.calling-wrapper {padding: 30px 50px;} 
#parent-container .azcl-container:nth-child(3) .cmp-container__backgroundImage--enabled{background-position: 100% 100%;} 
.calling-wrapper .calling-text span {display: block;}
.calling-wrapper .calling-text + .calling-text{margin: 25px 0 15px;}
.flex-box {display: flex;align-items: center;gap: 30px;margin-bottom: 15px;} 
.calling-wrapper h2.calling-title {font-size: 40px;line-height: 46px;margin-bottom: 25px;}
.calling-wrapper .img-wrap {width: 100px;}
.calling-wrapper .content-wrap {width: calc(100% - 100px);}
.calling-wrapper .flex-box + .calling-text {margin-top: 20px;}

/*** Yellow border box ***/
.yellow-border-box {background: #fff;padding: 15px 20px 15px 55px;margin: 60px auto 136px;max-width: 790px;border: 3px solid #F9A745;}
.yellow-border-box .yellow-border-title {margin: 0 auto 15px;font-size: 40px;line-height: 46px;}
.yellow-border-box ul {margin-top: 5px !important;} 
.yellow-border-box ul li {padding-left: 20px;position: relative;margin-bottom: 3px;} 
.yellow-border-box ul li:before {content: '';height: 6px;width: 6px;background: #F9A745;position: absolute;border-radius: 100%;left: 2px;top: 10px;}
.yellow-border-box ul li a {color: #07306C;text-decoration: underline;}

/****** Footer ******/
#footer {text-align: center;color: #707070;font-size: 14px;padding-bottom: 30px;}
#footer .footer-menu ul {display: flex;justify-content: space-between;max-width: 480px;margin: 55px  auto 30px;line-height: 15px;}
#footer .footer-menu ul li + li {border-left: 1px solid;padding-left: 15px;}
#footer img {margin: 15px auto 5px;max-width: 240px;}
#footer a {color: #707070;}


/****** French ******/
html[lang="fr"] .header-wrap h1 {font-size: 50px;line-height: 60px;}
html[lang="fr"] .calling-wrapper h2.calling-title, html[lang="fr"] .yellow-border-box .yellow-border-title{font-size: 34px;line-height: 38px;}
html[lang="fr"] .calling-wrapper .flex-box + .calling-text{max-width: 71vw;}
html[lang="fr"] .calling-wrapper .calling-text span {display: initial;}  
html[lang="fr"] #footer .footer-menu ul {max-width: 700px;line-height: 18px;}
html[lang="fr"] #footer .footer-menu ul li + li { margin-left: 15px;} 



/****** Responsive ******/
@media(min-width: 1368px){
    #parent-container {max-width: 100%; } 
    body {font-size: 1.5vw;line-height: 2.2vw;}
    /****** Header block ******/ 
    .header-wrap {gap: 4vw;padding: 13vw 2vw 5vw;}
    .header-wrap h1 {margin: 1vw auto 0;font-size: 4.4vw;line-height: 5vw;} 
    .header-wrap .img-block {width: 30vw;} 
    .header-wrap .img-block img{max-width: initial;width: 100%;}
    .header-wrap .data-block {width: calc(100% - 30vw);} 
    .header-wrap .data-block img{max-width: initial;width: 35vw;}
    /*** Header content ***/
    .header-content-wrap {padding: 2vw 2vw 1vw 4vw;}
    .header-content-wrap p {margin-bottom: 1vw;}
    .header-content-wrap ul {margin-bottom: 1vw !important;} 
    .header-content-wrap ul li {padding-left: 2vw;margin-bottom: .6vw;} 
    .header-content-wrap ul li:before {content: '';height: .6vw;width: .6vw;left: .2vw;top: .7vw;}
    
    /****** Light Blue block ******/ 
    .light-blue-box-wrap {gap: 2vw;padding: 4vw 2.0vw 4vw 4vw;}
    .light-blue-box-wrap .content-block {width: calc(100% - 31vw);}
    .light-blue-box-wrap .img-wrap {width: 28.2vw;} 
    .light-blue-box-wrap .img-wrap .img-male {top: -12.1vw;width: 19vw;}
    .light-blue-box-wrap .img-wrap .img-female {top: -2vw;width: 16vw;}
    
    /****** Calling block ******/
    .calling-wrapper {padding: 3vw 4vw;} 
    #parent-container .azcl-container:nth-child(3) .cmp-container__backgroundImage--enabled{background-position: 100% 100%;}  
    .calling-wrapper .calling-text + .calling-text{margin: 2.2vw 0 1.2vw;}
    .flex-box {gap: 2.6vw;margin-bottom: 1.3vw;} 
    .calling-wrapper h2.calling-title {font-size: 3.6vw;line-height: 4.1vw;margin-bottom: 2.0vw;}
    .calling-wrapper .img-wrap {width: 9vw;}
    .calling-wrapper .img-wrap img{width: 100%;}
    .calling-wrapper .content-wrap {width: calc(100% - 12vw);}
    
    /*** Yellow border box ***/
    .yellow-border-box {padding: 1.2vw 1.0vw 1.2vw 2.8vw;margin: 5.3vw auto 9.3vw;max-width: 58vw;}
    .yellow-border-box .yellow-border-title {margin: 0 auto 1.2vw;font-size: 3.6vw;line-height: 4.2vw;}
    .yellow-border-box ul {margin-top: .4vw !important;} 
    .yellow-border-box ul li {padding-left: 1.8vw;margin-bottom: .2vw;} 
    .yellow-border-box ul li:before {content: '';height: .4vw;width: .4vw;left: .1vw;top: .9vw;} 
    
    /****** Footer ******/
    #footer {font-size: 1.2vw;padding-bottom: 2.6vw;}
    #footer .footer-menu ul {max-width: 41vw;margin: 4.5vw  auto 2.6vw;line-height: 1.2vw;}
    #footer .footer-menu ul li + li {border-left: .15vw solid;padding-left: 1.3vw;}
    #footer img {margin: 1.2vw auto .4vw;max-width: 21vw;width: 100%;} 
    
    /****** French ******/
    html[lang="fr"] .header-wrap h1 {font-size: 3.5vw;line-height: 4vw;}
    html[lang="fr"] .calling-wrapper h2.calling-title, html[lang="fr"] .yellow-border-box .yellow-border-title { font-size: 2.9vw;line-height: 3.2vw;}
    html[lang="fr"] .calling-wrapper .flex-box + .calling-text{max-width: 73vw;}
    html[lang="fr"] .calling-wrapper .calling-text span {display: initial;} 
    html[lang="fr"] #footer .footer-menu ul {max-width: 60vw;line-height: 1.3vw;} 
    html[lang="fr"] #footer .footer-menu ul li + li { margin-left: 1.3vw;} 
}  


/****** iPad and small laptops ******/
@media (max-width: 1199px) and (min-width: 768px){
    .header-wrap { padding: 100px 20px 30px;}
    .header-wrap .img-block {width: 301px;}
    .header-wrap .data-block {width: calc(100% - 301px);}
    .header-wrap h1, .calling-wrapper h2.calling-title { font-size: 36px;line-height: 40px; }
    .header-wrap img {max-width: 300px;}
    .yellow-border-box {margin: 60px auto 60px;}
    
    html[lang="fr"] .header-wrap h1  { font-size: 36px;line-height: 40px; }
    html[lang="fr"] .calling-wrapper h2.calling-title, html[lang="fr"] .yellow-border-box .yellow-border-title{ 
        font-size: 32px;line-height: 38px; }
}


/****** All small devices ******/
@media (max-width: 767px){
    body {font-size: 18px;line-height: 22px;}
    .mobile-visible{display: block;}
    #parent-container .cmp-container__backgroundImage--enabled {background-size: 140vw;  background-position: -16vw -2vw;}
    .header-wrap {flex-direction: column;padding: 20px 10px 0px;align-items: end;gap: 20px;}
    .header-wrap .img-block {width: 100%;display: flex;align-items: end;gap: 15px;}
    .header-wrap .img-block img {max-width: calc(45% - 10px);}
    .header-wrap .img-block img.mobile-visible {max-width: calc(50vw - 10px);margin-bottom: 8vw;}
    .header-wrap .data-block img {display: none;}
    .header-wrap .data-block, .light-blue-box-wrap .content-block, .light-blue-box-wrap .img-wrap{width: 100%;}
    .header-wrap h1 {font-size: 32px;line-height: 36px;}
    .header-content-wrap {padding: 20px 10px 10px;}
    .header-content-wrap p + p {margin-top: 30px;} 
    .light-blue-box-wrap .img-wrap {width: 195px;height: 210px;position: absolute;top: 135px;}
    .light-blue-box-wrap {padding: 15px 15px 100px 10px;flex-direction: column;gap: 0;margin-bottom: 100px;}
    .light-blue-box-wrap .content-block {width: 100%;}
    .light-blue-box-wrap .img-wrap img {position: static;}
    .light-blue-box-wrap .img-wrap .img-male {max-width: 143px;/* margin: 0 0 -63px calc(45% - 28vw); */}
    .light-blue-box-wrap .img-wrap .img-female {max-width: 111px;margin: -60px auto 0 calc(50% - 10px);}
    .flex-box {gap: 20px;}   
    .calling-wrapper {padding: 0px 10px 30px;}    
    .calling-wrapper h2.calling-title {font-size: 32px;line-height: 38px;margin-bottom: 15px;} 
    .yellow-border-box {padding: 5px 5px 5px;border: 3px solid #F9A745;margin: 40px auto 15px;}
    .yellow-border-box .yellow-border-title {font-size: 32px;line-height: 36px;}  
    .yellow-border-box ul li {padding-left: 10px;}
    .yellow-border-box ul li:before {height: 4px;width: 4px;}
    .yellow-border-box ul li a {color: #07306C;text-decoration: none !important;}
    .yellow-border-box ul li span + a {display: block;white-space: initial;word-break: break-all;}
    #parent-container .azcl-container:nth-child(3) .cmp-container__backgroundImage--enabled {background-position: 90% 100%;
    background-size: 120vw;}
    #footer {padding: 14px 10px 30px;font-size: 16px;}
    #footer .footer-menu ul {flex-wrap: wrap;justify-content: center;gap: 15px 0px;margin: 45px auto 30px;max-width: 310px;}
    #footer .footer-menu ul li {padding: 0 10px;}
    #footer .footer-menu ul li:nth-child(3) {border: 0px;}
    #footer .copyright-text {max-width: 310px;margin: auto;}
    #footer img {max-width: 270px;}
    
    html[lang="fr"] .header-wrap h1 {font-size: 32px;line-height: 36px;}
    html[lang="fr"] .light-blue-box-wrap {padding: 15px 15px 120px 10px;}
    html[lang="fr"] .light-blue-box-wrap .img-wrap { top: 155px;}
    html[lang="fr"] .calling-wrapper h2.calling-title, html[lang="fr"] .yellow-border-box .yellow-border-title {font-size: 32px;line-height: 38px;}
    html[lang="fr"] #footer .footer-menu ul li + li{padding: 0px; margin: 0px;border:0px;}
    
}