| Server IP : 200.152.183.196 / Your IP : 216.73.216.150 Web Server : nginx/1.20.2 System : Linux server.teclabs.com.br 4.9.0-19-amd64 #1 SMP Debian 4.9.320-2 (2022-06-30) x86_64 User : re8rc56e54 ( 10140) PHP Version : 7.3.33 Disable Function : opcache_get_status MySQL : OFF | cURL : ON | WGET : OFF | Perl : OFF | Python : OFF | Sudo : OFF | Pkexec : OFF Directory : /var/www/vhosts/cial.ind.br/httpdocs/assets/css/ |
Upload File : |
/*****************************************************************
Template Name : Inspire - IT Solution For Your Business Website Template
Author : Cute Themes
Version : 1.0
Created : 2021
File Description : Main css file of the template
*****************************************************************/
/*****************************************************************
** - 01 - Default CSS
** - 02 - Navbar Area CSS
** - 03 - All Home Area CSS
** - 04 - Mini Features Section CSS
** - 05 - All About Section CSS
** - 06 - Call Button Section CSS
** - 07 - All Services Section CSS
** - 08 - Single Services Section CSS
** - 09 - Why Choosing Us Section CSS
** - 10 - Counter Section CSS
** - 11 - How It Works Section CSS
** - 12 - All Projects Section CSS
** - 13 - Single Projects Section CSS
** - 14 - All Testimonial Section CSS
** - 15 - Blog Section CSS
** - 16 - Blog Page Sidebar Widget Area CSS
** - 17 - Blog Details Page Area CSS
** - 18 - Hire Section CSS
** - 19 - Industries We Serve Section CSS
** - 20 - Partner Section CSS
** - 21 - All Footer Section CSS
** - 22 - Other Page Banner Title Area CSS
** - 23 - All Contact Page Section CSS
** - 24 - Pricing Page Section CSS
** - 25 - Team Page Area CSS
** - 26 - Faq Page Area CSS
** - 27 - 404 Error Page Area CSS
** - 28 - Coming Soon Page Area CSS
** - 29 - Terms & Conditions - Privacy Policy Page Section CSS
** - 30 - Cartões laterais
*****************************************************************/
/**************************************
** - 01 - Default CSS
**************************************/
body {
padding: 0;
margin: 0;
font-size: 15px;
font-weight: normal;
font-variant: normal;
overflow-x: hidden;
transition: all .2s ease-out;
-webkit-transition: all .2s ease-out;
font-family: 'Source Sans Pro', sans-serif;
}
img {
max-width: 100%;
height: auto;
}
button {
outline: 0 !important;
}
.d-table {
width: 100%;
height: 100%;
}
.d-table-cell {
vertical-align: middle;
}
.ptb-100 {
padding-top: 100px;
padding-bottom: 100px;
}
.ptb-10 {
padding-top:10px;
padding-bottom:10px;
}
.pt-70 {
padding-top: 70px;
}
.pb-70 {
padding-bottom: 70px;
}
.pb-100 {
padding-bottom: 100px;
}
.pt-100 {
padding-top: 100px;
}
.bg-grey {
background-color: rgba(136, 116, 181, .11) !important;
}
.color-text {
color: #ff0000;
}
.author-name {
color: #fff;
font-size: 15px;
font-weight: 600;
}
dl, ol, ul {
padding: 0;
margin: 0;
list-style: none;
}
.section-padding {
padding: 100px 0;
}
a {
text-decoration: none;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
will-change: transform;
outline: 0 !important;
color: #a30000;
}
a:hover {
text-decoration: none;
color: #ff0000;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
line-height: 1.3;
margin: 0;
font-family: 'Shippori Antique B1', sans-serif;
font-weight: 700;
text-transform: uppercase;
color: #4e4e4e;
}
p {
font-size: 15px;
line-height: 1.8;
color: #000;
margin-bottom: 15px;
font-weight: 400;
font-family: 'Source Sans Pro', sans-serif;
}
p:last-child {
margin-bottom: 0;
}
.section-iframe{
text-align: center;
margin-top: -100px;
margin-bottom: 100px;
width: 100%;
}
.iframe-youtube{
width: 100%;
height: 345px;
}
.default-btn {
border: none;
position: relative;
display: inline-block;
text-align: center;
overflow: hidden;
z-index: 1;
color: #ffffff;
background-color: #ff0000;
border-radius: 5px;
font-weight: 600;
font-size: 15px;
padding-left: 40px;
padding-right: 40px;
padding-top: 12px;
padding-bottom: 12px;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
will-change: transform;
}
.btn-primary {
border: none;
display: inline-block;
line-height: initial;
border-radius: 3px;
-webkit-transition: 0.5s;
transition: 0.5s;
padding: 12px 30px;
position: relative;
z-index: 1;
font-size: 15px;
font-weight: 600;
}
.btn-primary {
display: inline-block;
color: #ffffff;
background-color: #ff0000;
background-image: linear-gradient(135deg, #a30000 0%, #a30000 50%, #ff0000 50%, #ff0000 100%);
background-position: right center;
text-align: center;
text-decoration: none;
-webkit-transition-delay: 0s;
transition-delay: 0s;
-webkit-transition-duration: 0.5s;
transition-duration: 0.5s;
-webkit-transition-property: color, background;
transition-property: color, background;
-webkit-transition-timing-function: ease;
transition-timing-function: ease;
background-size: 270% auto;
}
.btn-primary:hover, .btn-primary:focus {
background-position: left center;
-webkit-box-shadow: unset !important;
-moz-box-shadow: unset !important;
box-shadow: unset !important;
}
.btn-mr-right-20 {
margin-right: 20px;
}
/* margin top */
.mt-5 {
margin-top: 5px;
}
.mt-10 {
margin-top: 10px;
}
.mt-15 {
margin-top: 15px;
}
.mt-20 {
margin-top: 20px;
}
.mt-25 {
margin-top: 25px;
}
.mt-30 {
margin-top: 30px;
}
.mt-35 {
margin-top: 35px;
}
.mt-40 {
margin-top: 40px;
}
.mt-45 {
margin-top: 45px;
}
/* margin bottom */
.mb-5 {
margin-bottom: 5px;
}
.mb-8 {
margin-bottom: 8px;
}
.mb-10 {
margin-bottom: 10px;
}
.mb-15 {
margin-bottom: 15px;
}
.mb-20 {
margin-bottom: 20px;
}
.mb-25 {
margin-bottom: 25px;
}
.mb-30 {
margin-bottom: 30px;
}
.mb-35 {
margin-bottom: 35px;
}
.mb-40 {
margin-bottom: 40px;
}
.mb-45 {
margin-bottom: 45px;
}
.mr-15 {
margin-right: 15px;
}
.mr-50 {
margin-right: 50px;
}
/* margin left */
.ml-5 {
margin-left: 5px;
}
.ml-10 {
margin-left: 10px;
}
.ml-15 {
margin-left: 15px;
}
.ml-20 {
margin-left: 20px;
}
.ml-25 {
margin-left: 25px;
}
.ml-30 {
margin-left: 30px;
}
.ml-40 {
margin-left: 40px;
}
.ml-50 {
margin-left: 50px;
}
.fl{
float: left;
}
.fr{
float: right;
}
.section-title {
text-align: center;
margin-bottom: 65px;
}
.section-title h6 {
font-size: 16px;
color: #4e4e4e;
font-weight: 700;
margin-bottom: 10px;
letter-spacing: 2px;
text-transform: uppercase;
}
.section-title h2 {
font-size: 38px;
color: #4e4e4e;
font-weight: 800;
margin: 0;
}
/*****************************************
** - 00 - Go Top CSS
******************************************/
.go-top {
position: fixed;
cursor: pointer;
top: 0;
right: 35px;
color: #ffffff;
border:solid 1px #ffffff;
background-color: #ff0000;
z-index: 4;
width: 45px;
text-align: center;
height: 45px;
line-height: 45px;
opacity: 0;
visibility: hidden;
-webkit-transition: .9s;
transition: .9s;
border-radius: 0;
}
.go-top.active {
top: 85%;
-webkit-transform: translateY(-98%);
transform: translateY(-98%);
opacity: 1;
visibility: visible;
}
.go-top i {
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
left: 0;
right: 0;
margin: 0 auto;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
}
.go-top i:last-child {
opacity: 0;
visibility: hidden;
top: 60%;
}
.go-top::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
background: #a30000;
opacity: 0;
visibility: hidden;
border-radius: 0;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
}
.go-top:hover, .go-top:focus {
color: #ffffff;
}
.go-top:hover::before, .go-top:focus::before {
opacity: 1;
visibility: visible;
}
.go-top:hover i:first-child, .go-top:focus i:first-child {
opacity: 0;
top: 0;
visibility: hidden;
}
.go-top:hover i:last-child, .go-top:focus i:last-child {
opacity: 1;
visibility: visible;
top: 50%;
}
/**************************************
** - 02 - Navbar Area CSS
**************************************/
.inspire-responsive-nav {
display: none;
}
.navbar-area .inspire-nav-top-bar {
background: #ff0000;
padding-top: 8px;
padding-bottom: 8px;
}
.navbar-area .inspire-nav-top-bar .call-to-action p {
margin: 0 13px 0 0;
display: inline-block;
color: #ffffff;
font-size: 15px;
}
.call-to-action a{
color: #fff;
font-size: 15px;
margin: 0 13px 0 0;
}
.call-to-action a:hover{
color: #a30000;
}
.dropdown {
position: relative;
display: inline-block;
}
.dropdown-content {
display: block;
position: absolute;
background-color: #fff;
min-width: 250px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;
border-radius: 0;
padding: 0;
margin: 15px 0;
visibility: hidden;
opacity: 0;
transition: all 400ms;
}
.dropdown:hover .dropdown-content {
display: block;
visibility: visible;
opacity: 1;
transform: translateY(-10px);
}
.dropdown-content a {
padding: 12px 16px;
text-decoration: none;
display: block;
color: #a30000;
}
.dropdown-content a:hover {
color: #ff0000;
}
.navbar-area .inspire-nav-top-bar .call-to-action p i {
margin-right: 3px;
font-size: 14px;
}
.navbar-area .inspire-nav-top-bar .call-to-action p a {
color: #ffffff;
}
.navbar-area .inspire-nav-top-bar .call-to-action p a:hover, .navbar-area .inspire-nav-top-bar .call-to-action p a:focus {
text-decoration: underline;
}
.navbar-area .inspire-nav-top-bar .top-social {
float: right;
padding: 0;
margin: 0 0 0 10px;
list-style-type: none;
}
.navbar-area .inspire-nav-top-bar .top-social li {
display: inline-block;
vertical-align: sub;
}
.navbar-area .inspire-nav-top-bar .top-social li a {
font-size: 14px;
margin-left: 10px;
display: inline-block;
height: 30px;
width: 30px;
line-height: 30px;
color: #fff;
background-color: transparent;
border: 1px solid transparent;
border-radius: 50px;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
text-align: center;
}
.navbar-area .inspire-nav-top-bar .top-social li a:hover, .navbar-area .inspire-nav-top-bar .top-social li a:focus {
color: #fff;
background-color: transparent;
border: 1px solid #ffffff;
}
.navbar-area .inspire-nav-top-bar.template-color-bg {
background: #ff0000;
border-bottom: none;
}
.navbar-area .inspire-nav-top-bar.template-color-bg .call-to-action p a {
color: #ffffff;
}
.navbar-area .inspire-nav-top-bar.template-color-bg .top-social li a {
color: #ffffff;
}
.navbar-area.is-sticky .inspire-nav-top-bar {
display: none;
}
.inspire-nav {
background-color: #fff;
padding-top: 0px;
padding-bottom: 0px;
padding-right: 0;
padding-left: 0;
}
.inspire-nav .navbar {
padding-right: 0;
padding-top: 0;
padding-left: 0;
padding-bottom: 0;
}
.inspire-nav .navbar ul {
padding-left: 0;
list-style-type: none;
margin-bottom: 0;
}
.inspire-nav .navbar .navbar-nav {
margin: auto;
}
.inspire-nav .navbar .navbar-nav .nav-item {
position: relative;
padding-top: 15px;
padding-bottom: 15px;
padding-left: 0;
padding-right: 0;
}
.inspire-nav .navbar .navbar-nav .nav-item a {
font-size: 15.3px;
font-weight: 400;
color: #000;
padding-left: 0;
padding-right: 0;
padding-top: 0;
padding-bottom: 0;
margin-left: 15px;
margin-right: 15px;
}
/*
.effect-one > a {
position: relative;
&:before {
content: "";
position: absolute;
width: 100%;
height: 2px;
bottom: 0;
margin: -5px 0;
background-color: white;
visibility: hidden;
transform: scaleX(0);
transition: all 0.4s ease-in-out 0s;
}
&:hover:before {
visibility: visible;
transform: scaleX(1);
}
}
*/
.inspire-nav .navbar .navbar-nav .nav-item a:hover, .inspire-nav .navbar .navbar-nav .nav-item a:focus, .inspire-nav .navbar .navbar-nav .nav-item a.active {
color: #ff0000;
visibility: visible;
transform: scaleX(1);
}
.inspire-nav .navbar .navbar-nav .nav-item a i {
font-size: 10px;
position: relative;
top: -1px;
margin-left: 1px;
}
.inspire-nav .navbar .navbar-nav .nav-item:last-child a {
margin-right: 0;
}
.inspire-nav .navbar .navbar-nav .nav-item:first-child a {
margin-left: 0;
}
.inspire-nav .navbar .navbar-nav .nav-item:hover a, .inspire-nav .navbar .navbar-nav .nav-item:focus a, .inspire-nav .navbar .navbar-nav .nav-item.active a {
color: #ff0000;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu {
-webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
background: #ffffff;
position: absolute;
border: none;
top: 80px;
left: 0;
width: 300px;
z-index: 99;
display: block;
opacity: 0;
visibility: hidden;
border-radius: 0;
-webkit-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
padding: 0;
margin: 0;
height: 340px;
overflow-y: scroll;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li {
padding-top: 12px;
padding-left: 20px;
padding-right: 12px;
padding-bottom: 12px;
border-bottom: 1px dashed #daf9d2;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li a::before {
content: '';
position: absolute;
left: -5px;
top: 50%;
width: 0;
height: 1px;
background-color: #ff0000;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: all 300ms ease-out;
transition: all 300ms ease-out;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li a {
text-transform: capitalize;
padding: 0;
margin: 0;
color: #a30000;
font-size: 15px;
font-weight: 400;
position: relative;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li a:hover, .inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li a:focus, .inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li a.active {
color: #ff0000;
padding-left: 5px;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li a:hover::before, .inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li a:focus::before, .inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li a.active::before {
width: 5px;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu {
left: -245px;
top: 0;
opacity: 0;
visibility: hidden;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li a {
color: #696997;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li a:hover, .inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li a:focus, .inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li a.active {
color: #ff0000;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu {
left: -245px;
top: 0;
opacity: 0;
visibility: hidden;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li a {
color: #696997;
text-transform: capitalize;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li a:hover, .inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li a:focus, .inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li a.active {
color: #ff0000;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu {
left: -245px;
top: 0;
opacity: 0;
visibility: hidden;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a {
color: #696997;
text-transform: capitalize;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a:hover, .inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a:focus, .inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a.active {
color: #ff0000;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu {
left: 195px;
top: 0;
opacity: 0;
visibility: hidden;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a {
color: #696997;
text-transform: capitalize;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a:hover, .inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a:focus, .inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a.active {
color: #ff0000;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu {
left: 195px;
top: 0;
opacity: 0;
visibility: hidden;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a {
color: #696997;
text-transform: capitalize;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a:hover, .inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a:focus, .inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a.active {
color: #ff0000;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu {
left: 195px;
top: 0;
opacity: 0;
visibility: hidden;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a {
color: #696997;
text-transform: capitalize;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a:hover, .inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a:focus, .inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a.active {
color: #ff0000;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li.active a {
color: #ff0000;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li:hover .dropdown-menu {
opacity: 1;
visibility: visible;
top: -15px;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li.active a {
color: #ff0000;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li:hover .dropdown-menu {
opacity: 1;
visibility: visible;
top: -15px;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li.active a {
color: #ff0000;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li:hover .dropdown-menu {
opacity: 1;
visibility: visible;
top: -15px;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li.active a {
color: #ff0000;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li:hover .dropdown-menu {
opacity: 1;
visibility: visible;
top: -15px;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li.active a {
color: #ff0000;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li:hover .dropdown-menu {
opacity: 1;
visibility: visible;
top: 0px;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li.active a {
color: #ff0000;
}
.inspire-nav .navbar .navbar-nav .nav-item .dropdown-menu li:hover .dropdown-menu {
opacity: 1;
visibility: visible;
top: 0px;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
}
.inspire-nav .navbar .navbar-nav .nav-item:hover .dropdown-menu {
opacity: 1;
visibility: visible;
top: 100%;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
}
.inspire-nav .navbar .other-option {
margin-left: 0;
margin-top: 0px;
}
.inspire-nav .black-logo {
display: none;
}
.navbar-area {
background-color: #ffffff;
position: relative;
z-index: 999;
width: 100%;
height: auto;
-webkit-box-shadow: 0 0px 8px 0 rgba(108, 112, 138, 0.15);
-moz-box-shadow: 0 0px 8px 0 rgba(108, 112, 138, 0.15);
box-shadow: 0 0px 8px 0 rgba(108, 112, 138, 0.15);
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
}
.navbar-area.is-sticky {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 999999;
-webkit-box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06);
-moz-box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06);
box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06);
background: #ffffff !important;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
will-change: transform;
}
.inspire-nav.inspire-fixed-nav.scroll-to-fixed-fixed {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 9999;
-webkit-box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06);
-moz-box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06);
box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06);
background: #ffffff;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
will-change: transform;
}
.navbar-area.is-sticky .navbar-nav .nav-item a {
color: #333;
}
.navbar-area.is-sticky .navbar-nav .nav-item a:hover, .navbar-area.is-sticky .navbar-nav .nav-item a:focus, .navbar-area.is-sticky .navbar-nav .nav-item a.active {
color: #ff0000;
}
.navbar-area.is-sticky .inspire-nav .navbar-brand .white-logo {
display: none;
}
.navbar-area.is-sticky .inspire-nav .navbar-brand .black-logo {
display: block;
}
@media only screen and (max-width: 991px) {
.navbar-area {
padding-top: 20px;
padding-bottom: 20px;
}
.navbar-area.is-sticky {
border-bottom: none;
-webkit-box-shadow: 0 7px 13px 0 rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0 7px 13px 0 rgba(0, 0, 0, 0.1);
box-shadow: 0 7px 13px 0 rgba(0, 0, 0, 0.1);
padding-top: 20px;
padding-bottom: 20px;
}
.navbar-area.is-sticky .logo .white-logo {
display: none;
}
.navbar-area.is-sticky .logo .black-logo {
display: block;
}
.inspire-responsive-nav {
display: block;
}
.inspire-responsive-nav .inspire-responsive-menu {
position: relative;
}
.inspire-responsive-nav .inspire-responsive-menu.mean-container .mean-nav ul {
font-size: 14px;
}
.inspire-responsive-nav .inspire-responsive-menu.mean-container .mean-nav ul li a {
font-size: 15px;
}
.inspire-responsive-nav .inspire-responsive-menu.mean-container .mean-nav ul li a.active {
color: #ff0000;
}
.inspire-responsive-nav .inspire-responsive-menu.mean-container .mean-nav ul li li a {
font-size: 15px;
}
.inspire-responsive-nav .inspire-responsive-menu.mean-container .navbar-nav {
overflow-y: scroll;
height: 336px;
-webkit-box-shadow: 0 7px 13px 0 rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0 7px 13px 0 rgba(0, 0, 0, 0.1);
box-shadow: 0 7px 13px 0 rgba(0, 0, 0, 0.1);
}
.inspire-responsive-nav .inspire-responsive-menu.mean-container .others-options {
display: none;
}
.inspire-responsive-nav .mean-container a.meanmenu-reveal {
margin-top: 10px;
color: #a30000;
}
.inspire-responsive-nav .mean-container a.meanmenu-reveal span {
background: #a30000;
}
.inspire-responsive-nav .logo {
position: relative;
width: 50%;
z-index: 999;
}
.inspire-responsive-nav .logo .white-logo {
display: block;
}
.inspire-responsive-nav .logo .black-logo {
display: none;
}
.inspire-nav {
display: none;
}
}
.inspire-nav .navbar .option-item {
margin-right: 30px;
position: relative;
}
.inspire-nav .navbar .option-item .search-btn {
font-size: 15px;
color: #737373;
cursor: pointer;
background: transparent;
width: 25px;
height: 25px;
line-height: 25px;
text-align: center;
border-radius: 3px;
-webkit-transition: 0.5s;
transition: 0.5s;
}
.inspire-nav .navbar .option-item .close-btn {
font-size: 16px;
color: #737373;
cursor: pointer;
display: none;
background: transparent;
width: 25px;
height: 25px;
line-height: 25px;
text-align: center;
border-radius: 3px;
-webkit-transition: 0.5s;
transition: 0.5s;
}
.inspire-nav .navbar .option-item .close-btn.active {
display: block;
}
.search-overlay {
display: none;
}
.pop-bg{background-color: rgba(0, 0, 0, 0.8); height:100%; width: 100%; position: fixed; top: 0; left: 0; z-index: 1000;display: none;}
.popup{padding:35px; box-sizing: border-box; background-color: #ddd; width: 100%;max-width: 600px; position: relative; z-index: 1;margin:10% auto;}
.pop-button-close{font-size: 30px; position: absolute; top: 0; right: 0;}
.pop-notification{text-align: center; text-decoration: underline;}
.search-overlay.search-popup {
position: absolute;
top: 60px;
width: 350px;
background: #ffffff;
z-index: 2;
right: 0;
padding: 20px;
-webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
margin-top: 0;
}
.search-overlay.search-popup .search-form {
position: relative;
}
.search-overlay.search-popup .search-form .search-input {
display: block;
width: 100%;
height: 50px;
line-height: initial;
border: 1px solid #e0e0e0;
color: #02162e;
outline: 0;
-webkit-transition: 0.5s;
transition: 0.5s;
padding-top: 4px;
padding-left: 10px;
}
.search-overlay.search-popup .search-form .search-button {
position: absolute;
right: 0;
top: 0;
height: 50px;
background: #ff0000;
border: none;
width: 50px;
line-height: 53px;
outline: 0;
color: #ffffff;
-webkit-transition: 0.5s;
transition: 0.5s;
padding: 0;
}
.search-overlay.search-popup .search-form .search-button i {
font-size: 16px;
}
/**************************************
** - 03 - All Home Area CSS
**************************************/
.home-slider-area {
min-height: 630px;
position: relative;
z-index: 1;
}
.home-slider,
.home-slider-single-item {
height: 630px;
overflow: hidden;
display: block;
}
.home-slider-single-item {
display: flex;
align-items: center;
padding: 70px 0;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
position: relative;
z-index: 1;
width: 100%;
}
.home-slider-single-item::before {
position: absolute;
top: 0;
content: "";
left: 0px;
padding: 0;
height: 100%;
width: 100%;
opacity: 0;
z-index: -1;
background: #222;
}
.home-slider-single-item .container {
position: relative;
z-index: 3;
}
.home-slider-single-item::after {
content: none;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: rgba(255, 255, 255, .7);
}
.home-slider-content {
width: 100%;
max-width: 510px;
padding-bottom: 50px;
text-align: left;
}
.home-slider-title {
color: #fff;
font-size: 45px;
font-weight: 800;
margin-bottom: 20px;
}
.home-slider-description {
max-width: 500px;
}
.home-slider-description p {
margin-bottom: 0;
color: #fff;
font-size: 18px;
}
.home-slider-btn-box {
margin-top: 25px;
}
.valign {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.flickity-page-dots {
position: relative;
bottom: inherit;
margin-top: 33px;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
}
.flickity-page-dots .dot {
position: relative;
width: 14px;
height: 14px;
display: flex;
align-items: center;
justify-content: center;
outline: 0;
background: 0 0;
opacity: 1;
margin: 0 1.125rem .625rem 0;
}
.flickity-page-dots .dot:last-child {
margin-right: 0;
}
.flickity-page-dots .dot.is-selected::after {
background-color: #ff0000;
width: 100%;
height: 100%;
}
.flickity-page-dots .dot:hover::after {
background-color: #ff0000;
}
.flickity-page-dots .dot::after {
content: "";
width: 10px;
height: 10px;
background-color: transparent;
border: 1px solid #ff0000;
margin: 0;
border-radius: 50%;
outline: 0;
transition: all .25s;
}
.flickity-dots-white .flickity-page-dots .dot::after {
background-color: #fff;
}
.flickity-dots-white .flickity-page-dots .dot.is-selected::after {
background-color: #ff0000;
}
.flickity-prev-next-button {
width: 44px;
height: 44px;
border-radius: 50%;
background: #fff;
border: 0;
display: flex;
}
.flickity-prev-next-button .flickity-button-icon {
position: relative;
left: 0;
top: 0;
width: 14px;
height: 14px;
margin: auto;
fill: #ff0000;
}
.ios .flickity-prev-next-button .flickity-button-icon {
width: 15px;
height: 15px;
}
.carusel-col {
padding: 0;
margin-right: 30px;
}
.carusel-col:last-child {
margin-right: 0;
}
.flickity-dots-absolute .flickity-page-dots {
position: absolute;
bottom: 25px;
}
/**************************************
** - 03.01 - Demo-3 Home Area CSS
**************************************/
.home-area {
overflow: hidden;
position: relative;
z-index: 1;
height: 650px;
background-image: url(../imgs/home3-bg.svg);
background-size: cover;
background-repeat: no-repeat;
}
/*
.home-area::after {
position: absolute;
top: 0;
content: "";
left: 0;
padding: 0;
height: 100%;
width: 100%;
opacity: .5;
z-index: -1;
background: #060620;
}
*/
.main-banner-content {
max-width: 510px;
padding-bottom: 50px;
}
.main-banner-content h1 {
font-size: 40px;
color: #333;
margin: 0 0 20px 0;
font-weight: 800;
}
.main-banner-content p {
color: #555;
margin: 0 0 0 0;
}
.main-banner-content .banner-btn {
margin-top: 35px;
}
/**************************************
* 04. Mini Features Section Style
*************************************/
.mini-feature-area {
margin-top: -85px;
}
.single-mini-feature {
position: relative;
z-index: 1;
padding: 30px 15px;
background: #fff;
text-align: center;
-webkit-box-shadow: 0px 2px 25px 0px rgba(85, 85, 85, 0.1);
box-shadow: 0px 2px 25px 0px rgba(85, 85, 85, 0.1);
border-radius: 5px;
margin-top: 35px;
-webkit-transition: all .3s;
transition: all .3s;
overflow: hidden;
}
.single-mini-feature .mini-feature-bg-icon {
color: #a30000;
opacity: .07;
position: absolute;
left: 0;
right: 0;
bottom: -100px;
margin: 0 auto;
z-index: -1;
-webkit-transition: 0.5s;
transition: 0.5s;
}
.single-mini-feature .mini-feature-bg-icon i {
font-size: 200px;
}
.single-mini-feature-front {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
justify-content: center;
}
.mini-feature-icon i {
color: #a30000;
font-size: 35px;
width: 70px;
height: 70px;
line-height: 70px;
text-align: center;
border-radius: 38% 62% 62% 38% / 41% 44% 56% 59%;
display: block;
background: #f7f7f7;
}
.mini-feature-text {
text-align: left;
margin-left: 25px;
}
.mini-feature-text h3 {
font-size: 18px;
margin-bottom: 10px;
color: #333;
font-weight: 700;
}
.laundry-mini-feature h3 {
margin-bottom: 0px;
}
/**************************************
** - 05 - All About Section CSS
*************************************/
.about-area {
position: relative;
z-index: 1;
}
.about-image img {
border-radius: 5px;
}
.about-content {
padding-right: 0px;
}
.about-content h6 {
font-size: 16px;
color: #a30000;
font-weight: 700;
margin-bottom: 10px;
letter-spacing: 2px;
text-transform: uppercase;
}
.about-content h2 {
font-size: 38px;
font-weight: 700;
margin-top: 10px;
margin-bottom: 15px;
}
ul.about-list-box {
max-width: 400px;
margin-top: 30px;
}
ul.about-list-box li {
display: flex;
margin-bottom: 25px;
}
ul.about-list-box li:last-child {
margin-bottom: 0px;
}
ul.about-list-box li .about-list-icon i {
display: inline-block;
font-size: 50px;
margin-right: 25px;
color: #ff0000;
}
ul.about-list-box li .about-list-info h3 {
font-size: 20px;
font-weight: 800;
}
.feature-list-box li {
margin-bottom: 5px;
display: block;
}
.feature-list-box li:last-child {
margin-bottom: 0px;
}
.feature-list-box li i {
padding-right: 5px;
color: #ff0000;
}
.video-btn.popup-youtube {
height: 70px;
width: 70px;
line-height: 75px;
border: 3px solid #ffffff;
border-radius: 50%;
display: block;
position: absolute;
left: 50%;
top: 50%;
z-index: 1;
-webkit-transform: translateY(-50%) translateX(-50%);
transform: translateY(-50%) translateX(-50%);
text-align: center;
}
.video-btn.popup-youtube i {
color: #ffffff;
font-size: 30px;
padding-left: 5px;
}
.about-inner-area {
margin-top: 35px;
}
.about-page-content {
margin-top: 35px;
}
.about-inner-area .about-page-content h3 {
color: #333;
font-size: 25px;
margin-bottom: 10px;
}
/**********************************************
** - 05.01 - Demo-3 About Section CSS
**********************************************/
.about-area .skills {
margin-top: 30px;
}
.about-area .skills .skill-item {
margin-bottom: 25px;
}
.about-area .skills .skill-item h6 {
font-size: 16px;
color: #333;
text-transform: capitalize;
position: relative;
z-index: 4;
font-weight: 600;
margin-bottom: 10px;
}
.about-area .skills .skill-item h6 em {
float: right;
font-size: 15px;
font-style: normal;
}
.about-area .skills .skill-item .skill-progress {
position: relative;
height: 5px;
border-radius: 5px;
background: #f1f1fa;
}
.about-area .skills .skill-item .skill-progress .progres {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 10%;
background-color: #ff0000;
-webkit-transition: all 1.5s;
transition: all 1.5s;
}
/**************************************
** - 06 - Call Button Section CSS
*************************************/
.consultation-area {
padding: 70px 0;
/*background-color: rgba(136, 116, 181, .11);*/
position: relative;
/*z-index: 1;*/
color: #fff;
background: url(../imgs/banner-bg-2.jpg);
background-repeat: no-repeat;
/*background-size: cover;*/
background-position: top;
background-attachment: fixed;
}
.consultation-area::before {
position: absolute;
top: 0;
content: "";
left: 0px;
padding: 0;
height: 100%;
width: 100%;
opacity: .7;
z-index: -1;
background: rgba(47, 55, 136, 0.5);
}
.consultation-content h2 {
color: #fff;
font-size: 38px;
font-weight: 800;
margin-bottom: 10px;
}
.consultation-content p {
color: #fff;
font-size: 16px;
font-weight: 400;
}
.consultation-content .callbtn-number:hover {
color: #ff0000;
}
/**************************************
** - 07 - All Services Section CSS
**************************************/
.single-services-box {
position: relative;
z-index: 1;
padding: 35px 25px;
text-align: center;
border-radius: 5px;
background-color: #ffffff;
margin-bottom: 30px;
-webkit-box-shadow: -1px 3px 20px 0px rgba(82, 90, 101, 0.1);
-moz-box-shadow: -1px 3px 20px 0px rgba(82, 90, 101, 0.1);
box-shadow: -1px 3px 20px 0px rgba(82, 90, 101, 0.1);
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
will-change: transform;
}
.single-services-box:before {
position: absolute;
content: "";
left: 0;
right: 0;
bottom: 0;
min-width: 100%;
border-bottom: 3px solid #ff0000;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
transform: scaleX(0);
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
will-change: transform;
}
.single-services-box:hover:before {
transform: scaleX(1);
}
.single-services-box .services-icon {
position: relative;
display: inline-block;
z-index: 1;
width: 80px;
height: 80px;
line-height: 80px;
border: 1px solid #f5f6ff;
border-radius: 50%;
color: #ff0000;
margin-bottom: 20px;
-webkit-transform: scale(1.1);
transform: scale(1.1);
-webkit-transition: 0.5s;
transition: 0.5s;
}
.single-services-box:hover .services-icon {
border-color: #ff0000;
color: #ffffff;
-webkit-transform: scale(.98);
-moz-transform: scale(.98);
-ms-transform: scale(.98);
-o-transform: scale(.98);
transform: scale(.98);
}
.single-services-box .services-icon::before {
content: '';
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
background-color: #f5f6ff;
z-index: -1;
border-radius: 50%;
margin: 5px;
-webkit-transition: 0.5s;
transition: 0.5s;
}
.single-services-box:hover .services-icon::before {
background: #ff0000;
}
.single-services-box .services-icon i::before {
font-size: 35px;
}
.single-services-box h3 {
font-size: 18px;
margin-bottom: 0;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
will-change: transform;
}
.single-services-box h3 a {
display: inline-block;
}
.single-services-box p {
font-size: 15px;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
will-change: transform;
margin-top: 15px;
margin-bottom: 0;
}
.single-services-box .services-btn {
margin-top: 16px;
}
.single-services-box .services-btn .services-btn-one {
display: inline-block;
font-size: 15px;
color: #ff0000;
font-weight: 700;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
will-change: transform;
}
.single-services-box .services-btn i {
position: relative;
color: #ff0000;
top: 1px;
font-weight: bold;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
}
.single-services-box .services-btn i::before {
font-size: 14px;
}
.single-services-box:hover {
-webkit-transform: translateY(-10px);
transform: translateY(-10px);
}
.single-services-box:hover h3 {
color: #333;
}
.single-services-box:hover h3 a {
color: #333;
}
.single-services-box:hover p {
color: #333;
}
.single-services-box:hover .services-btn .services-btn-one {
color: #333;
}
.single-services-box:hover .services-btn i {
color: #333;
}
.services-more-btn-box {
margin-top: 15px;
}
/*******************************************
** - 07.00 - Services Category Section CSS
*******************************************/
.services-single-category {
position: relative;
padding: 40px 30px;
display: block;
border-radius: 5px;
background: #fff;
margin-top: 30px;
-webkit-box-shadow: 5px 7px 15px 2px rgba(82, 90, 101, 0.12);
-moz-box-shadow: 5px 7px 15px 2px rgba(82, 90, 101, 0.12);
box-shadow: 5px 7px 15px 2px rgba(82, 90, 101, 0.12);
overflow: hidden;
-webkit-transition: all 300ms ease-out;
transition: all 300ms ease-out;
}
.services-single-category:hover {
-webkit-transform: translateY(2px);
transform: translateY(-5px);-webkit-box-shadow: 0 30px 60px -12px rgba(50,50,93,.25), 0 18px 36px -18px rgba(0,0,0,.3), 0 -12px 36px -8px rgba(0,0,0,.025);
box-shadow: 0 30px 60px -12px rgba(50,50,93,.25), 0 18px 36px -18px rgba(0,0,0,.3), 0 -12px 36px -8px rgba(0,0,0,.025);
}
.services-single-category-icon {
position: absolute;
left: -15px;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
.services-single-category-info {
padding-left: 75px;
}
.services-single-category-icon i {
width: 90px;
height: 90px;
background: #ff0000;
display: block;
text-align: center;
line-height: 90px;
color: #fff;
border-radius: 50%;
}
.services-single-category-icon i.icon:before {
font-size: 50px;
}
.services-single-category-info h3 {
font-size: 18px;
color: #ff0000;
margin-bottom: 10px;
}
/*******************************************
** - 07.01 - Demo-2 Services Section CSS
*******************************************/
.services-section-2 .section-title {
text-align: left;
}
.services-section-2 {
position: relative;
}
.services-category-box a {
color: #a30000;
font-size: 15px;
padding: 10px 30px;
border-radius: 3px;
text-align: center;
font-weight: 700;
background-color: #f4f5ff;
display: inline-block;
min-width: 120px;
margin-right: 30px;
margin-bottom: 20px;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
will-change: transform;
}
.services-category-box a:hover {
color: #fff;
background-color: #a30000;
}
.services-category-info {
margin-top: 30px;
margin-bottom: 50px;
}
.services-category-info h6 {
font-size: 18px;
color: #5f5f5f;
}
.single-services-box-2 {
position: relative;
z-index: 1;
display: block;
padding: 35px 30px;
text-align: left;
border-radius: 5px;
background-color: #ffffff;
margin-bottom: 30px;
border: 2px solid transparent;
-webkit-box-shadow: 5px 7px 15px 2px rgba(82, 90, 101, 0.12);
-moz-box-shadow: 5px 7px 15px 2px rgba(82, 90, 101, 0.12);
box-shadow: 5px 7px 15px 2px rgba(82, 90, 101, 0.12);
-webkit-transition: all 500ms ease-out;
transition: all 500ms ease-out;
will-change: transform;
}
.single-services-box-2 .services-icon-2 {
display: block;
color: #a30000;
margin-bottom: 20px;
-webkit-transition: 0.5s;
transition: 0.5s;
}
.single-services-box-2 .services-icon-2 i::before {
font-size: 55px;
}
.single-services-box-2 h3 {
font-size: 18px;
margin-bottom: 0;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
will-change: transform;
}
.single-services-box-2 h3 a {
display: inline-block;
}
.single-services-box-2 p {
font-size: 15px;
margin-top: 15px;
margin-bottom: 0;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
will-change: transform;
}
.single-services-box-2 .services-btn {
margin-top: 16px;
text-align: right;
}
.single-services-box-2 .services-btn .services-btn-one {
display: inline-block;
font-size: 15px;
color: #a30000;
font-weight: 700;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
will-change: transform;
}
.single-services-box-2 .services-btn i {
position: relative;
color: #a30000;
top: 1px;
font-weight: bold;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
will-change: transform;
}
.single-services-box-2 .services-btn i::before {
font-size: 14px;
}
.services-more-btn-box {
margin-top: 15px;
}
/**************************************
* 07.02 Demo-3 Services Section Style
**************************************/
.single-services-3 {
position: relative;
z-index: 1;
display: block;
padding: 35px 25px;
background: #fff;
text-align: center;
-webkit-box-shadow: 0px 2px 25px 0px rgba(85, 85, 85, 0.1);
box-shadow: 0px 2px 25px 0px rgba(85, 85, 85, 0.1);
border-radius: 5px;
margin-bottom: 30px;
-webkit-transition: all .3s;
transition: all .3s;
overflow: hidden;
}
.single-services-3 .bg-back-icon-3 {
color: #a30000;
opacity: .06;
position: absolute;
left: 0;
right: 0;
bottom: -100px;
margin: 0 auto;
z-index: -1;
-webkit-transition: 0.5s;
transition: 0.5s;
}
.single-services-3 .bg-back-icon-3 i.icon:before {
font-size: 200px;
}
.services-icon-3 {
color: #ff0000;
font-size: 35px;
width: 80px;
height: 80px;
line-height: 80px;
text-align: center;
border-radius: 50%;
border: 1px solid rgb(243 243 243);
position: relative;
overflow: hidden;
margin: 0 auto;
margin-bottom: 15px;
}
.services-icon-3 .back-icon-3 {
color: #fff;
background: #ff0000;
-webkit-transform: translateX(120%);
transform: translateX(120%);
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
.single-services-3:hover .services-icon-3 .back-icon-3 {
-webkit-transform: translateX(0%);
transform: translateX(0%);
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
.services-icon-3 i {
position: absolute;
top: 5px;
left: 5px;
right: 5px;
bottom: 5px;
line-height: 70px;
border-radius: 50%;
background: #f7f7f7;
}
.services-text-3 h3 {
font-size: 18px;
margin-bottom: 10px;
color: #333;
font-weight: 700;
}
.service-area-3 .services-more-btn-box {
margin-top: 15px;
}
/**************************************
* 07.03 Services-4 Section Style
*************************************/
.single-services-4 {
position: relative;
z-index: 1;
display: block;
padding: 35px 25px;
background: #fff;
text-align: left;
-webkit-box-shadow: 0px 2px 25px 0px rgba(85, 85, 85, 0.1);
box-shadow: 0px 2px 25px 0px rgba(85, 85, 85, 0.1);
border-radius: 5px;
margin-bottom: 30px;
-webkit-transition: all .3s;
transition: all .3s;
overflow: hidden;
}
.single-services-4::before {
content: '';
position: absolute;
left: 0;
bottom: 0;
z-index: -1;
width: 100%;
height: 0%;
border-radius: 5px;
-webkit-transition: 0.4s;
transition: 0.4s;
background: #a30000;
background: linear-gradient(to right top, #ff9876, #ff8156, #ff6937, #ff5e28, #a30000);
}
.single-services-4:hover::before {
height: 100%;
}
.services-icon-4 {
color: #ff0000;
font-size: 35px;
width: 80px;
height: 80px;
line-height: 80px;
text-align: center;
border-radius: 50%;
border: 1px solid #ff0000;
position: relative;
overflow: hidden;
margin-bottom: 15px;
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
.services-icon-4 .back-icon-4 {
color: #ff0000;
background: #fff;
-webkit-transform: translateX(120%);
transform: translateX(120%);
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
.single-services-4:hover .services-icon-4 .back-icon-4 {
-webkit-transform: translateX(0%);
transform: translateX(0%);
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
.services-icon-4 i {
position: absolute;
top: 5px;
left: 5px;
right: 5px;
bottom: 5px;
line-height: 70px;
border-radius: 50%;
color: #fff;
background: #ff0000;
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
.services-text-4 h3 {
font-size: 18px;
margin-bottom: 10px;
color: #333;
font-weight: 700;
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
.services-text-4 p {
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
.single-services-4 .bg-back-icon-4 {
color: #a30000;
opacity: .06;
position: absolute;
left: 0;
right: 0;
bottom: -100px;
margin: 0 auto;
z-index: -1;
text-align: center;
-webkit-transition: 0.5s;
transition: 0.5s;
}
.single-services-4 .bg-back-icon-4 i.icon:before {
font-size: 200px;
}
.services-4-number-bg {
position: absolute;
top: 30px;
right: 20px;
width: 120px;
z-index: -1;
text-align: right;
}
.services-4-number-bg span {
font-size: 5.5rem;
color: rgb(0, 0, 0, .03);
font-weight: 800;
line-height: 1;
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
.single-services-4:hover .services-text-4 h3 {
color: #fff;
}
.single-services-4:hover .services-text-4 p {
color: #fff;
}
.single-services-4:hover .services-icon-4 {
border: 1px solid #fff;
}
.single-services-4:hover .bg-back-icon-4 {
opacity: .6;
}
.single-services-4:hover .services-4-number-bg span {
color: rgb(0, 0, 0, .09);
}
/************************************************
** - 08 - Single Services Page Details CSS
************************************************/
.services-details-overview {
margin-bottom: 60px;
}
.services-details-overview:last-child {
margin-bottom: 0;
}
.services-details-overview .services-details-desc h3 {
margin-bottom: 15px;
font-size: 25px;
font-weight: 600;
}
.services-details-overview .services-details-desc .features-text {
margin-top: 25px;
}
.services-details-overview .services-details-desc .features-text h4 {
margin-bottom: 10px;
font-size: 18px;
}
.services-details-bg-title-area {
background: #242a2d;
box-shadow: 0 10px 32px rgb(0, 0, 0, 0.20);
}
.services-details-bg-title-content h2 {
color: #fff;
font-size: 38px;
font-weight: 800;
margin-bottom: 15px;
}
.services-details-bg-title-content h3 {
color: #fff;
font-size: 20px;
font-weight: 700;
}
/***********************************************
** - 09 - Why Choosing Us Section CSS
***********************************************/
.whychoose-area .section-title {
margin-bottom: 5px;
}
.whychoose-single-item {
position: relative;
z-index: 1;
margin-top: 45px;
}
.whychoose-icon-box {
position: absolute;
left: 0;
top: 0;
}
.whychoose-icon-box .whychoose-icon-number {
background: url(../imgs/circle-border.svg) 0 0 no-repeat;
font-size: 1rem;
font-weight: 600;
color: #fff;
width: 64px;
height: 64px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
flex-wrap: nowrap;
}
.whychoose-info {
padding-left: 85px;
padding-top: 20px;
}
.whychoose-info h3 {
font-size: 18px;
font-weight: 700;
margin-bottom: 10px;
}
.whychoose-number-bg {
position: absolute;
top: -40px;
left: 10px;
width: 120px;
z-index: -1;
text-align: right;
}
.whychoose-number-bg span {
font-size: 12.5rem;
color: rgba(0,0,0,.03);
font-weight: 700;
line-height: 1;
}
/**************************************
* 10.How It Works Section Style
*************************************/
.workprocess-area {
background-color: #f4f5ff;
position: relative;
z-index: 1;
padding-bottom: 210px;
}
.workprocess-area .section-title {
margin-bottom: 15px;
}
.workprocess-single-item {
position: relative;
margin-top: 35px;
}
.workprocess-icon-box {
position: absolute;
left: 0;
top: 0;
}
.workprocess-icon-box .workprocess-icon-number {
background: url(../imgs/circle-border.svg) 0 0 no-repeat;
font-size: 1rem;
font-weight: 600;
color: #fff;
width: 64px;
height: 64px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
flex-wrap: nowrap;
}
.workprocess-info {
padding-left: 85px;
padding-top: 20px;
}
.workprocess-info h3 {
font-size: 18px;
font-weight: 700;
margin-bottom: 10px;
}
.workprocess-number-bg {
position: absolute;
top: -40px;
left: 10px;
width: 120px;
z-index: -1;
text-align: right;
}
.workprocess-number-bg span {
font-size: 12.5rem;
color: rgba(0,0,0,.03);
font-weight: 700;
line-height: 1;
}
/**************************************
** - 11 - Counter Section CSS
*************************************/
.counter-wrapper-box {
position: relative;
background-color: #fff;
z-index: 1;
text-align: center;
padding: 70px 0;
margin-top: -122px;
border-radius: 5px;
overflow: hidden;
-webkit-box-shadow: 5px 7px 15px 2px rgba(82, 90, 101, 0.12);
-moz-box-shadow: 5px 7px 15px 2px rgba(82, 90, 101, 0.12);
box-shadow: 5px 7px 15px 2px rgba(82, 90, 101, 0.12);
}
.counter-wrapper-box::before {
content: "";
position: absolute;
height: 100%;
width: 100%;
left: 0;
top: 0;
background-color: #217fca;
background-image: url(../imgs/counter-bg.jpg);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
z-index: -1;
opacity: .5;
}
.counter-contents h2 {
color: #333;
font-size: 55px;
font-weight: 700;
margin-bottom: 10px;
word-spacing: -10px;
font-family: 'Source Sans Pro', sans-serif;
}
.counter-contents h3 {
color: #333;
font-size: 18px;
font-weight: 600;
}
.counter-area2 {
text-align: center;
background-color: rgba(136, 116, 181, .11);
position: relative;
z-index: 1;
text-align: center;
padding: 70px 0;
}
/**************************************
** - 12 - All Projects Section CSS
**************************************/
.project-item-box {
position: relative;
margin-bottom: 75px;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
will-change: transform;
}
.project-item-box:hover {
-webkit-transform: translateY(15px);
transform: translateY(15px);
}
.project-item-box .single-project-link {
display: block;
}
.single-project-link img {
border-radius: 5px;
}
.project-link-title-box {
background-color: transparent;
margin: 0 15px;
position: absolute;
bottom: -40px;
left: 0;
right: 0;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
height: 80px;
overflow: hidden;
border-radius: 5px;
-webkit-box-shadow: 0 0 20px -5px rgba(68, 107, 138, 0.3);
-moz-box-shadow: 0 0 20px -5px rgba(68, 107, 138, 0.3);
box-shadow: 0 0 20px -5px rgba(68, 107, 138, 0.3);
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
}
.project-link-title-inside {
text-align: center;
width: 100%;
height: 80px;
overflow: hidden;
border-radius: 5px;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
perspective: 1000px;
position: relative;
z-index: 1;
}
.project-item-box:hover .project-link-title-box {
bottom: 15px;
}
.project-link-flip-front {
background-color: #fff;
color: #333;
height: 100%;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 0;
left: 0;
overflow: hidden;
border-radius: 5px;
transition: all 700ms ease;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transform: rotateX(0);
-webkit-transform: rotateX(0);
}
.project-link-flip-back {
background-color: #ff0000;
background: linear-gradient(-48deg, #c6fdb8 -30%, #ff0000 60%);
color: #fff;
transform: rotateX(180deg);
height: 100%;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 0;
left: 0;
overflow: hidden;
border-radius: 5px;
transition: all 700ms ease;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.project-link-title-box:hover .project-link-flip-front {
-webkit-transform: rotateX(-180deg);
transform: rotateX(-180deg);
}
.project-link-title-box:hover .project-link-flip-back {
-webkit-transform: rotateX(0);
transform: rotateX(0);
}
.project-link-title-box h3 {
position: relative;
font-size: 18px;
font-weight: 700;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
}
.project-link-title-box .project-link-flip-back h3 {
font-size: 16px;
font-weight: 700;
}
.project-more-btn-box {
margin-top: 15px;
}
/*******************************************
* 12.01 - Demo-2 Projects Section Style
*******************************************/
.project-flip-area {
position: relative;
}
.project-flip-area .project-flip-list {
text-align: center;
margin-bottom: 20px;
}
.project-flip-area .project-flip-list .nav {
display: inline-block;
margin: 0;
position: relative;
}
.project-flip-area .project-flip-list .nav li {
display: inline-block;
font-size: 14px;
font-weight: 700;
text-transform: capitalize;
margin: 0 5px;
padding: 10px 25px;
color: #333;
background-color: #fff;
cursor: pointer;
border-radius: 3px;
-webkit-box-shadow: 0px 5px 30px 0px rgba(148, 146, 245, 0.15);
box-shadow: 0px 5px 30px 0px rgba(148, 146, 245, 0.15);
transition: all 0.4s ease 0s;
-moz-transition: all 0.5s ease-in-out 0s;
-ms-transition: all 0.5s ease-in-out 0s;
-o-transition: all 0.5s ease-in-out 0s;
-webkit-transition: all 0.5s ease-in-out 0s;
transition: all 0.5s ease-in-out 0s;
font-family: 'Roboto Condensed', sans-serif;
}
.project-flip-area .project-flip-list .nav li:hover, .project-flip-area .project-flip-list .nav li.filter-active {
color: #fff;
background-color: #a30000;
-moz-transition: all 0.5s ease-in-out 0s;
-ms-transition: all 0.5s ease-in-out 0s;
-o-transition: all 0.5s ease-in-out 0s;
-webkit-transition: all 0.5s ease-in-out 0s;
transition: all 0.5s ease-in-out 0s;
}
.project-flip-area .project-flip-container {
display: inline-block;
width: 100%;
}
.project-flip-area .project-flip-grid {
overflow: hidden;
}
.project-flip-box {
position: relative;
-webkit-backface-visibility: hidden;
overflow: hidden;
border-radius: 5px;
margin-top: 30px;
}
.project-flip-content {
-ms-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transform-style: preserve-3d;
perspective: 1000px;
-webkit-perspective: 1000px;
}
.project-flip-box-front {
-ms-transform: rotateY(0deg);
-webkit-transform: rotateY(0deg);
transform: rotateY(0deg);
-webkit-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
transform-style: preserve-3d;
}
.project-flip-box .project-flip-box-front:before {
position: absolute;
content: "";
left: 0;
top: 0;
width: 100%;
height: 100%;
background: linear-gradient(to bottom, transparent, #000);
}
.project-flip-box-back {
position: absolute;
top: 0;
left: 0;
width: 100%;
-ms-transform: rotateY(180deg);
-webkit-transform: rotateY(180deg);
transform: rotateY(180deg);
-webkit-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
transform-style: preserve-3d;
}
.project-flip-box .project-flip-box-back:before {
position: absolute;
content: "";
left: 0;
top: 0;
width: 100%;
height: 100%;
background: linear-gradient(to bottom, transparent, #150051);
}
.project-flip-box-front img, .project-flip-box-back img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.project-flip-box-front, .project-flip-box-back {
border-radius: 5px;
-ms-transition: transform 0.9s cubic-bezier(.4,.2,.2,1);
transition: transform 0.9s cubic-bezier(.4,.2,.2,1);
-webkit-transition: transform 0.9s cubic-bezier(.4,.2,.2,1);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.project-flip-box:hover .project-flip-box-front {
-ms-transform: rotateY(-180deg);
-webkit-transform: rotateY(-180deg);
transform: rotateY(-180deg);
-webkit-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
transform-style: preserve-3d;
}
.project-flip-box:hover .project-flip-box-back {
-ms-transform: rotateY(0deg);
-webkit-transform: rotateY(0deg);
transform: rotateY(0deg);
-webkit-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
transform-style: preserve-3d;
}
.project-flip-content .inner {
position: absolute;
left: 0;
width: 100%;
padding: 20px 35px;
outline: 1px solid transparent;
-webkit-perspective: inherit;
perspective: inherit;
z-index: 2;
transform: translateY(-50%) translateZ(60px) scale(.94);
-webkit-transform: translateY(-50%) translateZ(60px) scale(.94);
-ms-transform: translateY(-50%) translateZ(60px) scale(.94);
top: 50%;
}
.project-flip-content .inner h3 {
font-size: 20px;
color: #fff;
margin-bottom: 15px;
}
.project-flip-content .project-flip-box-front .inner p {
font-size: 16px;
color: #fff;
margin-bottom: 0;
}
.project-flip-content .project-flip-box-back .inner p {
font-size: 16px;
color: #fff;
margin-bottom: 25px;
}
.project-flip-more-btn-box {
margin-top: 45px;
}
/******************************************
* 12.03 - Demo-3 Projects Section Style
******************************************/
.project-area-3 {
position: relative;
}
.project-area-3 .project-list-3 {
text-align: center;
margin-bottom: 20px;
}
.project-area-3 .project-list-3 .nav {
display: inline-block;
margin: 0;
position: relative;
}
.project-area-3 .project-list-3 .nav li {
display: inline-block;
font-size: 15px;
font-weight: 700;
text-transform: capitalize;
margin: 0 5px;
padding: 10px 25px;
color: #333;
background-color: #fff;
cursor: pointer;
border-radius: 3px;
-webkit-box-shadow: 0px 5px 30px 0px rgba(148, 146, 245, 0.15);
box-shadow: 0px 5px 30px 0px rgba(148, 146, 245, 0.15);
transition: all 0.4s ease 0s;
-moz-transition: all 0.5s ease-in-out 0s;
-ms-transition: all 0.5s ease-in-out 0s;
-o-transition: all 0.5s ease-in-out 0s;
-webkit-transition: all 0.5s ease-in-out 0s;
transition: all 0.5s ease-in-out 0s;
}
.project-area-3 .project-list-3 .nav li:hover, .project-area-3 .project-list-3 .nav li.filter-active {
color: #fff;
background-color: #ff0000;
-moz-transition: all 0.5s ease-in-out 0s;
-ms-transition: all 0.5s ease-in-out 0s;
-o-transition: all 0.5s ease-in-out 0s;
-webkit-transition: all 0.5s ease-in-out 0s;
transition: all 0.5s ease-in-out 0s;
}
.project-area-3 .project-container-3 {
display: inline-block;
width: 100%;
}
.project-area-3 .project-grid-box {
overflow: hidden;
}
.project-grid-box img {
width: 100%;
}
.project-single-item-3 {
position: relative;
display: block;
overflow: hidden;
border-radius: 3px;
margin-top: 30px;
}
.project-single-item-3 .project-img-overlay {
position: absolute;
top: 10px;
left: 10px;
right: 10px;
bottom: 10px;
z-index: 2;
-webkit-transition: all .4s;
transition: all .4s;
background-color: transparent;
}
.project-single-item-3 .project-img-overlay:after {
content: '';
position: absolute;
width: 100%;
height: 0;
z-index: -1;
border-radius: 3px;
background: rgba(255, 255, 255, 0.95);
-webkit-transition: all .4s;
transition: all .4s;
}
.project-single-item-3:hover .project-img-overlay:after {
height: 100%;
}
.project-single-item-3 .project-img-overlay .project-content .info {
position: absolute;
left: 5%;
bottom: 5%;
overflow: hidden;
}
.project-single-item-3 .project-img-overlay .project-content .info p {
color: #ff0000;
font-weight: 500;
font-size: 13px;
margin: 0;
opacity: 0;
visibility: hidden;
-webkit-transform: translateY(50px);
transform: translateY(50px);
-webkit-transition: all .4s;
transition: all .4s;
}
.project-single-item-3 .project-img-overlay .project-content .info h6 {
margin-top: 5px;
font-weight: 700;
font-size: 16px;
opacity: 0;
visibility: hidden;
-webkit-transform: translateY(50px);
transform: translateY(50px);
-webkit-transition: all .4s;
transition: all .4s;
}
.project-single-item-3 .project-img-overlay .project-content .icon {
position: absolute;
top: 5%;
right: 5%;
width: 40px;
height: 40px;
line-height: 40px;
border-radius: 50%;
border: 1px solid #ff0000;
text-align: center;
font-size: 18px;
color: #ff0000;
-webkit-transition: all .5s;
transition: all .5s;
-webkit-transform: translateY(-50px);
transform: translateY(-50px);
opacity: 0;
visibility: hidden;
}
.project-single-item-3:hover .project-img-overlay .project-content .icon {
-webkit-transform: translateX(0px);
transform: translateX(0px);
opacity: 1;
visibility: visible;
-webkit-transition-delay: .3s;
transition-delay: .3s;
}
.project-single-item-3:hover .project-img-overlay .project-content .info p,
.project-single-item-3:hover .project-img-overlay .project-content .info h6 {
opacity: 1;
visibility: visible;
-webkit-transform: translateY(0px);
transform: translateY(0px);
-webkit-transition-delay: .3s;
transition-delay: .3s;
}
.project-more-btn {
margin-top: 30px;
}
/**************************************
* 12 - Projects-4 Page Section Style
**************************************/
.single-project-4 {
position: relative;
margin-bottom: 30px;
}
.single-project-4::before {
content: '';
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
border-radius: 5px;
background-color: #ff0000;
opacity: 0;
visibility: hidden;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.project-image-4 img {
border-radius: 5px;
}
.single-project-4 .image-hover-4 {
position: absolute;
left: 18px;
right: 18px;
bottom: 18px;
text-align: left;
color: #ffffff;
-webkit-transform: translateY(50px);
transform: translateY(50px);
font-size: 20px;
opacity: 0;
visibility: hidden;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.single-project-4 .image-hover-4:hover {
text-decoration: none;
}
.single-project-4 .image-hover-4 .overlay-text-4 {
background: #ffffff;
padding: 15px 20px;
border-radius: 5px;
will-change: transform;
}
.single-project-4 .image-hover-4 .overlay-text-4 h3 {
color: #333;
font-size: 18px;
margin: 0;
line-height: 1.3;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.single-project-4 .image-hover-4 .overlay-text-4 h3 a {
color: #333;
font-size: 18px;
margin: 0;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.single-project-4 .image-hover-4 .overlay-text-4 .read-more {
font-size: 14px;
color: #333;
font-weight: 700;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.single-project-4 .image-hover-4 .overlay-text-4 .read-more:hover {
color: #ff0000;
text-decoration: underline;
}
.single-project-4:hover::before, .single-project-4:focus::before {
opacity: 0.7;
visibility: visible;
}
.single-project-4:hover .image-hover-4, .single-project-4:focus .image-hover-4 {
opacity: 1;
visibility: visible;
-webkit-transform: translateY(0px);
transform: translateY(0px);
-webkit-transition: .6s;
transition: .6s;
}
/******************************************************
** - 13 - Single Projects Details Page Section CSS
******************************************************/
.project-details-image {
margin-bottom: 35px;
}
.projects-details-desc {
margin-top: 5px;
}
.projects-details-desc h3 {
margin-bottom: 13px;
font-size: 25px;
}
.projects-details-desc .features-text {
margin-top: 25px;
margin-bottom: 25px;
}
.projects-details-desc .features-text h4 {
margin-bottom: 12px;
font-size: 18px;
font-weight: 600;
}
.projects-details-desc .features-text h4 i {
font-size: 16px;
margin-right: 4px;
color: #ff0000;
}
.projects-details-desc .project-details-info {
display: -ms-flexbox;
display: -webkit-box;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-right: -15px;
margin-left: -15px;
margin-top: 35px;
}
.projects-details-desc .project-details-info .single-info-box {
-ms-flex: 0 0 20%;
-webkit-box-flex: 0;
flex: 0 0 20%;
max-width: 20%;
padding-left: 15px;
padding-right: 15px;
}
.projects-details-desc .project-details-info .single-info-box h4 {
margin-bottom: 10px;
font-size: 18px;
font-weight: 700;
}
.projects-details-desc .project-details-info .single-info-box span {
display: block;
color: #747576;
font-size: 15px;
}
.projects-details-desc .project-details-info .single-info-box .social {
padding-left: 0;
margin-bottom: 0;
list-style-type: none;
}
.projects-details-desc .project-details-info .single-info-box .social li {
display: inline-block;
margin-right: 8px;
}
.projects-details-desc .project-details-info .single-info-box .social li a {
display: block;
color: #ff0000;
width: 30px;
height: 30px;
line-height: 30px;
border-radius: 50%;
background-color: transparent;
border: 1px solid #ff0000;
text-align: center;
font-size: 15px;
}
.projects-details-desc .project-details-info .single-info-box .social li a:hover {
color: #ffffff;
background-color: #ff0000;
}
/**********************************************
** - 14 - All Testimonial Section CSS
**********************************************/
.testimonial-area {
text-align: center;
}
.single-testimonial {
position: relative;
background-color: #fff;
padding: 0;
border: dotted 2px red;
border-radius: 5px;
margin: 0px;
margin-bottom: 20px;
/* text-align: left; */
transition: all .4s;
-webkit-box-shadow: 5px 7px 15px 2px rgba(82, 90, 101, 0.12);
-moz-box-shadow: 5px 7px 15px 2px rgba(82, 90, 101, 0.12);
box-shadow: 5px 7px 15px 2px rgba(82, 90, 101, 0.12);
}
/* .single-testimonial .testimonial-avatar-img {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: row;
display: flex;
-webkit-box-align: center;
align-items: center;
position: relative;
z-index: 1;
}
.single-testimonial .testimonial-avatar-img img {
border-radius: 50%;
width: 90px;
margin-right: 15px;
}
.single-testimonial .testimonial-bio-info {
text-align: left;
margin-top: 5px;
} */
/* .single-testimonial .testimonial-bio-info .name {
font-size: 18px;
font-weight: 600;
margin-top: 2px;
} */
/* .single-testimonial .testimonial-bio-info span {
font-size: 15px;
color: #555;
} */
/* .rating-box ul li {
display: inline-block;
margin-top: 1px;
}
.rating-box ul li i {
color: #ffce39;
font-size: 14px;
}
.single-testimonial .testimonial-content {
padding-top: 40px;
}
.single-testimonial .testimonial-avatar-img .quote {
position: absolute;
z-index: -1;
right: 0px;
top: 10px;
width: 75px;
border-radius: 0;
margin: 0;
opacity: .1;
}
.single-testimonial .testimonial-content p {
color: #666;
font-size: 16px;
} */
/* .testimonial-area .owl-theme .owl-nav.disabled+.owl-dots {
margin-top: 20px;
} */
.testimonial-area .owl-theme .owl-dots .owl-dot.active span, .testimonial-area .owl-theme .owl-dots .owl-dot:hover span {
background: #ff0000;
}
/***************************************************
** - 14.01 Demo-2 Testimonial-2 Section Style
***************************************************/
.testimonial-area2 {
text-align: center;
background-color: rgba(136, 116, 181, .11);
}
.single-testimonial2 {
position: relative;
background-color: #ffffff;
padding: 40px 35px;
border-radius: 5px;
margin: 15px;
margin-bottom: 20px;
transition: all .4s;
border-bottom: 3px solid transparent;
}
.owl-carousel.owl-drag .owl-item.active.center .single-testimonial2 {
border-bottom: 3px solid #ff0000;
-webkit-box-shadow: 0px 5px 30px 0px rgba(148, 146, 245, 0.15);
box-shadow: 0px 5px 30px 0px rgba(148, 146, 245, 0.15);
}
.rating-box2 ul li {
display: inline-block;
}
.rating-box2 ul li i {
color: #ffce39;
font-size: 18px;
}
.testimonial-content2 {
margin-top: 15px;
margin-bottom: 25px;
}
.testimonial-content2 p {
color: #7d7d7d;
font-size: 15px;
}
.single-testimonial2 .testimonial-bio2 {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
justify-content: center;
}
.single-testimonial2 .testimonial-bio2 .avatar2 img {
border-radius: 50%;
width: 80px;
margin: 0 auto;
}
.single-testimonial2 .testimonial-bio2 .bio-info2 {
text-align: left;
margin-left: 15px;
}
.single-testimonial2 .testimonial-bio2 .bio-info2 .name {
font-size: 18px;
font-weight: 600;
margin-top: 2px;
}
.single-testimonial2 .testimonial-bio2 .bio-info2 span {
font-size: 15px;
color: #555;
}
.testimonial-area2 .owl-theme .owl-nav.disabled+.owl-dots {
position: unset;
right: 0;
top: 50%;
transform: none;
margin-top: 20px;
}
/**************************************
** - 15 - Blog Section CSS
*************************************/
.blog-area .section-title {
margin-bottom: 30px;
}
.blog-area .single-blog {
background: #ffffff;
-webkit-box-shadow: 0 3px 15px -5px rgba(68, 107, 138, 0.3);
box-shadow: 0 3px 15px -5px rgba(68, 107, 138, 0.3);
border-radius: 3px;
margin-top: 35px;
overflow: hidden;
}
.blog-area .post-img {
position: relative;
overflow: hidden;
}
.blog-area .single-blog img {
-webkit-transition: all .5s;
transition: all .5s;
}
.blog-area .single-blog:hover img {
-webkit-filter: none;
filter: none;
-webkit-transform: rotate(3deg) scale(1.1, 1.1);
-ms-transform: rotate(3deg) scale(1.1, 1.1);
transform: rotate(3deg) scale(1.1, 1.1);
}
.blog-area .single-blog .blog-content {
padding: 25px 25px;
text-align: left;
}
.blog-content .blog-date {
margin-bottom: 15px;
}
.blog-content .blog-date .blog-list li {
display: inline-block;
}
.blog-content .blog-date .blog-list li h6 {
font-size: 13px;
color: #777;
display: inline-block;
}
.blog-content .blog-date .blog-list li .blog-inline-sep {
padding: 0 5px;
font-size: 12px;
color: #333;
}
.blog-content .blog-date .blog-list li a {
font-size: 13px;
color: #ff0000;
font-weight: 600;
display: inline-block;
}
.blog-area .single-blog .blog-content h3 a {
font-size: 18px;
font-weight: 700;
color: #333;
line-height: 1.5;
margin-bottom: 10px;
display: block;
}
.blog-area .single-blog .blog-content h3 a:hover {
color: #ff0000;
text-decoration: underline !important;
}
.blog-bottom-text-link {
margin-top: 10px;
}
.single-blog .blog-content .blog-bottom-text-link a {
color: #5f5f5f;
display: inline-block;
font-size: 16px;
margin-top: 15px;
display: block;
font-weight: 700;
letter-spacing: 0.7px;
}
.single-blog .blog-content .blog-bottom-text-link a:hover {
color: #ff0000;
text-decoration: underline !important;
}
/***************************************************
** - 15.00 - Blog Page Number Pagination Area CSS
***************************************************/
.pagination-area {
text-align: center;
}
.pagination-area .page-numbers {
width: 45px;
height: 45px;
margin: 0 3px;
display: inline-block;
background-color: #ffffff;
line-height: 48px;
color: #a30000;
-webkit-box-shadow: 0 2px 10px 0 #d8dde6;
-moz-box-shadow: 0 2px 10px 0 #d8dde6;
box-shadow: 0 2px 10px 0 #d8dde6;
font-size: 18px;
font-weight: 700;
}
.pagination-area .page-numbers.current, .pagination-area .page-numbers:hover, .pagination-area .page-numbers:focus {
background: #ff0000;
color: #ffffff;
-webkit-box-shadow: 0 2px 10px 0 #d8dde6;
-moz-box-shadow: 0 2px 10px 0 #d8dde6;
box-shadow: 0 2px 10px 0 #d8dde6;
}
/************************************************
** - 16 - Blog Details Page Area CSS
************************************************/
.blog-details-desc .article-content {
margin-top: 30px;
}
.blog-details-desc .article-content .entry-meta {
margin-bottom: -8px;
}
.blog-details-desc .article-content .entry-meta ul {
padding-left: 0;
margin-bottom: 0;
list-style-type: none;
}
.blog-details-desc .article-content .entry-meta ul li {
position: relative;
display: inline-block;
color: #a30000;
margin-right: 21px;
}
.blog-details-desc .article-content .entry-meta ul li span {
display: inline-block;
color: #a30000;
font-weight: 500;
}
.blog-details-desc .article-content .entry-meta ul li a {
display: inline-block;
color: #747576;
}
.blog-details-desc .article-content .entry-meta ul li a:hover {
color: #ff0000;
}
.blog-details-desc .article-content .entry-meta ul li i {
color: #ff0000;
margin-right: 2px;
}
.blog-details-desc .article-content .entry-meta ul li::before {
content: '';
position: absolute;
top: 12px;
right: -15px;
width: 6px;
height: 1px;
background: #ff0000;
}
.blog-details-desc .article-content .entry-meta ul li:last-child {
margin-right: 0;
}
.blog-details-desc .article-content .entry-meta ul li:last-child::before {
display: none;
}
.blog-details-desc .article-content h3 {
margin-bottom: 15px;
margin-top: 25px;
font-size: 24px;
}
.blog-details-desc .article-content .wp-block-gallery.columns-3 {
padding-left: 0;
list-style-type: none;
display: -ms-flexbox;
display: -webkit-box;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-right: -15px;
margin-left: -15px;
margin-bottom: 30px;
margin-top: 30px;
}
.blog-details-desc .article-content .wp-block-gallery.columns-3 li {
-ms-flex: 0 0 50%;
-webkit-box-flex: 0;
flex: 0 0 50%;
max-width: 50%;
padding-right: 15px;
padding-left: 15px;
}
.blog-details-desc .article-content .wp-block-gallery.columns-3 li figure {
margin-bottom: 0;
}
.blog-details-desc .article-footer {
display: -ms-flexbox;
display: -webkit-box;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-top: 30px;
}
.blog-details-desc .article-footer .article-tags {
-ms-flex: 0 0 50%;
-webkit-box-flex: 0;
flex: 0 0 50%;
max-width: 50%;
color: #747576;
}
.blog-details-desc .article-footer .article-tags span {
display: inline-block;
color: #333;
font-size: 15px;
margin-right: 5px;
font-weight: 600;
}
.blog-details-desc .article-footer .article-tags a {
display: inline-block;
color: #747576;
}
.blog-details-desc .article-footer .article-tags a:hover {
color: #ff0000;
text-decoration: underline;
}
.blog-details-desc .article-footer .article-share {
-ms-flex: 0 0 50%;
-webkit-box-flex: 0;
flex: 0 0 50%;
max-width: 50%;
}
.blog-details-desc .article-footer .article-share .social {
padding-left: 0;
list-style-type: none;
text-align: right;
margin-bottom: 0;
}
.blog-details-desc .article-footer .article-share .social li {
display: inline-block;
margin-right: 8px;
}
.blog-details-desc .article-footer .article-share .social li:last-child {
margin-right: 0px;
}
.blog-details-desc .article-footer .article-share .social li span {
display: inline-block;
margin-right: 5px;
font-weight: 600;
color: #747576;
}
.blog-details-desc .article-footer .article-share .social li a {
display: block;
color: #ff0000;
width: 30px;
height: 30px;
line-height: 30px;
border-radius: 50%;
background-color: transparent;
border: 1px solid #ff0000;
text-align: center;
font-size: 15px;
}
.blog-details-desc .article-footer .article-share .social li a:hover {
color: #ffffff;
background-color: #ff0000;
}
.blog-details-desc .post-navigation {
margin-top: 30px;
}
blockquote, .blockquote {
overflow: hidden;
background-color: #fafafa;
padding: 50px !important;
position: relative;
text-align: center;
z-index: 1;
margin-bottom: 20px;
margin-top: 20px;
}
blockquote p, .blockquote p {
color: #a30000;
line-height: 1.6;
margin-bottom: 0;
font-style: italic;
font-weight: 500;
font-size: 24px !important;
}
blockquote cite, .blockquote cite {
display: none;
}
blockquote::before, .blockquote::before {
color: #efefef;
content: "\f10e";
position: absolute;
left: 50px;
top: -50px;
z-index: -1;
font-family: "Font Awesome 5 Free";
font-size: 140px;
font-weight: 700;
}
blockquote::after, .blockquote::after {
content: '';
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 3px;
background-color: #ff0000;
margin-top: 20px;
margin-bottom: 20px;
}
.post-navigation {
border-top: 1px solid #eeeeee;
border-bottom: 1px solid #eeeeee;
padding-top: 20px;
padding-bottom: 20px;
}
.post-navigation .navigation-links {
display: -ms-flexbox;
display: -webkit-box;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.post-navigation .navigation-links .nav-previous {
-ms-flex: 0 0 50%;
-webkit-box-flex: 0;
flex: 0 0 50%;
max-width: 50%;
}
.post-navigation .navigation-links .nav-next {
-ms-flex: 0 0 50%;
-webkit-box-flex: 0;
flex: 0 0 50%;
max-width: 50%;
text-align: right;
}
.post-navigation .navigation-links div a {
display: inline-block;
font-weight: 600;
}
.comments-area {
padding: 25px;
margin-top: 30px;
-webkit-box-shadow: 0px 0px 29px 0px rgba(102, 102, 102, 0.08);
-moz-box-shadow: 0px 0px 29px 0px rgba(102, 102, 102, 0.08);
box-shadow: 0px 0px 29px 0px rgba(102, 102, 102, 0.08);
background-color: #ffffff;
}
.comments-area .comments-title {
position: relative;
margin-bottom: 30px;
line-height: initial;
font-size: 24px;
font-weight: 600;
}
.comments-area ol, .comments-area ul {
padding: 0;
margin: 0;
list-style-type: none;
}
.comments-area .comment-list {
padding: 0;
margin: 0;
list-style-type: none;
}
.comments-area .comment-body {
border-bottom: 1px solid #eeeeee;
padding-left: 65px;
color: #a30000;
font-size: 14px;
margin-bottom: 20px;
padding-bottom: 20px;
}
.comments-area .comment-body .reply {
margin-top: 15px;
}
.comments-area .comment-body .reply a {
border: 1px solid #ded9d9;
color: #a30000;
display: inline-block;
padding: 5px 20px;
border-radius: 30px;
text-transform: capitalize;
position: relative;
z-index: 1;
font-size: 12px;
font-weight: 600;
}
.comments-area .comment-body .reply a:hover {
color: #ffffff;
background-color: #ff0000;
border-color: #ff0000;
}
.comments-area .comment-author {
font-size: 15px;
margin-bottom: 0.1em;
position: relative;
z-index: 2;
}
.comments-area .comment-author .avatar {
height: 50px;
left: -65px;
position: absolute;
width: 50px;
}
.comments-area .comment-author .fn {
font-weight: 600;
}
.comments-area .comment-author .says {
display: none;
}
.comments-area .comment-metadata {
margin-bottom: .8em;
color: #747576;
letter-spacing: 0.01em;
text-transform: capitalize;
font-size: 13px;
font-weight: 400;
}
.comments-area .comment-metadata a {
color: #747576;
}
.comments-area .comment-metadata a:hover {
color: #ff0000;
}
.comments-area .comment-respond {
margin-top: 30px;
}
.comments-area .comment-respond .comment-reply-title {
margin-bottom: 0;
position: relative;
font-size: 24px;
font-weight: 600;
}
.comments-area .comment-respond .comment-reply-title #cancel-comment-reply-link {
display: inline-block;
}
.comments-area .comment-respond .comment-form {
overflow: hidden;
}
.comments-area .comment-respond .comment-notes {
margin-bottom: 0;
margin-top: 10px;
}
.comments-area .comment-respond .comment-form-comment {
margin-top: 15px;
float: left;
width: 100%;
}
.comments-area .comment-respond label {
display: block;
font-weight: 600;
color: #a30000;
margin-bottom: 5px;
}
.comments-area .comment-respond input[type="date"], .comments-area .comment-respond input[type="time"], .comments-area .comment-respond input[type="datetime-local"], .comments-area .comment-respond input[type="week"], .comments-area .comment-respond input[type="month"], .comments-area .comment-respond input[type="text"], .comments-area .comment-respond input[type="email"], .comments-area .comment-respond input[type="url"], .comments-area .comment-respond input[type="password"], .comments-area .comment-respond input[type="search"], .comments-area .comment-respond input[type="tel"], .comments-area .comment-respond input[type="number"], .comments-area .comment-respond textarea {
display: block;
width: 100%;
background-color: #ffffff;
border: 1px solid #eeeeee;
padding: 0.625em 0.7375em;
outline: 0;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
will-change: transform;
}
.comments-area .comment-respond input[type="date"]:focus, .comments-area .comment-respond input[type="time"]:focus, .comments-area .comment-respond input[type="datetime-local"]:focus, .comments-area .comment-respond input[type="week"]:focus, .comments-area .comment-respond input[type="month"]:focus, .comments-area .comment-respond input[type="text"]:focus, .comments-area .comment-respond input[type="email"]:focus, .comments-area .comment-respond input[type="url"]:focus, .comments-area .comment-respond input[type="password"]:focus, .comments-area .comment-respond input[type="search"]:focus, .comments-area .comment-respond input[type="tel"]:focus, .comments-area .comment-respond input[type="number"]:focus, .comments-area .comment-respond textarea:focus {
border-color: #ff0000;
}
.comments-area .comment-respond .comment-form-author {
float: left;
width: 50%;
padding-right: 10px;
margin-bottom: 20px;
}
.comments-area .comment-respond .comment-form-email {
float: left;
width: 50%;
padding-left: 12px;
margin-bottom: 20px;
}
.comments-area .comment-respond .comment-form-url {
float: left;
width: 100%;
margin-bottom: 20px;
}
.comments-area .comment-respond .comment-form-cookies-consent {
width: 100%;
float: left;
position: relative;
padding-left: 20px;
margin-bottom: 20px;
}
.comments-area .comment-respond .comment-form-cookies-consent input {
position: absolute;
left: 0;
top: 4px;
}
.comments-area .comment-respond .comment-form-cookies-consent label {
display: inline-block;
margin: 0;
color: #747576;
font-weight: normal;
position: relative;
top: -2px;
}
.comments-area .comment-respond .form-submit {
float: left;
width: 100%;
}
.comments-area .comment-respond .form-submit input {
background: #ff0000;
border: none;
color: #ffffff;
padding: 10px 30px;
display: inline-block;
cursor: pointer;
outline: 0;
border-radius: 0;
text-transform: uppercase;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
will-change: transform;
font-weight: 600;
font-size: 14px;
}
.comments-area .comment-respond .form-submit input:hover, .comments-area .comment-respond .form-submit input:focus {
color: #ffffff;
background-color: #a30000;
}
/************************************************
** - 17 - Blog Page Sidebar Widget Area CSS
************************************************/
.widget-area .widget {
margin-top: 35px;
}
.widget-area .widget:first-child {
margin-top: 0;
}
.widget-area .widget .widget-title {
border-bottom: 1px solid #eeeeee;
padding-bottom: 10px;
margin-bottom: 25px;
text-transform: capitalize;
position: relative;
font-size: 22px;
}
.widget-area .widget .widget-title::before {
content: '';
position: absolute;
background: #ff0000;
bottom: -1px;
left: 0;
width: 50px;
height: 1px;
}
.widget-area .widget_search {
-webkit-box-shadow: 0px 0px 29px 0px rgba(102, 102, 102, 0.1);
-moz-box-shadow: 0px 0px 29px 0px rgba(102, 102, 102, 0.1);
box-shadow: 0px 0px 29px 0px rgba(102, 102, 102, 0.1);
background-color: #ffffff;
padding: 15px;
}
.widget-area .widget_search form {
position: relative;
}
.widget-area .widget_search form label {
display: block;
margin-bottom: 0;
}
.widget-area .widget_search form .screen-reader-text {
display: none;
}
.widget-area .widget_search form .search-field {
background-color: transparent;
height: 50px;
padding: 6px 15px;
border: 1px solid #eeeeee;
width: 100%;
display: block;
outline: 0;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
will-change: transform;
}
.widget-area .widget_search form .search-field:focus {
border-color: #ff0000;
}
.widget-area .widget_search form button {
position: absolute;
right: 0;
outline: 0;
bottom: 0;
height: 50px;
width: 50px;
z-index: 1;
border: none;
color: #ffffff;
background-color: #ff0000;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
will-change: transform;
}
.widget-area .widget_search form button:hover {
background-color: #a30000;
color: #ffffff;
}
.widget-area .widget_inspire_posts_thumb {
position: relative;
overflow: hidden;
}
.widget-area .widget_inspire_posts_thumb .item {
overflow: hidden;
margin-bottom: 15px;
}
.widget-area .widget_inspire_posts_thumb .item:last-child {
margin-bottom: 0;
}
.widget-area .widget_inspire_posts_thumb .item .thumb {
float: left;
height: 80px;
overflow: hidden;
position: relative;
width: 80px;
margin-right: 15px;
}
.widget-area .widget_inspire_posts_thumb .item .thumb .fullimage {
width: 80px;
height: 80px;
display: inline-block;
background-size: cover !important;
background-repeat: no-repeat;
background-position: center center !important;
}
.widget-area .widget_inspire_posts_thumb .item .thumb .fullimage.bg1 {
background-image: url(../imgs/blog-1.jpg);
}
.widget-area .widget_inspire_posts_thumb .item .thumb .fullimage.bg2 {
background-image: url(../imgs/blog-2.jpg);
}
.widget-area .widget_inspire_posts_thumb .item .thumb .fullimage.bg3 {
background-image: url(../imgs/blog-3.jpg);
}
.widget-area .widget_inspire_posts_thumb .item .thumb .fullimage.bg4 {
background-image: url(../imgs/blog-4.jpg);
}
.widget-area .widget_inspire_posts_thumb .item .info {
overflow: hidden;
margin-top: 5px;
}
.widget-area .widget_inspire_posts_thumb .item .info span {
display: block;
color: #747576;
text-transform: capitalize;
margin-top: -2px;
margin-bottom: 3px;
font-size: 14px;
}
.widget-area .widget_inspire_posts_thumb .item .info .title {
margin-bottom: 0;
line-height: 1.4;
font-size: 16px;
}
.widget-area .widget_inspire_posts_thumb .item .info .title a {
display: inline-block;
}
.widget-area .widget_recent_entries ul {
padding-left: 0;
margin-bottom: 0;
list-style-type: none;
}
.widget-area .widget_recent_entries ul li {
position: relative;
margin-bottom: 12px;
color: #a30000;
padding-left: 14px;
line-height: 1.5;
font-weight: 400;
font-size: 15.5px;
}
.widget-area .widget_recent_entries ul li:last-child {
margin-bottom: 0;
}
.widget-area .widget_recent_entries ul li::before {
background: #ff0000;
height: 8px;
width: 8px;
content: '';
left: 0;
top: 7px;
position: absolute;
border-radius: 50px;
border-right-style: inset;
}
.widget-area .widget_recent_entries ul li a {
display: inline-block;
color: #a30000;
}
.widget-area .widget_recent_entries ul li a:hover {
color: #ff0000;
}
.widget-area .widget_recent_entries ul li .post-date {
display: block;
font-size: 13px;
color: #747576;
margin-top: 4px;
}
.widget-area .widget_archive ul {
padding-left: 0;
margin-bottom: 0;
list-style-type: none;
}
.widget-area .widget_archive ul li {
position: relative;
margin-bottom: 12px;
padding-left: 14px;
color: #a30000;
font-size: 15.5px;
font-weight: 400;
}
.widget-area .widget_archive ul li:last-child {
margin-bottom: 0;
}
.widget-area .widget_archive ul li::before {
background: #ff0000;
height: 8px;
width: 8px;
content: '';
left: 0;
top: 7px;
position: absolute;
border-radius: 50px;
border-right-style: inset;
}
.widget-area .widget_archive ul li a {
display: inline-block;
color: #a30000;
}
.widget-area .widget_archive ul li a:hover {
color: #ff0000;
}
.widget-area .widget_categories ul {
padding-left: 0;
margin-bottom: 0;
list-style-type: none;
}
.widget-area .widget_categories ul li {
position: relative;
margin-bottom: 12px;
color: #747576;
padding-left: 14px;
font-size: 15.5px;
font-weight: 400;
}
.widget-area .widget_categories ul li:last-child {
margin-bottom: 0;
}
.widget-area .widget_categories ul li::before {
background: #ff0000;
height: 8px;
width: 8px;
content: '';
left: 0;
top: 7px;
position: absolute;
border-radius: 50px;
border-right-style: inset;
}
.widget-area .widget_categories ul li a {
color: #a30000;
display: block;
}
.widget-area .widget_categories ul li a:hover {
color: #ff0000;
}
.widget-area .widget_categories ul li .post-count {
float: right;
}
.widget-area .widget_meta ul {
padding-left: 0;
margin-bottom: 0;
list-style-type: none;
}
.widget-area .widget_meta ul li {
position: relative;
margin-bottom: 12px;
color: #a30000;
padding-left: 14px;
font-size: 15.5px;
font-weight: 400;
}
.widget-area .widget_meta ul li:last-child {
margin-bottom: 0;
}
.widget-area .widget_meta ul li::before {
background: #ff0000;
height: 8px;
width: 8px;
content: '';
left: 0;
top: 7px;
position: absolute;
border-radius: 50px;
border-right-style: inset;
}
.widget-area .widget_meta ul li a {
display: inline-block;
color: #a30000;
}
.widget-area .widget_meta ul li a:hover {
color: #ff0000;
}
.widget-area .widget_tag_cloud .widget-title {
margin-bottom: 12px;
}
.widget-area .tagcloud a {
display: inline-block;
color: #a30000;
font-weight: 400;
font-size: 14.5px !important;
padding: 6px 13px;
border: 1px dashed #eeeeee;
margin-top: 8px;
margin-right: 4px;
}
.widget-area .tagcloud a:hover, .widget-area .tagcloud a:focus {
color: #ffffff;
background-color: #ff0000;
border-color: #ff0000;
}
.widget-area .widget_event_details ul {
padding-left: 0;
margin-bottom: 0;
list-style-type: none;
}
.widget-area .widget_event_details ul li {
border-bottom: 1px solid #eeeeee;
color: #888f96;
padding-bottom: 10px;
padding-top: 10px;
}
.widget-area .widget_event_details ul li:first-child {
padding-top: 0;
}
.widget-area .widget_event_details ul li:last-child {
border-bottom: none;
padding-bottom: 0;
}
.widget-area .widget_event_details ul li span {
display: inline-block;
color: #a30000;
font-weight: 400;
}
.widget-area .widget_event_details ul li a {
display: inline-block;
color: #888f96;
}
.widget-area .widget_event_details ul li a:hover {
color: #ff0000;
}
/**************************************
** - 18 - Hire Section CSS
*************************************/
.hire-wrapper {
padding: 70px 0;
background-color: rgba(136, 116, 181, .11);
position: relative;
z-index: 1;
border-radius: 5px;
background: url(../imgs/banner-bg.jpg);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
overflow: hidden;
}
.hire-wrapper::before {
position: absolute;
top: 0;
content: "";
left: 0px;
padding: 0;
height: 100%;
width: 100%;
opacity: .7;
z-index: -1;
background: rgba(47, 55, 136, 0.5);
}
.hire-content h2 {
color: #fff;
font-size: 38px;
font-weight: 800;
margin-bottom: 15px;
}
.hire-content h5 {
color: #fff;
font-size: 20px;
font-weight: 700;
}
.btn-1 {
margin-right: 10px;
}
/********************************************
** - 19 - Industries We Serve Section CSS
********************************************/
.industries-area .section-title {
margin-bottom: 20px;
}
.industries-flip-single-item {
position: relative;
z-index: 1;
perspective: 1000px;
transform-style: preserve-3d;
-webkit-perspective: 1000px;
-webkit-transform-style: preserve-3d;
margin-top: 30px;
}
.industries-flip-box-front {
-ms-transform: rotateY(0deg);
-webkit-transform: rotateY(0deg);
transform: rotateY(0deg);
-webkit-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
transform-style: preserve-3d;
}
.industries-flip-single-item:hover .industries-flip-box-front {
-webkit-transform: rotateX(-180deg);
transform: rotateX(-180deg);
}
.industries-flip-single-item .industries-flip-box-front {
background: #fff;
}
.industries-flip-box-front .inner img {
width: 80px;
height: 80px;
}
.industries-flip-single-item .industries-flip-box-front,
.industries-flip-single-item .industries-flip-box-back {
position: relative;
min-height: 230px;
height: auto;
transform: rotateX(0);
-webkit-transform: rotateX(0);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transition: transform .7s ease, -webkit-transform .7s ease;
border-radius: 5px;
-webkit-box-shadow: 0 3px 15px rgba(0, 0, 0, 0.05), 0 5px 15px rgba(0, 0, 0, 0.03);
box-shadow: 0 3px 15px rgba(0, 0, 0, 0.05), 0 5px 15px rgba(0, 0, 0, 0.03);
}
.industries-flip-single-item .industries-flip-box-back {
position: absolute;
top: 0;
left: 0;
width: 100%;
-webkit-transform: rotateX(180deg);
transform: rotateX(180deg);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
}
.industries-flip-single-item:hover .industries-flip-box-back {
-webkit-transform: rotateX(0deg);
transform: rotateX(0deg);
}
.industries-flip-single-item .industries-flip-box-back {
background: #203be0;
background: linear-gradient(to bottom, #203be0, #140050);
border-radius: 5px;
}
.industries-flip-box-back img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.industries-flip-single-item .inner {
text-align: center;
padding: 0 25px;
position: absolute;
z-index: 2;
left: 0;
top: 50%;
width: 100%;
perspective: inherit;
-webkit-perspective: inherit;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-transform: translateY(-50%) translateZ(60px) scale(0.94);
transform: translateY(-50%) translateZ(60px) scale(0.94);
}
.industries-flip-single-item .industries-flip-box-front .inner h3 {
font-size: 18px;
color: #333;
margin-top: 20px;
will-change: transform;
}
.industries-flip-single-item .industries-flip-box-back .inner h3 {
font-size: 18px;
color: #fff;
margin-bottom: 10px;
will-change: transform;
}
.industries-flip-single-item .industries-flip-box-back .inner p {
font-size: 15px;
color: #fff;
margin-bottom: 15px;
will-change: transform;
}
/**************************************
** - 20 - Partner Section CSS
*************************************/
.partner-area {
padding: 0px;
margin-bottom: -10px;
}
.partner-area .container-fluid{
margin: 0;
padding: 0;
}
.partner-item {
padding: 0px;
margin: 0px;
contain: content;
}
.partner-area .partner-carousel img {
max-width: 100%;
width: inherit!important;
margin: 0 auto;
-webkit-transition: 0.3s;
transition: 0.3s;
}
.partner-area .partner-carousel img:hover {
opacity: .7;
cursor: pointer;
}
.partner-section-2 {
position: relative;
background-color: #fff;
overflow: hidden;
z-index: 1;
}
.partner-section-2 .partner-item-2 a {
display: block;
text-align: center;
position: relative;
padding: 30px 30px;
-webkit-transition: 0.5s;
transition: 0.5s;
border-radius: 5px;
border: 1px solid #ececec;
margin-bottom: 30px;
will-change: transform;
}
.partner-section-2 .partner-item-2 a:hover {
-webkit-box-shadow: 0px 0px 17px 0 #00000038;
-moz-box-shadow: 0px 0px 17px 0 #00000038;
-ms-box-shadow: 0px 0px 17px 0 #00000038;
box-shadow: 0px 0px 17px 0 #00000038;
-webkit-transform: translateY(-5px);
transform: translateY(-5px);
background-color: #ffffff;
border-color: #ffffff;
}
.partner-section-2 .partner-item-2:nth-child(6) {
margin-left: 10%;
}
/* Tooltip */
.tooltip {
position: relative;
display: inline-block;
opacity: 1;
}
.tooltip .tooltiptext {
visibility: hidden;
width: fit-content;
background-color: #ff0000;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 5px;
/* Position the tooltip */
position: absolute;
z-index: 1;
}
.tooltip:hover .tooltiptext {
visibility: visible;
}
/**************************************
** - 21 - All Footer Section CSS
*************************************/
.footer-area {
background: #303030;
padding: 100px 0;
}
.footer-about {
padding-right: 50px;
}
.footer-logo {
margin-bottom: 20px;
display: inline-block;
}
.footer-list h5 {
font-size: 18px;
font-weight: 700;
color: #fff;
margin-bottom: 25px;
}
.footer-list p {
font-size: 15px;
color: #ffffff;
}
.footer-list ul li {
margin-bottom: 8px;
color: #ffffff;
}
.footer-list ul li:last-child {
margin-bottom: 0px;
}
.footer-list ul li a {
display: inline-block;
font-size: 15px;
color: #ffffff;
}
.footer-list ul li a:hover {
color: #a30000;
text-decoration: underline;
}
.footer-contact-info .footer-contact-list li span {
display: inline-block;
color: #ffffff;
font-size: 14px;
font-weight: 600;
letter-spacing: .5px;
}
.footer-social-icon {
margin-top: 25px;
}
.footer-social-icon li {
margin-right: 10px;
display: inline-block;
}
.footer-social-icon li a {
color: #fff !important;
font-size: 25px !important;
width: 40px;
height: 40px;
line-height: 40px;
border-radius: 3px;
text-align: center;
border: 1px solid transparent;
display: block;
-webkit-transition: all .3s;
transition: all .3s;
/* background: #2f2f2f; */
}
.footer-social-icon li a:hover {
background: #a30000;
color: #fff !important;
border-radius: 30px;
}
.newsletter-form {
max-width: 580px;
position: relative;
margin-left: auto;
margin-right: auto;
margin-top: 30px;
}
.newsletter-form .input-newsletter {
display: block;
width: 100%;
background-color: #f5f5f5;
border: none;
height: 54px;
padding-left: 25px;
border-radius: 3px;
outline: 0;
color: #a30000;
}
.newsletter-form .input-newsletter::-webkit-input-placeholder {
color: #747576;
}
.newsletter-form .input-newsletter:-ms-input-placeholder {
color: #747576;
}
.newsletter-form .input-newsletter::-ms-input-placeholder {
color: #747576;
}
.newsletter-form .input-newsletter::placeholder {
color: #747576;
}
.newsletter-form button {
position: absolute;
right: 4px;
top: 4px;
color: #ffffff;
font-size: 15px;
background-color: #ff0000;
border: none;
height: 46px;
line-height: 46px;
padding: 0 20px;
border-radius: 3px;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
will-change: transform;
}
.newsletter-form button:hover {
background-color: #a30000;
color: #ffffff;
}
.copyright-area {
background-color: #1a1a1a;
padding-top: 35px;
padding-bottom: 35px;
}
.copyright-area p {
color: #ffffff;
font-size: 15px;
}
.copyright-area a {
color: #ffffff;
}
.copyright-area a:hover {
color: #ff0000;
}
.copyright-area ul {
padding-left: 0;
margin-bottom: 0;
list-style-type: none;
text-align: right;
}
.copyright-area ul li {
display: inline-block;
color: #ffffff;
font-size: 15px;
position: relative;
margin-left: 10px;
margin-right: 10px;
}
.copyright-area ul li a {
display: inline-block;
color: #ffffff;
}
.copyright-area ul li a:hover {
color: #ff0000;
}
.copyright-area ul li::before {
content: '';
position: absolute;
top: 5px;
right: -13px;
width: 1px;
height: 14px;
background-color: #ffffff;
}
.copyright-area ul li:last-child {
margin-right: 0;
}
.copyright-area ul li:last-child::before {
display: none;
}
.copyright-area ul li:first-child {
margin-left: 0;
}
/**********************************************
** - 21.01 - Demo-2 Footer Section CSS
**********************************************/
.footer-section-2 {
background-image: url(../imgs/footer-shape.svg);
background-position: left center;
background-size: contain;
background-repeat: no-repeat;
position: relative;
z-index: 1;
overflow: hidden;
}
.footer-section-2::before {
position: absolute;
content: "";
height: 100%;
width: 100%;
left: 0;
right: 0;
top: 0;
z-index: -1;
opacity: 0.8;
background-image: url(../imgs/footer-dot.png);
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
}
.footer-heading-2 {
margin-bottom: 25px;
}
.footer-heading-2 h3 {
font-size: 18px;
color: #333;
font-weight: 600;
margin: 0 0 0 0;
position: relative;
}
.single-footer-widget-2 p {
font-size: 14px;
color: #000;
font-weight: 400;
}
.single-footer-widget-2 .footer-heading-2 {
margin-bottom: 25px;
}
.single-footer-widget-2 .footer-heading-2 h3 {
font-size: 18px;
color: #333;
font-weight: 600;
margin: 0 0 0 0;
}
.single-footer-widget-2 .footer-quick-links-2 {
padding-left: 0;
margin-bottom: 0;
}
.single-footer-widget-2 .footer-nav-links-2 li {
list-style-type: none;
padding-bottom: 12px;
}
.single-footer-widget-2 .footer-nav-links-2 li:last-child {
padding-bottom: 0;
}
.single-footer-widget-2 .footer-quick-links-2 li a {
display: inline-block;
color: #000;
font-size: 14px;
font-weight: 600;
letter-spacing: .5px;
}
.single-footer-widget-2 .footer-quick-links-2 li a:hover {
color: #ff0000;
text-decoration: underline;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.footer-offices-info-2 {
margin-bottom: 30px;
}
.footer-offices-info-2:last-child {
margin-bottom: 0px;
}
.footer-offices-info-2 h6 {
color: #333;
font-size: 14px;
font-weight: 600;
letter-spacing: .5px;
}
.footer-offices-info-2 p {
color: #000;
font-size: 14px;
font-weight: 600;
letter-spacing: .5px;
margin-bottom: 0;
}
.footer-offices-info-2 span a {
color: #ff0000;
font-size: 14px;
font-weight: 600;
letter-spacing: 1.5px;
}
.single-footer-widget-2 .footer-info-contact-2 {
position: relative;
margin-bottom: 15px;
}
.single-footer-widget-2 .footer-social-2 {
padding-left: 0;
margin-bottom: 0;
margin-top: 20px;
}
.single-footer-widget-2 .footer-social-2 li {
display: inline-block;
margin-right: 10px;
}
.single-footer-widget-2 .footer-social-2 li:last-child {
margin-right: 0;
}
.single-footer-widget-2 .footer-social-2 i {
display: inline-block;
font-size: 18px;
height: 40px;
width: 40px;
line-height: 40px;
background-color: #f5f5f5;
border: 1px solid #f5f5f5;
border-radius: 5px;
color: #ff0000;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
will-change: transform;
text-align: center;
}
.single-footer-widget-2 .footer-social-2 i:hover {
background-color: #a30000;
color: #ffffff;
border: 1px solid #a30000;
}
.newsletter-form-2 {
max-width: 580px;
position: relative;
margin-left: auto;
margin-right: auto;
margin-top: 25px;
}
.newsletter-form-2 .input-newsletter {
display: block;
width: 100%;
background-color: #f5f5f5;
border: none;
height: 54px;
padding-left: 25px;
border-radius: 3px;
outline: 0;
color: #a30000;
}
.newsletter-form-2 .input-newsletter::-webkit-input-placeholder {
color: #747576;
}
.newsletter-form-2 .input-newsletter:-ms-input-placeholder {
color: #747576;
}
.newsletter-form-2 .input-newsletter::-ms-input-placeholder {
color: #747576;
}
.newsletter-form-2 .input-newsletter::placeholder {
color: #747576;
}
.newsletter-form-2 button {
position: absolute;
right: 4px;
top: 4px;
color: #ffffff;
font-size: 15px;
background-color: #ff0000;
border: none;
height: 46px;
line-height: 46px;
padding: 0 20px;
border-radius: 3px;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
}
.newsletter-form-2 button:hover {
background-color: #a30000;
color: #ffffff;
}
.single-footer-widget-2 .footer-download-btn-2 {
margin-top: 25px;
}
.single-footer-widget-2 .footer-download-btn-2 a {
display: inline-block;
}
.single-footer-widget-2 .footer-download-btn-2 .app-link-btn-1 {
margin-right: 10px;
}
.single-footer-widget-2 .footer-download-btn-2 a:hover {
opacity: .8;
}
/**********************************************
** - 22 - Other Page Banner Title Area CSS
**********************************************/
.page-title-area {
position: relative;
z-index: 1;
padding: 20px 0;
background: #ff0000;
background: linear-gradient(to left,#a30000 ,#ff0000);
}
.page-title-content {
text-align: left;
}
.page-title-content ul {
padding: 0;
margin: 0;
list-style-type: none;
}
.page-title-content ul li {
color: #ffffff;
display: inline-block;
position: relative;
font-weight: 600;
font-size: 13px;
margin: 0;
letter-spacing: 0.3px;
text-transform: uppercase;
}
.page-title-content ul li a {
display: inline-block;
color: #ffffff;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
will-change: transform;
}
.page-title-content ul li a:hover {
color: #fff;
text-decoration: underline;
}
.page-title-content ul li::after {
content: '\007c';
padding: 0 10px;
vertical-align: top;
font-weight: bolder;
font-size: 12px;
}
.page-title-content ul li:last-child::after {
display: none;
}
/****************************************
** - 23 - All Contact Page Section CSS
****************************************/
.home-3-contact-area,
.contact-page-1-section {
background-image: url(../imgs/map-image.png);
background-position: right center;
background-size: auto;
background-repeat: no-repeat;
}
.contact-form-box {
margin-top: 35px;
}
.contact-form .form-group {
margin-bottom: 30px;
}
.contact-form form .form-control {
background-color: #ffffff;
border: none;
height: 50px;
font-size: 15px;
border: 1px solid #cacaca;
}
.home-3-contact-area form .form-control,
.contact-page-1-section form .form-control {
background-color: transparent;
border: none;
height: 50px;
font-size: 15px;
border: 1px solid #cacaca;
}
.contact-form form .form-control:focus {
border: 1px solid #ff0000;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.contact-form form textarea.form-control {
height: auto;
padding-top: 15px;
line-height: initial;
}
.contact-info-box .single-contact-box {
text-align: center;
background-color: #ffffff;
padding: 0px 25px;
margin-top: 30px;
}
.single-contact-box img {
margin-bottom: 30px;
}
.contact-section .form-message {
margin: 0;
}
.contact-section .form-message.success {
background: #03b103;
color: #fff;
padding: 10px 15px;
border-radius: 3px;
margin-bottom: 30px;
}
.contact-section .form-message.error {
background: #ff4d15;
color: #fff;
padding: 10px 15px;
border-radius: 3px;
margin-bottom: 30px;
}
/**************************************
** - 23.01 - Contact-2 Page CSS
**************************************/
.contact-form-2 .form .form-control {
background-color: #f3f3f3;
border: none;
height: 50px;
font-size: 15px;
border: 0px solid #f3f3f3;
}
.contact-form-2 .form textarea.form-control {
height: auto;
padding-top: 15px;
line-height: initial;
}
.contact-form-2 .form .form-control:focus,
.contact-form-2 .form textarea.form-control:focus {
border: 0px;
outline: none;
}
.single-contact-box-2 h3 {
font-size: 28px;
font-weight: 700;
margin-bottom: 15px;
}
.contact-office-address-box {
background: #fff;
margin-top: 30px;
padding: 45px 20px;
text-align: center;
border-radius: 5px;
border-top: 2px solid #ff0000;
-webkit-box-shadow: 0 3px 15px rgba(0, 0, 0, 0.05), 0 5px 15px rgba(0, 0, 0, 0.03);
box-shadow: 0 3px 15px rgba(0, 0, 0, 0.05), 0 5px 15px rgba(0, 0, 0, 0.03);
}
.contact-office-address-box h5 {
font-size: 18px;
font-weight: 700;
margin-bottom: 10px;
}
.contact-office-address-box a {
font-size: 14px;
font-weight: 600;
letter-spacing: 1.5px;
display: block;
line-height: 1.5;
}
.contact-office-address-box p {
font-size: 14px;
margin-bottom: 12px;
}
.social-icon-box {
margin-top: 20px;
}
.social-icon-box li {
margin-right: 10px;
display: inline-block;
}
.social-icon-box li a {
color: #ff0000;
font-size: 15px;
width: 40px;
height: 40px;
line-height: 40px;
border-radius: 3px;
text-align: center;
border: 1px solid #ff0000;
background: transparent;
display: block;
-webkit-transition: all .3s;
transition: all .3s;
}
.social-icon-box li a:hover {
background: #ff0000;
color: #fff !important;
}
/**************************************
** - 23.02 - Contact-3 Page CSS
**************************************/
.contact-form-3 form .form-control {
font-size: 15px;
width: 100%;
padding: 10px 20px;
height: 50px;
color: #333;
border: none;
background-color: #f3f3f3;
font-weight: 600;
border-radius: 5px;
text-transform: capitalize;
border-left: 2px solid #929292;
transition: all 0.4s;
}
.contact-form-3 .form input:focus,
.contact-form-3 .form textarea:focus {
outline: none;
border: none;
border-left: 2px solid #ff0000;
}
.contact-information-box-3 .single-contact-info-box {
position: relative;
z-index: 1;
padding: 15px 25px;
display: block;
border-radius: 3px;
background: #f3f3f3;
text-align: left;
margin-bottom: 20px;
overflow: hidden;
}
.contact-information-box-3 .contact-info {
position: relative;
z-index: 1;
}
.contact-information-box-3 .contact-info i {
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 0;
color: #ff0000;
font-size: 35px;
width: 70px;
height: 70px;
line-height: 70px;
text-align: center;
border-radius: 50%;
display: block;
background: #ffffff;
}
.contact-information-box-3 .contact-info h6 {
font-weight: 700;
font-size: 18px;
color: #333;
margin-bottom: 7px;
text-transform: capitalize;
}
.contact-information-box-3 .contact-info p {
font-weight: 500;
font-size: 14px;
color: #333;
text-transform: capitalize;
margin: 0;
}
.contact-information-box-3 .single-contact-info-box .contact-info-bg-icon {
color: #a30000;
opacity: .07;
position: absolute;
left: 0;
right: 0;
bottom: -100px;
margin: 0 auto;
z-index: -1;
-webkit-transition: 0.5s;
transition: 0.5s;
}
.contact-information-box-3 .single-contact-info-box .contact-info-bg-icon i {
font-size: 200px;
}
/*********************************************
** - 23.00 - Contact Page Map Section CSS
*********************************************/
.map-area .map-content{
margin: 0px 0px -10px;
}
/**************************************
** - 24 - Pricing Page Section CSS
**************************************/
.pricing-area {
position: relative;
z-index: 1;
}
.single-pricing-box {
margin-bottom: 30px;
border: 1px solid #ececec;
padding: 30px;
-webkit-transition: 0.5s;
transition: 0.5s;
border-radius: 5px;
will-change: transform;
}
.single-pricing-box .pricing-header h3 {
margin-bottom: 0;
font-size: 26px;
font-weight: 700;
}
.single-pricing-box .pricing-header p {
-webkit-transition: 0.5s;
transition: 0.5s;
line-height: 1.6;
margin-top: 10px;
margin-bottom: 0;
}
.single-pricing-box .price {
font-size: 50px;
font-weight: 700;
margin-bottom: 10px;
}
.single-pricing-box .price span {
display: inline-block;
margin-left: -7px;
font-size: 20px;
font-weight: 600;
}
.single-pricing-box .price-btn-box {
margin-bottom: 25px;
}
.price-btn-box .btn-primary {
border-radius: 30px;
}
.single-pricing-box .pricing-features {
padding-left: 0;
margin-bottom: 0;
list-style-type: none;
}
.single-pricing-box .pricing-features li {
margin-bottom: 12px;
color: #747576;
position: relative;
padding-left: 24px;
}
.single-pricing-box .pricing-features li:last-child {
margin-bottom: 0;
}
.single-pricing-box .pricing-features li i {
color: #ff0000;
font-size: 16px;
position: absolute;
left: 0;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.single-pricing-box:hover {
-webkit-box-shadow: 0 3px 30px 0 rgba(0, 0, 0, 0.08);
box-shadow: 0 3px 30px 0 rgba(0, 0, 0, 0.08);
-webkit-transform: translateY(-5px);
transform: translateY(-5px);
background-color: #ffffff;
border-color: #ffffff;
}
.single-pricing-box:hover .price-btn-box .btn-primary::before {
visibility: hidden;
opacity: 0;
}
.single-pricing-box:hover .price-btn-box .btn-primary::after {
opacity: 1;
visibility: visible;
}
.pricing-tab .tabs {
padding-left: 0;
margin-bottom: 45px;
list-style-type: none;
text-align: center;
}
.pricing-tab .tabs li {
display: inline-block;
}
.pricing-tab .tabs li a {
position: relative;
z-index: 1;
background-color: #f1f1f1;
padding: 10px 30px 11px;
margin-left: -2px;
margin-right: -2px;
font-weight: 600;
font-size: 16px;
display: block;
}
.pricing-tab .tabs li a::before {
content: '';
position: absolute;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
top: 0;
opacity: 0;
background-color: #ff0000;
visibility: hidden;
-webkit-transition: 0.5s;
transition: 0.5s;
}
.pricing-tab .tabs li a:hover {
color: #ffffff;
}
.pricing-tab .tabs li a:hover::before {
opacity: 1;
visibility: visible;
}
.pricing-tab .tabs li.current a {
color: #ffffff;
}
.pricing-tab .tabs li.current a::before {
opacity: 1;
visibility: visible;
}
.pricing-tab .tabs li:nth-child(1) a {
border-radius: 5px 0 0 5px;
}
.pricing-tab .tabs li:nth-child(1) a::before {
border-radius: 5px 0 0 5px;
}
.pricing-tab .tabs li:nth-child(2) a {
border-radius: 0 5px 5px 0;
}
.pricing-tab .tabs li:nth-child(2) a::before {
border-radius: 0 5px 5px 0;
}
.tab .tabs_item {
display: none;
}
.tab .tabs_item:first-child {
display: block;
}
/**************************************
** - 25 - Team Page Section CSS
*************************************/
.team-area .section-title {
margin-bottom: 30px;
}
.single-team-box {
margin-top: 35px;
border-radius: 3px;
overflow: hidden;
-webkit-transition: 0.5s;
transition: 0.5s;
}
.team-image {
position: relative;
z-index: 1;
}
.single-team-box .team-image img {
width: 100%;
height: auto;
}
.team-social-box {
display: block;
}
.team-social-box {
position: absolute;
top: 10px;
left: 10px;
right: 10px;
bottom: 10px;
z-index: 2;
-webkit-transition: all .5s;
transition: all .5s;
background-color: transparent;
}
.single-team-box .team-image .team-social-box:after {
content: '';
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 0;
z-index: -1;
border-radius: 3px;
background: rgba(0, 0, 0, 0.5);
-webkit-transition: all .5s;
transition: all .5s;
}
.single-team-box:hover .team-image .team-social-box:after {
height: 100%;
}
.single-team-box .team-social-icon {
position: absolute;
left: 50%;
top: 50%;
width: 100%;
height: auto;
text-align: center;
overflow: hidden;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
will-change: transform;
}
.single-team-box .team-social-icon a {
position: relative;
z-index: 1;
display: inline-block;
color: inherit;
font-size: 15px;
margin: 12px 5px;
vertical-align: middle;
background: #ffffff;
width: 33px;
height: 33px;
line-height: 33px;
text-align: center;
border-radius: 30px;
opacity: 0;
visibility: hidden;
-webkit-transform: translateY(50px);
transform: translateY(50px);
-webkit-transition: all .4s;
}
.single-team-box:hover .team-social-icon a {
opacity: 1;
visibility: visible;
-webkit-transform: translateY(0px);
transform: translateY(0px);
-webkit-transition-delay: .3s;
transition-delay: .3s;
}
.single-team-box .team-social-icon a:after {
top: 0px;
left: 0px;
z-index: -1;
position: absolute;
width: 100%;
height: 100%;
content: '';
-webkit-transform: scale(1.4);
-ms-transform: scale(1.4);
-o-transform: scale(1.4);
transform: scale(1.4);
opacity: 0;
-webkit-transition: all 0.5s;
-o-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
transition: all 0.5s;
background: inherit;
border-radius: inherit;
will-change: transform;
}
.single-team-box .team-social-icon a:hover:after {
-webkit-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
opacity: 1;
}
.single-team-box .team-social-icon a:hover i:before {
color: #fff;
-webkit-transition: all 0.5s;
-o-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
transition: all 0.5s;
}
.team-info {
padding: 20px 15px 15px;
text-align: center;
-webkit-transition: 0.5s;
transition: 0.5s;
}
.team-info h3 {
font-size: 18px;
font-weight: 700;
margin-bottom: 0;
}
.team-info span {
color: #ff0000;
font-size: 14px;
font-weight: 600;
display: block;
}
.social-color-1:hover:after {
background-color: #3b5998 !important;
}
.social-color-2:hover:after {
background-color: #00acee !important;
}
.social-color-3:hover:after {
background-color: #0e76a8 !important;
}
.social-color-1 {
color: #3b5998 !important;
background-color: transparent;
}
.social-color-2 {
color: #00acee !important;
background-color: transparent;
}
.social-color-3 {
color: #0e76a8 !important;
background-color: transparent;
}
.mt-70 {
margin-top: 70px !important;
}
/**************************************
* 25.01 Demo-3 Team Section Style
*************************************/
.team-area-3 .section-title {
margin-bottom: 35px;
}
.single-team-box-3 {
padding: 0px 10px;
margin-top: 30px;
overflow: hidden;
-webkit-transition: 0.5s;
transition: 0.5s;
}
.team-image {
position: relative;
z-index: 1;
}
.single-team-box-3 .team-image-3 img {
width: 100%;
height: auto;
border-radius: 50%;
}
.team-info-3 {
padding: 20px 15px 25px;
text-align: center;
-webkit-transition: 0.5s;
transition: 0.5s;
}
.team-info-3 h3 {
font-size: 18px;
font-weight: 700;
margin-bottom: 5px;
}
.team-info-3 span {
color: #a30000;
font-size: 14px;
font-weight: 700;
display: block;
}
.team-social-icon-3 {
display: block;
margin-top: 15px;
}
.single-team-box-3 .team-social-icon-3 a {
display: inline-block;
color: inherit;
font-size: 14px;
margin: 0 5px;
vertical-align: middle;
background: transparent;
width: 33px;
height: 33px;
line-height: 33px;
text-align: center;
border-radius: 30px;
position: relative;
z-index: 1;
}
.single-team-box-3 .team-social-icon-3 a:after {
top: 0px;
left: 0px;
z-index: -1;
position: absolute;
width: 100%;
height: 100%;
content: '';
-webkit-transform: scale(1.4);
-ms-transform: scale(1.4);
-o-transform: scale(1.4);
transform: scale(1.4);
opacity: 0;
-webkit-transition: all 0.5s;
-o-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
transition: all 0.5s;
background: inherit;
border-radius: inherit;
}
.single-team-box-3 .team-social-icon-3 a:hover:after {
-webkit-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
opacity: 1;
}
.single-team-box-3 .team-social-icon-3 a:hover i:before {
color: #fff;
-webkit-transition: all 0.5s;
-o-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
transition: all 0.5s;
}
.social-color-1:hover:after {
background-color: #3b5998 !important;
}
.social-color-2:hover:after {
background-color: #00acee !important;
}
.social-color-3:hover:after {
background-color: #0e76a8 !important;
}
.social-color-1 {
color: #3b5998 !important;
background-color: transparent;
border: 1px dashed #3b5998;
}
.social-color-2 {
color: #00acee !important;
background-color: transparent;
border: 1px dashed #00acee;
}
.social-color-3 {
color: #0e76a8 !important;
background-color: transparent;
border: 1px dashed #0e76a8;
}
.mt-70 {
margin-top: 70px !important;
}
.team-more-btn-box {
margin-top: 30px;
}
/**************************************
** - 26 - Faq Page Area CSS
**************************************/
.faq-accordion .accordion {
list-style-type: none;
padding: 0;
margin: 0;
padding-left: 0;
margin-bottom: 0;
position: relative;
}
.faq-accordion .accordion .accordion-item {
display: block;
border-radius: 5px;
margin-bottom: 20px;
overflow: hidden;
-webkit-box-shadow: 0 0.3em 1em -0.125em rgba(10,10,10,.1), 0 0 0 1px rgba(10,10,10,.02);
box-shadow: 0 0.3em 1em -0.125em rgba(10,10,10,.1), 0 0 0 1px rgba(10,10,10,.02);
}
.faq-accordion .accordion .accordion-item:last-child {
margin-bottom: 0;
}
.faq-accordion .accordion .accordion-item .accordion-title {
padding: 20px;
color: #333;
position: relative;
background: #ffffff;
font-size: 18px;
font-weight: 600;
display: block;
border: none;
}
.faq-accordion .accordion .accordion-item .accordion-title i {
position: absolute;
right: 30px;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
color: #767c99;
-webkit-transition: 0.5s;
transition: 0.5s;
font-size: 15px;
}
.faq-accordion .accordion .accordion-item .accordion-title.active i::before {
content: "\f0d8";
}
.faq-accordion .accordion .accordion-item .accordion-content {
display: none;
background-color: #ffffff;
margin-bottom: 0;
padding: 20px 15px;
font-size: 15px;
border-top: 1px solid #dadada;
}
.faq-accordion .accordion .accordion-item .accordion-content.show {
display: block;
}
/**************************************
** - 27 - 404 Error Page Area CSS
**************************************/
.error-area {
height: 100vh;
}
.error-content {
text-align: center;
margin: 0 auto;
max-width: 700px;
padding-bottom: 100px;
}
.error-content h3 {
font-size: 35px;
margin-top: 10px;
margin-bottom: 18px;
}
.error-content p {
max-width: 520px;
margin: 0 auto 20px;
line-height: 30px;
}
.error-content .default-btn-one {
display: inline-block;
padding: 12px 30px;
background: #ff0000;
border: 1px solid #ff0000;
color: #ffffff;
font-size: 16px;
font-weight: 400;
-webkit-transition: .6s;
transition: .6s;
margin-right: 0;
}
.error-content .default-btn-one:hover {
text-decoration: none;
background-color: #ffffff;
color: #ff0000;
}
/**************************************
** - 28 - Coming Soon Page Area CSS
**************************************/
.coming-soon-area {
position: relative;
z-index: 1;
height: 100vh;
background-image: url(../imgs/banner-bg.jpg);
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
}
.coming-soon-area::before {
z-index: -1;
background: #000000;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
content: '';
opacity: .80;
}
.coming-soon-area .social-list {
padding: 0;
margin: 0;
list-style-type: none;
position: absolute;
left: 0;
right: 0;
margin: 0 auto;
text-align: center;
bottom: 30px;
}
.coming-soon-area .social-list li {
display: inline-block;
}
.coming-soon-area .social-list li.list-heading {
display: block;
color: #ffffff;
margin-bottom: 10px;
font-size: 16px;
font-weight: 500;
}
.coming-soon-area .social-list li a {
width: 35px;
height: 35px;
line-height: 35px;
background: #ff0000;
border: 1px solid #ff0000;
color: #ffffff;
border-radius: 50%;
margin: 0 2px;
display: inline-block;
}
.coming-soon-area .social-list li a:hover {
background-color: transparent;
color: #fff;
-webkit-transition: .6s;
transition: .6s;
-webkit-transition: 0.5s;
}
.coming-soon-content {
text-align: center;
max-width: 820px;
margin: -80px auto 0;
}
.coming-soon-content h1 {
color: #ffffff;
margin-bottom: 15px;
font-size: 46px;
font-weight: 700;
}
.coming-soon-content p {
color: #ffffff;
margin: 0 auto;
max-width: 620px;
line-height: 30px;
}
.coming-soon-content form {
position: relative;
margin: 35px auto 55px;
max-width: 520px;
}
.coming-soon-content form .email-input {
display: block;
width: 100%;
height: 56px;
border: none;
-webkit-box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.1), 0px 0px 0px 5px rgba(255, 255, 255, 0.3);
box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.1), 0px 0px 0px 5px rgba(255, 255, 255, 0.3);
border-radius: 40px;
padding: 15px 25px;
outline: 0 !important;
background: #F1F2F3;
}
.coming-soon-content form .submit-btn {
position: absolute;
right: 3px;
top: 3px;
height: 50px;
background: #ff0000;
color: #ffffff;
border: none;
border-radius: 40px;
width: 130px;
outline: 0 !important;
cursor: pointer;
text-transform: uppercase;
font-size: 14px;
font-weight: 600;
}
.coming-soon-content form .submit-btn:hover, .coming-soon-content form .submit-btn:focus {
background-color: #ff0000;
}
.coming-soon-content #timer div {
background: #ffffff;
display: inline-block;
border-radius: 50%;
width: 120px;
height: 120px;
color: #ff0000;
-webkit-box-shadow: 0 0 20px -5px rgba(68, 107, 138, 0.3);
-moz-box-shadow: 0 0 20px -5px rgba(68, 107, 138, 0.3);
box-shadow: 0 0 20px -5px rgba(68, 107, 138, 0.3);
margin: 0 10px;
padding-top: 18px;
font-size: 40px;
font-weight: 700;
}
.coming-soon-content #timer div span {
display: block;
margin-top: -4px;
color: #777777;
font-size: 14px;
font-weight: 600;
}
/*********************************************************************
** - 29 - Terms & Conditions - Privacy Policy Page Section CSS
*********************************************************************/
.single-privacy h3 {
font-size: 25px;
margin: 0 0 20px 0;
}
.privacy-policy p{
text-align: justify;
}
/*********************************************************************
** - 30 - Timeline
*********************************************************************/
.main-timeline {
position: relative
}
.main-timeline:before {
content: "";
display: block;
width: 2px;
height: 100%;
background: #ff0000;
margin: 0 auto;
position: absolute;
top: 0;
left: 0;
right: 0
}
.main-timeline .timeline {
margin-bottom: 40px;
position: relative
}
.main-timeline .timeline:after {
content: "";
display: block;
clear: both
}
.main-timeline .icon {
width: 18px;
height: 18px;
line-height: 18px;
margin: auto;
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0
}
.main-timeline .icon:before,
.main-timeline .icon:after {
content: "";
width: 100%;
height: 100%;
border-radius: 50%;
position: absolute;
top: 0;
left: 0;
transition: all 0.33s ease-out 0s
}
.main-timeline .icon:before {
background: #fff;
border: 2px solid #ff0000;
left: -3px
}
.main-timeline .icon:after {
border: 2px solid #a30000;
left: 3px
}
.main-timeline .timeline:hover .icon:before {
left: 3px
}
.main-timeline .timeline:hover .icon:after {
left: -3px
}
.main-timeline .date-content {
width: 50%;
float: left;
margin-top: 22px;
position: relative
}
.main-timeline .date-content:before {
content: "";
width: 36.5%;
height: 2px;
background: #a30000;
margin: auto 0;
position: absolute;
top: 0;
right: 10px;
bottom: 0
}
.main-timeline .date-outer {
width: 125px;
height: 125px;
font-size: 16px;
text-align: center;
margin: auto;
z-index: 1;
}
.main-timeline .date-outer:before,
.main-timeline .date-outer:after {
content: "";
width: 125px;
height: 125px;
margin: 0 auto;
border-radius: 50%;
position: absolute;
top: 0;
left: 0;
right: 0;
transition: all 0.33s ease-out 0s;
}
.main-timeline .date-outer:before {
border: 2px solid #ff0000;
left: -6px
}
.main-timeline .date-outer:after {
border: 2px solid #a30000;
left: 6px
}
/* */
.main-timeline .timeline:hover .date-outer:before {
left: 6px;
}
.main-timeline .timeline:hover .date-outer:after {
left: -6px
}
.main-timeline .date {
width: 100%;
margin: auto;
position: absolute;
top: 27%;
left: 0
}
.main-timeline .month {
font-size: 18px;
font-weight: 700
}
.main-timeline .year {
display: block;
font-size: 30px;
font-weight: 700;
color: #232323;
line-height: 36px
}
.main-timeline .timeline-content {
width: 50%;
padding: 20px 0 20px 50px;
float: right
}
.main-timeline .title {
font-size: 19px;
font-weight: 700;
line-height: 24px;
margin: 0 0 15px 0;
color: #a30000;
}
.main-timeline .description {
margin-bottom: 0
}
.main-timeline .timeline:nth-child(2n) .date-content {
float: right
}
.main-timeline .timeline:nth-child(2n) .date-content:before {
left: 10px
}
.main-timeline .timeline:nth-child(2n) .timeline-content {
padding: 20px 50px 20px 0;
text-align: right
}
@media only screen and (max-width: 991px) {
.main-timeline .date-content {
margin-top: 35px
}
.main-timeline .date-content:before {
width: 22.5%
}
.main-timeline .timeline-content {
padding: 10px 0 10px 30px
}
.main-timeline .title {
font-size: 17px
}
.main-timeline .timeline:nth-child(2n) .timeline-content {
padding: 10px 30px 10px 0
}
}
@media only screen and (max-width: 767px) {
.main-timeline:before {
margin: 0;
left: 7px
}
.main-timeline .timeline {
margin-bottom: 20px
}
.main-timeline .timeline:last-child {
margin-bottom: 0
}
.main-timeline .icon {
margin: auto 0
}
.main-timeline .date-content {
width: 95%;
float: right;
margin-top: 0
}
.main-timeline .date-content:before {
display: none
}
.main-timeline .date-outer {
width: 110px;
height: 110px
}
.main-timeline .date-outer:before,
.main-timeline .date-outer:after {
width: 110px;
height: 110px
}
.main-timeline .date {
top: 30%
}
.main-timeline .year {
font-size: 24px
}
.main-timeline .timeline-content,
.main-timeline .timeline:nth-child(2n) .timeline-content {
width: 95%;
text-align: center;
padding: 10px 0
}
.main-timeline .title {
margin-bottom: 10px
}
}
/**************************************
** - 30 - Cartões laterais
**************************************/
.aboutus .about-quote-box {
position: relative;
padding: 27px 20px;
background-color: #ff0000;
margin-bottom: 10px
}
.aboutus .about-quote-box:hover {
background-color: #a30000;
transition:all .7s;
}
.aboutus .about-quote-box h6 {
color: #fff;
}
.aboutus .about-quote-box i {
text-align: right;
width: 100%;
font-size: 40px;
color: #fff
}
/**************************************
** - 32 - Equipamentos Peças de reposição
**************************************/
.title span{
float: right;
font-size: 16px;
}
.product-box {
margin-bottom: 20px
}
.product-box,
.product-box-3 {
position: relative;
border-radius: 4px;
background: #fff;
box-shadow: 0 0 0 1px rgba(67, 41, 163, .08), 0 1px 5px 0 rgba(67, 41, 163, .08)
}
.swiper-slide .product-box,
.swiper-slide .product-box-3,
.swiper-slide .testimonial-wrapper {
margin: 4px
}
.product-box-3:hover,
.product-box:hover {
box-shadow: 0 0 0 1px #ff0000, 0 1px 5px 0 #ff0000
}
.product-box-3 .product-img,
.product-box .product-img {
position: relative
}
.product-box .product-caption.text-center {
text-align: left!important
}
.product-box-3 .product-caption,
.product-box .product-caption {
overflow: hidden;
text-overflow: ellipsis;
padding: 15px;
width: 100%
}
.product-box .product-img a img {
object-fit: scale-down;
transform: scale(.9);
transition-duration: .4s
}
.product-box:hover .product-img a img {
transform: scale(1)
}
.product-box .product-caption .title-box {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 5px
}
.product-box .product-caption .product-title {
margin-bottom: 0
}
.product-box .product-caption p {
font-size: 14px
}
.product-box .product-caption .product-btn {
margin-top: 10px
}
.product-box .product-img .product-tags,
.product-box .product-img .product-tags .custom-tag {
display: flex;
align-items: center;
justify-content: start
}
.product-box .product-img .product-tags>span:first-child {
position: absolute;
top: 10px;
right: 10px
}
.product-box .product-caption .product-details {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between
}
.product-box .product-caption .product-details span {
display: block;
line-height: normal
}
.product-box .product-caption .product-footer {
margin-top: 10px;
display: flex;
align-items: center;
justify-content: flex-start
}
.product-box .product-footer-2 {
display: flex;
align-items: center;
justify-content: space-between;
background: #fbfbfc;
padding: 12px 10px
}
.product-box .product-rating i {
color: #ffa900
}
.product-box .product-img .product-action {
position: absolute;
left: 0;
right: 0;
display: flex;
top: 50%;
transform: translateY(-50%);
justify-content: center;
z-index: 1
}
.product-box .product-img .product-action i {
font-size: 20px;
border: 1px solid #fff;
padding: 15px
}
.product-box .product-img .product-action i:hover {
border: 1px solid #fff;
background-color: #fff;
color: #000
}
.product-box .product-img .product-action i {
color: red
}
.product-box .product-img .product-action a {
margin: 0 4px;
visibility: hidden;
transition: .3s
}
.product-box .product-img:hover .product-action a {
visibility: visible;
transition: .3s
}
.product-box .product-img .product-badge {
position: absolute;
color: #fff;
top: 0;
left: 0;
font-size: 15px;
z-index: 1
}
.product-box .product-img .product-badge .badge {
background-color: red
}
.product-box .product-money .text-price {
text-decoration: line-through;
color: grey
}
.product-box {
animation-name: zoomIn;
animation-duration: 1s
}
.Astro-offer {
position: absolute;
font-size: 11px;
top: 6px;
left: -8px
}
.Astro-offer .astro-offer-top {
background: #ff0000;
position: relative;
padding: 2px 6px 2px 5px;
color: #fff;
font-weight: 700;
margin-right: 0;
font-size: 14px;
border-radius: 0 1px 0 0
}
.Astro-offer .astro-offer-bottom {
color: #fff;
font-weight: 700;
padding: 2px 5px;
background: #a30000;
position: relative;
font-size: 14px;
margin-right: 9px
}
.Astro-offer .astro-offer-bottom .arrow1 {
width: 10px;
height: 10px;
background: #a30000;
-webkit-clip-path: polygon(100% 0, 13% 100%, 0 0);
clip-path: polygon(100% 0, 13% 100%, 0 0);
display: block;
position: absolute;
right: -9px;
top: 0
}
.Astro-offer .astro-offer-bottom .arrow2 {
width: 7px;
height: 7px;
background: #ff0000;
-webkit-clip-path: polygon(100% 0, 100% 100%, 0 0);
clip-path: polygon(100% 0, 100% 100%, 0 0);
display: block;
position: absolute;
left: 0;
bottom: -7px
}
.astro-rating {
background: #fff;
border: 1px solid #b3afaf;
color: #333;
width: 60px;
height: 25px;
border-radius: 50px;
display: flex;
align-items: center;
justify-content: center;
margin: 0;
position: absolute;
top: 10px;
right: 8px;
font-size: 12px;
font-weight: 400
}
.astro-rating span i {
color: #fc0;
margin-left: 6px
}
.product-status h6 {
margin-bottom: 8px;
font-size: 14px
}
.astro-information ul {
list-style: none;
padding: 0
}
.astro-information ul li {
color: #999;
font-size: 14px;
line-height: 34px;
text-align: left
}
.astro-information ul li span {
display: inline-block;
margin-right: 4px
}
.outer-overlap {
position: relative
}
.product-label {
background: #ff9f1c;
border-radius: 5px;
color: #fff;
font-size: 12px;
font-weight: 400;
left: 10px;
line-height: 1;
min-width: 46px;
padding: 4px 12px;
position: absolute;
text-align: center;
text-transform: capitalize;
z-index: 3
}
.product-label span {
display: block
}
.product-label:nth-child(2) {
top: 40px
}
.product-label:first-child {
top: 10px
}
.product-label.discount {
background-color: #a30000
}
.product-label.nonveg {
background-color: red
}
.product-caption .product-category a {
font-size: 14px;
line-height: 1;
color: #777;
text-transform: capitalize
}
.cart-hover {
bottom: 0;
left: 0;
right: 0;
position: absolute;
text-align: center;
opacity: 0;
visibility: hidden;
transition: .4s
}
.product-box:hover .cart-hover {
bottom: 0;
opacity: 1;
visibility: visible
}
.btn-cart {
width: 100%;
display: inline-block;
border-radius: 0;
border-color: transparent;
text-transform: capitalize;
background: #ff0000;
color: #fff;
padding: 10px 15px
}
.btn-cart:hover {
color: #fff;
background: #a30000
}
.button-group {
right: 15px;
top: 15px;
position: absolute
}
.product-box:hover .button-group a {
opacity: 1;
visibility: visible;
transform: scale(1)
}
.button-group a {
width: 38px;
height: 38px;
display: block;
font-size: 18px;
line-height: 42px;
color: #fff;
text-align: center;
border-radius: 50%;
margin-bottom: 10px;
background-color: #a30000;
transform: scale(.6);
transition: .4s;
opacity: 0;
visibility: hidden
}
/**************************************
** - 32 - top social
**************************************/
.navbar-area .top-social{
float: right;
padding: 0;
margin: 0 0 0 10px;
list-style-type: none;
}
.navbar-area .top-social li {
display: inline-block;
vertical-align: sub;
}
.navbar-area .top-social li a {
color:#a30000;
font-size: 25px;
width: 40px;
height: 40px;
line-height: 40px;
border-radius: 3px;
text-align: center;
display: block;
-webkit-transition: all 400ms ease-out;
transition: all 400ms ease-out;
margin-left: 10px;
}
.navbar-area .top-social li a:hover, .navbar-area .inspire-nav-top-bar .top-social li a:focus {
color: #fff;
transform: translateY(-5px);
box-shadow: 0px 10px 1em #ff0000;
background: #a30000;
border-radius: 30px;
}
/**************************************
** - 33 - hover menu
**************************************/
.main-navigation>nav>.main-menu {
display: flex;
align-items: center
}
.main-navigation>nav>.main-menu>.menu-item {
margin: 0 10px;
padding: 15px 0
}
.main-navigation>nav>.main-menu>.menu-item>a {
font-weight: 500;
font-size: 14px;
padding: 0 10px;
text-transform: uppercase
}
.main-navigation>nav>.main-menu>.menu-item>a:after {
position: absolute;
left: 0;
right: 0;
margin: auto;
top: 2.5em;
bottom: 0;
width: 20%;
height: 2px;
background-color: #a30000;
content: "";
z-index: 1;
opacity: 0;
transition: all .3s
}
.main-navigation>nav>.main-menu>.menu-item.active>a,
.main-navigation>nav>.main-menu>.menu-item:hover>a {
color: #a30000
}
.main-navigation>nav>.main-menu>.menu-item.active>a:after,
.main-navigation>nav>.main-menu>.menu-item:hover>a:after {
opacity: 1;
width: calc(100%)
}
.menu-item-has-children>a>.arrow:after {
display: inline-block;
margin-left: .55em;
content: "\e688";
font-family: Pe-icon-7-stroke;
font-weight: 900
}
.menu-item-has-children>.sub-menu {
position: absolute;
top: 100%;
left: 0;
right: 0;
transform: translateY(-10px);
border-bottom: 2px solid #a30000;
box-shadow: 0 2px 2px 1px rgba(0, 0, 0, .15);
background: #fff;
visibility: hidden;
opacity: 0;
transition: .3s;
width: 250px
}
.menu-item-has-children:hover>.sub-menu {
border-top: 1px solid rgba(67, 41, 163, .2);
opacity: 1;
visibility: visible;
z-index: 999;
transform: translateY(0);
transition: .3s
}
.menu-item-has-children.nav-postion:hover>.sub-menu {
top: 0;
transform: translateY(-100%)
}
.menu-item-has-children>.sub-menu>li.menu-item {
padding: 0 10px
}
.menu-item-has-children.nav-postion>.sub-menu>li.menu-item-has-children>.sub-menu {
top: inherit
}
.menu-item-has-children>.sub-menu>li.menu-item>a {
display: block;
padding: 10px;
font-size: 15px;
font-weight: 500;
border-bottom: 1px solid rgba(67, 41, 163, .2);
transition: .5s;
white-space: nowrap;
color: rgba(0, 0, 0, .8705882352941177)
}
.menu-item-has-children>.sub-menu>li.menu-item:last-child>a {
border: none
}
.menu-item-has-children>.sub-menu>li.menu-item:hover>a {
padding-left: 25px;
transition: .5s;
color: #a30000
}
.menu-item-has-children>.sub-menu>li.menu-item-has-children>a>.arrow {
position: absolute;
right: 10px;
transform: rotate(-90deg)
}
.menu-item-has-children>.sub-menu>li.menu-item-has-children>a>.arrow:after {
display: inline-block;
margin-left: 0;
content: "\e688";
font-family: Pe-icon-7-stroke;
font-weight: 900
}
.menu-item-has-children>.sub-menu>li.menu-item-has-children>.sub-menu {
left: 100%;
top: -3%
}
/**************************************
** - 33 - Destaques
**************************************/
.destaques h3{
padding: 10px;
}
.destaques p{
padding: 50px 40px 20px ;
}
.destaques .btn{
margin: 0px 40px 15px;
}
.destaques .col-md-6{
padding: 0;
}
@media (min-width: 991px) {
.destaques h3{
font-size:50px;
}
}
/**************************************
** - 31 - Serviços
**************************************/
.servicos a{
color: #fff;
}
.image-fit {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center
}
.mechanics-wrapper {
position: relative;
overflow: hidden;
margin-bottom: 30px;
border-radius: 4px;
}
.mechanics-wrapper .mechanics-box-content {
width: 100%;
max-width: 250px;
margin: 0 auto;
text-align: center;
padding: 30px 0
}
.mechanics-wrapper .mechanics-content-wrapper {
left: 0;
right: 0;
top: 50%;
position: absolute;
transform: translateY(-50%);
z-index: 2
}
.mechanics-wrapper:before {
width: 100%;
height: 100%;
background: rgba(0, 0, 0, .54);
transition: .3s;
opacity: .8;
cursor: pointer
}
.mechanics-wrapper .mechanics-box-content .mechanics-badge {
display: inline-block;
font-size: 14px;
font-weight: 700;
padding: 6px 13px;
margin-bottom: 22px;
border-radius: 4px;
color: #fff
}
.mechanics-wrapper .mechanics-box-content h5 a {
color: #fff;
}
.blog-item:hover .blog-item-img img,
.mechanics-wrapper:hover img {
transform: scale(1.2)
}
.blog-item .blog-item-img img,
.mechanics-wrapper img {
transition: transform 1s;
}
.mechanics-wrapper:hover:after {
bottom: 0;
top: 0;
}
.mechanics-wrapper:hover:before {
background-color: #ff0000;
left: 0;
right: 0;
}
.mechanics-wrapper:before {
bottom: 0;
content: "";
left: 0;
position: absolute;
right: 0;
top: 0;
transition: all .5s ease 0s;
z-index: 1;
}
.mechanics-wrapper:after {
bottom: 0;
content: "";
left: 0;
position: absolute;
right: 0;
top: 0;
transition: all .5s ease 0s;
z-index: 1
}
/**************************************
** - 33 - botões produtos
**************************************/
.product-shop-slide{
position: relative;
}
.owl-carousel .owl-nav button.owl-prev, .owl-carousel .owl-nav button.owl-next{
color: #fff;
font-size:30px;
border: solid 1px #fff;
background-color: #ff0000;
box-sizing: border-box;
margin: 0;
padding: 0;
width: 45px;
height: 45px;
}
.owl-carousel .owl-nav button.owl-prev:hover, .owl-carousel .owl-nav button.owl-next:hover{
background-color: #a30000;
transition:all .7s;
}
.product-shop-slide .owl-nav .owl-prev{
position:absolute;
top: 45%;
left: 0;
}
.product-shop-slide .owl-nav .owl-next{
position:absolute;
top: 45%;
right: 0;
}
/**************************************
** - 34 - banner
**************************************/
.carousel-item, .carousel-item img{height: 510px;}
.carousel-item img{overflow: hidden;object-fit: cover;width: 100%;}
.carousel-caption h1{color: #ff0000;}
.carousel-caption p{color: #fff;}
@media (max-width:761px) {.carousel{margin-top: 106px;}}
/*--- */
@media (max-width:1320px) {
.navbar-brand img {margin-top:10px !important;width:180px !important;}
.top-social {width:90px !important;}
.nav-link {font-size:13px !important;}
.top-social li a {margin-left:5px !important;width:20px !important;}
.top-social li a i {font-size:20px !important;}
.top-flag-1 {clear:both;width:20px !important;}
.top-flag-2 {width:20px !important;}
.top-flag-3 {width:20px !important;}
}