@font-face {
font-family: 'ProximaNova-Light';
src: url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/ProximaNova-Light.eot);
src: url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/ProximaNova-Light.eot?#iefix) format('embedded-opentype'),
url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/ProximaNova-Light.woff2) format('woff2'),
url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/ProximaNova-Light.woff) format('woff'),
url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/ProximaNova-Light.ttf) format('truetype'),
url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/ProximaNova-Light.svg#ProximaNova-Light) format('svg');
font-weight: 300;
font-style: normal;
font-display: swap;
ascent-override: 90%;
descent-override: 22%;
line-gap-override: 0%;
size-adjust: 102%;
}
@font-face {
font-family: 'ProximaNova-Regular';
src: url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/ProximaNova-Regular.eot);
src: url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/ProximaNova-Regular.eot?#iefix) format('embedded-opentype'),
url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/ProximaNova-Regular.woff2) format('woff2'),
url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/ProximaNova-Regular.woff) format('woff'),
url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/ProximaNova-Regular.ttf) format('truetype'),
url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/ProximaNova-Regular.svg#ProximaNova-Regular) format('svg');
font-weight: normal;
font-style: normal;
font-display: swap;
ascent-override: 90%;
descent-override: 22%;
line-gap-override: 0%;
size-adjust: 102%;
}
@font-face {
font-family: 'ProximaNova-Semibold';
src: url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/ProximaNova-Semibold.eot);
src: url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/ProximaNova-Semibold.eot?#iefix) format('embedded-opentype'),
url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/ProximaNova-Semibold.woff2) format('woff2'),
url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/ProximaNova-Semibold.woff) format('woff'),
url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/ProximaNova-Semibold.ttf) format('truetype'),
url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/ProximaNova-Semibold.svg#ProximaNova-Semibold) format('svg');
font-weight: 600;
font-style: normal;
font-display: swap;
ascent-override: 90%;
descent-override: 22%;
line-gap-override: 0%;
size-adjust: 102%;
}
@font-face {
font-family: 'ProximaNova-Bold';
src: url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/ProximaNova-Bold.eot);
src: url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/ProximaNova-Bold.eot?#iefix) format('embedded-opentype'),
url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/ProximaNova-Bold.woff2) format('woff2'),
url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/ProximaNova-Bold.woff) format('woff'),
url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/ProximaNova-Bold.ttf) format('truetype'),
url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/ProximaNova-Bold.svg#ProximaNova-Bold) format('svg');
font-weight: bold;
font-style: normal;
font-display: swap;
ascent-override: 90%;
descent-override: 22%;
line-gap-override: 0%;
size-adjust: 102%;
}
@font-face {
font-family: 'Gotham';
src: url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/GothamBold.eot);
src: local('Gotham Bold'), local('GothamBold'),
url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/GothamBold.eot?#iefix) format('embedded-opentype'),
url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/GothamBold.woff2) format('woff2'),
url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/GothamBold.woff) format('woff'),
url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/GothamBold.ttf) format('truetype'),
url(//zoombooks.ca/wp-content/themes/zoombooks/assets/fonts/GothamBold.svg#GothamBold) format('svg');
font-weight: bold;
font-style: normal;
font-display: swap;
ascent-override: 90%;
descent-override: 22%;
line-gap-override: 0%;
size-adjust: 102%;
} html {
overflow-x: hidden
}
body {
color: #1f1f1e;
font-size: 17px;
font-weight: 400;
line-height: 1.325;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
overflow-x: hidden;
font-family: 'ProximaNova-Regular';
}
* {
border: none;
margin: 0;
outline: none !important;
padding: 0;
vertical-align: baseline;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box
}
:after,
:before {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box
}
label {
display: block;
font-size: 16px;
margin: 0 0 15px;
font-weight: 400
}
label.inline-block {
display: inline-block;
margin: 5px 40px 5px 0
}
label.inline-block:last-child {
margin-right: 0
}
ol,
ul {
list-style: none
}
a {
color: #1f1f1e;
text-decoration: underline
}
a:focus,
a:hover {
color: #1f1f1e;
text-decoration: none
}
strong,
b {
font-weight: 600
}
img {
display: block;
height: auto;
max-width: 100%;
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
user-select: none
}
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
font-family: 'Gotham';
font-weight: 700;
color: #1f1f1e;
line-height: 1.2;
margin: 25px 0 15px;
max-width: 100%;
}
h1,
.h1,
h2,
.h2 {
font-size: 36px;
}
h3,
.h3 {
font-size: 30px;
}
h4,
.h4 {
font-size: 24px;
}
h5,
.h5 {
font-size: 22px
}
h6,
.h6 {
font-size: 20px
}
h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child,
h6:first-child,
.h1:first-child,
.h2:first-child,
.h3:first-child,
.h4:first-child,
.h5:first-child,
.h6:first-child {
margin-top: 0
}
.aligncenter {
display: block;
margin: 5px auto;
}
.alignright {
float: right;
margin: 5px 0 20px 50px;
}
.alignleft {
float: left;
margin: 5px 50px 20px 0;
}
.alignleft.shadow-none,
.alignright.shadow-none,
.aligncenter.shadow-none {
box-shadow: none
}
p.pn {
padding: 0;
margin: 0
}
.clearfix {
display: table;
width: 100%;
padding: 15px 0;
margin: 0
}
.clearfix+h2,
.clearfix+h3,
.clearfix+h4 {
margin-top: 0
}
p {
margin: 0 0 18px
}
p+ol,
p+ul {
margin-top: -5px
}
ul {
margin: 0 0 18px
}
ul li {
position: relative;
padding: 0 0 8px 31px;
overflow: hidden;
}
ul li:before {
content: "\e09f";
display: inline-block;
line-height: 1;
font-family: "Font Awesome 6 Pro";
font-weight: 900;
position: absolute;
left: 5px;
top: 4px;
}
ul.check-list li:before,
.check-list ul li:before {
content: "\f00c";
font-family: "Font Awesome 6 Pro";
font-weight: 900;
width: auto;
height: auto;
background: none;
color: #0d8b8e;
left: 2px;
top: 6px;
font-size: 88%
}
ul.reject-icon li:before {
content: "\f00d";
font-family: "Font Awesome 6 Pro";
font-weight: 900;
width: auto;
height: auto;
background: none;
color: #bb1b1b;
left: 2px;
top: 6px;
font-size: 88%
}
ol {
padding-left: 26px;
margin: 0 0 18px;
text-align: left;
overflow: hidden
}
ol li {
list-style: decimal;
padding-bottom: 7px;
padding-left: 0
}
ol li ul>li {
padding-left: 20px;
list-style: none
}
ol li ul>li:before {
display: block;
left: 1px
}
ul ol li {
overflow: visible
}
ul ol li:before {
display: none;
overflow: visible
}
ol ol li {
list-style: lower-alpha
}
ol ol ol li {
list-style: lower-roman
}
ol ol,
ol ul,
ul ol,
ul ul {
margin-top: 12px;
margin-bottom: 5px
}
ol li:last-child,
ul li:last-child {
padding-bottom: 0
}
.text-center ul {
text-align: left;
display: table;
margin-left: auto;
margin-right: auto
}
.list-none li {
padding-left: 0
}
.list-none li:before {
display: none
}
h1:last-child,
h2:last-child,
h3:last-child,
h4:last-child,
h5:last-child,
h6:last-child,
ol ul:last-child,
ol:last-child,
p:last-child,
ul:last-child {
margin-bottom: 0
}
.text-center {
text-align: center
}
.text-left {
text-align: left
}
.text-right {
text-align: right
}
.table-responsive {
border: none;
margin: 20px 0;
overflow: auto
}
table {
width: 100%;
border-spacing: 0;
border-collapse: collapse !important
}
table tr td,
table tr th {
padding: 9px 15px;
vertical-align: top;
text-align: left;
line-height: 18px;
border: 1px solid #dddddd
}
table tr th {
font-weight: 600
}
td[align=center],
th[align=center] {
text-align: center !important
}
td[align=right],
th[align=right] {
text-align: right !important
}
.table-responsive::-webkit-scrollbar {
width: 5px;
height: 4px
}
.table-responsive::-webkit-scrollbar-track {
background: #f5f5f5;
border-radius: 8px
}
.table-responsive::-webkit-scrollbar-thumb {
background: #cccccc;
border-radius: 8px
}
.table-responsive::-webkit-scrollbar-thumb:hover {
background: #cccccc
}
.flex {
display: -webkit-box;
display: -moz-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex
}
.flex-middle {
display: -webkit-box;
display: -moz-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
align-items: center
}
.flex-wrap {
display: -webkit-box;
display: -moz-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
flex-wrap: wrap
}
.flex-wrap-middle {
display: -webkit-box;
display: -moz-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
flex-wrap: wrap;
align-items: center
}
a[href*="mailto:"],
a[href*="tel:"] {
display: inline-block;
word-break: break-word
}
.container {
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
max-width: 1260px
}
.container-fluid {
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto
}
.row {
margin-right: -15px;
margin-left: -15px
}
.row:after,
.row:before {
content: "";
clear: both;
display: table
}
.col-md-1,
.col-md-10,
.col-md-11,
.col-md-12,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-sm-1,
.col-sm-10,
.col-sm-11,
.col-sm-12,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-xs-1,
.col-xs-10,
.col-xs-11,
.col-xs-12,
.col-xs-2,
.col-xs-3,
.col-xs-4,
.col-xs-5,
.col-xs-6,
.col-xs-7,
.col-xs-8,
.col-xs-9 {
position: relative;
min-height: 1px;
padding-right: 15px;
padding-left: 15px
}
.col-xs-1,
.col-xs-10,
.col-xs-11,
.col-xs-12,
.col-xs-2,
.col-xs-3,
.col-xs-4,
.col-xs-5,
.col-xs-6,
.col-xs-7,
.col-xs-8,
.col-xs-9 {
float: left
}
.col-xs-12 {
width: 100%
}
.col-xs-11 {
width: 91.66666667%
}
.col-xs-10 {
width: 83.33%
}
.col-xs-9 {
width: 75%
}
.col-xs-8 {
width: 66.66666667%
}
.col-xs-7 {
width: 58.33%
}
.col-xs-6 {
width: 50%
}
.col-xs-5 {
width: 41.66666667%
}
.col-xs-4 {
width: 33.33%
}
.col-xs-3 {
width: 25%
}
.col-xs-2 {
width: 16.66666667%
}
.col-xs-1 {
width: 8.33%
}
@media (min-width:768px) {
.col-sm-1,
.col-sm-10,
.col-sm-11,
.col-sm-12,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9 {
float: left
}
.col-sm-12 {
width: 100%
}
.col-sm-11 {
width: 91.66666667%
}
.col-sm-10 {
width: 83.33%
}
.col-sm-9 {
width: 75%
}
.col-sm-8 {
width: 66.66666667%
}
.col-sm-7 {
width: 58.33%
}
.col-sm-6 {
width: 50%
}
.col-sm-5 {
width: 41.66666667%
}
.col-sm-4 {
width: 33.33%
}
.col-sm-3 {
width: 25%
}
.col-sm-2 {
width: 16.66666667%
}
.col-sm-1 {
width: 8.33%
}
}
@media (min-width:992px) {
.mx-520 {
max-width: 520px
}
.mx-460 {
max-width: 470px
}
.mx-420 {
max-width: 435px
}
.col-md-1,
.col-md-10,
.col-md-11,
.col-md-12,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9 {
float: left
}
.col-md-12 {
width: 100%
}
.col-md-11 {
width: 91.66666667%
}
.col-md-10 {
width: 83.33%
}
.col-md-9 {
width: 75%
}
.col-md-8 {
width: 66.66666667%
}
.col-md-7 {
width: 58.33%
}
.col-md-6 {
width: 50%
}
.col-md-5 {
width: 41.66666667%
}
.col-md-4 {
width: 33.33%
}
.col-md-3 {
width: 25%
}
.col-md-2 {
width: 16.66666667%
}
.col-md-1 {
width: 8.33%
}
}
@media (min-width:1200px) {
h1,
.h1,
h2,
.h2 {
font-size: 55px;
}
h3,
.h3 {
font-size: 35px;
}
h4,
.h4 {
font-size: 26px;
}
}
.wpcf7-spinner {
position: absolute !important;
margin: 0 2px !important;
}
.wpcf7-not-valid-tip {
margin-top: 8px;
font-size: 15px
}
.form-control,
input[type=date],
input[type=email],
input[type=file],
input[type=number],
input[type=password],
input[type=search],
input[type=tel],
input[type=text],
input[type=url],
select,
textarea {
background-color: #f8f6f2;
border: none;
border: 1px solid #f8f6f2;
border-radius: 50px;
color: #1f1f1e;
display: block;
font-size: 17px;
font-weight: 400;
line-height: 20px;
padding: 15px 25px;
position: relative;
width: 100%;
height: 52px;
margin: 0;
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
-moz-transition: all .3s linear 0s;
-webkit-transition: all .3s linear 0s;
-ms-transition: all .3s linear 0s;
-o-transition: all .3s linear 0s;
transition: all .3s linear 0s;
font-family: 'ProximaNova-Regular';
}
.form-control:focus,
input[type=date]:focus,
input[type=email]:focus,
input[type=number]:focus,
input[type=password]:focus,
input[type=search]:focus,
input[type=tel]:focus,
input[type=text]:focus,
input[type=url]:focus,
select:focus,
textarea:focus {
border-color: #1f1f1e
}
textarea,
textarea.form-control {
height: 170px;
resize: none;
border-radius: 20px;
}
.white-field .form-control,
.white-field input[type=date],
.white-field input[type=email],
.white-field input[type=file],
.white-field input[type=number],
.white-field input[type=password],
.white-field input[type=search],
.white-field input[type=tel],
.white-field input[type=text],
.white-field input[type=url],
.white-field select,
.white-field textarea {
background-color: #ffffff;
border-color: #ffffff
}
.white-field .form-control:focus,
.white-field input[type=date]:focus,
.white-field input[type=email]:focus,
.white-field input[type=number]:focus,
.white-field input[type=password]:focus,
.white-field input[type=search]:focus,
.white-field input[type=tel]:focus,
.white-field input[type=text]:focus,
.white-field input[type=url]:focus,
.white-field select:focus,
.white-field textarea:focus {
border-color: #1f1f1e
}
.white-field .selectric {
background-color: #ffffff;
border-color: #ffffff
}
select {
-moz-appearance: menulist-button;
-webkit-appearance: menulist-button;
appearance: menulist-button
}
input[type=checkbox],
input[type=radio] {
display: inline-block;
margin-right: 5px;
vertical-align: baseline
}
::-webkit-input-placeholder {
color: #1f1f1e;
opacity: 1
}
::-moz-placeholder {
color: #1f1f1e;
opacity: 1
}
:-ms-input-placeholder {
color: #1f1f1e;
opacity: 1
}
:-moz-placeholder {
color: #1f1f1e;
opacity: 1
}
.field-white .form-control,
.field-white input[type=date],
.field-white input[type=email],
.field-white input[type=file],
.field-white input[type=number],
.field-white input[type=password],
.field-white input[type=search],
.field-white input[type=tel],
.field-white input[type=text],
.field-white input[type=url],
.field-white select,
.field-white textarea {
color: #ffffff;
border-color: #ffffff
}
.field-white .form-control:focus,
.field-white input[type=date]:focus,
.field-white input[type=email]:focus,
.field-white input[type=number]:focus,
.field-white input[type=password]:focus,
.field-white input[type=search]:focus,
.field-white input[type=tel]:focus,
.field-white input[type=text]:focus,
.field-white input[type=url]:focus,
.field-white select:focus,
.field-white textarea:focus,
.field-white .selectric {
border-color: #ffffff
}
.field-white .selectric-focus .selectric,
.field-white .selectric-hover .selectric,
.field-white .selectric-open .selectric {
border-color: #ffffff
}
.field-white .selectric .label,
.field-white .selectric .button:after {
color: #ffffff
}
.field-white ::-webkit-input-placeholder {
color: #ffffff;
}
.field-white ::-moz-placeholder {
color: #ffffff;
}
.field-white :-ms-input-placeholder {
color: #ffffff;
}
.field-white :-moz-placeholder {
color: #ffffff;
}
.field-white .icon-field i {
color: #ffffff
}
.field-white .csRadioElem,
.field-white .csCheckboxElem {
border-color: #ffffff
}
.field-white label {
color: #ffffff
}
button::-moz-focus-inner,
input::-moz-focus-inner {
padding: 0;
border: 0
}
input[type=button],
input[type=reset],
input[type=submit] {
-moz-appearance: none;
-webkit-appearance: none;
appearance: none
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none
}
input[type=number] {
-moz-appearance: textfield !important;
appearance: textfield !important
}
.selectric-wrapper {
position: relative;
cursor: pointer;
padding: 0 !important
}
.selectric-responsive {
width: 100%
}
.selectric-open {
z-index: 99
}
.selectric-open .selectric-items {
display: block
}
.selectric-disabled {
filter: alpha(opacity=50);
opacity: .5;
cursor: default;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none
}
.selectric-hide-select {
position: relative;
overflow: hidden;
width: 0;
height: 0
}
.selectric-hide-select select {
position: absolute;
left: -100%;
height: 0;
width: 0
}
.selectric-hide-select.selectric-is-native {
position: absolute;
width: 100%;
height: 100%;
z-index: 10
}
.selectric-hide-select.selectric-is-native select {
position: absolute;
top: 0;
left: 0;
right: 0;
height: 100%;
width: 100%;
border: none;
z-index: 1;
box-sizing: border-box;
opacity: 0
}
.selectric-input {
position: absolute;
top: 0;
left: 0;
overflow: hidden;
clip: rect(0, 0, 0, 0);
margin: 0;
padding: 0;
width: 1px;
height: 1px;
outline: 0;
border: none;
background: 0 0
}
.selectric-temp-show {
position: absolute;
visibility: hidden;
display: block
}
.selectric {
border: none;
border: 1px solid #f8f6f2;
background-color: #f8f6f2;
position: relative;
border-radius: 50px;
}
.selectric .label {
display: block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
margin: 0 40px 0 25px;
font-size: 17px;
font-weight: 400;
line-height: 50px;
color: #1f1f1e;
height: 50px;
padding: 0;
text-align: left
}
.selectric .button {
display: block;
position: absolute;
right: 0;
top: 0;
bottom: 0;
margin: auto;
width: 35px;
height: 30px;
color: #1f1f1e;
font-size: 0;
text-align: center
}
.selectric .button:after {
content: "\f107";
display: block;
font-size: 16px;
font-family: "Font Awesome 6 Pro";
font-weight: 400;
position: relative;
line-height: 29px;
text-align: left;
color: #1f1f1e
}
.selectric-items {
display: none;
position: absolute;
top: 100%;
left: 0;
border: 1px solid #f5f5f5;
z-index: -1;
margin: 0;
border-radius: 10px;
overflow: hidden;
background: #ffffff
}
.selectric-items .selectric-scroll {
height: 100%;
overflow: auto;
width: 100%;
}
.selectric-above .selectric-items {
top: auto;
bottom: 100%
}
.selectric-items ul {
display: block;
padding: 0;
background: #ffffff;
margin: 0
}
.selectric-items li {
font-size: 16px;
min-height: 20px;
margin-bottom: 1px;
display: block;
padding: 6px 15px;
color: #1f1f1e;
line-height: normal;
font-weight: 400;
white-space: nowrap;
}
.selectric-items li:last-child {
margin-bottom: 0;
padding-bottom: 6px
}
.selectric-items li:after,
.selectric-items li:before {
display: none
}
.selectric-focus .selectric,
.selectric-hover .selectric,
.selectric-open .selectric {
border-color: #1f1f1e
}
.selectric-items li.highlighted,
.selectric-items li.selected,
.selectric-items li:hover {
background-color: #1f1f1e;
color: #fff
}
.selectric-items .disabled {
filter: alpha(opacity=50);
opacity: .5;
cursor: default;
background: 0;
color: #666;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none
}
.selectric-items .selectric-group .selectric-group-label {
font-weight: 400;
padding-left: 10px;
cursor: default;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background: 0 0;
color: #1f1f1e
}
.selectric-items .selectric-group.disabled li {
filter: alpha(opacity=100);
opacity: 1
}
.selectric-items .selectric-group li.selectric-group-label {
padding-left: 12px
}
.selectric-items .selectric-group li {
padding-left: 25px
} .csHiddenFile {
width: 1px;
height: 0;
visibility: hidden;
display: none;
}
.csOpaque {
opacity: 0;
filter: alpha(opacity=0);
}
.csFileInput {
display: none !important;
} .csRadio input[type=radio],
.csCheckbox input[type=checkbox] {
position: absolute;
color: #ffffff;
width: 22px;
height: 22px;
cursor: pointer;
left: 0;
top: 0;
bottom: 0;
right: 0;
z-index: 2;
margin: 0;
border-radius: 4px;
}
.csRadio,
.csCheckbox {
display: inline-block;
position: relative;
margin: -2px 5px 0 0;
vertical-align: middle;
height: 22px;
width: 22px;
}
.radio .csRadio,
.checkbox .csCheckbox {
margin-left: -14px
}
.csRadioElem,
.csCheckboxElem {
display: inline-block;
background: #ffffff;
height: 22px;
width: 22px;
cursor: pointer;
position: absolute;
top: 0;
left: 0;
border: 1px solid #d2d2d2;
box-shadow: 0 0 3px rgba(0, 0, 0, .1);
border-radius: 4px
}
.csRadioElem {
border-radius: 22px;
}
.csCheckedR,
.csChecked {
border-color: #d2d2d2;
background: #ffffff;
}
.csCheckedR:after {
content: "";
background: #5bbdb4;
padding: 6px;
border-radius: 8px;
width: 8px;
line-height: 8px;
position: absolute;
left: 50%;
top: 50%;
-moz-transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%)
}
.csChecked:after {
content: "\f00c";
font-size: 16px;
font-family: "Font Awesome 6 Pro";
font-weight: 900;
color: #5bbdb4;
position: absolute;
left: 50%;
top: 50%;
-moz-transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%)
}
.form-fields {
text-align: left;
margin-top: -25px
}
.form-fields .row,
.row.form-fields {
margin-left: -15px;
margin-right: -15px
}
.form-fields .row .row,
.row.form-fields .row {
margin-left: -10px;
margin-right: -10px;
margin-top: -20px
}
.form-fields [class*=col-] {
padding-right: 15px;
padding-left: 15px;
padding-top: 28px
}
.form-fields [class*=col-] [class*=col-] {
padding-left: 10px;
padding-right: 10px
}
.form-fields p {
padding: 10px 0 0 0;
margin: 0
}
.form-fields [class*=col-] p {
position: relative;
padding: 0;
margin: 0
}
.icon-field i {
position: absolute;
font-size: 20px;
left: 25px;
color: #000000;
top: 16px;
z-index: 2;
width: 20px;
text-align: center;
font-weight: 900;
}
.icon-field {
position: relative;
-moz-transform: none;
-ms-transform: none;
-o-transform: none;
-webkit-transform: none;
transform: none
}
.icon-field i+input,
.icon-field i+textarea,
.icon-field i+select,
.icon-field i+* input,
.icon-field i+* textarea,
.icon-field i+* select {
padding-left: 58px !important
}
.icon-field i+.selectric-wrapper .selectric .label {
margin-left: 25px
}
.btn,
:after,
:before,
a,
input[type=button],
input[type=reset],
input[type=submit] {
-moz-transition: all .3s linear 0s;
-webkit-transition: all .3s linear 0s;
-ms-transition: all .3s linear 0s;
-o-transition: all .3s linear 0s;
transition: all .3s linear 0s
}
footer,
header,
section {
float: left;
width: 100%;
position: relative
}
.btn:before {
content: '';
left: 0;
top: 0;
bottom: 0;
background-color: #74c042;
position: absolute;
width: 100%;
z-index: -1;
overflow: hidden;
-webkit-transform: scaleX(0);
-ms-transform: scaleX(0);
transform: scaleX(0);
-webkit-transform-origin: right center;
-ms-transform-origin: right center;
transform-origin: right center;
-webkit-transition: -webkit-transform .4s cubic-bezier(.645, .045, .355, 1);
transition: transform .4s cubic-bezier(.645, .045, .355, 1);
}
.btn:focus:before,
.btn:hover:before {
-webkit-transform: none;
-ms-transform: none;
transform: none;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
width: 100%
}
.btn {
display: inline-block;
font-family: 'ProximaNova-Semibold';
font-weight: 400;
position: relative;
font-size: 16px;
border: 2px solid #1f1f1e;
border-radius: 50px;
color: #ffffff;
font-style: normal;
line-height: 22px;
padding: 10px 22px;
text-decoration: none;
white-space: normal;
-webkit-transform: perspective(1px) translateZ(0);
transform: perspective(1px) translateZ(0);
overflow: hidden;
background: #1f1f1e;
cursor: pointer;
text-align: center;
text-transform: none;
min-width: 148px;
}
.btn.min-none {
min-width: inherit !important;
}
.btn.arrow::after {
content: "\e09f";
font-family: "Font Awesome 6 Pro";
font-weight: 900;
margin-left: 8px;
line-height: 1
}
.btn.arrow-2::after {
content: "\f061";
font-family: "Font Awesome 6 Pro";
font-weight: 900;
margin-left: 8px;
line-height: 1
}
.secondary-btn:before {
background-color: #ffffff
}
.secondary-btn {
color: #ffffff;
border-color: #ffffff;
background: none
}
.third-btn:before {
background-color: #1f1f1e
}
.third-btn {
color: #1f1f1e;
border-color: #1f1f1e;
background: none
}
.btn.focus,
.btn:focus,
.btn:hover {
color: #ffffff;
border-color: #74c042;
background: #74c042
}
.secondary-btn:focus,
.secondary-btn:hover {
color: #1f1f1e;
border-color: #ffffff;
background-color: #ffffff
}
.third-btn:focus,
.third-btn:hover {
color: #ffffff;
border-color: #1f1f1e;
background-color: #1f1f1e
}
.btn-action .btn {
margin: 10px 20px 0 0
}
.btn-action .btn:last-child {
margin-right: 0
}
.xs-btn {
padding: 3px 22px !important;
}
.md-btn {
padding: 7px 22px !important;
}
.btn i {
margin: 0 5px 0 0
}  header+* {
margin-top: 133.52px !important;
}
header {
position: fixed;
background-color: #ffffff;
left: 0;
right: 0;
z-index: 999;
-moz-transition: all .2s linear 0s;
-webkit-transition: all .2s linear 0s;
-ms-transition: all .2s linear 0s;
-o-transition: all .2s linear 0s;
transition: all .2s linear 0s;
border-bottom: 1px solid #dddddd
}
.header-row {
position: relative;
display: -webkit-box;
display: -moz-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
justify-content: space-between;
align-items: center;
clear: both;
width: 100%;
padding: 15px 0;
}
.head-top-area {
background: #0d8b8e;
font-family: 'ProximaNova-Semibold';
color: #ffffff;
text-align: center;
padding: 10px 0;
}
.head-top-area a {
color: #d3ff92
}
header .logo {
position: relative;
display: block;
background-color: #1f1f1e
}
header .logo a {
display: block;
margin: 0;
position: relative;
text-decoration: none;
white-space: nowrap
}
header .header-left {
min-width: 262px;
width: 262px;
}
header .header-right {
width: 100%;
}
.head-fix header {
background-color: #ffffff;
box-shadow: 0 0 5px rgba(0, 0, 0, .2)
}
.nav-trigger,
.nav-wrap nav ul li:before,
.submenu-button {
display: none
}
.nav-wrap {
position: relative;
float: right;
margin: 0;
z-index: 99;
display: flex;
align-items: center;
flex-direction: row-reverse;
font-family: 'ProximaNova-Semibold';
}
.nav-wrap nav {
float: left;
margin: 0;
padding: 0;
border: 0;
list-style: none;
display: block;
position: relative
}
.nav-wrap nav ul.nav {
float: right;
display: flex;
width: 100%;
margin: 0
}
.nav-wrap nav ul.nav>li {
float: left;
margin: 0 35px 0 0;
padding: 0;
overflow: visible;
position: relative
}
.nav-wrap nav ul.nav>li:last-child {
margin-right: 0;
}
.nav-wrap nav ul.nav>li>a {
position: relative;
display: block;
padding: 9px 0;
margin: 0;
font-size: 16px;
font-weight: 600;
line-height: 18px;
color: #1f1f1e;
white-space: nowrap;
text-decoration: none;
text-transform: capitalize;
}
.nav-wrap nav ul.nav>li.home-icon>a {
font-size: 0;
line-height: 26px;
}
.nav-wrap nav ul.nav>li.home-icon>a::after {
content: "\f015";
display: inline-block;
font-size: 16px;
line-height: 18px;
font-family: "Font Awesome 6 Pro";
font-weight: 900;
width: auto;
position: relative;
top: 3px
}
.nav>li>a:focus,
.nav>li>a:hover {
background-color: transparent
}
.nav-wrap nav ul.nav>li>a:before {
content: '';
background: #1f1f1e;
left: 0;
padding: 2px 0 0;
bottom: 0;
position: absolute;
width: 100%;
z-index: -1;
overflow: hidden;
-webkit-transform: scaleX(0);
-ms-transform: scaleX(0);
transform: scaleX(0);
-webkit-transform-origin: right center;
-ms-transform-origin: right center;
transform-origin: right center;
-webkit-transition: -webkit-transform .2s cubic-bezier(.645, .045, .355, 1);
transition: transform .2s cubic-bezier(.645, .045, .355, 1)
}
.nav-wrap nav ul.nav li.current-menu-ancestor>a:before,
.nav-wrap nav ul.nav li.current-menu-item>a:before,
.nav-wrap nav ul.nav li:hover>a:before,
.nav-wrap nav ul.nav li>a:hover:before {
-webkit-transform: none;
-ms-transform: none;
transform: none;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
width: 100%
}
.nav-wrap nav ul.nav li.has-sub li.has-sub>a {
padding-right: 30px !important
}
.nav-wrap nav ul.nav li.has-sub>a:after {
content: "\f0d7";
display: inline-block;
font-size: 14px;
line-height: 18px;
font-family: "Font Awesome 6 Pro";
font-weight: 900;
margin-left: 2px;
width: 10px;
position: relative;
top: 1px
}
.nav-wrap nav ul.nav li.has-sub li.has-sub>a:after {
position: absolute;
right: 5px;
top: 7px;
-moz-transform: rotate(-90deg);
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg);
margin: 0
}
.nav-wrap nav ul.nav ul li.has-sub li.has-sub:hover>a:after {
content: "\f104";
color: #9a9a9a
}
.nav-wrap nav ul.nav ul {
position: absolute;
border-radius: 0;
padding: 10px 0;
margin: 0;
visibility: hidden;
text-align: left;
left: 0;
right: auto;
opacity: 0;
top: 100%;
background: #ffffff;
box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
}
.nav-wrap nav ul.nav ul:after {
content: "";
position: absolute;
left: 20px;
bottom: 100%;
width: 0;
height: 0;
border-left: 7px solid transparent;
border-right: 7px solid transparent;
border-bottom: 7px solid #1f1f1e
}
.nav-wrap nav ul.nav ul ul:after {
display: none
}
.nav-wrap nav ul.nav ul ul {
padding: 0;
top: 0;
left: 100%;
-moz-transform: none;
-webkit-transform: none;
transform: none
}
.nav-wrap nav ul.nav ul li {
float: left;
width: 100%;
min-width: 150px;
padding: 1px 0;
margin: 0;
vertical-align: top;
overflow: visible
}
.nav-wrap nav ul.nav ul li a {
display: block;
white-space: nowrap;
font-size: 15px;
font-weight: 400;
line-height: normal;
color: #1f1f1e;
padding: 7px 24px;
text-decoration: none;
text-transform: capitalize
}
.nav-wrap nav ul.nav ul li.green-text a {
color: #9be430
}
.nav-wrap nav ul.nav li:hover>ul {
display: block;
visibility: visible;
opacity: 1;
-webkit-transition: opacity .3s ease-in;
-moz-transition: opacity .3s ease-in;
-o-transition: opacity .3s ease-in;
transition: opacity .3s ease-in
}
.nav-wrap nav ul.nav li.current-menu-ancestor>a,
.nav-wrap nav ul.nav li.current-menu-item>a,
.nav-wrap nav ul.nav li:hover>a,
.nav-wrap nav ul.nav li>a:hover {
color: #1f1f1e
}
.nav-wrap nav ul.nav ul li.current-menu-ancestor>a,
.nav-wrap nav ul.nav ul li.current-menu-item>a,
.nav-wrap nav ul.nav ul li:hover>a,
.nav-wrap nav ul.nav ul li>a:hover {
color: #ffffff;
background: #1f1f1e
}
sup {
position: relative;
top: -0.4em
}  [class*="-wrapper"] {
padding: 60px 0
}
.common-wrapper {
padding: 60px 0;
}
.m-0 {
margin: 0 !important
}
.m-1 {
margin: 10px 0 !important
}
.m-2 {
margin: 20px 0 !important
}
.m-3 {
margin: 30px 0 !important
}
.m-4 {
margin: 40px 0 !important
}
.m-5 {
margin: 50px 0 !important
}
.m-6 {
margin: 60px 0 !important
}
.m-7 {
margin: 70px 0 !important
}
.p-0 {
padding: 0 !important
}
.p-1 {
padding: 10px 0 !important
}
.p-2 {
padding: 20px 0 !important
}
.p-3 {
padding: 30px 0 !important
}
.p-4 {
padding: 40px 0 !important
}
.p-5 {
padding: 50px 0 !important
}
.p-6 {
padding: 60px 0 !important
}
.p-7 {
padding: 70px 0 !important
}
.m-t0 {
margin-top: 0 !important
}
.m-t1 {
margin-top: 10px !important
}
.m-t2 {
margin-top: 20px !important
}
.m-t3 {
margin-top: 30px !important
}
.m-t4 {
margin-top: 40px !important
}
.m-t5 {
margin-top: 50px !important
}
.m-t6 {
margin-top: 60px !important
}
.m-t7 {
margin-top: 70px !important
}
.m-b0 {
margin-bottom: 0 !important
}
.m-b1 {
margin-bottom: 10px !important
}
.m-b2 {
margin-bottom: 20px !important
}
.m-b3 {
margin-bottom: 30px !important
}
.m-b4 {
margin-bottom: 40px !important
}
.m-b5 {
margin-bottom: 50px !important
}
.m-b6 {
margin-bottom: 60px !important
}
.m-b7 {
margin-bottom: 70px !important
}
.p-t0 {
padding-top: 0 !important
}
.p-t2 {
padding-top: 20px !important
}
.p-t3 {
padding-top: 30px !important
}
.p-t4 {
padding-top: 40px !important
}
.p-t5 {
padding-top: 50px !important
}
.p-t6 {
padding-top: 60px !important
}
.p-t7 {
padding-top: 70px !important
}
.p-b0 {
padding-bottom: 0 !important
}
.p-b2 {
padding-bottom: 20px !important
}
.p-b3 {
padding-bottom: 30px !important
}
.p-b4 {
padding-bottom: 40px !important
}
.p-b5 {
padding-bottom: 50px !important
}
.p-b6 {
padding-bottom: 60px !important
}
.p-b7 {
padding-bottom: 70px !important
}
.m-l2 {
margin-left: 20px !important
}
.p-l2 {
padding-left: 20px !important
}
.m-l3 {
margin-left: 30px !important
}
.p-l3 {
padding-left: 30px !important
}
.m-l4 {
margin-left: 40px !important
}
.p-l4 {
padding-left: 40px !important
}  .image-thumbnail {
position: relative;
width: 100%;
padding-top: 66.33%;
overflow: hidden
}
.image-thumbnail img {
position: absolute;
bottom: 0;
left: 0;
right: 0;
top: 0;
max-width: 100%;
max-height: 100%;
width: auto;
margin: auto;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transition: opacity .5s ease-in, -webkit-transform .5s ease-in;
transition: opacity .5s ease-in, transform .5s ease-in;
transition: opacity .5s ease-in, transform .5s ease-in, -webkit-transform .5s ease-in
}
a:hover .image-thumbnail img {
-moz-transform: scale(1.02, 1.02);
-webkit-transform: scale(1.02, 1.02);
transform: scale(1.02, 1.02)
}
.image-thumbnail:before {
content: "";
padding: 25px;
background: url(//zoombooks.ca/wp-content/themes/zoombooks/assets/img/favicon.png) center center no-repeat;
background-size: contain;
position: absolute;
left: 50%;
top: 50%;
-moz-transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
opacity: .3
}
.iframe-map {
position: relative;
padding-top: 42%
}
.iframe-video {
position: relative;
display: inline-block;
width: 100%;
padding-top: 56%;
margin: 0;
background-color: #f5f5f5
}
.iframe-map iframe,
.iframe-map img,
.iframe-video iframe {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
height: 100%;
width: 100%
}
div.breadcrumbs,
section.breadcrumbs {
position: relative;
display: block;
font-weight: 400;
margin: 15px 0 0;
overflow: hidden;
clear: both;
text-align: left;
z-index: 11
}
ul.breadcrumbs {
float: left;
width: 100%;
padding: 0;
clear: both;
}
ul.breadcrumbs li {
font-size: 16px;
position: relative;
display: inline-block;
line-height: 1;
vertical-align: top;
padding: 0 12px 0 0;
margin-right: 3px;
color: #686868;
font-style: normal;
overflow: visible;
font-weight: 500;
text-transform: capitalize
}
ul.breadcrumbs li:before {
display: none
}
ul.breadcrumbs li a {
position: relative;
display: inline-block;
color: #1f1f1e;
vertical-align: top;
text-decoration: none
}
ul.breadcrumbs li:after {
content: "/";
font-weight: 400;
position: absolute;
color: #686868;
right: 0;
top: 1px;
line-height: 1;
font-style: normal;
font-size: 100%;
}
ul.breadcrumbs li:last-child {
padding: 0;
margin: 0
}
ul.breadcrumbs li:last-child:after {
display: none
}
ul.breadcrumbs li:before {
display: none
}
ul.breadcrumbs li a:hover {
color: #686868;
text-decoration: underline
}  .flexslider {
position: relative;
margin: 0;
padding: 0;
overflow: hidden;
}
.flexslider:before {
margin: -20px 0 0 -20px;
width: 40px;
height: 40px;
border-width: .2rem
}
.flexslider .slides>li {
display: block !important;
}
.flexslider ul.slides {
margin: 0;
padding: 0;
float: left;
width: 100%
}
.flexslider li {
padding: 0
}
.flexslider li:before {
display: none
}
.flexslider .slides>li {
position: relative;
display: none;
-webkit-backface-visibility: hidden;
backface-visibility: hidden
}
html[xmlns] .flexslider .slides {
display: block
}
* html .flexslider .slides {
height: 1%
}
.no-js .flexslider .slides>li:first-child {
display: block
}
.flexslider .flex-control-paging-wrap {
position: absolute;
left: 0;
right: 0;
top: 10px;
text-align: right;
padding-right: 10px;
z-index: 99
}
.flexslider .flex-control-paging {
position: absolute;
right: 0;
left: 0;
bottom: 25px;
margin: 0;
display: inline-block;
z-index: 98;
height: auto;
text-align: center;
padding: 0 15px
}
.flexslider .flex-control-paging li {
position: static;
display: inline-block;
width: auto;
margin: 2px 4px;
height: auto
}
.flexslider .flex-control-paging li a {
border: 1px solid #a2e07a;
width: 10px;
height: 10px;
line-height: 10px;
font-size: 0;
color: #ffffff;
text-align: center;
display: block;
position: relative;
cursor: pointer;
background-color: #a2e07a;
border-radius: 34px;
transition: none;
-moz-transition: none;
-webkit-transition: none;
-ms-transition: none;
-o-transition: none
}
.flexslider .flex-control-paging li .flex-active,
.flexslider .flex-control-paging li a:hover {
background-color: #1f1f1e;
border-color: #1f1f1e
}
.flexslider .flex-control-paging li .flex-active:after,
.flexslider .flex-control-paging li a:hover:after {
display: none
}
.flexslider .flex-direction-nav li {
position: static
}
.flexslider .flex-direction-nav a {
transition: .2s ease-in-out;
-moz-transition: .2s ease-in-out;
-webkit-transition: .2s ease-in-out
}
.flexslider .flex-direction-nav .flex-next,
.flexslider .flex-direction-nav .flex-prev {
background: #1f1f1e;
border: 2px solid #1f1f1e;
position: absolute;
left: 10px;
top: 50%;
margin-top: -20px;
width: 40px;
height: 40px;
z-index: 98;
border-radius: 40px;
display: inline-block;
font-size: 0;
opacity: 0
}
.flexslider .flex-direction-nav {
overflow: hidden;
width: 100%;
margin: 0
}
.flexslider .flex-direction-nav .flex-next {
left: auto;
right: 10px
}
.flexslider .flex-direction-nav .flex-next:before,
.flexslider .flex-direction-nav .flex-prev:before {
content: '';
line-height: 1;
display: block;
border: solid #ffffff;
border-width: 0 2px 2px 0;
padding: 5px;
margin: 0 2px;
position: absolute;
top: 50%;
left: 50%;
transition: .2s ease-in-out;
-moz-transition: .2s ease-in-out;
-moz-transform: translate(-50%, -50%) rotate(135deg);
-ms-transform: translate(-50%, -50%) rotate(135deg);
-o-transform: translate(-50%, -50%) rotate(135deg);
-webkit-transform: translate(-50%, -50%) rotate(135deg);
transform: translate(-50%, -50%) rotate(135deg)
}
.flexslider .flex-direction-nav .flex-next:before {
left: auto;
right: 52%;
-moz-transform: translate(50%, -50%) rotate(-45deg);
-ms-transform: translate(50%, -50%) rotate(-45deg);
-o-transform: translate(50%, -50%) rotate(-45deg);
-webkit-transform: translate(50%, -50%) rotate(-45deg);
transform: translate(50%, -50%) rotate(-45deg)
}
.flexslider .flex-direction-nav .flex-next:hover,
.flexslider .flex-direction-nav .flex-prev:hover {
background: #1f1f1e;
border-color: #1f1f1e;
opacity: 1
}
.flexslider .flex-direction-nav .flex-next:hover:before,
.flexslider .flex-direction-nav .flex-prev:hover:before {
border-color: #fff
}
.flexslider:hover .flex-direction-nav .flex-prev {
opacity: 1
}
.flexslider:hover .flex-direction-nav .flex-next {
opacity: 1
}
.flexslider .flex-disabled {
display: none !important
}  .bg {
position: absolute;
left: 0;
top: 0;
bottom: 0;
right: 0;
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
-moz-transition: all .3s linear 0s;
-webkit-transition: all .3s linear 0s;
-ms-transition: all .3s linear 0s;
-o-transition: all .3s linear 0s;
transition: all .3s linear 0s;
}
.bg img {
display: none !important
}
.banner-wrapper {
padding: 20px 0 48px;
contain: layout paint;
min-height: 366px;
}
.banner-wrapper.flexslider .slides>li {
overflow: visible
}
.banner-wrapper .container {
display: flex;
align-items: center;
flex-wrap: wrap;
flex-direction: row-reverse
}
.banner-wrapper .banner-img {
position: relative;
display: block;
margin: 0 auto;
width: 53%;
}
.banner-wrapper .banner-img img {
width: 100%;
height: auto;
display: block;
aspect-ratio: 652 / 642;
}
.banner-wrapper .banner-text {
position: relative;
width: 47%;
padding-right: 40px;
z-index: 11
}
.banner-wrapper .banner-text p {
max-width: 100% !important
}
.banner-wrapper .max-width {
max-width: 570px;
margin-left: auto
}
.banner-wrapper .heading {
position: relative;
display: block;
font-family: 'ProximaNova-Bold';
font-weight: 400;
font-size: 60px;
color: #1f1f1e;
line-height: 1.2413793103448276;
padding: 0;
margin: 0 0 15px;
line-height: 1.1;
min-height: 146px;
}
.banner-wrapper .heading::before {
content: "";
position: absolute;
left: -36px;
top: -10px;
background: url(https://zoombooks.ca/wp-content/uploads/2025/11/star.svg) 0 0 no-repeat;
padding: 17px;
background-size: 32px 33px;
}
.banner-wrapper .heading h1 {
display: inline;
}
.banner-wrapper .heading img {
display: inline-block;
margin-top: -15px;
margin-left: 15px;
}
.banner-wrapper .btn-action {
display: flex;
gap: 15px;
margin: 25px 0 0
}
.banner-wrapper .btn-action .btn {
margin: 0;
}
.hl {
position: relative;
display: inline-block;
-webkit-transform: perspective(1px) translateZ(0);
transform: perspective(1px) translateZ(0);
}
.hl::before {
content: "";
position: absolute;
background-color: #d3ff92;
padding: 14px 0;
left: 0;
right: 0;
bottom: 0;
z-index: -1
}
.banner-wrapper .notes {
background-color: #f8f6f2;
border-radius: 16px;
padding: 16px 40px 16px 30px;
margin: 30px auto 0;
display: flex;
gap: 22px;
align-items: center;
text-align: left;
}
.banner-wrapper.text-banner {
text-align: center;
padding: 50px 0
}
.banner-wrapper.text-banner .container {
position: relative;
}
.banner-wrapper.text-banner .max-width {
float: none;
margin: 0 auto;
width: 100%;
max-width: 670px;
}
.banner-wrapper.text-banner .container::before {
content: "";
position: absolute;
left: -36px;
top: 50%;
background: url(//zoombooks.ca/wp-content/themes/zoombooks/assets/img/star-icon.png) 0 0 no-repeat;
padding: 17px
}
.banner-wrapper.text-banner .heading::before {
display: none;
}
.banner-wrapper.text-banner .heading img {
margin-bottom: -30px;
margin-right: -90px
}
.banner-wrapper.text-banner p:has(.btn) {
display: flex;
flex-wrap: wrap;
gap: 10px;
justify-content: center;
column-gap: 15px;
}
.banner-wrapper.text-banner ul {
width: fit-content;
text-align: left;
margin-left: auto;
margin-right: auto;
}
.aside-inline-img .impact-row {
width: 103%
}
.team-box {
float: left;
width: 100%;
background: #ffffff;
border-radius: 24px;
overflow: hidden;
}
.team-box .image-thumbnail {
padding-top: 101.33333%
}
.team-box .image-thumbnail img {
width: 100%;
height: 100%;
object-fit: cover
}
.team-box .text-box {
padding: 32px;
}
.team-box h3 {
font-size: 27px
}
.team-box .small-text {
color: #309497;
margin: -8px 0 15px
}
.team-box ul {
display: flex;
gap: 10px;
margin-top: 20px;
}
.team-box ul li {
padding: 0;
font-size: 20px;
}
.team-box ul li::before {
display: none;
}
.team-box ul li a:hover {
color: #309497
}
.choice-row .wpcf7-list-item {
margin-left: 0
} .banner-wrapper .heading,
.banner-wrapper p {
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both
}
.flex-active-slide .heading,
.flex-active-slide p {
-webkit-animation-name: fadeInDown;
animation-name: fadeInDown
}
.banner-wrapper.layout-2 {
padding-bottom: 70px
}
.banner-wrapper.layout-2 .banner-text {
width: 55%;
padding-right: 40px;
}
.banner-wrapper.layout-2 .banner-img {
width: 45%;
}
.banner-wrapper.layout-2 .banner-img img {
margin-left: auto
}
.inner-banner {
position: relative;
background-color: #f5f5f5;
text-align: center
}
.inner-banner .container {
padding: 40px 15px;
overflow: hidden;
}
.inner-banner .max-width {
max-width: 930px;
margin-left: auto;
margin-right: auto
}
.inner-banner .banner-img {
height: 167px;
background: #808080;
}
.inner-banner .banner-img img {
width: 100%;
height: 100%;
object-fit: cover;
;
mix-blend-mode: multiply;
}
.inner-banner .banner-text {
position: relative;
left: 0;
right: 0;
overflow: hidden;
z-index: 11
}
.inner-banner .heading {
position: relative;
display: block;
font-family: 'ProximaNova-Regular';
font-weight: 800;
font-size: 60px;
color: #1f1f1e;
line-height: 1.2413793103448276;
padding: 0;
margin: 0
}
ul.breadcrumbs .small-tagline {
font-size: 16px !important;
color: #1f1f1e
}
.inner-banner p {
margin: 0;
}
.inner-banner ul.breadcrumbs {
padding: 0;
margin: 5px 0 0;
}
.banner-img-icon {
position: relative;
display: inline-flex
}
.banner-img-icon::before {
content: "";
background: url(https://zoombooks.ca/wp-content/uploads/2025/11/img-icon-1-2.svg),
url(https://zoombooks.ca/wp-content/uploads/2025/11/start2.svg),
url(https://zoombooks.ca/wp-content/uploads/2025/11/img-icon-3-1.svg),
url(https://zoombooks.ca/wp-content/uploads/2025/11/img-icon-4-1.svg);
background-position: 33% 2px, 100% 50%, 0px 59%, 50% 100%;
background-size: 41px 40px, 69px 68px, 53px 51px, 49px 48px;
z-index: 1;
position: absolute;
left: -15px;
top: -15px;
right: -15px;
bottom: -15px;
background-repeat: no-repeat;
display: block;
min-height: 636px;
}
.banner-img-icon img {
border-radius: 40px
} .uppercase {
text-transform: uppercase
}
.small-tagline {
color: #1f1f1e;
font-size: 17px !important;
font-family: 'ProximaNova-Semibold';
font-weight: 400;
margin: 0 !important;
min-height: 23px;
}
.small-tagline+* {
margin-top: 10px !important
}
.top-text-center {
max-width: 680px;
margin: 0 auto 40px;
text-align: center
}
.top-text-center.lg {
max-width: 680px;
}
.top-text-center.xl {
max-width: 800px;
}
.top-text-center.xxl {
max-width: 950px;
}
.top-text-center.xs {
max-width: 526px;
}
.bg-gray {
background-color: #ececec
}
.bg-black {
background-color: #1f1f1e
}
.bg-black *:not(.btn) {
color: #ffffff
}
.bg-light {
background-color: #f8f6f2
}
.center-btn {
text-align: center;
padding-top: 40px;
}
.text-link {
display: inline-block;
font-size: 18px;
color: #1f1f1e;
text-transform: uppercase;
text-decoration: underline;
text-underline-offset: 4px;
font-weight: 800
}
.text-link::after {
content: " \f178";
font-family: "Font Awesome 6 Pro";
font-weight: 900;
}
.text-link:hover {
letter-spacing: 1px
} .aside-inline-img {
padding: 60px 0
}
.aside-inline-img .container {
display: flex;
flex-wrap: wrap;
align-items: center
}
.valign-top .container {
align-items: flex-start
}
div.aside-inline-img {
float: left;
width: 100%;
}
.aside-inline-img.reverse .container {
flex-direction: row-reverse
}
.aside-inline-img .img-box {
position: relative;
float: left;
width: 50%;
padding-right: 68px;
}
.aside-inline-img .img-box img {
width: auto;
border-radius: 20px;
}
.aside-inline-img .text-box {
float: left;
width: 50%;
}
.aside-inline-img.reverse .img-box {
padding-right: 0;
}
.aside-inline-img.reverse .text-box {
padding-left: 0;
padding-right: 60px;
}
.aside-inline-img.text-gap .img-box {
padding: 0
}
.aside-inline-img.text-gap .text-box {
padding-left: 52px
}
.aside-inline-img.text-gap.reverse .text-box {
padding-left: 0;
padding-right: 52px
}
.aside-img-wrapper {
padding: 0;
display: flex;
flex-wrap: wrap;
align-items: center
}
.aside-img-wrapper.reverse {
flex-direction: row-reverse
}
.valign-top {
align-items: flex-start
}
div.aside-img-wrapper {
float: left;
width: 100%;
}
.aside-img-wrapper .img-box {
position: relative;
float: left;
width: 50%;
}
.aside-img-wrapper .img-box img {
width: 100%;
}
.aside-img-wrapper .text-box {
float: left;
width: 50%;
}
.aside-img-wrapper .max-width {
float: left;
width: 100%;
max-width: 635px;
padding: 20px 15px 20px 70px
}
.aside-img-wrapper.reverse .max-width {
float: right;
padding-left: 15px;
padding-right: 70px;
}
.aside-inline-img.layout-2 .img-box {
width: 38%
}
.aside-inline-img.layout-2 .text-box {
width: 62%
}
.aside-inline-img.layout-3 .top-text-center {
max-width: 762px;
font-size: 17px
}
.aside-inline-img.layout-3 .img-box {
padding-right: 40px
}
.aside-inline-img.layout-3 .text-box {
padding-right: 60px;
}
.video-thumbnail {
position: relative;
display: flex;
border-radius: 20px;
overflow: hidden;
}
.video-thumbnail::before {
content: "\f144";
display: inline-block;
font-size: 60px;
line-height: 18px;
font-family: "Font Awesome 6 Pro";
font-weight: 900;
position: absolute;
color: #fadd6a;
top: 50%;
left: 50%;
transform: translate(-50%, -50%)
}
.video-thumbnail:hover::before {
color: #1f1f1e
}
.highlight-wrapper {
text-align: center;
}
.highlight-wrapper h2 {
font-size: 40px;
}
.highlight-row {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin: 60px -20px 0;
row-gap: 30px;
}
.highlight-row:first-child {
margin-top: 0
}
.highlight-box {
float: left;
width: 25%;
padding: 0 20px;
}
.highlight-box .icon {
display: flex;
justify-content: center;
align-items: center;
height: 58px;
}
.highlight-box img {
margin: 0 auto;
height: 100%;
}
.highlight-box h3 {
font-size: 25px;
margin: 10px 0;
}
.highlight-box p {
color: #0d8b8e;
font-size: 15px;
}
.common-grid {
display: grid;
grid-template-columns: 1fr 1fr;
row-gap: 20px;
column-gap: 30px;
margin-bottom: 60px;
}
.common-grid:has(.small-tagline) .column:last-child {
padding-top: 40px;
}
.serives-row {
display: flex;
flex-wrap: wrap;
margin: 0 0 -4% -2%;
}
.serives-box {
position: relative;
float: left;
width: 31.3333333333%;
margin: 0 0 4% 2%;
background: #f1fef1;
text-decoration: none;
padding-bottom: 60px;
border-radius: 20px;
overflow: hidden;
font-size: 15px;
}
.serives-box .image-thumbnail {
padding-top: 65.33%;
}
.serives-box .image-thumbnail img {
width: 100%;
height: 100%;
object-fit: cover
}
.serives-box .text-box {
padding: 30px 25px 0
}
.serives-box h3 {
font-size: 27px;
}
.serives-box .btn {
position: absolute;
left: 25px;
bottom: 25px;
padding-left: 15px !important;
padding-right: 15px !important;
}
.partner-wrapper {
text-align: center;
}
.partner-wrapper .container {
max-width: 980px;
}
.partner-wrapper h2 {
font-size: 35px;
}
.partner-slider.owl-carousel {
margin-top: 35px;
}
.partner-box {
display: flex;
justify-content: center;
align-items: center;
width: 100%
}
.review-wrapper {
text-align: center;
background: url(//zoombooks.ca/wp-content/themes/zoombooks/assets/img/bg-circle-1.png), url(//zoombooks.ca/wp-content/themes/zoombooks/assets/img/bg-circle-2.png);
background-position: left center, right 70%;
background-repeat: no-repeat;
background-color: #f8f6f2
}
.review-wrapper .container {
max-width: 930px;
}
.review-wrapper h2 {
font-size: 35px
}
.review-slider.owl-carousel {
margin-top: 35px
}
.review-box {
text-align: center;
background-color: #ffffff;
padding: 30px;
border-radius: 30px;
margin: 0; transition: all .1s linear 0s;
}
.review-box .icon {
display: none;
}
.review-box img {
margin: 0 auto;
}
.review-box p {
font-size: 18px;
}
.review-box .name {
font-family: 'ProximaNova-Semibold';
font-size: 18px;
font-weight: 600
}
.review-slider.owl-carousel .owl-item.center {
z-index: 11;
}
.review-slider.owl-carousel .owl-item.center .review-box {
margin: 0 -120px;
background-color: #0d8b8e;
position: relative;
z-index: 11;
transform: scale(1.0, 1.0);
filter: inherit;
}
.review-slider.owl-carousel .owl-item.center .review-box .icon {
display: block;
}
.review-slider.owl-carousel .owl-item.center .review-box * {
color: #ffffff
}
.story-row .img-box {
padding-right: 0;
}
.story-row .text-box {
padding-left: 75px;
}
.story-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 25px;
max-width: 615px;
margin: 0 auto
}
.story-grid .column {
display: flex;
flex-wrap: wrap;
gap: 25px;
}
.story-grid .story-text {
padding: 40px;
background-color: #e1c5ff;
border-radius: 20px;
}
.story-grid .column:nth-child(2) .story-text {
background-color: #f8d868
}
.story-grid .column .story-text.recycling {
background-color: #d3ff92 !important
}
.story-grid .story-text h4 {
font-size: 24px;
margin: 10px 0 5px;
}
.story-grid .story-text img {
margin: 0 0 0 auto;
border-radius: 0 !important
}
.story-grid .story-text.p-2 {
padding: 20px 24px 30px !important
}
.story-grid h3 {
font-size: 55px;
margin-bottom: 5px
}
.location-wrapper .common-grid {
margin-bottom: 40px
}
.location-box {
position: relative;
float: left;
width: 100%;
text-decoration: none;
padding-bottom: 45px;
overflow: hidden;
font-size: 15px;
}
.location-box .image-thumbnail {
padding-top: 55%;
border-radius: 24px;
overflow: hidden;
}
.location-box .image-thumbnail img {
width: 100%;
height: 100%;
object-fit: cover
}
.location-box .text-box {
padding: 20px 0 0
}
.location-box h3 {
font-size: 27px;
}
.location-box .btn {
position: absolute;
left: 0;
bottom: 1px;
padding-left: 15px !important;
padding-right: 15px !important;
}
.connect-row h2 {
font-size: 50px;
}
.connect-row .img-box {
padding-right: 0
}
.connect-row .text-box {
padding-left: 40px
}
.tag-wrapper {
float: left;
width: 100%;
padding: 7px 0;
background-color: #0d8b8e;
font-size: 20px;
color: #ffffff;
font-family: 'Gotham';
}
.tag-wrapper .box {
background: url(https://zoombooks.ca/wp-content/uploads/2025/11/star-icon-yellow.svg) right center no-repeat;
padding-right: 65px;
background-size: 22px 23px;
}
.instagram-wrapper .owl-carousel .owl-nav .owl-prev {
left: 10px;
}
.instagram-wrapper .owl-carousel .owl-nav .owl-next {
right: 10px;
}
.address-info {
display: flex;
flex-wrap: wrap;
gap: 20px;
align-items: center;
margin-top: 40px;
justify-content: space-between
}
.address-info a {
text-decoration: none
}
.address-info p {
display: flex;
align-items: center;
gap: 14px;
}
.address-info a:hover {
color: #0d8b8e
}
.tab-view {
display: inline-flex;
background: #ffffff;
padding: 5px;
width: 100%;
border-radius: 50px;
margin-bottom: 36px;
}
.tab-view a {
display: flex;
font-size: 18px;
color: #b1b3ae;
font-weight: bold;
background: #ffffff;
padding: 12px 15px;
text-align: center;
justify-content: center;
align-items: center;
width: 50%;
border-radius: 50px;
text-decoration: none
}
.tab-view a.active {
background-color: #f8f6f2;
color: #1f1f1e
}
.tab-view a:hover {
color: #1f1f1e
}
.anchor-box {
display: none
}
.anchor-box.active {
display: block
}
.contact-form {
text-align: center;
background: url(//zoombooks.ca/wp-content/themes/zoombooks/assets/img/bg-circle-3.png), url(//zoombooks.ca/wp-content/themes/zoombooks/assets/img/star-2.png);
background-position: left 35%, 94% 40px;
background-repeat: no-repeat;
overflow: hidden;
background-color: #f8f6f2
}
.contact-form .container {
max-width: 890px
}
.contact-form h2 {
font-size: 30px
}
.contact-form .form-fields {
margin-top: -5px
}
.contact-form h3+p {
max-width: 480px;
margin-left: auto;
margin-right: auto
}
.contact-form [class*="col-"]:has(.btn) {
text-align: center
}
.contact-form #view-2 p {
max-width: 100%
}
.contact-form .btn {
min-width: 180px
}
.connect-info {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin: 40px auto 60px;
max-width: 655px;
row-gap: 25px
}
.connect-info .box {
background: #ffffff;
border-radius: 30px;
padding: 40px;
float: left;
width: 46%;
margin: 0 2%;
}
.connect-info .icon {
display: flex;
height: 44px;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 18px;
}
.connect-info img {
margin: 0 auto;
}
.connect-info p {
margin: 0 0 15px;
}
.connect-info p:last-child {
margin-bottom: 0
}
.connect-info strong {
font-size: 22px;
font-weight: bold;
color: #1f1f1e
}
.connect-info a {
color: #0d8b8e;
text-decoration: none
}
.connect-info a:hover {
text-decoration: underline
}
.c-map {
clear: both;
padding-top: 440px
}
.location-search {
max-width: 754px;
margin: 0 auto 60px;
border-radius: 20px;
overflow: hidden;
}
.location-search h3 {
background-color: #0d8b8e;
font-size: 24px;
color: #ffffff;
font-weight: bold;
padding: 25px 40px;
margin: 0;
}
.search-row {
background-color: #f8f6f2;
padding: 14px 25px 14px 14px;
display: flex;
gap: 10px;
}
.ls-wrapper .map-box {
float: left;
width: 70%
}
.ls-wrapper .text-box {
float: left;
width: 30%;
padding-left: 35px;
}
.ls-wrapper .text-box h3 {
font-size: 18px;
border-top: 1px solid #e5e7eb;
padding-top: 30px;
margin-top: 30px;
}
.ls-wrapper .text-box h3:first-child {
border: none;
margin-top: 0;
}
#wpsl-wrap {
margin: 0 !important;
}
#wpsl-gmap {
float: left !important;
border-radius: 24px !important;
}
#wpsl-result-list {
width: 30% !important;
float: right !important;
margin: 0 0 0 3% !important;
}
#wpsl-wrap #wpsl-result-list li::before {
display: none;
}
#wpsl-result-list li p {
margin: 0 0 5px !important;
}
#wpsl-search-wrap .wpsl-input,
#wpsl-search-wrap .wpsl-select-wrap {
display: block !important;
margin: 0 !important;
width: 100% !important;
}
#wpsl-wrap #wpsl-result-list li {
border-bottom: 1px solid #e5e7eb !important;
padding: 0 0 20px !important;
margin: 0 0 20px !important;
}
#wpsl-wrap #wpsl-result-list li:last-child {
border-bottom: none !important;
margin: 0 !important;
padding: 0 !important
}
#wpsl-search-wrap div,
#wpsl-search-btn {
margin: 0 !important;
}
.wpsl-search {
max-width: 754px;
margin: 0 auto 60px !important;
border-radius: 20px;
overflow: hidden;
padding: 0 !important
}
.wpsl-search #wpsl-search-wrap .wpsl-input label {
display: none;
}
.wpsl-search #wpsl-search-wrap::before {
content: "Your location";
background-color: #0d8b8e;
font-size: 24px;
color: #ffffff;
font-weight: bold;
padding: 25px 40px;
margin: 0;
font-family: 'Gotham';
line-height: 1.2;
width: 100%;
display: block;
}
.wpsl-search #wpsl-search-wrap form {
background-color: #f8f6f2;
padding: 14px 25px 14px 14px;
display: flex;
gap: 10px;
}
.wpsl-search #wpsl-search-wrap #wpsl-search-input {
background-color: #f8f6f2;
border: none;
border: 1px solid #d3d3d3;
border-radius: 50px;
color: #1f1f1e;
display: block;
font-size: 17px;
font-weight: 400;
line-height: 20px;
padding: 15px 25px;
position: relative;
width: 100%;
height: 52px;
margin: 0;
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
-moz-transition: all .3s linear 0s;
-webkit-transition: all .3s linear 0s;
-ms-transition: all .3s linear 0s;
-o-transition: all .3s linear 0s;
transition: all .3s linear 0s;
font-family: 'ProximaNova-Regular';
}
.wpsl-search #wpsl-search-wrap #wpsl-search-btn {
display: inline-block;
font-family: 'ProximaNova-Semibold';
font-weight: 400;
position: relative;
font-size: 16px;
border: 2px solid #1f1f1e;
border-radius: 50px;
color: #ffffff;
font-style: normal;
line-height: 22px;
padding: 13px 22px;
text-decoration: none;
white-space: normal;
-webkit-transform: perspective(1px) translateZ(0);
transform: perspective(1px) translateZ(0);
overflow: hidden;
background: #1f1f1e;
cursor: pointer;
text-align: center;
text-transform: none;
min-width: 148px;
}
.wpsl-search #wpsl-search-wrap #wpsl-search-btn:hover,
.wpsl-search #wpsl-search-wrap #wpsl-search-btn:focus {
color: #ffffff;
border-color: #74c042;
background: #74c042;
}
.items-guide-row {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 30px;
}
.items-guide-box {
float: left;
width: 100%;
padding: 44px 48px;
background: #ffffff;
border-radius: 30px;
border-top: 2px solid #0d8b8e
}
.items-guide-box:nth-child(2) {
border-color: #bb1b1b
}
.items-guide-box h3 {
font-size: 24px;
}
.note-row {
background-color: #f8d868;
border-radius: 16px;
border-left: 2px solid #d9b32c;
padding: 26px 46px;
max-width: 1086px;
margin: 50px auto 0;
display: flex;
gap: 22px;
}
.note-row img {
min-width: 30px;
}
.how-d-row {
display: flex;
flex-wrap: wrap;
margin: 0 0 0 -3%;
row-gap: 30px;
}
.how-d-box {
float: left;
width: 30.33333333%;
margin: 0 0 0 3%;
background-color: #ffffff;
border-radius: 30px;
padding: 38px 46px 44px;
text-align: center
}
.how-d-box h3 {
font-size: 24px;
margin: 20px 0 10px;
}
.how-d-box img {
margin: 0 auto;
}
.how-d-box .btn {
min-width: 174px;
margin-top: 10px;
}
.how-d-box .icon {
height: 56px;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto
}
.layout-3 .how-d-box {
width: 47%
}
.benefits-wrapper {
padding-bottom: 0
}
.benefits-wrapper h2 {
font-size: 35px;
}
.benefits-row {
display: flex;
flex-wrap: wrap;
margin: 0 0 -2% -2%;
}
.benefits-box {
float: left;
width: 31.33333333%;
margin: 0 0 2% 2%;
background-color: #f8f6f2;
padding: 30px 40px 40px;
border-radius: 24px;
}
.benefits-box .icon {
display: flex;
align-items: center;
justify-content: center;
border: 2px solid #000000;
border-radius: 100%;
width: 50px;
height: 50px
}
.benefits-box h3 {
font-size: 24px;
margin-top: 8px
}
.benefits-box:nth-child(1) {
background-color: #a2e07a
}
.benefits-box:nth-child(2) {
background-color: #f8d868
}
.benefits-box:nth-child(3) {
background-color: #e1c5ff
}
.benefits-box.w-full {
width: 98%;
padding: 40px 15% 40px 25%
}
.benefits-box.w-full .icon {
width: 100px;
height: 100px;
margin-left: -130px;
margin-bottom: -110px;
}
.partner-wrapper.layout-2 {
padding-top: 30px
}
.regions-row {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin: 0 0 -3% -3%;
}
.regions-box {
float: left;
width: 47%;
margin: 0 0 3% 3%;
background-color: #ffffff;
border-radius: 24px;
overflow: hidden;
position: relative;
}
.regions-box .image-thumbnail {
padding-top: 44.33%;
}
.regions-box .image-thumbnail img {
width: 100%;
height: 100%;
object-fit: cover
}
.regions-box .btn {
position: absolute;
right: 40px;
top: 26px;
font-size: 15px;
font-weight: normal;
padding: 5px 15px !important
}
.regions-box .btn::before {
display: none;
}
.regions-box .btn:hover,
.regions-box .btn:focus {
background-color: #121212;
border-color: #121212
}
.regions-box .text-box {
padding: 35px 40px 40px
}
.regions-box h3 {
font-size: 30px;
margin: 0 0 8px;
}
.regions-box li:has(i)::before {
display: none;
}
.regions-box li:has(i) i {
position: absolute;
left: 0;
top: 2px
}
.interested-row {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
column-gap: 30px;
row-gap: 15px;
margin-top: 50px;
text-align: center
}
.interested-row p {
margin: 0;
}
.specialized-wrapper h2 {
font-size: 35px;
}
.specialized-row {
display: flex;
flex-wrap: wrap;
margin: 0 0 -2% -2%;
}
.specialized-box {
float: left;
width: 31.33333333%;
margin: 0 0 2% 2%;
background-color: #f8f6f2;
padding: 30px 40px 40px;
border-radius: 24px;
text-decoration: none;
text-align: center
}
.specialized-box .icon {
display: flex;
align-items: center;
justify-content: center;
height: 56px
}
.specialized-box h3 {
font-size: 24px;
margin: 15px 0
}
.specialized-box p {
color: #1f1f1e
}
.specialized-box:nth-child(1) {
background-color: #ffdbc0
}
.specialized-box:nth-child(2) {
background-color: #e1c5ff
}
.specialized-box:nth-child(3) {
background-color: #a2e07a
}
.director-row h2 small {
display: block;
font-size: 50%
}
.director-row .small-tagline+* {
margin-top: 0 !important
}
.director-row .btn {
min-width: 198px;
}
.director-row .img-box {
padding: 0
}
.director-row .text-box {
padding: 20px 40px
}
.pcta-wrapper {
text-align: center;
padding: 40px 0;
}
.pcta-wrapper .container {
max-width: 600px
}
.pcta-wrapper p:has(img) {
margin-bottom: -10px;
}
.pcta-wrapper img {
margin: 0 auto;
}
.pcta-wrapper .btn {
margin-top: 10px;
}
.services-wrapper.layout-2 {
padding-top: 30px
}
.serives-slider .serives-box {
width: 100% !important;
margin: 0 !important;
}
.services-wrapper.layout-2 .serives-box {
font-size: 17px;
padding-bottom: 30px
}
.services-wrapper.layout-2 ul li:before {
top: 2px
}
.guide-wrapper.layout-2 .items-guide-box:has(.check-list) {
background-color: #f1fef1
}
.guide-wrapper.layout-2 .items-guide-box:has(.reject-icon) {
background-color: #f8f6f2
}
.how-d-wrapper.layout-2 .top-text-center {
max-width: 700px
}
.how-d-wrapper.layout-2 .top-text-center p {
max-width: 520px;
margin-left: auto;
margin-right: auto
}
.how-d-wrapper.layout-2 .how-d-box {
padding-top: 50px;
padding-bottom: 50px
}
.connect-row.layout-4 .container {
max-width: 1190px
}
.connect-row.layout-4 p {
max-width: 440px
}
.connect-row.layout-4 .btn {
min-width: 160px;
margin-top: 10px;
}
.centers-row {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin: 0 0 -3% -3%;
}
.centers-box,
.facility-box {
float: left;
width: 47%;
margin: 0 0 3% 3%;
background-color: #ffffff;
border-radius: 24px;
overflow: hidden;
position: relative;
}
.centers-box .image-thumbnail {
padding-top: 44.33%;
}
.centers-box .image-thumbnail img {
width: 100%;
height: 100%;
object-fit: cover
}
.centers-box .btn {
position: absolute;
right: 25px;
top: 25px;
font-size: 15px;
font-weight: normal;
padding: 5px 15px !important;
cursor: initial
}
.centers-box .btn::before {
display: none;
}
.centers-box .btn:hover,
.centers-box .btn:focus {
background-color: #121212;
border-color: #121212
}
.centers-box .text-box {
padding: 35px 40px 40px
}
.centers-box h3 {
font-size: 30px;
margin: 0 0 15px;
}
.centers-box p:has(.icon) {
position: relative;
padding-left: 60px;
}
.centers-box p .icon {
position: absolute;
left: 0;
top: 5px
}
.centers-box p strong {
font-size: 20px;
display: block;
margin-bottom: 5px
}
.centers-box p a {
text-decoration: none
}
.centers-wrapper .tab-view {
max-width: 526px;
display: flex;
justify-content: center;
margin: -10px auto 45px;
}
.facility-box {
background-color: transparent;
border-radius: 0;
padding-top: 25px
}
.facility-box .video-box {
margin-top: 40px;
}
.video-box {
position: relative;
display: block;
text-decoration: none
}
.video-box .img-box {
position: relative;
border-radius: 24px;
overflow: hidden;
}
.video-box .img-box:before {
content: "\f04b";
font-size: 30px;
line-height: 1;
font-family: "Font Awesome 6 Pro";
font-weight: 900;
position: absolute;
left: 50%;
top: 45%;
width: 90px;
height: 90px;
display: flex;
align-items: center;
justify-content: center;
background-color: rgba(255, 255, 255, 0.2);
transform: translate(-50%, -50%);
border-radius: 100%;
color: #ffffff;
font-weight: 300;
z-index: 3;
}
.video-box .img-box::after {
content: "";
position: absolute;
left: 0;
top: 0;
bottom: 0;
right: 0;
background: rgba(0, 0, 0, 0.8)
}
.video-box .overlay-text {
position: absolute;
left: 0;
right: 0;
bottom: 0;
padding: 25px;
z-index: 5;
}
.video-box .overlay-text * {
color: #ffffff
}
.video-box h4 {
font-size: 24px;
margin: 0 0 5px;
}
.video-box:hover .img-box:before {
background-color: rgba(255, 255, 255, 0.5);
}
.video-box .img-box img {
width: 100% !important
}
.warehouse-wrapper .top-text-center {
max-width: 730px
}
.warehouse-wrapper .container {
position: relative;
}
.warehouse-list {
position: relative;
max-width: 1060px;
margin: 0 auto;
padding: 30px 0 38px
}
.warehouse-list::before {
content: "";
position: absolute;
left: 50%;
top: 3px;
bottom: 3px;
border-left: 4px solid #f8f6f2;
transform: translateX(-50%);
}
.warehouse-list::after,
.warehouse-wrapper .container::after {
content: "";
position: absolute;
top: 0;
width: 22px;
height: 22px;
border-radius: 22px;
left: 50%;
transform: translateX(-50%);
background-color: #f8f6f2;
}
.warehouse-wrapper .container::after {
bottom: 0;
top: auto
}
.warehouse-row {
display: grid;
grid-template-columns: 1fr 1fr;
column-gap: 102px;
row-gap: 20px;
margin-bottom: 58px;
}
.warehouse-row:last-child {
margin-bottom: 0
}
.warehouse-row .img-box img {
border-radius: 24px;
}
.warehouse-row:nth-child(odd) .img-box {
order: 2
}
.warehouse-row .text-box {
position: relative;
background: #5bbdb4;
padding: 30px 45px 35px;
border-radius: 24px;
}
.warehouse-row .icon {
border: 2px solid #050b0b;
height: 50px;
width: 50px;
border-radius: 50px;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 18px;
}
.warehouse-row .text-box::before {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
border-bottom: 4px solid #5bbdb4;
width: 56px;
left: 100%
}
.warehouse-row .text-box::after {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 22px;
height: 22px;
border-radius: 22px;
right: -62px;
background-color: #5bbdb4;
}
.warehouse-row:nth-child(even) .text-box::before {
left: auto;
right: 100%;
}
.warehouse-row:nth-child(even) .text-box::after {
left: -62px;
right: auto;
}
.warehouse-row h3 {
font-size: 24px;
margin: 0 0 8px;
}
.warehouse-row:nth-child(2) .text-box,
.warehouse-row:nth-child(2) .text-box::after {
background-color: #f8d868;
}
.warehouse-row:nth-child(2) .text-box::before {
border-color: #f8d868
}
.warehouse-row:nth-child(3) .text-box,
.warehouse-row:nth-child(3) .text-box::after {
background-color: #e1c5ff;
}
.warehouse-row:nth-child(3) .text-box::before {
border-color: #e1c5ff
}
.warehouse-row:nth-child(4) .text-box,
.warehouse-row:nth-child(4) .text-box::after {
background-color: #ffdbc0;
}
.warehouse-row:nth-child(4) .text-box::before {
border-color: #ffdbc0
}
.warehouse-row:nth-child(5) .text-box,
.warehouse-row:nth-child(5) .text-box::after {
background-color: #a2e07a;
}
.warehouse-row:nth-child(5) .text-box::before {
border-color: #a2e07a
}
.find-warehouse-wrapper img {
border-radius: 24px;
margin: 0 auto;
}
.find-warehouse-wrapper .wpsl-search,
.find-warehouse-wrapper #wpsl-result-list {
display: none !important;
}
.find-warehouse-wrapper #wpsl-gmap {
width: 100% !important;
float: none !important;
margin: 0 auto !important;
height: 430px !important;
max-width: 968px
}
.pcta-wrapper.layout-2 .container {
max-width: 970px
}
.how-w-wrapper {
text-align: center;
background: url(//zoombooks.ca/wp-content/themes/zoombooks/assets/img/star-2.png);
background-position: 94% 40px;
background-repeat: no-repeat;
background-color: #f8f6f2;
}
.how-w-wrapper h2,
.pickup-wrapper h2 {
font-size: 45px;
}
.how-w-row {
display: flex;
justify-content: center;
flex-wrap: wrap;
margin: 45px 0 -2% -2%;
}
.how-w-box {
float: left;
width: 31.33333333%;
margin: 0 0 2% 2%;
background-color: #f8f6f2;
padding: 50px 66px;
border-radius: 24px;
}
.how-w-box .icon {
display: flex;
align-items: center;
justify-content: center;
width: 50px;
height: 50px;
margin: 0 auto 25px;
}
.how-w-box h3 {
font-size: 24px;
}
.how-w-box:nth-child(1) {
background-color: #e1c5ff
}
.how-w-box:nth-child(2) {
background-color: #a2e07a
}
.how-w-box:nth-child(3) {
background-color: #ffdbc0
}
.pickup-wrapper .top-text-center {
max-width: 750px
}
.pickup-wrapper .form-box {
background: #f8f6f2;
padding: 48px 74px;
border-radius: 24px;
max-width: 1000px;
margin: 0 auto;
}
.pickup-wrapper label {
font-size: 17px;
margin: 0 0 10px 26px;
}
.pickup-wrapper label:has(input) {
display: flex;
column-gap: 10px;
}
.pickup-wrapper label:has(input):last-child {
margin-bottom: 0
}
.pickup-wrapper label:has(input) .csRadio,
.pickup-wrapper label:has(input) .csCheckbox {
margin: 0;
}
.pickup-wrapper ::-webkit-input-placeholder {
color: #9f9f9f;
}
.pickup-wrapper ::-moz-placeholder {
color: #9f9f9f;
}
.pickup-wrapper :-ms-input-placeholder {
color: #9f9f9f;
}
.pickup-wrapper :-moz-placeholder {
color: #9f9f9f;
}
.pickup-wrapper .selectric .label {
color: #9f9f9f;
}
.pickup-wrapper .form-fields .row {
margin-left: -12px;
margin-right: -12px
}
.pickup-wrapper .form-fields [class*=col-] {
padding-right: 12px;
padding-left: 12px;
}
.pickup-wrapper .note-row {
margin: 20px 0;
padding-left: 33px
}
.pickup-wrapper .note-row i {
padding-top: 5px;
min-width: 36px
}
.pickup-wrapper .note-row strong {
font-size: 20px;
}
.pickup-wrapper textarea {
height: 150px;
padding-top: 20px
}
.icon-field i.fa-calendar-alt {
position: absolute;
font-size: 17px;
left: auto;
right: 30px;
color: #9f9f9f;
top: 16px;
z-index: 2;
width: 20px;
text-align: center;
font-weight: 900;
}
.icon-field i.fa-calendar-alt+input,
.icon-field i.fa-calendar-alt+* input {
padding-left: 25px !important;
padding-right: 58px !important
}
.pickup-wrapper .wpcf7-not-valid-tip {
margin-left: 26px;
}
.pickup-wrapper .wpcf7-list-item {
display: block !important;
margin: 0 0 10px !important;
}
.pickup-wrapper .wpcf7-list-item:last-child {
margin-bottom: 0 !important
}
.pickup-wrapper .wpcf7-response-output {
text-align: center
}
.icon-button.btn {
padding-left: 30px;
padding-right: 30px
}
.icon-button.btn input {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
width: 100%;
height: auto;
cursor: pointer;
opacity: 0;
border-radius: 50px;
}
.solutions-wrapper h2,
.sustainability-wrapper h2,
.transform-wrapper h3,
.end-to-end h2 {
font-size: 45px;
}
.solutions-wrapper .top-text-center.xl {
max-width: 820px;
}
blockquote {
background-color: #ffffff;
border-radius: 16px;
border-left: 2px solid #0d8b8e;
padding: 26px 46px;
max-width: 1086px;
margin: 30px auto 0;
display: block;
color: #0d8b8e;
font-style: italic
}
.solutions-wrapper .aside-inline-img {
margin-bottom: 40px;
}
.solutions-wrapper .aside-inline-img .text-box {
padding-left: 15px !important;
padding-right: 15px !important;
}
.solutions-wrapper .aside-inline-img .img-box {
padding-left: 15px;
}
.solution-row {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 30px;
clear: both;
}
.solution-box {
position: relative;
float: left;
width: 100%;
padding: 40px 56px 40px 100px;
border-radius: 24px;
background-color: #d3ff92
}
.solution-box .icon {
display: flex;
align-items: center;
justify-content: center;
border-radius: 50px;
width: 50px;
height: 50px;
border: 2px solid #1f1f1e;
position: absolute;
left: 34px;
top: 40px
}
.solution-box h3 {
font-size: 24px;
margin: 0 0 8px
}
.solution-box:nth-child(2) {
background-color: #e1c5ff
}
.solution-box:nth-child(3) {
background-color: #ffdbc0
}
.solution-box:nth-child(4) {
background-color: #f8d869
}
.end-to-end {
background-color: #ffffff;
padding: 50px;
border-radius: 30px;
text-align: center;
margin-top: 30px;
}
.end-to-end .column-row {
display: flex;
flex-wrap: wrap;
row-gap: 30px;
counter-reset: num-counter;
margin-top: 55px
}
.end-to-end .column {
position: relative;
float: left;
width: 25%;
padding: 0 25px
}
.end-to-end .column::before {
position: relative;
content: counter(num-counter, decimal-leading-zero) ". ";
counter-increment: num-counter;
display: flex;
width: 60px;
height: 60px;
border-radius: 60px;
background: #d3ff92;
font-size: 20px;
font-weight: 700;
align-items: center;
justify-content: center;
margin: 0 auto;
font-family: 'Gotham';
z-index: 5;
}
.end-to-end .column:nth-child(2):before {
background-color: #e1c5ff
}
.end-to-end .column:nth-child(3):before {
background-color: #ffdbc0
}
.end-to-end .column:nth-child(4):before {
background-color: #f8d869
}
.end-to-end .column::after {
content: "";
position: absolute;
padding: 2px 0;
top: 30px;
left: 50%;
right: -50%;
background: linear-gradient(to right, #d3ff92 0%, #e1c5ff 100%);
}
.end-to-end .column:nth-child(2):after {
background: linear-gradient(to right, #e1c5ff 0%, #ffdbc0 100%);
}
.end-to-end .column:nth-child(3):after {
background: linear-gradient(to right, #ffdbc0 0%, #f8d869 100%);
}
.end-to-end .column:last-child:after {
display: none;
}
.end-to-end h3 {
font-size: 24px;
margin: 20px 0 8px;
}
.sustainability-wrapper .top-text-center {
max-width: 820px;
}
.transform-wrapper .top-text-center {
max-width: 820px;
}
.transform-wrapper .container {
max-width: 1150px;
}
.transform-row {
display: flex;
justify-content: center;
flex-wrap: wrap;
margin: 45px 0 -2% -2%;
}
.transform-box {
float: left;
width: 31.33333333%;
margin: 0 0 2% 2%;
background-color: #f8f6f2;
padding: 35px 45px;
border-radius: 24px;
text-align: center
}
.transform-box .icon {
display: flex;
align-items: center;
justify-content: center;
width: 50px;
height: 50px;
margin: 0 auto 20px;
}
.transform-box h4 {
font-size: 22px;
margin-top: 0
}
.transform-box:nth-child(1) {
background-color: #e1c5ff
}
.transform-box:nth-child(2) {
background-color: #f8d869
}
.transform-box:nth-child(3) {
background-color: #a2e07a
}
.buying-wrapper h2,
.volume-wrapper h2,
.categories-wrapper h2,
.faq-wrapper h2 {
font-size: 45px
}
.buying-row {
display: flex;
gap: 32px;
margin-top: 50px;
justify-content: center;
}
.buying-box {
position: relative;
width: 384px;
height: 384px;
display: flex;
justify-content: center;
align-items: center;
padding: 40px;
border-radius: 100%;
text-align: center
}
.buying-box:before {
content: "";
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
border-top: 1px solid #393939;
border-right: 1px solid #393939;
border-left: 1px dashed #393939;
border-bottom: 1px dashed #393939;
border-radius: 100%;
transform: rotate(-45deg);
}
.buying-box:nth-child(2)::before {
transform: rotate(135deg);
}
.buying-box::after {
content: "";
position: absolute;
background: url(//zoombooks.ca/wp-content/themes/zoombooks/assets/img/arrow.jpg) center center no-repeat;
width: 76px;
height: 68px;
right: -54px;
z-index: 1;
}
.buying-box:last-child:after {
display: none;
}
.buying-box img {
margin: 0 auto;
}
.buying-box h3 {
font-size: 24px;
font-weight: bold
}
.buying-box p {
max-width: 261px;
margin-left: auto;
margin-right: auto;
line-height: 1.2;
}
.volume-row {
display: flex;
flex-wrap: wrap;
margin: 0 0 -30px -3%;
justify-content: center
}
.volume-box {
position: relative;
float: left;
width: 30.333333333333%;
background: #ffffff;
margin: 0 0 30px 3%;
border-top: 3px solid #10766d;
border-radius: 24px;
padding: 40px
}
.volume-box h3 {
font-size: 30px;
margin-top: 5px;
}
.volume-box .icon {
border: 2px solid #10766d;
width: 50px;
height: 50px;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
right: 52px;
top: -15px;
background-color: #ffffff;
border-radius: 50px;
}
.volume-box .btn {
width: 100%;
font-weight: normal;
margin-top: 15px
}
.categories-wrapper .top-text-center {
max-width: 650px
}
ul.categories-links {
display: flex;
align-items: center;
flex-wrap: wrap;
max-width: 1004px;
justify-content: center;
margin-left: auto;
margin-right: auto;
gap: 20px;
}
ul.categories-links li {
overflow: hidden;
padding: 0;
}
ul.categories-links li::before {
display: none;
}
ul.categories-links .btn {
font-size: 16px;
font-weight: normal;
padding-left: 30px;
padding-right: 30px
}
ul.categories-links .btn i img {
display: inline-block;
vertical-align: middle
}
ul.categories-links .btn:hover img {
-webkit-filter: invert(100%);
filter: invert(100%);
}
.inquire-row {
display: flex;
align-items: center;
column-gap: 20px;
max-width: 830px;
margin: 48px auto 0;
row-gap: 10px;
}
.inquire-row p {
margin: 0;
}
.inquire-row .btn {
white-space: nowrap;
min-width: 300px;
}
.faq-wrapper {
text-align: center
}
.all-faq {
text-align: left;
max-width: 1006px;
margin: 40px auto 0
}
.accordion-data {
position: relative;
padding: 17px 26px 17px 35px;
margin: 18px 0 0;
cursor: pointer;
background-color: #ffffff;
border: 1px solid #ffffff;
border-radius: 0;
border-radius: 30px
}
.accordion-data:has(.active) {
background-color: #ffffff
}
.accordion-data:last-child {
margin-bottom: 0;
}
.accordion-head {
color: #1f1f1e;
display: block;
font-size: 20px;
font-weight: 600;
margin: 0;
line-height: normal;
position: relative;
cursor: pointer;
padding-left: 30px;
font-family: 'ProximaNova-Semibold';
}
.accordion-data .accordion-head:after {
content: "\f067";
display: inline-block;
font-size: 18px;
line-height: 24px;
font-family: "Font Awesome 6 Pro";
font-weight: 900;
position: absolute;
left: 0;
top: 1px;
color: #0d8b8e;
}
.accordion-data .accordion-head.active:after {
content: "\f068";
}
.accordion-content {
display: none;
padding: 12px 0 0 30px;
position: relative;
cursor: pointer;
margin: 0;
}
.started-wrapper .top-text-center img {
margin: 0 auto;
}
.started-wrapper .form-box {
background: #f8f6f2;
padding: 48px 70px;
border-radius: 24px;
max-width: 1000px;
margin: 0 auto;
}
.started-wrapper .form-box h4 {
margin-top: 0
}
.started-wrapper label {
font-size: 17px;
margin: 0 0 10px 26px;
}
.started-wrapper label:has(input) {
display: flex;
column-gap: 10px;
}
.started-wrapper label:has(input):last-child {
margin-bottom: 0
}
.pickup-wrapper label:has(input) .csRadio,
.pickup-wrapper label:has(input) .csCheckbox {
margin: 0;
}
.started-wrapper ::-webkit-input-placeholder {
color: #9f9f9f;
}
.started-wrapper ::-moz-placeholder {
color: #9f9f9f;
}
.started-wrapper :-ms-input-placeholder {
color: #9f9f9f;
}
.started-wrapper :-moz-placeholder {
color: #9f9f9f;
}
.started-wrapper .selectric .label {
color: #9f9f9f;
}
.started-wrapper textarea {
height: 150px
}
.started-wrapper .btn {
display: flex;
justify-content: center;
margin: 0 auto;
min-width: 200px
}
ul.img-icon-list {
margin-top: 28px
}
ul.img-icon-list li {
padding-left: 48px;
padding-bottom: 20px
}
ul.img-icon-list li:before {
display: none;
}
ul.img-icon-list li .icon {
position: absolute;
left: 8px;
top: 0
}
ul.img-icon-list li:last-child {
padding-bottom: 0
}
.text-45 {
font-size: 45px
}
.impact-row {
display: flex;
flex-wrap: wrap;
margin: 45px auto -20px -3%;
}
.impact-box {
background: #ffffff;
border-radius: 30px;
padding: 40px 25px;
float: left;
width: 22%;
margin: 0 0 20px 3%;
text-align: center;
border-top: 2px solid #fbc3c4;
}
.impact-box .icon {
display: flex;
height: 57px;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 12px;
}
.impact-box img {
margin: 0 auto;
}
.impact-box h3 {
font-size: 25px;
margin: 10px 0;
}
.impact-box p {
margin: 0 0 15px;
color: #0d8b8e
}
.impact-box p:last-child {
margin-bottom: 0
}
.impact-box:nth-child(1) {
border-color: #fbc3c4;
}
.impact-box:nth-child(2) {
border-color: #a2e07a;
}
.impact-box:nth-child(3) {
border-color: #ffdbc0;
}
.impact-box:nth-child(4) {
border-color: #f8d868;
}
.impact-box h6 {
margin-top: 0
}
.how-work-wrapper {
padding-top: 0
}
.how-work-row {
counter-reset: num-counter;
display: flex;
flex-wrap: wrap;
justify-content: center
}
.how-work-box {
display: flex;
flex-wrap: wrap;
align-items: center;
background: #ffffff;
border-radius: 24px;
margin-top: 55px;
}
.how-work-box:first-child {
margin-top: 10px
}
.how-work-box .video-column {
float: left;
width: 50%;
padding-right: 20px;
}
.how-work-box .img-box img {
width: 100%
}
.how-work-box .text-box {
position: relative;
float: left;
width: 50%;
padding: 20px 70px 20px 30px
}
.how-work-box .text-box::before {
position: absolute;
content: counter(num-counter, decimal-leading-zero) ". ";
counter-increment: num-counter;
display: flex;
width: 66px;
height: 66px;
border-radius: 60px;
background: #0d8b8e;
border: 4px solid #ffffff;
font-size: 22px;
font-weight: 700;
align-items: center;
justify-content: center;
margin: 0 auto;
font-family: 'Gotham';
color: #ffffff;
z-index: 5;
left: -55px
}
.how-work-box:nth-child(even) {
flex-direction: row-reverse
}
.how-work-box:nth-child(even) .text-box {
padding-left: 134px;
padding-right: 30px;
}
.how-work-box:nth-child(even) .video-column {
padding-left: 20px;
padding-right: 0
}
.how-work-box:nth-child(even) .text-box::before {
left: 45px
}
.how-work-box .text-green {
color: #0d8b8e;
margin-top: -10px
}
.how-work-box ul li {
padding-bottom: 15px;
}
.how-work-box ul li:last-child {
padding-bottom: 0
}
.timeline-wrapper .container {
max-width: 1050px
}
.timeline-row {
display: flex;
flex-wrap: wrap;
row-gap: 50px
}
.timeline-box {
position: relative;
float: left;
width: 100%;
padding-right: 48%
}
.timeline-box .bg-box {
position: relative;
background-color: #f8d868;
padding: 30px 30px 30px 125px;
border-radius: 24px;
margin-top: 20px;
z-index: 5;
}
.timeline-box:before {
content: "";
position: absolute;
left: 26%;
right: 0;
border-left: 2px dashed #1f1f1e;
border-bottom: 2px dashed #1f1f1e;
height: 170px;
top: 100%;
border-bottom-left-radius: 30px
}
.timeline-box:nth-child(even):before {
left: 0;
right: 26%;
border-left: none;
border-right: 2px dashed #1f1f1e;
border-bottom-right-radius: 30px
}
.timeline-box:last-child:before {
display: none;
}
.timeline-box:nth-child(2) .bg-box {
background-color: #e1c5ff
}
.timeline-box:nth-child(3) .bg-box {
background-color: #ffdbc0
}
.timeline-box:nth-child(even) {
padding-left: 48%;
padding-right: 0
}
.timeline-box .icon {
display: flex;
align-items: center;
justify-content: center;
border: 2px solid #000000;
border-radius: 100%;
width: 50px;
height: 50px;
position: absolute;
left: 50px;
top: 30px
}
.timeline-box h3 {
font-size: 24px;
padding-left: 45px
}
.timeline-box h4 {
font-size: 20px;
margin: 0 0 8px;
}
.action-row {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin: 0 0 -20px -3%;
}
.action-box {
float: left;
width: 47%;
margin: 0 0 20px 3%;
background-color: #ffffff;
border-radius: 24px;
overflow: hidden;
max-width: 596px
}
.action-box .img-box img {
width: 100%
}
.action-box .img-box {
border-radius: 0
}
.action-box .text-box {
padding: 35px 45px 40px;
}
.action-box h3 {
font-size: 30px;
margin-bottom: 10px
}
.started-wrapper.type-2 {
text-align: center
}
.started-wrapper.type-2 .container {
max-width: 680px;
}
.started-wrapper.type-2 img {
margin: 0 auto;
}
.started-wrapper.type-2 .btn {
display: inline-flex;
width: auto;
margin: 10px auto 0;
justify-content: center;
align-items: center;
gap: 8px;
padding-left: 35px;
padding-right: 35px
}
.started-wrapper.type-2 .btn i {
margin: 0 auto;
}
.star-icon {
background-image: url(//zoombooks.ca/wp-content/themes/zoombooks/assets/img/star-2.png) !important;
background-position: 96% 30px !important;
background-repeat: no-repeat
}
a.image-thumbnail {
display: block;
}
.blog-search {
position: relative;
max-width: 440px;
margin: 25px auto 0;
}
.blog-search input[type=text],
.blog-search input[type=search] {
padding-left: 50px
}
.blog-search input[type=submit] {
position: absolute;
left: 0;
top: 0;
background: url(//zoombooks.ca/wp-content/themes/zoombooks/assets/img/search-icon.png) right center no-repeat;
padding: 26px 20px;
font-size: 0;
cursor: pointer
}
.featured-wrapper {
text-align: center
}
.featured-blog {
display: flex;
flex-wrap: wrap;
margin: 45px 0 -30px -3%;
}
.blog-box {
float: left;
width: 47%;
margin: 0 0 30px 3%;
background-color: #f8f6f2;
border-radius: 24px;
overflow: hidden;
text-align: left
}
.blog-box .img-box {
position: relative;
}
.blog-box .image-thumbnail {
padding-top: 48.33%;
}
.blog-box .image-thumbnail img {
width: 100%;
height: 100%;
object-fit: cover
}
.blog-box .img-box .btn {
position: absolute;
top: 25px;
right: 25px;
}
.blog-box .text-box {
padding: 35px 40px 48px;
}
.blog-box ul:has(i) {
display: flex;
flex-wrap: wrap;
align-items: center;
column-gap: 20px;
row-gap: 10px
}
.blog-box ul:has(i) li {
padding: 0;
display: flex;
align-items: center;
column-gap: 8px;
font-size: 15px;
color: #939393
}
.blog-box ul:has(i) i {
color: #1f1f1e;
margin-bottom: 3px
}
.blog-box ul:has(i) li::before {
display: none;
}
.blog-box h3 {
font-size: 24px;
margin: 10px 0;
}
.blog-box .text-link {
color: #0d8b8e;
font-weight: normal;
text-decoration: none;
text-transform: capitalize
}
.blog-box .text-link::after {
content: "\f061";
margin-left: 10px
}
.blog-list {
display: flex;
flex-wrap: wrap;
margin-bottom: -38px;
margin-top: 40px
}
.blog-box.layout-2 {
display: grid;
grid-template-columns: 310px auto;
background-color: #ffffff;
width: 100%;
margin: 0 0 38px;
}
.blog-box.layout-2 .image-thumbnail {
padding-top: 0;
height: 100%;
min-height: 300px
}
.blog-box.layout-2 .img-box .btn {
left: 20px;
right: auto
}
.blog-box.layout-2 .text-box {
display: flex;
flex-wrap: wrap;
flex-direction: column;
justify-content: center;
padding: 25px 40px
}
.blog-box.layout-2 h3 {
margin-top: 0;
font-size: 22px
}
.big-column {
float: left;
width: 68%;
padding-right: 42px
}
.aside-column {
float: left;
width: 32%;
}
.aside-blog-box {
width: 100%;
overflow: hidden;
border-radius: 24px;
padding: 35px 40px;
background: #ffffff
}
.aside-blog-box h3,
.newsletter-box h3,
.tags-box h3 {
font-size: 30px
}
.aside-blog-box ul {
margin-top: 20px
}
.aside-blog-box ul li {
overflow: visible;
}
.aside-blog-box ul li::before {
content: "\f02b";
color: #0d8b8e;
font-weight: 400;
top: 7px
}
.aside-blog-box ul li a {
text-decoration: none;
width: 100%;
display: flex;
justify-content: space-between;
align-items: center
}
.aside-blog-box ul li a:hover {
color: #0d8b8e;
}
.aside-blog-box ul li .num {
font-size: 15px;
color: #1f1f1e;
background: #f8f6f2;
padding: 5px 10px;
border-radius: 50px;
}
.newsletter-box {
width: 100%;
overflow: hidden;
border-radius: 24px;
padding: 35px 40px;
background: #d3ff92;
margin-top: 36px
}
.newsletter-box input:not(.btn) {
font-size: 15px;
margin-bottom: 20px
}
.tags-box {
width: 100%;
overflow: hidden;
border-radius: 24px;
padding: 35px 40px;
background: #ffffff;
margin-top: 36px
}
.tags-box ul {
display: flex;
flex-wrap: wrap;
gap: 12px;
margin-top: 20px
}
.tags-box ul li {
padding: 0
}
.tags-box ul li::before {
display: none;
}
.tags-box ul li a {
font-size: 15px;
color: #1f1f1e;
border: 1px solid #1f1f1e;
display: block;
padding: 5px 14px;
border-radius: 30px;
text-align: center;
text-decoration: none;
}
.tags-box ul li a:hover,
.tags-box ul li a:focus {
background-color: #1f1f1e;
color: #ffffff
}
.blog-pagination {
clear: both;
overflow: hidden;
margin: 50px 0 0
}
.blog-pagination .pagination {
display: flex;
flex-wrap: wrap;
gap: 9px;
justify-content: center;
width: 100%;
text-align: center;
margin: 0 !important
}
.blog-pagination .pagination>li {
display: inline-block;
padding: 0 !important;
vertical-align: top;
}
.blog-pagination .pagination>li:before {
display: none !important
}
.blog-pagination .pagination>li>a,
.blog-pagination .pagination>li>span {
border-radius: 50px !important;
display: flex;
align-items: center;
justify-content: center;
border: 1px solid #ffffff;
background: #ffffff;
color: #1d1d1d;
font-size: 15px;
font-weight: 400;
padding: 8px;
min-width: 36px;
height: 36px;
text-decoration: none
}
.blog-pagination .pagination>.active>a,
.blog-pagination .pagination>.active>a:focus,
.blog-pagination .pagination>.active>a:hover,
.blog-pagination .pagination>.active>span,
.blog-pagination .pagination>.active>span:focus,
.blog-pagination .pagination>.active>span:hover,
.blog-pagination .pagination>li>.current,
.blog-pagination .pagination>li>a:focus,
.blog-pagination .pagination>li>a:hover,
.blog-pagination .pagination>li>span:focus,
.blog-pagination .pagination>li>span:hover {
background-color: #0d8b8e;
border-color: #0d8b8e;
color: #ffffff
}
.blog-pagination .pagination>li>.prev {
padding-left: 30px;
padding-right: 30px;
}
.blog-pagination .pagination>li>.next {
padding-left: 30px;
padding-right: 30px;
}
.bdetail-wrapper {
position: relative;
}
.bdetail-wrapper::before {
position: absolute;
content: "";
position: absolute;
left: 0;
right: 0;
top: 0;
height: 686px;
background: url(//zoombooks.ca/wp-content/themes/zoombooks/assets/img/star-icon.png), url(//zoombooks.ca/wp-content/themes/zoombooks/assets/img/star-2.png), url(//zoombooks.ca/wp-content/themes/zoombooks/assets/img/line-pattern.png);
background-color: #f8f6f2;
background-repeat: no-repeat;
background-position: 2% 30%, 98% 40%, 90% 20%
}
.bdetail-wrapper .container {
max-width: 938px;
position: relative;
z-index: 3;
}
.bdetail-wrapper .top-text {
max-width: 698px;
margin: 0 auto 40px;
}
.bdetail-wrapper img {
border-radius: 24px;
}
.bdetail-wrapper .top-text p:has(.btn) {
position: relative;
padding-left: 44px
}
.bdetail-wrapper .top-text p:has(.btn) img {
position: absolute;
left: 0;
top: 0
}
.bdetail-wrapper .top-text h1 {
margin-top: 15px;
}
.bdetail-wrapper h1,
.bdetail-wrapper h2 {
font-size: 45px;
}
.bdetail-wrapper h3 {
font-size: 24px;
}
.bdetail-wrapper ul li:before {
content: "\f061";
color: #5ebeb5;
}
.bdetail-wrapper .top-text ul:has(i) {
display: flex;
flex-wrap: wrap;
align-items: center;
column-gap: 20px;
row-gap: 10px;
margin-top: 20px
}
.bdetail-wrapper .top-text ul:has(i) li {
padding: 0;
display: flex;
align-items: center;
column-gap: 8px;
font-size: 15px;
color: #939393
}
.bdetail-wrapper .top-text ul:has(i) i {
color: #1f1f1e;
margin-bottom: 3px
}
.bdetail-wrapper .top-text ul:has(i) li::before {
display: none;
}
.bdetail-wrapper .bottom-content {
padding: 40px 30px 0;
}
.share-row {
display: flex;
flex-wrap: wrap;
column-gap: 25px;
row-gap: 15px;
justify-content: space-between;
margin-top: 30px;
}
ul.taglist {
display: flex;
flex-wrap: wrap;
gap: 12px;
align-items: center;
margin: 0;
}
ul.taglist li {
padding: 0
}
ul.taglist li::before,
ul.share-icon li::before {
display: none;
}
ul.taglist li a {
font-size: 15px;
color: #1f1f1e;
border: 1px solid #1f1f1e;
display: block;
padding: 5px 14px;
border-radius: 30px;
text-align: center;
text-decoration: none;
}
ul.taglist li a:hover,
ul.taglist li a:focus {
background-color: #1f1f1e;
color: #ffffff
}
ul.share-icon {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin: 0 !important;
align-items: center
}
ul.share-icon li {
padding: 0
}
ul.share-icon i {
margin: 0 !important;
color: inherit !important
}
ul.share-icon a {
color: #767676;
font-size: 15px;
}
ul.share-icon a:hover {
color: #0d8b8e
}
.page-nav {
margin-top: 36px;
}
.page-nav a {
font-size: 20px;
font-weight: bold;
color: #1f1f1e;
text-decoration: none
}
.page-nav a i {
color: #5ebeb5;
font-weight: normal;
font-size: 17px;
}
.page-nav .left-nav i {
margin-right: 8px;
}
.page-nav .right-nav i {
margin-left: 8px;
}
.page-nav .left-nav {
float: left;
width: 50%
}
.page-nav .right-nav {
float: left;
width: 50%;
text-align: right
}
.page-nav p:has(span) {
display: flex;
align-items: center;
gap: 20px;
font-size: 18px;
color: #1f1f1e;
max-width: 333px;
margin-top: 25px;
}
.page-nav p span {
font-size: 18px;
color: #1f1f1e
}
.page-nav img {
border-radius: 8px;
min-width: 80px;
width: 80px;
}
.page-nav .right-nav p:has(span) {
margin-left: auto
}
.page-nav .right-nav span:first-child {
order: 2
}
.page-nav a:hover {
color: #5ebeb5;
}
.impact-wrapper.layout-2 .top-text-center {
max-width: 920px
}
.impact-wrapper.layout-2 .impact-box {
padding: 30px 25px;
border-top: 2px solid #fbc3c4
}
.impact-wrapper.layout-2 .impact-box:nth-child(2) {
border-color: #f8d868
}
.impact-wrapper.layout-2 .impact-box:nth-child(3) {
border-color: #e1c5ff
}
.impact-wrapper.layout-2 .impact-box:nth-child(4) {
border-color: #a2e07a
}
.impact-wrapper.layout-2 .impact-box h3 {
font-size: 36px;
margin: 25px 0 8px
}
.impact-wrapper.layout-2 .impact-box h4 {
font-size: 20px;
margin: 0 0 10px
}
.progress-bar {
position: relative;
height: 10px;
background: #e4e3e2;
border-radius: 8px;
margin-top: 48px;
}
.progress-data {
position: absolute;
top: 0;
bottom: 0;
left: 0;
background-color: #5dbeb5;
border-radius: 8px;
}
.progress-data::after {
content: "";
position: absolute;
right: -2px;
top: -4px;
width: 18px;
height: 18px;
border-radius: 18px;
border: 4px solid #5dbeb5;
background-color: #ffffff;
}
.progress-data small {
background: #1f1f1e;
font-size: 12px;
color: #ffffff;
padding: 2px 8px;
border-radius: 10px;
position: absolute;
top: -35px;
right: -15px;
min-width: 40px
}
.progress-data small::after {
content: "\f0d7";
display: inline-block;
font-size: 16px;
line-height: 1;
font-family: "Font Awesome 6 Pro";
font-weight: 900;
top: 12.89px;
text-align: center;
position: absolute;
color: #1f1f1e;
left: 50%;
transform: translateX(-50%);
}
.journey-wrapper .end-to-end {
padding: 0;
border-radius: 0;
background-color: transparent;
margin: 0;
}
.journey-wrapper .end-to-end .column::before {
display: none;
}
.journey-wrapper .end-to-end .column .year {
position: relative;
display: flex;
width: 70px;
height: 70px;
border-radius: 60px;
background: #d3ff92;
font-size: 18px;
font-weight: 700;
align-items: center;
justify-content: center;
margin: 0 auto;
font-family: 'Gotham';
z-index: 5;
}
.journey-wrapper .end-to-end .column::after {
top: 35px
}
.journey-wrapper .end-to-end .column:nth-child(2) .year {
background-color: #e1c5ff
}
.journey-wrapper .end-to-end .column:nth-child(3) .year {
background-color: #ffdbc0
}
.journey-wrapper .end-to-end .column:nth-child(4) .year {
background-color: #f8d869
}
.journey-wrapper .end-to-end h3 {
font-size: 20px;
font-weight: bold
}
.tag-btn {
background-color: #f8f6f2;
font-size: 15px;
color: #1f1f1e;
padding: 5px 20px;
border-radius: 30px;
display: inline-flex;
margin-top: 20px;
}
.small-tagline.bg-btn {
background-color: #f8f6f2;
font-size: 15px;
color: #1f1f1e;
padding: 6px 23px;
border-radius: 30px;
display: inline-flex;
font-weight: normal;
font-family: 'ProximaNova-Regular';
line-height: 18px
}
.bg-light .small-tagline.bg-btn {
background-color: #ffffff;
}
.small-tagline.bg-btn i {
margin: 0 5px 0 0
}
.measurable-wrapper .top-text-center {
max-width: 790px
}
.measurable-row {
display: flex;
flex-wrap: wrap;
margin: 0 0 -3% -3%;
}
.measurable-box {
position: relative;
float: left;
width: 47%;
margin: 0 0 3% 3%;
background-color: #ffffff;
border-radius: 24px;
padding: 40px
}
.measurable-box h3 {
font-size: 24px;
margin: 20px 0 10px
}
.measurable-box .corner-icon {
text-align: center;
position: absolute;
right: 20px;
top: 10px;
padding: 30px 0
}
.measurable-box .corner-icon i {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
color: #e8e8e8;
line-height: 1;
font-size: 120px;
z-index: 0;
}
.measurable-box .corner-icon * {
position: relative;
z-index: 2;
}
.measurable-box .corner-icon p {
font-size: 16px;
}
.measurable-box .corner-icon p strong {
display: block;
font-size: 30px;
font-weight: bold;
font-family: 'ProximaNova-Bold';
}
.measurable-box .corner-icon p small {
display: flex;
align-items: center;
font-size: 15px;
color: #0d8b8e;
justify-content: center;
gap: 8px;
margin-top: 2px
}
.aside-inline-img.commitment {
background-color: #ffffff;
margin-top: 3%;
border-radius: 24px;
overflow: hidden;
}
.aside-inline-img.commitment .container {
padding: 0
}
.aside-inline-img.commitment .img-box {
position: relative;
}
.aside-inline-img.commitment .img-box .bg-tagline {
background-color: rgba(255, 255, 255, 0.9);
border-radius: 20px;
padding: 20px;
position: absolute;
right: 20px;
bottom: 20px;
text-align: center;
font-size: 15px
}
.aside-inline-img.commitment .img-box .bg-tagline strong {
font-size: 30px;
color: #0d8b8e;
font-weight: bold;
font-family: 'ProximaNova-Bold';
display: block;
}
.aside-inline-img.commitment .text-box {
padding: 15px 40px 15px 50px
}
.aside-inline-img.commitment .small-tagline.bg-btn {
background-color: #f8f6f2;
margin-bottom: 10px !important;
font-family: 'ProximaNova-Regular';
}
.aside-inline-img.commitment ul:has(.btn) {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin-top: 30px
}
.aside-inline-img.commitment ul:has(.btn) li {
padding: 0;
overflow: visible;
}
.aside-inline-img.commitment ul:has(.btn) li::before {
display: none;
}
.aside-inline-img.commitment ul:has(.btn) .btn {
border: none;
font-size: 15px;
color: #1f1f1e;
padding-left: 14px !important;
padding-right: 14px !important
}
.aside-inline-img.commitment ul:has(.btn) li:first-child .btn {
background-color: #ffdbc0;
}
.aside-inline-img.commitment ul:has(.btn) li:nth-child(2) .btn {
background-color: #d3ff92;
}
.aside-inline-img.commitment ul:has(.btn) li:nth-child(3) .btn {
background-color: #e1c5ff;
}
.aside-inline-img.pulp {
border-radius: 30px;
overflow: hidden;
}
.aside-inline-img.pulp .container {
padding: 0
}
.aside-inline-img.pulp .img-box {
position: relative;
}
.aside-inline-img.pulp .icon {
width: 60px;
height: 60px;
border-radius: 12px;
margin: 0;
background: #ffffff;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 45px;
left: -30px
}
.aside-inline-img.pulp.reverse .text-box {
padding: 15px 60px 15px 50px
}
.pulp .bg-row {
display: grid;
grid-template-columns: 1fr 1fr;
column-gap: 28px;
row-gap: 20px;
margin: 30px 0;
}
.pulp .bg-row li {
background-color: #ffffff;
padding: 15px 20px;
font-size: 15px;
border-radius: 24px;
text-align: center
}
.pulp .bg-row li::before {
display: none;
}
.pulp .bg-row li strong {
font-size: 30px;
color: #f8d869;
display: block;
font-weight: bold;
font-family: 'ProximaNova-Bold';
}
.pulp .bg-row li:nth-child(even) strong {
color: #0d8b8e
}
.partner-list {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 30px;
clear: both;
padding-top: 32px
}
.partner-list .column {
padding: 30px;
background-color: #f1fef1;
border-radius: 24px;
font-size: 15px
}
.partner-list h3 {
font-size: 18px;
}
.partner-list p {
margin-bottom: 15px;
}
.partner-list p:last-child {
margin-bottom: 0;
}
.partner-list .capacity {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.partner-list .icon {
display: flex;
justify-content: space-between;
align-items: center;
gap: 8px;
}
.partner-list .icon img {
min-width: 49px;
width: 49px;
}
.partner-list .icon span {
background-color: #ffffff;
font-size: 15px;
color: #1f1f1e;
padding: 5px 20px;
border-top-left-radius: 20px;
border-bottom-left-radius: 20px;
display: inline-flex;
margin-right: -30px
}
.promise-box {
background-color: #a2e07a;
border-radius: 24px;
display: flex;
justify-content: center;
padding: 0 15px;
margin-top: 30px;
}
.promise-box .box {
position: relative;
padding: 35px 0 35px 134px;
width: 100%;
max-width: 828px;
}
.promise-box .box .icon {
position: absolute;
left: 5px;
top: 40px;
display: flex;
align-items: center;
justify-content: center;
border: 2px solid #000000;
border-radius: 100%;
width: 100px;
height: 100px;
}
.promise-box h3 {
color: #1f1f1e;
font-size: 30px;
margin: 0 0 10px
}
.aside-inline-img.science {
background-color: #ffffff;
border-radius: 24px;
overflow: hidden;
padding: 40px !important
}
.aside-inline-img.science .container {
align-items: flex-start;
padding: 0
}
.aside-inline-img.science .img-box {
position: relative;
}
.aside-inline-img.science .img-box .bg-tagline {
background-color: #f8f6f2;
border-radius: 20px;
padding: 10px 20px;
position: absolute;
right: -12px;
top: -12px;
text-align: center;
font-size: 15px
}
.aside-inline-img.science .img-box .bg-tagline strong {
font-size: 30px;
color: #0d8b8e;
font-weight: bold;
font-family: 'ProximaNova-Bold';
display: block;
}
.aside-inline-img .img-box .img-box {
width: 100% !important;
margin: 0 !important;
padding: 0 !important
}
.aside-inline-img .video-box {
display: flex;
width: 100%;
flex-wrap: wrap
}
.aside-inline-img.science h3 {
padding-top: 20px;
}
.fact-row {
position: relative;
padding: 0 0 0 78px;
margin-top: 30px;
}
.fact-row img {
position: absolute;
left: 0;
top: 5px
}
.fact-row h4 {
font-size: 20px;
margin: 0 0 6px;
}
ul.box-type-row {
width: 100%;
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 30px;
margin-top: 30px;
}
ul.box-type-row li::before {
display: none;
}
ul.box-type-row li {
text-align: center;
border-radius: 20px;
background-color: #a2e07a;
padding: 23px;
}
ul.box-type-row li strong {
display: block;
font-size: 35px;
font-weight: bold;
font-family: 'ProximaNova-Bold';
}
ul.box-type-row li:nth-child(2) {
background-color: #e1c5ff
}
ul.box-type-row li:nth-child(3) {
background-color: #f8d869
}
ul.box-type-row li:nth-child(4) {
background-color: #ffdbc0
}
.sustainability-wrapper .container {
max-width: 1140px
}
.sustainability-row {
display: flex;
flex-wrap: wrap;
margin: 0 0 -3% -3%;
}
.sustainability-row .column {
float: left;
width: 30.33333333%;
margin: 0 0 3% 3%;
background: #e1c5ff;
border-radius: 24px;
padding: 36px 35px;
text-align: center
}
.sustainability-row .column:nth-child(2) {
background-color: #f8d869
}
.sustainability-row .column:nth-child(3) {
background-color: #a2e07a
}
.sustainability-row .icon {
display: flex;
align-items: flex-end;
justify-content: center;
height: 60px;
}
.sustainability-row .column h3 {
font-size: 22px;
margin: 15px 0 8px;
}
.heading:has(.library-logo) .hl {
margin-left: -10px;
margin-right: -10px;
padding-left: 10px;
padding-right: 10px;
}
.heading:has(.library-logo) .hl img {
margin: 0;
}
.lib-wrapper {
text-align: center
}
.lib-wrapper .top-text-center {
max-width: 1070px;
margin-bottom: 70px
}
.program-row {
display: flex;
flex-wrap: wrap;
margin: 40px 0 -3% -3%;
}
.program-box {
position: relative;
background-color: #ffffff;
border-radius: 30px;
text-align: left;
padding: 50px;
width: 47%;
margin: 0 0 3% 3%;
}
.program-box.ribbon::before {
content: "";
background: url(//zoombooks.ca/wp-content/themes/zoombooks/assets/img/ribbon-img.png) 0 0 no-repeat;
width: 160px;
height: 134px;
position: absolute;
right: -5px;
top: -5px;
}
.promise-box.layout-2 {
text-align: left;
padding: 20px
}
.promise-box.layout-2 .box {
max-width: 960px
}
.promise-box.layout-2 h3 {
font-size: 24px;
}
.promise-box.layout-2 .box .icon {
top: 30px
}
.works-wrapper {
text-align: center
}
.works-row {
display: flex;
flex-wrap: wrap;
gap: 40px;
justify-content: center;
margin-top: 45px;
row-gap: 20px
}
.works-box {
position: relative;
width: 382px;
height: 382px;
border: 2px solid #f8d868;
border-radius: 100%;
z-index: 5;
}
.works-box:nth-child(2) {
border-color: #e1c5ff;
z-index: 4;
}
.works-box:nth-child(2)::before {
background-color: #e1c5ff
}
.works-box:nth-child(3) {
border-color: #ffdbc0;
z-index: 3;
}
.works-box .box {
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
background: #ffffff;
border-radius: 100%;
padding: 30px 50px 20px;
font-size: 14px;
}
.works-box::before {
content: "\f061";
position: absolute;
font-family: "Font Awesome 6 Pro";
width: 70px;
height: 70px;
border-radius: 70px;
background-color: #f8d868;
color: #ffffff;
right: -60px;
top: 50%;
transform: translateY(-50%);
font-size: 30px;
display: flex;
align-items: center;
justify-content: center;
}
.works-box:last-child:before {
display: none;
}
.works-box .icon {
border: 2px solid #050b0b;
height: 50px;
width: 50px;
border-radius: 50px;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto 15px;
}
.works-box .small-tagline {
font-size: 18px;
font-weight: bold;
font-family: 'Gotham';
}
.works-box .small-tagline+* {
margin-top: 5px !important;
}
.works-box h3 {
font-size: 20px;
}
.testimonial-slider.owl-carousel {
margin-top: 45px
}
.textimonial-wrapper {
text-align: center;
background: url(//zoombooks.ca/wp-content/themes/zoombooks/assets/img/bg-circle-1.png), url(//zoombooks.ca/wp-content/themes/zoombooks/assets/img/bg-circle-2.png);
background-position: left center, right 70%;
background-repeat: no-repeat;
background-color: #f8f6f2;
}
.testimonial-box {
background-color: #ffffff;
padding: 30px 50px;
border-radius: 24px;
text-align: left
}
.testimonial-box p {
margin-bottom: 15px;
font-size: 18px;
}
.testimonial-box .icon {
height: 68px;
}
.testimonial-box .icon img {
height: 100%;
}
.testimonial-box h3 {
font-size: 18px;
font-weight: normal;
font-family: 'ProximaNova-Regular';
margin: 0;
}
.testimonial-box h3 small {
display: block;
}
.testimonial-slider.owl-carousel .owl-item:nth-child(odd) .testimonial-box {
background-color: #0d8b8e
}
.testimonial-slider.owl-carousel .owl-item:nth-child(odd) .testimonial-box * {
color: #ffffff
}
.libraryfrom .form-box h4 {
font-size: 24px;
margin-bottom: 35px
}
.libraryfrom .btn {
position: relative;
align-items: center;
display: inline-flex;
}
.libraryfrom .btn input {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
opacity: 0;
cursor: pointer
}
.libraryfrom .btn.arrow::after {
content: "\f061";
}
.choice-row {
display: flex;
column-gap: 60px;
row-gap: 10px;
margin-top: 20px;
flex-wrap: wrap
}
.choice-row label {
margin-top: 0;
margin-bottom: 0
}
.all-faq.not-open {
max-width: 100%;
display: grid;
grid-template-columns: 1fr 1fr;
column-gap: 34px;
margin-top: 30px;
align-items: flex-start;
}
.review-wrapper-data {
background: #f8f6f2 url(//zoombooks.ca/wp-content/themes/zoombooks/assets/img/bg-circle-1.png) left 40% no-repeat;
padding: 60px 0;
background-size: 130px
}
.review-grid {
display: flex;
flex-wrap: wrap;
margin: 0 0 37px;
background-color: #ffffff;
border-radius: 24px;
position: relative;
align-items: center
}
.review-grid .img-box {
float: left;
width: 42%;
border-top-left-radius: 24px;
overflow: hidden;
border-bottom-left-radius: 24px;
}
.review-grid .text-box {
float: left;
width: 58%;
padding: 30px 80px 30px 50px
}
.review-grid::before {
content: "";
position: absolute;
padding: 35px;
right: -25px;
top: -15px;
background-image: url(//zoombooks.ca/wp-content/themes/zoombooks/assets/img/star-2.png) !important;
background-repeat: no-repeat;
}
.review-grid h3 {
font-size: 30px;
font-weight: 600;
font-family: 'ProximaNova-Semibold';
}
.review-profile {
display: grid;
grid-template-columns: 58px auto;
gap: 20px;
align-items: center;
margin-top: 30px;
}
.review-profile img {
border-radius: 100%;
}
.review-profile h4 {
font-family: 'ProximaNova-Bold';
font-weight: bold;
font-size: 19px;
margin: 0;
}
.review-list {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 32px;
}
.review-boxes {
float: left;
width: 100%;
background: #ffffff;
border-radius: 24px;
padding: 46px;
overflow: hidden;
}
.review-boxes:has(img) {
padding: 0
}
.review-boxes:nth-child(2),
.review-boxes:nth-child(4),
.review-boxes:nth-child(8) {
background-color: #0d8b8e;
}
.review-boxes:nth-child(2) *,
.review-boxes:nth-child(4) *,
.review-boxes:nth-child(8) * {
color: #ffffff
}
.review-boxes img {
width: 100%;
height: 100%;
object-fit: cover
}
.review-boxes p {
font-size: 18px;
}
.review-boxes h4 {
font-size: 18px;
font-weight: 600;
font-family: 'ProximaNova-Regular';
margin-top: 50px;
}
.review-boxes h4 small {
display: block;
font-family: 'ProximaNova-Regular';
font-weight: normal;
margin-top: 5px
}
a.magnific-gallery .img-box::before {
content: "\f00e" !important;
color: #ffffff;
background: rgba(0, 0, 0, .4)
}
a.magnific-gallery .img-box::after {
background: rgba(0, 0, 0, .4)
} .datetimepicker {
background: #FFFFFF;
border-bottom: 1px solid #BBBBBB;
border-left: 1px solid #CCCCCC;
border-right: 1px solid #CCCCCC;
border-top: 1px solid #CCCCCC;
color: #333333;
padding: 8px;
padding-left: 0px;
padding-top: 2px;
position: absolute;
z-index: 999;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: none;
border-radius: 4px;
-webkit-box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.22);
-moz-box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.22);
box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.22);
}
.datetimepicker iframe {
position: absolute;
left: 0;
top: 0;
width: 75px;
height: 210px;
background: transparent;
border: none;
} .datetimepicker button {
border: none !important;
}
.noselect {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;
}
.noselect::selection {
background: transparent;
}
.noselect::-moz-selection {
background: transparent;
}
.datetimepicker.inline {
display: inline-block;
position: static;
box-shadow: none;
}
.datetimepicker * {
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0px;
margin: 0px;
font-weight: normal;
}
.datetimepicker .datepicker,
.datetimepicker .timepicker {
display: none;
}
.datetimepicker .datepicker.active,
.datetimepicker .timepicker.active {
display: block;
}
.datetimepicker .datepicker {
width: 224px;
float: left;
margin-left: 8px;
}
.datetimepicker.showweeks .datepicker {
width: 256px;
}
.datetimepicker .timepicker {
width: 80px;
float: left;
text-align: center;
margin-left: 8px;
margin-top: 0px;
}
.datetimepicker .datepicker.active+.timepicker {
margin-top: 8px;
margin-bottom: 3px
}
.datetimepicker .mounthpicker {
position: relative;
text-align: center;
}
.datetimepicker .prev,
.datetimepicker .next,
.datetimepicker .today_button {
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFoAAAAeCAYAAACsYQl4AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDozQjRCQjRGREU4MkNFMzExQjRDQkIyRDJDOTdBRUI1MCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpCQjg0OUYyNTZDODAxMUUzQjMwM0IwMERBNUU0ODQ5NSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpCQjg0OUYyNDZDODAxMUUzQjMwM0IwMERBNUU0ODQ5NSIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChXaW5kb3dzKSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkI5NzE3MjFBN0E2Q0UzMTFBQjJEQjgzMDk5RTNBNTdBIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjNCNEJCNEZERTgyQ0UzMTFCNENCQjJEMkM5N0FFQjUwIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+aQvATgAAAfVJREFUeNrsmr1OwzAQxzGtkPjYEAuvVGAvfQIGRKADE49gdLwDDwBiZ2RhQUKwICQkWLsgFiRQuIBTucFJ/XFp4+hO+quqnZ4uvzj2nV2RpukCW/22yAgYNINmc7du7DcghCjrkqgOKjF1znpt6rZ0AGWQj7TvCU8d9UM+QAGDrhdyc2Bnc1WVVPBev9V8lBnY+rDwncWZThG4xk4lmxtJy2AHgoY/FySgbSBPwPZ8mEXbQx3aDERb0EbYAYFC7pcAtAvkMWwC0D3NX58S9D/YnoGC7nPWr3Dg9JTbtuHhDShBT8D2CBSK/iIEvVXxpuxSgh7DdgwUTL4iA92zmJb6lKB/YTsECmV+IgK947AGDIqgQ/LojsO135Hn51l2cWlov0JdGNrPUceueXRwilSVgkUyom9Rd6gbLfYTDeO+1v6orn0InTogYDGUkYLO3/wc9BdqqTCKP1Tfi+oTIaCBIL2TES+GTyruT9S61p6BHam+99DFEAgLFklYsIBHwSI9QY80H5ta+1rB/6ovaKihBJeEJbgLbBlQgl+j3lDPqA2tfQV1j3pVn8s+oKHGTSVJ+FqDLeR5bCqJ2E/BCycsoLZETXaKGs7rhKVt+9HZScrZNMi88V8P7LlDbvOZYaJVpMMmBCT4n0o8dTBoNgbdWPsRYACs3r7XyNfbnAAAAABJRU5ErkJggg==);
}
.datetimepicker .prev {
float: left;
background-position: -20px 0px;
}
.datetimepicker .today_button {
float: left;
background-position: -70px 0px;
margin-left: 5px;
}
.datetimepicker .next {
float: right;
background-position: 0px 0px;
}
.datetimepicker .next,
.datetimepicker .prev,
.datetimepicker .today_button {
background-color: transparent;
background-repeat: no-repeat;
border: 0px none currentColor;
cursor: pointer;
display: block;
height: 30px;
opacity: 0.5;
outline: medium none currentColor;
overflow: hidden;
padding: 0px;
position: relative;
text-indent: 100%;
white-space: nowrap;
width: 20px;
}
.datetimepicker .timepicker .prev,
.datetimepicker .timepicker .next {
float: none;
background-position: -40px -15px;
height: 15px;
width: 30px;
display: block;
margin-left: 14px;
margin-top: 7px;
}
.datetimepicker .timepicker .prev {
background-position: -40px 0px;
margin-bottom: 7px;
margin-top: 0px;
}
.datetimepicker .timepicker .time_box {
height: 151px;
overflow: hidden;
border-bottom: 1px solid #DDDDDD;
}
.datetimepicker .timepicker .time_box>div>div {
background: #F5F5F5;
border-top: 1px solid #DDDDDD;
color: #666666;
font-size: 12px;
text-align: center;
border-collapse: collapse;
cursor: pointer;
border-bottom-width: 0px;
height: 25px;
line-height: 25px;
}
.datetimepicker .timepicker .time_box>div>div:first-child {
border-top-width: 0px;
}
.datetimepicker .today_button:hover,
.datetimepicker .next:hover,
.datetimepicker .prev:hover {
opacity: 1;
}
.datetimepicker .label {
display: inline;
position: relative;
z-index: 9999;
margin: 0;
padding: 5px 3px;
font-size: 14px;
line-height: 20px;
font-weight: 600;
background-color: #fff;
float: left;
width: 182px;
text-align: center;
cursor: pointer;
color: #000
}
.datetimepicker .label:hover {
text-decoration: underline;
}
.datetimepicker .label>.select {
border: 1px solid #ccc;
position: absolute;
right: 0px;
top: 30px;
z-index: 101;
display: none;
background: #fff;
max-height: 160px;
overflow-y: hidden;
}
.datetimepicker .label>.select.monthselect {
right: -7px;
}
.datetimepicker .label>.select.yearselect {
right: 2px;
}
.datetimepicker .label>.select>div>.option:hover {
color: #fff;
background: #0d8b8e;
}
.datetimepicker .label>.select>div>.option {
padding: 2px 10px 2px 5px;
}
.datetimepicker .label>.select>div>.option.current {
background: #0d8b8e;
box-shadow: #0d8b8e 0px 1px 3px 0px inset;
color: #fff;
}
.datetimepicker .date.current {
background: #0d8b8e;
box-shadow: #0d8b8e 0px 1px 3px 0px inset;
color: #fff;
}
.datetimepicker .month {
width: 90px;
text-align: right;
}
.datetimepicker .calendar {
clear: both;
margin: 0;
}
.datetimepicker .year {
width: 56px;
}
.datetimepicker .calendar table {
border-collapse: collapse !important;
width: 100%;
border: none;
}
.datetimepicker .calendar td>div {
padding: 5px;
}
.datetimepicker .calendar th {
height: 25px;
}
.datetimepicker .calendar td,
.datetimepicker .calendar th {
width: 14.2857142%;
background: #F5F5F5;
border: 1px solid #DDDDDD;
color: #666666;
font-size: 12px;
text-align: right;
padding: 0px;
border-collapse: collapse;
cursor: pointer;
height: 25px;
}
.datetimepicker.showweeks .calendar td,
.datetimepicker.showweeks .calendar th {
width: 12.5%;
}
.datetimepicker .calendar th {
background: #F1F1F1;
}
.datetimepicker .calendar td.today {
color: #a2e07a;
}
.datetimepicker .calendar td.default,
.datetimepicker .calendar td.current,
.datetimepicker .timepicker .time_box>div>div.current {
background: #0d8b8e;
box-shadow: #0d8b8e 0px 1px 3px 0px inset;
color: #fff !important;
}
.datetimepicker .calendar td.current>div {
color: #fff !important;
}
.datetimepicker .calendar td.other_month,
.datetimepicker .calendar td.disabled,
.datetimepicker .time_box>div>div.disabled {
opacity: 0.5;
}
.datetimepicker .calendar td.other_month.disabled {
opacity: 0.2;
}
.datetimepicker .calendar td:hover,
.datetimepicker .timepicker .time_box>div>div:hover {
color: #ffffff !important;
background: #0d8b8e !important;
box-shadow: none !important;
}
.datetimepicker .calendar td.disabled:hover,
.datetimepicker .timepicker .time_box>div>div.disabled:hover {
color: inherit !important;
background: inherit !important;
box-shadow: inherit !important;
}
.datetimepicker .calendar td.disabled:hover div,
.datetimepicker .timepicker .time_box>div>div.disabled:hover div {
color: #ffffff !important;
}
.disabled {
cursor: not-allowed !important;
}
.datetimepicker .calendar td:hover div,
.datetimepicker .timepicker .time_box>div>div:hover div {
color: #fff !important;
}
.datetimepicker .calendar th {
text-align: center;
color: #999;
cursor: default;
}
.datetimepicker .copyright {
color: #ccc !important;
font-size: 10px;
clear: both;
float: none;
margin-left: 8px;
}
.datetimepicker .copyright a {
color: #eee !important;
}
.datetimepicker .copyright a:hover {
color: #aaa !important;
}
.time_box {
position: relative;
border: 1px solid #ccc;
}
.scrollbar>.scroller {
background: #ccc !important;
height: 20px;
border-radius: 3px;
}
.scrollbar {
position: absolute;
width: 7px;
right: 0px;
top: 0px;
bottom: 0px;
cursor: pointer;
}
.scroller_box {
position: relative;
}  .owl-carousel,
.owl-carousel .owl-item {
-webkit-tap-highlight-color: transparent;
position: relative
}
.owl-carousel {
display: none;
width: 100%;
z-index: 1
}
.owl-carousel .owl-stage {
display: flex;
position: relative;
-ms-touch-action: pan-Y;
touch-action: pan-Y;
-moz-backface-visibility: hidden;
backface-visibility: hidden
}
.owl-carousel .owl-stage:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0
}
.owl-carousel .owl-stage-outer {
position: relative;
overflow: hidden;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0)
}
.owl-carousel .owl-item,
.owl-carousel .owl-wrapper {
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-ms-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0)
}
.owl-carousel .owl-item {
display: flex;
min-height: 1px;
float: left;
width: 100%;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-touch-callout: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none
}
.owl-carousel .owl-item img {
display: block;
}
.owl-carousel .owl-dots.disabled,
.owl-carousel .owl-nav.disabled {
display: none
}
.no-js .owl-carousel,
.owl-carousel.owl-loaded {
display: block
}
.owl-carousel.owl-loading {
opacity: 0;
display: block
}
.owl-carousel.owl-hidden {
opacity: 0
}
.owl-carousel.owl-refresh .owl-item {
visibility: hidden
}
.owl-carousel.owl-grab {
cursor: move;
cursor: grab
}
.owl-carousel.owl-rtl {
direction: rtl
}
.owl-carousel.owl-rtl .owl-item {
float: right
}
.owl-carousel .animated {
animation-duration: 1s;
animation-fill-mode: both
}
.owl-carousel .owl-animated-in {
z-index: 0
}
.owl-carousel .owl-animated-out {
z-index: 1
}
.owl-carousel .fadeOut {
animation-name: fadeOut
}
@keyframes fadeOut {
0% {
opacity: 1
}
100% {
opacity: 0
}
}
.owl-height {
transition: height .5s ease-in-out
}
.owl-carousel .owl-item .owl-lazy {
opacity: 0
}
.owl-carousel .owl-item img.owl-lazy {
transform-style: preserve-3d
}
.owl-carousel .owl-video-wrapper {
position: relative;
height: 100%;
background: #0b0b0b
}
.owl-carousel .owl-video-play-icon {
position: absolute;
height: 80px;
width: 80px;
left: 50%;
top: 50%;
margin-left: -40px;
margin-top: -40px;
background: url(//zoombooks.ca/wp-content/themes/zoombooks/assets/css/owl.video.play.png) no-repeat;
cursor: pointer;
z-index: 1;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transition: transform .1s ease
}
.owl-carousel .owl-video-play-icon:hover {
-ms-transform: scale(1.3, 1.3);
transform: scale(1.3, 1.3)
}
.owl-carousel .owl-video-playing .owl-video-play-icon,
.owl-carousel .owl-video-playing .owl-video-tn {
display: none
}
.owl-carousel .owl-video-tn {
opacity: 0;
height: 100%;
background-position: center center;
background-repeat: no-repeat;
background-size: contain;
transition: opacity .4s ease
}
.owl-carousel .owl-video-frame {
position: relative;
z-index: 1;
height: 100%;
width: 100%
}
.owl-carousel .owl-dots {
display: flex;
margin: 0 auto;
clear: both;
overflow: hidden;
padding-top: 25px;
text-align: center;
align-items: center;
justify-content: center
}
.owl-carousel .owl-dot {
cursor: pointer;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none
}
.owl-carousel .owl-dot {
position: relative;
display: inline-block;
width: 10px;
height: 10px;
margin: 2px 4px;
border: 2px solid #a2e07a;
font-size: 0;
line-height: 0;
cursor: pointer;
border-radius: 20px;
background-color: #a2e07a
}
.owl-carousel .owl-dot span {
display: none
}
.owl-carousel .owl-dot.active,
.owl-carousel .owl-dot:hover {
background-color: #1f1f1e;
border-color: #1f1f1e;
}
.owl-carousel .owl-nav .owl-next,
.owl-carousel .owl-nav .owl-prev {
background-color: #ffffff;
cursor: pointer;
position: absolute;
left: -13px;
top: 50%;
margin-top: -19px;
width: 38px;
height: 38px;
border: #ffffff;
border-radius: 60px;
display: inline-block;
font-size: 0;
z-index: 98;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-tap-highlight-color: transparent;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}
.owl-carousel .owl-nav .owl-next {
left: auto;
right: -13px
}
.owl-carousel .owl-nav .owl-next.disabled,
.owl-carousel .owl-nav .owl-prev.disabled {
opacity: .2;
cursor: not-allowed
}
.owl-carousel .owl-nav .owl-next:before,
.owl-carousel .owl-nav .owl-prev:before {
content: "\f053";
font-size: 18px;
font-family: "Font Awesome 6 Pro";
color: #1f1f1e;
font-weight: 900;
line-height: 1;
display: block;
margin: 0 2px;
position: absolute;
top: 50%;
left: 42%;
transition: .2s ease-in-out;
-moz-transition: .2s ease-in-out;
-moz-transform: translate(-50%, -50%) rotate(135deg);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%)
}
.owl-carousel .owl-nav .owl-next:before {
left: 46%;
content: "\f054"
}
.owl-carousel.long-arrow .owl-nav .owl-next,
.owl-carousel.long-arrow .owl-nav .owl-prev {
width: 80px;
background: none !important
}
.owl-carousel.long-arrow .owl-nav .owl-next:before,
.owl-carousel.long-arrow .owl-nav .owl-prev:before {
color: #1f1f1e;
font-size: 23px;
}
.owl-carousel.long-arrow .owl-nav .owl-prev:before {
left: 2px;
}
.owl-carousel.long-arrow .owl-nav .owl-next:before {
left: auto;
right: 0;
}
.owl-carousel.long-arrow .owl-nav .owl-next:after,
.owl-carousel.long-arrow .owl-nav .owl-prev:after {
content: "";
border-bottom: 2px solid #515050;
width: 70px;
position: absolute;
top: 50%;
left: 0;
transform: translateY(-50%);
}  ul.social-icon {
display: inline-block;
padding: 0;
margin: 0 0 15px;
vertical-align: middle
}
ul.social-icon li {
display: inline-block;
width: auto;
margin: 3px 10px 3px 0;
background: 0 0;
padding: 0;
vertical-align: middle;
color: #1f1f1e;
overflow: visible;
}
ul.social-icon li:last-child {
margin-right: 0
}
ul.social-icon li:before {
display: none
}
ul.social-icon li a {
display: inline-block;
padding: 0;
width: auto;
text-decoration: none
}
ul.social-icon li i {
text-align: center;
display: block;
font-size: 24px;
color: #0d8b8e;
line-height: 1;
border: 1px solid #0d8b8e;
width: 40px;
height: 40px;
line-height: 38px;
border-radius: 40px;
}
ul.social-icon li a:hover i {
color: #1f1f1e
}
ul.social-icon li a:hover .fa-twitter,
ul.social-icon li a:hover .fa-x-twitter {
background-color: #0eb1f2;
border-color: #0eb1f2
}
ul.social-icon li a:hover .fa-linkedin-in {
background-color: #007bb6;
border-color: #007bb6
}
ul.social-icon li a:hover .fa-instagram {
background-color: #d82370;
border-color: #d82370
}
ul.social-icon li a:hover .fa-pinterest,
ul.social-icon li a:hover .fa-pinterest-p {
background-color: #cb2027;
border-color: #cb2027
}
ul.social-icon li a:hover .fa-tumblr {
background-color: #395976;
border-color: #395976
}
ul.social-icon li a:hover .fa-youtube {
background-color: red;
border-color: red
}
ul.social-icon li a:hover .fa-whatsapp {
background-color: #25d366;
border-color: #25d366
}
ul.social-icon li a:hover .fa-tiktok {
background-color: #ff0050;
border-color: #ff0050
}
ul.social-icon li a:hover .fa-facebook,
ul.social-icon li a:hover .fa-facebook-f,
ul.social-icon li a:hover .fa-facebook-square {
background-color: #3b5998;
border-color: #3b5998
}
ul.social-icon li a:hover i {
color: #ffffff;
}  footer {
background: #f8f6f2;
padding: 20px 0 0
}
footer .footer-row {
display: flex;
margin: 0 -15px;
align-items: flex-start;
justify-content: space-between
}
footer .footer-column {
float: left;
padding: 40px 15px 0;
}
footer .footer-column:first-child {
max-width: 342px;
}
footer .footer-column:nth-child(2) {
margin-left: auto
}
footer img {
margin: 0 0 10px;
}
footer ul li {
padding: 0 0 4px 0;
line-height: 1.4;
font-size: 14px;
color: #1f1f1e
}
footer ul li a {
font-size: inherit
}
footer ul li:before {
display: none
}
footer ul li:last-child {
padding-bottom: 0
}
footer h5 {
font-size: 16px;
color: #0d8b8e;
font-family: 'ProximaNova-Semibold';
font-weight: 400;
margin: 0 0 16px;
padding: 0;
text-transform: capitalize;
}
footer a,
footer p {
color: #1f1f1e;
font-size: 14px;
margin: 0;
}
footer p:has(i) {
position: relative;
padding-left: 25px;
}
footer p:has(i) i {
position: absolute;
left: 0;
top: 3px;
color: #1f1f1e;
font-size: 16px;
font-weight: 900 !important
}
footer ul.social-icon {
margin: 25px 0 0;
display: flex;
flex-wrap: wrap;
gap: 12px;
}
footer ul.social-icon li {
margin: 0
}
footer ul.social-icon li a {
text-decoration: none !important
}
footer a {
text-decoration: none
}
footer p+p {
margin-top: 15px
}
footer .copyright-block {
padding: 24px 0;
float: left;
width: 100%;
margin-top: 25px;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
}
footer .copyright-block p {
float: left;
margin: 0;
font-size: 12px;
}
footer .copyright-block a {
font-size: inherit;
color: inherit
}
footer .current-menu-item a,
footer a:focus,
footer a:hover {
color: #0d8b8e !important;
}
footer .copyright-block a:focus,
footer .copyright-block a:hover {
color: #0d8b8e !important;
}  .scrollup {
position: fixed;
right: 10px;
bottom: -40px;
-webkit-transition: all ease 1.5s;
-moz-transition: all ease 1.5s;
-ms-transition: all ease 1.5s;
-o-transition: all ease 1.5s;
transition: all ease 1.5s;
filter: alpha(opacity=0);
opacity: 0;
z-index: 150;
display: flex;
align-items: center;
border-radius: 8px;
font-size: 13px;
font-style: normal;
cursor: pointer;
color: #ffffff;
}
.scrollup i {
color: #1f1f1e;
width: 36px;
height: 36px;
font-size: 16px;
line-height: 36px;
background: #ffffff;
cursor: pointer;
text-align: center;
position: relative;
z-index: 5;
vertical-align: top;
border-radius: 40px;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.5)
}
.scrollup:hover i {
background-color: #1f1f1e;
color: #ffffff;
}
.scrollup.show {
filter: alpha(opacity=100);
opacity: 1;
bottom: 27px;
} @-webkit-keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0)
}
to {
opacity: 1;
-webkit-transform: translateZ(0);
transform: translateZ(0)
}
}
@keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0)
}
to {
opacity: 1;
-webkit-transform: translateZ(0);
transform: translateZ(0)
}
}
.active.animate__fadeInDown {
-webkit-animation-name: fadeInDown;
animation-name: fadeInDown
} @media only screen and (max-width:1299px) {}
@media only screen and (max-width:1249px) {
.buying-box {
width: 300px;
height: 300px;
}
.buying-box h3 {
font-size: 18px;
margin-top: 10px;
}
.buying-box p {
font-size: 14px
}
.works-box:nth-child(2)::before {
display: none;
}
}
@media only screen and (max-width:1199px) {
.text-45 {
font-size: 32px;
}
.lib-wrapper .top-text-center {
margin-bottom: 30px
}
.banner-wrapper .heading {
font-size: 46px;
min-height: 40px;
}
.banner-wrapper .heading img {
display: none;
}
.banner-wrapper .banner-text {
padding-right: 40px
}
.aside-img-wrapper .max-width {
padding: 20px 15px 20px 40px;
}
.aside-img-wrapper.reverse .max-width {
padding-left: 15px;
padding-right: 40px;
}
.highlight-wrapper h2,
.connect-row h2 {
font-size: 36px
}
.ls-wrapper .text-box h3:first-child {
padding-top: 0
}
.how-w-box {
padding: 30px;
}
.end-to-end {
padding: 30px 10px
}
.volume-box {
padding: 30px 25px;
}
.how-work-box {
text-align: center;
max-width: 991px;
border-radius: 24px;
overflow: hidden;
margin-top: 30px
}
.how-work-box .video-column {
width: 100%;
padding: 0 !important
}
.how-work-box .video-box .img-box {
border-radius: 0
}
.how-work-box .text-box {
width: 100%;
padding: 60px 20px 30px !important;
}
.how-work-box .text-box ul {
width: fit-content;
margin-left: auto;
margin-right: auto;
text-align: left
}
.how-work-box .text-box::before {
position: absolute !important;
left: 50% !important;
top: -15px;
right: auto !important;
transform: translateX(-50%)
}
.impact-wrapper.layout-2 .impact-box {
width: 47%
}
.aside-inline-img.pulp.reverse .text-box {
padding: 15px 30px
}
.partner-list {
grid-template-columns: repeat(2, 1fr);
gap: 20px;
}
.banner-wrapper .heading img.library-logo {
display: block;
}
.program-box {
padding: 30px
}
.review-grid .img-box {
display: none;
}
.review-grid .text-box {
width: 100%;
padding: 30px;
}
.review-profile {
margin-top: 25px
}
.review-boxes {
padding: 25px;
}
.review-boxes h4 {
margin-top: 25px
}
}
@media only screen and (min-width:1025px) {
.nav-wrap nav ul.nav>li.btn-type>a {
font-weight: 400;
position: relative;
font-size: 16px;
border: 2px solid #9be430;
border-radius: 40px;
color: #1f1f1e;
font-style: normal;
line-height: 22px;
padding: 5px 20px;
text-decoration: none;
white-space: normal;
text-transform: capitalize;
min-width: 113px;
text-align: center
}
.nav-wrap nav ul.nav>li.btn-type>a::before {
display: none
}
.nav-wrap nav ul.nav>li.btn-type>a:hover,
.nav-wrap nav ul.nav>li.current-menu-item.btn-type a {
background-color: #1f1f1e;
color: #ffffff;
border-color: #1f1f1e
}
.nav-wrap nav ul.nav>li.btn-type ul:after {
display: none !important;
}
}
@media only screen and (max-width:1024px) {
.nav-trigger {
padding: 19px;
border-radius: 40px;
display: inline-block;
position: relative;
cursor: pointer;
transition-property: opacity, -webkit-filter;
transition-property: opacity, filter;
transition-property: opacity, filter, -webkit-filter;
transition-duration: .15s;
transition-timing-function: linear;
font: inherit;
color: inherit;
text-transform: none;
margin: 0 0 0 10px;
overflow: visible;
font-size: 0;
background: #1f1f1e;
order: 3
}
.nav-trigger span {
display: block;
top: 50%;
margin-top: -1px;
right: 11px
}
.nav-trigger span,
.nav-trigger span::after,
.nav-trigger span::before {
width: 16px;
height: 2px;
background-color: #ffffff;
border-radius: 0;
position: absolute;
transition-property: transform;
transition-duration: .15s;
transition-timing-function: ease
}
.nav-trigger span::after,
.nav-trigger span::before {
content: "";
display: block
}
.nav-trigger span::before {
top: -7px
}
.nav-trigger span::after {
bottom: -7px
}
.nav-trigger.closemenu span {
top: auto;
bottom: 6px;
transition-duration: .15s;
transition-delay: .15s;
transition-timing-function: cubic-bezier(.55, .055, .675, .19)
}
.nav-trigger.closemenu span::after {
top: -20px;
transition: top .3s .3s cubic-bezier(.33333, .66667, .66667, 1), opacity .1s linear
}
.nav-trigger.closemenu span::before {
transition: top .12s .3s cubic-bezier(.33333, .66667, .66667, 1), transform .15s cubic-bezier(.55, .055, .675, .19)
}
.nav-trigger.closemenu span {
transform: translate3d(0, -12px, 0) rotate(-45deg);
transition-delay: .32s;
transition-timing-function: cubic-bezier(.215, .61, .355, 1)
}
.nav-trigger.closemenu span::after {
top: 0;
opacity: 0;
transition: top .3s cubic-bezier(.33333, 0, .66667, .33333), opacity .1s .27s linear
}
.nav-trigger.closemenu span::before {
top: 0;
-ms-transform: rotate(-90deg);
transform: rotate(-90deg);
transition: top .12s .18s cubic-bezier(.33333, 0, .66667, .33333), transform .15s .42s cubic-bezier(.215, .61, .355, 1)
}
#sidebar-nav {
right: -320px;
top: 0;
bottom: 0;
position: fixed;
width: 320px;
overflow-x: hidden;
overflow-y: auto;
margin: 0;
padding: 20px 0 30px 20px;
transition: all .2s linear 0s;
-moz-transition: all .2s linear 0s;
-webkit-transition: all .2s linear 0s;
-ms-transition: all .2s linear 0s;
-o-transition: all .2s linear 0s;
background: #ffffff;
-webkit-box-shadow: inset -30px 20px 20px rgb(255 255 255), inset -30px -20px 20px rgb(255 255 255), inset 0px 0px 20px rgba(0, 0, 0, 0.1);
box-shadow: inset -30px 20px 20px rgb(255 255 255), inset -30px -20px 20px rgb(255 255 255), inset 0px 0px 20px rgba(0, 0, 0, 0.1);
}
header,
html {
-moz-transition: all .2s linear 0s;
-webkit-transition: all .2s linear 0s;
-ms-transition: all .2s linear 0s;
-o-transition: all .3s linear 0s;
transition: all .2s linear 0s
}
.sidebar_active {
overflow: hidden;
margin-left: -320px;
margin-right: 320px
}
.sidebar_active #sidebar-nav {
display: block;
right: 0;
z-index: 999999
}
.nav-wrap nav ul.nav>li.has-sub>a:after {
display: none
}
.sidebar_active header {
position: fixed;
left: -320px;
right: 320px
}
.nav-wrap nav ul,
nav ul ul {
display: none
}
.nav-wrap nav ul.nav {
padding: 0;
margin: 0;
border: 0;
visibility: visible;
display: block;
top: 0
}
.nav-wrap nav ul.nav>li {
width: 100%;
margin: 0;
padding: 8px 0;
border: 0; }
.nav-wrap nav ul.nav>li>a {
font-size: 18px;
color: #1f1f1e;
padding: 7px 20px 7px 16px;
margin: 0;
white-space: inherit;
border-radius: 0;
border: none;
font-weight: 500
}
.nav-wrap nav ul.nav>li.has-sub>a {
padding-right: 30px
}
.nav-wrap nav ul.nav>li:last-child {
border-bottom: none
}
.nav-wrap nav ul.nav ul li {
opacity: 1
}
.nav-wrap nav ul.nav ul {
position: static;
opacity: 1;
visibility: visible;
padding: 0;
border-radius: 0;
background: 0 0;
-webkit-box-shadow: none;
box-shadow: none
}
.nav-wrap nav>ul.nav>li>ul {
max-height: inherit;
margin-top: 0;
-moz-transform: none;
-webkit-transform: none;
transform: none;
text-align: left
}
.nav-wrap nav ul.nav>li>ul>li {
padding: 0;
margin: 0;
float: left;
width: 100%;
border-bottom: none;
min-width: inherit
}
.nav-wrap nav ul.nav>li>ul li a {
font-size: 15px;
font-weight: 500;
color: #1f1f1e;
padding: 11px 20px 11px 30px;
white-space: inherit;
text-align: left; }
.sidebar_active .nav-wrap nav ul.nav ul.open {
display: block !important;
position: static !important;
top: 40px;
left: auto;
right: 0;
bottom: 0;
width: 100%;
margin: 0;
opacity: 1;
visibility: visible;
height: 100%;
overflow: auto;
z-index: 99999;
background: #ffffff
}
.nav-wrap nav ul.nav ul:after,
.nav-wrap nav ul.nav li.has-sub li.has-sub>a:after,
.nav-wrap nav ul.nav>li>a:before {
display: none
}
.nav-wrap nav ul.nav li.current-menu-ancestor>a,
.nav-wrap nav ul.nav li.current-menu-item>a,
.nav-wrap nav ul.nav li:hover>a,
.nav-wrap nav ul.nav li>a:hover {
background-color: transparent !important;
color: #0d8b8e !important
}
.nav-wrap nav .submenu-button {
position: absolute;
right: 5px;
display: block;
width: 30px;
height: 30px;
background-color: #ffffff;
cursor: pointer;
top: 8px;
border-radius: 30px;
font-size: 0 !important
}
.nav-wrap nav .submenu-button:before {
content: "\f105";
font-family: "Font Awesome 6 Pro";
position: absolute;
color: #1f1f1e;
left: 0;
right: 0;
text-align: center;
top: 50%;
margin-top: -14px;
font-size: 16px;
line-height: 30px;
font-weight: normal;
border-radius: 0;
}
.nav-wrap nav .submenu-button.submenu-opened:before {
content: "\f106";
}
.nav-wrap nav ul.nav ul li.has-sub:after,
.nav-wrap nav ul.nav ul ul,
.nav-wrap nav ul.nav>li>a:after,
.nav-wrap nav ul.nav>li:before,
.nav-wrap nav ul.nav li.has-sub li.has-sub>a:after,
.nav-wrap nav ul.nav>li.has-sub>a:after {
display: none !important
}
.nav-wrap nav ul.nav ul ul.open {
display: block !important
}
.nav-wrap nav ul.nav li.has-sub li.has-sub>a {
padding-right: 45px !important;
}
.nav-wrap nav ul.nav>li {
display: block
}
.nav-wrap nav ul.nav>li.has-sub>a br {
display: none
}
.nav-wrap nav ul.nav>li>a {
z-index: 111 !important;
}
.nav-wrap nav ul.nav>li>.submenu-button {
z-index: 1111 !important;
}
.nav-wrap nav ul.nav .parent-active {
z-index: 9999 !important
}
.nav-wrap {
margin: 0;
flex-direction: row;
}
.alignleft,
.alignright {
max-width: 500px
}
.head-top-area {
font-size: 14px;
line-height: 1.2;
min-height: 54px;
}
.header-row {
padding: 10px 0
}
header+* {
margin-top: 117.8px !important;
}
}
@media only screen and (max-width:991px) {
.alignleft,
.alignright {
max-width: 300px
}
.aside-inline-img {
padding: 30px 0;
text-align: center;
}
.aside-inline-img .img-box img {
margin: 0 auto;
}
.aside-inline-img.lg-text-overlap {
text-align: left
}
.aside-inline-img .img-box {
width: 100%;
padding: 0
}
.aside-inline-img .text-box,
.aside-inline-img.reverse .text-box {
width: 100%;
padding: 25px 0 0;
}
.aside-inline-img ul {
text-align: left;
width: fit-content;
margin-left: auto;
margin-right: auto
}
.aside-inline-img .text-box img {
margin-left: auto;
margin-right: auto
}
.aside-img-wrapper {
text-align: center;
}
.aside-img-wrapper .img-box {
padding: 0 15px
}
.aside-img-wrapper .img-box img {
margin: 0 auto;
border-radius: 20px;
width: auto;
}
.aside-img-wrapper .img-box {
width: 100%
}
.aside-img-wrapper .text-box,
.aside-img-wrapper.reverse .text-box {
width: 100%;
padding: 25px 0 0;
}
.aside-img-wrapper ul {
text-align: left;
width: fit-content;
margin-left: auto;
margin-right: auto
}
.aside-img-wrapper .max-width {
float: none !important;
padding: 0 15px !important;
margin: 0 auto !important;
max-width: 100% !important
}
.banner-wrapper .banner-img,
.banner-wrapper.layout-2 .banner-img {
width: 100%
}
.banner-wrapper {
aspect-ratio: auto;
}
.banner-img-icon::before {
inset: 0;
min-height: 280px;
}
.banner-wrapper .banner-img img {
margin: 0 auto;
}
.banner-wrapper .banner-text {
width: 100%;
text-align: center;
padding: 20px 0 0;
}
.banner-wrapper .btn-action {
justify-content: center;
flex-wrap: wrap
}
.banner-wrapper .btn-action .btn {
min-width: 238px
}
.banner-wrapper.flexslider .flex-control-paging {
bottom: 15px
}
.banner-wrapper.flexslider .flex-direction-nav {
display: none;
}
.banner-wrapper.layout-2 {
padding-bottom: 15px !important;
}
.banner-wrapper.layout-2 .banner-text {
width: 100%;
padding: 20px 0 0
}
.aside-inline-img.layout-3 .img-box {
padding-right: 0;
}
.aside-inline-img.layout-3 .text-box {
padding-right: 0;
}
.banner-wrapper ul.img-icon-list {
width: fit-content;
margin-left: auto;
margin-right: auto;
text-align: left
}
.address-info {
max-width: 780px;
text-align: left;
justify-content: center;
margin: 40px auto 0;
}
[class*="-wrapper"] {
padding: 30px 0;
}
.common-grid {
grid-template-columns: 1fr;
text-align: center;
margin-bottom: 20px;
}
.common-grid:has(.small-tagline) .column:last-child {
padding-top: 0;
}
.serives-box {
width: 48%
}
.partner-wrapper h2,
.review-wrapper h2 {
font-size: 24px
}
.partner-wrapper h2 br {
display: none;
}
.connect-row [class*="col-"]:has(.btn) {
text-align: center
}
.tag-wrapper {
padding: 8px 0
}
.contact-form {
background-position: left 90%, 98% 20px;
background-size: 13%, 8%
}
.c-map {
padding-top: 280px
}
.location-search h3 {
padding: 15px 20px;
}
.search-row {
padding: 10px 20px
}
.search-row input:not(.btn) {
border: none !important;
padding-left: 0;
padding-right: 0
}
.wpsl-search #wpsl-search-wrap::before {
padding: 15px 20px;
}
.wpsl-search #wpsl-search-wrap form {
padding: 15px 20px
}
.ls-wrapper .map-box {
width: 100%
}
.ls-wrapper .map-box img {
width: 100%
}
.ls-wrapper .text-box {
width: 100%;
padding: 30px 0 0
}
.items-guide-box {
padding: 25px;
}
.wpsl-search {
margin: 0 auto 30px !important;
}
.note-row {
padding: 26px;
margin-top: 30px
}
.top-text-center {
margin-bottom: 25px
}
.how-d-box {
padding: 25px;
width: 97%
}
.how-d-wrapper.layout-2 .how-d-box {
padding-top: 30px;
padding-bottom: 30px;
}
.connect-row.layout-4 p {
max-width: 100%
}
.benefits-box {
width: 98%;
padding: 30px;
text-align: center
}
.benefits-box .icon {
margin: 0 auto
}
.benefits-box.w-full {
width: 98%;
padding: 30px;
}
.benefits-box.w-full .icon {
width: 100px;
height: 100px;
margin-left: auto;
margin-bottom: 0;
}
.regions-box .text-box {
padding: 20px
}
.specialized-box {
width: 98%;
padding: 30px
}
.connect-info {
margin: 20px auto 30px;
}
.centers-box,
.facility-box {
width: 97%
}
.warehouse-row {
grid-template-columns: 1fr;
row-gap: 0;
margin-bottom: 30px;
text-align: center;
}
.warehouse-list {
max-width: 400px;
margin: 0 auto;
padding: 0;
}
.warehouse-row:nth-child(odd) .img-box {
order: 1;
}
.warehouse-row:nth-child(odd) .text-box {
order: 2;
}
.warehouse-list::before,
.warehouse-list::after,
.warehouse-wrapper .container::after,
.warehouse-row .text-box::after,
.warehouse-row .text-box::before {
display: none
}
.warehouse-row .img-box img {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
.warehouse-row .text-box {
border-top-left-radius: 0;
border-top-right-radius: 0;
padding: 20px 20px 25px
}
.warehouse-row .icon {
margin: 0 auto 10px;
}
.how-w-wrapper {
background-size: 35px
}
.how-w-row {
margin-top: 25px
}
.how-w-box {
padding: 30px;
width: 48%
}
.how-w-wrapper h2,
.pickup-wrapper h2 {
font-size: 32px;
}
.pickup-wrapper .form-box {
padding: 35px
}
.pickup-wrapper .note-row {
margin: 10px 0;
padding-left: 20px;
}
.solutions-wrapper .aside-inline-img .text-box {
padding-left: 0 !important;
padding-right: 0 !important;
}
.solution-row {
grid-template-columns: 1fr;
gap: 20px;
}
.solution-box {
padding: 25px 30px 25px 80px;
}
.solution-box .icon {
left: 15px;
top: 25px;
}
.solutions-wrapper h2,
.sustainability-wrapper h2,
.transform-wrapper h3,
.end-to-end h2 {
font-size: 32px;
}
.aside-inline-img.text-gap .text-box {
padding-left: 0;
}
.aside-inline-img.text-gap.reverse .text-box {
padding-right: 0
}
.end-to-end .column-row {
margin-top: 30px
}
.end-to-end .column {
width: 50%
}
.end-to-end .column:nth-child(2)::after {
display: none;
}
.transform-box {
width: 47%;
padding: 25px;
}
.benefits-wrapper.p-b6 {
padding-bottom: 30px !important
}
.buying-wrapper h2,
.volume-wrapper h2,
.categories-wrapper h2,
.faq-wrapper h2 {
font-size: 32px;
}
.volume-box {
width: 47%
}
ul.categories-links {
gap: 8px;
}
.started-wrapper .form-box {
padding: 30px;
}
.buying-row {
flex-wrap: wrap;
row-gap: 10px;
margin-top: 30px
}
.buying-box:nth-child(2)::after {
display: none;
}
.text-45 {
font-size: 32px;
}
.impact-row {
margin: 25px auto -20px -3%;
}
.impact-box {
padding: 25px;
width: 47%
}
.action-box .text-box {
padding: 25px 25px 30px;
}
.action-box {
width: 97%;
text-align: center
}
.banner-wrapper.text-banner {
padding: 20px 0 !important;
}
.star-icon {
background-size: 30px !important
}
.featured-blog {
margin-top: 25px
}
.blog-box .text-box {
padding: 25px;
}
.blog-box .img-box .btn {
top: 15px;
right: 15px;
}
.big-column {
width: 100%;
padding: 0 0 30px
}
.blog-list {
margin-top: 25px;
margin-bottom: -25px
}
.blog-box.layout-2 {
margin-bottom: 25px
}
.blog-box.layout-2 .text-box {
padding: 20px
}
.blog-pagination {
margin: 25px 0 0;
}
.aside-column {
width: 100%
}
.bdetail-wrapper h1,
.bdetail-wrapper h2 {
font-size: 32px;
}
.bdetail-wrapper::before {
background: #f8f6f2;
height: 25%;
min-height: 350px;
}
.measurable-box .corner-icon i {
font-size: 80px
}
.measurable-box .corner-icon {
padding: 10px 0 0
}
.measurable-box {
padding: 40px 25px 30px
}
.aside-inline-img.commitment {
padding: 25px !important
}
.aside-inline-img.commitment .img-box {
width: fit-content;
margin: 0 auto;
}
.aside-inline-img.commitment .text-box {
padding: 30px 0 0 !important
}
.aside-inline-img.commitment ul:has(.btn) {
justify-content: center
}
.aside-inline-img.commitment ul:has(.btn) .btn {
min-width: 183px
}
.aside-inline-img.pulp {
padding: 25px !important
}
.aside-inline-img.pulp .img-box {
width: fit-content;
margin: 0 auto;
}
.aside-inline-img.pulp .text-box {
padding: 30px 0 0 !important
}
.pulp .bg-row {
column-gap: 18px;
row-gap: 20px;
margin: 30px 0;
width: 100%;
}
.aside-inline-img.science {
padding: 25px !important
}
.fact-row {
text-align: left
}
ul.box-type-row {
width: 100%;
gap: 15px;
}
ul.box-type-row {
grid-template-columns: repeat(2, 1fr);
}
.sustainability-row .column {
padding: 25px
}
.testimonial-slider.owl-carousel {
margin-top: 25px;
}
.testimonial-box {
padding: 30px;
}
.works-row {
max-width: 767px;
margin-left: auto;
margin-right: auto
}
.works-box::before {
display: none;
}
.all-faq.not-open {
grid-template-columns: 1fr;
margin-top: 15px
}
.review-grid h3 {
font-size: 24px;
}
.review-list {
grid-template-columns: 1fr;
row-gap: 25px
}
.review-boxes:has(img) {
display: none;
}
.review-boxes {
background-color: #ffffff !important
}
.review-boxes * {
color: #1f1f1e !important;
}
.review-boxes:nth-child(even) {
background-color: #0d8b8e !important
}
.review-boxes:nth-child(even) * {
color: #ffffff !important
}
.review-grid::before {
background-size: 45px
}
.program-box.ribbon::before {
width: 110px;
height: 96px;
background-size: 110px;
}
.banner-wrapper .heading::before {
left: 0;
z-index: -1;
top: auto;
display: none;
}
footer {
padding: 0
}
footer .footer-row {
flex-wrap: wrap
}
footer .footer-column:first-child {
width: 100%;
max-width: 100%;
text-align: center
}
footer .footer-column:first-child img {
margin: 0 auto 15px;
}
footer ul.social-icon {
justify-content: center
}
footer .footer-column:nth-child(2) {
margin-left: 0;
}
footer .copyright-block {
border-top: 1px solid rgba(0, 0, 0, 0.1);
padding: 15px 0
}
}
@media only screen and (max-width:767px) {
.head-top-area p {
max-width: 479px;
margin-left: auto;
margin-right: auto
}
header+* {
margin-top: 134.59px !important;
}
.highlight-wrapper h2 br {
display: none;
}
.highlight-box {
width: 50%
}
.review-slider.owl-carousel .owl-item.center .review-box {
margin: 0
}
.location-box {
text-align: center;
padding-bottom: 0
}
.location-box .btn {
position: relative;
left: auto;
bottom: auto
}
.director-row .btn-action {
display: flex;
flex-wrap: wrap;
gap: 15px;
justify-content: center
}
.director-row .btn {
min-width: 275px;
margin: 0
}
.regions-box {
width: 97%
}
.regions-box .btn {
right: 15px;
top: 15px;
}
.connect-info .box {
padding: 25px
}
.layout-3 .how-d-box {
width: 97%;
padding: 25px
}
blockquote {
padding: 26px;
}
.accordion-data {
padding: 15px 20px 15px 20px;
}
.buying-box::after {
display: none;
}
.timeline-box {
padding-right: 10%
}
.timeline-box .bg-box {
padding-left: 80px;
margin-top: 15px
}
.timeline-box .icon {
left: 20px;
}
.timeline-box:nth-child(even) {
padding-left: 10%;
padding-right: 0;
}
.timeline-box:before {
left: 5%
}
.timeline-box:nth-child(even):before {
left: 0;
right: 5%;
}
.timeline-box h3 {
padding-left: 20px;
margin-bottom: 15px
}
.team-box .text-box {
padding: 25px;
}
.find-warehouse-wrapper #wpsl-gmap {
height: 280px !important
}
#wpsl-gmap {
width: 100% !important;
margin: 0 !important;
padding: 0 !important;
}
#wpsl-result-list {
width: 100% !important;
float: right !important;
margin: 20px 0 0 !important;
}
.tags-box,
.newsletter-box,
.aside-blog-box {
padding: 25px;
margin-top: 25px
}
.blog-list {
display: grid;
grid-template-columns: 1fr 1fr;
column-gap: 25px
}
.blog-box.layout-2 {
grid-template-columns: 1fr;
display: block;
}
.blog-box.layout-2 .image-thumbnail {
padding-top: 96.33%;
height: auto;
min-height: inherit;
}
.bdetail-wrapper .top-text {
max-width: 100%
}
.bdetail-wrapper .bottom-content {
padding: 30px 0 0;
}
.page-nav p:has(span) {
display: none;
}
.promise-box .box .icon {
position: relative;
left: 0;
top: 0;
margin: 0 auto 20px;
}
.promise-box .box {
padding: 25px 0 30px;
text-align: center
}
.sustainability-row .column {
width: 47%
}
.sustainability-row .column:nth-child(3) {
width: 97%
}
.program-row {
margin-top: 20px;
}
.program-box {
width: 97%
}
.promise-box.layout-2 .box .icon {
top: auto;
}
.libraryfrom .form-box h4 {
margin-bottom: 25px;
}
footer .footer-row {
justify-content: flex-start
}
footer .footer-column {
width: 33.333333%
}
}
@media only screen and (max-width:639px) {
.banner-wrapper .heading {
font-size: 40px;
min-height: 88px;
}
.serives-box .text-box {
padding: 20px 15px 0;
}
.serives-box .btn {
left: 15px
}
.review-box {
padding: 30px;
}
.items-guide-row {
grid-template-columns: 1fr
}
.connect-info .box {
width: 96%
}
.contact-form .form-fields {
margin-top: -15px;
}
.how-w-box {
width: 98%
}
.volume-box {
width: 97%
}
.inquire-row {
justify-content: center;
flex-wrap: wrap;
text-align: center;
row-gap: 20px;
margin-top: 30px
}
.blog-box {
width: 97%
}
.measurable-box {
width: 97%
}
}
@media only screen and (max-width:580px) {
.alignleft,
.alignright {
max-width: 100%;
margin: 10px auto 30px;
float: none;
display: block
}
.story-grid .story-text {
padding: 15px
}
.story-grid h3 {
font-size: 36px
}
.search-row {
flex-wrap: wrap
}
.story-grid .story-text.p-2 {
padding: 15px !important;
}
.connect-info p {
margin: 0 0 5px;
}
.centers-box .text-box {
padding: 20px 20px 25px;
}
.centers-box .btn {
top: 15px;
right: 15px;
}
.video-box .img-box:before {
width: 60px;
height: 60px;
}
.video-box .overlay-text {
position: relative;
padding: 15px 0 0
}
.video-box .overlay-text * {
color: #1f1f1e
}
footer .copyright-block p {
width: 100%;
text-align: center
}
.transform-box {
width: 97%;
}
.impact-box,
.impact-wrapper.layout-2 .impact-box {
width: 97%
}
.action-box .video-box .overlay-text {
padding: 15px;
background: #0d8b8e;
}
.action-box .video-box *,
.how-work-box .video-box * {
color: #ffffff
}
.how-work-box .video-box .overlay-text {
padding: 15px 15px 30px;
background: #0d8b8e;
}
.team-box {
text-align: center
}
.team-box ul {
justify-content: center
}
.blog-list {
grid-template-columns: 1fr;
}
.partner-list {
grid-template-columns: 1fr;
}
.aside-inline-img.science .img-box .bg-tagline {
position: relative;
top: auto;
right: auto;
margin-top: 15px
}
.sustainability-row .column {
width: 97%
}
}
@media only screen and (max-width:479px) {
.head-top-area {
font-size: 12px;
padding: 2px 0;
min-height: 33px;
}
header .header-left {
min-width: 200px;
width: 200px;
}
header+* {
margin-top: 99.58px !important;
}
.serives-box {
width: 98%;
text-align: center
}
.serives-box .btn {
left: 50%;
transform: translateX(-50%)
}
.serives-slider .serives-box ul {
width: fit-content;
margin-left: auto;
margin-right: auto;
text-align: left
}
.pickup-wrapper .form-box,
.started-wrapper .form-box {
padding: 30px 20px;
}
.end-to-end .column {
width: 100%
}
.end-to-end .column::after {
display: none;
}
ul.categories-links li {
width: 100%
}
ul.categories-links .btn {
width: 100%
}
.wpsl-search #wpsl-search-wrap form {
flex-wrap: wrap
}
.page-nav a,
.page-nav a i {
font-size: 16px;
}
.works-row {
margin-top: 25px
}
.works-box {
width: 100%;
height: auto;
border-radius: 0
}
.works-box .box {
position: relative;
border-radius: 0;
padding: 25px
}
footer .footer-column {
width: 50%
}
}
@media only screen and (max-width:420px) {
#sidebar-nav {
right: -260px;
width: 260px;
padding: 20px 0 20px 10px;
}
.sidebar_active {
overflow: hidden;
margin-left: -260px;
margin-right: 260px
}
.sidebar_active header {
left: -260px;
right: 260px
}
.review-box {
padding: 20px;
}
.story-grid {
grid-template-columns: 1fr
}
.story-grid img {
width: 100% !important
}
.story-grid .story-text img {
width: auto !important
}
.note-row {
padding: 15px;
gap: 10px
}
.tab-view a {
font-size: 15px;
line-height: 1.2
}
.pickup-wrapper .note-row {
flex-wrap: wrap
}
.buying-box {
width: 280px;
height: 280px;
}
.tags-box ul {
gap: 8px
}
.pulp .bg-row {
grid-template-columns: 1fr;
margin: 20px 0
}
.fact-row {
padding: 0;
margin-top: 30px;
text-align: center
}
.fact-row img {
position: relative;
left: auto;
top: 0;
margin-bottom: 10px
}
ul.box-type-row {
grid-template-columns: 1fr;
}
.review-grid h3 {
font-size: 20px;
}
}
@media only screen and (max-width:359px) {
.head-top-area {
font-size: 11px;
}
header+* {
margin-top: 97.17px !important;
}
}  .mfp-bg {
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1042;
overflow: hidden;
position: fixed;
background: #1f1f1e;
opacity: .65
}
.mfp-wrap {
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1043;
position: fixed;
outline: 0 !important;
-webkit-backface-visibility: hidden;
backface-visibility: hidden
}
.mfp-container {
text-align: center;
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
padding: 0 8px;
box-sizing: border-box
}
.mfp-container:before {
content: '';
display: inline-block;
height: 100%;
vertical-align: middle
}
.mfp-align-top .mfp-container:before {
display: none
}
.mfp-content {
position: relative;
display: inline-block;
vertical-align: middle;
margin: 0 auto;
text-align: left;
z-index: 1045
}
.mfp-ajax-holder .mfp-content,
.mfp-inline-holder .mfp-content {
width: 100%;
cursor: auto
}
.mfp-ajax-cur {
cursor: progress
}
.mfp-auto-cursor .mfp-content {
cursor: auto
}
.mfp-arrow,
.mfp-close,
.mfp-counter,
.mfp-preloader {
-webkit-user-select: none;
-moz-user-select: none;
user-select: none
}
.mfp-loading.mfp-figure {
display: none
}
.mfp-hide {
display: none !important
}
.mfp-preloader {
color: #ccc;
position: absolute;
top: 50%;
width: auto;
text-align: center;
margin-top: -.8em;
left: 8px;
right: 8px;
z-index: 1044
}
.mfp-preloader a {
color: #ccc
}
.mfp-preloader a:hover {
color: #fff
}
.mfp-s-ready .mfp-preloader {
display: none
}
.mfp-s-error .mfp-content {
display: none
}
button.mfp-arrow,
button.mfp-close {
overflow: visible;
cursor: pointer;
background: 0 0;
border: 0;
-webkit-appearance: none;
appearance: none;
display: block;
outline: 0;
padding: 0;
z-index: 1046;
box-shadow: none;
touch-action: manipulation
}
button::-moz-focus-inner {
padding: 0;
border: 0
}
.mfp-close {
width: 30px;
height: 30px;
line-height: 30px;
font-size: 28px;
border-radius: 30px 30px 0 0;
position: absolute;
right: 0;
top: 0 !important;
text-decoration: none;
text-align: center;
opacity: .65;
padding: 0;
color: #ffffff;
font-style: normal;
font-family: Arial, Baskerville, monospace;
background: 0 0 !important
}
div.mfp-close {
display: none !important
}
.videoFrame .mfp-close {
top: 0 !important;
background-color: rgba(236, 223, 223, .5) !important;
border-radius: 0;
opacity: 0
}
.videoFrame .mfp-iframe-scaler:hover .mfp-close {
opacity: 1
}
.videoFrame .mfp-iframe-holder .mfp-content {
max-width: 90%;
max-height: 100%
}
.mfp-close:focus,
.mfp-close:hover {
opacity: 1
}
.mfp-close:active {
top: 1px
}
.mfp-close-btn-in .mfp-close {
color: #334543
}
.mfp-iframe-holder .mfp-close,
.mfp-image-holder .mfp-close {
color: #fff
}
.mfp-counter {
position: absolute;
top: 0;
right: 0;
color: #ccc;
font-size: 12px;
line-height: 18px;
white-space: nowrap
}
.mfp-arrow-left {
width: 30px;
height: 50px;
position: absolute;
left: 10px;
top: 50%;
z-index: 90;
display: inline-block;
margin-top: -25px;
font-size: 0;
cursor: pointer;
border-radius: 0 30px 30px 0
}
.mfp-arrow-left:before {
content: '';
height: 15px;
width: 15px;
display: block;
border: 2px solid #929292;
border-right-width: 0;
border-bottom-width: 0;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
position: absolute;
top: 15px;
left: 8px
}
.mfp-arrow-right {
width: 30px;
height: 50px;
position: absolute;
right: 10px;
top: 50%;
z-index: 90;
display: inline-block;
margin-top: -25px;
font-size: 0;
cursor: pointer;
border-radius: 30px 0 0 30px
}
.mfp-arrow-right:before {
content: '';
height: 15px;
width: 15px;
display: block;
border: 2px solid #929292;
border-left-width: 0;
border-top-width: 0;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
position: absolute;
top: 15px;
right: 8px
}
.mfp-arrow-left:hover:before,
.mfp-arrow-right:hover:before {
border-color: #fff
}
.mfp-iframe-holder {
padding-top: 40px;
padding-bottom: 40px
}
.mfp-iframe-holder .mfp-content {
line-height: 0;
width: 100%;
max-width: 900px
}
.mfp-iframe-holder .mfp-close {
top: -40px
}
.mfp-iframe-scaler {
width: 100%;
height: 0;
overflow: hidden;
padding-top: 56.25%
}
.mfp-iframe-scaler iframe {
position: absolute;
display: block;
top: 0;
left: 0;
width: 100%;
height: 100%;
box-shadow: 0 0 8px rgba(0, 0, 0, .6);
background: #1f1f1e
}
img.mfp-img {
width: auto;
max-width: 100%;
height: auto;
display: block;
line-height: 0;
box-sizing: border-box;
padding: 40px 0 40px;
margin: 0 auto
}
.img-max-inherit img.mfp-img {
max-height: inherit !important
}
.mfp-figure {
line-height: 0;
position: relative
}
.mfp-figure:after {
content: '';
position: absolute;
left: 0;
top: 40px;
bottom: 40px;
display: block;
right: 0;
width: auto;
height: auto;
z-index: -1;
box-shadow: 0 0 8px rgba(0, 0, 0, .6);
background: #444
}
.mfp-figure small {
color: #bdbdbd;
display: block;
font-size: 12px;
line-height: 16px
}
.mfp-figure figure {
margin: 0
}
.mfp-bottom-bar {
margin-top: -36px;
position: absolute;
top: 100%;
left: 0;
width: 100%;
cursor: auto
}
.mfp-title {
text-align: left;
line-height: 18px;
color: #f3f3f3;
word-wrap: break-word;
padding-right: 36px
}
.mfp-image-holder .mfp-content {
max-width: 100%
}
@media screen and (max-width:800px) and (orientation:landscape),
screen and (max-height:300px) {
.mfp-img-mobile .mfp-image-holder {
padding-left: 0;
padding-right: 0
}
.mfp-img-mobile img.mfp-img {
padding: 0
}
.mfp-img-mobile .mfp-figure:after {
top: 0;
bottom: 0
}
.mfp-img-mobile .mfp-figure small {
display: inline;
margin-left: 5px
}
.mfp-img-mobile .mfp-bottom-bar {
background: rgba(0, 0, 0, .6);
bottom: 0;
margin: 0;
top: auto;
padding: 3px 5px;
position: fixed;
box-sizing: border-box
}
.mfp-img-mobile .mfp-bottom-bar:empty {
padding: 0
}
.mfp-img-mobile .mfp-counter {
right: 5px;
top: 3px
}
}
@media all and (min-width:900px) {
.caption-frame .mfp-container {
left: 50%;
display: table;
width: auto;
padding: 0 45px;
margin: 0 auto;
-moz-transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%)
}
}
@media all and (max-width:900px) {
.mfp-arrow {
-webkit-transform: scale(.75);
transform: scale(.75)
}
.mfp-arrow-left {
-webkit-transform-origin: 0;
transform-origin: 0
}
.mfp-arrow-right {
-webkit-transform-origin: 100%;
transform-origin: 100%
}
.mfp-container {
padding-left: 6px;
padding-right: 6px
}
button.mfp-arrow,
button.mfp-close {
background: rgba(255, 255, 255, .95)
}
.mfp-arrow-left:hover:before,
.mfp-arrow-right:hover:before {
border-color: #1a1a1a;
}
.mfp-arrow-left {
left: 0 !important
}
.mfp-arrow-right {
right: 0 !important
}
}  .resources-wrapper {
background-color: #f8f6f2;
padding: 60px 0;
}
.resources-wrapper .top-text-center {
margin-bottom: 40px;
}
.resources-wrapper .resources-row {
display: flex;
flex-wrap: wrap;
gap: 30px;
justify-content: center;
margin-top: 0;
}
.resources-wrapper .resource-box {
flex: 1;
min-width: 280px;
max-width: 380px;
background: #ffffff;
border-radius: 24px;
padding: 40px 30px;
text-decoration: none;
text-align: center;
transition: transform 0.3s ease, box-shadow 0.3s ease;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}
.resources-wrapper .resource-box:hover {
transform: translateY(-5px);
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}
.resources-wrapper .resource-box .icon-wrap {
width: 70px;
height: 70px;
background: linear-gradient(135deg, #0d8b8e 0%, #0a7577 100%);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto 20px;
}
.resources-wrapper .resource-box .icon-wrap i {
font-size: 28px;
color: #ffffff;
}
.resources-wrapper .resource-box h3 {
font-size: 22px;
margin: 0 0 12px 0;
color: #1f1f1e;
}
.resources-wrapper .resource-box p {
font-size: 15px;
line-height: 1.5;
color: #666666;
margin: 0 0 20px 0;
}
@media only screen and (max-width: 991px) {
.resources-wrapper .resource-box {
min-width: 100%;
}
}