:root {
--font-manrope: "Manrope", sans-serif;
--font-dmsans: "DM Sans", sans-serif;
--white-color: #fff;
--black-color: #000000;
--black-color-opc: 0, 0, 0;
--dark-title-color: #1c1a1e;
--title-color: #000000;
--title-color-opc: 0, 0, 0;
--title-color2: #234f40;
--title-color2-opc: 35, 79, 64;
--text-color: #00000099;
--primary-color1: #cb0000;
--primary-color1-opc: 203, 0, 0;
--primary-color2: #fb521e;
--primary-color2-opc: 251, 82, 30;
--primary-color3: #8abc46;
--primary-color3-opc: 138, 188, 70;
--primary-color4: #234f40;
--primary-color4-opc: 35, 79, 64;
--primary-color5: #233aff;
--primary-color5-opc: 35, 58, 255;
--borders-color: #eee;
}
* {
margin: 0;
padding: 0;
scroll-behavior: smooth;
}
::-moz-selection {
background-color: var(--primary-color1);
color: var(--white-color);
}
::selection {
background-color: var(--primary-color1);
color: var(--white-color);
} html {
font-size: 100%;
scroll-behavior: smooth;
}
body {
margin: 0;
padding: 0;
font-family: var(--font-manrope);
color: var(--title-color);
font-size: 16px;
font-weight: 400;
line-height: 30px;
}
body.industry-home ::-moz-selection {
background-color: var(--primary-color2);
color: var(--white-color);
}
body.industry-home ::selection {
background-color: var(--primary-color2);
color: var(--white-color);
}
body.industry-home #ball {
border-color: var(--primary-color2);
background-color: var(--primary-color2);
}
body.industry-home #ball.ball-view {
background-image: linear-gradient(112.83deg, rgba(255, 255, 255, 0.47) 0%, rgba(255, 255, 255, 0) 110.84%);
background-color: rgba(var(--primary-color2-opc), 0.5);
}
body.industry-home #ball .ball-drag::before,
body.industry-home #ball .ball-drag::after {
color: var(--primary-color2);
}
body.industry-home #ball.magnetic-active {
background-image: linear-gradient(112.83deg, rgba(255, 255, 255, 0.47) 0%, rgba(255, 255, 255, 0) 110.84%);
background-color: rgba(var(--primary-color2-opc), 0.5);
}
body.industry-home #ball .ball-close {
color: var(--primary-color2);
}
body.industry-home .progress-wrap svg.progress-circle {
stroke: var(--primary-color2);
}
body.industry-home .progress-wrap .arrow {
fill: var(--primary-color2);
}
body.industry-home .progress-wrap:hover {
background-color: var(--primary-color2);
}
body.industry-home .progress-wrap:hover .arrow {
fill: var(--white-color);
}
body.textile-home {
background-color: #fbfbf6;
}
body.textile-home ::-moz-selection {
background-color: var(--primary-color3);
color: var(--white-color);
}
body.textile-home ::selection {
background-color: var(--primary-color3);
color: var(--white-color);
}
body.textile-home #ball {
border-color: var(--primary-color3);
background-color: var(--primary-color3);
}
body.textile-home #ball.ball-view {
background-image: linear-gradient(112.83deg, rgba(255, 255, 255, 0.47) 0%, rgba(255, 255, 255, 0) 110.84%);
background-color: rgba(var(--primary-color3-opc), 0.5);
}
body.textile-home #ball .ball-drag::before,
body.textile-home #ball .ball-drag::after {
color: var(--primary-color3);
}
body.textile-home #ball.magnetic-active {
background-image: linear-gradient(112.83deg, rgba(255, 255, 255, 0.47) 0%, rgba(255, 255, 255, 0) 110.84%);
background-color: rgba(var(--primary-color3-opc), 0.5);
}
body.textile-home #ball .ball-close {
color: var(--primary-color3);
}
body.textile-home .progress-wrap svg.progress-circle {
stroke: var(--primary-color3);
}
body.textile-home .progress-wrap .arrow {
fill: var(--primary-color3);
}
body.textile-home .progress-wrap:hover {
background-color: var(--primary-color3);
}
body.textile-home .progress-wrap:hover .arrow {
fill: var(--white-color);
}
body.engineering-home ::-moz-selection {
background-color: var(--primary-color5);
color: var(--white-color);
}
body.engineering-home ::selection {
background-color: var(--primary-color5);
color: var(--white-color);
}
body.engineering-home #ball {
border-color: var(--primary-color5);
background-color: var(--primary-color5);
}
body.engineering-home #ball.ball-view {
background-image: linear-gradient(112.83deg, rgba(255, 255, 255, 0.47) 0%, rgba(255, 255, 255, 0) 110.84%);
background-color: rgba(var(--primary-color5-opc), 0.5);
}
body.engineering-home #ball .ball-drag::before,
body.engineering-home #ball .ball-drag::after {
color: var(--primary-color5);
}
body.engineering-home #ball.magnetic-active {
background-image: linear-gradient(112.83deg, rgba(255, 255, 255, 0.47) 0%, rgba(255, 255, 255, 0) 110.84%);
background-color: rgba(var(--primary-color5-opc), 0.5);
}
body.engineering-home #ball .ball-close {
color: var(--primary-color5);
}
body.engineering-home .progress-wrap svg.progress-circle {
stroke: var(--primary-color5);
}
body.engineering-home .progress-wrap .arrow {
fill: var(--primary-color5);
}
body.engineering-home .progress-wrap:hover {
background-color: var(--primary-color5);
}
body.engineering-home .progress-wrap:hover .arrow {
fill: var(--white-color);
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: var(--font-manrope);
font-weight: 600;
line-height: 1.4;
color: var(--title-color);
}
input {
border: none;
outline: none;
}
button {
outline: none;
border: none;
}
i.bx {
vertical-align: middle;
}
img {
max-width: 100%;
height: auto;
}
a {
text-decoration: none;
}
p {
font-family: var(--font-dmsans);
font-size: 16px;
font-weight: 400;
line-height: 30px;
}
.pb-130 {
padding-bottom: 130px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.pb-130 {
padding-bottom: 100px;
}
}
@media (max-width: 991px) {
.pb-130 {
padding-bottom: 90px;
}
}
.pt-130 {
padding-top: 130px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.pt-130 {
padding-top: 100px;
}
}
@media (max-width: 991px) {
.pt-130 {
padding-top: 90px;
}
}
.pt-120 {
padding-top: 120px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.pt-120 {
padding-top: 100px;
}
}
@media (max-width: 991px) {
.pt-120 {
padding-top: 90px;
}
}
@media (max-width: 767px) {
.pt-120 {
padding-top: 70px;
}
}
.pb-120 {
padding-bottom: 120px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.pb-120 {
padding-bottom: 100px;
}
}
@media (max-width: 991px) {
.pb-120 {
padding-bottom: 90px;
}
}
@media (max-width: 767px) {
.pb-120 {
padding-bottom: 70px;
}
}
.pt-100 {
padding-top: 110px;
}
@media (max-width: 991px) {
.pt-100 {
padding-top: 80px;
}
}
.pb-100 {
padding-bottom: 110px;
}
@media (max-width: 991px) {
.pb-100 {
padding-bottom: 80px;
}
}
.pt-90 {
padding-top: 90px;
}
@media (max-width: 991px) {
.pt-90 {
padding-top: 80px;
}
}
@media (max-width: 767px) {
.pt-90 {
padding-top: 70px;
}
}
.pb-90 {
padding-bottom: 90px;
}
@media (max-width: 991px) {
.pb-90 {
padding-bottom: 80px;
}
}
@media (max-width: 767px) {
.pb-90 {
padding-bottom: 70px;
}
}
.pb-80 {
padding-bottom: 80px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.pb-80 {
padding-bottom: 60px;
}
}
.pb-65 {
padding-bottom: 65px;
}
.sec-mar {
margin: 120px 0;
}
@media (min-width: 992px) and (max-width: 1199px) {
.sec-mar {
margin: 100px 0;
}
}
@media (max-width: 991px) {
.sec-mar {
margin: 90px 0;
}
}
@media (max-width: 767px) {
.sec-mar {
margin: 70px 0;
}
}
.mt-120 {
margin-top: 120px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.mt-120 {
margin-top: 100px;
}
}
@media (max-width: 991px) {
.mt-120 {
margin-top: 90px;
}
}
@media (max-width: 767px) {
.mt-120 {
margin-top: 70px;
}
}
.mb-110 {
margin-bottom: 110px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.mb-110 {
margin-bottom: 90px;
}
}
@media (max-width: 991px) {
.mb-110 {
margin-bottom: 80px;
}
}
@media (max-width: 767px) {
.mb-110 {
margin-bottom: 60px;
}
}
.mb-120 {
margin-bottom: 120px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.mb-120 {
margin-bottom: 100px;
}
}
@media (max-width: 991px) {
.mb-120 {
margin-bottom: 90px;
}
}
@media (max-width: 767px) {
.mb-120 {
margin-bottom: 70px;
}
}
.mb-130 {
margin-bottom: 130px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.mb-130 {
margin-bottom: 100px;
}
}
@media (max-width: 991px) {
.mb-130 {
margin-bottom: 90px;
}
}
.mb-100 {
margin-bottom: 100px;
}
@media (max-width: 991px) {
.mb-100 {
margin-bottom: 80px;
}
}
.mt-100 {
margin-top: 100px;
}
@media (max-width: 991px) {
.mt-100 {
margin-top: 80px;
}
}
.mb-90 {
margin-bottom: 90px;
}
@media (max-width: 991px) {
.mb-90 {
margin-bottom: 70px;
}
}
@media (max-width: 767px) {
.mb-90 {
margin-bottom: 50px;
}
}
.mb-80 {
margin-bottom: 80px;
}
@media (max-width: 1199px) {
.mb-80 {
margin-bottom: 70px;
}
}
@media (max-width: 991px) {
.mb-80 {
margin-bottom: 60px;
}
}
@media (max-width: 767px) {
.mb-80 {
margin-bottom: 50px;
}
}
.mt-80 {
margin-top: 80px;
}
@media (max-width: 1199px) {
.mt-80 {
margin-top: 70px;
}
}
@media (max-width: 991px) {
.mt-80 {
margin-top: 60px;
}
}
@media (max-width: 767px) {
.mt-80 {
margin-top: 50px;
}
}
.mb-15 {
margin-bottom: 15px;
}
.mb-10 {
margin-bottom: 10px;
}
.pt-80 {
padding-top: 80px;
}
.pt-50 {
padding-top: 50px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.pt-50 {
padding-top: 40px;
}
}
@media (max-width: 991px) {
.pt-50 {
padding-top: 30px;
}
}
.pt-40 {
padding-top: 40px;
}
.pt-35 {
padding-top: 35px;
}
.pt-30 {
padding-top: 30px;
}
.pb-80 {
padding-bottom: 80px;
}
.pe-80 {
padding-right: 80px;
}
.pb-60 {
padding-bottom: 60px;
}
.pl-110 {
padding-left: 110px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.pl-110 {
padding-left: 70px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.pl-110 {
padding-left: 40px;
}
}
@media (max-width: 1199px) {
.pl-110 {
padding-left: unset;
}
}
.mb-65 {
margin-bottom: 65px;
}
@media (max-width: 1199px) {
.mb-65 {
margin-bottom: 55px;
}
}
@media (max-width: 767px) {
.mb-65 {
margin-bottom: 45px;
}
}
.mb-60 {
margin-bottom: 60px;
}
@media (max-width: 1199px) {
.mb-60 {
margin-bottom: 50px;
}
}
@media (max-width: 767px) {
.mb-60 {
margin-bottom: 40px;
}
}
.mb-70 {
margin-bottom: 70px;
}
@media (max-width: 991px) {
.mb-70 {
margin-bottom: 60px;
}
}
@media (max-width: 767px) {
.mb-70 {
margin-bottom: 40px;
}
}
.mb-50 {
margin-bottom: 50px;
}
.mb-45 {
margin-bottom: 45px;
}
@media (max-width: 576px) {
.mb-45 {
margin-bottom: 35px;
}
}
.mb-35 {
margin-bottom: 35px;
}
.mb-20 {
margin-bottom: 20px;
}
.mt-15 {
margin-top: 15px;
}
.mt-40 {
margin-top: 40px;
}
.mt-35 {
margin-top: 35px;
}
.mb-40 {
margin-bottom: 40px;
}
@media (max-width: 1199px) {
.mb-40 {
margin-bottom: 30px;
}
}
.mb-30 {
margin-bottom: 30px;
}
.mb-25 {
margin-bottom: 25px;
}
.mt-50 {
margin-top: 50px;
}
.mt-30 {
margin-top: 30px;
}
.mt-25 {
margin-top: 25px;
}
.mb-50 {
margin-bottom: 50px;
}
@media (max-width: 767px) {
.mb-50 {
margin-bottom: 40px;
}
}
.mt-60 {
margin-top: 60px;
}
@media (max-width: 767px) {
.mt-60 {
margin-top: 40px;
}
}
.mt-65 {
margin-top: 65px;
}
@media (max-width: 1199px) {
.mt-65 {
margin-top: 55px;
}
}
@media (max-width: 767px) {
.mt-65 {
margin-top: 45px;
}
}
.mt-70 {
margin-top: 70px;
}
@media (max-width: 991px) {
.mt-70 {
margin-top: 40px;
}
}
#magic-cursor {
position: absolute;
display: none;
width: 10px;
height: 10px;
pointer-events: none;
z-index: 99999;
opacity: 0;
}
body.tt-magic-cursor #magic-cursor {
display: block;
}
#ball {
position: fixed;
display: flex;
justify-content: center;
align-items: center;
color: var(--white-color);
pointer-events: none;
border-style: solid;
border-radius: 50%;
border-color: var(--primary-color1);
background-color: var(--primary-color1); } #ball.ball-view {
background-image: linear-gradient(112.83deg, rgba(255, 255, 255, 0.47) 0%, rgba(255, 255, 255, 0) 110.84%);
background-color: rgba(var(--primary-color1-opc), 0.5);
-webkit-backdrop-filter: blur(3px);
backdrop-filter: blur(3px);
font-size: 15px;
font-weight: 600;
color: var(--white-color);
font-family: var(--font-dmsans);
line-height: 1.4;
text-align: center;
}
#ball .ball-view-inner {
padding: 0 5px;
opacity: 0;
visibility: hidden;
transform: scale(0);
}
#ball .ball-view-inner i {
font-size: 24px;
} #ball .ball-drag {
position: absolute;
display: block;
width: 100%;
padding: 0 5px;
font-size: 15px;
font-weight: 600;
color: var(--title-color);
line-height: 1.2;
text-align: center;
transition: all 0.3s;
}
#ball .ball-drag::before,
#ball .ball-drag::after {
position: absolute;
top: 50%;
margin-top: -5px;
font-size: 16px;
color: var(--primary-color1);
height: 10px;
line-height: 10px; font-family: "Font Awesome 5 Free";
font-weight: 900;
display: inline-block;
font-style: normal;
font-variant: normal;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
}
#ball .ball-drag::before {
content: "\f060"; left: 0;
transform: translate3d(-30px, 0, 0);
transition: all 0.25s;
}
#ball .ball-drag::after {
content: "\f061"; right: 0;
transform: translate3d(30px, 0, 0);
transition: all 0.25s;
}
#ball.magnetic-active {
background-image: linear-gradient(112.83deg, rgba(255, 255, 255, 0.47) 0%, rgba(255, 255, 255, 0) 110.84%);
background-color: rgba(var(--primary-color1-opc), 0.5);
-webkit-backdrop-filter: blur(1.1px);
backdrop-filter: blur(1.1px);
border-color: transparent !important;
} #ball.ball-close-enabled {
opacity: 1 !important;
}
#ball .ball-close {
position: absolute;
padding: 0 5px;
font-size: 14px;
font-weight: 600;
color: var(--primary-color1);
line-height: 1;
text-align: center;
}
.progress-wrap {
position: fixed;
right: 30px;
bottom: 30px;
height: 45px;
width: 45px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
box-shadow: inset 0 0 0 2px var(--borders-color);
background-color: transparent;
z-index: 10000;
opacity: 0;
visibility: hidden;
transform: translateY(15px);
transition: all 200ms linear;
}
.progress-wrap.active-progress {
opacity: 1;
visibility: visible;
transform: translateY(0);
}
.progress-wrap svg {
fill: none;
transition: 0.5s;
}
.progress-wrap svg.progress-circle {
stroke: var(--primary-color1);
stroke-width: 4;
box-sizing: border-box;
transition: all 200ms linear;
}
.progress-wrap .arrow {
fill: var(--primary-color1);
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
transition: 0.5s;
}
.progress-wrap:hover {
background-color: var(--primary-color1);
}
.progress-wrap:hover .arrow {
fill: var(--white-color);
}
.primary-btn1 {
background-color: var(--primary-color1);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
color: var(--white-color);
letter-spacing: 0.48px;
line-height: 1;
padding: 22px 52px 22px 26px;
text-transform: uppercase;
text-decoration: underline !important;
position: relative;
align-items: center;
display: inline-flex;
transition: all 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
overflow: hidden;
z-index: 1;
white-space: nowrap;
}
.primary-btn1 > span {
transition: opacity 0.3s, transform 0.3s;
transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
background-color: transparent;
width: 100%;
}
.primary-btn1 > span:nth-child(2) {
text-decoration: underline;
position: absolute;
top: 50%;
left: 0;
padding-left: 26px;
opacity: 0;
transform: translate(0, 100%);
transition: opacity 0.3s, transform 0.3s;
transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
white-space: nowrap;
}
.primary-btn1 .arrow {
fill: rgba(var(--title-color-opc), 0.15);
position: absolute;
top: 3px;
right: 3px;
transition: 0.5s;
}
.primary-btn1::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-size: 102% 102%;
border-radius: inherit;
transition: all 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
opacity: 0;
z-index: -1;
}
.primary-btn1::after {
content: "";
position: absolute;
z-index: 1;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateY(110%);
background-color: var(--black-color);
overflow: hidden;
transition: opacity 0.5s, transform 0.5s;
z-index: -1;
}
.primary-btn1:hover {
color: var(--white-color);
}
.primary-btn1:hover .arrow {
fill: rgba(255, 255, 255, 0.15);
}
.primary-btn1:hover > span {
transform: translateY(-150%);
opacity: 0;
}
.primary-btn1:hover > span:nth-child(2) {
opacity: 1;
transform: translate(0%, -50%);
}
.primary-btn1:hover::after {
transform: translate(0);
border-radius: 0;
}
.primary-btn1.white-bg {
background-color: var(--white-color);
color: var(--title-color);
}
.primary-btn1.white-bg .arrow {
fill: rgba(var(--primary-color1-opc), 0.15);
}
.primary-btn1.white-bg::after {
background-color: var(--primary-color1);
}
.primary-btn1.white-bg:hover {
color: var(--white-color);
}
.primary-btn1.white-bg:hover .arrow {
fill: rgba(var(--title-color-opc), 0.15);
}
.primary-btn1.black-bg {
background-color: var(--black-color);
color: var(--white-color);
}
.primary-btn1.black-bg::after {
background-color: var(--primary-color1);
}
.primary-btn1.black-bg .arrow {
fill: rgba(255, 255, 255, 0.15);
}
.primary-btn1.black-bg:hover {
color: var(--white-color);
}
.primary-btn1.black-bg:hover .arrow {
fill: rgba(var(--title-color-opc), 0.15);
}
.primary-btn1.transparent {
background-color: transparent;
border: 1px solid var(--black-color);
color: var(--title-color);
padding: 21px 52px 21px 26px;
}
.primary-btn1.transparent::after {
background-color: var(--primary-color1);
}
.primary-btn1.transparent:hover {
color: var(--white-color);
border-color: var(--primary-color1);
}
.primary-btn2 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
line-height: 1;
text-transform: uppercase;
display: flex;
align-items: end;
gap: 30px;
transition: 0.5s;
}
@media (max-width: 576px) {
.primary-btn2 {
gap: 20px;
}
}
.primary-btn2 span {
white-space: nowrap;
padding-bottom: 2px;
position: relative;
background: linear-gradient(to bottom, var(--title-color) 0%, var(--title-color) 98%);
background-repeat: no-repeat;
background-size: 100% 1px;
background-position: left 100%;
transition: background-size 0.75s;
}
.primary-btn2 svg {
margin-bottom: 7px;
fill: rgba(var(--title-color-opc), 0.15);
transition: 0.5s;
}
.primary-btn2:hover {
color: var(--primary-color1);
}
.primary-btn2:hover svg {
fill: rgba(var(--primary-color1-opc), 0.15);
}
.primary-btn2:hover span {
background-size: 0 1px;
background-position: 0% 100%;
}
.primary-btn2.two:hover {
color: var(--primary-color2);
}
.primary-btn2.two:hover svg {
fill: rgba(var(--primary-color2-opc), 0.15);
}
.primary-btn2.two:hover span {
background-size: 0 1px;
background-position: 0% 100%;
}
.primary-btn2.two.white {
color: var(--white-color);
}
.primary-btn2.two.white svg {
fill: rgba(255, 255, 255, 0.15);
}
.primary-btn2.two.white span {
background: linear-gradient(to bottom, var(--white-color) 0%, var(--white-color) 98%);
background-repeat: no-repeat;
background-size: 100% 1px;
background-position: left 100%;
transition: background-size 0.75s;
}
.primary-btn2.two.white:hover {
color: var(--primary-color2);
}
.primary-btn2.two.white:hover svg {
fill: rgba(var(--primary-color2-opc), 0.3);
}
.primary-btn2.two.white:hover span {
background-size: 0 1px;
background-position: 0% 100%;
}
.primary-btn3 {
background-color: var(--primary-color2);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
color: var(--white-color);
letter-spacing: 0.48px;
line-height: 1;
padding: 22px 52px 22px 26px;
text-transform: uppercase;
text-decoration: underline !important;
border-radius: 5px;
position: relative;
align-items: center;
display: inline-flex;
transition: all 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
overflow: hidden;
z-index: 1;
white-space: nowrap;
}
@media (max-width: 576px) {
.primary-btn3 {
padding: 18px 48px 18px 22px;
}
}
.primary-btn3 > span {
transition: opacity 0.3s, transform 0.3s;
transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
background-color: transparent;
width: 100%;
}
.primary-btn3 > span:nth-child(2) {
text-decoration: underline;
position: absolute;
top: 50%;
left: 0;
padding-left: 26px;
opacity: 0;
transform: translate(0, 100%);
transition: opacity 0.3s, transform 0.3s;
transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
white-space: nowrap;
width: unset;
}
.primary-btn3 .arrow {
fill: rgba(var(--title-color-opc), 0.15);
position: absolute;
top: 3px;
right: 3px;
transition: 0.5s;
}
.primary-btn3::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-size: 102% 102%;
border-radius: inherit;
transition: all 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
opacity: 0;
z-index: -1;
}
.primary-btn3::after {
content: "";
position: absolute;
z-index: 1;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateY(110%);
background-color: var(--black-color);
overflow: hidden;
transition: opacity 0.5s, transform 0.5s;
z-index: -1;
}
.primary-btn3:hover {
color: var(--white-color);
}
.primary-btn3:hover .arrow {
fill: rgba(255, 255, 255, 0.15);
}
.primary-btn3:hover > span {
transform: translateY(-150%);
opacity: 0;
}
.primary-btn3:hover > span:nth-child(2) {
opacity: 1;
transform: translate(0%, -50%);
}
.primary-btn3:hover::after {
transform: translate(0);
border-radius: 0;
}
.primary-btn3.white-bg {
background-color: var(--white-color);
color: var(--title-color);
}
.primary-btn3.white-bg .arrow {
fill: rgba(var(--primary-color2-opc), 0.15);
}
.primary-btn3.white-bg::after {
background-color: var(--primary-color2);
}
.primary-btn3.white-bg:hover {
color: var(--white-color);
}
.primary-btn3.white-bg:hover .arrow {
fill: rgba(var(--title-color-opc), 0.15);
}
.primary-btn3.transparent {
border: 1px solid rgba(var(--black-color-opc), 0.2);
background-color: transparent;
color: var(--title-color);
}
.primary-btn3.transparent::after {
background-color: var(--primary-color2);
}
.primary-btn3.transparent:hover {
color: var(--white-color);
border-color: var(--primary-color2);
}
.primary-btn3.transparent:hover .arrow {
fill: rgba(var(--title-color-opc), 0.15);
}
.primary-btn3.black-bg {
background-color: var(--black-color);
color: var(--white-color);
}
.primary-btn3.black-bg::after {
background-color: var(--primary-color2);
}
.primary-btn3.black-bg .arrow {
fill: rgba(255, 255, 255, 0.15);
}
.primary-btn3.black-bg:hover {
color: var(--white-color);
}
.primary-btn3.black-bg:hover .arrow {
fill: rgba(var(--title-color-opc), 0.15);
}
.primary-btn4 {
background-color: var(--primary-color2);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
color: var(--white-color);
letter-spacing: 0.48px;
line-height: 1;
padding: 21px 52px 21px 26px;
text-transform: uppercase;
text-decoration: underline;
border-radius: 10px 0 10px 10px;
position: relative;
align-items: center;
display: inline-flex;
transition: all 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
overflow: hidden;
z-index: 1;
white-space: nowrap;
}
@media (max-width: 576px) {
.primary-btn4 {
padding: 18px 48px 18px 22px;
}
}
.primary-btn4 > span {
position: absolute;
display: block;
width: 0;
height: 0;
border-radius: 36px;
background-color: var(--black-color);
transition: all 0.6s;
transform: translate(-50%, -50%);
z-index: -1;
}
.primary-btn4 .arrow {
fill: rgba(var(--title-color-opc), 0.15);
position: absolute;
top: 3px;
right: 3px;
transition: 0.5s;
}
.primary-btn4:hover {
color: var(--white-color);
}
.primary-btn4:hover .arrow {
fill: rgba(255, 255, 255, 0.15);
}
.primary-btn4:hover > span {
width: 225%;
height: 1000.5px;
}
.primary-btn4:hover::after {
transform: translate(0);
border-radius: 0;
}
.primary-btn4.white-bg {
background-color: var(--white-color);
color: var(--title-color);
}
.primary-btn4.white-bg > span {
background-color: var(--primary-color2);
}
.primary-btn4.white-bg .arrow {
fill: rgba(var(--primary-color2-opc), 0.15);
}
.primary-btn4.white-bg:hover {
color: var(--white-color);
}
.primary-btn4.white-bg:hover .arrow {
fill: rgba(var(--title-color-opc), 0.15);
}
.primary-btn4.transparent {
border: 1px solid rgba(var(--black-color-opc), 0.2);
background-color: transparent;
color: var(--title-color);
}
.primary-btn4.transparent > span {
background-color: var(--primary-color2);
}
.primary-btn4.transparent:hover {
color: var(--white-color);
border-color: var(--primary-color2);
}
.primary-btn4.transparent:hover .arrow {
fill: rgba(var(--title-color-opc), 0.15);
}
.primary-btn4.black-bg {
background-color: var(--black-color);
color: var(--white-color);
}
.primary-btn4.black-bg .arrow {
fill: rgba(255, 255, 255, 0.15);
}
.primary-btn4.black-bg > span {
background-color: var(--primary-color2);
}
.primary-btn4.black-bg:hover {
color: var(--white-color);
}
.primary-btn4.black-bg:hover .arrow {
fill: rgba(var(--title-color-opc), 0.15);
}
.primary-btn5 {
background-color: var(--primary-color4);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
color: var(--white-color);
letter-spacing: 0.48px;
line-height: 1;
padding: 22px 52px 22px 26px;
text-transform: uppercase;
text-decoration: underline;
border-radius: 10px 0 10px 10px;
position: relative;
align-items: center;
display: inline-flex;
transition: all 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
overflow: hidden;
z-index: 1;
white-space: nowrap;
}
@media (max-width: 576px) {
.primary-btn5 {
padding: 18px 48px 18px 22px;
}
}
.primary-btn5 > span {
position: absolute;
display: block;
width: 0;
height: 0;
border-radius: 36px;
background-color: var(--black-color);
transition: all 0.6s;
transform: translate(-50%, -50%);
z-index: -1;
}
.primary-btn5 .arrow {
fill: rgba(255, 255, 255, 0.15);
position: absolute;
top: 3px;
right: 3px;
transition: 0.5s;
}
.primary-btn5:hover {
color: var(--white-color);
}
.primary-btn5:hover > span {
width: 225%;
height: 1000.5px;
}
.primary-btn5:hover::after {
transform: translate(0);
border-radius: 0;
}
.primary-btn5.white-bg {
background-color: var(--white-color);
color: var(--title-color);
}
.primary-btn5.white-bg .arrow {
fill: rgba(var(--primary-color2-opc), 0.15);
}
.primary-btn5.white-bg:hover {
color: var(--white-color);
}
.primary-btn5.white-bg:hover .arrow {
fill: rgba(var(--title-color-opc), 0.15);
}
.primary-btn5.transparent {
border: 1px solid rgba(var(--black-color-opc), 0.2);
background-color: transparent;
color: var(--title-color);
}
.primary-btn5.transparent:hover {
color: var(--white-color);
border-color: var(--primary-color2);
}
.primary-btn5.transparent:hover .arrow {
fill: rgba(var(--title-color-opc), 0.15);
}
.primary-btn5.black-bg {
background-color: var(--black-color);
color: var(--white-color);
}
.primary-btn5.black-bg .arrow {
fill: rgba(255, 255, 255, 0.15);
}
.primary-btn5.black-bg:hover {
color: var(--white-color);
}
.primary-btn5.black-bg:hover .arrow {
fill: rgba(var(--title-color-opc), 0.15);
}
.primary-btn5.two {
background-color: var(--primary-color3);
}
.primary-btn5.two .arrow {
fill: rgba(var(--title-color2-opc), 0.15);
}
.primary-btn5.two:hover .arrow {
fill: rgba(255, 255, 255, 0.15);
}
.primary-btn6 {
background-color: var(--black-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
color: var(--white-color);
letter-spacing: 0.48px;
line-height: 1;
padding: 15px 6px 15px 28px;
text-transform: uppercase;
text-decoration: underline;
position: relative;
display: inline-flex;
align-items: center;
justify-content: space-between;
gap: 20px;
border-radius: 100px;
overflow: hidden;
z-index: 1;
white-space: nowrap;
}
@media (max-width: 576px) {
.primary-btn6 {
padding: 12px 6px 12px 24px;
}
}
.primary-btn6 svg {
fill: rgba(255, 255, 255, 0.15);
transition: 0.5s;
}
.primary-btn6::after {
position: absolute;
content: "";
width: 100%;
height: 100%;
top: 0px;
right: 0px;
background-color: var(--primary-color5);
transform-origin: right center;
transform: scaleX(0);
z-index: -1;
border-radius: 30px;
transition: transform 0.7s;
}
.primary-btn6:hover::after {
transform: scaleX(1);
transform-origin: left center;
}
.primary-btn6.transparent {
background-color: transparent;
border: 1px solid rgba(var(--primary-color5-opc), 0.35);
color: var(--primary-color5);
padding: 14px 5px 14px 27px;
}
.primary-btn6.transparent svg {
fill: rgba(var(--primary-color5-opc), 0.2);
}
.primary-btn6.transparent:hover {
color: var(--white-color);
}
.primary-btn6.transparent:hover svg {
fill: rgba(255, 255, 255, 0.15);
}
.primary-btn6.white-bg {
background-color: var(--white-color);
color: var(--primary-color5);
}
.primary-btn6.white-bg svg {
fill: rgba(var(--primary-color5-opc), 0.15);
}
.primary-btn6.white-bg:hover {
color: var(--white-color);
}
.primary-btn6.white-bg:hover svg {
fill: rgba(255, 255, 255, 0.15);
}
.circle-container {
background: transparent;
position: fixed;
right: 30px;
bottom: 55px;
height: 40px;
width: 40px;
cursor: pointer;
display: block;
border-radius: 50px;
box-shadow: inset 0 0 0 2px #3067ff;
z-index: 999;
opacity: 0;
visibility: hidden;
transform: translateY(15px);
transition: all 200ms linear;
}
.circle-container.active {
opacity: 1;
visibility: visible;
transform: translateY(0);
}
.circle-container::after {
position: absolute;
font-family: "Bootstrap-icons";
content: "\f145";
text-align: center;
line-height: 40px;
font-size: 28px;
color: var(--primary-color1);
left: 0;
top: 0;
height: 40px;
width: 40px;
cursor: pointer;
display: block;
z-index: 1;
transition: all 200ms linear;
}
.circle-container:hover svg path {
fill: var(--primary-color1);
transition: 0.5s;
}
.circle-container:hover::after {
color: var(--white-color);
}
.circle-container svg path {
fill: none;
}
.circle-container svg.circle-progress path {
stroke: var(--primary-color1);
stroke-width: 5;
box-sizing: border-box;
transition: all 200ms linear;
}
.select {
margin-bottom: 25px;
}
.nice-select {
width: 100%;
height: 50px;
line-height: 48px;
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 16px;
font-weight: 500;
background: var(---dark-white-color);
border-color: var(--borders-color);
border-radius: 5px;
padding-left: 25px;
padding-right: 25px;
}
.nice-select:hover {
border-color: var(--borders-color);
}
.nice-select:focus {
border-color: var(--borders-color);
}
.nice-select.open {
border-radius: 5px 5px 0 0;
}
.nice-select.open::after {
transform: rotate(-180deg);
}
.nice-select:after {
border-bottom: none;
border-right: none;
content: "";
display: block;
height: 7px;
width: 10px;
background-color: #dfdfdf;
margin-top: -4px;
pointer-events: none;
position: absolute;
right: 25px;
clip-path: polygon(100% 0, 0 0, 50% 100%);
transform: rotate(0);
}
.nice-select .list {
width: 100%;
margin-top: 0;
border-radius: 0 0 5px 5px;
}
.nice-select .list .option {
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 14px;
font-weight: 500;
border-bottom: 1px solid var(--borders-color);
}
.nice-select .list .option:last-child {
border-bottom: unset;
}
.section-title > span {
color: var(--primary-color1);
font-family: var(--font-dmsans);
font-size: 14px;
font-weight: 500;
line-height: 1;
letter-spacing: 0.03em;
text-transform: uppercase;
display: inline-block;
margin-bottom: 10px;
position: relative;
}
@media (max-width: 576px) {
.section-title > span {
font-size: 13px;
}
}
.section-title > span::after {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
right: -41px;
width: 35px;
height: 1px;
background-color: var(--primary-color1);
}
.section-title h2 {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 60px;
font-weight: 700;
line-height: 1.1;
margin-bottom: 0;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.section-title h2 {
font-size: 56px;
}
}
@media (max-width: 1399px) {
.section-title h2 {
font-size: 50px;
}
}
@media (max-width: 1199px) {
.section-title h2 {
font-size: 48px;
}
}
@media (max-width: 991px) {
.section-title h2 {
font-size: 42px;
}
}
@media (max-width: 767px) {
.section-title h2 {
font-size: 38px;
line-height: 1.2;
}
}
@media (max-width: 576px) {
.section-title h2 {
font-size: 34px;
line-height: 1.3;
}
}
.section-title p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 16px;
font-weight: 400;
line-height: 1.8;
margin-bottom: 0;
padding-top: 20px;
}
@media (max-width: 576px) {
.section-title p {
padding-top: 15px;
font-size: 15px;
}
}
.section-title.white h2 {
color: var(--white-color);
}
.section-title.white p {
color: rgba(255, 255, 255, 0.6);
}
.section-title.two span {
font-size: 12px;
padding: 10px 17px;
color: var(--primary-color2);
background-color: rgba(var(--black-color-opc), 0.05);
}
.section-title.two span::after {
display: none;
}
.section-title.two h2 {
font-weight: 600;
}
@media (max-width: 576px) {
.section-title.two h2 {
font-size: 32px;
}
}
.section-title.two.white span {
background-color: rgba(255, 255, 255, 0.05);
}
.section-title.three h2 {
font-size: 50px;
font-weight: 600;
}
@media (max-width: 1399px) {
.section-title.three h2 {
font-size: 46px;
}
}
@media (max-width: 1199px) {
.section-title.three h2 {
font-size: 42px;
}
}
@media (max-width: 991px) {
.section-title.three h2 {
font-size: 40px;
}
}
@media (max-width: 767px) {
.section-title.three h2 {
font-size: 38px;
}
}
@media (max-width: 576px) {
.section-title.three h2 {
font-size: 32px;
}
}
.section-title.four span {
color: var(--primary-color3);
font-weight: 600;
display: flex;
align-items: center;
gap: 6px;
}
.section-title.four span svg {
fill: var(--primary-color3);
}
.section-title.four span::after {
display: none;
}
.section-title.four h2 {
color: var(--title-color2);
font-weight: 600;
}
@media (max-width: 576px) {
.section-title.four h2 {
font-size: 32px;
}
}
.section-title.four.white span {
color: var(--white-color);
}
.section-title.four.text-center span {
justify-content: center;
}
.section-title.four.white h2 {
color: var(--white-color);
}
.section-title.four.white p {
color: rgba(255, 255, 255, 0.6);
}
.section-title.five > span {
padding-left: 41px;
color: var(--primary-color5);
}
.section-title.five > span::after {
right: unset;
left: 0;
background-color: var(--primary-color5);
}
@media (max-width: 576px) {
.section-title.five h2 {
font-size: 30px;
line-height: 1.4;
}
}
.section-title.five h2 span {
color: rgba(var(--title-color-opc), 0.5);
font-weight: 400;
}
.section-title.five p {
max-width: 670px;
width: 100%;
}
@media (max-width: 576px) {
.section-title.five p {
font-size: 14px;
}
}
.section-title.five.text-center p {
margin: 0 auto;
}
.slider-btn-grp {
display: flex;
align-items: center;
gap: 50px;
}
@media (max-width: 767px) {
.slider-btn-grp {
gap: 40px;
}
}
@media (max-width: 576px) {
.slider-btn-grp {
gap: 30px;
}
}
.slider-btn-grp .slider-btn {
min-width: 45px;
max-width: 45px;
height: 45px;
background-color: transparent;
border: 1px solid rgba(var(--black-color-opc), 0.3);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
transition: 0.5s;
}
@media (max-width: 767px) {
.slider-btn-grp .slider-btn {
min-width: 40px;
max-width: 40px;
height: 40px;
}
}
.slider-btn-grp .slider-btn i {
color: rgba(var(--black-color-opc), 0.3);
font-size: 20px;
line-height: 1;
}
@media (max-width: 767px) {
.slider-btn-grp .slider-btn i {
font-size: 18px;
}
}
.slider-btn-grp .slider-btn:hover {
background-color: var(--primary-color1);
border-color: var(--primary-color1);
}
.slider-btn-grp .slider-btn:hover i {
color: var(--white-color);
}
.slider-btn-grp .slider-btn.swiper-button-disabled {
opacity: 0.5;
}
.slider-btn-grp.white .slider-btn {
border: 1px solid rgba(255, 255, 255, 0.4);
}
.slider-btn-grp.white .slider-btn i {
color: rgba(255, 255, 255, 0.4);
}
.slider-btn-grp.white .slider-btn:hover {
border-color: var(--white-color);
background-color: var(--white-color);
}
.slider-btn-grp.white .slider-btn:hover i {
color: var(--title-color);
}
.slider-btn-grp.two .slider-btn:hover {
background-color: var(--primary-color2);
border-color: var(--primary-color2);
}
.slider-btn-grp.three .slider-btn:hover {
background-color: var(--primary-color3);
border-color: var(--primary-color3);
}
.slider-btn-grp.four .slider-btn:hover {
background-color: var(--primary-color5);
border-color: var(--primary-color5);
}
.slider-btn-grp.four.white .slider-btn {
border: 1px solid rgba(255, 255, 255, 0.3);
}
.slider-btn-grp.four.white .slider-btn i {
color: rgba(255, 255, 255, 0.3);
}
.slider-btn-grp.four.white .slider-btn:hover {
border-color: var(--primary-color5);
background-color: var(--primary-color5);
}
.slider-btn-grp.four.white .slider-btn:hover i {
color: var(--white-color);
}
.form-inner {
line-height: 1;
}
.form-inner label {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 14px;
font-weight: 500;
display: inline-block;
line-height: 1;
margin-bottom: 12px;
}
.form-inner input {
width: 100%;
background: transparent;
color: var(--title-color);
font-family: var(--font-dmsans);
font-size: 16px;
font-weight: 500;
padding: 10px 20px;
height: 44px;
border: 1px solid rgba(var(--black-color-opc), 0.2);
border-radius: 5px;
}
.form-inner input::-moz-placeholder {
color: #a0a0a0;
}
.form-inner input::placeholder {
color: #a0a0a0;
}
.form-inner input:focus {
border-color: var(--black-color);
}
.form-inner textarea {
width: 100%;
border-radius: 5px;
background: transparent;
color: var(--title-color);
border: 1px solid rgba(var(--black-color-opc), 0.2);
outline: none;
font-family: var(--font-dmsans);
font-size: 16px;
font-weight: 500;
padding: 20px 25px;
min-height: 170px;
resize: none;
}
@media (max-width: 576px) {
.form-inner textarea {
padding: 20px 15px;
}
}
.form-inner textarea:focus {
border-color: var(--black-color);
}
.form-inner textarea::-moz-placeholder {
color: #a0a0a0;
}
.form-inner textarea::placeholder {
color: #a0a0a0;
}
.form-inner2 .form-check {
padding: 0;
margin-bottom: 0;
min-height: unset;
}
.form-inner2 .form-check .form-check-input {
cursor: pointer;
height: 16px;
width: 16px;
margin-top: 8px;
background-color: transparent;
border: 1px solid rgba(var(--black-color-opc), 0.2);
border-radius: 5px;
}
.form-inner2 .form-check .form-check-input:focus {
box-shadow: none;
}
.form-inner2 .form-check .form-check-input:checked {
background-color: var(--primary-color2);
border-color: var(--primary-color2);
}
.form-inner2 .form-check .form-check-label {
cursor: pointer;
color: var(--text-color);
font-family: var(--font-manrope);
font-size: 14px;
font-weight: 400;
line-height: 1.2;
} @keyframes fade-down {
0% {
opacity: 0;
transform: scaleY(0);
visibility: hidden;
}
100% {
opacity: 1;
transform: scaleY(1);
visibility: visible;
}
}
@keyframes zoom-In-effect {
0% {
transform: scale(0.5);
}
100% {
transform: scale(1);
}
}
.logged-in .header-topbar-wrap {
top: 32px;
}
.header-topbar-wrap {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 999;
}
.header-topbar-wrap.sticky .topbar-area {
height: 0;
padding-top: 0;
padding-bottom: 0;
border-bottom: unset;
}
.topbar-area {
position: relative;
width: 100%;
z-index: 99;
padding: 12px 120px;
-webkit-backdrop-filter: blur(120px);
backdrop-filter: blur(120px);
background-color: rgba(var(--black-color-opc), 0.3);
-webkit-backdrop-filter: blur(6px);
backdrop-filter: blur(6px);
border-bottom: 1px solid rgba(255, 255, 255, 0.15);
transition: height 0.4s ease, padding 0.4s ease;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.topbar-area {
padding: 12px 120px;
}
}
@media (max-width: 1399px) {
.topbar-area {
padding: 12px 120px;
}
}
@media (max-width: 1199px) {
.topbar-area {
padding: 12px 20px;
}
}
@media (max-width: 767px) {
.topbar-area {
padding: 12px 10px;
}
}
@media (max-width: 576px) {
.topbar-area {
padding: 0;
}
}
.topbar-area .contact-area ul {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
gap: 60px;
}
@media (max-width: 1199px) {
.topbar-area .contact-area ul {
gap: 40px;
}
}
.topbar-area .contact-area ul li {
position: relative;
}
.topbar-area .contact-area ul li::before {
content: "";
width: 1px;
height: 20px;
background-color: rgba(255, 255, 255, 0.6);
position: absolute;
top: 50%;
transform: translateY(-50%);
left: -30px;
}
@media (max-width: 1199px) {
.topbar-area .contact-area ul li::before {
left: -20px;
}
}
.topbar-area .contact-area ul li:first-child::before {
display: none;
}
.topbar-area .contact-area ul li a {
color: rgba(255, 255, 255, 0.7);
font-family: var(--font-manrope);
font-size: 14px;
font-weight: 600;
line-height: 1;
display: flex;
align-items: center;
gap: 8px;
transition: 0.5s;
}
.topbar-area .contact-area ul li a svg {
fill: rgba(255, 255, 255, 0.7);
transition: 0.5s;
}
.topbar-area .contact-area ul li a:hover {
color: var(--primary-color5);
}
.topbar-area .contact-area ul li a:hover svg {
fill: var(--primary-color5);
}
.topbar-area .address-area {
line-height: 1;
}
.topbar-area .address-area svg {
fill: rgba(255, 255, 255, 0.7);
transition: 0.5s;
}
.topbar-area .address-area a {
color: rgba(255, 255, 255, 0.7);
font-family: var(--font-manrope);
font-size: 13px;
font-weight: 500;
line-height: 1.2;
transition: 0.5s;
}
.topbar-area .address-area:hover svg {
fill: var(--primary-color5);
}
.topbar-area .address-area:hover a {
color: var(--primary-color5);
}
header.style-1 {
position: relative;
width: 100%;
z-index: 999;
transition: all 0.8s ease-out 0s;
background-color: transparent;
padding: 25px 90px;
}
@media (max-width: 1699px) {
header.style-1 {
padding: 18px 70px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
header.style-1 {
padding: 18px 30px;
}
}
@media (max-width: 1399px) {
header.style-1 {
padding: 18px 20px;
}
}
@media (max-width: 1199px) {
header.style-1 {
padding: 18px 10px;
}
}
@media (max-width: 767px) {
header.style-1 {
padding: 18px 10px;
}
}
@media (max-width: 576px) {
header.style-1 {
padding: 18px 0;
}
}
header.style-1.sticky {
position: fixed;
top: 0;
left: 0;
width: 100%;
box-sizing: border-box;
background-color: var(--white-color);
box-shadow: 5px 3px 40px rgba(0, 72, 88, 0.1);
z-index: 999;
animation: smooth-header 0.65s linear;
}
@keyframes smooth-header {
0% {
transform: translateY(-30px);
}
100% {
transform: translateY(0px);
}
}
header.style-1 .company-logo img {
width: 157px;
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-1 .company-logo img {
width: 145px;
}
}
@media (max-width: 576px) {
header.style-1 .company-logo img {
width: 145px;
}
}
header.style-1 .contact-area {
display: flex;
align-items: center;
gap: 8px;
}
header.style-1 .contact-area .icon {
padding: 3px 5px;
background-color: rgba(var(--black-color-opc), 0.1);
border-radius: 5px;
}
header.style-1 .contact-area .icon svg {
fill: var(--title-color);
}
header.style-1 .contact-area .content {
line-height: 1;
}
header.style-1 .contact-area .content span {
color: var(--text-color);
font-family: var(--font-manrope);
font-size: 12px;
font-weight: 500;
line-height: 1;
display: block;
margin-bottom: 5px;
}
header.style-1 .contact-area .content a {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 14px;
font-weight: 600;
line-height: 1;
transition: 0.5s;
}
header.style-1 .contact-area .content a:hover {
color: var(--primary-color1);
}
header.style-1 .nav-right {
display: flex;
align-items: center;
gap: 70px;
position: relative;
}
@media (min-width: 1200px) and (max-width: 1399px) {
header.style-1 .nav-right {
gap: 50px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-1 .nav-right {
gap: 30px;
}
}
@media (max-width: 991px) {
header.style-1 .nav-right {
gap: 20px;
}
}
@media (max-width: 576px) {
header.style-1 .nav-right {
gap: 15px;
}
}
header.style-1 .nav-right::before {
content: "";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 2px;
height: 18px;
background-color: #f94834;
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-1 .nav-right::before {
left: 73%;
}
}
@media (max-width: 991px) {
header.style-1 .nav-right::before {
display: none;
}
}
header.style-1 .nav-right .right-sidebar-button {
cursor: pointer;
display: flex;
align-items: center;
gap: 8px;
position: relative;
padding: 13px 20px;
background-color: rgba(var(--primary-color1-opc), 0.1);
border-radius: 200px;
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-1 .nav-right .right-sidebar-button {
border-radius: 10px;
padding: 14px 16px;
}
}
@media (max-width: 576px) {
header.style-1 .nav-right .right-sidebar-button {
gap: 6px;
border-radius: 10px;
padding: 13px 13px;
}
}
header.style-1 .nav-right .right-sidebar-button svg {
fill: var(--title-color);
}
header.style-1 .nav-right .right-sidebar-button span {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 13px;
font-weight: 600;
line-height: 1;
letter-spacing: 0.03em;
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-1 .nav-right .right-sidebar-button span {
display: none;
}
}
@media (max-width: 576px) {
header.style-1 .nav-right .right-sidebar-button span {
font-size: 12px;
}
}
@media (max-width: 576px) {
header.style-1 .nav-right .right-sidebar-button span {
display: none;
}
}
@keyframes qode-draw {
0%, 100% {
clip-path: inset(-2px -2px);
}
42% {
clip-path: inset(-2px -2px -2px 100%);
}
43% {
clip-path: inset(-2px 100% -3px -2px);
}
}
header.style-1 .nav-right .right-sidebar-button:hover svg {
animation: qode-draw 0.75s cubic-bezier(0.57, 0.39, 0, 0.86) 1 forwards;
}
header.style-1 .nav-right .mobile-menu-btn {
display: none;
visibility: hidden;
}
@media (max-width: 991px) {
header.style-1 .nav-right .mobile-menu-btn {
display: flex;
align-items: center;
visibility: visible;
justify-content: center;
position: relative;
min-width: 48px;
max-width: 48px;
height: 48px;
border-radius: 10px;
border: 1px solid var(--borders-color);
}
header.style-1 .nav-right .mobile-menu-btn svg {
fill: var(--title-color);
}
header.style-1 .nav-right .mobile-menu-btn:hover svg {
animation: qode-draw 0.75s cubic-bezier(0.57, 0.39, 0, 0.86) 1 forwards;
}
}
@media (max-width: 576px) {
header.style-1 .nav-right .mobile-menu-btn {
min-width: 40px;
max-width: 40px;
height: 40px;
}
header.style-1 .nav-right .mobile-menu-btn svg {
width: 18px;
}
}
@keyframes qode-draw {
0%, 100% {
clip-path: inset(-2px -2px);
}
42% {
clip-path: inset(-2px -2px -2px 100%);
}
43% {
clip-path: inset(-2px 100% -3px -2px);
}
}
header.style-1 .main-menu {
display: inline-block;
}
header.style-1 .main-menu > ul {
list-style: none;
margin: 0;
border: 1px solid rgba(var(--black-color-opc), 0.1);
border-radius: 100px;
padding: 0 6px;
}
header.style-1 .main-menu > ul > li {
display: inline-block;
position: relative;
padding: 4px 2px;
}
@media (max-width: 991px) {
header.style-1 .main-menu > ul > li {
padding: 0px 12px;
}
}
header.style-1 .main-menu > ul > li.position-inherit {
position: inherit;
}
@media (max-width: 991px) {
header.style-1 .main-menu > ul > li.position-inherit {
position: relative;
}
}
@media (min-width: 992px) {
header.style-1 .main-menu > ul > li:first-child {
padding-left: 0;
}
header.style-1 .main-menu > ul > li:last-child {
padding-right: 0;
}
}
header.style-1 .main-menu > ul > li > a {
color: var(--title-color);
display: block;
letter-spacing: 0.4px;
padding: 10px 22px;
line-height: 1;
position: relative;
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
text-transform: uppercase;
transition: all 0.5s ease-out 0s;
position: relative;
background-color: transparent;
border-radius: 100px;
}
@media (max-width: 1399px) {
header.style-1 .main-menu > ul > li > a {
padding: 10px 15px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-1 .main-menu > ul > li > a {
font-size: 12px;
padding: 9px 10px;
}
}
header.style-1 .main-menu > ul > li > a svg {
display: none;
fill: var(--title-color);
}
@media (max-width: 991px) {
header.style-1 .main-menu > ul > li > a svg {
display: none;
}
}
header.style-1 .main-menu > ul > li.menu-item-has-children a svg {
display: block;
}
header.style-1 .main-menu > ul > li ul.sub-menu {
position: absolute;
left: 0;
right: 0;
top: 42px;
padding: 10px 0;
margin: 0;
display: none;
min-width: 292px;
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home1/sub-menu-bg.png), linear-gradient(#f1f5ff, #f1f5ff);
border-radius: 0 0 20px 20px;
text-align: left;
transform-origin: top;
}
@media (max-width: 1399px) {
header.style-1 .main-menu > ul > li ul.sub-menu {
min-width: 245px;
}
}
header.style-1 .main-menu > ul > li ul.sub-menu > li {
padding: 0;
display: block;
position: relative;
}
header.style-1 .main-menu > ul > li ul.sub-menu > li::after {
display: none;
}
header.style-1 .main-menu > ul > li ul.sub-menu > li i {
position: absolute;
top: 10px;
right: 6px;
display: block;
color: var(--title-color);
font-size: 20px;
}
header.style-1 .main-menu > ul > li ul.sub-menu > li .dropdown-icon {
color: var(--title-color);
opacity: 1;
top: 17px;
font-size: 13px;
right: 15px;
}
@media (max-width: 991px) {
header.style-1 .main-menu > ul > li ul.sub-menu > li .dropdown-icon {
right: 0;
top: 11px;
font-size: 20px;
}
}
header.style-1 .main-menu > ul > li ul.sub-menu > li .dropdown-icon2 {
color: var(--title-color);
opacity: 1;
top: 14px;
right: 10px;
font-size: 13px;
}
@media (max-width: 1199px) {
header.style-1 .main-menu > ul > li ul.sub-menu > li .dropdown-icon2::before {
content: "\f4fe";
}
}
header.style-1 .main-menu > ul > li ul.sub-menu > li > a {
display: block;
padding: 0 35px;
font-family: var(--font-dmsans);
color: var(--title-color);
font-weight: 400;
text-transform: uppercase;
font-size: 14px;
line-height: 1.4;
letter-spacing: 0.05em;
transition: all 0.4s ease-out 0s;
position: relative;
border-radius: 0;
border: none;
display: flex;
align-items: center;
justify-content: space-between;
}
@media (max-width: 1399px) {
header.style-1 .main-menu > ul > li ul.sub-menu > li > a {
padding: 0 20px;
}
}
@media (max-width: 991px) {
header.style-1 .main-menu > ul > li ul.sub-menu > li > a {
border-bottom: 1px solid rgba(13, 23, 32, 0.0784313725);
}
header.style-1 .main-menu > ul > li ul.sub-menu > li > a::before {
background: linear-gradient(90deg, #525252, var(--primary-color1), #525252);
}
}
header.style-1 .main-menu > ul > li ul.sub-menu > li > a svg {
display: none;
fill: var(--title-color);
transition: all 0.4s ease-out 0s;
}
@media (max-width: 991px) {
header.style-1 .main-menu > ul > li ul.sub-menu > li > a svg {
display: none;
}
}
header.style-1 .main-menu > ul > li ul.sub-menu > li > a span {
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
border-bottom: 1px solid rgba(13, 23, 32, 0.0784313725);
padding: 14px 0px 14px 10px;
}
header.style-1 .main-menu > ul > li ul.sub-menu > li > a span::before {
content: "";
position: absolute;
bottom: -1px;
left: 0;
background: linear-gradient(90deg, #fff, var(--primary-color1), #fff);
width: 100%;
height: 1px;
transform: scaleX(0);
transform-origin: left;
transition: 0.4s ease-in;
z-index: 1;
}
@media (max-width: 991px) {
header.style-1 .main-menu > ul > li ul.sub-menu > li > a span {
border: unset;
padding: 0;
}
header.style-1 .main-menu > ul > li ul.sub-menu > li > a span::before {
display: none;
}
}
header.style-1 .main-menu > ul > li ul.sub-menu > li > a:hover {
color: var(--primary-color1);
}
header.style-1 .main-menu > ul > li ul.sub-menu > li > a:hover svg {
fill: var(--primary-color1);
}
header.style-1 .main-menu > ul > li ul.sub-menu > li > a:hover span::before {
transform: scale(1);
}
header.style-1 .main-menu > ul > li ul.sub-menu > li > a.active {
color: var(--primary-color1);
}
header.style-1 .main-menu > ul > li ul.sub-menu > li > a.active svg {
fill: var(--primary-color1);
}
header.style-1 .main-menu > ul > li ul.sub-menu > li > a.active span::before {
transform: scale(1);
}
header.style-1 .main-menu > ul > li ul.sub-menu > li.menu-item-has-children a svg {
display: block;
}
header.style-1 .main-menu > ul > li ul.sub-menu > li:last-child a span {
border-bottom: none;
}
header.style-1 .main-menu > ul > li ul.sub-menu > li:last-child a span::before {
display: none;
}
header.style-1 .main-menu > ul > li ul.sub-menu > li:last-child .sub-menu li a {
border-bottom: 1px solid rgba(13, 23, 32, 0.0784313725);
}
header.style-1 .main-menu > ul > li ul.sub-menu > li:last-child .sub-menu li a::before {
display: block;
}
header.style-1 .main-menu > ul > li ul.sub-menu > li:last-child .sub-menu li:last-child a {
border-bottom: none;
}
header.style-1 .main-menu > ul > li ul.sub-menu > li:last-child .sub-menu li:last-child a::before {
display: none;
}
header.style-1 .main-menu > ul > li ul.sub-menu > li:hover > a {
color: var(--primary-color1);
}
@media (min-width: 992px) {
header.style-1 .main-menu > ul > li ul.sub-menu > li:hover > ul.sub-menu {
display: block;
animation: fade-down 0.3s linear;
}
}
header.style-1 .main-menu > ul > li ul.sub-menu > li:hover .dropdown-icon {
color: var(--primary-color1);
}
header.style-1 .main-menu > ul > li ul.sub-menu > li:hover .dropdown-icon2 {
color: var(--primary-color1);
}
header.style-1 .main-menu > ul > li ul.sub-menu > li.current-menu-item > a, header.style-1 .main-menu > ul > li ul.sub-menu > li.current_page_item > a, header.style-1 .main-menu > ul > li ul.sub-menu > li.current-menu-ancestor > a, header.style-1 .main-menu > ul > li ul.sub-menu > li.current-menu-parent > a, header.style-1 .main-menu > ul > li ul.sub-menu > li.current_page_parent > a, header.style-1 .main-menu > ul > li ul.sub-menu > li.current_page_ancestor > a {
color: var(--primary-color1);
}
header.style-1 .main-menu > ul > li ul.sub-menu > li.current-menu-item > a svg, header.style-1 .main-menu > ul > li ul.sub-menu > li.current_page_item > a svg, header.style-1 .main-menu > ul > li ul.sub-menu > li.current-menu-ancestor > a svg, header.style-1 .main-menu > ul > li ul.sub-menu > li.current-menu-parent > a svg, header.style-1 .main-menu > ul > li ul.sub-menu > li.current_page_parent > a svg, header.style-1 .main-menu > ul > li ul.sub-menu > li.current_page_ancestor > a svg {
fill: var(--primary-color1);
}
header.style-1 .main-menu > ul > li ul.sub-menu > li.current-menu-item .dropdown-icon, header.style-1 .main-menu > ul > li ul.sub-menu > li.current_page_item .dropdown-icon, header.style-1 .main-menu > ul > li ul.sub-menu > li.current-menu-ancestor .dropdown-icon, header.style-1 .main-menu > ul > li ul.sub-menu > li.current-menu-parent .dropdown-icon, header.style-1 .main-menu > ul > li ul.sub-menu > li.current_page_parent .dropdown-icon, header.style-1 .main-menu > ul > li ul.sub-menu > li.current_page_ancestor .dropdown-icon {
color: var(--primary-color1);
}
header.style-1 .main-menu > ul > li ul.sub-menu > li.current-menu-item .dropdown-icon2, header.style-1 .main-menu > ul > li ul.sub-menu > li.current_page_item .dropdown-icon2, header.style-1 .main-menu > ul > li ul.sub-menu > li.current-menu-ancestor .dropdown-icon2, header.style-1 .main-menu > ul > li ul.sub-menu > li.current-menu-parent .dropdown-icon2, header.style-1 .main-menu > ul > li ul.sub-menu > li.current_page_parent .dropdown-icon2, header.style-1 .main-menu > ul > li ul.sub-menu > li.current_page_ancestor .dropdown-icon2 {
color: var(--primary-color1);
}
header.style-1 .main-menu > ul > li ul.sub-menu > li .sub-menu {
left: 293px;
position: absolute;
max-width: 230px;
min-width: 215px;
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home1/sub-menu-bg.png), linear-gradient(#f1f5ff, #f1f5ff);
top: 0;
}
header.style-1 .main-menu > ul > li ul.sub-menu > li .sub-menu::before {
display: none;
visibility: hidden;
}
@media (max-width: 1399px) {
header.style-1 .main-menu > ul > li ul.sub-menu > li .sub-menu {
left: 245px;
min-width: 210px;
max-width: 210px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-1 .main-menu > ul > li ul.sub-menu > li .sub-menu {
right: 246px;
left: unset;
}
}
@media only screen and (max-width: 991px) {
header.style-1 .main-menu > ul > li ul.sub-menu > li .sub-menu {
margin-left: 10px;
position: unset;
max-width: 230px;
min-width: 215px;
background: transparent;
top: 0;
}
}
header.style-1 .main-menu > ul > li ul.sub-menu > li .sub-menu > li i {
display: block;
}
header.style-1 .main-menu > ul > li ul.sub-menu > li .sub-menu > li a {
padding: 0 20px;
}
@media (max-width: 991px) {
header.style-1 .main-menu > ul > li ul.sub-menu > li .sub-menu > li a {
padding: 12px 0px;
}
}
header.style-1 .main-menu > ul > li ul.sub-menu > li .sub-menu > li a svg {
display: none;
}
@media (max-width: 1399px) {
header.style-1 .main-menu > ul > li ul.sub-menu > li .sub-menu > li a span {
padding: 12px 0px 12px 10px;
}
}
@media (max-width: 991px) {
header.style-1 .main-menu > ul > li ul.sub-menu > li .sub-menu > li a span {
padding: 0;
}
}
header.style-1 .main-menu > ul > li ul.sub-menu > li .sub-menu > li.menu-item-has-children a svg {
display: block;
}
header.style-1 .main-menu > ul > li ul.sub-menu > li:last-child {
border-bottom: none;
}
header.style-1 .main-menu > ul > li .mega-menu {
position: absolute;
left: 0;
top: 68px;
width: 100%;
background-color: rgba(var(--black-color-opc), 0.3);
-webkit-backdrop-filter: blur(15px);
backdrop-filter: blur(15px);
min-height: 100vh;
margin: 0;
display: none;
transform-origin: top;
}
@media (min-width: 1400px) and (max-width: 1599px) {
header.style-1 .main-menu > ul > li .mega-menu {
top: 61px;
}
}
@media (max-width: 1199px) {
header.style-1 .main-menu > ul > li .mega-menu {
top: 62px;
}
}
header.style-1 .main-menu > ul > li .mega-menu .mega-menu-wrap {
padding: 70px 0px;
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home1/home1-megamenu-bg.png), linear-gradient(#fff4f1, #fff4f1);
background-size: cover;
background-repeat: no-repeat;
width: 100%;
border-radius: 0 0 100px 100px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
header.style-1 .main-menu > ul > li .mega-menu .mega-menu-wrap {
max-height: 600px;
overflow-y: auto;
padding: 50px 0;
}
header.style-1 .main-menu > ul > li .mega-menu .mega-menu-wrap::-webkit-scrollbar {
display: none;
}
}
@media (max-width: 1199px) {
header.style-1 .main-menu > ul > li .mega-menu .mega-menu-wrap {
max-height: 570px;
overflow-y: auto;
padding: 50px 0;
border-radius: 0 0 60px 60px;
}
header.style-1 .main-menu > ul > li .mega-menu .mega-menu-wrap::-webkit-scrollbar {
display: none;
}
}
header.style-1 .main-menu > ul > li .mega-menu .single-menu-item {
text-align: center;
}
header.style-1 .main-menu > ul > li .mega-menu .single-menu-item .home-img {
-webkit-mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home1/mega-menu-home-img-bg.png);
mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home1/mega-menu-home-img-bg.png);
-webkit-mask-size: cover;
mask-size: cover;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
border-radius: 10px;
transition: 0.5s;
position: relative;
margin-bottom: 15px;
display: block;
}
@media (max-width: 1199px) {
header.style-1 .main-menu > ul > li .mega-menu .single-menu-item .home-img {
margin-bottom: 15px;
}
}
header.style-1 .main-menu > ul > li .mega-menu .single-menu-item .home-img img {
border-radius: 10px;
}
header.style-1 .main-menu > ul > li .mega-menu .single-menu-item h5 {
margin-bottom: 0;
}
header.style-1 .main-menu > ul > li .mega-menu .single-menu-item h5 a {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 16px;
font-weight: 600;
line-height: 1.2;
text-transform: uppercase;
transition: 0.5s;
}
header.style-1 .main-menu > ul > li .mega-menu .single-menu-item h5 a span {
display: none;
}
header.style-1 .main-menu > ul > li .mega-menu .single-menu-item:hover h5 a {
color: var(--primary-color1);
}
header.style-1 .main-menu > ul > li .mega-menu .single-menu-item.current-menu-item h5 a, header.style-1 .main-menu > ul > li .mega-menu .single-menu-item.current_page_item h5 a, header.style-1 .main-menu > ul > li .mega-menu .single-menu-item.current-menu-ancestor h5 a, header.style-1 .main-menu > ul > li .mega-menu .single-menu-item.current-menu-parent h5 a, header.style-1 .main-menu > ul > li .mega-menu .single-menu-item.current_page_parent h5 a, header.style-1 .main-menu > ul > li .mega-menu .single-menu-item.current_page_ancestor h5 a {
color: var(--primary-color1);
}
header.style-1 .main-menu > ul > li.menu-item-has-children {
transition: all 0.55s ease-in-out;
}
header.style-1 .main-menu > ul > li.menu-item-has-children > a {
display: flex;
align-items: baseline;
gap: 5px;
}
@media (min-width: 992px) {
header.style-1 .main-menu > ul > li:hover > ul.sub-menu {
display: block;
animation: fade-down 0.3s linear;
}
}
@media (min-width: 992px) {
header.style-1 .main-menu > ul > li:hover .mega-menu {
display: block;
animation: fade-down 0.3s linear;
}
}
header.style-1 .main-menu > ul > li:hover > a {
background-color: var(--primary-color1);
color: var(--white-color);
}
header.style-1 .main-menu > ul > li:hover > a svg {
fill: var(--white-color);
}
header.style-1 .main-menu > ul > li:hover .dropdown-icon2 {
color: var(--primary-color1);
}
header.style-1 .main-menu > ul > li:hover.menu-item-has-children > a::before {
color: var(--title-color);
}
header.style-1 .main-menu > ul > li.current-menu-item > a, header.style-1 .main-menu > ul > li.current_page_item > a, header.style-1 .main-menu > ul > li.current-menu-ancestor > a, header.style-1 .main-menu > ul > li.current-menu-parent > a, header.style-1 .main-menu > ul > li.current_page_parent > a, header.style-1 .main-menu > ul > li.current_page_ancestor > a {
background-color: var(--primary-color1);
color: var(--white-color);
}
header.style-1 .main-menu > ul > li.current-menu-item > a svg, header.style-1 .main-menu > ul > li.current_page_item > a svg, header.style-1 .main-menu > ul > li.current-menu-ancestor > a svg, header.style-1 .main-menu > ul > li.current-menu-parent > a svg, header.style-1 .main-menu > ul > li.current_page_parent > a svg, header.style-1 .main-menu > ul > li.current_page_ancestor > a svg {
fill: var(--white-color);
}
header.style-1 .main-menu > ul > li.current-menu-item .dropdown-icon2, header.style-1 .main-menu > ul > li.current_page_item .dropdown-icon2, header.style-1 .main-menu > ul > li.current-menu-ancestor .dropdown-icon2, header.style-1 .main-menu > ul > li.current-menu-parent .dropdown-icon2, header.style-1 .main-menu > ul > li.current_page_parent .dropdown-icon2, header.style-1 .main-menu > ul > li.current_page_ancestor .dropdown-icon2 {
color: var(--primary-color1);
}
header.style-1 .main-menu > ul > li.current-menu-item.menu-item-has-children > a::before, header.style-1 .main-menu > ul > li.current_page_item.menu-item-has-children > a::before, header.style-1 .main-menu > ul > li.current-menu-ancestor.menu-item-has-children > a::before, header.style-1 .main-menu > ul > li.current-menu-parent.menu-item-has-children > a::before, header.style-1 .main-menu > ul > li.current_page_parent.menu-item-has-children > a::before, header.style-1 .main-menu > ul > li.current_page_ancestor.menu-item-has-children > a::before {
color: var(--title-color);
}
header.style-1 .main-menu > ul li.menu-item-has-children > i {
display: none;
}
header.style-1 .mobile-logo-area .mobile-logo-wrap img {
width: 130px;
}
header.style-1 .mobile-logo-area .mobile-logo-wrap img.dark {
display: none;
}
header.style-1 .mobile-logo-area .menu-close-btn {
height: 38px;
width: 38px;
border-radius: 10px;
border: 1px solid var(--borders-color);
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: 0.35s;
}
header.style-1 .mobile-logo-area .menu-close-btn i {
font-size: 26px;
line-height: 1;
color: var(--title-color);
transition: 0.35s;
}
header.style-1 .mobile-logo-area .menu-close-btn:hover {
background-color: var(--title-color);
}
header.style-1 .mobile-logo-area .menu-close-btn:hover i {
color: var(--white-color);
}
@media only screen and (max-width: 991px) {
header.style-1 .dropdown-icon {
color: var(--white-color);
}
header.style-1 .main-menu {
position: fixed;
top: 0;
left: 0;
width: 280px;
padding: 30px 20px !important;
z-index: 99999;
height: 100%;
overflow: auto;
background: var(--white-color);
border-right: 1px solid var(--borders-color);
transform: translateX(-100%);
transition: transform 0.3s ease-in;
box-shadow: 0px 2px 20px rgba(0, 0, 0, 0.03);
}
header.style-1 .main-menu.show-menu {
transform: translateX(0);
}
header.style-1 .main-menu .mobile-menu-logo {
text-align: left;
padding-top: 20px;
display: block;
padding-bottom: 8px;
}
header.style-1 .main-menu .menu-list {
padding-top: 50px;
padding-bottom: 30px;
border: unset;
}
header.style-1 .main-menu > ul {
float: none;
text-align: left;
padding: 5px 0px 20px 0;
}
header.style-1 .main-menu > ul > li {
position: relative;
display: block;
padding: 0;
}
header.style-1 .main-menu > ul > li i {
display: none;
}
header.style-1 .main-menu > ul > li.menu-item-has-children i {
display: block;
}
header.style-1 .main-menu > ul > li > a {
padding: 15px 0;
display: block;
border: unset;
background-color: transparent;
}
header.style-1 .main-menu > ul > li > a svg {
display: none !important;
}
header.style-1 .main-menu > ul > li ul.sub-menu {
position: static;
min-width: 200px;
border: none;
opacity: 1;
visibility: visible;
transform: translateY(0px);
background-image: unset;
padding: 0;
padding-left: 10px;
background-color: unset;
}
header.style-1 .main-menu > ul > li ul.sub-menu > li {
border-bottom: 1px solid transparent;
}
header.style-1 .main-menu > ul > li ul.sub-menu > li a {
color: var(--title-color);
padding: 12px 0px;
font-size: 13px;
}
header.style-1 .main-menu > ul > li ul.sub-menu > li a svg {
display: none !important;
}
header.style-1 .main-menu > ul > li ul.sub-menu > li a:hover {
color: var(--primary-color1);
margin-left: 10px;
}
header.style-1 .main-menu > ul > li ul.sub-menu > li a.active {
color: var(--primary-color1);
}
header.style-1 .main-menu > ul > li ul.sub-menu > li i {
color: var(--primary-color1);
right: -13px;
display: none;
}
header.style-1 .main-menu > ul > li ul.sub-menu > li.menu-item-has-children i {
display: block;
}
header.style-1 .main-menu > ul > li ul.sub-menu > li ul.sub-menu li i {
display: none;
}
header.style-1 .main-menu > ul > li ul.sub-menu > li ul.sub-menu li.menu-item-has-children i {
display: block;
}
header.style-1 .main-menu > ul > li .mega-menu {
position: static;
min-width: 200px;
border: none;
opacity: 1;
visibility: visible;
transform: translateY(0px);
background-image: unset;
padding: 0;
background-color: unset;
-webkit-backdrop-filter: unset;
backdrop-filter: unset;
min-height: unset;
}
header.style-1 .main-menu > ul > li .mega-menu .mega-menu-wrap {
background-image: unset;
border-radius: unset;
padding: 0;
}
header.style-1 .main-menu > ul > li .mega-menu .mega-menu-wrap .single-menu-item {
text-align: left;
}
header.style-1 .main-menu > ul > li .mega-menu .mega-menu-wrap .single-menu-item .home-img {
display: none;
}
header.style-1 .main-menu > ul > li .mega-menu .mega-menu-wrap .single-menu-item h5 a {
padding: 12px 0px;
font-weight: 400;
font-size: 13px;
font-family: var(--font-dmsans);
letter-spacing: 0.05em;
border-bottom: 1px solid rgba(13, 23, 32, 0.0784313725);
display: flex;
align-items: center;
gap: 5px;
width: 100%;
}
header.style-1 .main-menu > ul > li .mega-menu .mega-menu-wrap .single-menu-item h5 a span {
color: var(--white-color);
font-size: 8px;
font-family: var(--font-dmsans);
font-weight: 400;
text-transform: uppercase;
line-height: 1;
background-color: var(--primary-color1);
padding: 4px;
display: inline-block;
}
header.style-1 .main-menu > ul > li:hover > a {
color: var(--primary-color1);
background-color: transparent;
}
header.style-1 .main-menu > ul > li:hover i {
color: var(--primary-color1);
}
header.style-1 .main-menu > ul > li.current-menu-item > a, header.style-1 .main-menu > ul > li.current_page_item > a, header.style-1 .main-menu > ul > li.current-menu-ancestor > a, header.style-1 .main-menu > ul > li.current-menu-parent > a, header.style-1 .main-menu > ul > li.current_page_parent > a, header.style-1 .main-menu > ul > li.current_page_ancestor > a {
color: var(--primary-color1);
background-color: unset;
}
header.style-1 .main-menu > ul > li.current-menu-item i, header.style-1 .main-menu > ul > li.current_page_item i, header.style-1 .main-menu > ul > li.current-menu-ancestor i, header.style-1 .main-menu > ul > li.current-menu-parent i, header.style-1 .main-menu > ul > li.current_page_parent i, header.style-1 .main-menu > ul > li.current_page_ancestor i {
color: var(--primary-color1);
}
header.style-1 .main-menu > ul > li i.current-menu-item::before, header.style-1 .main-menu > ul > li i.current_page_item::before, header.style-1 .main-menu > ul > li i.current-menu-ancestor::before, header.style-1 .main-menu > ul > li i.current-menu-parent::before, header.style-1 .main-menu > ul > li i.current_page_parent::before, header.style-1 .main-menu > ul > li i.current_page_ancestor::before {
content: "\f2ea";
}
header.style-1 .main-menu > ul > li .bi {
position: absolute;
top: 11px;
right: 0;
font-size: 20px;
color: var(--title-color);
line-height: 1;
}
header.style-1 .main-menu > ul li.menu-item-has-children > i {
display: block;
}
header.style-1 .main-menu > ul li.menu-item-has-children > i.active::before {
content: "\f2ea";
}
header.style-1 .main-menu .btn-and-contact-area {
flex-direction: column;
align-items: center;
gap: 20px;
}
header.style-1 .primary-btn3 {
width: 100%;
justify-content: center;
}
}
header.style-1.engineering-header {
-webkit-backdrop-filter: blur(120px);
backdrop-filter: blur(120px);
background-color: rgba(var(--black-color-opc), 0.3);
transition: transform 0.3s ease, background-color 0.8s ease-out;
}
header.style-1.engineering-header.sticky {
animation: none;
}
header.style-1.engineering-header .main-menu > ul {
border: 1px solid rgba(255, 255, 255, 0.1);
}
header.style-1.engineering-header .main-menu > ul > li > a {
color: var(--white-color);
}
header.style-1.engineering-header .main-menu > ul > li > a svg {
fill: var(--white-color);
}
header.style-1.engineering-header .main-menu > ul > li .mega-menu .mega-menu-wrap {
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home5/home5-megamenu-bg.png), linear-gradient(#dbe2f4, #dbe2f4);
}
header.style-1.engineering-header .main-menu > ul > li .mega-menu .single-menu-item:hover h5 a {
color: var(--primary-color5);
}
header.style-1.engineering-header .main-menu > ul > li .mega-menu .single-menu-item.current-menu-item h5 a, header.style-1.engineering-header .main-menu > ul > li .mega-menu .single-menu-item.current_page_item h5 a, header.style-1.engineering-header .main-menu > ul > li .mega-menu .single-menu-item.current-menu-ancestor h5 a, header.style-1.engineering-header .main-menu > ul > li .mega-menu .single-menu-item.current-menu-parent h5 a, header.style-1.engineering-header .main-menu > ul > li .mega-menu .single-menu-item.current_page_parent h5 a, header.style-1.engineering-header .main-menu > ul > li .mega-menu .single-menu-item.current_page_ancestor h5 a {
color: var(--primary-color5);
}
header.style-1.engineering-header .main-menu > ul > li ul.sub-menu {
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home5/home5-sub-menu-bg.png), linear-gradient(#dbe2f4, #dbe2f4);
}
header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li > a span::before {
background: linear-gradient(90deg, #fff, var(--primary-color5), #fff);
}
header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li > a:hover {
color: var(--primary-color5);
}
header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li > a:hover svg {
fill: var(--primary-color5);
}
header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li > a.current-menu-item, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li > a.current_page_item, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li > a.current-menu-ancestor, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li > a.current-menu-parent, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li > a.current_page_parent, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li > a.current_page_ancestor {
color: var(--primary-color5);
}
header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li > a.current-menu-item svg, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li > a.current_page_item svg, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li > a.current-menu-ancestor svg, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li > a.current-menu-parent svg, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li > a.current_page_parent svg, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li > a.current_page_ancestor svg {
fill: var(--primary-color5);
}
header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li:hover > a {
color: var(--primary-color5);
}
header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li:hover .dropdown-icon {
color: var(--primary-color5);
}
header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li:hover .dropdown-icon2 {
color: var(--primary-color5);
}
header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li.current-menu-item > a, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li.current_page_item > a, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li.current-menu-ancestor > a, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li.current-menu-parent > a, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li.current_page_parent > a, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li.current_page_ancestor > a {
color: var(--primary-color5);
}
header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li.current-menu-item .dropdown-icon, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li.current_page_item .dropdown-icon, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li.current-menu-ancestor .dropdown-icon, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li.current-menu-parent .dropdown-icon, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li.current_page_parent .dropdown-icon, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li.current_page_ancestor .dropdown-icon {
color: var(--primary-color5);
}
header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li.current-menu-item .dropdown-icon2, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li.current_page_item .dropdown-icon2, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li.current-menu-ancestor .dropdown-icon2, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li.current-menu-parent .dropdown-icon2, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li.current_page_parent .dropdown-icon2, header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li.current_page_ancestor .dropdown-icon2 {
color: var(--primary-color5);
}
header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li .sub-menu {
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home5/sub-menu-bg.png), linear-gradient(#dbe2f4, #dbe2f4);
}
header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li .sub-menu::before {
display: none;
visibility: hidden;
}
@media only screen and (max-width: 991px) {
header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li .sub-menu {
margin-left: 10px;
position: unset;
max-width: 230px;
min-width: 215px;
background: transparent;
top: 0;
}
}
header.style-1.engineering-header .main-menu > ul > li:hover > a {
background-color: var(--primary-color5);
}
header.style-1.engineering-header .main-menu > ul > li:hover .dropdown-icon2 {
color: var(--primary-color5);
}
header.style-1.engineering-header .main-menu > ul > li.current-menu-item > a, header.style-1.engineering-header .main-menu > ul > li.current_page_item > a, header.style-1.engineering-header .main-menu > ul > li.current-menu-ancestor > a, header.style-1.engineering-header .main-menu > ul > li.current-menu-parent > a, header.style-1.engineering-header .main-menu > ul > li.current_page_parent > a, header.style-1.engineering-header .main-menu > ul > li.current_page_ancestor > a {
background-color: var(--primary-color5);
}
header.style-1.engineering-header .main-menu > ul > li.current-menu-item .dropdown-icon2, header.style-1.engineering-header .main-menu > ul > li.current_page_item .dropdown-icon2, header.style-1.engineering-header .main-menu > ul > li.current-menu-ancestor .dropdown-icon2, header.style-1.engineering-header .main-menu > ul > li.current-menu-parent .dropdown-icon2, header.style-1.engineering-header .main-menu > ul > li.current_page_parent .dropdown-icon2, header.style-1.engineering-header .main-menu > ul > li.current_page_ancestor .dropdown-icon2 {
color: var(--primary-color5);
}
header.style-1.engineering-header .nav-right .contact-area .icon {
background-color: rgba(255, 255, 255, 0.1);
}
header.style-1.engineering-header .nav-right .contact-area .icon svg {
fill: var(--white-color);
}
header.style-1.engineering-header .nav-right .contact-area .content span {
color: rgba(255, 255, 255, 0.6);
}
header.style-1.engineering-header .nav-right .contact-area .content a {
color: var(--white-color);
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-1.engineering-header .nav-right .contact-area .content a {
font-size: 13px;
}
}
header.style-1.engineering-header .nav-right .contact-area .content a:hover {
color: var(--primary-color5);
}
header.style-1.engineering-header .nav-right::before {
background-color: var(--white-color);
}
header.style-1.engineering-header .nav-right .right-sidebar-button {
background-color: rgba(255, 255, 255, 0.1);
-webkit-backdrop-filter: blur(4px);
backdrop-filter: blur(4px);
}
header.style-1.engineering-header .nav-right .right-sidebar-button svg {
fill: var(--white-color);
}
header.style-1.engineering-header .nav-right .right-sidebar-button span {
color: var(--white-color);
}
@media (max-width: 991px) {
header.style-1.engineering-header .nav-right .mobile-menu-btn {
border: 1px solid var(--borders-color);
}
header.style-1.engineering-header .nav-right .mobile-menu-btn svg {
fill: var(--white-color);
}
header.style-1.engineering-header .nav-right .mobile-menu-btn:hover svg {
animation: qode-draw 0.75s cubic-bezier(0.57, 0.39, 0, 0.86) 1 forwards;
}
}
@media only screen and (max-width: 991px) {
header.style-1.engineering-header .dropdown-icon {
color: var(--white-color);
}
header.style-1.engineering-header .main-menu {
min-height: 100vh;
}
header.style-1.engineering-header .main-menu.show-menu {
transform: translateX(0);
}
header.style-1.engineering-header .main-menu .menu-list {
padding-top: 50px;
padding-bottom: 30px;
border: unset;
}
header.style-1.engineering-header .main-menu > ul > li i {
display: none;
}
header.style-1.engineering-header .main-menu > ul > li.menu-item-has-children i {
display: block;
}
header.style-1.engineering-header .main-menu > ul > li > a {
color: var(--title-color);
padding: 15px 0;
display: block;
border: unset;
background-color: transparent;
}
header.style-1.engineering-header .main-menu > ul > li > a i {
display: none;
}
header.style-1.engineering-header .main-menu > ul > li ul.sub-menu {
transform: translateY(0px);
background-image: unset;
padding: 0;
padding-left: 10px;
background-color: unset;
}
header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li {
border-bottom: 1px solid transparent;
}
header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li a {
color: var(--title-color);
padding: 12px 0px;
}
header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li a:hover {
color: var(--primary-color5);
margin-left: 10px;
}
header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li a.active {
color: var(--primary-color5);
}
header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li i {
color: var(--primary-color5);
right: -5px;
display: none;
}
header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li.menu-item-has-children i {
display: block;
}
header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li ul.sub-menu li i {
display: none;
}
header.style-1.engineering-header .main-menu > ul > li ul.sub-menu > li ul.sub-menu li.menu-item-has-children i {
display: block;
}
header.style-1.engineering-header .main-menu > ul > li .mega-menu .mega-menu-wrap {
background-image: unset;
}
header.style-1.engineering-header .main-menu > ul > li .mega-menu .mega-menu-wrap .single-menu-item h5 a span {
background-color: var(--primary-color5);
}
header.style-1.engineering-header .main-menu > ul > li:hover > a {
color: var(--primary-color5);
background-color: transparent;
}
header.style-1.engineering-header .main-menu > ul > li:hover i {
color: var(--primary-color5);
}
header.style-1.engineering-header .main-menu > ul > li.current-menu-item > a, header.style-1.engineering-header .main-menu > ul > li.current_page_item > a, header.style-1.engineering-header .main-menu > ul > li.current-menu-ancestor > a, header.style-1.engineering-header .main-menu > ul > li.current-menu-parent > a, header.style-1.engineering-header .main-menu > ul > li.current_page_parent > a, header.style-1.engineering-header .main-menu > ul > li.current_page_ancestor > a {
color: var(--primary-color5);
background-color: unset;
}
header.style-1.engineering-header .main-menu > ul > li.current-menu-item i, header.style-1.engineering-header .main-menu > ul > li.current_page_item i, header.style-1.engineering-header .main-menu > ul > li.current-menu-ancestor i, header.style-1.engineering-header .main-menu > ul > li.current-menu-parent i, header.style-1.engineering-header .main-menu > ul > li.current_page_parent i, header.style-1.engineering-header .main-menu > ul > li.current_page_ancestor i {
color: var(--primary-color5);
}
header.style-1.engineering-header .main-menu > ul li.menu-item-has-children > i {
display: block;
}
header.style-1.engineering-header .main-menu .btn-and-contact-area {
flex-direction: column;
align-items: center;
gap: 20px;
}
}
header.style-1.inner-page {
border-bottom: 1px solid rgba(var(--black-color-opc), 0.08);
background-color: #fffbf5;
position: fixed;
top: 0;
left: 0;
width: 100%;
padding: 23px 90px;
}
@media (max-width: 1699px) {
header.style-1.inner-page {
padding: 18px 70px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
header.style-1.inner-page {
padding: 18px 30px;
}
}
@media (max-width: 1399px) {
header.style-1.inner-page {
padding: 18px 20px;
}
}
@media (max-width: 1199px) {
header.style-1.inner-page {
padding: 18px 10px;
}
}
@media (max-width: 767px) {
header.style-1.inner-page {
padding: 18px 10px;
}
}
@media (max-width: 576px) {
header.style-1.inner-page {
padding: 18px 0;
}
}
header.style-1.inner-page.sticky {
animation: unset;
}
header.style-2 {
position: absolute;
width: 100%;
z-index: 999;
transition: all 0.8s ease-out 0s;
background-color: transparent;
padding: 20px 90px;
}
@media (max-width: 1799px) {
header.style-2 {
padding: 18px 70px;
}
}
@media (max-width: 1699px) {
header.style-2 {
padding: 18px 50px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
header.style-2 {
padding: 18px 30px;
}
}
@media (max-width: 1399px) {
header.style-2 {
padding: 18px 10px;
}
}
@media (max-width: 1199px) {
header.style-2 {
border-bottom: 1px solid rgba(var(--black-color-opc), 0.07);
}
}
@media (max-width: 576px) {
header.style-2 {
padding: 18px 0;
}
}
header.style-2.sticky {
position: fixed;
top: 0;
left: 0;
width: 100%;
box-sizing: border-box;
background-color: var(--white-color);
box-shadow: 5px 3px 40px rgba(0, 72, 88, 0.1);
z-index: 999;
animation: smooth-header 0.65s linear;
}
header.style-2.sticky .company-logo .logo-black {
display: block;
}
header.style-2.sticky .company-logo .logo-white {
display: none;
}
header.style-2 .company-logo img {
width: 157px;
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-2 .company-logo img {
width: 145px;
}
}
@media (max-width: 576px) {
header.style-2 .company-logo img {
width: 145px;
}
}
header.style-2 .company-logo .logo-black {
display: none;
}
@media (max-width: 1199px) {
header.style-2 .company-logo .logo-black {
display: block;
}
}
@media (max-width: 1199px) {
header.style-2 .company-logo .logo-white {
display: none;
}
}
header.style-2 .menu-wrap {
display: flex;
align-items: center;
gap: 80px;
}
@media (max-width: 1799px) {
header.style-2 .menu-wrap {
gap: 70px;
}
}
@media (max-width: 1699px) {
header.style-2 .menu-wrap {
gap: 50px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
header.style-2 .menu-wrap {
gap: 25px;
}
}
@media (max-width: 1399px) {
header.style-2 .menu-wrap {
gap: 25px;
}
}
header.style-2 .nav-right {
display: flex;
align-items: center;
gap: 25px;
position: relative;
}
@media (max-width: 1199px) {
header.style-2 .nav-right {
gap: 20px;
}
}
@media (max-width: 576px) {
header.style-2 .nav-right {
gap: 15px;
}
}
header.style-2 .nav-right .primary-btn3 {
padding: 17px 49px 17px 23px;
}
header.style-2 .nav-right .right-sidebar-button {
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
position: relative;
min-width: 40px;
max-width: 40px;
height: 40px;
border-radius: 50%;
background-color: rgba(var(--primary-color2-opc), 0.1);
}
header.style-2 .nav-right .right-sidebar-button svg {
fill: var(--title-color);
}
header.style-2 .nav-right .right-sidebar-button:hover svg {
animation: qode-draw 0.75s cubic-bezier(0.57, 0.39, 0, 0.86) 1 forwards;
}
header.style-2 .nav-right .mobile-menu-btn {
display: none;
visibility: hidden;
}
@media (max-width: 991px) {
header.style-2 .nav-right .mobile-menu-btn {
display: flex;
align-items: center;
visibility: visible;
justify-content: center;
position: relative;
min-width: 40px;
max-width: 40px;
height: 40px;
border-radius: 10px;
border: 1px solid var(--borders-color);
}
header.style-2 .nav-right .mobile-menu-btn svg {
fill: var(--title-color);
}
header.style-2 .nav-right .mobile-menu-btn:hover svg {
animation: qode-draw 0.75s cubic-bezier(0.57, 0.39, 0, 0.86) 1 forwards;
}
}
@media (max-width: 576px) {
header.style-2 .nav-right .mobile-menu-btn {
min-width: 40px;
max-width: 40px;
height: 40px;
}
header.style-2 .nav-right .mobile-menu-btn svg {
width: 18px;
}
}
@keyframes qode-draw {
0%, 100% {
clip-path: inset(-2px -2px);
}
42% {
clip-path: inset(-2px -2px -2px 100%);
}
43% {
clip-path: inset(-2px 100% -3px -2px);
}
}
header.style-2 .main-menu {
display: inline-block;
}
header.style-2 .main-menu > ul {
padding: 0;
margin: 0;
list-style: none;
}
header.style-2 .main-menu > ul > li {
display: inline-block;
position: relative;
}
header.style-2 .main-menu > ul > li.position-inherit {
position: inherit;
}
@media (max-width: 991px) {
header.style-2 .main-menu > ul > li.position-inherit {
position: relative;
}
}
@media (min-width: 992px) {
header.style-2 .main-menu > ul > li:first-child {
padding-left: 0;
}
header.style-2 .main-menu > ul > li:last-child {
padding-right: 0;
}
}
header.style-2 .main-menu > ul > li > a {
color: var(--title-color);
display: block;
letter-spacing: 0.4px;
padding: 17px 22px;
line-height: 1;
position: relative;
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
text-transform: uppercase;
transition: all 0.5s ease-out 0s;
position: relative;
background-color: transparent;
border-radius: 100px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
header.style-2 .main-menu > ul > li > a {
padding: 17px 15px;
}
}
@media (max-width: 1399px) {
header.style-2 .main-menu > ul > li > a {
padding: 17px 13px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-2 .main-menu > ul > li > a {
font-size: 12px;
padding: 17px 10px;
}
}
header.style-2 .main-menu > ul > li > a svg {
display: none;
fill: var(--title-color);
transition: 0.5s;
}
@media (max-width: 991px) {
header.style-2 .main-menu > ul > li > a svg {
display: none;
}
}
header.style-2 .main-menu > ul > li ul.sub-menu {
position: absolute;
left: -70px;
right: 0;
top: auto;
padding: 10px 0;
margin: 0;
display: none;
min-width: 292px;
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home1/sub-menu-bg.png), linear-gradient(#f1f5ff, #f1f5ff);
border-radius: 0 0 20px 20px;
text-align: left;
transform-origin: top;
}
@media (max-width: 1699px) {
header.style-2 .main-menu > ul > li ul.sub-menu {
min-width: 280px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
header.style-2 .main-menu > ul > li ul.sub-menu {
min-width: 245px;
}
}
@media (max-width: 1399px) {
header.style-2 .main-menu > ul > li ul.sub-menu {
min-width: 230px;
}
}
header.style-2 .main-menu > ul > li ul.sub-menu > li {
padding: 0;
display: block;
position: relative;
}
header.style-2 .main-menu > ul > li ul.sub-menu > li::after {
display: none;
}
header.style-2 .main-menu > ul > li ul.sub-menu > li i {
position: absolute;
top: 10px;
right: 6px;
display: block;
color: var(--title-color);
font-size: 20px;
}
header.style-2 .main-menu > ul > li ul.sub-menu > li .dropdown-icon {
color: var(--title-color);
opacity: 1;
top: 17px;
font-size: 13px;
right: 15px;
}
@media (max-width: 991px) {
header.style-2 .main-menu > ul > li ul.sub-menu > li .dropdown-icon {
right: 0;
top: 11px;
font-size: 20px;
}
}
header.style-2 .main-menu > ul > li ul.sub-menu > li .dropdown-icon2 {
color: var(--title-color);
opacity: 1;
top: 14px;
right: 10px;
font-size: 13px;
}
@media (max-width: 1199px) {
header.style-2 .main-menu > ul > li ul.sub-menu > li .dropdown-icon2::before {
content: "\f4fe";
}
}
header.style-2 .main-menu > ul > li ul.sub-menu > li > a {
display: block;
padding: 0 35px;
font-family: var(--font-dmsans);
color: var(--title-color);
font-weight: 400;
text-transform: uppercase;
font-size: 14px;
line-height: 1.4;
letter-spacing: 0.05em;
transition: all 0.4s ease-out 0s;
position: relative;
border-radius: 0;
border: none;
display: flex;
align-items: center;
justify-content: space-between;
}
@media (min-width: 1400px) and (max-width: 1599px) {
header.style-2 .main-menu > ul > li ul.sub-menu > li > a {
padding: 0 25px;
}
}
@media (max-width: 1399px) {
header.style-2 .main-menu > ul > li ul.sub-menu > li > a {
padding: 0 20px;
font-size: 13px;
}
}
@media (max-width: 991px) {
header.style-2 .main-menu > ul > li ul.sub-menu > li > a {
border-bottom: 1px solid rgba(13, 23, 32, 0.0784313725);
}
header.style-2 .main-menu > ul > li ul.sub-menu > li > a::before {
background: linear-gradient(90deg, #525252, #ec6219, #525252);
}
}
header.style-2 .main-menu > ul > li ul.sub-menu > li > a svg {
display: none;
fill: var(--title-color);
transition: all 0.4s ease-out 0s;
}
@media (max-width: 991px) {
header.style-2 .main-menu > ul > li ul.sub-menu > li > a svg {
display: none;
}
}
header.style-2 .main-menu > ul > li ul.sub-menu > li > a span {
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
border-bottom: 1px solid rgba(13, 23, 32, 0.0784313725);
padding: 14px 0px 14px 10px;
}
header.style-2 .main-menu > ul > li ul.sub-menu > li > a span::before {
content: "";
position: absolute;
bottom: -1px;
left: 0;
background: linear-gradient(90deg, #fff, var(--primary-color2), #fff);
width: 100%;
height: 1px;
transform: scaleX(0);
transform-origin: left;
transition: 0.4s ease-in;
z-index: 1;
}
@media (max-width: 991px) {
header.style-2 .main-menu > ul > li ul.sub-menu > li > a span {
border: unset;
padding: 0;
}
header.style-2 .main-menu > ul > li ul.sub-menu > li > a span::before {
display: none;
}
}
header.style-2 .main-menu > ul > li ul.sub-menu > li > a:hover {
color: var(--primary-color2);
}
header.style-2 .main-menu > ul > li ul.sub-menu > li > a:hover svg {
fill: var(--primary-color2);
}
header.style-2 .main-menu > ul > li ul.sub-menu > li > a:hover span::before {
transform: scale(1);
}
header.style-2 .main-menu > ul > li ul.sub-menu > li > a.current-menu-item, header.style-2 .main-menu > ul > li ul.sub-menu > li > a.current_page_item, header.style-2 .main-menu > ul > li ul.sub-menu > li > a.current-menu-ancestor, header.style-2 .main-menu > ul > li ul.sub-menu > li > a.current-menu-parent, header.style-2 .main-menu > ul > li ul.sub-menu > li > a.current_page_parent, header.style-2 .main-menu > ul > li ul.sub-menu > li > a.current_page_ancestor {
color: var(--primary-color2);
}
header.style-2 .main-menu > ul > li ul.sub-menu > li > a.current-menu-item svg, header.style-2 .main-menu > ul > li ul.sub-menu > li > a.current_page_item svg, header.style-2 .main-menu > ul > li ul.sub-menu > li > a.current-menu-ancestor svg, header.style-2 .main-menu > ul > li ul.sub-menu > li > a.current-menu-parent svg, header.style-2 .main-menu > ul > li ul.sub-menu > li > a.current_page_parent svg, header.style-2 .main-menu > ul > li ul.sub-menu > li > a.current_page_ancestor svg {
fill: var(--primary-color2);
}
header.style-2 .main-menu > ul > li ul.sub-menu > li > a.current-menu-item span::before, header.style-2 .main-menu > ul > li ul.sub-menu > li > a.current_page_item span::before, header.style-2 .main-menu > ul > li ul.sub-menu > li > a.current-menu-ancestor span::before, header.style-2 .main-menu > ul > li ul.sub-menu > li > a.current-menu-parent span::before, header.style-2 .main-menu > ul > li ul.sub-menu > li > a.current_page_parent span::before, header.style-2 .main-menu > ul > li ul.sub-menu > li > a.current_page_ancestor span::before {
transform: scale(1);
}
header.style-2 .main-menu > ul > li ul.sub-menu > li.menu-item-has-children > a svg {
display: block;
}
header.style-2 .main-menu > ul > li ul.sub-menu > li:last-child a span {
border-bottom: none;
}
header.style-2 .main-menu > ul > li ul.sub-menu > li:last-child a span::before {
display: none;
}
header.style-2 .main-menu > ul > li ul.sub-menu > li:last-child .sub-menu li a {
border-bottom: 1px solid rgba(13, 23, 32, 0.0784313725);
}
header.style-2 .main-menu > ul > li ul.sub-menu > li:last-child .sub-menu li a::before {
display: block;
}
header.style-2 .main-menu > ul > li ul.sub-menu > li:last-child .sub-menu li:last-child a {
border-bottom: none;
}
header.style-2 .main-menu > ul > li ul.sub-menu > li:last-child .sub-menu li:last-child a::before {
display: none;
}
header.style-2 .main-menu > ul > li ul.sub-menu > li:hover > a {
color: var(--primary-color2);
}
@media (min-width: 992px) {
header.style-2 .main-menu > ul > li ul.sub-menu > li:hover > ul.sub-menu {
display: block;
animation: fade-down 0.3s linear;
}
}
header.style-2 .main-menu > ul > li ul.sub-menu > li:hover .dropdown-icon {
color: var(--primary-color2);
}
header.style-2 .main-menu > ul > li ul.sub-menu > li:hover .dropdown-icon2 {
color: var(--primary-color2);
}
header.style-2 .main-menu > ul > li ul.sub-menu > li.current-menu-item > a, header.style-2 .main-menu > ul > li ul.sub-menu > li.current_page_item > a, header.style-2 .main-menu > ul > li ul.sub-menu > li.current-menu-ancestor > a, header.style-2 .main-menu > ul > li ul.sub-menu > li.current-menu-parent > a, header.style-2 .main-menu > ul > li ul.sub-menu > li.current_page_parent > a, header.style-2 .main-menu > ul > li ul.sub-menu > li.current_page_ancestor > a {
color: var(--primary-color2);
}
header.style-2 .main-menu > ul > li ul.sub-menu > li.current-menu-item .dropdown-icon, header.style-2 .main-menu > ul > li ul.sub-menu > li.current_page_item .dropdown-icon, header.style-2 .main-menu > ul > li ul.sub-menu > li.current-menu-ancestor .dropdown-icon, header.style-2 .main-menu > ul > li ul.sub-menu > li.current-menu-parent .dropdown-icon, header.style-2 .main-menu > ul > li ul.sub-menu > li.current_page_parent .dropdown-icon, header.style-2 .main-menu > ul > li ul.sub-menu > li.current_page_ancestor .dropdown-icon {
color: var(--primary-color2);
}
header.style-2 .main-menu > ul > li ul.sub-menu > li.current-menu-item .dropdown-icon2, header.style-2 .main-menu > ul > li ul.sub-menu > li.current_page_item .dropdown-icon2, header.style-2 .main-menu > ul > li ul.sub-menu > li.current-menu-ancestor .dropdown-icon2, header.style-2 .main-menu > ul > li ul.sub-menu > li.current-menu-parent .dropdown-icon2, header.style-2 .main-menu > ul > li ul.sub-menu > li.current_page_parent .dropdown-icon2, header.style-2 .main-menu > ul > li ul.sub-menu > li.current_page_ancestor .dropdown-icon2 {
color: var(--primary-color2);
}
header.style-2 .main-menu > ul > li ul.sub-menu > li .sub-menu {
left: 293px;
position: absolute;
max-width: 230px;
min-width: 215px;
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home1/sub-menu-bg.png), linear-gradient(#f1f5ff, #f1f5ff);
top: 0;
}
@media (max-width: 1699px) {
header.style-2 .main-menu > ul > li ul.sub-menu > li .sub-menu {
left: 281px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
header.style-2 .main-menu > ul > li ul.sub-menu > li .sub-menu {
left: 246px;
min-width: 200px;
max-width: 200px;
}
}
@media (max-width: 1399px) {
header.style-2 .main-menu > ul > li ul.sub-menu > li .sub-menu {
left: 231px;
min-width: 190px;
max-width: 190px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-2 .main-menu > ul > li ul.sub-menu > li .sub-menu {
left: unset;
right: 231px;
}
}
header.style-2 .main-menu > ul > li ul.sub-menu > li .sub-menu::before {
display: none;
visibility: hidden;
}
@media only screen and (max-width: 991px) {
header.style-2 .main-menu > ul > li ul.sub-menu > li .sub-menu {
margin-left: 10px;
position: unset;
max-width: 230px;
min-width: 215px;
background: transparent;
top: 0;
}
}
header.style-2 .main-menu > ul > li ul.sub-menu > li .sub-menu > li i {
display: block;
}
header.style-2 .main-menu > ul > li ul.sub-menu > li .sub-menu > li a {
padding: 0 20px;
}
@media (max-width: 1399px) {
header.style-2 .main-menu > ul > li ul.sub-menu > li .sub-menu > li a {
padding: 0 15px;
}
}
@media (max-width: 991px) {
header.style-2 .main-menu > ul > li ul.sub-menu > li .sub-menu > li a {
padding: 12px 0px;
}
}
header.style-2 .main-menu > ul > li ul.sub-menu > li:last-child {
border-bottom: none;
}
header.style-2 .main-menu > ul > li .mega-menu {
position: absolute;
left: 0;
top: 68px;
margin: 0;
width: 100%;
background-color: rgba(var(--black-color-opc), 0.3);
-webkit-backdrop-filter: blur(15px);
backdrop-filter: blur(15px);
min-height: 100vh;
display: none;
transform-origin: top;
}
@media (min-width: 1400px) and (max-width: 1599px) {
header.style-2 .main-menu > ul > li .mega-menu {
top: 62px;
}
}
@media (max-width: 1199px) {
header.style-2 .main-menu > ul > li .mega-menu {
top: 62px;
}
}
header.style-2 .main-menu > ul > li .mega-menu .mega-menu-wrap {
padding: 70px 0px;
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home1/home1-megamenu-bg.png), linear-gradient(#fff4f1, #fff4f1);
background-size: cover;
background-repeat: no-repeat;
width: 100%;
border-radius: 0 0 100px 100px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
header.style-2 .main-menu > ul > li .mega-menu .mega-menu-wrap {
max-height: 600px;
overflow-y: auto;
padding: 50px 0;
}
header.style-2 .main-menu > ul > li .mega-menu .mega-menu-wrap::-webkit-scrollbar {
display: none;
}
}
@media (max-width: 1199px) {
header.style-2 .main-menu > ul > li .mega-menu .mega-menu-wrap {
max-height: 570px;
overflow-y: auto;
padding: 50px 0;
border-radius: 0 0 60px 60px;
}
header.style-2 .main-menu > ul > li .mega-menu .mega-menu-wrap::-webkit-scrollbar {
display: none;
}
}
header.style-2 .main-menu > ul > li .mega-menu .single-menu-item {
text-align: center;
}
header.style-2 .main-menu > ul > li .mega-menu .single-menu-item .home-img {
-webkit-mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home1/mega-menu-home-img-bg.png);
mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home1/mega-menu-home-img-bg.png);
-webkit-mask-size: cover;
mask-size: cover;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
border-radius: 10px;
transition: 0.5s;
position: relative;
margin-bottom: 15px;
display: block;
}
@media (max-width: 1199px) {
header.style-2 .main-menu > ul > li .mega-menu .single-menu-item .home-img {
margin-bottom: 15px;
}
}
header.style-2 .main-menu > ul > li .mega-menu .single-menu-item .home-img img {
border-radius: 10px;
}
header.style-2 .main-menu > ul > li .mega-menu .single-menu-item h5 {
margin-bottom: 0;
}
header.style-2 .main-menu > ul > li .mega-menu .single-menu-item h5 a {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 16px;
font-weight: 600;
line-height: 1.2;
text-transform: uppercase;
transition: 0.5s;
}
header.style-2 .main-menu > ul > li .mega-menu .single-menu-item h5 a span {
display: none;
}
header.style-2 .main-menu > ul > li .mega-menu .single-menu-item:hover h5 a {
color: var(--primary-color2);
}
header.style-2 .main-menu > ul > li .mega-menu .single-menu-item.active h5 a {
color: var(--primary-color2);
}
header.style-2 .main-menu > ul > li.menu-item-has-children {
transition: all 0.55s ease-in-out;
}
header.style-2 .main-menu > ul > li.menu-item-has-children > a {
display: flex;
align-items: baseline;
gap: 5px;
}
header.style-2 .main-menu > ul > li.menu-item-has-children > a svg {
display: block;
}
@media (min-width: 992px) {
header.style-2 .main-menu > ul > li:hover > ul.sub-menu {
display: block;
animation: fade-down 0.3s linear;
}
}
@media (min-width: 992px) {
header.style-2 .main-menu > ul > li:hover .mega-menu {
display: block;
animation: fade-down 0.3s linear;
}
}
header.style-2 .main-menu > ul > li:hover > a {
color: var(--primary-color2);
}
header.style-2 .main-menu > ul > li:hover > a svg {
fill: var(--primary-color2);
}
header.style-2 .main-menu > ul > li:hover .dropdown-icon2 {
color: var(--primary-color2);
}
header.style-2 .main-menu > ul > li:hover.menu-item-has-children > a::before {
color: var(--title-color);
}
header.style-2 .main-menu > ul > li.current-menu-item > a, header.style-2 .main-menu > ul > li.current_page_item > a, header.style-2 .main-menu > ul > li.current-menu-ancestor > a, header.style-2 .main-menu > ul > li.current-menu-parent > a, header.style-2 .main-menu > ul > li.current_page_parent > a, header.style-2 .main-menu > ul > li.current_page_ancestor > a, header.style-2 .main-menu > ul > li.active > a {
color: var(--primary-color2);
}
header.style-2 .main-menu > ul > li.current-menu-item > a svg, header.style-2 .main-menu > ul > li.current_page_item > a svg, header.style-2 .main-menu > ul > li.current-menu-ancestor > a svg, header.style-2 .main-menu > ul > li.current-menu-parent > a svg, header.style-2 .main-menu > ul > li.current_page_parent > a svg, header.style-2 .main-menu > ul > li.current_page_ancestor > a svg, header.style-2 .main-menu > ul > li.active > a svg {
fill: var(--primary-color2);
}
header.style-2 .main-menu > ul > li.current-menu-item .dropdown-icon2, header.style-2 .main-menu > ul > li.current_page_item .dropdown-icon2, header.style-2 .main-menu > ul > li.current-menu-ancestor .dropdown-icon2, header.style-2 .main-menu > ul > li.current-menu-parent .dropdown-icon2, header.style-2 .main-menu > ul > li.current_page_parent .dropdown-icon2, header.style-2 .main-menu > ul > li.current_page_ancestor .dropdown-icon2, header.style-2 .main-menu > ul > li.active .dropdown-icon2 {
color: var(--primary-color2);
}
header.style-2 .main-menu > ul > li.current-menu-item.menu-item-has-children > a::before, header.style-2 .main-menu > ul > li.current_page_item.menu-item-has-children > a::before, header.style-2 .main-menu > ul > li.current-menu-ancestor.menu-item-has-children > a::before, header.style-2 .main-menu > ul > li.current-menu-parent.menu-item-has-children > a::before, header.style-2 .main-menu > ul > li.current_page_parent.menu-item-has-children > a::before, header.style-2 .main-menu > ul > li.current_page_ancestor.menu-item-has-children > a::before, header.style-2 .main-menu > ul > li.active.menu-item-has-children > a::before {
color: var(--title-color);
}
header.style-2 .main-menu > ul li.menu-item-has-children > i {
display: none;
}
header.style-2 .mobile-logo-area .mobile-logo-wrap img {
width: 130px;
}
header.style-2 .mobile-logo-area .mobile-logo-wrap img.dark {
display: none;
}
header.style-2 .mobile-logo-area .menu-close-btn {
height: 38px;
width: 38px;
border-radius: 10px;
border: 1px solid var(--borders-color);
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: 0.35s;
}
header.style-2 .mobile-logo-area .menu-close-btn i {
font-size: 26px;
line-height: 1;
color: var(--title-color);
transition: 0.35s;
}
header.style-2 .mobile-logo-area .menu-close-btn:hover {
background-color: var(--title-color);
}
header.style-2 .mobile-logo-area .menu-close-btn:hover i {
color: var(--white-color);
}
@media only screen and (max-width: 991px) {
header.style-2 .dropdown-icon {
color: var(--white-color);
}
header.style-2 .main-menu {
position: fixed;
top: 0;
left: 0;
width: 280px;
padding: 30px 20px !important;
z-index: 99999;
height: 100%;
overflow: auto;
background: var(--white-color);
border-right: 1px solid var(--borders-color);
transform: translateX(-100%);
transition: transform 0.3s ease-in;
box-shadow: 0px 2px 20px rgba(0, 0, 0, 0.03);
}
header.style-2 .main-menu.show-menu {
transform: translateX(0);
}
header.style-2 .main-menu .mobile-menu-logo {
text-align: left;
padding-top: 20px;
display: block;
padding-bottom: 8px;
}
header.style-2 .main-menu .menu-list {
padding-top: 50px;
padding-bottom: 30px;
border: unset;
}
header.style-2 .main-menu > ul {
float: none;
text-align: left;
padding: 5px 0px 20px 0;
}
header.style-2 .main-menu > ul > li {
display: block;
position: relative;
padding: 0;
}
header.style-2 .main-menu > ul > li i {
display: none;
}
header.style-2 .main-menu > ul > li.menu-item-has-children i {
display: block;
}
header.style-2 .main-menu > ul > li > a {
padding: 15px 0;
display: block;
border: unset;
background-color: transparent;
}
header.style-2 .main-menu > ul > li > a svg,
header.style-2 .main-menu > ul > li > a i {
display: none !important;
}
header.style-2 .main-menu > ul > li ul.sub-menu {
position: static;
min-width: 200px;
border: none;
opacity: 1;
visibility: visible;
transform: translateY(0px);
background-image: unset;
padding: 0;
padding-left: 10px;
background-color: unset;
}
header.style-2 .main-menu > ul > li ul.sub-menu > li {
border-bottom: 1px solid transparent;
}
header.style-2 .main-menu > ul > li ul.sub-menu > li a {
color: var(--title-color);
padding: 12px 0px;
}
header.style-2 .main-menu > ul > li ul.sub-menu > li a svg,
header.style-2 .main-menu > ul > li ul.sub-menu > li a i {
display: none !important;
}
header.style-2 .main-menu > ul > li ul.sub-menu > li a:hover {
color: var(--primary-color1);
margin-left: 10px;
}
header.style-2 .main-menu > ul > li ul.sub-menu > li a.active {
color: var(--primary-color1);
}
header.style-2 .main-menu > ul > li ul.sub-menu > li i {
color: var(--primary-color1);
right: -13px;
display: none;
}
header.style-2 .main-menu > ul > li ul.sub-menu > li.menu-item-has-children i {
display: block;
}
header.style-2 .main-menu > ul > li ul.sub-menu > li ul.sub-menu li i {
display: none;
}
header.style-2 .main-menu > ul > li ul.sub-menu > li ul.sub-menu li.menu-item-has-children i {
display: block;
}
header.style-2 .main-menu > ul > li .mega-menu {
position: static;
min-width: 200px;
border: none;
opacity: 1;
visibility: visible;
transform: translateY(0px);
background-image: unset;
padding: 0;
background-color: unset;
-webkit-backdrop-filter: unset;
backdrop-filter: unset;
min-height: unset;
}
header.style-2 .main-menu > ul > li .mega-menu .mega-menu-wrap {
background-image: unset;
border-radius: unset;
padding: 0;
}
header.style-2 .main-menu > ul > li .mega-menu .mega-menu-wrap .single-menu-item {
text-align: left;
}
header.style-2 .main-menu > ul > li .mega-menu .mega-menu-wrap .single-menu-item .home-img {
display: none;
}
header.style-2 .main-menu > ul > li .mega-menu .mega-menu-wrap .single-menu-item h5 a {
padding: 12px 0px;
font-weight: 400;
font-size: 13px;
font-family: var(--font-dmsans);
letter-spacing: 0.05em;
border-bottom: 1px solid rgba(13, 23, 32, 0.0784313725);
display: flex;
align-items: center;
gap: 5px;
width: 100%;
}
header.style-2 .main-menu > ul > li .mega-menu .mega-menu-wrap .single-menu-item h5 a span {
color: var(--white-color);
font-size: 8px;
font-family: var(--font-dmsans);
font-weight: 400;
text-transform: uppercase;
line-height: 1;
background-color: var(--primary-color2);
padding: 4px;
display: inline-block;
}
header.style-2 .main-menu > ul > li:hover > a {
color: var(--primary-color2);
background-color: transparent;
}
header.style-2 .main-menu > ul > li:hover i {
color: var(--primary-color2);
}
header.style-2 .main-menu > ul > li.active > a {
color: var(--primary-color2);
background-color: unset;
}
header.style-2 .main-menu > ul > li.active i {
color: var(--primary-color2);
}
header.style-2 .main-menu > ul > li i.active::before {
content: "\f2ea";
}
header.style-2 .main-menu > ul > li .bi {
position: absolute;
top: 11px;
right: 0;
font-size: 20px;
color: var(--title-color);
line-height: 1;
}
header.style-2 .main-menu > ul li.menu-item-has-children > i {
display: block;
}
header.style-2 .main-menu .btn-and-contact-area {
flex-direction: column;
align-items: center;
gap: 20px;
}
header.style-2 .primary-btn3 {
width: 100%;
justify-content: center;
}
}
header.style-3 {
position: absolute;
width: 100%;
z-index: 999;
transition: all 0.8s ease-out 0s;
background-color: transparent;
padding: 0px 130px;
border-bottom: 1px solid rgba(var(--black-color-opc), 0.07);
}
@media (max-width: 1799px) {
header.style-3 {
padding: 0px 120px;
}
}
@media (max-width: 1699px) {
header.style-3 {
padding: 0px 80px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
header.style-3 {
padding: 0px 40px;
}
}
@media (max-width: 1399px) {
header.style-3 {
padding: 0px 10px;
}
}
@media (max-width: 991px) {
header.style-3 {
padding: 18px 10px;
}
}
@media (max-width: 576px) {
header.style-3 {
padding: 18px 0;
}
}
header.style-3.sticky {
position: fixed;
top: 0;
left: 0;
width: 100%;
box-sizing: border-box;
background-color: var(--white-color);
box-shadow: 5px 3px 40px rgba(0, 72, 88, 0.1);
z-index: 999;
animation: smooth-header 0.65s linear;
}
header.style-3.sticky .company-logo .logo-black {
display: block;
}
header.style-3.sticky .company-logo .logo-white {
display: none;
}
header.style-3 .company-logo img {
width: 157px;
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-3 .company-logo img {
width: 145px;
}
}
@media (max-width: 576px) {
header.style-3 .company-logo img {
width: 145px;
}
}
header.style-3 .menu-wrap {
display: flex;
align-items: center;
gap: 80px;
}
@media (max-width: 1799px) {
header.style-3 .menu-wrap {
gap: 70px;
}
}
@media (max-width: 1699px) {
header.style-3 .menu-wrap {
gap: 50px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
header.style-3 .menu-wrap {
gap: 25px;
}
}
@media (max-width: 1399px) {
header.style-3 .menu-wrap {
gap: 25px;
}
}
header.style-3 .nav-right {
display: flex;
align-items: center;
gap: 70px;
position: relative;
}
@media (min-width: 1200px) and (max-width: 1399px) {
header.style-3 .nav-right {
gap: 50px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-3 .nav-right {
gap: 30px;
}
}
@media (max-width: 991px) {
header.style-3 .nav-right {
gap: 20px;
}
}
@media (max-width: 576px) {
header.style-3 .nav-right {
gap: 15px;
}
}
header.style-3 .nav-right::before {
content: "";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 2px;
height: 18px;
background-color: var(--primary-color2);
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-3 .nav-right::before {
left: 73%;
}
}
@media (max-width: 991px) {
header.style-3 .nav-right::before {
display: none;
}
}
header.style-3 .nav-right .contact-area {
display: flex;
align-items: center;
gap: 8px;
}
header.style-3 .nav-right .contact-area .icon {
padding: 3px 5px;
background-color: rgba(var(--black-color-opc), 0.1);
border-radius: 5px;
}
header.style-3 .nav-right .contact-area .icon svg {
fill: var(--title-color);
}
header.style-3 .nav-right .contact-area .content {
line-height: 1;
}
header.style-3 .nav-right .contact-area .content span {
color: var(--text-color);
font-family: var(--font-manrope);
font-size: 12px;
font-weight: 500;
line-height: 1;
display: block;
margin-bottom: 5px;
}
header.style-3 .nav-right .contact-area .content a {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 14px;
font-weight: 600;
line-height: 1;
transition: 0.5s;
}
header.style-3 .nav-right .contact-area .content a:hover {
color: var(--primary-color2);
}
header.style-3 .nav-right .right-sidebar-button {
cursor: pointer;
display: flex;
align-items: center;
gap: 8px;
position: relative;
padding: 13px 20px;
background-color: rgba(var(--primary-color2-opc), 0.1);
border-radius: 200px;
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-3 .nav-right .right-sidebar-button {
border-radius: 10px;
padding: 14px 16px;
}
}
@media (max-width: 576px) {
header.style-3 .nav-right .right-sidebar-button {
gap: 6px;
border-radius: 10px;
padding: 13px 13px;
}
}
header.style-3 .nav-right .right-sidebar-button svg {
fill: var(--title-color);
}
header.style-3 .nav-right .right-sidebar-button span {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 13px;
font-weight: 600;
line-height: 1;
letter-spacing: 0.03em;
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-3 .nav-right .right-sidebar-button span {
display: none;
}
}
@media (max-width: 576px) {
header.style-3 .nav-right .right-sidebar-button span {
font-size: 12px;
}
}
@media (max-width: 576px) {
header.style-3 .nav-right .right-sidebar-button span {
display: none;
}
}
@keyframes qode-draw {
0%, 100% {
clip-path: inset(-2px -2px);
}
42% {
clip-path: inset(-2px -2px -2px 100%);
}
43% {
clip-path: inset(-2px 100% -3px -2px);
}
}
header.style-3 .nav-right .right-sidebar-button:hover svg {
animation: qode-draw 0.75s cubic-bezier(0.57, 0.39, 0, 0.86) 1 forwards;
}
header.style-3 .nav-right .mobile-menu-btn {
display: none;
visibility: hidden;
}
@media (max-width: 991px) {
header.style-3 .nav-right .mobile-menu-btn {
display: flex;
align-items: center;
visibility: visible;
justify-content: center;
position: relative;
min-width: 48px;
max-width: 48px;
height: 48px;
border-radius: 10px;
border: 1px solid rgba(var(--black-color-opc), 0.07);
}
header.style-3 .nav-right .mobile-menu-btn svg {
fill: var(--title-color);
}
header.style-3 .nav-right .mobile-menu-btn:hover svg {
animation: qode-draw 0.75s cubic-bezier(0.57, 0.39, 0, 0.86) 1 forwards;
}
}
@media (max-width: 576px) {
header.style-3 .nav-right .mobile-menu-btn {
min-width: 40px;
max-width: 40px;
height: 40px;
}
header.style-3 .nav-right .mobile-menu-btn svg {
width: 18px;
}
}
header.style-3 .main-menu {
display: inline-block;
}
header.style-3 .main-menu > ul {
padding: 0;
margin: 0;
list-style: none;
}
header.style-3 .main-menu > ul > li {
display: inline-block;
position: relative;
}
header.style-3 .main-menu > ul > li.position-inherit {
position: inherit;
}
@media (max-width: 991px) {
header.style-3 .main-menu > ul > li.position-inherit {
position: relative;
}
}
@media (min-width: 992px) {
header.style-3 .main-menu > ul > li:first-child {
padding-left: 0;
}
header.style-3 .main-menu > ul > li:last-child {
padding-right: 0;
}
}
header.style-3 .main-menu > ul > li > a {
color: var(--title-color);
display: block;
letter-spacing: 0.4px;
padding: 37px 22px;
line-height: 1;
position: relative;
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
text-transform: uppercase;
transition: all 0.5s ease-out 0s;
position: relative;
background-color: transparent;
border-radius: 100px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
header.style-3 .main-menu > ul > li > a {
padding: 37px 15px;
}
}
@media (max-width: 1399px) {
header.style-3 .main-menu > ul > li > a {
padding: 37px 13px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-3 .main-menu > ul > li > a {
font-size: 12px;
padding: 37px 10px;
}
}
header.style-3 .main-menu > ul > li > a svg {
display: none;
fill: var(--title-color);
transition: 0.5s;
}
@media (max-width: 991px) {
header.style-3 .main-menu > ul > li > a svg {
display: none;
}
}
header.style-3 .main-menu > ul > li ul.sub-menu {
position: absolute;
left: 0;
right: 0;
top: auto;
padding: 10px 0;
margin: 0;
display: none;
min-width: 292px;
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home1/sub-menu-bg.png), linear-gradient(#f1f5ff, #f1f5ff);
border-radius: 0 0 20px 20px;
text-align: left;
transform-origin: top;
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-3 .main-menu > ul > li ul.sub-menu {
min-width: 260px;
}
}
header.style-3 .main-menu > ul > li ul.sub-menu > li {
padding: 0;
display: block;
position: relative;
}
header.style-3 .main-menu > ul > li ul.sub-menu > li::after {
display: none;
}
header.style-3 .main-menu > ul > li ul.sub-menu > li i {
position: absolute;
top: 10px;
right: 6px;
display: block;
color: var(--title-color);
font-size: 20px;
}
header.style-3 .main-menu > ul > li ul.sub-menu > li .dropdown-icon {
color: var(--title-color);
opacity: 1;
top: 17px;
font-size: 13px;
right: 15px;
}
@media (max-width: 991px) {
header.style-3 .main-menu > ul > li ul.sub-menu > li .dropdown-icon {
right: 0;
top: 11px;
font-size: 20px;
}
}
header.style-3 .main-menu > ul > li ul.sub-menu > li .dropdown-icon2 {
color: var(--title-color);
opacity: 1;
top: 14px;
right: 10px;
font-size: 13px;
}
@media (max-width: 1199px) {
header.style-3 .main-menu > ul > li ul.sub-menu > li .dropdown-icon2::before {
content: "\f4fe";
}
}
header.style-3 .main-menu > ul > li ul.sub-menu > li > a {
display: block;
padding: 0 35px;
font-family: var(--font-dmsans);
color: var(--title-color);
font-weight: 400;
text-transform: uppercase;
font-size: 14px;
line-height: 1.4;
letter-spacing: 0.05em;
transition: all 0.4s ease-out 0s;
position: relative;
border-radius: 0;
border: none;
display: flex;
align-items: center;
justify-content: space-between;
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-3 .main-menu > ul > li ul.sub-menu > li > a {
padding: 0 25px;
}
}
@media (max-width: 991px) {
header.style-3 .main-menu > ul > li ul.sub-menu > li > a {
border-bottom: 1px solid rgba(13, 23, 32, 0.0784313725);
}
header.style-3 .main-menu > ul > li ul.sub-menu > li > a::before {
background: linear-gradient(90deg, #525252, #ec6219, #525252);
}
}
header.style-3 .main-menu > ul > li ul.sub-menu > li > a svg {
display: none;
fill: var(--title-color);
transition: all 0.4s ease-out 0s;
}
@media (max-width: 991px) {
header.style-3 .main-menu > ul > li ul.sub-menu > li > a svg {
display: none;
}
}
header.style-3 .main-menu > ul > li ul.sub-menu > li > a span {
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
border-bottom: 1px solid rgba(13, 23, 32, 0.0784313725);
padding: 14px 0px 14px 10px;
}
header.style-3 .main-menu > ul > li ul.sub-menu > li > a span::before {
content: "";
position: absolute;
bottom: -1px;
left: 0;
background: linear-gradient(90deg, #fff, var(--primary-color2), #fff);
width: 100%;
height: 1px;
transform: scaleX(0);
transform-origin: left;
transition: 0.4s ease-in;
z-index: 1;
}
@media (max-width: 991px) {
header.style-3 .main-menu > ul > li ul.sub-menu > li > a span {
border: unset;
padding: 0;
}
header.style-3 .main-menu > ul > li ul.sub-menu > li > a span::before {
display: none;
}
}
header.style-3 .main-menu > ul > li ul.sub-menu > li > a:hover {
color: var(--primary-color2);
}
header.style-3 .main-menu > ul > li ul.sub-menu > li > a:hover svg {
fill: var(--primary-color2);
}
header.style-3 .main-menu > ul > li ul.sub-menu > li > a:hover span::before {
transform: scale(1);
}
header.style-3 .main-menu > ul > li ul.sub-menu > li > a.current-menu-item, header.style-3 .main-menu > ul > li ul.sub-menu > li > a.current_page_item, header.style-3 .main-menu > ul > li ul.sub-menu > li > a.current-menu-ancestor, header.style-3 .main-menu > ul > li ul.sub-menu > li > a.current-menu-parent, header.style-3 .main-menu > ul > li ul.sub-menu > li > a.current_page_parent, header.style-3 .main-menu > ul > li ul.sub-menu > li > a.current_page_ancestor, header.style-3 .main-menu > ul > li ul.sub-menu > li > a.active {
color: var(--primary-color2);
}
header.style-3 .main-menu > ul > li ul.sub-menu > li > a.current-menu-item svg, header.style-3 .main-menu > ul > li ul.sub-menu > li > a.current_page_item svg, header.style-3 .main-menu > ul > li ul.sub-menu > li > a.current-menu-ancestor svg, header.style-3 .main-menu > ul > li ul.sub-menu > li > a.current-menu-parent svg, header.style-3 .main-menu > ul > li ul.sub-menu > li > a.current_page_parent svg, header.style-3 .main-menu > ul > li ul.sub-menu > li > a.current_page_ancestor svg, header.style-3 .main-menu > ul > li ul.sub-menu > li > a.active svg {
fill: var(--primary-color2);
}
header.style-3 .main-menu > ul > li ul.sub-menu > li > a.current-menu-item span::before, header.style-3 .main-menu > ul > li ul.sub-menu > li > a.current_page_item span::before, header.style-3 .main-menu > ul > li ul.sub-menu > li > a.current-menu-ancestor span::before, header.style-3 .main-menu > ul > li ul.sub-menu > li > a.current-menu-parent span::before, header.style-3 .main-menu > ul > li ul.sub-menu > li > a.current_page_parent span::before, header.style-3 .main-menu > ul > li ul.sub-menu > li > a.current_page_ancestor span::before, header.style-3 .main-menu > ul > li ul.sub-menu > li > a.active span::before {
transform: scale(1);
}
header.style-3 .main-menu > ul > li ul.sub-menu > li.menu-item-has-children {
transition: all 0.55s ease-in-out;
}
header.style-3 .main-menu > ul > li ul.sub-menu > li.menu-item-has-children > a svg {
display: block;
}
header.style-3 .main-menu > ul > li ul.sub-menu > li:last-child a span {
border-bottom: none;
}
header.style-3 .main-menu > ul > li ul.sub-menu > li:last-child a span::before {
display: none;
}
header.style-3 .main-menu > ul > li ul.sub-menu > li:last-child .sub-menu li a {
border-bottom: 1px solid rgba(13, 23, 32, 0.0784313725);
}
header.style-3 .main-menu > ul > li ul.sub-menu > li:last-child .sub-menu li a::before {
display: block;
}
header.style-3 .main-menu > ul > li ul.sub-menu > li:last-child .sub-menu li:last-child a {
border-bottom: none;
}
header.style-3 .main-menu > ul > li ul.sub-menu > li:last-child .sub-menu li:last-child a::before {
display: none;
}
header.style-3 .main-menu > ul > li ul.sub-menu > li:hover > a {
color: var(--primary-color2);
}
@media (min-width: 992px) {
header.style-3 .main-menu > ul > li ul.sub-menu > li:hover > ul.sub-menu {
display: block;
animation: fade-down 0.3s linear;
}
}
header.style-3 .main-menu > ul > li ul.sub-menu > li:hover .dropdown-icon {
color: var(--primary-color2);
}
header.style-3 .main-menu > ul > li ul.sub-menu > li:hover .dropdown-icon2 {
color: var(--primary-color2);
}
header.style-3 .main-menu > ul > li ul.sub-menu > li.current-menu-item > a, header.style-3 .main-menu > ul > li ul.sub-menu > li.current_page_item > a, header.style-3 .main-menu > ul > li ul.sub-menu > li.current-menu-ancestor > a, header.style-3 .main-menu > ul > li ul.sub-menu > li.current-menu-parent > a, header.style-3 .main-menu > ul > li ul.sub-menu > li.current_page_parent > a, header.style-3 .main-menu > ul > li ul.sub-menu > li.current_page_ancestor > a, header.style-3 .main-menu > ul > li ul.sub-menu > li.active > a {
color: var(--primary-color2);
}
header.style-3 .main-menu > ul > li ul.sub-menu > li.current-menu-item .dropdown-icon, header.style-3 .main-menu > ul > li ul.sub-menu > li.current_page_item .dropdown-icon, header.style-3 .main-menu > ul > li ul.sub-menu > li.current-menu-ancestor .dropdown-icon, header.style-3 .main-menu > ul > li ul.sub-menu > li.current-menu-parent .dropdown-icon, header.style-3 .main-menu > ul > li ul.sub-menu > li.current_page_parent .dropdown-icon, header.style-3 .main-menu > ul > li ul.sub-menu > li.current_page_ancestor .dropdown-icon, header.style-3 .main-menu > ul > li ul.sub-menu > li.active .dropdown-icon {
color: var(--primary-color2);
}
header.style-3 .main-menu > ul > li ul.sub-menu > li.current-menu-item .dropdown-icon2, header.style-3 .main-menu > ul > li ul.sub-menu > li.current_page_item .dropdown-icon2, header.style-3 .main-menu > ul > li ul.sub-menu > li.current-menu-ancestor .dropdown-icon2, header.style-3 .main-menu > ul > li ul.sub-menu > li.current-menu-parent .dropdown-icon2, header.style-3 .main-menu > ul > li ul.sub-menu > li.current_page_parent .dropdown-icon2, header.style-3 .main-menu > ul > li ul.sub-menu > li.current_page_ancestor .dropdown-icon2, header.style-3 .main-menu > ul > li ul.sub-menu > li.active .dropdown-icon2 {
color: var(--primary-color2);
}
header.style-3 .main-menu > ul > li ul.sub-menu > li .sub-menu {
left: 293px;
position: absolute;
max-width: 230px;
min-width: 215px;
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home1/sub-menu-bg.png), linear-gradient(#f1f5ff, #f1f5ff);
top: 0;
}
@media (max-width: 1199px) {
header.style-3 .main-menu > ul > li ul.sub-menu > li .sub-menu {
right: 261px;
left: unset;
}
}
header.style-3 .main-menu > ul > li ul.sub-menu > li .sub-menu::before {
display: none;
visibility: hidden;
}
@media only screen and (max-width: 991px) {
header.style-3 .main-menu > ul > li ul.sub-menu > li .sub-menu {
margin-left: 10px;
position: unset;
max-width: 230px;
min-width: 215px;
background: transparent;
top: 0;
}
}
header.style-3 .main-menu > ul > li ul.sub-menu > li .sub-menu > li i {
display: block;
}
header.style-3 .main-menu > ul > li ul.sub-menu > li .sub-menu > li a {
padding: 0 20px;
}
@media (max-width: 991px) {
header.style-3 .main-menu > ul > li ul.sub-menu > li .sub-menu > li a {
padding: 12px 0px;
}
}
header.style-3 .main-menu > ul > li ul.sub-menu > li:last-child {
border-bottom: none;
}
header.style-3 .main-menu > ul > li .mega-menu {
position: absolute;
left: 0;
top: auto;
margin: 0;
width: 100%;
background-color: rgba(var(--black-color-opc), 0.3);
-webkit-backdrop-filter: blur(15px);
backdrop-filter: blur(15px);
min-height: 100vh;
display: none;
transform-origin: top;
}
@media (min-width: 1400px) and (max-width: 1599px) {
header.style-3 .main-menu > ul > li .mega-menu {
top: 87px;
}
}
@media (max-width: 1199px) {
header.style-3 .main-menu > ul > li .mega-menu {
top: 62px;
}
}
header.style-3 .main-menu > ul > li .mega-menu .mega-menu-wrap {
padding: 70px 0px;
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home1/home1-megamenu-bg.png), linear-gradient(#fff4f1, #fff4f1);
background-size: cover;
background-repeat: no-repeat;
width: 100%;
border-radius: 0 0 100px 100px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
header.style-3 .main-menu > ul > li .mega-menu .mega-menu-wrap {
max-height: 600px;
overflow-y: auto;
padding: 50px 0;
}
header.style-3 .main-menu > ul > li .mega-menu .mega-menu-wrap::-webkit-scrollbar {
display: none;
}
}
@media (max-width: 1199px) {
header.style-3 .main-menu > ul > li .mega-menu .mega-menu-wrap {
max-height: 570px;
overflow-y: auto;
padding: 50px 0;
border-radius: 0 0 60px 60px;
}
header.style-3 .main-menu > ul > li .mega-menu .mega-menu-wrap::-webkit-scrollbar {
display: none;
}
}
header.style-3 .main-menu > ul > li .mega-menu .single-menu-item {
text-align: center;
}
header.style-3 .main-menu > ul > li .mega-menu .single-menu-item .home-img {
-webkit-mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home1/mega-menu-home-img-bg.png);
mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home1/mega-menu-home-img-bg.png);
-webkit-mask-size: cover;
mask-size: cover;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
border-radius: 10px;
transition: 0.5s;
position: relative;
margin-bottom: 15px;
display: block;
}
@media (max-width: 1199px) {
header.style-3 .main-menu > ul > li .mega-menu .single-menu-item .home-img {
margin-bottom: 15px;
}
}
header.style-3 .main-menu > ul > li .mega-menu .single-menu-item .home-img img {
border-radius: 10px;
}
header.style-3 .main-menu > ul > li .mega-menu .single-menu-item h5 {
margin-bottom: 0;
}
header.style-3 .main-menu > ul > li .mega-menu .single-menu-item h5 a {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 16px;
font-weight: 600;
line-height: 1.2;
text-transform: uppercase;
transition: 0.5s;
}
header.style-3 .main-menu > ul > li .mega-menu .single-menu-item h5 a span {
display: none;
}
header.style-3 .main-menu > ul > li .mega-menu .single-menu-item:hover h5 a {
color: var(--primary-color2);
}
header.style-3 .main-menu > ul > li .mega-menu .single-menu-item.active h5 a {
color: var(--primary-color2);
}
header.style-3 .main-menu > ul > li.menu-item-has-children {
transition: all 0.55s ease-in-out;
}
header.style-3 .main-menu > ul > li.menu-item-has-children > a {
display: flex;
align-items: baseline;
gap: 5px;
}
header.style-3 .main-menu > ul > li.menu-item-has-children > a svg {
display: block;
}
@media (min-width: 992px) {
header.style-3 .main-menu > ul > li:hover > ul.sub-menu {
display: block;
animation: fade-down 0.3s linear;
}
}
@media (min-width: 992px) {
header.style-3 .main-menu > ul > li:hover .mega-menu {
display: block;
animation: fade-down 0.3s linear;
}
}
header.style-3 .main-menu > ul > li:hover > a {
color: var(--primary-color2);
}
header.style-3 .main-menu > ul > li:hover > a svg {
fill: var(--primary-color2);
}
header.style-3 .main-menu > ul > li:hover .dropdown-icon2 {
color: var(--primary-color2);
}
header.style-3 .main-menu > ul > li:hover.menu-item-has-children > a::before {
color: var(--title-color);
}
header.style-3 .main-menu > ul > li.current-menu-item > a, header.style-3 .main-menu > ul > li.current_page_item > a, header.style-3 .main-menu > ul > li.current-menu-ancestor > a, header.style-3 .main-menu > ul > li.current-menu-parent > a, header.style-3 .main-menu > ul > li.current_page_parent > a, header.style-3 .main-menu > ul > li.current_page_ancestor > a, header.style-3 .main-menu > ul > li.active > a {
color: var(--primary-color2);
}
header.style-3 .main-menu > ul > li.current-menu-item > a svg, header.style-3 .main-menu > ul > li.current_page_item > a svg, header.style-3 .main-menu > ul > li.current-menu-ancestor > a svg, header.style-3 .main-menu > ul > li.current-menu-parent > a svg, header.style-3 .main-menu > ul > li.current_page_parent > a svg, header.style-3 .main-menu > ul > li.current_page_ancestor > a svg, header.style-3 .main-menu > ul > li.active > a svg {
fill: var(--primary-color2);
}
header.style-3 .main-menu > ul > li.current-menu-item .dropdown-icon2, header.style-3 .main-menu > ul > li.current_page_item .dropdown-icon2, header.style-3 .main-menu > ul > li.current-menu-ancestor .dropdown-icon2, header.style-3 .main-menu > ul > li.current-menu-parent .dropdown-icon2, header.style-3 .main-menu > ul > li.current_page_parent .dropdown-icon2, header.style-3 .main-menu > ul > li.current_page_ancestor .dropdown-icon2, header.style-3 .main-menu > ul > li.active .dropdown-icon2 {
color: var(--primary-color2);
}
header.style-3 .main-menu > ul > li.current-menu-item.menu-item-has-children > a::before, header.style-3 .main-menu > ul > li.current_page_item.menu-item-has-children > a::before, header.style-3 .main-menu > ul > li.current-menu-ancestor.menu-item-has-children > a::before, header.style-3 .main-menu > ul > li.current-menu-parent.menu-item-has-children > a::before, header.style-3 .main-menu > ul > li.current_page_parent.menu-item-has-children > a::before, header.style-3 .main-menu > ul > li.current_page_ancestor.menu-item-has-children > a::before, header.style-3 .main-menu > ul > li.active.menu-item-has-children > a::before {
color: var(--title-color);
}
header.style-3 .main-menu > ul li.menu-item-has-children > i {
display: none;
}
header.style-3 .mobile-logo-area .mobile-logo-wrap img {
width: 130px;
}
header.style-3 .mobile-logo-area .menu-close-btn {
height: 38px;
width: 38px;
border-radius: 10px;
border: 1px solid var(--borders-color);
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: 0.35s;
}
header.style-3 .mobile-logo-area .menu-close-btn i {
font-size: 26px;
line-height: 1;
color: var(--title-color);
transition: 0.35s;
}
header.style-3 .mobile-logo-area .menu-close-btn:hover {
background-color: var(--title-color);
}
header.style-3 .mobile-logo-area .menu-close-btn:hover i {
color: var(--white-color);
}
@media only screen and (max-width: 991px) {
header.style-3 .dropdown-icon {
color: var(--white-color);
}
header.style-3 .main-menu {
position: fixed;
top: 0;
left: 0;
width: 280px;
padding: 30px 20px !important;
z-index: 99999;
height: 100%;
overflow: auto;
background: var(--white-color);
border-right: 1px solid var(--borders-color);
transform: translateX(-100%);
transition: transform 0.3s ease-in;
box-shadow: 0px 2px 20px rgba(0, 0, 0, 0.03);
}
header.style-3 .main-menu.show-menu {
transform: translateX(0);
}
header.style-3 .main-menu .mobile-menu-logo {
text-align: left;
padding-top: 20px;
display: block;
padding-bottom: 8px;
}
header.style-3 .main-menu .menu-list {
padding-top: 50px;
padding-bottom: 30px;
border: unset;
}
header.style-3 .main-menu > ul {
float: none;
text-align: left;
padding: 5px 0px 20px 0;
}
header.style-3 .main-menu > ul > li {
position: relative;
display: block;
padding: 0;
}
header.style-3 .main-menu > ul > li i {
display: none;
}
header.style-3 .main-menu > ul > li.menu-item-has-children i {
display: block;
}
header.style-3 .main-menu > ul > li > a {
padding: 15px 0;
display: block;
border: unset;
background-color: transparent;
}
header.style-3 .main-menu > ul > li > a svg,
header.style-3 .main-menu > ul > li > a i {
display: none !important;
}
header.style-3 .main-menu > ul > li ul.sub-menu {
position: static;
min-width: 200px;
border: none;
opacity: 1;
visibility: visible;
transform: translateY(0px);
background-image: unset;
padding: 0;
padding-left: 10px;
background-color: unset;
}
header.style-3 .main-menu > ul > li ul.sub-menu > li {
border-bottom: 1px solid transparent;
}
header.style-3 .main-menu > ul > li ul.sub-menu > li a {
color: var(--title-color);
padding: 12px 0px;
}
header.style-3 .main-menu > ul > li ul.sub-menu > li a svg,
header.style-3 .main-menu > ul > li ul.sub-menu > li a i {
display: none !important;
}
header.style-3 .main-menu > ul > li ul.sub-menu > li a:hover {
color: var(--primary-color2);
margin-left: 10px;
}
header.style-3 .main-menu > ul > li ul.sub-menu > li a.active {
color: var(--primary-color2);
}
header.style-3 .main-menu > ul > li ul.sub-menu > li i {
color: var(--primary-color2);
right: -13px;
display: none;
}
header.style-3 .main-menu > ul > li ul.sub-menu > li.menu-item-has-children i {
display: block;
}
header.style-3 .main-menu > ul > li ul.sub-menu > li ul.sub-menu li i {
display: none;
}
header.style-3 .main-menu > ul > li ul.sub-menu > li ul.sub-menu li.menu-item-has-children i {
display: block;
}
header.style-3 .main-menu > ul > li .mega-menu {
position: static;
min-width: 200px;
border: none;
opacity: 1;
visibility: visible;
transform: translateY(0px);
background-image: unset;
padding: 0;
background-color: unset;
-webkit-backdrop-filter: unset;
backdrop-filter: unset;
min-height: unset;
}
header.style-3 .main-menu > ul > li .mega-menu .mega-menu-wrap {
background-image: unset;
border-radius: unset;
padding: 0;
}
header.style-3 .main-menu > ul > li .mega-menu .mega-menu-wrap .single-menu-item {
text-align: left;
}
header.style-3 .main-menu > ul > li .mega-menu .mega-menu-wrap .single-menu-item .home-img {
display: none;
}
header.style-3 .main-menu > ul > li .mega-menu .mega-menu-wrap .single-menu-item h5 a {
padding: 12px 0px;
font-weight: 400;
font-size: 13px;
font-family: var(--font-dmsans);
letter-spacing: 0.05em;
border-bottom: 1px solid rgba(13, 23, 32, 0.0784313725);
display: flex;
align-items: center;
gap: 5px;
width: 100%;
}
header.style-3 .main-menu > ul > li .mega-menu .mega-menu-wrap .single-menu-item h5 a span {
color: var(--white-color);
font-size: 8px;
font-family: var(--font-dmsans);
font-weight: 400;
text-transform: uppercase;
line-height: 1;
background-color: var(--primary-color2);
padding: 4px;
display: inline-block;
}
header.style-3 .main-menu > ul > li:hover > a {
color: var(--primary-color2);
background-color: transparent;
}
header.style-3 .main-menu > ul > li:hover i {
color: var(--primary-color2);
}
header.style-3 .main-menu > ul > li.current-menu-item > a, header.style-3 .main-menu > ul > li.current_page_item > a, header.style-3 .main-menu > ul > li.current-menu-ancestor > a, header.style-3 .main-menu > ul > li.current-menu-parent > a, header.style-3 .main-menu > ul > li.current_page_parent > a, header.style-3 .main-menu > ul > li.current_page_ancestor > a, header.style-3 .main-menu > ul > li.active > a {
color: var(--primary-color2);
background-color: unset;
}
header.style-3 .main-menu > ul > li.current-menu-item i, header.style-3 .main-menu > ul > li.current_page_item i, header.style-3 .main-menu > ul > li.current-menu-ancestor i, header.style-3 .main-menu > ul > li.current-menu-parent i, header.style-3 .main-menu > ul > li.current_page_parent i, header.style-3 .main-menu > ul > li.current_page_ancestor i, header.style-3 .main-menu > ul > li.active i {
color: var(--primary-color2);
}
header.style-3 .main-menu > ul > li i.active::before {
content: "\f2ea";
}
header.style-3 .main-menu > ul > li .bi {
position: absolute;
top: 11px;
right: 0;
font-size: 20px;
color: var(--title-color);
line-height: 1;
}
header.style-3 .main-menu > ul li.menu-item-has-children > i {
display: block;
}
header.style-3 .main-menu .btn-and-contact-area {
flex-direction: column;
align-items: center;
gap: 20px;
}
header.style-3 .primary-btn3 {
width: 100%;
justify-content: center;
}
}
header.style-4 {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 999;
transition: all 0.8s ease-out 0s;
background-color: transparent;
padding: 0px 90px;
border-bottom: 1px solid rgba(var(--black-color-opc), 0.07);
}
@media (max-width: 1699px) {
header.style-4 {
padding: 0px 70px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
header.style-4 {
padding: 0px 30px;
}
}
@media (max-width: 1399px) {
header.style-4 {
padding: 0px 20px;
}
}
@media (max-width: 1199px) {
header.style-4 {
padding: 0px 10px;
}
}
@media (max-width: 991px) {
header.style-4 {
padding: 15px 10px;
}
}
@media (max-width: 576px) {
header.style-4 {
padding: 15px 0;
}
}
header.style-4.sticky {
box-sizing: border-box;
background-color: var(--white-color);
box-shadow: 5px 3px 40px rgba(0, 72, 88, 0.1);
z-index: 999;
}
header.style-4 .company-logo img {
width: 157px;
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-4 .company-logo img {
width: 145px;
}
}
@media (max-width: 576px) {
header.style-4 .company-logo img {
width: 145px;
}
}
header.style-4 .nav-right {
display: flex;
align-items: center;
gap: 70px;
position: relative;
padding-left: 45px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
header.style-4 .nav-right {
gap: 50px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-4 .nav-right {
gap: 30px;
padding-left: 30px;
}
}
@media (max-width: 991px) {
header.style-4 .nav-right {
gap: 20px;
}
}
@media (max-width: 576px) {
header.style-4 .nav-right {
gap: 15px;
}
}
header.style-4 .nav-right::before {
content: "";
position: absolute;
top: 50%;
left: 0;
transform: translateY(-50%);
width: 2px;
height: 18px;
background-color: var(--primary-color3);
}
@media (max-width: 991px) {
header.style-4 .nav-right::before {
display: none;
}
}
header.style-4 .nav-right .right-sidebar-button {
cursor: pointer;
display: flex;
align-items: center;
gap: 8px;
position: relative;
padding: 13px 20px;
background-color: rgba(var(--primary-color3-opc), 0.1);
border-radius: 200px;
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-4 .nav-right .right-sidebar-button {
padding: 14px 16px;
}
}
@media (max-width: 576px) {
header.style-4 .nav-right .right-sidebar-button {
gap: 6px;
border-radius: 10px;
padding: 13px 13px;
}
}
header.style-4 .nav-right .right-sidebar-button svg {
fill: var(--title-color2);
}
header.style-4 .nav-right .right-sidebar-button span {
color: var(--title-color2);
font-family: var(--font-manrope);
font-size: 13px;
font-weight: 600;
line-height: 1;
letter-spacing: 0.03em;
}
@media (max-width: 576px) {
header.style-4 .nav-right .right-sidebar-button span {
font-size: 12px;
}
}
@media (max-width: 576px) {
header.style-4 .nav-right .right-sidebar-button span {
display: none;
}
}
@keyframes qode-draw {
0%, 100% {
clip-path: inset(-2px -2px);
}
42% {
clip-path: inset(-2px -2px -2px 100%);
}
43% {
clip-path: inset(-2px 100% -3px -2px);
}
}
header.style-4 .nav-right .right-sidebar-button:hover svg {
animation: qode-draw 0.75s cubic-bezier(0.57, 0.39, 0, 0.86) 1 forwards;
}
header.style-4 .nav-right .mobile-menu-btn {
display: none;
visibility: hidden;
}
@media (max-width: 991px) {
header.style-4 .nav-right .mobile-menu-btn {
display: flex;
align-items: center;
visibility: visible;
justify-content: center;
position: relative;
min-width: 48px;
max-width: 48px;
height: 48px;
border-radius: 10px;
border: 1px solid var(--borders-color);
}
header.style-4 .nav-right .mobile-menu-btn svg {
fill: var(--title-color);
}
header.style-4 .nav-right .mobile-menu-btn:hover svg {
animation: qode-draw 0.75s cubic-bezier(0.57, 0.39, 0, 0.86) 1 forwards;
}
}
@media (max-width: 576px) {
header.style-4 .nav-right .mobile-menu-btn {
min-width: 40px;
max-width: 40px;
height: 40px;
}
header.style-4 .nav-right .mobile-menu-btn svg {
width: 18px;
}
}
@keyframes qode-draw {
0%, 100% {
clip-path: inset(-2px -2px);
}
42% {
clip-path: inset(-2px -2px -2px 100%);
}
43% {
clip-path: inset(-2px 100% -3px -2px);
}
}
header.style-4 .menu-wrap {
display: flex;
align-items: center;
gap: 45px;
}
header.style-4 .main-menu {
display: inline-block;
}
header.style-4 .main-menu > ul {
padding: 0;
margin: 0;
list-style: none;
}
header.style-4 .main-menu > ul > li {
display: inline-block;
position: relative;
padding: 28px 5px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
header.style-4 .main-menu > ul > li {
padding: 22px 5px;
}
}
@media (max-width: 1399px) {
header.style-4 .main-menu > ul > li {
padding: 22px 5px;
}
}
@media (max-width: 991px) {
header.style-4 .main-menu > ul > li {
padding: 0px 12px;
}
}
header.style-4 .main-menu > ul > li.position-inherit {
position: inherit;
}
@media (max-width: 991px) {
header.style-4 .main-menu > ul > li.position-inherit {
position: relative;
}
}
@media (min-width: 992px) {
header.style-4 .main-menu > ul > li:first-child {
padding-left: 0;
}
header.style-4 .main-menu > ul > li:last-child {
padding-right: 0;
}
}
header.style-4 .main-menu > ul > li > a {
color: var(--title-color2);
display: block;
letter-spacing: 0.4px;
padding: 10px 23px;
line-height: 1;
position: relative;
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
text-transform: uppercase;
transition: all 0.5s ease-out 0s;
position: relative;
background-color: transparent;
border: 1px solid rgba(var(--primary-color4-opc), 0.1);
border-radius: 100px;
}
@media (max-width: 1399px) {
header.style-4 .main-menu > ul > li > a {
padding: 10px 15px;
}
}
header.style-4 .main-menu > ul > li > a svg {
fill: var(--title-color);
display: none;
}
header.style-4 .main-menu > ul > li ul.sub-menu {
position: absolute;
left: 0;
right: 0;
top: 90px;
padding: 10px 0;
margin: 0;
display: none;
min-width: 292px;
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home5/home5-sub-menu-bg.png), linear-gradient(#ecfdec, #ecfdec);
border-radius: 0 0 20px 20px;
text-align: left;
transform-origin: top;
}
@media (min-width: 1400px) and (max-width: 1599px) {
header.style-4 .main-menu > ul > li ul.sub-menu {
top: 79px;
}
}
@media (max-width: 1399px) {
header.style-4 .main-menu > ul > li ul.sub-menu {
top: 79px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-4 .main-menu > ul > li ul.sub-menu {
min-width: 260px;
}
}
header.style-4 .main-menu > ul > li ul.sub-menu > li {
padding: 0;
display: block;
position: relative;
}
header.style-4 .main-menu > ul > li ul.sub-menu > li::after {
display: none;
}
header.style-4 .main-menu > ul > li ul.sub-menu > li i {
position: absolute;
top: 10px;
right: 6px;
display: block;
color: var(--title-color);
font-size: 20px;
}
header.style-4 .main-menu > ul > li ul.sub-menu > li .dropdown-icon {
color: var(--title-color);
opacity: 1;
top: 17px;
font-size: 13px;
right: 15px;
}
@media (max-width: 991px) {
header.style-4 .main-menu > ul > li ul.sub-menu > li .dropdown-icon {
right: 0;
top: 11px;
font-size: 20px;
}
}
header.style-4 .main-menu > ul > li ul.sub-menu > li > a {
display: block;
padding: 0 35px;
font-family: var(--font-dmsans);
color: rgba(var(--title-color-opc), 0.5);
font-weight: 600;
text-transform: uppercase;
font-size: 14px;
line-height: 1.4;
letter-spacing: 0.05em;
transition: all 0.4s ease-out 0s;
position: relative;
border-radius: 0;
border: none;
display: flex;
align-items: center;
justify-content: space-between;
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-4 .main-menu > ul > li ul.sub-menu > li > a {
padding: 0 25px;
font-size: 13px;
}
}
@media (max-width: 991px) {
header.style-4 .main-menu > ul > li ul.sub-menu > li > a {
border-bottom: 1px solid rgba(13, 23, 32, 0.0784313725);
}
header.style-4 .main-menu > ul > li ul.sub-menu > li > a::before {
background: linear-gradient(90deg, #525252, #ec6219, #525252);
}
}
header.style-4 .main-menu > ul > li ul.sub-menu > li > a svg {
display: none;
fill: var(--title-color);
transition: all 0.4s ease-out 0s;
}
@media (max-width: 991px) {
header.style-4 .main-menu > ul > li ul.sub-menu > li > a svg {
display: none;
}
}
header.style-4 .main-menu > ul > li ul.sub-menu > li > a span {
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
border-bottom: 1px solid rgba(13, 23, 32, 0.0784313725);
padding: 14px 0px 14px 10px;
}
header.style-4 .main-menu > ul > li ul.sub-menu > li > a span::before {
content: "";
position: absolute;
bottom: -1px;
left: 0;
background: linear-gradient(90deg, #fff, var(--primary-color3), #fff);
width: 100%;
height: 1px;
transform: scaleX(0);
transform-origin: left;
transition: 0.4s ease-in;
z-index: 1;
}
@media (max-width: 991px) {
header.style-4 .main-menu > ul > li ul.sub-menu > li > a span {
border: unset;
padding: 0;
}
header.style-4 .main-menu > ul > li ul.sub-menu > li > a span::before {
display: none;
}
}
header.style-4 .main-menu > ul > li ul.sub-menu > li > a:hover {
color: var(--primary-color3);
}
header.style-4 .main-menu > ul > li ul.sub-menu > li > a:hover svg {
fill: var(--primary-color3);
}
header.style-4 .main-menu > ul > li ul.sub-menu > li > a:hover span::before {
transform: scale(1);
}
header.style-4 .main-menu > ul > li ul.sub-menu > li > a.current-menu-item, header.style-4 .main-menu > ul > li ul.sub-menu > li > a.current_page_item, header.style-4 .main-menu > ul > li ul.sub-menu > li > a.current-menu-ancestor, header.style-4 .main-menu > ul > li ul.sub-menu > li > a.current-menu-parent, header.style-4 .main-menu > ul > li ul.sub-menu > li > a.current_page_parent, header.style-4 .main-menu > ul > li ul.sub-menu > li > a.current_page_ancestor, header.style-4 .main-menu > ul > li ul.sub-menu > li > a.active {
color: var(--primary-color2);
}
header.style-4 .main-menu > ul > li ul.sub-menu > li > a.current-menu-item svg, header.style-4 .main-menu > ul > li ul.sub-menu > li > a.current_page_item svg, header.style-4 .main-menu > ul > li ul.sub-menu > li > a.current-menu-ancestor svg, header.style-4 .main-menu > ul > li ul.sub-menu > li > a.current-menu-parent svg, header.style-4 .main-menu > ul > li ul.sub-menu > li > a.current_page_parent svg, header.style-4 .main-menu > ul > li ul.sub-menu > li > a.current_page_ancestor svg, header.style-4 .main-menu > ul > li ul.sub-menu > li > a.active svg {
fill: var(--primary-color2);
}
header.style-4 .main-menu > ul > li ul.sub-menu > li > a.current-menu-item span::before, header.style-4 .main-menu > ul > li ul.sub-menu > li > a.current_page_item span::before, header.style-4 .main-menu > ul > li ul.sub-menu > li > a.current-menu-ancestor span::before, header.style-4 .main-menu > ul > li ul.sub-menu > li > a.current-menu-parent span::before, header.style-4 .main-menu > ul > li ul.sub-menu > li > a.current_page_parent span::before, header.style-4 .main-menu > ul > li ul.sub-menu > li > a.current_page_ancestor span::before, header.style-4 .main-menu > ul > li ul.sub-menu > li > a.active span::before {
transform: scale(1);
}
header.style-4 .main-menu > ul > li ul.sub-menu > li.menu-item-has-children a svg {
display: block;
}
header.style-4 .main-menu > ul > li ul.sub-menu > li:last-child a span {
border-bottom: none;
}
header.style-4 .main-menu > ul > li ul.sub-menu > li:last-child a span::before {
display: none;
}
header.style-4 .main-menu > ul > li ul.sub-menu > li:last-child .sub-menu li a {
border-bottom: 1px solid rgba(13, 23, 32, 0.0784313725);
}
header.style-4 .main-menu > ul > li ul.sub-menu > li:last-child .sub-menu li a::before {
display: block;
}
header.style-4 .main-menu > ul > li ul.sub-menu > li:last-child .sub-menu li a svg {
display: none;
}
header.style-4 .main-menu > ul > li ul.sub-menu > li:last-child .sub-menu li:last-child a {
border-bottom: none;
}
header.style-4 .main-menu > ul > li ul.sub-menu > li:last-child .sub-menu li:last-child a::before {
display: none;
}
header.style-4 .main-menu > ul > li ul.sub-menu > li:last-child .sub-menu li.menu-item-has-children a svg {
display: block;
}
header.style-4 .main-menu > ul > li ul.sub-menu > li:hover > a {
color: var(--primary-color3);
}
@media (min-width: 992px) {
header.style-4 .main-menu > ul > li ul.sub-menu > li:hover > ul.sub-menu {
display: block;
animation: fade-down 0.3s linear;
}
}
header.style-4 .main-menu > ul > li ul.sub-menu > li:hover .dropdown-icon {
color: var(--primary-color3);
}
header.style-4 .main-menu > ul > li ul.sub-menu > li:hover .dropdown-icon2 {
color: var(--primary-color3);
}
header.style-4 .main-menu > ul > li ul.sub-menu > li.current-menu-item > a, header.style-4 .main-menu > ul > li ul.sub-menu > li.current_page_item > a, header.style-4 .main-menu > ul > li ul.sub-menu > li.current-menu-ancestor > a, header.style-4 .main-menu > ul > li ul.sub-menu > li.current-menu-parent > a, header.style-4 .main-menu > ul > li ul.sub-menu > li.current_page_parent > a, header.style-4 .main-menu > ul > li ul.sub-menu > li.current_page_ancestor > a, header.style-4 .main-menu > ul > li ul.sub-menu > li.active > a {
color: var(--primary-color3);
}
header.style-4 .main-menu > ul > li ul.sub-menu > li.current-menu-item .dropdown-icon, header.style-4 .main-menu > ul > li ul.sub-menu > li.current_page_item .dropdown-icon, header.style-4 .main-menu > ul > li ul.sub-menu > li.current-menu-ancestor .dropdown-icon, header.style-4 .main-menu > ul > li ul.sub-menu > li.current-menu-parent .dropdown-icon, header.style-4 .main-menu > ul > li ul.sub-menu > li.current_page_parent .dropdown-icon, header.style-4 .main-menu > ul > li ul.sub-menu > li.current_page_ancestor .dropdown-icon, header.style-4 .main-menu > ul > li ul.sub-menu > li.active .dropdown-icon {
color: var(--primary-color3);
}
header.style-4 .main-menu > ul > li ul.sub-menu > li.current-menu-item .dropdown-icon2, header.style-4 .main-menu > ul > li ul.sub-menu > li.current_page_item .dropdown-icon2, header.style-4 .main-menu > ul > li ul.sub-menu > li.current-menu-ancestor .dropdown-icon2, header.style-4 .main-menu > ul > li ul.sub-menu > li.current-menu-parent .dropdown-icon2, header.style-4 .main-menu > ul > li ul.sub-menu > li.current_page_parent .dropdown-icon2, header.style-4 .main-menu > ul > li ul.sub-menu > li.current_page_ancestor .dropdown-icon2, header.style-4 .main-menu > ul > li ul.sub-menu > li.active .dropdown-icon2 {
color: var(--primary-color3);
}
header.style-4 .main-menu > ul > li ul.sub-menu > li .sub-menu {
right: 293px;
left: unset;
position: absolute;
max-width: 230px;
min-width: 215px;
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home5/home5-sub-menu-bg.png), linear-gradient(#ecfdec, #ecfdec);
top: 0;
}
header.style-4 .main-menu > ul > li ul.sub-menu > li .sub-menu::before {
display: none;
visibility: hidden;
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-4 .main-menu > ul > li ul.sub-menu > li .sub-menu {
right: 261px;
}
}
@media only screen and (max-width: 991px) {
header.style-4 .main-menu > ul > li ul.sub-menu > li .sub-menu {
margin-left: 10px;
position: unset;
max-width: 230px;
min-width: 215px;
background: transparent;
top: 0;
}
}
header.style-4 .main-menu > ul > li ul.sub-menu > li .sub-menu > li i {
display: block;
}
header.style-4 .main-menu > ul > li ul.sub-menu > li .sub-menu > li a {
padding: 0 20px;
}
@media (max-width: 991px) {
header.style-4 .main-menu > ul > li ul.sub-menu > li .sub-menu > li a {
padding: 12px 0px;
}
}
header.style-4 .main-menu > ul > li ul.sub-menu > li .sub-menu > li a svg {
display: none;
}
header.style-4 .main-menu > ul > li ul.sub-menu > li .sub-menu > li.menu-item-has-children a svg {
display: block;
}
header.style-4 .main-menu > ul > li ul.sub-menu > li:last-child {
border-bottom: none;
}
header.style-4 .main-menu > ul > li .mega-menu {
position: absolute;
left: 0;
top: 90px;
margin: 0;
width: 100%;
background-color: rgba(var(--black-color-opc), 0.3);
-webkit-backdrop-filter: blur(15px);
backdrop-filter: blur(15px);
min-height: 100vh;
display: none;
transform-origin: top;
}
@media (min-width: 1400px) and (max-width: 1599px) {
header.style-4 .main-menu > ul > li .mega-menu {
top: 79px;
}
}
@media (max-width: 1399px) {
header.style-4 .main-menu > ul > li .mega-menu {
top: 79px;
}
}
header.style-4 .main-menu > ul > li .mega-menu .mega-menu-wrap {
padding: 70px 0px;
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home5/home5-megamenu-bg.png), linear-gradient(#ecfdec, #ecfdec);
background-size: cover;
background-repeat: no-repeat;
width: 100%;
border-radius: 0 0 100px 100px;
transform-origin: top;
}
@media (min-width: 1400px) and (max-width: 1599px) {
header.style-4 .main-menu > ul > li .mega-menu .mega-menu-wrap {
max-height: 600px;
overflow-y: auto;
padding: 50px 0;
}
header.style-4 .main-menu > ul > li .mega-menu .mega-menu-wrap::-webkit-scrollbar {
display: none;
}
}
@media (max-width: 1199px) {
header.style-4 .main-menu > ul > li .mega-menu .mega-menu-wrap {
max-height: 570px;
overflow-y: auto;
padding: 50px 0;
border-radius: 0 0 60px 60px;
}
header.style-4 .main-menu > ul > li .mega-menu .mega-menu-wrap::-webkit-scrollbar {
display: none;
}
}
header.style-4 .main-menu > ul > li .mega-menu .single-menu-item {
text-align: center;
}
header.style-4 .main-menu > ul > li .mega-menu .single-menu-item .home-img {
-webkit-mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home1/mega-menu-home-img-bg.png);
mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home1/mega-menu-home-img-bg.png);
-webkit-mask-size: cover;
mask-size: cover;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
border-radius: 10px;
transition: 0.5s;
position: relative;
margin-bottom: 15px;
display: block;
}
@media (max-width: 1199px) {
header.style-4 .main-menu > ul > li .mega-menu .single-menu-item .home-img {
margin-bottom: 15px;
}
}
header.style-4 .main-menu > ul > li .mega-menu .single-menu-item .home-img img {
border-radius: 10px;
}
header.style-4 .main-menu > ul > li .mega-menu .single-menu-item h5 {
margin-bottom: 0;
}
header.style-4 .main-menu > ul > li .mega-menu .single-menu-item h5 a {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 16px;
font-weight: 600;
line-height: 1.2;
text-transform: uppercase;
transition: 0.5s;
}
header.style-4 .main-menu > ul > li .mega-menu .single-menu-item h5 a span {
display: none;
}
@media (min-width: 992px) and (max-width: 1199px) {
header.style-4 .main-menu > ul > li .mega-menu .single-menu-item h5 a {
font-size: 15px;
}
}
header.style-4 .main-menu > ul > li .mega-menu .single-menu-item:hover h5 a {
color: var(--primary-color3);
}
header.style-4 .main-menu > ul > li .mega-menu .single-menu-item.current-menu-item h5 a, header.style-4 .main-menu > ul > li .mega-menu .single-menu-item.current_page_item h5 a, header.style-4 .main-menu > ul > li .mega-menu .single-menu-item.current-menu-ancestor h5 a, header.style-4 .main-menu > ul > li .mega-menu .single-menu-item.current-menu-parent h5 a, header.style-4 .main-menu > ul > li .mega-menu .single-menu-item.current_page_parent h5 a, header.style-4 .main-menu > ul > li .mega-menu .single-menu-item.current_page_ancestor h5 a, header.style-4 .main-menu > ul > li .mega-menu .single-menu-item.active h5 a {
color: var(--primary-color3);
}
header.style-4 .main-menu > ul > li.menu-item-has-children {
transition: all 0.55s ease-in-out;
}
header.style-4 .main-menu > ul > li.menu-item-has-children > a {
display: flex;
align-items: baseline;
gap: 5px;
}
@media (min-width: 992px) {
header.style-4 .main-menu > ul > li:hover > ul.sub-menu {
display: block;
animation: fade-down 0.3s linear;
}
}
@media (min-width: 992px) {
header.style-4 .main-menu > ul > li:hover .mega-menu {
display: block;
animation: fade-down 0.3s linear;
}
}
header.style-4 .main-menu > ul > li:hover > a {
background-color: var(--primary-color3);
border-color: var(--primary-color3);
color: var(--white-color);
}
header.style-4 .main-menu > ul > li:hover > a svg {
fill: var(--white-color);
}
header.style-4 .main-menu > ul > li:hover .dropdown-icon2 {
color: var(--primary-color3);
}
header.style-4 .main-menu > ul > li:hover.menu-item-has-children > a::before {
color: var(--title-color);
}
header.style-4 .main-menu > ul > li.current-menu-item > a, header.style-4 .main-menu > ul > li.current_page_item > a, header.style-4 .main-menu > ul > li.current-menu-ancestor > a, header.style-4 .main-menu > ul > li.current-menu-parent > a, header.style-4 .main-menu > ul > li.current_page_parent > a, header.style-4 .main-menu > ul > li.current_page_ancestor > a, header.style-4 .main-menu > ul > li.active > a {
background-color: var(--primary-color3);
border-color: var(--primary-color3);
color: var(--white-color);
}
header.style-4 .main-menu > ul > li.current-menu-item > a svg, header.style-4 .main-menu > ul > li.current_page_item > a svg, header.style-4 .main-menu > ul > li.current-menu-ancestor > a svg, header.style-4 .main-menu > ul > li.current-menu-parent > a svg, header.style-4 .main-menu > ul > li.current_page_parent > a svg, header.style-4 .main-menu > ul > li.current_page_ancestor > a svg, header.style-4 .main-menu > ul > li.active > a svg {
fill: var(--white-color);
}
header.style-4 .main-menu > ul > li.current-menu-item .dropdown-icon2, header.style-4 .main-menu > ul > li.current_page_item .dropdown-icon2, header.style-4 .main-menu > ul > li.current-menu-ancestor .dropdown-icon2, header.style-4 .main-menu > ul > li.current-menu-parent .dropdown-icon2, header.style-4 .main-menu > ul > li.current_page_parent .dropdown-icon2, header.style-4 .main-menu > ul > li.current_page_ancestor .dropdown-icon2, header.style-4 .main-menu > ul > li.active .dropdown-icon2 {
color: var(--primary-color3);
}
header.style-4 .main-menu > ul > li.current-menu-item.menu-item-has-children > a::before, header.style-4 .main-menu > ul > li.current_page_item.menu-item-has-children > a::before, header.style-4 .main-menu > ul > li.current-menu-ancestor.menu-item-has-children > a::before, header.style-4 .main-menu > ul > li.current-menu-parent.menu-item-has-children > a::before, header.style-4 .main-menu > ul > li.current_page_parent.menu-item-has-children > a::before, header.style-4 .main-menu > ul > li.current_page_ancestor.menu-item-has-children > a::before, header.style-4 .main-menu > ul > li.active.menu-item-has-children > a::before {
color: var(--title-color);
}
header.style-4 .main-menu > ul li.menu-item-has-children > i {
display: none;
}
header.style-4 .mobile-logo-area .mobile-logo-wrap img {
width: 130px;
}
header.style-4 .mobile-logo-area .mobile-logo-wrap img.dark {
display: none;
}
header.style-4 .mobile-logo-area .menu-close-btn {
height: 38px;
width: 38px;
border-radius: 10px;
border: 1px solid var(--borders-color);
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: 0.35s;
}
header.style-4 .mobile-logo-area .menu-close-btn i {
font-size: 26px;
line-height: 1;
color: var(--title-color);
transition: 0.35s;
}
header.style-4 .mobile-logo-area .menu-close-btn:hover {
background-color: var(--title-color);
}
header.style-4 .mobile-logo-area .menu-close-btn:hover i {
color: var(--white-color);
}
@media only screen and (max-width: 991px) {
header.style-4 .dropdown-icon {
color: var(--white-color);
}
header.style-4 .main-menu {
position: fixed;
top: 0;
left: 0;
width: 280px;
padding: 30px 20px !important;
z-index: 99999;
height: 100%;
overflow: auto;
background: var(--white-color);
border-right: 1px solid var(--borders-color);
transform: translateX(-100%);
transition: transform 0.3s ease-in;
box-shadow: 0px 2px 20px rgba(0, 0, 0, 0.03);
}
header.style-4 .main-menu.show-menu {
transform: translateX(0);
}
header.style-4 .main-menu .mobile-menu-logo {
text-align: left;
padding-top: 20px;
display: block;
padding-bottom: 8px;
}
header.style-4 .main-menu .menu-list {
padding-top: 50px;
padding-bottom: 30px;
border: unset;
}
header.style-4 .main-menu > ul {
float: none;
text-align: left;
padding: 5px 0px 20px 0;
}
header.style-4 .main-menu > ul > li {
display: block;
position: relative;
padding: 0;
}
header.style-4 .main-menu > ul > li i {
display: none;
}
header.style-4 .main-menu > ul > li.menu-item-has-children i {
display: block;
}
header.style-4 .main-menu > ul > li > a {
padding: 15px 0;
display: block;
border: unset;
background-color: transparent;
}
header.style-4 .main-menu > ul > li > a svg,
header.style-4 .main-menu > ul > li > a i {
display: none !important;
}
header.style-4 .main-menu > ul > li ul.sub-menu {
position: static;
min-width: 200px;
border: none;
opacity: 1;
visibility: visible;
transform: translateY(0px);
background-image: unset;
padding: 0;
padding-left: 10px;
background-color: unset;
}
header.style-4 .main-menu > ul > li ul.sub-menu > li {
border-bottom: 1px solid transparent;
}
header.style-4 .main-menu > ul > li ul.sub-menu > li a {
font-size: 13px;
color: var(--title-color);
padding: 12px 0px;
}
header.style-4 .main-menu > ul > li ul.sub-menu > li a:hover {
color: var(--primary-color3);
margin-left: 10px;
}
header.style-4 .main-menu > ul > li ul.sub-menu > li a svg,
header.style-4 .main-menu > ul > li ul.sub-menu > li a i {
display: none !important;
}
header.style-4 .main-menu > ul > li ul.sub-menu > li a.active {
color: var(--primary-color3);
}
header.style-4 .main-menu > ul > li ul.sub-menu > li i {
color: var(--primary-color3);
right: -13px;
display: none;
}
header.style-4 .main-menu > ul > li ul.sub-menu > li.menu-item-has-children i {
display: block;
}
header.style-4 .main-menu > ul > li ul.sub-menu ul.sub-menu li i {
display: none;
}
header.style-4 .main-menu > ul > li ul.sub-menu ul.sub-menu li.menu-item-has-children i {
display: block;
}
header.style-4 .main-menu > ul > li .mega-menu {
position: static;
min-width: 200px;
border: none;
opacity: 1;
visibility: visible;
transform: translateY(0px);
background-image: unset;
padding: 0;
background-color: unset;
-webkit-backdrop-filter: unset;
backdrop-filter: unset;
min-height: unset;
}
header.style-4 .main-menu > ul > li .mega-menu .mega-menu-wrap {
background-image: unset;
border-radius: unset;
padding: 0;
}
header.style-4 .main-menu > ul > li .mega-menu .mega-menu-wrap .single-menu-item {
text-align: left;
}
header.style-4 .main-menu > ul > li .mega-menu .mega-menu-wrap .single-menu-item .home-img {
display: none;
}
header.style-4 .main-menu > ul > li .mega-menu .mega-menu-wrap .single-menu-item h5 a {
padding: 12px 0px;
font-weight: 400;
font-size: 13px;
font-family: var(--font-dmsans);
letter-spacing: 0.05em;
border-bottom: 1px solid rgba(13, 23, 32, 0.0784313725);
display: flex;
align-items: center;
gap: 5px;
width: 100%;
}
header.style-4 .main-menu > ul > li .mega-menu .mega-menu-wrap .single-menu-item h5 a span {
color: var(--white-color);
font-size: 8px;
font-family: var(--font-dmsans);
font-weight: 400;
text-transform: uppercase;
line-height: 1;
background-color: var(--primary-color3);
padding: 4px;
display: inline-block;
}
header.style-4 .main-menu > ul > li:hover > a {
color: var(--primary-color3);
background-color: transparent;
}
header.style-4 .main-menu > ul > li:hover i {
color: var(--primary-color3);
}
header.style-4 .main-menu > ul > li.current-menu-item > a, header.style-4 .main-menu > ul > li.current_page_item > a, header.style-4 .main-menu > ul > li.current-menu-ancestor > a, header.style-4 .main-menu > ul > li.current-menu-parent > a, header.style-4 .main-menu > ul > li.current_page_parent > a, header.style-4 .main-menu > ul > li.current_page_ancestor > a, header.style-4 .main-menu > ul > li.active > a {
color: var(--primary-color3);
background-color: unset;
}
header.style-4 .main-menu > ul > li.current-menu-item i, header.style-4 .main-menu > ul > li.current_page_item i, header.style-4 .main-menu > ul > li.current-menu-ancestor i, header.style-4 .main-menu > ul > li.current-menu-parent i, header.style-4 .main-menu > ul > li.current_page_parent i, header.style-4 .main-menu > ul > li.current_page_ancestor i, header.style-4 .main-menu > ul > li.active i {
color: var(--primary-color3);
}
header.style-4 .main-menu > ul > li i.active::before {
content: "\f2ea";
}
header.style-4 .main-menu > ul > li .bi {
position: absolute;
top: 11px;
right: 0;
font-size: 20px;
color: var(--title-color);
line-height: 1;
}
header.style-4 .main-menu > ul li.menu-item-has-children > i {
display: block;
}
header.style-4 .main-menu .btn-and-contact-area {
flex-direction: column;
align-items: center;
gap: 20px;
}
header.style-4 .primary-btn3 {
width: 100%;
justify-content: center;
}
}
.right-sidebar-menu {
position: fixed;
top: 0;
right: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.3);
-webkit-backdrop-filter: blur(15px);
backdrop-filter: blur(15px);
opacity: 0;
visibility: hidden;
transition: 0.5s;
}
.right-sidebar-menu .right-sidebar-menu-wrap {
position: fixed;
top: 0;
right: 0;
z-index: 99999;
width: 550px;
height: 100%;
overflow: auto;
background-color: var(--white-color);
transform: translateX(120%);
transform-origin: right;
transition: transform 0.5s ease-in;
box-shadow: 0px 2px 20px rgba(0, 0, 0, 0.03);
display: flex;
flex-direction: column;
justify-content: space-between;
}
.right-sidebar-menu .right-sidebar-menu-wrap::-webkit-scrollbar {
width: 0px;
}
@media (max-width: 576px) {
.right-sidebar-menu .right-sidebar-menu-wrap {
width: 320px;
}
}
.right-sidebar-menu.show-right-menu {
opacity: 1;
visibility: visible;
z-index: 99999;
}
.right-sidebar-menu.show-right-menu .right-sidebar-menu-wrap {
transform: translateX(0);
}
.right-sidebar-menu .right-sidebar-close-btn {
height: 32px;
width: 32px;
border-radius: 50%;
border: 1px solid #3f444b;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: 0.35s;
}
.right-sidebar-menu .right-sidebar-close-btn i {
font-size: 26px;
line-height: 1;
margin-top: 2px;
color: #3f444b;
transition: 0.35s;
}
.right-sidebar-menu .right-sidebar-close-btn:hover {
background-color: var(--title-color);
}
.right-sidebar-menu .right-sidebar-close-btn:hover i {
color: var(--white-color);
}
.right-sidebar-menu .sidebar-logo-area {
text-align: left;
padding: 30px;
display: block;
border-bottom: 1px solid rgba(var(--black-color-opc), 0.1);
}
@media (max-width: 576px) {
.right-sidebar-menu .sidebar-logo-area {
padding: 20px;
}
}
.right-sidebar-menu .sidebar-content-wrap {
padding: 40px 40px;
}
@media (max-width: 576px) {
.right-sidebar-menu .sidebar-content-wrap {
padding: 40px 20px;
}
}
.right-sidebar-menu .sidebar-content-wrap .title-area span {
color: rgba(var(--title-color-opc), 0.6);
font-family: var(--font-manrope);
font-size: 14px;
font-weight: 500;
line-height: 1;
letter-spacing: 0.03em;
text-transform: uppercase;
display: inline-block;
margin-bottom: 10px;
position: relative;
}
.right-sidebar-menu .sidebar-content-wrap .title-area span::after {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
right: -41px;
width: 35px;
height: 1px;
background-color: var(--primary-color1);
}
.right-sidebar-menu .sidebar-content-wrap .title-area h2 {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 37px;
font-weight: 600;
line-height: 1.1;
letter-spacing: 0.03em;
margin-bottom: 15px;
}
@media (max-width: 576px) {
.right-sidebar-menu .sidebar-content-wrap .title-area h2 {
font-size: 28px;
}
}
.right-sidebar-menu .sidebar-content-wrap .title-area p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 16px;
font-weight: 400;
line-height: 1.8;
margin-bottom: 0;
}
@media (max-width: 576px) {
.right-sidebar-menu .sidebar-content-wrap .title-area p {
font-size: 15px;
}
}
.right-sidebar-menu .sidebar-content-wrap .contact-area {
padding: 0;
margin: 0;
list-style: none;
margin: 0 45px;
padding: 52px 0 58px;
}
@media (max-width: 576px) {
.right-sidebar-menu .sidebar-content-wrap .contact-area {
margin: 0 20px;
}
}
.right-sidebar-menu .sidebar-content-wrap .contact-area li {
margin-bottom: 20px;
}
.right-sidebar-menu .sidebar-content-wrap .contact-area li:last-child {
margin-bottom: 0;
}
.right-sidebar-menu .sidebar-content-wrap .contact-area li .single-contact {
display: flex;
align-items: center;
gap: 12px;
}
.right-sidebar-menu .sidebar-content-wrap .contact-area li .single-contact .icon svg {
fill: var(--title-color);
}
.right-sidebar-menu .sidebar-content-wrap .contact-area li .single-contact .content {
position: relative;
line-height: 1;
text-align: start;
}
.right-sidebar-menu .sidebar-content-wrap .contact-area li .single-contact .content span {
font-family: var(--font-manrope);
font-weight: 500;
font-size: 12px;
line-height: 1;
color: var(--title-color);
margin-bottom: 6px;
display: inline-block;
}
.right-sidebar-menu .sidebar-content-wrap .contact-area li .single-contact .content h6 {
margin-bottom: 0;
line-height: 1;
}
.right-sidebar-menu .sidebar-content-wrap .contact-area li .single-contact .content h6 a {
color: rgba(var(--title-color-opc), 0.7);
font-family: var(--font-manrope);
font-weight: 500;
font-size: 17px;
line-height: 1.5;
transition: 0.5s;
}
@media (max-width: 576px) {
.right-sidebar-menu .sidebar-content-wrap .contact-area li .single-contact .content h6 a {
font-size: 16px;
}
}
.right-sidebar-menu .sidebar-content-wrap .contact-area li .single-contact .content h6 a:hover {
color: var(--primary-color1);
}
.right-sidebar-menu .sidebar-content-wrap .contact-area li .single-contact.social .icon svg {
fill: none;
stroke: var(--title-color);
}
.right-sidebar-menu .sidebar-content-wrap .contact-area li .single-contact.social .content h6 a:hover {
text-decoration: underline;
}
.right-sidebar-menu .sidebar-content-wrap .contact-area li .arrow {
margin-top: 20px;
fill: rgba(var(--primary-color1-opc), 0.4);
margin-left: 70px;
}
.right-sidebar-menu .sidebar-content-wrap .address-area {
padding: 0;
margin: 0;
list-style: none;
display: flex;
justify-content: space-between;
gap: 20px;
flex-wrap: wrap;
width: 100%;
}
.right-sidebar-menu .sidebar-content-wrap .address-area .single-address {
max-width: 200px;
width: 100%;
}
.right-sidebar-menu .sidebar-content-wrap .address-area .single-address span {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 14px;
font-weight: 400;
line-height: 1;
letter-spacing: 0.06em;
text-decoration: underline;
display: block;
margin-bottom: 20px;
}
.right-sidebar-menu .sidebar-content-wrap .address-area .single-address a {
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 17px;
font-weight: 400;
line-height: 28px;
transition: 0.5s;
}
.right-sidebar-menu .sidebar-content-wrap .address-area .single-address a:hover {
color: var(--primary-color1);
}
.right-sidebar-menu .sidebar-content-wrap .all-location-btn {
color: var(--primary-color1);
font-family: var(--font-manrope);
font-weight: 400;
font-size: 14px;
line-height: 1;
text-transform: uppercase;
text-decoration: underline;
margin-top: 30px;
display: inline-block;
transition: 0.5s;
}
.right-sidebar-menu .sidebar-content-wrap .all-location-btn:hover {
color: var(--title-color);
}
.right-sidebar-menu .sidebar-bottom-area {
padding: 17px 20px;
border-top: 1px solid rgba(var(--black-color-opc), 0.1);
text-align: center;
}
.right-sidebar-menu .sidebar-bottom-area p {
color: var(--text-color);
font-family: var(--font-manrope);
font-size: 14px;
font-weight: 400;
line-height: 1.8;
letter-spacing: 0.02em;
margin-bottom: 0;
}
.right-sidebar-menu .sidebar-bottom-area p a {
color: var(--primary-color1);
font-weight: 600;
transition: 0.5s;
}
.right-sidebar-menu .sidebar-bottom-area p a:hover {
text-decoration: underline;
}
.right-sidebar-menu.two .sidebar-content-wrap .title-area span::after {
background-color: var(--primary-color2);
}
.right-sidebar-menu.two .sidebar-content-wrap .contact-area li .single-contact .content h6 a:hover {
color: var(--primary-color2);
}
.right-sidebar-menu.two .sidebar-content-wrap .contact-area li .arrow {
fill: rgba(var(--primary-color2-opc), 0.4);
}
.right-sidebar-menu.two .sidebar-content-wrap .address-area .single-address a:hover {
color: var(--primary-color2);
}
.right-sidebar-menu.two .sidebar-content-wrap .all-location-btn {
color: var(--primary-color2);
}
.right-sidebar-menu.two .sidebar-content-wrap .all-location-btn:hover {
color: var(--title-color);
}
.right-sidebar-menu.two .sidebar-bottom-area p a {
color: var(--primary-color2);
font-weight: 600;
transition: 0.5s;
}
.right-sidebar-menu.two .sidebar-bottom-area p a:hover {
text-decoration: underline;
}
.right-sidebar-menu.three .sidebar-content-wrap .title-area span::after {
background-color: var(--primary-color3);
}
.right-sidebar-menu.three .sidebar-content-wrap .contact-area li .single-contact .content h6 a:hover {
color: var(--primary-color3);
}
.right-sidebar-menu.three .sidebar-content-wrap .contact-area li .arrow {
fill: rgba(var(--primary-color3-opc), 0.4);
}
.right-sidebar-menu.three .sidebar-content-wrap .address-area .single-address a:hover {
color: var(--primary-color3);
}
.right-sidebar-menu.three .sidebar-content-wrap .all-location-btn {
color: var(--primary-color3);
}
.right-sidebar-menu.three .sidebar-content-wrap .all-location-btn:hover {
color: var(--title-color);
}
.right-sidebar-menu.three .sidebar-bottom-area p a {
color: var(--primary-color3);
font-weight: 600;
transition: 0.5s;
}
.right-sidebar-menu.three .sidebar-bottom-area p a:hover {
text-decoration: underline;
}
.right-sidebar-menu.four .sidebar-content-wrap .title-area span::after {
background-color: var(--primary-color5);
}
.right-sidebar-menu.four .sidebar-content-wrap .contact-area li .single-contact .content h6 a:hover {
color: var(--primary-color5);
}
.right-sidebar-menu.four .sidebar-content-wrap .contact-area li .arrow {
fill: rgba(var(--primary-color5-opc), 0.4);
}
.right-sidebar-menu.four .sidebar-content-wrap .address-area .single-address a:hover {
color: var(--primary-color5);
}
.right-sidebar-menu.four .sidebar-content-wrap .all-location-btn {
color: var(--primary-color5);
}
.right-sidebar-menu.four .sidebar-content-wrap .all-location-btn:hover {
color: var(--title-color);
}
.right-sidebar-menu.four .sidebar-bottom-area p a {
color: var(--primary-color5);
font-weight: 600;
transition: 0.5s;
}
.right-sidebar-menu.four .sidebar-bottom-area p a:hover {
text-decoration: underline;
}
.sidebar-menu {
position: fixed;
top: 0;
left: 0;
width: 100%;
padding: 0px 0 70px;
z-index: 9992;
overflow-y: auto;
transition: all 0.3s;
background-color: var(--white-color);
height: 100%;
transform-origin: left;
transform: translateX(-120%);
transition: transform 0.6s ease-in;
}
@media (max-width: 991px) {
.sidebar-menu {
transform-origin: top;
transform: translateY(-120%);
}
.sidebar-menu.active {
transform: translateY(0);
}
}
.sidebar-menu.active {
transform: translateX(0);
}
@media (max-width: 1399px) {
.sidebar-menu {
padding: 0px 0 70px;
}
}
.sidebar-menu .sidebar-menu-top-area {
padding: 25px 0;
border-bottom: 1px solid var(--borders-color);
margin-bottom: 80px;
}
@media (max-width: 991px) {
.sidebar-menu .sidebar-menu-top-area {
margin-bottom: 55px;
}
}
.sidebar-menu .sidebar-menu-top-area .sidebar-menu-close {
border: 1px solid var(--primary-color2);
width: 40px;
height: 40px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: 0.5s;
}
.sidebar-menu .sidebar-menu-top-area .sidebar-menu-close svg {
fill: var(--primary-color2);
transition: 0.5s;
}
@media (max-width: 576px) {
.sidebar-menu .sidebar-menu-top-area .sidebar-menu-close {
width: 36px;
height: 36px;
}
.sidebar-menu .sidebar-menu-top-area .sidebar-menu-close svg {
width: 18px;
height: 18px;
}
}
.sidebar-menu .sidebar-menu-top-area .sidebar-menu-close:hover {
background-color: #ff4820;
border-color: #ff4820;
}
.sidebar-menu .sidebar-menu-top-area .sidebar-menu-close:hover svg {
fill: var(--white-color);
}
.sidebar-menu .sidebar-contact h4 {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 25px;
font-weight: 500;
line-height: 1.3;
letter-spacing: 0.05em;
margin-bottom: 25px;
}
@media (max-width: 991px) {
.sidebar-menu .sidebar-contact h4 {
margin-bottom: 30px;
}
}
@media (max-width: 767px) {
.sidebar-menu .sidebar-contact h4 {
margin-bottom: 25px;
}
}
.sidebar-menu .sidebar-contact h4 svg {
fill: var(--title-color);
margin-left: 5px;
}
.sidebar-menu .sidebar-contact .contact-area {
padding-bottom: 40px;
border-bottom: 1px solid rgba(var(--primary-color2-opc), 0.1);
}
.sidebar-menu .sidebar-contact .contact-area .contact-list {
padding: 0;
margin: 0;
list-style: none;
}
.sidebar-menu .sidebar-contact .contact-area .contact-list li {
margin-bottom: 20px;
}
.sidebar-menu .sidebar-contact .contact-area .contact-list li:last-child {
margin-bottom: 0;
}
.sidebar-menu .sidebar-contact .contact-area .contact-list li .single-contact {
display: flex;
align-items: center;
gap: 12px;
}
.sidebar-menu .sidebar-contact .contact-area .contact-list li .single-contact .icon svg {
fill: var(--primary-color2);
}
.sidebar-menu .sidebar-contact .contact-area .contact-list li .single-contact .content {
position: relative;
line-height: 1;
text-align: start;
}
.sidebar-menu .sidebar-contact .contact-area .contact-list li .single-contact .content span {
font-family: var(--font-manrope);
font-weight: 600;
font-size: 12px;
line-height: 1;
color: var(--title-color);
margin-bottom: 6px;
letter-spacing: 0.05em;
display: inline-block;
}
.sidebar-menu .sidebar-contact .contact-area .contact-list li .single-contact .content h6 {
margin-bottom: 0;
line-height: 1;
}
.sidebar-menu .sidebar-contact .contact-area .contact-list li .single-contact .content h6 a {
color: rgba(var(--title-color-opc), 0.6);
font-family: var(--font-manrope);
font-weight: 500;
font-size: 17px;
line-height: 1.5;
transition: 0.5s;
}
@media (max-width: 576px) {
.sidebar-menu .sidebar-contact .contact-area .contact-list li .single-contact .content h6 a {
font-size: 16px;
}
}
.sidebar-menu .sidebar-contact .contact-area .contact-list li .single-contact .content h6 a:hover {
color: var(--primary-color2);
}
.sidebar-menu .sidebar-contact .contact-area .contact-list li .arrow {
margin-top: 20px;
fill: rgba(var(--primary-color2-opc), 0.3);
margin-left: 70px;
}
.sidebar-menu .sidebar-contact .address-area .address-list {
padding: 0;
margin: 0;
list-style: none;
}
@media (max-width: 991px) {
.sidebar-menu .sidebar-contact .address-area .address-list {
display: flex;
align-items: center;
gap: 45px;
}
}
@media (max-width: 576px) {
.sidebar-menu .sidebar-contact .address-area .address-list {
flex-direction: column;
align-items: flex-start;
gap: 25px;
}
}
.sidebar-menu .sidebar-contact .address-area .address-list .single-address {
max-width: 200px;
width: 100%;
margin-bottom: 50px;
}
.sidebar-menu .sidebar-contact .address-area .address-list .single-address:last-child {
margin-bottom: 0;
}
@media (max-width: 991px) {
.sidebar-menu .sidebar-contact .address-area .address-list .single-address {
margin-bottom: 0;
}
}
.sidebar-menu .sidebar-contact .address-area .address-list .single-address span {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 14px;
font-weight: 400;
line-height: 1;
letter-spacing: 0.06em;
text-decoration: underline;
display: block;
margin-bottom: 20px;
}
.sidebar-menu .sidebar-contact .address-area .address-list .single-address a {
color: rgba(var(--title-color-opc), 0.6);
font-family: var(--font-dmsans);
font-size: 17px;
font-weight: 400;
line-height: 28px;
margin-bottom: 0;
transition: 0.5s;
}
.sidebar-menu .sidebar-contact .address-area .address-list .single-address a:hover {
color: var(--primary-color2);
}
.sidebar-menu .sidebar-menu-wrap {
border-left: 1px solid var(--borders-color);
margin-right: 50px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.sidebar-menu .sidebar-menu-wrap {
margin-right: 30px;
}
}
@media (max-width: 1199px) {
.sidebar-menu .sidebar-menu-wrap {
margin-right: 0px;
}
}
@media (max-width: 991px) {
.sidebar-menu .sidebar-menu-wrap {
margin-right: 0;
}
}
.sidebar-menu .sidebar-menu-wrap .main-menu {
margin: 0;
padding: 0;
list-style: none;
overflow-y: auto;
border-top: 1px solid var(--borders-color);
border-right: 1px solid var(--borders-color);
}
.sidebar-menu .sidebar-menu-wrap .main-menu::-webkit-scrollbar {
width: 0;
}
.sidebar-menu .sidebar-menu-wrap .main-menu::-webkit-scrollbar-track {
background: var(--title-color);
}
.sidebar-menu .sidebar-menu-wrap .main-menu::-webkit-scrollbar-thumb {
background: var(--primary-color2);
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li {
position: relative;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a {
border-bottom: 1px solid var(--borders-color);
color: var(--title-color);
font-family: var(--font-manrope);
text-transform: uppercase;
font-size: 30px;
font-weight: 700;
letter-spacing: 0.05em;
display: block;
line-height: 1;
padding: 30px 30px 30px 70px;
transform: translateY(var(--y)) translateZ(0);
transition: transform 0.4s ease, box-shadow 0.4s ease;
}
@media (max-width: 1399px) {
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a {
padding: 30px 30px 30px 50px;
}
}
@media (max-width: 1199px) {
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a {
padding: 25px 25px 25px 40px;
font-size: 28px;
}
}
@media (max-width: 767px) {
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a {
padding: 25px 30px;
font-size: 26px;
}
}
@media (max-width: 576px) {
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a {
padding: 20px 15px;
font-size: 22px;
}
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text {
display: flex;
overflow: hidden;
text-shadow: 0 30px 0 var(--title-color);
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span {
display: block;
backface-visibility: hidden;
transition: transform 0.4s ease;
transform: translateY(var(--m)) translateZ(0);
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(1) {
transition-delay: 0.05s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(2) {
transition-delay: 0.1s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(3) {
transition-delay: 0.15s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(4) {
transition-delay: 0.2s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(5) {
transition-delay: 0.25s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(6) {
transition-delay: 0.3s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(7) {
transition-delay: 0.35s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(8) {
transition-delay: 0.4s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(9) {
transition-delay: 0.45s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(10) {
transition-delay: 0.5s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(11) {
transition-delay: 0.55s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(12) {
transition-delay: 0.6s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(13) {
transition-delay: 0.65s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(14) {
transition-delay: 0.7s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(15) {
transition-delay: 0.75s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(16) {
transition-delay: 0.8s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(17) {
transition-delay: 0.85s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(18) {
transition-delay: 0.9s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(19) {
transition-delay: 0.95s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(20) {
transition-delay: 1s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(21) {
transition-delay: 1.05s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(22) {
transition-delay: 1.1s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(23) {
transition-delay: 1.15s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(24) {
transition-delay: 1.2s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(25) {
transition-delay: 1.25s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(26) {
transition-delay: 1.3s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(27) {
transition-delay: 1.35s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(28) {
transition-delay: 1.4s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(29) {
transition-delay: 1.45s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(30) {
transition-delay: 1.5s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(31) {
transition-delay: 1.55s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(32) {
transition-delay: 1.6s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(33) {
transition-delay: 1.65s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(34) {
transition-delay: 1.7s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(35) {
transition-delay: 1.75s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(36) {
transition-delay: 1.8s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(37) {
transition-delay: 1.85s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(38) {
transition-delay: 1.9s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(39) {
transition-delay: 1.95s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a .menu-text span:nth-child(40) {
transition-delay: 2s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a svg {
display: none;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a:hover {
--y: -0px;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li > a:hover span {
--m: calc(30px * -1);
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .dropdown-icon2 {
position: absolute;
right: 30px;
top: 25px;
width: 40px;
height: 40px;
border-radius: 50%;
background-color: rgba(var(--primary-color2-opc), 0.15);
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: 0.5s;
display: none;
}
@media (max-width: 767px) {
.sidebar-menu .sidebar-menu-wrap .main-menu > li .dropdown-icon2 {
right: 30px;
}
}
@media (max-width: 576px) {
.sidebar-menu .sidebar-menu-wrap .main-menu > li .dropdown-icon2 {
top: 15px;
right: 20px;
width: 33px;
height: 33px;
}
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .dropdown-icon2 i {
color: var(--title-color);
font-size: 27px;
transition: 0.5s;
}
@media (max-width: 576px) {
.sidebar-menu .sidebar-menu-wrap .main-menu > li .dropdown-icon2 i {
font-size: 24px;
}
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .dropdown-icon2.current-menu-item i::before, .sidebar-menu .sidebar-menu-wrap .main-menu > li .dropdown-icon2.current_page_item i::before, .sidebar-menu .sidebar-menu-wrap .main-menu > li .dropdown-icon2.current-menu-ancestor i::before, .sidebar-menu .sidebar-menu-wrap .main-menu > li .dropdown-icon2.current-menu-parent i::before, .sidebar-menu .sidebar-menu-wrap .main-menu > li .dropdown-icon2.current_page_parent i::before, .sidebar-menu .sidebar-menu-wrap .main-menu > li .dropdown-icon2.current_page_ancestor i::before, .sidebar-menu .sidebar-menu-wrap .main-menu > li .dropdown-icon2.active i::before {
content: "\f2ea";
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .dropdown-icon2:hover {
background-color: var(--primary-color2);
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .dropdown-icon2:hover i {
color: var(--white-color);
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .dropdown-icon2.two {
height: unset;
width: unset;
background-color: transparent;
top: 0;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .dropdown-icon2.two i {
color: var(--title-color);
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li.menu-item-has-children .dropdown-icon2 {
display: flex;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu {
margin: 0;
padding: 0;
list-style: none;
position: static;
opacity: 1;
visibility: visible;
transition: none;
display: none;
padding: 40px 70px;
border-bottom: 1px solid var(--borders-color);
}
@media (max-width: 1399px) {
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu {
padding: 40px 50px;
}
}
@media (max-width: 1199px) {
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu {
padding: 35px 40px;
}
}
@media (max-width: 767px) {
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu {
padding: 35px 30px;
}
}
@media (max-width: 576px) {
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu {
padding: 20px;
}
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu.active {
display: block;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li {
position: relative;
margin-bottom: 15px;
}
@media (max-width: 576px) {
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li {
margin-bottom: 8px;
}
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li:last-child {
margin-bottom: 0;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li a {
color: var(--text-color);
font-family: var(--font-manrope);
font-size: 17px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.03em;
padding-left: 30px;
position: relative;
transition: 0.5s;
display: flex;
align-items: center;
gap: 5px;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li a svg {
fill: var(--text-color);
transition: 0.5s;
}
@media (max-width: 576px) {
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li a svg {
width: 8px;
}
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li a span {
color: var(--white-color);
font-size: 8px;
font-family: var(--font-dmsans);
font-weight: 400;
text-transform: uppercase;
line-height: 1;
background-color: var(--primary-color2);
padding: 4px;
display: inline-block;
}
@media (max-width: 576px) {
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li a {
padding-left: 20px;
font-size: 14px;
}
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li a::before {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 0;
width: 10px;
height: 10px;
border-radius: 50%;
border: 1px solid rgba(var(--black-color-opc), 0.7);
transition: 0.5s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li a:hover {
color: var(--primary-color2);
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li a:hover svg {
fill: var(--primary-color2);
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li a:hover::before {
border-color: var(--primary-color2);
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li .dropdown-icon2 {
top: 0;
display: none;
background: unset;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li.menu-item-has-children .dropdown-icon2 {
display: flex;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li .sub-menu {
padding-top: 20px;
padding-bottom: 7px;
padding-left: 20px;
border-bottom: none;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li .sub-menu li {
margin-bottom: 10px;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li .sub-menu li::after {
display: none;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li .sub-menu li .dropdown-icon2 {
top: 0;
display: none;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li .sub-menu li.menu-item-has-children .dropdown-icon2 {
display: flex;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li .sub-menu li a {
font-size: 15px;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li .sub-menu li a svg {
fill: var(--paragraph-color);
margin-left: 5px;
transition: 0.5s;
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li .sub-menu li a:hover {
color: var(--primary-color2);
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li .sub-menu li a:hover svg {
fill: var(--primary-color2);
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li.current-menu-item > a, .sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li.current_page_item > a, .sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li.current-menu-ancestor > a, .sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li.current-menu-parent > a, .sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li.current_page_parent > a, .sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li.current_page_ancestor > a, .sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li.active > a {
color: var(--primary-color2);
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li.current-menu-item > a svg, .sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li.current_page_item > a svg, .sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li.current-menu-ancestor > a svg, .sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li.current-menu-parent > a svg, .sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li.current_page_parent > a svg, .sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li.current_page_ancestor > a svg, .sidebar-menu .sidebar-menu-wrap .main-menu > li .sub-menu li.active > a svg {
fill: var(--primary-color2);
}
.sidebar-menu .sidebar-menu-wrap .main-menu > li.current-menu-item > a, .sidebar-menu .sidebar-menu-wrap .main-menu > li.current_page_item > a, .sidebar-menu .sidebar-menu-wrap .main-menu > li.current-menu-ancestor > a, .sidebar-menu .sidebar-menu-wrap .main-menu > li.current-menu-parent > a, .sidebar-menu .sidebar-menu-wrap .main-menu > li.current_page_parent > a, .sidebar-menu .sidebar-menu-wrap .main-menu > li.current_page_ancestor > a {
color: var(--primary-color2);
} @keyframes textRotation {
to {
transform: rotate(360deg);
}
}
.home1-banner-section .banner-wrapper {
background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%), url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home1/home1-banner-bg.jpg);
background-size: cover;
background-repeat: no-repeat;
min-height: 750px;
margin: 0 90px;
padding: 70px 55px 70px 80px;
display: flex;
align-items: end;
justify-content: space-between;
}
@media (max-width: 1699px) {
.home1-banner-section .banner-wrapper {
margin: 0 70px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home1-banner-section .banner-wrapper {
margin: 0 30px;
padding: 70px 55px 70px 60px;
min-height: 650px;
}
}
@media (max-width: 1399px) {
.home1-banner-section .banner-wrapper {
margin: 0 20px;
padding: 70px 45px 70px 50px;
min-height: 650px;
}
}
@media (max-width: 1199px) {
.home1-banner-section .banner-wrapper {
margin: 0 10px;
padding: 70px 35px 70px 40px;
}
}
@media (max-width: 991px) {
.home1-banner-section .banner-wrapper {
padding: 70px 20px 70px 20px;
min-height: 620px;
}
}
@media (max-width: 576px) {
.home1-banner-section .banner-wrapper {
margin: 0;
padding: 60px 10px 60px 10px;
}
}
.home1-banner-section .banner-wrapper .banner-content-wrap {
display: flex;
justify-content: space-between;
width: 100%;
}
@media (max-width: 767px) {
.home1-banner-section .banner-wrapper .banner-content-wrap {
flex-wrap: wrap;
gap: 30px;
}
}
.home1-banner-section .banner-wrapper .banner-content-wrap .banner-content {
max-width: 800px;
width: 100%;
}
.home1-banner-section .banner-wrapper .banner-content-wrap .banner-content h1 {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 800;
font-size: 60px;
line-height: 1.3;
margin-bottom: 35px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home1-banner-section .banner-wrapper .banner-content-wrap .banner-content h1 {
font-size: 58px;
}
}
@media (max-width: 1399px) {
.home1-banner-section .banner-wrapper .banner-content-wrap .banner-content h1 {
font-size: 52px;
}
}
@media (max-width: 1199px) {
.home1-banner-section .banner-wrapper .banner-content-wrap .banner-content h1 {
font-size: 48px;
margin-bottom: 30px;
}
}
@media (max-width: 991px) {
.home1-banner-section .banner-wrapper .banner-content-wrap .banner-content h1 {
font-size: 44px;
}
}
@media (max-width: 767px) {
.home1-banner-section .banner-wrapper .banner-content-wrap .banner-content h1 {
font-size: 40px;
}
}
@media (max-width: 576px) {
.home1-banner-section .banner-wrapper .banner-content-wrap .banner-content h1 {
font-size: 32px;
margin-bottom: 25px;
}
}
.home1-banner-section .banner-wrapper .banner-content-wrap .banner-content .btn-grp {
display: flex;
align-items: center;
gap: 50px;
}
@media (max-width: 576px) {
.home1-banner-section .banner-wrapper .banner-content-wrap .banner-content .btn-grp {
flex-wrap: wrap;
gap: 30px;
}
}
.home1-banner-section .banner-wrapper .banner-content-wrap .banner-content .btn-grp .discuss-btn {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
line-height: 1;
text-transform: uppercase;
display: flex;
align-items: center;
gap: 10px;
white-space: nowrap;
padding-bottom: 5px;
position: relative;
background: linear-gradient(to bottom, var(--white-color) 0%, var(--white-color) 98%);
background-repeat: no-repeat;
background-size: 100% 1px;
background-position: left 100%;
transition: background-size 0.75s;
}
.home1-banner-section .banner-wrapper .banner-content-wrap .banner-content .btn-grp .discuss-btn svg {
fill: var(--white-color);
transition: 0.5s;
}
.home1-banner-section .banner-wrapper .banner-content-wrap .banner-content .btn-grp .discuss-btn:hover {
background-size: 0 1px;
background-position: 0% 100%;
}
.home1-banner-section .banner-wrapper .banner-content-wrap .banner-content .btn-grp .discuss-btn:hover svg {
transform: rotate(45deg);
}
.home1-banner-section .banner-wrapper .banner-content-wrap .circular-text {
position: relative;
min-width: 120px;
height: 120px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--white-color);
}
@media (max-width: 767px) {
.home1-banner-section .banner-wrapper .banner-content-wrap .circular-text {
display: none;
}
}
.home1-banner-section .banner-wrapper .banner-content-wrap .circular-text .center-icon {
width: 65px;
height: 65px;
border-radius: 50%;
background-color: #6a6b6b;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 1;
}
.home1-banner-section .banner-wrapper .banner-content-wrap .circular-text .center-icon svg {
fill: var(--white-color);
}
.home1-banner-section .banner-wrapper .banner-content-wrap .circular-text .text {
position: absolute;
width: 100%;
height: 100%;
animation: textRotation 8s linear infinite;
}
.home1-banner-section .banner-wrapper .banner-content-wrap .circular-text .text span {
position: absolute;
left: 50%;
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 13px;
font-weight: 700;
transform-origin: 0 60px;
} .home1-about-section {
scroll-margin-top: 180px;
}
.home1-about-section .about-top-area .about-title-area .section-title {
max-width: 872px;
width: 100%;
}
.home1-about-section .about-top-area .about-title-area .video-and-content {
padding-top: 40px;
padding-left: 95px;
display: flex;
align-items: center;
gap: 50px;
}
@media (max-width: 1399px) {
.home1-about-section .about-top-area .about-title-area .video-and-content {
padding-left: 60px;
}
}
@media (max-width: 1199px) {
.home1-about-section .about-top-area .about-title-area .video-and-content {
padding-left: 40px;
padding-top: 35px;
gap: 40px;
}
}
@media (max-width: 991px) {
.home1-about-section .about-top-area .about-title-area .video-and-content {
padding-left: 0;
padding-top: 25px;
}
}
@media (max-width: 767px) {
.home1-about-section .about-top-area .about-title-area .video-and-content {
gap: 30px;
}
}
@media (max-width: 576px) {
.home1-about-section .about-top-area .about-title-area .video-and-content {
flex-wrap: wrap;
gap: 20px;
}
}
.home1-about-section .about-top-area .about-title-area .video-and-content .video-area {
cursor: pointer;
display: inline-block;
}
.home1-about-section .about-top-area .about-title-area .video-and-content .video-area .icon {
position: relative;
}
.home1-about-section .about-top-area .about-title-area .video-and-content .video-area .icon .video-circle {
stroke: var(--primary-color1);
fill: none;
transition: 0.5s;
}
@media (max-width: 576px) {
.home1-about-section .about-top-area .about-title-area .video-and-content .video-area .icon .video-circle {
width: 68px;
}
}
.home1-about-section .about-top-area .about-title-area .video-and-content .video-area .icon .video-circle .top-half {
stroke-dasharray: 430;
stroke-dashoffset: 320;
transition: stroke-dashoffset 0.8s cubic-bezier(0.33, 1, 0.68, 1);
}
.home1-about-section .about-top-area .about-title-area .video-and-content .video-area .icon .play-icon {
fill: var(--primary-color1);
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
margin-left: 2px;
}
@media (max-width: 576px) {
.home1-about-section .about-top-area .about-title-area .video-and-content .video-area .icon .play-icon {
width: 20px;
}
}
.home1-about-section .about-top-area .about-title-area .video-and-content .video-area:hover .icon .video-circle .top-half {
stroke-dashoffset: 0;
}
.home1-about-section .about-top-area .about-title-area .video-and-content .content p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 16px;
font-weight: 400;
line-height: 32px;
margin-bottom: 0;
padding-left: 15px;
position: relative;
}
@media (max-width: 767px) {
.home1-about-section .about-top-area .about-title-area .video-and-content .content p {
font-size: 15px;
}
}
@media (max-width: 576px) {
.home1-about-section .about-top-area .about-title-area .video-and-content .content p {
padding-left: 0;
}
}
.home1-about-section .about-top-area .about-title-area .video-and-content .content p::before {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 0;
width: 2px;
height: 77px;
background-color: rgba(var(--black-color-opc), 0.3);
}
@media (max-width: 576px) {
.home1-about-section .about-top-area .about-title-area .video-and-content .content p::before {
display: none;
}
}
.home1-about-section .about-top-area .about-btn-area {
position: relative;
display: inline-block;
}
.home1-about-section .about-top-area .about-btn-area .bg svg {
fill: transparent;
stroke: rgba(var(--title-color-opc), 0.1);
transition: 0.5s;
}
.home1-about-section .about-top-area .about-btn-area .about-btn {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
display: inline-block;
vertical-align: top;
line-height: 1.4;
text-decoration: none;
outline: none;
padding: 0 1.375em 0.0625em 0;
cursor: pointer;
background-color: transparent;
background-position: 100% 100%;
background-repeat: no-repeat;
background-size: var(--background-size, 100%) 0.0625em;
transition: background-size 0.2s linear var(--background-delay, 0.15s);
border: none;
background-image: linear-gradient(0deg, var(--title-color) 0%, var(--title-color) 100%);
color: var(--title-color);
font-family: var(--font-dmsans);
font-size: 12px;
font-weight: 400;
text-transform: uppercase;
white-space: nowrap;
}
.home1-about-section .about-top-area .about-btn-area .about-btn::after {
content: "\f123";
font-family: "bootstrap-icons";
display: block;
position: absolute;
right: 0;
left: initial;
top: 0;
opacity: 1;
transition: opacity 0.3s 0.15s;
color: var(--title-color);
}
.home1-about-section .about-top-area .about-btn-area .about-btn svg {
position: absolute;
display: block;
line-height: 1.8125em;
width: 1.375em;
height: 1.8125em;
right: 0;
left: initial;
top: 50%;
margin: -0.92em 0 0;
fill: none;
stroke: var(--title-color);
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 1px;
stroke-dasharray: 7.95 30;
stroke-dashoffset: var(--stroke-dashoffset, 46);
transition: stroke-dashoffset var(--stroke-duration, 0.15s) var(--stroke-easing, linear) var(--stroke-delay, 0s);
}
.home1-about-section .about-top-area .about-btn-area:hover .bg svg {
fill: var(--primary-color1);
stroke: var(--primary-color1);
transition: 0.5s;
}
.home1-about-section .about-top-area .about-btn-area:hover .about-btn {
--background-size: 0%;
--stroke-dashoffset: 26;
--stroke-duration: 0.3s;
--stroke-easing: cubic-bezier(0.3, 1.5, 0.5, 1);
--stroke-delay: 0.195s;
background-image: linear-gradient(0deg, var(--white-color) 0%, var(--white-color) 100%);
color: var(--white-color);
}
.home1-about-section .about-top-area .about-btn-area:hover .about-btn::after {
opacity: 0;
transition-delay: 0s;
color: var(--white-color);
}
.home1-about-section .about-top-area .about-btn-area:hover .about-btn svg {
stroke: var(--white-color);
}
.home1-about-section .about-content p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 16px;
line-height: 1.9;
margin-bottom: 0;
}
@media (max-width: 767px) {
.home1-about-section .about-content p {
font-size: 15px;
}
}
.home1-about-section .about-content ul {
padding: 0;
margin: 0;
list-style: none;
padding-top: 70px;
max-width: 424px;
width: 100%;
}
@media (max-width: 1399px) {
.home1-about-section .about-content ul {
padding-top: 60px;
}
}
@media (max-width: 1199px) {
.home1-about-section .about-content ul {
padding-top: 45px;
}
}
@media (max-width: 991px) {
.home1-about-section .about-content ul {
display: flex;
justify-content: space-between;
width: 100%;
max-width: unset;
gap: 30px;
padding-top: 35px;
}
}
@media (max-width: 767px) {
.home1-about-section .about-content ul {
gap: 20px;
}
}
@media (max-width: 576px) {
.home1-about-section .about-content ul {
flex-wrap: wrap;
gap: 25px;
padding-top: 25px;
}
}
.home1-about-section .about-content ul li {
margin-bottom: 70px;
}
@media (max-width: 1399px) {
.home1-about-section .about-content ul li {
margin-bottom: 60px;
}
}
@media (max-width: 1199px) {
.home1-about-section .about-content ul li {
margin-bottom: 45px;
}
}
@media (max-width: 991px) {
.home1-about-section .about-content ul li {
margin-bottom: 0;
}
}
.home1-about-section .about-content ul li:last-child {
margin-bottom: 0;
}
.home1-about-section .about-content ul li h6 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 700;
font-size: 22px;
line-height: 1.2;
margin-bottom: 15px;
}
@media (max-width: 767px) {
.home1-about-section .about-content ul li h6 {
font-size: 21px;
}
}
@media (max-width: 576px) {
.home1-about-section .about-content ul li h6 {
font-size: 20px;
margin-bottom: 10px;
}
} @keyframes qodef-animate-image-out {
0% {
transform: scale(1) translateZ(0);
clip-path: inset(0 0 0 0);
}
100% {
transform: scale(1);
clip-path: inset(0 0 0 0);
}
}
@keyframes qodef-animate-image-in {
0% {
transform: scale(1) translateZ(0);
clip-path: inset(0 100% 0 0);
}
100% {
transform: scale(1);
clip-path: inset(0 0 0 0);
}
}
.home1-service-section {
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home1/home1-service-bg.png), linear-gradient(180deg, #d8e7ef 0%, #d8e7ef 100%);
background-size: cover;
background-repeat: no-repeat;
padding: 90px 0;
}
@media (max-width: 767px) {
.home1-service-section {
padding: 70px 0;
}
}
.home1-service-section .service-wrap {
position: relative;
min-height: 570px;
}
@media (max-width: 1199px) {
.home1-service-section .service-wrap {
min-height: 540px;
}
}
@media (max-width: 767px) {
.home1-service-section .service-wrap {
min-height: 480px;
}
}
@media (max-width: 576px) {
.home1-service-section .service-wrap {
min-height: unset;
}
}
.home1-service-section .service-wrap .service-img-list {
padding: 0;
margin: 0;
list-style: none;
}
@media (max-width: 576px) {
.home1-service-section .service-wrap .service-img-list {
display: none;
}
}
.home1-service-section .service-wrap .service-img-list li .service-img {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
animation: qodef-animate-image-out 1s 0.1s cubic-bezier(0.78, 0.2, 0.21, 0.88) forwards;
z-index: 12;
}
.home1-service-section .service-wrap .service-img-list li .service-img img {
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.home1-service-section .service-wrap .service-img-list li.active .service-img {
animation: qodef-animate-image-in 1s cubic-bezier(0.78, 0.2, 0.21, 0.88) forwards;
z-index: 15;
}
.home1-service-section .service-wrap .service-list {
padding: 0;
margin: 0;
list-style: none;
max-width: 450px;
width: 100%;
background-color: #d8e7ef;
padding: 30px 35px;
position: absolute;
bottom: -1px;
left: 110px;
z-index: 18;
}
@media (max-width: 1199px) {
.home1-service-section .service-wrap .service-list {
left: 80px;
}
}
@media (max-width: 991px) {
.home1-service-section .service-wrap .service-list {
left: 60px;
max-width: 400px;
padding: 25px 30px;
}
}
@media (max-width: 767px) {
.home1-service-section .service-wrap .service-list {
left: 20px;
}
}
@media (max-width: 576px) {
.home1-service-section .service-wrap .service-list {
position: relative;
left: unset;
border: 1px solid rgba(var(--title-color-opc), 0.1);
padding: 25px 25px;
}
}
.home1-service-section .service-wrap .service-list li {
margin-bottom: 25px;
}
@media (max-width: 991px) {
.home1-service-section .service-wrap .service-list li {
margin-bottom: 20px;
}
}
.home1-service-section .service-wrap .service-list li:last-child {
margin-bottom: 0;
}
.home1-service-section .service-wrap .service-list li:last-child a {
padding-bottom: 0;
border: unset;
}
.home1-service-section .service-wrap .service-list li a {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 20px;
line-height: 1.2;
display: flex;
align-items: center;
justify-content: space-between;
transition: 0.5s;
padding-bottom: 25px;
border-bottom: 1px solid rgba(var(--black-color-opc), 0.1);
}
@media (max-width: 991px) {
.home1-service-section .service-wrap .service-list li a {
padding-bottom: 20px;
font-size: 18px;
}
}
.home1-service-section .service-wrap .service-list li a svg {
fill: rgba(var(--title-color-opc), 0.12);
transition: 0.5s;
}
.home1-service-section .service-wrap .service-list li a:hover {
color: var(--primary-color1);
}
.home1-service-section .service-wrap .service-list li a:hover svg {
fill: rgba(var(--primary-color1-opc), 0.3);
transform: rotate(45deg);
} .home1-feature-section .feature-wrap {
padding: 40px 0;
border-top: 1px solid rgba(var(--black-color-opc), 0.1);
border-bottom: 1px solid rgba(var(--black-color-opc), 0.1);
}
@media (max-width: 767px) {
.home1-feature-section .feature-wrap {
padding: 30px 0;
}
}
@media (max-width: 576px) {
.home1-feature-section .feature-wrap {
padding: 10px 0;
}
}
.home1-feature-section .feature-wrap .single-feature {
padding: 40px 30px;
border-left: 1px solid rgba(var(--black-color-opc), 0.1);
}
@media (max-width: 1399px) {
.home1-feature-section .feature-wrap .single-feature {
padding: 40px 25px;
}
}
@media (max-width: 767px) {
.home1-feature-section .feature-wrap .single-feature {
padding: 30px 20px;
}
}
@media (max-width: 576px) {
.home1-feature-section .feature-wrap .single-feature {
padding-left: 0;
border-left: unset;
}
}
.home1-feature-section .feature-wrap .single-feature svg {
fill: rgba(var(--title-color-opc), 0.6);
margin-bottom: 25px;
}
@media (max-width: 576px) {
.home1-feature-section .feature-wrap .single-feature svg {
margin-bottom: 20px;
}
}
.home1-feature-section .feature-wrap .single-feature h5 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 500;
font-size: 25px;
line-height: 28px;
margin-bottom: 25px;
}
@media (max-width: 1399px) {
.home1-feature-section .feature-wrap .single-feature h5 {
font-size: 23px;
}
}
@media (max-width: 767px) {
.home1-feature-section .feature-wrap .single-feature h5 {
margin-bottom: 20px;
}
}
@media (max-width: 576px) {
.home1-feature-section .feature-wrap .single-feature h5 {
margin-bottom: 15px;
}
}
.home1-feature-section .feature-wrap .single-feature p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 16px;
line-height: 26px;
margin-bottom: 0;
}
.home1-feature-section .feature-wrap .single-feature:hover svg {
animation: bounceIn 1.2s linear;
}
.home1-feature-section .home1-feature-slider .swiper-slide:first-child .single-feature {
padding-left: 0;
border-left: unset;
}
.home1-feature-section .home1-feature-slider .swiper-slide.swiper-slide-active .single-feature {
border-left: unset;
} .project-card {
position: relative;
overflow: hidden;
transition: all 0.5s ease-out;
}
@media (min-width: 992px) and (max-width: 1199px) {
.project-card img {
min-height: 380px;
-o-object-fit: cover;
object-fit: cover;
}
}
@media (max-width: 767px) {
.project-card img {
min-height: 380px;
-o-object-fit: cover;
object-fit: cover;
}
}
.project-card .project-content-wrap {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 24.28%, rgba(0, 0, 0, 0.8) 91.5%);
padding: 30px 20px;
display: flex;
align-items: end;
z-index: 2;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.project-card .project-content-wrap {
padding: 30px 15px;
}
}
@media (max-width: 576px) {
.project-card .project-content-wrap {
padding: 30px 15px;
}
}
.project-card .project-content-wrap .project-content span {
color: rgba(255, 255, 255, 0.7);
font-family: var(--font-dmsans);
font-size: 13px;
font-weight: 500;
line-height: 1;
letter-spacing: 0.02em;
display: block;
margin-bottom: 10px;
}
.project-card .project-content-wrap .project-content h3 {
margin-bottom: 20px;
}
.project-card .project-content-wrap .project-content h3 a {
color: var(--white-color);
font-family: var(--font-manrope);
font-size: 28px;
font-weight: 500;
line-height: 1.2;
letter-spacing: 0.05em;
transition: 0.5s;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.project-card .project-content-wrap .project-content h3 a {
font-size: 25px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.project-card .project-content-wrap .project-content h3 a {
font-size: 25px;
}
}
@media (max-width: 576px) {
.project-card .project-content-wrap .project-content h3 a {
font-size: 25px;
}
}
.project-card .project-content-wrap .project-content h3 a:hover {
color: var(--primary-color1);
}
.project-card .project-content-wrap .project-content ul {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
gap: 10px;
flex-wrap: wrap;
}
.project-card .project-content-wrap .project-content ul li {
display: flex;
}
.project-card .project-content-wrap .project-content ul li a {
color: var(--white-color);
font-family: var(--font-dmsans);
font-size: 12px;
font-weight: 500;
line-height: 1;
padding: 5px 14px;
border-radius: 15px;
border: 1px solid rgba(255, 255, 255, 0.2);
background-color: rgba(255, 255, 255, 0.15);
-webkit-backdrop-filter: blur(6px);
backdrop-filter: blur(6px);
transition: 0.5s;
}
.project-card .project-content-wrap .project-content ul li a:hover {
background-color: var(--primary-color1);
border-color: var(--primary-color1);
}
.project-card::after {
position: absolute;
width: 200%;
height: 0%;
left: 50%;
top: 50%;
background-color: rgba(255, 255, 255, 0.3);
transform: translate(-50%, -50%) rotate(-45deg);
content: "";
z-index: 1;
}
.project-card:hover::after {
height: 250%;
transition: all 600ms linear;
background-color: transparent;
}
.home1-project-section {
background-color: #000000;
overflow: hidden;
padding: 90px 0;
}
@media (max-width: 767px) {
.home1-project-section {
padding: 70px 0;
}
}
.home1-project-section .project-slider-area {
padding: 20px 25px;
border-top: 1px solid rgba(255, 255, 255, 0.2);
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
@media (max-width: 1699px) {
.home1-project-section .project-slider-area {
padding: 20px 15px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home1-project-section .project-slider-area {
padding: 20px 10px;
}
}
@media (max-width: 1399px) {
.home1-project-section .project-slider-area {
padding: 20px 10px;
}
}
@media (max-width: 576px) {
.home1-project-section .project-slider-area {
padding: 20px 0;
}
}
.home1-project-section .project-slider-area .project-card-wrap {
padding: 0 20px;
border-left: 1px solid rgba(255, 255, 255, 0.2);
}
@media (max-width: 1699px) {
.home1-project-section .project-slider-area .project-card-wrap {
padding: 0 15px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home1-project-section .project-slider-area .project-card-wrap {
padding: 0 10px;
}
}
@media (max-width: 1399px) {
.home1-project-section .project-slider-area .project-card-wrap {
padding: 0 10px;
}
}
@media (max-width: 767px) {
.home1-project-section .project-slider-area .project-card-wrap {
border-left: unset;
}
}
@media (max-width: 1699px) {
.home1-project-section .project-slider-area .project-card-wrap .project-card .project-content-wrap {
padding: 30px 15px;
}
}
@media (max-width: 1699px) {
.home1-project-section .project-slider-area .project-card-wrap .project-card .project-content-wrap .project-content h3 a {
font-size: 25px;
}
}
@media (max-width: 991px) {
.home1-project-section .project-slider-area .project-card-wrap .project-card .project-content-wrap .project-content h3 a {
font-size: 24px;
}
}
.home1-project-section .project-slider-area .home1-project-slider .swiper-slide:first-child .project-card-wrap {
border-left: unset;
}
.home1-project-section .project-slider-area .home1-project-slider .swiper-slide.swiper-slide-active .project-card-wrap {
border-left: unset;
} .home1-team-section .team-list {
padding: 0;
margin: 0;
list-style: none;
}
.home1-team-section .team-list .single-item {
display: flex;
align-items: center;
justify-content: space-between;
gap: 20px;
padding: 20px 0;
border-bottom: 1px solid rgba(var(--black-color-opc), 0.1);
}
@media (max-width: 767px) {
.home1-team-section .team-list .single-item {
padding: 15px 0;
}
}
@media (max-width: 576px) {
.home1-team-section .team-list .single-item {
flex-direction: column;
align-items: center;
}
}
.home1-team-section .team-list .single-item:first-child {
border-top: 1px solid rgba(var(--black-color-opc), 0.1);
}
.home1-team-section .team-list .single-item .team-name-and-desig span {
color: rgba(var(--title-color-opc), 0.6);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 16px;
line-height: 30px;
}
@media (max-width: 576px) {
.home1-team-section .team-list .single-item .team-name-and-desig span {
font-size: 15px;
}
}
.home1-team-section .team-list .single-item .team-name-and-desig h4 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 24px;
line-height: 30px;
margin-bottom: 0;
}
@media (max-width: 991px) {
.home1-team-section .team-list .single-item .team-name-and-desig h4 {
font-size: 22px;
}
}
@media (max-width: 576px) {
.home1-team-section .team-list .single-item .team-name-and-desig h4 {
font-size: 20px;
}
}
.home1-team-section .team-list .single-item .team-img img {
width: 100px;
height: 100px;
border-radius: 50%;
transition: 0.5s;
}
@media (max-width: 576px) {
.home1-team-section .team-list .single-item .team-img img {
width: 80px;
height: 80px;
}
}
.home1-team-section .team-list .single-item .social-area {
display: flex;
align-items: center;
}
.home1-team-section .team-list .single-item .social-area .icon {
width: 34px;
height: 34px;
border-radius: 50%;
border: 1px solid var(--black-color);
display: flex;
align-items: center;
justify-content: center;
transition: 0.5s;
}
.home1-team-section .team-list .single-item .social-area .icon span {
width: 20px;
height: 20px;
border-radius: 50%;
background-color: var(--black-color);
display: flex;
align-items: center;
justify-content: center;
transition: 0.5s;
}
.home1-team-section .team-list .single-item .social-area .icon span i {
color: var(--white-color);
font-size: 14px;
transition: 0.5s;
}
.home1-team-section .team-list .single-item .social-area .icon span i.bi-twitter-x {
font-size: 10px;
}
.home1-team-section .team-list .single-item .social-area > span {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 14px;
line-height: 1;
display: inline-flex;
justify-content: center;
padding: 9px 13px;
border-radius: 50px;
border: 1px solid var(--black-color);
position: relative;
transition: 0.5s;
min-width: 92px;
}
.home1-team-section .team-list .single-item .social-area > span::before {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
left: -1px;
width: 1px;
height: 32px;
background-color: var(--black-color);
transition: 0.5s;
}
.home1-team-section .team-list .single-item:hover .team-img img {
border-radius: 0;
transform: scale(1.66);
}
@media (max-width: 767px) {
.home1-team-section .team-list .single-item:hover .team-img img {
transform: scale(1.3);
}
}
.home1-team-section .team-list .single-item:hover .social-area .icon {
border-color: var(--primary-color1);
background-color: var(--primary-color1);
}
.home1-team-section .team-list .single-item:hover .social-area .icon span {
background-color: var(--white-color);
}
.home1-team-section .team-list .single-item:hover .social-area .icon span i {
color: var(--primary-color1);
}
.home1-team-section .team-list .single-item:hover .social-area > span {
background-color: var(--primary-color1);
border-color: var(--primary-color1);
color: var(--white-color);
}
.home1-team-section .team-list .single-item:hover .social-area > span::before {
background-color: var(--primary-color1);
} .home1-video-section {
position: relative;
}
.home1-video-section::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(var(--black-color-opc), 0.5);
}
.home1-video-section img {
min-height: 550px;
-o-object-fit: cover;
object-fit: cover;
}
@media (max-width: 576px) {
.home1-video-section img {
min-height: 500px;
}
}
.home1-video-section .play-btn {
cursor: pointer;
display: inline-block;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.home1-video-section .play-btn .icon {
position: relative;
}
.home1-video-section .play-btn .icon .video-circle {
stroke: var(--white-color);
fill: none;
transition: 0.5s;
}
@media (max-width: 576px) {
.home1-video-section .play-btn .icon .video-circle {
width: 65px;
}
}
.home1-video-section .play-btn .icon .video-circle .top-half {
stroke-dasharray: 430;
stroke-dashoffset: 320;
transition: stroke-dashoffset 0.8s cubic-bezier(0.33, 1, 0.68, 1);
}
.home1-video-section .play-btn .icon .play-icon {
fill: var(--white-color);
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
margin-left: 2px;
}
@media (max-width: 576px) {
.home1-video-section .play-btn .icon .play-icon {
width: 20px;
}
}
.home1-video-section .play-btn:hover .icon .video-circle .top-half {
stroke-dashoffset: 0;
}
.home1-counter-section {
position: relative;
z-index: 1;
margin-top: -100px;
}
.home1-counter-section .counter-wrap {
padding: 55px 60px 40px;
border: 1px solid rgba(var(--black-color-opc), 0.1);
background-color: var(--white-color);
border-radius: 20px;
}
@media (max-width: 1399px) {
.home1-counter-section .counter-wrap {
padding: 55px 50px 40px;
}
}
@media (max-width: 1199px) {
.home1-counter-section .counter-wrap {
padding: 50px 30px 40px;
}
}
@media (max-width: 767px) {
.home1-counter-section .counter-wrap {
padding: 45px 40px;
}
}
@media (max-width: 576px) {
.home1-counter-section .counter-wrap {
padding: 45px 30px;
border-radius: 15px;
}
}
.home1-counter-section .counter-wrap .divider {
position: relative;
}
.home1-counter-section .counter-wrap .divider::before {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 0px;
width: 2px;
height: 57px;
background-color: rgba(var(--primary-color1-opc), 0.2);
}
@media (max-width: 991px) {
.home1-counter-section .counter-wrap .divider::before {
display: none;
}
}
.home1-counter-section .counter-wrap .single-countdown .number {
display: flex;
align-items: center;
margin-bottom: 5px;
}
.home1-counter-section .counter-wrap .single-countdown .number h2,
.home1-counter-section .counter-wrap .single-countdown .number span {
-webkit-text-fill-color: transparent;
-webkit-text-stroke: 1px var(--title-color);
font-family: var(--font-dmsans);
letter-spacing: 0.08em;
font-size: 75px;
font-weight: 800;
line-height: 1;
margin-bottom: 0;
}
@media (max-width: 1399px) {
.home1-counter-section .counter-wrap .single-countdown .number h2,
.home1-counter-section .counter-wrap .single-countdown .number span {
font-size: 70px;
}
}
@media (max-width: 1199px) {
.home1-counter-section .counter-wrap .single-countdown .number h2,
.home1-counter-section .counter-wrap .single-countdown .number span {
font-size: 65px;
}
}
.home1-counter-section .counter-wrap .single-countdown span {
color: var(--text-color);
font-family: var(--font-manrope);
font-size: 15px;
font-weight: 600;
line-height: 1.5;
letter-spacing: 0.06em;
text-transform: uppercase;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home1-counter-section .counter-wrap .single-countdown span {
font-size: 13px;
}
}
@media (max-width: 991px) {
.home1-counter-section .counter-wrap .single-countdown span {
font-size: 14px;
}
} .home1-process-section .process-wrapper {
padding: 0 11%;
display: flex;
align-items: start;
gap: 30px;
}
@media (max-width: 1899px) {
.home1-process-section .process-wrapper {
padding: 0 9%;
}
}
@media (max-width: 1799px) {
.home1-process-section .process-wrapper {
padding: 0 8%;
}
}
@media (max-width: 1699px) {
.home1-process-section .process-wrapper {
padding: 0 6%;
gap: 25px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home1-process-section .process-wrapper {
padding: 0 3%;
gap: 20px;
}
}
@media (max-width: 1399px) {
.home1-process-section .process-wrapper {
padding: 0 1%;
gap: 15px;
}
}
@media (max-width: 1199px) {
.home1-process-section .process-wrapper {
gap: 24px;
}
}
@media (max-width: 991px) {
.home1-process-section .process-wrapper {
flex-wrap: wrap;
padding: 0 20px;
}
}
@media (max-width: 576px) {
.home1-process-section .process-wrapper {
padding: 0;
}
}
.home1-process-section .process-wrapper .mt-30 {
margin-top: 30px;
}
@media (max-width: 1199px) {
.home1-process-section .process-wrapper .mt-30 {
margin-top: 0;
}
}
.home1-process-section .process-wrapper .single-process {
display: flex;
gap: 30px;
}
@media (max-width: 1699px) {
.home1-process-section .process-wrapper .single-process {
gap: 25px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home1-process-section .process-wrapper .single-process {
gap: 20px;
}
}
@media (max-width: 1399px) {
.home1-process-section .process-wrapper .single-process {
gap: 15px;
}
}
.home1-process-section .process-wrapper .single-process .process-card {
background-color: #fbf8f4;
border: 1px solid rgba(var(--black-color-opc), 0.1);
padding: 45px 28px 35px;
border-radius: 15px;
max-width: 350px;
width: 100%;
position: relative;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home1-process-section .process-wrapper .single-process .process-card {
padding: 45px 20px 35px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home1-process-section .process-wrapper .single-process .process-card {
padding: 40px 14px 30px;
}
}
@media (max-width: 1199px) {
.home1-process-section .process-wrapper .single-process .process-card {
padding: 45px 20px 35px;
}
}
@media (max-width: 991px) {
.home1-process-section .process-wrapper .single-process .process-card {
max-width: 340px;
}
}
@media (max-width: 767px) {
.home1-process-section .process-wrapper .single-process .process-card {
max-width: unset;
}
}
@media (max-width: 576px) {
.home1-process-section .process-wrapper .single-process .process-card {
padding: 40px 20px 30px;
}
}
.home1-process-section .process-wrapper .single-process .process-card .vector {
fill: var(--white-color);
position: absolute;
top: -1px;
right: -1px;
}
.home1-process-section .process-wrapper .single-process .process-card .step-no {
display: inline-flex;
justify-content: center;
align-items: center;
margin-bottom: 40px;
background-color: var(--white-color);
border: 1px solid rgba(var(--black-color-opc), 0.3);
border-radius: 50px;
padding: 7px 22px;
white-space: nowrap;
position: relative;
transition: 0.5s;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home1-process-section .process-wrapper .single-process .process-card .step-no {
margin-bottom: 35px;
}
}
@media (max-width: 576px) {
.home1-process-section .process-wrapper .single-process .process-card .step-no {
margin-bottom: 30px;
}
}
.home1-process-section .process-wrapper .single-process .process-card .step-no::before {
content: "";
position: absolute;
bottom: -8px;
left: 50%;
transform: translateX(-50%) rotate(45deg);
width: 15px;
height: 15px;
background-color: var(--white-color);
border: 1px solid rgba(var(--black-color-opc), 0.3);
border-radius: 0 0 4px 0;
border-top: unset;
border-left: unset;
transition: 0.5s;
}
.home1-process-section .process-wrapper .single-process .process-card .step-no span {
color: var(--primary-color1);
font-family: var(--font-dmsans);
font-size: 13px;
font-weight: 500;
line-height: 1;
letter-spacing: 0.51px;
transition: 0.5s;
}
.home1-process-section .process-wrapper .single-process .process-card h3 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 700;
font-size: 24px;
line-height: 28px;
margin-bottom: 25px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home1-process-section .process-wrapper .single-process .process-card h3 {
font-size: 22px;
margin-bottom: 20px;
}
}
@media (max-width: 576px) {
.home1-process-section .process-wrapper .single-process .process-card h3 {
font-size: 22px;
margin-bottom: 20px;
}
}
.home1-process-section .process-wrapper .single-process .process-card p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 16px;
line-height: 26px;
margin-bottom: 0;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home1-process-section .process-wrapper .single-process .process-card p {
font-size: 15px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home1-process-section .process-wrapper .single-process .process-card p {
font-size: 15px;
}
}
.home1-process-section .process-wrapper .single-process .animated-vector {
margin-top: 45px;
min-width: 185px;
}
@media (max-width: 1799px) {
.home1-process-section .process-wrapper .single-process .animated-vector {
min-width: 165px;
}
}
@media (max-width: 1399px) {
.home1-process-section .process-wrapper .single-process .animated-vector {
min-width: 130px;
}
}
@media (max-width: 1199px) {
.home1-process-section .process-wrapper .single-process .animated-vector {
display: none;
}
} .testimonial-card {
background-color: var(--white-color);
padding: 40px 35px 25px;
text-align: center;
clip-path: polygon(78% 0, 100% 18%, 100% 100%, 0 100%, 0 0);
}
@media (min-width: 1400px) and (max-width: 1599px) {
.testimonial-card {
padding: 40px 30px 25px;
}
}
@media (max-width: 1399px) {
.testimonial-card {
padding: 40px 30px 25px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.testimonial-card {
padding: 40px 20px 25px;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.testimonial-card {
padding: 35px 20px 20px;
}
}
@media (max-width: 767px) {
.testimonial-card {
padding: 40px 25px 25px;
}
}
@media (max-width: 576px) {
.testimonial-card {
padding: 40px 18px 25px;
clip-path: polygon(72% 0, 100% 13%, 100% 100%, 0 100%, 0 0);
}
}
.testimonial-card .quote {
fill: rgba(var(--title-color-opc), 0.2);
margin-bottom: 25px;
}
.testimonial-card > span {
color: var(--primary-color1);
font-family: var(--font-manrope);
font-weight: 500;
font-size: 16px;
line-height: 1.5;
letter-spacing: 0.05em;
text-transform: uppercase;
margin-bottom: 20px;
display: block;
}
@media (min-width: 768px) and (max-width: 991px) {
.testimonial-card > span {
font-size: 15px;
}
}
@media (max-width: 576px) {
.testimonial-card > span {
font-size: 15px;
margin-bottom: 15px;
}
}
.testimonial-card p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-weight: 500;
font-size: 18px;
line-height: 40px;
margin-bottom: 30px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.testimonial-card p {
font-size: 17px;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.testimonial-card p {
font-size: 16px;
line-height: 38px;
margin-bottom: 25px;
}
}
@media (max-width: 576px) {
.testimonial-card p {
font-size: 17px;
margin-bottom: 25px;
}
}
.testimonial-card .author-area {
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
padding-top: 25px;
border-top: 1px solid rgba(var(--black-color-opc), 0.1);
}
@media (max-width: 767px) {
.testimonial-card .author-area {
padding-top: 20px;
}
}
@media (max-width: 576px) {
.testimonial-card .author-area {
padding-top: 15px;
}
}
.testimonial-card .author-area .author-img img {
min-width: 50px;
max-width: 50px;
height: 50px;
border-radius: 50%;
}
.testimonial-card .author-area .author-content {
text-align: start;
}
.testimonial-card .author-area .author-content h5 {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 19px;
font-weight: 600;
line-height: 1.3;
letter-spacing: 0.03em;
margin-bottom: 2px;
}
.testimonial-card .author-area .author-content span {
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 15px;
font-weight: 400;
line-height: 1;
letter-spacing: 0.03em;
}
.testimonial-card.two {
clip-path: unset;
border-radius: 30px;
text-align: left;
padding: 60px 35px;
}
@media (max-width: 1399px) {
.testimonial-card.two {
padding: 60px 30px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.testimonial-card.two {
padding: 45px 25px;
}
}
@media (max-width: 576px) {
.testimonial-card.two {
padding: 45px 20px;
border-radius: 15px;
}
}
.testimonial-card.two .quote {
margin-bottom: 30px;
}
@media (max-width: 576px) {
.testimonial-card.two .quote {
margin-bottom: 25px;
}
}
.testimonial-card.two > span {
color: var(--primary-color2);
}
.testimonial-card.two P {
font-size: 20px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.testimonial-card.two P {
font-size: 18px;
margin-bottom: 25px;
}
}
@media (max-width: 576px) {
.testimonial-card.two P {
font-size: 18px;
margin-bottom: 20px;
}
}
.testimonial-card.two .arrow-down {
fill: rgba(var(--primary-color2-opc), 0.2);
margin-left: 26px;
}
.testimonial-card.two .author-area {
border-top: unset;
justify-content: start;
padding-top: 40px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.testimonial-card.two .author-area {
padding-top: 30px;
}
}
@media (max-width: 576px) {
.testimonial-card.two .author-area {
padding-top: 30px;
}
}
.testimonial-card.three {
background-color: #fbf8f4;
border: 1px solid rgba(var(--black-color-opc), 0.03);
clip-path: unset;
text-align: left;
position: relative;
border-radius: 20px 5px 20px 20px;
padding: 40px 30px 25px;
}
@media (max-width: 1899px) {
.testimonial-card.three {
padding: 40px 25px 25px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.testimonial-card.three {
padding: 40px 22px 25px;
}
}
@media (max-width: 1399px) {
.testimonial-card.three {
padding: 40px 20px 25px;
}
}
.testimonial-card.three .quote {
fill: rgba(var(--title-color-opc), 0.05);
position: absolute;
top: 10px;
right: 24px;
}
.testimonial-card.three > span {
color: var(--primary-color2);
}
@media (min-width: 1400px) and (max-width: 1599px) {
.testimonial-card.three p {
font-size: 17px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.testimonial-card.three .author-area {
gap: 8px;
}
}
@media (max-width: 991px) {
.testimonial-card.three .author-area {
gap: 8px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.testimonial-card.three .author-area .author-content h5 {
font-size: 18px;
}
}
@media (max-width: 991px) {
.testimonial-card.three .author-area .author-content h5 {
font-size: 18px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.testimonial-card.three .author-area .author-content span {
font-size: 14px;
}
}
@media (max-width: 991px) {
.testimonial-card.three .author-area .author-content span {
font-size: 14px;
}
}
.testimonial-card.three .author-and-social-area {
display: flex;
align-items: center;
justify-content: space-between;
padding-top: 25px;
border-top: 1px solid rgba(var(--black-color-opc), 0.05);
}
@media (max-width: 767px) {
.testimonial-card.three .author-and-social-area {
padding-top: 20px;
}
}
@media (max-width: 576px) {
.testimonial-card.three .author-and-social-area {
padding-top: 15px;
}
}
.testimonial-card.three .author-and-social-area .author-area {
border: unset;
padding-top: 0;
}
.testimonial-card.three .author-and-social-area .social-area {
width: 49px;
height: 49px;
border-radius: 50%;
border: 1px solid rgba(var(--black-color-opc), 0.1);
display: flex;
align-items: center;
justify-content: center;
}
.testimonial-card.three .author-and-social-area .social-area a {
width: 33px;
height: 33px;
border-radius: 50%;
background-color: rgba(var(--black-color-opc), 0.7);
display: flex;
align-items: center;
justify-content: center;
line-height: 1;
transition: 0.5s;
}
.testimonial-card.three .author-and-social-area .social-area a i {
color: var(--white-color);
font-size: 20px;
line-height: 1;
margin-bottom: 2px;
transition: 0.5s;
}
.testimonial-card.three .author-and-social-area .social-area a i.bi-twitter-x {
font-size: 18px;
}
.testimonial-card.three .author-and-social-area .social-area a:hover {
background-color: var(--primary-color2);
}
.testimonial-card.three .author-and-social-area .social-area a:hover i {
color: var(--white-color);
}
.home1-testimonial-section {
background-color: #ebefe0;
padding: 110px 10%;
}
@media (max-width: 1799px) {
.home1-testimonial-section {
padding: 110px 7%;
}
}
@media (max-width: 1699px) {
.home1-testimonial-section {
padding: 110px 6%;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home1-testimonial-section {
padding: 110px 3%;
}
}
@media (max-width: 1399px) {
.home1-testimonial-section {
padding: 110px 2%;
}
}
@media (max-width: 1199px) {
.home1-testimonial-section {
padding: 90px 2%;
}
}
@media (max-width: 767px) {
.home1-testimonial-section {
padding: 70px 10px;
}
}
@media (max-width: 576px) {
.home1-testimonial-section {
padding: 70px 0px;
}
}
.home1-testimonial-section .testimonial-title-area .section-title p {
padding-top: 40px;
}
@media (max-width: 1199px) {
.home1-testimonial-section .testimonial-title-area .section-title p {
padding-top: 25px;
}
}
.home1-testimonial-section .testimonial-title-area .rating-list {
padding: 0;
margin: 0;
list-style: none;
padding-top: 100px;
display: flex;
align-items: center;
gap: 16px;
flex-wrap: wrap;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home1-testimonial-section .testimonial-title-area .rating-list {
gap: 8px;
padding-top: 90px;
}
}
@media (max-width: 1199px) {
.home1-testimonial-section .testimonial-title-area .rating-list {
padding-top: 30px;
}
}
.home1-testimonial-section .testimonial-title-area .rating-list li .single-rating {
padding: 14px 19px;
background-color: var(--white-color);
border: 1px solid rgba(var(--black-color-opc), 0.1);
border-radius: 10px;
display: flex;
gap: 8px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home1-testimonial-section .testimonial-title-area .rating-list li .single-rating {
padding: 13px 12px;
}
}
.home1-testimonial-section .testimonial-title-area .rating-list li .single-rating .review {
line-height: 1;
}
.home1-testimonial-section .testimonial-title-area .rating-list li .single-rating .review span {
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 14px;
font-weight: 600;
line-height: 1;
margin-bottom: 8px;
display: block;
white-space: nowrap;
}
@media (max-width: 1699px) {
.home1-testimonial-section .testimonial-title-area .rating-list li .single-rating .review span {
font-size: 13px;
}
}
.home1-testimonial-section .testimonial-title-area .rating-list li .single-rating .review img {
width: 64px;
}
.home1-testimonial-section .testimonial-title-area .rating-list li .single-rating .rating {
line-height: 1;
margin-top: -1px;
}
.home1-testimonial-section .testimonial-title-area .rating-list li .single-rating .rating .star {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
gap: 4px;
margin-bottom: 9px;
line-height: 1;
}
.home1-testimonial-section .testimonial-title-area .rating-list li .single-rating .rating .star li i {
color: #e62415;
font-size: 12px;
}
.home1-testimonial-section .testimonial-title-area .rating-list li .single-rating .rating span {
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 14px;
font-weight: 400;
line-height: 1;
white-space: nowrap;
}
@media (max-width: 1699px) {
.home1-testimonial-section .testimonial-title-area .rating-list li .single-rating .rating span {
font-size: 13px;
}
}
.home1-testimonial-section .testimonial-title-area .rating-list li .single-rating.google .rating .star li i {
color: #ffc107;
}
.home1-testimonial-section .slider-btn-grp {
justify-content: center;
margin-top: 45px;
}
@media (max-width: 576px) {
.home1-testimonial-section .slider-btn-grp {
margin-top: 30px;
}
} .faq-wrap .accordion .accordion-item {
border: none;
background-color: transparent;
}
.faq-wrap .accordion .accordion-item:first-child .accordion-header .accordion-button {
padding-top: 0;
}
.faq-wrap .accordion .accordion-item .accordion-header .accordion-button {
border: none;
border-radius: unset;
box-shadow: none;
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 16px;
font-weight: 600;
line-height: 1.4;
text-transform: capitalize;
padding: 0;
padding-bottom: 20px;
padding-top: 35px;
background-color: transparent;
border-bottom: 1px solid rgba(var(--black-color-opc), 0.1);
}
@media (max-width: 1199px) {
.faq-wrap .accordion .accordion-item .accordion-header .accordion-button {
padding-top: 25px;
padding-bottom: 15px;
}
}
.faq-wrap .accordion .accordion-item .accordion-header .accordion-button::after {
width: unset;
height: unset;
content: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home1/icon/faq-accordion-arrow-down.svg);
font-family: bootstrap-icons;
background-image: none;
font-weight: 800;
font-size: 17px;
}
.faq-wrap .accordion .accordion-item .accordion-header .accordion-button:not(.collapsed) {
background-color: unset;
}
.faq-wrap .accordion .accordion-item .accordion-header .accordion-button:not(.collapsed)::after {
content: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home1/icon/faq-accordion-arrow-up.svg);
transform: unset;
}
@media (max-width: 576px) {
.faq-wrap .accordion .accordion-item .accordion-header .accordion-button {
font-size: 15px;
}
}
.faq-wrap .accordion .accordion-item .accordion-body {
padding: 20px;
padding-bottom: 10px;
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 16px;
font-weight: 400;
line-height: 1.8;
}
@media (max-width: 576px) {
.faq-wrap .accordion .accordion-item .accordion-body {
font-size: 15px;
padding: 15px;
padding-bottom: 5px;
}
}
.faq-wrap.two .accordion .accordion-item .accordion-header .accordion-button {
color: var(--title-color2);
}
.faq-wrap.two .accordion .accordion-item .accordion-header .accordion-button::after {
content: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home5/icon/faq-accordion-arrow-down.svg);
}
.faq-wrap.two .accordion .accordion-item .accordion-header .accordion-button:not(.collapsed)::after {
content: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home5/icon/faq-accordion-arrow-up.svg);
}
.faq-wrap.two .accordion .accordion-item .accordion-body {
color: rgba(var(--title-color2-opc), 0.7);
}
.home1-faq-section .faq-img img {
border-radius: 210px;
} .home1-map-section {
display: grid;
grid-template-columns: 30% 70%;
overflow: hidden;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home1-map-section {
grid-template-columns: 33% 67%;
}
}
@media (max-width: 1399px) {
.home1-map-section {
grid-template-columns: 35% 65%;
}
}
@media (max-width: 991px) {
.home1-map-section {
display: block;
}
}
.home1-map-section .address-wrapper {
background-color: #d9dff5;
padding: 30px 0 85px;
height: 100%;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home1-map-section .address-wrapper {
padding: 25px 0 75px;
}
}
@media (max-width: 1399px) {
.home1-map-section .address-wrapper {
padding: 25px 0 65px;
}
}
@media (max-width: 991px) {
.home1-map-section .address-wrapper {
padding: 30px 0 40px;
}
}
.home1-map-section .address-wrapper h2 {
color: rgba(var(--title-color-opc), 0.05);
font-family: var(--font-manrope);
font-weight: 700;
font-size: 43px;
line-height: 1.2;
text-align: center;
text-transform: uppercase;
margin-bottom: 50px;
}
@media (max-width: 1799px) {
.home1-map-section .address-wrapper h2 {
font-size: 39px;
}
}
@media (max-width: 1699px) {
.home1-map-section .address-wrapper h2 {
font-size: 37px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home1-map-section .address-wrapper h2 {
font-size: 35px;
}
}
@media (max-width: 1399px) {
.home1-map-section .address-wrapper h2 {
font-size: 33px;
margin-bottom: 40px;
}
}
.home1-map-section .address-wrapper .address-area {
padding: 0 38px 0 155px;
}
@media (max-width: 1699px) {
.home1-map-section .address-wrapper .address-area {
padding: 0 38px 0 110px;
}
}
@media (max-width: 1399px) {
.home1-map-section .address-wrapper .address-area {
padding: 0 38px 0 70px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home1-map-section .address-wrapper .address-area {
padding: 0 20px 0 50px;
}
}
@media (max-width: 991px) {
.home1-map-section .address-wrapper .address-area {
padding: 0 50px;
}
}
@media (max-width: 767px) {
.home1-map-section .address-wrapper .address-area {
padding: 0 20px;
}
}
@media (max-width: 576px) {
.home1-map-section .address-wrapper .address-area {
flex-wrap: wrap;
}
}
.home1-map-section .address-wrapper .address-area .address-list {
padding: 0;
margin: 0;
list-style: none;
margin-bottom: 20px;
}
@media (max-width: 991px) {
.home1-map-section .address-wrapper .address-area .address-list {
display: flex;
align-items: center;
gap: 40px;
}
}
@media (max-width: 767px) {
.home1-map-section .address-wrapper .address-area .address-list {
margin-bottom: 15px;
}
}
@media (max-width: 576px) {
.home1-map-section .address-wrapper .address-area .address-list {
gap: 30px;
flex-wrap: wrap;
}
}
.home1-map-section .address-wrapper .address-area .address-list .single-address {
padding-bottom: 35px;
position: relative;
margin-bottom: 40px;
display: flex;
align-items: center;
justify-content: space-between;
}
.home1-map-section .address-wrapper .address-area .address-list .single-address:last-child {
margin-bottom: 0;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home1-map-section .address-wrapper .address-area .address-list .single-address {
padding-bottom: 30px;
margin-bottom: 35px;
}
}
@media (max-width: 1399px) {
.home1-map-section .address-wrapper .address-area .address-list .single-address {
padding-bottom: 25px;
margin-bottom: 30px;
}
}
@media (max-width: 991px) {
.home1-map-section .address-wrapper .address-area .address-list .single-address {
margin-bottom: 0;
padding-bottom: 0;
}
}
.home1-map-section .address-wrapper .address-area .address-list .single-address::before {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 370px;
height: 1px;
background-color: rgba(var(--primary-color1-opc), 0.1);
}
@media (max-width: 1699px) {
.home1-map-section .address-wrapper .address-area .address-list .single-address::before {
width: 310px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home1-map-section .address-wrapper .address-area .address-list .single-address::before {
width: 250px;
}
}
@media (max-width: 991px) {
.home1-map-section .address-wrapper .address-area .address-list .single-address::before {
display: none;
}
}
.home1-map-section .address-wrapper .address-area .address-list .single-address .content {
max-width: 230px;
width: 100%;
}
.home1-map-section .address-wrapper .address-area .address-list .single-address .content span {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 14px;
font-weight: 400;
line-height: 1;
letter-spacing: 0.06em;
text-decoration: underline;
display: block;
margin-bottom: 15px;
transition: 0.5s;
}
@media (max-width: 767px) {
.home1-map-section .address-wrapper .address-area .address-list .single-address .content span {
margin-bottom: 15px;
}
}
.home1-map-section .address-wrapper .address-area .address-list .single-address .content a {
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 17px;
font-weight: 400;
line-height: 28px;
margin-bottom: 0;
transition: 0.5s;
}
.home1-map-section .address-wrapper .address-area .address-list .single-address .vector {
fill: rgba(var(--primary-color1-opc), 0.3);
transition: 0.5s;
opacity: 0;
}
@media (max-width: 991px) {
.home1-map-section .address-wrapper .address-area .address-list .single-address .vector {
display: none;
}
}
.home1-map-section .address-wrapper .address-area .address-list .single-address:hover .content span {
color: var(--primary-color1);
}
.home1-map-section .address-wrapper .address-area .address-list .single-address:hover .content a {
color: rgba(var(--primary-color1-opc), 0.6);
}
.home1-map-section .address-wrapper .address-area .address-list .single-address:hover .vector {
opacity: 1;
}
.home1-map-section .address-wrapper .address-area .location-btn {
color: var(--primary-color1);
font-family: var(--font-manrope);
font-weight: 400;
font-size: 14px;
line-height: 1;
text-transform: uppercase;
letter-spacing: 0.05em;
position: relative;
background: linear-gradient(to bottom, var(--primary-color1) 0%, var(--primary-color1) 98%);
background-repeat: no-repeat;
background-size: 100% 1px;
background-position: left 100%;
transition: background-size 0.75s;
}
.home1-map-section .address-wrapper .address-area .location-btn:hover {
background-size: 0 1px;
background-position: 0% 100%;
}
.home1-map-section .map-list {
padding: 0;
margin: 0;
list-style: none;
position: relative;
}
@media (max-width: 991px) {
.home1-map-section .map-list {
min-height: 500px;
}
}
.home1-map-section .map-list li {
height: 100%;
}
.home1-map-section .map-list li iframe {
width: 100%;
height: 100%;
min-height: 718px;
filter: invert(1) hue-rotate(180deg) brightness(0.7) grayscale(1);
position: absolute;
top: 0;
left: 0;
opacity: 0;
visibility: hidden;
transition: all 0.3s ease-in-out;
}
@media (max-width: 1799px) {
.home1-map-section .map-list li iframe {
min-height: 680px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home1-map-section .map-list li iframe {
min-height: 650px;
}
}
@media (max-width: 1399px) {
.home1-map-section .map-list li iframe {
min-height: 550px;
}
}
@media (max-width: 991px) {
.home1-map-section .map-list li iframe {
min-height: 500px;
}
}
@media (max-width: 576px) {
.home1-map-section .map-list li iframe {
min-height: 450px;
}
}
.home1-map-section .map-list li.active iframe {
opacity: 1;
visibility: visible;
} .blog-card .blog-img-wrap {
position: relative;
}
.blog-card .blog-img-wrap .blog-img {
position: relative;
overflow: hidden;
display: block;
transition: all 0.5s ease-out;
}
.blog-card .blog-img-wrap .blog-img img {
transition: all 0.5s ease-out;
min-height: 350px;
-o-object-fit: cover;
object-fit: cover;
}
.blog-card .blog-img-wrap .blog-img::after {
position: absolute;
width: 200%;
height: 0%;
left: 50%;
top: 50%;
background-color: rgba(255, 255, 255, 0.3);
transform: translate(-50%, -50%) rotate(-45deg);
content: "";
z-index: 1;
}
.blog-card .blog-meta {
position: absolute;
bottom: -1px;
left: -1px;
z-index: 9;
padding: 10px 15px;
background-color: var(--white-color);
}
.blog-card .blog-meta ul {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
gap: 25px;
line-height: 1;
}
.blog-card .blog-meta ul li {
position: relative;
}
.blog-card .blog-meta ul li::before {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
right: -12px;
width: 1px;
height: 12px;
background-color: rgba(var(--black-color-opc), 0.2);
}
.blog-card .blog-meta ul li:last-child::before {
display: none;
}
.blog-card .blog-meta ul li a {
color: rgba(var(--title-color-opc), 0.5);
font-family: var(--font-dmsans);
font-size: 13px;
font-weight: 500;
line-height: 1;
letter-spacing: 0.03em;
text-transform: uppercase;
transition: 0.5s;
}
.blog-card .blog-meta ul li a:hover {
color: var(--primary-color1);
}
@media (max-width: 576px) {
.blog-card .blog-meta ul li a {
font-size: 12px;
}
}
.blog-card .blog-meta ul li a.blog-date {
color: rgba(var(--primary-color1-opc), 0.7);
text-decoration: underline;
text-underline-offset: 3px;
}
.blog-card .blog-meta ul li a.blog-date:hover {
color: var(--primary-color1);
}
.blog-card .blog-content {
padding-top: 20px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.blog-card .blog-content {
padding-top: 15px;
}
}
@media (max-width: 576px) {
.blog-card .blog-content {
padding-top: 15px;
}
}
.blog-card .blog-content h5 {
margin-bottom: 15px;
}
@media (max-width: 576px) {
.blog-card .blog-content h5 {
margin-bottom: 10px;
}
}
.blog-card .blog-content h5 a {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 23px;
line-height: 1.6;
transition: 0.5s;
}
@media (max-width: 1399px) {
.blog-card .blog-content h5 a {
font-size: 22px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.blog-card .blog-content h5 a {
font-size: 19px;
}
}
@media (max-width: 991px) {
.blog-card .blog-content h5 a {
font-size: 21px;
}
}
.blog-card .blog-content h5 a:hover {
color: var(--primary-color1);
}
.blog-card .read-btn {
color: var(--text-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
line-height: 1;
text-transform: uppercase;
display: inline-flex;
align-items: center;
gap: 6px;
transition: 0.5s;
}
.blog-card .read-btn span {
background: linear-gradient(to bottom, var(--text-color) 0%, var(--text-color) 98%);
background-repeat: no-repeat;
background-size: 100% 1px;
background-position: left 100%;
transition: background-size 0.75s;
}
.blog-card .read-btn svg {
fill: rgba(var(--title-color-opc), 0.3);
transition: 0.5s;
}
.blog-card .read-btn:hover {
color: var(--primary-color1);
}
.blog-card .read-btn:hover span {
background-size: 0 1px;
background-position: 0% 100%;
}
.blog-card .read-btn:hover svg {
fill: var(--primary-color1);
transform: translateX(3px);
}
.blog-card:hover .blog-img::after {
height: 250%;
transition: all 600ms linear;
background-color: transparent;
}
.blog-card:hover .blog-img img {
transform: scale(1.1);
}
.blog-card.two .blog-img-wrap .blog-tag {
position: absolute;
top: 15px;
left: 15px;
z-index: 1;
}
.blog-card.two .blog-img-wrap .blog-tag a {
color: var(--white-color);
font-family: var(--font-dmsans);
font-weight: 600;
font-size: 13px;
line-height: 1;
text-transform: uppercase;
padding: 7px 17px;
border-radius: 100px;
background-color: rgba(var(--black-color-opc), 0.3);
-webkit-backdrop-filter: blur(9px);
backdrop-filter: blur(9px);
transition: 0.5s;
}
.blog-card.two .blog-img-wrap .blog-tag a:hover {
background-color: var(--primary-color2);
}
.blog-card.two .blog-meta {
position: relative;
bottom: unset;
left: unset;
padding: 0;
margin-bottom: 20px;
}
@media (max-width: 767px) {
.blog-card.two .blog-meta {
margin-bottom: 15px;
}
}
.blog-card.two .blog-meta ul {
line-height: unset;
}
.blog-card.two .blog-meta ul li span {
color: rgba(var(--title-color-opc), 0.5);
font-family: var(--font-dmsans);
font-size: 13px;
font-weight: 500;
line-height: 1;
letter-spacing: 0.03em;
text-transform: uppercase;
padding: 7px 15px;
border-radius: 100px;
background-color: rgba(var(--black-color-opc), 0.08);
}
@media (max-width: 576px) {
.blog-card.two .blog-meta ul li span {
font-size: 12px;
}
}
.blog-card.two .blog-meta ul li a.blog-date {
padding: 7px 15px;
border-radius: 100px;
background-color: rgba(var(--primary-color2-opc), 0.08);
color: rgba(var(--primary-color2-opc), 0.7);
}
.blog-card.two .blog-meta ul li a.blog-date:hover {
color: var(--primary-color2);
}
.blog-card.two .blog-content {
padding: 25px 30px 0;
}
@media (max-width: 1399px) {
.blog-card.two .blog-content {
padding: 25px 25px 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.blog-card.two .blog-content {
padding: 20px 10px 0;
}
}
@media (max-width: 767px) {
.blog-card.two .blog-content {
padding: 20px 20px 0;
}
}
@media (max-width: 576px) {
.blog-card.two .blog-content {
padding: 20px 10px 0;
}
}
@media (max-width: 991px) {
.blog-card.two .blog-content h5 {
margin-bottom: 20px;
}
}
.blog-card.two .blog-content h5 a {
font-size: 28px;
line-height: 1.4;
}
@media (max-width: 1399px) {
.blog-card.two .blog-content h5 a {
font-size: 26px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.blog-card.two .blog-content h5 a {
font-size: 23px;
}
}
@media (max-width: 767px) {
.blog-card.two .blog-content h5 a {
font-size: 24px;
}
}
@media (max-width: 576px) {
.blog-card.two .blog-content h5 a {
font-size: 18px;
}
}
.blog-card.two .blog-content h5 a:hover {
color: var(--primary-color2);
}
.blog-card.two .blog-content .read-btn:hover {
color: var(--primary-color2);
}
.blog-card.two .blog-content .read-btn:hover svg {
fill: var(--primary-color2);
}
.blog-card.three .blog-img-wrap .blog-img {
border-radius: 10px;
}
.blog-card.three .blog-img-wrap .blog-img img {
min-height: 300px;
border-radius: 10px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.blog-card.three .blog-img-wrap .blog-img img {
min-height: 250px;
}
}
@media (max-width: 767px) {
.blog-card.three .blog-img-wrap .blog-img img {
max-height: 300px;
width: 100%;
}
}
.blog-card.three .blog-img-wrap .blog-date {
color: var(--primary-color2);
font-family: var(--font-dmsans);
font-weight: 500;
font-size: 14px;
line-height: 1;
padding: 13px 32px 9px;
text-transform: uppercase;
-webkit-mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home3/blog-date-bg.png);
mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home3/blog-date-bg.png);
-webkit-mask-size: cover;
mask-size: cover;
min-width: 174px;
background-color: var(--white-color);
position: absolute;
bottom: 0;
left: 0;
z-index: 1;
}
.blog-card.three .blog-content {
padding-top: 30px;
}
@media (max-width: 1399px) {
.blog-card.three .blog-content {
padding-top: 25px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.blog-card.three .blog-content {
padding-top: 15px;
}
}
@media (max-width: 767px) {
.blog-card.three .blog-content {
padding-top: 20px;
}
}
.blog-card.three .blog-content h5 {
margin-bottom: 20px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.blog-card.three .blog-content h5 {
margin-bottom: 10px;
}
}
@media (max-width: 767px) {
.blog-card.three .blog-content h5 {
margin-bottom: 15px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.blog-card.three .blog-content h5 a {
font-size: 21px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.blog-card.three .blog-content h5 a {
font-size: 17px;
}
}
@media (max-width: 576px) {
.blog-card.three .blog-content h5 a {
font-size: 20px;
}
}
.blog-card.three .blog-content h5 a:hover {
color: var(--primary-color2);
}
.blog-card.three .blog-content .read-btn:hover {
color: var(--primary-color2);
}
.blog-card.three .blog-content .read-btn:hover svg {
fill: var(--primary-color2);
}
.blog-card.four {
display: grid;
grid-template-columns: 49% 51%;
border: 1px solid rgba(var(--primary-color4-opc), 0.15);
border-radius: 10px;
}
@media (max-width: 576px) {
.blog-card.four {
display: block;
}
}
.blog-card.four .blog-img-wrap .blog-img {
height: 100%;
border-radius: 10px 0 0 10px;
}
@media (max-width: 576px) {
.blog-card.four .blog-img-wrap .blog-img {
border-radius: 10px 10px 0 0;
}
}
.blog-card.four .blog-img-wrap .blog-img img {
height: 100%;
-o-object-fit: cover;
object-fit: cover;
border-radius: 10px 0 0 10px;
min-height: 250px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.blog-card.four .blog-img-wrap .blog-img img {
min-height: 220px;
}
}
@media (min-width: 576px) and (max-width: 768px) {
.blog-card.four .blog-img-wrap .blog-img img {
min-height: 215px;
}
}
@media (max-width: 576px) {
.blog-card.four .blog-img-wrap .blog-img img {
border-radius: 10px 10px 0 0;
}
}
.blog-card.four .blog-meta {
position: relative;
bottom: unset;
left: unset;
padding: 0;
background-color: transparent;
margin-bottom: 10px;
}
.blog-card.four .blog-meta ul {
line-height: unset;
}
.blog-card.four .blog-meta ul li a:hover {
color: var(--primary-color3);
}
.blog-card.four .blog-meta ul li a.blog-date {
color: var(--primary-color3);
}
.blog-card.four .blog-content-wrap {
padding: 35px 24px;
display: flex;
flex-direction: column;
justify-content: space-between;
gap: 20px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.blog-card.four .blog-content-wrap {
padding: 30px 15px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.blog-card.four .blog-content-wrap {
padding: 25px 20px;
}
}
@media (max-width: 767px) {
.blog-card.four .blog-content-wrap {
padding: 25px 15px;
}
}
@media (max-width: 576px) {
.blog-card.four .blog-content-wrap {
padding: 20px 15px;
}
}
.blog-card.four .blog-content {
padding: 0;
}
@media (max-width: 991px) {
.blog-card.four .blog-content h5 {
margin-bottom: 20px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.blog-card.four .blog-content h5 a {
font-size: 21px;
}
}
@media (min-width: 576px) and (max-width: 768px) {
.blog-card.four .blog-content h5 a {
font-size: 19px;
}
}
.blog-card.four .blog-content h5 a:hover {
color: var(--primary-color3);
}
.blog-card.four .read-btn:hover {
color: var(--primary-color3);
}
.blog-card.four .read-btn:hover svg {
fill: var(--primary-color3);
}
.blog-card.blog-st {
margin-bottom: 80px;
}
.blog-card.blog-st:last-child {
margin-bottom: 0;
}
.blog-card.blog-st .blog-img-wrap .blog-tag {
position: absolute;
top: 15px;
left: 15px;
z-index: 1;
}
.blog-card.blog-st .blog-img-wrap .blog-tag a {
color: var(--white-color);
font-family: var(--font-dmsans);
font-weight: 600;
font-size: 13px;
line-height: 1;
text-transform: uppercase;
padding: 7px 17px;
border-radius: 100px;
background-color: rgba(var(--black-color-opc), 0.3);
-webkit-backdrop-filter: blur(9px);
backdrop-filter: blur(9px);
transition: 0.5s;
}
.blog-card.blog-st .blog-img-wrap .blog-tag a:hover {
background-color: var(--primary-color1);
}
@media (max-width: 991px) {
.blog-card.blog-st .blog-img-wrap .blog-img img {
min-height: 320px;
-o-object-fit: cover;
object-fit: cover;
}
}
.blog-card.blog-st .blog-meta {
position: relative;
bottom: unset;
left: unset;
padding: 0;
margin-bottom: 20px;
}
@media (max-width: 767px) {
.blog-card.blog-st .blog-meta {
margin-bottom: 15px;
}
}
.blog-card.blog-st .blog-meta ul {
line-height: unset;
}
.blog-card.blog-st .blog-meta ul li span {
color: rgba(var(--title-color-opc), 0.5);
font-family: var(--font-dmsans);
font-size: 13px;
font-weight: 500;
line-height: 1;
letter-spacing: 0.03em;
text-transform: uppercase;
padding: 7px 15px;
border-radius: 100px;
background-color: rgba(var(--black-color-opc), 0.08);
}
@media (max-width: 576px) {
.blog-card.blog-st .blog-meta ul li span {
font-size: 12px;
}
}
.blog-card.blog-st .blog-meta ul li a.blog-date {
padding: 7px 15px;
border-radius: 100px;
background-color: rgba(var(--primary-color1-opc), 0.08);
color: rgba(var(--primary-color1-opc), 0.7);
}
.blog-card.blog-st .blog-meta ul li a.blog-date:hover {
color: var(--primary-color1);
}
.blog-card.blog-st .blog-content {
padding: 35px 110px 0 80px;
}
@media (max-width: 1199px) {
.blog-card.blog-st .blog-content {
padding: 30px 60px 0 50px;
}
}
@media (max-width: 991px) {
.blog-card.blog-st .blog-content {
padding: 30px 30px 0 30px;
}
}
@media (max-width: 767px) {
.blog-card.blog-st .blog-content {
padding: 25px 20px 0;
}
}
@media (max-width: 576px) {
.blog-card.blog-st .blog-content {
padding: 20px 10px 0;
}
}
@media (max-width: 991px) {
.blog-card.blog-st .blog-content h5 {
margin-bottom: 20px;
}
}
@media (max-width: 767px) {
.blog-card.blog-st .blog-content h5 {
margin-bottom: 15px;
}
}
.blog-card.blog-st .blog-content h5 a {
font-size: 30px;
line-height: 1.4;
word-wrap: break-word;
}
@media (max-width: 1399px) {
.blog-card.blog-st .blog-content h5 a {
font-size: 28px;
}
}
@media (max-width: 1199px) {
.blog-card.blog-st .blog-content h5 a {
font-size: 26px;
}
}
@media (max-width: 991px) {
.blog-card.blog-st .blog-content h5 a {
font-size: 25px;
}
}
@media (max-width: 767px) {
.blog-card.blog-st .blog-content h5 a {
font-size: 23px;
line-height: 1.5;
}
}
@media (max-width: 576px) {
.blog-card.blog-st .blog-content h5 a {
font-size: 18px;
line-height: 1.6;
}
}
.blog-card.blog-st .blog-content h5 a:hover {
color: var(--primary-color1);
} .footer-top-banner-section {
position: relative;
padding: 100px 0;
background-color: var(--primary-color1);
z-index: 1;
}
@media (max-width: 1199px) {
.footer-top-banner-section {
padding: 90px 0;
}
}
@media (max-width: 767px) {
.footer-top-banner-section {
padding: 70px 0;
}
}
.footer-top-banner-section::before {
content: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home1/footer-top-banner-vector.svg);
position: absolute;
bottom: 0;
left: 0;
z-index: -1;
}
.footer-top-banner-section .arrow-vector {
fill: rgba(255, 255, 255, 0.1);
position: absolute;
top: 10px;
right: 10px;
}
@media (max-width: 576px) {
.footer-top-banner-section .arrow-vector {
width: 110px;
height: 110px;
top: 5px;
right: 5px;
}
}
.footer-top-banner-section .footer-top-banner-wrap {
display: flex;
align-items: center;
justify-content: space-between;
gap: 25px;
}
@media (max-width: 991px) {
.footer-top-banner-section .footer-top-banner-wrap {
flex-wrap: wrap;
gap: 45px;
}
}
@media (max-width: 576px) {
.footer-top-banner-section .footer-top-banner-wrap {
gap: 35px;
}
}
.footer-top-banner-section .footer-top-banner-wrap .section-title {
max-width: 715px;
width: 100%;
}
.footer-top-banner-section .footer-top-banner-wrap .section-title.white span {
color: var(--white-color);
margin-bottom: 20px;
}
@media (max-width: 767px) {
.footer-top-banner-section .footer-top-banner-wrap .section-title.white span {
margin-bottom: 15px;
}
}
.footer-top-banner-section .footer-top-banner-wrap .section-title.white span::after {
background-color: var(--white-color);
}
.footer-top-banner-section .footer-top-banner-wrap .section-title h2 {
font-weight: 600;
}
@media (max-width: 767px) {
.footer-top-banner-section .footer-top-banner-wrap .section-title h2 {
font-size: 45px;
}
}
@media (max-width: 576px) {
.footer-top-banner-section .footer-top-banner-wrap .section-title h2 {
font-size: 33px;
}
}
.footer-top-banner-section .footer-top-banner-wrap .btn-grp {
display: flex;
align-items: center;
gap: 50px;
}
@media (max-width: 576px) {
.footer-top-banner-section .footer-top-banner-wrap .btn-grp {
flex-wrap: wrap;
gap: 30px;
}
}
.footer-top-banner-section .footer-top-banner-wrap .btn-grp .discuss-btn {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
line-height: 1;
text-transform: uppercase;
display: flex;
align-items: center;
gap: 10px;
white-space: nowrap;
padding-bottom: 5px;
position: relative;
background: linear-gradient(to bottom, var(--white-color) 0%, var(--white-color) 98%);
background-repeat: no-repeat;
background-size: 100% 1px;
background-position: left 100%;
transition: background-size 0.75s;
}
.footer-top-banner-section .footer-top-banner-wrap .btn-grp .discuss-btn svg {
fill: var(--white-color);
transition: 0.5s;
}
.footer-top-banner-section .footer-top-banner-wrap .btn-grp .discuss-btn:hover {
background-size: 0 1px;
background-position: 0% 100%;
}
.footer-top-banner-section .footer-top-banner-wrap .btn-grp .discuss-btn:hover svg {
transform: rotate(45deg);
}
.footer-top-banner-section .footer-top-banner-wrap .btn-grp .primary-btn1.white-bg {
color: var(--primary-color1);
}
.footer-top-banner-section .footer-top-banner-wrap .btn-grp .primary-btn1.white-bg::after {
background-color: var(--black-color);
}
.footer-top-banner-section .footer-top-banner-wrap .btn-grp .primary-btn1.white-bg:hover {
color: var(--white-color);
}
.footer-top-banner-section .footer-top-banner-wrap .btn-grp .primary-btn1.white-bg:hover .arrow {
fill: rgba(255, 255, 255, 0.15);
}
.footer-top-banner-section.two {
background-color: unset;
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home2/footer-top-banner-bg.png);
background-size: cover;
background-repeat: no-repeat;
padding: 209px 0 90px;
}
@media (max-width: 1399px) {
.footer-top-banner-section.two {
padding: 190px 0 90px;
}
}
@media (max-width: 991px) {
.footer-top-banner-section.two {
padding: 170px 0 90px;
}
}
@media (max-width: 576px) {
.footer-top-banner-section.two {
padding: 150px 0 70px;
}
}
.footer-top-banner-section.two .footer-top-banner-wrap {
display: block;
text-align: center;
}
.footer-top-banner-section.two .footer-top-banner-wrap .section-title {
max-width: unset;
margin-bottom: 65px;
}
@media (max-width: 1399px) {
.footer-top-banner-section.two .footer-top-banner-wrap .section-title {
margin-bottom: 60px;
}
}
@media (max-width: 991px) {
.footer-top-banner-section.two .footer-top-banner-wrap .section-title {
margin-bottom: 55px;
}
}
@media (max-width: 767px) {
.footer-top-banner-section.two .footer-top-banner-wrap .section-title {
margin-bottom: 50px;
}
}
@media (max-width: 576px) {
.footer-top-banner-section.two .footer-top-banner-wrap .section-title {
margin-bottom: 35px;
}
}
.footer-top-banner-section.two .footer-top-banner-wrap .section-title span {
color: var(--primary-color2);
margin-bottom: 15px;
}
@media (max-width: 576px) {
.footer-top-banner-section.two .footer-top-banner-wrap .section-title span {
margin-bottom: 10px;
}
}
.footer-top-banner-section.two .footer-top-banner-wrap .section-title span::after {
background-color: var(--primary-color2);
}
.footer-top-banner-section.two .footer-top-banner-wrap .section-title h2 {
font-size: 70px;
font-weight: 700;
line-height: 1.2;
}
@media (max-width: 1399px) {
.footer-top-banner-section.two .footer-top-banner-wrap .section-title h2 {
font-size: 62px;
}
}
@media (max-width: 1199px) {
.footer-top-banner-section.two .footer-top-banner-wrap .section-title h2 {
font-size: 58px;
}
}
@media (max-width: 991px) {
.footer-top-banner-section.two .footer-top-banner-wrap .section-title h2 {
font-size: 55px;
}
}
@media (max-width: 767px) {
.footer-top-banner-section.two .footer-top-banner-wrap .section-title h2 {
font-size: 46px;
}
}
@media (max-width: 576px) {
.footer-top-banner-section.two .footer-top-banner-wrap .section-title h2 {
font-size: 34px;
}
}
.footer-top-banner-section.two .footer-top-banner-wrap .btn-grp {
justify-content: center;
}
.footer-top-banner-section.two .footer-top-banner-wrap .btn-grp .discuss-btn {
color: var(--primary-color2);
background: linear-gradient(to bottom, var(--primary-color2) 0%, var(--primary-color2) 98%);
background-repeat: no-repeat;
background-size: 100% 1px;
background-position: left 100%;
transition: background-size 0.75s;
}
.footer-top-banner-section.two .footer-top-banner-wrap .btn-grp .discuss-btn svg {
fill: var(--primary-color2);
transition: 0.5s;
}
.footer-top-banner-section.two .footer-top-banner-wrap .btn-grp .discuss-btn:hover {
background-size: 0 1px;
background-position: 0% 100%;
}
.footer-top-banner-section.two .footer-top-banner-wrap .btn-grp .discuss-btn:hover svg {
transform: rotate(45deg);
}
.footer-top-banner-section.three {
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home4/footer-top-banner-bg.png), linear-gradient(180deg, #fb521e 0%, #fb521e 100%);
background-repeat: no-repeat;
background-size: cover;
padding: 90px 0;
}
@media (max-width: 991px) {
.footer-top-banner-section.three {
padding: 80px 0;
}
}
@media (max-width: 767px) {
.footer-top-banner-section.three {
padding: 70px 0;
}
}
@media (max-width: 576px) {
.footer-top-banner-section.three .footer-top-banner-wrap {
gap: 45px;
}
}
.footer-top-banner-section.three .footer-top-banner-wrap .title-and-btn-area {
max-width: 680px;
width: 100%;
}
@media (min-width: 992px) and (max-width: 1199px) {
.footer-top-banner-section.three .footer-top-banner-wrap .title-and-btn-area {
max-width: 500px;
}
}
.footer-top-banner-section.three .footer-top-banner-wrap .title-and-btn-area .section-title {
margin-bottom: 60px;
max-width: unset;
}
@media (max-width: 991px) {
.footer-top-banner-section.three .footer-top-banner-wrap .title-and-btn-area .section-title {
margin-bottom: 40px;
}
}
@media (max-width: 576px) {
.footer-top-banner-section.three .footer-top-banner-wrap .title-and-btn-area .section-title {
margin-bottom: 30px;
}
}
.footer-top-banner-section.three .footer-top-banner-wrap .title-and-btn-area .section-title h2 {
font-size: 45px;
line-height: 1.2;
}
@media (max-width: 1199px) {
.footer-top-banner-section.three .footer-top-banner-wrap .title-and-btn-area .section-title h2 {
font-size: 40px;
}
}
@media (max-width: 767px) {
.footer-top-banner-section.three .footer-top-banner-wrap .title-and-btn-area .section-title h2 {
font-size: 38px;
}
}
@media (max-width: 576px) {
.footer-top-banner-section.three .footer-top-banner-wrap .title-and-btn-area .section-title h2 {
font-size: 32px;
line-height: 1.3;
}
}
.footer-top-banner-section.three .footer-top-banner-wrap .title-and-btn-area .section-title h2 img {
min-width: 50px;
max-width: 50px;
height: 50px;
border-radius: 50%;
border: 1px solid var(--primary-color2);
}
.footer-top-banner-section.three .footer-top-banner-wrap .title-and-btn-area .section-title h2 img:nth-child(2) {
margin-left: -15px;
}
.footer-top-banner-section.three .footer-top-banner-wrap .title-and-btn-area .section-title h2 img:nth-child(3) {
margin-left: -15px;
}
@media (max-width: 576px) {
.footer-top-banner-section.three .footer-top-banner-wrap .title-and-btn-area .section-title h2 img {
min-width: 42px;
max-width: 42px;
height: 42px;
}
}
.footer-top-banner-section.three .footer-top-banner-wrap .title-and-btn-area .primary-btn1.white-bg {
color: var(--title-color);
}
.footer-top-banner-section.three .footer-top-banner-wrap .title-and-btn-area .primary-btn1.white-bg svg {
fill: rgba(var(--title-color-opc), 0.15);
}
.footer-top-banner-section.three .footer-top-banner-wrap .title-and-btn-area .primary-btn1.white-bg:hover {
color: var(--white-color);
}
.footer-top-banner-section.three .footer-top-banner-wrap .title-and-btn-area .primary-btn1.white-bg:hover svg {
fill: rgba(255, 255, 255, 0.15);
}
.footer-top-banner-section.three .footer-top-banner-wrap .footer-banner-right-content ul {
padding: 0;
margin: 0;
list-style: none;
}
@media (min-width: 768px) and (max-width: 991px) {
.footer-top-banner-section.three .footer-top-banner-wrap .footer-banner-right-content ul {
display: flex;
align-items: center;
gap: 20px;
}
}
.footer-top-banner-section.three .footer-top-banner-wrap .footer-banner-right-content ul .single-item {
padding: 30px 20px;
border: 1px solid rgba(255, 255, 255, 0.4);
border-radius: 10px;
display: flex;
align-items: center;
gap: 30px;
margin-bottom: 25px;
}
@media (min-width: 768px) and (max-width: 991px) {
.footer-top-banner-section.three .footer-top-banner-wrap .footer-banner-right-content ul .single-item {
margin-bottom: 0;
gap: 25px;
padding: 25px 15px;
}
}
@media (max-width: 576px) {
.footer-top-banner-section.three .footer-top-banner-wrap .footer-banner-right-content ul .single-item {
gap: 15px;
padding: 25px 15px;
}
}
.footer-top-banner-section.three .footer-top-banner-wrap .footer-banner-right-content ul .single-item:last-child {
margin-bottom: 0;
}
.footer-top-banner-section.three .footer-top-banner-wrap .footer-banner-right-content ul .single-item .content {
max-width: 295px;
width: 100%;
}
@media (max-width: 767px) {
.footer-top-banner-section.three .footer-top-banner-wrap .footer-banner-right-content ul .single-item .content {
max-width: unset;
}
}
.footer-top-banner-section.three .footer-top-banner-wrap .footer-banner-right-content ul .single-item .content h5 {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 700;
font-size: 22px;
line-height: 1.2;
margin-bottom: 15px;
}
@media (max-width: 576px) {
.footer-top-banner-section.three .footer-top-banner-wrap .footer-banner-right-content ul .single-item .content h5 {
font-size: 20px;
margin-bottom: 10px;
}
}
.footer-top-banner-section.three .footer-top-banner-wrap .footer-banner-right-content ul .single-item .content p {
color: rgba(255, 255, 255, 0.8);
font-family: var(--font-dmsans);
font-weight: 500;
font-size: 16px;
line-height: 23px;
margin-bottom: 0;
}
@media (max-width: 576px) {
.footer-top-banner-section.three .footer-top-banner-wrap .footer-banner-right-content ul .single-item .content p {
font-size: 14px;
}
}
.footer-top-banner-section.three .footer-top-banner-wrap .footer-banner-right-content ul .single-item .details-btn {
min-width: 45px;
max-width: 45px;
height: 45px;
border: 1px solid rgba(255, 255, 255, 0.7);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
transition: 0.5s;
}
.footer-top-banner-section.three .footer-top-banner-wrap .footer-banner-right-content ul .single-item .details-btn svg {
fill: rgba(255, 255, 255, 0.7);
transition: 0.5s;
}
.footer-top-banner-section.three .footer-top-banner-wrap .footer-banner-right-content ul .single-item .details-btn:hover svg {
transform: rotate(45deg);
} .footer-section {
background-color: var(--black-color);
}
.footer-section .footer-wrapper .footer-top-area {
padding: 40px 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
@media (max-width: 1199px) {
.footer-section .footer-wrapper .footer-top-area .footer-logo img {
width: 145px;
}
}
@media (max-width: 576px) {
.footer-section .footer-wrapper .footer-top-area .footer-logo img {
width: 130px;
}
}
.footer-section .footer-wrapper .footer-top-area p {
color: rgba(255, 255, 255, 0.7);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 16px;
line-height: 28px;
margin-bottom: 0;
max-width: 361px;
width: 100%;
}
.footer-section .footer-wrapper .established h2 {
color: rgba(var(--primary-color1-opc), 0.5);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 55px;
line-height: 1;
text-transform: uppercase;
text-decoration: underline;
}
@media (max-width: 1199px) {
.footer-section .footer-wrapper .established h2 {
font-size: 50px;
}
}
@media (max-width: 991px) {
.footer-section .footer-wrapper .established h2 {
font-size: 43px;
}
}
@media (max-width: 576px) {
.footer-section .footer-wrapper .established h2 {
font-size: 40px;
}
}
.footer-section .footer-wrapper .address-area {
padding: 70px 0;
border-right: 1px solid rgba(255, 255, 255, 0.1);
}
@media (max-width: 991px) {
.footer-section .footer-wrapper .address-area {
border-right: unset;
padding: 50px 0;
}
}
.footer-section .footer-wrapper .address-area .address-list {
padding: 0;
margin: 0;
list-style: none;
margin-bottom: 20px;
}
@media (max-width: 991px) {
.footer-section .footer-wrapper .address-area .address-list {
display: flex;
align-items: center;
gap: 50px;
}
}
@media (max-width: 767px) {
.footer-section .footer-wrapper .address-area .address-list {
margin-bottom: 15px;
}
}
@media (max-width: 576px) {
.footer-section .footer-wrapper .address-area .address-list {
gap: 30px;
flex-wrap: wrap;
}
}
.footer-section .footer-wrapper .address-area .address-list .single-address {
max-width: 230px;
width: 100%;
padding-bottom: 40px;
position: relative;
margin-bottom: 45px;
}
.footer-section .footer-wrapper .address-area .address-list .single-address:last-child {
margin-bottom: 0;
}
@media (max-width: 991px) {
.footer-section .footer-wrapper .address-area .address-list .single-address {
margin-bottom: 0;
padding-bottom: 0;
}
}
.footer-section .footer-wrapper .address-area .address-list .single-address::before {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 53px;
height: 1px;
background-color: var(--primary-color1);
}
@media (max-width: 991px) {
.footer-section .footer-wrapper .address-area .address-list .single-address::before {
display: none;
}
}
.footer-section .footer-wrapper .address-area .address-list .single-address span {
color: var(--white-color);
font-family: var(--font-manrope);
font-size: 14px;
font-weight: 400;
line-height: 1;
letter-spacing: 0.06em;
text-decoration: underline;
display: block;
margin-bottom: 20px;
}
@media (max-width: 767px) {
.footer-section .footer-wrapper .address-area .address-list .single-address span {
margin-bottom: 15px;
}
}
.footer-section .footer-wrapper .address-area .address-list .single-address a {
color: rgba(255, 255, 255, 0.6);
font-family: var(--font-dmsans);
font-size: 17px;
font-weight: 400;
line-height: 28px;
margin-bottom: 0;
transition: 0.5s;
}
.footer-section .footer-wrapper .address-area .address-list .single-address a:hover {
color: var(--primary-color1);
}
.footer-section .footer-wrapper .address-area .location-btn {
color: var(--primary-color1);
font-family: var(--font-manrope);
font-weight: 400;
font-size: 14px;
line-height: 1;
text-transform: uppercase;
position: relative;
background: linear-gradient(to bottom, var(--primary-color1) 0%, var(--primary-color1) 98%);
background-repeat: no-repeat;
background-size: 100% 1px;
background-position: left 100%;
transition: background-size 0.75s;
}
.footer-section .footer-wrapper .address-area .location-btn:hover {
background-size: 0 1px;
background-position: 0% 100%;
}
.footer-section .footer-wrapper .footer-menu-and-address-wrap .footer-content-wrap {
padding: 70px 25px 70px 0;
}
@media (max-width: 1399px) {
.footer-section .footer-wrapper .footer-menu-and-address-wrap .footer-content-wrap {
padding: 60px 0;
}
}
@media (max-width: 1199px) {
.footer-section .footer-wrapper .footer-menu-and-address-wrap .footer-content-wrap {
padding: 50px 0;
}
}
@media (max-width: 991px) {
.footer-section .footer-wrapper .footer-menu-and-address-wrap .footer-content-wrap {
padding: 40px 0;
}
}
.footer-section .footer-wrapper .footer-menu-and-address-wrap .footer-content-wrap p {
color: rgba(255, 255, 255, 0.7);
font-family: var(--font-dmsans);
font-weight: 300;
font-size: 16px;
line-height: 30px;
margin-bottom: 55px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.footer-section .footer-wrapper .footer-menu-and-address-wrap .footer-content-wrap p {
font-size: 15px;
margin-bottom: 40px;
}
}
@media (max-width: 991px) {
.footer-section .footer-wrapper .footer-menu-and-address-wrap .footer-content-wrap p {
margin-bottom: 35px;
}
}
@media (max-width: 576px) {
.footer-section .footer-wrapper .footer-menu-and-address-wrap .footer-content-wrap p {
font-size: 15px;
margin-bottom: 25px;
}
}
@media (max-width: 991px) {
.footer-section .footer-wrapper .footer-menu-and-address-wrap .footer-menu {
padding-bottom: 50px;
}
}
.footer-section .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-title {
margin-bottom: 25px;
}
.footer-section .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-title h5 {
color: var(--white-color);
font-family: var(--font-manrope);
font-size: 20px;
font-weight: 600;
line-height: 1;
letter-spacing: 0.9px;
margin-bottom: 0;
position: relative;
padding-bottom: 10px;
}
.footer-section .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-title h5::after {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 107px;
height: 2px;
border-radius: 10px;
background: linear-gradient(90.01deg, rgba(255, 255, 255, 0.4) 0.01%, rgba(255, 255, 255, 0) 102.8%);
}
.footer-section .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-list {
padding: 0;
margin: 0;
list-style: none;
}
.footer-section .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-list li {
margin-bottom: 25px;
line-height: 1;
transition: 0.5s;
position: relative;
}
@media (max-width: 991px) {
.footer-section .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-list li {
margin-bottom: 20px;
}
}
.footer-section .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-list li:last-child {
margin-bottom: 0;
}
.footer-section .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-list li a {
color: rgba(255, 255, 255, 0.7);
font-family: var(--font-manrope);
font-size: 13px;
font-weight: 600;
line-height: 1.3;
letter-spacing: 0.34px;
text-transform: uppercase;
display: inline-flex;
align-items: center;
gap: 6px;
transition: 0.5s;
}
.footer-section .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-list li a svg {
fill: var(--primary-color1);
opacity: 0;
transition: 0.5s;
}
.footer-section .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-list li a:hover {
color: var(--primary-color1);
}
.footer-section .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-list li a:hover svg {
opacity: 1;
}
.footer-section .footer-wrapper .footer-menu-and-address-wrap .contact-area {
padding: 0;
margin: 0;
list-style: none;
position: relative;
}
@media (max-width: 767px) {
.footer-section .footer-wrapper .footer-menu-and-address-wrap .contact-area {
display: flex;
align-items: center;
gap: 30px;
flex-wrap: wrap;
}
}
.footer-section .footer-wrapper .footer-menu-and-address-wrap .contact-area li {
margin-bottom: 20px;
}
@media (max-width: 767px) {
.footer-section .footer-wrapper .footer-menu-and-address-wrap .contact-area li {
margin-bottom: 0;
}
}
.footer-section .footer-wrapper .footer-menu-and-address-wrap .contact-area li:last-child {
margin-bottom: 0;
}
.footer-section .footer-wrapper .footer-menu-and-address-wrap .contact-area li .single-contact {
display: flex;
align-items: center;
gap: 12px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.footer-section .footer-wrapper .footer-menu-and-address-wrap .contact-area li .single-contact {
gap: 8px;
}
}
.footer-section .footer-wrapper .footer-menu-and-address-wrap .contact-area li .single-contact .icon svg {
fill: var(--white-color);
}
.footer-section .footer-wrapper .footer-menu-and-address-wrap .contact-area li .single-contact .content {
position: relative;
line-height: 1;
text-align: start;
}
.footer-section .footer-wrapper .footer-menu-and-address-wrap .contact-area li .single-contact .content span {
color: var(--white-color);
font-family: var(--font-manrope);
font-size: 12px;
font-weight: 500;
line-height: 1;
margin-bottom: 6px;
display: inline-block;
}
.footer-section .footer-wrapper .footer-menu-and-address-wrap .contact-area li .single-contact .content h6 {
margin-bottom: 0;
line-height: 1;
}
.footer-section .footer-wrapper .footer-menu-and-address-wrap .contact-area li .single-contact .content h6 a {
color: rgba(255, 255, 255, 0.7);
font-family: var(--font-manrope);
font-size: 17px;
font-weight: 500;
line-height: 1.5;
transition: 0.5s;
}
@media (min-width: 992px) and (max-width: 1199px) {
.footer-section .footer-wrapper .footer-menu-and-address-wrap .contact-area li .single-contact .content h6 a {
font-size: 16px;
}
}
@media (max-width: 576px) {
.footer-section .footer-wrapper .footer-menu-and-address-wrap .contact-area li .single-contact .content h6 a {
font-size: 16px;
}
}
.footer-section .footer-wrapper .footer-menu-and-address-wrap .contact-area li .single-contact .content h6 a:hover {
color: var(--primary-color1);
}
.footer-section .footer-wrapper .footer-menu-and-address-wrap .contact-area li .arrow {
margin-top: 20px;
fill: rgba(var(--primary-color1-opc), 0.5);
margin-left: 70px;
}
@media (max-width: 767px) {
.footer-section .footer-wrapper .footer-menu-and-address-wrap .contact-area li .arrow {
display: none;
}
}
.footer-section .footer-bottom-wrap {
padding: 20px 0;
background-color: var(--white-color);
}
.footer-section .footer-bottom-wrap .footer-bottom {
display: flex;
align-items: center;
justify-content: space-between;
}
@media (max-width: 991px) {
.footer-section .footer-bottom-wrap .footer-bottom {
flex-wrap: wrap;
gap: 25px;
}
}
@media (max-width: 767px) {
.footer-section .footer-bottom-wrap .footer-bottom {
justify-content: center;
}
}
@media (max-width: 576px) {
.footer-section .footer-bottom-wrap .footer-bottom {
gap: 20px;
}
}
.footer-section .footer-bottom-wrap .footer-bottom .copyright-area p {
color: var(--text-color);
font-family: var(--font-manrope);
font-size: 14px;
font-weight: 300;
line-height: normal;
letter-spacing: 0.02em;
margin-bottom: 0;
}
.footer-section .footer-bottom-wrap .footer-bottom .copyright-area p a {
color: var(--primary-color1);
font-weight: 500;
line-height: 1;
transition: 0.5s;
}
.footer-section .footer-bottom-wrap .footer-bottom .copyright-area p a:hover {
color: var(--title-color);
}
.footer-section .footer-bottom-wrap .footer-bottom .social-area {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
gap: 30px;
}
@media (max-width: 991px) {
.footer-section .footer-bottom-wrap .footer-bottom .social-area {
gap: 20px;
}
}
@media (max-width: 576px) {
.footer-section .footer-bottom-wrap .footer-bottom .social-area {
gap: 15px;
flex-wrap: wrap;
}
}
.footer-section .footer-bottom-wrap .footer-bottom .social-area li a {
color: var(--text-color);
font-family: var(--font-manrope);
font-weight: 400;
font-size: 12px;
line-height: 1;
display: flex;
align-items: center;
gap: 6px;
transition: 0.5s;
}
.footer-section .footer-bottom-wrap .footer-bottom .social-area li a i {
font-size: 14px;
}
.footer-section .footer-bottom-wrap .footer-bottom .social-area li a:hover {
color: var(--primary-color1);
}
.footer-section.style-2 {
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home2/footer-bg.png), linear-gradient(180deg, #000000 0%, #000000 100%);
background-size: cover;
background-repeat: no-repeat;
}
.footer-section.style-2 .footer-wrapper .footer-top-area {
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.footer-section.style-2 .footer-wrapper .footer-top-area .established h2 {
color: rgba(var(--primary-color2-opc), 0.4);
}
.footer-section.style-2 .footer-wrapper .footer-menu-and-address-wrap .address-area {
border-right: 1px solid rgba(255, 255, 255, 0.2);
}
@media (max-width: 991px) {
.footer-section.style-2 .footer-wrapper .footer-menu-and-address-wrap .address-area {
border: unset;
}
}
.footer-section.style-2 .footer-wrapper .footer-menu-and-address-wrap .address-area .address-list {
margin-bottom: 70px;
}
@media (max-width: 991px) {
.footer-section.style-2 .footer-wrapper .footer-menu-and-address-wrap .address-area .address-list {
margin-bottom: 0;
}
}
.footer-section.style-2 .footer-wrapper .footer-menu-and-address-wrap .address-area .address-list .single-address:last-child {
margin-bottom: 0;
padding-bottom: 0;
}
.footer-section.style-2 .footer-wrapper .footer-menu-and-address-wrap .address-area .address-list .single-address::before {
display: none;
}
.footer-section.style-2 .footer-wrapper .footer-menu-and-address-wrap .address-area .address-list .single-address a:hover {
color: var(--primary-color2);
}
@media (max-width: 991px) {
.footer-section.style-2 .footer-wrapper .footer-menu-and-address-wrap .footer-menu {
padding-bottom: 50px;
}
}
.footer-section.style-2 .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-list li a svg {
fill: var(--primary-color2);
}
.footer-section.style-2 .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-list li a:hover {
color: var(--primary-color2);
}
.footer-section.style-2 .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-list li a:hover svg {
opacity: 1;
}
.footer-section.style-2 .footer-wrapper .footer-menu-and-address-wrap .contact-area li .single-contact .content h6 a:hover {
color: var(--primary-color2);
}
.footer-section.style-2 .footer-wrapper .footer-menu-and-address-wrap .contact-area li .arrow {
fill: rgba(var(--primary-color2-opc), 0.5);
}
.footer-section.style-2 .footer-bottom-wrap .footer-bottom .copyright-area p a {
color: var(--primary-color2);
}
.footer-section.style-2 .footer-bottom-wrap .footer-bottom .copyright-area p a:hover {
color: var(--title-color);
}
.footer-section.style-2 .footer-bottom-wrap .footer-bottom .social-area li a:hover {
color: var(--primary-color2);
}
.footer-section.style-3 {
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home3/footer-bg.png);
background-size: cover;
background-repeat: no-repeat;
}
.footer-section.style-3 .footer-wrapper .footer-top-area {
border-bottom: 1px solid rgba(var(--black-color-opc), 0.1);
}
.footer-section.style-3 .footer-wrapper .footer-top-area p {
color: rgba(var(--title-color-opc), 0.7);
}
.footer-section.style-3 .footer-wrapper .footer-top-area .established h2 {
color: rgba(var(--primary-color2-opc), 0.5);
}
.footer-section.style-3 .footer-wrapper .footer-menu-and-address-wrap .address-area {
border-right: 1px solid rgba(var(--black-color-opc), 0.1);
}
.footer-section.style-3 .footer-wrapper .footer-menu-and-address-wrap .address-area .address-list .single-address::before {
background-color: var(--primary-color2);
}
@media (max-width: 991px) {
.footer-section.style-3 .footer-wrapper .footer-menu-and-address-wrap .address-area .address-list .single-address::before {
display: none;
}
}
.footer-section.style-3 .footer-wrapper .footer-menu-and-address-wrap .address-area .address-list .single-address span {
color: var(--title-color);
}
.footer-section.style-3 .footer-wrapper .footer-menu-and-address-wrap .address-area .address-list .single-address a {
color: rgba(var(--title-color-opc), 0.6);
}
.footer-section.style-3 .footer-wrapper .footer-menu-and-address-wrap .address-area .address-list .single-address a:hover {
color: var(--primary-color2);
}
.footer-section.style-3 .footer-wrapper .footer-menu-and-address-wrap .address-area .location-btn {
color: var(--primary-color2);
background: linear-gradient(to bottom, var(--primary-color2) 0%, var(--primary-color2) 98%);
background-repeat: no-repeat;
background-size: 100% 1px;
background-position: left 100%;
transition: background-size 0.75s;
}
.footer-section.style-3 .footer-wrapper .footer-menu-and-address-wrap .address-area .location-btn:hover {
background-size: 0 1px;
background-position: 0% 100%;
}
.footer-section.style-3 .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-title {
margin-bottom: 25px;
}
.footer-section.style-3 .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-title h5 {
color: var(--title-color);
}
.footer-section.style-3 .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-title h5::after {
background: linear-gradient(90.01deg, #000000 0.01%, rgba(255, 255, 255, 0) 102.8%);
opacity: 0.4;
}
.footer-section.style-3 .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-list li a {
color: rgba(var(--title-color-opc), 0.7);
}
.footer-section.style-3 .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-list li a svg {
fill: var(--primary-color2);
}
.footer-section.style-3 .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-list li a:hover {
color: var(--primary-color2);
}
.footer-section.style-3 .footer-wrapper .footer-menu-and-address-wrap .contact-area li .single-contact .icon svg {
fill: var(--title-color);
}
.footer-section.style-3 .footer-wrapper .footer-menu-and-address-wrap .contact-area li .single-contact .content span {
color: var(--title-color);
}
.footer-section.style-3 .footer-wrapper .footer-menu-and-address-wrap .contact-area li .single-contact .content h6 a {
color: rgba(var(--title-color-opc), 0.7);
}
.footer-section.style-3 .footer-wrapper .footer-menu-and-address-wrap .contact-area li .single-contact .content h6 a:hover {
color: var(--primary-color2);
}
.footer-section.style-3 .footer-bottom-wrap {
border-top: 1px solid rgba(var(--black-color-opc), 0.1);
}
.footer-section.style-3 .footer-bottom-wrap .footer-bottom .copyright-area p a {
color: var(--primary-color2);
}
.footer-section.style-3 .footer-bottom-wrap .footer-bottom .copyright-area p a:hover {
color: var(--title-color);
}
.footer-section.style-3 .footer-bottom-wrap .footer-bottom .social-area li a:hover {
color: var(--primary-color2);
}
.footer-section.style-4 {
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home2/footer-bg.png), linear-gradient(180deg, #000000 0%, #000000 100%);
background-size: cover;
background-repeat: no-repeat;
}
.footer-section.style-4 .footer-wrapper .footer-top-area {
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.footer-section.style-4 .footer-wrapper .footer-top-area .established h2 {
color: rgba(var(--primary-color2-opc), 0.4);
}
.footer-section.style-4 .footer-wrapper .address-area {
padding: 0;
border: unset;
display: flex;
align-items: end;
gap: 80px;
}
@media (max-width: 1399px) {
.footer-section.style-4 .footer-wrapper .address-area {
gap: 40px;
}
}
@media (max-width: 991px) {
.footer-section.style-4 .footer-wrapper .address-area {
flex-direction: column;
align-items: start;
}
}
@media (max-width: 576px) {
.footer-section.style-4 .footer-wrapper .address-area {
gap: 30px;
}
}
.footer-section.style-4 .footer-wrapper .address-area .address-list {
display: flex;
align-items: center;
gap: 30px;
margin-bottom: 0;
}
@media (max-width: 1199px) {
.footer-section.style-4 .footer-wrapper .address-area .address-list {
gap: 25px;
}
}
.footer-section.style-4 .footer-wrapper .address-area .address-list .single-address {
padding-bottom: 0;
padding-left: 30px;
margin-bottom: 0;
}
@media (max-width: 576px) {
.footer-section.style-4 .footer-wrapper .address-area .address-list .single-address {
padding-left: 0;
}
}
.footer-section.style-4 .footer-wrapper .address-area .address-list .single-address::before {
content: "";
position: absolute;
bottom: unset;
top: 50%;
transform: translateY(-50%);
left: 0;
width: 1px;
height: 53px;
background-color: var(--primary-color2);
}
@media (max-width: 991px) {
.footer-section.style-4 .footer-wrapper .address-area .address-list .single-address::before {
display: block;
}
}
@media (max-width: 576px) {
.footer-section.style-4 .footer-wrapper .address-area .address-list .single-address::before {
display: none;
}
}
.footer-section.style-4 .footer-wrapper .address-area .address-list .single-address:first-child {
padding-left: 0;
}
.footer-section.style-4 .footer-wrapper .address-area .address-list .single-address:first-child::before {
display: none;
}
@media (min-width: 992px) and (max-width: 1199px) {
.footer-section.style-4 .footer-wrapper .address-area .address-list .single-address a {
font-size: 15px;
}
}
.footer-section.style-4 .footer-wrapper .address-area .address-list .single-address a:hover {
color: var(--primary-color2);
}
.footer-section.style-4 .footer-wrapper .address-area .location-btn {
color: var(--primary-color2);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 14px;
line-height: 1;
text-transform: uppercase;
position: relative;
white-space: nowrap;
background: linear-gradient(to bottom, var(--primary-color2) 0%, var(--primary-color2) 98%);
background-repeat: no-repeat;
transition: background-size 0.75s;
background-size: 0 1px;
padding-bottom: 2px;
background-position: 0% 100%;
padding-top: 25px;
margin-bottom: 8px;
}
@media (max-width: 576px) {
.footer-section.style-4 .footer-wrapper .address-area .location-btn {
padding-top: 20px;
}
}
.footer-section.style-4 .footer-wrapper .address-area .location-btn::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 53px;
height: 1px;
background-color: var(--primary-color2);
}
.footer-section.style-4 .footer-wrapper .address-area .location-btn:hover {
background-size: 100% 1px;
background-position: left 100%;
}
.footer-section.style-4 .footer-wrapper .established h2 {
color: rgba(255, 255, 255, 0.3);
}
@media (max-width: 1399px) {
.footer-section.style-4 .footer-wrapper .established h2 {
font-size: 50px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.footer-section.style-4 .footer-wrapper .established h2 {
font-size: 40px;
}
}
@media (max-width: 576px) {
.footer-section.style-4 .footer-wrapper .established h2 {
font-size: 40px;
}
}
.footer-section.style-4 .footer-wrapper .footer-menu-and-address-wrap .footer-content-wrap {
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.footer-section.style-4 .footer-wrapper .footer-menu-and-address-wrap .footer-menu {
border-left: 1px solid rgba(255, 255, 255, 0.1);
padding: 70px 0;
}
@media (max-width: 1199px) {
.footer-section.style-4 .footer-wrapper .footer-menu-and-address-wrap .footer-menu {
padding: 50px 0;
}
}
@media (max-width: 991px) {
.footer-section.style-4 .footer-wrapper .footer-menu-and-address-wrap .footer-menu {
border-left: unset;
}
}
@media (max-width: 991px) {
.footer-section.style-4 .footer-wrapper .footer-menu-and-address-wrap .footer-menu {
padding-bottom: 50px;
}
}
.footer-section.style-4 .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-list li a svg {
fill: var(--primary-color2);
}
.footer-section.style-4 .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-list li a:hover {
color: var(--primary-color2);
}
.footer-section.style-4 .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-list li a:hover svg {
opacity: 1;
}
.footer-section.style-4 .footer-wrapper .footer-menu-and-address-wrap .contact-area li .single-contact .content h6 a:hover {
color: var(--primary-color2);
}
.footer-section.style-4 .footer-wrapper .footer-menu-and-address-wrap .contact-area li .arrow {
fill: rgba(var(--primary-color2-opc), 0.5);
}
.footer-section.style-4 .footer-bottom-wrap .footer-bottom .copyright-area p a {
color: var(--primary-color2);
}
.footer-section.style-4 .footer-bottom-wrap .footer-bottom .copyright-area p a:hover {
color: var(--title-color);
}
.footer-section.style-4 .footer-bottom-wrap .footer-bottom .social-area li a:hover {
color: var(--primary-color2);
}
.footer-section.style-5 {
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home6/footer-bg.png), linear-gradient(180deg, #0b0b1d 0%, #0b0b1d 100%);
background-size: cover;
background-repeat: no-repeat;
overflow: hidden;
}
.footer-section.style-5 .footer-wrapper .footer-top-area {
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
padding: 220px 0 70px;
}
@media (max-width: 991px) {
.footer-section.style-5 .footer-wrapper .footer-top-area {
padding: 200px 0 50px;
}
}
.footer-section.style-5 .footer-wrapper .footer-top-area .established h2 {
color: rgba(var(--primary-color2-opc), 0.4);
}
.footer-section.style-5 .footer-wrapper .address-area {
padding: 0;
border: unset;
display: flex;
justify-content: space-between;
align-items: end;
gap: 80px;
}
@media (max-width: 1399px) {
.footer-section.style-5 .footer-wrapper .address-area {
gap: 40px;
}
}
@media (max-width: 991px) {
.footer-section.style-5 .footer-wrapper .address-area {
flex-direction: column;
align-items: start;
}
}
@media (max-width: 576px) {
.footer-section.style-5 .footer-wrapper .address-area {
gap: 30px;
}
}
.footer-section.style-5 .footer-wrapper .address-area .address-list {
display: flex;
align-items: center;
gap: 65px;
margin-bottom: 0;
}
@media (max-width: 1199px) {
.footer-section.style-5 .footer-wrapper .address-area .address-list {
gap: 40px;
}
}
@media (max-width: 991px) {
.footer-section.style-5 .footer-wrapper .address-area .address-list {
gap: 20px;
}
}
@media (max-width: 576px) {
.footer-section.style-5 .footer-wrapper .address-area .address-list {
gap: 30px;
}
}
.footer-section.style-5 .footer-wrapper .address-area .address-list .single-address {
padding-bottom: 0;
padding-left: 65px;
margin-bottom: 0;
max-width: 255px;
}
@media (max-width: 1199px) {
.footer-section.style-5 .footer-wrapper .address-area .address-list .single-address {
padding-left: 40px;
}
}
@media (max-width: 767px) {
.footer-section.style-5 .footer-wrapper .address-area .address-list .single-address {
padding-left: 20px;
}
}
@media (max-width: 576px) {
.footer-section.style-5 .footer-wrapper .address-area .address-list .single-address {
padding-left: 0;
}
}
.footer-section.style-5 .footer-wrapper .address-area .address-list .single-address::before {
content: "";
position: absolute;
bottom: unset;
top: 50%;
transform: translateY(-50%);
left: 0;
width: 1px;
height: 53px;
background-color: var(--primary-color5);
}
@media (max-width: 991px) {
.footer-section.style-5 .footer-wrapper .address-area .address-list .single-address::before {
display: block;
}
}
@media (max-width: 576px) {
.footer-section.style-5 .footer-wrapper .address-area .address-list .single-address::before {
display: none;
}
}
.footer-section.style-5 .footer-wrapper .address-area .address-list .single-address:first-child {
padding-left: 0;
max-width: 230px;
}
.footer-section.style-5 .footer-wrapper .address-area .address-list .single-address:first-child::before {
display: none;
}
@media (min-width: 992px) and (max-width: 1199px) {
.footer-section.style-5 .footer-wrapper .address-area .address-list .single-address a {
font-size: 15px;
}
}
.footer-section.style-5 .footer-wrapper .address-area .address-list .single-address a:hover {
color: var(--primary-color5);
}
.footer-section.style-5 .footer-wrapper .address-area .location-btn {
color: var(--primary-color5);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 14px;
line-height: 1;
text-transform: uppercase;
position: relative;
white-space: nowrap;
background: linear-gradient(to bottom, var(--primary-color5) 0%, var(--primary-color5) 98%);
background-repeat: no-repeat;
transition: background-size 0.75s;
background-size: 0 1px;
padding-bottom: 2px;
background-position: 0% 100%;
padding-top: 25px;
margin-bottom: 8px;
}
@media (max-width: 576px) {
.footer-section.style-5 .footer-wrapper .address-area .location-btn {
padding-top: 20px;
}
}
.footer-section.style-5 .footer-wrapper .address-area .location-btn::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 53px;
height: 1px;
background-color: var(--primary-color5);
}
.footer-section.style-5 .footer-wrapper .address-area .location-btn:hover {
background-size: 100% 1px;
background-position: left 100%;
}
.footer-section.style-5 .footer-wrapper .established h2 {
color: rgba(var(--primary-color5-opc), 0.3);
}
@media (max-width: 1399px) {
.footer-section.style-5 .footer-wrapper .established h2 {
font-size: 50px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.footer-section.style-5 .footer-wrapper .established h2 {
font-size: 40px;
}
}
@media (max-width: 576px) {
.footer-section.style-5 .footer-wrapper .established h2 {
font-size: 40px;
}
}
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap {
padding: 0 14.5%;
}
@media (max-width: 1899px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap {
padding: 0 13%;
}
}
@media (max-width: 1799px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap {
padding: 0 11%;
}
}
@media (max-width: 1699px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap {
padding: 0 8%;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap {
padding: 0 3%;
}
}
@media (max-width: 1399px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap {
padding: 0 1%;
}
}
@media (max-width: 991px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap {
padding: 50px 30px;
}
}
@media (max-width: 576px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap {
padding: 50px 10px;
}
}
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-content-wrap {
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .menu-wrap {
display: flex;
gap: 80px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .menu-wrap {
gap: 19px;
}
}
@media (max-width: 991px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .menu-wrap {
gap: 40px;
}
}
@media (max-width: 767px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .menu-wrap {
justify-content: space-between;
flex-wrap: wrap;
}
}
@media (max-width: 576px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .menu-wrap {
flex-direction: column;
}
}
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-logo-area {
padding: 70px 30px;
text-align: center;
border-left: 1px solid rgba(255, 255, 255, 0.05);
border-right: 1px solid rgba(255, 255, 255, 0.05);
}
@media (max-width: 1199px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-logo-area {
padding: 60px 15px;
}
}
@media (max-width: 991px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-logo-area {
padding: 0;
border: unset;
}
}
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-logo-area .footer-logo {
display: block;
margin-bottom: 35px;
}
@media (max-width: 1199px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-logo-area .footer-logo {
margin-bottom: 25px;
}
}
@media (max-width: 767px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-logo-area .footer-logo {
margin-bottom: 20px;
}
}
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-logo-area .footer-logo img {
width: 157px;
}
@media (max-width: 1199px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-logo-area .footer-logo img {
width: 147px;
}
}
@media (max-width: 576px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-logo-area .footer-logo img {
width: 130px;
}
}
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-logo-area p {
color: var(--white-color);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 16px;
line-height: 28px;
margin-bottom: 65px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-logo-area p {
font-size: 15px;
margin-bottom: 55px;
}
}
@media (max-width: 991px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-logo-area p {
margin-bottom: 40px;
}
}
@media (max-width: 767px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-logo-area p {
margin-bottom: 25px;
}
}
@media (max-width: 576px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-logo-area p {
font-size: 14px;
}
}
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-list li a svg {
fill: var(--primary-color5);
}
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-list li a:hover {
color: var(--primary-color5);
}
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-widget .widget-list li a:hover svg {
opacity: 1;
}
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-widget .social-area {
padding: 0;
margin: 0;
list-style: none;
}
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-widget .social-area li {
margin-bottom: 30px;
}
@media (max-width: 576px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-widget .social-area li {
margin-bottom: 25px;
}
}
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-widget .social-area li:last-child {
margin-bottom: 0;
}
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-widget .social-area li a {
color: rgba(255, 255, 255, 0.7);
font-family: var(--font-manrope);
font-weight: 400;
font-size: 12px;
line-height: 1;
display: flex;
align-items: center;
gap: 6px;
transition: 0.5s;
}
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-widget .social-area li a i {
font-size: 14px;
}
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .footer-widget .social-area li a:hover {
color: var(--primary-color5);
}
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .contact-area {
display: block;
}
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .contact-area li {
margin-bottom: 20px;
}
@media (max-width: 576px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .contact-area li {
margin-bottom: 0;
}
}
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .contact-area li .single-contact .content h6 a:hover {
color: var(--primary-color5);
}
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .contact-area li .arrow {
fill: rgba(var(--primary-color5-opc), 0.5);
}
@media (max-width: 767px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .contact-area li .arrow {
display: block;
}
}
@media (max-width: 576px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .contact-area li .arrow {
display: none;
}
}
@media (max-width: 576px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .contact-area {
display: flex;
align-items: center;
gap: 35px;
flex-wrap: wrap;
}
}
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .social-and-address-area {
display: flex;
justify-content: space-between;
gap: 40px;
margin-left: 60px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .social-and-address-area {
margin-left: 40px;
}
}
@media (max-width: 1399px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .social-and-address-area {
margin-left: 30px;
}
}
@media (max-width: 1199px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .social-and-address-area {
margin-left: 0;
}
}
@media (max-width: 576px) {
.footer-section.style-5 .footer-wrapper .footer-menu-and-address-wrap .social-and-address-area {
flex-wrap: wrap;
}
}
.footer-section.style-5 .footer-bottom-wrap {
background-color: #1a1a2c;
}
.footer-section.style-5 .footer-bottom-wrap .footer-bottom {
justify-content: center;
}
.footer-section.style-5 .footer-bottom-wrap .footer-bottom .copyright-area p {
color: rgba(255, 255, 255, 0.7);
}
.footer-section.style-5 .footer-bottom-wrap .footer-bottom .copyright-area p a {
color: var(--white-color);
}
.footer-section.style-5 .footer-bottom-wrap .footer-bottom .copyright-area p a:hover {
color: var(--primary-color5);
}
.footer-section.style-5 .footer-bottom-wrap .footer-bottom .social-area li a:hover {
color: var(--primary-color2);
} .home2-banner-section {
display: grid;
grid-template-columns: 44% 56%;
}
@media (max-width: 1699px) {
.home2-banner-section {
grid-template-columns: 42% 58%;
}
}
@media (max-width: 1399px) {
.home2-banner-section {
grid-template-columns: 35% 65%;
}
}
@media (max-width: 1199px) {
.home2-banner-section {
display: block;
}
}
.home2-banner-section .banner-img {
position: relative;
}
.home2-banner-section .banner-img::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(var(--black-color-opc), 0.3);
}
.home2-banner-section .banner-img img {
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.home2-banner-section .banner-img .circular-text {
position: absolute;
bottom: 25px;
left: 25px;
z-index: 9;
min-width: 120px;
height: 120px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--white-color);
}
@media (max-width: 767px) {
.home2-banner-section .banner-img .circular-text {
display: none;
}
}
.home2-banner-section .banner-img .circular-text .center-icon {
width: 65px;
height: 65px;
border-radius: 50%;
background-color: #6a6b6b;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 1;
}
.home2-banner-section .banner-img .circular-text .center-icon svg {
fill: var(--white-color);
}
.home2-banner-section .banner-img .circular-text .text {
position: absolute;
width: 100%;
height: 100%;
animation: textRotation 8s linear infinite;
}
.home2-banner-section .banner-img .circular-text .text span {
position: absolute;
left: 50%;
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 13px;
font-weight: 700;
transform-origin: 0 60px;
}
@media (max-width: 1199px) {
.home2-banner-section .banner-img {
display: none;
}
}
.home2-banner-section .banner-content-wrapper {
padding-top: 87px;
}
@media (max-width: 991px) {
.home2-banner-section .banner-content-wrapper {
padding-top: 77px;
}
}
.home2-banner-section .banner-content-wrapper .banner-content {
border-top: 1px solid rgba(var(--black-color-opc), 0.07);
padding: 125px 10% 145px 120px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home2-banner-section .banner-content-wrapper .banner-content {
padding: 90px 8% 100px 90px;
}
}
@media (max-width: 1399px) {
.home2-banner-section .banner-content-wrapper .banner-content {
padding: 70px 8% 80px 60px;
}
}
@media (max-width: 1199px) {
.home2-banner-section .banner-content-wrapper .banner-content {
border: unset;
padding: 60px 8% 0 80px;
}
}
@media (max-width: 991px) {
.home2-banner-section .banner-content-wrapper .banner-content {
padding: 50px 8% 0 50px;
}
}
@media (max-width: 767px) {
.home2-banner-section .banner-content-wrapper .banner-content {
padding: 50px 25px 0 25px;
}
}
@media (max-width: 576px) {
.home2-banner-section .banner-content-wrapper .banner-content {
padding: 50px 10px 0 10px;
}
}
.home2-banner-section .banner-content-wrapper .banner-content h1 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 800;
font-size: 75px;
line-height: 1.2;
margin-bottom: 45px;
max-width: 715px;
width: 100%;
}
.home2-banner-section .banner-content-wrapper .banner-content h1 span {
color: rgba(var(--title-color-opc), 0.5);
font-weight: 600;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home2-banner-section .banner-content-wrapper .banner-content h1 {
font-size: 67px;
margin-bottom: 35px;
}
}
@media (max-width: 1399px) {
.home2-banner-section .banner-content-wrapper .banner-content h1 {
font-size: 62px;
margin-bottom: 30px;
}
}
@media (max-width: 1199px) {
.home2-banner-section .banner-content-wrapper .banner-content h1 {
font-size: 58px;
}
}
@media (max-width: 991px) {
.home2-banner-section .banner-content-wrapper .banner-content h1 {
font-size: 55px;
margin-bottom: 25px;
}
}
@media (max-width: 767px) {
.home2-banner-section .banner-content-wrapper .banner-content h1 {
font-size: 50px;
line-height: 1.3;
margin-bottom: 20px;
}
}
@media (max-width: 576px) {
.home2-banner-section .banner-content-wrapper .banner-content h1 {
font-size: 38px;
margin-bottom: 15px;
}
}
.home2-banner-section .banner-content-wrapper .banner-content .content {
max-width: 631px;
width: 100%;
margin-bottom: 60px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home2-banner-section .banner-content-wrapper .banner-content .content {
margin-bottom: 50px;
}
}
@media (max-width: 1399px) {
.home2-banner-section .banner-content-wrapper .banner-content .content {
margin-bottom: 45px;
}
}
@media (max-width: 767px) {
.home2-banner-section .banner-content-wrapper .banner-content .content {
margin-bottom: 35px;
}
}
@media (max-width: 576px) {
.home2-banner-section .banner-content-wrapper .banner-content .content {
margin-bottom: 25px;
}
}
.home2-banner-section .banner-content-wrapper .banner-content .content p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 16px;
font-weight: 400;
line-height: 32px;
margin-bottom: 0;
padding-left: 15px;
position: relative;
}
@media (max-width: 767px) {
.home2-banner-section .banner-content-wrapper .banner-content .content p {
font-size: 15px;
}
}
@media (max-width: 576px) {
.home2-banner-section .banner-content-wrapper .banner-content .content p {
padding-left: 0;
}
}
.home2-banner-section .banner-content-wrapper .banner-content .content p::before {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 0;
width: 2px;
height: 77px;
background-color: rgba(var(--black-color-opc), 0.3);
}
@media (max-width: 576px) {
.home2-banner-section .banner-content-wrapper .banner-content .content p::before {
display: none;
}
}
.home2-banner-section .banner-content-wrapper .banner-content .btn-and-people-area {
display: flex;
align-items: center;
gap: 20px;
}
@media (max-width: 767px) {
.home2-banner-section .banner-content-wrapper .banner-content .btn-and-people-area {
gap: 30px;
}
}
@media (max-width: 576px) {
.home2-banner-section .banner-content-wrapper .banner-content .btn-and-people-area {
flex-wrap: wrap;
}
}
.home2-banner-section .banner-content-wrapper .banner-content .btn-and-people-area > svg {
fill: rgba(var(--primary-color2-opc), 0.15);
}
@media (max-width: 767px) {
.home2-banner-section .banner-content-wrapper .banner-content .btn-and-people-area > svg {
display: none;
}
}
.home2-banner-section .banner-content-wrapper .banner-content .btn-and-people-area .people-area {
display: flex;
align-items: center;
gap: 15px;
}
@media (max-width: 767px) {
.home2-banner-section .banner-content-wrapper .banner-content .btn-and-people-area .people-area {
gap: 10px;
}
}
.home2-banner-section .banner-content-wrapper .banner-content .btn-and-people-area .people-area .img-grp {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
}
.home2-banner-section .banner-content-wrapper .banner-content .btn-and-people-area .people-area .img-grp li img {
min-width: 44px;
max-width: 44px;
height: 44px;
border-radius: 50%;
border: 1px solid #f0f2f4;
margin-left: -15px;
}
@media (max-width: 576px) {
.home2-banner-section .banner-content-wrapper .banner-content .btn-and-people-area .people-area .img-grp li img {
min-width: 37px;
max-width: 37px;
height: 37px;
}
}
.home2-banner-section .banner-content-wrapper .banner-content .btn-and-people-area .people-area .img-grp li:first-child img {
margin-left: 0;
}
.home2-banner-section .banner-content-wrapper .banner-content .btn-and-people-area .people-area a {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
line-height: 1;
text-transform: uppercase;
position: relative;
background: linear-gradient(to bottom, var(--title-color) 0%, var(--title-color) 98%);
background-repeat: no-repeat;
background-size: 100% 1px;
background-position: left 100%;
transition: background-size 0.75s;
}
.home2-banner-section .banner-content-wrapper .banner-content .btn-and-people-area .people-area a:hover {
background-size: 0 1px;
background-position: 0% 100%;
} .service-card {
padding: 40px 32px;
border: 1px solid rgba(var(--black-color-opc), 0.03);
background-color: #f7f6ff;
border-radius: 10px;
position: relative;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.service-card {
padding: 35px 20px;
}
}
@media (max-width: 1199px) {
.service-card {
padding: 35px 25px;
}
}
@media (max-width: 767px) {
.service-card {
padding: 30px 20px;
}
}
.service-card .arrow-vector {
fill: rgba(var(--black-color-opc), 0.03);
position: absolute;
top: 5px;
right: 5px;
}
.service-card h4 {
margin-bottom: 25px;
}
@media (max-width: 767px) {
.service-card h4 {
margin-bottom: 20px;
}
}
.service-card h4 a {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 25px;
line-height: 1.4;
transition: 0.5s;
}
.service-card h4 a:hover {
color: var(--primary-color2);
}
@media (min-width: 1200px) and (max-width: 1399px) {
.service-card h4 a {
font-size: 23px;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.service-card h4 a {
font-size: 24px;
}
}
@media (max-width: 767px) {
.service-card h4 a {
font-size: 22px;
}
}
@media (max-width: 576px) {
.service-card h4 a {
font-size: 23px;
}
}
.service-card .service-img {
display: block;
margin-bottom: 25px;
position: relative;
overflow: hidden;
border-radius: 5px;
}
@media (max-width: 767px) {
.service-card .service-img {
margin-bottom: 20px;
}
}
.service-card .service-img img {
border-radius: 5px;
transition: all 0.5s ease-out;
-o-object-fit: cover;
object-fit: cover;
min-height: 130px;
}
.service-card .service-img::after {
position: absolute;
width: 200%;
height: 0%;
left: 50%;
top: 50%;
background-color: rgba(255, 255, 255, 0.3);
transform: translate(-50%, -50%) rotate(-45deg);
content: "";
z-index: 1;
}
.service-card p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 16px;
line-height: 24px;
margin-bottom: 25px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.service-card p {
font-size: 15px;
}
}
@media (min-width: 576px) and (max-width: 768px) {
.service-card p {
font-size: 14px;
}
}
@media (max-width: 767px) {
.service-card p {
margin-bottom: 20px;
}
}
.service-card .primary-btn3 {
text-decoration: none;
padding: 11px 31px 11px 18px;
text-transform: capitalize;
}
.service-card .primary-btn3 span:nth-child(2) {
text-decoration: none;
padding-left: 18px;
}
.service-card:hover .service-img::after {
height: 250%;
transition: all 600ms linear;
background-color: transparent;
}
.service-card:hover .service-img img {
transform: scale(1.1);
} .home2-benefit-section {
padding: 90px 0;
}
@media (max-width: 767px) {
.home2-benefit-section {
padding: 70px 0;
}
}
.home2-benefit-section .section-title {
position: relative;
}
.home2-benefit-section .section-title .vector {
fill: rgba(var(--black-color-opc), 0.1);
position: absolute;
bottom: -20%;
right: -55%;
}
@media (max-width: 1399px) {
.home2-benefit-section .section-title .vector {
bottom: -35%;
}
}
@media (max-width: 1199px) {
.home2-benefit-section .section-title .vector {
right: -20%;
}
}
@media (max-width: 991px) {
.home2-benefit-section .section-title .vector {
display: none;
}
}
.home2-benefit-section .benefit-list {
padding: 0;
margin: 0;
list-style: none;
margin-left: 140px;
}
@media (max-width: 1399px) {
.home2-benefit-section .benefit-list {
margin-left: 80px;
}
}
@media (max-width: 1199px) {
.home2-benefit-section .benefit-list {
margin-left: 0;
}
}
.home2-benefit-section .benefit-list .single-benefit {
display: flex;
align-items: center;
gap: 30px;
margin-bottom: 50px;
}
.home2-benefit-section .benefit-list .single-benefit:last-child {
margin-bottom: 0;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home2-benefit-section .benefit-list .single-benefit {
gap: 20px;
margin-bottom: 35px;
}
}
@media (max-width: 991px) {
.home2-benefit-section .benefit-list .single-benefit {
margin-bottom: 40px;
}
}
@media (max-width: 767px) {
.home2-benefit-section .benefit-list .single-benefit {
gap: 20px;
}
}
@media (max-width: 576px) {
.home2-benefit-section .benefit-list .single-benefit {
gap: 15px;
margin-bottom: 30px;
flex-wrap: wrap;
}
}
.home2-benefit-section .benefit-list .single-benefit .number {
min-width: 70px;
max-width: 70px;
height: 70px;
border: 1px solid rgba(var(--black-color-opc), 0.3);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
transition: 0.7s;
}
.home2-benefit-section .benefit-list .single-benefit .number span {
color: var(--title-color);
font-family: var(--font-dmsans);
font-weight: 600;
font-size: 22px;
line-height: 1;
transition: 0.5s;
}
@media (max-width: 576px) {
.home2-benefit-section .benefit-list .single-benefit .number {
min-width: 60px;
max-width: 60px;
height: 60px;
}
.home2-benefit-section .benefit-list .single-benefit .number span {
font-size: 20px;
}
}
.home2-benefit-section .benefit-list .single-benefit .content h4 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 700;
font-size: 23px;
line-height: 1.5;
margin-bottom: 8px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home2-benefit-section .benefit-list .single-benefit .content h4 {
font-size: 21px;
margin-bottom: 6px;
}
}
@media (max-width: 576px) {
.home2-benefit-section .benefit-list .single-benefit .content h4 {
font-size: 20px;
}
}
.home2-benefit-section .benefit-list .single-benefit .content p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 16px;
line-height: 25px;
margin-bottom: 0;
}
@media (max-width: 767px) {
.home2-benefit-section .benefit-list .single-benefit .content p {
font-size: 15px;
}
}
.home2-benefit-section .benefit-list .single-benefit:hover .number {
box-shadow: inset 0 0 0 10em var(--primary-color2);
border-color: var(--primary-color2);
}
.home2-benefit-section .benefit-list .single-benefit:hover .number span {
color: var(--white-color);
}
.home2-benefit-section .benefit-img-wrap {
position: relative;
z-index: 1;
margin-left: 30px;
}
@media (max-width: 1399px) {
.home2-benefit-section .benefit-img-wrap {
margin-left: 10px;
}
}
@media (max-width: 1199px) {
.home2-benefit-section .benefit-img-wrap {
margin-left: 0;
}
}
.home2-benefit-section .benefit-img-wrap .img-bg {
position: absolute;
top: -3px;
left: 3px;
}
.home2-benefit-section .benefit-img-wrap .benefit-img {
-webkit-mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home2/benefit-img-bg.png);
mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home2/benefit-img-bg.png);
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-size: cover;
mask-size: cover;
position: relative;
z-index: 2;
} .home2-about-section .about-title-area .section-title {
max-width: 872px;
width: 100%;
}
.home2-about-section .about-title-area .content {
padding-top: 35px;
padding-left: 95px;
}
@media (max-width: 1399px) {
.home2-about-section .about-title-area .content {
padding-left: 60px;
}
}
@media (max-width: 1199px) {
.home2-about-section .about-title-area .content {
padding-left: 40px;
padding-top: 30px;
}
}
@media (max-width: 991px) {
.home2-about-section .about-title-area .content {
padding-left: 0;
padding-top: 25px;
}
}
.home2-about-section .about-title-area .content p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 16px;
font-weight: 400;
line-height: 32px;
margin-bottom: 0;
padding-left: 15px;
position: relative;
}
@media (max-width: 767px) {
.home2-about-section .about-title-area .content p {
font-size: 15px;
}
}
@media (max-width: 576px) {
.home2-about-section .about-title-area .content p {
padding-left: 0;
}
}
.home2-about-section .about-title-area .content p::before {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 0;
width: 2px;
height: 77px;
background-color: rgba(var(--black-color-opc), 0.3);
}
@media (max-width: 576px) {
.home2-about-section .about-title-area .content p::before {
display: none;
}
}
.home2-about-section .about-btn-area {
position: relative;
display: inline-block;
}
.home2-about-section .about-btn-area .bg svg {
fill: transparent;
stroke: rgba(var(--title-color-opc), 0.1);
transition: 0.5s;
}
@media (max-width: 767px) {
.home2-about-section .about-btn-area .bg svg {
width: 190px;
}
}
.home2-about-section .about-btn-area .primary-btn2 {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
gap: 25px;
}
@media (max-width: 767px) {
.home2-about-section .about-btn-area .primary-btn2 {
gap: 15px;
}
}
.home2-about-section .about-btn-area:hover .bg svg {
fill: var(--primary-color2);
stroke: var(--primary-color2);
transition: 0.5s;
}
.home2-about-section .about-btn-area:hover .primary-btn2 {
color: var(--white-color);
}
.home2-about-section .about-btn-area:hover .primary-btn2 svg {
fill: rgba(var(--black-color-opc), 0.15);
}
.home2-about-section .about-btn-area:hover .primary-btn2 span {
background-size: 0 1px;
background-position: 0% 100%;
}
.home2-about-section .about-content-wrapper {
margin-top: 15px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home2-about-section .about-content-wrapper {
margin-top: 5px;
}
}
@media (max-width: 991px) {
.home2-about-section .about-content-wrapper {
margin-top: 0;
}
}
.home2-about-section .about-content-wrapper .about-content {
margin-bottom: 70px;
}
@media (max-width: 1399px) {
.home2-about-section .about-content-wrapper .about-content {
margin-bottom: 60px;
}
}
@media (max-width: 1199px) {
.home2-about-section .about-content-wrapper .about-content {
margin-bottom: 40px;
}
}
@media (max-width: 576px) {
.home2-about-section .about-content-wrapper .about-content {
margin-bottom: 30px;
}
}
.home2-about-section .about-content-wrapper .about-content h5 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 700;
font-size: 22px;
line-height: 1.3;
margin-bottom: 15px;
}
@media (max-width: 576px) {
.home2-about-section .about-content-wrapper .about-content h5 {
font-size: 21px;
margin-bottom: 10px;
}
}
.home2-about-section .about-content-wrapper .about-content p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 18px;
line-height: 35px;
margin-bottom: 0;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home2-about-section .about-content-wrapper .about-content p {
font-size: 16px;
}
}
@media (max-width: 767px) {
.home2-about-section .about-content-wrapper .about-content p {
font-size: 16px;
}
}
.home2-about-section .about-content-wrapper .founder-area {
background-color: #e3ecc9;
background-size: cover;
background-repeat: no-repeat;
padding: 40px 50px 30px;
clip-path: polygon(5% 0, 100% 0, 100% 100%, 0 100%, 0 15%);
border-radius: 10px;
position: relative;
z-index: 1;
}
@media (max-width: 1399px) {
.home2-about-section .about-content-wrapper .founder-area {
padding: 40px 40px 30px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home2-about-section .about-content-wrapper .founder-area {
padding: 40px 25px 30px;
}
}
@media (max-width: 767px) {
.home2-about-section .about-content-wrapper .founder-area {
padding: 40px 25px 30px;
}
}
@media (max-width: 576px) {
.home2-about-section .about-content-wrapper .founder-area {
padding: 40px 20px 60px;
clip-path: polygon(10% 0, 100% 0, 100% 100%, 0 100%, 0 12%);
}
}
.home2-about-section .about-content-wrapper .founder-area .bg-vector {
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
z-index: -1;
}
.home2-about-section .about-content-wrapper .founder-area p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 17px;
line-height: 34px;
margin-bottom: 35px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home2-about-section .about-content-wrapper .founder-area p {
font-size: 16px;
margin-bottom: 25px;
}
}
@media (max-width: 576px) {
.home2-about-section .about-content-wrapper .founder-area p {
font-size: 16px;
line-height: 30px;
margin-bottom: 25px;
}
}
.home2-about-section .about-content-wrapper .founder-area .founder-profile {
padding: 5px 11px 5px 5px;
border: 1px solid rgba(var(--black-color-opc), 0.08);
border-radius: 10px;
display: inline-flex;
align-items: center;
gap: 10px;
}
.home2-about-section .about-content-wrapper .founder-area .founder-profile .profile-img {
min-width: 60px;
max-width: 60px;
height: 60px;
border-radius: 50%;
border: 1px solid var(--white-color);
display: flex;
align-items: center;
justify-content: center;
}
.home2-about-section .about-content-wrapper .founder-area .founder-profile .profile-img img {
width: 48px;
height: 48px;
border-radius: 50%;
}
.home2-about-section .about-content-wrapper .founder-area .founder-profile .profile-content {
line-height: 1;
}
.home2-about-section .about-content-wrapper .founder-area .founder-profile .profile-content h6 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 16px;
line-height: 1.3;
margin-bottom: 5px;
}
.home2-about-section .about-content-wrapper .founder-area .founder-profile .profile-content span {
color: var(--primary-color2);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 13px;
line-height: 1.5;
}
.home2-about-section .about-content-wrapper .founder-area .contact-btn {
padding: 12px 45px;
background-color: var(--white-color);
display: inline-block;
border-radius: 30px 0 10px 0;
position: absolute;
bottom: 1px;
right: 1px;
z-index: 1;
}
.home2-about-section .about-content-wrapper .founder-area .contact-btn a {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 14px;
line-height: 1;
display: flex;
align-items: center;
gap: 8px;
transition: 0.5s;
}
.home2-about-section .about-content-wrapper .founder-area .contact-btn a svg {
fill: rgba(var(--black-color-opc), 0.15);
transition: 0.5s;
}
.home2-about-section .about-content-wrapper .founder-area .contact-btn a:hover {
color: var(--primary-color2);
}
.home2-about-section .about-content-wrapper .founder-area .contact-btn a:hover svg {
fill: rgba(var(--primary-color2-opc), 0.15);
transform: translateX(3px);
}
.home2-about-section .about-img {
height: 100%;
}
.home2-about-section .about-img img {
border-radius: 10px;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
} .project-card2 .project-img {
clip-path: polygon(96.5% 0, 100% 6%, 100% 100%, 0 100%, 0 0);
transition: clip-path 0.5s ease-out, transform 0.5s ease-out;
position: relative;
overflow: hidden;
display: block;
border-radius: 5px;
}
.project-card2 .project-img img {
border-radius: 5px;
transition: all 0.5s ease-out;
min-height: 382px;
-o-object-fit: cover;
object-fit: cover;
}
@media (max-width: 1399px) {
.project-card2 .project-img img {
min-height: 340px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.project-card2 .project-img img {
min-height: 300px;
}
}
@media (max-width: 991px) {
.project-card2 .project-img img {
min-height: 320px;
}
}
@media (max-width: 767px) {
.project-card2 .project-img img {
min-height: 350px;
max-height: 350px;
width: 100%;
}
}
@media (max-width: 576px) {
.project-card2 .project-img img {
min-height: 280px;
max-height: 280px;
width: 100%;
}
}
.project-card2 .project-content {
padding-top: 30px;
}
@media (max-width: 1199px) {
.project-card2 .project-content {
padding-top: 25px;
}
}
@media (max-width: 991px) {
.project-card2 .project-content {
padding-top: 20px;
}
}
.project-card2 .project-content span {
color: var(--primary-color2);
font-family: var(--font-dmsans);
font-weight: 500;
font-size: 13px;
line-height: 1;
text-transform: uppercase;
margin-bottom: 10px;
}
.project-card2 .project-content h4 {
margin-bottom: 0;
}
.project-card2 .project-content h4 a {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 24px;
line-height: 1.3;
transition: 0.5s;
}
.project-card2 .project-content h4 a:hover {
color: var(--primary-color2);
}
@media (min-width: 1200px) and (max-width: 1399px) {
.project-card2 .project-content h4 a {
font-size: 22px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.project-card2 .project-content h4 a {
font-size: 20px;
}
}
@media (max-width: 991px) {
.project-card2 .project-content h4 a {
font-size: 22px;
}
}
.project-card2:hover .project-img {
clip-path: polygon(100% 0, 100% 0, 100% 100%, 0 100%, 0 0);
}
.project-card2:hover .project-img img {
transform: scale(1.1);
}
.project-card2.two .project-img {
clip-path: polygon(97% 0, 100% 5%, 100% 100%, 0 100%, 0 0);
}
.project-card2.two .project-img::after {
position: absolute;
width: 200%;
height: 0%;
left: 50%;
top: 50%;
background-color: rgba(255, 255, 255, 0.3);
transform: translate(-50%, -50%) rotate(-45deg);
content: "";
z-index: 1;
}
.project-card2.two .project-content {
padding-top: 25px;
}
@media (max-width: 576px) {
.project-card2.two .project-content {
padding-top: 20px;
}
}
.project-card2.two .project-content h4 a {
color: var(--title-color);
font-size: 30px;
}
@media (max-width: 1399px) {
.project-card2.two .project-content h4 a {
font-size: 28px;
}
}
@media (max-width: 1199px) {
.project-card2.two .project-content h4 a {
font-size: 26px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.project-card2.two .project-content h4 a {
font-size: 23px;
}
}
@media (max-width: 991px) {
.project-card2.two .project-content h4 a {
font-size: 24px;
}
}
@media (max-width: 576px) {
.project-card2.two .project-content h4 a {
font-size: 21px;
}
}
.project-card2.two .project-content h4 a:hover {
color: var(--primary-color2);
}
.project-card2.two .project-content ul {
padding: 0;
margin: 0;
list-style: none;
margin-top: 25px;
display: flex;
align-items: center;
gap: 15px;
flex-wrap: wrap;
}
@media (max-width: 576px) {
.project-card2.two .project-content ul {
margin-top: 20px;
}
}
.project-card2.two .project-content ul li {
display: inline-flex;
}
.project-card2.two .project-content ul li a {
color: rgba(var(--title-color-opc), 0.5);
font-family: var(--font-dmsans);
font-weight: 500;
font-size: 14px;
line-height: 1;
padding: 11px 19px;
border-radius: 100px;
border: 1px solid rgba(var(--black-color-opc), 0.2);
transition: 0.5s;
}
@media (max-width: 576px) {
.project-card2.two .project-content ul li a {
padding: 8px 13px;
}
}
.project-card2.two .project-content ul li a:hover {
background-color: var(--primary-color2);
border-color: var(--primary-color2);
color: var(--white-color);
}
.project-card2.two:hover .project-img::after {
height: 250%;
transition: all 600ms linear;
background-color: transparent;
}
.project-card2.three .project-img img {
border-radius: 5px;
transition: all 0.5s ease-out;
min-height: 382px;
max-height: 382px;
width: 100%;
-o-object-fit: cover;
object-fit: cover;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.project-card2.three .project-img img {
min-height: 320px;
max-height: 320px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.project-card2.three .project-img img {
min-height: 320px;
max-height: 320px;
}
}
@media (max-width: 576px) {
.project-card2.three .project-img img {
min-height: 300px;
max-height: 300px;
}
}
.project-card2.three .project-content {
padding-top: 15px;
}
.project-card2.three .project-content h4 a {
color: var(--title-color);
font-size: 23px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.project-card2.three .project-content h4 a {
font-size: 22px;
}
}
.project-card2.three .project-content h4 a:hover {
color: var(--primary-color2);
}
.home2-project-section {
background-color: var(--black-color);
padding: 90px 13%;
}
@media (max-width: 1799px) {
.home2-project-section {
padding: 90px 10%;
}
}
@media (max-width: 1699px) {
.home2-project-section {
padding: 90px 8%;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home2-project-section {
padding: 90px 4%;
}
}
@media (max-width: 1399px) {
.home2-project-section {
padding: 90px 2%;
}
}
@media (max-width: 767px) {
.home2-project-section {
padding: 70px 2%;
}
}
@media (max-width: 576px) {
.home2-project-section {
padding: 70px 0px;
}
}
.home2-project-section .primary-btn2 {
margin-bottom: 10px;
}
@media (max-width: 991px) {
.home2-project-section .primary-btn2 {
margin-bottom: 0;
}
}
.home2-project-section .project-wrapper {
padding-top: 50px;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
@media (max-width: 991px) {
.home2-project-section .project-wrapper {
padding-top: 40px;
}
}
.home2-project-section .project-wrapper .project-card-area {
display: grid;
grid-template-columns: 27.5% 27.5% 39%;
gap: 40px;
}
@media (max-width: 1199px) {
.home2-project-section .project-wrapper .project-card-area {
grid-template-columns: 28% 28% 39%;
gap: 24px;
}
}
@media (max-width: 991px) {
.home2-project-section .project-wrapper .project-card-area {
grid-template-columns: 48.5% 48.5%;
gap: 24px;
row-gap: 40px;
}
}
@media (max-width: 767px) {
.home2-project-section .project-wrapper .project-card-area {
grid-template-columns: 100%;
}
}
.home2-project-section .project-wrapper .project-card-area.two {
grid-template-columns: 68% 27.5%;
gap: 60px;
padding-top: 50px;
margin-top: 50px;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
@media (max-width: 1199px) {
.home2-project-section .project-wrapper .project-card-area.two {
grid-template-columns: 66% 30%;
gap: 35px;
padding-top: 40px;
margin-top: 40px;
}
}
@media (max-width: 991px) {
.home2-project-section .project-wrapper .project-card-area.two {
grid-template-columns: 56% 40%;
gap: 25px;
}
}
@media (max-width: 767px) {
.home2-project-section .project-wrapper .project-card-area.two {
grid-template-columns: 100%;
row-gap: 40px;
}
} .home2-process-section .process-wrapper {
padding: 0 11%;
}
@media (max-width: 1799px) {
.home2-process-section .process-wrapper {
padding: 0 7%;
}
}
@media (max-width: 1699px) {
.home2-process-section .process-wrapper {
padding: 0 5%;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home2-process-section .process-wrapper {
padding: 0 3%;
}
}
@media (max-width: 1399px) {
.home2-process-section .process-wrapper {
padding: 0 1%;
}
}
@media (max-width: 991px) {
.home2-process-section .process-wrapper {
padding: 0 10px;
}
}
@media (max-width: 576px) {
.home2-process-section .process-wrapper {
padding: 0;
}
}
.home2-process-section .process-wrapper .process-slider-wrap {
position: relative;
}
.home2-process-section .process-wrapper .process-slider-wrap::before {
content: "";
position: absolute;
top: 19%;
left: 50%;
transform: translateX(-50%);
width: 76%;
height: 1px;
background-color: rgba(var(--black-color-opc), 0.4);
}
@media (max-width: 1199px) {
.home2-process-section .process-wrapper .process-slider-wrap::before {
top: 20.5%;
width: 68%;
}
}
@media (max-width: 991px) {
.home2-process-section .process-wrapper .process-slider-wrap::before {
top: 21%;
width: 50%;
}
}
@media (max-width: 767px) {
.home2-process-section .process-wrapper .process-slider-wrap::before {
top: 19.5%;
}
}
@media (max-width: 576px) {
.home2-process-section .process-wrapper .process-slider-wrap::before {
display: none;
}
}
.home2-process-section .process-wrapper p {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 400;
font-size: 18px;
line-height: 30px;
margin-bottom: 0;
margin-top: 50px;
text-align: center;
}
@media (max-width: 1199px) {
.home2-process-section .process-wrapper p {
margin-top: 40px;
}
}
@media (max-width: 767px) {
.home2-process-section .process-wrapper p {
font-size: 17px;
margin-top: 30px;
}
}
@media (max-width: 576px) {
.home2-process-section .process-wrapper p {
font-size: 16px;
}
}
.home2-process-section .process-wrapper p a {
color: var(--primary-color2);
text-decoration: underline;
font-weight: 500;
transition: 0.5s;
}
.home2-process-section .process-wrapper p a:hover {
color: var(--title-color);
}
.process-card2 {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.process-card2 .step-no {
display: inline-flex;
justify-content: center;
align-items: center;
background-color: var(--white-color);
border: 1px solid var(--black-color);
border-radius: 50px;
padding: 7px 22px;
white-space: nowrap;
position: relative;
transition: 0.5s;
}
.process-card2 .step-no span {
color: var(--title-color);
font-family: var(--font-dmsans);
font-size: 13px;
font-weight: 500;
line-height: 1;
letter-spacing: 0.51px;
transition: 0.5s;
}
.process-card2 .step-no::before {
content: "";
position: absolute;
bottom: -8px;
left: 50%;
transform: translateX(-50%) rotate(45deg);
width: 15px;
height: 15px;
background-color: var(--white-color);
border: 1px solid var(--black-color);
border-radius: 0 0 4px 0;
border-top: unset;
border-left: unset;
transition: 0.5s;
}
.process-card2 .dot {
position: relative;
display: flex;
padding: 55px 0 50px;
}
@media (max-width: 991px) {
.process-card2 .dot {
padding: 45px 0 40px;
}
}
.process-card2 .dot .line {
position: absolute;
top: 54%;
left: 50%;
transform: translate(-50%, -50%);
fill: rgba(var(--black-color-opc), 0.2);
}
@media (max-width: 991px) {
.process-card2 .dot .line {
height: 100px;
}
}
.process-card2 .dot span {
width: 20px;
height: 20px;
border-radius: 50%;
background-color: #eebdaf;
display: inline-flex;
position: relative;
z-index: 1;
}
.process-card2 .dot span::before {
content: "";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 12px;
height: 12px;
background-color: var(--black-color);
border-radius: 50%;
z-index: -1;
}
.process-card2 .process-content-wrap {
position: relative;
z-index: 1;
background-color: rgba(var(--black-color-opc), 0.1);
display: flex;
padding: 1px;
clip-path: polygon(91% 0, 100% 9%, 100% 100%, 0 100%, 0 0);
border-radius: 5px;
}
.process-card2 .process-content-wrap .process-content {
background-color: #f9f6ff;
border-radius: 5px;
padding: 34px 35px 0;
clip-path: polygon(91% 0, 100% 9%, 100% 100%, 0 100%, 0 0);
text-align: center;
}
@media (max-width: 1699px) {
.process-card2 .process-content-wrap .process-content {
padding: 34px 28px 0;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.process-card2 .process-content-wrap .process-content {
padding: 34px 16px 0;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.process-card2 .process-content-wrap .process-content {
padding: 30px 15px 0;
}
}
@media (max-width: 1199px) {
.process-card2 .process-content-wrap .process-content {
padding: 34px 20px 0;
}
}
@media (max-width: 991px) {
.process-card2 .process-content-wrap .process-content {
padding: 25px 20px 0;
}
}
@media (max-width: 767px) {
.process-card2 .process-content-wrap .process-content {
padding: 24px 15px 0;
}
}
.process-card2 .process-content-wrap .process-content h4 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 25px;
line-height: 30px;
margin-bottom: 20px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.process-card2 .process-content-wrap .process-content h4 {
font-size: 24px;
}
}
@media (max-width: 1399px) {
.process-card2 .process-content-wrap .process-content h4 {
font-size: 23px;
}
}
@media (max-width: 1199px) {
.process-card2 .process-content-wrap .process-content h4 {
margin-bottom: 15px;
}
}
@media (max-width: 991px) {
.process-card2 .process-content-wrap .process-content h4 {
font-size: 22px;
}
}
@media (max-width: 767px) {
.process-card2 .process-content-wrap .process-content h4 {
font-size: 22px;
}
}
@media (max-width: 576px) {
.process-card2 .process-content-wrap .process-content h4 {
font-size: 21px;
}
}
.process-card2 .process-content-wrap .process-content p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 16px;
line-height: 26px;
margin-bottom: 25px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.process-card2 .process-content-wrap .process-content p {
font-size: 15px;
}
}
@media (max-width: 1199px) {
.process-card2 .process-content-wrap .process-content p {
margin-bottom: 20px;
}
}
@media (min-width: 576px) and (max-width: 768px) {
.process-card2 .process-content-wrap .process-content p {
font-size: 14px;
}
}
.process-card2 .process-content-wrap .process-content .icon {
width: 90px;
height: 94px;
background-color: #eae7f0;
border-radius: 100px 100px 0 0;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto;
}
.process-card2 .process-content-wrap .process-content .icon svg {
fill: rgba(var(--black-color-opc), 0.5);
transition: 0.5s;
height: 60px;
width: 60px;
}
.process-card2:hover .step-no {
border-color: var(--primary-color2);
background-color: var(--black-color);
}
.process-card2:hover .step-no span {
color: var(--white-color);
}
.process-card2:hover .step-no::before {
border-color: var(--primary-color2);
background-color: var(--black-color);
}
.process-card2:hover .process-content-wrap .process-content .icon svg {
animation: bounceIn 1.2s linear;
}
.process-card2.two {
max-width: 340px;
width: 100%;
justify-content: start;
}
@media (max-width: 991px) {
.process-card2.two {
max-width: unset;
}
}
.process-card2.two .step-no {
background-color: var(--primary-color4);
border: 1px solid var(--primary-color3);
z-index: 5;
}
.process-card2.two .step-no span {
color: var(--white-color);
}
.process-card2.two .step-no::before {
background-color: var(--primary-color4);
border: 1px solid var(--primary-color3);
border-top: unset;
border-left: unset;
}
.process-card2.two .dot {
padding: 0;
padding-top: 60px;
z-index: 4;
margin-bottom: -12px;
}
.process-card2.two .dot::before {
content: "";
position: absolute;
top: 0;
left: 49%;
transform: translateX(-50%);
width: 1px;
height: 70px;
background-color: rgba(var(--primary-color3-opc), 0.2);
z-index: -1;
}
.process-card2.two .dot span {
background-color: var(--primary-color3);
}
.process-card2.two .dot span::before {
background-color: var(--white-color);
}
.process-card2.two .process-content-wrap .process-content {
background-color: #fbfbf6;
padding: 0 35px 34px;
}
@media (max-width: 1699px) {
.process-card2.two .process-content-wrap .process-content {
padding: 0 28px 34px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.process-card2.two .process-content-wrap .process-content {
padding: 0 16px 34px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.process-card2.two .process-content-wrap .process-content {
padding: 0 36px 30px;
}
}
@media (max-width: 1199px) {
.process-card2.two .process-content-wrap .process-content {
padding: 0 15px 34px;
}
}
@media (max-width: 991px) {
.process-card2.two .process-content-wrap .process-content {
padding: 0 15px 25px;
}
}
@media (max-width: 767px) {
.process-card2.two .process-content-wrap .process-content {
padding: 0 15px 24px;
}
}
.process-card2.two .process-content-wrap .process-content .icon {
border-radius: 0 0 100px 100px;
height: 100px;
background-color: var(--primary-color4);
border: 2px solid rgba(251, 251, 246, 0.2);
margin-bottom: 20px;
}
.process-card2.two .process-content-wrap .process-content .icon svg {
fill: #fbfbf6;
width: 36px;
height: 50px;
}
.process-card2.two .process-content-wrap .process-content h4 {
color: var(--title-color2);
}
.process-card2.two .process-content-wrap .process-content p {
color: rgba(var(--title-color2-opc), 0.7);
margin-bottom: 0;
}
.process-card2.two:hover .step-no {
background-color: var(--primary-color3);
}
.process-card2.two:hover .step-no::before {
background-color: var(--primary-color3);
} .home2-why-choose-us-section {
padding: 90px 0;
position: relative;
}
@media (max-width: 767px) {
.home2-why-choose-us-section {
padding: 70px 0;
}
}
.home2-why-choose-us-section .contact-btn {
width: 234px;
height: 90px;
border: 1px solid rgba(var(--black-color-opc), 0.1);
border-radius: 100%;
display: flex;
align-items: center;
justify-content: center;
transition: 0.5s;
}
.home2-why-choose-us-section .contact-btn .primary-btn2 span {
background: linear-gradient(to bottom, var(--title-color) 0%, var(--title-color) 98%);
background-repeat: no-repeat;
background-size: 100% 1px;
background-position: left 100%;
transition: background-size 0.75s;
}
.home2-why-choose-us-section .contact-btn:hover {
box-shadow: inset 0 0 0 10em var(--primary-color2);
border-color: var(--primary-color2);
}
.home2-why-choose-us-section .contact-btn:hover .primary-btn2 {
color: var(--white-color);
}
.home2-why-choose-us-section .contact-btn:hover .primary-btn2 .arrow {
fill: rgba(var(--black-color-opc), 0.15);
}
.home2-why-choose-us-section .contact-btn:hover .primary-btn2 span {
background-size: 0 1px;
background-position: 0% 100%;
}
.home2-why-choose-us-section .faq-content .accordion .accordion-item {
border: none;
background-color: transparent;
}
.home2-why-choose-us-section .faq-content .accordion .accordion-item:first-child .accordion-header .accordion-button {
border-top: 1px solid rgba(var(--black-color-opc), 0.1);
}
.home2-why-choose-us-section .faq-content .accordion .accordion-item .accordion-header .accordion-button {
border: none;
border-radius: unset;
box-shadow: none;
color: var(--title-color);
font-family: var(--font-manrope);
background-color: transparent;
font-size: 20px;
font-weight: 500;
line-height: 1.4;
text-transform: capitalize;
padding: 0;
padding-bottom: 15px;
padding-top: 15px;
border-bottom: 1px solid rgba(var(--black-color-opc), 0.1);
display: flex;
align-items: center;
gap: 35px;
}
.home2-why-choose-us-section .faq-content .accordion .accordion-item .accordion-header .accordion-button span {
font-size: 18px;
max-width: 283px;
width: 100%;
}
@media (max-width: 991px) {
.home2-why-choose-us-section .faq-content .accordion .accordion-item .accordion-header .accordion-button span {
width: unset;
}
}
@media (max-width: 576px) {
.home2-why-choose-us-section .faq-content .accordion .accordion-item .accordion-header .accordion-button span {
font-size: 17px;
}
}
.home2-why-choose-us-section .faq-content .accordion .accordion-item .accordion-header .accordion-button::after {
width: unset;
height: unset;
content: "\f4fe";
font-family: bootstrap-icons;
background-image: none;
font-weight: 800;
font-size: 22px;
}
.home2-why-choose-us-section .faq-content .accordion .accordion-item .accordion-header .accordion-button:not(.collapsed) {
background-color: unset;
}
.home2-why-choose-us-section .faq-content .accordion .accordion-item .accordion-header .accordion-button:not(.collapsed)::after {
content: "\f2ea";
}
@media (max-width: 1399px) {
.home2-why-choose-us-section .faq-content .accordion .accordion-item .accordion-header .accordion-button {
gap: 30px;
}
}
@media (max-width: 1199px) {
.home2-why-choose-us-section .faq-content .accordion .accordion-item .accordion-header .accordion-button {
gap: 25px;
}
}
@media (max-width: 991px) {
.home2-why-choose-us-section .faq-content .accordion .accordion-item .accordion-header .accordion-button {
gap: 20px;
}
}
@media (max-width: 767px) {
.home2-why-choose-us-section .faq-content .accordion .accordion-item .accordion-header .accordion-button {
font-size: 19px;
}
}
@media (max-width: 576px) {
.home2-why-choose-us-section .faq-content .accordion .accordion-item .accordion-header .accordion-button {
font-size: 17px;
gap: 10px;
}
}
.home2-why-choose-us-section .faq-content .accordion .accordion-item .accordion-body {
padding: 10px 50px 10px 0;
padding-bottom: 15px;
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 16px;
font-weight: 400;
line-height: 1.9;
letter-spacing: 0.48px;
display: flex;
align-items: center;
gap: 35px;
border-bottom: 1px solid rgba(var(--black-color-opc), 0.1);
}
.home2-why-choose-us-section .faq-content .accordion .accordion-item .accordion-body img {
max-width: 283px;
}
@media (max-width: 1399px) {
.home2-why-choose-us-section .faq-content .accordion .accordion-item .accordion-body {
gap: 30px;
}
}
@media (max-width: 1199px) {
.home2-why-choose-us-section .faq-content .accordion .accordion-item .accordion-body {
padding: 10px 30px 10px 0;
gap: 25px;
}
}
@media (max-width: 991px) {
.home2-why-choose-us-section .faq-content .accordion .accordion-item .accordion-body {
gap: 20px;
flex-wrap: wrap;
}
}
@media (max-width: 767px) {
.home2-why-choose-us-section .faq-content .accordion .accordion-item .accordion-body {
gap: 15px;
}
}
@media (max-width: 576px) {
.home2-why-choose-us-section .faq-content .accordion .accordion-item .accordion-body {
font-size: 14px;
padding: 10px 0;
}
}
.home2-why-choose-us-section::before {
content: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home2/home2-why-choose-us-vector.svg);
position: absolute;
bottom: 0;
left: 0;
}
.home2-why-choose-us-section.two {
background-image: unset;
padding: 0;
}
.home2-why-choose-us-section.two::before {
display: none;
} .team-card {
position: relative;
overflow: hidden;
z-index: 1;
}
.team-card img {
transition: all 0.5s ease-out;
}
.team-card .social-btn {
position: absolute;
top: 10px;
right: 10px;
transition: 0.5s;
z-index: 2;
}
.team-card .social-btn .icon {
width: 28px;
height: 28px;
border-radius: 50%;
background-color: var(--white-color);
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
}
.team-card .social-btn .icon i {
font-size: 25px;
color: var(--title-color);
}
.team-card .social-btn .social-area {
display: flex;
align-items: center;
transition: 0.5s;
transform-origin: right;
position: absolute;
top: 50%;
right: 40px;
opacity: 0;
transform: translateY(-50%) scaleX(0);
}
.team-card .social-btn .social-area .icon {
width: 28px;
height: 28px;
border-radius: 50%;
border: 1px solid var(--black-color);
display: flex;
align-items: center;
justify-content: center;
transition: 0.5s;
}
.team-card .social-btn .social-area .icon span {
width: 20px;
height: 20px;
border-radius: 50%;
background-color: var(--black-color);
display: flex;
align-items: center;
justify-content: center;
transition: 0.5s;
}
.team-card .social-btn .social-area .icon span i {
color: var(--white-color);
font-size: 14px;
transition: 0.5s;
}
.team-card .social-btn .social-area .icon span i.bi-twitter-x {
font-size: 10px;
}
.team-card .social-btn .social-area .icon span svg {
fill: var(--white-color);
width: 10px;
transition: 0.5s;
}
.team-card .social-btn .social-area > span {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 14px;
line-height: 1;
display: inline-flex;
justify-content: center;
padding: 6px 13px;
border-radius: 50px;
background-color: var(--white-color);
border: 1px solid rgba(var(--black-color-opc), 0.5);
position: relative;
transition: 0.5s;
min-width: 92px;
}
.team-card .social-btn .social-area > span::before {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
right: -1px;
width: 1px;
height: 28px;
background-color: var(--black-color);
transition: 0.5s;
}
.team-card .social-btn .social-area:hover .icon {
border-color: var(--primary-color2);
background-color: var(--primary-color2);
}
.team-card .social-btn .social-area:hover .icon span {
background-color: var(--white-color);
}
.team-card .social-btn .social-area:hover .icon span i {
color: var(--primary-color2);
}
.team-card .social-btn .social-area:hover .icon span svg {
fill: var(--primary-color5);
}
.team-card .social-btn .social-area:hover > span {
background-color: var(--primary-color2);
border-color: var(--primary-color2);
color: var(--white-color);
}
.team-card .social-btn .social-area:hover > span::before {
background-color: var(--primary-color2);
}
.team-card .social-btn:hover .social-area {
opacity: 1;
transform: translateY(-50%) scaleX(1);
}
.team-card .team-content-wrap {
background-color: rgba(var(--black-color-opc), 0.2);
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
padding: 25px 30px;
display: flex;
align-items: end;
}
@media (max-width: 1399px) {
.team-card .team-content-wrap {
padding: 25px 25px;
}
}
@media (max-width: 767px) {
.team-card .team-content-wrap {
padding: 20px 20px;
}
}
.team-card .team-content-wrap .team-content span {
color: var(--title-color);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 14px;
line-height: 1;
display: inline-flex;
padding: 3px 6px;
background-color: var(--white-color);
margin-bottom: 5px;
}
@media (min-width: 576px) and (max-width: 768px) {
.team-card .team-content-wrap .team-content span {
font-size: 13px;
}
}
.team-card .team-content-wrap .team-content h5 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 22px;
line-height: 1.3;
margin-bottom: 0;
background-color: var(--white-color);
padding: 2px 9px;
}
@media (max-width: 1399px) {
.team-card .team-content-wrap .team-content h5 {
font-size: 21px;
}
}
@media (min-width: 576px) and (max-width: 768px) {
.team-card .team-content-wrap .team-content h5 {
font-size: 19px;
}
}
.team-card:hover img {
transform: scale(1.1);
}
.team-card.two::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(var(--black-color-opc), 0.2);
z-index: 2;
}
.team-card.two .team-content-wrap {
padding: 0;
display: block;
height: unset;
top: unset;
bottom: 0;
z-index: 4;
background-color: unset;
}
.team-card.two .team-content-wrap .team-content {
position: relative;
padding: 25px 30px;
z-index: 1;
}
@media (max-width: 1399px) {
.team-card.two .team-content-wrap .team-content {
padding: 25px 25px;
}
}
@media (max-width: 767px) {
.team-card.two .team-content-wrap .team-content {
padding: 20px 20px;
}
}
.team-card.two .team-content-wrap .team-content::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: var(--white-color);
z-index: -1;
transition: 0.5s;
transform: scaleY(1);
opacity: 1;
transform-origin: bottom;
}
.team-card.two .social-btn .social-area:hover .icon {
border-color: var(--primary-color5);
background-color: var(--primary-color5);
}
.team-card.two .social-btn .social-area:hover .icon span {
background-color: var(--white-color);
}
.team-card.two .social-btn .social-area:hover .icon span i {
color: var(--primary-color5);
}
.team-card.two .social-btn .social-area:hover > span {
background-color: var(--primary-color5);
border-color: var(--primary-color5);
color: var(--white-color);
}
.team-card.two .social-btn .social-area:hover > span::before {
background-color: var(--primary-color5);
}
.team-card.two:hover .team-content-wrap .team-content::before {
transform: scaleY(0);
opacity: 0;
}
.team-card.three .social-area:hover .icon {
border-color: var(--primary-color1);
background-color: var(--primary-color1);
}
.team-card.three .social-area:hover .icon span {
background-color: var(--white-color);
}
.team-card.three .social-area:hover .icon span i {
color: var(--primary-color1);
}
.team-card.three .social-area:hover > span {
background-color: var(--primary-color1);
border-color: var(--primary-color1);
color: var(--white-color);
}
.team-card.three .social-area:hover > span::before {
background-color: var(--primary-color1);
}
.home2-team-section .pagination-area .pagination {
position: relative;
display: inline-flex;
align-items: center;
width: unset;
z-index: 9;
bottom: unset;
gap: 8px;
}
@media (max-width: 576px) {
.home2-team-section .pagination-area .pagination {
justify-content: center;
gap: 6px;
}
}
.home2-team-section .pagination-area .pagination .swiper-pagination-bullet {
height: 12px;
width: 12px;
background-color: transparent;
border: 1px solid rgba(63, 68, 75, 0.6);
opacity: 1;
position: relative;
}
.home2-team-section .pagination-area .pagination .swiper-pagination-bullet::after {
content: "";
height: 6px;
width: 6px;
border-radius: 50%;
background-color: rgba(var(--black-color-opc), 0.4);
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.home2-team-section .pagination-area .pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
border-color: var(--black-color);
height: 16px;
width: 16px;
}
.home2-team-section .pagination-area .pagination .swiper-pagination-bullet.swiper-pagination-bullet-active::after {
width: 8px;
height: 8px;
background-color: var(--black-color);
} .home2-video-banner-section {
padding: 0 35px;
}
@media (max-width: 1399px) {
.home2-video-banner-section {
padding: 0 25px;
}
}
@media (max-width: 1199px) {
.home2-video-banner-section {
padding: 0 20px;
}
}
@media (max-width: 991px) {
.home2-video-banner-section {
padding: 0 15px;
}
}
@media (max-width: 767px) {
.home2-video-banner-section {
padding: 0 10px;
}
}
.home2-video-banner-section .banner-wrapper {
position: relative;
border-radius: 30px;
min-height: 650px;
}
@media (max-width: 1199px) {
.home2-video-banner-section .banner-wrapper {
height: 550px;
}
}
@media (max-width: 991px) {
.home2-video-banner-section .banner-wrapper {
border-radius: 25px;
}
}
@media (max-width: 767px) {
.home2-video-banner-section .banner-wrapper {
border-radius: 20px;
height: 500px;
}
}
@media (max-width: 576px) {
.home2-video-banner-section .banner-wrapper {
border-radius: 10px;
height: 400px;
}
}
.home2-video-banner-section .banner-wrapper img {
border-radius: 30px;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
@media (max-width: 991px) {
.home2-video-banner-section .banner-wrapper img {
border-radius: 25px;
}
}
@media (max-width: 767px) {
.home2-video-banner-section .banner-wrapper img {
border-radius: 20px;
}
}
@media (max-width: 576px) {
.home2-video-banner-section .banner-wrapper img {
border-radius: 10px;
}
}
.home2-video-banner-section .banner-wrapper::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(var(--black-color-opc), 0.3);
border-radius: 30px;
}
@media (max-width: 991px) {
.home2-video-banner-section .banner-wrapper::before {
border-radius: 25px;
}
}
@media (max-width: 767px) {
.home2-video-banner-section .banner-wrapper::before {
border-radius: 20px;
}
}
@media (max-width: 576px) {
.home2-video-banner-section .banner-wrapper::before {
border-radius: 10px;
}
}
.home2-video-banner-section .banner-wrapper .circular-text2 {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 9;
min-width: 120px;
height: 120px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--white-color);
}
.home2-video-banner-section .banner-wrapper .circular-text2 .center-icon {
width: 65px;
height: 65px;
border-radius: 50%;
background-color: #6a6b6b;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 1;
}
.home2-video-banner-section .banner-wrapper .circular-text2 .center-icon svg {
fill: var(--white-color);
margin-left: 5px;
}
.home2-video-banner-section .banner-wrapper .circular-text2 .text {
position: absolute;
width: 100%;
height: 100%;
animation: textRotation 8s linear infinite;
}
.home2-video-banner-section .banner-wrapper .circular-text2 .text span {
position: absolute;
left: 50%;
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 13px;
font-weight: 700;
transform-origin: 0 60px;
}
.home2-video-banner-section .logo-section {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
}
.logo-section {
padding: 30px 12%;
background-color: rgba(var(--black-color-opc), 0.3);
-webkit-backdrop-filter: blur(4px);
backdrop-filter: blur(4px);
border-radius: 0 0 30px 30px;
}
@media (max-width: 1799px) {
.logo-section {
padding: 30px 12%;
}
}
@media (max-width: 1699px) {
.logo-section {
padding: 30px 10%;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.logo-section {
padding: 30px 8%;
}
}
@media (max-width: 1399px) {
.logo-section {
padding: 30px 6%;
}
}
@media (max-width: 1199px) {
.logo-section {
padding: 30px 3%;
}
}
@media (max-width: 991px) {
.logo-section {
padding: 30px 2%;
border-radius: 0 0 25px 25px;
}
}
@media (max-width: 767px) {
.logo-section {
border-radius: 0 0 20px 20px;
}
}
@media (max-width: 576px) {
.logo-section {
padding: 30px 10px;
border-radius: 0 0 10px 10px;
}
}
.logo-section .logo-wrap {
display: flex;
align-items: center;
gap: 30px;
}
@media (max-width: 576px) {
.logo-section .logo-wrap {
flex-wrap: wrap;
gap: 20px;
}
}
.logo-section .logo-wrap .logo-title {
padding-right: 25px;
border-right: 1px solid rgba(255, 255, 255, 0.3);
min-width: 200px;
}
@media (max-width: 1199px) {
.logo-section .logo-wrap .logo-title {
min-width: 165px;
padding-right: 15px;
}
}
@media (max-width: 576px) {
.logo-section .logo-wrap .logo-title {
padding-right: 0;
border-right: unset;
}
}
.logo-section .logo-wrap .logo-title h6 {
color: var(--white-color);
font-family: var(--font-manrope);
font-size: 17px;
font-weight: 500;
line-height: 1.4;
letter-spacing: 0.03em;
text-transform: uppercase;
margin-bottom: 0;
}
.logo-section .logo-wrap .marquee {
display: flex;
gap: 80px;
overflow: hidden;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.logo-section .logo-wrap .marquee .marquee__group {
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: space-around;
gap: 80px;
min-width: 100%;
animation: scroll-x 30s linear infinite;
}
@media (max-width: 1199px) {
.logo-section .logo-wrap .marquee .marquee__group {
gap: 40px;
}
}
@media (max-width: 576px) {
.logo-section .logo-wrap .marquee .marquee__group {
gap: 30px;
}
}
.logo-section .logo-wrap .marquee .marquee__group a img {
width: 104px;
}
@media (max-width: 991px) {
.logo-section .logo-wrap .marquee .marquee__group a img {
width: 95px;
}
}
@keyframes scroll-x {
from {
transform: translateX(0);
}
to {
transform: translateX(-100%);
}
}
.logo-section.two {
position: relative;
background-color: rgba(var(--primary-color2-opc), 0.1);
padding: 45px 10%;
}
@media (max-width: 1799px) {
.logo-section.two {
padding: 45px 8%;
}
}
@media (max-width: 1699px) {
.logo-section.two {
padding: 45px 6%;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.logo-section.two {
padding: 45px 3%;
}
}
@media (max-width: 1399px) {
.logo-section.two {
padding: 40px 2%;
}
}
@media (max-width: 576px) {
.logo-section.two {
padding: 40px 0;
}
}
.logo-section.two .logo-wrap .logo-title {
border-right: 1px solid rgba(var(--black-color-opc), 0.1);
}
.logo-section.two .logo-wrap .logo-title h6 {
color: var(--title-color);
}
.logo-section.three {
background-color: transparent;
padding: 20px 10% 0 70px;
}
@media (max-width: 1799px) {
.logo-section.three {
padding: 20px 8% 0 70px;
}
}
@media (max-width: 1699px) {
.logo-section.three {
padding: 20px 6% 0 50px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.logo-section.three {
padding: 20px 3% 0 40px;
}
}
@media (max-width: 1399px) {
.logo-section.three {
padding: 20px 2% 0 40px;
}
}
@media (max-width: 1199px) {
.logo-section.three {
padding: 20px 20px 0;
}
}
@media (max-width: 767px) {
.logo-section.three {
padding: 20px 10px 0;
}
}
@media (max-width: 576px) {
.logo-section.three {
padding: 20px 0 0;
}
}
.logo-section.three .logo-wrap .logo-title {
border-right: 1px solid rgba(var(--black-color-opc), 0.1);
}
.logo-section.three .logo-wrap .logo-title h6 {
color: var(--title-color);
}
.logo-section.four {
padding: 0;
background-color: transparent;
} .contact-form-wrap {
padding: 45px 50px;
background-color: #ffffff;
border-radius: 20px;
margin-left: 50px;
}
@media (max-width: 1399px) {
.contact-form-wrap {
padding: 45px 40px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.contact-form-wrap {
padding: 40px 30px;
margin-left: 20px;
}
}
@media (max-width: 991px) {
.contact-form-wrap {
margin-left: 0;
}
}
@media (max-width: 767px) {
.contact-form-wrap {
padding: 40px 30px;
border-radius: 15px;
}
}
@media (max-width: 576px) {
.contact-form-wrap {
padding: 35px 20px;
}
}
.contact-form-wrap .form-inner textarea {
min-height: 90px;
resize: vertical;
}
.contact-form-wrap .form-inner .wpcf7-textarea {
height: 90px;
}
.contact-form-wrap button {
margin-top: 40px;
}
@media (max-width: 576px) {
.contact-form-wrap button {
margin-top: 30px;
}
}
.contact-form-wrap .primary-btn3 {
margin-top: 45px;
}
@media (max-width: 576px) {
.contact-form-wrap .primary-btn3 {
margin-top: 35px;
}
}
.contact-form-wrap .primary-btn3 span {
width: unset;
}
.contact-form-wrap.two {
background-color: var(--white-color);
}
.contact-form-wrap.three {
background-color: var(--white-color);
}
.contact-form-wrap.three .form-inner label {
color: var(--title-color2);
}
.contact-form-wrap.three .form-inner input:focus,
.contact-form-wrap.three .form-inner textarea:focus {
border-color: var(--primary-color4);
}
.contact-form-wrap.three .form-inner2 .form-check .form-check-input:checked {
background-color: var(--primary-color3);
border-color: var(--primary-color3);
}
.contact-form-wrap.three .form-inner2 .form-check .form-check-label {
color: rgba(var(--title-color2-opc), 0.5);
}
@media (min-width: 992px) and (max-width: 1199px) {
.home2-contact-section .section-title h2 {
font-size: 45px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home2-contact-section .faq-wrap .accordion .accordion-item .accordion-header .accordion-button {
font-size: 15px;
}
} .home2-testimonial-section {
padding: 100px 0;
position: relative;
overflow: hidden;
}
@media (max-width: 1199px) {
.home2-testimonial-section {
padding: 90px 0;
}
}
@media (max-width: 991px) {
.home2-testimonial-section {
padding: 70px 0;
}
}
.home2-testimonial-section .testimonial-title-area .section-title h2 {
font-size: 58px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home2-testimonial-section .testimonial-title-area .section-title h2 {
font-size: 56px;
}
}
@media (max-width: 1399px) {
.home2-testimonial-section .testimonial-title-area .section-title h2 {
font-size: 50px;
}
}
@media (max-width: 1199px) {
.home2-testimonial-section .testimonial-title-area .section-title h2 {
font-size: 48px;
}
}
@media (max-width: 991px) {
.home2-testimonial-section .testimonial-title-area .section-title h2 {
font-size: 42px;
}
}
@media (max-width: 767px) {
.home2-testimonial-section .testimonial-title-area .section-title h2 {
font-size: 38px;
line-height: 1.2;
}
}
@media (max-width: 576px) {
.home2-testimonial-section .testimonial-title-area .section-title h2 {
font-size: 34px;
line-height: 1.3;
}
}
.home2-testimonial-section .testimonial-title-area .section-title p {
padding-top: 40px;
}
@media (max-width: 1199px) {
.home2-testimonial-section .testimonial-title-area .section-title p {
padding-top: 25px;
}
}
.home2-testimonial-section .testimonial-title-area .rating-list {
padding: 0;
margin: 0;
list-style: none;
margin-top: 70px;
display: flex;
align-items: center;
gap: 20px;
flex-wrap: wrap;
}
@media (max-width: 991px) {
.home2-testimonial-section .testimonial-title-area .rating-list {
margin-top: 30px;
}
}
.home2-testimonial-section .testimonial-title-area .rating-list li .single-rating {
padding: 8px 10px;
background-color: rgba(var(--black-color-opc), 0.6);
border-radius: 10px;
display: block;
text-align: center;
}
.home2-testimonial-section .testimonial-title-area .rating-list li .single-rating h6 {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 500;
font-size: 18px;
line-height: 1.4;
margin-bottom: 10px;
}
.home2-testimonial-section .testimonial-title-area .rating-list li .single-rating .review {
padding: 2px 13px 2px 3px;
border-radius: 100px;
border: 1px solid rgba(255, 255, 255, 0.3);
display: flex;
align-items: center;
gap: 20px;
}
.home2-testimonial-section .testimonial-title-area .rating-list li .single-rating .review .logo {
padding: 3px 6px;
background-color: #1b2533;
border-radius: 100px;
min-width: 64px;
line-height: 1;
}
.home2-testimonial-section .testimonial-title-area .rating-list li .single-rating .review span {
color: var(--white-color);
font-family: var(--font-dmsans);
font-weight: 500;
font-size: 12px;
line-height: 1.5;
}
.home2-testimonial-section .slider-btn-grp {
position: absolute;
top: 50%;
transform: translateY(-50%) rotate(90deg);
right: 7%;
}
@media (max-width: 1799px) {
.home2-testimonial-section .slider-btn-grp {
right: 4%;
}
}
@media (max-width: 1699px) {
.home2-testimonial-section .slider-btn-grp {
right: 2%;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home2-testimonial-section .slider-btn-grp {
right: -45px;
}
}
@media (max-width: 1399px) {
.home2-testimonial-section .slider-btn-grp {
right: -42px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home2-testimonial-section .slider-btn-grp .slider-btn {
min-width: 38px;
max-width: 38px;
height: 38px;
}
.home2-testimonial-section .slider-btn-grp .slider-btn i {
font-size: 18px;
}
}
@media (max-width: 1199px) {
.home2-testimonial-section .slider-btn-grp {
position: relative;
top: unset;
right: unset;
transform: unset;
justify-content: center;
padding-top: 30px;
}
}
.home2-testimonial-section .home2-testimonial-slider .swiper-slide-active .quote,
.home2-testimonial-section .home2-testimonial-slider .swiper-slide-active span,
.home2-testimonial-section .home2-testimonial-slider .swiper-slide-active p {
animation: fadeInDown 1.7s;
}
.home2-testimonial-section .home2-testimonial-slider .swiper-slide-active .author-area {
animation: fadeInUp 1.7s;
} .home2-certification-section .section-title h2 {
font-size: 40px;
font-weight: 600;
}
@media (max-width: 767px) {
.home2-certification-section .section-title h2 {
font-size: 36px;
line-height: 1.2;
}
}
@media (max-width: 576px) {
.home2-certification-section .section-title h2 {
font-size: 34px;
line-height: 1.3;
}
}
.home2-certification-section .certificate-card {
padding: 25px 30px;
background-color: #f8f8f8;
border: 1px solid var(--borders-color);
border-radius: 10px;
position: relative;
}
@media (max-width: 1399px) {
.home2-certification-section .certificate-card {
padding: 25px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home2-certification-section .certificate-card {
padding: 25px 15px;
}
}
@media (max-width: 767px) {
.home2-certification-section .certificate-card {
padding: 25px 20px;
}
}
.home2-certification-section .certificate-card .certificate-logo {
margin-bottom: 38px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home2-certification-section .certificate-card .certificate-logo img {
width: 80px;
height: 80px;
}
}
.home2-certification-section .certificate-card h6 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 16px;
line-height: 26px;
margin-bottom: 0;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home2-certification-section .certificate-card h6 {
font-size: 15px;
}
}
.home2-certification-section .certificate-card .tag {
color: var(--primary-color2);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 15px;
line-height: 1;
position: absolute;
top: 25px;
right: 17px;
}
.home2-certification-section .certificate-card .vector {
fill: none;
stroke: var(--borders-color);
position: absolute;
top: 0;
right: 0;
} .home3-banner-section {
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home3/home3-banner-bg.png);
background-size: cover;
background-repeat: no-repeat;
padding: 145px 150px 0 140px;
}
@media (max-width: 1899px) {
.home3-banner-section {
padding: 145px 105px 0 100px;
}
}
@media (max-width: 1799px) {
.home3-banner-section {
padding: 145px 60px 0 60px;
}
}
@media (max-width: 1699px) {
.home3-banner-section {
padding: 145px 50px 0 50px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home3-banner-section {
padding: 140px 30px 0 30px;
}
}
@media (max-width: 1399px) {
.home3-banner-section {
padding: 140px 20px 0 20px;
}
}
@media (max-width: 1199px) {
.home3-banner-section {
padding: 130px 10px 0 10px;
}
}
@media (max-width: 576px) {
.home3-banner-section {
padding: 110px 0px 0 0px;
}
}
.home3-banner-section .banner-wrapper {
display: flex;
gap: 50px;
}
@media (max-width: 1699px) {
.home3-banner-section .banner-wrapper {
gap: 35px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home3-banner-section .banner-wrapper {
gap: 25px;
}
}
@media (max-width: 1399px) {
.home3-banner-section .banner-wrapper {
gap: 20px;
}
}
@media (max-width: 1199px) {
.home3-banner-section .banner-wrapper {
gap: 15px;
}
}
.home3-banner-section .banner-img {
position: relative;
z-index: 1;
}
@media (max-width: 991px) {
.home3-banner-section .banner-img {
display: none;
}
}
.home3-banner-section .banner-img img {
min-width: 710px;
max-width: 710px;
height: 710px;
border-radius: 50%;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home3-banner-section .banner-img img {
min-width: 600px;
max-width: 600px;
height: 600px;
}
}
@media (max-width: 1399px) {
.home3-banner-section .banner-img img {
min-width: 550px;
max-width: 550px;
height: 550px;
}
}
@media (max-width: 1199px) {
.home3-banner-section .banner-img img {
min-width: 430px;
max-width: 430px;
height: 430px;
}
}
.home3-banner-section .banner-content {
padding-top: 55px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home3-banner-section .banner-content {
padding-top: 45px;
}
}
@media (max-width: 1399px) {
.home3-banner-section .banner-content {
padding-top: 35px;
}
}
@media (max-width: 1199px) {
.home3-banner-section .banner-content {
padding-top: 20px;
}
}
.home3-banner-section .banner-content > span {
color: var(--primary-color2);
font-family: var(--font-dmsans);
font-weight: 500;
font-size: 13px;
line-height: 1;
letter-spacing: 0.08em;
text-transform: uppercase;
padding: 9px 18px;
border-radius: 100px;
background-color: rgba(var(--primary-color2-opc), 0.1);
display: inline-block;
margin-bottom: 5px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home3-banner-section .banner-content > span {
font-size: 12px;
}
}
@media (max-width: 576px) {
.home3-banner-section .banner-content > span {
font-size: 12px;
padding: 9px 14px;
}
}
.home3-banner-section .banner-content h1 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 700;
font-size: 80px;
line-height: 1.2;
margin-bottom: 45px;
}
.home3-banner-section .banner-content h1 span {
color: var(--primary-color2);
font-weight: 600;
}
@media (max-width: 1799px) {
.home3-banner-section .banner-content h1 {
font-size: 78px;
}
}
@media (max-width: 1699px) {
.home3-banner-section .banner-content h1 {
font-size: 70px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home3-banner-section .banner-content h1 {
font-size: 65px;
margin-bottom: 35px;
}
}
@media (max-width: 1399px) {
.home3-banner-section .banner-content h1 {
font-size: 55px;
margin-bottom: 30px;
}
}
@media (max-width: 1199px) {
.home3-banner-section .banner-content h1 {
font-size: 48px;
margin-bottom: 25px;
}
}
@media (max-width: 576px) {
.home3-banner-section .banner-content h1 {
font-size: 38px;
margin-bottom: 25px;
}
}
.home3-banner-section .banner-content .video-and-content {
padding-left: 66px;
display: flex;
align-items: center;
gap: 50px;
margin-bottom: 60px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home3-banner-section .banner-content .video-and-content {
padding-left: 40px;
gap: 35px;
margin-bottom: 50px;
}
}
@media (max-width: 1399px) {
.home3-banner-section .banner-content .video-and-content {
padding-left: 30px;
margin-bottom: 40px;
gap: 25px;
}
}
@media (max-width: 1199px) {
.home3-banner-section .banner-content .video-and-content {
padding-left: 15px;
gap: 20px;
margin-bottom: 30px;
}
}
@media (max-width: 991px) {
.home3-banner-section .banner-content .video-and-content {
padding-left: 0;
}
}
@media (max-width: 767px) {
.home3-banner-section .banner-content .video-and-content {
gap: 20px;
}
}
@media (max-width: 576px) {
.home3-banner-section .banner-content .video-and-content {
flex-wrap: wrap;
gap: 15px;
margin-bottom: 20px;
}
}
.home3-banner-section .banner-content .video-and-content .video-area {
cursor: pointer;
display: inline-block;
}
.home3-banner-section .banner-content .video-and-content .video-area .icon {
position: relative;
}
.home3-banner-section .banner-content .video-and-content .video-area .icon .video-circle {
stroke: var(--primary-color2);
fill: none;
transition: 0.5s;
}
@media (max-width: 576px) {
.home3-banner-section .banner-content .video-and-content .video-area .icon .video-circle {
width: 68px;
}
}
.home3-banner-section .banner-content .video-and-content .video-area .icon .video-circle .top-half {
stroke-dasharray: 430;
stroke-dashoffset: 320;
transition: stroke-dashoffset 0.8s cubic-bezier(0.33, 1, 0.68, 1);
}
.home3-banner-section .banner-content .video-and-content .video-area .icon .play-icon {
fill: var(--primary-color2);
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
margin-left: 2px;
}
@media (max-width: 576px) {
.home3-banner-section .banner-content .video-and-content .video-area .icon .play-icon {
width: 20px;
}
}
.home3-banner-section .banner-content .video-and-content .video-area:hover .icon .video-circle .top-half {
stroke-dashoffset: 0;
}
.home3-banner-section .banner-content .video-and-content .content p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 16px;
font-weight: 400;
line-height: 32px;
margin-bottom: 0;
padding-left: 15px;
position: relative;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home3-banner-section .banner-content .video-and-content .content p {
font-size: 14px;
}
}
@media (max-width: 767px) {
.home3-banner-section .banner-content .video-and-content .content p {
font-size: 15px;
}
}
@media (max-width: 576px) {
.home3-banner-section .banner-content .video-and-content .content p {
padding-left: 0;
}
}
.home3-banner-section .banner-content .video-and-content .content p::before {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 0;
width: 2px;
height: 77px;
background-color: rgba(var(--black-color-opc), 0.3);
}
@media (max-width: 576px) {
.home3-banner-section .banner-content .video-and-content .content p::before {
display: none;
}
}
.home3-banner-section .banner-content .btn-grp {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 35px;
}
@media (max-width: 576px) {
.home3-banner-section .banner-content .btn-grp {
gap: 20px;
}
} .scroll-text-section {
overflow: hidden;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
display: flex;
gap: 25px;
margin-top: -60px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.scroll-text-section {
margin-top: -50px;
}
}
@media (max-width: 1399px) {
.scroll-text-section {
margin-top: -50px;
}
}
@media (max-width: 1199px) {
.scroll-text-section {
margin-top: 30px;
}
}
@media (max-width: 991px) {
.scroll-text-section {
margin-top: 35px;
}
}
.scroll-text-section .scroll-text {
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: space-around;
gap: 25px;
min-width: 100%;
animation: scroll-x 30s linear infinite;
}
.scroll-text-section .scroll-text h6 {
color: rgba(var(--title-color-opc), 0.8);
font-family: var(--font-dmsans);
font-style: italic;
font-size: 18px;
font-weight: 400;
letter-spacing: 1.2px;
line-height: 1;
text-transform: uppercase;
white-space: nowrap;
margin-bottom: 0;
}
.scroll-text-section .scroll-text svg {
fill: var(--title-color);
}
@keyframes scroll-x {
from {
transform: translateX(0);
}
to {
transform: translateX(-100%);
}
}
.scroll-text-section.two {
margin-top: 0;
padding: 40px 0;
background-color: var(--primary-color3);
}
.scroll-text-section.two .scroll-text h6 {
color: rgba(255, 255, 255, 0.8);
font-weight: 500;
}
.scroll-text-section.two .scroll-text svg {
fill: var(--white-color);
} .home3-about-section {
padding-top: 95px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home3-about-section {
padding-top: 75px;
}
}
@media (max-width: 1399px) {
.home3-about-section {
padding-top: 65px;
}
}
@media (max-width: 1199px) {
.home3-about-section {
padding-top: 45px;
}
}
@media (max-width: 991px) {
.home3-about-section {
padding-top: 0;
}
}
.home3-about-section .about-content-wrap .section-title {
margin-bottom: 50px;
}
@media (max-width: 1199px) {
.home3-about-section .about-content-wrap .section-title {
margin-bottom: 40px;
}
}
@media (max-width: 991px) {
.home3-about-section .about-content-wrap .section-title {
margin-bottom: 30px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home3-about-section .about-content-wrap .section-title h2 {
font-size: 47px;
}
}
.home3-about-section .about-content-wrap .section-title p {
position: relative;
padding-top: 0;
margin-left: 70px;
padding-left: 15px;
margin-top: 45px;
line-height: 32px;
}
@media (max-width: 1399px) {
.home3-about-section .about-content-wrap .section-title p {
margin-left: 55px;
margin-top: 35px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home3-about-section .about-content-wrap .section-title p {
margin-left: 25px;
font-size: 15px;
margin-top: 25px;
}
}
@media (max-width: 991px) {
.home3-about-section .about-content-wrap .section-title p {
margin-top: 30px;
}
}
@media (max-width: 576px) {
.home3-about-section .about-content-wrap .section-title p {
margin-top: 20px;
margin-left: 0;
font-size: 15px;
}
}
.home3-about-section .about-content-wrap .section-title p::before {
content: "";
position: absolute;
top: 10px;
left: 0;
width: 2px;
height: 80px;
background-color: rgba(249, 72, 52, 0.7);
}
.home3-about-section .about-content-wrap ul {
padding: 0;
margin: 0;
list-style: none;
}
@media (max-width: 991px) {
.home3-about-section .about-content-wrap ul {
display: flex;
align-items: start;
gap: 30px;
}
}
@media (max-width: 767px) {
.home3-about-section .about-content-wrap ul {
gap: 20px;
}
}
@media (max-width: 576px) {
.home3-about-section .about-content-wrap ul {
flex-wrap: wrap;
}
}
.home3-about-section .about-content-wrap ul li {
display: flex;
gap: 30px;
margin-bottom: 35px;
}
@media (max-width: 1199px) {
.home3-about-section .about-content-wrap ul li {
gap: 20px;
margin-bottom: 25px;
}
}
@media (max-width: 991px) {
.home3-about-section .about-content-wrap ul li {
margin-bottom: 0;
}
}
.home3-about-section .about-content-wrap ul li:last-child {
margin-bottom: 0;
}
.home3-about-section .about-content-wrap ul li:nth-child(2) {
margin-left: 40px;
}
@media (max-width: 1399px) {
.home3-about-section .about-content-wrap ul li:nth-child(2) {
margin-left: 30px;
}
}
@media (max-width: 1199px) {
.home3-about-section .about-content-wrap ul li:nth-child(2) {
margin-left: 10px;
}
}
@media (max-width: 991px) {
.home3-about-section .about-content-wrap ul li:nth-child(2) {
margin-left: 0;
}
}
.home3-about-section .about-content-wrap ul li svg {
fill: rgba(var(--primary-color2-opc), 0.2);
min-width: 100px;
margin-top: -12px;
}
@media (max-width: 991px) {
.home3-about-section .about-content-wrap ul li svg {
display: none;
}
}
.home3-about-section .about-content-wrap ul li .single-content {
max-width: 424px;
width: 100%;
}
.home3-about-section .about-content-wrap ul li .single-content h6 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 700;
font-size: 22px;
line-height: 1.2;
margin-bottom: 15px;
}
@media (max-width: 767px) {
.home3-about-section .about-content-wrap ul li .single-content h6 {
font-size: 21px;
}
}
@media (max-width: 576px) {
.home3-about-section .about-content-wrap ul li .single-content h6 {
font-size: 20px;
margin-bottom: 10px;
}
}
.home3-about-section .about-content-wrap ul li .single-content p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 16px;
line-height: 1.9;
margin-bottom: 0;
}
@media (max-width: 767px) {
.home3-about-section .about-content-wrap ul li .single-content p {
font-size: 15px;
}
}
.home3-about-section .about-img-wrap {
margin-left: 75px;
}
@media (max-width: 1399px) {
.home3-about-section .about-img-wrap {
margin-left: 55px;
}
}
@media (max-width: 1199px) {
.home3-about-section .about-img-wrap {
margin-left: 0;
}
}
.home3-about-section .about-img-wrap .about-img img {
border-radius: 300px 300px 20px 20px;
}
@media (max-width: 991px) {
.home3-about-section .about-img-wrap .about-img img {
border-radius: 350px 350px 20px 20px;
max-height: 620px;
width: 100%;
-o-object-fit: cover;
object-fit: cover;
}
}
@media (max-width: 767px) {
.home3-about-section .about-img-wrap .about-img img {
max-height: 550px;
}
}
.home3-about-section .about-img-wrap .about-btn {
display: flex;
justify-content: center;
margin-top: -28px;
}
.home3-service-section {
background-color: #000;
padding: 100px 0 120px;
}
@media (max-width: 1199px) {
.home3-service-section {
padding: 90px 0 110px;
}
}
@media (max-width: 767px) {
.home3-service-section {
padding: 70px 0 90px;
}
}
.home3-service-section .sevices-wrap {
padding: 0;
margin: 0;
list-style: none;
}
.home3-service-section .sevices-wrap .single-services {
display: flex;
align-items: center;
justify-content: space-between;
gap: 20px;
position: relative;
z-index: 1;
padding: 24px 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.home3-service-section .sevices-wrap .single-services:first-child {
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.home3-service-section .sevices-wrap .single-services:last-child {
border-bottom: unset;
padding-bottom: 0;
}
@media (max-width: 767px) {
.home3-service-section .sevices-wrap .single-services {
flex-direction: column;
align-items: start;
}
}
.home3-service-section .sevices-wrap .single-services .number-and-icon-area {
display: flex;
gap: 20px;
}
.home3-service-section .sevices-wrap .single-services .number-and-icon-area span {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 500;
font-size: 18px;
line-height: 1;
margin-top: 10px;
display: block;
}
.home3-service-section .sevices-wrap .single-services .number-and-icon-area .icon {
min-width: 78px;
max-width: 78px;
height: 78px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background-color: rgba(255, 255, 255, 0.05);
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
}
.home3-service-section .sevices-wrap .single-services .number-and-icon-area .icon svg {
fill: var(--white-color);
}
.home3-service-section .sevices-wrap .single-services .services-img {
width: 247px;
height: 247px;
position: absolute;
top: -150px;
left: 0;
opacity: 0;
z-index: -1;
transition: opacity 0.3s, transform 0.7s cubic-bezier(0.23, 1, 0.32, 1);
border-radius: 5px;
overflow: hidden;
pointer-events: none;
-webkit-mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home3/service-img-bg.png);
mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home3/service-img-bg.png);
-webkit-mask-size: cover;
mask-size: cover;
}
@media (max-width: 991px) {
.home3-service-section .sevices-wrap .single-services .services-img {
display: none;
visibility: hidden;
}
}
.home3-service-section .sevices-wrap .single-services .content {
max-width: 244px;
width: 100%;
}
.home3-service-section .sevices-wrap .single-services .content p {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 22px;
line-height: 32px;
margin-bottom: 0;
}
@media (max-width: 1199px) {
.home3-service-section .sevices-wrap .single-services .content p {
font-size: 20px;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.home3-service-section .sevices-wrap .single-services .content p {
font-size: 19px;
line-height: 28px;
}
}
.home3-service-section .sevices-wrap .single-services .details-btn {
display: flex;
align-items: center;
gap: 5px;
}
.home3-service-section .sevices-wrap .single-services .details-btn span {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
line-height: 1;
text-transform: uppercase;
text-decoration: underline;
display: inline-block;
padding: 14px 28px;
border-radius: 28px;
border: 1px solid rgba(255, 255, 255, 0.2);
transition: 0.5s;
}
.home3-service-section .sevices-wrap .single-services .details-btn .icon {
min-width: 43px;
max-width: 43px;
height: 43px;
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
transition: 0.5s;
}
.home3-service-section .sevices-wrap .single-services .details-btn .icon svg {
fill: rgba(255, 255, 255, 0.15);
transition: 0.5s;
}
.home3-service-section .sevices-wrap .single-services:hover .number-and-icon-area .icon svg {
animation: bounceIn 1.2s linear;
}
.home3-service-section .sevices-wrap .single-services:hover .services-img {
opacity: 1;
}
.home3-service-section .sevices-wrap .single-services:hover .details-btn span {
background-color: var(--primary-color2);
}
.home3-service-section .sevices-wrap .single-services:hover .details-btn .icon {
background-color: var(--primary-color2);
}
.home3-service-section .sevices-wrap .single-services:hover .details-btn .icon svg {
fill: var(--white-color);
} .home3-industry-location-section .industry-location-wrapper {
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home3/industry-location-map.png);
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
min-height: 706px;
position: relative;
}
@media (max-width: 991px) {
.home3-industry-location-section .industry-location-wrapper {
min-height: 650px;
}
}
@media (max-width: 767px) {
.home3-industry-location-section .industry-location-wrapper {
min-height: 600px;
}
}
.home3-industry-location-section .industry-location-wrapper .indicator-area ul {
padding: 0;
margin: 0;
list-style: none;
}
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li {
position: absolute;
}
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li:nth-child(1) {
top: 22%;
left: 12%;
}
@media (max-width: 1199px) {
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li:nth-child(1) {
left: 8%;
}
}
@media (max-width: 991px) {
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li:nth-child(1) {
left: 4%;
top: 20%;
}
}
@media (max-width: 767px) {
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li:nth-child(1) {
left: 2%;
top: 16%;
}
}
@media (max-width: 576px) {
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li:nth-child(1) {
top: 5%;
left: 3%;
}
}
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li:nth-child(2) {
top: unset;
left: 25%;
bottom: 30%;
}
@media (max-width: 1399px) {
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li:nth-child(2) {
left: 18%;
}
}
@media (max-width: 991px) {
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li:nth-child(2) {
left: 14%;
}
}
@media (max-width: 767px) {
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li:nth-child(2) {
left: 6%;
}
}
@media (max-width: 576px) {
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li:nth-child(2) {
display: none;
}
}
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li:nth-child(3) {
bottom: 39%;
left: 52%;
}
@media (max-width: 767px) {
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li:nth-child(3) {
left: 55%;
}
}
@media (max-width: 576px) {
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li:nth-child(3) {
left: 50%;
}
}
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li:nth-child(4) {
top: 20%;
right: 30%;
}
@media (max-width: 991px) {
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li:nth-child(4) {
right: 25%;
}
}
@media (max-width: 576px) {
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li:nth-child(4) {
right: 30%;
}
}
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li:nth-child(5) {
bottom: 18%;
right: 10%;
}
@media (max-width: 1399px) {
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li:nth-child(5) {
right: 7%;
}
}
@media (max-width: 1199px) {
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li:nth-child(5) {
display: none;
}
}
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li .dot-main {
position: relative;
display: inline-block;
cursor: pointer;
}
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li .dot-main .waves {
position: absolute;
width: 25px;
height: 25px;
background: var(--primary-color2);
filter: blur(2px);
opacity: 0;
border-radius: 100%;
right: -16px;
bottom: -8px;
z-index: 1;
animation: waves 3s ease-in-out infinite;
transition: 0.5s;
}
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li .dot-main .waves.wave-1 {
animation-delay: 0s;
}
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li .dot-main .waves.wave-2 {
animation-delay: 1s;
}
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li .dot-main .waves.wave-3 {
animation-delay: 2s;
background: var(--primary-color2);
transition: 0.5s;
}
@keyframes waves {
0% {
transform: scale(0.2, 0.2);
opacity: 0;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}
50% {
opacity: 0.9;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
}
100% {
transform: scale(0.9, 0.9);
opacity: 0;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}
}
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li .single-item {
position: absolute;
left: -16px;
top: -45px;
transform: scale(0);
transition: 0.5s;
z-index: 2;
background-color: var(--white-color);
border-radius: 5px;
display: flex;
align-items: center;
gap: 5px;
padding: 7px 9px;
line-height: 1;
transition: 0.5s;
}
@media (max-width: 1199px) {
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li .single-item {
left: -16px;
top: -45px;
}
}
@media (max-width: 576px) {
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li .single-item {
left: -16px;
top: -45px;
}
}
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li .single-item .flag {
min-width: 24px;
max-width: 24px;
height: 24px;
border-radius: 50%;
border: 0.5px solid var(--black-color);
display: flex;
align-items: center;
justify-content: center;
transition: 0.5s;
}
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li .single-item span {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 12px;
font-weight: 600;
line-height: 1;
letter-spacing: 0.06em;
white-space: nowrap;
transition: 0.5s;
}
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li .single-item::before {
content: "";
position: absolute;
bottom: -5px;
left: 15px;
width: 10px;
height: 10px;
transform: rotate(45deg);
background-color: var(--white-color);
transition: 0.5s;
}
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li .single-item:hover {
background-color: var(--primary-color2);
}
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li .single-item:hover .flag {
border-color: var(--white-color);
}
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li .single-item:hover span {
color: var(--white-color);
}
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li .single-item:hover::before {
background-color: var(--primary-color2);
}
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li.active .dot-main .waves {
background: var(--primary-color2);
}
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li.active .dot-main .waves.wave-3 {
background: var(--primary-color2);
}
.home3-industry-location-section .industry-location-wrapper .indicator-area ul li.active .single-item {
transform: scale(1);
}
.home3-industry-location-section .location-bottom-area {
padding-top: 40px;
text-align: center;
}
@media (max-width: 1199px) {
.home3-industry-location-section .location-bottom-area {
padding-top: 30px;
}
}
@media (max-width: 576px) {
.home3-industry-location-section .location-bottom-area {
padding-top: 20px;
}
}
.home3-industry-location-section .location-bottom-area h6 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 400;
font-size: 18px;
line-height: 30px;
}
@media (max-width: 576px) {
.home3-industry-location-section .location-bottom-area h6 {
font-size: 17px;
}
}
.home3-industry-location-section .location-bottom-area h6 a {
color: var(--primary-color2);
font-weight: 500;
text-decoration: underline;
transition: 0.5s;
}
.home3-industry-location-section .location-bottom-area h6 a:hover {
color: var(--title-color);
} .home3-process-section {
background-color: #ffecec;
padding: 100px 0;
position: relative;
z-index: 1;
}
@media (max-width: 1199px) {
.home3-process-section {
padding: 90px 0;
}
}
@media (max-width: 767px) {
.home3-process-section {
padding: 70px 0;
}
}
.home3-process-section .scroll-svg {
position: absolute;
top: 0;
left: 0;
z-index: -1;
fill: none;
stroke: rgba(var(--primary-color2-opc), 0.05);
width: 100%;
}
@media (max-width: 991px) {
.home3-process-section .scroll-svg {
display: none;
}
}
.home3-process-section .process-wrapper {
background-color: rgba(var(--black-color-opc), 0.05);
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
border-radius: 10px;
clip-path: polygon(97% 0, 100% 7%, 100% 100%, 0 100%, 0 0);
}
@media (max-width: 991px) {
.home3-process-section .process-wrapper {
clip-path: polygon(96% 0, 100% 5%, 100% 100%, 0 100%, 0 0);
}
}
@media (max-width: 576px) {
.home3-process-section .process-wrapper {
clip-path: polygon(92% 0, 100% 3%, 100% 100%, 0 100%, 0 0);
}
}
.home3-process-section .process-wrapper .process-list {
padding: 50px 0 35px;
border-right: 1px solid rgba(255, 255, 255, 0.5);
}
@media (max-width: 991px) {
.home3-process-section .process-wrapper .process-list {
padding: 50px 0 40px;
}
}
.home3-process-section .process-wrapper .process-list .process-and-progress {
margin-bottom: 40px;
}
.home3-process-section .process-wrapper .process-list .process-and-progress:last-child {
margin-bottom: 0;
}
.home3-process-section .process-wrapper .process-list .process-and-progress .single-process {
padding: 24px 30px 14px;
background-color: #ffecec;
border-radius: 10px;
position: relative;
margin: 0 35px 25px 35px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home3-process-section .process-wrapper .process-list .process-and-progress .single-process {
margin: 0 20px 25px 20px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home3-process-section .process-wrapper .process-list .process-and-progress .single-process {
margin: 0 20px 25px 20px;
}
}
@media (max-width: 576px) {
.home3-process-section .process-wrapper .process-list .process-and-progress .single-process {
margin: 0 15px 20px 15px;
padding: 24px 20px 14px;
}
}
.home3-process-section .process-wrapper .process-list .process-and-progress .single-process:last-child {
margin-bottom: 0;
}
.home3-process-section .process-wrapper .process-list .process-and-progress .single-process .step-no {
display: inline-flex;
justify-content: center;
align-items: center;
background-color: #ffecec;
border: 1px solid rgba(var(--primary-color2-opc), 0.5);
border-radius: 5px;
padding: 7px 13px;
white-space: nowrap;
position: absolute;
top: -15px;
transition: 0.5s;
}
.home3-process-section .process-wrapper .process-list .process-and-progress .single-process .step-no span {
color: var(--primary-color2);
font-family: var(--font-dmsans);
font-size: 11px;
font-weight: 600;
line-height: 1;
letter-spacing: 0.51px;
transition: 0.5s;
}
.home3-process-section .process-wrapper .process-list .process-and-progress .single-process .step-no::before {
content: "";
position: absolute;
bottom: -6px;
left: 15px;
transform: rotate(45deg);
width: 11px;
height: 11px;
background-color: #ffecec;
border: 1px solid rgba(var(--primary-color2-opc), 0.5);
border-top: unset;
border-left: unset;
transition: 0.5s;
}
.home3-process-section .process-wrapper .process-list .process-and-progress .single-process h6 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 20px;
line-height: 27px;
letter-spacing: 0.03em;
margin-bottom: 0;
}
@media (max-width: 576px) {
.home3-process-section .process-wrapper .process-list .process-and-progress .single-process h6 {
font-size: 19px;
}
}
.home3-process-section .process-wrapper .progressBarContainer div span.progressBar {
width: 100%;
height: 1px;
background-color: rgba(255, 255, 255, 0.5);
display: block;
}
.home3-process-section .process-wrapper .progressBarContainer div span.progressBar .inProgress {
background-color: var(--primary-color1);
width: 0%;
height: 1px;
}
.home3-process-section .process-wrapper .process-img-wrap .process-img {
padding: 35px 50px 35px 65px;
}
@media (max-width: 1399px) {
.home3-process-section .process-wrapper .process-img-wrap .process-img {
padding: 35px 30px 35px 45px;
}
}
@media (max-width: 1199px) {
.home3-process-section .process-wrapper .process-img-wrap .process-img {
padding: 30px 20px 30px 0;
}
}
@media (max-width: 991px) {
.home3-process-section .process-wrapper .process-img-wrap .process-img {
padding: 0 35px 20px;
}
}
@media (max-width: 576px) {
.home3-process-section .process-wrapper .process-img-wrap .process-img {
padding: 0 15px 20px;
}
}
.home3-process-section .process-wrapper .process-img-wrap .process-img img {
border-radius: 20px 40px 20px 20px;
}
@media (max-width: 1199px) {
.home3-process-section .process-wrapper .process-img-wrap .process-img img {
border-radius: 15px 30px 15px 15px;
min-height: 350px;
-o-object-fit: cover;
object-fit: cover;
width: 100%;
}
}
@media (max-width: 576px) {
.home3-process-section .process-wrapper .process-img-wrap .process-img img {
min-height: 280px;
}
} .home3-video-area {
position: relative;
}
.home3-video-area .video-area {
min-height: 400px;
height: 85vh;
}
.home3-video-area .video-area video {
width: 100%;
min-height: 400px;
height: 85vh;
-o-object-fit: cover;
object-fit: cover;
}
.home3-video-area .video-content-wrap {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(var(--black-color-opc), 0.5);
display: flex;
align-items: center;
justify-content: center;
}
.home3-video-area .video-content-wrap .video-content-btn-area {
max-width: 936px;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
gap: 50px;
}
@media (max-width: 1199px) {
.home3-video-area .video-content-wrap .video-content-btn-area {
gap: 30px;
}
}
@media (max-width: 991px) {
.home3-video-area .video-content-wrap .video-content-btn-area {
gap: 20px;
}
}
.home3-video-area .video-content-wrap .video-content-btn-area .content {
text-align: right;
}
@media (max-width: 767px) {
.home3-video-area .video-content-wrap .video-content-btn-area .content {
text-align: center;
}
}
.home3-video-area .video-content-wrap .video-content-btn-area .content h2 {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 70px;
line-height: 60px;
letter-spacing: 0.05em;
text-transform: uppercase;
margin-bottom: 30px;
}
.home3-video-area .video-content-wrap .video-content-btn-area .content h2:last-child {
margin-bottom: 0;
margin-right: 50px;
}
@media (max-width: 1199px) {
.home3-video-area .video-content-wrap .video-content-btn-area .content h2:last-child {
margin-right: 30px;
}
}
@media (max-width: 991px) {
.home3-video-area .video-content-wrap .video-content-btn-area .content h2:last-child {
margin-right: 25px;
}
}
@media (max-width: 1399px) {
.home3-video-area .video-content-wrap .video-content-btn-area .content h2 {
font-size: 65px;
}
}
@media (max-width: 1199px) {
.home3-video-area .video-content-wrap .video-content-btn-area .content h2 {
font-size: 60px;
margin-bottom: 25px;
}
}
@media (max-width: 991px) {
.home3-video-area .video-content-wrap .video-content-btn-area .content h2 {
font-size: 52px;
margin-bottom: 15px;
}
}
@media (max-width: 767px) {
.home3-video-area .video-content-wrap .video-content-btn-area .content h2 {
font-size: 48px;
}
}
@media (max-width: 576px) {
.home3-video-area .video-content-wrap .video-content-btn-area .content h2 {
font-size: 42px;
margin-bottom: 0;
}
}
.home3-video-area .video-content-wrap .video-content-btn-area .circular-text2 {
position: relative;
min-width: 120px;
height: 120px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--white-color);
}
.home3-video-area .video-content-wrap .video-content-btn-area .circular-text2 .play-btn {
width: 65px;
height: 65px;
border-radius: 50%;
background-color: #6a6b6b;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 1;
}
.home3-video-area .video-content-wrap .video-content-btn-area .circular-text2 .play-btn svg {
fill: var(--white-color);
margin-left: 5px;
}
.home3-video-area .video-content-wrap .video-content-btn-area .circular-text2 .play-btn .pause-icon {
display: none;
margin-left: 0;
}
.home3-video-area .video-content-wrap .video-content-btn-area .circular-text2 .play-btn.active .play-icon {
display: none;
}
.home3-video-area .video-content-wrap .video-content-btn-area .circular-text2 .play-btn.active .pause-icon {
display: block;
}
.home3-video-area .video-content-wrap .video-content-btn-area .circular-text2 .text {
position: absolute;
width: 100%;
height: 100%;
animation: textRotation 8s linear infinite;
}
.home3-video-area .video-content-wrap .video-content-btn-area .circular-text2 .text span {
position: absolute;
left: 50%;
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 13px;
font-weight: 700;
transform-origin: 0 60px;
} .home3-company-info-section .company-info-img-and-countdown-area {
position: relative;
}
.home3-company-info-section .company-info-img-and-countdown-area .info-img {
-webkit-mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home3/company-info-img-bg-shape.png);
mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home3/company-info-img-bg-shape.png);
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
}
@media (max-width: 1399px) {
.home3-company-info-section .company-info-img-and-countdown-area .info-img {
-webkit-mask-size: cover;
mask-size: cover;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.home3-company-info-section .company-info-img-and-countdown-area .info-img {
-webkit-mask-size: auto;
mask-size: auto;
}
}
.home3-company-info-section .company-info-img-and-countdown-area .countdown-area {
background-color: var(--primary-color2);
display: inline-flex;
align-items: center;
border-radius: 100px;
position: absolute;
top: 50px;
left: 13%;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home3-company-info-section .company-info-img-and-countdown-area .countdown-area {
top: 20px;
}
}
@media (max-width: 576px) {
.home3-company-info-section .company-info-img-and-countdown-area .countdown-area {
top: 10px;
left: 7%;
}
}
.home3-company-info-section .company-info-img-and-countdown-area .countdown-area .number {
display: flex;
align-items: center;
padding: 13px 15px 13px 20px;
border-right: 1px solid var(--white-color);
}
.home3-company-info-section .company-info-img-and-countdown-area .countdown-area .number h3,
.home3-company-info-section .company-info-img-and-countdown-area .countdown-area .number span {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 700;
font-size: 30px;
line-height: 1;
margin-bottom: 0;
}
@media (max-width: 576px) {
.home3-company-info-section .company-info-img-and-countdown-area .countdown-area .number h3,
.home3-company-info-section .company-info-img-and-countdown-area .countdown-area .number span {
font-size: 28px;
}
}
.home3-company-info-section .company-info-img-and-countdown-area .countdown-area > span {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 500;
font-size: 16px;
line-height: 20px;
display: block;
padding: 8px 26px 8px 20px;
}
@media (max-width: 576px) {
.home3-company-info-section .company-info-img-and-countdown-area .countdown-area > span {
font-size: 15px;
}
}
.home3-company-info-section .company-info-content h2 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 60px;
line-height: 1.1;
margin-bottom: 35px;
}
@media (max-width: 1399px) {
.home3-company-info-section .company-info-content h2 {
font-size: 55px;
margin-bottom: 30px;
}
}
@media (max-width: 1199px) {
.home3-company-info-section .company-info-content h2 {
font-size: 48px;
margin-bottom: 25px;
}
}
@media (max-width: 576px) {
.home3-company-info-section .company-info-content h2 {
font-size: 34px;
line-height: 1.2;
margin-bottom: 20px;
}
}
.home3-company-info-section .company-info-content p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 16px;
line-height: 32px;
margin-left: 70px;
position: relative;
padding-left: 15px;
margin-bottom: 60px;
}
@media (max-width: 1399px) {
.home3-company-info-section .company-info-content p {
margin-left: 50px;
margin-bottom: 55px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home3-company-info-section .company-info-content p {
margin-left: 20px;
margin-bottom: 45px;
}
}
@media (max-width: 991px) {
.home3-company-info-section .company-info-content p {
margin-bottom: 45px;
}
}
@media (max-width: 767px) {
.home3-company-info-section .company-info-content p {
margin-left: 30px;
margin-bottom: 35px;
}
}
@media (max-width: 576px) {
.home3-company-info-section .company-info-content p {
font-size: 15px;
margin-left: 15px;
padding-left: 10px;
margin-bottom: 30px;
}
}
.home3-company-info-section .company-info-content p::before {
content: "";
position: absolute;
top: 10px;
left: 0;
width: 2px;
height: 75px;
background-color: rgba(var(--primary-color2-opc), 0.7);
} .team-card2 .team-img {
position: relative;
border-radius: 10px;
}
.team-card2 .team-img img {
border-radius: 10px;
}
.team-card2 .team-img .social-wrap {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(var(--black-color-opc), 0.1);
-webkit-backdrop-filter: blur(2px);
backdrop-filter: blur(2px);
border-radius: 10px;
display: flex;
align-items: center;
justify-content: center;
opacity: 0;
transform: scaleY(0);
transform-origin: bottom;
transition: 0.5s;
}
.team-card2 .team-img .social-wrap .social-area {
display: flex;
align-items: center;
transition: 0.5s;
transform-origin: right;
}
.team-card2 .team-img .social-wrap .social-area .icon {
width: 28px;
height: 28px;
border-radius: 50%;
border: 1px solid var(--white-color);
display: flex;
align-items: center;
justify-content: center;
transition: 0.5s;
}
.team-card2 .team-img .social-wrap .social-area .icon span {
width: 20px;
height: 20px;
border-radius: 50%;
background-color: var(--white-color);
display: flex;
align-items: center;
justify-content: center;
transition: 0.5s;
}
.team-card2 .team-img .social-wrap .social-area .icon span i {
color: var(--black-color);
font-size: 14px;
transition: 0.5s;
}
.team-card2 .team-img .social-wrap .social-area .icon span i.bi-twitter-x {
font-size: 10px;
}
.team-card2 .team-img .social-wrap .social-area > span {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 14px;
line-height: 1;
display: inline-flex;
justify-content: center;
padding: 6px 13px;
border-radius: 50px;
background-color: transparent;
border: 1px solid rgba(255, 255, 255, 0.5);
position: relative;
transition: 0.5s;
min-width: 92px;
}
.team-card2 .team-img .social-wrap .social-area > span::before {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
left: -1px;
width: 1px;
height: 28px;
background-color: transparent;
background-color: var(--white-color);
transition: 0.5s;
}
.team-card2 .team-img .social-wrap .social-area:hover .icon {
border-color: var(--primary-color2);
background-color: var(--primary-color2);
}
.team-card2 .team-img .social-wrap .social-area:hover .icon span {
background-color: var(--white-color);
}
.team-card2 .team-img .social-wrap .social-area:hover .icon span i {
color: var(--primary-color2);
}
.team-card2 .team-img .social-wrap .social-area:hover > span {
background-color: var(--primary-color2);
border-color: var(--primary-color2);
color: var(--white-color);
}
.team-card2 .team-img .social-wrap .social-area:hover > span::before {
background-color: var(--primary-color2);
}
.team-card2 .team-content {
padding-top: 25px;
line-height: 1;
}
.team-card2 .team-content span {
color: var(--text-color);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 15px;
line-height: 1;
display: block;
margin-bottom: 5px;
}
.team-card2 .team-content h5 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 22px;
line-height: 1.3;
letter-spacing: 0.03em;
margin-bottom: 0;
}
@media (max-width: 1399px) {
.team-card2 .team-content h5 {
font-size: 20px;
}
}
.team-card2:hover .team-img .social-wrap {
opacity: 1;
transform: scaleY(1);
}
.home3-team-section {
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home3/home3-team-bg.png);
background-size: cover;
background-repeat: no-repeat;
padding: 110px 0;
}
@media (max-width: 1199px) {
.home3-team-section {
padding: 90px 0;
}
}
@media (max-width: 767px) {
.home3-team-section {
padding: 70px 0;
}
}
.home3-team-section .home3-team-slider {
margin: -2px;
}
@media (max-width: 1199px) {
.home3-team-section .home3-team-slider {
margin: 0;
}
}
.home3-team-section .home3-team-slider .swiper-slide .team-card2 {
padding: 0 24px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home3-team-section .home3-team-slider .swiper-slide .team-card2 {
padding: 0 15px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home3-team-section .home3-team-slider .swiper-slide .team-card2 {
padding: 0 15px;
}
}
@media (max-width: 991px) {
.home3-team-section .home3-team-slider .swiper-slide .team-card2 {
padding: 0 18px;
}
}
@media (max-width: 576px) {
.home3-team-section .home3-team-slider .swiper-slide .team-card2 {
padding: 0;
}
}
.home3-team-section .home3-team-slider .swiper-slide:nth-child(even) {
margin-top: 15px;
}
@media (max-width: 576px) {
.home3-team-section .home3-team-slider .swiper-slide:nth-child(even) {
margin-top: 0;
}
}
.home3-team-section .home3-team-slider .swiper-slide:nth-child(even) .team-card2 {
padding-top: 20px;
padding-bottom: 20px;
border-top: 1px solid rgba(var(--black-color-opc), 0.1);
position: relative;
}
@media (max-width: 991px) {
.home3-team-section .home3-team-slider .swiper-slide:nth-child(even) .team-card2 {
padding-top: 15px;
padding-bottom: 15px;
}
}
@media (max-width: 576px) {
.home3-team-section .home3-team-slider .swiper-slide:nth-child(even) .team-card2 {
padding-top: 0;
padding-bottom: 0;
border: unset;
}
}
.home3-team-section .home3-team-slider .swiper-slide:nth-child(even) .team-card2::before {
content: "";
position: absolute;
top: -15px;
left: 0;
width: 1px;
height: 102%;
background-color: rgba(var(--black-color-opc), 0.1);
}
@media (max-width: 576px) {
.home3-team-section .home3-team-slider .swiper-slide:nth-child(even) .team-card2::before {
display: none;
}
}
.home3-team-section .home3-team-slider .swiper-slide:nth-child(even) .team-card2::after {
content: "";
position: absolute;
top: -15px;
right: 0;
width: 1px;
height: 102%;
background-color: rgba(var(--black-color-opc), 0.1);
}
@media (max-width: 576px) {
.home3-team-section .home3-team-slider .swiper-slide:nth-child(even) .team-card2::after {
display: none;
}
}
.home3-team-section .team-bottom-area {
padding-top: 50px;
text-align: center;
}
@media (max-width: 1199px) {
.home3-team-section .team-bottom-area {
padding-top: 30px;
}
}
@media (max-width: 576px) {
.home3-team-section .team-bottom-area {
padding-top: 20px;
}
}
.home3-team-section .team-bottom-area h6 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 400;
font-size: 18px;
line-height: 30px;
}
@media (max-width: 576px) {
.home3-team-section .team-bottom-area h6 {
font-size: 17px;
}
}
.home3-team-section .team-bottom-area h6 a {
color: var(--primary-color2);
font-weight: 500;
text-decoration: underline;
transition: 0.5s;
}
.home3-team-section .team-bottom-area h6 a:hover {
color: var(--title-color);
} .blog-card2 {
position: relative;
border-radius: 10px;
}
.blog-card2 .blog-img img {
border-radius: 10px;
min-height: 400px;
-o-object-fit: cover;
object-fit: cover;
}
.blog-card2 .blog-content-wrap {
background-color: rgba(var(--black-color-opc), 0.4);
border-radius: 10px;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
padding: 10px 30px 30px;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: start;
}
@media (min-width: 992px) and (max-width: 1199px) {
.blog-card2 .blog-content-wrap {
padding: 10px 15px 30px;
}
}
@media (max-width: 767px) {
.blog-card2 .blog-content-wrap {
padding: 10px 20px 25px;
}
}
@media (max-width: 576px) {
.blog-card2 .blog-content-wrap {
padding: 10px 12px 25px;
}
}
.blog-card2 .blog-content-wrap .blog-date {
color: var(--white-color);
font-family: var(--font-dmsans);
font-weight: 600;
font-size: 13px;
line-height: 1;
text-transform: uppercase;
text-decoration: underline;
padding: 9px 14px;
display: inline-flex;
border-radius: 5px;
background-color: rgba(255, 255, 255, 0.12);
-webkit-backdrop-filter: blur(8px);
backdrop-filter: blur(8px);
-webkit-text-decoration-skip-ink: none;
text-decoration-skip-ink: none;
text-underline-offset: 2px;
transition: 0.5s;
}
.blog-card2 .blog-content-wrap .blog-date:hover {
background-color: var(--primary-color2);
}
.blog-card2 .blog-content-wrap .blog-content {
padding: 25px 38px;
background-color: rgba(255, 255, 255, 0.15);
-webkit-backdrop-filter: blur(4px);
backdrop-filter: blur(4px);
border-radius: 10px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.blog-card2 .blog-content-wrap .blog-content {
padding: 25px 25px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.blog-card2 .blog-content-wrap .blog-content {
padding: 25px 20px;
}
}
@media (max-width: 767px) {
.blog-card2 .blog-content-wrap .blog-content {
padding: 25px 20px;
}
}
@media (max-width: 576px) {
.blog-card2 .blog-content-wrap .blog-content {
padding: 25px 15px;
}
}
.blog-card2 .blog-content-wrap .blog-content h4 {
margin-bottom: 20px;
}
@media (max-width: 576px) {
.blog-card2 .blog-content-wrap .blog-content h4 {
margin-bottom: 15px;
}
}
.blog-card2 .blog-content-wrap .blog-content h4 a {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 25px;
line-height: 1.4;
letter-spacing: 0.02em;
transition: 0.5s;
}
.blog-card2 .blog-content-wrap .blog-content h4 a:hover {
color: var(--primary-color2);
}
@media (min-width: 992px) and (max-width: 1199px) {
.blog-card2 .blog-content-wrap .blog-content h4 a {
font-size: 22px;
}
}
@media (max-width: 576px) {
.blog-card2 .blog-content-wrap .blog-content h4 a {
font-size: 19px;
}
}
.blog-card2 .blog-content-wrap .blog-content .details-btn {
color: var(--primary-color2);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
line-height: 100%;
letter-spacing: 0.05em;
text-transform: uppercase;
display: inline-flex;
align-items: center;
gap: 6px;
}
.blog-card2 .blog-content-wrap .blog-content .details-btn span {
background: linear-gradient(to bottom, var(--primary-color2) 0%, var(--primary-color2) 98%);
background-repeat: no-repeat;
background-size: 100% 1px;
background-position: left 100%;
transition: background-size 0.75s;
}
.blog-card2 .blog-content-wrap .blog-content .details-btn svg {
fill: var(--primary-color2);
transition: 0.5s;
}
.blog-card2 .blog-content-wrap .blog-content .details-btn:hover span {
background-size: 0 1px;
background-position: 0% 100%;
}
.blog-card2 .blog-content-wrap .blog-content .details-btn:hover svg {
transform: translateX(3px);
}
.blog-card2.two .blog-content-wrap .blog-date:hover {
background-color: var(--primary-color3);
}
.blog-card2.two .blog-content-wrap .blog-content {
background-color: rgba(var(--primary-color4-opc), 0.7);
}
.blog-card2.two .blog-content-wrap .blog-content h4 a:hover {
color: var(--primary-color3);
}
.blog-card2.two .blog-content-wrap .blog-content .details-btn {
color: var(--white-color);
}
.blog-card2.two .blog-content-wrap .blog-content .details-btn span {
background: linear-gradient(to bottom, var(--white-color) 0%, var(--white-color) 98%);
background-repeat: no-repeat;
background-size: 100% 1px;
background-position: left 100%;
transition: background-size 0.75s;
}
.blog-card2.two .blog-content-wrap .blog-content .details-btn svg {
fill: var(--white-color);
}
.blog-card2.two .blog-content-wrap .blog-content .details-btn:hover span {
background-size: 0 1px;
background-position: 0% 100%;
}
.blog-card2.two .blog-content-wrap .blog-content .details-btn:hover svg {
transform: translateX(3px);
}
.blog-card2.three .blog-content-wrap .blog-date:hover {
background-color: var(--primary-color5);
}
.blog-card2.three .blog-content-wrap .blog-content h4 a:hover {
color: var(--primary-color5);
}
.blog-card2.three .blog-content-wrap .blog-content .details-btn {
color: var(--white-color);
}
.blog-card2.three .blog-content-wrap .blog-content .details-btn span {
background: linear-gradient(to bottom, var(--white-color) 0%, var(--white-color) 98%);
background-repeat: no-repeat;
background-size: 100% 1px;
background-position: left 100%;
transition: background-size 0.75s;
}
.blog-card2.three .blog-content-wrap .blog-content .details-btn svg {
fill: var(--white-color);
}
.blog-card2.three .blog-content-wrap .blog-content .details-btn:hover span {
background-size: 0 1px;
background-position: 0% 100%;
}
.home3-blog-section .slider-btn-grp {
margin-bottom: 10px;
}
@media (max-width: 991px) {
.home3-blog-section .slider-btn-grp {
margin-bottom: 0;
}
}
.home3-blog-section .blog-card2 {
height: 100%;
}
@media (max-width: 576px) {
.home3-blog-section .blog-card2 {
height: unset;
}
}
.home3-blog-section .blog-card2 .blog-img {
height: 100%;
}
@media (max-width: 576px) {
.home3-blog-section .blog-card2 .blog-img {
height: unset;
}
}
.home3-blog-section .blog-card2 .blog-img img {
height: 100%;
min-height: 510px;
-o-object-fit: cover;
object-fit: cover;
}
@media (max-width: 576px) {
.home3-blog-section .blog-card2 .blog-img img {
height: unset;
min-height: unset;
}
}
.home3-blog-section .view-all-btn {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
line-height: 100%;
letter-spacing: 0.05em;
text-transform: uppercase;
transition: 0.5s;
display: inline-flex;
align-items: center;
gap: 6px;
}
.home3-blog-section .view-all-btn span {
background: linear-gradient(to bottom, var(--title-color) 0%, var(--title-color) 98%);
background-repeat: no-repeat;
background-size: 100% 1px;
background-position: left 100%;
transition: background-size 0.75s;
}
.home3-blog-section .view-all-btn svg {
fill: var(--title-color);
transition: 0.5s;
}
.home3-blog-section .view-all-btn:hover {
color: var(--primary-color2);
}
.home3-blog-section .view-all-btn:hover span {
background-size: 0 1px;
background-position: 0% 100%;
}
.home3-blog-section .view-all-btn:hover svg {
transform: translateX(3px);
fill: var(--primary-color2);
} .home3-testimonial-section {
background-color: var(--black-color);
padding: 100px 0;
}
@media (max-width: 1199px) {
.home3-testimonial-section {
padding: 90px 0;
}
}
@media (max-width: 767px) {
.home3-testimonial-section {
padding: 70px 0;
}
}
.home3-testimonial-section .slider-btn-grp {
margin-bottom: 10px;
}
@media (max-width: 991px) {
.home3-testimonial-section .slider-btn-grp {
margin-bottom: 0;
}
}
.home3-testimonial-section .slider-btn-grp .slider-btn {
border: 1px solid rgba(255, 255, 255, 0.3);
}
.home3-testimonial-section .slider-btn-grp .slider-btn i {
color: rgba(255, 255, 255, 0.3);
}
.home3-testimonial-section .slider-btn-grp .slider-btn:hover {
border-color: var(--primary-color2);
}
.home3-testimonial-section .slider-btn-grp .slider-btn:hover i {
color: var(--white-color);
}
.home3-testimonial-section .testimonial-card2 {
padding: 20px 78px 20px 20px;
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home3/testimonial-card-bg.png), linear-gradient(180deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.05) 100%);
background-size: cover;
background-repeat: no-repeat;
border-radius: 20px;
clip-path: polygon(93% 0, 100% 16%, 100% 100%, 0 100%, 0 0);
}
@media (max-width: 1399px) {
.home3-testimonial-section .testimonial-card2 {
padding: 20px 60px 20px 20px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home3-testimonial-section .testimonial-card2 {
padding: 20px 15px;
}
}
@media (max-width: 991px) {
.home3-testimonial-section .testimonial-card2 {
clip-path: unset;
padding: 25px 20px;
}
}
@media (max-width: 576px) {
.home3-testimonial-section .testimonial-card2 {
padding: 20px 10px;
border-radius: 10px;
}
}
.home3-testimonial-section .testimonial-card2 .testimonial-img img {
border-radius: 15px 0 0 15px;
max-width: 450px;
width: 100%;
}
@media (max-width: 991px) {
.home3-testimonial-section .testimonial-card2 .testimonial-img img {
max-width: unset;
max-height: 400px;
width: 100%;
-o-object-fit: cover;
object-fit: cover;
border-radius: 10px;
}
}
@media (max-width: 767px) {
.home3-testimonial-section .testimonial-card2 .testimonial-img img {
max-height: 320px;
}
}
.home3-testimonial-section .testimonial-card2 .testimonial-content {
text-align: center;
max-width: 670px;
width: 100%;
margin-left: auto;
}
.home3-testimonial-section .testimonial-card2 .testimonial-content .quote {
fill: rgba(255, 255, 255, 0.2);
margin-bottom: 25px;
}
.home3-testimonial-section .testimonial-card2 .testimonial-content > span {
color: var(--primary-color2);
font-family: var(--font-manrope);
font-weight: 500;
font-size: 16px;
line-height: 1.5;
letter-spacing: 0.05em;
text-transform: uppercase;
margin-bottom: 25px;
display: block;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home3-testimonial-section .testimonial-card2 .testimonial-content > span {
margin-bottom: 15px;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.home3-testimonial-section .testimonial-card2 .testimonial-content > span {
font-size: 15px;
}
}
@media (max-width: 767px) {
.home3-testimonial-section .testimonial-card2 .testimonial-content > span {
margin-bottom: 20px;
}
}
@media (max-width: 576px) {
.home3-testimonial-section .testimonial-card2 .testimonial-content > span {
font-size: 15px;
margin-bottom: 15px;
}
}
.home3-testimonial-section .testimonial-card2 .testimonial-content p {
color: rgba(255, 255, 255, 0.7);
font-family: var(--font-manrope);
font-weight: 500;
font-size: 20px;
line-height: 42px;
margin-bottom: 35px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home3-testimonial-section .testimonial-card2 .testimonial-content p {
font-size: 17px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home3-testimonial-section .testimonial-card2 .testimonial-content p {
font-size: 17px;
margin-bottom: 25px;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.home3-testimonial-section .testimonial-card2 .testimonial-content p {
font-size: 16px;
line-height: 38px;
margin-bottom: 25px;
}
}
@media (max-width: 767px) {
.home3-testimonial-section .testimonial-card2 .testimonial-content p {
font-size: 18px;
margin-bottom: 20px;
}
}
@media (max-width: 576px) {
.home3-testimonial-section .testimonial-card2 .testimonial-content p {
font-size: 15px;
line-height: 36px;
margin-bottom: 25px;
}
}
.home3-testimonial-section .testimonial-card2 .testimonial-content .author-and-social-area {
display: flex;
align-items: center;
justify-content: space-between;
padding-top: 25px;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
@media (max-width: 767px) {
.home3-testimonial-section .testimonial-card2 .testimonial-content .author-and-social-area {
padding-top: 20px;
}
}
@media (max-width: 576px) {
.home3-testimonial-section .testimonial-card2 .testimonial-content .author-and-social-area {
padding-top: 15px;
}
}
.home3-testimonial-section .testimonial-card2 .testimonial-content .author-and-social-area .author-area {
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
}
.home3-testimonial-section .testimonial-card2 .testimonial-content .author-and-social-area .author-area .author-img img {
min-width: 50px;
max-width: 50px;
height: 50px;
border-radius: 50%;
}
.home3-testimonial-section .testimonial-card2 .testimonial-content .author-and-social-area .author-area .author-content {
text-align: start;
}
.home3-testimonial-section .testimonial-card2 .testimonial-content .author-and-social-area .author-area .author-content h5 {
color: #fff;
font-family: var(--font-manrope);
font-size: 19px;
font-weight: 600;
line-height: 1.3;
letter-spacing: 0.03em;
margin-bottom: 2px;
}
@media (max-width: 576px) {
.home3-testimonial-section .testimonial-card2 .testimonial-content .author-and-social-area .author-area .author-content h5 {
font-size: 17px;
}
}
.home3-testimonial-section .testimonial-card2 .testimonial-content .author-and-social-area .author-area .author-content span {
color: rgba(255, 255, 255, 0.6);
font-family: var(--font-dmsans);
font-size: 15px;
font-weight: 400;
line-height: 1;
letter-spacing: 0.03em;
}
.home3-testimonial-section .testimonial-card2 .testimonial-content .author-and-social-area .social-area {
width: 49px;
height: 49px;
border-radius: 50%;
border: 1px solid rgba(255, 255, 255, 0.1);
display: flex;
align-items: center;
justify-content: center;
}
.home3-testimonial-section .testimonial-card2 .testimonial-content .author-and-social-area .social-area a {
width: 33px;
height: 33px;
border-radius: 50%;
background-color: var(--white-color);
display: flex;
align-items: center;
justify-content: center;
line-height: 1;
transition: 0.5s;
}
.home3-testimonial-section .testimonial-card2 .testimonial-content .author-and-social-area .social-area a i {
color: var(--title-color);
font-size: 20px;
line-height: 1;
margin-bottom: 2px;
transition: 0.5s;
}
.home3-testimonial-section .testimonial-card2 .testimonial-content .author-and-social-area .social-area a:hover {
background-color: var(--primary-color2);
}
.home3-testimonial-section .testimonial-card2 .testimonial-content .author-and-social-area .social-area a:hover i {
color: var(--white-color);
}
.home3-testimonial-section .home3-testimonial-slider .swiper-slide-active .quote,
.home3-testimonial-section .home3-testimonial-slider .swiper-slide-active span,
.home3-testimonial-section .home3-testimonial-slider .swiper-slide-active p {
animation: fadeInDown 1.7s;
}
.home3-testimonial-section .home3-testimonial-slider .swiper-slide-active .author-and-social-area {
animation: fadeInUp 1.7s;
}
.home3-testimonial-section .counter-wrap {
padding-top: 40px;
position: relative;
}
.home3-testimonial-section .counter-wrap::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 1px;
background: linear-gradient(90deg, rgba(255, 255, 255, 0) 15.17%, rgba(255, 255, 255, 0.2) 51%, rgba(255, 255, 255, 0) 85.74%);
}
.home3-testimonial-section .counter-wrap .divider {
position: relative;
}
.home3-testimonial-section .counter-wrap .divider::before {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 0px;
height: 132px;
width: 1px;
background: linear-gradient(1800deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 51%, rgba(255, 255, 255, 0) 100%);
}
@media (max-width: 991px) {
.home3-testimonial-section .counter-wrap .divider::before {
display: none;
}
}
.home3-testimonial-section .counter-wrap .single-countdown {
text-align: center;
}
.home3-testimonial-section .counter-wrap .single-countdown .number {
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 5px;
}
.home3-testimonial-section .counter-wrap .single-countdown .number h2,
.home3-testimonial-section .counter-wrap .single-countdown .number span {
color: var(--white-color);
font-family: var(--font-manrope);
font-size: 55px;
font-weight: 500;
line-height: 1;
margin-bottom: 0;
}
@media (max-width: 1199px) {
.home3-testimonial-section .counter-wrap .single-countdown .number h2,
.home3-testimonial-section .counter-wrap .single-countdown .number span {
font-size: 50px;
}
}
.home3-testimonial-section .counter-wrap .single-countdown span {
color: rgba(255, 255, 255, 0.6);
font-family: var(--font-manrope);
font-size: 14px;
font-weight: 600;
line-height: 1.5;
letter-spacing: 0.06em;
text-transform: uppercase;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home3-testimonial-section .counter-wrap .single-countdown span {
font-size: 13px;
}
}
@media (max-width: 991px) {
.home3-testimonial-section .counter-wrap .single-countdown span {
font-size: 14px;
}
} .home3-career-opportunity-section {
padding: 0 12.5%;
}
@media (max-width: 1799px) {
.home3-career-opportunity-section {
padding: 0 10%;
}
}
@media (max-width: 1699px) {
.home3-career-opportunity-section {
padding: 0 7%;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home3-career-opportunity-section {
padding: 0 4%;
}
}
@media (max-width: 1399px) {
.home3-career-opportunity-section {
padding: 0 2%;
}
}
@media (max-width: 991px) {
.home3-career-opportunity-section {
padding: 0 10px;
}
}
@media (max-width: 576px) {
.home3-career-opportunity-section {
padding: 0;
}
}
@media (max-width: 1199px) {
.home3-career-opportunity-section .career-opportunity-title-area {
display: flex;
align-items: center;
justify-content: space-between;
}
}
@media (max-width: 767px) {
.home3-career-opportunity-section .career-opportunity-title-area {
flex-wrap: wrap;
gap: 30px;
}
}
@media (max-width: 1199px) {
.home3-career-opportunity-section .career-opportunity-title-area .section-title {
max-width: 460px;
width: 100%;
}
}
.home3-career-opportunity-section .career-opportunity-title-area p {
line-height: 32px;
margin-left: 25px;
padding-left: 15px;
margin-top: 35px;
margin-bottom: 55px;
padding-top: 0;
position: relative;
}
@media (max-width: 1199px) {
.home3-career-opportunity-section .career-opportunity-title-area p {
margin-bottom: 0;
}
}
@media (max-width: 991px) {
.home3-career-opportunity-section .career-opportunity-title-area p {
margin-top: 25px;
}
}
@media (max-width: 576px) {
.home3-career-opportunity-section .career-opportunity-title-area p {
padding-left: 10px;
margin-left: 10px;
margin-top: 15px;
}
}
.home3-career-opportunity-section .career-opportunity-title-area p::before {
content: "";
position: absolute;
top: 10px;
left: 0;
width: 2px;
height: 77px;
background-color: rgba(var(--black-color-opc), 0.3);
}
.home3-career-opportunity-section .career-card-area {
margin-left: 55px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home3-career-opportunity-section .career-card-area {
margin-left: 30px;
}
}
@media (max-width: 1399px) {
.home3-career-opportunity-section .career-card-area {
margin-left: 10px;
}
}
.home3-career-opportunity-section .career-card {
position: relative;
}
.home3-career-opportunity-section .career-card .career-banner-img img {
width: 100%;
min-height: 425px;
-o-object-fit: cover;
object-fit: cover;
border-radius: 5px;
}
@media (max-width: 1399px) {
.home3-career-opportunity-section .career-card .career-banner-img img {
min-height: 380px;
-o-object-fit: cover;
object-fit: cover;
}
}
.home3-career-opportunity-section .career-card .career-content-wrap {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
padding-right: 35px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home3-career-opportunity-section .career-card .career-content-wrap {
padding-top: 25px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home3-career-opportunity-section .career-card .career-content-wrap {
padding-right: 15px;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.home3-career-opportunity-section .career-card .career-content-wrap {
padding-right: 10px;
}
}
@media (max-width: 576px) {
.home3-career-opportunity-section .career-card .career-content-wrap {
padding-right: 0px;
}
}
.home3-career-opportunity-section .career-card .career-content-wrap .career-content {
width: 100%;
padding: 25px 30px;
background-color: var(--white-color);
clip-path: polygon(94% 0, 100% 13%, 100% 100%, 0 100%, 0 0);
position: relative;
margin-left: -0.5px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home3-career-opportunity-section .career-card .career-content-wrap .career-content {
padding: 25px 25px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home3-career-opportunity-section .career-card .career-content-wrap .career-content {
padding: 25px 15px;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.home3-career-opportunity-section .career-card .career-content-wrap .career-content {
padding: 25px 14px;
}
}
@media (max-width: 576px) {
.home3-career-opportunity-section .career-card .career-content-wrap .career-content {
padding: 20px 14px;
margin-left: 0;
}
}
.home3-career-opportunity-section .career-card .career-content-wrap .career-content h5 {
margin-bottom: 10px;
}
.home3-career-opportunity-section .career-card .career-content-wrap .career-content h5 a {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 22px;
line-height: 1.3;
transition: 0.5s;
}
@media (max-width: 576px) {
.home3-career-opportunity-section .career-card .career-content-wrap .career-content h5 a {
font-size: 20px;
}
}
.home3-career-opportunity-section .career-card .career-content-wrap .career-content h5 a:hover {
color: var(--primary-color2);
}
.home3-career-opportunity-section .career-card .career-content-wrap .career-content p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 14px;
line-height: 24px;
margin-bottom: 15px;
}
@media (max-width: 576px) {
.home3-career-opportunity-section .career-card .career-content-wrap .career-content p {
margin-bottom: 10px;
}
}
.home3-career-opportunity-section .career-card .career-content-wrap .career-content > a {
color: var(--primary-color2);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
line-height: 1;
letter-spacing: 0.05em;
text-transform: uppercase;
display: inline-flex;
align-items: center;
gap: 8px;
transition: 0.5s;
}
.home3-career-opportunity-section .career-card .career-content-wrap .career-content > a svg {
fill: var(--primary-color2);
transition: 0.5s;
}
.home3-career-opportunity-section .career-card .career-content-wrap .career-content > a span {
background: linear-gradient(to bottom, var(--primary-color2) 0%, var(--primary-color2) 98%);
background-repeat: no-repeat;
background-size: 100% 1px;
background-position: left 100%;
transition: background-size 0.75s;
}
.home3-career-opportunity-section .career-card .career-content-wrap .career-content > a:hover {
color: var(--title-color);
}
.home3-career-opportunity-section .career-card .career-content-wrap .career-content > a:hover svg {
fill: var(--title-color);
}
.home3-career-opportunity-section .career-card .career-content-wrap .career-content > a:hover span {
background-size: 0 1px;
background-position: 0% 100%;
}
.home3-career-opportunity-section .career-card .career-content-wrap .career-content::before {
content: "";
position: absolute;
top: 0;
right: 0;
width: 25px;
height: 25px;
background-color: #ededed;
} .main-container .sidebar-wrapper {
position: fixed;
top: 0;
left: 0;
max-width: 90px;
width: 100%;
min-height: 100vh;
background-color: var(--black-color);
padding: 30px 10px;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
z-index: 2;
}
@media (max-width: 1399px) {
.main-container .sidebar-wrapper {
max-width: 80px;
}
}
@media (max-width: 1199px) {
.main-container .sidebar-wrapper {
max-width: 70px;
}
}
@media (max-width: 991px) {
.main-container .sidebar-wrapper {
max-width: unset;
min-height: unset;
position: relative;
flex-direction: row;
padding: 15px 30px;
}
.main-container .sidebar-wrapper.sticky {
position: fixed;
top: 0;
left: 0;
width: 100%;
box-sizing: border-box;
background-color: var(--black-color);
box-shadow: 5px 3px 40px rgba(0, 72, 88, 0.1);
z-index: 999;
}
}
@media (max-width: 767px) {
.main-container .sidebar-wrapper {
padding: 15px 20px;
}
}
@media (max-width: 576px) {
.main-container .sidebar-wrapper {
padding: 10px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.main-container .sidebar-wrapper .sidebar-logo img {
width: 45px;
}
}
@media (max-width: 767px) {
.main-container .sidebar-wrapper .sidebar-logo img {
width: 45px;
}
}
@media (max-width: 576px) {
.main-container .sidebar-wrapper .sidebar-logo img {
width: 40px;
}
}
.main-container .sidebar-wrapper .menu-btn {
cursor: pointer;
display: flex;
align-items: center;
gap: 8px;
position: relative;
width: 50px;
height: 50px;
border-radius: 50%;
border: 1px solid rgba(255, 255, 255, 0.3);
display: flex;
align-items: center;
justify-content: center;
z-index: 1;
}
.main-container .sidebar-wrapper .menu-btn::before {
content: "";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 36px;
height: 36px;
border-radius: 50%;
background-color: var(--white-color);
z-index: -1;
}
.main-container .sidebar-wrapper .menu-btn svg {
fill: var(--title-color);
}
.main-container .sidebar-wrapper .menu-btn:hover svg {
animation: qode-draw 0.75s cubic-bezier(0.57, 0.39, 0, 0.86) 1 forwards;
}
.main-container .sidebar-wrapper span {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 400;
font-size: 14px;
line-height: 1;
letter-spacing: 0.05em;
text-transform: uppercase;
text-decoration: underline;
writing-mode: vertical-rl;
transform: rotate(180deg);
}
@media (max-width: 991px) {
.main-container .sidebar-wrapper span {
transform: rotate(0);
writing-mode: unset;
}
}
.main-container .main-content {
position: relative;
margin-left: 90px;
max-width: calc(100% - 90px);
width: 100%;
}
@media (max-width: 1399px) {
.main-container .main-content {
margin-left: 80px;
max-width: calc(100% - 80px);
}
}
@media (max-width: 1199px) {
.main-container .main-content {
margin-left: 70px;
max-width: calc(100% - 70px);
}
}
@media (max-width: 991px) {
.main-container .main-content {
max-width: unset;
margin-left: 0;
}
} .home4-banner-section h1 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 400;
font-size: 11.8vw;
line-height: 1;
text-align: center;
text-transform: uppercase;
white-space: nowrap;
margin-bottom: 0px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home4-banner-section h1 {
font-size: 11.5vw;
}
}
@media (max-width: 1399px) {
.home4-banner-section h1 {
font-size: 11.5vw;
}
}
@media (max-width: 1199px) {
.home4-banner-section h1 {
font-size: 11.3vw;
}
}
.home4-banner-section .banner-video-area {
position: relative;
}
.home4-banner-section .banner-video-area .video-area {
min-height: 400px;
height: 85vh;
}
.home4-banner-section .banner-video-area .video-area video {
width: 100%;
min-height: 400px;
height: 85vh;
-o-object-fit: cover;
object-fit: cover;
}
.home4-banner-section .banner-video-area .video-wrapper {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(var(--black-color-opc), 0.5);
display: flex;
align-items: center;
justify-content: center;
}
.home4-banner-section .banner-video-area .video-wrapper .circular-text2 {
position: relative;
min-width: 120px;
height: 120px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--white-color);
}
.home4-banner-section .banner-video-area .video-wrapper .circular-text2 .play-btn {
width: 65px;
height: 65px;
border-radius: 50%;
background-color: #6a6b6b;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 1;
}
.home4-banner-section .banner-video-area .video-wrapper .circular-text2 .play-btn svg {
fill: var(--white-color);
margin-left: 5px;
}
.home4-banner-section .banner-video-area .video-wrapper .circular-text2 .play-btn .pause-icon {
display: none;
margin-left: 0;
}
.home4-banner-section .banner-video-area .video-wrapper .circular-text2 .play-btn.active .play-icon {
display: none;
}
.home4-banner-section .banner-video-area .video-wrapper .circular-text2 .play-btn.active .pause-icon {
display: block;
}
.home4-banner-section .banner-video-area .video-wrapper .circular-text2 .text {
position: absolute;
width: 100%;
height: 100%;
animation: textRotation 8s linear infinite;
}
.home4-banner-section .banner-video-area .video-wrapper .circular-text2 .text span {
position: absolute;
left: 50%;
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 13px;
font-weight: 700;
transform-origin: 0 60px;
}
.home4-banner-section .banner-video-area .video-wrapper .video-content-btn-area {
max-width: 936px;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
gap: 50px;
}
@media (max-width: 1199px) {
.home4-banner-section .banner-video-area .video-wrapper .video-content-btn-area {
gap: 30px;
}
}
@media (max-width: 991px) {
.home4-banner-section .banner-video-area .video-wrapper .video-content-btn-area {
gap: 20px;
}
}
.home4-banner-section .banner-video-area .video-wrapper .video-content-btn-area .content {
text-align: right;
}
@media (max-width: 767px) {
.home4-banner-section .banner-video-area .video-wrapper .video-content-btn-area .content {
text-align: center;
}
}
.home4-banner-section .banner-video-area .video-wrapper .video-content-btn-area .content h2 {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 70px;
line-height: 60px;
letter-spacing: 0.05em;
text-transform: uppercase;
margin-bottom: 30px;
}
.home4-banner-section .banner-video-area .video-wrapper .video-content-btn-area .content h2:last-child {
margin-bottom: 0;
margin-right: 50px;
}
@media (max-width: 1199px) {
.home4-banner-section .banner-video-area .video-wrapper .video-content-btn-area .content h2:last-child {
margin-right: 30px;
}
}
@media (max-width: 991px) {
.home4-banner-section .banner-video-area .video-wrapper .video-content-btn-area .content h2:last-child {
margin-right: 25px;
}
}
@media (max-width: 1399px) {
.home4-banner-section .banner-video-area .video-wrapper .video-content-btn-area .content h2 {
font-size: 65px;
}
}
@media (max-width: 1199px) {
.home4-banner-section .banner-video-area .video-wrapper .video-content-btn-area .content h2 {
font-size: 60px;
margin-bottom: 25px;
}
}
@media (max-width: 991px) {
.home4-banner-section .banner-video-area .video-wrapper .video-content-btn-area .content h2 {
font-size: 52px;
margin-bottom: 15px;
}
}
@media (max-width: 767px) {
.home4-banner-section .banner-video-area .video-wrapper .video-content-btn-area .content h2 {
font-size: 48px;
}
}
@media (max-width: 576px) {
.home4-banner-section .banner-video-area .video-wrapper .video-content-btn-area .content h2 {
font-size: 42px;
margin-bottom: 0;
}
} .home4-about-section .about-title-area {
max-width: 1096px;
width: 100%;
margin: 0 auto;
margin-bottom: 60px;
text-align: center;
}
@media (max-width: 991px) {
.home4-about-section .about-title-area {
margin-bottom: 50px;
}
}
@media (max-width: 767px) {
.home4-about-section .about-title-area {
margin-bottom: 40px;
}
}
.home4-about-section .about-title-area > span {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 50px;
line-height: 1;
text-transform: uppercase;
display: block;
margin-bottom: 40px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home4-about-section .about-title-area > span {
font-size: 45px;
margin-bottom: 35px;
}
}
@media (max-width: 1399px) {
.home4-about-section .about-title-area > span {
font-size: 40px;
margin-bottom: 30px;
}
}
@media (max-width: 767px) {
.home4-about-section .about-title-area > span {
font-size: 32px;
margin-bottom: 25px;
}
}
@media (max-width: 576px) {
.home4-about-section .about-title-area > span {
font-size: 26px;
margin-bottom: 20px;
}
}
.home4-about-section .about-title-area h2 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 500;
font-size: 55px;
line-height: 1.2;
letter-spacing: 0.02em;
margin-bottom: 0;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home4-about-section .about-title-area h2 {
font-size: 52px;
}
}
@media (max-width: 1399px) {
.home4-about-section .about-title-area h2 {
font-size: 48px;
}
}
@media (max-width: 1199px) {
.home4-about-section .about-title-area h2 {
font-size: 45px;
}
}
@media (max-width: 767px) {
.home4-about-section .about-title-area h2 {
font-size: 39px;
line-height: 1.3;
}
}
@media (max-width: 576px) {
.home4-about-section .about-title-area h2 {
font-size: 32px;
}
}
.home4-about-section .about-title-area h2 span {
color: rgba(var(--title-color-opc), 0.5);
}
.home4-about-section .about-img {
height: 100%;
}
@media (max-width: 576px) {
.home4-about-section .about-img {
height: unset;
}
}
.home4-about-section .about-img img {
border-radius: 500px 500px 50px 50px;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
@media (max-width: 991px) {
.home4-about-section .about-img img {
width: 100%;
max-height: 650px;
}
}
@media (max-width: 767px) {
.home4-about-section .about-img img {
max-height: 500px;
}
}
@media (max-width: 576px) {
.home4-about-section .about-img img {
height: unset;
}
}
.home4-about-section .about-content {
display: flex;
flex-direction: column;
justify-content: space-between;
gap: 70px;
padding-top: 20px;
}
@media (max-width: 1199px) {
.home4-about-section .about-content {
gap: 40px;
}
}
@media (max-width: 991px) {
.home4-about-section .about-content {
padding-top: 0;
}
}
.home4-about-section .about-content p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 16px;
line-height: 32px;
margin-bottom: 0;
position: relative;
padding-left: 15px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home4-about-section .about-content p {
font-size: 15px;
line-height: 28px;
}
}
.home4-about-section .about-content p::before {
content: "";
position: absolute;
top: 10px;
left: 0;
width: 2px;
height: 80px;
background-color: rgba(var(--primary-color2-opc), 0.7);
}
.home4-about-section .about-content ul {
padding: 0;
margin: 0;
list-style: none;
}
@media (max-width: 991px) {
.home4-about-section .about-content ul {
display: flex;
justify-content: space-between;
gap: 30px;
}
}
@media (max-width: 767px) {
.home4-about-section .about-content ul {
gap: 20px;
}
}
@media (max-width: 576px) {
.home4-about-section .about-content ul {
flex-wrap: wrap;
gap: 25px;
}
}
.home4-about-section .about-content ul li {
margin-bottom: 40px;
max-width: 424px;
width: 100%;
}
@media (max-width: 1399px) {
.home4-about-section .about-content ul li {
margin-bottom: 30px;
}
}
@media (max-width: 1199px) {
.home4-about-section .about-content ul li {
margin-bottom: 25px;
}
}
@media (max-width: 991px) {
.home4-about-section .about-content ul li {
margin-bottom: 0;
}
}
.home4-about-section .about-content ul li:last-child {
margin-bottom: 0;
margin-left: auto;
}
.home4-about-section .about-content ul li h6 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 700;
font-size: 22px;
line-height: 1.2;
margin-bottom: 15px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home4-about-section .about-content ul li h6 {
margin-bottom: 10px;
}
}
@media (max-width: 767px) {
.home4-about-section .about-content ul li h6 {
font-size: 21px;
}
}
@media (max-width: 576px) {
.home4-about-section .about-content ul li h6 {
font-size: 20px;
margin-bottom: 10px;
}
}
.home4-about-section .about-content ul li p {
padding-left: 0;
}
.home4-about-section .about-content ul li p::before {
display: none;
} .home4-service-section {
padding: 90px 45px;
background-color: var(--black-color);
}
@media (max-width: 1799px) {
.home4-service-section {
padding: 90px 30px;
}
}
@media (max-width: 1699px) {
.home4-service-section {
padding: 90px 20px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home4-service-section {
padding: 90px 15px;
}
}
@media (max-width: 1199px) {
.home4-service-section {
padding: 80px 20px;
}
}
@media (max-width: 767px) {
.home4-service-section {
padding: 70px 10px;
}
}
@media (max-width: 576px) {
.home4-service-section {
padding: 60px 0px;
}
}
.home4-service-section .service-wrapper {
padding: 0;
margin: 0;
list-style: none;
}
.home4-service-section .service-wrapper .single-service {
display: flex;
align-items: center;
justify-content: space-between;
gap: 20px;
padding: 35px 70px 35px 35px;
background-color: var(--white-color);
border-radius: 10px;
transition: 0.5s;
margin-bottom: 30px;
}
@media (max-width: 1699px) {
.home4-service-section .service-wrapper .single-service {
padding: 35px 50px 35px 25px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home4-service-section .service-wrapper .single-service {
padding: 25px 40px 25px 20px;
}
}
@media (max-width: 1399px) {
.home4-service-section .service-wrapper .single-service {
padding: 25px 50px 25px 20px;
}
}
@media (max-width: 1199px) {
.home4-service-section .service-wrapper .single-service {
flex-wrap: wrap;
padding: 25px;
}
}
@media (max-width: 767px) {
.home4-service-section .service-wrapper .single-service {
padding: 25px 20px;
gap: 15px;
}
}
@media (max-width: 576px) {
.home4-service-section .service-wrapper .single-service {
padding: 20px 10px 25px;
gap: 10px;
}
}
.home4-service-section .service-wrapper .single-service:last-child {
margin-bottom: 0;
}
.home4-service-section .service-wrapper .single-service .service-img-and-title-area {
display: flex;
gap: 50px;
max-width: 900px;
width: 100%;
}
@media (max-width: 1699px) {
.home4-service-section .service-wrapper .single-service .service-img-and-title-area {
gap: 40px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home4-service-section .service-wrapper .single-service .service-img-and-title-area {
gap: 20px;
}
}
@media (max-width: 1399px) {
.home4-service-section .service-wrapper .single-service .service-img-and-title-area {
gap: 10px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home4-service-section .service-wrapper .single-service .service-img-and-title-area {
gap: 15px;
}
}
@media (max-width: 991px) {
.home4-service-section .service-wrapper .single-service .service-img-and-title-area {
flex-wrap: wrap;
gap: 30px;
}
}
@media (max-width: 767px) {
.home4-service-section .service-wrapper .single-service .service-img-and-title-area {
gap: 25px;
}
}
.home4-service-section .service-wrapper .single-service .service-img-and-title-area .service-img {
-webkit-mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home4/service-img-bg.png);
mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home4/service-img-bg.png);
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
min-width: 450px;
transition: mask-image 0.5s ease-in-out, -webkit-mask-image 0.5s ease-in-out;
position: relative;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home4-service-section .service-wrapper .single-service .service-img-and-title-area .service-img {
max-width: 330px;
min-width: 330px;
width: 100%;
-webkit-mask-size: contain;
mask-size: contain;
}
}
@media (max-width: 576px) {
.home4-service-section .service-wrapper .single-service .service-img-and-title-area .service-img {
min-width: unset;
-webkit-mask-size: cover;
mask-size: cover;
min-height: 200px;
-webkit-mask-position: center center;
mask-position: center center;
border-radius: 10px;
}
.home4-service-section .service-wrapper .single-service .service-img-and-title-area .service-img img {
min-height: 200px;
}
}
.home4-service-section .service-wrapper .single-service .service-img-and-title-area .title-area {
padding: 35px 0 20px;
}
@media (max-width: 1199px) {
.home4-service-section .service-wrapper .single-service .service-img-and-title-area .title-area {
padding: 25px 0 20px;
}
}
@media (max-width: 991px) {
.home4-service-section .service-wrapper .single-service .service-img-and-title-area .title-area {
padding: 0;
}
}
.home4-service-section .service-wrapper .single-service .service-img-and-title-area .title-area ul {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 15px;
margin-bottom: 80px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home4-service-section .service-wrapper .single-service .service-img-and-title-area .title-area ul {
margin-bottom: 40px;
gap: 10px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home4-service-section .service-wrapper .single-service .service-img-and-title-area .title-area ul {
gap: 10px;
}
}
@media (max-width: 991px) {
.home4-service-section .service-wrapper .single-service .service-img-and-title-area .title-area ul {
margin-bottom: 25px;
}
}
@media (max-width: 576px) {
.home4-service-section .service-wrapper .single-service .service-img-and-title-area .title-area ul {
gap: 10px;
row-gap: 15px;
margin-bottom: 20px;
}
}
.home4-service-section .service-wrapper .single-service .service-img-and-title-area .title-area ul li {
display: inline-flex;
color: var(--primary-color2);
font-family: var(--font-dmsans);
font-weight: 500;
font-size: 15px;
line-height: 1;
padding: 7px 20px;
background-color: rgba(var(--primary-color2-opc), 0.15);
border: 1px solid rgba(var(--primary-color2-opc), 0.2);
border-radius: 100px;
transition: 0.5s;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home4-service-section .service-wrapper .single-service .service-img-and-title-area .title-area ul li {
font-size: 14px;
padding: 5px 15px;
}
}
@media (max-width: 576px) {
.home4-service-section .service-wrapper .single-service .service-img-and-title-area .title-area ul li {
font-size: 14px;
padding: 5px 15px;
}
}
.home4-service-section .service-wrapper .single-service .service-img-and-title-area .title-area h2 {
margin-bottom: 0;
line-height: 1.3;
}
.home4-service-section .service-wrapper .single-service .service-img-and-title-area .title-area h2 a {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 35px;
line-height: 1.3;
text-transform: uppercase;
transition: 0.5s;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home4-service-section .service-wrapper .single-service .service-img-and-title-area .title-area h2 a {
font-size: 32px;
}
}
@media (max-width: 1399px) {
.home4-service-section .service-wrapper .single-service .service-img-and-title-area .title-area h2 a {
font-size: 30px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home4-service-section .service-wrapper .single-service .service-img-and-title-area .title-area h2 a {
font-size: 26px;
}
}
@media (max-width: 767px) {
.home4-service-section .service-wrapper .single-service .service-img-and-title-area .title-area h2 a {
font-size: 28px;
}
}
@media (max-width: 576px) {
.home4-service-section .service-wrapper .single-service .service-img-and-title-area .title-area h2 a {
font-size: 22px;
}
}
.home4-service-section .service-wrapper .single-service .service-content {
max-width: 467px;
width: 100%;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home4-service-section .service-wrapper .single-service .service-content {
max-width: 362px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home4-service-section .service-wrapper .single-service .service-content {
max-width: 330px;
}
}
@media (max-width: 1199px) {
.home4-service-section .service-wrapper .single-service .service-content {
max-width: unset;
}
}
.home4-service-section .service-wrapper .single-service .service-content p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 16px;
font-weight: 400;
line-height: 32px;
margin-bottom: 40px;
padding-left: 15px;
position: relative;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home4-service-section .service-wrapper .single-service .service-content p {
margin-bottom: 30px;
}
}
@media (max-width: 1199px) {
.home4-service-section .service-wrapper .single-service .service-content p {
margin-bottom: 30px;
}
}
@media (max-width: 991px) {
.home4-service-section .service-wrapper .single-service .service-content p {
margin-bottom: 25px;
}
}
@media (max-width: 767px) {
.home4-service-section .service-wrapper .single-service .service-content p {
margin-bottom: 20px;
}
}
@media (max-width: 576px) {
.home4-service-section .service-wrapper .single-service .service-content p {
padding-left: 10px;
font-size: 15px;
line-height: 28px;
}
}
.home4-service-section .service-wrapper .single-service .service-content p::before {
content: "";
position: absolute;
width: 2px;
height: 77px;
top: 10px;
left: 0;
background-color: rgba(var(--black-color-opc), 0.3);
}
@media (max-width: 1199px) {
.home4-service-section .service-wrapper .single-service .service-content p::before {
height: 45px;
}
}
.home4-service-section .service-wrapper .single-service .service-content .details-btn {
display: flex;
align-items: center;
gap: 5px;
}
.home4-service-section .service-wrapper .single-service .service-content .details-btn span {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
line-height: 1;
text-transform: uppercase;
text-decoration: underline;
display: inline-block;
padding: 14px 28px;
border-radius: 28px;
border: 1px solid rgba(var(--black-color-opc), 0.2);
transition: 0.5s;
}
.home4-service-section .service-wrapper .single-service .service-content .details-btn .icon {
min-width: 43px;
max-width: 43px;
height: 43px;
border: 1px solid rgba(var(--black-color-opc), 0.2);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
transition: 0.5s;
}
.home4-service-section .service-wrapper .single-service .service-content .details-btn .icon svg {
fill: rgba(var(--title-color-opc), 0.15);
transition: 0.5s;
}
.home4-service-section .service-wrapper .single-service:hover {
background-color: var(--primary-color2);
border-radius: 200px;
}
@media (max-width: 1199px) {
.home4-service-section .service-wrapper .single-service:hover {
border-radius: 50px;
}
}
@media (max-width: 767px) {
.home4-service-section .service-wrapper .single-service:hover {
border-radius: 30px;
}
}
.home4-service-section .service-wrapper .single-service:hover .service-img-and-title-area .service-img {
-webkit-mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home4/service-img-hover-bg.png);
mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home4/service-img-hover-bg.png);
}
.home4-service-section .service-wrapper .single-service:hover .service-img-and-title-area .title-area ul li {
color: var(--white-color);
background-color: rgba(255, 255, 255, 0.15);
border: 1px solid rgba(255, 255, 255, 0.2);
}
.home4-service-section .service-wrapper .single-service:hover .service-img-and-title-area .title-area h2 a {
color: var(--white-color);
}
.home4-service-section .service-wrapper .single-service:hover .service-content p {
color: var(--white-color);
}
.home4-service-section .service-wrapper .single-service:hover .service-content p::before {
background-color: rgba(255, 255, 255, 0.3);
}
.home4-service-section .service-wrapper .single-service:hover .service-content .details-btn span {
color: var(--white-color);
background-color: var(--black-color);
border: 1px solid var(--black-color);
}
.home4-service-section .service-wrapper .single-service:hover .service-content .details-btn .icon {
background-color: var(--black-color);
border: 1px solid var(--black-color);
}
.home4-service-section .service-wrapper .single-service:hover .service-content .details-btn .icon svg {
fill: var(--white-color);
} .home4-project-section .project-nav-area .nav-pills {
border-bottom: 1px solid rgba(var(--black-color-opc), 0.15);
padding-left: 40px;
padding-right: 28px;
gap: 60px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home4-project-section .project-nav-area .nav-pills {
padding-left: 20px;
padding-right: 15px;
gap: 25px;
}
}
@media (max-width: 991px) {
.home4-project-section .project-nav-area .nav-pills {
padding-left: 0;
gap: 35px;
}
}
@media (max-width: 576px) {
.home4-project-section .project-nav-area .nav-pills {
gap: 15px;
}
}
.home4-project-section .project-nav-area .nav-pills .nav-item .nav-link {
padding: 0;
padding-bottom: 15px;
background-color: unset;
color: rgba(var(--title-color-opc), 0.5);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
line-height: 100%;
letter-spacing: 0.06em;
text-transform: uppercase;
border-radius: unset;
background: linear-gradient(to bottom, rgba(var(--title-color-opc), 1) 0%, rgba(var(--title-color-opc), 1) 98%);
background-size: 0px 1px;
background-repeat: no-repeat;
background-position: right 100%;
transition: background-size 0.75s;
}
@media (max-width: 576px) {
.home4-project-section .project-nav-area .nav-pills .nav-item .nav-link {
padding-bottom: 10px;
}
}
.home4-project-section .project-nav-area .nav-pills .nav-item .nav-link.active {
color: var(--title-color);
background-size: 100% 1px;
background-position: 0% 100%;
}
.home4-project-section .project-bottom-area {
padding-top: 35px;
border-top: 1px solid rgba(var(--black-color-opc), 0.15);
display: flex;
align-items: center;
justify-content: space-between;
}
@media (max-width: 1399px) {
.home4-project-section .project-bottom-area {
flex-wrap: wrap;
gap: 20px;
}
} .home4-process-section {
padding-bottom: 55px;
}
@media (max-width: 1199px) {
.home4-process-section {
padding: 80px 0;
}
}
@media (max-width: 767px) {
.home4-process-section {
padding: 70px 0;
}
}
.home4-process-section .process-wrapper {
position: relative;
}
.home4-process-section .process-wrapper .vector-area {
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 0;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
height: 100%;
}
@media (max-width: 1399px) {
.home4-process-section .process-wrapper .vector-area {
left: 46%;
}
}
@media (max-width: 991px) {
.home4-process-section .process-wrapper .vector-area {
display: none;
}
}
.home4-process-section .process-list {
padding: 0;
margin: 0;
list-style: none;
}
.home4-process-section .process-list li {
border-bottom: 1px solid rgba(var(--black-color-opc), 0.1);
padding: 0 20px 10px;
margin-bottom: 10px;
}
.home4-process-section .process-list li:last-child {
margin-bottom: 0;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home4-process-section .process-list li {
padding: 0 15px 10px;
}
}
@media (max-width: 991px) {
.home4-process-section .process-list li {
padding: 0 10px 10px;
}
}
@media (max-width: 576px) {
.home4-process-section .process-list li {
padding: 0 5px 10px;
}
}
.home4-process-section .process-list li .single-process {
display: flex;
align-items: center;
gap: 40px;
padding: 15px 0px;
background-color: transparent;
transition: 0.5s;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home4-process-section .process-list li .single-process {
gap: 20px;
}
}
@media (max-width: 576px) {
.home4-process-section .process-list li .single-process {
gap: 15px;
padding: 10px 0;
}
}
.home4-process-section .process-list li .single-process span {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 500;
font-size: 18px;
line-height: 1;
display: block;
min-width: 43px;
max-width: 43px;
height: 43px;
border-radius: 50%;
border: 1px solid rgba(var(--title-color-opc), 0.15);
display: flex;
align-items: center;
justify-content: center;
transition: 0.5s;
}
@media (max-width: 576px) {
.home4-process-section .process-list li .single-process span {
font-size: 15px;
min-width: 37px;
max-width: 37px;
height: 37px;
}
}
.home4-process-section .process-list li .single-process h5 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 500;
font-size: 20px;
line-height: 28px;
letter-spacing: 0.06em;
text-transform: uppercase;
margin-bottom: 0;
transition: 0.5s;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home4-process-section .process-list li .single-process h5 {
font-size: 18px;
}
}
@media (max-width: 576px) {
.home4-process-section .process-list li .single-process h5 {
font-size: 17px;
}
}
.home4-process-section .process-list li .single-process:hover {
padding: 15px 30px;
background-color: rgba(var(--black-color-opc), 0.05);
}
.home4-process-section .process-list li .single-process:hover span {
border-color: rgba(var(--primary-color2-opc), 0.15);
color: var(--primary-color2);
}
.home4-process-section .process-list li .single-process:hover h5 {
color: var(--primary-color2);
}
@media (max-width: 1199px) {
.home4-process-section .process-list li .single-process:hover {
padding: 15px 20px;
}
}
.home4-process-section .process-img-wrap {
position: relative;
max-width: 563px;
width: 100%;
margin-left: auto;
}
@media (max-width: 991px) {
.home4-process-section .process-img-wrap {
margin-left: 0;
}
}
.home4-process-section .process-img-wrap .process-img-list {
padding: 0;
margin: 0;
list-style: none;
}
.home4-process-section .process-img-wrap .process-img-list li .process-card3 {
position: absolute;
display: block;
width: 100%;
height: 100%;
top: 0;
left: 0;
opacity: 0;
transition: 0.5s;
z-index: 12;
height: 100%;
}
@media (max-width: 991px) {
.home4-process-section .process-img-wrap .process-img-list li .process-card3 {
position: relative;
display: none;
}
}
.home4-process-section .process-img-wrap .process-img-list li .process-img img {
border-radius: 20px 5px 20px 20px;
}
@media (max-width: 576px) {
.home4-process-section .process-img-wrap .process-img-list li .process-img img {
border-radius: 10px 5px 10px 10px;
min-height: 250px;
-o-object-fit: cover;
object-fit: cover;
}
}
.home4-process-section .process-img-wrap .process-img-list li .process-content {
padding: 30px 30px 0;
}
@media (max-width: 1199px) {
.home4-process-section .process-img-wrap .process-img-list li .process-content {
padding: 25px 25px 0;
}
}
@media (max-width: 576px) {
.home4-process-section .process-img-wrap .process-img-list li .process-content {
padding: 20px 10px 0;
}
}
.home4-process-section .process-img-wrap .process-img-list li .process-content h5 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 500;
font-size: 20px;
line-height: 28px;
letter-spacing: 0.06em;
text-transform: uppercase;
margin-bottom: 25px;
}
@media (max-width: 1199px) {
.home4-process-section .process-img-wrap .process-img-list li .process-content h5 {
margin-bottom: 15px;
}
}
@media (max-width: 576px) {
.home4-process-section .process-img-wrap .process-img-list li .process-content h5 {
margin-bottom: 10px;
}
}
.home4-process-section .process-img-wrap .process-img-list li .process-content p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 16px;
line-height: 32px;
margin-bottom: 0;
margin-left: 35px;
padding-left: 15px;
position: relative;
}
@media (max-width: 1199px) {
.home4-process-section .process-img-wrap .process-img-list li .process-content p {
margin-left: 25px;
}
}
@media (max-width: 576px) {
.home4-process-section .process-img-wrap .process-img-list li .process-content p {
margin-left: 10px;
padding-left: 10px;
font-size: 15px;
line-height: 28px;
}
}
.home4-process-section .process-img-wrap .process-img-list li .process-content p::before {
content: "";
position: absolute;
top: 10px;
left: 0;
width: 2px;
height: 77px;
background-color: rgba(var(--black-color-opc), 0.3);
}
.home4-process-section .process-img-wrap .process-img-list li.active .process-card3 {
z-index: 15;
opacity: 1;
}
@media (max-width: 991px) {
.home4-process-section .process-img-wrap .process-img-list li.active .process-card3 {
display: block;
}
}
.home4-process-bottom-vector {
display: flex;
align-items: center;
justify-content: center;
margin-bottom: -35px;
}
@media (max-width: 991px) {
.home4-process-bottom-vector {
display: none;
}
}
@media (max-width: 1399px) {
.home4-process-bottom-vector img {
margin-left: -84px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home4-process-bottom-vector img {
margin-left: -75px;
}
} .home4-testimonial-section .slider-btn-grp {
padding-top: 35px;
border-top: 1px solid rgba(var(--black-color-opc), 0.15);
justify-content: space-between;
}
@media (max-width: 576px) {
.home4-testimonial-section .slider-btn-grp {
padding-top: 25px;
}
}
.home4-testimonial-section .slider-btn-grp h6 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 400;
font-size: 16px;
line-height: 30px;
letter-spacing: 0.03em;
text-align: center;
margin-bottom: 0;
}
@media (max-width: 576px) {
.home4-testimonial-section .slider-btn-grp h6 {
font-size: 15px;
line-height: 26px;
}
}
.home4-testimonial-section .slider-btn-grp h6 a {
color: var(--primary-color2);
font-weight: 600;
text-decoration: underline;
transition: 0.5s;
}
.home4-testimonial-section .slider-btn-grp h6 a:hover {
color: var(--title-color);
} .home4-career-section {
overflow: hidden;
}
.home4-career-section .career-img {
position: relative;
height: 100%;
}
@media (max-width: 576px) {
.home4-career-section .career-img {
height: unset;
}
}
.home4-career-section .career-img::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(var(--black-color-opc), 0.3);
}
.home4-career-section .career-img img {
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
@media (max-width: 576px) {
.home4-career-section .career-img img {
height: unset;
}
}
.home4-career-section .career-content-wrap {
padding: 90px 60px;
background-color: var(--black-color);
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home4-career-section .career-content-wrap {
padding: 90px 30px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home4-career-section .career-content-wrap {
padding: 80px 20px;
}
}
@media (max-width: 991px) {
.home4-career-section .career-content-wrap {
padding: 70px 30px;
}
}
@media (max-width: 576px) {
.home4-career-section .career-content-wrap {
padding: 60px 10px;
}
}
.home4-career-section .career-content-wrap .career-list {
padding: 0;
margin: 0;
list-style: none;
margin-bottom: 80px;
}
@media (max-width: 1399px) {
.home4-career-section .career-content-wrap .career-list {
margin-bottom: 60px;
}
}
@media (max-width: 991px) {
.home4-career-section .career-content-wrap .career-list {
margin-bottom: 50px;
}
}
.home4-career-section .career-content-wrap .career-list .single-career {
padding: 30px 30px;
background-color: #141414;
border-radius: 10px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 20px;
flex-wrap: wrap;
margin-bottom: 50px;
}
.home4-career-section .career-content-wrap .career-list .single-career:last-child {
margin-bottom: 0;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home4-career-section .career-content-wrap .career-list .single-career {
padding: 30px 20px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home4-career-section .career-content-wrap .career-list .single-career {
padding: 30px 20px;
margin-bottom: 40px;
}
}
@media (max-width: 991px) {
.home4-career-section .career-content-wrap .career-list .single-career {
padding: 30px 20px;
}
}
@media (max-width: 767px) {
.home4-career-section .career-content-wrap .career-list .single-career {
flex-direction: column;
align-items: flex-start;
gap: 40px;
}
}
@media (max-width: 576px) {
.home4-career-section .career-content-wrap .career-list .single-career {
gap: 30px;
border-radius: 5px;
margin-bottom: 30px;
}
}
.home4-career-section .career-content-wrap .career-list .single-career .post-name h5 {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 22px;
line-height: 1.3;
margin-bottom: 0;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home4-career-section .career-content-wrap .career-list .single-career .post-name h5 {
font-size: 20px;
}
}
.home4-career-section .career-content-wrap .career-list .single-career .job-discription-wrap {
display: flex;
align-items: center;
gap: 80px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home4-career-section .career-content-wrap .career-list .single-career .job-discription-wrap {
gap: 50px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home4-career-section .career-content-wrap .career-list .single-career .job-discription-wrap {
gap: 20px;
}
}
@media (max-width: 1199px) {
.home4-career-section .career-content-wrap .career-list .single-career .job-discription-wrap {
gap: 60px;
}
}
@media (max-width: 991px) {
.home4-career-section .career-content-wrap .career-list .single-career .job-discription-wrap {
gap: 40px;
}
}
@media (max-width: 767px) {
.home4-career-section .career-content-wrap .career-list .single-career .job-discription-wrap {
justify-content: space-between;
width: 100%;
flex-wrap: wrap;
}
}
@media (max-width: 576px) {
.home4-career-section .career-content-wrap .career-list .single-career .job-discription-wrap {
gap: 30px;
flex-direction: column;
align-items: flex-start;
}
}
.home4-career-section .career-content-wrap .career-list .single-career .job-discription-wrap .job-discription {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
gap: 50px;
position: relative;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home4-career-section .career-content-wrap .career-list .single-career .job-discription-wrap .job-discription {
gap: 30px;
}
}
.home4-career-section .career-content-wrap .career-list .single-career .job-discription-wrap .job-discription::before {
content: "";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 1px;
height: 28px;
background-color: rgba(255, 255, 255, 0.2);
}
.home4-career-section .career-content-wrap .career-list .single-career .job-discription-wrap .job-discription li {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 500;
font-size: 14px;
line-height: 1;
}
.home4-career-section .career-content-wrap .career-list .single-career .job-discription-wrap .job-discription li span {
color: var(--primary-color2);
display: block;
margin-bottom: 10px;
}
.home4-career-section .career-content-wrap .career-list .single-career .job-discription-wrap .apply-btn {
display: flex;
align-items: center;
gap: 5px;
}
.home4-career-section .career-content-wrap .career-list .single-career .job-discription-wrap .apply-btn span {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
line-height: 1;
text-transform: uppercase;
text-decoration: underline;
display: inline-block;
padding: 14px 28px;
border-radius: 28px;
border: 1px solid rgba(255, 255, 255, 0.3);
transition: 0.5s;
}
.home4-career-section .career-content-wrap .career-list .single-career .job-discription-wrap .apply-btn .icon {
min-width: 43px;
max-width: 43px;
height: 43px;
border: 1px solid rgba(255, 255, 255, 0.3);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
transition: 0.5s;
}
.home4-career-section .career-content-wrap .career-list .single-career .job-discription-wrap .apply-btn .icon svg {
fill: rgba(255, 255, 255, 0.5);
transition: 0.5s;
}
.home4-career-section .career-content-wrap .career-list .single-career .job-discription-wrap .apply-btn:hover span {
background-color: var(--primary-color2);
border-color: var(--primary-color2);
}
.home4-career-section .career-content-wrap .career-list .single-career .job-discription-wrap .apply-btn:hover .icon {
background-color: var(--primary-color2);
border-color: var(--primary-color2);
}
.home4-career-section .career-content-wrap .career-list .single-career .job-discription-wrap .apply-btn:hover .icon svg {
fill: var(--white-color);
transform: rotate(45deg);
} .home4-counter-section {
position: relative;
}
.home4-counter-section::before {
content: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home4/icon/home4-counter-vector.svg);
position: absolute;
bottom: 0;
right: 0;
line-height: 1;
}
.home4-counter-section .counter-wrap {
padding: 80px 0;
position: relative;
}
@media (max-width: 991px) {
.home4-counter-section .counter-wrap {
padding: 60px 0;
}
}
.home4-counter-section .counter-wrap .divider {
position: relative;
}
.home4-counter-section .counter-wrap .divider::before {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 0px;
height: 132px;
width: 1px;
background: linear-gradient(1800deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 51%, rgba(0, 0, 0, 0) 100%);
}
@media (max-width: 991px) {
.home4-counter-section .counter-wrap .divider::before {
display: none;
}
}
.home4-counter-section .counter-wrap .single-countdown {
text-align: center;
}
.home4-counter-section .counter-wrap .single-countdown .number {
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 5px;
}
.home4-counter-section .counter-wrap .single-countdown .number h2,
.home4-counter-section .counter-wrap .single-countdown .number span {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 55px;
font-weight: 600;
line-height: 1;
margin-bottom: 0;
}
@media (max-width: 1199px) {
.home4-counter-section .counter-wrap .single-countdown .number h2,
.home4-counter-section .counter-wrap .single-countdown .number span {
font-size: 50px;
}
}
.home4-counter-section .counter-wrap .single-countdown span {
color: rgba(var(--title-color-opc), 0.6);
font-family: var(--font-manrope);
font-size: 14px;
font-weight: 500;
line-height: 1.5;
letter-spacing: 0.06em;
text-transform: uppercase;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home4-counter-section .counter-wrap .single-countdown span {
font-size: 13px;
}
}
@media (max-width: 991px) {
.home4-counter-section .counter-wrap .single-countdown span {
font-size: 14px;
}
} .product-card .product-img {
position: relative;
margin-bottom: 30px;
overflow: hidden;
}
@media (max-width: 767px) {
.product-card .product-img {
margin-bottom: 20px;
}
}
.product-card .product-img .arrow {
width: 54px;
height: 50px;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--white-color);
position: absolute;
top: 0;
right: 0;
transition: 0.5s;
}
.product-card .product-img img {
width: 100%;
min-height: 292px;
-o-object-fit: cover;
object-fit: cover;
transition: all 0.5s ease-out;
}
.product-card .product-content {
padding-left: 20px;
}
@media (max-width: 767px) {
.product-card .product-content {
padding-left: 10px;
}
}
.product-card .product-content h4 {
margin-bottom: 20px;
}
@media (max-width: 767px) {
.product-card .product-content h4 {
margin-bottom: 15px;
}
}
@media (max-width: 576px) {
.product-card .product-content h4 {
margin-bottom: 10px;
}
}
.product-card .product-content h4 a {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 24px;
line-height: 1.3;
letter-spacing: 0.03em;
text-transform: uppercase;
transition: 0.5s;
}
@media (max-width: 576px) {
.product-card .product-content h4 a {
font-size: 22px;
}
}
.product-card .product-content h4 a:hover {
color: var(--primary-color2);
}
.product-card .product-content p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 16px;
line-height: 1.8;
margin-bottom: 0;
}
@media (max-width: 576px) {
.product-card .product-content p {
font-size: 15px;
}
}
.product-card:hover .product-img .arrow {
background-color: var(--primary-color2);
}
.product-card:hover .product-img .arrow svg {
fill: var(--white-color);
}
.product-card:hover .product-img img {
transform: scale(1.1);
}
.home4-product-section .mt-15 {
margin-top: 15px;
}
.home4-product-section .faq-wrap {
margin-right: 35px;
position: sticky;
top: 50px;
}
@media (max-width: 1399px) {
.home4-product-section .faq-wrap {
margin-right: 20px;
}
}
@media (max-width: 1199px) {
.home4-product-section .faq-wrap {
margin-right: 0;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home4-product-section .faq-wrap .accordion .accordion-item .accordion-header .accordion-button {
font-size: 15px;
}
}
.home4-product-section .product-wrapper {
position: relative;
}
.home4-product-section .product-wrapper::before {
content: "";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 1px;
height: 70%;
opacity: 0.1;
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 48%, rgba(0, 0, 0, 0) 100%);
}
@media (max-width: 767px) {
.home4-product-section .product-wrapper::before {
display: none;
}
}
.home4-product-section .product-wrapper::after {
content: "";
position: absolute;
top: 51%;
left: 50%;
transform: translate(-50%, -50%);
width: 70%;
height: 1px;
opacity: 0.1;
background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, #070707 50%, rgba(0, 0, 0, 0) 100%);
}
@media (max-width: 767px) {
.home4-product-section .product-wrapper::after {
display: none;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home4-product-section .product-card .product-content {
padding-left: 15px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home4-product-section .product-card .product-content h4 a {
font-size: 22px;
}
}
.home4-product-section .document-area .document-list {
padding: 0;
margin: 0;
list-style: none;
display: grid;
grid-template-columns: 35% 32% 33%;
align-items: center;
justify-content: space-between;
border-radius: 200px;
border: 1px solid rgba(var(--black-color-opc), 0.15);
}
@media (max-width: 1399px) {
.home4-product-section .document-area .document-list {
grid-template-columns: 38% 29% 33%;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home4-product-section .document-area .document-list {
grid-template-columns: 38% 31% 31%;
}
}
@media (max-width: 991px) {
.home4-product-section .document-area .document-list {
display: flex;
flex-wrap: wrap;
border-radius: unset;
border: unset;
gap: 10px;
}
}
@media (max-width: 767px) {
.home4-product-section .document-area .document-list {
gap: 20px;
}
}
.home4-product-section .document-area .document-list li {
display: flex;
align-items: center;
justify-content: space-between;
gap: 25px;
padding: 29px 30px 29px 55px;
min-width: 280px;
min-height: 97px;
background-color: rgba(var(--primary-color2-opc), 0.05);
border-right: 1px solid rgba(var(--black-color-opc), 0.15);
width: 100%;
transition: 0.5s;
height: 100%;
}
@media (max-width: 1399px) {
.home4-product-section .document-area .document-list li {
padding: 29px 25px 29px 30px;
gap: 20px;
}
}
@media (max-width: 991px) {
.home4-product-section .document-area .document-list li {
min-width: unset;
width: unset;
gap: 10px;
padding: 25px 20px;
border: 1px solid rgba(var(--black-color-opc), 0.15);
min-height: unset;
}
}
@media (max-width: 767px) {
.home4-product-section .document-area .document-list li {
width: 100%;
justify-content: space-between;
}
}
@media (max-width: 576px) {
.home4-product-section .document-area .document-list li {
padding: 20px 20px 20px 15px;
}
}
.home4-product-section .document-area .document-list li:first-child {
border-radius: 200px 0 0 200px;
padding-left: 40px;
}
@media (max-width: 1399px) {
.home4-product-section .document-area .document-list li:first-child {
padding-left: 30px;
}
}
@media (max-width: 991px) {
.home4-product-section .document-area .document-list li:first-child {
border-radius: unset;
padding-left: 20px;
}
}
@media (max-width: 576px) {
.home4-product-section .document-area .document-list li:first-child {
padding-left: 15px;
}
}
.home4-product-section .document-area .document-list li:last-child {
border-radius: 0 200px 200px 0;
border-right: unset;
padding-right: 75px;
}
@media (max-width: 1399px) {
.home4-product-section .document-area .document-list li:last-child {
padding-right: 30px;
}
}
@media (max-width: 991px) {
.home4-product-section .document-area .document-list li:last-child {
border-radius: unset;
border-right: 1px solid rgba(var(--black-color-opc), 0.15);
padding-right: 20px;
}
}
.home4-product-section .document-area .document-list li h6 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 16px;
line-height: 28px;
letter-spacing: 0.05em;
text-transform: uppercase;
margin-bottom: 0;
transition: 0.5s;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home4-product-section .document-area .document-list li h6 {
font-size: 15px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home4-product-section .document-area .document-list li h6 {
line-height: 26px;
}
}
@media (max-width: 991px) {
.home4-product-section .document-area .document-list li h6 {
font-size: 15px;
}
}
@media (max-width: 576px) {
.home4-product-section .document-area .document-list li h6 {
font-size: 14px;
}
}
.home4-product-section .document-area .document-list li .download-btn {
display: flex;
flex-direction: column;
align-items: center;
transition: height 0.5s;
}
.home4-product-section .document-area .document-list li .download-btn svg {
fill: rgba(var(--title-color-opc), 0.6);
transition: 0.5s;
transform: translateY(13px);
}
@media (max-width: 576px) {
.home4-product-section .document-area .document-list li .download-btn svg {
transform: translateY(0);
}
}
.home4-product-section .document-area .document-list li .download-btn span {
color: rgba(var(--title-color-opc), 0.6);
font-family: var(--font-manrope);
font-weight: 700;
font-size: 12px;
line-height: 1;
letter-spacing: 0.06em;
text-transform: uppercase;
padding-top: 10px;
transform: scaleY(0);
transform-origin: bottom;
opacity: 0;
transition: transform 0.3s ease, opacity 0.3s ease;
}
@media (max-width: 576px) {
.home4-product-section .document-area .document-list li .download-btn span {
display: none;
}
}
.home4-product-section .document-area .document-list li:hover {
background-color: var(--primary-color2);
}
.home4-product-section .document-area .document-list li:hover h6 {
color: var(--white-color);
}
.home4-product-section .document-area .document-list li:hover .download-btn svg {
transform: translateY(0);
fill: var(--white-color);
}
.home4-product-section .document-area .document-list li:hover .download-btn span {
transform: scaleY(1);
opacity: 1;
color: var(--white-color);
}
.home4-product-section .document-area .contact-area {
text-align: center;
}
.home4-product-section .document-area .contact-area h6 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 400;
font-size: 15px;
line-height: 30px;
letter-spacing: 0.03em;
margin-bottom: 0;
}
.home4-product-section .document-area .contact-area h6 a {
color: var(--primary-color2);
font-weight: 500;
text-decoration: underline;
transition: 0.5s;
}
.home4-product-section .document-area .contact-area h6 a:hover {
color: var(--title-color);
} .home4-contact-section {
padding: 90px 0;
}
@media (max-width: 767px) {
.home4-contact-section {
padding: 70px 0;
}
}
.home4-contact-section .contact-content .vector-and-content {
padding-left: 55px;
padding-top: 50px;
display: flex;
gap: 50px;
margin-bottom: 50px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home4-contact-section .contact-content .vector-and-content {
padding-left: 25px;
gap: 20px;
}
}
@media (max-width: 1199px) {
.home4-contact-section .contact-content .vector-and-content {
padding-top: 45px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home4-contact-section .contact-content .vector-and-content {
padding-top: 40px;
padding-left: 15px;
gap: 15px;
margin-bottom: 40px;
}
}
@media (max-width: 767px) {
.home4-contact-section .contact-content .vector-and-content {
padding-left: 30px;
margin-bottom: 40px;
gap: 35px;
}
}
@media (max-width: 576px) {
.home4-contact-section .contact-content .vector-and-content {
padding-left: 0;
padding-top: 20px;
margin-bottom: 30px;
}
}
.home4-contact-section .contact-content .vector-and-content svg {
fill: rgba(var(--primary-color2-opc), 0.15);
min-width: 76px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home4-contact-section .contact-content .vector-and-content svg {
min-width: 65px;
}
}
@media (max-width: 576px) {
.home4-contact-section .contact-content .vector-and-content svg {
display: none;
}
}
.home4-contact-section .contact-content .vector-and-content p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 16px;
line-height: 28px;
margin-bottom: 0;
}
.home4-contact-section .contact-content .contact-wrap {
display: flex;
align-items: center;
justify-content: space-between;
gap: 20px;
width: 100%;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home4-contact-section .contact-content .contact-wrap {
gap: 10px;
}
}
@media (max-width: 576px) {
.home4-contact-section .contact-content .contact-wrap {
flex-wrap: wrap;
gap: 35px;
}
}
.home4-contact-section .contact-content .contact-wrap .contact-list {
padding: 0;
margin: 0;
list-style: none;
}
.home4-contact-section .contact-content .contact-wrap .contact-list .single-contact {
display: flex;
align-items: center;
gap: 20px;
margin-bottom: 50px;
}
@media (max-width: 576px) {
.home4-contact-section .contact-content .contact-wrap .contact-list .single-contact {
margin-bottom: 30px;
}
}
.home4-contact-section .contact-content .contact-wrap .contact-list .single-contact:last-child {
margin-bottom: 0;
}
.home4-contact-section .contact-content .contact-wrap .contact-list .single-contact .icon {
position: relative;
}
.home4-contact-section .contact-content .contact-wrap .contact-list .single-contact .icon svg {
fill: var(--primary-color2);
width: 26px;
height: 27px;
}
.home4-contact-section .contact-content .contact-wrap .contact-list .single-contact .icon::after {
content: "";
height: 35px;
width: 1px;
position: absolute;
top: 50%;
transform: translateY(-50%);
right: -10px;
background-color: rgba(var(--black-color-opc), 0.15);
}
.home4-contact-section .contact-content .contact-wrap .contact-list .single-contact .content span {
color: rgba(var(--title-color-opc), 0.6);
font-family: var(--font-manrope);
font-size: 14px;
font-weight: 400;
line-height: 1;
display: block;
margin-bottom: 10px;
}
.home4-contact-section .contact-content .contact-wrap .contact-list .single-contact .content h6 {
margin-bottom: 0;
}
.home4-contact-section .contact-content .contact-wrap .contact-list .single-contact .content h6 a {
color: var(--title-color);
font-family: var(--font-dmsans);
font-weight: 600;
font-size: 18px;
line-height: 1;
transition: 0.5s;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home4-contact-section .contact-content .contact-wrap .contact-list .single-contact .content h6 a {
font-size: 17px;
}
}
@media (max-width: 576px) {
.home4-contact-section .contact-content .contact-wrap .contact-list .single-contact .content h6 a {
font-size: 16px;
}
}
.home4-contact-section .contact-content .contact-wrap .contact-list .single-contact .content h6 a:hover {
color: var(--primary-color2);
}
.home4-contact-section .contact-content .contact-wrap .address-area {
max-width: 220px;
width: 100%;
position: relative;
padding-left: 30px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home4-contact-section .contact-content .contact-wrap .address-area {
padding-left: 20px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home4-contact-section .contact-content .contact-wrap .address-area {
padding-left: 10px;
max-width: 150px;
}
}
@media (max-width: 576px) {
.home4-contact-section .contact-content .contact-wrap .address-area {
padding-left: 0;
}
}
.home4-contact-section .contact-content .contact-wrap .address-area::before {
content: "";
position: absolute;
top: 50%;
left: 0;
transform: translateY(-50%);
width: 1px;
height: 53px;
background-color: var(--primary-color2);
}
@media (max-width: 576px) {
.home4-contact-section .contact-content .contact-wrap .address-area::before {
display: none;
}
}
.home4-contact-section .contact-content .contact-wrap .address-area span {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 400;
font-size: 14px;
line-height: 1;
letter-spacing: 0.06em;
text-transform: uppercase;
text-decoration: underline;
display: block;
margin-bottom: 20px;
}
@media (max-width: 576px) {
.home4-contact-section .contact-content .contact-wrap .address-area span {
margin-bottom: 15px;
}
}
.home4-contact-section .contact-content .contact-wrap .address-area a {
color: rgba(var(--title-color-opc), 0.6);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 17px;
line-height: 28px;
transition: 0.5s;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home4-contact-section .contact-content .contact-wrap .address-area a {
font-size: 16px;
}
}
.home4-contact-section .contact-content .contact-wrap .address-area a:hover {
color: var(--primary-color2);
} .blog-card3 {
padding: 16px 20px 30px;
border: 1px solid rgba(var(--black-color-opc), 0.1);
border-radius: 10px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.blog-card3 {
padding: 16px 15px 25px;
}
}
@media (max-width: 991px) {
.blog-card3 {
padding: 16px 14px 25px;
}
}
.blog-card3 .blog-meta {
padding-bottom: 15px;
border-bottom: 1px solid rgba(var(--black-color-opc), 0.1);
margin-bottom: 25px;
}
.blog-card3 .blog-meta ul {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
gap: 25px;
line-height: 1;
}
.blog-card3 .blog-meta ul li {
position: relative;
color: var(--primary-color2);
font-family: var(--font-dmsans);
font-size: 13px;
font-weight: 500;
line-height: 1;
letter-spacing: 0.03em;
text-transform: uppercase;
transition: 0.5s;
}
@media (max-width: 576px) {
.blog-card3 .blog-meta ul li {
font-size: 12px;
}
}
.blog-card3 .blog-meta ul li span {
text-decoration: underline;
text-underline-offset: 4px;
}
.blog-card3 .blog-meta ul li::before {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
right: -12px;
width: 1px;
height: 12px;
background-color: rgba(var(--black-color-opc), 0.2);
}
.blog-card3 .blog-meta ul li:last-child::before {
display: none;
}
.blog-card3 .blog-meta ul li a {
color: var(--text-color);
transition: 0.5s;
}
.blog-card3 .blog-meta ul li a:hover {
color: var(--primary-color2);
}
.blog-card3 .author-area {
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 20px;
}
@media (max-width: 991px) {
.blog-card3 .author-area {
margin-bottom: 15px;
}
}
.blog-card3 .author-area .author-img img {
min-width: 45px;
max-width: 45px;
height: 45px;
border-radius: 50%;
-o-object-fit: cover;
object-fit: cover;
}
.blog-card3 .author-area .author-content h6 {
color: var(--text-color);
font-family: var(--font-manrope);
font-weight: 500;
font-size: 16px;
line-height: 1;
text-transform: capitalize;
margin-bottom: 2px;
}
.blog-card3 .author-area .author-content h6 span {
color: var(--title-color);
font-size: 18px;
}
@media (max-width: 576px) {
.blog-card3 .author-area .author-content h6 span {
font-size: 16px;
}
}
@media (max-width: 576px) {
.blog-card3 .author-area .author-content h6 {
font-size: 14px;
}
}
.blog-card3 .author-area .author-content > span {
color: var(--text-color);
font-family: var(--font-dmsans);
font-weight: 500;
font-size: 14px;
line-height: 100%;
letter-spacing: 0.02em;
text-transform: capitalize;
}
.blog-card3 h4 {
margin-bottom: 40px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.blog-card3 h4 {
margin-bottom: 35px;
}
}
@media (max-width: 991px) {
.blog-card3 h4 {
margin-bottom: 30px;
}
}
@media (max-width: 767px) {
.blog-card3 h4 {
margin-bottom: 25px;
}
}
@media (max-width: 576px) {
.blog-card3 h4 {
margin-bottom: 20px;
}
}
.blog-card3 h4 a {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 24px;
line-height: 1.3;
letter-spacing: 0.02em;
text-transform: capitalize;
transition: 0.5s;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.blog-card3 h4 a {
font-size: 20px;
}
}
@media (max-width: 991px) {
.blog-card3 h4 a {
font-size: 20px;
}
}
@media (max-width: 576px) {
.blog-card3 h4 a {
font-size: 19px;
}
}
.blog-card3 h4 a:hover {
color: var(--primary-color2);
}
.blog-card3 .blog-img {
position: relative;
overflow: hidden;
display: block;
transition: all 0.5s ease-out;
border-radius: 10px;
margin-bottom: 30px;
}
@media (max-width: 991px) {
.blog-card3 .blog-img {
margin-bottom: 25px;
}
}
@media (max-width: 576px) {
.blog-card3 .blog-img {
margin-bottom: 20px;
}
}
.blog-card3 .blog-img img {
width: 100%;
min-height: 265px;
border-radius: 10px;
-o-object-fit: cover;
object-fit: cover;
transition: all 0.5s ease-out;
}
.blog-card3 .blog-img::after {
position: absolute;
width: 200%;
height: 0%;
left: 50%;
top: 50%;
background-color: rgba(255, 255, 255, 0.3);
transform: translate(-50%, -50%) rotate(-45deg);
content: "";
z-index: 1;
}
.blog-card3 .read-btn {
color: var(--text-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
line-height: 1;
text-transform: uppercase;
display: inline-flex;
align-items: center;
gap: 6px;
transition: 0.5s;
}
.blog-card3 .read-btn span {
background-repeat: no-repeat;
background-size: 100% 1px;
background-position: left 100%;
transition: background-size 0.75s;
background: linear-gradient(to bottom, var(--text-color) 0%, var(--text-color) 98%);
}
.blog-card3 .read-btn svg {
fill: rgba(var(--title-color-opc), 0.3);
transition: 0.5s;
}
.blog-card3 .read-btn:hover {
color: var(--primary-color2);
}
.blog-card3 .read-btn:hover span {
background-size: 0 1px;
background-position: 0% 100%;
}
.blog-card3 .read-btn:hover svg {
fill: var(--primary-color2);
transform: translateX(3px);
}
.blog-card3:hover .blog-img::after {
height: 250%;
transition: all 600ms linear;
background-color: transparent;
}
.blog-card3:hover .blog-img img {
transform: scale(1.1);
} .home5-banner-section {
position: relative;
z-index: 1;
}
.home5-banner-section::before {
content: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home5/home5-banner-vector1.png);
position: absolute;
top: 5%;
left: 0;
z-index: -1;
}
@media (max-width: 767px) {
.home5-banner-section::before {
display: none;
}
}
.home5-banner-section::after {
content: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home5/home5-banner-vector2.png);
position: absolute;
top: 5%;
right: 0;
z-index: -1;
}
@media (max-width: 767px) {
.home5-banner-section::after {
display: none;
}
}
.home5-banner-section .banner-wrapper {
display: flex;
align-items: center;
justify-content: space-between;
gap: 50px;
padding: 165px 10% 50px 12%;
}
@media (max-width: 1799px) {
.home5-banner-section .banner-wrapper {
padding: 165px 7% 50px 9%;
}
}
@media (max-width: 1699px) {
.home5-banner-section .banner-wrapper {
padding: 165px 6% 50px 8%;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home5-banner-section .banner-wrapper {
padding: 165px 4% 50px 5%;
}
}
@media (max-width: 1399px) {
.home5-banner-section .banner-wrapper {
padding: 155px 2% 50px 3%;
gap: 40px;
}
}
@media (max-width: 1199px) {
.home5-banner-section .banner-wrapper {
padding: 145px 2% 40px 2%;
gap: 20px;
}
}
@media (max-width: 991px) {
.home5-banner-section .banner-wrapper {
padding: 135px 2% 40px;
flex-wrap: wrap;
gap: 20px;
}
}
@media (max-width: 767px) {
.home5-banner-section .banner-wrapper {
padding: 125px 10px 50px;
}
}
@media (max-width: 576px) {
.home5-banner-section .banner-wrapper {
padding: 115px 0px 40px;
}
}
.home5-banner-section .banner-wrapper .title-area {
max-width: 760px;
width: 100%;
}
.home5-banner-section .banner-wrapper .title-area h1 {
color: var(--title-color2);
font-family: var(--font-manrope);
font-weight: 800;
font-size: 80px;
line-height: 1.2;
margin-bottom: 0;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home5-banner-section .banner-wrapper .title-area h1 {
font-size: 72px;
}
}
@media (max-width: 1399px) {
.home5-banner-section .banner-wrapper .title-area h1 {
font-size: 68px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home5-banner-section .banner-wrapper .title-area h1 {
font-size: 60px;
}
}
@media (max-width: 991px) {
.home5-banner-section .banner-wrapper .title-area h1 {
font-size: 62px;
}
}
@media (max-width: 767px) {
.home5-banner-section .banner-wrapper .title-area h1 {
font-size: 55px;
}
}
@media (max-width: 576px) {
.home5-banner-section .banner-wrapper .title-area h1 {
font-size: 45px;
line-height: 1.3;
}
}
.home5-banner-section .banner-wrapper .title-area h1 span {
color: rgba(var(--title-color2-opc), 0.6);
font-weight: 500;
}
.home5-banner-section .banner-wrapper .banner-content {
max-width: 555px;
width: 100%;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home5-banner-section .banner-wrapper .banner-content {
max-width: 536px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home5-banner-section .banner-wrapper .banner-content {
max-width: 425px;
}
}
@media (max-width: 991px) {
.home5-banner-section .banner-wrapper .banner-content {
max-width: unset;
}
}
.home5-banner-section .banner-wrapper .banner-content p {
color: rgba(var(--title-color2-opc), 0.7);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 16px;
line-height: 32px;
padding-left: 15px;
position: relative;
margin-bottom: 45px;
}
@media (max-width: 1399px) {
.home5-banner-section .banner-wrapper .banner-content p {
margin-bottom: 35px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home5-banner-section .banner-wrapper .banner-content p {
font-size: 15px;
}
}
@media (max-width: 767px) {
.home5-banner-section .banner-wrapper .banner-content p {
font-size: 15px;
line-height: 28px;
}
}
@media (max-width: 576px) {
.home5-banner-section .banner-wrapper .banner-content p {
padding-left: 0;
margin-bottom: 25px;
}
}
.home5-banner-section .banner-wrapper .banner-content p::before {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 0;
width: 2px;
height: 77px;
background-color: rgba(var(--black-color-opc), 0.3);
}
@media (max-width: 576px) {
.home5-banner-section .banner-wrapper .banner-content p::before {
display: none;
}
}
.home5-banner-section .banner-wrapper .banner-content .btn-area {
display: flex;
align-items: center;
gap: 15px;
padding-left: 15px;
}
@media (max-width: 576px) {
.home5-banner-section .banner-wrapper .banner-content .btn-area {
padding-left: 0;
gap: 10px;
}
}
.home5-banner-section .banner-wrapper .banner-content .btn-area .img-grp {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
}
.home5-banner-section .banner-wrapper .banner-content .btn-area .img-grp li img {
min-width: 44px;
max-width: 44px;
height: 44px;
border-radius: 50%;
border: 1px solid #f0f2f4;
margin-left: -15px;
}
@media (max-width: 576px) {
.home5-banner-section .banner-wrapper .banner-content .btn-area .img-grp li img {
min-width: 37px;
max-width: 37px;
height: 37px;
}
}
.home5-banner-section .banner-wrapper .banner-content .btn-area .img-grp li:first-child img {
margin-left: 0;
}
.home5-banner-section .banner-wrapper .banner-content .btn-area a {
color: var(--title-color2);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 14px;
line-height: 1;
position: relative;
background: linear-gradient(to bottom, var(--primary-color4) 0%, var(--primary-color4) 98%);
background-repeat: no-repeat;
background-size: 100% 1px;
background-position: left 100%;
transition: background-size 0.75s;
}
.home5-banner-section .banner-wrapper .banner-content .btn-area a:hover {
background-size: 0 1px;
background-position: 0% 100%;
}
.home5-feature-section {
position: relative;
}
@media (max-width: 991px) {
.home5-feature-section {
padding: 0 30px;
}
}
@media (max-width: 767px) {
.home5-feature-section {
padding: 0 20px;
}
}
@media (max-width: 576px) {
.home5-feature-section {
padding: 0 10px;
}
}
.home5-feature-section .feature-wrapper {
transform-origin: center center;
}
.home5-feature-section .feature-wrapper .feature-img img {
min-height: 350px;
-o-object-fit: cover;
object-fit: cover;
}
.home5-feature-section .feature-wrapper .feature-content {
padding: 60px 0;
background-color: #eff9e2;
border-radius: 0 0 120px 120px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home5-feature-section .feature-wrapper .feature-content {
border-radius: 0 0 100px 100px;
}
}
@media (max-width: 1399px) {
.home5-feature-section .feature-wrapper .feature-content {
border-radius: 0 0 100px 100px;
}
}
@media (max-width: 1199px) {
.home5-feature-section .feature-wrapper .feature-content {
border-radius: 0 0 80px 80px;
padding: 50px 0;
}
}
@media (max-width: 991px) {
.home5-feature-section .feature-wrapper .feature-content {
border-radius: 0 0 30px 30px;
padding: 50px 0;
}
}
@media (max-width: 576px) {
.home5-feature-section .feature-wrapper .feature-content {
border-radius: 0;
padding: 40px 0;
}
}
.home5-feature-section .feature-wrapper .feature-content .single-feature {
display: flex;
gap: 18px;
max-width: 325px;
width: 100%;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home5-feature-section .feature-wrapper .feature-content .single-feature {
gap: 14px;
max-width: 275px;
}
}
.home5-feature-section .feature-wrapper .feature-content .single-feature .icon svg {
fill: var(--primary-color3);
width: 40px;
height: 56px;
}
@media (max-width: 576px) {
.home5-feature-section .feature-wrapper .feature-content .single-feature .icon svg {
width: 42px;
}
}
.home5-feature-section .feature-wrapper .feature-content .single-feature .content h5 {
color: var(--title-color2);
font-family: var(--font-manrope);
font-weight: 700;
font-size: 20px;
line-height: 1.2;
margin-bottom: 8px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home5-feature-section .feature-wrapper .feature-content .single-feature .content h5 {
font-size: 18px;
}
}
@media (max-width: 767px) {
.home5-feature-section .feature-wrapper .feature-content .single-feature .content h5 {
font-size: 18px;
}
}
.home5-feature-section .feature-wrapper .feature-content .single-feature .content p {
color: rgba(var(--title-color2-opc), 0.7);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 15px;
line-height: 21px;
margin-bottom: 0;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home5-feature-section .feature-wrapper .feature-content .single-feature .content p {
font-size: 14px;
}
}
@media (max-width: 576px) {
.home5-feature-section .feature-wrapper .feature-content .single-feature .content p {
font-size: 14px;
}
}
.home5-feature-section .feature-wrapper .feature-content .single-feature:hover .icon svg {
animation: bounceIn 1s linear;
}
.home5-feature-section .feature-wrapper .feature-content .divider {
position: relative;
}
.home5-feature-section .feature-wrapper .feature-content .divider::before {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 0px;
height: 65px;
width: 1px;
background: linear-gradient(180deg, rgba(35, 79, 64, 0) 0%, rgba(35, 79, 64, 0.3) 50%, rgba(35, 79, 64, 0) 100%);
}
@media (max-width: 991px) {
.home5-feature-section .feature-wrapper .feature-content .divider::before {
display: none;
}
}
.home5-feature-section .circular-text {
position: absolute;
top: -10px;
right: 14%;
min-width: 120px;
height: 120px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--white-color);
border: 1px solid rgba(var(--primary-color4-opc), 0.2);
}
@media (max-width: 1199px) {
.home5-feature-section .circular-text {
right: 12%;
}
}
@media (max-width: 991px) {
.home5-feature-section .circular-text {
top: -60px;
right: 8%;
}
}
@media (max-width: 767px) {
.home5-feature-section .circular-text {
display: none;
}
}
.home5-feature-section .circular-text .center-icon {
width: 65px;
height: 65px;
border-radius: 50%;
background-color: rgba(var(--primary-color3-opc), 0.2);
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 1;
}
.home5-feature-section .circular-text .center-icon svg {
fill: var(--primary-color3);
}
.home5-feature-section .circular-text .text {
position: absolute;
width: 100%;
height: 100%;
animation: textRotation 8s linear infinite;
}
.home5-feature-section .circular-text .text span {
position: absolute;
left: 50%;
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 13px;
font-weight: 700;
transform-origin: 0 60px;
} .home5-service-section {
scroll-margin-top: 150px;
}
.home5-service-section .service-list {
padding: 0;
margin: 0;
list-style: none;
}
.home5-service-section .service-list li {
color: var(--title-color2);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 26px;
line-height: 1;
padding: 32px 30px 32px 0;
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
border-bottom: 1px solid rgba(var(--primary-color4-opc), 0.1);
cursor: pointer;
transition: 0.5s;
}
.home5-service-section .service-list li:first-child {
border-top: 1px solid rgba(var(--primary-color4-opc), 0.1);
}
@media (max-width: 1399px) {
.home5-service-section .service-list li {
font-size: 22px;
padding: 28px 22px 28px 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home5-service-section .service-list li {
padding: 26px 18px 26px 0;
font-size: 20px;
}
}
@media (max-width: 576px) {
.home5-service-section .service-list li {
padding: 22px 18px 22px 0;
font-size: 20px;
}
}
.home5-service-section .service-list li svg {
fill: var(--primary-color3);
opacity: 0;
transition: 0.5s;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home5-service-section .service-list li svg {
width: 90px;
}
}
@media (max-width: 576px) {
.home5-service-section .service-list li svg {
display: none;
}
}
.home5-service-section .service-list li:hover {
background-color: rgba(var(--primary-color3-opc), 0.1);
color: var(--primary-color3);
padding-left: 30px;
border-color: transparent;
border-radius: 10px 2px 10px 10px;
}
@media (max-width: 1399px) {
.home5-service-section .service-list li:hover {
padding-left: 22px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home5-service-section .service-list li:hover {
padding-left: 18px;
}
}
@media (max-width: 576px) {
.home5-service-section .service-list li:hover {
padding-left: 18px;
}
}
.home5-service-section .service-list li:hover svg {
opacity: 1;
}
.home5-service-section .service-list li.active {
background-color: rgba(var(--primary-color3-opc), 0.1);
color: var(--primary-color3);
padding-left: 30px;
border-color: transparent;
border-radius: 10px 2px 10px 10px;
}
@media (max-width: 1399px) {
.home5-service-section .service-list li.active {
padding-left: 22px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home5-service-section .service-list li.active {
padding-left: 18px;
}
}
.home5-service-section .service-list li.active svg {
opacity: 1;
}
.home5-service-section .service-list li.prev {
border-color: transparent;
}
.home5-service-section .service-card-wrap {
padding: 0;
margin: 0;
list-style: none;
position: relative;
margin-left: 30px;
height: 100%;
}
@media (max-width: 1199px) {
.home5-service-section .service-card-wrap {
margin-left: 0;
}
}
.home5-service-section .service-card-wrap li {
position: absolute;
display: block;
width: 100%;
height: 100%;
top: 0;
left: 0;
opacity: 0;
transition: 0.5s;
}
@media (max-width: 991px) {
.home5-service-section .service-card-wrap li {
position: relative;
display: none;
}
}
.home5-service-section .service-card-wrap li .service-card2 {
position: relative;
}
@media (max-width: 1399px) {
.home5-service-section .service-card-wrap li .service-card2 {
height: 100%;
}
}
@media (max-width: 576px) {
.home5-service-section .service-card-wrap li .service-card2 {
height: unset;
}
}
.home5-service-section .service-card-wrap li .service-card2 img {
border-radius: 20px 2px 20px 20px;
}
@media (max-width: 1399px) {
.home5-service-section .service-card-wrap li .service-card2 img {
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
}
@media (max-width: 576px) {
.home5-service-section .service-card-wrap li .service-card2 img {
height: unset;
min-height: 400px;
border-radius: 10px 2px 10px 10px;
}
}
.home5-service-section .service-card-wrap li .service-card2 .service-content {
max-width: 392px;
width: 100%;
background-color: var(--white-color);
clip-path: polygon(8% 0, 100% 0, 100% 100%, 0 100%, 0 17%);
padding: 35px 30px;
position: absolute;
bottom: 0;
right: -1px;
border-radius: 0 0 20px 0;
z-index: 1;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home5-service-section .service-card-wrap li .service-card2 .service-content {
bottom: -1px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home5-service-section .service-card-wrap li .service-card2 .service-content {
bottom: -1px;
}
}
@media (max-width: 991px) {
.home5-service-section .service-card-wrap li .service-card2 .service-content {
bottom: -1px;
right: 0px;
}
}
@media (max-width: 576px) {
.home5-service-section .service-card-wrap li .service-card2 .service-content {
max-width: 300px;
padding: 25px 20px;
border-radius: 0 0 10px 0;
}
}
.home5-service-section .service-card-wrap li .service-card2 .service-content p {
color: rgba(var(--title-color2-opc), 0.7);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 16px;
line-height: 24px;
margin-bottom: 25px;
}
@media (max-width: 576px) {
.home5-service-section .service-card-wrap li .service-card2 .service-content p {
font-size: 14px;
margin-bottom: 20px;
}
}
.home5-service-section .service-card-wrap li .service-card2 .service-content .primary-btn5 {
text-transform: capitalize;
border-radius: 6px 0 6px 6px;
text-decoration: none;
padding: 12px 32px 12px 20px;
}
.home5-service-section .service-card-wrap li.active {
opacity: 1;
}
@media (max-width: 991px) {
.home5-service-section .service-card-wrap li.active {
display: block;
}
}
.home5-service-section .service-card-wrap li.show {
opacity: 1;
z-index: 9;
} .home5-about-section {
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home5/home5-about-bg.png), linear-gradient(180deg, #234f40 0%, #234f40 100%);
background-size: cover;
background-repeat: no-repeat;
padding: 110px 0 100px;
border-radius: 120px 120px 0 0;
}
@media (max-width: 1399px) {
.home5-about-section {
border-radius: 100px 100px 0 0;
}
}
@media (max-width: 1199px) {
.home5-about-section {
border-radius: 80px 80px 0 0;
padding: 100px 0 90px;
}
}
@media (max-width: 767px) {
.home5-about-section {
border-radius: 50px 50px 0 0;
padding: 70px 0;
}
}
@media (max-width: 576px) {
.home5-about-section {
border-radius: 20px 20px 0 0;
}
}
.home5-about-section .about-content-wrap {
margin-right: 30px;
}
@media (max-width: 1199px) {
.home5-about-section .about-content-wrap {
margin-right: 20px;
}
}
@media (max-width: 991px) {
.home5-about-section .about-content-wrap {
margin-right: 0;
}
}
.home5-about-section .about-content-wrap .section-title {
max-width: 648px;
width: 100%;
margin-bottom: 45px;
}
@media (max-width: 1399px) {
.home5-about-section .about-content-wrap .section-title {
margin-bottom: 40px;
}
}
@media (max-width: 1199px) {
.home5-about-section .about-content-wrap .section-title {
max-width: 540px;
margin-bottom: 35px;
}
}
@media (max-width: 991px) {
.home5-about-section .about-content-wrap .section-title {
margin-bottom: 30px;
}
}
@media (max-width: 767px) {
.home5-about-section .about-content-wrap .section-title {
margin-bottom: 25px;
}
}
@media (max-width: 576px) {
.home5-about-section .about-content-wrap .section-title {
margin-bottom: 20px;
}
}
.home5-about-section .about-content-wrap p {
color: rgba(255, 255, 255, 0.7);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 16px;
line-height: 32px;
margin-left: 70px;
margin-bottom: 60px;
padding-left: 15px;
position: relative;
max-width: 910px;
width: 100%;
}
@media (max-width: 1399px) {
.home5-about-section .about-content-wrap p {
margin-left: 50px;
margin-bottom: 55px;
}
}
@media (max-width: 1199px) {
.home5-about-section .about-content-wrap p {
margin-left: 25px;
margin-bottom: 45px;
}
}
@media (max-width: 991px) {
.home5-about-section .about-content-wrap p {
margin-bottom: 35px;
}
}
@media (max-width: 767px) {
.home5-about-section .about-content-wrap p {
margin-left: 0;
}
}
@media (max-width: 576px) {
.home5-about-section .about-content-wrap p {
padding-left: 0;
font-size: 15px;
margin-bottom: 25px;
}
}
.home5-about-section .about-content-wrap p::before {
content: "";
position: absolute;
top: 10px;
left: 0;
width: 2px;
height: 80px;
background-color: var(--primary-color3);
}
@media (max-width: 576px) {
.home5-about-section .about-content-wrap p::before {
display: none;
}
}
.home5-about-section .about-content-wrap img {
border-radius: 20px;
min-height: 380px;
-o-object-fit: cover;
object-fit: cover;
}
@media (max-width: 576px) {
.home5-about-section .about-content-wrap img {
border-radius: 10px;
min-height: 320px;
}
}
.home5-about-section .counter-list {
padding: 0;
margin: 0;
list-style: none;
padding-top: 80px;
}
@media (max-width: 991px) {
.home5-about-section .counter-list {
display: flex;
align-items: center;
justify-content: space-between;
gap: 25px;
flex-wrap: wrap;
padding-top: 0;
}
}
@media (max-width: 576px) {
.home5-about-section .counter-list {
gap: 40px;
}
}
.home5-about-section .counter-list .single-counter {
text-align: center;
padding-bottom: 45px;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
margin-bottom: 45px;
}
@media (max-width: 1199px) {
.home5-about-section .counter-list .single-counter {
padding-bottom: 40px;
margin-bottom: 40px;
}
}
@media (max-width: 991px) {
.home5-about-section .counter-list .single-counter {
padding-bottom: 0;
margin-bottom: 0;
border: unset;
}
}
.home5-about-section .counter-list .single-counter:last-child {
margin-bottom: 0;
padding-bottom: 0;
border-bottom: unset;
}
.home5-about-section .counter-list .single-counter .number {
line-height: 1;
display: flex;
align-items: center;
justify-content: center;
}
.home5-about-section .counter-list .single-counter .number h2,
.home5-about-section .counter-list .single-counter .number span {
color: rgba(255, 255, 255, 0.3);
font-family: var(--font-dmsans);
font-size: 100px;
font-weight: 900;
letter-spacing: 4.5px;
margin-bottom: 0;
line-height: 0.8;
}
@media (max-width: 1399px) {
.home5-about-section .counter-list .single-counter .number h2,
.home5-about-section .counter-list .single-counter .number span {
font-size: 90px;
}
}
@media (max-width: 991px) {
.home5-about-section .counter-list .single-counter .number h2,
.home5-about-section .counter-list .single-counter .number span {
font-size: 85px;
}
}
@media (max-width: 576px) {
.home5-about-section .counter-list .single-counter .number h2,
.home5-about-section .counter-list .single-counter .number span {
font-size: 80px;
}
}
.home5-about-section .counter-list .single-counter .content {
background-color: var(--primary-color4);
padding-top: 15px;
margin-top: -15px;
position: relative;
z-index: 1;
}
@media (max-width: 576px) {
.home5-about-section .counter-list .single-counter .content {
padding-top: 10px;
margin-top: -10px;
}
}
.home5-about-section .counter-list .single-counter .content p {
color: var(--white-color);
font-family: var(--font-manrope);
font-size: 13px;
font-weight: 500;
line-height: 1;
text-transform: uppercase;
margin-bottom: 0;
}
@media (max-width: 991px) {
.home5-about-section .counter-list .single-counter .content p {
font-size: 14px;
}
} .home5-project-section .section-title {
max-width: 465px;
width: 100%;
}
.home5-project-section .progress-pagination {
position: relative;
background: rgba(var(--primary-color4-opc), 0.15);
height: 2px;
}
.home5-project-section .progress-pagination .swiper-pagination-progressbar-fill {
background: rgba(var(--primary-color4-opc), 0.5);
}
.project-card3 .project-img {
clip-path: polygon(95% 0, 100% 5%, 100% 100%, 0 100%, 0 0);
position: relative;
display: block;
margin-bottom: 35px;
}
@media (max-width: 991px) {
.project-card3 .project-img {
margin-bottom: 30px;
}
}
.project-card3 .project-img img {
transition: all 0.5s ease-out;
}
.project-card3 .project-img::after {
position: absolute;
width: 200%;
height: 0%;
left: 50%;
top: 50%;
background-color: rgba(255, 255, 255, 0.3);
transform: translate(-50%, -50%) rotate(-45deg);
content: "";
z-index: 1;
}
.project-card3 .project-content span {
color: var(--primary-color3);
font-family: var(--font-dmsans);
font-weight: 500;
font-size: 14px;
line-height: 1;
text-transform: uppercase;
letter-spacing: 0.06em;
display: block;
margin-bottom: 8px;
}
.project-card3 .project-content h4 {
margin-bottom: 0;
}
.project-card3 .project-content h4 a {
color: var(--title-color2);
font-family: var(--font-manrope);
font-weight: 700;
font-size: 24px;
line-height: 1.2;
letter-spacing: 0.02em;
transition: 0.5s;
}
@media (max-width: 1399px) {
.project-card3 .project-content h4 a {
font-size: 23px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.project-card3 .project-content h4 a {
font-size: 21px;
}
}
@media (max-width: 767px) {
.project-card3 .project-content h4 a {
font-size: 22px;
}
}
@media (max-width: 576px) {
.project-card3 .project-content h4 a {
font-size: 21px;
}
}
.project-card3 .project-content h4 a:hover {
color: var(--primary-color3);
}
.project-card3:hover .project-img img {
transform: scale(1.1);
}
.project-card3:hover .project-img::after {
height: 250%;
transition: all 600ms linear;
background-color: transparent;
} .home5-video-section .video-wrapper {
position: relative;
}
.home5-video-section .video-wrapper .video-area {
min-height: 820px;
height: 85vh;
}
@media (max-width: 1399px) {
.home5-video-section .video-wrapper .video-area {
min-height: 720px;
}
}
@media (max-width: 991px) {
.home5-video-section .video-wrapper .video-area {
min-height: 650px;
}
}
@media (max-width: 576px) {
.home5-video-section .video-wrapper .video-area {
min-height: 450px;
}
}
.home5-video-section .video-wrapper video {
width: 100%;
min-height: 820px;
height: 85vh;
-o-object-fit: cover;
object-fit: cover;
border-radius: 120px 120px 0 0;
}
@media (max-width: 1399px) {
.home5-video-section .video-wrapper video {
border-radius: 100px 100px 0 0;
min-height: 720px;
}
}
@media (max-width: 1199px) {
.home5-video-section .video-wrapper video {
border-radius: 80px 80px 0 0;
}
}
@media (max-width: 991px) {
.home5-video-section .video-wrapper video {
min-height: 650px;
}
}
@media (max-width: 767px) {
.home5-video-section .video-wrapper video {
border-radius: 50px 50px 0 0;
}
}
@media (max-width: 576px) {
.home5-video-section .video-wrapper video {
min-height: 450px;
border-radius: 20px 20px 0 0;
}
}
.home5-video-section .video-wrapper .btn-area {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(var(--black-color-opc), 0.4);
border-radius: 120px 120px 0 0;
display: flex;
align-items: center;
justify-content: center;
}
@media (max-width: 1399px) {
.home5-video-section .video-wrapper .btn-area {
border-radius: 100px 100px 0 0;
}
}
@media (max-width: 1199px) {
.home5-video-section .video-wrapper .btn-area {
border-radius: 80px 80px 0 0;
}
}
@media (max-width: 767px) {
.home5-video-section .video-wrapper .btn-area {
border-radius: 50px 50px 0 0;
}
}
@media (max-width: 576px) {
.home5-video-section .video-wrapper .btn-area {
border-radius: 20px 20px 0 0;
}
}
.home5-video-section .video-wrapper .btn-area .circular-text2 {
position: relative;
min-width: 120px;
height: 120px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--white-color);
}
.home5-video-section .video-wrapper .btn-area .circular-text2 .play-btn {
width: 65px;
height: 65px;
border-radius: 50%;
background-color: #063617;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 1;
}
.home5-video-section .video-wrapper .btn-area .circular-text2 .play-btn svg {
fill: var(--primary-color3);
margin-left: 5px;
}
.home5-video-section .video-wrapper .btn-area .circular-text2 .play-btn .pause-icon {
display: none;
margin-left: 0;
}
.home5-video-section .video-wrapper .btn-area .circular-text2 .play-btn.active .play-icon {
display: none;
}
.home5-video-section .video-wrapper .btn-area .circular-text2 .play-btn.active .pause-icon {
display: block;
}
.home5-video-section .video-wrapper .btn-area .circular-text2 .text {
position: absolute;
width: 100%;
height: 100%;
animation: textRotation 8s linear infinite;
}
.home5-video-section .video-wrapper .btn-area .circular-text2 .text span {
position: absolute;
left: 50%;
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 13px;
font-weight: 700;
transform-origin: 0 60px;
}
.home5-video-section .video-content-wrap .video-content {
padding: 45px 65px;
background-color: var(--primary-color3);
clip-path: polygon(7% 0, 100% 0, 100% 100%, 0 100%, 0 13%);
border-radius: 15px;
position: relative;
z-index: 1;
margin-top: -225px;
}
@media (max-width: 1399px) {
.home5-video-section .video-content-wrap .video-content {
padding: 45px;
}
}
@media (max-width: 991px) {
.home5-video-section .video-content-wrap .video-content {
margin-top: -180px;
padding: 45px 30px;
}
}
@media (max-width: 576px) {
.home5-video-section .video-content-wrap .video-content {
margin-top: -100px;
clip-path: unset;
padding: 40px 20px;
}
}
.home5-video-section .video-content-wrap .video-content .icon {
margin-bottom: 35px;
}
@media (max-width: 576px) {
.home5-video-section .video-content-wrap .video-content .icon {
margin-bottom: 25px;
}
}
.home5-video-section .video-content-wrap .video-content .icon svg {
fill: var(--primary-color4);
height: 57px;
width: 88px;
}
.home5-video-section .video-content-wrap .video-content p {
color: var(--title-color2);
font-family: var(--font-manrope);
font-weight: 400;
font-size: 20px;
line-height: 45px;
margin-bottom: 0;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home5-video-section .video-content-wrap .video-content p {
font-size: 18px;
line-height: 40px;
}
}
@media (max-width: 576px) {
.home5-video-section .video-content-wrap .video-content p {
font-size: 18px;
line-height: 36px;
}
}
.home5-video-section .video-content-wrap .video-content .quote {
fill: rgba(255, 255, 255, 0.3);
position: absolute;
top: 26px;
right: 36px;
}
.home5-video-section .video-content-wrap .video-content .vector {
position: absolute;
top: 0;
right: 0;
z-index: -1;
} .product-card2 {
display: flex;
align-items: center;
gap: 35px;
padding: 25px 65px 25px 0;
border-top: 1px solid rgba(var(--primary-color4-opc), 0.2);
border-bottom: 1px solid rgba(var(--primary-color4-opc), 0.2);
position: relative;
}
@media (max-width: 1399px) {
.product-card2 {
padding: 25px 20px 25px 0;
gap: 25px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.product-card2 {
padding: 25px 15px 25px 0;
gap: 15px;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.product-card2 {
padding: 25px 85px 25px 0;
}
}
@media (max-width: 767px) {
.product-card2 {
gap: 15px;
}
}
@media (max-width: 576px) {
.product-card2 {
flex-direction: column;
align-items: start;
gap: 20px;
padding: 20px 20px 20px 0;
}
}
.product-card2 .arrow {
position: absolute;
top: 5px;
right: 0;
}
.product-card2 .arrow svg {
fill: rgba(var(--primary-color4-opc), 0.1);
transition: 0.5s;
}
.product-card2 .product-img {
min-width: 200px;
max-width: 200px;
}
.product-card2 .product-img img {
min-height: 155px;
width: 100%;
-o-object-fit: cover;
object-fit: cover;
border-radius: 10px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.product-card2 .product-img {
min-width: 170px;
max-width: 170px;
}
}
@media (max-width: 767px) {
.product-card2 .product-img {
min-width: 180px;
max-width: 180px;
}
}
.product-card2 .product-content h4 {
margin-bottom: 10px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.product-card2 .product-content h4 {
margin-bottom: 5px;
}
}
@media (max-width: 576px) {
.product-card2 .product-content h4 {
margin-bottom: 8px;
}
}
.product-card2 .product-content h4 a {
color: var(--title-color2);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 25px;
line-height: 1.2;
transition: 0.5s;
}
@media (min-width: 992px) and (max-width: 1199px) {
.product-card2 .product-content h4 a {
font-size: 22px;
}
}
@media (max-width: 767px) {
.product-card2 .product-content h4 a {
font-size: 23px;
}
}
.product-card2 .product-content h4 a:hover {
color: var(--primary-color3);
}
.product-card2 .product-content p {
color: rgba(var(--title-color2-opc), 0.7);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 16px;
line-height: 30px;
margin-bottom: 0;
}
@media (min-width: 992px) and (max-width: 1199px) {
.product-card2 .product-content p {
font-size: 15px;
line-height: 26px;
}
}
@media (max-width: 576px) {
.product-card2 .product-content p {
font-size: 15px;
line-height: 26px;
}
}
.product-card2:hover .arrow svg {
fill: var(--primary-color3);
}
.product-card2.two .product-content h4 a {
color: var(--title-color);
}
.product-card2.two .product-content h4 a:hover {
color: var(--primary-color1);
}
.product-card2.two .product-content p {
color: var(--text-color);
}
.product-card2.two:hover .arrow svg {
fill: var(--primary-color1);
} .home5-process-section {
padding: 110px 0 100px;
}
@media (max-width: 1399px) {
.home5-process-section {
border-radius: 100px 100px 0 0;
}
}
@media (max-width: 1199px) {
.home5-process-section {
border-radius: 80px 80px 0 0;
padding: 100px 0 90px;
}
}
@media (max-width: 767px) {
.home5-process-section {
border-radius: 50px 50px 0 0;
padding: 70px 0;
}
}
@media (max-width: 576px) {
.home5-process-section {
border-radius: 20px 20px 0 0;
}
}
.home5-process-section .primary-btn2.two:hover {
color: var(--primary-color3);
}
.home5-process-section .primary-btn2.two:hover svg {
fill: rgba(var(--primary-color3-opc), 0.3);
}
.home5-process-section .pt-40 {
padding-top: 40px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home5-process-section .pt-40 {
padding-top: 35px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home5-process-section .pt-40 {
padding-top: 28px;
}
}
@media (max-width: 991px) {
.home5-process-section .pt-40 {
padding-top: 0;
}
}
.home5-process-section .pt-80 {
padding-top: 80px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home5-process-section .pt-80 {
padding-top: 68px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home5-process-section .pt-80 {
padding-top: 56px;
}
}
@media (max-width: 991px) {
.home5-process-section .pt-80 {
padding-top: 0;
}
}
.home5-process-section .process-wrapper {
position: relative;
}
.home5-process-section .process-wrapper .vector {
fill: rgba(255, 255, 255, 0.2);
position: absolute;
top: 55px;
left: 0;
width: 100%;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home5-process-section .process-wrapper .vector {
top: 48px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home5-process-section .process-wrapper .vector {
top: 44px;
}
}
@media (max-width: 991px) {
.home5-process-section .process-wrapper .vector {
display: none;
}
} .home5-blog-section .magnetic-wrap {
height: 100%;
}
.home5-blog-section .blog-card2 {
height: 100%;
}
.home5-blog-section .blog-card2 .blog-img {
height: 100%;
}
.home5-blog-section .blog-card2 .blog-img img {
height: 100%;
} .home5-testimonial-section {
padding: 90px 0;
}
@media (max-width: 1399px) {
.home5-testimonial-section {
border-radius: 100px 100px 0 0;
}
}
@media (max-width: 1199px) {
.home5-testimonial-section {
border-radius: 80px 80px 0 0;
padding: 80px 0;
}
}
@media (max-width: 767px) {
.home5-testimonial-section {
border-radius: 50px 50px 0 0;
padding: 70px 0;
}
}
@media (max-width: 576px) {
.home5-testimonial-section {
border-radius: 20px 20px 0 0;
}
}
.home5-testimonial-section .testimonial-img {
-webkit-mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home5/home5-testiomial-img-bg.png);
mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home5/home5-testiomial-img-bg.png);
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-size: cover;
mask-size: cover;
margin-right: 15px;
}
@media (max-width: 1399px) {
.home5-testimonial-section .testimonial-img {
margin-right: 0;
}
}
.home5-testimonial-section .testimonial-card3 .author-img {
margin-bottom: 25px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home5-testimonial-section .testimonial-card3 .author-img {
margin-bottom: 20px;
}
}
.home5-testimonial-section .testimonial-card3 .author-img img {
min-width: 60px;
max-width: 60px;
height: 60px;
border-radius: 50%;
}
.home5-testimonial-section .testimonial-card3 span {
color: var(--primary-color3);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 16px;
line-height: 1.2;
letter-spacing: 0.06em;
display: block;
text-transform: uppercase;
margin-bottom: 18px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home5-testimonial-section .testimonial-card3 span {
margin-bottom: 15px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home5-testimonial-section .testimonial-card3 span {
margin-bottom: 12px;
}
}
@media (max-width: 767px) {
.home5-testimonial-section .testimonial-card3 span {
margin-bottom: 15px;
}
}
@media (max-width: 576px) {
.home5-testimonial-section .testimonial-card3 span {
font-size: 15px;
margin-bottom: 12px;
}
}
.home5-testimonial-section .testimonial-card3 p {
color: rgba(var(--title-color2-opc), 0.8);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 22px;
line-height: 48px;
text-transform: capitalize;
margin-bottom: 45px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home5-testimonial-section .testimonial-card3 p {
font-size: 20px;
line-height: 44px;
margin-bottom: 35px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home5-testimonial-section .testimonial-card3 p {
font-size: 17px;
line-height: 40px;
margin-bottom: 25px;
}
}
@media (max-width: 991px) {
.home5-testimonial-section .testimonial-card3 p {
margin-bottom: 35px;
}
}
@media (max-width: 767px) {
.home5-testimonial-section .testimonial-card3 p {
font-size: 20px;
line-height: 44px;
margin-bottom: 30px;
}
}
@media (max-width: 576px) {
.home5-testimonial-section .testimonial-card3 p {
font-size: 17px;
line-height: 36px;
margin-bottom: 20px;
}
}
.home5-testimonial-section .testimonial-card3 .author-area {
padding-top: 20px;
border-top: 1px solid rgba(var(--primary-color4-opc), 0.2);
}
.home5-testimonial-section .testimonial-card3 .author-area h5 {
color: var(--title-color2);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 21px;
line-height: 1.3;
letter-spacing: 0.03em;
margin-bottom: 10px;
}
.home5-testimonial-section .testimonial-card3 .author-area span {
color: rgba(var(--title-color2-opc), 0.7);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 15px;
line-height: 1;
letter-spacing: 0.03em;
}
.home5-testimonial-section .contact-btn-area {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 15px;
justify-content: end;
margin-top: -65px;
position: relative;
z-index: 1;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home5-testimonial-section .contact-btn-area {
margin-top: -60px;
}
}
@media (max-width: 576px) {
.home5-testimonial-section .contact-btn-area {
margin-top: 15px;
justify-content: start;
}
}
.home5-testimonial-section .contact-btn-area .img-grp {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
}
.home5-testimonial-section .contact-btn-area .img-grp li img {
min-width: 44px;
max-width: 44px;
height: 44px;
border-radius: 50%;
border: 1px solid #f0f2f4;
margin-left: -15px;
}
@media (max-width: 576px) {
.home5-testimonial-section .contact-btn-area .img-grp li img {
min-width: 37px;
max-width: 37px;
height: 37px;
}
}
.home5-testimonial-section .contact-btn-area .img-grp li:first-child img {
margin-left: 0;
}
.home5-testimonial-section .contact-btn-area .contact-btn {
position: relative;
display: inline-block;
vertical-align: top;
line-height: 1.4;
text-decoration: none;
outline: none;
padding: 0 1.375em 0.0625em 0;
cursor: pointer;
background-color: transparent;
background-position: 100% 100%;
background-repeat: no-repeat;
background-size: var(--background-size, 100%) 0.0625em;
transition: background-size 0.2s linear var(--background-delay, 0.15s);
transform: translateZ(0);
border: none;
background-image: linear-gradient(0deg, var(--title-color2) 0%, var(--title-color2) 100%);
color: var(--title-color2);
font-family: var(--font-manrope);
font-size: 14px;
font-weight: 500;
text-transform: uppercase;
white-space: nowrap;
}
.home5-testimonial-section .contact-btn-area .contact-btn::after {
content: "\f123";
font-family: "bootstrap-icons";
display: block;
position: absolute;
right: 0;
left: initial;
top: 0;
opacity: 1;
transition: opacity 0.3s 0.15s;
color: var(--title-color2);
}
.home5-testimonial-section .contact-btn-area .contact-btn svg {
position: absolute;
display: block;
line-height: 1.8125em;
width: 1.375em;
height: 1.8125em;
right: 0;
left: initial;
top: 50%;
margin: -0.92em 0 0;
fill: none;
stroke: var(--title-color2);
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 1px;
stroke-dasharray: 7.95 30;
stroke-dashoffset: var(--stroke-dashoffset, 46);
transition: stroke-dashoffset var(--stroke-duration, 0.15s) var(--stroke-easing, linear) var(--stroke-delay, 0s);
}
.home5-testimonial-section .contact-btn-area .contact-btn:hover {
--background-size: 0%;
--stroke-dashoffset: 26;
--stroke-duration: 0.3s;
--stroke-easing: cubic-bezier(0.3, 1.5, 0.5, 1);
--stroke-delay: 0.195s;
}
.home5-testimonial-section .contact-btn-area .contact-btn:hover::after {
opacity: 0;
transition-delay: 0s;
}
.home5-testimonial-section .home3-testimonial-slider .swiper-slide-active .author-img,
.home5-testimonial-section .home3-testimonial-slider .swiper-slide-active span,
.home5-testimonial-section .home3-testimonial-slider .swiper-slide-active p {
animation: fadeInDown 1.7s;
}
.home5-testimonial-section .home3-testimonial-slider .swiper-slide-active .author-area {
animation: fadeInUp 1.7s;
}
.home5-testimonial-section .rating-and-btn-area {
padding-top: 20px;
border-top: 1px solid rgba(var(--primary-color4-opc), 0.15);
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 20px;
}
.home5-testimonial-section .rating-and-btn-area .rating-list {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
gap: 16px;
flex-wrap: wrap;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home5-testimonial-section .rating-and-btn-area .rating-list {
gap: 8px;
}
}
.home5-testimonial-section .rating-and-btn-area .rating-list li .single-rating {
padding: 10px 24px;
background-color: #e3f4dd;
border: 1px solid rgba(var(--primary-color4-opc), 0.15);
border-radius: 100px;
display: flex;
gap: 8px;
}
.home5-testimonial-section .rating-and-btn-area .rating-list li .single-rating .review {
line-height: 1;
}
.home5-testimonial-section .rating-and-btn-area .rating-list li .single-rating .review span {
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 13px;
font-weight: 600;
line-height: 1;
margin-bottom: 8px;
display: block;
white-space: nowrap;
}
@media (max-width: 1699px) {
.home5-testimonial-section .rating-and-btn-area .rating-list li .single-rating .review span {
font-size: 13px;
}
}
.home5-testimonial-section .rating-and-btn-area .rating-list li .single-rating .review img {
width: 64px;
}
.home5-testimonial-section .rating-and-btn-area .rating-list li .single-rating .rating {
line-height: 1;
margin-top: -1px;
}
.home5-testimonial-section .rating-and-btn-area .rating-list li .single-rating .rating .star {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
gap: 4px;
margin-bottom: 9px;
line-height: 1;
}
.home5-testimonial-section .rating-and-btn-area .rating-list li .single-rating .rating .star li i {
color: #e62415;
font-size: 12px;
}
.home5-testimonial-section .rating-and-btn-area .rating-list li .single-rating .rating span {
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 13px;
font-weight: 400;
line-height: 1;
white-space: nowrap;
}
@media (max-width: 1699px) {
.home5-testimonial-section .rating-and-btn-area .rating-list li .single-rating .rating span {
font-size: 13px;
}
}
.home5-testimonial-section .rating-and-btn-area .rating-list li .single-rating.google .rating .star li i {
color: #ffc107;
} .home5-contact-section .section-title {
max-width: 465px;
width: 100%;
}
@media (max-width: 1399px) {
.home5-contact-section .section-title {
max-width: 360px;
}
}
@media (max-width: 991px) {
.home5-contact-section .section-title {
max-width: unset;
}
} .footer-section2 {
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home5/home5-footer-bg.png), linear-gradient(180deg, #234f40 0%, #234f40 100%);
background-size: cover;
background-repeat: no-repeat;
display: grid;
grid-template-columns: 77% 23%;
overflow: hidden;
}
@media (max-width: 1199px) {
.footer-section2 {
display: flex;
flex-direction: column-reverse;
}
}
.footer-section2 .subscribe-area {
padding: 60px 120px;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
}
@media (max-width: 1699px) {
.footer-section2 .subscribe-area {
padding: 60px 70px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.footer-section2 .subscribe-area {
padding: 60px 40px;
}
}
@media (max-width: 1399px) {
.footer-section2 .subscribe-area {
padding: 50px 30px;
}
}
@media (max-width: 991px) {
.footer-section2 .subscribe-area {
padding: 35px 20px;
}
}
@media (max-width: 767px) {
.footer-section2 .subscribe-area {
padding: 25px 15px;
flex-wrap: wrap;
gap: 20px;
}
}
.footer-section2 .subscribe-area h4 {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 400;
font-size: 25px;
line-height: 35px;
letter-spacing: 0.05em;
margin-bottom: 0;
max-width: 445px;
width: 100%;
}
@media (max-width: 991px) {
.footer-section2 .subscribe-area h4 {
font-size: 22px;
}
}
@media (max-width: 576px) {
.footer-section2 .subscribe-area h4 {
font-size: 20px;
line-height: 30px;
}
}
@media (max-width: 576px) {
.footer-section2 .subscribe-area form {
width: 100%;
}
}
.footer-section2 .subscribe-area .form-inner {
display: flex;
align-items: center;
justify-content: space-between;
padding: 4px 10px 4px 24px;
border: 1px solid rgba(255, 255, 255, 0.6);
border-radius: 5px;
min-width: 520px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.footer-section2 .subscribe-area .form-inner {
min-width: 460px;
}
}
@media (max-width: 1399px) {
.footer-section2 .subscribe-area .form-inner {
min-width: 410px;
}
}
@media (max-width: 991px) {
.footer-section2 .subscribe-area .form-inner {
min-width: 350px;
}
}
@media (max-width: 576px) {
.footer-section2 .subscribe-area .form-inner {
min-width: unset;
width: 100%;
}
}
.footer-section2 .subscribe-area .form-inner input {
background: transparent;
height: unset;
border: unset;
padding: 0;
color: var(--white-color);
padding-right: 10px;
}
.footer-section2 .subscribe-area .form-inner button {
min-width: 36px;
max-width: 36px;
height: 36px;
border-radius: 50%;
background-color: var(--primary-color3);
display: flex;
align-items: center;
justify-content: center;
transition: 0.5s;
}
.footer-section2 .subscribe-area .form-inner button svg {
fill: var(--white-color);
transition: 0.5s;
}
.footer-section2 .subscribe-area .form-inner button:hover {
background-color: var(--black-color);
}
.footer-section2 .footer-widget .widget-title {
margin-bottom: 25px;
}
.footer-section2 .footer-widget .widget-title h5 {
color: var(--white-color);
font-family: var(--font-manrope);
font-size: 20px;
font-weight: 600;
line-height: 1;
letter-spacing: 0.9px;
text-transform: uppercase;
margin-bottom: 0;
position: relative;
padding-bottom: 10px;
}
.footer-section2 .footer-widget .widget-title h5::after {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 107px;
height: 2px;
border-radius: 10px;
background: linear-gradient(90.01deg, rgba(255, 255, 255, 0.4) 0.01%, rgba(255, 255, 255, 0) 102.8%);
}
.footer-section2 .footer-widget .widget-list {
padding: 0;
margin: 0;
list-style: none;
}
.footer-section2 .footer-widget .widget-list li {
margin-bottom: 25px;
line-height: 1;
transition: 0.5s;
position: relative;
}
@media (max-width: 1199px) {
.footer-section2 .footer-widget .widget-list li {
margin-bottom: 15px;
}
}
.footer-section2 .footer-widget .widget-list li:last-child {
margin-bottom: 0;
}
.footer-section2 .footer-widget .widget-list li a {
color: rgba(255, 255, 255, 0.8);
font-family: var(--font-manrope);
font-size: 13px;
font-weight: 600;
line-height: 1.3;
letter-spacing: 0.34px;
text-transform: uppercase;
display: inline-flex;
align-items: center;
gap: 6px;
transition: 0.5s;
}
.footer-section2 .footer-widget .widget-list li a svg {
fill: var(--primary-color3);
opacity: 0;
transition: 0.5s;
}
.footer-section2 .footer-widget .widget-list li a:hover {
color: var(--primary-color3);
}
.footer-section2 .footer-widget .widget-list li a:hover svg {
opacity: 1;
}
.footer-section2 .contact-area {
padding: 0;
margin: 0;
list-style: none;
position: relative;
}
@media (max-width: 767px) {
.footer-section2 .contact-area {
display: flex;
align-items: center;
gap: 30px;
flex-wrap: wrap;
}
}
.footer-section2 .contact-area li {
margin-bottom: 20px;
}
@media (max-width: 767px) {
.footer-section2 .contact-area li {
margin-bottom: 0;
}
}
.footer-section2 .contact-area li:last-child {
margin-bottom: 0;
}
.footer-section2 .contact-area li .single-contact {
display: flex;
align-items: center;
gap: 12px;
}
.footer-section2 .contact-area li .single-contact .icon svg {
fill: var(--white-color);
}
.footer-section2 .contact-area li .single-contact .content {
position: relative;
line-height: 1;
text-align: start;
}
.footer-section2 .contact-area li .single-contact .content span {
color: var(--white-color);
font-family: var(--font-manrope);
font-size: 12px;
font-weight: 500;
line-height: 1;
margin-bottom: 6px;
display: inline-block;
}
.footer-section2 .contact-area li .single-contact .content h6 {
margin-bottom: 0;
line-height: 1;
}
.footer-section2 .contact-area li .single-contact .content h6 a {
color: rgba(255, 255, 255, 0.7);
font-family: var(--font-manrope);
font-size: 17px;
font-weight: 500;
line-height: 1.5;
transition: 0.5s;
}
@media (max-width: 576px) {
.footer-section2 .contact-area li .single-contact .content h6 a {
font-size: 16px;
}
}
.footer-section2 .contact-area li .single-contact .content h6 a:hover {
color: var(--primary-color3);
}
.footer-section2 .contact-area li .arrow {
margin-top: 20px;
fill: rgba(var(--primary-color3-opc), 0.5);
margin-left: 70px;
}
@media (max-width: 767px) {
.footer-section2 .contact-area li .arrow {
display: none;
}
}
@media (max-width: 991px) {
.footer-section2 .footer-menu-wrap {
padding: 60px 20px;
}
}
@media (max-width: 767px) {
.footer-section2 .footer-menu-wrap {
padding: 50px 15px;
}
}
.footer-section2 .footer-menu-wrap .footer-logo-area {
padding: 20px 30px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.footer-section2 .footer-menu-wrap .footer-logo-area {
padding: 20px;
}
}
@media (max-width: 1399px) {
.footer-section2 .footer-menu-wrap .footer-logo-area {
padding: 20px 15px;
}
}
@media (max-width: 991px) {
.footer-section2 .footer-menu-wrap .footer-logo-area {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 25px;
width: 100%;
padding: 0;
}
}
.footer-section2 .footer-menu-wrap .footer-logo-area .footer-logo {
display: block;
margin-bottom: 80px;
}
@media (max-width: 1399px) {
.footer-section2 .footer-menu-wrap .footer-logo-area .footer-logo {
margin-bottom: 70px;
}
}
@media (max-width: 991px) {
.footer-section2 .footer-menu-wrap .footer-logo-area .footer-logo {
margin-bottom: 0;
}
}
@media (max-width: 1199px) {
.footer-section2 .footer-menu-wrap .footer-logo-area .footer-logo img {
width: 145px;
}
}
@media (max-width: 576px) {
.footer-section2 .footer-menu-wrap .footer-logo-area .footer-logo img {
width: 130px;
}
}
.footer-section2 .footer-menu-wrap .footer-logo-area h2 {
color: rgba(var(--primary-color3-opc), 0.5);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 45px;
line-height: 1;
text-transform: uppercase;
text-decoration: underline;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.footer-section2 .footer-menu-wrap .footer-logo-area h2 {
font-size: 42px;
}
}
@media (max-width: 1399px) {
.footer-section2 .footer-menu-wrap .footer-logo-area h2 {
font-size: 36px;
}
}
.footer-section2 .footer-menu-wrap .footer-menu {
padding: 85px 100px;
border-left: 1px solid rgba(255, 255, 255, 0.1);
}
@media (max-width: 1699px) {
.footer-section2 .footer-menu-wrap .footer-menu {
padding: 85px 90px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.footer-section2 .footer-menu-wrap .footer-menu {
padding: 85px 50px;
}
}
@media (max-width: 1399px) {
.footer-section2 .footer-menu-wrap .footer-menu {
padding: 75px 30px;
}
}
@media (max-width: 991px) {
.footer-section2 .footer-menu-wrap .footer-menu {
padding: 0;
border-left: unset;
}
}
.footer-section2 .footer-bottom-area {
padding: 5px 5px 5px 50px;
border-top: 1px solid rgba(255, 255, 255, 0.1);
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
}
@media (max-width: 1799px) {
.footer-section2 .footer-bottom-area {
padding: 5px 5px 5px 30px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.footer-section2 .footer-bottom-area {
padding: 5px 5px 5px 20px;
}
}
@media (max-width: 1399px) {
.footer-section2 .footer-bottom-area {
padding: 5px 5px 5px 10px;
}
}
@media (max-width: 991px) {
.footer-section2 .footer-bottom-area {
padding: 25px 20px;
flex-wrap: wrap;
gap: 20px;
}
}
@media (max-width: 767px) {
.footer-section2 .footer-bottom-area {
padding: 25px 15px;
}
}
.footer-section2 .footer-bottom-area .policy-area {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
gap: 25px;
}
@media (max-width: 1799px) {
.footer-section2 .footer-bottom-area .policy-area {
gap: 20px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.footer-section2 .footer-bottom-area .policy-area {
gap: 10px;
}
}
@media (max-width: 1399px) {
.footer-section2 .footer-bottom-area .policy-area {
gap: 10px;
}
}
@media (max-width: 991px) {
.footer-section2 .footer-bottom-area .policy-area {
flex-wrap: wrap;
}
}
@media (max-width: 576px) {
.footer-section2 .footer-bottom-area .policy-area {
gap: 20px;
row-gap: 5px;
}
}
.footer-section2 .footer-bottom-area .policy-area li {
padding-left: 25px;
position: relative;
}
@media (max-width: 1799px) {
.footer-section2 .footer-bottom-area .policy-area li {
padding-left: 20px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.footer-section2 .footer-bottom-area .policy-area li {
padding-left: 10px;
}
}
@media (max-width: 1399px) {
.footer-section2 .footer-bottom-area .policy-area li {
padding-left: 10px;
}
}
@media (max-width: 576px) {
.footer-section2 .footer-bottom-area .policy-area li {
padding-left: 0;
}
}
.footer-section2 .footer-bottom-area .policy-area li::before {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 0;
width: 1px;
height: 10px;
background-color: var(--primary-color3);
border-radius: 10px;
}
@media (max-width: 576px) {
.footer-section2 .footer-bottom-area .policy-area li::before {
display: none;
}
}
.footer-section2 .footer-bottom-area .policy-area li:first-child {
padding-left: 0;
}
.footer-section2 .footer-bottom-area .policy-area li:first-child::before {
display: none;
}
.footer-section2 .footer-bottom-area .policy-area li a {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 500;
font-size: 14px;
line-height: 1;
letter-spacing: 0.06em;
transition: 0.5s;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.footer-section2 .footer-bottom-area .policy-area li a {
font-size: 13px;
}
}
@media (max-width: 1399px) {
.footer-section2 .footer-bottom-area .policy-area li a {
font-size: 13px;
}
}
.footer-section2 .footer-bottom-area .policy-area li a:hover {
color: var(--primary-color3);
}
.footer-section2 .footer-bottom-area .social-list {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
gap: 5px;
flex-wrap: wrap;
}
.footer-section2 .footer-bottom-area .social-list li {
padding: 20px 60px;
-webkit-backdrop-filter: blur(4px);
backdrop-filter: blur(4px);
background-color: rgba(255, 255, 255, 0.1);
}
@media (max-width: 1699px) {
.footer-section2 .footer-bottom-area .social-list li {
padding: 18px 45px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.footer-section2 .footer-bottom-area .social-list li {
padding: 18px 38px;
}
}
@media (max-width: 1399px) {
.footer-section2 .footer-bottom-area .social-list li {
padding: 16px 24px;
}
}
@media (max-width: 576px) {
.footer-section2 .footer-bottom-area .social-list li {
min-width: 140px;
max-width: 140px;
display: flex;
justify-content: center;
}
}
.footer-section2 .footer-bottom-area .social-list li a {
display: flex;
align-items: center;
gap: 8px;
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 400;
font-size: 14px;
line-height: 1;
transition: 0.5s;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.footer-section2 .footer-bottom-area .social-list li a {
font-size: 13px;
}
}
.footer-section2 .footer-bottom-area .social-list li a i {
font-size: 20px;
transition: 0.5s;
}
.footer-section2 .footer-bottom-area .social-list li a i.bi-twitter-x {
font-size: 18px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.footer-section2 .footer-bottom-area .social-list li a i.bi-twitter-x {
font-size: 14px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.footer-section2 .footer-bottom-area .social-list li a i {
font-size: 16px;
}
}
.footer-section2 .footer-bottom-area .social-list li a:hover {
color: var(--primary-color3);
}
.footer-section2 .copyright-area {
padding: 20px;
text-align: center;
}
.footer-section2 .copyright-area p {
color: rgba(255, 255, 255, 0.7);
font-family: var(--font-manrope);
font-size: 14px;
font-weight: 300;
line-height: normal;
letter-spacing: 0.02em;
margin-bottom: 0;
}
.footer-section2 .copyright-area p a {
color: var(--primary-color3);
font-weight: 500;
line-height: 1;
transition: 0.5s;
}
.footer-section2 .copyright-area p a:hover {
color: var(--white-color);
}
.footer-section2 .footer-address-wrapper {
padding: 60px 50px;
display: flex;
justify-content: center;
border-left: 1px solid rgba(255, 255, 255, 0.1);
}
@media (max-width: 1399px) {
.footer-section2 .footer-address-wrapper {
padding: 50px 40px;
}
}
@media (max-width: 1199px) {
.footer-section2 .footer-address-wrapper {
border-left: unset;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
justify-content: start;
padding: 50px 30px;
}
}
@media (max-width: 991px) {
.footer-section2 .footer-address-wrapper {
padding: 40px 20px;
}
}
@media (max-width: 767px) {
.footer-section2 .footer-address-wrapper {
padding: 40px 15px;
}
}
.footer-section2 .footer-address-wrapper .footer-widget .widget-title {
margin-bottom: 48px;
}
@media (max-width: 1199px) {
.footer-section2 .footer-address-wrapper .footer-widget .widget-title {
margin-bottom: 30px;
}
}
@media (max-width: 767px) {
.footer-section2 .footer-address-wrapper .footer-widget .widget-title {
margin-bottom: 25px;
}
}
.footer-section2 .footer-address-wrapper .address-area .address-list {
padding: 0;
margin: 0;
list-style: none;
margin-bottom: 20px;
}
@media (max-width: 1199px) {
.footer-section2 .footer-address-wrapper .address-area .address-list {
display: flex;
align-items: center;
gap: 50px;
}
}
@media (max-width: 767px) {
.footer-section2 .footer-address-wrapper .address-area .address-list {
margin-bottom: 15px;
gap: 25px;
}
}
@media (max-width: 576px) {
.footer-section2 .footer-address-wrapper .address-area .address-list {
gap: 30px;
flex-wrap: wrap;
}
}
@media (max-width: 576px) {
.footer-section2 .footer-address-wrapper .address-area .address-list {
gap: 20px;
}
}
.footer-section2 .footer-address-wrapper .address-area .address-list .single-address {
max-width: 230px;
width: 100%;
padding-bottom: 40px;
position: relative;
margin-bottom: 45px;
}
.footer-section2 .footer-address-wrapper .address-area .address-list .single-address:last-child {
margin-bottom: 0;
}
@media (max-width: 1199px) {
.footer-section2 .footer-address-wrapper .address-area .address-list .single-address:last-child::before {
display: none;
}
}
@media (max-width: 1199px) {
.footer-section2 .footer-address-wrapper .address-area .address-list .single-address {
margin-bottom: 0;
padding-bottom: 0;
}
}
@media (max-width: 767px) {
.footer-section2 .footer-address-wrapper .address-area .address-list .single-address {
padding-right: 10px;
}
.footer-section2 .footer-address-wrapper .address-area .address-list .single-address:last-child {
padding-right: 0;
}
}
.footer-section2 .footer-address-wrapper .address-area .address-list .single-address::before {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 53px;
height: 1px;
background-color: var(--primary-color3);
}
@media (max-width: 1199px) {
.footer-section2 .footer-address-wrapper .address-area .address-list .single-address::before {
bottom: unset;
top: 50%;
transform: translateY(-50%);
right: 0;
left: unset;
width: 1px;
height: 53px;
}
}
@media (max-width: 576px) {
.footer-section2 .footer-address-wrapper .address-area .address-list .single-address::before {
display: none;
}
}
.footer-section2 .footer-address-wrapper .address-area .address-list .single-address span {
color: var(--white-color);
font-family: var(--font-manrope);
font-size: 14px;
font-weight: 400;
line-height: 1;
letter-spacing: 0.06em;
text-decoration: underline;
display: block;
margin-bottom: 20px;
}
@media (max-width: 767px) {
.footer-section2 .footer-address-wrapper .address-area .address-list .single-address span {
margin-bottom: 15px;
}
}
@media (max-width: 576px) {
.footer-section2 .footer-address-wrapper .address-area .address-list .single-address span {
margin-bottom: 10px;
}
}
.footer-section2 .footer-address-wrapper .address-area .address-list .single-address a {
color: rgba(255, 255, 255, 0.6);
font-family: var(--font-dmsans);
font-size: 17px;
font-weight: 400;
line-height: 28px;
margin-bottom: 0;
transition: 0.5s;
}
@media (max-width: 767px) {
.footer-section2 .footer-address-wrapper .address-area .address-list .single-address a {
font-size: 15px;
}
}
.footer-section2 .footer-address-wrapper .address-area .address-list .single-address a:hover {
color: var(--primary-color3);
}
.footer-section2 .footer-address-wrapper .address-area .location-btn {
color: var(--primary-color3);
font-family: var(--font-manrope);
font-weight: 400;
font-size: 14px;
line-height: 1;
text-transform: uppercase;
position: relative;
background: linear-gradient(to bottom, var(--primary-color3) 0%, var(--primary-color3) 98%);
background-repeat: no-repeat;
background-size: 100% 1px;
background-position: left 100%;
transition: background-size 0.75s;
}
.footer-section2 .footer-address-wrapper .address-area .location-btn:hover {
background-size: 0 1px;
background-position: 0% 100%;
} .home6-banner-section {
position: relative;
padding: 12% 0 15%;
background-size: cover;
background-repeat: no-repeat;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home6-banner-section {
padding: 200px 0 17%;
}
}
@media (max-width: 1399px) {
.home6-banner-section {
padding: 180px 0 18%;
}
}
@media (max-width: 991px) {
.home6-banner-section {
padding: 160px 0 90px;
}
}
@media (max-width: 767px) {
.home6-banner-section {
padding: 150px 0 80px;
}
}
@media (max-width: 576px) {
.home6-banner-section {
padding: 130px 0 60px;
}
}
.home6-banner-section .banner-content h1 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 700;
font-size: 80px;
line-height: 1.2;
margin-bottom: 45px;
}
.home6-banner-section .banner-content h1 span {
-webkit-text-fill-color: transparent;
-webkit-text-stroke-width: 1px;
-webkit-text-stroke-color: var(--title-color);
font-family: var(--font-dmsans);
font-weight: 600;
}
@media (max-width: 1799px) {
.home6-banner-section .banner-content h1 {
font-size: 78px;
}
}
@media (max-width: 1699px) {
.home6-banner-section .banner-content h1 {
font-size: 70px;
}
}
@media (max-width: 1399px) {
.home6-banner-section .banner-content h1 {
font-size: 62px;
margin-bottom: 30px;
}
}
@media (max-width: 1199px) {
.home6-banner-section .banner-content h1 {
font-size: 55px;
margin-bottom: 25px;
}
}
@media (max-width: 767px) {
.home6-banner-section .banner-content h1 {
font-size: 48px;
margin-bottom: 20px;
}
}
@media (max-width: 576px) {
.home6-banner-section .banner-content h1 {
font-size: 40px;
margin-bottom: 25px;
}
}
.home6-banner-section .banner-content .video-and-content {
padding-left: 66px;
display: flex;
align-items: center;
gap: 50px;
margin-bottom: 60px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home6-banner-section .banner-content .video-and-content {
padding-left: 40px;
gap: 35px;
margin-bottom: 50px;
max-width: 800px;
width: 100%;
}
}
@media (max-width: 1399px) {
.home6-banner-section .banner-content .video-and-content {
padding-left: 30px;
margin-bottom: 40px;
gap: 25px;
max-width: 800px;
width: 100%;
}
}
@media (max-width: 1199px) {
.home6-banner-section .banner-content .video-and-content {
padding-left: 15px;
gap: 20px;
margin-bottom: 30px;
}
}
@media (max-width: 991px) {
.home6-banner-section .banner-content .video-and-content {
padding-left: 0;
}
}
@media (max-width: 767px) {
.home6-banner-section .banner-content .video-and-content {
gap: 20px;
}
}
@media (max-width: 576px) {
.home6-banner-section .banner-content .video-and-content {
flex-wrap: wrap;
gap: 15px;
margin-bottom: 20px;
}
}
.home6-banner-section .banner-content .video-and-content .video-area {
cursor: pointer;
display: inline-block;
}
.home6-banner-section .banner-content .video-and-content .video-area .icon {
position: relative;
}
.home6-banner-section .banner-content .video-and-content .video-area .icon .video-circle {
stroke: var(--primary-color5);
fill: none;
transition: 0.5s;
}
@media (max-width: 576px) {
.home6-banner-section .banner-content .video-and-content .video-area .icon .video-circle {
width: 68px;
}
}
.home6-banner-section .banner-content .video-and-content .video-area .icon .video-circle .top-half {
stroke-dasharray: 430;
stroke-dashoffset: 320;
transition: stroke-dashoffset 0.8s cubic-bezier(0.33, 1, 0.68, 1);
}
.home6-banner-section .banner-content .video-and-content .video-area .icon .play-icon {
fill: var(--primary-color5);
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
margin-left: 2px;
}
@media (max-width: 576px) {
.home6-banner-section .banner-content .video-and-content .video-area .icon .play-icon {
width: 20px;
}
}
.home6-banner-section .banner-content .video-and-content .video-area:hover .icon .video-circle .top-half {
stroke-dashoffset: 0;
}
.home6-banner-section .banner-content .video-and-content .content p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 16px;
font-weight: 400;
line-height: 32px;
margin-bottom: 0;
padding-left: 15px;
position: relative;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home6-banner-section .banner-content .video-and-content .content p {
font-size: 14px;
}
}
@media (max-width: 767px) {
.home6-banner-section .banner-content .video-and-content .content p {
font-size: 15px;
line-height: 28px;
}
}
@media (max-width: 576px) {
.home6-banner-section .banner-content .video-and-content .content p {
padding-left: 0;
}
}
.home6-banner-section .banner-content .video-and-content .content p::before {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 0;
width: 2px;
height: 77px;
background-color: rgba(var(--black-color-opc), 0.3);
}
@media (max-width: 576px) {
.home6-banner-section .banner-content .video-and-content .content p::before {
display: none;
}
}
.home6-banner-section .banner-content .btn-grp {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 35px;
}
@media (max-width: 576px) {
.home6-banner-section .banner-content .btn-grp {
gap: 20px;
}
}
.home6-banner-section .counter-list {
padding: 0;
margin: 0;
list-style: none;
}
@media (max-width: 991px) {
.home6-banner-section .counter-list {
display: flex;
align-items: center;
gap: 80px;
flex-wrap: wrap;
}
}
@media (max-width: 767px) {
.home6-banner-section .counter-list {
gap: 40px;
}
}
.home6-banner-section .counter-list .single-counter {
text-align: center;
padding-bottom: 45px;
border-bottom: 1px solid rgba(var(--black-color-opc), 0.1);
margin-bottom: 45px;
}
@media (max-width: 1199px) {
.home6-banner-section .counter-list .single-counter {
padding-bottom: 35px;
margin-bottom: 35px;
}
}
@media (max-width: 991px) {
.home6-banner-section .counter-list .single-counter {
padding-bottom: 0;
margin-bottom: 0;
border: unset;
}
}
.home6-banner-section .counter-list .single-counter:last-child {
margin-bottom: 0;
padding-bottom: 0;
border-bottom: unset;
}
.home6-banner-section .counter-list .single-counter .number {
line-height: 1;
display: flex;
align-items: center;
justify-content: center;
}
.home6-banner-section .counter-list .single-counter .number h2,
.home6-banner-section .counter-list .single-counter .number span {
color: rgba(var(--title-color-opc), 0.3);
font-family: var(--font-dmsans);
font-size: 100px;
font-weight: 900;
letter-spacing: 4.5px;
margin-bottom: 0;
line-height: 0.8;
}
@media (max-width: 1399px) {
.home6-banner-section .counter-list .single-counter .number h2,
.home6-banner-section .counter-list .single-counter .number span {
font-size: 90px;
}
}
@media (max-width: 1199px) {
.home6-banner-section .counter-list .single-counter .number h2,
.home6-banner-section .counter-list .single-counter .number span {
font-size: 85px;
}
}
@media (max-width: 576px) {
.home6-banner-section .counter-list .single-counter .number h2,
.home6-banner-section .counter-list .single-counter .number span {
font-size: 75px;
}
}
.home6-banner-section .counter-list .single-counter .content {
padding-top: 10px;
position: relative;
z-index: 1;
}
.home6-banner-section .counter-list .single-counter .content p {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 13px;
font-weight: 500;
line-height: 1;
text-transform: uppercase;
margin-bottom: 0;
}
@media (max-width: 991px) {
.home6-banner-section .counter-list .single-counter .content p {
font-size: 14px;
}
}
.home6-banner-section::before {
content: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home6/home6-banner-vector1.png);
position: absolute;
top: 30%;
left: 0;
}
@media (max-width: 576px) {
.home6-banner-section::before {
top: 15%;
}
}
.home6-banner-section::after {
content: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home6/home6-banner-vector2.png);
position: absolute;
bottom: 0;
right: 0;
}
.home6-banner-bottom-area {
padding: 0 150px;
margin-top: -210px;
position: relative;
overflow: hidden;
}
@media (max-width: 1699px) {
.home6-banner-bottom-area {
padding: 0px 80px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home6-banner-bottom-area {
margin-top: -245px;
}
}
@media (max-width: 1399px) {
.home6-banner-bottom-area {
padding: 0px 60px;
}
}
@media (max-width: 1199px) {
.home6-banner-bottom-area {
padding: 0px 40px;
margin-top: -170px;
}
}
@media (max-width: 991px) {
.home6-banner-bottom-area {
margin-top: 0;
}
}
@media (max-width: 576px) {
.home6-banner-bottom-area {
padding: 0 10px;
}
}
.home6-banner-bottom-area .banner-bottom-img-wrapper {
position: relative;
z-index: 1;
transform-origin: center center;
}
.home6-banner-bottom-area .banner-bottom-img-wrapper img {
border-radius: 30px;
}
@media (max-width: 991px) {
.home6-banner-bottom-area .banner-bottom-img-wrapper img {
min-height: 450px;
-o-object-fit: cover;
object-fit: cover;
}
}
@media (max-width: 576px) {
.home6-banner-bottom-area .banner-bottom-img-wrapper img {
min-height: 350px;
border-radius: 15px;
}
}
.home6-banner-bottom-area .banner-bottom-img-wrapper::before {
content: "";
position: absolute;
top: -30px;
left: 50%;
transform: translateX(-50%);
background-color: rgba(255, 255, 255, 0.3);
border-radius: 30px;
width: 100%;
height: 100%;
z-index: -1;
}
.home6-banner-bottom-area .social-list {
padding: 0;
margin: 0px;
list-style: none;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
gap: 60px;
position: absolute;
left: 40px;
top: 50%;
transform: translateY(-50%);
}
@media (max-width: 1399px) {
.home6-banner-bottom-area .social-list {
left: 20px;
}
}
@media (max-width: 1199px) {
.home6-banner-bottom-area .social-list {
left: 10px;
}
}
@media (max-width: 576px) {
.home6-banner-bottom-area .social-list {
display: none;
}
}
.home6-banner-bottom-area .social-list li {
position: relative;
}
.home6-banner-bottom-area .social-list li::before {
content: "";
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: -30px;
width: 3px;
height: 3px;
background-color: rgba(var(--black-color-opc), 0.2);
border-radius: 50%;
}
.home6-banner-bottom-area .social-list li:last-child::before {
display: none;
}
.home6-banner-bottom-area .social-list li a {
color: rgba(var(--black-color-opc), 0.5);
transition: 0.5s;
}
.home6-banner-bottom-area .social-list li a i {
font-size: 20px;
}
.home6-banner-bottom-area .social-list li a i.bi-twitter-x {
font-size: 16px;
}
.home6-banner-bottom-area .social-list li a svg {
width: 13px;
fill: rgba(var(--black-color-opc), 0.5);
}
.home6-banner-bottom-area .social-list li:hover a {
color: var(--primary-color5);
}
.home6-banner-bottom-area .circular-text {
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 80px;
min-width: 120px;
height: 120px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--white-color);
border: 1px solid rgba(var(--primary-color5-opc), 0.2);
z-index: 9;
}
@media (max-width: 1199px) {
.home6-banner-bottom-area .circular-text {
right: 20px;
}
}
@media (max-width: 576px) {
.home6-banner-bottom-area .circular-text {
display: none;
}
}
.home6-banner-bottom-area .circular-text .center-icon {
width: 65px;
height: 65px;
border-radius: 50%;
background-color: var(--white-color);
border: 1px solid rgba(var(--primary-color5-opc), 0.2);
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 1;
}
.home6-banner-bottom-area .circular-text .center-icon svg {
fill: var(--primary-color5);
}
.home6-banner-bottom-area .circular-text .text {
position: absolute;
width: 100%;
height: 100%;
animation: textRotation 8s linear infinite;
}
.home6-banner-bottom-area .circular-text .text span {
position: absolute;
left: 50%;
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 13px;
font-weight: 700;
transform-origin: 0 60px;
} .home6-about-section {
scroll-margin-top: 80px;
}
.home6-about-section .about-content .section-title {
margin-bottom: 45px;
}
@media (max-width: 1399px) {
.home6-about-section .about-content .section-title {
margin-bottom: 35px;
}
}
@media (max-width: 1199px) {
.home6-about-section .about-content .section-title {
margin-bottom: 25px;
}
}
@media (max-width: 991px) {
.home6-about-section .about-content .section-title {
margin-bottom: 20px;
}
}
@media (max-width: 767px) {
.home6-about-section .about-content .section-title {
margin-bottom: 15px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home6-about-section .about-content .section-title h2 {
font-size: 47px;
}
}
.home6-about-section .about-content .section-title p {
max-width: 680px;
width: 100%;
padding-top: 30px;
}
@media (max-width: 1199px) {
.home6-about-section .about-content .section-title p {
padding-top: 25px;
}
}
@media (max-width: 991px) {
.home6-about-section .about-content .section-title p {
padding-top: 20px;
}
}
@media (max-width: 767px) {
.home6-about-section .about-content .section-title p {
padding-top: 15px;
}
}
.home6-about-section .about-content .experience-area {
display: flex;
gap: 25px;
}
@media (max-width: 576px) {
.home6-about-section .about-content .experience-area {
gap: 20px;
}
}
.home6-about-section .about-content .experience-area h2 {
background: linear-gradient(180deg, #000000 0%, #233aff 50%, #000000 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
color: transparent;
font-family: var(--font-dmsans);
font-weight: 300;
font-style: italic;
font-size: 200px;
line-height: 1;
margin-bottom: 0;
background-size: auto 400%;
background-repeat: repeat;
background-position: center 0%;
animation: gradientMove 2.5s linear infinite;
}
@media (max-width: 1199px) {
.home6-about-section .about-content .experience-area h2 {
font-size: 170px;
}
}
@media (max-width: 767px) {
.home6-about-section .about-content .experience-area h2 {
font-size: 150px;
}
}
@media (max-width: 576px) {
.home6-about-section .about-content .experience-area h2 {
font-size: 130px;
}
}
.home6-about-section .about-content .experience-area span {
color: rgba(var(--title-color-opc), 0.5);
font-family: var(--font-dmsans);
font-weight: 300;
font-style: italic;
font-size: 25px;
line-height: 30px;
max-width: 152px;
width: 100%;
margin-top: 20px;
}
@media (max-width: 767px) {
.home6-about-section .about-content .experience-area span {
font-size: 22px;
margin-top: 15px;
}
}
@media (max-width: 576px) {
.home6-about-section .about-content .experience-area span {
font-size: 20px;
margin-top: 10px;
}
}
@keyframes gradientMove {
0% {
background-position: center 0%;
}
100% {
background-position: center 100%;
}
}
.home6-about-section .about-img-wrap .about-img {
position: relative;
margin-bottom: 30px;
}
@media (max-width: 1199px) {
.home6-about-section .about-img-wrap .about-img {
margin-bottom: 25px;
}
}
@media (max-width: 991px) {
.home6-about-section .about-img-wrap .about-img {
margin-bottom: 20px;
}
}
.home6-about-section .about-img-wrap .about-img img {
clip-path: polygon(0 0, 100% 0, 100% 100%, 18% 100%, 0 83%);
border-radius: 10px;
}
.home6-about-section .about-img-wrap .about-img .about-btn {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
line-height: 1;
letter-spacing: 0.05em;
text-transform: uppercase;
text-decoration: underline;
padding: 13px 15px;
background-color: var(--white-color);
border-bottom-right-radius: 10px;
position: absolute;
top: 0;
left: 0;
transition: 0.5s;
}
.home6-about-section .about-img-wrap .about-img .about-btn:hover {
background-color: var(--primary-color5);
color: var(--white-color);
}
.home6-about-section .about-img-wrap p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 16px;
line-height: 32px;
margin-bottom: 0;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home6-about-section .about-img-wrap p {
font-size: 15px;
}
}
@media (max-width: 576px) {
.home6-about-section .about-img-wrap p {
font-size: 14px;
line-height: 28px;
}
}
.home6-about-section .counter-wrap {
position: relative;
}
.home6-about-section .counter-wrap .divider {
position: relative;
}
.home6-about-section .counter-wrap .divider::before {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 0px;
height: 132px;
width: 1px;
background: linear-gradient(1800deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 51%, rgba(0, 0, 0, 0) 100%);
}
@media (max-width: 991px) {
.home6-about-section .counter-wrap .divider::before {
display: none;
}
}
.home6-about-section .counter-wrap .single-countdown {
text-align: center;
}
.home6-about-section .counter-wrap .single-countdown .number {
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 5px;
}
.home6-about-section .counter-wrap .single-countdown .number h2,
.home6-about-section .counter-wrap .single-countdown .number span {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 55px;
font-weight: 600;
line-height: 1;
margin-bottom: 0;
}
@media (max-width: 1199px) {
.home6-about-section .counter-wrap .single-countdown .number h2,
.home6-about-section .counter-wrap .single-countdown .number span {
font-size: 50px;
}
}
.home6-about-section .counter-wrap .single-countdown span {
color: rgba(var(--title-color-opc), 0.6);
font-family: var(--font-manrope);
font-size: 14px;
font-weight: 500;
line-height: 1.5;
letter-spacing: 0.06em;
text-transform: uppercase;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home6-about-section .counter-wrap .single-countdown span {
font-size: 13px;
}
}
@media (max-width: 991px) {
.home6-about-section .counter-wrap .single-countdown span {
font-size: 14px;
}
} .home6-service-section {
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home6/home6-service-bg.png), linear-gradient(180deg, #0b0b1d 0%, #0b0b1d 100%);
background-size: cover;
background-repeat: no-repeat;
padding: 100px 0;
}
@media (max-width: 1199px) {
.home6-service-section {
padding: 90px 0;
}
}
@media (max-width: 767px) {
.home6-service-section {
padding: 70px 0;
}
}
.home6-service-section .slider-btn-grp {
margin-bottom: 20px;
}
@media (max-width: 991px) {
.home6-service-section .slider-btn-grp {
margin-bottom: 0;
}
}
.home6-service-section .home6-service-slider {
padding: 1px;
margin: -1px;
}
.home6-service-section .home6-service-slider .swiper-slide:first-child .service-card3 {
border-left: 1px solid rgba(255, 255, 255, 0.08);
}
.service-card3 {
padding: 30px;
border: 1px solid rgba(255, 255, 255, 0.08);
border-left: unset;
transition: 0.5s;
}
@media (max-width: 1399px) {
.service-card3 {
padding: 25px 20px;
}
}
.service-card3 .service-img {
margin-bottom: 25px;
}
@media (max-width: 576px) {
.service-card3 .service-img {
margin-bottom: 20px;
}
}
.service-card3 .service-img img {
border-radius: 2px;
}
.service-card3 .service-content h4 {
margin-bottom: 35px;
}
@media (max-width: 576px) {
.service-card3 .service-content h4 {
margin-bottom: 30px;
}
}
.service-card3 .service-content h4 a {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 25px;
line-height: 1.3;
transition: 0.5s;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.service-card3 .service-content h4 a {
font-size: 22px;
}
}
@media (max-width: 576px) {
.service-card3 .service-content h4 a {
font-size: 23px;
}
}
.service-card3 .service-content h4 a:hover {
color: var(--primary-color5);
}
.service-card3 .service-content .details-btn {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
line-height: 1;
padding: 8px 35px 8px 20px;
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 30px 0 5px 30px;
position: relative;
overflow: hidden;
}
.service-card3 .service-content .details-btn .arrow {
fill: rgba(255, 255, 255, 0.15);
position: absolute;
top: 3px;
right: 3px;
}
.service-card3 .service-content .details-btn::after {
position: absolute;
content: "";
width: 100%;
height: 100%;
top: 0px;
right: 0px;
background-color: var(--primary-color5);
transform-origin: right center;
transform: scaleX(0);
z-index: -1;
border-radius: 30px 0 5px 30px;
transition: transform 0.7s;
}
.service-card3 .service-content .details-btn:hover::after {
transform: scaleX(1);
transform-origin: right center;
}
.service-card3:hover {
background-color: rgba(var(--primary-color5-opc), 0.2);
border-color: rgba(var(--black-color-opc), 0.03);
}
.service-card3.two {
border: 1px solid rgba(var(--black-color-opc), 0.08);
padding: 30px 22px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.service-card3.two {
padding: 25px 16px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.service-card3.two {
padding: 25px 16px;
}
}
@media (max-width: 767px) {
.service-card3.two {
padding: 20px 15px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.service-card3.two .service-img {
margin-bottom: 20px;
}
}
@media (max-width: 767px) {
.service-card3.two .service-img {
margin-bottom: 15px;
}
}
.service-card3.two .service-content h4 a {
color: var(--title-color);
}
@media (min-width: 1200px) and (max-width: 1399px) {
.service-card3.two .service-content h4 a {
font-size: 21px;
}
}
@media (max-width: 767px) {
.service-card3.two .service-content h4 a {
font-size: 20px;
margin-bottom: 25px;
}
}
@media (max-width: 576px) {
.service-card3.two .service-content h4 a {
margin-bottom: 30px;
}
}
.service-card3.two .service-content h4 a:hover {
color: var(--primary-color5);
}
.service-card3.two .service-content .details-btn {
color: var(--title-color);
border: 1px solid rgba(var(--black-color-opc), 0.2);
}
.service-card3.two .service-content .details-btn .arrow {
fill: rgba(var(--black-color-opc), 0.15);
}
.service-card3.two .service-content .details-btn:hover {
color: var(--white-color);
}
.service-card3.two .service-content .details-btn:hover::after {
transform: scaleX(1);
transform-origin: right center;
}
.service-card3.two:hover {
background-color: rgba(var(--primary-color5-opc), 0.2);
border-color: rgba(var(--black-color-opc), 0.03);
} .home6-project-section .project-slider-area {
padding: 0 11%;
}
@media (max-width: 1899px) {
.home6-project-section .project-slider-area {
padding: 0 9%;
}
}
@media (max-width: 1799px) {
.home6-project-section .project-slider-area {
padding: 0 7%;
}
}
@media (max-width: 1699px) {
.home6-project-section .project-slider-area {
padding: 0 5%;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home6-project-section .project-slider-area {
padding: 0 2%;
}
}
@media (max-width: 1399px) {
.home6-project-section .project-slider-area {
padding: 0 1%;
}
}
@media (max-width: 576px) {
.home6-project-section .project-slider-area {
padding: 0;
}
}
.home6-project-section .project-slider-area .project-card4 {
display: grid;
grid-template-columns: 56% 44%;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home6-project-section .project-slider-area .project-card4 {
grid-template-columns: 50% 50%;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home6-project-section .project-slider-area .project-card4 {
grid-template-columns: 49% 51%;
}
}
@media (max-width: 767px) {
.home6-project-section .project-slider-area .project-card4 {
grid-template-columns: 48% 52%;
}
}
@media (max-width: 576px) {
.home6-project-section .project-slider-area .project-card4 {
display: block;
}
}
.home6-project-section .project-slider-area .project-card4 .project-img {
position: relative;
overflow: hidden;
clip-path: polygon(94% 0, 100% 6%, 100% 100%, 0 100%, 0 0);
border-radius: 5px;
}
.home6-project-section .project-slider-area .project-card4 .project-img img {
transition: all 0.5s ease-out;
border-radius: 5px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home6-project-section .project-slider-area .project-card4 .project-img img {
min-height: 250px;
-o-object-fit: cover;
object-fit: cover;
}
}
.home6-project-section .project-slider-area .project-card4 .project-img::after {
position: absolute;
width: 200%;
height: 0%;
left: 50%;
top: 50%;
background-color: rgba(255, 255, 255, 0.3);
transform: translate(-50%, -50%) rotate(-45deg);
content: "";
z-index: 1;
}
.home6-project-section .project-slider-area .project-card4 .project-content-wrap {
position: relative;
display: flex;
justify-content: end;
align-items: end;
padding-left: 20px;
}
@media (max-width: 1699px) {
.home6-project-section .project-slider-area .project-card4 .project-content-wrap {
padding-left: 18px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home6-project-section .project-slider-area .project-card4 .project-content-wrap {
padding-left: 14px;
}
}
@media (max-width: 1399px) {
.home6-project-section .project-slider-area .project-card4 .project-content-wrap {
padding-left: 14px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home6-project-section .project-slider-area .project-card4 .project-content-wrap {
padding-left: 10px;
}
}
@media (max-width: 576px) {
.home6-project-section .project-slider-area .project-card4 .project-content-wrap {
padding-left: 0;
padding-top: 15px;
}
}
.home6-project-section .project-slider-area .project-card4 .project-content-wrap .arrow-vector {
position: absolute;
top: 0;
right: 0;
}
@media (max-width: 576px) {
.home6-project-section .project-slider-area .project-card4 .project-content-wrap .arrow-vector {
display: none;
}
}
.home6-project-section .project-slider-area .project-card4 .project-content-wrap .arrow-vector svg {
fill: rgba(var(--black-color-opc), 0.1);
transition: 0.5s;
}
.home6-project-section .project-slider-area .project-card4 .project-content-wrap .arrow-vector:hover svg {
fill: var(--primary-color5);
}
.home6-project-section .project-slider-area .project-card4 .project-content-wrap .project-content h4 {
margin-bottom: 25px;
}
@media (max-width: 576px) {
.home6-project-section .project-slider-area .project-card4 .project-content-wrap .project-content h4 {
margin-bottom: 20px;
}
}
.home6-project-section .project-slider-area .project-card4 .project-content-wrap .project-content h4 a {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 28px;
line-height: 1.3;
transition: 0.5s;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home6-project-section .project-slider-area .project-card4 .project-content-wrap .project-content h4 a {
font-size: 25px;
}
}
@media (max-width: 1399px) {
.home6-project-section .project-slider-area .project-card4 .project-content-wrap .project-content h4 a {
font-size: 25px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home6-project-section .project-slider-area .project-card4 .project-content-wrap .project-content h4 a {
font-size: 22px;
}
}
.home6-project-section .project-slider-area .project-card4 .project-content-wrap .project-content h4 a:hover {
color: var(--primary-color5);
}
.home6-project-section .project-slider-area .project-card4 .project-content-wrap .project-content .tag-list {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 15px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home6-project-section .project-slider-area .project-card4 .project-content-wrap .project-content .tag-list {
gap: 10px;
}
}
@media (max-width: 1399px) {
.home6-project-section .project-slider-area .project-card4 .project-content-wrap .project-content .tag-list {
gap: 10px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home6-project-section .project-slider-area .project-card4 .project-content-wrap .project-content .tag-list {
gap: 8px;
}
}
.home6-project-section .project-slider-area .project-card4 .project-content-wrap .project-content .tag-list li a {
color: rgba(var(--title-color-opc), 0.5);
font-family: var(--font-dmsans);
font-weight: 500;
font-size: 12px;
line-height: 1;
display: inline-block;
padding: 10px 19px;
border: 1px solid rgba(var(--black-color-opc), 0.2);
border-radius: 100px;
transition: 0.5s;
}
@media (max-width: 1799px) {
.home6-project-section .project-slider-area .project-card4 .project-content-wrap .project-content .tag-list li a {
padding: 10px 18px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home6-project-section .project-slider-area .project-card4 .project-content-wrap .project-content .tag-list li a {
padding: 8px 15px;
}
}
@media (max-width: 1399px) {
.home6-project-section .project-slider-area .project-card4 .project-content-wrap .project-content .tag-list li a {
padding: 8px 13px;
}
}
.home6-project-section .project-slider-area .project-card4 .project-content-wrap .project-content .tag-list li a:hover {
color: var(--primary-color5);
border-color: var(--primary-color5);
}
.home6-project-section .project-slider-area .project-card4:hover .project-img img {
transform: scale(1.1);
}
.home6-project-section .project-slider-area .project-card4:hover .project-img::after {
height: 250%;
transition: all 600ms linear;
background-color: transparent;
}
.home6-project-section .btn-area {
padding-top: 40px;
border-top: 1px solid rgba(var(--black-color-opc), 0.1);
display: flex;
align-items: center;
justify-content: space-between;
gap: 20px;
flex-wrap: wrap;
}
@media (max-width: 1399px) {
.home6-project-section .btn-area {
padding-top: 35px;
}
}
@media (max-width: 991px) {
.home6-project-section .btn-area {
padding-top: 30px;
}
}
@media (max-width: 576px) {
.home6-project-section .btn-area {
padding-top: 25px;
}
} .home6-feature-section {
position: relative;
padding: 100px 0;
background-size: cover;
background-repeat: no-repeat;
z-index: 1;
}
@media (max-width: 1199px) {
.home6-feature-section {
padding: 90px 0;
}
}
@media (max-width: 767px) {
.home6-feature-section {
padding: 70px 0;
}
}
.home6-feature-section .arrow-vector {
fill: rgba(var(--black-color-opc), 0.05);
position: absolute;
bottom: 0;
left: 0;
z-index: -1;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.home6-feature-section .arrow-vector {
width: 350px;
}
}
@media (max-width: 1399px) {
.home6-feature-section .arrow-vector {
width: 220px;
}
}
@media (max-width: 1199px) {
.home6-feature-section .arrow-vector {
display: none;
}
}
.home6-feature-section .about-btn-area {
position: relative;
display: inline-block;
}
.home6-feature-section .about-btn-area .bg svg {
fill: transparent;
stroke: rgba(var(--title-color-opc), 0.1);
transition: 0.5s;
}
@media (max-width: 767px) {
.home6-feature-section .about-btn-area .bg svg {
width: 190px;
}
}
.home6-feature-section .about-btn-area .primary-btn2 {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
gap: 25px;
}
@media (max-width: 767px) {
.home6-feature-section .about-btn-area .primary-btn2 {
gap: 15px;
}
}
.home6-feature-section .about-btn-area:hover .bg svg {
fill: var(--primary-color5);
stroke: var(--primary-color5);
transition: 0.5s;
}
.home6-feature-section .about-btn-area:hover .primary-btn2 {
color: var(--white-color);
}
.home6-feature-section .about-btn-area:hover .primary-btn2 svg {
fill: rgba(var(--black-color-opc), 0.15);
}
.home6-feature-section .about-btn-area:hover .primary-btn2 span {
background-size: 0 1px;
background-position: 0% 100%;
}
.home6-feature-section .feature-list {
padding: 0;
margin: 0;
list-style: none;
display: grid;
grid-template-columns: repeat(2, 1fr); gap: 60px 30px; }
@media (max-width: 1199px) {
.home6-feature-section .feature-list {
gap: 50px 30px;
}
}
@media (max-width: 991px) {
.home6-feature-section .feature-list {
gap: 40px 20px;
}
}
@media (max-width: 767px) {
.home6-feature-section .feature-list {
grid-template-columns: repeat(1, 1fr);
gap: 30px;
}
}
@media (max-width: 576px) {
.home6-feature-section .feature-list {
gap: 25px;
}
}
.home6-feature-section .feature-list .single-feature {
max-width: 470px;
width: 100%;
}
.home6-feature-section .feature-list .single-feature h3 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 30px;
line-height: 1.2;
margin-bottom: 15px;
}
@media (max-width: 991px) {
.home6-feature-section .feature-list .single-feature h3 {
font-size: 27px;
}
}
@media (max-width: 767px) {
.home6-feature-section .feature-list .single-feature h3 {
font-size: 25px;
margin-bottom: 10px;
}
}
@media (max-width: 576px) {
.home6-feature-section .feature-list .single-feature h3 {
font-size: 22px;
}
}
.home6-feature-section .feature-list .single-feature p {
color: rgba(var(--title-color-opc), 0.6);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 16px;
line-height: 25px;
margin-bottom: 0;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home6-feature-section .feature-list .single-feature p {
font-size: 15px;
}
}
@media (max-width: 576px) {
.home6-feature-section .feature-list .single-feature p {
font-size: 15px;
}
} .home6-team-section .team-slider-area {
padding: 40px 0;
border-top: 1px solid rgba(var(--black-color-opc), 0.1);
border-bottom: 1px solid rgba(var(--black-color-opc), 0.1);
}
.home6-team-section .slider-btn-grp {
padding-top: 20px;
justify-content: space-between;
}
.home6-team-section .slider-btn-grp h6 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 400;
font-size: 16px;
line-height: 30px;
letter-spacing: 0.03em;
text-align: center;
margin-bottom: 0;
}
@media (max-width: 576px) {
.home6-team-section .slider-btn-grp h6 {
font-size: 15px;
line-height: 26px;
}
}
.home6-team-section .slider-btn-grp h6 a {
color: var(--primary-color5);
font-weight: 600;
text-decoration: underline;
white-space: nowrap;
transition: 0.5s;
}
.home6-team-section .slider-btn-grp h6 a:hover {
color: var(--title-color);
} .home6-faq-section .nav-pills {
justify-content: center;
gap: 30px;
margin-bottom: 60px;
}
@media (max-width: 767px) {
.home6-faq-section .nav-pills {
margin-bottom: 55px;
}
}
@media (max-width: 576px) {
.home6-faq-section .nav-pills {
gap: 15px;
margin-bottom: 45px;
}
}
.home6-faq-section .nav-pills .nav-item .nav-link {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 16px;
line-height: 1;
padding: 10px 40px;
background-color: transparent;
border: 1px solid rgba(var(--black-color-opc), 0.15);
border-radius: 100px;
}
.home6-faq-section .nav-pills .nav-item .nav-link.active {
background-color: rgba(var(--primary-color5-opc), 0.15);
border-color: transparent;
color: var(--primary-color5);
} .home6-testimonial-section {
padding: 140px 0;
background-size: cover;
background-repeat: no-repeat;
}
@media (max-width: 1199px) {
.home6-testimonial-section {
padding: 120px 0;
}
}
@media (max-width: 767px) {
.home6-testimonial-section {
padding: 100px 0;
}
}
@media (max-width: 576px) {
.home6-testimonial-section {
padding: 80px 0;
}
}
.home6-testimonial-section .testimonial-card4 {
text-align: center;
}
.home6-testimonial-section .testimonial-card4 .quote {
fill: none;
stroke: rgba(255, 255, 255, 0.1);
margin-bottom: 40px;
}
@media (max-width: 767px) {
.home6-testimonial-section .testimonial-card4 .quote {
margin-bottom: 35px;
}
}
@media (max-width: 576px) {
.home6-testimonial-section .testimonial-card4 .quote {
margin-bottom: 25px;
width: 75px;
}
}
.home6-testimonial-section .testimonial-card4 span {
color: var(--primary-color2);
font-family: var(--font-manrope);
font-weight: 400;
font-size: 16px;
line-height: 1.2;
letter-spacing: 0.06em;
display: block;
text-transform: uppercase;
margin-bottom: 23px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home6-testimonial-section .testimonial-card4 span {
margin-bottom: 15px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home6-testimonial-section .testimonial-card4 span {
margin-bottom: 12px;
}
}
@media (max-width: 767px) {
.home6-testimonial-section .testimonial-card4 span {
margin-bottom: 15px;
}
}
@media (max-width: 576px) {
.home6-testimonial-section .testimonial-card4 span {
font-size: 15px;
margin-bottom: 12px;
}
}
.home6-testimonial-section .testimonial-card4 p {
color: rgba(255, 255, 255, 0.6);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 20px;
line-height: 48px;
text-transform: capitalize;
margin-bottom: 45px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home6-testimonial-section .testimonial-card4 p {
line-height: 44px;
margin-bottom: 35px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home6-testimonial-section .testimonial-card4 p {
font-size: 17px;
line-height: 40px;
margin-bottom: 25px;
}
}
@media (max-width: 991px) {
.home6-testimonial-section .testimonial-card4 p {
margin-bottom: 35px;
}
}
@media (max-width: 767px) {
.home6-testimonial-section .testimonial-card4 p {
font-size: 20px;
line-height: 44px;
margin-bottom: 30px;
}
}
@media (max-width: 576px) {
.home6-testimonial-section .testimonial-card4 p {
font-size: 17px;
line-height: 36px;
margin-bottom: 20px;
}
}
.home6-testimonial-section .testimonial-card4 .author-area {
padding-top: 20px;
border-top: 1px solid rgba(255, 255, 255, 0.1);
text-align: start;
}
.home6-testimonial-section .testimonial-card4 .author-area h5 {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 21px;
line-height: 1.3;
letter-spacing: 0.03em;
margin-bottom: 10px;
}
.home6-testimonial-section .testimonial-card4 .author-area span {
color: rgba(255, 255, 255, 0.6);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 15px;
line-height: 1;
letter-spacing: 0.03em;
}
.home6-testimonial-section .contact-btn-area {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 15px;
justify-content: end;
margin-top: -70px;
position: relative;
z-index: 1;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.home6-testimonial-section .contact-btn-area {
margin-top: -62px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home6-testimonial-section .contact-btn-area {
margin-top: -60px;
}
}
@media (max-width: 576px) {
.home6-testimonial-section .contact-btn-area {
margin-top: 15px;
justify-content: start;
}
}
.home6-testimonial-section .contact-btn-area .img-grp {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
}
.home6-testimonial-section .contact-btn-area .img-grp li img {
min-width: 44px;
max-width: 44px;
height: 44px;
border-radius: 50%;
border: 1px solid #f0f2f4;
margin-left: -15px;
}
@media (max-width: 576px) {
.home6-testimonial-section .contact-btn-area .img-grp li img {
min-width: 37px;
max-width: 37px;
height: 37px;
}
}
.home6-testimonial-section .contact-btn-area .img-grp li:first-child img {
margin-left: 0;
}
.home6-testimonial-section .contact-btn-area .contact-btn {
position: relative;
display: inline-block;
vertical-align: top;
line-height: 1.4;
text-decoration: none;
outline: none;
padding: 0 1.375em 0.0625em 0;
cursor: pointer;
background-color: transparent;
background-position: 100% 100%;
background-repeat: no-repeat;
background-size: var(--background-size, 100%) 0.0625em;
transition: background-size 0.2s linear var(--background-delay, 0.15s);
transform: translateZ(0);
border: none;
background-image: linear-gradient(0deg, var(--white-color) 0%, var(--white-color) 100%);
color: var(--white-color);
font-family: var(--font-manrope);
font-size: 14px;
font-weight: 500;
text-transform: uppercase;
white-space: nowrap;
}
.home6-testimonial-section .contact-btn-area .contact-btn::after {
content: "\f123";
font-family: "bootstrap-icons";
display: block;
position: absolute;
right: 0;
left: initial;
top: 0;
opacity: 1;
transition: opacity 0.3s 0.15s;
color: var(--white-color);
}
.home6-testimonial-section .contact-btn-area .contact-btn svg {
position: absolute;
display: block;
line-height: 1.8125em;
width: 1.375em;
height: 1.8125em;
right: 0;
left: initial;
top: 50%;
margin: -0.92em 0 0;
fill: none;
stroke: var(--white-color);
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 1px;
stroke-dasharray: 7.95 30;
stroke-dashoffset: var(--stroke-dashoffset, 46);
transition: stroke-dashoffset var(--stroke-duration, 0.15s) var(--stroke-easing, linear) var(--stroke-delay, 0s);
}
.home6-testimonial-section .contact-btn-area .contact-btn:hover {
--background-size: 0%;
--stroke-dashoffset: 26;
--stroke-duration: 0.3s;
--stroke-easing: cubic-bezier(0.3, 1.5, 0.5, 1);
--stroke-delay: 0.195s;
}
.home6-testimonial-section .contact-btn-area .contact-btn:hover::after {
opacity: 0;
transition-delay: 0s;
}
.home6-testimonial-section .testimonial-wrapper {
position: relative;
}
@media (max-width: 767px) {
.home6-testimonial-section .testimonial-wrapper .slider-btn-grp {
display: none;
}
}
.home6-testimonial-section .testimonial-wrapper .slider-btn-grp .slider-btn {
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 0;
}
@media (max-width: 991px) {
.home6-testimonial-section .testimonial-wrapper .slider-btn-grp .slider-btn {
left: -30px;
}
}
.home6-testimonial-section .testimonial-wrapper .slider-btn-grp .slider-btn.testimonial-slider-next {
left: unset;
right: 0;
}
@media (max-width: 991px) {
.home6-testimonial-section .testimonial-wrapper .slider-btn-grp .slider-btn.testimonial-slider-next {
right: -30px;
}
}
.home6-testimonial-section .home3-testimonial-slider .swiper-slide-active .quote,
.home6-testimonial-section .home3-testimonial-slider .swiper-slide-active span,
.home6-testimonial-section .home3-testimonial-slider .swiper-slide-active p {
animation: fadeInDown 1.7s;
}
.home6-testimonial-section .home3-testimonial-slider .swiper-slide-active .author-area {
animation: fadeInUp 1.7s;
} .home6-contact-section .contact-wrapper {
background-color: #f3f5ff;
border-radius: 40px;
padding: 20px 55px 20px 20px;
}
@media (max-width: 1199px) {
.home6-contact-section .contact-wrapper {
padding: 20px 35px 20px 20px;
}
}
@media (max-width: 991px) {
.home6-contact-section .contact-wrapper {
padding: 20px;
border-radius: 30px;
}
}
@media (max-width: 767px) {
.home6-contact-section .contact-wrapper {
border-radius: 20px;
padding: 40px 20px;
}
}
@media (max-width: 576px) {
.home6-contact-section .contact-wrapper {
border-radius: 15px;
}
}
.home6-contact-section .contact-wrapper .contact-img img {
border-radius: 30px;
min-height: 620px;
-o-object-fit: cover;
object-fit: cover;
}
@media (max-width: 991px) {
.home6-contact-section .contact-wrapper .contact-img img {
min-height: 500px;
border-radius: 25px;
}
}
.home6-contact-section .contact-wrapper .contact-form-wrap {
background-color: transparent;
padding: 0;
margin-left: 30px;
}
@media (max-width: 1199px) {
.home6-contact-section .contact-wrapper .contact-form-wrap {
margin-left: 0;
}
}
.home6-contact-section .contact-wrapper .contact-form-wrap .form-inner2 .form-check .form-check-input:checked {
background-color: var(--primary-color5);
border-color: var(--primary-color5);
} .home6-blog-section .section-title {
position: sticky;
top: 120px;
}
.home6-blog-section .section-title .primary-btn6 {
margin-top: 55px;
}
@media (max-width: 1399px) {
.home6-blog-section .section-title .primary-btn6 {
margin-top: 45px;
}
}
@media (max-width: 1199px) {
.home6-blog-section .section-title .primary-btn6 {
margin-top: 35px;
}
}
@media (max-width: 991px) {
.home6-blog-section .section-title .primary-btn6 {
margin-top: 25px;
}
} .home6-subscribe-section {
margin-bottom: -150px;
}
@media (max-width: 991px) {
.home6-subscribe-section {
margin-bottom: -130px;
}
}
.home6-subscribe-section .subscribe-wrapper {
padding: 10px 90px 10px 10px;
border-radius: 15px;
background-color: var(--primary-color5);
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
gap: 50px;
z-index: 1;
}
@media (max-width: 1399px) {
.home6-subscribe-section .subscribe-wrapper {
padding: 10px 70px 10px 10px;
}
}
@media (max-width: 1399px) {
.home6-subscribe-section .subscribe-wrapper {
padding: 10px 30px 10px 10px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.home6-subscribe-section .subscribe-wrapper {
gap: 30px;
}
}
@media (max-width: 991px) {
.home6-subscribe-section .subscribe-wrapper {
flex-wrap: wrap;
padding: 20px 20px 40px;
gap: 25px;
}
}
@media (max-width: 576px) {
.home6-subscribe-section .subscribe-wrapper {
padding: 10px 10px 20px;
gap: 20px;
border-radius: 10px;
}
}
.home6-subscribe-section .subscribe-wrapper .subscribe-img {
max-width: 590px;
min-width: 590px;
width: 100%;
}
@media (max-width: 1399px) {
.home6-subscribe-section .subscribe-wrapper .subscribe-img {
min-width: 530px;
}
}
@media (max-width: 1199px) {
.home6-subscribe-section .subscribe-wrapper .subscribe-img {
min-width: 450px;
}
}
@media (max-width: 991px) {
.home6-subscribe-section .subscribe-wrapper .subscribe-img {
max-width: unset;
min-width: unset;
}
}
.home6-subscribe-section .subscribe-wrapper .subscribe-img img {
border-radius: 15px;
min-height: 280px;
-o-object-fit: cover;
object-fit: cover;
}
@media (max-width: 576px) {
.home6-subscribe-section .subscribe-wrapper .subscribe-img img {
border-radius: 10px;
}
}
.home6-subscribe-section .subscribe-wrapper .subscribe-content {
max-width: 540px;
width: 100%;
}
@media (max-width: 991px) {
.home6-subscribe-section .subscribe-wrapper .subscribe-content {
max-width: unset;
}
}
.home6-subscribe-section .subscribe-wrapper .subscribe-content h4 {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 27px;
line-height: 35px;
margin-bottom: 40px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.home6-subscribe-section .subscribe-wrapper .subscribe-content h4 {
font-size: 25px;
}
}
@media (max-width: 991px) {
.home6-subscribe-section .subscribe-wrapper .subscribe-content h4 {
margin-bottom: 30px;
}
}
@media (max-width: 576px) {
.home6-subscribe-section .subscribe-wrapper .subscribe-content h4 {
font-size: 22px;
margin-bottom: 20px;
}
}
.home6-subscribe-section .subscribe-wrapper .subscribe-content .form-inner {
display: flex;
align-items: center;
gap: 15px;
}
@media (max-width: 576px) {
.home6-subscribe-section .subscribe-wrapper .subscribe-content .form-inner {
flex-wrap: wrap;
}
}
.home6-subscribe-section .subscribe-wrapper .subscribe-content .form-inner input {
border-color: rgba(255, 255, 255, 0.6);
height: 48px;
color: var(--white-color);
}
.home6-subscribe-section .subscribe-wrapper .subscribe-content .form-inner input::-moz-placeholder {
color: rgba(255, 255, 255, 0.75);
}
.home6-subscribe-section .subscribe-wrapper .subscribe-content .form-inner input::placeholder {
color: rgba(255, 255, 255, 0.75);
}
.home6-subscribe-section .subscribe-wrapper .subscribe-content .form-inner .btn-grp {
display: flex;
align-items: center;
gap: 5px;
}
.home6-subscribe-section .subscribe-wrapper .subscribe-content .form-inner .btn-grp button {
color: var(--white-color);
font-family: var(--font-dmsans);
font-weight: 500;
font-size: 12px;
line-height: 1;
padding: 18px 24px;
background-color: var(--black-color);
border-radius: 5px;
transition: 0.5s;
}
.home6-subscribe-section .subscribe-wrapper .subscribe-content .form-inner .btn-grp button:hover {
background-color: var(--white-color);
color: var(--title-color);
}
.home6-subscribe-section .subscribe-wrapper .subscribe-content .form-inner .btn-grp button.send-btn {
padding: 0;
min-width: 48px;
max-width: 48px;
height: 48px;
display: flex;
align-items: center;
justify-content: center;
}
.home6-subscribe-section .subscribe-wrapper .subscribe-content .form-inner .btn-grp button.send-btn svg {
fill: var(--white-color);
transition: 0.5s;
}
.home6-subscribe-section .subscribe-wrapper .subscribe-content .form-inner .btn-grp button.send-btn:hover svg {
fill: var(--title-color);
}
.home6-subscribe-section .subscribe-wrapper .vector {
position: absolute;
bottom: 0;
right: 0;
z-index: -1;
} .breadcrumb-section {
background-color: #fffbf5;
}
.breadcrumb-section .breadcrumb-img img {
max-height: 550px;
-o-object-fit: cover;
object-fit: cover;
}
.breadcrumb-section .breadcrumb-content-wrap {
position: relative;
z-index: 1;
}
.breadcrumb-section .breadcrumb-content-wrap::before {
content: "";
position: absolute;
top: 0;
left: 12%;
width: 1px;
height: 100%;
background-color: rgba(var(--black-color-opc), 0.08);
z-index: -1;
}
@media (max-width: 1799px) {
.breadcrumb-section .breadcrumb-content-wrap::before {
left: 10%;
}
}
@media (max-width: 1699px) {
.breadcrumb-section .breadcrumb-content-wrap::before {
left: 8%;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.breadcrumb-section .breadcrumb-content-wrap::before {
left: 3%;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.breadcrumb-section .breadcrumb-content-wrap::before {
left: 3%;
}
}
.breadcrumb-section .breadcrumb-content-wrap::after {
content: "";
position: absolute;
top: 0;
right: 33.2%;
width: 1px;
height: 100%;
background-color: rgba(var(--black-color-opc), 0.08);
z-index: -1;
}
.breadcrumb-section .breadcrumb-content-wrap .vector {
position: absolute;
bottom: 75px;
left: 0;
}
.breadcrumb-section .breadcrumb-content-wrap .vector2 {
position: absolute;
top: 90px;
right: 0;
z-index: -1;
}
@media (max-width: 576px) {
.breadcrumb-section .breadcrumb-content-wrap .vector2 {
display: none;
}
}
.breadcrumb-section .breadcrumb-content-wrap .circular-text {
position: absolute;
right: 13%;
bottom: 0;
min-width: 120px;
height: 120px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--white-color);
border: 1px solid rgba(var(--black-color-opc), 0.1);
}
@media (max-width: 1399px) {
.breadcrumb-section .breadcrumb-content-wrap .circular-text {
right: 10%;
}
}
@media (max-width: 1199px) {
.breadcrumb-section .breadcrumb-content-wrap .circular-text {
right: 5%;
}
}
@media (max-width: 991px) {
.breadcrumb-section .breadcrumb-content-wrap .circular-text {
display: none;
}
}
.breadcrumb-section .breadcrumb-content-wrap .circular-text .center-icon {
width: 65px;
height: 65px;
border-radius: 50%;
background-color: rgba(203, 0, 0, 0.3);
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 1;
}
.breadcrumb-section .breadcrumb-content-wrap .circular-text .center-icon svg {
fill: var(--white-color);
}
.breadcrumb-section .breadcrumb-content-wrap .circular-text .text {
position: absolute;
width: 100%;
height: 100%;
animation: textRotation 8s linear infinite;
}
.breadcrumb-section .breadcrumb-content-wrap .circular-text .text span {
position: absolute;
left: 50%;
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 13px;
font-weight: 700;
transform-origin: 0 60px;
}
.breadcrumb-section .breadcrumb-content-wrap .circular-text::before {
content: "";
position: absolute;
top: -200px;
left: 50%;
transform: translateX(-50%);
width: 1px;
height: 200px;
background-color: rgba(var(--black-color-opc), 0.08);
}
.breadcrumb-section .breadcrumb-content-wrap .breadcrumb-content {
padding: 160px 0 70px;
}
@media (max-width: 991px) {
.breadcrumb-section .breadcrumb-content-wrap .breadcrumb-content {
padding: 140px 0 50px;
}
}
@media (max-width: 576px) {
.breadcrumb-section .breadcrumb-content-wrap .breadcrumb-content {
padding: 130px 0 40px;
}
}
.breadcrumb-section .breadcrumb-content-wrap .breadcrumb-content .breadcrumb-list {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 15px;
}
.breadcrumb-section .breadcrumb-content-wrap .breadcrumb-content .breadcrumb-list li {
color: rgba(var(--title-color-opc), 0.5);
font-family: var(--font-dmsans);
font-weight: 600;
font-size: 14px;
line-height: 100%;
letter-spacing: 0.05em;
text-transform: uppercase;
position: relative;
padding-left: 20px;
}
@media (max-width: 576px) {
.breadcrumb-section .breadcrumb-content-wrap .breadcrumb-content .breadcrumb-list li {
font-size: 13px;
}
}
.breadcrumb-section .breadcrumb-content-wrap .breadcrumb-content .breadcrumb-list li.active {
color: rgba(var(--title-color-opc), 0.5);
display: flex;
align-items: center;
gap: 6px;
transition: 0.5s;
}
.breadcrumb-section .breadcrumb-content-wrap .breadcrumb-content .breadcrumb-list li::before {
content: "";
width: 8px;
height: 2px;
border-radius: 50%;
background-color: rgba(var(--title-color-opc), 0.5);
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
}
.breadcrumb-section .breadcrumb-content-wrap .breadcrumb-content .breadcrumb-list li:first-child {
padding-left: 0;
}
.breadcrumb-section .breadcrumb-content-wrap .breadcrumb-content .breadcrumb-list li:first-child::before {
display: none;
}
.breadcrumb-section .breadcrumb-content-wrap .breadcrumb-content .breadcrumb-list li a {
color: rgba(var(--title-color-opc), 0.5);
display: flex;
align-items: center;
gap: 6px;
transition: 0.5s;
}
.breadcrumb-section .breadcrumb-content-wrap .breadcrumb-content .breadcrumb-list li a svg {
fill: rgba(var(--title-color-opc), 0.5);
transition: 0.5s;
}
.breadcrumb-section .breadcrumb-content-wrap .breadcrumb-content .breadcrumb-list li a:hover {
color: var(--primary-color1);
}
.breadcrumb-section .breadcrumb-content-wrap .breadcrumb-content .breadcrumb-list li a:hover svg {
fill: var(--primary-color1);
}
.breadcrumb-section .breadcrumb-content-wrap .breadcrumb-content h1 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 60px;
line-height: 1.2;
margin-bottom: 0;
word-wrap: break-word;
}
@media (max-width: 1399px) {
.breadcrumb-section .breadcrumb-content-wrap .breadcrumb-content h1 {
font-size: 57px;
}
}
@media (max-width: 1199px) {
.breadcrumb-section .breadcrumb-content-wrap .breadcrumb-content h1 {
font-size: 53px;
}
}
@media (max-width: 991px) {
.breadcrumb-section .breadcrumb-content-wrap .breadcrumb-content h1 {
font-size: 46px;
line-height: 1.3;
}
}
@media (max-width: 767px) {
.breadcrumb-section .breadcrumb-content-wrap .breadcrumb-content h1 {
font-size: 35px;
}
}
@media (max-width: 576px) {
.breadcrumb-section .breadcrumb-content-wrap .breadcrumb-content h1 {
font-size: 32px;
}
}
.breadcrumb-section .breadcrumb-img {
-webkit-mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/innerpages/breadcrumb-img-bg.png);
mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/innerpages/breadcrumb-img-bg.png);
-webkit-mask-size: cover;
mask-size: cover;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
}
@media (max-width: 1199px) {
.breadcrumb-section .breadcrumb-img {
-webkit-mask-position: 67%;
mask-position: 67%;
}
}
.breadcrumb-section .breadcrumb-img img {
min-height: 400px;
-o-object-fit: cover;
object-fit: cover;
}
@media (max-width: 576px) {
.breadcrumb-section .breadcrumb-img img {
min-height: 280px;
}
}
.breadcrumb-section .breadcrumb-img .post-video iframe,
.breadcrumb-section .breadcrumb-img .post-audio iframe {
width: 100%;
min-height: 450px;
}
.breadcrumb-section .breadcrumb-img .post-quote {
max-width: 1320px;
margin: 0 auto;
}
.breadcrumb-section .breadcrumb-img .post-quote blockquote {
color: rgba(var(--title-color-opc), 0.5);
font-family: var(--font-dmsans);
font-size: 20px;
font-weight: 400;
line-height: 1.8;
background-color: #fff9f6;
padding: 30px 15px;
border-radius: 0;
}
.breadcrumb-section .breadcrumb-img .post-quote blockquote h1,
.breadcrumb-section .breadcrumb-img .post-quote blockquote h2,
.breadcrumb-section .breadcrumb-img .post-quote blockquote h3,
.breadcrumb-section .breadcrumb-img .post-quote blockquote h4,
.breadcrumb-section .breadcrumb-img .post-quote blockquote h5,
.breadcrumb-section .breadcrumb-img .post-quote blockquote h6 {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 25px;
font-weight: 500;
line-height: 1.2;
margin-top: 1rem;
margin-bottom: 0;
}
.breadcrumb-section.two .breadcrumb-content-wrap .breadcrumb-content {
padding: 200px 0 180px;
}
@media (max-width: 1399px) {
.breadcrumb-section.two .breadcrumb-content-wrap .breadcrumb-content {
padding: 180px 0 160px;
}
}
@media (max-width: 1199px) {
.breadcrumb-section.two .breadcrumb-content-wrap .breadcrumb-content {
padding: 180px 0 140px;
}
}
@media (max-width: 991px) {
.breadcrumb-section.two .breadcrumb-content-wrap .breadcrumb-content {
padding: 160px 0 120px;
}
}
@media (max-width: 767px) {
.breadcrumb-section.two .breadcrumb-content-wrap .breadcrumb-content {
padding: 150px 0 100px;
}
}
@media (max-width: 576px) {
.breadcrumb-section.two .breadcrumb-content-wrap .breadcrumb-content {
padding: 130px 0 80px;
}
}
.breadcrumb-section.two .breadcrumb-content-wrap .vector {
bottom: unset;
top: 45%;
}
.breadcrumb-section.two .breadcrumb-content-wrap .circular-text {
bottom: 120px;
}
.breadcrumb-section.two .breadcrumb-content-wrap .circular-text::before {
height: 230px;
top: -230px;
} .innerpage-pagination-area .paginations {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
justify-content: space-between;
gap: 28px;
flex-wrap: wrap;
border: 1px solid rgba(var(--black-color-opc), 0.3);
border-radius: 40px;
padding: 6px 20px;
}
@media (max-width: 991px) {
.innerpage-pagination-area .paginations {
gap: 24px;
}
}
.innerpage-pagination-area .paginations .page-item a {
color: rgba(var(--title-color-opc), 0.5);
font-family: var(--font-manrope);
font-size: 16px;
font-weight: 500;
line-height: 1;
width: 40px;
height: 40px;
border-radius: 40px;
border: 1px solid rgba(var(--black-color-opc), 0.3);
display: flex;
align-items: center;
justify-content: center;
transition: 0.5s;
}
@media (max-width: 576px) {
.innerpage-pagination-area .paginations .page-item a {
width: 36px;
height: 36px;
font-size: 15px;
}
}
.innerpage-pagination-area .paginations .page-item a:hover {
background-color: var(--primary-color1);
border-color: var(--primary-color1);
color: var(--white-color);
}
.innerpage-pagination-area .paginations .page-item.active a {
background-color: var(--primary-color1);
border-color: var(--primary-color1);
color: var(--white-color);
}
.innerpage-pagination-area .paginations .page-item.paginations-button a {
width: unset;
height: unset;
border: unset;
background-color: unset;
}
.innerpage-pagination-area .paginations .page-item.paginations-button a svg {
fill: rgba(var(--title-color-opc), 0.5);
transition: 0.5s;
}
.innerpage-pagination-area .paginations .page-item.paginations-button a:hover svg {
fill: var(--primary-color1);
}
.blog-sidebar-area .widget-title {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 18px;
font-weight: 600;
line-height: 0.9;
letter-spacing: 0.6px;
text-transform: uppercase;
border-bottom: 1px solid var(--title-color);
display: inline-block;
margin-bottom: 30px;
}
@media (max-width: 576px) {
.blog-sidebar-area .widget-title {
margin-bottom: 25px;
}
}
.blog-sidebar-area .single-widgets {
padding: 35px 30px;
border: 1px solid rgba(var(--primary-color1-opc), 0.1);
background-color: #faf9f9;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.blog-sidebar-area .single-widgets {
padding: 30px 20px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.blog-sidebar-area .single-widgets {
padding: 30px 20px;
}
}
@media (max-width: 576px) {
.blog-sidebar-area .single-widgets {
padding: 30px 15px;
}
}
.blog-sidebar-area .single-widgets .category-list {
padding: 0;
margin: 0;
list-style: none;
}
.blog-sidebar-area .single-widgets .category-list li {
position: relative;
display: flex;
align-items: center;
margin-bottom: 25px;
transition: 0.5s;
}
.blog-sidebar-area .single-widgets .category-list li:last-child {
margin-bottom: 0;
}
.blog-sidebar-area .single-widgets .category-list li a {
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
flex-wrap: wrap;
gap: 5px;
transition: 0.5s;
}
.blog-sidebar-area .single-widgets .category-list li a span {
color: rgba(var(--title-color-opc), 0.7);
font-family: var(--font-manrope);
font-size: 16px;
font-weight: 400;
line-height: 1;
letter-spacing: 0.3px;
display: flex;
align-items: center;
gap: 8px;
transition: 0.5s;
}
.blog-sidebar-area .single-widgets .category-list li a span svg {
fill: rgba(var(--title-color-opc), 0.7);
transition: 0.5s;
}
.blog-sidebar-area .single-widgets .category-list li a span:last-child {
font-family: var(--font-dmsans);
font-size: 14px;
font-weight: 500;
}
.blog-sidebar-area .single-widgets .category-list li:hover a span {
color: var(--primary-color1);
}
.blog-sidebar-area .single-widgets .category-list li:hover a span svg {
fill: var(--primary-color1);
}
.blog-sidebar-area .single-widgets .recent-post-widget {
display: flex;
align-items: center;
gap: 15px;
}
.blog-sidebar-area .single-widgets .recent-post-widget .recent-post-img img {
min-width: 92px;
max-width: 92px;
height: 71px;
-o-object-fit: cover;
object-fit: cover;
}
.blog-sidebar-area .single-widgets .recent-post-widget .recent-post-content {
line-height: 1;
}
.blog-sidebar-area .single-widgets .recent-post-widget .recent-post-content > a {
color: rgba(var(--title-color-opc), 0.5);
font-family: var(--font-dmsans);
font-size: 12px;
font-weight: 500;
display: block;
margin-bottom: 8px;
transition: 0.5s;
}
@media (max-width: 576px) {
.blog-sidebar-area .single-widgets .recent-post-widget .recent-post-content > a {
margin-bottom: 5px;
}
}
.blog-sidebar-area .single-widgets .recent-post-widget .recent-post-content > a:hover {
color: var(--primary-color1);
}
.blog-sidebar-area .single-widgets .recent-post-widget .recent-post-content h6 {
margin-bottom: 0;
}
.blog-sidebar-area .single-widgets .recent-post-widget .recent-post-content h6 a {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 17px;
font-weight: 500;
line-height: 20px;
letter-spacing: 0.32px;
transition: 0.5s;
}
@media (min-width: 992px) and (max-width: 1199px) {
.blog-sidebar-area .single-widgets .recent-post-widget .recent-post-content h6 a {
font-size: 14px;
}
}
@media (max-width: 576px) {
.blog-sidebar-area .single-widgets .recent-post-widget .recent-post-content h6 a {
font-size: 15px;
}
}
.blog-sidebar-area .single-widgets .recent-post-widget .recent-post-content h6 a:hover {
color: var(--primary-color1);
}
.blog-sidebar-area .single-widgets .tag-list {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
gap: 15px;
flex-wrap: wrap;
}
@media (max-width: 1399px) {
.blog-sidebar-area .single-widgets .tag-list {
gap: 10px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.blog-sidebar-area .single-widgets .tag-list {
gap: 14px;
}
}
@media (max-width: 576px) {
.blog-sidebar-area .single-widgets .tag-list {
gap: 5px;
row-gap: 5px;
}
}
.blog-sidebar-area .single-widgets .tag-list li a {
color: rgba(var(--title-color-opc), 0.7);
font-family: var(--font-manrope);
font-size: 11px;
font-weight: 500;
display: block;
line-height: 1;
padding: 9px 12px;
border-radius: 100px;
text-transform: uppercase;
background: var(--white-color);
transition: 0.5s;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.blog-sidebar-area .single-widgets .tag-list li a {
padding: 9px 11px;
font-size: 10px;
}
}
@media (max-width: 576px) {
.blog-sidebar-area .single-widgets .tag-list li a {
font-size: 10px;
padding: 8px 9px;
}
}
.blog-sidebar-area .single-widgets .tag-list li:hover a {
color: var(--white-color);
background-color: var(--primary-color1);
}
.blog-sidebar-area .single-widgets .search-box {
display: flex;
align-items: center;
}
.blog-sidebar-area .single-widgets .search-box input {
width: 100%;
padding: 8px 20px;
color: var(--title-color);
font-family: var(--font-dmsans);
font-size: 12px;
height: 45px;
border: 1px solid rgba(var(--black-color-opc), 0.3);
border-right: unset;
}
@media (min-width: 992px) and (max-width: 1199px) {
.blog-sidebar-area .single-widgets .search-box input {
padding: 8px 15px;
}
}
.blog-sidebar-area .single-widgets .search-box input:focus {
border: 1px solid #ddd;
}
.blog-sidebar-area .single-widgets .search-box input::-moz-placeholder {
color: rgba(var(--title-color-opc), 0.4);
}
.blog-sidebar-area .single-widgets .search-box input::placeholder {
color: rgba(var(--title-color-opc), 0.4);
}
.blog-sidebar-area .single-widgets .search-box button {
background-color: var(--primary-color1);
min-width: 90px;
height: 45px;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
position: relative;
z-index: 1;
}
@media (max-width: 1399px) {
.blog-sidebar-area .single-widgets .search-box button {
min-width: 75px;
}
}
.blog-sidebar-area .single-widgets .search-box button::after {
position: absolute;
content: "";
display: block;
left: 15%;
right: -20%;
top: -4%;
height: 150%;
width: 150%;
bottom: 0;
border-radius: 2px;
background-color: var(--black-color);
transform: skewX(45deg) scale(0, 1);
z-index: -1;
transition: all 0.5s ease-out 0s;
}
.blog-sidebar-area .single-widgets .search-box button i {
color: var(--white-color);
font-size: 22px;
}
@media (max-width: 576px) {
.blog-sidebar-area .single-widgets .search-box button {
min-width: 70px;
}
}
.blog-sidebar-area .single-widgets .search-box button:hover::after {
transform: skewX(45deg) scale(1, 1);
} .blog-details-page .blog-details-top-area .blog-meta {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-wrap: wrap;
line-height: 1;
margin-bottom: 25px;
}
@media (max-width: 767px) {
.blog-details-page .blog-details-top-area .blog-meta {
margin-bottom: 20px;
}
}
.blog-details-page .blog-details-top-area .blog-meta li {
color: rgba(var(--title-color-opc), 0.5);
font-family: var(--font-dmsans);
font-weight: 500;
font-size: 15px;
letter-spacing: 0.3px;
margin-right: 50px;
display: flex;
align-items: center;
position: relative;
transition: 0.25s ease;
}
@media (min-width: 576px) and (max-width: 768px) {
.blog-details-page .blog-details-top-area .blog-meta li {
font-size: 13px;
margin-right: 20px;
}
}
@media (max-width: 576px) {
.blog-details-page .blog-details-top-area .blog-meta li {
margin-right: 16px;
font-size: 12px;
line-height: 1.2;
}
}
.blog-details-page .blog-details-top-area .blog-meta li svg {
margin-right: 8px;
fill: rgba(var(--title-color-opc), 0.5);
transition: 0.5s;
}
@media (max-width: 767px) {
.blog-details-page .blog-details-top-area .blog-meta li svg {
width: 14px;
}
}
@media (min-width: 576px) and (max-width: 768px) {
.blog-details-page .blog-details-top-area .blog-meta li svg {
margin-right: 5px;
}
}
@media (max-width: 576px) {
.blog-details-page .blog-details-top-area .blog-meta li svg {
margin-right: 5px;
}
}
.blog-details-page .blog-details-top-area .blog-meta li a {
color: rgba(var(--title-color-opc), 0.5);
transition: 0.5s;
}
.blog-details-page .blog-details-top-area .blog-meta li:hover a {
color: var(--primary-color1);
}
.blog-details-page .blog-details-top-area .blog-meta li:hover a svg {
fill: var(--primary-color1);
}
.blog-details-page .blog-details-top-area .blog-meta li::before {
content: "";
position: absolute;
right: -25px;
top: 50%;
transform: translateY(-50%);
width: 2px;
height: 10px;
line-height: 5px;
background-color: var(--primary-color1);
border-radius: 4px;
}
@media (min-width: 576px) and (max-width: 768px) {
.blog-details-page .blog-details-top-area .blog-meta li::before {
right: -10px;
}
}
@media (max-width: 576px) {
.blog-details-page .blog-details-top-area .blog-meta li::before {
right: -8px;
}
}
.blog-details-page .blog-details-top-area .blog-meta li:last-child {
margin-right: 0;
}
.blog-details-page .blog-details-top-area .blog-meta li:last-child::before {
display: none;
visibility: hidden;
}
.blog-details-page .blog-details-top-area h2 {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 48px;
font-weight: 600;
line-height: 1.2;
margin-bottom: 35px;
word-wrap: break-word;
}
@media (max-width: 1399px) {
.blog-details-page .blog-details-top-area h2 {
font-size: 45px;
margin-bottom: 30px;
}
}
@media (max-width: 1199px) {
.blog-details-page .blog-details-top-area h2 {
font-size: 40px;
}
}
@media (max-width: 991px) {
.blog-details-page .blog-details-top-area h2 {
font-size: 40px;
margin-bottom: 25px;
}
}
@media (max-width: 767px) {
.blog-details-page .blog-details-top-area h2 {
font-size: 36px;
}
}
@media (max-width: 576px) {
.blog-details-page .blog-details-top-area h2 {
font-size: 32px;
line-height: 1.3;
margin-bottom: 20px;
}
}
.blog-details-page .blog-details-top-area .author-area {
display: flex;
align-items: center;
gap: 10px;
}
.blog-details-page .blog-details-top-area .author-area .author-img img {
width: 30px;
height: 30px;
border-radius: 50%;
}
.blog-details-page .blog-details-top-area .author-area .author-content h6 {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 15px;
font-weight: 500;
line-height: 1;
margin-bottom: 0;
}
.blog-details-page .blog-details-top-area .author-area .author-content h6 a {
color: var(--primary-color1);
text-decoration: underline;
}
.blog-details-page .tag-and-social-area {
display: flex;
align-items: center;
justify-content: space-between;
gap: 15px;
flex-wrap: wrap;
margin-bottom: 25px;
}
.blog-details-page .tag-and-social-area .tag-list {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
gap: 20px;
flex-wrap: wrap;
}
.blog-details-page .tag-and-social-area .tag-list li a {
color: rgba(var(--title-color-opc), 0.5);
font-family: var(--font-manrope);
font-size: 15px;
font-weight: 400;
line-height: 1;
transition: 0.5s;
}
.blog-details-page .tag-and-social-area .tag-list li a span {
color: var(--primary-color1);
}
.blog-details-page .tag-and-social-area .tag-list li a:hover {
color: var(--primary-color1);
}
.blog-details-page .tag-and-social-area .social-area {
display: flex;
align-items: center;
gap: 20px;
}
.blog-details-page .tag-and-social-area .social-area h6 {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 18px;
font-weight: 500;
line-height: 1;
margin-bottom: 0;
}
.blog-details-page .tag-and-social-area .social-area .social-link {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
gap: 28px;
line-height: 1;
}
.blog-details-page .tag-and-social-area .social-area .social-link li a i {
font-size: 18px;
color: rgba(var(--title-color-opc), 0.4);
transition: 0.5s;
}
.blog-details-page .tag-and-social-area .social-area .social-link li a i.bi-twitter-x {
font-size: 15px;
}
.blog-details-page .tag-and-social-area .social-area .social-link li a:hover i {
color: var(--primary-color1);
}
.blog-details-page .details-navigation {
display: flex;
align-items: center;
justify-content: space-between;
gap: 15px;
flex-wrap: wrap;
padding: 30px 0;
border-top: 1px solid rgba(var(--black-color-opc), 0.1);
border-bottom: 1px solid rgba(var(--black-color-opc), 0.1);
}
@media (max-width: 767px) {
.blog-details-page .details-navigation {
padding: 25px 0;
}
}
.blog-details-page .details-navigation .navigation-arrow {
width: 40px;
height: 30px;
border-radius: 15px;
background-color: rgba(var(--primary-color1-opc), 0.1);
display: flex;
align-items: center;
justify-content: center;
transition: 0.5s;
}
.blog-details-page .details-navigation .navigation-arrow svg {
fill: var(--primary-color1);
transition: 0.5s;
}
.blog-details-page .details-navigation .navigation-arrow:hover {
background-color: var(--primary-color1);
}
.blog-details-page .details-navigation .navigation-arrow:hover svg {
fill: var(--white-color);
}
.blog-details-page .details-navigation p {
color: rgba(var(--title-color-opc), 0.7);
font-family: var(--font-manrope);
font-size: 20px;
font-weight: 500;
line-height: 1.5;
margin-bottom: 0;
max-width: 80%;
word-wrap: break-word;
}
@media (max-width: 767px) {
.blog-details-page .details-navigation p {
font-size: 18px;
}
}
.blog-details-page .comment-area {
scroll-margin-top: 120px;
}
.blog-details-page .comment-area .title {
margin-bottom: 55px;
}
@media (max-width: 991px) {
.blog-details-page .comment-area .title {
margin-bottom: 45px;
}
}
.blog-details-page .comment-area .title h3 {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 28px;
font-weight: 600;
margin-bottom: 0;
line-height: 1;
text-decoration: underline;
-webkit-text-decoration-skip-ink: none;
text-decoration-skip-ink: none;
text-decoration-thickness: 2px;
text-underline-offset: 3px;
}
@media (max-width: 576px) {
.blog-details-page .comment-area .title h3 {
font-size: 25px;
}
}
.blog-details-page .comment-area .comment {
margin: 0;
padding: 0;
list-style: none;
}
.blog-details-page .comment-area .comment > li {
padding-bottom: 35px;
margin-bottom: 35px;
border-bottom: 1px solid rgba(var(--black-color-opc), 0.1);
}
.blog-details-page .comment-area .comment > li:last-child {
margin-bottom: 0;
padding-bottom: 0;
border-bottom: unset;
}
.blog-details-page .comment-area .comment .single-comment-area {
display: flex;
align-items: flex-start;
gap: 20px;
}
@media (max-width: 576px) {
.blog-details-page .comment-area .comment .single-comment-area {
flex-direction: column;
}
}
.blog-details-page .comment-area .comment .single-comment-area .author-img img {
max-width: 100px;
min-width: 100px;
height: 100px;
border-radius: 20px;
}
@media (max-width: 576px) {
.blog-details-page .comment-area .comment .single-comment-area .author-img img {
max-width: 70px;
min-width: 70px;
height: 70px;
border-radius: 10px;
}
}
.blog-details-page .comment-area .comment .single-comment-area .comment-content .author-name-date {
display: flex;
align-items: center;
gap: 8px;
margin-bottom: 20px;
flex-wrap: wrap;
}
@media (max-width: 767px) {
.blog-details-page .comment-area .comment .single-comment-area .comment-content .author-name-date {
margin-bottom: 15px;
}
}
@media (max-width: 576px) {
.blog-details-page .comment-area .comment .single-comment-area .comment-content .author-name-date {
margin-bottom: 10px;
}
}
.blog-details-page .comment-area .comment .single-comment-area .comment-content .author-name-date h4 {
line-height: 1;
margin-bottom: 0;
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 24px;
font-weight: 500;
}
@media (max-width: 767px) {
.blog-details-page .comment-area .comment .single-comment-area .comment-content .author-name-date h4 {
font-size: 22px;
}
}
@media (max-width: 576px) {
.blog-details-page .comment-area .comment .single-comment-area .comment-content .author-name-date h4 {
font-size: 20px;
}
}
.blog-details-page .comment-area .comment .single-comment-area .comment-content .author-name-date span {
color: rgba(var(--title-color-opc), 0.5);
font-family: var(--font-manrope);
font-size: 18px;
font-weight: 400;
line-height: 1;
}
.blog-details-page .comment-area .comment .single-comment-area .comment-content p {
color: rgba(var(--title-color-opc), 0.5);
font-family: var(--font-dmsans);
font-size: 17px;
font-weight: 400;
line-height: 1.8;
margin-bottom: 28px;
}
@media (max-width: 576px) {
.blog-details-page .comment-area .comment .single-comment-area .comment-content p {
font-size: 15px;
margin-bottom: 20px;
}
}
.blog-details-page .comment-area .comment .single-comment-area .comment-content .replay-btn {
display: inline-block;
padding: 10px 26px;
border: 1px solid var(--primary-color1);
border-radius: 100px;
line-height: 1;
cursor: pointer;
transition: 0.35s;
}
.blog-details-page .comment-area .comment .single-comment-area .comment-content .replay-btn svg {
transition: 0.35s;
fill: var(--primary-color1);
}
.blog-details-page .comment-area .comment .single-comment-area .comment-content .replay-btn .details-button {
transition: 0.5s;
position: relative;
display: inline-block;
vertical-align: top;
line-height: 1;
font-weight: 500;
text-decoration: none;
outline: none;
padding: 0 1.375em 0.0625em 0;
cursor: pointer;
background-color: transparent;
background-position: 100% 100%;
background-repeat: no-repeat;
background-size: var(--background-size, 100%) 0.0625em;
transition: background-size 0.2s linear var(--background-delay, 0.15s);
border: none;
background-image: linear-gradient(0deg, var(--primary-color1) 0%, var(--primary-color1) 100%);
color: var(--primary-color1);
font-family: var(--font-dmsans);
font-size: 15px;
font-weight: 500;
white-space: nowrap;
}
.blog-details-page .comment-area .comment .single-comment-area .comment-content .replay-btn .details-button::after {
content: "\f123";
font-family: "bootstrap-icons";
display: block;
position: absolute;
right: 0;
left: initial;
top: 0;
opacity: 1;
transition: opacity 0.3s 0.15s;
color: var(--primary-color1);
}
.blog-details-page .comment-area .comment .single-comment-area .comment-content .replay-btn .details-button svg {
position: absolute;
display: block;
line-height: 1.8125em;
width: 1.375em;
height: 1.8125em;
right: 0;
left: initial;
top: 50%;
margin: -0.92em 0 0;
fill: none;
stroke: var(--primary-color1);
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 1px;
stroke-dasharray: 7.95 30;
stroke-dashoffset: var(--stroke-dashoffset, 46);
transition: stroke-dashoffset var(--stroke-duration, 0.15s) var(--stroke-easing, linear) var(--stroke-delay, 0s);
}
.blog-details-page .comment-area .comment .single-comment-area .comment-content .replay-btn:hover {
background-color: var(--primary-color1);
}
.blog-details-page .comment-area .comment .single-comment-area .comment-content .replay-btn:hover .details-button {
--background-size: 0%;
--stroke-dashoffset: 26;
--stroke-duration: 0.3s;
--stroke-easing: cubic-bezier(0.3, 1.5, 0.5, 1);
--stroke-delay: 0.195s;
background-image: linear-gradient(0deg, #fff 0%, #fff 100%);
color: var(--white-color);
}
.blog-details-page .comment-area .comment .single-comment-area .comment-content .replay-btn:hover .details-button svg {
stroke: var(--white-color);
}
.blog-details-page .comment-area .comment .single-comment-area .comment-content .replay-btn:hover .details-button::after {
opacity: 0;
transition-delay: 0s;
color: var(--white-color);
}
.blog-details-page .comment-area .contact-form-area {
padding-top: 120px;
}
@media (max-width: 1199px) {
.blog-details-page .comment-area .contact-form-area {
padding-top: 90px;
}
}
@media (max-width: 991px) {
.blog-details-page .comment-area .contact-form-area {
padding-top: 70px;
}
}
.blog-details-page .comment-area .contact-form-area .contact-form {
background: #faf8fb;
padding: 45px 55px;
border-radius: 30px;
}
@media (max-width: 1199px) {
.blog-details-page .comment-area .contact-form-area .contact-form {
padding: 45px 40px;
}
}
@media (max-width: 767px) {
.blog-details-page .comment-area .contact-form-area .contact-form {
padding: 45px 30px;
}
}
@media (max-width: 576px) {
.blog-details-page .comment-area .contact-form-area .contact-form {
padding: 40px 15px;
border-radius: 10px;
}
}
.blog-details-page .comment-area .contact-form-area .contact-form .form-inner input,
.blog-details-page .comment-area .contact-form-area .contact-form .form-inner textarea {
border-color: rgba(var(--black-color-opc), 0.2);
}
.blog-details-page .comment-area .contact-form-area .contact-form .form-inner input:focus,
.blog-details-page .comment-area .contact-form-area .contact-form .form-inner textarea:focus {
border-color: var(--black-color);
}
.blog-details-page .comment-area .contact-form-area .contact-form .form-inner textarea {
min-height: 90px;
}
.blog-details-page .comment-area .contact-form-area .contact-form button {
border: unset;
}
.blog-details-page .comment-area .contact-form-area .contact-form button.primary-btn3 {
border-radius: unset;
}
.blog-details-page .comment-area .contact-form-area .contact-form button.primary-btn3::after {
background-color: var(--primary-color1);
} .comment-respond {
background: #faf8fb;
padding: 45px 55px;
border-radius: 30px;
}
@media (max-width: 1199px) {
.comment-respond {
padding: 45px 40px;
}
}
@media (max-width: 767px) {
.comment-respond {
padding: 45px 30px;
}
}
@media (max-width: 576px) {
.comment-respond {
padding: 40px 15px;
border-radius: 10px;
}
}
.comment-respond .form-inner input,
.comment-respond .form-inner textarea {
border-color: rgba(var(--black-color-opc), 0.2);
}
.comment-respond .form-inner input:focus,
.comment-respond .form-inner textarea:focus {
border-color: var(--black-color);
}
.comment-respond .form-inner textarea {
min-height: 90px;
}
.comment-respond button {
border: unset;
}
.comment-respond button.primary-btn3 {
border-radius: unset;
}
.comment-respond button.primary-btn3::after {
background-color: var(--primary-color1);
}
.comment-respond textarea {
background: transparent;
border-color: rgba(var(--black-color-opc), 0.2);
border-radius: 5px;
}
.comment-respond input[type=submit] {
background-color: var(--black-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
color: var(--white-color);
letter-spacing: 0.48px;
line-height: 1;
padding: 22px 26px;
text-transform: uppercase;
text-decoration: underline;
border-radius: 0;
white-space: nowrap;
}
.comment-respond input[type=submit]:hover {
background-color: var(--primary-color1);
} .details-content-wrapper .line-break {
height: 15px;
display: block;
}
@media (max-width: 767px) {
.details-content-wrapper .line-break {
height: 10px;
}
}
.details-content-wrapper p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 17px;
font-weight: 400;
line-height: 1.9;
}
@media (max-width: 767px) {
.details-content-wrapper p {
font-size: 16px;
}
}
@media (max-width: 576px) {
.details-content-wrapper p {
font-size: 15px;
}
}
.details-content-wrapper p.first-para::first-letter {
float: left;
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 70px;
font-weight: 700;
line-height: 1;
margin-right: 15px;
}
@media (max-width: 576px) {
.details-content-wrapper p.first-para::first-letter {
font-size: 60px;
margin-right: 10px;
}
}
.details-content-wrapper p a {
color: var(--primary-color1);
text-decoration: underline;
font-family: var(--font-dmsans);
font-size: 17px;
font-weight: 400;
line-height: 1.9;
}
@media (max-width: 767px) {
.details-content-wrapper p a {
font-size: 16px;
}
}
@media (max-width: 576px) {
.details-content-wrapper p a {
font-size: 15px;
}
}
.details-content-wrapper p a.first-para::first-letter {
float: left;
font-size: 70px;
font-weight: 700;
line-height: 1;
margin-right: 15px;
}
@media (max-width: 576px) {
.details-content-wrapper p a.first-para::first-letter {
font-size: 60px;
margin-right: 10px;
}
}
.details-content-wrapper h3 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
line-height: normal;
}
@media (max-width: 1199px) {
.details-content-wrapper h3 {
font-size: 32px;
}
}
@media (max-width: 767px) {
.details-content-wrapper h3 {
font-size: 28px;
}
}
@media (max-width: 576px) {
.details-content-wrapper h3 {
font-size: 25px;
}
}
.details-content-wrapper h4 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
line-height: normal;
}
@media (max-width: 576px) {
.details-content-wrapper h4 {
font-size: 26px;
}
}
.details-content-wrapper blockquote {
background-color: #fff9f6;
padding: 28px 40px;
border-radius: 20px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.details-content-wrapper blockquote {
padding: 28px 30px;
}
}
@media (max-width: 991px) {
.details-content-wrapper blockquote {
padding: 28px 25px;
}
}
@media (max-width: 767px) {
.details-content-wrapper blockquote {
padding: 28px 25px;
}
}
@media (max-width: 576px) {
.details-content-wrapper blockquote {
padding: 28px 20px;
border-radius: 10px;
}
}
.details-content-wrapper blockquote svg {
fill: var(--primary-color1);
}
.details-content-wrapper blockquote h4 {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 25px;
font-weight: 500;
line-height: 1.2;
margin-bottom: 0;
}
@media (max-width: 576px) {
.details-content-wrapper blockquote h4 {
font-size: 23px;
}
}
.details-content-wrapper blockquote p {
color: rgba(var(--title-color-opc), 0.5);
font-family: var(--font-dmsans);
font-size: 20px;
font-weight: 400;
line-height: 1.9;
padding-top: 20px;
margin-bottom: 20px;
}
@media (max-width: 991px) {
.details-content-wrapper blockquote p {
font-size: 19px;
}
}
@media (max-width: 767px) {
.details-content-wrapper blockquote p {
font-size: 18px;
margin-bottom: 20px;
}
}
@media (max-width: 767px) {
.details-content-wrapper blockquote p {
font-size: 17px;
}
}
@media (max-width: 576px) {
.details-content-wrapper blockquote p {
margin-bottom: 15px;
}
}
.details-content-wrapper ul li {
color: rgba(var(--title-color-opc), 0.7);
font-family: var(--font-manrope);
font-size: 16px;
font-weight: 600;
line-height: 1.2;
letter-spacing: 0.34px;
margin-bottom: 20px;
}
@media (max-width: 576px) {
.details-content-wrapper ul li {
font-size: 15px;
margin-bottom: 15px;
}
}
.details-content-wrapper ul li:last-child {
margin-bottom: 0;
}
.details-content-wrapper ul li svg {
fill: var(--primary-color1);
}
.details-content-wrapper ul.style-2 {
-moz-columns: unset;
columns: unset;
padding-left: 18px;
list-style: disc;
}
.details-content-wrapper ul.style-2 li {
color: var(--text-color);
line-height: 30px;
display: list-item;
font-size: 17px;
}
@media (max-width: 576px) {
.details-content-wrapper ul.style-2 li {
font-size: 15px;
}
}
.details-content-wrapper .project-details-img-grp img {
border-radius: 10px;
} .inner-contact-section {
padding: 90px 0;
}
@media (max-width: 767px) {
.inner-contact-section {
padding: 70px 0;
}
}
.inner-contact-section .section-title {
margin-bottom: 80px;
}
@media (max-width: 1199px) {
.inner-contact-section .section-title {
margin-bottom: 60px;
}
}
@media (max-width: 991px) {
.inner-contact-section .section-title {
margin-bottom: 40px;
}
}
@media (max-width: 576px) {
.inner-contact-section .section-title {
margin-bottom: 35px;
}
}
.inner-contact-section .section-title span {
display: inline-flex;
align-items: center;
gap: 6px;
background-color: transparent;
border: 1px solid rgba(var(--primary-color2-opc), 0.2);
border-radius: 100px;
font-size: 14px;
font-weight: 600;
padding: 9px 23px;
}
.inner-contact-section .section-title span svg {
fill: var(--primary-color2);
}
@media (max-width: 576px) {
.inner-contact-section .section-title span {
font-size: 13px;
padding: 8px 20px;
}
}
.inner-contact-section .section-title h2 {
font-size: 55px;
}
@media (max-width: 1399px) {
.inner-contact-section .section-title h2 {
font-size: 48px;
}
}
@media (max-width: 767px) {
.inner-contact-section .section-title h2 {
font-size: 40px;
}
}
@media (max-width: 576px) {
.inner-contact-section .section-title h2 {
font-size: 32px;
}
}
.inner-contact-section .arrow-vector {
fill: rgba(var(--black-color-opc), 0.2);
margin-left: 68px;
margin-bottom: 90px;
}
@media (max-width: 1199px) {
.inner-contact-section .arrow-vector {
margin-bottom: 70px;
}
}
@media (max-width: 991px) {
.inner-contact-section .arrow-vector {
margin-bottom: 50px;
}
}
@media (max-width: 576px) {
.inner-contact-section .arrow-vector {
display: none;
}
}
.inner-contact-section .contact-content .contact-list {
padding: 0;
margin: 0;
list-style: none;
}
@media (max-width: 991px) {
.inner-contact-section .contact-content .contact-list {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 60px;
}
}
@media (max-width: 576px) {
.inner-contact-section .contact-content .contact-list {
gap: 30px;
}
}
.inner-contact-section .contact-content .contact-list .single-contact {
display: flex;
align-items: center;
gap: 20px;
margin-bottom: 50px;
}
@media (max-width: 991px) {
.inner-contact-section .contact-content .contact-list .single-contact {
margin-bottom: 0;
}
}
.inner-contact-section .contact-content .contact-list .single-contact:last-child {
margin-bottom: 0;
}
.inner-contact-section .contact-content .contact-list .single-contact .icon {
position: relative;
}
.inner-contact-section .contact-content .contact-list .single-contact .icon svg {
fill: var(--primary-color2);
}
.inner-contact-section .contact-content .contact-list .single-contact .icon::after {
content: "";
height: 35px;
width: 1px;
position: absolute;
top: 50%;
transform: translateY(-50%);
right: -10px;
background-color: rgba(var(--black-color-opc), 0.15);
}
.inner-contact-section .contact-content .contact-list .single-contact .content span {
color: rgba(var(--title-color-opc), 0.6);
font-family: var(--font-manrope);
font-size: 14px;
font-weight: 400;
line-height: 1;
display: block;
margin-bottom: 10px;
}
.inner-contact-section .contact-content .contact-list .single-contact .content h6 {
margin-bottom: 0;
}
.inner-contact-section .contact-content .contact-list .single-contact .content h6 a {
color: var(--title-color);
font-family: var(--font-dmsans);
font-weight: 600;
font-size: 18px;
line-height: 1;
transition: 0.5s;
}
@media (min-width: 992px) and (max-width: 1199px) {
.inner-contact-section .contact-content .contact-list .single-contact .content h6 a {
font-size: 17px;
}
}
@media (max-width: 576px) {
.inner-contact-section .contact-content .contact-list .single-contact .content h6 a {
font-size: 16px;
}
}
.inner-contact-section .contact-content .contact-list .single-contact .content h6 a:hover {
color: var(--primary-color2);
}
.inner-contact-section.two {
background-image: unset;
padding: 0px 0 0;
}
@media (min-width: 992px) and (max-width: 1199px) {
.inner-contact-section.two {
padding: 0px 0 0;
}
}
@media (max-width: 991px) {
.inner-contact-section.two {
padding: 0px 0 0;
}
}
@media (max-width: 767px) {
.inner-contact-section.two {
padding: 0px 0 0;
}
}
.inner-contact-section.two .contact-wrapper {
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/home4/home4-contact-bg.png), linear-gradient(180deg, #f1f5ff 0%, #f1f5ff 100%);
background-size: cover;
background-repeat: no-repeat;
padding: 85px 50px 85px 75px;
border-radius: 30px;
}
@media (max-width: 1399px) {
.inner-contact-section.two .contact-wrapper {
padding: 85px 50px 85px 65px;
}
}
@media (max-width: 1199px) {
.inner-contact-section.two .contact-wrapper {
padding: 85px 40px;
}
}
@media (max-width: 991px) {
.inner-contact-section.two .contact-wrapper {
padding: 70px 40px;
}
}
@media (max-width: 767px) {
.inner-contact-section.two .contact-wrapper {
padding: 60px 20px;
border-radius: 20px;
}
}
@media (max-width: 576px) {
.inner-contact-section.two .contact-wrapper {
padding: 50px 10px;
border-radius: 10px;
}
} .error-page-wrapper {
background-color: #fffbf5;
position: relative;
z-index: 2;
}
.error-page-wrapper::before {
content: "";
position: absolute;
top: 0;
left: 12%;
width: 1px;
height: 100%;
background-color: rgba(var(--black-color-opc), 0.08);
z-index: 1;
}
@media (max-width: 1799px) {
.error-page-wrapper::before {
left: 10%;
}
}
@media (max-width: 1699px) {
.error-page-wrapper::before {
left: 8%;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.error-page-wrapper::before {
left: 3%;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.error-page-wrapper::before {
left: 3%;
}
}
.error-page-wrapper::after {
content: "";
position: absolute;
top: 0;
right: 33.2%;
width: 1px;
height: 100%;
background-color: rgba(var(--black-color-opc), 0.08);
z-index: 1;
}
.error-page-wrapper .breadcrumb-section .breadcrumb-content-wrap::before, .error-page-wrapper .breadcrumb-section .breadcrumb-content-wrap::after {
display: none;
}
.error-page-wrapper .breadcrumb-section .breadcrumb-content-wrap .breadcrumb-content {
padding: 160px 0 0;
}
@media (max-width: 991px) {
.error-page-wrapper .breadcrumb-section .breadcrumb-content-wrap .breadcrumb-content {
padding: 140px 0 0;
}
}
@media (max-width: 576px) {
.error-page-wrapper .breadcrumb-section .breadcrumb-content-wrap .breadcrumb-content {
padding: 130px 0 0;
}
}
.error-page-wrapper .error-content {
padding: 135px 0 150px;
}
@media (max-width: 1399px) {
.error-page-wrapper .error-content {
padding: 115px 0 130px;
}
}
@media (max-width: 991px) {
.error-page-wrapper .error-content {
padding: 95px 0 110px;
}
}
@media (max-width: 767px) {
.error-page-wrapper .error-content {
padding: 60px 0 70px;
}
}
.error-page-wrapper .error-content img {
max-width: 70%;
margin-bottom: 110px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.error-page-wrapper .error-content img {
margin-bottom: 90px;
}
}
@media (max-width: 1399px) {
.error-page-wrapper .error-content img {
margin-bottom: 90px;
}
}
@media (max-width: 1199px) {
.error-page-wrapper .error-content img {
margin-bottom: 80px;
}
}
@media (max-width: 991px) {
.error-page-wrapper .error-content img {
margin-bottom: 70px;
}
}
@media (max-width: 767px) {
.error-page-wrapper .error-content img {
margin-bottom: 50px;
}
}
@media (max-width: 576px) {
.error-page-wrapper .error-content img {
margin-bottom: 35px;
}
}
.error-page-wrapper .error-content h2 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 78px;
line-height: 1.1;
margin-bottom: 35px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.error-page-wrapper .error-content h2 {
font-size: 75px;
}
}
@media (max-width: 1399px) {
.error-page-wrapper .error-content h2 {
font-size: 67px;
margin-bottom: 30px;
}
}
@media (max-width: 1199px) {
.error-page-wrapper .error-content h2 {
font-size: 60px;
margin-bottom: 25px;
}
}
@media (max-width: 991px) {
.error-page-wrapper .error-content h2 {
font-size: 55px;
}
}
@media (max-width: 767px) {
.error-page-wrapper .error-content h2 {
font-size: 45px;
margin-bottom: 20px;
}
}
@media (max-width: 576px) {
.error-page-wrapper .error-content h2 {
font-size: 38px;
line-height: 1.4;
margin-bottom: 15px;
}
}
.error-page-wrapper .error-content p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 18px;
line-height: 35px;
max-width: 746px;
width: 100%;
margin: 0 auto 50px;
}
@media (max-width: 1399px) {
.error-page-wrapper .error-content p {
margin: 0 auto 45px;
}
}
@media (max-width: 1199px) {
.error-page-wrapper .error-content p {
margin: 0 auto 40px;
}
}
@media (max-width: 991px) {
.error-page-wrapper .error-content p {
margin: 0 auto 30px;
}
}
@media (max-width: 767px) {
.error-page-wrapper .error-content p {
font-size: 16px;
margin: 0 auto 25px;
}
}
@media (max-width: 576px) {
.error-page-wrapper .error-content p {
font-size: 15px;
line-height: 28px;
}
}
.error-page-wrapper .error-content .primary-btn1 span {
text-align: left;
} .product-page .product-card-wrap {
border: 0.5px solid rgba(var(--black-color-opc), 0.05);
}
.product-page .product-card {
padding: 45px;
border: 0.5px solid rgba(var(--black-color-opc), 0.05);
}
@media (max-width: 1399px) {
.product-page .product-card {
padding: 25px;
}
}
@media (max-width: 1199px) {
.product-page .product-card {
padding: 20px;
}
}
@media (max-width: 576px) {
.product-page .product-card {
padding: 25px 15px;
}
}
@media (max-width: 1199px) {
.product-page .product-card .product-img {
margin-bottom: 25px;
}
}
@media (max-width: 576px) {
.product-page .product-card .product-img {
margin-bottom: 20px;
}
}
@media (max-width: 1199px) {
.product-page .product-card .product-content {
padding-left: 10px;
}
}
@media (max-width: 1199px) {
.product-page .product-card .product-content h4 {
margin-bottom: 15px;
}
}
@media (max-width: 576px) {
.product-page .product-card .product-content h4 {
margin-bottom: 10px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.product-page .product-card .product-content h4 a {
font-size: 21px;
}
}
@media (max-width: 1199px) {
.product-page .product-card .product-content p {
font-size: 15px;
}
} .project-horizontal-page .project-slider-area {
padding: 20px 25px;
border-top: 1px solid rgba(var(--black-color-opc), 0.2);
border-bottom: 1px solid rgba(var(--black-color-opc), 0.2);
}
@media (max-width: 1699px) {
.project-horizontal-page .project-slider-area {
padding: 20px 15px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.project-horizontal-page .project-slider-area {
padding: 20px 10px;
}
}
@media (max-width: 1399px) {
.project-horizontal-page .project-slider-area {
padding: 20px 10px;
}
}
@media (max-width: 576px) {
.project-horizontal-page .project-slider-area {
padding: 20px 0;
}
}
.project-horizontal-page .project-slider-area .project-card-wrap {
padding: 0 20px;
border-left: 1px solid rgba(var(--black-color-opc), 0.2);
}
@media (max-width: 1699px) {
.project-horizontal-page .project-slider-area .project-card-wrap {
padding: 0 15px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.project-horizontal-page .project-slider-area .project-card-wrap {
padding: 0 10px;
}
}
@media (max-width: 1399px) {
.project-horizontal-page .project-slider-area .project-card-wrap {
padding: 0 10px;
}
}
@media (max-width: 767px) {
.project-horizontal-page .project-slider-area .project-card-wrap {
border-left: unset;
}
}
@media (max-width: 1699px) {
.project-horizontal-page .project-slider-area .project-card-wrap .project-card .project-content-wrap {
padding: 30px 15px;
}
}
@media (max-width: 1699px) {
.project-horizontal-page .project-slider-area .project-card-wrap .project-card .project-content-wrap .project-content h3 a {
font-size: 25px;
}
}
@media (max-width: 991px) {
.project-horizontal-page .project-slider-area .project-card-wrap .project-card .project-content-wrap .project-content h3 a {
font-size: 24px;
}
}
.project-horizontal-page .project-slider-area .home1-project-slider .swiper-slide:first-child .project-card-wrap {
border-left: unset;
}
.project-horizontal-page .project-slider-area .home1-project-slider .swiper-slide.swiper-slide-active .project-card-wrap {
border-left: unset;
}
.project-horizontal-page .slider-btn-grp {
flex-wrap: wrap;
justify-content: space-between;
}
.project-horizontal-page .slider-btn-grp .pagination {
position: relative;
display: inline-flex;
align-items: center;
width: unset;
z-index: 9;
bottom: unset;
gap: 8px;
}
@media (max-width: 576px) {
.project-horizontal-page .slider-btn-grp .pagination {
justify-content: center;
gap: 6px;
}
}
.project-horizontal-page .slider-btn-grp .pagination .swiper-pagination-bullet {
height: 12px;
width: 12px;
background-color: transparent;
border: 1px solid rgba(63, 68, 75, 0.6);
opacity: 1;
position: relative;
}
.project-horizontal-page .slider-btn-grp .pagination .swiper-pagination-bullet::after {
content: "";
height: 6px;
width: 6px;
border-radius: 50%;
background-color: rgba(var(--black-color-opc), 0.4);
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.project-horizontal-page .slider-btn-grp .pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
border-color: var(--black-color);
height: 16px;
width: 16px;
}
.project-horizontal-page .slider-btn-grp .pagination .swiper-pagination-bullet.swiper-pagination-bullet-active::after {
width: 8px;
height: 8px;
background-color: var(--black-color);
} .project-info-flow-page {
padding: 0px 8% 0;
}
@media (max-width: 1699px) {
.project-info-flow-page {
padding: 120px 6% 0;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.project-info-flow-page {
padding: 120px 4% 0;
}
}
@media (max-width: 1399px) {
.project-info-flow-page {
padding: 120px 2% 0;
}
}
@media (max-width: 1199px) {
.project-info-flow-page {
padding: 90px 20px 0;
}
}
@media (max-width: 991px) {
.project-info-flow-page {
padding: 80px 20px 0;
}
}
@media (max-width: 767px) {
.project-info-flow-page {
padding: 80px 10px 0;
}
}
@media (max-width: 576px) {
.project-info-flow-page {
padding: 0;
}
}
.project-info-flow-page .project-info-flow-card {
position: relative;
}
.project-info-flow-page .project-info-flow-card .info-flow-img {
position: relative;
display: block;
}
.project-info-flow-page .project-info-flow-card .info-flow-img::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(var(--black-color-opc), 0.2);
}
.project-info-flow-page .project-info-flow-card .info-flow-content {
position: absolute;
top: 0;
left: 0;
opacity: 0;
z-index: 1;
transition: opacity 0.3s, transform 0.7s cubic-bezier(0.23, 1, 0.32, 1);
}
.project-info-flow-page .project-info-flow-card .info-flow-content h6 {
margin-bottom: 0;
line-height: 1;
}
.project-info-flow-page .project-info-flow-card .info-flow-content h6 a {
color: var(--white-color);
font-family: var(--font-manrope);
font-size: 20px;
font-weight: 600;
line-height: 24px;
letter-spacing: 0.02em;
background-color: var(--black-color);
display: inline-block;
padding: 7px 20px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.project-info-flow-page .project-info-flow-card .info-flow-content h6 a {
padding: 7px 15px;
font-size: 19px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.project-info-flow-page .project-info-flow-card .info-flow-content h6 a {
padding: 7px 12px;
font-size: 18px;
}
}
@media (max-width: 1199px) {
.project-info-flow-page .project-info-flow-card .info-flow-content h6 a {
padding: 7px 15px;
font-size: 18px;
}
}
@media (max-width: 767px) {
.project-info-flow-page .project-info-flow-card .info-flow-content h6 a {
font-size: 16px;
}
}
.project-info-flow-page .project-info-flow-card .info-flow-content > a {
color: var(--white-color);
font-family: var(--font-dmsans);
font-size: 12px;
font-weight: 500;
line-height: 1;
letter-spacing: 0.02em;
text-transform: uppercase;
display: inline-block;
padding: 10px 20px;
background-color: var(--primary-color1);
}
.project-info-flow-page .project-info-flow-card:hover .info-flow-content {
opacity: 1;
} .project-text-down-page {
padding-left: 13%;
padding-right: 13%;
}
@media (max-width: 1799px) {
.project-text-down-page {
padding-left: 10%;
padding-right: 10%;
}
}
@media (max-width: 1699px) {
.project-text-down-page {
padding-left: 7%;
padding-right: 7%;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.project-text-down-page {
padding-left: 3%;
padding-right: 3%;
}
}
@media (max-width: 1399px) {
.project-text-down-page {
padding-left: 2%;
padding-right: 2%;
}
}
@media (max-width: 1199px) {
.project-text-down-page {
padding-left: 10px;
padding-right: 10px;
}
}
@media (max-width: 576px) {
.project-text-down-page {
padding-left: 0;
padding-right: 0;
}
} .project-details-page .details-content-wrapper img {
border-radius: 10px;
}
.project-details-page .details-content-wrapper ul.wp-block-list.egns {
padding: 0;
margin: 0;
list-style: none;
-moz-columns: 2;
columns: 2;
}
.project-details-page .project-details-sidebar {
position: sticky;
top: 110px;
}
.project-details-page .project-details-sidebar .project-info-wrap {
border: 1px solid rgba(var(--black-color-opc), 0.1);
background: #faf9f9;
padding: 35px 30px;
border-radius: 10px;
position: relative;
z-index: 1;
}
@media (max-width: 1399px) {
.project-details-page .project-details-sidebar .project-info-wrap {
padding: 35px 25px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.project-details-page .project-details-sidebar .project-info-wrap {
padding: 30px 20px;
}
}
.project-details-page .project-details-sidebar .project-info-wrap .project-info {
margin: 0;
padding: 0;
list-style: none;
}
.project-details-page .project-details-sidebar .project-info-wrap .project-info li {
display: flex;
align-items: center;
gap: 16px;
border-bottom: 1px solid rgba(var(--black-color-opc), 0.1);
padding-bottom: 25px;
margin-bottom: 30px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.project-details-page .project-details-sidebar .project-info-wrap .project-info li {
padding-bottom: 20px;
margin-bottom: 25px;
}
}
.project-details-page .project-details-sidebar .project-info-wrap .project-info li:last-child {
border-bottom: none;
padding-bottom: 0;
margin-bottom: 0;
}
.project-details-page .project-details-sidebar .project-info-wrap .project-info li .icon svg {
fill: rgba(var(--black-color-opc), 0.3);
}
.project-details-page .project-details-sidebar .project-info-wrap .project-info li .content {
line-height: 1;
}
.project-details-page .project-details-sidebar .project-info-wrap .project-info li .content span {
color: rgba(var(--title-color-opc), 0.5);
font-family: var(--font-dmsans);
font-size: 15px;
font-weight: 400;
line-height: 1;
display: inline-block;
margin-bottom: 10px;
}
.project-details-page .project-details-sidebar .project-info-wrap .project-info li .content h5 {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 20px;
font-weight: 500;
line-height: 1.2;
margin-bottom: 0;
}
@media (max-width: 1199px) {
.project-details-page .project-details-sidebar .project-info-wrap .project-info li .content h5 {
font-size: 18px;
}
}
.project-details-page .project-details-sidebar .project-info-wrap::before {
content: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/innerpages/project-dt-project-info-vector.svg);
position: absolute;
top: 0;
right: 0;
z-index: -1;
}
.project-details-page .project-details-sidebar .sidebar-banner {
position: relative;
}
.project-details-page .project-details-sidebar .sidebar-banner img {
border-radius: 10px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.project-details-page .project-details-sidebar .sidebar-banner img {
min-height: 420px;
-o-object-fit: cover;
object-fit: cover;
}
}
.project-details-page .project-details-sidebar .sidebar-banner .banner-content-wrap {
background: linear-gradient(189.54deg, rgba(0, 0, 0, 0.1) 6.82%, rgba(0, 0, 0, 0.9) 78.76%, rgba(0, 0, 0, 0.9) 91.39%);
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
align-items: end;
padding: 35px;
border-radius: 10px;
}
@media (max-width: 1399px) {
.project-details-page .project-details-sidebar .sidebar-banner .banner-content-wrap {
padding: 35px 25px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.project-details-page .project-details-sidebar .sidebar-banner .banner-content-wrap {
padding: 35px 20px;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.project-details-page .project-details-sidebar .sidebar-banner .banner-content-wrap {
padding: 50px 40px;
}
}
@media (max-width: 576px) {
.project-details-page .project-details-sidebar .sidebar-banner .banner-content-wrap {
padding: 30px 20px;
}
}
.project-details-page .project-details-sidebar .sidebar-banner .banner-content-wrap h2 {
color: var(--white-color);
font-family: var(--font-manrope);
font-size: 42px;
font-weight: 600;
line-height: 1.2;
letter-spacing: 0.01em;
margin-bottom: 25px;
}
@media (max-width: 1199px) {
.project-details-page .project-details-sidebar .sidebar-banner .banner-content-wrap h2 {
font-size: 35px;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.project-details-page .project-details-sidebar .sidebar-banner .banner-content-wrap h2 {
font-size: 50px;
max-width: 400px;
}
}
@media (min-width: 576px) and (max-width: 768px) {
.project-details-page .project-details-sidebar .sidebar-banner .banner-content-wrap h2 {
font-size: 45px;
max-width: 400px;
}
}
.project-details-page .project-details-sidebar .sidebar-banner .banner-content-wrap h2 span {
color: var(--primary-color2);
font-weight: 700;
}
.project-details-page .project-details-sidebar .sidebar-banner .banner-content-wrap .primary-btn2 {
padding: 17px 27px;
}
.project-details-page .project-details-sidebar .sidebar-banner .banner-content-wrap .primary-btn2 span {
font-size: 16px;
}
@media (max-width: 576px) {
.project-details-page .project-details-sidebar .sidebar-banner .banner-content-wrap .primary-btn2 {
font-size: 17px;
padding: 15px 28px;
}
}
.project-details-page .details-navigation {
padding: 25px 0;
border-top: 1px solid rgba(var(--black-color-opc), 0.1);
border-bottom: 1px solid rgba(var(--black-color-opc), 0.1);
display: flex;
align-items: center;
justify-content: space-between;
}
@media (max-width: 767px) {
.project-details-page .details-navigation {
gap: 20px;
flex-wrap: wrap;
}
}
.project-details-page .details-navigation .single-navigation .nav-btn {
color: var(--primary-color1);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
line-height: 1;
letter-spacing: 0.05em;
text-transform: uppercase;
text-decoration: underline;
display: flex;
align-items: end;
gap: 30px;
transition: 0.5s;
}
@media (max-width: 991px) {
.project-details-page .details-navigation .single-navigation .nav-btn {
gap: 20px;
}
}
@media (max-width: 576px) {
.project-details-page .details-navigation .single-navigation .nav-btn {
gap: 15px;
}
}
.project-details-page .details-navigation .single-navigation .nav-btn svg {
fill: rgba(var(--primary-color1-opc), 0.15);
margin-bottom: 7px;
transition: 0.5s;
}
@media (max-width: 576px) {
.project-details-page .details-navigation .single-navigation .nav-btn svg {
margin-bottom: 5px;
}
}
.project-details-page .details-navigation .single-navigation .nav-btn:hover {
color: var(--black-color);
}
.project-details-page .details-navigation .single-navigation .nav-btn:hover svg {
fill: rgba(var(--black-color-opc), 0.15);
}
.project-details-page .details-navigation .single-navigation .navigation-content-wrap {
margin: 30px 0 0 50px;
display: flex;
align-items: center;
gap: 12px;
}
@media (max-width: 991px) {
.project-details-page .details-navigation .single-navigation .navigation-content-wrap {
margin: 25px 0 0 40px;
}
}
@media (max-width: 576px) {
.project-details-page .details-navigation .single-navigation .navigation-content-wrap {
margin: 20px 0 0 30px;
gap: 8px;
}
}
.project-details-page .details-navigation .single-navigation .navigation-content-wrap .navigation-img img {
min-width: 60px;
max-width: 60px;
height: 60px;
border-radius: 50%;
}
.project-details-page .details-navigation .single-navigation .navigation-content-wrap h6 {
margin-bottom: 0;
max-width: 312px;
width: 100%;
}
@media (max-width: 767px) {
.project-details-page .details-navigation .single-navigation .navigation-content-wrap h6 {
max-width: unset;
}
}
.project-details-page .details-navigation .single-navigation .navigation-content-wrap h6 a {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 500;
font-size: 16px;
line-height: 24px;
transition: 0.5s;
}
@media (max-width: 576px) {
.project-details-page .details-navigation .single-navigation .navigation-content-wrap h6 a {
font-size: 14px;
}
}
.project-details-page .details-navigation .single-navigation .navigation-content-wrap h6 a:hover {
color: var(--primary-color1);
}
.project-details-page .details-navigation .single-navigation.two {
text-align: right;
}
.project-details-page .details-navigation .single-navigation.two .nav-btn {
justify-content: end;
}
.project-details-page .details-navigation .single-navigation.two .navigation-content-wrap {
margin: 30px 50px 0 0;
}
@media (max-width: 991px) {
.project-details-page .details-navigation .single-navigation.two .navigation-content-wrap {
margin: 25px 40px 0 0;
}
}
@media (max-width: 576px) {
.project-details-page .details-navigation .single-navigation.two .navigation-content-wrap {
margin: 20px 30px 0 0;
}
}
.project-details-page .details-navigation .single-navigation.two .navigation-content-wrap h6 a {
text-align: left;
} .our-client-page {
padding-left: 110px;
padding-right: 110px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.our-client-page {
padding-left: 70px;
padding-right: 70px;
}
}
@media (max-width: 1399px) {
.our-client-page {
padding-left: 30px;
padding-right: 30px;
}
}
@media (max-width: 1199px) {
.our-client-page {
padding-left: 10px;
padding-right: 10px;
}
}
.our-client-page .our-client-img-area {
position: relative;
}
.our-client-page .our-client-img-area::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(var(--black-color-opc), 0.2);
border-radius: 10px;
}
.our-client-page .our-client-img-area img {
border-radius: 10px;
}
.our-client-page .client-card {
padding: 25px 30px;
background-color: #ebf1fb;
border-radius: 10px;
position: relative;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.our-client-page .client-card {
padding: 25px 20px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.our-client-page .client-card {
padding: 25px 15px;
}
}
@media (max-width: 1199px) {
.our-client-page .client-card {
padding: 25px 20px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.our-client-page .client-card img {
width: 110px;
}
}
.our-client-page .client-card span {
color: rgba(var(--title-color-opc), 0.5);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 16px;
line-height: 1;
display: block;
padding-top: 30px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.our-client-page .client-card span {
padding-top: 20px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.our-client-page .client-card span {
padding-top: 20px;
}
}
.our-client-page .client-card svg {
fill: var(--white-color);
position: absolute;
top: 5px;
right: 5px;
transition: 0.5s;
}
.our-client-page .client-card:hover svg {
fill: rgba(var(--primary-color1-opc), 0.3);
} .our-process-page .process-wrapper .single-process {
position: sticky;
top: 110px;
}
@media (max-width: 991px) {
.our-process-page .process-wrapper .single-process {
position: relative;
top: unset;
}
}
.our-process-page .process-wrapper .single-process .process-img {
height: 100%;
}
@media (max-width: 576px) {
.our-process-page .process-wrapper .single-process .process-img {
height: unset;
}
}
.our-process-page .process-wrapper .single-process .process-img img {
border-radius: 20px 0 0 20px;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
@media (max-width: 991px) {
.our-process-page .process-wrapper .single-process .process-img img {
border-radius: 20px 20px 0 0;
max-height: 500px;
width: 100%;
}
}
@media (max-width: 767px) {
.our-process-page .process-wrapper .single-process .process-img img {
max-height: 400px;
}
}
@media (max-width: 576px) {
.our-process-page .process-wrapper .single-process .process-img img {
height: unset;
border-radius: 10px 10px 0 0;
}
}
.our-process-page .process-wrapper .single-process .process-content {
padding: 50px 60px 60px;
background-color: #fff3f1;
border-radius: 0 20px 20px 0;
position: relative;
}
@media (max-width: 1399px) {
.our-process-page .process-wrapper .single-process .process-content {
padding: 50px 40px 60px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.our-process-page .process-wrapper .single-process .process-content {
padding: 40px 20px 50px;
}
}
@media (max-width: 991px) {
.our-process-page .process-wrapper .single-process .process-content {
border-radius: 0 0 20px 20px;
padding: 30px 40px 40px;
}
}
@media (max-width: 767px) {
.our-process-page .process-wrapper .single-process .process-content {
padding: 30px 25px 40px;
}
}
@media (max-width: 576px) {
.our-process-page .process-wrapper .single-process .process-content {
padding: 20px 15px 30px;
border-radius: 0 0 10px 10px;
}
}
.our-process-page .process-wrapper .single-process .process-content .icon {
margin-bottom: 30px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.our-process-page .process-wrapper .single-process .process-content .icon {
margin-bottom: 20px;
}
}
@media (max-width: 991px) {
.our-process-page .process-wrapper .single-process .process-content .icon {
margin-bottom: 25px;
}
}
@media (max-width: 576px) {
.our-process-page .process-wrapper .single-process .process-content .icon {
margin-bottom: 20px;
}
}
.our-process-page .process-wrapper .single-process .process-content .icon svg {
fill: rgba(var(--black-color-opc), 0.5);
}
@media (max-width: 576px) {
.our-process-page .process-wrapper .single-process .process-content .icon svg {
width: 50px;
}
}
.our-process-page .process-wrapper .single-process .process-content span {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 25px;
line-height: 1;
letter-spacing: 0.03em;
display: block;
margin-bottom: 35px;
}
@media (max-width: 1199px) {
.our-process-page .process-wrapper .single-process .process-content span {
font-size: 22px;
margin-bottom: 25px;
}
}
@media (max-width: 767px) {
.our-process-page .process-wrapper .single-process .process-content span {
margin-bottom: 30px;
}
}
@media (max-width: 576px) {
.our-process-page .process-wrapper .single-process .process-content span {
font-size: 20px;
margin-bottom: 25px;
}
}
.our-process-page .process-wrapper .single-process .process-content .arrow {
fill: rgba(var(--primary-color1-opc), 0.4);
margin-left: 40px;
margin-bottom: 35px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.our-process-page .process-wrapper .single-process .process-content .arrow {
margin-left: 30px;
margin-bottom: 25px;
}
}
@media (max-width: 991px) {
.our-process-page .process-wrapper .single-process .process-content .arrow {
height: 160px;
margin-left: 30px;
margin-bottom: 25px;
}
}
@media (max-width: 767px) {
.our-process-page .process-wrapper .single-process .process-content .arrow {
display: none;
}
}
.our-process-page .process-wrapper .single-process .process-content h2 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 35px;
line-height: 1.3;
letter-spacing: 0.03em;
margin-bottom: 20px;
}
@media (max-width: 1399px) {
.our-process-page .process-wrapper .single-process .process-content h2 {
font-size: 32px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.our-process-page .process-wrapper .single-process .process-content h2 {
font-size: 28px;
margin-bottom: 15px;
}
}
@media (max-width: 991px) {
.our-process-page .process-wrapper .single-process .process-content h2 {
margin-bottom: 15px;
}
}
@media (max-width: 767px) {
.our-process-page .process-wrapper .single-process .process-content h2 {
font-size: 30px;
}
}
@media (max-width: 576px) {
.our-process-page .process-wrapper .single-process .process-content h2 {
font-size: 25px;
margin-bottom: 10px;
}
}
.our-process-page .process-wrapper .single-process .process-content p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 16px;
line-height: 30px;
margin-bottom: 0;
}
@media (max-width: 576px) {
.our-process-page .process-wrapper .single-process .process-content p {
font-size: 14px;
line-height: 28px;
}
}
.our-process-page .process-wrapper .single-process .process-content .vector {
position: absolute;
top: 0;
right: 0;
}
@media (max-width: 767px) {
.our-process-page .process-wrapper .single-process .process-content .vector {
width: 100px;
}
}
@media (max-width: 576px) {
.our-process-page .process-wrapper .single-process .process-content .vector {
width: 80px;
}
} .career-page .section-title p {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 500;
font-size: 38px;
line-height: 1.6;
margin-bottom: 0;
padding-top: 35px;
}
@media (max-width: 1199px) {
.career-page .section-title p {
font-size: 35px;
padding-top: 30px;
}
}
@media (max-width: 991px) {
.career-page .section-title p {
font-size: 29px;
padding-top: 25px;
}
}
@media (max-width: 576px) {
.career-page .section-title p {
font-size: 22px;
padding-top: 15px;
}
}
.career-page .section-title p span {
color: rgba(var(--title-color-opc), 0.5);
}
.career-page .career-img-grp-wrapper {
padding: 0 12%;
position: relative;
}
@media (max-width: 1799px) {
.career-page .career-img-grp-wrapper {
padding: 0 10%;
}
}
@media (max-width: 1699px) {
.career-page .career-img-grp-wrapper {
padding: 0 7%;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.career-page .career-img-grp-wrapper {
padding: 0 3%;
}
}
@media (max-width: 1399px) {
.career-page .career-img-grp-wrapper {
padding: 0 2%;
}
}
@media (max-width: 991px) {
.career-page .career-img-grp-wrapper {
padding: 0 10px;
}
}
@media (max-width: 576px) {
.career-page .career-img-grp-wrapper {
padding: 0;
}
}
.career-page .career-img-grp-wrapper .pr {
padding-right: 40px;
}
@media (max-width: 1399px) {
.career-page .career-img-grp-wrapper .pr {
padding-right: 30px;
}
}
@media (max-width: 1199px) {
.career-page .career-img-grp-wrapper .pr {
padding-right: 20px;
}
}
@media (max-width: 991px) {
.career-page .career-img-grp-wrapper .pr {
padding-right: 10px;
}
}
@media (max-width: 767px) {
.career-page .career-img-grp-wrapper .pr {
padding-right: 0;
}
}
.career-page .career-img-grp-wrapper .pl {
padding-left: 40px;
}
@media (max-width: 1399px) {
.career-page .career-img-grp-wrapper .pl {
padding-left: 30px;
}
}
@media (max-width: 1199px) {
.career-page .career-img-grp-wrapper .pl {
padding-left: 20px;
}
}
@media (max-width: 991px) {
.career-page .career-img-grp-wrapper .pl {
padding-left: 10px;
}
}
@media (max-width: 767px) {
.career-page .career-img-grp-wrapper .pl {
padding-left: 0;
}
}
.career-page .career-img-grp-wrapper .single-img img {
min-height: 300px;
-o-object-fit: cover;
object-fit: cover;
}
.career-page .career-img-grp-wrapper .career-center-img-wrap {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 530px;
height: 530px;
border-radius: 50%;
border: 10px solid var(--white-color);
display: flex;
align-items: center;
justify-content: center;
}
@media (max-width: 1399px) {
.career-page .career-img-grp-wrapper .career-center-img-wrap {
width: 500px;
height: 500px;
}
}
@media (max-width: 1199px) {
.career-page .career-img-grp-wrapper .career-center-img-wrap {
width: 440px;
height: 440px;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.career-page .career-img-grp-wrapper .career-center-img-wrap {
width: 360px;
height: 360px;
}
}
@media (max-width: 767px) {
.career-page .career-img-grp-wrapper .career-center-img-wrap {
position: relative;
top: unset;
left: unset;
transform: unset;
border: unset;
}
}
@media (max-width: 576px) {
.career-page .career-img-grp-wrapper .career-center-img-wrap {
width: 300px;
height: 300px;
}
}
.career-page .career-img-grp-wrapper .career-center-img-wrap .career-center-img {
position: relative;
}
.career-page .career-img-grp-wrapper .career-center-img-wrap .career-center-img img {
width: 520px;
height: 520px;
border-radius: 50%;
}
@media (max-width: 1399px) {
.career-page .career-img-grp-wrapper .career-center-img-wrap .career-center-img img {
width: 480px;
height: 480px;
}
}
@media (max-width: 1199px) {
.career-page .career-img-grp-wrapper .career-center-img-wrap .career-center-img img {
width: 420px;
height: 420px;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.career-page .career-img-grp-wrapper .career-center-img-wrap .career-center-img img {
width: 340px;
height: 340px;
}
}
@media (max-width: 576px) {
.career-page .career-img-grp-wrapper .career-center-img-wrap .career-center-img img {
width: 100%;
height: 100%;
}
}
.career-page .career-img-grp-wrapper .career-center-img-wrap .career-center-img .overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(var(--black-color-opc), 0.3);
border-radius: 50%;
display: flex;
justify-content: center;
}
.career-page .career-img-grp-wrapper .career-center-img-wrap .career-center-img .overlay svg {
fill: rgba(255, 255, 255, 0.5);
margin-top: 30px;
}
@media (min-width: 768px) and (max-width: 991px) {
.career-page .career-img-grp-wrapper .career-center-img-wrap .career-center-img .overlay svg {
margin-top: 10px;
width: 100px;
}
}
@media (max-width: 576px) {
.career-page .career-img-grp-wrapper .career-center-img-wrap .career-center-img .overlay svg {
width: 80px;
margin-top: 0;
}
}
.job-post-section {
background-color: #000;
padding: 100px 0 120px;
}
@media (max-width: 1199px) {
.job-post-section {
padding: 90px 0 110px;
}
}
@media (max-width: 767px) {
.job-post-section {
padding: 70px 0 90px;
}
}
.job-post-section .job-post-list {
padding: 0;
margin: 0;
list-style: none;
}
.job-post-section .job-post-list .single-job {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 20px;
position: relative;
z-index: 1;
padding: 24px 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.job-post-section .job-post-list .single-job:first-child {
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.job-post-section .job-post-list .single-job:last-child {
border-bottom: unset;
padding-bottom: 0;
}
@media (max-width: 991px) {
.job-post-section .job-post-list .single-job {
gap: 25px;
}
}
@media (max-width: 767px) {
.job-post-section .job-post-list .single-job {
flex-direction: column;
align-items: start;
}
}
@media (max-width: 576px) {
.job-post-section .job-post-list .single-job {
gap: 20px;
}
}
.job-post-section .job-post-list .single-job .number-and-icon-area {
display: flex;
gap: 20px;
}
.job-post-section .job-post-list .single-job .number-and-icon-area span {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 500;
font-size: 18px;
line-height: 1;
margin-top: 10px;
display: block;
}
.job-post-section .job-post-list .single-job .number-and-icon-area .icon {
min-width: 78px;
max-width: 78px;
height: 78px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background-color: rgba(255, 255, 255, 0.05);
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
}
.job-post-section .job-post-list .single-job .number-and-icon-area .icon svg {
fill: var(--white-color);
}
.job-post-section .job-post-list .single-job h2 {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 35px;
line-height: 32px;
margin-bottom: 0;
min-width: 352px;
}
@media (max-width: 1399px) {
.job-post-section .job-post-list .single-job h2 {
font-size: 32px;
}
}
@media (max-width: 1199px) {
.job-post-section .job-post-list .single-job h2 {
font-size: 30px;
min-width: 310px;
}
}
@media (max-width: 767px) {
.job-post-section .job-post-list .single-job h2 {
font-size: 28px;
min-width: unset;
}
}
@media (max-width: 576px) {
.job-post-section .job-post-list .single-job h2 {
font-size: 24px;
}
}
.job-post-section .job-post-list .single-job span {
color: rgba(255, 255, 255, 0.5);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 18px;
line-height: 1;
}
@media (max-width: 767px) {
.job-post-section .job-post-list .single-job span {
font-size: 16px;
}
}
@media (max-width: 576px) {
.job-post-section .job-post-list .single-job span {
font-size: 15px;
}
}
.job-post-section .job-post-list .single-job .details-btn {
display: flex;
align-items: center;
gap: 5px;
white-space: nowrap;
}
.job-post-section .job-post-list .single-job .details-btn span {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 13px;
line-height: 1;
text-transform: uppercase;
text-decoration: underline;
display: inline-block;
padding: 14px 28px;
border-radius: 28px;
border: 1px solid rgba(255, 255, 255, 0.2);
transition: 0.5s;
}
.job-post-section .job-post-list .single-job .details-btn .icon {
min-width: 43px;
max-width: 43px;
height: 43px;
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
transition: 0.5s;
}
.job-post-section .job-post-list .single-job .details-btn .icon svg {
fill: rgba(255, 255, 255, 0.15);
transition: 0.5s;
}
.job-post-section .job-post-list .single-job:hover .number-and-icon-area .icon svg {
animation: bounceIn 1.2s linear;
}
.job-post-section .job-post-list .single-job:hover .details-btn span {
background-color: var(--primary-color2);
}
.job-post-section .job-post-list .single-job:hover .details-btn .icon {
background-color: var(--primary-color2);
}
.job-post-section .job-post-list .single-job:hover .details-btn .icon svg {
fill: var(--white-color);
} .contact-page-address-section h6 {
margin-bottom: 60px;
}
@media (max-width: 1199px) {
.contact-page-address-section h6 {
margin-bottom: 50px;
}
}
@media (max-width: 767px) {
.contact-page-address-section h6 {
margin-bottom: 40px;
}
}
.contact-page-address-section h6 a {
color: var(--primary-color1);
font-family: var(--font-manrope);
font-weight: 500;
font-size: 17px;
line-height: 1;
text-transform: uppercase;
position: relative;
background: linear-gradient(to bottom, var(--primary-color1) 0%, var(--primary-color1) 98%);
background-repeat: no-repeat;
background-size: 100% 1px;
background-position: left 100%;
transition: background-size 0.75s;
}
.contact-page-address-section h6 a:hover {
background-size: 0 1px;
background-position: 0% 100%;
}
.contact-page-address-section .address-list {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 20px;
}
@media (max-width: 991px) {
.contact-page-address-section .address-list {
gap: 35px;
}
}
.contact-page-address-section .address-list .single-address {
max-width: 195px;
width: 100%;
padding-bottom: 40px;
position: relative;
}
.contact-page-address-section .address-list .single-address:last-child {
margin-bottom: 0;
}
@media (max-width: 1199px) {
.contact-page-address-section .address-list .single-address {
padding-bottom: 30px;
}
}
@media (max-width: 991px) {
.contact-page-address-section .address-list .single-address {
margin-bottom: 0;
padding-bottom: 0;
}
}
.contact-page-address-section .address-list .single-address::before {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 53px;
height: 1px;
background-color: var(--primary-color1);
}
@media (max-width: 991px) {
.contact-page-address-section .address-list .single-address::before {
display: none;
}
}
.contact-page-address-section .address-list .single-address span {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 14px;
font-weight: 400;
line-height: 1;
letter-spacing: 0.06em;
text-decoration: underline;
display: block;
margin-bottom: 20px;
}
@media (max-width: 767px) {
.contact-page-address-section .address-list .single-address span {
margin-bottom: 15px;
}
}
.contact-page-address-section .address-list .single-address a {
color: rgba(var(--title-color-opc), 0.6);
font-family: var(--font-dmsans);
font-size: 17px;
font-weight: 400;
line-height: 28px;
margin-bottom: 0;
transition: 0.5s;
}
.contact-page-address-section .address-list .single-address a:hover {
color: var(--primary-color1);
}
.contact-map-section iframe {
width: 100%;
height: 100%;
min-height: 600px;
filter: invert(1) hue-rotate(180deg) brightness(0.7) grayscale(1);
border-radius: 30px;
}
@media (max-width: 1399px) {
.contact-map-section iframe {
min-height: 550px;
}
}
@media (max-width: 991px) {
.contact-map-section iframe {
min-height: 500px;
border-radius: 20px;
}
}
@media (max-width: 576px) {
.contact-map-section iframe {
min-height: 450px;
border-radius: 10px;
}
} .service-page-product-section {
background-color: #f1f6f6;
padding: 110px 0;
}
@media (max-width: 1199px) {
.service-page-product-section {
padding: 100px 0;
}
}
@media (max-width: 991px) {
.service-page-product-section {
padding: 90px 0;
}
}
@media (max-width: 767px) {
.service-page-product-section {
padding: 70px 0;
}
} .service-details-page-wrap .service-details-content h2 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 50px;
line-height: 1.2;
margin-bottom: 30px;
}
@media (max-width: 1399px) {
.service-details-page-wrap .service-details-content h2 {
font-size: 48px;
margin-bottom: 25px;
}
}
@media (max-width: 1199px) {
.service-details-page-wrap .service-details-content h2 {
font-size: 45px;
}
}
@media (max-width: 991px) {
.service-details-page-wrap .service-details-content h2 {
font-size: 42px;
margin-bottom: 20px;
}
}
@media (max-width: 767px) {
.service-details-page-wrap .service-details-content h2 {
font-size: 38px;
}
}
@media (max-width: 576px) {
.service-details-page-wrap .service-details-content h2 {
font-size: 32px;
margin-bottom: 15px;
}
}
.service-details-page-wrap .service-details-content p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 17px;
line-height: 38px;
margin-bottom: 0;
}
.service-details-page-wrap .service-details-content p:last-child {
padding-top: 25px;
}
@media (max-width: 1199px) {
.service-details-page-wrap .service-details-content p:last-child {
padding-top: 20px;
}
}
@media (max-width: 991px) {
.service-details-page-wrap .service-details-content p:last-child {
padding-top: 15px;
}
}
@media (max-width: 576px) {
.service-details-page-wrap .service-details-content p:last-child {
padding-top: 10px;
}
}
@media (max-width: 1399px) {
.service-details-page-wrap .service-details-content p {
font-size: 16px;
line-height: 34px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.service-details-page-wrap .service-details-content p {
font-size: 15px;
line-height: 32px;
}
}
@media (max-width: 576px) {
.service-details-page-wrap .service-details-content p {
font-size: 15px;
line-height: 32px;
}
}
.service-details-page-wrap .service-details-content .title-area {
max-width: 920px;
width: 100%;
margin-bottom: 30px;
}
@media (max-width: 767px) {
.service-details-page-wrap .service-details-content .title-area {
margin-bottom: 25px;
}
}
@media (max-width: 576px) {
.service-details-page-wrap .service-details-content .title-area {
margin-bottom: 20px;
}
}
.service-details-page-wrap .service-details-content .title-area p {
padding-top: 0;
}
.service-details-page-wrap .service-details-content ul {
padding: 0;
margin: 0;
list-style: none;
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 10px;
justify-content: space-between;
row-gap: 25px;
}
@media (max-width: 1199px) {
.service-details-page-wrap .service-details-content ul {
row-gap: 20px;
}
}
@media (max-width: 991px) {
.service-details-page-wrap .service-details-content ul {
grid-template-columns: repeat(3, 1fr);
}
}
@media (max-width: 767px) {
.service-details-page-wrap .service-details-content ul {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 576px) {
.service-details-page-wrap .service-details-content ul {
grid-template-columns: 1fr;
}
}
.service-details-page-wrap .service-details-content ul li {
color: rgba(var(--title-color-opc), 0.7);
font-family: var(--font-manrope);
font-weight: 500;
font-size: 17px;
line-height: 1.5;
display: flex;
align-items: center;
gap: 10px;
}
.service-details-page-wrap .service-details-content ul li svg {
fill: var(--primary-color1);
}
@media (max-width: 1199px) {
.service-details-page-wrap .service-details-content ul li {
font-size: 16px;
gap: 8px;
}
}
.service-details-page-wrap .service-details-img {
margin-top: 20px;
}
@media (max-width: 991px) {
.service-details-page-wrap .service-details-img {
margin-top: 0;
}
}
.service-details-page-wrap .service-details-img img {
border-radius: 20px 0 20px 20px;
}
@media (max-width: 991px) {
.service-details-page-wrap .service-details-img img {
width: 100%;
-o-object-fit: cover;
object-fit: cover;
max-height: 600px;
}
}
@media (max-width: 767px) {
.service-details-page-wrap .service-details-img img {
max-height: 500px;
}
}
@media (max-width: 576px) {
.service-details-page-wrap .service-details-img img {
border-radius: 10px 0 10px 10px;
}
}
.service-details-thumb-area .service-details-thumb-img img {
min-height: 550px;
-o-object-fit: cover;
object-fit: cover;
}
@media (max-width: 576px) {
.service-details-thumb-area .service-details-thumb-img img {
min-height: 350px;
}
}
.service-details-thumb-area .service-details-faq-area {
max-width: 560px;
width: 100%;
margin-left: auto;
margin-right: 100px;
padding: 45px;
background-color: var(--black-color);
margin-top: -400px;
position: relative;
}
@media (max-width: 1399px) {
.service-details-thumb-area .service-details-faq-area {
margin-right: 80px;
}
}
@media (max-width: 1199px) {
.service-details-thumb-area .service-details-faq-area {
max-width: 530px;
padding: 45px 35px;
margin-right: 50px;
}
}
@media (max-width: 991px) {
.service-details-thumb-area .service-details-faq-area {
margin-right: 30px;
}
}
@media (max-width: 576px) {
.service-details-thumb-area .service-details-faq-area {
padding: 35px 20px;
margin: 0;
}
}
.service-details-thumb-area .service-details-faq-area .faq-wrap .accordion .accordion-item .accordion-header .accordion-button {
color: var(--white-color);
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.service-details-thumb-area .service-details-faq-area .faq-wrap .accordion .accordion-item .accordion-header .accordion-button::after {
content: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/innerpages/icon/service-faq-accordion-arrow-down.svg);
}
.service-details-thumb-area .service-details-faq-area .faq-wrap .accordion .accordion-item .accordion-header .accordion-button:not(.collapsed)::after {
content: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/innerpages/icon/service-faq-accordion-arrow-up.svg);
}
.service-details-thumb-area .service-details-faq-area .faq-wrap .accordion .accordion-item .accordion-body {
color: rgba(255, 255, 255, 0.6);
} .product-details-top-area .details-content h2 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 50px;
line-height: 1.2;
letter-spacing: 0.03em;
margin-bottom: 50px;
}
@media (max-width: 1399px) {
.product-details-top-area .details-content h2 {
font-size: 45px;
margin-bottom: 45px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.product-details-top-area .details-content h2 {
font-size: 40px;
margin-bottom: 35px;
}
}
@media (max-width: 991px) {
.product-details-top-area .details-content h2 {
font-size: 38px;
margin-bottom: 25px;
}
}
@media (max-width: 767px) {
.product-details-top-area .details-content h2 {
font-size: 35px;
margin-bottom: 20px;
}
}
@media (max-width: 576px) {
.product-details-top-area .details-content h2 {
font-size: 30px;
line-height: 1.4;
margin-bottom: 15px;
}
}
.product-details-top-area .details-content p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 17px;
line-height: 38px;
margin-bottom: 25px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.product-details-top-area .details-content p {
font-size: 16px;
line-height: 34px;
margin-bottom: 20px;
}
}
@media (max-width: 767px) {
.product-details-top-area .details-content p {
font-size: 15px;
line-height: 30px;
margin-bottom: 15px;
}
}
@media (max-width: 576px) {
.product-details-top-area .details-content p {
font-size: 14px;
line-height: 28px;
}
}
.product-details-top-area .details-content p:last-child {
margin-bottom: 0;
}
.product-dt-faq-section .product-dt-faq-img {
height: 100%;
}
.product-dt-faq-section .product-dt-faq-img img {
height: 100%;
-o-object-fit: cover;
object-fit: cover;
min-height: 650px;
}
@media (max-width: 1199px) {
.product-dt-faq-section .product-dt-faq-img img {
min-height: 600px;
}
}
@media (max-width: 991px) {
.product-dt-faq-section .product-dt-faq-img img {
min-height: auto;
max-height: 500px;
width: 100%;
}
}
.product-dt-faq-section .faq-content-area {
padding: 80px 35px 90px 90px;
background-color: #f7f7f7;
height: 100%;
}
@media (max-width: 1399px) {
.product-dt-faq-section .faq-content-area {
padding: 80px 35px 90px 70px;
}
}
@media (max-width: 1199px) {
.product-dt-faq-section .faq-content-area {
padding: 80px 35px 90px 40px;
}
}
@media (max-width: 991px) {
.product-dt-faq-section .faq-content-area {
padding: 50px 30px 160px 30px;
}
}
@media (max-width: 767px) {
.product-dt-faq-section .faq-content-area {
padding: 40px 20px 140px 20px;
}
}
@media (max-width: 576px) {
.product-dt-faq-section .faq-content-area {
padding: 40px 15px 140px 15px;
}
}
.product-dt-faq-section .faq-content-area > h2 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 700;
font-size: 45px;
line-height: 1.2;
margin-bottom: 55px;
}
@media (max-width: 1199px) {
.product-dt-faq-section .faq-content-area > h2 {
font-size: 40px;
margin-bottom: 45px;
}
}
@media (max-width: 767px) {
.product-dt-faq-section .faq-content-area > h2 {
font-size: 36px;
margin-bottom: 40px;
}
}
@media (max-width: 576px) {
.product-dt-faq-section .faq-content-area > h2 {
font-size: 30px;
line-height: 1.3;
margin-bottom: 35px;
}
}
.product-dt-faq-section .product-dt-faq-wrapper {
position: relative;
}
.product-dt-faq-section .product-dt-faq-wrapper .primary-btn1 {
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: 0;
min-width: 337px;
padding: 23px 52px 23px 60px;
font-size: 15px;
}
.product-dt-faq-section .product-dt-faq-wrapper .primary-btn1 .arrow {
top: 9px;
right: 9px;
}
.product-dt-faq-section .product-dt-faq-wrapper .primary-btn1 span:nth-child(2) {
padding-left: 60px;
}
@media (max-width: 767px) {
.product-dt-faq-section .product-dt-faq-wrapper .primary-btn1 span:nth-child(2) {
padding-left: 26px;
}
}
@media (max-width: 991px) {
.product-dt-faq-section .product-dt-faq-wrapper .primary-btn1 {
left: 30px;
transform: unset;
bottom: 50px;
margin-top: -124px;
}
}
@media (max-width: 767px) {
.product-dt-faq-section .product-dt-faq-wrapper .primary-btn1 {
left: 20px;
bottom: 40px;
padding: 22px 52px 22px 26px;
min-width: unset;
font-size: 13px;
}
} .project-slider-page {
height: 100vh;
width: 100%;
background-size: cover !important;
background-position: center center !important;
background-repeat: no-repeat;
position: relative;
}
.project-slider-page .project-slider-item {
height: 100vh;
position: relative;
}
.project-slider-page .project-slider-item .project-slider-bg {
background-size: cover !important;
background-position: center center !important;
background-repeat: no-repeat;
height: 100%;
width: 100%;
animation: qodef-animate-image-out 1s 0.1s cubic-bezier(0.78, 0.2, 0.21, 0.88) forwards;
}
.project-slider-page .project-slider-item .project-slider-content {
padding: 110px 140px;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
text-align: center;
}
@media (max-width: 1799px) {
.project-slider-page .project-slider-item .project-slider-content {
padding: 110px 120px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.project-slider-page .project-slider-item .project-slider-content {
padding: 110px 40px;
}
}
@media (max-width: 1399px) {
.project-slider-page .project-slider-item .project-slider-content {
padding: 110px 40px;
}
}
@media (max-width: 1199px) {
.project-slider-page .project-slider-item .project-slider-content {
padding: 100px 25px;
}
}
@media (max-width: 767px) {
.project-slider-page .project-slider-item .project-slider-content {
padding: 100px 25px;
}
}
.project-slider-page .project-slider-item .project-slider-content span {
color: rgba(255, 255, 255, 0.6);
font-family: var(--font-dmsans);
font-weight: 500;
font-size: 14px;
line-height: 1;
text-transform: uppercase;
margin-bottom: 20px;
}
.project-slider-page .project-slider-item .project-slider-content ul {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
gap: 20px;
padding-top: 20px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.project-slider-page .project-slider-item .project-slider-content ul {
gap: 10px;
}
}
@media (max-width: 767px) {
.project-slider-page .project-slider-item .project-slider-content ul {
gap: 10px;
padding-top: 15px;
}
}
.project-slider-page .project-slider-item .project-slider-content ul li a {
color: var(--white-color);
font-family: var(--font-dmsans);
font-weight: 500;
font-size: 14px;
line-height: 1;
padding: 2px 16px;
border-radius: 50px;
border: 1px solid rgba(255, 255, 255, 0.4);
transition: 0.5s;
}
.project-slider-page .project-slider-item .project-slider-content ul li a:hover {
background-color: var(--primary-color1);
border-color: var(--primary-color1);
}
.project-slider-page .project-slider-item .project-slider-content h1 {
margin-bottom: 0;
}
.project-slider-page .project-slider-item .project-slider-content h1 a {
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 55px;
line-height: 1.1;
transition: 0.5s;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.project-slider-page .project-slider-item .project-slider-content h1 a {
font-size: 50px;
}
}
@media (max-width: 1399px) {
.project-slider-page .project-slider-item .project-slider-content h1 a {
font-size: 48px;
}
}
@media (max-width: 991px) {
.project-slider-page .project-slider-item .project-slider-content h1 a {
font-size: 44px;
}
}
@media (max-width: 767px) {
.project-slider-page .project-slider-item .project-slider-content h1 a {
font-size: 40px;
}
}
@media (max-width: 576px) {
.project-slider-page .project-slider-item .project-slider-content h1 a {
font-size: 36px;
line-height: 1.2;
}
}
.project-slider-page .project-slider-item .project-slider-content h1 a:hover {
color: var(--primary-color1);
}
.project-slider-page .slider-btn-area .slider-btn {
position: absolute;
bottom: 70px;
left: 90px;
z-index: 9;
color: var(--white-color);
font-family: var(--font-manrope);
font-weight: 500;
font-size: 14px;
line-height: 1;
display: flex;
align-items: center;
gap: 12px;
transition: 0.5s;
}
.project-slider-page .slider-btn-area .slider-btn i {
color: var(--white-color);
font-size: 18px;
transition: 0.5s;
}
@media (max-width: 1699px) {
.project-slider-page .slider-btn-area .slider-btn {
left: 70px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.project-slider-page .slider-btn-area .slider-btn {
left: 50px;
}
}
@media (max-width: 1399px) {
.project-slider-page .slider-btn-area .slider-btn {
left: 50px;
}
}
@media (max-width: 1199px) {
.project-slider-page .slider-btn-area .slider-btn {
left: 30px;
bottom: 50px;
}
}
@media (max-width: 767px) {
.project-slider-page .slider-btn-area .slider-btn {
left: 20px;
}
}
@media (max-width: 576px) {
.project-slider-page .slider-btn-area .slider-btn {
left: 5px;
font-size: 12px;
bottom: 30px;
gap: 8px;
}
}
.project-slider-page .slider-btn-area .slider-btn.pf-slider-next {
left: unset;
right: 90px;
}
@media (max-width: 1699px) {
.project-slider-page .slider-btn-area .slider-btn.pf-slider-next {
right: 70px;
}
}
@media (min-width: 1400px) and (max-width: 1599px) {
.project-slider-page .slider-btn-area .slider-btn.pf-slider-next {
right: 50px;
}
}
@media (max-width: 1399px) {
.project-slider-page .slider-btn-area .slider-btn.pf-slider-next {
right: 50px;
}
}
@media (max-width: 1199px) {
.project-slider-page .slider-btn-area .slider-btn.pf-slider-next {
right: 30px;
}
}
@media (max-width: 767px) {
.project-slider-page .slider-btn-area .slider-btn.pf-slider-next {
right: 20px;
}
}
@media (max-width: 576px) {
.project-slider-page .slider-btn-area .slider-btn.pf-slider-next {
right: 5px;
}
}
.project-slider-page .slider-btn-area .slider-btn:hover {
color: var(--primary-color1);
}
.project-slider-page .slider-btn-area .slider-btn:hover i {
color: var(--primary-color1);
}
.project-slider-page .pf-horizontal-slider .swiper-slide-active .project-slider-bg {
animation: qodef-animate-image-in 1s cubic-bezier(0.78, 0.2, 0.21, 0.88) forwards;
}
.project-slider-page .pf-horizontal-slider .swiper-slide-active .project-slider-content {
animation: fadeInUp 1.7s;
} .shop-card {
transition: 0.5s;
position: relative;
border: 1px solid rgba(var(--black-color-opc), 0.07);
}
.shop-card .shop-card-img {
position: relative;
overflow: hidden;
}
.shop-card .shop-card-img > a img {
transition: all 0.5s ease-out;
}
.shop-card .shop-card-img > a .batch {
position: absolute;
left: 5px;
top: 5px;
display: flex;
align-items: center;
flex-direction: column;
gap: 5px;
}
.shop-card .shop-card-img > a .batch > span {
padding: 5px 11px;
display: flex;
align-items: center;
justify-content: center;
color: var(--white-color);
text-align: center;
font-size: 13px;
font-weight: 600;
font-family: var(--font-manrope);
letter-spacing: 0.3px;
line-height: 1;
text-transform: uppercase;
background-color: #76bbe6;
z-index: 1;
}
.shop-card .shop-card-img > a .batch > span.new {
background-color: #80ae7a;
}
.shop-card .shop-card-img > a .batch > span.sale {
background-color: var(--primary-color1);
}
.shop-card .shop-card-content {
padding-top: 25px;
}
@media (max-width: 576px) {
.shop-card .shop-card-content {
padding-top: 20px;
}
}
.shop-card .shop-card-content h6 {
margin-bottom: 15px;
}
@media (max-width: 576px) {
.shop-card .shop-card-content h6 {
margin-bottom: 10px;
}
}
.shop-card .shop-card-content h6 a {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 18px;
font-weight: 600;
letter-spacing: 0.5px;
line-height: 1.3;
transition: 0.5s;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.shop-card .shop-card-content h6 a {
font-size: 16px;
}
}
.shop-card .shop-card-content h6 a:hover {
color: var(--primary-color1);
}
.shop-card .shop-card-content > span {
color: var(--title-color);
font-family: var(--font-dmsans);
font-size: 17px;
font-weight: 600;
display: block;
margin-bottom: 40px;
}
@media (max-width: 1199px) {
.shop-card .shop-card-content > span {
margin-bottom: 35px;
}
}
@media (max-width: 576px) {
.shop-card .shop-card-content > span {
margin-bottom: 30px;
}
}
.shop-card .shop-card-content > span ins {
text-decoration: none;
}
.shop-card .shop-card-content > span del {
color: rgba(var(--title-color-opc), 0.3);
font-size: 15px;
font-weight: 400;
}
.shop-card .shop-card-content .rating {
display: flex;
align-items: baseline;
margin-bottom: 20px;
}
@media (max-width: 576px) {
.shop-card .shop-card-content .rating {
margin-bottom: 15px;
}
}
.shop-card .shop-card-content .rating .star-rating {
font-size: 14px;
width: 7em;
}
.shop-card .shop-card-content .rating .star-rating::before {
font-size: 14px;
letter-spacing: 5px;
}
.shop-card .shop-card-content .rating .star-rating span {
letter-spacing: 5px;
}
.shop-card .shop-card-content .rating ul {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
gap: 5px;
}
.shop-card .shop-card-content .rating ul li {
line-height: 1;
}
.shop-card .shop-card-content .rating ul li i {
color: #fe9a31;
font-size: 14px;
}
.shop-card .shop-card-content .rating .count {
font-size: 14px;
font-weight: 500;
line-height: 1;
font-family: var(--font-dmsans);
color: rgba(var(--primary-color-opc), 0.3);
}
.shop-card .shop-card-wrap {
padding: 30px 22px 0;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.shop-card .shop-card-wrap {
padding: 25px 15px 0;
}
}
@media (max-width: 767px) {
.shop-card .shop-card-wrap {
padding: 20px 15px 0;
}
}
.shop-card .primary-btn4 {
border-radius: unset;
width: 100%;
justify-content: center;
text-decoration: none;
background-color: rgba(var(--black-color-opc), 0.05);
padding: 17px 20px;
text-transform: none;
color: var(--title-color);
font-size: 15px;
}
.shop-card .primary-btn4 > span {
background-color: #fe9a31;
}
.shop-card:hover .shop-card-img img {
transform: scale(1.1);
} .shop-details-top-section .shop-details-img .nav-pills {
padding-top: 30px;
gap: 35px;
}
@media (max-width: 1199px) {
.shop-details-top-section .shop-details-img .nav-pills {
gap: 20px;
padding-top: 25px;
}
}
@media (max-width: 576px) {
.shop-details-top-section .shop-details-img .nav-pills {
gap: 10px;
}
}
.shop-details-top-section .shop-details-img .nav-pills .nav-link {
background-color: unset;
border-radius: unset;
padding: 0;
width: 102px;
height: 102px;
}
@media (max-width: 1199px) {
.shop-details-top-section .shop-details-img .nav-pills .nav-link {
width: 95px;
height: 95px;
}
}
.shop-details-top-section .shop-details-img .nav-pills .nav-link.active {
border: 1px solid var(--primary-color2);
}
@media (max-width: 576px) {
.shop-details-top-section .shop-details-img .nav-pills .nav-link {
width: 70px;
height: 70px;
padding: 0;
}
}
.shop-details-top-section .shop-details-img .nav-pills .nav-link img {
width: 100px;
height: 100px;
}
@media (max-width: 1199px) {
.shop-details-top-section .shop-details-img .nav-pills .nav-link img {
width: 93px;
height: 93px;
}
}
@media (max-width: 1199px) {
.shop-details-top-section .shop-details-img .nav-pills .nav-link img {
width: 68px;
height: 68px;
}
}
.shop-details-top-section .shop-details-content h2 {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 40px;
font-weight: 600;
line-height: 1.2;
letter-spacing: 0.7px;
text-transform: capitalize;
margin-bottom: 10px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.shop-details-top-section .shop-details-content h2 {
font-size: 38px;
}
}
@media (max-width: 1399px) {
.shop-details-top-section .shop-details-content h2 {
font-size: 36px;
}
}
@media (max-width: 1199px) {
.shop-details-top-section .shop-details-content h2 {
font-size: 32px;
}
}
@media (max-width: 576px) {
.shop-details-top-section .shop-details-content h2 {
font-size: 28px;
}
}
.shop-details-top-section .shop-details-content .rating-review {
display: flex;
align-items: center;
gap: 40px;
margin-bottom: 20px;
}
@media (max-width: 576px) {
.shop-details-top-section .shop-details-content .rating-review {
flex-direction: column;
align-items: flex-start;
gap: 0px;
margin-bottom: 15px;
}
}
.shop-details-top-section .shop-details-content .rating-review .rating {
display: flex;
align-items: center;
gap: 8px;
line-height: 1;
}
.shop-details-top-section .shop-details-content .rating-review .rating .star {
display: flex;
align-items: center;
gap: 6px;
}
.shop-details-top-section .shop-details-content .rating-review .rating .star i {
font-size: 14px;
color: #ffc107;
}
.shop-details-top-section .shop-details-content .rating-review .rating p {
margin-bottom: 0;
}
.shop-details-top-section .shop-details-content .rating-review .rating p a {
color: rgba(var(--title-color-opc), 0.5);
font-family: var(--font-manrope);
font-size: 15px;
font-weight: 400;
text-transform: capitalize;
transition: 0.5s;
}
.shop-details-top-section .shop-details-content .rating-review .rating p a:hover {
color: var(--title-color);
}
.shop-details-top-section .shop-details-content p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 16px;
font-weight: 400;
line-height: 1.8;
letter-spacing: 0.48px;
margin-bottom: 20px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.shop-details-top-section .shop-details-content p {
font-size: 15px;
}
}
@media (max-width: 576px) {
.shop-details-top-section .shop-details-content p {
font-size: 15px;
}
}
.shop-details-top-section .shop-details-content .price-area {
margin-bottom: 35px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.shop-details-top-section .shop-details-content .price-area {
margin-bottom: 30px;
}
}
.shop-details-top-section .shop-details-content .price-area h4 {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 25px;
font-weight: 600;
line-height: 1;
margin-bottom: 0;
}
.shop-details-top-section .shop-details-content .price-area h4 del {
color: #ababab;
font-family: var(--font-manrope);
font-size: 18px;
font-weight: 500;
line-height: 1;
}
.shop-details-top-section .shop-details-content .quantity-color-area {
display: flex;
align-items: flex-start;
gap: 50px;
margin-bottom: 35px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.shop-details-top-section .shop-details-content .quantity-color-area {
gap: 40px;
}
}
@media (max-width: 576px) {
.shop-details-top-section .shop-details-content .quantity-color-area {
flex-direction: column;
align-items: flex-start;
gap: 30px;
}
}
.shop-details-top-section .shop-details-content .quantity-color-area .quantity-color .widget-title {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 16px;
font-weight: 500;
line-height: 1;
letter-spacing: 0.48px;
margin-bottom: 20px;
}
@media (max-width: 576px) {
.shop-details-top-section .shop-details-content .quantity-color-area .quantity-color .widget-title {
margin-bottom: 15px;
}
}
.shop-details-top-section .shop-details-content .quantity-color-area .quantity-color .quantity-counter {
display: flex;
align-items: center;
gap: 10px;
}
.shop-details-top-section .shop-details-content .quantity-color-area .quantity-color .quantity-counter a {
width: 40px;
height: 40px;
background-color: rgba(var(--black-color-opc), 0.07);
display: flex;
align-items: center;
justify-content: center;
color: var(--title-color);
}
.shop-details-top-section .shop-details-content .quantity-color-area .quantity-color .quantity-counter .quantity__input {
max-width: 58px;
width: 100%;
height: 40px;
border: 1px solid var(--primary-color1);
text-align: center;
color: var(--primary-color1);
font-family: var(--font-kanit);
font-size: 16px;
font-weight: 500;
line-height: 1;
letter-spacing: 0.48px;
}
.shop-details-top-section .shop-details-content .quantity-color-area .quantity-color .quantity-counter .quantity__input:focus {
border: 1px solid #ddd;
}
.shop-details-top-section .shop-details-content .quantity-color-area .quantity-color .color-list {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 10px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.shop-details-top-section .shop-details-content .quantity-color-area .quantity-color .color-list {
gap: 8px;
}
}
.shop-details-top-section .shop-details-content .quantity-color-area .quantity-color .color-list li {
width: 30px;
height: 30px;
border: 1px solid transparent;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
}
.shop-details-top-section .shop-details-content .quantity-color-area .quantity-color .color-list li span {
width: 20px;
height: 20px;
border-radius: 50%;
background-color: #730718;
display: inline-block;
}
.shop-details-top-section .shop-details-content .quantity-color-area .quantity-color .color-list li:nth-child(2) span {
background-color: #815147;
}
.shop-details-top-section .shop-details-content .quantity-color-area .quantity-color .color-list li:nth-child(3) span {
background-color: #4a212b;
}
.shop-details-top-section .shop-details-content .quantity-color-area .quantity-color .color-list li:nth-child(4) span {
background-color: #ed5c31;
}
.shop-details-top-section .shop-details-content .quantity-color-area .quantity-color .color-list li:nth-child(5) span {
background-color: #93625f;
}
.shop-details-top-section .shop-details-content .quantity-color-area .quantity-color .color-list li:nth-child(6) span {
background-color: #ce626c;
}
.shop-details-top-section .shop-details-content .quantity-color-area .quantity-color .color-list li.selected {
border: 1px solid var(--black-color);
}
.shop-details-top-section .shop-details-content .shop-details-btn {
display: flex;
align-items: center;
gap: 30px;
border-bottom: 1px solid var(--black-color);
padding-bottom: 30px;
flex-wrap: wrap;
}
@media (max-width: 576px) {
.shop-details-top-section .shop-details-content .shop-details-btn {
gap: 20px;
}
}
.shop-details-top-section .shop-details-content .shop-details-btn .primary-btn1 {
padding: 20px 52px 20px 26px;
}
.shop-details-top-section .shop-details-content .shop-details-btn .primary-btn1.transparent {
padding: 19px 52px 19px 26px;
}
.shop-details-top-section .shop-details-content .product-info {
padding-top: 25px;
margin-bottom: 30px;
}
.shop-details-top-section .shop-details-content .product-info .product-info-list {
margin: 0;
padding: 0;
list-style: none;
display: flex;
align-items: center;
justify-content: space-between;
gap: 20px;
}
@media (max-width: 576px) {
.shop-details-top-section .shop-details-content .product-info .product-info-list {
flex-wrap: wrap;
gap: 8px;
}
}
.shop-details-top-section .shop-details-content .product-info .product-info-list li {
color: #868686;
font-family: var(--font-manrope);
font-size: 16px;
font-weight: 500;
letter-spacing: 0.32px;
text-transform: capitalize;
}
.shop-details-top-section .shop-details-content .product-info .product-info-list li a {
color: #868686;
transition: 0.35s;
}
.shop-details-top-section .shop-details-content .product-info .product-info-list li a:hover {
color: var(--primary-color1);
}
@media (max-width: 576px) {
.shop-details-top-section .shop-details-content .product-info .product-info-list li {
margin-right: 15px;
}
}
.shop-details-top-section .shop-details-content .product-info .product-info-list li span {
color: var(--title-color);
}
.shop-details-top-section .shop-details-content .payment-method {
padding: 17px 30px;
border: 1px solid rgba(var(--black-color-opc), 0.1);
max-width: 460px;
width: 100%;
border-radius: 5px;
margin-bottom: 20px;
}
@media (max-width: 576px) {
.shop-details-top-section .shop-details-content .payment-method {
padding: 15px 20px;
}
}
.shop-details-top-section .shop-details-content .payment-method h6 {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 16px;
font-weight: 400;
line-height: 1;
letter-spacing: 0.48px;
text-transform: capitalize;
margin-bottom: 15px;
}
.shop-details-top-section .shop-details-content .payment-method .payment-card-list {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
gap: 20px;
flex-wrap: wrap;
}
@media (max-width: 576px) {
.shop-details-top-section .shop-details-content .payment-method .payment-card-list {
gap: 10px;
}
}
.shop-details-top-section .shop-details-content .payment-method .payment-card-list li img {
min-width: 35px;
}
.shop-details-top-section .shop-details-content .wishlist-area a {
color: var(--text-color);
font-family: var(--font-manrope);
font-size: 15px;
font-weight: 500;
line-height: 1;
display: inline-flex;
align-items: center;
gap: 7px;
transition: 0.5s;
}
.shop-details-top-section .shop-details-content .wishlist-area a span {
width: 23px;
height: 23px;
border-radius: 50%;
border: 1px solid rgba(var(--black-color-opc), 0.1);
display: flex;
align-items: center;
justify-content: center;
transition: 0.5s;
}
.shop-details-top-section .shop-details-content .wishlist-area a span svg {
fill: var(--title-color);
transition: 0.5s;
}
.shop-details-top-section .shop-details-content .wishlist-area a:hover span {
background-color: var(--primary-color1);
border-color: var(--primary-color1);
}
.shop-details-top-section .shop-details-content .wishlist-area a:hover span svg {
fill: var(--white-color);
}
.shop-details-description-section .shop-details-description-nav .nav-tabs {
border-bottom: 1px solid var(--black-color);
padding-left: 80px;
gap: 65px;
}
@media (max-width: 991px) {
.shop-details-description-section .shop-details-description-nav .nav-tabs {
gap: 50px;
}
}
@media (max-width: 767px) {
.shop-details-description-section .shop-details-description-nav .nav-tabs {
gap: 20px;
padding-left: 0;
}
}
@media (max-width: 576px) {
.shop-details-description-section .shop-details-description-nav .nav-tabs {
gap: 10px;
}
}
.shop-details-description-section .shop-details-description-nav .nav-tabs .nav-link {
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 18px;
font-weight: 400;
letter-spacing: 0.36px;
text-transform: capitalize;
border: none;
background: linear-gradient(to bottom, #222222 0%, #222222 98%);
background-size: 0px 3px;
background-repeat: no-repeat;
background-position: right 100%;
transition: background-size 0.75s;
}
@media (max-width: 576px) {
.shop-details-description-section .shop-details-description-nav .nav-tabs .nav-link {
padding-bottom: 5px;
margin-right: 15px;
padding: 0;
}
}
.shop-details-description-section .shop-details-description-nav .nav-tabs .nav-link.active {
color: var(--title-color);
background-size: 100% 3px;
background-position: 0% 100%;
}
@media (max-width: 991px) {
.shop-details-description-section .shop-details-description-tab .description-tab-img img {
max-height: 380px;
-o-object-fit: cover;
object-fit: cover;
}
}
@media (max-width: 767px) {
.shop-details-description-section .shop-details-description-tab .description-tab-img img {
max-height: 300px;
}
}
.shop-details-description-section .shop-details-description-tab h6 {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 22px;
font-weight: 600;
line-height: 1.2;
margin-bottom: 10px;
}
@media (max-width: 1399px) {
.shop-details-description-section .shop-details-description-tab h6 {
font-size: 21px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.shop-details-description-section .shop-details-description-tab h6 {
font-size: 18px;
}
}
@media (max-width: 576px) {
.shop-details-description-section .shop-details-description-tab h6 {
font-size: 20px;
}
}
.shop-details-description-section .shop-details-description-tab p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 15px;
font-weight: 400;
line-height: 1.8;
letter-spacing: 0.45px;
margin-bottom: 0;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.shop-details-description-section .shop-details-description-tab p {
font-size: 14px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.shop-details-description-section .shop-details-description-tab p {
font-size: 14px;
}
}
.shop-details-description-section .shop-details-description-tab .description-content {
display: flex;
align-items: center;
flex-direction: column;
justify-content: space-between;
height: 100%;
}
@media (max-width: 991px) {
.shop-details-description-section .shop-details-description-tab .description-content {
align-items: flex-start;
gap: 20px;
}
}
.shop-details-description-section .shop-details-description-tab .description-content .description-left-content1 {
padding-top: 45px;
}
@media (max-width: 1399px) {
.shop-details-description-section .shop-details-description-tab .description-content .description-left-content1 {
padding-top: 30px;
margin-bottom: 30px;
}
}
@media (max-width: 991px) {
.shop-details-description-section .shop-details-description-tab .description-content .description-left-content1 {
padding-top: 0;
margin-bottom: 0;
}
}
.shop-details-description-section .shop-details-description-tab .addithonal-information .total-table2 {
margin-bottom: 0;
}
.shop-details-description-section .shop-details-description-tab .addithonal-information .total-table2 tbody tr {
border-width: 1px;
border-color: #eee;
}
.shop-details-description-section .shop-details-description-tab .addithonal-information .total-table2 tbody tr td {
border-width: 1px;
border-color: #eee;
padding: 15px;
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 14px;
font-weight: 500;
line-height: 30px;
vertical-align: middle;
}
@media (max-width: 767px) {
.shop-details-description-section .shop-details-description-tab .addithonal-information .total-table2 tbody tr td {
padding: 10px;
}
}
.shop-details-description-section .shop-details-description-tab .addithonal-information .total-table2 tbody tr td:nth-child(1) {
font-weight: 500;
font-size: 16px;
text-align: start;
line-height: 26px;
}
@media (min-width: 992px) {
.shop-details-description-section .shop-details-description-tab .addithonal-information .total-table2 tbody tr td:nth-child(1) {
width: 25%;
}
}
.shop-details-description-section .shop-details-description-tab .reviews-area .number-of-review {
line-height: 1;
margin-bottom: 40px;
}
.shop-details-description-section .shop-details-description-tab .reviews-area .number-of-review h4 {
line-height: 1;
margin-bottom: 0;
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 24px;
font-weight: 600;
}
@media (max-width: 576px) {
.shop-details-description-section .shop-details-description-tab .reviews-area .number-of-review h4 {
font-size: 22px;
}
}
.shop-details-description-section .shop-details-description-tab .reviews-area .comment {
margin: 0;
padding: 0;
list-style: none;
}
.shop-details-description-section .shop-details-description-tab .reviews-area .comment > li {
margin-bottom: 40px;
}
.shop-details-description-section .shop-details-description-tab .reviews-area .comment > li > .single-comment-area {
margin-bottom: 24px;
}
.shop-details-description-section .shop-details-description-tab .reviews-area .comment > li:last-child {
margin-bottom: 0;
}
.shop-details-description-section .shop-details-description-tab .reviews-area .comment > li:last-child > .single-comment-area {
margin-bottom: 0;
}
.shop-details-description-section .shop-details-description-tab .reviews-area .comment .single-comment-area {
display: flex;
align-items: flex-start;
gap: 20px;
}
@media (max-width: 576px) {
.shop-details-description-section .shop-details-description-tab .reviews-area .comment .single-comment-area {
gap: 15px;
flex-direction: column;
}
}
.shop-details-description-section .shop-details-description-tab .reviews-area .comment .single-comment-area .author-img img {
max-width: 50px;
min-width: 50px;
height: 50px;
border-radius: 50%;
}
.shop-details-description-section .shop-details-description-tab .reviews-area .comment .single-comment-area .comment-content .author-name-deg {
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 10px;
flex-wrap: wrap;
}
.shop-details-description-section .shop-details-description-tab .reviews-area .comment .single-comment-area .comment-content .author-name-deg h6 {
line-height: 1;
margin-bottom: 0;
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 15px;
font-weight: 600;
}
.shop-details-description-section .shop-details-description-tab .reviews-area .comment .single-comment-area .comment-content .author-name-deg span {
color: rgba(var(--title-color-opc), 0.6);
font-family: var(--font-dmsans);
font-size: 14px;
font-weight: 400;
line-height: 1;
}
.shop-details-description-section .shop-details-description-tab .reviews-area .comment .single-comment-area .comment-content .author-and-review .review {
padding: 0;
margin: 0;
list-style: none;
gap: 5px;
line-height: 1;
margin-bottom: 5px;
}
.shop-details-description-section .shop-details-description-tab .reviews-area .comment .single-comment-area .comment-content .author-and-review .review li {
line-height: 1;
}
.shop-details-description-section .shop-details-description-tab .reviews-area .comment .single-comment-area .comment-content .author-and-review .review li i {
color: #dda701;
font-size: 12px;
}
.shop-details-description-section .shop-details-description-tab .reviews-area .comment .single-comment-area .comment-content p {
color: rgba(var(--title-color-opc), 0.6);
font-family: var(--font-dmsans);
font-size: 15px;
font-weight: 400;
line-height: 28px;
margin-bottom: 12px;
}
.shop-details-description-section .shop-details-description-tab .reviews-area .comment .single-comment-area .comment-content .replay-btn {
color: rgba(var(--title-color-opc), 0.6);
font-family: var(--font-manrope);
font-size: 14px;
font-weight: 600;
display: inline-flex;
align-items: center;
gap: 5px;
line-height: 1;
cursor: pointer;
transition: 0.35s;
}
.shop-details-description-section .shop-details-description-tab .reviews-area .comment .single-comment-area .comment-content .replay-btn svg {
transition: 0.35s;
fill: rgba(var(--title-color-opc), 0.6);
}
.shop-details-description-section .shop-details-description-tab .reviews-area .comment .single-comment-area .comment-content .replay-btn:hover {
color: var(--primary-color1);
}
.shop-details-description-section .shop-details-description-tab .reviews-area .comment .single-comment-area .comment-content .replay-btn:hover svg {
fill: var(--primary-color1);
}
.shop-details-description-section .shop-details-description-tab .reviews-area .comment .comment-replay {
padding: 0;
margin: 0;
list-style: none;
margin-left: 70px;
border-top: 1px solid var(--borders-color);
border-bottom: 1px solid var(--borders-color);
padding: 24px 0;
}
@media (max-width: 576px) {
.shop-details-description-section .shop-details-description-tab .reviews-area .comment .comment-replay {
margin-left: 30px;
}
}
.shop-details-description-section .shop-details-description-tab .reviews-area .comment .comment-replay > li {
margin-bottom: 30px;
}
.shop-details-description-section .shop-details-description-tab .reviews-area .comment .comment-replay > li:last-child {
margin-bottom: 0;
}
.shop-details-description-section .shop-details-description-tab .review-form {
background-color: var(--white-color);
border: 1px solid var(--borders-color);
box-shadow: 4px 3px 40px 0px rgba(16, 33, 34, 0.06);
padding: 50px 40px;
border-radius: 10px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.shop-details-description-section .shop-details-description-tab .review-form {
padding: 40px 30px;
}
}
@media (max-width: 576px) {
.shop-details-description-section .shop-details-description-tab .review-form {
padding: 40px 25px;
}
}
.shop-details-description-section .shop-details-description-tab .review-form .number-of-review {
line-height: 1;
margin-bottom: 30px;
}
.shop-details-description-section .shop-details-description-tab .review-form .number-of-review h4 {
line-height: 1;
margin-bottom: 0;
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 24px;
font-weight: 600;
}
.shop-details-description-section .shop-details-description-tab .review-form .form-inner2 .review-rate-area {
margin-bottom: 15px;
}
.shop-details-description-section .shop-details-description-tab .review-form .form-inner2 .review-rate-area p {
margin-bottom: 5px;
color: var(--title-color);
}
.shop-details-description-section .shop-details-description-tab .review-form .form-inner2 .review-rate-area .rate {
float: left;
}
.shop-details-description-section .shop-details-description-tab .review-form .form-inner2 .review-rate-area .rate:not(:checked) > input {
position: absolute;
top: -9999px;
}
.shop-details-description-section .shop-details-description-tab .review-form .form-inner2 .review-rate-area .rate:not(:checked) > label {
width: 1em;
overflow: hidden;
white-space: nowrap;
cursor: pointer;
font-size: 16px;
line-height: 1;
color: #ccc;
padding-right: 8px;
display: inline-block;
margin-right: 8px;
}
.shop-details-description-section .shop-details-description-tab .review-form .form-inner2 .review-rate-area .rate:not(:checked) > label::before {
content: "\f586";
font-family: bootstrap-icons !important;
}
.shop-details-description-section .shop-details-description-tab .review-form .form-inner2 .review-rate-area .rate input:checked ~ label {
color: #dda701;
}
.shop-details-description-section .shop-details-description-tab .review-form .form-inner2 .review-rate-area .rate:not(:checked) > label:hover,
.shop-details-description-section .shop-details-description-tab .review-form .form-inner2 .review-rate-area .rate:not(:checked) > label:hover ~ label {
color: #dda701;
}
.shop-details-description-section .shop-details-description-tab .review-form .form-inner2 .review-rate-area input:checked + label:hover,
.shop-details-description-section .shop-details-description-tab .review-form .form-inner2 .review-rate-area input:checked + label:hover ~ label,
.shop-details-description-section .shop-details-description-tab .review-form .form-inner2 .review-rate-area input:checked ~ label:hover,
.shop-details-description-section .shop-details-description-tab .review-form .form-inner2 .review-rate-area input:checked ~ label:hover ~ label,
.shop-details-description-section .shop-details-description-tab .review-form .form-inner2 .review-rate-area label:hover ~ input:checked ~ label {
color: #dda701;
}
.shop-details-description-section .shop-details-description-tab .review-form .primary-btn1 {
padding: 21px 52px 21px 26px;
}
.shop-details-description-section .shop-details-description-tab .review-form .primary-btn1 span:nth-child(2) {
text-align: left;
} .cart-page .cart-widget-title {
margin-bottom: 35px;
}
@media (max-width: 991px) {
.cart-page .cart-widget-title {
margin-bottom: 25px;
}
}
.cart-page .cart-widget-title h4 {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 30px;
font-weight: 600;
line-height: 1.4;
margin-bottom: 0;
}
@media (max-width: 1199px) {
.cart-page .cart-widget-title h4 {
font-size: 28px;
}
}
@media (max-width: 576px) {
.cart-page .cart-widget-title h4 {
font-size: 26px;
}
}
.cart-page .cart-shopping-wrapper .cart-table {
width: 100%;
}
@media (max-width: 767px) {
.cart-page .cart-shopping-wrapper .cart-table {
margin-bottom: 30px;
}
}
.cart-page .cart-shopping-wrapper .cart-table thead tr {
border-top: 1px solid var(--borders-color);
border-bottom: 1px solid var(--borders-color);
}
.cart-page .cart-shopping-wrapper .cart-table thead tr th {
color: var(--title-color);
font-family: var(--font-dmsans);
font-size: 18px;
font-weight: 600;
line-height: 1;
padding: 20px 15px;
}
@media (max-width: 767px) {
.cart-page .cart-shopping-wrapper .cart-table thead tr th {
display: none;
}
}
.cart-page .cart-shopping-wrapper .cart-table thead tr th:first-child {
padding-left: 0;
}
@media (max-width: 767px) {
.cart-page .cart-shopping-wrapper .cart-table tbody tr {
border-bottom: 1px solid var(--borders-color);
}
}
.cart-page .cart-shopping-wrapper .cart-table tbody tr td {
padding: 30px 15px;
color: var(--title-color);
font-family: var(--font-dmsans);
font-size: 18px;
font-weight: 600;
line-height: 1;
}
.cart-page .cart-shopping-wrapper .cart-table tbody tr td span {
color: rgba(var(--title-color-opc), 0.7);
}
.cart-page .cart-shopping-wrapper .cart-table tbody tr td:first-child {
padding-left: 0;
}
@media (max-width: 767px) {
.cart-page .cart-shopping-wrapper .cart-table tbody tr td {
text-align: right;
}
}
.cart-page .cart-shopping-wrapper .cart-table tbody tr td .product-info-wrapper {
display: flex;
align-items: center;
gap: 20px;
}
@media (max-width: 767px) {
.cart-page .cart-shopping-wrapper .cart-table tbody tr td .product-info-wrapper {
align-items: flex-end;
flex-direction: column;
}
}
.cart-page .cart-shopping-wrapper .cart-table tbody tr td .product-info-wrapper .product-info-img img {
max-width: 120px;
}
.cart-page .cart-shopping-wrapper .cart-table tbody tr td .product-info-wrapper .product-info-content h6 {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 18px;
font-weight: 500;
line-height: 1.4;
margin-bottom: 10px;
}
.cart-page .cart-shopping-wrapper .cart-table tbody tr td .product-info-wrapper .product-info-content p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 14px;
font-weight: 500;
line-height: 1;
margin-bottom: 35px;
}
.cart-page .cart-shopping-wrapper .cart-table tbody tr td .product-info-wrapper .product-info-content p span {
color: var(--title-color);
font-weight: 600;
}
.cart-page .cart-shopping-wrapper .cart-table tbody tr td .product-info-wrapper .product-info-content ul {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
gap: 20px;
}
@media (max-width: 767px) {
.cart-page .cart-shopping-wrapper .cart-table tbody tr td .product-info-wrapper .product-info-content ul {
justify-content: flex-end;
}
}
.cart-page .cart-shopping-wrapper .cart-table tbody tr td .product-info-wrapper .product-info-content ul li {
color: var(--text-color);
font-family: var(--font-dmsans);
font-size: 14px;
font-weight: 400;
line-height: 1;
cursor: pointer;
position: relative;
transition: 0.5s;
}
.cart-page .cart-shopping-wrapper .cart-table tbody tr td .product-info-wrapper .product-info-content ul li:last-child::before {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
left: -10px;
width: 1px;
height: 11px;
background-color: rgba(var(--title-color-opc), 0.2);
}
.cart-page .cart-shopping-wrapper .cart-table tbody tr td .product-info-wrapper .product-info-content ul li .quantity-area {
position: absolute;
top: -30px;
right: -60px;
opacity: 0;
transform: scaleY(0);
transform-origin: bottom;
}
@media (max-width: 991px) {
.cart-page .cart-shopping-wrapper .cart-table tbody tr td .product-info-wrapper .product-info-content ul li .quantity-area {
right: unset;
left: -60px;
}
}
.cart-page .cart-shopping-wrapper .cart-table tbody tr td .product-info-wrapper .product-info-content ul li .quantity-area .quantity {
display: flex;
gap: 5px;
}
.cart-page .cart-shopping-wrapper .cart-table tbody tr td .product-info-wrapper .product-info-content ul li .quantity-area .quantity a {
height: 24px;
width: 34px;
border-radius: 4px;
background: rgba(var(--black-color-opc), 0.07);
display: flex;
align-items: center;
justify-content: center;
font-size: 20px;
color: var(--title-color);
font-weight: 600;
cursor: pointer;
transition: 0.35s;
}
.cart-page .cart-shopping-wrapper .cart-table tbody tr td .product-info-wrapper .product-info-content ul li .quantity-area .quantity a i {
color: var(--title-color);
transition: 0.35s;
line-height: 1;
}
.cart-page .cart-shopping-wrapper .cart-table tbody tr td .product-info-wrapper .product-info-content ul li .quantity-area .quantity a:hover {
background: var(--primary-color1);
border-color: var(--primary-color1);
color: var(--white-color);
}
.cart-page .cart-shopping-wrapper .cart-table tbody tr td .product-info-wrapper .product-info-content ul li .quantity-area .quantity a:hover i {
color: var(--white-color);
}
.cart-page .cart-shopping-wrapper .cart-table tbody tr td .product-info-wrapper .product-info-content ul li .quantity-area .quantity input {
height: 24px;
width: 34px;
border-radius: 4px;
border: 1px solid var(--black-color);
background-color: var(--white-color);
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
color: var(--title-color);
font-weight: 500;
text-align: center;
}
.cart-page .cart-shopping-wrapper .cart-table tbody tr td .product-info-wrapper .product-info-content ul li .quantity-area.active {
opacity: 1;
transform: scaleY(1);
animation: fade-down 0.3s linear;
}
.cart-page .cart-shopping-wrapper .cart-table tbody tr td .product-info-wrapper .product-info-content ul li:hover {
color: rgb(255, 72, 32);
}
.cart-page .cart-shopping-wrapper .cart-table tbody tr td .product-info-wrapper .product-info-content ul li:hover:last-child {
color: var(--primary-color1);
}
@media (max-width: 767px) {
.cart-page .cart-shopping-wrapper .cart-table tbody tr td {
display: block;
width: 100%;
text-align: right;
position: relative;
padding: 15px;
}
.cart-page .cart-shopping-wrapper .cart-table tbody tr td::before {
content: attr(data-label);
position: absolute;
left: 15px;
color: var(--title-color);
font-family: var(--font-dmsans);
font-size: 18px;
font-weight: 600;
}
}
@media (max-width: 767px) and (max-width: 576px) {
.cart-page .cart-shopping-wrapper .cart-table tbody tr td::before {
font-size: 16px;
}
}
.cart-page .cart-shopping-wrapper .details-button {
position: relative;
display: inline-block;
vertical-align: top;
line-height: 1.4;
font-weight: 500;
text-decoration: none;
outline: none;
padding: 0 1.375em 0.0625em 0;
cursor: pointer;
background-color: transparent;
background-position: 100% 100%;
background-repeat: no-repeat;
background-size: var(--background-size, 100%) 0.0625em;
transition: background-size 0.2s linear var(--background-delay, 0.15s);
transform: translateZ(0);
border: none;
background-image: linear-gradient(0deg, var(--black-color) 0%, var(--black-color) 100%);
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 17px;
font-weight: 600;
white-space: nowrap;
}
.cart-page .cart-shopping-wrapper .details-button::after {
content: "\f123";
font-family: "bootstrap-icons";
display: block;
position: absolute;
right: 0;
left: initial;
top: 0;
opacity: 1;
transition: opacity 0.3s 0.15s;
color: var(--black-color);
}
.cart-page .cart-shopping-wrapper .details-button svg {
position: absolute;
display: block;
line-height: 1.8125em;
width: 1.375em;
height: 1.8125em;
right: 0;
left: initial;
top: 50%;
margin: -0.92em 0 0;
fill: none;
stroke: var(--title-color);
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 1px;
stroke-dasharray: 7.95 30;
stroke-dashoffset: var(--stroke-dashoffset, 46);
transition: stroke-dashoffset var(--stroke-duration, 0.15s) var(--stroke-easing, linear) var(--stroke-delay, 0s);
}
.cart-page .cart-shopping-wrapper .details-button:hover {
--background-size: 0%;
--stroke-dashoffset: 26;
--stroke-duration: 0.3s;
--stroke-easing: cubic-bezier(0.3, 1.5, 0.5, 1);
--stroke-delay: 0.195s;
color: var(--title-color);
}
.cart-page .cart-shopping-wrapper .details-button:hover::after {
opacity: 0;
transition-delay: 0s;
}
@media (min-width: 992px) {
.cart-page .cart-order-sum-area {
padding-left: 15px;
}
}
.cart-page .cart-order-sum-area .order-summary-wrap {
padding: 40px 30px;
border: 1px solid var(--borders-color);
border-radius: 10px;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.cart-page .cart-order-sum-area .order-summary-wrap {
padding: 35px 25px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.cart-page .cart-order-sum-area .order-summary-wrap {
padding: 35px 25px;
}
}
@media (max-width: 576px) {
.cart-page .cart-order-sum-area .order-summary-wrap {
padding: 30px 20px;
}
}
.cart-page .cart-order-sum-area .order-summary-wrap .order-summary-list {
padding: 0;
margin: 0;
list-style: none;
width: 100%;
}
.cart-page .cart-order-sum-area .order-summary-wrap .order-summary-list li {
display: flex;
align-items: flex-start;
justify-content: space-between;
margin-bottom: 30px;
line-height: 1;
}
.cart-page .cart-order-sum-area .order-summary-wrap .order-summary-list li:first-child {
padding-bottom: 20px;
border-bottom: 1px solid var(--borders-color);
}
.cart-page .cart-order-sum-area .order-summary-wrap .order-summary-list li span {
color: var(--title-color);
font-family: var(--font-dmsans);
font-size: 16px;
font-weight: 600;
line-height: 1;
display: inline-block;
}
.cart-page .cart-order-sum-area .order-summary-wrap .order-summary-list li .order-info {
text-align: right;
}
.cart-page .cart-order-sum-area .order-summary-wrap .order-summary-list li .order-info p {
color: rgba(var(--title-color-opc), 0.6);
font-family: var(--font-dmsans);
font-size: 16px;
font-weight: 500;
line-height: 1;
margin-bottom: 5px;
}
.cart-page .cart-order-sum-area .order-summary-wrap .order-summary-list li .order-info strong {
color: var(--title-color);
font-family: var(--font-dmsans);
font-size: 16px;
font-weight: 500;
line-height: 1;
margin-bottom: 0;
}
.cart-page .cart-order-sum-area .order-summary-wrap .order-summary-list li .coupon-area {
width: 100%;
margin-bottom: 10px;
}
.cart-page .cart-order-sum-area .order-summary-wrap .order-summary-list li .coupon-area span {
margin-bottom: 15px;
}
.cart-page .cart-order-sum-area .order-summary-wrap .order-summary-list li .coupon-area .form-inner {
position: relative;
}
.cart-page .cart-order-sum-area .order-summary-wrap .order-summary-list li .coupon-area .form-inner input {
width: 100%;
height: 45px;
padding: 10px 100px 10px 20px;
border-radius: 5px;
}
.cart-page .cart-order-sum-area .order-summary-wrap .order-summary-list li .coupon-area .form-inner input::-moz-placeholder {
color: rgba(var(--title-color-opc), 0.5);
}
.cart-page .cart-order-sum-area .order-summary-wrap .order-summary-list li .coupon-area .form-inner input::placeholder {
color: rgba(var(--title-color-opc), 0.5);
}
.cart-page .cart-order-sum-area .order-summary-wrap .order-summary-list li .coupon-area .form-inner input:focus {
border-color: #eee;
}
.cart-page .cart-order-sum-area .order-summary-wrap .order-summary-list li .coupon-area .form-inner .apply-btn {
padding: 13px 23px;
border-radius: 0 5px 5px 0;
background-color: var(--black-color);
border: 1px solid var(--black-color);
color: var(--white-color);
font-family: var(--font-manrope);
font-size: 16px;
font-weight: 500;
letter-spacing: 0.48px;
line-height: 1;
display: inline-flex;
align-items: center;
gap: 10px;
transition: 0.5s;
overflow: hidden;
z-index: 1;
white-space: nowrap;
position: absolute;
top: 0;
right: 0;
}
.cart-page .cart-order-sum-area .order-summary-wrap .order-summary-list li .coupon-area .form-inner .apply-btn::after {
position: absolute;
content: "";
display: block;
left: 15%;
right: -20%;
top: -4%;
height: 150%;
width: 150%;
bottom: 0;
border-radius: 2px;
background-color: var(--white-color);
transform: skewX(45deg) scale(0, 1);
z-index: -1;
transition: all 0.5s ease-out 0s;
}
.cart-page .cart-order-sum-area .order-summary-wrap .order-summary-list li .coupon-area .form-inner .apply-btn:hover {
color: var(--title-color);
}
.cart-page .cart-order-sum-area .order-summary-wrap .order-summary-list li .coupon-area .form-inner .apply-btn:hover::after {
transform: skewX(45deg) scale(1, 1);
}
.cart-page .cart-order-sum-area .order-summary-wrap .order-summary-list li:last-child {
margin-bottom: 40px;
}
.cart-page .cart-order-sum-area .order-summary-wrap .order-summary-list li:last-child span {
font-size: 16px;
font-weight: 600;
}
.cart-page .cart-order-sum-area .order-summary-wrap > .primary-btn1 {
width: 100%;
display: flex;
justify-content: center;
padding: 22px 26px;
}
.cart-page .cart-order-sum-area .order-summary-wrap > .primary-btn1 span {
text-align: center;
}
.cart-page .cart-order-sum-area .order-summary-wrap > .primary-btn1 span:nth-child(2) {
padding-left: 0;
} .checkout-page .checkout-form-wrapper .checkout-form-title {
margin-bottom: 30px;
}
.checkout-page .checkout-form-wrapper .checkout-form-title h4 {
margin-bottom: 0;
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 30px;
font-weight: 600;
}
@media (max-width: 1199px) {
.checkout-page .checkout-form-wrapper .checkout-form-title h4 {
font-size: 28px;
}
}
@media (max-width: 576px) {
.checkout-page .checkout-form-wrapper .checkout-form-title h4 {
font-size: 26px;
}
}
.checkout-page .checkout-form-wrapper .checkout-form {
border-radius: 10px;
border: 1px solid var(--borders-color);
padding: 45px 35px 50px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.checkout-page .checkout-form-wrapper .checkout-form {
padding: 40px 25px 45px;
}
}
@media (max-width: 767px) {
.checkout-page .checkout-form-wrapper .checkout-form {
padding: 35px 20px 40px;
}
}
@media (max-width: 576px) {
.checkout-page .checkout-form-wrapper .checkout-form {
padding: 30px 15px;
}
}
.checkout-page .checkout-form-wrapper .checkout-form .form-inner2 .form-check-input:checked {
background-color: var(--primary-color1);
border-color: var(--primary-color1);
}
.checkout-page .cart-menu {
min-height: 10rem;
z-index: 99;
transform-origin: top;
}
.checkout-page .cart-body ul {
padding: 0;
list-style: none;
margin-bottom: 50px;
}
.checkout-page .cart-body ul .single-item {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 25px;
}
.checkout-page .cart-body ul .single-item:last-child {
margin-bottom: 0;
}
.checkout-page .cart-body ul .single-item .item-area {
display: flex;
align-items: center;
gap: 20px;
position: relative;
width: 100%;
}
.checkout-page .cart-body ul .single-item .item-area .close-btn {
background: transparent;
transition: 0.35s;
width: 25px;
height: 25px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background-color: rgba(var(--primary-color1-opc), 0.14);
}
.checkout-page .cart-body ul .single-item .item-area .close-btn i {
color: var(--primary-color1);
line-height: 1;
font-size: 20px;
transition: 0.35s;
}
.checkout-page .cart-body ul .single-item .item-area .close-btn:hover {
background-color: var(--primary-color1);
}
.checkout-page .cart-body ul .single-item .item-area .close-btn:hover i {
color: var(--white-color);
}
.checkout-page .cart-body ul .single-item .item-area .main-item {
display: flex;
gap: 15px;
width: 100%;
}
@media (max-width: 767px) {
.checkout-page .cart-body ul .single-item .item-area .main-item {
gap: 12px;
}
}
.checkout-page .cart-body ul .single-item .item-area .main-item .item-img {
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
.checkout-page .cart-body ul .single-item .item-area .main-item .item-img img {
height: 90px;
max-width: 90px;
min-width: 90px;
}
@media (max-width: 767px) {
.checkout-page .cart-body ul .single-item .item-area .main-item .item-img img {
-o-object-fit: cover;
object-fit: cover;
}
}
.checkout-page .cart-body ul .single-item .item-area .main-item .content-and-quantity {
width: 100%;
}
.checkout-page .cart-body ul .single-item .item-area .main-item .content {
line-height: 1;
margin-bottom: 10px;
}
.checkout-page .cart-body ul .single-item .item-area .main-item .content span {
font-family: var(--font-dmsans);
font-weight: 600;
font-size: 14px;
color: var(--text-color);
display: inline-block;
}
.checkout-page .cart-body ul .single-item .item-area .main-item .content h6 {
margin-bottom: 0;
line-height: 1;
}
.checkout-page .cart-body ul .single-item .item-area .main-item .content h6 a {
font-family: var(--font-manrope);
font-weight: 600;
font-size: 16px;
line-height: 1.5;
color: var(--title-color);
transition: 0.5s;
}
@media (max-width: 767px) {
.checkout-page .cart-body ul .single-item .item-area .main-item .content h6 a {
font-size: 14px;
}
}
.checkout-page .cart-body ul .single-item .item-area .main-item .content h6 a:hover {
color: var(--primary-color1);
}
.checkout-page .cart-body ul .single-item .quantity-area .quantity {
display: flex;
gap: 5px;
}
.checkout-page .cart-body ul .single-item .quantity-area .quantity a {
height: 24px;
width: 34px;
border-radius: 4px;
background: rgba(var(--black-color-opc), 0.07);
display: flex;
align-items: center;
justify-content: center;
font-size: 20px;
color: var(--title-color);
font-weight: 600;
cursor: pointer;
transition: 0.35s;
}
.checkout-page .cart-body ul .single-item .quantity-area .quantity a i {
color: var(--title-color);
transition: 0.35s;
}
.checkout-page .cart-body ul .single-item .quantity-area .quantity a:hover {
background: var(--primary-color1);
border-color: var(--primary-color1);
color: var(--white-color);
}
.checkout-page .cart-body ul .single-item .quantity-area .quantity a:hover i {
color: var(--white-color);
}
.checkout-page .cart-body ul .single-item .quantity-area .quantity input {
height: 24px;
width: 34px;
border-radius: 4px;
border: 1px solid rgba(var(--black-color-opc), 0.3);
background-color: var(--white-color);
display: flex;
align-items: center;
justify-content: center;
font-family: var(--font-dmsans);
font-size: 14px;
color: var(--title-color);
font-weight: 600;
text-align: center;
}
.checkout-page .cart-footer {
justify-content: flex-start;
padding: 0;
border-top: 1px solid var(--borders-color);
}
.checkout-page .cart-footer .pricing-area {
width: 100%;
}
.checkout-page .cart-footer .pricing-area ul {
margin: 0;
list-style: none;
border-bottom: 1px solid var(--borders-color);
width: 100%;
padding: 10px 0px 10px;
}
.checkout-page .cart-footer .pricing-area ul:last-child {
border-bottom: none;
padding-bottom: 0;
margin-bottom: 30px;
}
.checkout-page .cart-footer .pricing-area ul li {
font-family: var(--font-dmsans);
font-weight: 600;
font-size: 16px;
color: var(--title-color);
display: flex;
justify-content: space-between;
width: 100%;
}
.checkout-page .cart-footer .pricing-area ul.total li {
font-size: 18px;
font-weight: 700;
}
.checkout-page .cart-footer .primary-btn2 {
width: 100%;
justify-content: center;
}
.checkout-page .choose-payment-method {
margin-bottom: 40px;
line-height: 1;
}
.checkout-page .choose-payment-method h6 {
margin-bottom: 10px;
color: var(--title-color);
font-family: var(--font-dmsans);
font-size: 17px;
font-weight: 600;
}
.checkout-page .choose-payment-method .payment-option {
line-height: 1;
}
.checkout-page .choose-payment-method .payment-option ul {
padding: 0;
list-style: none;
display: flex;
align-items: center;
gap: 20px;
flex-wrap: wrap;
margin-bottom: 30px;
}
.checkout-page .choose-payment-method .payment-option ul li {
width: 110px;
height: 68px;
background-color: var(--white-color);
border: 1px solid var(--borders-color);
border-radius: 5px;
display: flex;
align-items: center;
justify-content: center;
position: relative;
cursor: pointer;
}
.checkout-page .choose-payment-method .payment-option ul li .checked {
position: absolute;
top: 0;
left: 0;
width: 32px;
height: 32px;
background: rgba(var(--primary-color1-opc), 0.15);
clip-path: polygon(0 0, 0% 100%, 100% 0);
border-top-left-radius: 5px;
}
.checkout-page .choose-payment-method .payment-option ul li .checked i {
opacity: 0;
color: var(--white-color);
margin-left: 2px;
}
.checkout-page .choose-payment-method .payment-option ul li.active .checked {
background: var(--primary-color1);
}
.checkout-page .choose-payment-method .payment-option ul li.active .checked i {
opacity: 1;
}
.checkout-page .primary-btn1 {
width: 100%;
display: flex;
justify-content: center;
padding: 22px 26px;
}
.checkout-page .primary-btn1 span {
text-align: center;
}
.checkout-page .primary-btn1 span:nth-child(2) {
padding-left: 0;
} .career-details-page .job-title-and-description-area h2 {
color: var(--title-color);
font-family: var(--font-manrope);
font-weight: 600;
font-size: 50px;
line-height: 1.2;
margin-bottom: 35px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.career-details-page .job-title-and-description-area h2 {
font-size: 46px;
}
}
@media (max-width: 1399px) {
.career-details-page .job-title-and-description-area h2 {
font-size: 42px;
}
}
@media (max-width: 1199px) {
.career-details-page .job-title-and-description-area h2 {
font-size: 40px;
margin-bottom: 30px;
}
}
@media (max-width: 991px) {
.career-details-page .job-title-and-description-area h2 {
font-size: 38px;
}
}
@media (max-width: 767px) {
.career-details-page .job-title-and-description-area h2 {
font-size: 34px;
}
}
@media (max-width: 576px) {
.career-details-page .job-title-and-description-area h2 {
font-size: 30px;
margin-bottom: 25px;
}
}
.career-details-page .job-title-and-description-area .description-area {
padding: 35px 50px;
border: 1px dashed var(--primary-color1);
border-radius: 20px;
}
@media (max-width: 1399px) {
.career-details-page .job-title-and-description-area .description-area {
padding: 35px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.career-details-page .job-title-and-description-area .description-area {
padding: 25px;
}
}
@media (max-width: 991px) {
.career-details-page .job-title-and-description-area .description-area {
padding: 30px;
}
}
@media (max-width: 767px) {
.career-details-page .job-title-and-description-area .description-area {
padding: 25px;
}
}
@media (max-width: 576px) {
.career-details-page .job-title-and-description-area .description-area {
padding: 20px;
border-radius: 15px;
}
}
.career-details-page .job-title-and-description-area .description-area p {
color: var(--text-color);
font-family: var(--font-dmsans);
font-weight: 400;
font-size: 20px;
line-height: 32px;
margin-bottom: 0;
}
@media (min-width: 992px) and (max-width: 1199px) {
.career-details-page .job-title-and-description-area .description-area p {
font-size: 19px;
}
}
@media (max-width: 767px) {
.career-details-page .job-title-and-description-area .description-area p {
font-size: 18px;
}
}
@media (max-width: 576px) {
.career-details-page .job-title-and-description-area .description-area p {
font-size: 17px;
}
}
.career-details-page .career-details-sidebar .career-info-wrap {
border: 1px solid rgba(var(--black-color-opc), 0.1);
background: #faf9f9;
padding: 25px 30px;
border-radius: 10px;
position: relative;
z-index: 1;
}
@media (max-width: 1399px) {
.career-details-page .career-details-sidebar .career-info-wrap {
padding: 25px 25px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.career-details-page .career-details-sidebar .career-info-wrap {
padding: 25px 20px;
}
}
.career-details-page .career-details-sidebar .career-info-wrap .career-info {
margin: 0;
padding: 0;
list-style: none;
}
.career-details-page .career-details-sidebar .career-info-wrap .career-info li {
border-bottom: 1px solid rgba(var(--black-color-opc), 0.1);
padding-bottom: 20px;
margin-bottom: 20px;
}
@media (min-width: 992px) and (max-width: 1199px) {
.career-details-page .career-details-sidebar .career-info-wrap .career-info li {
padding-bottom: 20px;
margin-bottom: 20px;
}
}
.career-details-page .career-details-sidebar .career-info-wrap .career-info li:last-child {
border-bottom: none;
padding-bottom: 0;
margin-bottom: 0;
}
.career-details-page .career-details-sidebar .career-info-wrap .career-info li span {
color: rgba(var(--title-color-opc), 0.5);
font-family: var(--font-dmsans);
font-size: 15px;
font-weight: 400;
line-height: 1;
display: inline-block;
margin-bottom: 10px;
}
.career-details-page .career-details-sidebar .career-info-wrap .career-info li h5 {
color: var(--title-color);
font-family: var(--font-manrope);
font-size: 20px;
font-weight: 500;
line-height: 1.2;
margin-bottom: 0;
}
@media (max-width: 1199px) {
.career-details-page .career-details-sidebar .career-info-wrap .career-info li h5 {
font-size: 18px;
}
}
.career-details-page .career-details-sidebar .career-info-wrap::before {
content: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/innerpages/project-dt-project-info-vector.svg);
position: absolute;
top: 0;
right: 0;
z-index: -1;
}
.career-details-page .career-details-sidebar .primary-btn1 {
width: 100%;
display: flex;
justify-content: center;
padding: 22px 26px;
font-size: 16px;
letter-spacing: 0.05em;
}
.career-details-page .career-details-sidebar .primary-btn1 span {
text-align: center;
}
.career-details-page .career-details-sidebar .primary-btn1 span:nth-child(2) {
padding-left: 0;
} .project-metro-page {
overflow: hidden;
}
.project-metro-card {
position: relative;
overflow: hidden;
transition: all 0.5s ease-out;
}
.project-metro-card img {
min-height: 320px;
-o-object-fit: cover;
object-fit: cover;
}
@media (min-width: 992px) and (max-width: 1199px) {
.project-metro-card img {
min-height: 350px;
width: 100%;
}
}
@media (max-width: 767px) {
.project-metro-card img {
min-height: 350px;
}
}
.project-metro-card .project-content-wrap {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 24.28%, rgba(0, 0, 0, 0.8) 91.5%);
padding: 50px;
display: flex;
align-items: end;
z-index: 2;
transform-origin: bottom;
transform: scaleY(0);
opacity: 0;
transition: 0.5s;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.project-metro-card .project-content-wrap {
padding: 50px 40px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.project-metro-card .project-content-wrap {
padding: 45px 35px;
}
}
@media (max-width: 991px) {
.project-metro-card .project-content-wrap {
padding: 50px 35px;
}
}
@media (max-width: 767px) {
.project-metro-card .project-content-wrap {
padding: 45px 25px;
}
}
@media (max-width: 576px) {
.project-metro-card .project-content-wrap {
padding: 30px 15px;
}
}
.project-metro-card .project-content-wrap .project-content h3 {
margin-bottom: 20px;
}
.project-metro-card .project-content-wrap .project-content h3 a {
color: var(--white-color);
font-family: var(--font-manrope);
font-size: 30px;
font-weight: 600;
line-height: 1.2;
letter-spacing: 0.05em;
transition: 0.5s;
}
@media (min-width: 1200px) and (max-width: 1399px) {
.project-metro-card .project-content-wrap .project-content h3 a {
font-size: 25px;
}
}
@media (max-width: 767px) {
.project-metro-card .project-content-wrap .project-content h3 a {
font-size: 28px;
}
}
@media (max-width: 576px) {
.project-metro-card .project-content-wrap .project-content h3 a {
font-size: 25px;
}
}
.project-metro-card .project-content-wrap .project-content h3 a:hover {
color: var(--primary-color1);
}
.project-metro-card .project-content-wrap .project-content ul {
padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
gap: 10px;
flex-wrap: wrap;
}
.project-metro-card .project-content-wrap .project-content ul li {
display: flex;
}
.project-metro-card .project-content-wrap .project-content ul li a {
color: rgba(255, 255, 255, 0.6);
font-family: var(--font-dmsans);
font-size: 12px;
font-weight: 500;
line-height: 1;
padding: 5px 14px;
border-radius: 15px;
border: 1px solid rgba(255, 255, 255, 0.3);
transition: 0.5s;
}
.project-metro-card .project-content-wrap .project-content ul li a:hover {
background-color: var(--primary-color1);
border-color: var(--primary-color1);
color: var(--white-color);
}
.project-metro-card::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(var(--black-color-opc), 0.2);
transition: 0.5s;
transform: scaleY(1);
opacity: 1;
transform-origin: top;
}
.project-metro-card:hover::before {
transform: scaleY(0);
opacity: 0;
}
.project-metro-card:hover .project-content-wrap {
transform: scaleY(1);
opacity: 1;
}
.project-metro-card.two .project-content-wrap {
padding: 40px 35px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.project-metro-card.two .project-content-wrap {
padding: 40px 25px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.project-metro-card.two .project-content-wrap {
padding: 35px 20px;
}
}
@media (max-width: 991px) {
.project-metro-card.two .project-content-wrap {
padding: 35px 20px;
}
}
.project-metro-card.two .project-content-wrap .project-content h3 a {
font-size: 28px;
}
@media (min-width: 1400px) and (max-width: 1599px) {
.project-metro-card.two .project-content-wrap .project-content h3 a {
font-size: 26px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.project-metro-card.two .project-content-wrap .project-content h3 a {
font-size: 26px;
}
}
@media (max-width: 991px) {
.project-metro-card.two .project-content-wrap .project-content h3 a {
font-size: 26px;
}
}
@media (max-width: 576px) {
.project-metro-card.two .project-content-wrap .project-content h3 a {
font-size: 25px;
}
} .job-form-modal .modal-dialog {
max-width: 872px;
width: 100%;
}
@media (max-width: 991px) {
.job-form-modal .modal-dialog {
max-width: 720px;
}
}
@media (max-width: 576px) {
.job-form-modal .modal-dialog {
width: auto;
}
}
.job-form-modal .modal-dialog .modal-content {
margin-top: 50px;
border: none;
position: relative;
border-radius: 20px;
}
@media (max-width: 576px) {
.job-form-modal .modal-dialog .modal-content {
border-radius: 10px;
}
}
.job-form-modal .modal-dialog .modal-content .modal-header {
padding: 35px 20px;
border-bottom: 1px solid var(--borders-color);
background-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/innerpages/job-form-modal-header-bg.png), linear-gradient(180deg, var(--primary-color1) 0%, var(--primary-color1) 100%);
background-size: cover;
background-repeat: no-repeat;
border-radius: 20px 20px 0 0;
text-align: center;
}
@media (max-width: 576px) {
.job-form-modal .modal-dialog .modal-content .modal-header {
border-radius: 10px 10px 0 0;
}
}
.job-form-modal .modal-dialog .modal-content .modal-header .modal-title {
color: var(--white-color);
font-family: var(--font-suse);
font-size: 45px;
font-weight: 600;
line-height: 1.2;
max-width: 550px;
width: 100%;
margin: 0 auto;
}
@media (max-width: 991px) {
.job-form-modal .modal-dialog .modal-content .modal-header .modal-title {
font-size: 40px;
}
}
@media (max-width: 576px) {
.job-form-modal .modal-dialog .modal-content .modal-header .modal-title {
font-size: 28px;
}
}
.job-form-modal .modal-dialog .modal-content .modal-close {
position: absolute;
top: 30px;
right: 30px;
display: flex;
align-items: center;
gap: 10px;
background-color: transparent;
border: none;
outline: none;
width: 32px;
height: 32px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background-color: #f7f9f8;
border: 1px solid var(--border-color2);
transition: 0.5s;
}
.job-form-modal .modal-dialog .modal-content .modal-close i {
color: #ff2e00;
font-size: 14px;
transition: 0.5s;
}
.job-form-modal .modal-dialog .modal-content .modal-close i::before {
font-weight: 700 !important;
}
.job-form-modal .modal-dialog .modal-content .modal-close:hover {
background-color: #ff2e00;
}
.job-form-modal .modal-dialog .modal-content .modal-close:hover i {
color: var(--white-color);
}
@media (max-width: 991px) {
.job-form-modal .modal-dialog .modal-content .modal-close {
top: 15px;
right: 20px;
}
}
@media (max-width: 576px) {
.job-form-modal .modal-dialog .modal-content .modal-close {
top: 10px;
right: 10px;
width: 28px;
height: 28px;
}
}
.job-form-modal .modal-dialog .modal-content .modal-body {
padding: 45px 110px 50px;
}
@media (max-width: 1199px) {
.job-form-modal .modal-dialog .modal-content .modal-body {
padding: 45px 90px 50px;
}
}
@media (max-width: 991px) {
.job-form-modal .modal-dialog .modal-content .modal-body {
padding: 40px 60px 45px;
}
}
@media (max-width: 767px) {
.job-form-modal .modal-dialog .modal-content .modal-body {
padding: 40px 40px 45px;
}
}
@media (max-width: 576px) {
.job-form-modal .modal-dialog .modal-content .modal-body {
padding: 35px 25px 40px;
}
}
.job-form-modal .modal-dialog .modal-content .modal-body .mb-30 {
margin-bottom: 30px;
}
@media (max-width: 991px) {
.job-form-modal .modal-dialog .modal-content .modal-body .mb-30 {
margin-bottom: 20px;
}
}
.job-form-modal .modal-dialog .modal-content .modal-body .single-info .info-title {
color: var(--title-color);
font-family: var(--font-suse);
font-size: 28px;
font-weight: 600;
line-height: 1.2;
margin-bottom: 30px;
}
@media (max-width: 991px) {
.job-form-modal .modal-dialog .modal-content .modal-body .single-info .info-title {
font-size: 26px;
margin-bottom: 25px;
}
}
@media (max-width: 576px) {
.job-form-modal .modal-dialog .modal-content .modal-body .single-info .info-title {
font-size: 24px;
margin-bottom: 20px;
}
}
.job-form-modal .modal-dialog .modal-content .modal-body .single-info .form-inner label {
font-family: var(--font-suse);
}
.job-form-modal .modal-dialog .modal-content .modal-body .single-info .form-inner textarea {
min-height: 172px;
}
.job-form-modal .modal-dialog .modal-content .modal-body .single-info .form-inner .file-upload-area {
display: flex;
align-items: center;
border: 1px solid var(--borders-color);
background-color: var(--dark-white-color);
border-radius: 5px;
position: relative;
padding: 2px 20px 2px 25px;
}
@media (max-width: 576px) {
.job-form-modal .modal-dialog .modal-content .modal-body .single-info .form-inner .file-upload-area {
padding: 2px 15px;
}
}
.job-form-modal .modal-dialog .modal-content .modal-body .single-info .form-inner .file-upload-area .icon {
min-width: 36px;
max-width: 36px;
height: 36px;
border-radius: 50%;
background-color: #f0f0f0;
display: flex;
align-items: center;
justify-content: center;
}
.job-form-modal .modal-dialog .modal-content .modal-body .single-info .form-inner .file-upload-area .custom-upload {
border: unset;
border-radius: unset;
width: 100%;
height: 50px;
line-height: 30px;
}
.job-form-modal .modal-dialog .modal-content .modal-body .single-info .form-inner .file-upload-area .custom-upload::-webkit-file-upload-button {
display: none;
}
.job-form-modal .modal-dialog .modal-content .modal-body .single-info .form-inner .file-upload-area .check-icon {
min-width: 18px;
max-width: 18px;
height: 18px;
border-radius: 50%;
background-color: var(--primary-color3);
display: flex;
align-items: center;
justify-content: center;
}
.job-form-modal .modal-dialog .modal-content .modal-body .single-info .form-inner .file-upload-area .check-icon i {
color: var(--white-color);
}
.job-form-modal .modal-dialog .modal-content .modal-body .primary-btn3 {
background-color: var(--primary-color1);
color: var(--white-color);
padding: 20px 35px;
}
.job-form-modal .modal-dialog .modal-content .modal-body .primary-btn3 svg {
stroke: var(--white-color);
}
.job-form-modal .modal-dialog .modal-content .modal-body .primary-btn3 span {
background-color: var(--black-color);
}
.job-form-modal .modal-dialog .modal-content .modal-body .primary-btn3:hover {
color: var(--white-color);
}
.job-form-modal .modal-dialog .modal-content .modal-body .primary-btn3:hover svg {
stroke: var(--white-color);
}
.project-grid-page .project-card .project-img img {
min-width: 416px;
min-height: 442px;
-o-object-fit: cover;
object-fit: cover;
} .spinner {
display: inline-block;
width: 13px;
height: 13px;
border: 2px solid #fff;
border-top: 2px solid transparent;
border-radius: 50%;
margin-right: 8px;
animation: spin 1s linear infinite;
} @keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
} .primary-btn1 .loading-text,
.primary-btn1 .default-text {
transition: opacity 0.3s ease;
}
a.primary-btn1 span.load-text {
display: flex;
align-items: center;
gap: 5px;
}
.details-content-wrapper ul.egns li {
position: relative;
padding-left: 25px;
}
.details-content-wrapper ul.egns li::before {
content: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/listtik.svg);
position: absolute;
left: 0;
top: 3px;
width: 15px;
height: 15px;
-webkit-mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/listtik.svg);
mask-image: url(//nuovaecoplast.com/wp-content/themes/matrik/assets/img/listtik.svg);
-webkit-mask-position: center;
mask-position: center;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-size: cover;
mask-size: cover;
background: var(--paragraph-color);
font-family: var(--font-unbounded);
margin-right: 5px;
}
.project-info-flow-page .project-info-flow-card a img {
width: 100%;
min-height: 467px;
-o-object-fit: cover;
object-fit: cover;
}
@media (min-width: 992px) and (max-width: 1199px) {
.project-info-flow-page .project-info-flow-card a img {
min-height: 350px;
}
}
@media (max-width: 991px) {
.project-info-flow-page .project-info-flow-card a img {
min-height: 350px;
}
}
.project-metro-page .project-metro-card .project-img img {
min-width: 953px;
min-height: 794px;
-o-object-fit: cover;
object-fit: cover;
}
.project-metro-page .project-metro-card.two .project-img img {
min-width: 476px;
min-height: 397px;
-o-object-fit: cover;
object-fit: cover;
}
.project-horizontal-page .project-slider-area .project-card .project-img img {
min-height: 450px;
min-width: 424px;
-o-object-fit: cover;
object-fit: cover;
}
.home1-project-section .project-slider-area .project-card .project-img img {
min-height: 450px;
min-width: 424px;
-o-object-fit: cover;
object-fit: cover;
}
.home5-project-section .project-card3 a img {
min-width: 416px;
min-height: 442px;
-o-object-fit: cover;
object-fit: cover;
}
.home6-project-section .project-slider-area .project-card4 .project-img img {
min-width: 381px;
min-height: 401px;
-o-object-fit: cover;
object-fit: cover;
}
.home1-feature-section .feature-wrap .single-feature svg {
height: 60px;
width: 60px;
}
.career-page .career-img-grp-wrapper .career-center-img-wrap .career-center-img .overlay svg {
width: 126px;
height: 82px;
}
@media (min-width: 992px) {
body.header-four-large-margin {
margin-left: 90px !important;
}
}
.post-not-found {
max-width: 600px;
margin: 0 auto;
margin-top: 60px;
}
.post-not-found img {
height: 90px;
margin-bottom: 20px;
}
.post-not-found .inner-cnt h3 {
font-size: 34px;
font-weight: 700;
}
.post-not-found .inner-cnt p {
font-family: var(--font-dmsans);
font-size: 20px;
font-weight: 400;
line-height: 30px;
}
.post-not-found .search-group .form-inner2 {
display: flex;
justify-content: center;
align-items: center;
}
.post-not-found .search-group .form-inner2 input {
width: 50%;
padding: 8px 20px;
color: var(--title-color);
font-family: var(--font-dmsans);
font-size: 12px;
height: 45px;
border: 1px solid rgba(var(--black-color-opc), 0.3);
border-right: unset;
}
.post-not-found .search-group .form-inner2 button {
background-color: var(--primary-color1);
min-width: 90px;
height: 45px;
display: inline-flex;
align-items: center;
justify-content: center;
overflow: hidden;
position: relative;
z-index: 1;
color: var(--white-color);
font-size: 20px;
margin-left: 0px;
}
.progress-wrap.progress-header_two svg.progress-circle {
stroke: var(--primary-color2);
}
.progress-wrap.progress-header_two .arrow {
fill: var(--primary-color2);
}
.progress-wrap.progress-header_two:hover {
background-color: var(--primary-color2);
}
.progress-wrap.progress-header_two:hover .arrow {
fill: var(--white-color);
}
.progress-wrap.progress-header_three svg.progress-circle,
.progress-wrap.progress-header_four svg.progress-circle {
stroke: var(--primary-color2);
}
.progress-wrap.progress-header_three .arrow,
.progress-wrap.progress-header_four .arrow {
fill: var(--primary-color2);
}
.progress-wrap.progress-header_three:hover,
.progress-wrap.progress-header_four:hover {
background-color: var(--primary-color2);
}
.progress-wrap.progress-header_three:hover .arrow,
.progress-wrap.progress-header_four:hover .arrow {
fill: var(--white-color);
}
.progress-wrap.progress-header_five svg.progress-circle {
stroke: var(--primary-color3);
}
.progress-wrap.progress-header_five .arrow {
fill: var(--primary-color3);
}
.progress-wrap.progress-header_five:hover {
background-color: var(--primary-color3);
}
.progress-wrap.progress-header_five:hover .arrow {
fill: var(--white-color);
}
.progress-wrap.progress-header_six svg.progress-circle {
stroke: var(--primary-color5);
}
.progress-wrap.progress-header_six .arrow {
fill: var(--primary-color5);
}
.progress-wrap.progress-header_six:hover {
background-color: var(--primary-color5);
}
.progress-wrap.progress-header_six:hover .arrow {
fill: var(--white-color);
}