:root {
--bs-gray: #514f5e;
--bs-success: #5bdf91;
--bs-warning: #f9662e;
--bs-danger: #f96d80;
--bs-light: #f7f6ff;
--bs-white: #fff;
--bs-dark: #1e1e2a;
--bs-secondary-border: #b9b9bf;
--bs-light-border: #eae9f5;
--bs-dark-border: #8b8a99;
--bs-box-shadow: 0 8px 16px rgba(48, 47, 58, 0.1);
--theme-color: #ef682f;
--theme-dark-color: #df602a;
--facebook-color: #3c5b9b;
--twitter-color: #fff;
--linkedin-color: #027ba5;
--youtube-color: #f70000;
--instagram-color: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%);
--whatsapp-color: #00cf4d;
}
body {
background: #fff;
color: #363636;
font-family: Rubik, sans-serif;
font-size: 14px;
overflow-x: hidden
}
h1,
h2,
h3,
h4,
h5,
h6 {
color: #0c0c0c;
margin: 0 0 15px;
font-family: Nunito, sans-serif
}
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
color: #0c0c0c
}
p a {
color: #363636
}
p a:hover {
text-decoration: underline;
outline: 0
}
p {
letter-spacing: .5px;
margin-bottom: 10px;
line-height: 24px;
font-size: 14px;
color: #363636
}
a {
color: #7f7f7f;
text-decoration: none;
outline: 0
}
a:active,
a:focus,
a:hover {
outline: 0;
text-decoration: none
}
img {
max-width: 100%;
height: auto
}
blockquote {
padding: 0;
border: 0
}
label {
color: #7f7f7f;
display: block;
font-weight: 400;
margin: 0
}
textarea {
border-radius: 0 !important;
background: #fff;
resize: none;
height: 100px !important
}
input,
input[type=date],
input[type=email],
input[type=number],
input[type=tel],
input[type=text],
input[type=time],
select,
textarea {
border-radius: 0;
background: #fff;
box-shadow: none;
padding: 0 10px;
box-sizing: border-box
}
input[type=file] {
width: 100%;
padding: 0;
font-size: 12px;
margin: 0;
border: 0
}
.form-control::-moz-placeholder {
color: #555
}
.form-control:focus::-moz-placeholder {
color: #ef682f
}
select.form-control {
-webkit-appearance: auto;
-moz-appearance: auto;
appearance: auto;
height: 38px;
border-radius: 0
}
.form-control:focus {
border-color: #ef682f;
box-shadow: none
}
h2 {
font-size: 26px;
text-transform: uppercase;
font-weight: 700
}
h3 {
font-size: 20px;
margin: 0 0 30px;
font-weight: 700
}
h4 {
font-size: 16px;
font-weight: 700;
margin: 0;
color: #fff
}
@media (min-width:1200px) {
.container {
max-width: 1200px
}
}
/* .header {
float: left;
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 10;
background-color: #fff
} */
.header {
float: left;
width: 100%;
position: relative;
}
.header .topbar {
background: #1e1e2a;
margin-bottom: 5px;
padding-right: 7%;
padding-left: 15px
}
.header .topbar .connect_option {
padding: 0;
margin-bottom: 0
}
.header .topbar .login {
border: 0;
font-size: 16px;
color: #fff;
padding: 10px;
line-height: 38px
}
.header .topbar .connect_option>li {
padding: 0 2px;
margin: 0;
position: relative;
list-style: none;
line-height: 30px
}
.header .topbar .connect_option>li a {
display: block;
line-height: normal
}
.header .topbar .connect_option>li a.facebook {
display: inline-block;
width: 42px;
background: #ef682f;
border-radius: 0;
line-height: 40px;
text-align: center;
font-size: 18px;
color: #fff
}
.header .topbar .connect_option>li a.twitter {
display: inline-block;
width: 42px;
background: #ef682f;
border-radius: 0;
line-height: 40px;
text-align: center;
font-size: 18px;
color: #fff
}
.header .topbar .connect_option>li a.youtube {
display: inline-block;
width: 42px;
background: #ef682f;
border-radius: 0;
line-height: 40px;
text-align: center;
font-size: 18px;
color: #fff
}
.header .topbar .connect_option>li a.tiktok {
display: inline-block;
width: 42px;
background: #ef682f;
border-radius: 0;
line-height: 40px;
text-align: center;
font-size: 18px;
color: #fff
}
.header .topbar .connect_option>li a span,
.header .topbar .connect_option>li a svg {
display: inline-block
}
.header .topbar .connect_option>li a span:hover {
color: #ef682f
}
.header .topbar .connect_option>li a.wanted span:hover {
color: #fff
}
.header .topbar .connect_option {
padding: 0
}
.header .topbar .connect_option>li {
float: left;
position: relative;
margin: 0
}
.header .topbar .connect_option>li:first-child {
margin: 0
}
.header .topbar .connect_option>li:first-child::before {
content: ""
}
.header .topbar .facebook:hover {
background: #3c5899
}
.header .topbar .twitter:hover {
background: #5ea9dd
}
.header .topbar .linkedin:hover {
background: #0077b5
}
.header .topbar .linkedin {
color: #0077b5
}
.header .topbar .youtube:hover {
background: #ee1c1b
}
.header .topbar .pinterest:hover {
background: #ee1c1b
}
.wanted {
font-size: 15px;
color: #fff;
background: #ef682f;
animation: blink 1s linear infinite;
padding: 11px 18px
}
@keyframes blink {
0% {
opacity: 1
}
50% {
opacity: 1;
background: #c70202
}
100% {
opacity: 1
}
}
.wanted:hover {
background: #ef682f;
color: #fff
}
.wanted:focus {
background: #ef682f;
color: #fff
}
.header .topbar .search-bar-holder .search-bar {
margin: 0;
min-width: 100%
}
.header .topbar .search-bar-holder .form-control {
height: 30px;
line-height: 30px;
background: #fff;
font-size: 13px
}
.header .topbar .search-bar-holder .form-control::-moz-placeholder {
color: #fff
}
.header .topbar .search-bar-holder .search-bar .search_btn {
height: 100%;
padding: 0 18px;
line-height: 40px;
background: #ef682f;
color: #fff;
border: 0;
border-left: 1px solid rgba(0, 0, 0, .1);
border-radius: 0;
height: 40px
}
.header .topbar .search-bar-holder .search-bar .search_btn:hover {
background: #333
}
.header .topbar .search-bar {
position: relative;
color: #656565;
float: right
}
.header .topbar .search-bar .form-control {
height: 40px;
background: #3d3d51;
color: #fff;
border: 0;
width: 95%;
padding-left: 15px
}
.header .topbar .search-bar .search_btn {
position: absolute;
right: 0;
top: 0;
padding: 11px;
cursor: pointer
}
.header .topbar .search-bar-holder a {
margin: 10px 20px 0 0;
float: right;
font-size: 13px;
color: #656565;
font-weight: 100
}
.header .topbar .search-bar-holder a i {
margin: 0 5px 0 0
}
.header_right {
float: right;
width: 100%;
margin: 0;
padding: 0;
text-align: right
}
.header .navigation {
float: right;
width: 100%;
position: relative;
background: #fff;
padding-right: 65px
}
.header.stricky-fixed {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 999;
background: #fff;
-webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, .1);
box-shadow: 0 3px 5px rgba(0, 0, 0, .1);
animation-name: fadeInDown;
animation-duration: 1s;
animation-fill-mode: both
}
@keyframes fadeInDown {
from {
opacity: 0;
transform: translate3d(0, -100%, 0)
}
to {
opacity: 1;
transform: none
}
}
.header .menu_wrapper {
background: #fff;
position: relative
}
.header .logo {
padding: 14px 15px 20px;
background: #fff;
text-align: center;
border-right: 1px solid #eee
}
.header.stricky-fixed .logo {
padding: 14px 15px 20px
}
.header .logo a {
display: block
}
.header .logo img {
z-index: 999;
position: relative;
max-width: 120px;
height: auto
}
.navigation .nav-header {
display: none;
padding: 12px 20px
}
.navigation .navbar button {
float: right;
width: 40px;
height: 40px;
background: #ef682f;
border: 0;
outline: 0;
color: #fff;
font-size: 25px;
border-radius: 0;
display: inline-block;
text-align: center;
line-height: 40px;
position: relative;
z-index: 99;
padding: 5px;
position: relative;
transition: .5s ease-in-out;
cursor: pointer
}
.navigation .navbar button span {
display: block;
position: absolute;
height: 3px;
width: 70%;
background: #fff;
border-radius: 9px;
opacity: 1;
left: 15%;
transition: .25s ease-in-out
}
.navigation .navbar button span:first-child {
top: 8px
}
.navigation .navbar button span:nth-child(2),
.navigation .navbar button span:nth-child(3) {
top: 18px
}
.navigation .navbar button span:nth-child(4) {
top: 28px
}
.navigation .navbar button.open span:first-child {
top: 18px;
width: 0%;
left: 50%
}
.navigation .navbar button.open span:nth-child(2) {
transform: rotate(45deg)
}
.navigation .navbar button.open span:nth-child(3) {
transform: rotate(-45deg)
}
.navigation .navbar button.open span:nth-child(4) {
top: 18px;
width: 0%;
left: 50%
}
.navigation .menu {
width: 100%;
display: flex;
align-items: center;
justify-content: center
}
.navigation .menu ul {
margin: 0;
padding: 0;
display: flex;
align-items: center;
margin-left: auto
}
.navigation .menu ul li {
display: inline-block;
position: relative
}
.navigation .menu ul li a {
padding: 12px 10px;
display: block;
color: #333;
transition: all .3s ease;
font-size: 14px;
background: 0 0
}
.navigation .menu ul li.active a,
.navigation .menu ul li:hover a {
color: #ef682f;
background: 0 0
}
.navigation .menu ul li ul.cs-dropdown {
position: absolute;
width: 240px;
display: none;
z-index: 99999;
box-shadow: 0 6px 6px 0 rgba(0, 0, 0, .4);
background: #fff;
margin: 0;
padding: 0;
transition: all .3s ease;
top: 100%;
left: 0;
text-align: left;
display: none
}
.navigation .menu ul li:hover ul.cs-dropdown {
display: block
}
.navigation .menu ul li ul.cs-dropdown li {
position: relative;
display: block;
padding: 0;
border-bottom: 1px solid #eee;
width: 100%
}
.navigation .menu ul li ul.cs-dropdown li:last-child {
border: 0
}
.navigation .menu ul li ul.cs-dropdown li a {
color: #333;
font-size: 13px;
padding: 8px 15px;
position: relative;
display: block;
text-transform: capitalize;
transition: none;
font-weight: 400;
line-height: normal;
}
.navigation .menu ul li ul.cs-dropdown li a:hover {
color: #fff;
background: #ef682f
}
.navigation .menu ul li ul.cs-dropdown li:hover a {
color: #fff;
background: #ef682f
}
.navigation .menu ul li:hover ul.cs-dropdown li ul.cs-dropdown {
display: none;
left: 100%;
top: 0
}
.navigation .menu ul li:hover ul.cs-dropdown li:hover ul.cs-dropdown {
display: block
}
.navigation .menu ul li ul.cs-dropdown li:hover ul.cs-dropdown li a {
background: #fff;
color: #333
}
.navigation .menu ul li ul.cs-dropdown li:hover ul.cs-dropdown li a:hover {
color: #fff;
background: #ef682f
}
.navigation .menu ul li:hover ul.cs-dropdown li:hover ul.cs-dropdown li ul.cs-dropdown {
display: none;
left: 100%;
top: 0
}
.navigation .menu ul li:hover ul.cs-dropdown li:hover ul.cs-dropdown li:hover ul.cs-dropdown {
display: block
}
.navigation ul li.cs-submenu a button {
border: 0;
background: 0 0;
outline: 0;
padding: 0;
margin: 0 0 0 3px;
color: #333
}
.navigation ul li.cs-submenu.active a button {
color: #333
}
.navigation ul li.cs-submenu a button svg {
width: 14px;
height: 14px;
transition: all .3s ease
}
.navigation ul li.cs-submenu:hover svg {
transform: rotateZ(180deg)
}
.navigation ul li.cs-submenu:hover button {
color: #ef682f
}
.navigation ul li.cs-submenu ul.cs-dropdown li a button {
float: right;
color: #333
}
.navigation ul li.cs-submenu ul.cs-dropdown li a button svg {
transform: rotateZ(-90deg)
}
.navigation ul li.cs-submenu:hover ul.cs-dropdown li.cs-submenu:hover button {
color: #fff
}
.navigation ul li.cs-submenu:hover ul.cs-dropdown li.cs-submenu:hover ul.cs-dropdown li.cs-submenu button {
color: #333
}
.navigation ul li.cs-submenu:hover ul.cs-dropdown li.cs-submenu:hover ul.cs-dropdown li.cs-submenu:hover button {
color: #fff
}
.navigation .navbar {
display: none;
padding: 12px 0;
margin: 0
}
.navigation .menu ul li:nth-child(2) ul.cs-dropdown {
width: 480px
}
.navigation .menu ul li:nth-child(2) ul.cs-dropdown li {
width: 50%;
float: left;
position: relative
}
.navigation .menu ul li:nth-child(2) ul.cs-dropdown li:nth-child(2n) {
border-left: 1px solid #eee
}
.navigation .menu ul li:nth-child(2) ul.cs-dropdown li ul.cs-dropdown {
width: 200px
}
.navigation .menu ul li:nth-child(2) ul.cs-dropdown li ul.cs-dropdown li {
width: 100%
}
.navigation .menu ul li:nth-child(2) ul.cs-dropdown li:nth-child(6) ul.cs-dropdown {
width: 200px
}
.navigation .menu ul li:nth-child(2) ul.cs-dropdown li:nth-child(6) ul.cs-dropdown li {
width: 100%
}
.navigation .menu ul li:nth-child(3) ul.cs-dropdown {
width: 480px
}
.navigation .menu ul li:nth-child(3) ul.cs-dropdown li {
width: 50%;
float: left;
position: relative
}
.navigation .menu ul li:nth-child(3) ul.cs-dropdown li:nth-child(2n) {
border-left: 1px solid #eee
}
.navigation .menu ul li:nth-child(3) ul.cs-dropdown li ul.cs-dropdown {
width: 200px;
max-height: 350px;
overflow: hidden;
overflow-y: auto;
}
.navigation .menu ul li:nth-child(3) ul.cs-dropdown li ul.cs-dropdown li {
width: 100%
}
.navigation .menu ul li:nth-child(4) ul.cs-dropdown {
width: 240px;
}
.navigation .menu ul li:nth-child(4) ul.cs-dropdown li {
width: 100%;
float: left;
position: relative
}
.navigation .menu ul li:nth-child(6) ul.cs-dropdown {
width: 480px;
left: -200%
}
.navigation .menu ul li:nth-child(6) ul.cs-dropdown li {
width: 50%;
float: left;
position: relative
}
.navigation .menu ul li:nth-child(6) ul.cs-dropdown li:nth-child(2n) {
border-left: 1px solid #eee
}
.navigation .menu ul li:nth-child(6) ul.cs-dropdown li ul.cs-dropdown {
width: 480px;
left: -200%
}
.navigation .menu ul li:nth-child(6) ul.cs-dropdown li ul.cs-dropdown li {
width: 50%;
float: left
}
.navigation .menu ul li:nth-child(6) ul.cs-dropdown li ul.cs-dropdown li ul.cs-dropdown {
width: 200px
}
.navigation .menu ul li:nth-child(6) ul.cs-dropdown li ul.cs-dropdown li ul.cs-dropdown li {
width: 100%
}
.navigation .menu ul li:nth-child(9) {
display: none
}
.navigation .menu ul li:nth-child(7) ul.cs-dropdown li ul.cs-dropdown {
left: auto;
right: 100%;
}
.home_slider {
float: left;
width: 100%;
margin: 0;
padding: 0
}
.home_slider img {
width: 100%
}
.carousel-control-next,
.carousel-control-prev {
top: 50%;
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
line-height: 40px;
padding: 0;
transform: translate(0, -50%);
color: #fff;
font-size: 14px;
outline: 0;
background: #ef682f;
border-radius: 100%;
border: 1px solid #ef682f;
text-align: center;
cursor: pointer;
transition: all .3s ease;
z-index: 9;
position: absolute;
opacity: 1;
left: inherit
}
.carousel-control-next-icon,
.carousel-control-prev-icon {
background-size: 70%
}
.carousel-control-prev {
left: 5%
}
.carousel-control-next {
right: 5%
}
.slide video.w-100.d-block {
height: 565px
}
.custom_uniforms {
float: left;
width: 100%;
margin: 0;
padding: 30px 0 0
}
#custom {
float: left;
width: 100%;
margin: 0;
padding: 0
}
.custom_uniforms .custom_item {
border: 1px solid #eee;
border-radius: 6px;
background-color: #fafafe;
padding: 8px 2px;
height: 115px;
text-align: center;
background-color: rgba(255, 255, 255, .9);
transition: all .3s ease;
margin: 0 12px;
text-align: center;
display: block;
box-shadow: 0 0 4px 0 rgba(0, 0, 0, .1)
}
.custom_uniforms .custom_item .custom_img {
position: relative;
height: 60px;
width: 100%;
margin-bottom: 5px
}
.custom_uniforms .custom_item .custom_img img {
position: absolute;
top: 50%;
left: 50%;
max-width: 100%;
transform: translate(-50%, -50%);
max-height: 100%;
width: auto;
filter: grayscale(1)
}
.custom_uniforms .custom_item .custom_title {
text-transform: capitalize;
margin: 0;
padding: 0;
color: #0c0c0c;
font-family: Nunito, sans-serif;
font-size: 14px;
font-weight: 500;
line-height: 1.1
}
.custom_uniforms .custom_item:hover .custom_title {
color: #ef682f
}
.custom_uniforms .custom_item:hover .custom_img img {
filter: grayscale(0)
}
#custom .owl-next,
#custom .owl-prev {
line-height: 0;
position: absolute;
top: 50%;
display: block;
width: 40px;
height: 40px;
line-height: 40px;
padding: 0;
transform: translate(0, -50%);
cursor: pointer;
color: #fff;
font-size: 14px;
border: 0;
outline: 0;
background: #1e1e2a;
border-radius: 100%;
z-index: 50;
border: 1px solid #1e1e2a;
text-align: center;
cursor: pointer;
transition: all .3s ease
}
#custom .owl-nav .owl-prev {
left: -50px;
top: 48%
}
#custom .owl-nav .owl-next {
right: -50px;
top: 48%
}
#custom .owl-nav .owl-next:hover,
#custom .owl-nav .owl-prev:hover {
background: #ef682f;
color: #fff;
border-color: #ef682f
}
.offer_banner_v1 {
float: left;
width: 100%;
margin: 0;
padding: 40px 0;
background: #fff
}
.offer_banner_v1 .offer-item {
float: left;
width: 100%;
position: relative;
z-index: 1;
min-height: 240px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
margin-bottom: 30px
}
.offer_banner_v1 .offer-item:after {
position: absolute;
content: '';
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
background: linear-gradient(10deg, rgba(17, 17, 17, .70196) 0, rgba(17, 17, 17, .01) 99%, #111 100%)
}
.offer_banner_v1 .offer-item .offer-content {
padding: 30px
}
.offer_banner_v1 .offer-item .offer-content span.span {
color: #ef682f;
margin-bottom: 10px;
text-transform: capitalize;
font-size: 14px
}
.offer_banner_v1 .offer-item .offer-content h3 {
color: #fff;
padding-right: 15%;
font-size: 25px;
margin-bottom: 15px
}
.offer_banner_v1 .offer-item .offer-content .h3_title {
color: #fff;
padding-right: 15%;
font-size: 25px;
margin-bottom: 15px;
font-weight: 700;
overflow: hidden;
font-family: Nunito, sans-serif;
line-height: 1.1
}
.main-btn {
display: inline-block;
position: relative;
padding: 14px 45px;
font-size: 14px;
font-weight: 400;
color: #fff;
background: #ef682f;
text-transform: capitalize;
border-radius: 28px;
z-index: 1;
transition: all .5s ease;
background: -webkit-linear-gradient(0deg, #f25743, #ef682f 50%);
letter-spacing: .5px
}
.main-btn:before {
position: absolute;
content: '';
background: #fff;
width: 0%;
height: 100%;
top: 0;
right: 0;
border-radius: 5px;
z-index: -1;
transition: all .5s ease
}
.offer-item:hover .main-btn {
color: #333
}
.offer_banner_v1 .offer-item:hover .main-btn:after {
content: url('data:image/svg+xml;charset=utf-8,')
}
.offer_banner_v1 .offer-item:hover .offer-content h3 {
color: #ef682f
}
.offer-item:hover .main-btn:before {
width: 100%;
left: 0
}
.offer_banner_v1 .offer-item .offer-content .main-btn {
padding: 6px 17px;
font-size: 14px;
line-height: 23px
}
.home_about {
float: left;
width: 100%;
margin: 0;
padding: 0;
background: #eee;
padding-bottom: 30px;
padding: 30px 0
}
.home_about .title {
font-size: 30px;
font-weight: 700
}
.home_about p {
font-size: 16px;
font-weight: 600;
text-align: center;
color: #333;
margin: 0;
padding: 0;
font-weight: 100;
line-height: 26px
}
.home_about p:last-child {
margin-bottom: 30px
}
.p-0 {
padding: 0 !important
}
.services-item {
margin-bottom: 10px;
text-align: center;
padding: 30px 15px;
-webkit-transition: .5s;
transition: .5s;
position: relative;
z-index: 1;
background-color: #fff;
-webkit-box-shadow: 5px 13px 25px -14px #e1e0e0;
box-shadow: 5px 13px 25px -14px #e1e0e0
}
.services-item:before {
position: absolute;
content: '';
width: 100%;
height: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ef682f;
-webkit-transition: .5s;
transition: .5s;
z-index: -1
}
.services-item:after {
position: absolute;
content: '';
width: 1px;
height: 80%;
top: 30px;
right: 0;
background-color: #e1e1e1
}
.services-item.right-border:after {
display: none
}
.services-item:hover:before {
height: 100%
}
.services-item:hover h3 {
color: #fff
}
.services-item:hover span {
color: #fff
}
.services-item:hover h3:hover {
color: #fff
}
.services-item:hover p {
color: #fff
}
.services-item img {
display: inline-block;
max-width: 80px;
width: 100%;
height: 80px;
padding: 15px;
line-height: 100px;
text-align: center;
color: #18253e;
border: 1px solid #f18f66;
border-radius: 4px;
margin-bottom: 20px;
-webkit-transition: .5s;
transition: .5s
}
.services-item h3 {
font-size: 18px;
margin-bottom: 12px
}
.services-item span {
font-size: 16px;
margin-bottom: 12px;
font-weight: 500;
display: inherit;
height: 45px;
letter-spacing: .5px;
line-height: 20px
}
.services-item .feature_title_1 {
font-size: 18px;
margin-bottom: 12px;
color: #ef682f;
font-weight: 700;
font-family: Nunito, sans-serif
}
.services-item:hover .feature_title_1 {
color: #fff
}
.services-item:hover span:hover {
color: #fff
}
.services-item h3 {
color: #ef682f
}
.services-item span {
color: #ef682f
}
.services-item p {
margin-bottom: 0 !important;
-webkit-transition: .5s;
transition: .5s
}
.mt30 {
margin-bottom: 20px
}
.main-btn:after {
float: right;
margin-left: 10px;
font-size: 14px;
margin-top: 3px;
width: 16px;
height: 16px;
content: url('data:image/svg+xml;charset=utf-8,')
}
.theme-btn {
position: relative;
display: inline-block;
font-size: 14px;
line-height: 40px;
font-weight: 400;
color: #fff !important;
padding: 1px 15px;
text-align: center;
cursor: pointer;
border-radius: 5px;
z-index: 1;
transition: all .5s ease;
background: -webkit-linear-gradient(0deg, #f25743, #ef682f 50%);
letter-spacing: .5px;
height: 40px
}
.theme-btn svg {
position: relative;
width: 22px;
height: 22px;
line-height: 30px;
font-weight: 400;
margin-left: 10px
}
.theme-btn:before {
position: absolute;
content: '';
background: #1e1e2a;
width: 0%;
height: 100%;
top: 0;
right: 0;
border-radius: 5px;
z-index: -1;
transition: all .5s ease
}
.theme-btn:hover:before {
width: 100%;
left: 0
}
.video-btn {
position: relative;
display: inline-block;
padding: 0 0 0 70px;
font-size: 20px;
line-height: 25px;
color: #1e1e2a;
text-transform: uppercase;
max-width: 330px
}
.video-btn span {
position: absolute;
left: 0;
top: 2px;
width: 54px;
height: 54px;
line-height: 54px;
font-size: 20px;
color: #fff;
text-align: center;
border-radius: 50%;
-webkit-box-shadow: 0 0 0 5px rgba(242, 87, 67, .2);
background: #ef682f;
display: flex;
align-items: center;
justify-content: center
}
.video-btn span:after {
width: 54px;
height: 54px;
border-radius: 50%;
background: 0 0;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
-webkit-animation-delay: .9s;
animation-delay: .9s;
content: "";
position: absolute;
-webkit-animation: ripple 3s infinite;
animation: ripple 3s infinite;
-webkit-transition: all .4s ease;
transition: all .4s ease
}
@-webkit-keyframes ripple {
70% {
-webkit-box-shadow: 0 0 0 10px rgba(242, 87, 67, .1);
box-shadow: 0 0 0 10px rgba(242, 87, 67, .1)
}
100% {
-webkit-box-shadow: 0 0 0 0 rgba(242, 87, 67, .1);
box-shadow: 0 0 0 0 rgba(242, 87, 67, .1)
}
}
@keyframes ripple {
70% {
-webkit-box-shadow: 0 0 0 10px rgba(242, 87, 67, .1);
box-shadow: 0 0 0 10px rgba(242, 87, 67, .1)
}
100% {
-webkit-box-shadow: 0 0 0 0 rgba(242, 87, 67, .1);
box-shadow: 0 0 0 0 rgba(242, 87, 67, .1)
}
}
.video-btn span svg {
width: 30px;
height: 30px
}
.home_about_video {
float: left;
width: 100%;
position: relative;
background: #fff;
padding: 0 0 40px
}
.home_about_video .title {
color: #fff;
margin-bottom: 20px
}
.home_about_video .video_bg {
float: left;
width: 100%;
position: relative;
background: #ef682f;
z-index: 0;
padding: 40px 0 220px;
z-index: 2
}
.home_about_video .section_header {
position: relative;
text-align: center;
z-index: 99
}
.home_about_video .section_header p {
font-size: 18px;
color: #fff;
display: inline-block;
margin-bottom: 15px;
text-align: center
}
.home_about_video .about_video_info {
margin: -200px auto 0;
position: relative;
z-index: 1;
background: #fff;
z-index: 2;
margin-bottom: 30px;
max-width: 900px
}
.home_about_video .about_video_info.noMargin {
margin: 8px auto 0
}
.home_about_video .about_video_info .theme-btn {
padding: 10px 20px;
font-size: 16px
}
.play_btn_1 {
color: #ef682f;
font-size: 30px;
left: 50%;
padding-left: 7px;
position: absolute;
top: 50%;
transform: translateX(-50%) translateY(-50%);
z-index: 1;
width: 90px;
height: 90px;
line-height: 90px;
border-radius: 100%;
text-align: center;
background: rgba(255, 255, 255, .6);
display: flex;
align-items: center;
justify-content: center
}
.play_btn_1:before {
content: "";
position: absolute;
z-index: 0;
left: 50%;
top: 50%;
transform: translateX(-50%) translateY(-50%);
display: block;
width: 80px;
height: 80px;
background: #fff repeat scroll 0 0;
border-radius: 100%;
animation: pulse-border 1.5s ease-out infinite
}
.play_btn_1:after {
content: "";
position: absolute;
z-index: 1;
left: 50%;
top: 50%;
transform: translateX(-50%) translateY(-50%);
display: block;
width: 80px;
height: 80px;
background: rgba(255, 255, 255, .2) repeat scroll 0 0;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 100%;
transition: all .2s;
-webkit-transition: all .2s;
-moz-transition: all .2s;
-ms-transition: all .2s;
-o-transition: all .2s;
border: 1px solid #ef682f
}
@-webkit-keyframes pulse-border {
0% {
transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
opacity: 1
}
100% {
transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
opacity: 0
}
}
@keyframes pulse-border {
0% {
transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
opacity: 1
}
100% {
transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
opacity: 0
}
}
.play_btn_1 svg {
position: relative;
z-index: 3;
color: #ef682f;
width: 45px;
height: 45px
}
.home_video_gallery {
float: left;
width: 100%;
margin: 0;
padding: 40px 0;
background: url(../images/video-bg.png) center center/cover no-repeat
}
.home_video_gallery .title:before {
background: #fff
}
.home_video_gallery .video_box {
float: left;
width: 100%;
margin: 0 0 30px;
padding: 10px;
background: #fff;
border-radius: 6px;
overflow: hidden;
box-shadow: 0 8px 16px 0 rgb(7 28 31 / 4%)
}
.home_video_gallery .video_box a {
text-decoration: none
}
.home_video_gallery .video_image {
position: relative
}
.home_video_gallery .video_image .video-btn {
position: absolute;
display: flex;
align-items: center;
justify-content: center;
padding: 0;
font-size: 20px;
line-height: 25px;
color: #1e1e2a;
text-transform: uppercase;
left: 42%;
top: 35%;
transform: translate(-35%, -42%)
}
.home_video_gallery .video_image .video-btn svg {
background: rgba(239, 104, 74, .9);
width: 30px;
height: 30px
}
.home_video_gallery .video_info .h4 {
color: #2b2a37;
font-size: 16px;
font-weight: 500;
line-height: 20px;
text-align: center;
padding: 0;
margin: 10px 0 0;
height: 45px;
position: relative
}
.video_info .h4 span {
position: absolute;
top: 50%;
left: 50%;
max-width: 100%;
transform: translate(-50%, -50%);
width: 100%;
height: auto;
max-height: 100%
}
.video_box:hover .video_info .h4 {
color: #ef682f
}
.video_box:hover a {
text-decoration: none
}
.customer {
font-size: 16px;
color: #ef682f;
font-weight: 500;
letter-spacing: .5px
}
.popular_products {
float: left;
width: 100%;
margin: 0;
padding: 40px 0;
background: #fff
}
.title {
width: 100%;
color: #ef682f;
font-size: 25px;
text-transform: uppercase;
font-weight: 700;
display: block;
padding-bottom: 15px;
text-align: center;
margin-bottom: 30px;
position: relative;
font-family: Nunito, sans-serif
}
.title:before {
content: '';
background: #2b2a37;
position: absolute;
left: 0;
right: 0;
bottom: 0;
margin-bottom: -10px;
width: 50px;
height: 5px;
margin: 0 auto
}
.popular_products .maxWidth p {
color: #333;
}
#popular {
float: left;
width: 100%;
position: relative;
margin-bottom: 20px
}
.popular_product {
float: left;
width: 100%;
background: #fff;
position: relative;
overflow: hidden
}
.popular_product .popular_product_image {
position: relative;
height: 280px;
text-align: center;
background: #fdfdfd;
overflow: hidden;
margin-bottom: 10px
}
.popular_product .popular_product_image:before {
content: '';
position: absolute;
background: linear-gradient(to top, rgba(0, 0, 0, .82) 10%, rgba(0, 0, 0, .35) 80%);
top: 0;
bottom: 0;
left: 0;
width: 100%;
border-radius: 5px;
z-index: 1
}
.popular_product .popular_product_image:hover:before {
background: linear-gradient(to top, rgba(0, 0, 0, .3) 10%, rgba(0, 0, 0, .5) 80%)
}
.popular_product .popular_product_image .image {
-webkit-transition: .5s ease-in;
transition: .5s ease-in;
height: 100%
}
.popular_product .popular_product_image .image img {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: auto;
max-width: 100%;
max-height: 100%
}
.popular_product:hover .popular_product_image .image {
-webkit-transform: scale(1.03);
transform: scale(1.03)
}
.popular_product .popular_product_title {
width: calc(100% - 10%);
float: left;
text-align: center;
position: absolute;
left: 5%;
bottom: 10%;
z-index: 99
}
.popular_product .popular_product_title h3 {
margin: 0 0 10px;
padding: 0;
font-size: 18px;
font-weight: 600;
text-transform: uppercase;
color: #fff;
text-shadow: 1px 1px 0 rgba(0, 0, 0, .8)
}
.popular_product .popular_product_title span {
color: #fff;
font-size: 14px;
padding: 12px 30px;
display: inline-block;
border-radius: 2px;
text-transform: capitalize;
line-height: normal;
overflow: hidden;
position: relative;
z-index: 1;
background: -webkit-linear-gradient(0deg, #f25743, #ef682f 50%);
letter-spacing: .5px
}
.popular_product .popular_product_title span:before {
position: absolute;
content: '';
background: #1e1e2a;
width: 0%;
height: 100%;
top: 0;
right: 0;
z-index: -1;
transition: all .5s ease
}
.popular_product:hover .popular_product_title span:before {
width: 100%;
left: 0
}
.popular_product .popular_product_title span i {
margin-left: 10px
}
.popular_product:hover .popular_product_title h3 {
color: #ef682f
}
#popular .owl-next,
#popular .owl-prev {
line-height: 0;
position: absolute;
top: 50%;
display: block;
width: 40px;
height: 40px;
line-height: 40px;
padding: 0;
transform: translate(0, -50%);
cursor: pointer;
color: #fff;
font-size: 14px;
border: 0;
outline: 0;
background: #1e1e2a;
border-radius: 100%;
z-index: 50;
border: 1px solid #1e1e2a;
text-align: center;
cursor: pointer;
transition: all .3s ease
}
#popular .owl-nav .owl-prev {
left: -50px;
top: 48%
}
#popular .owl-nav .owl-next {
right: -50px;
top: 48%
}
#popular .owl-nav .owl-next:hover,
#popular .owl-nav .owl-prev:hover {
background: #ef682f;
color: #fff;
border-color: #ef682f
}
.chooseus-style-two {
float: left;
position: relative;
width: 100%;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
background-attachment: fixed;
background-image: url(../images/chooseus-bg.jpg);
padding: 20px 0;
}
.chooseus-style-two:before {
position: absolute;
content: '';
background: #030306;
width: 100%;
height: 100%;
left: 0;
top: 0;
right: 0;
opacity: .9
}
.chooseus-style-two .row {
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap
}
.align-items-center {
-ms-flex-align: center !important;
align-items: center !important
}
.sec-title {
position: relative;
display: block;
margin-bottom: 30px
}
.sec-title h6 {
position: relative;
display: inline-block;
font-size: 18px;
line-height: 24px;
text-transform: uppercase;
font-weight: 700;
margin-bottom: 5px;
padding-left: 25px;
color: #ef682f
}
.sec-title h6 i {
position: absolute;
font-size: 20px;
line-height: 20px;
left: 0;
top: 1px;
font-weight: 400;
color: #ef682f
}
.sec-title h2 {
position: relative;
display: block;
font-size: 40px;
line-height: 48px;
font-weight: 700;
text-transform: capitalize
}
.sec-title h2 span {
font-weight: 400
}
.sec-title.light h2 {
color: #fff
}
#content_block_five {
margin-bottom: 15px
}
#content_block_five .content-box {
position: relative;
overflow: hidden;
border-radius: 12px
}
#content_block_five .content-box:before {
content: '';
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0
}
#content_block_five .content-box .video-btn {
color: #fff;
position: absolute;
top: 45%;
left: 44%;
margin: 0;
padding: 0
}
#content_block_five .content-box .sec-title {
margin-bottom: 39px
}
#content_block_six .content-box {
position: relative;
display: block;
padding: 0;
margin-left: 100px
}
#content_block_six .content-box .single-item {
position: relative;
display: inline-block;
width: 50%;
float: left
}
#content_block_six .content-box .single-item .inner-box {
position: relative;
display: block;
overflow: hidden;
text-align: center
}
#content_block_six .content-box .single-item .inner-box .box {
position: relative;
display: block;
background: #2b2a37;
padding: 40px 15px 38px 15px
}
#content_block_six .content-box .single-item:nth-child(2) .inner-box .box,
#content_block_six .content-box .single-item:nth-child(3) .inner-box .box {
background: #393847
}
#content_block_six .content-box .single-item .inner-box .box .icon-box img {
position: relative;
display: inline-block;
width: 80px;
line-height: 80px;
color: #fff;
margin-bottom: 17px
}
#content_block_six .content-box .single-item .inner-box .box h4 {
position: relative;
display: block;
font-size: 18px;
font-weight: 500;
color: #fff;
margin: 0;
text-transform: capitalize
}
#content_block_six .content-box .single-item .inner-box .overlay-box {
position: absolute;
display: block;
background: #2b2a37;
padding: 2px;
z-index: 1;
left: 0;
top: 20px;
right: 0;
opacity: 0;
transition: all .5s ease
}
#content_block_six .content-box .single-item .inner-box:hover .overlay-box {
opacity: 1;
top: 0
}
#content_block_six .content-box .single-item .inner-box .overlay-box:before {
position: absolute;
content: '';
width: 100%;
height: 100%;
left: 0;
top: 0;
right: 0;
z-index: -1
}
#content_block_six .content-box .single-item .inner-box .overlay-box .overlay-inner {
position: relative;
background: #fff;
padding: 40px 15px 35px 15px
}
#content_block_six .content-box .single-item:nth-child(2) .inner-box .overlay-box .overlay-inner,
#content_block_six .content-box .single-item:nth-child(3) .inner-box .overlay-box .overlay-inner {
background: #fff
}
#content_block_six .content-box .single-item .inner-box .overlay-box .overlay-inner .icon-box img {
position: relative;
display: inline-block;
width: 80px;
line-height: 80px;
margin-bottom: 14px;
color: transparent;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent
}
#content_block_six .content-box .single-item .inner-box .overlay-box .overlay-inner p {
position: relative;
display: block;
font-size: 16px;
font-weight: 500;
color: #ef682f;
padding: 15px 0;
margin: 0;
text-transform: capitalize;
letter-spacing: .5px
}
.home_products {
float: left;
width: 100%;
margin: 0;
padding: 40px 0;
background: #fff
}
.home_products .maxWidth p {
color: #333;
}
.hot_key_box {
float: left;
width: 100%;
margin: 0 0 30px;
padding: 0;
border: 1px solid #e5e5e5;
position: relative;
background: #fff
}
.hot_key_box .col-md-4.padding_0 {
border-right: 1px solid #e5e5e5;
height: 509px
}
.hot_key_box .col-md-4.padding_0.border_1 {
border-right: 0px solid #e5e5e5;
height: auto
}
.hot_key_box .col-md-4:nth-child(4) .item_product_1 {
border-bottom: 0
}
.hot_key_box .col-md-4.border_1:nth-child(3) .item_product_1 {
border-right: 0
}
.hot_key_box .col-md-6.border_1:nth-child(2) .item_product_1 {
border-right: 0
}
.hot_key_box .col-md-6.border_1:nth-child(3) .item_product_1 {
border-bottom: 0
}
.hot_key_box .padding_0 {
padding: 0
}
.hot_key_box .col_2 .border_1:nth-child(2) .item_product_1 {
border-right: 0
}
.hot_key_box .col_2 .border_1:nth-child(3) .item_product_1 {
border-bottom: 0
}
.hot_key_box .border_1:nth-child(5) .item_product_1 {
border-bottom: 0
}
.hot_key_box .border_1:nth-child(6) .item_product_1 {
border-bottom: 0
}
.hot_key_box .border_1:nth-child(7) .item_product_1 {
border-bottom: 0
}
.hot_key_box .border_1:last-child .item_product_1 {
border: 0
}
.item_product_1 {
padding: 15px;
border: 1px solid #e5e5e5;
border-top: 0;
border-left: 0
}
.item_product_1 .product_thumb {
overflow: hidden;
position: relative;
z-index: 10;
display: block;
height: auto;
aspect-ratio: 1
}
.item_product_1 .product_thumb:before {
background: linear-gradient(to top, rgba(0, 0, 0, .82) 10%, rgba(0, 0, 0, .35) 80%);
bottom: 0;
content: "";
left: 0;
opacity: 0;
position: absolute;
right: 0;
top: 0;
transition: all .5s ease-out 0s;
-webkit-transition: all .5s ease-out 0s;
z-index: 2
}
.item_product_1:hover .product_thumb:before {
opacity: 1
}
.item_product_1 .product_thumb img {
position: absolute;
top: 50%;
left: 50%;
max-width: 100%;
transform: translate(-50%, -50%);
max-height: 100%;
transition: all .5s ease-out 0s;
-webkit-transition: all .5s ease-out 0s;
z-index: 1
}
.item_product_1 .product_thumb .buy_new_link {
bottom: 15px;
color: #fff;
left: 0;
position: absolute;
right: 0;
text-align: center;
text-transform: capitalize;
transform: translateY(50px);
-webkit-transform: translateY(50px);
z-index: 9;
transition: all .5s ease-out 0s;
-webkit-transition: all .5s ease-out 0s
}
.item_product_1 .product_thumb .buy_new_link span {
display: inline-block;
position: relative;
padding: 5px 20px;
color: #fff;
background: -webkit-linear-gradient(0deg, #f25743, #ef682f 50%);
border-radius: 4px;
font-size: 16px;
z-index: 1;
transition: all .5s ease;
background: -webkit-linear-gradient(0deg, #f25743, #ef682f 50%)
}
.item_product_1 .product_thumb .buy_new_link span:before {
position: absolute;
content: '';
background: #1e1e2a;
width: 0%;
height: 100%;
top: 0;
right: 0;
z-index: -1;
transition: all .5s ease
}
.item_product_1:hover .product_thumb .buy_new_link span:before {
width: 100%;
left: 0
}
.item_product_1:hover .product_thumb .buy_new_link {
transform: translateY(0);
-webkit-transform: translateY(0)
}
.item_product_1 .product-title {
margin: 0;
padding-top: 10px;
padding-bottom: 4px;
position: relative;
z-index: 10;
color: #2b2a37;
font-size: 16px;
line-height: 24px;
display: block;
overflow: hidden;
text-align: center;
text-overflow: ellipsis;
white-space: nowrap;
transition: all .5s ease-out 0s;
-webkit-transition: all .5s ease-out 0s;
font-weight: 500
}
.item_product_1 .product-title span {
margin: 0;
padding: 0
}
.item_product_1:hover .product-title {
color: #ef682f
}
.home_working_section {
float: left;
width: 100%;
margin: 0;
padding: 40px 0
}
.home_working_section {
position: relative;
padding-top: 50px;
width: 100%;
background: #1e1e2a;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
background-attachment: fixed
}
.home_working_section .inner-content {
float: left;
width: 100%;
position: relative;
margin: 0 0 30px;
z-index: 1
}
.home_working_section .sec-title {
margin-bottom: 90px
}
.home_working_section .working-block {
padding: 0 15px;
width: 20%
}
.home_working_section .title:before {
background: #fff
}
.working-block-one .inner-box {
position: relative;
display: block;
background: #fff;
padding: 0 14px 15px 15px;
margin-top: 90px;
min-height: 275px;
box-shadow: 0 10px 20px rgba(0, 0, 0, .1);
transition: all .5s ease
}
.working-block-one .inner-box:hover {
transform: translateY(-15px)
}
.working-block-one {
position: relative;
text-align: center
}
.working-block-one:before {
position: absolute;
font-size: 20px;
line-height: 24px;
top: 70px;
right: -26px;
color: #ef682f;
width: 20px;
height: 20px;
content: url('data:image/svg+xml;charset=utf-8,')
}
.home_working_section .working-block:last-child .working-block-one:before {
content: none
}
.working-block-one .inner-box .icon-box {
position: relative;
display: inline-block;
width: 140px;
height: 140px;
line-height: 140px;
text-align: center;
border-radius: 50%;
border: 2px dashed #ef682f;
padding: 5px;
margin-top: -90px;
margin-bottom: 19px
}
.working-block-one .inner-box .icon-box .count-box {
position: absolute;
top: 8px;
right: -12px;
width: 50px;
height: 50px;
line-height: 50px;
font-size: 18px;
font-weight: 700;
color: #fff;
border-radius: 50%;
border: 3px solid #fff;
background: #ef682f;
z-index: 2
}
.working-block-one .inner-box .icon-box .icon {
position: absolute;
display: inline-block;
left: 3px;
top: 3px;
width: 130px;
height: 130px;
line-height: normal;
font-size: 60px;
color: #fff;
text-align: center;
border-radius: 50%;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
z-index: 1;
overflow: hidden
}
.working-block-one .inner-box .icon-box .icon:before {
position: absolute;
content: '';
width: 100%;
height: 100%;
left: 0;
top: 0;
right: 0;
border-radius: 50%;
z-index: -1;
transition: all .5s ease;
background: #ef682f
}
.working-block-one .inner-box .lower-content {
text-align: center
}
.working-block-one .inner-box .lower-content p {
height: 75px;
display: flex;
align-items: center;
justify-content: center
}
.working-block-one .inner-box .lower-content span {
margin-bottom: 12px;
text-align: center;
font-size: 16px;
display: block;
font-weight: 500;
height: 48px;
display: flex;
align-items: center;
justify-content: center
}
.working-block-one .inner-box .lower-content .pattern-layer {
position: relative;
display: block;
max-width: 62px;
width: 100%;
height: 9px;
margin: 0 auto;
margin-bottom: 23px;
background-repeat: no-repeat;
-webkit-transition: all .5s ease;
-moz-transition: all .5s ease;
-ms-transition: all .5s ease;
-o-transition: all .5s ease;
transition: all .5s ease;
background: url(../images/line-4.png)
}
.working-block-one .inner-box:hover .lower-content .pattern-layer {
filter: grayscale(0%);
-webkit-filter: grayscale(0%);
-moz-filter: grayscale(0%);
-o-filter: grayscale(0%);
-ms-filter: grayscale(0%)
}
.home_testimonial {
float: left;
width: 100%;
margin: 0;
padding: 40px 0;
background: #eee
}
#testimonial {
float: left;
width: 100%;
margin: 0;
padding: 0
}
.home_testimonial .testimonial-content .inner-box {
position: relative;
display: block;
background: #fff;
margin: 40px 15px 30px 15px;
padding: 20px 30px 20px 30px;
box-shadow: 0 5px 15px rgba(0, 0, 0, .05)
}
.home_testimonial .testimonial-content .inner-box .image-box {
position: absolute;
top: -40px;
right: 40px;
width: 90px;
height: 90px;
padding: 10px;
border-radius: 50%;
background: #ef682f;
border: 2px solid #ccc
}
.home_testimonial .testimonial-content .inner-box .image-box img {
width: 100%;
border-radius: 50%
}
.home_testimonial .testimonial-content .inner-box .image-box span {
position: absolute;
right: -20px;
bottom: 0;
font-size: 20px;
color: #fff;
width: 40px;
height: 40px;
line-height: 40px;
text-align: center;
border-radius: 50%;
background: #1e1e2a;
display: flex;
align-items: center;
justify-content: center
}
.home_testimonial .testimonial-content .inner-box .image-box span svg {
width: 25px;
height: 25px
}
.home_testimonial .testimonial-content .inner-box p {
font-size: 14px;
line-height: 24px;
color: #333;
font-weight: 400;
margin-bottom: 0
}
.home_testimonial .testimonial-content .inner-box h3 {
margin: 0;
font-size: 18px;
font-weight: 700;
color: #ef682f
}
.home_testimonial .testimonial-content .inner-box h4 {
margin: 0;
font-size: 18px;
font-weight: 700;
color: #ef682f;
overflow: hidden;
line-height: 1.1
}
.home_testimonial .testimonial-content .inner-box .subtitle {
font-style: italic;
font-size: 13px;
letter-spacing: .5px;
display: block;
margin-bottom: 10px;
color: #5a5a68
}
.home_testimonial .testimonial-inner {
position: relative;
margin: 0 -15px
}
.home_testimonial .sec-title {
margin-bottom: 50px
}
#testimonial .owl-next,
#testimonial .owl-prev {
line-height: 0;
position: absolute;
top: 50%;
display: block;
width: 40px;
height: 40px;
line-height: 40px;
padding: 0;
transform: translate(0, -50%);
cursor: pointer;
color: #fff;
font-size: 14px;
border: 0;
outline: 0;
background: #1e1e2a;
border-radius: 100%;
z-index: 50;
border: 1px solid #1e1e2a;
text-align: center;
cursor: pointer;
transition: all .3s ease
}
#testimonial .owl-nav .owl-prev {
left: -50px;
top: 48%
}
#testimonial .owl-nav .owl-next {
right: -50px;
top: 48%
}
#testimonial .owl-nav .owl-next:hover,
#testimonial .owl-nav .owl-prev:hover {
background: #ef682f;
color: #fff;
border-color: #ef682f
}
.home_gallery {
float: left;
width: 100%;
margin: 0;
padding: 50px 0;
background: url(../images/gallery-bg.jpg);
background-repeat: no-repeat;
background-size: 100%;
position: relative
}
.home_gallery:before {
position: absolute;
top: 0;
left: 0;
background: rgba(61, 61, 81, .93);
width: 100%;
height: 100%;
content: ''
}
.home_gallery .container {
position: relative;
z-index: 3
}
.home_gallery .title:before {
background: #fff
}
.home_gallery .portfolio_block .image-box .image {
height: 204px;
background: #fff
}
.home_gallery .portfolio_block .image-box .image img {
position: absolute
}
.home_gallery .gallery_grid {
margin: 0 auto;
width: 100%;
max-width: 940px;
text-align: center;
padding: 40px 0
}
.home_gallery .gallery_grid .gallery_item {
margin-left: 80px;
margin-top: 20px;
display: inline-block
}
.home_gallery .gallery_grid .gallery_item:first-child {
margin-left: 0
}
.home_gallery .gallery_grid .gallery_item:nth-child(9n+6) {
margin-left: 80px;
margin-top: -6px
}
.home_gallery .gallery_grid .gallery_item:nth-child(5) {
margin-left: 0
}
.home_gallery .gallery_grid .gallery_item:nth-child(n+5) {
margin-top: -40px
}
.home_gallery .gallery_grid .gallery_item .gallery_shape {
height: 170px;
width: 170px;
cursor: pointer;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
position: relative;
overflow: hidden
}
.gallery_item .gallery_image {
width: 100%;
margin: auto;
position: relative;
z-index: 1;
height: 170px;
overflow: hidden;
text-align: center;
background: #fff
}
.gallery_item .gallery_thumb {
position: absolute;
max-width: 100%;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 100%
}
.bg_b {
width: 100%;
height: 100%;
padding: 0;
-webkit-filter: blur(5px);
filter: blur(5px);
background-size: 100% !important
}
.gallery_item .gallery_thumb img {
transform: rotate(-45deg)
}
.home_gallery .gallery_grid .gallery_item .gallery_shape:after {
content: "";
position: absolute;
top: -33px;
left: -33px;
width: 220px;
height: 220px;
background: inherit;
background-size: cover;
background-repeat: no-repeat;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg)
}
.home_gallery .gallery_grid .gallery_item .gallery_shape .overlay {
background: rgba(239, 104, 47, .8);
height: 170px;
width: 170px;
color: #fff;
display: table;
position: absolute;
text-decoration: none;
-webkit-transform: rotate(0);
-moz-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
opacity: 0;
z-index: 3;
z-index: 999999;
top: 0
}
.home_gallery .gallery_grid .gallery_item .gallery_shape:hover .overlay:hover {
opacity: 1;
-webkit-opacity: 1;
-moz-opacity: 1
}
.home_gallery .gallery_grid .gallery_item .gallery_shape .text {
display: table-cell;
font-size: 13px;
text-transform: uppercase;
vertical-align: middle;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
text-align: center
}
.home_gallery .gallery_grid .gallery_item .gallery_shape .text span {
font-size: 30px;
display: inline-block
}
.home_content {
float: left;
width: 100%;
margin: 0;
padding: 40px 0;
background: #eee
}
.home_content h2 {
font-size: 18px;
margin: 0;
padding: 0 0 5px;
font-weight: 700;
color: #ef682f;
text-align: left;
text-transform: initial;
letter-spacing: .5px
}
.home_content h3 {
font-size: 20px;
margin: 0;
padding: 0 0 5px;
font-weight: 700;
color: #3d3d51;
text-align: left;
text-transform: initial
}
.home_content h4 {
font-size: 18px;
margin: 0;
padding: 0 0 5px;
font-weight: 700;
color: #3d3d51;
text-align: left;
text-transform: initial
}
.home_content h6 {
font-size: 18px;
margin: 0;
padding: 0 0 5px;
font-weight: 700;
color: #3d3d51;
text-align: left
}
.home_content p {
font-size: 14px;
line-height: 24px;
text-align: justify;
letter-spacing: .5px
}
.home_content ul {
margin: 0;
padding: 0
}
.home_content ul li {
list-style: none;
line-height: 24px;
color: #333;
font-size: 14px
}
.home_content ul li::before {
content: "\f0da";
font-family: FontAwesome;
margin-right: 5px
}
.home_worldwide {
float: left;
width: 100%;
margin: 0;
padding: 50px 0 0;
position: relative;
background-color: #3d3d51
}
.home_worldwide:before {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: '';
background: rgba(0, 0, 0, .6)
}
.home_worldwide .container {
position: relative;
z-index: 2
}
.home_worldwide .title:before {
background: #fff
}
.home_worldwide p {
font-size: 18px;
line-height: 28px;
color: #fff;
max-width: 800px;
margin: 0 auto;
text-align: center;
font-weight: 600
}
.home_worldwide ul {
float: left;
width: 100%;
margin: 0;
padding: 0;
text-align: center;
min-height: 550px
}
.home_worldwide li {
display: inline-block;
list-style: none;
position: relative
}
.home_worldwide li:first-child {
position: absolute;
left: 20%;
top: 15%
}
.home_worldwide li:nth-child(2) {
position: absolute;
left: 25%;
top: 35%
}
.home_worldwide li:nth-child(3) {
position: absolute;
bottom: 25%;
left: 33%
}
.home_worldwide li:nth-child(4) {
position: absolute;
top: 40%;
left: 50%
}
.home_worldwide li:nth-child(5) {
position: absolute;
bottom: 20%;
right: 44%
}
.home_worldwide li:nth-child(6) {
position: absolute;
top: 21%;
left: 49%
}
.home_worldwide li:nth-child(7) {
position: absolute;
top: 40%;
right: 38%
}
.home_worldwide li:nth-child(8) {
position: absolute;
top: 10%;
right: 25%
}
.home_worldwide li:nth-child(9) {
position: absolute;
top: 35%;
right: 30%
}
.home_worldwide li:nth-child(10) {
position: absolute;
bottom: 15%;
right: 11%
}
.home_worldwide li:nth-child(11) {
position: absolute;
bottom: 41%;
right: 20%
}
.home_worldwide li:nth-child(12) {
position: absolute;
top: 18%;
right: 40%
}
.home_worldwide li:last-child {
position: absolute;
right: 2%;
bottom: 3%
}
.home_worldwide li img {
width: 30px
}
.home_blog {
float: left;
width: 100%;
margin: 0;
padding: 40px 0
}
.news-block-one .inner-box {
float: left;
width: 100%;
position: relative;
display: block;
background: #fff;
box-shadow: 0 10px 20px rgba(0, 0, 0, .1);
transition: all .5s ease
}
.news-block-one .inner-box:hover {
box-shadow: 0 10px 20px rgba(0, 0, 0, .2)
}
.news-block-one .inner-box .image-box {
position: relative;
display: block;
overflow: hidden;
height: auto;
aspect-ratio: 1;
text-align: center;
border: 1px solid #eee
}
.news-block-one .inner-box .image-box:before {
position: absolute;
content: '';
background: #1e1e2a;
width: 50%;
height: 0%;
left: 0;
bottom: 0;
opacity: .9;
z-index: 1;
transition: all .5s ease
}
.news-block-one .inner-box .image-box:after {
position: absolute;
content: '';
background: #1e1e2a;
width: 50%;
height: 0%;
right: 0;
top: 0;
opacity: .9;
transition: all .5s ease
}
.news-block-one .inner-box:hover .image-box:after,
.news-block-one .inner-box:hover .image-box:before {
height: 100%
}
.news-block-one .inner-box .image-box img {
position: absolute;
top: 50%;
left: 50%;
max-width: 100%;
transform: translate(-50%, -50%);
max-height: 100%;
width: auto
}
.news-block-one .inner-box .image-box .category {
position: absolute;
right: 0;
bottom: 0
}
.news-block-one .inner-box .image-box .category p {
position: relative;
display: inline-block;
font-size: 13px;
letter-spacing: .5px;
font-weight: 400;
color: #fff;
padding: 4px 19px;
text-align: center;
z-index: 1;
border-top-left-radius: 15px;
background: #ef682f;
margin: 0
}
.news-block-one .inner-box .image-box .category p i {
position: relative;
color: #fff;
margin-right: 8px
}
.news-block-one .inner-box .lower-content {
position: relative;
padding: 23px 30px 0 30px
}
.news-block-one .inner-box .lower-content h3 {
font-size: 18px;
line-height: 24px;
margin-bottom: 12px;
font-weight: 700
}
.news-block-one .inner-box .lower-content h5 {
font-size: 18px;
line-height: 24px;
margin-bottom: 12px;
font-weight: 700;
overflow: hidden;
color: #0c0c0c;
height: 72px;
display: flex;
align-items: center
}
.news-block-one .inner-box .lower-content h3 a {
color: #1e1e2a
}
.news-block-one:hover .inner-box .lower-content h3 a {
color: #ef682f
}
.news-block-one .inner-box .lower-content h5 a {
color: #1e1e2a
}
.news-block-one:hover .inner-box .lower-content h5 a {
color: #ef682f
}
.news-block-one .inner-box .lower-content .post-info {
position: relative;
display: block;
margin-bottom: 17px
}
.news-block-one .inner-box .lower-content .post-info li {
position: relative;
display: inline-block;
font-size: 14px;
color: #5a5a68;
font-weight: 500;
padding-right: 18px;
margin-right: 3px
}
.news-block-one .inner-box .lower-content .post-info li:before {
position: absolute;
content: "||";
font-size: 14px;
color: #c4c4c4;
top: -2px;
right: 0
}
.news-block-one .inner-box .lower-content .post-info li:last-child {
padding: 0;
margin: 0
}
.news-block-one .inner-box .lower-content .post-info li:last-child:before {
display: none
}
.news-block-one .inner-box .lower-content .post-info li i {
position: relative;
font-size: 13px;
margin-right: 8px
}
.news-block-one .inner-box .lower-content p {
font-size: 14px;
font-weight: 400;
line-height: 24px;
color: #333;
height: 100px;
overflow: hidden
}
.news-block-one .inner-box .lower-content .upper-box {
position: relative;
padding-bottom: 22px;
border-bottom: 1px solid #e3e3e3
}
.mt30_1 {
margin-top: 30px
}
.footer {
float: left;
width: 100%;
padding: 40px 0 20px;
background: #1e1e2a;
position: relative
}
.footer p {
color: #fff;
font-size: 14px;
font-weight: 300
}
.footer .address-list li {
color: #fff;
margin-bottom: 7px;
font-size: 14px;
font-weight: 300;
letter-spacing: .5px;
display: flex
}
.footer .address-list li svg {
margin-right: 10px;
vertical-align: middle;
width: 18px;
height: 18px;
min-width: 18px
}
.footer .shop-social li svg {
color: #fff;
width: 30px;
height: 30px;
padding: 8px;
font-size: 16px;
text-align: center;
background: #414040
}
.footer .shop-social li svg:hover {
background: #353535
}
.footer h2.thumb-headline {
color: #ef682f;
font-size: 20px;
font-weight: 700;
margin-bottom: 15px;
text-transform: capitalize
}
.footer .thumb-headline a {
color: #ef682f
}
.footer .thumb-headline {
color: #ef682f;
font-size: 16px;
font-weight: 500;
margin-bottom: 15px;
text-transform: capitalize;
letter-spacing: .5px
}
.footer .thumb-headline a {
color: #ef682f
}
.footer h6 {
color: #fff;
font-size: 14px;
font-weight: 600;
margin-bottom: 3px;
text-transform: uppercase
}
.simple-list {
margin-bottom: 0
}
.footer .simple-list li {
color: #fff
}
.footer .simple-list a {
color: #fff;
font-size: 14px;
font-weight: 300;
letter-spacing: .5px;
line-height: 30px
}
.footer .simple-list a:hover {
color: #ef682f
}
.footer .address-list li a {
color: #ef682f;
font-weight: 600
}
.copyright {
float: left;
margin: 0;
width: 100%;
padding: 10px 0;
border-top: none;
background: #13131c
}
.copyright p {
color: #bbb;
font-size: 14px;
margin: 0;
line-height: 24px
}
.copyright a {
color: #ef682f
}
.sponsors-icons {
margin-bottom: 0
}
.sponsors-icons i {
color: #fff;
font-size: 40px
}
.follow-us {
display: block;
padding: 0;
float: left;
margin: 0;
text-align: left
}
.follow-us li {
display: inline-block;
padding-left: 5px;
font-size: 18px;
float: left
}
.follow-us li a i {
color: #fff;
width: 35px;
height: 35px;
border: 1px solid #9f9e9e;
text-align: center;
line-height: 32px
}
.follow-us li a .fa-facebook:hover {
background: #496eb4;
border: 1px solid #496eb4
}
.follow-us li a .fa-twitter:hover {
background: #3cf;
border: 1px solid #3cf
}
.follow-us li a .fa-linkedin:hover {
background: #0274b3;
border: 1px solid #0274b3
}
.follow-us li a .fa-youtube:hover {
background: #e12428;
border: 1px solid #e12428
}
.follow-us li a svg {
color: #fff;
width: 35px;
height: 35px;
padding: 8px;
border: 1px solid #9f9e9e;
text-align: center;
line-height: 35px
}
#scroll-up {
position: fixed;
z-index: 8030;
bottom: 10px;
right: 30px;
width: 46px;
height: 46px;
border-radius: 50%;
color: #fff;
font-size: 25px;
line-height: 42px;
text-align: center;
text-decoration: none;
cursor: pointer;
transition: all .25s;
display: none;
background: #ff5c00
}
#scroll-up svg {
width: 22px;
height: 22px
}
#scroll-up:hover {
background: #111
}
.whatapp_btn {
background: #01e675;
width: 50px;
height: 50px;
color: #fff;
position: fixed;
left: 15px;
bottom: 105px;
cursor: pointer;
z-index: 999;
border-radius: 100%;
display: flex;
align-items: center;
justify-content: center;
transition: all .3s ease-in-out;
box-shadow: 0 3px 10px rgba(0, 0, 0, .16), 0 3px 10px rgba(0, 0, 0, .16)
}
.whatapp_btn svg {
width: 24px;
height: 24px
}
.whatapp_btn:focus,
.whatapp_btn:hover {
background: #01e675;
color: #fff
}
#whatsapp .modal-dialog {
margin-top: 10%;
max-width: 600px
}
#whatsapp .btn-close {
position: absolute;
top: 10px;
right: 10px
}
#whatsapp .modal-content .modal-title {
margin: 0;
line-height: normal;
padding: 0 0 15px;
color: #ef682f;
font-weight: 600;
text-transform: inherit;
font-size: 16px
}
#whatsapp .modal-content .alert {
padding: 10px 10px;
font-size: 12px
}
.cs_container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
width: 100%;
margin: 0 auto;
justify-content: center
}
.cs_container .csPanel {
width: 52%;
display: table-cell;
background-color: #fff;
padding: 20px
}
.cs_container .csPanel:last-child {
background-color: #fff;
color: #333;
width: 48%;
padding: 0
}
.form-group {
margin-bottom: 15px
}
.form-control {
font-size: 13px
}
.send_enquiry {
border-radius: 40px;
bottom: 45px;
color: #fff;
display: table;
height: 50px;
left: 15px;
min-width: 50px;
position: fixed;
text-align: center;
z-index: 999;
transition: all .2s linear;
background: -webkit-linear-gradient(0deg, #f25743, #ef682f 50%);
display: flex;
align-items: center;
justify-content: center
}
.send_enquiry svg {
width: 24px;
height: 24px;
line-height: 50px
}
.send_enquiry:hover {
color: #fff;
padding: 0 20px
}
.send_enquiry:focus {
color: #fff
}
.send_enquiry span {
display: table-cell;
vertical-align: middle;
font-size: 15px;
letter-spacing: -15px;
opacity: 0;
font-weight: 600;
line-height: 50px;
transition: all .5s;
text-transform: uppercase
}
.send_enquiry:hover span {
opacity: 1;
letter-spacing: 1px;
padding-left: 10px
}
#sendenquiry .btn-close {
position: absolute;
top: 10px;
right: 10px
}
#sendenquiry .modal-content .modal-title {
margin: 0;
line-height: normal;
padding: 0 0 15px;
color: #ef682f;
font-weight: 600;
text-transform: inherit;
font-size: 16px
}
#sendenquiry .cs_container .csPanel {
width: 50%;
display: table-cell;
background-color: #fff;
padding: 20px
}
#sendenquiry .cs_container .csPanel .alert {
padding: 10px 10px;
font-size: 12px
}
#sendenquiry .cs_container .csPanel .alert strong {
font-weight: 400
}
#sendenquiry .cs_container .csPanel:last-child {
color: #fff;
background: #fff;
width: 50%;
padding: 0
}
.intl-tel-input,
.iti {
width: 100%;
height: 38px
}
.g-recaptcha {
transform: scale(.7);
transform-origin: 0 0;
-webkit-transform-origin: 0 0
}
.modal_submit {
border: 0;
padding: 0 30px;
font-size: 16px;
font-weight: 400;
max-width: 150px
}
.blog_listing {
position: relative;
overflow: hidden;
float: left;
width: 100%;
margin-bottom: 20px;
border: 1px solid #ccc;
border-radius: 12px;
}
.blog_listing:last-child {
border: 0
}
.blog_listing .blog_thumb {
float: left;
position: relative;
margin-right: 20px;
overflow: hidden;
max-width: 100%;
aspect-ratio: 1/1;
border-right: 1px solid #ccc;
width: calc(100% - 70%)
}
.blog_listing .blog_thumb img {
width: 100%;
height: 100%;
aspect-ratio: 1/1;
object-position: center;
object-fit: contain;
}
.blog_listing .blog_content {
float: left;
padding: 0;
position: relative;
width: calc(100% - 34%);
padding: 15px 0;
}
.blog_listing .title_small {
font-size: 16px;
line-height: normal;
margin-bottom: 10px;
position: relative;
text-transform: inherit
}
.blog_listing h2.title_small span {
color: #1c1c1c;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100%;
max-height: 100%
}
.blog_listing:hover h2.title_small span {
color: #ef682f
}
.blog_listing p {
color: #333
}
.blog_listing .blog_meta {
margin: 3px 0 10px
}
.blog_listing .blog_meta span {
font-size: 12px;
color: #333;
margin-right: 8px;
padding-right: 10px;
border-right: 1px solid #dedede;
line-height: 12px;
display: inline-block
}
.blog_listing .blog_meta span i {
font-size: 14px
}
.blog_listing .blog_meta span.post_date {
border-right: 0
}
.blog_read_more_btn {
position: relative;
font-size: 14px;
color: #fff;
text-transform: capitalize;
font-weight: 500;
padding: 10px 30px;
border-radius: 5px;
display: inline-block;
transition: all .5s ease;
background: -webkit-linear-gradient(0deg, #f25743, #ef682f 50%);
margin-bottom: 5px;
z-index: 1;
text-align: center;
cursor: pointer
}
.blog_read_more_btn:before {
position: absolute;
content: '';
background: #1e1e2a;
width: 0%;
height: 100%;
top: 0;
right: 0;
border-radius: 5px;
z-index: -1;
transition: all .5s ease
}
.blog_read_more_btn:hover:before {
width: 100%;
left: 0
}
.title_details {
color: #ef682f;
font-weight: 700;
font-size: 20px;
line-height: 29px;
margin: 0;
padding: 0;
padding-bottom: 5px;
position: relative;
text-transform: capitalize
}
.blog_meta_info {
float: left;
width: 100%;
line-height: 1.2
}
.blog_meta_info ul {
display: inline-block;
flex-wrap: wrap;
list-style: none;
margin: 0 0 15px;
padding: 0;
line-height: 1.2
}
.blog_meta_info ul li a {
font-weight: 600;
font-size: 14px;
display: inline-block
}
.blog_meta_info ul li {
display: inline-block;
color: rgba(10, 10, 10, .7);
font-size: 13px;
text-transform: capitalize
}
.sharethis-inline-share-buttons {
float: left;
width: 100%;
margin-bottom: 15px
}
.blog_details .news_details_image {
float: left;
width: 100%;
margin-bottom: 15px;
padding: 0;
position: relative;
text-align: center;
height: 400px;
border: 1px solid #ccc;
border-radius: 4px;
}
.blog_details .news_details_image img {
max-width: 70%;
max-height: 100%;
width: auto
}
.blog_details p {
font-size: 15px;
line-height: 25px;
color: #333;
text-align: justify
}
.blog_details blockquote {
float: left;
width: 100%;
position: relative;
z-index: 1;
border: none;
font-size: 22px;
margin: 0;
margin-top: 30px;
margin-bottom: 30px;
padding-left: 85px;
color: #232323;
font-weight: 600;
line-height: 32px
}
.blog_details blockquote cite {
display: block;
margin-top: 15px;
color: #999;
font-weight: 500
}
.blog_details blockquote:before {
position: absolute;
left: 0;
top: 5%;
content: "";
height: 90%;
width: 3px;
background: #ef682f
}
.blog_details blockquote:after {
position: absolute;
left: 30px;
content: "\f10d";
font-family: FontAwesome;
color: #ef682f;
font-size: 30px;
top: 5px;
font-weight: 600
}
.blog_details blockquote p {
margin: 0;
position: relative;
z-index: 1;
line-height: 28px;
font-size: 18px;
font-style: italic;
font-weight: 500
}
.blog_details ul {
float: left;
width: 100%;
margin-bottom: 25px;
padding: 0
}
.blog_details ul li {
margin-bottom: 10px;
color: #333;
position: relative;
z-index: 1;
font-size: 15px;
padding-left: 25px;
display: block
}
.blog_details ul li:after {
position: absolute;
left: 0;
top: 0;
content: url("data:image/svg+xml;charset=utf-8,");
color: #ef682f;
font-weight: 600;
font-size: 15px
}
.blog_details ol {
float: left;
width: 100%;
margin-bottom: 25px;
padding: 0
}
.blog_details ol li {
margin-bottom: 10px;
color: #333;
position: relative;
z-index: 1;
font-size: 15px;
padding-left: 25px;
display: block
}
.blog_details ol li:after {
position: absolute;
left: 0;
top: 0;
content: "\f00c";
height: 100%;
width: 100%;
font-family: FontAwesome;
color: #ef682f;
font-weight: 600;
font-size: 15px
}
.blog_details h2 {
font-size: 20px;
margin: 0 0 10px;
font-weight: 500;
color: #ef682f;
text-transform: inherit
}
.blog_details h3 {
float: left;
width: 100%;
font-size: 18px;
margin: 10px 0 10px;
font-weight: 600;
color: #333;
display: block
}
.blog_details h4 {
float: left;
width: 100%;
font-size: 18px;
margin: 10px 0 10px;
font-weight: 600;
color: #333;
display: block;
padding: 0
}
.blog_details h5 {
float: left;
width: 100%;
font-size: 16px;
margin: 10px 0 10px;
font-weight: 600;
color: #333;
display: block;
padding: 0
}
.share_and_comments {
float: left;
width: 100%;
margin-bottom: 20px
}
.gallery_page {
float: left;
width: 100%;
margin: 0;
padding: 40px 0;
background: #fff
}
.portfolio_block {
float: left;
width: 100%
}
.portfolio_block .image-box {
position: relative;
overflow: hidden;
margin-bottom: 20px
}
.portfolio_block .image-box .image {
margin-bottom: 0;
position: relative;
height: 280px;
border: 1px solid #eee;
transition: all .2s ease
}
.portfolio_block .image-box .image img {
position: absolute;
max-width: 100%;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
max-height: 100%
}
.portfolio_block .image-box:hover .image {
transform: scale(1.1)
}
.portfolio_block .overlay {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
text-align: center;
display: flex;
justify-content: center;
align-items: center;
z-index: 1
}
.portfolio_block .overlay .title-box {
position: absolute;
left: 0;
bottom: 0;
width: 100%;
display: flex;
z-index: -1;
flex-direction: column;
padding: 10px 15px;
transition: all .2s ease;
-webkit-transform: translateY(100%);
-moz-transform: translateY(100%);
-ms-transform: translateY(100%);
-o-transform: translateY(100%);
transform: translateY(100%)
}
.portfolio_block .image-box:hover .overlay .title-box {
bottom: 0;
-webkit-transform: translateY(0);
-moz-transform: translateY(0);
-ms-transform: translateY(0);
-o-transform: translateY(0);
transform: translateY(0)
}
.portfolio_block .overlay .title-box:before {
background-color: #ea5f1e;
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 100%;
opacity: .9;
color: #fff
}
.portfolio_block .overlay span {
position: relative;
height: 50px;
width: 50px;
background-color: #ea5f1e;
color: #fff;
font-size: 20px;
line-height: 50px;
border-radius: 50%;
opacity: 0;
text-align: center;
transform: translateY(-25px) scale(0);
transition: all .2s ease;
display: flex;
align-items: center;
justify-content: center
}
.portfolio_block .overlay span svg {
width: 22px;
height: 22px
}
.portfolio_block .image-box:hover .overlay span {
opacity: 1;
transform: translateY(-25px) scale(1)
}
.portfolio_block .overlay h5 {
font-size: 20px;
line-height: 1.2em;
color: #fff;
font-weight: 600;
display: block;
margin-bottom: 0;
position: relative
}
.video_gallery {
float: left;
width: 100%;
margin: 0 0 20px;
padding: 10px;
background: #fff;
box-shadow: 0 1px 2px rgba(0, 0, 0, .3);
transition: all .3s ease-in-out
}
.video_gallery:hover {
box-shadow: 1px 1px 10px rgba(0, 0, 0, .5);
padding-top: 2px
}
.video_gallery i {
line-height: inherit;
color: #f90;
font-size: 20px
}
.video_gallery iframe {
width: 100%;
height: 300px;
margin-bottom: 5px
}
.video_gallery h3 {
font-size: 14px;
color: #333;
padding: 0;
line-height: normal;
font-weight: 400;
margin-bottom: 0;
min-height: 55px;
height: 55px;
overflow-y: scroll;
align-items: center;
display: flex
}
.video_gallery h3 i {
width: 50px;
height: 50px;
background: #e02f2f;
border: 1px solid #ce2626;
text-align: center;
line-height: 45px;
float: left;
font-size: 30px;
color: #fff;
margin-right: 15px
}
.market {
float: left;
width: 100%;
padding: 40px 0;
margin: 0;
background: #fff
}
.technology_icon {
float: left;
width: 100%;
margin: 0;
padding: 30px 0;
background: #fff
}
.col-lg-3-1 {
float: left;
width: 20%;
position: relative;
min-height: 1px;
padding-right: 10px;
padding-left: 10px
}
.technology_item {
position: relative;
margin: 0;
padding: 15px 15px;
text-align: center;
-webkit-transition: all .3s ease-out 0s;
transition: all .3s ease-out 0s;
text-align: center;
background: #fff;
border: 1px solid #ccc;
border-radius: 10px;
box-shadow: 0 18px 24px 0 rgba(0, 0, 0, .07)
}
.technology_item:before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 0;
height: 0;
background: #ef682f;
border-radius: 10px;
transition: all .7s ease
}
.technology_item:hover:before {
width: 100%;
height: 100%
}
.technology_item.active:before {
width: 100%;
height: 100%
}
.technology_item img {
width: 50px;
-webkit-transition: all .3s ease-out 0s;
transition: all .3s ease-out 0s;
margin-bottom: 10px
}
.technology_item svg {
width: 60px;
height: 60px;
-webkit-transition: all .3s ease-out 0s;
transition: all .3s ease-out 0s;
margin-bottom: 15px;
position: relative;
color: #3d3d51
}
.technology_item.active svg,
.technology_item.active .h2_title {
color: #fff;
}
.technoTitle,
.technology_item h2 {
font-size: 12px;
font-family: Nunito, sans-serif;
font-weight: 600;
margin: 0;
-webkit-transition: all .3s ease-out 0s;
transition: all .3s ease-out 0s;
color: #3d3d51
}
.technology_item:hover h2,
.technology_item:hover i,
.technology_item.active h2 {
color: #fff
}
.technology_item:hover .technoTitle,
.technology_item:hover i,
.technology_item.active .technoTitle {
color: #fff
}
.technology_item .h2_title {
font-size: 14px;
font-weight: 600;
margin: 0;
-webkit-transition: all .3s ease-out 0s;
transition: all .3s ease-out 0s;
color: #3d3d51;
font-family: Nunito, sans-serif;
line-height: 1.1;
position: relative
}
.technology_item:hover .h2_title,
.technology_item:hover i,
.technology_item:hover svg {
color: #fff
}
.about_us_page {
float: left;
width: 100%;
margin: 0;
padding: 0 0 40px;
background: #fff
}
.left_contact {
float: left;
width: 100%;
margin: 0 0 20px;
padding: 0;
background: #eee;
background: #fff;
border: 1px solid #d9d9d9;
box-shadow: 1px 4px 5px rgba(0, 0, 0, 0.06);
border-radius: 10px;
position: sticky;
top: 94px;
}
.left_contact h2 {
background: #ef682f;
margin: 0;
padding: 10px 10px;
color: #fff;
font-size: 20px;
text-transform: uppercase
}
.label {
text-align: right;
padding-right: 10px
}
#contact-form label.error,
.output {
color: #fb3a3a;
font-weight: 400
}
.left_contact form {
padding: 0 10px 10px
}
.left_contact form select,
input,
input[type=date],
input[type=email],
input[type=number],
input[type=tel],
input[type=text],
input[type=time] {
height: 38px;
border-radius: 4px;
}
.left_submit {
display: inline-block;
padding: 10px 25px;
border-radius: 4px;
background: #423f3f;
font-size: 14px;
border: 0;
color: #fff;
text-transform: capitalize;
transition: all .3s ease 0s
}
.left_submit:hover {
background: #ef682f;
color: #fff
}
.lelf_menu {
float: left;
width: 100%;
margin: 0 0 20px;
padding: 0;
background: #eee;
background: #fff;
border: 1px solid #d9d9d9;
box-shadow: 1px 4px 5px rgba(0, 0, 0, 0.06);
border-radius: 10px;
overflow: hidden;
}
.lelf_menu h2 {
background: #ef682f;
margin: 0;
padding: 10px 10px;
color: #fff;
font-size: 18px;
text-transform: uppercase
}
.open-title {
float: left;
width: 100%;
padding: 0;
margin: 0;
line-height: 24px;
background: #fff;
font-size: 14px !important;
border-top: 1px solid #ccc
}
/* .open-title:last-child{
border: 0;
} */
.open-title a {
float: left;
width: 100%;
color: #333;
text-transform: inherit;
padding: 5px 12px
}
.open-title a:hover {
background: #ef682f;
color: #fff
}
.left_menu {
float: left;
width: 100%;
margin: 0;
padding: 0;
background: #eee
}
.left_menu li {
float: left;
width: 100%;
color: #423f3f;
list-style: none;
list-style: none;
font-size: 14px;
border-bottom: 1px solid #ccc;
position: relative
}
.left_menu li a {
color: #423f3f;
text-transform: capitalize
}
.left_menu li a:before {
float: left;
margin-right: 5px;
width: 16px;
height: 16px;
content: url('data:image/svg+xml;charset=utf-8,')
}
.left_menu li a:hover:before {
content: url('data:image/svg+xml;charset=utf-8,')
}
.left_menu li ul {
display: none;
transition: all 2s;
position: absolute;
left: 100%;
top: 0;
z-index: 200;
background: #fff;
width: 180px;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .75);
margin: 0;
padding: 0
}
.left_menu li:hover ul {
display: block;
transition: all 2s
}
.about_right {
position: relative;
width: 100%
}
.about_right h1 {
padding: 10px;
margin: 0 0 10px;
background: #ef682f;
color: #fff;
font-size: 25px;
text-transform: uppercase;
font-weight: 700
}
.about_right ul li {
letter-spacing: .5px
}
.about_right h2 {
margin: 0 0 5px;
font-size: 18px;
color: #ef682f;
text-transform: uppercase
}
.about_right h3 {
margin: 0 0 5px;
font-size: 16px;
color: #ef682f;
text-transform: uppercase
}
.about_right h4 {
margin: 0 0 5px;
font-size: 15px;
color: #ef682f;
text-transform: uppercase
}
.about_image {
float: right;
width: 320px;
margin: 0 0 15px 15px;
padding: 0
}
.about_image img {
width: 100%
}
.about_right p {
font-size: 14px;
line-height: 24px;
color: #423f3f;
text-align: justify;
margin-bottom: 15px
}
.about_right ul {
margin: 0 0 15px;
padding: 0
}
.about_right ul li {
list-style: none;
line-height: 24px;
color: #423f3f;
font-size: 14px
}
.about_right ul li::before {
width: 16px;
height: 16px;
content: url('data:image/svg+xml;charset=utf-8,');
margin-right: 5px
}
.category_page {
float: left;
width: 100%;
margin: 0;
padding: 0 0 40px
}
.cat_info {
float: left;
width: 100%;
position: relative;
width: 100%
}
.cat_info h1 {
float: left;
width: 100%;
padding: 10px;
margin: 0 0 10px;
background: #ef682f;
font-size: 20px;
color: #fff;
font-weight: 600;
text-transform: uppercase
}
.cat_info .h1_title {
float: left;
width: 100%;
padding: 10px;
margin: 0 0 10px;
background: #ef682f;
font-size: 20px;
color: #fff;
font-weight: 600;
text-transform: uppercase
}
.cat_info h2 {
margin: 0 0 5px;
font-size: 20px;
color: #ef682f;
text-transform: initial
}
.cat_info h2.h1_title {
float: left;
width: 100%;
padding: 10px;
margin: 0 0 20px;
background: #ef682f;
font-size: 20px;
color: #fff;
font-weight: 600;
text-transform: uppercase
}
.cat_info h3 {
margin: 0 0 5px;
font-size: 18px;
color: #ef682f;
text-transform: initial
}
.cat_info h4 {
margin: 0 0 5px;
font-size: 15px;
color: #ef682f;
text-transform: initial
}
.cat_image {
float: right;
max-width: 400px;
width: 100%;
margin: 0 0 15px 15px;
text-align: center
}
.cat_image a {
display: block
}
.cat_image .cat_enbtn {
width: auto;
background: #423f3f;
color: #fff !important;
text-decoration: none;
font-size: 15px;
padding: 10px 20px;
margin: 0;
display: inline-block !important;
border: 0;
border-radius: 4px
}
.cat_image .cat_enbtn:hover {
background-color: #ef682f !important;
color: #fff !important
}
.cat_image .catimage {
width: 100%;
text-align: center;
overflow: hidden;
position: relative;
height: 400px;
border: 1px solid #ccc;
margin-bottom: 15px;
border-radius: 6px
}
.cat_image .catimage img {
position: absolute;
max-width: 100%;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: auto;
max-height: 100%
}
.cat_info p {
font-size: 14px;
line-height: 24px;
color: #423f3f;
text-align: justify;
margin-bottom: 15px
}
.cat_info ul {
margin: 0 0 15px;
padding: 0
}
.cat_info ul li {
list-style: none;
line-height: 24px;
color: #423f3f;
font-size: 14px;
display: block;
position: relative;
padding-left: 20px;
}
.cat_info ul li:before {
position: absolute;
left: 0;
content: url("data:image/svg+xml;charset=utf-8,");
}
.cat_item {
float: left;
width: 100%;
margin-bottom: 15px;
padding: 0;
box-shadow: 0 3px 5px 0 rgba(210, 210, 210, .75);
transition: all .35s ease-in-out;
border: 1px solid #ccc;
border-radius: 6px;
overflow: hidden
}
.cat_item .right_content p {
font-size: 14px;
line-height: 28px
}
.right_content .buttons {
margin-bottom: 15px;
}
.cat_item .product {
position: relative;
padding: 15px 0 15px;
text-align: center;
min-height: 375px;
overflow: hidden;
border-right: 1px solid #ccc
}
.cat_item .product img {
position: absolute;
max-width: 100%;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: auto;
max-height: 100%
}
right-content {
float: left;
width: 100%;
position: relative
}
.sub_menu {
float: left;
width: 100%;
margin: 0 0 15px;
padding: 0
}
.sub_menu li {
width: 33%;
float: left;
font-size: 15px;
list-style: none
}
.sub_menu li a {
padding: 0;
color: #423f3f;
line-height: 24px;
text-decoration: none
}
.sub_menu li a::before {
width: 16px;
height: 16px;
content: url('data:image/svg+xml;charset=utf-8,');
margin-right: 5px;
position: relative;
float: left;
margin-top: 2px
}
.sub_menu li a:hover {
text-decoration: none;
color: #ef682f
}
.cat_item .right_content .title4 {
line-height: 24px;
padding: 10px 0;
text-align: left;
margin: 0;
font-size: 18px;
font-weight: 600;
text-transform: capitalize;
letter-spacing: .5px
}
.cat_item:hover .right_content .title4 a {
color: #ef682f
}
.blue-line1 {
float: left;
width: 100%;
display: block;
height: 1px;
background: #ccc;
position: relative
}
.read_more {
padding: 0 25px;
background: #423f3f;
color: #fff;
font-size: 14px;
text-decoration: none;
margin-right: 5px;
display: inline-block;
margin-bottom: 15px;
height: 45px;
line-height: 45px;
border-radius: 4px
}
.read_more:hover {
background: #ef682f;
color: #fff
}
a.read_more:focus,
a.read_more:hover {
background: #ef682f;
color: #fff
}
.right_content a.read_more:last-child {
background: #ef682f;
color: #fff
}
.modal-header {
background: #ef682f;
color: #fff;
text-align: left;
border-radius: 0;
padding: 10px 15px
}
.modal-header h5 {
color: #fff;
padding: 10px 15px;
text-align: left;
font-size: 16px;
font-weight: 700;
text-transform: uppercase
}
.modal-header h6 {
color: #fff;
padding: 10px 15px;
text-align: left;
font-size: 16px;
font-weight: 700;
text-transform: uppercase
}
.close {
float: right;
font-size: 23px;
font-weight: 600;
line-height: 2;
color: #fff;
text-shadow: 0 1px 0 #fff;
opacity: .7
}
.modal-header .close {
margin-right: 10px
}
.close:focus,
.close:hover {
color: #fff;
text-decoration: none;
cursor: pointer;
opacity: .9
}
.modal-content {
border-radius: 0
}
.image-enquire {
float: left;
width: 100%;
margin: 0;
padding: 0
}
.image-enquire img {
width: 100%;
margin-bottom: 15px;
border: 1px solid #ccc
}
.image-enquire h4 {
color: #ef682f;
font-size: 25px;
font-weight: 600;
text-transform: capitalize;
margin-bottom: 8px;
text-align: left;
padding: 0
}
.image-enquire p {
font-size: 14px;
line-height: 18px;
color: #333;
text-align: justify;
margin-bottom: 15px
}
#product_enquiry label.error {
color: #fb3a3a;
font-weight: 400
}
.breadcrumbs {
float: left;
width: 100%;
background: #f9f9f9;
position: relative;
margin: 0;
box-shadow: 0 0 5px 0 rgba(0, 0, 0, .2);
padding: 10px 0
}
.breadcrumbs a {
color: #ef682f
}
.breadcrumb li {
font-weight: 700;
text-transform: uppercase;
color: #666;
float: left;
display: inline-block;
line-height: 55px
}
.breadcrumb li a {
float: left;
padding: 0;
color: #666;
letter-spacing: .3px
}
.breadcrumb li:before {
font: normal normal normal 14px/1 FontAwesome;
font-size: inherit;
text-rendering: auto;
padding: 0 14px;
color: #fff;
display: inline-block
}
.breadcrumb li.active {
color: #1d1835
}
.breadcrumb li+li:before {
content: "\f105";
color: #fff;
padding: 0 14px
}
.breadcrumb li+li:before {
float: left;
padding: 20px 10px;
color: #bfbfbf
}
.shadow-wrapper {
z-index: 1;
position: relative
}
blockquote.hero {
border: none;
padding: 18px;
background: #f3f3f3;
border-left: solid 2px #ef682f
}
blockquote.hero p {
color: #423f3f;
font-size: 14px;
line-height: 24px
}
.box-shadow {
background: #fff;
position: relative
}
.box-shadow:after,
.box-shadow:before {
top: 80%;
left: 5px;
width: 50%;
z-index: -1;
content: "";
bottom: 15px;
max-width: 300px;
background: #999;
position: absolute
}
.shadow-effect-2 {
position: relative
}
.shadow-effect-2:after,
.shadow-effect-2:before {
transform: rotate(-3deg);
box-shadow: 0 15px 10px #999
}
.shadow-effect-2:after {
left: auto;
right: 5px;
transform: rotate(3deg)
}
.catlist {
float: left;
width: 100%;
margin-bottom: 20px
}
.catitem {
float: left;
width: 100%;
margin-bottom: 15px;
padding: 0
}
.catitem .item {
max-width: 100%;
background: #fff;
padding-bottom: 11px;
margin-bottom: 26px;
margin: 0 10px 0 0
}
.catitem .item .catItem_image {
float: left;
width: 100%;
margin: 0;
padding: 10px;
text-align: center;
border: solid 1px #ccc
}
.catitem .item .catItem_image .image {
float: left;
width: 100%;
margin-bottom: 10px;
height: 150px;
overflow: hidden
}
.catitem .item .catItem_image .image img {
vertical-align: middle;
max-width: 100%;
margin: 0 auto;
top: 0;
left: 0;
right: 0;
bottom: 0;
max-height: 100%
}
.catitem .item .catItem_image h5 {
float: left;
width: 100%;
text-transform: capitalize;
font-size: 15px;
color: #423f3f;
min-height: 35px;
vertical-align: middle
}
.catitem .item:hover .catItem_image h5 {
color: #ef682f
}
.product_box {
float: left;
width: 100%;
border: solid 1px #eee;
max-width: 100%;
background: #fff;
padding-bottom: 11px;
margin-bottom: 26px;
margin: 0 0 30px;
text-align: center;
box-shadow: 0 3px 5px 0 rgba(210, 210, 210, .75);
border-radius: 12px;
overflow: hidden
}
.product_box .image {
position: relative;
padding: 30px 10px 0;
margin-bottom: 13px;
text-align: center;
aspect-ratio: 1/1;
overflow: hidden;
border-bottom: 1px solid #eee
}
.product_box .image img {
width: 100%;
aspect-ratio: 1/1;
object-fit: contain;
object-position: center;
height: 100%
}
.product_box h3,
.product_box h4 {
float: left;
width: 100%;
text-align: center;
padding: 0 10px;
font-weight: 600;
font-size: 15px;
color: #ef682f;
margin-bottom: 10px;
min-height: 60px;
text-transform: capitalize
}
.product_box h4 span {
float: left;
width: 100%;
padding: 5px 0;
color: #423f3f;
font-size: 14px;
font-weight: 400
}
.product_box h4 a {
color: #423f3f
}
a.product-des-btn {
background: #231062;
color: #fff;
text-align: center;
padding: 8px 0;
width: 115px;
margin: auto;
transition: .5s;
margin-top: 10px
}
a.product-des-btn:hover {
background: #222
}
.product_box:hover {
box-shadow: 0 0 2px 0 #ef682f;
box-shadow: 2px 1px 13px 0 #9d9490;
}
.product_box:hover h4 {
color: #423f3f
}
.product_box:hover .read_more {
background: #ef682f;
color: #fff
}
.contact {
float: left;
width: 100%;
margin: 0;
padding: 40px 0
}
.contact-us h1 {
font-size: 18px;
color: #f63;
font-weight: 700;
text-transform: uppercase;
margin-bottom: 20px
}
.contact-us h2 {
font-size: 16px;
font-weight: 700;
text-transform: capitalize;
margin-bottom: 5px;
color: #ff5b00
}
.contact-us h6 {
font-weight: 700;
color: #666 !important;
font-size: 14px;
margin-bottom: 5px
}
.contact-us h6 i {
color: #f63 !important
}
.contacts h3 {
font-size: 18px;
color: #f63;
font-weight: 700;
text-transform: uppercase;
margin-bottom: 10px
}
.contact h4 {
font-size: 18px;
color: #f63;
font-weight: 700;
text-transform: uppercase;
margin-bottom: 20px
}
.contacts .social {
margin: 0;
padding: 0;
float: left;
display: table;
text-align: left
}
.contacts .social li {
display: inline-block;
line-height: 25px
}
.contacts .social li a {
border: 1px solid #fff;
color: #fff;
margin-right: 5px;
text-decoration: none;
text-align: center;
font-size: 16px;
width: 35px;
height: 35px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 4px
}
.contacts .social li a svg {
height: 18px;
width: 18px
}
.contacts .social li.facebook a {
background: #4a6d9d;
border: 1px solid #4a6d9d
}
.contacts .social li.twitter a {
background: #39c0ed;
border: 1px solid #39c0ed
}
.contacts .social li.linkedin a {
background: #0b7bb5;
border: 1px solid #0b7bb5
}
.contacts .social li.youtube a {
background: #c73213;
border: 1px solid #c73213
}
.blog_page {
display: flow-root;
float: none;
width: 100%;
margin: 0;
padding: 40px 0
}
.blog_inner {
float: left;
width: 100%;
position: relative;
margin-bottom: 10px
}
.blog_inner h1 {
float: left;
width: 100%;
padding: 10px;
margin: 0 0 10px;
background: #ef682f;
font-size: 25px;
color: #fff;
font-weight: 600;
text-transform: uppercase
}
.blog_inner h2 {
margin: 0 0 5px;
font-size: 18px;
color: #ef682f;
text-transform: uppercase
}
.blog_inner h3 {
margin: 0 0 5px;
font-size: 16px;
color: #ef682f;
text-transform: uppercase
}
.blog_inner h4 {
margin: 0 0 5px;
font-size: 15px;
color: #ef682f;
text-transform: uppercase
}
.blog_post {
float: left;
width: 100%;
padding: 10px
}
.blog_post .dl-horizontal {
margin-bottom: 15px;
overflow: hidden
}
.blog_post .dl-horizontal dt {
width: 60px;
float: left;
overflow: hidden;
clear: left;
text-align: right;
text-overflow: ellipsis;
white-space: nowrap
}
.blog_post .dl-horizontal a {
color: #555
}
.blog_post .dl-horizontal dt img {
width: 60px;
height: 60px;
padding: 2px;
margin: 0;
border: solid 1px #ddd
}
.blog_post .dl-horizontal dd {
margin-left: 70px
}
.blog_post .dl-horizontal dd h3 {
margin: 0;
padding: 0;
text-transform: capitalize
}
.blog_post .dl-horizontal dd h3 a {
font-size: 14px;
line-height: 16px !important;
color: #423f3f
}
.blog_post .dl-horizontal dd h3 a:hover {
color: #ef682f
}
.blog_post .dl-horizontal dd p {
margin: 0;
font-size: 12px
}
.blog_news {
float: left;
width: 100%;
border: 1px solid #ccc;
margin-bottom: 20px
}
.blog_news .blog_desc {
padding: 20px 20px
}
.blog_news img {
width: 100%
}
.blog_desc .posted-info li a {
color: #555
}
.blog_desc .posted-info li a:hover {
color: #ef682f
}
.blog_desc .posted-info li::before {
font-size: 12px;
line-height: 12px;
margin-right: 13px
}
.blog_desc .news-v3-in-sm .posted-info li:first-child::before,
.blog_desc .posted-info li:first-child::before {
content: " ";
margin-right: 0
}
.blog_news h2 {
font-size: 18px
}
.blog_news h2 a {
color: #423f3f
}
.blog_news h2 a:hover {
color: #ef682f
}
.blog_news p {
font-size: 14px;
text-align: justify
}
.main_index img {
width: auto
}
.blog_desc ol,
ul {
margin: 0;
padding: 0
}
.blog_desc ol li,
ul li {
list-style: none;
font-size: 14px;
line-height: 24px
}
.blog_desc ol li::before,
.blog_desc ul li::before {
content: "\f0da";
font-family: FontAwesome;
margin-right: 5px
}
.blog_news h2 {
margin: 0 0 5px;
font-size: 18px;
color: #ef682f;
text-transform: capitalize
}
.blog_news h3 {
margin: 0 0 5px;
font-size: 16px;
color: #ef682f;
text-transform: capitalize
}
.blog_news h4 {
margin: 0 0 5px;
font-size: 15px;
color: #ef682f;
text-transform: capitalize
}
.market_right {
float: left;
width: 100%;
margin: 0;
padding: 0
}
.market_right h1 {
padding: 10px;
margin: 0 0 10px;
background: #ef682f;
font-size: 20px;
color: #fff;
font-weight: 600;
text-transform: uppercase
}
.market_right h2 {
margin: 0 0 5px;
font-size: 18px;
color: #ef682f;
text-transform: uppercase
}
.market-list {
float: left;
width: 100%;
margin: 0;
padding: 0
}
.market-list li {
float: left;
width: 25%;
margin-right: 0;
margin-bottom: 10px
}
.market-list li a {
padding: 6px 10px;
font-size: 14px;
border: 1px solid #423f3f;
color: #423f3f;
width: 98%;
display: inline-block;
margin-right: 10px
}
.market-list li a:hover {
border: 1px solid #ef682f;
color: #fff;
background: #ef682f
}
.site_info h1 {
float: left;
width: 100%;
padding: 10px;
margin: 0 0 10px;
background: #ef682f;
font-size: 20px;
color: #fff;
font-weight: 600;
text-transform: uppercase
}
.sitemap {
border-left: 1px solid #666;
padding: 0;
margin: 0
}
.sitemap li {
list-style: none !important;
background: transparent url(../images/sitemap_hr.png) no-repeat scroll 0 9px;
padding: 0 0 0 15px;
margin-bottom: 5px
}
.sitemap li::before {
content: "" !important;
font-family: FontAwesome;
margin-right: 0 !important
}
.sitemap li ul {
border-left: 1px solid #666;
padding: 0
}
.sitemap li a {
color: #333;
font-size: 13px;
padding-bottom: 5px;
display: block
}
.process {
width: 100%;
background: none repeat scroll 0 0 #f2f1f1;
height: auto;
overflow: hidden;
border: 1px solid #ccc;
margin-bottom: 15px;
border-radius: 12px;
}
.process-con {
width: 55%;
float: left
}
.about_right p.process-pr {
font-size: 14px;
line-height: 1.4;
color: #423f3f;
text-align: left;
margin-bottom: 0;
letter-spacing: normal;
}
.Dater {
float: right;
padding: 11px;
font-weight: 700;
font-size: 14px;
background: none repeat scroll 0 0 #ef682f;
display: block;
clear: both;
color: #fff
}
.oddRowHeader {
font-size: 25px;
padding-top: 110px;
color: #555;
padding-left: 18px;
width: 100%
}
.process-pl {
width: 100% !important;
padding-left: 17px;
padding-top: 15px;
margin: 0 !important
}
.product-box p {
text-align: justify;
color: #000;
font: 13px/1.5em "Segoe UI", Tahoma, Arial, Helvetica, sans-serif
}
.fr {
float: right
}
.oddRowHeaderr {
font-size: 25px;
padding-top: 110px;
color: #555;
width: 100%
}
.Date {
float: left;
padding: 11px;
font-weight: 700;
font-size: 14px;
background: none repeat scroll 0 0 #ef682f;
display: block;
clear: both;
color: #fff
}
.process-conl {
width: 45%;
float: right;
padding-right: 15px;
}
.pro-main {
height: 950px;
overflow-y: scroll;
overflow-x: hidden;
width: 100%;
margin: 0 0 30px;
border: 1px solid #ccc;
border-radius: 12px;
}
table tr td {
padding: 4px 5px
}
.bottom-30 {
margin-bottom: 30px
}
.pantoneColorChart {
width: 100%;
border-collapse: collapse;
font-family: Arial, Helvetica, sans-serif;
font-size: 9px;
padding: 1px;
font-weight: 400;
border-top-width: 0;
border-right-width: 0;
border-bottom-width: 0;
border-left-width: 0;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
color: #fff
}
.pantoneColorChartSwatch {
background-color: #000;
width: 100%
}
.pantoneColorChartSwatch p {
color: #fff;
margin: 0 auto;
height: 15px;
font-size: 11px
}
.oddRowHeader-custom {
font-size: 22px;
padding-top: 20px;
color: #ef682f;
padding-left: 18px;
width: 100%
}
.oddRowHeaderr-custom {
font-size: 22px;
padding-top: 20px;
color: #ef682f;
width: 100%
}
.ac-container {
width: 100%;
margin: 5px auto 0 auto;
text-align: left
}
.ac-container div {
border-radius: 4px;
overflow: hidden;
margin-bottom: 10px;
border: 1px solid #d9d9d9;
box-shadow: 1px 4px 5px rgba(0, 0, 0, 0.06);
}
.ac-container input {
display: none
}
.ac-container label {
padding: 3px 20px;
position: relative;
z-index: 20;
display: block;
height: 35px;
cursor: pointer;
color: #777;
line-height: 25px;
font-size: 16px;
background: #fff;
background: linear-gradient(to top, #fff 1%, #eaeaea 100%)
}
.ac-container label::before {
position: absolute;
right: 15px;
top: 6px;
display: inline-block;
z-index: 1;
height: 16px;
width: 16px;
content: url('data:image/svg+xml;charset=utf-8,');
}
.ac-container label:hover {
color: #ef682f
}
.ac-container input:checked+label,
.ac-container input:checked+label:hover {
background: #ef682f;
color: #fff;
box-shadow: 0 0 0 1px rgba(155, 155, 155, .3), 0 2px 2px rgba(0, 0, 0, .1)
}
.ac-container input:checked+label:before {
content: url('data:image/svg+xml;charset=utf-8,');
}
.ac-container article {
background: rgba(255, 255, 255, .5);
margin-top: -1px;
overflow: hidden;
height: 0;
position: relative;
z-index: 10;
-webkit-transition: height .3s ease-in-out, box-shadow .6s linear;
-moz-transition: height .3s ease-in-out, box-shadow .6s linear;
-o-transition: height .3s ease-in-out, box-shadow .6s linear;
-ms-transition: height .3s ease-in-out, box-shadow .6s linear;
transition: height .3s ease-in-out, box-shadow .6s linear
}
.ac-container input:checked~article {
-webkit-transition: height .5s ease-in-out, box-shadow .1s linear;
-moz-transition: height .5s ease-in-out, box-shadow .1s linear;
-o-transition: height .5s ease-in-out, box-shadow .1s linear;
-ms-transition: height .5s ease-in-out, box-shadow .1s linear;
transition: height .5s ease-in-out, box-shadow .1s linear;
box-shadow: 0 0 0 1px rgba(155, 155, 155, .3)
}
.ac-container input:checked~article.ac-small {
width: 100%;
height: 100%;
padding: 15px;
}
.size-chart {
width: 100%
}
@media (min-width:240px) and (max-width:680px) {
.top-icon {
float: left;
width: 100%;
background: transparent url("../images/top-icon-bg.jpg") repeat-x scroll left top;
width: 100%;
height: auto;
margin: 20px 0 0;
border-radius: 8px
}
.top-icon li {
background: 0 0;
width: 100%;
float: left;
font-size: 16px;
color: #636466
}
.process-con {
width: 100%;
float: left
}
.Dater {
float: left;
padding: 11px;
font-weight: 700;
font-size: 14px;
background: none repeat scroll 0 0 #ef682f;
display: block;
clear: both
}
.oddRowHeader {
float: left;
font-size: 25px;
padding-top: 10px;
color: #555;
padding-left: 18px;
width: 100%
}
.process-pl {
width: 100% !important;
padding-left: 17px;
padding-top: 15px;
margin: 0 !important
}
.product-box p {
text-align: justify;
color: #000
}
.fr {
float: right
}
.oddRowHeaderr {
font-size: 25px;
padding-top: 10px;
color: #555;
float: left;
width: 100%
}
.Date {
float: left;
padding: 11px;
font-weight: 700;
font-size: 14px;
background: none repeat scroll 0 0 #ef682f;
display: block;
clear: both
}
.process-conl {
width: 100%;
float: left
}
.pro-main {
height: 480px;
overflow-y: scroll;
overflow-x: hidden;
width: 100%;
margin: 0 0 30px;
border: 1px solid #ccc;
border-radius: 12px;
}
table tr td {
padding: 4px 5px
}
.bottom-30 {
margin-bottom: 30px
}
.pantoneColorChart {
width: 100%;
border-collapse: collapse;
font-size: 9px;
padding: 1px;
font-weight: 400;
border-top-width: 0;
border-right-width: 0;
border-bottom-width: 0;
border-left-width: 0;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
color: #fff
}
.pantoneColorChartSwatch {
background-color: #000;
width: 100%
}
.pantoneColorChartSwatch p {
color: #fff;
margin: 0 auto;
height: 15px;
font-size: 11px
}
.oddRowHeader-custom {
font-size: 25px;
padding-top: 20px;
color: #555;
padding-left: 18px;
width: 100%
}
.oddRowHeaderr-custom {
font-size: 25px;
padding-top: 20px;
color: #555;
width: 100%
}
}
.welcome-bg h2 {
float: left;
width: 100%;
text-align: center;
font-size: 20px
}
.enquire_btn {
left: 0;
top: 180px;
z-index: 99;
position: fixed;
background: #ef682f;
color: #fff !important;
font-size: 16px;
font-weight: 600;
text-align: center;
transform: rotate(-90deg);
transform-origin: left bottom;
padding: 0 15px;
line-height: 33px;
margin-left: 35px;
margin-top: 160px;
height: 35px !important
}
.enquire_btn:hover {
background: #333
}
.right_content p {
margin-top: 0px
}
#productID .modal-dialog {
width: 800px
}
.image-enquire .image {
position: relative;
height: 500px;
text-align: center;
margin-bottom: 15px;
border: 1px solid #eee
}
.image-enquire .image img {
position: absolute;
top: 50%;
left: 50%;
max-width: 100%;
transform: translate(-50%, -50%);
max-height: 100%;
width: auto;
height: auto
}
.inner_banner_1 {
float: left;
width: 100%;
background-color: #fff;
position: relative;
width: 100%;
overflow: hidden
}
.inner_banner_1 img {
width: 100%
}
.inner_banner_1 .banner_bg {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
z-index: 1;
z-index: 5;
display: block
}
.inner_banner_1 .container .section-title {
color: #ef682f;
font-size: 25px;
line-height: normal;
margin: 0;
padding: 0;
width: 100%;
font-weight: 600;
margin-left: 0;
height: 100%;
display: flex;
align-items: center;
justify-content: start
}
.catgeory_gallery {
float: left;
width: 100%;
padding: 40px 0;
margin: 0;
background: #fff
}
.catgeory_gallery .portfolio_block .image-box .image {
height: 204px
}
.heading_home {
font-size: 25px;
margin: 0;
padding: 0 0 10px;
font-weight: 700;
color: #ef682f;
text-align: left;
text-transform: uppercase
}
section.video-main {
margin-bottom: -6px
}
.videoBox {
float: left;
max-width: 450px;
width: 100%;
margin: 0 0 25px;
padding: 0;
border-radius: 10px 10px 10px 10px;
overflow: hidden;
position: relative;
display: flex
}
.videoBox iframe {
-o-object-fit: cover;
object-fit: cover;
height: 300px;
width: 100%
}
.fadeImg {
animation-name: fadeimg;
animation-duration: 2s
}
@keyframes fadeimg {
from {
opacity: 0
}
to {
opacity: 1
}
}
.cat_title2 {
margin-left: 8%;
color: #fff;
font-size: 18px;
margin-top: 5px
}
.title2 {
font-size: 18px;
position: relative
}
.position-relative {
position: relative
}
.text-white {
color: #fff
}
.title1 {
font-size: 25px
}
.about_right .title2 {
margin: 0 0 5px;
font-size: 18px;
color: #ef682f;
text-transform: uppercase
}
.left_contact .title2,
.lelf_menu .title2 {
margin: 0;
padding: 10px 10px;
color: #ef682f;
font-size: 18px;
font-weight: 600;
text-transform: inherit
}
#content_block_six .content-box .single-item .inner-box .box .title2 {
position: relative;
display: block;
font-size: 16px;
letter-spacing: .5px;
font-weight: 500;
color: #fff;
margin: 0;
text-transform: capitalize
}
div#sendenquiry .modal-title {
font-size: 16px;
padding: 10px
}
.modal-content .modal-title {
margin: 0;
line-height: 1.42857143;
font-size: 18px
}
.image-enquire span.catName {
font-size: 18px;
font-weight: 500;
color: #ff5b00
}
.technology_item h1 {
font-size: 13px;
text-transform: uppercase;
color: #fff;
margin-bottom: 0
}
.news-block-one .inner-box .lower-content h5 a {
font-size: 16px;
font-weight: 700;
letter-spacing: .5px
}
.portfolio_block .image-box:hover .overlay .title-box h4 {
position: relative
}
.product_box span.read_more {
margin-top: 10px
}
.cat_info .col-lg-4.col-md-4.col-sm-4 h3 {
font-size: 16px;
height: 32px;
min-height: auto;
letter-spacing: .5px
}
/* form#contact-form {
padding: 20px;
border-radius: 5px
} */
.col-lg-4.col-md-4.contact-us .p-3.border.border-light {
border: 1px solid #ccc !important;
margin-bottom: 10px;
padding: 15px;
border-radius: 5px;
margin-top: 15px;
display: block
}
.col-lg-4.col-md-4.contact-us .p-3.border.border-light p {
margin-bottom: 0
}
.col-lg-4.col-md-4.contact-us .p-3.border.border-light p a:hover {
color: #f63
}
.video_gallery h2 {
font-size: 14px;
font-weight: 400;
display: flex;
align-items: center;
height: 50px;
margin-bottom: 0;
text-transform: inherit
}
.video_gallery svg {
margin-right: 10px;
width: 25px;
height: 25px;
min-width: 25px
}
.title.title2.text-yellow {
font-size: 25px
}
.lelf_menu .h1.title3 {
background: #ef682f;
margin: 0;
padding: 10px 10px;
color: #fff;
font-size: 18px;
text-transform: uppercase
}
.blog_inner .title3 {
background: #ef682f;
margin: 0;
padding: 5px 10px;
color: #fff;
font-size: 25px;
text-transform: uppercase
}
.blog_meta_info .blog_details h3 {
color: #ff5b00
}
.opacity-0 {
opacity: 0;
display: none
}
.portfolio_block .title2.position-relative.text-white h2 {
font-size: 16px;
margin-bottom: 0;
color: #fff
}
.inner_banner_1 .banner_bg .container {
display: flex;
align-items: center;
height: 100%
}
.inner_banner_1 .banner_bg .container.subContainer {
display: block
}
.title3.text-yellow {
font-size: 18px;
color: #ff5b00;
height: 45px;
display: flex;
align-items: center;
justify-content: center
}
.inner_banner_1 .banner_bg .container.subContainer .section-title {
height: auto;
width: 100%;
margin-top: 13%
}
.inner_banner_1 .banner_bg .container.subContainer .cat_title2 {
margin: 0;
max-width: 520px
}
.imgScrollList_2 {
position: absolute;
top: 0;
left: 20px;
width: 100%;
height: 115px;
overflow: hidden;
z-index: 1
}
.imgScrollList_2 ul {
position: relative;
width: 9999px;
height: 120px
}
.imgScrollList_2 li {
float: left;
width: 140px;
height: 120px;
overflow: hidden
}
.imgScrollList_2 li a {
float: left;
margin: 12px 6px;
width: 128px;
height: 96px;
overflow: hidden
}
.imgScrollBtn02_2:hover {
background-position: -22px -40px;
background-color: #ef682f;
border-color: #ef682f;
color: #fff
}
.imgScrollBtn01_2,
.imgScrollBtn02_2 {
position: absolute;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
line-height: 40px;
padding: 0;
transform: translate(0, -50%);
color: #fff;
font-size: 14px;
outline: 0;
background: #1e1e2a;
border-radius: 100%;
z-index: 50;
border: 1px solid #1e1e2a;
text-align: center;
cursor: pointer;
transition: all .3s ease;
top: 50%
}
.imgScrollWrap_2 {
position: relative;
width: 100%;
height: 115px;
border: 0 #999 solid;
overflow: hidden
}
.imgScrollBtn01_2 {
left: 0
}
.imgScrollBtn02_2 {
right: 0;
background-position: -22px 0
}
.imgScrollBtn01_2:hover,
.imgScrollBtn01_3:hover {
background-position: 0 -40px;
background-color: #ef682f;
color: #fff
}
.title_small span {
color: #0c0c0c
}
.blog_listing:hover .title_small span {
color: #ef682f
}
.right_content {
padding-right: 10px
}
.maxWidth {
width: 100%;
text-align: center;
max-width: 950px;
margin: 10px auto 30px;
position: relative
}
.maxWidth p {
font-size: 16px;
color: #fff;
line-height: 24px
}
.videoSection {
float: left;
width: 100%;
padding: 40px 0;
margin: 0;
background: transparent linear-gradient(120deg, #3d3d51 0, #000 100%) 0 0 no-repeat padding-box
}
.videoSection .title:before {
background: #fff;
}
.videoFeedback {
float: left;
width: 100%;
margin: 0;
padding: 0;
position: relative;
margin-bottom: 20px
}
.videoFeedback .image {
position: relative;
height: 285px;
background-color: #fff;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
border-radius: 24px;
object-fit: cover;
margin-bottom: 15px
}
.videoFeedback .image img {
height: 100%;
object-fit: cover
}
.videoFeedback .image:before {
position: absolute;
z-index: 1;
pointer-events: none;
content: '';
left: 0;
right: 0;
top: 0;
bottom: 0;
opacity: .4;
-webkit-transition: opacity 180ms ease;
transition: opacity 180ms ease
}
.videoFeedback .image:after {
border-radius: inherit;
content: '';
display: block;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 0;
background-color: rgba(0, 0, 0, .33)
}
.videoFeedback:hover .image:before {
opacity: 0
}
.videoFeedback .image:after {
position: absolute;
content: '';
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 9;
background: linear-gradient(10deg, rgba(17, 17, 17, .70196) 0, rgba(17, 17, 17, .01) 99%, #01102f 100%)
}
.feedbackStar {
position: absolute;
font-size: .75rem;
line-height: 1rem;
font-weight: 500;
background-color: transparent;
border: 1px solid #f90;
padding-left: .625rem;
padding-right: .625rem;
padding-bottom: .25rem;
padding-top: .25rem;
color: #f90;
z-index: 9;
top: 10px;
left: 10px;
border-radius: 20px
}
.videoFeedback .image span {
display: flex;
justify-content: center;
align-items: center;
inset: 0;
position: absolute;
z-index: 99
}
.videoFeedback .image span svg {
color: #fff;
width: 2.75rem;
height: 2.75rem;
border: 1px solid rgb(255 255 255/1);
border-radius: 100%;
padding: 5px
}
.videoTitle {
display: flex;
align-items: center;
justify-content: center
}
.videoTitle .vidoIcon {
width: 40px;
min-width: 40px;
height: 40px;
margin-right: 10px;
font-size: 24px;
color: #ef682f;
background: #eee;
border: 1px solid #ccc;
border-radius: 4px;
text-align: center;
display: flex;
align-items: center;
justify-content: center
}
.videoName {
font-size: 16px;
text-align: center;
font-weight: 400;
color: #fff;
line-height: normal
}
.videoFeedback:hover .videoName {
color: #ef682f
}
.mainCategory {
float: left;
width: 100%;
margin: 0;
padding: 40px 0 0;
margin-right: auto;
margin-left: auto;
position: relative;
background-color: #fff
}
.mainCategory:before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url(../images/lines-black.svg);
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
opacity: .1
}
.mainCategory .gridFlex {
width: 100%;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 1;
-webkit-flex-grow: 1;
-ms-flex-positive: 1;
flex-grow: 1;
flex-direction: row;
-webkit-flex-direction: row;
-webkit-flex-wrap: wrap;
-webkit-justify-content: space-around;
margin-bottom: 30px;
position: relative;
box-shadow: 0 3px 5px 0 rgba(210, 210, 210, .75);
transition: all .35s ease-in-out;
border: 1px solid #eee;
border-radius: 6px;
overflow: hidden
}
.mainCategory .leftImage,
.mainCategory .rightInfo {
display: flex;
align-items: stretch;
justify-content: space-around
}
.mainCategory .leftImage {
width: 33.33333333%;
width: 24%;
border-left: 1px solid #ccc;
}
.mainCategory .rightInfo {
width: 66.66666667%;
width: 76%;
}
.mainCategory .gridFlex:nth-child(2n) .rightInfo {
-webkit-box-ordinal-group: -1;
-webkit-order: -1;
-ms-flex-order: -1;
order: -1
}
.mainCategory .rightInfo .boxContent {
width: 100%;
padding: 0 20px
}
.mainCategory .rightInfo .boxContent .blue-line1 {
background: #eee
}
.mainCategory .gridFlex .right_content .title4 {
line-height: 24px;
padding: 10px 0;
text-align: left;
margin: 0;
font-size: 18px;
font-weight: 600;
text-transform: capitalize;
letter-spacing: .5px
}
.mainCategory .gridFlex:hover .right_content .title4 a {
color: #ef682f
}
.you_may {
float: left;
width: 100%;
padding: 7px 10px;
margin: 0 0 8px;
line-height: 30px;
background: #ef682f;
font-size: 20px;
color: #fff;
font-weight: 600
}
.sedexMember {
position: absolute;
left: 3%;
top: 20%;
background-color: #fff;
border-radius: 100%;
width: 100px;
height: 100px;
overflow: hidden
}
.sedexMember img {
width: 100%;
height: auto
}
.sedexMember2 {
position: absolute;
right: 6%;
bottom: 23%;
width: 200px
}
.sedexMember2 img {
width: 100%;
height: auto
}
.sedexMemberHead {
position: absolute;
left: 4px;
top: 48px;
background-color: #fff;
width: 180px;
overflow: hidden;
z-index: 9;
height: auto
}
.sedexMemberHead img {
width: 100%;
height: auto;
z-index: 9;
position: relative;
margin: 0
}
.logoOption {
display: flex;
align-items: center;
margin-left: 50px
}
.logoOption .footLogo {
padding: 0;
border: 1px solid #eee;
border-radius: 6px;
overflow: hidden;
background: #fff;
max-width: 97px;
width: 100%;
height: 48px;
margin-right: 10px;
display: flex;
align-items: center
}
.logoOption .footLogo img {
width: 100%;
object-position: center;
object-fit: contain;
padding: 4px
}
.home_about .services-item {
width: 94%;
margin: 0 auto 10px
}
.slide video.w-100.d-block {
height: auto;
aspect-ratio: 27/11;
background: #171717
}
/* New Sections */
.breadcumSection {
float: left;
width: 100%;
background-color: #eee;
padding: 7px 0;
border-bottom: 1px solid #ddd;
}
.breadcumSection ul {
display: flex;
gap: 0 25px;
flex-wrap: wrap;
list-style: none;
margin: 0;
padding: 0;
}
.breadcumSection ul li {
color: #ed5c20;
font-size: 14px;
font-weight: 400;
letter-spacing: normal;
padding: 0;
position: relative;
margin: 0;
}
.breadcumSection ul li a {
color: #333;
}
.breadcumSection ul li a::before {
content: url('data:image/svg+xml;charset=utf-8,');
position: absolute;
top: 4px;
right: -20px;
}
.breadcumSection ul li a:hover {
color: #ef682f;
}
/**/
.aboutPageSection {
float: left;
width: 100%;
margin: 0;
padding: 40px 0;
background: #fff;
position: relative;
z-index: 100;
}
.title_1 {
font-size: 32px;
font-weight: 600;
color: var(--theme-color);
position: relative;
margin-bottom: 15px;
line-height: normal;
}
.aboutPageSection h2 {
color: var(--bs-dark);
font-size: 24px;
font-weight: 600;
margin: 0 0 10px;
text-transform: inherit;
}
.aboutPageSection h2 strong {
font-weight: 600;
}
.aboutPageSection h3 {
color: var(--bs-dark);
font-size: 22px;
font-weight: 600;
margin: 0 0 10px;
}
.aboutPageSection h3 strong {
font-weight: 600;
}
.about_img {
float: right;
max-width: 540px;
width: 100%;
position: relative;
margin: 0 0 15px 15px;
}
.about_img .img {
padding: 0 0px 30px 30px;
position: relative;
aspect-ratio: 85/58;
}
.about_img .img:before {
content: "";
position: absolute;
top: 30px;
left: 0;
right: 45px;
bottom: 0;
border: 1px solid #eee;
border-radius: 4px;
}
.about_img .img img {
position: relative;
z-index: 2;
background: #272727;
aspect-ratio: 85/58;
object-fit: cover;
object-position: center;
width: 100%;
height: 100%;
border-radius: 4px;
}
.about_img .about_img {
width: 40%;
position: absolute;
bottom: 0px;
right: 45px;
z-index: 3;
padding: 15px 15px;
color: var(--bs-dark);
text-transform: uppercase;
font-weight: 300;
letter-spacing: 5px;
font-size: 16px;
line-height: 1.5em;
text-align: center;
background: var(--theme-color);
}
.aboutPageSection p {
font-size: 16px;
font-weight: 400;
color: #333;
margin-bottom: 15px;
text-align: justify;
}
.aboutPageSection ul {
margin: 0 0 25px;
padding: 0;
}
.aboutPageSection ul li {
display: block;
list-style: none;
line-height: 24px;
color: #423f3f;
font-size: 16px;
font-weight: normal;
}
.aboutPageSection ul li:before {
margin-right: 5px;
content: url("data:image/svg+xml;charset=utf-8,");
}
/**/
/**/
.factoryPhoto {
float: left;
width: 100%;
margin: 0;
padding: 40px 0;
position: relative;
background-color: rgb(242 246 247);
}
.factoryPhoto .maxWidth p {
color: #333;
}
.title_2 {
padding: 0 0 0px;
margin: 0;
float: left;
width: 100%;
text-align: center;
margin-bottom: 45px;
position: relative;
font-weight: 700;
color: var(--theme-color);
font-size: 30px;
font-style: normal;
line-height: 1.25;
}
.title_2:after {
background: var(--bs-dark);
bottom: -10px;
content: "";
height: 2px;
left: 0;
right: 0;
margin: 0 auto;
position: absolute;
width: 50px;
}
.masonry {
float: left;
width: 100%;
display: flex;
gap: 15px;
/* -webkit-column-count: 6;
-moz-column-count: 6;
column-count: 6;
-moz-column-gap: 15px;
-webkit-column-gap: 15px;
column-gap: 15px; */
margin-bottom: 25px;
}
.masonry .item {
display: inline-block;
background: #fff;
position: relative;
padding: 0;
margin: 0;
width: 100%;
transition: 1s ease all;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
border-radius: 5px;
overflow: hidden;
}
.masonry .item .img-bx::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: var(--blackColor);
opacity: 0;
z-index: 1;
transition: 0.3s ease-in-out;
}
.masonry .item:hover .img-bx::before {
opacity: 0.5;
}
.masonry .item:before,
.masonry .item:after {
position: absolute;
content: "";
height: 0px;
width: 0px;
background: transparent;
transition: all 0.3s ease-in-out;
opacity: 0;
z-index: 2;
}
.masonry .item:before {
border-left: 1px solid #fff;
border-top: 1px solid #fff;
top: 20px;
left: 20px;
}
.masonry .item:after {
border-right: 1px solid #fff;
border-bottom: 1px solid #fff;
bottom: 20px;
right: 20px;
}
.masonry .item:hover:before,
.masonry .item:hover:after {
height: 50px;
width: 50px;
opacity: 1;
}
.masonry .item img {
max-width: 100%;
aspect-ratio: 64 / 65;
width: 100%;
object-position: center;
object-fit: cover;
}
.masonry .item .link-wrap {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 3;
display: flex;
align-items: center;
justify-content: center;
height: 40px;
width: 40px;
background-color: rgba(242, 105, 47, 0.4);
border: 2px solid rgba(242, 105, 47, 0.5);
text-align: center;
color: var(--bs-body-bg);
font-size: 14px;
opacity: 0;
transition: all 0.5s ease-in-out;
pointer-events: none;
}
.masonry .item .link-wrap svg {
width: 20px;
height: 20px;
}
.masonry .item:hover .link-wrap {
opacity: 1;
}
@media only screen and (min-width: 321px) and (max-width: 768px) {
.masonry {
-moz-column-count: 1;
-webkit-column-count: 1;
column-count: 1;
}
}
@media only screen and (min-width: 769px) and (max-width: 1200px) {
.masonry {
-moz-column-count: 3;
-webkit-column-count: 3;
column-count: 3;
}
}
/**/
.chairmanSection {
float: left;
width: 100%;
padding: 60px 0 0;
position: relative;
z-index: 1;
background: url(../images/bg1.jpg);
background-size: cover;
background-position: center;
background-attachment: fixed
}
.chairmanSection::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
background: #fff;
opacity: .9
}
.chairmanText {}
.chairmanSubTitle {
font-size: 18px;
font-weight: 600;
color: var(--theme-color);
text-decoration: underline;
text-transform: inherit;
}
.chairmanName {
font-weight: 700;
font-size: 42px;
line-height: 1.3;
margin-bottom: 10px;
text-transform: capitalize;
color: var(--bs-dark);
}
.chairmanText p {
letter-spacing: normal;
margin-bottom: 15px;
line-height: 25px;
font-size: 16px;
font-weight: 400;
color: #4a4e56;
}
.chairmanText p.quotes {
color: #4a4e56;
font-size: 18px;
line-height: 30px;
padding-left: 70px;
position: relative;
margin-bottom: 15px;
font-weight: 500;
}
.chairmanText p.quotes:before {
content: url('data:image/svg+xml;charset=utf-8,');
position: absolute;
top: 0;
left: 0
}
.chairmanImg {
position: relative;
}
/**/
.shippingLogistics {
float: left;
width: 100%;
padding: 0;
margin: 0;
position: relative;
overflow: hidden;
}
.about-wrapper-2 {
position: relative;
}
.about-area-2 {
display: -ms-grid;
display: grid;
-ms-grid-columns: 1fr;
grid-template-columns: repeat(1, 1fr);
-webkit-box-align: start;
-ms-flex-align: start;
align-items: start;
justify-items: center;
gap: 60px;
position: relative;
}
.about-area-2 {
-ms-grid-columns: minmax(0, 768px) 90px minmax(0, 760px);
grid-template-columns: minmax(0, 768px) minmax(0, 760px);
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 90px;
}
.about-area-2 .about-style-2-img-block {
position: relative;
z-index: 1;
max-width: 100%;
}
.img-cover {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
}
.about-area-2 .about-style-2-img-block .about-video {
display: inline-block;
top: 55%;
right: -116px;
left: auto;
-webkit-transform: translate(0%, 0%);
transform: translate(0%, 0%);
width: 232px;
height: 232px;
position: absolute;
}
.about-area-2 .about-style-2-img-block .about-elements-1 {
display: none;
top: calc(100% - 30px);
left: 0%;
display: inline-block;
}
.about-area-2 .about-style-2-img-block .about-elements-2 {
display: none;
top: 50%;
left: 100%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
display: inline-block;
}
.about-area-2 .about-content-block {
padding-inline: 0 45px;
}
.section-space-top {
padding-top: 30px;
}
.about-area-2 .section-content-block {
max-width: 650px;
}
.section-tag {
display: inline-block;
margin-bottom: 20px;
border-radius: 6px;
background-color: rgba(248, 178, 25, 0.17);
padding: 7px 20px;
color: var(--bs-body-color);
font-weight: 500;
font-size: 0.875rem;
line-height: 1;
}
.section-title.is-text-dark {
color: var(--theme-dark-color);
}
.section-text {
font-size: 16px;
}
.feature-style-1-list {
display: -ms-grid;
display: grid;
-ms-grid-columns: 1fr;
grid-template-columns: repeat(2, 1fr);
gap: 30px;
margin-left: 0px;
}
.feature-style-1-list li {
list-style: none;
}
.feature-style-1-list li p {
margin: 0;
}
.feature-style-1-icon {
width: auto;
height: 60px;
}
.feature-style-1-title {
margin-block: 10px 5px;
color: var(--theme-color);
font-weight: 700;
font-size: 1.375rem;
}
.about-wrapper-2 .about-elements-3 {
top: 140px;
right: 100px;
}
.about-wrapper-2 .about-elements-4 {
right: 30px;
bottom: 47px;
}
/**/
/**/
.webpulseChoose {
float: left;
width: 100%;
margin: 0;
padding: 50px 0 0;
background: var(--bs-dark);
}
.webpulseChooseTitle {
font-size: 28px;
color: var(--bs-body-bg);
margin: 0 0 15px;
padding: 0;
font-weight: 700;
}
.webpulseChooseTitle span {
color: var(--theme-color);
}
.webpulseChoose .image img {
max-width: 480px;
}
.text {
width: 100%;
border-left: 3px solid var(--theme-color);
padding-left: 15px;
margin-bottom: 25px;
}
.text p {
font-size: 16px;
font-weight: 400;
color: var(--bs-body-bg);
}
.wpsFeature {
width: 100%;
margin: 0;
padding: 0;
position: relative;
margin-bottom: 30px;
}
.wpsFeature .wpsIcon {
position: relative;
margin-bottom: 10px;
width: 70px;
height: 70px;
display: flex;
align-items: center;
justify-content: center;
color: var(--theme-color);
}
.wpsFeature .wpsIcon.active {
background: var(--theme-color);
color: var(--whiteColor);
}
.wpsFeature .wpsIcon svg {
width: 55px;
height: 55px;
}
.wpsFeature .wpsFeatureTitle {
font-size: 18px;
font-weight: 600;
color: var(--bs-body-bg);
color: var(--theme-color);
margin-bottom: 5px;
}
.wpsFeature p {
font-size: 16px;
font-weight: 400;
line-height: 1.4;
color: var(--bs-body-bg);
margin: 0;
letter-spacing: normal;
}
.wpsAboutSection {
float: left;
width: 100%;
padding: 40px 0;
margin: 0;
background: #f6f6f6;
}
.wpsAboutTitle {
font-size: 28px;
color: #444;
margin: 0 0 15px;
padding: 0;
font-weight: 600;
}
.wpsAboutTitle span {
color: var(--theme-color);
}
.wpsAboutSection ul {
margin: 0 0 20px;
padding: 0;
}
.wpsAboutSection ul li {
font-size: 16px;
font-weight: 400;
margin-bottom: 10px;
position: relative;
padding-left: 25px;
list-style: none;
}
.wpsAboutSection ul li:before {
content: url('data:image/svg+xml;charset=utf-8,');
text-align: center;
position: absolute;
left: 0;
}
/**/
.video-one {
float: left;
width: 100%;
position: relative;
display: block;
padding: 60px 0;
z-index: 1;
overflow: hidden;
}
.video-one:before {
content: "";
position: absolute;
bottom: -300px;
left: 0;
right: 0;
height: 500px;
background: var(--theme-color);
background: linear-gradient(180deg,
rgba(193, 183, 154, 0.20211834733893552) 2%,
rgba(193, 183, 154, 0) 100%);
z-index: -1;
}
.video-one__bg-color {
position: absolute;
top: 0;
left: 0;
right: 0;
height: 70%;
background-color: #15151d;
z-index: -1;
}
.video-one__bg {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
/*opacity: 0.1;
background-image: url(../images/video-one-bg.jpg); */
background: #ffffff0f url(../images/cta-box-bg.png) no-repeat;
background-size: cover;
background-position: center center;
border: 1px solid #ffffff0f;
border-radius: 30px;
padding: 120px 0;
}
.video-one__inner {
position: relative;
display: block;
}
.video-one__inner .title_2 {
margin-bottom: 30px;
}
.video-one__inner .title_2:after {
background: var(--bs-body-bg);
}
.video-one__inner .maxWidth p {
color: var(--bs-body-bg);
font-size: 18px;
}
.video-one__contact-box .title_2::after {
background: var(--bs-dark);
}
.video-one__contact-box .maxWidth p {
color: var(--bs-body-color);
font-size: 16px;
}
.video-one__video-link {
position: relative;
display: inline-block;
margin: 32px 0 70px;
}
.video-one__video-icon {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
width: 100px;
height: 100px;
line-height: 100px;
text-align: center;
font-size: 20px;
color: var(--bs-dark);
background-color: var(--theme-color);
border-radius: 50%;
margin: 0 auto 0;
transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-webkit-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
}
.video-one__video-icon svg {
width: 60px;
height: 60px;
}
.video-one__video-icon:hover {
background-color: #ffffff;
color: var(--dark-color);
}
.video-one__video-link .ripple,
.video-one__video-icon .ripple:before,
.video-one__video-icon .ripple:after {
position: absolute;
top: 50%;
left: 50%;
width: 100px;
height: 100px;
border-radius: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
-ms-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.6);
-o-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.6);
-webkit-box-shadow: 0 0 0 0 rgb(255, 255, 255, 60%);
box-shadow: 0 0 0 0 rgb(255, 255, 255, 60%);
-webkit-animation: ripple 3s infinite;
animation: ripple 3s infinite;
}
@-webkit-keyframes ripple {
70% {
box-shadow: 0 0 0 40px rgba(10, 165, 205, 0);
}
100% {
box-shadow: 0 0 0 0 rgba(10, 165, 205, 0);
}
}
@keyframes ripple {
70% {
box-shadow: 0 0 0 40px rgba(10, 165, 205, 0);
}
100% {
box-shadow: 0 0 0 0 rgba(10, 165, 205, 0);
}
}
.video-one__video-icon .ripple:before {
-webkit-animation-delay: 0.9s;
animation-delay: 0.9s;
content: "";
position: absolute;
}
.video-one__video-icon .ripple:after {
-webkit-animation-delay: 0.6s;
animation-delay: 0.6s;
content: "";
position: absolute;
}
.video-one__contact-box {
position: relative;
display: block;
max-width: 1000px;
margin: 0 auto;
background-color: #ffffff;
box-shadow: 0px 10px 39.2px 0.8px rgba(0, 0, 0, 0.1);
border-radius: 8px;
padding: 50px;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
z-index: 1;
margin-bottom: 40px;
}
.video-one__contact-box:before {
content: "";
position: absolute;
bottom: 0;
left: -100%;
height: 354px;
width: 100%;
background-color: #f7f7f7;
clip-path: polygon(0 0, 100% 0%, 100% 100%, 0 0);
z-index: -1;
}
.video-one__contact-box:after {
content: "";
position: absolute;
bottom: 0;
right: -100%;
height: 354px;
width: 100%;
background-color: #f7f7f7;
clip-path: polygon(0 0, 100% 0, 100% 0, 0 100%);
z-index: -1;
}
.video-one-contact__info-box {
position: relative;
display: block;
text-align: left;
background-color: var(--bs-dark);
padding: 25px 25px 25px;
border-radius: 8px;
border-bottom: 5px solid var(--bs-dark);
}
.factoryVideo {
float: left;
width: 100%;
margin: 0;
padding: 40px 0;
position: relative;
background-color: var(--bs-body-bg);
}
.vd_bx {
position: relative;
overflow: hidden;
z-index: 1;
border-radius: 16px;
box-shadow: rgba(50, 50, 93, 0.25) 0px 0px 5px -1px,
rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
margin-bottom: 35px;
}
.video-play-icon {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 2;
width: 55px;
height: 40px;
border-radius: 12px;
text-align: center;
color: var(--bs-body-bg);
display: flex;
align-items: center;
justify-content: center;
margin: auto;
transition: all 0.5s;
background: linear-gradient(180deg,
rgba(255, 255, 255, 0.15),
rgba(255, 255, 255, 0));
background-color: #d7141b;
box-shadow: 0 0 0 0 rgba(110, 39, 37, 0.5);
-webkit-animation: wave 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
-moz-animation: wave 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
-ms-animation: wave 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
animation: wave 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
}
@-webkit-keyframes wave {
to {
box-shadow: 0 0 0 45px rgba(213, 142, 144, 0);
}
}
@-moz-keyframes wave {
to {
box-shadow: 0 0 0 45px rgba(213, 142, 144, 0);
}
}
@-ms-keyframes wave {
to {
box-shadow: 0 0 0 45px rgba(213, 142, 144, 0);
}
}
@keyframes wave {
to {
box-shadow: 0 0 0 45px rgba(213, 142, 144, 0);
}
}
.video-play-icon svg {
width: 30px;
height: 30px;
}
/**/
.buttons {
width: 100%;
display: flex;
gap: 15px;
}
.buttons .read_more {
margin: 0;
border-radius: 4px;
}
.pdf_download,
.pdf_download:focus {
/* min-width: 140px; */
height: 45px;
line-height: 45px;
padding: 0;
padding-left: 20px;
display: inline-block;
outline: none;
border: 0;
border-radius: 4px;
overflow: hidden;
cursor: pointer;
text-align: center;
text-transform: uppercase;
font-size: 14px;
color: var(--bs-white);
background: linear-gradient(to bottom, #ff4a4a, #c40000);
position: relative;
z-index: 1;
display: inline-block;
vertical-align: middle;
-webkit-transform: perspective(1px) translateZ(0);
transform: perspective(1px) translateZ(0);
-webkit-transition-property: color;
transition-property: color;
-webkit-transition-duration: 0.5s;
transition-duration: 0.5s;
}
.pdf_download:before {
content: "";
position: absolute;
z-index: -1;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: linear-gradient(to bottom, #ea4343, #a40606);
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transform-origin: 0% 10% 0;
transform-origin: 0% 10% 0;
-webkit-transition-property: transform;
transition-property: transform;
-webkit-transition-duration: 0.5s;
transition-duration: 0.5s;
-webkit-transition-timing-function: ease-out;
transition-timing-function: ease-out;
}
.pdf_download:hover:before {
-webkit-transform: scaleX(1);
transform: scaleX(1);
-webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
}
.pdf_download:hover {
color: #fff;
background: linear-gradient(to bottom, #ea4343, #a40606);
}
.pdf_download .btn_caret {
background: linear-gradient(to bottom, #ea4343, #a40606);
color: var(--bs-white);
width: 40px;
padding: 0;
display: inline-block;
margin-left: 15px;
}
.pdf_download:hover .btn_caret {
background: linear-gradient(to bottom, #e13333, #8c0707);
}
.pdf_download .btn_caret svg {
width: 35px;
height: 35px;
}
.youtubeLinkBtn {
background-color: #f70000;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
height: 45px;
width: 65px;
border-radius: 4px;
}
.youtubeLinkBtn svg {
width: 30px;
height: 30px;
}
.youtubeLinkBtn:hover,
.youtubeLinkBtn:focus {
background-color: #ce0707;
color: #fff;
}
.productRangeTitle {
color: var(--bs-dark);
font-size: 24px;
font-weight: 500;
margin: 0 0 10px;
text-align: left;
}
.enquiryBtn2,
.enquiryBtn2:focus {
height: 45px;
line-height: 45px;
padding: 0;
padding-left: 15px;
display: inline-block;
outline: none;
border: 0;
border-radius: 4px;
overflow: hidden;
cursor: pointer;
text-align: center;
text-transform: uppercase;
font-size: 14px;
color: #fff;
background: #333;
position: relative;
z-index: 1;
display: inline-block;
vertical-align: middle;
-webkit-transform: perspective(1px) translateZ(0);
transform: perspective(1px) translateZ(0);
-webkit-transition-property: color;
transition-property: color;
-webkit-transition-duration: 0.5s;
transition-duration: 0.5s;
}
.enquiryBtn2 .btn_caret {
height: 45px;
background: var(--bs-dark);
display: inline-block;
padding: 0px 12px;
color: var(--bs-body-bg);
margin-left: 15px;
}
.enquiryBtn2:before {
content: "";
position: absolute;
z-index: -1;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: #202026;
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transform-origin: 0% 10% 0;
transform-origin: 0% 10% 0;
-webkit-transition-property: transform;
transition-property: transform;
-webkit-transition-duration: 0.5s;
transition-duration: 0.5s;
-webkit-transition-timing-function: ease-out;
transition-timing-function: ease-out;
}
.enquiryBtn2:hover:before {
-webkit-transform: scaleX(1);
transform: scaleX(1);
-webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
}
.enquiryBtn2:hover {
color: #fff;
background: #1e1e2a;
}
/**/
.processSection {
position: relative;
width: 100%;
display: block;
}
.title_H1 {
background: #ef682f;
margin: 0;
padding: 10px 10px;
color: #fff;
font-size: 18px;
text-transform: inherit;
position: relative;
margin-bottom: 15px;
border-radius: 6px;
}
.timeline {
display: flex;
flex-direction: column;
position: relative;
}
.timeline__event {
margin-bottom: 20px;
position: relative;
display: flex;
margin: 20px 0;
border-radius: 6px;
align-self: center;
width: 100%;
}
.timeline__event:nth-child(2n+1) {
flex-direction: row-reverse;
}
.timeline__event:nth-child(2n+1) .timelineImg {
border-radius: 0 6px 6px 0;
}
.timeline__event:nth-child(2n+1) .timeline__event__content {
border-radius: 6px 0 0 6px;
}
.timeline__event:nth-child(2n+1) .timelineStep:before {
content: "";
width: 2px;
height: 100%;
position: absolute;
top: 100%;
left: 50%;
right: auto;
z-index: 0;
transform: translateX(-50%);
}
.timeline__event:nth-child(2n+1) .timelineStep:after {
content: "";
width: 100%;
height: 2px;
position: absolute;
right: 100%;
z-index: 0;
top: 50%;
left: auto;
transform: translateY(-50%);
}
.timelineTitle {
font-size: 18px;
line-height: 1.5;
text-transform: inherit;
font-weight: 600;
color: #1e1e2a;
margin-bottom: 5px;
}
.timeline__event__content {
padding: 20px;
box-shadow: 0 30px 60px -12px rgba(50, 50, 93, 0.25), 0 18px 36px -18px rgba(0, 0, 0, 0.3), 0 -12px 36px -8px rgba(0, 0, 0, 0.025);
background: #fff;
width: calc(100% - 84px);
border-radius: 0 6px 6px 0;
}
.timelineImg {
color: #f6a4ec;
font-size: 1.5rem;
font-weight: 600;
background: #9251ac;
display: flex;
align-items: center;
justify-content: center;
white-space: nowrap;
padding: 0;
border-radius: 6px 0 0 6px;
z-index: 1;
overflow: hidden;
}
.timelineStep {
display: flex;
align-items: center;
justify-content: center;
color: #ef682f;
padding: 20px;
align-self: center;
margin: 0 20px;
background: #f9dbcf;
border-radius: 100%;
width: 40px;
box-shadow: 0 30px 60px -12px rgba(50, 50, 93, 0.25), 0 18px 36px -18px rgba(0, 0, 0, 0.3), 0 -12px 36px -8px rgba(0, 0, 0, 0.025);
padding: 40px;
height: 40px;
position: relative;
font-size: 45px;
font-weight: 400;
}
.timelineStep i {
font-size: 32px;
}
.timelineStep:before {
content: "";
width: 2px;
height: 100%;
background: #f9dbcf;
position: absolute;
top: 100%;
z-index: 0;
left: 50%;
transform: translateX(-50%);
}
.timelineStep:after {
content: "";
width: 100%;
height: 2px;
background: #f9dbcf;
position: absolute;
left: 100%;
z-index: 0;
top: 50%;
transform: translateY(-50%);
}
.timelineDec {
flex-basis: 60%;
}
.timelineDec p {
margin-bottom: 0;
letter-spacing: normal;
}
.timeline__event:nth-child(2n) .timelineStep:before,
.timeline__event:nth-child(2n) .timelineStep:after {
background: #87bbfe;
}
.timeline__event:nth-child(2n) .timelineStep {
background: #f9dbcf;
color: #ef682f;
}
.timeline__event:nth-child(2n) .timelineStep:before,
.timeline__event:nth-child(2n) .timelineStep:after {
background: #f9dbcf;
}
.timeline__event:nth-child(2n) .timelineTitle {
color: #ef682f;
}
.timeline__event:last-child .timelineStep:before {
content: none;
}
@media (max-width: 786px) {
.timeline__event {
flex-direction: column;
align-self: center;
}
.timeline__event__content {
width: 100%;
}
.timelineStep {
border-radius: 6px 6px 0 0;
width: 100%;
margin: 0;
box-shadow: none;
}
.timelineStep:before,
.timelineStep:after {
display: none;
}
.timelineImg {
border-radius: 0;
padding: 20px;
}
.timeline__event:nth-child(2n+1) {
flex-direction: column;
align-self: center;
}
.timeline__event:nth-child(2n+1) .timelineImg {
border-radius: 0;
padding: 20px;
}
.timeline__event:nth-child(2n+1) .timelineStep {
border-radius: 6px 6px 0 0;
margin: 0;
}
}
.sizeChart img {
width: 100%;
border-radius: 12px;
border: 1px solid #ccc;
}
.left_contact textarea.form-control {
min-height: 80px;
height: 80px !important;
border-radius: 4px;
}
/**/
/* FAQS */
.faq_section {
float: left;
width: 100%;
margin: 0;
padding: 40px 0;
background: #fff;
}
.faq_section .maxWidth p {
color: #333;
}
.accordion-header {
padding: 0;
}
.accordion-item {
margin-bottom: 15px;
border-radius: 16px !important;
overflow: hidden;
}
.accordion-item:not(:first-of-type) {
border: 1px solid rgba(0, 0, 0, 0.125);
}
.accordion-button {
padding: 12px 15px;
font-size: 18px;
font-weight: normal;
text-transform: initial;
font-family: 'Roboto', sans-serif;
}
.accordion-button:not(.collapsed) {
color: #fff;
background: #ef682f;
font-weight: normal;
}
.accordion-button:not(.collapsed):after {
background-image: url("data:image/svg+xml;charset=utf-8,");
transform: rotate(0deg);
}
.accordion-button:hover,
.accordion-button:focus {
color: #fff;
background: #ef682f;
}
.accordion-button:hover:after {
background-image: url("data:image/svg+xml;charset=utf-8,");
transform: rotate(-180deg);
}
.accordion-body p {
font-size: 15px;
line-height: 24px;
}
/**/
.process-section {
float: left;
width: 100%;
padding: 70px 0;
background-color: rgb(242 246 247);
}
.process-section .maxWidth p {
color: #333;
}
.process-section .step {
position: absolute;
top: 40px;
left: 50px;
z-index: 55;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
right: 50px;
z-index: -1;
}
.process-section .step img {
width: 100%;
}
.process-wrapper {
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
}
.process-item {
text-align: center;
width: 195px;
position: relative;
}
.process-item .processInfo {
padding: 0 15px;
}
.processInfoTitle {
font-size: 16px;
margin-bottom: 8px;
font-weight: 600;
color: var(--theme-color);
font-family: Nunito, sans-serif;
line-height: 1.2;
}
.process-wrapper .process-item:nth-child(even) {
margin-top: -45px;
}
.process-wrapper .process-item:nth-child(odd) {
margin-top: 50px;
}
.process-wrapper .process-item:nth-child(4) {
margin-top: 10px;
}
.process-wrapper .process-item:nth-child(5) {
margin-top: -90px;
}
.process-wrapper .process-item:nth-child(6) {
margin-top: -100px;
}
.circle {
width: 120px;
height: 120px;
background: #fff;
border-radius: 50%;
margin: 0 auto 15px;
position: relative;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
}
.circle img {
width: 120px;
height: 120px;
border-radius: 50%;
}
.step-number {
position: absolute;
top: 5px;
left: 5px;
background: #333;
color: #fff;
width: 28px;
height: 28px;
border-radius: 50%;
font-size: 13px;
display: flex;
align-items: center;
justify-content: center;
}
.process-item h4 {
font-size: 16px;
margin-bottom: 8px;
font-weight: 600;
color: var(--theme-color);
}
.process-item p {
font-size: 14px;
color: #333;
letter-spacing: normal;
line-height: 1.4;
}
.arrow {
font-size: 26px;
margin: 0 10px;
color: #999;
}
.process-wrapper {
float: left;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
position: relative;
}
.process-wrapper .step {
position: absolute;
top: 40px;
left: 100px;
z-index: 55;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
right: 100px;
z-index: 0;
}
.process-wrapper .step img {
width: 100%;
}
/* Responsive */
@media (max-width: 992px) {
.process-wrapper {
flex-direction: column;
}
.arrow {
display: none;
}
.process-item {
margin-bottom: 30px;
}
}
.allInnerBanner {
float: left;
width: 100%;
background-color: #fff;
position: relative;
width: 100%;
overflow: hidden
}
.allInnerBanner img {
width: 100%
}
.allInnerBanner .bannerOverlay {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
z-index: 1;
z-index: 5;
display: block
}
.allInnerBanner .bannerOverlay .container {
display: flex;
align-items: center;
justify-content: center;
height: 100%
}
.bannerSubTitle {
font-size: 20px;
color: #1e1e2a;
margin-bottom: 10px;
text-shadow: -2px 1px 2px rgba(255, 255, 255, 0.90);
}
.h1BannerTitle {
font-size: 32px;
color: #1e1e2a;
font-weight: 800;
margin-top: 45px;
}
.allInnerBanner .bannerOverlay .allInnerBannerTitle {
color: #1e1e2a;
font-size: 38px;
line-height: 1.4;
margin: 0;
padding: 0;
width: 100%;
font-weight: 600;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
text-align: center;
}
.allInnerBanner .bannerOverlay .allInnerBannerTitle span {
text-align: center;
}
.allInnerBanner .bannerOverlay .allInnerBannerTitle strong {
color: #ef682f;
font-weight: 700;
}
.right_content .buttons {
margin-bottom: 15px;
}
.allInnerBanner_2 {
position: relative;
}
.allInnerBanner_2:before {
content: "";
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
background: #000;
opacity: 0.6;
mix-blend-mode: initial;
z-index: 1;
}
.allInnerBanner_2 .container .section-title {
font-size: 40px;
font-weight: 800;
}
.sectionSubTitle {
margin: 0 0 10px;
font-size: 18px;
color: #fff;
text-transform: initial;
}
.contactBanner{
float: left;
width: 100%;
margin: 0;
padding: 0;
}