html {
scroll-behavior: smooth;
}
body{
/* background-color: #34568B; */
/* background-image: url("./images2/pexels-mudassir-ali-2680270.jpg"); */
background: white;
background-attachment: fixed;
background-size: cover;
align-items: center;
justify-content: center;
height: 100vh;
/* display:flex;
margin:0;
padding:0;
min-height: 100vh;
background: #444;
justify-content: center;
align-items: center;
font-family: arial; */
}
::-moz-selection { /* Code for Firefox */
color: #99BF39;
background: white;
}
::selection {
color: #99BF39;
background: white;
}
/* scroll to top button start */
#myBtn {
display: none;
position: fixed;
bottom: 20px;
right: 30px;
z-index: 99;
font-size: 18px;
border: none;
outline: none;
background-color: #476104;
color: white;
cursor: pointer;
padding: 15px;
border-radius: 100px 100px 100px 100px;
}
/* scroll to top button end */
.navbar-expand-lg .navbar-collapse{
justify-content: end;
}
.navbar-expand-lg hr{
color: #fff;
}
.navbar-expand-lg{
/* background-color: #34568B; */
background-color: transparent;
/* border: 1px solid white; */
/* border-radius: 15px; */
backdrop-filter:blur(30px);
margin-bottom: 30px;
box-shadow: 5px 10px 12px #3333331c;
}
.navbar-nav .nav-item .nav-link{
color: #476104;
font-size: 14px;
font-weight: 600;
outline: none !important;
}
.navbar-nav .nav-item .nav-link:hover{
color: white;
}
.navbar-expand-lg .navbar-nav li{
margin-right: 10px;
}
.nav-item:hover{
border-radius: 15px;
cursor: pointer;
/* color: black; */
background-color: #99BF39;
}
.navbar-nav{
height: 100%;
width: 100%;
display: flex;
align-items: center;
list-style: none;
padding: 0 100px;
justify-content: end;
padding: 0;
}
.navbar-nav .nav-item{
display: block;
height: 100%;
font-size: 16px;
position: relative;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
/* text-transform: uppercase; */
/* text-shadow: 0 0 15px #8e54e9; */
/* transition: all 300ms cubic-bezier(0.075, 0.82, 0.165, 1); */
text-align: center;
padding: 0 10px;
/* margin-right: 30px; */
}
.navbar-nav .nav-item:after,
.navbar-nav .nav-item:before {
content: "";
position: absolute;
display: block;
border: 0px solid transparent;
z-index: -1;
}
.navbar-nav .nav-item:after {
width: 0%;
height: 80%;
/* border-top: 2px solid #fff;
border-bottom: 2px solid #fff; */
transition: all 0.3s ease;
}
.navbar-nav .nav-item:before {
width: 120%;
height: 0%;
/* border-left: 2px solid #fff;
border-right: 2px solid #fff; */
transition: all 0.5s ease;
}
.navbar-nav .nav-item:hover::before {
height: 80%;
}
.navbar-nav .nav-item:hover::after {
width: 120%;
}
/* carousel start */
.home-demo .item {
background: #ff3f4d;
}
.home-demo h2 {
color: #FFF;
text-align: center;
padding: 5rem 0;
margin: 0;
font-style: italic;
font-weight: 300;
height: 300px;
}
/* carousel end */
/* BANNER ADDS WRAPPER CSS START */
.hero-banner-ads .banner-ads-wrapper {
height: 250px;
margin-bottom: 30px;
cursor: pointer;
}
/* .banner-ads-wrapper-v2:hover{
-moz-transform: rotate(2deg);
-webkit-transform: rotate(2deg);
-o-transform: rotate(2deg);
-ms-transform: rotate(2deg);
transform: rotate(2deg);
transform: 0.5s ease;
} */
.banner-ads-wrapper {
/* background: #fce3eb;
*/
border-radius: 16px;
padding: 46px 36px;
position: relative;
overflow: hidden;
}
.adsBoxOne{
/* zafeer changes http into https */
background-image: url('https://drive.google.com/uc?export=view&id=1TKKTcMnfhRbhG_R6yMbvwiMmcaMhSWCI');
background-size: cover;
background-repeat: no-repeat;
background-position: top right;
background-image: linear-gradient(rgba(0,0,0,0.75));
-moz-box-shadow: 0 0 10px rgb(43, 26, 26);
-webkit-box-shadow: 0 0 10px rgb(20, 12, 12);
box-shadow: 0 0 10px rgb(34, 25, 25);
}
.adsBoxOne:hover{
/* opacity: 0.3; */
background-image: linear-gradient(rgba(0,0,0,0.75));
-moz-box-shadow: 0 0 10px rgb(43, 26, 26);
-webkit-box-shadow: 0 0 10px rgb(20, 12, 12);
box-shadow: 0 0 10px rgb(34, 25, 25);
}
.banner-ads-wrapper .banner-ads-single-item {
position: relative;
z-index: 9;
}
.banner-ads-wrapper .banner-ads-single-item .banner-ads-subtitle {
font-size: 16px;
font-style: italic;
font-weight: 400;
line-height: 24px;
color: #eb5e28;
display: block;
margin-bottom: 9px;
}
.banner-ads-wrapper .banner-ads-single-item .banner-ads-title {
font-size: 20px;
font-weight: 600;
line-height: 30px;
color: #ffffff;
display: block;
margin-bottom: 0;
}
.banner-ads-wrapper .banner-ads-single-item .shop-btn {
margin-top: 17px;
}
.banner-ads-wrapper .banner-ads-single-item .shop-btn .btn {
font-size: 14px;
font-weight: 500;
line-height: 20px;
padding: 8px 16px;
}
.btn-primary {
background-color: #FAFA37;
color: black;
-webkit-box-shadow: 0px 1px 2px 0px #1018280d;
box-shadow: 0px 1px 2px 0px #1018280d;
border-radius: 8px;
border: none;
}
.btn-green {
background: #12b76a !important;
}
.hero-banner-ads .banner-ads-wrapper:last-of-type {
margin-bottom: 0;
}
.banner-ads-wrapper:nth-of-type(2) {
/* background-color: #ccdbda;
*/
}
.adsBoxTwo{
/* zafeer changes below http into https */
background-image: url('https://drive.google.com/uc?export=view&id=1gIE99xq0mBrfgYyIQ75hdMiE8mS_BJF5');
background-size: cover;
background-repeat: no-repeat;
background-position: top right;
background-image: linear-gradient(rgba(0,0,0,0.75));
-moz-box-shadow: 0 0 10px rgb(43, 26, 26);
-webkit-box-shadow: 0 0 10px rgb(20, 12, 12);
box-shadow: 0 0 10px rgb(34, 25, 25);
}
.adsBoxTwo:hover{
/* opacity: 0.3!important; */
background-image: linear-gradient(rgba(0,0,0,0.75));
-moz-box-shadow: 0 0 10px rgb(43, 26, 26);
-webkit-box-shadow: 0 0 10px rgb(20, 12, 12);
box-shadow: 0 0 10px rgb(34, 25, 25);
}
.btn-primary:focus, .btn-primary:hover, .btn-green:focus, .btn-green:hover {
background: #252522 !important;
}
.btn{
transition: 0.3s ease-in-out;
}
/* BANNER ADDS WRAPPER CSS END */
/* SLIDER CSS START */
.slider-section{
margin-bottom: 7em !important;
}
.swiper {
width: 100%;
height: 100%;
}
.swiper:hover{
}
.swiper-slide img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.swiper-slide{
border-radius: 16px;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
display: flex;
justify-content: flex-start;
align-items: center;
font-size: 18px;
cursor: pointer;
}
.banner-img-1{
background-image: url('https://drive.google.com/uc?export=view&id=18moUrfj31EY6K-4E-7WEITKqy1XwnmLh');
}
.banner-img-2{
/* zafeer changes below http into https */
background-image: url('https://drive.google.com/uc?export=view&id=1UhHr-up90xkFxDFRbcZTPony0AOx2Ni9');
}
.banner-img-3{
/* zafeer changes below http into https */
background-image: url('https://drive.google.com/uc?export=view&id=1UFUGNBIjTcmkMtEsNEnX-KMi4qw4LLov');
}
.single-slide-wrapper {
padding: 95px 63px 100px;
}
.hero-wrapper {
position: relative;
z-index: 9;
max-width: 400px;
}
.hero-wrapper .hero-subtitle {
font-size: 16px;
font-weight: 600;
color: #fff;
line-height: 24px;
text-transform: uppercase;
margin-bottom: 10px;
display: block;
}
.hero-wrapper .hero-title {
font-size: 50px;
font-weight: 700;
color: #fff;
line-height: 52.5px;
letter-spacing: -0.025em;
margin-bottom: 10px;
text-transform: capitalize;
}
.hero-wrapper .hero-content {
font-size: 18px;
line-height: 28px;
font-weight: 600;
color: #fff;
margin-bottom: 30px;
}
.hero-wrapper .hero-btn .btn {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background: #fff;
color: #eb5e28;
font-weight: 600;
padding: 14px 35px;
}
.hero-btn, .hero-content, .hero-title, .hero-subtitle{
text-align: left;
}
.banner-navigation .swiper-button-next {
margin-left: 18px;
}
.banner-navigation .swiper-button-next, .banner-navigation .swiper-button-prev {
top: auto;
bottom: 25px;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
-webkit-transition: all 300ms ease-in-out;
transition: all 300ms ease-in-out;
}
.swiper-button-next, .swiper-rtl .swiper-button-prev {
right: 10px;
}
.swiper-button-next, .swiper-button-prev {
position: absolute;
top: 50%;
width: calc(var(--swiper-navigation-size)/ 44 * 27);
height: var(--swiper-navigation-size);
margin-top: calc(0px - (var(--swiper-navigation-size)/ 2));
z-index: 10;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
color: var(--swiper-navigation-color,var(--swiper-theme-color));
}
.banner-navigation .swiper-button-next svg path, .banner-navigation .swiper-button-prev svg path {
stroke: #fff;
}
.banner-navigation .swiper-button-prev {
margin-left: -18px;
}
.swiper .swiper-notification {
position: absolute;
left: 0;
top: 0;
pointer-events: none;
opacity: 0;
z-index: -1000;
}
.hero-btn .btn-primary:hover{
background-color: #fff !important;
}
.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after {
content: 'next';
font-size: 0 !important;
}
.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after {
content: 'prev';
font-size: 0px !important;
}
.slider-section .col-md-8, .slider-section .col-md-4 {
padding: 0 18px !important;
}
.swiper {
margin-left: auto;
margin-right: auto;
position: relative;
overflow: hidden;
list-style: none;
padding: 0;
z-index: 1;
border-radius: 16px;
}
.swiper-wrapper {
position: relative;
width: 100%;
height: 100%;
z-index: 1;
display: flex;
/* transition-property: transform; */
box-sizing: content-box;
}
.swiper-fade .swiper-slide {
pointer-events: none;
/* transition-property: opacity; */
}
.swiper-backface-hidden .swiper-slide {
/* transform: translateZ(0);
-webkit-backface-visibility: hidden;
backface-visibility: hidden; */
}
.swiper-slide {
flex-shrink: 0;
width: 100%;
height: 100%;
position: relative;
/* transition-property: transform; */
}
/* .swiper-wrapper {
transition-duration: 500s !important;
transform: translate3d(376px, 0px, 0px);
} */
/* SLIDER CSS END */
.appollo-gallery img{
width: 100%;
height: 200px;
margin-bottom: 2em !important;
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);
-webkit-transition: .3s ease-in-out;
transition: .3s ease-in-out;
}
/* new card hover effect start*/
.appollo-gallery::before {
right: 0;
opacity:0.9;
top: 0;
}
.appollo-gallery::after {
bottom: 0;
opacity: 0.9;
left: 0;
}
.appollo-gallery::before, .appollo-gallery::after {
content: "";
background: white;
height: 0;
width: 0;
z-index: 1;
position: absolute;
-webkit-transition-duration: 1.3s !important;
-o-transition-duration: 1.3s;
transition-duration: 1.3s !important;
}
.appollo-gallery:hover::after, .appollo-gallery:hover::before {
height: 100%;
opacity: 0;
width: 100%;
}
/* new card hover effect end */
/* .card{
background-image: linear-gradient(rgba(0,0,0,0.75));
-moz-box-shadow: 0 0 10px rgb(43, 26, 26);
-webkit-box-shadow: 0 0 10px rgb(20, 12, 12);
box-shadow: 0 0 10px rgb(34, 25, 25);
} */
/* .appollo-gallery img:hover{
background-image: linear-gradient(rgba(0,0,0,0.75));
-moz-box-shadow: 0 0 10px rgb(43, 26, 26);
-webkit-box-shadow: 0 0 10px rgb(20, 12, 12);
box-shadow: 0 0 10px rgb(34, 25, 25);
} */
/* .appollo-gallery img {
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease;
} */
/* .appollo-gallery img:hover {
-webkit-transform: rotate(-10deg);
-moz-transform: rotate(-10deg);
-o-transform: rotate(-10deg);
-ms-transform: rotate(-10deg);
} */
/* .card{
box-shadow: 0 0 1rem 0 rgba(0, 0, 0, .2);
border-radius: 5px;
position: relative;
z-index: 5;
background: inherit;
overflow: hidden;
}
.card::before{
content: "";
position: absolute;
background: inherit;
z-index: -1;
top: 0;
left: 0;
right: 0;
bottom: 0;
box-shadow: inset 0 0 2000px rgba(255, 255, 255, .5);
filter: blur(2px);
margin: -20px;
} */
/* footer section start */
/* Footer css */
.element-btn .element-fill-btn {
background-color: #ff6600;
border: 0;
color: #fff;
padding: 13px 5px;
font-size: 16px;
font-weight: 900;
font-style: italic;
text-transform: uppercase;
width: 252px;
margin: 0 auto;
border-radius: 25px;
transition: all 0.3s ease-in-out;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
box-shadow: 0px 10px 50px -10px rgba(255, 10, 120, 1);
}
.fill-btn {
background-color: #ff6600;
border: 0;
color: #fff;
padding: 13px 5px;
font-size: 16px;
font-weight: 900;
font-style: italic;
text-transform: uppercase;
width: 252px;
margin: 0 auto;
border-radius: 25px;
position: absolute;
bottom: -25px;
left: 50%;
transform: translate(-50%, 0);
-webkit-transform: translate(-50%, 0);
-moz-transform: translate(-50%, 0);
-ms-transform: translate(-50%, 0);
transition: all 0.3s ease-in-out;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
}
.fill-btn:hover,
.element-btn .element-fill-btn:hover {
background-color: white;
box-shadow: 0px 10px 50px -10px rgb(32, 31, 31);
}
.footer {
position: relative;
background-color: white;
padding:50px 0px;
box-shadow: 26px 2px 26px 10px #888888;
}
.footerBg {
position: absolute;
top: 0;
bottom: 0;
opacity: 0.13;
background: url('http://placehold.it/1920x677') no-repeat top center;
background-size: cover;
width: 100%;
height: 100%;
}
.form-Box input[type="text"],
.form-Box input[type="email"],
.form-Box input[type="passowrd"],
.form-Box textarea {
width: 100%;
height: 50px;
border: 1px solid white;
border-radius: 25px;
background-color: transparent;
padding: 5px 25px;
margin-bottom: 20px;
font-size: 14px;
color: white;
font-style: italic;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
text-transform: uppercase;
}
.form-Box textarea {
height: 113px;
padding: 15px 25px;
resize: none;
}
.form-Box .b_effect:focus,
.subscribe form input:focus {
border-color: #ff6600;
}
.form-Box .fill-btn {
position: static;
transform: translate(0%, 0);
-webkit-transform: translate(0%, 0);
-moz-transform: translate(0%, 0);
-ms-transform: translate(0%, 0);
width: 184px;
}
.form-Box .fill-btn:hover,
.subscribe form .fill-btn:hover {
background-color: #f05907;
color: white;
/* box-shadow: 0px 10px 50px -10px rgb(255, 228, 2); */
}
.fTitle {
font-weight: 900;
color: #ffffff;
text-transform: uppercase;
font-style: italic;
margin-bottom: 20px;
}
.fTitle span {
color: #ff6600;
}
.contact-address ul li,
.contact-address ul li a {
color: white;
font-size: 16px;
font-style: italic;
margin-bottom: 15px;
line-height: 32px;
transition: all 0.3s ease-in-out;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
}
.contact-address {
padding: 0 15%;
}
.contact-address ul li i {
margin-right: 15px;
display: inline-block;
float: left;
line-height: 32px;
}
.contact-address ul li span {
display: table;
}
.contact-address ul li a:hover {
color: #ff6600;
}
.subscribe form {
position: relative;
display: inline-block;
width: 100%;
margin-bottom: 60px;
}
.subscribe form input {
width: 100%;
height: 50px;
border: 1px solid white;
border-radius: 25px;
background-color: transparent;
padding: 5px 215px 5px 25px;
font-size: 14px;
color: white;
font-style: italic;
}
.subscribe form .fill-btn {
bottom: auto;
top: 0;
right: 0;
left: auto;
transform: translate(0%, 0);
-webkit-transform: translate(0%, 0);
-moz-transform: translate(0%, 0);
-ms-transform: translate(0%, 0);
width: 209px;
}
.social-icons ul li {
display: inline-block;
float: left;
color: #fff;
text-align: center;
line-height: 43px;
position: relative;
width: 43px;
height: 43px;
margin-right: 28px;
}
.social-icons ul li a {
color: #fff;
position: relative;
display: inline-block;
width: 100%;
font-size: 16px;
}
.social-icons ul li:before {
content: "";
width: 43px;
height: 43px;
display: inline-block;
position: absolute;
border: 1px solid #ff6600;
transform: rotate(135deg);
-webkit-transform: rotate(135deg);
-moz-transform: rotate(135deg);
-o-transform: rotate(135deg);
transition: all 0.3s ease-in-out;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
}
.social-icons ul li:last-child {
margin: 0;
}
.social-icons ul li:hover:before {
background: #ff6600;
}
/* Copyright css */
.copyright {
padding: 51.5px 0;
text-align: center;
}
.copyright h6 {
font-size: 14px;
font-style: italic;
color: #737373;
}
.copyright h6 a {
color: #ff6600;
transition: all 0.3s ease-in-out;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
}
.copyright h6 a:hover {
color: #201f1f;
}
/* footer section end */
/* RESPONSIVE START */
/* @media (max-width: 2652px){
.container{
width: 100%!important;
}
} */
@media (max-width: 1280px){
.body{
/* padding-left: 100px;
padding-right: 100px; */
}
.navbar-expand-lg{
padding-right: 80px;
padding-left: 80px;
}
.navbar-collapse{
width: 50%;
justify-content: center;
}
.feature-section .col-md-3 {
width: 50%;
}
.container {
max-width: 90%;
}
.feature-section .col-md-3:nth-child(1), .feature-section .col-md-3:nth-child(2) {
margin-bottom: 2em;
}
}
@media (max-width: 767px){
.navbar-expand-lg{
width: 100%;
}
.hero-banner-ads .banner-ads-wrapper {
margin-top: 30px !important;
}
.feature-section .col-md-3 {
width: 100%;
padding: 0 18px;
}
.feature-section {
margin: 30px 0;
}
.feature-section .col-md-3:nth-child(3) {
margin-bottom: 30px;
}
.single-slide-wrapper{
padding-left: 36px;
}
}
@media (max-width: 580px){
.body{
padding-right: 0;
padding-left: 0;
}
.hero-wrapper .hero-title, section.main-heading h1{
font-size: 40px;
}
.mySwiper br{
display: none;
}
.navbar-expand-lg{
padding-right: 0;
padding-left: 0;
}
}
/* RESPONSIVE END */