@import url("https://fonts.googleapis.com/css?family=Poppins:200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i");
@import url("https://fonts.googleapis.com/css?family=Rubik:300,300i,400,400i,500,500i,700,700i,900,900i");

@import url(animate.css);
@import url(bootstrap.min.css);
@import url("bootstrap-select.min.css");
@import url("custom-animate.css");
@import url(font-awesome.min.css);
@import url("icomoon.css");
@import url("imp.css");
@import url(jquery.bootstrap-touchspin.css);
@import url("jquery.fancybox.min.css");
@import url(owl.css);
@import url(owl.theme.default.css);

@import url(../fonts/flaticon/flaticon.css);

/*** Revolution slider ***/
@import url(../plugins/revolution/css/settings.css);
@import url(../plugins/revolution/css/layers.css);.corner_whatsapp_btn
@import url(../plugins/revolution/css/navigation.css);

* {
   margin: 0px;
   padding: 0px;
   box-sizing: border-box;
   scroll-behavior: smooth;
}

:root {
   --first: #e9212e;
   --popp: "Poppins", sans-serif;
}

html,
body {
   height: 100%;
}
body {
   color: #444;
   font-size: 16px;
   line-height: 25px;
   font-weight: 400;
   font-family: "Rubik", sans-serif;
}
button:focus {
   outline: none;
}
button {
   cursor: pointer;
   border: none;
   background: transparent;
   padding: 0;
}
h1,
h2,
h3,
h4,
h5,
h6 {
   color: #3a3a3a;
   font-weight: 600;
   font-family: "Poppins", sans-serif;
   margin: 0;
}
h3 {
   color: #27282c;
   /* font-size: 20px; */
   line-height: 26px;
}

h5,
h6 {
   font-weight: 600;
}

a,
a:hover,
a:active,
a:focus {
   text-decoration: none;
   outline: none;
   border: none;
}

@media (min-width: 1200px) {
   .container {
      max-width: 1200px;
   }
}

.fix {
   position: relative;
   display: block;
   overflow: hidden;
}

img {
   max-width: 100%;
   height: auto;
}
i {
   font-style: normal;
}
ul,
li {
   list-style: none;
   margin: 0;
   padding: 0;
}
ol,
li {
   margin: 0;
   padding: 0;
}
.clr1 {
   color: #f36727;
}
.bgclr1 {
   background: #f36727;
}

.secpd1 {
   padding: 100px 0;
}
.secpd2 {
   padding: 100px 0 60px;
}
.secpd3 {
   padding: 100px 0 70px;
}

.btn-one {
   position: relative;
   display: inline-block;
   background: #e9212e;
   color: #ffffff;
   font-size: 15px;
   line-height: 54px;
   font-weight: 500;
   text-transform: capitalize;
   font-family: "Rubik", sans-serif;
   padding: 0 30px 0;
   letter-spacing: 0.6px;
   transition: all 500ms ease;
}
.btn-one img {
   position: relative;
   display: inline-block;
   padding-left: 10px;
   width: auto;
}
.btn-one span:before {
   font-size: 26px;
   line-height: 14px;
   display: inline-block;
   padding-left: 10px;
   position: relative;
   top: 4px;
}
.btn-one:hover {
   color: #ffffff;
   background: #27282c;
}

.btn-two {
   color: #27282c;
   font-size: 15px;
   line-height: 20px;
   font-weight: 500;
   text-transform: capitalize;
   font-family: "Rubik", sans-serif;
   transition: all 500ms ease;
}
.btn-two span:before {
   position: relative;
   top: 5px;
   font-size: 26px;
   line-height: 14px;
   display: inline-block;
   padding-left: 10px;
}
.btn-two:hover {
   color: #e9212e;
}

.btn-three {
   position: relative;
   display: inline-block;
   background: #ffffff;
   color: #203260;
   font-size: 14px;
   line-height: 62px;
   font-weight: 700;
   height: 60px;
   text-transform: uppercase;
   font-family: "Roboto", sans-serif;
   padding: 0 30px 0;
   border-radius: 5px;
   transition: all 500ms ease;
}
.btn-three span:before {
   position: relative;
   display: inline-block;
   top: 4px;
   padding-left: 9px;
   font-size: 20px;
   font-weight: 400;
}
.btn-three:hover {
   color: #3aa40c;
}

.sec-title {
   position: relative;
   display: block;
   padding-bottom: 40px;
}
.sec-title.max-width {
   max-width: 650px;
   margin: -5px auto 0;
}
.sec-title.with-text {
   padding-bottom: 52px;
}

.sec-title p {
   color: #e9212e;
   font-size: 14px;
   line-height: 20px;
   font-weight: 600;
   text-transform: uppercase;
   margin: 0 0 7px;
   font-family: "Poppins", sans-serif;
}
.sec-title .title {
   position: relative;
   display: block;
   color: #27282c;
   font-size: 36px;
   line-height: 44px;
   font-weight: 600;
   /* text-transform: uppercase; */
   font-family: "Poppins", sans-serif;
}
.sec-title .title.clr-white {
   color: #ffffff;
}
.sec-title .title span {
   font-weight: 400;
}
.sec-title .bottom-text {
   color: #7c7e84;
   font-size: 17px;
   line-height: 27px;
   font-weight: 400;
   text-transform: none;
   margin: 13px 0 0;
   font-family: "Rubik", sans-serif;
}

.parallax-bg-one {
   background-attachment: fixed;
   background-position: center top;
   background-repeat: no-repeat;
   background-size: cover;
   position: relative;
   z-index: 1;
}
.parallax-bg-one::before {
   background: rgba(18, 32, 0, 0.9) none repeat scroll 0 0;
   content: "";
   height: 100%;
   left: 0;
   position: absolute;
   top: 0;
   width: 100%;
   z-index: -1;
}
.parallax-bg-two {
   background-attachment: fixed;
   background-position: center top;
   background-repeat: no-repeat;
   background-size: cover;
   position: relative;
   z-index: 1;
}
.parallax-bg-two::before {
   background: rgba(9, 23, 33, 0.9) none repeat scroll 0 0;
   content: "";
   height: 100%;
   left: 0;
   position: absolute;
   top: 0;
   width: 100%;
   z-index: -1;
}

.flex-box {
   display: flex;
   justify-content: center;
   flex-direction: row;
   flex-wrap: wrap;
}
.flex-box-two {
   display: flex;
   justify-content: space-between;
   flex-direction: row;
   flex-wrap: wrap;
   align-items: center;
}
.flex-box-three {
   display: flex;
   justify-content: space-between;
   flex-direction: row;
   flex-wrap: wrap;
   align-items: center;
}
.flex-box-four {
   display: flex;
   justify-content: center;
   flex-direction: row;
   flex-wrap: wrap;
   align-items: center;
}
.flex-box-five {
   display: flex;
   justify-content: space-between;
   flex-direction: row;
   flex-wrap: wrap;
   align-items: center;
}

.owl-nav-style-one {
}
.owl-nav-style-one .owl-controls {
}
.owl-nav-style-one.owl-theme .owl-nav [class*="owl-"] {
   background: #ffffff none repeat scroll 0 0;
   border-radius: 50%;
   color: #909090;
   font-size: 24px;
   font-weight: 700;
   height: 50px;
   line-height: 46px;
   margin: 0 0 0 0px;
   padding: 0;
   width: 50px;
   border: 1px solid #f3f3f3;
   transition: all 700ms ease 0s;
}
.owl-nav-style-one.owl-theme .owl-nav .owl-next {
   margin-left: 10px;
}
.owl-nav-style-one.owl-theme .owl-nav [class*="owl-"]:hover {
   border-color: #172272;
   color: #172272;
}

.owl-nav-style-two {
}
.owl-nav-style-two .owl-controls {
}
.owl-nav-style-two.owl-theme .owl-nav [class*="owl-"] {
   background: #fff none repeat scroll 0 0;
   border-radius: 0%;
   color: #3740b0;
   font-size: 24px;
   font-weight: 700;
   height: 50px;
   line-height: 50px;
   margin: 0 0 0 0px;
   padding: 0;
   width: 50px;
   transition: all 700ms ease 0s;
}
.owl-nav-style-two.owl-theme .owl-nav .owl-next {
   margin-left: 0px;
}
.owl-nav-style-two.owl-theme .owl-nav [class*="owl-"]:hover {
   color: #ffffff;
   background: #3740b0;
}

.accordion-box {
   position: relative;
   display: block;
   overflow: hidden;
}
.accordion-box .accordion {
   position: relative;
   display: block;
   margin-bottom: 20px;
}
.accordion-box .accordion .accord-btn {
   position: relative;
   display: block;
   cursor: pointer;
   background: #ffffff;
   padding-left: 40px;
   padding-right: 70px;
   padding-top: 22px;
   padding-bottom: 22px;
   -webkit-box-shadow: 0px 3px 5px 2px #ededed;
   box-shadow: 0px 3px 5px 2px #ededed;
   transition: all 500ms ease;
}
.accordion-box .accordion .accord-btn h4 {
   color: #27282c;
   font-size: 18px;
   line-height: 26px;
   font-weight: 600;
   transition: all 500ms ease;
}
.accordion-box .accordion .accord-btn::after {
   font-family: "Flaticon";
   position: absolute;
   top: 22px;
   right: 40px;
   color: #b4b4b4;
   content: "\f10d";
   font-size: 25px;
   line-height: 25px;
   font-weight: 300;
   transition: all 500ms ease 0s;
}
.accordion-box .accordion .accord-btn.active {
   background: #27282c;
   transition: all 500ms ease;
}
.accordion-box .accordion .accord-btn.active h4 {
   color: #ffffff;
}
.accordion-box .accordion .accord-btn.active:after {
   color: #ffffff;
}
.accordion-box .accordion .accord-content {
   position: relative;
   display: block;
   padding-top: 29px;
   padding-bottom: 7px;
   padding-left: 0px;
   padding-right: 40px;
   display: none;
}
.accordion-box .accordion .accord-content.collapsed {
   display: block;
}
.accordion-box .accordion .accord-content p {
   margin: 0;
}

.boxed_wrapper {
   background: #fff none repeat scroll 0 0;
   position: relative;
   margin: 0 auto;
   width: 100%;
   min-width: 320px;
   min-height: 400px;
   overflow: hidden;
}

/*________________Preloader_______________ */
.preloader {
   position: fixed;
   left: 0px;
   top: 0px;
   width: 100%;
   height: 100%;
   z-index: 999999999999999999;
   background-color: #ffffff;
   background-position: center center;
   background-repeat: no-repeat;
   background-image: url(../images/icon/preloader.gif);
}
.preloader.style-two {
   background-image: url(../images/home-pages/preloader-2.html);
}
.preloader.style-three {
   background-image: url(../images/home-pages/preloader-3.html);
}
.preloader.style-four {
   background-image: url(../images/home-pages/preloader-4.html);
}
.preloader.style-five {
   background-image: url(../images/home-pages/preloader-5.html);
}

/* scroll to top styles */
.scroll-to-top {
   position: fixed;
   right: 20px;
   bottom: 30px;
   width: 55px;
   height: 55px;
   background: #e9212e;
   border: 2px solid #e9212e;
   border-radius: 0%;
   color: #ffffff;
   font-size: 25px;
   line-height: 50px;
   font-weight: 400;
   cursor: pointer;
   display: none;
   text-align: center;
   transition: all 500ms ease 0s;
   z-index: 99999999999;
   box-shadow: 0px 5px 10px -10px rgba(27, 27, 27, 1);
}
.scroll-to-top:hover {
   opacity: 0.5;
}

.scroll-to-top-style2 {
   position: fixed;
   display: none;
   bottom: 25px;
   right: 15px;
   background: #e9212e;
   width: 45px;
   height: 45px;
   color: #ffffff;
   font-size: 25px;
   line-height: 40px;
   font-weight: normal;
   cursor: pointer;
   border: 2px solid #e9212e;
   border-radius: 50%;
   text-align: center;
   transition: all 500ms ease 0s;
   z-index: 9999;
   box-shadow: 0px 8px 23px -6px rgba(27, 27, 27, 1);
}
.scroll-to-top-style2:hover {
   opacity: 0.5;
}

.corner_whatsapp_btn {
   position: fixed;
   top: 42%;
   right: 15px;
   background: #25d366;
   width: 70px;
   height: 70px;
   color: #ffffff;
   font-size: 25px;
   line-height: 70px;
   font-weight: normal;
   cursor: pointer;
   border: 2px solid #25d366;
   border-radius: 50%;
   text-align: center;
   transition: all 500ms ease 0s;
   z-index: 9999;
   box-shadow: 0px 8px 23px -6px rgba(27, 27, 27, 1);

   outline: 1px solid #f00;
   outline-offset: 12px;
}

.corner_whatsapp_btn::before {
   content: "";
   position: absolute;
   width: 100%;
   height: 100%;
   left: 0;
   top: 0;
   border-radius: 50%;
   background-color: #25d366;
   animation: scale_out 3s infinite;
   z-index: -1;
}
@keyframes scale_out {
   100% {
      scale: 1.5;
      opacity: 0.3;
   }
}

/* Form validation styles */
input:focus,
textarea:focus,
select:focus {
   border-color: #43c3ea;
   outline: none;
}

#contact-form input[type="text"].error {
   border-color: red;
}
#contact-form input[type="email"].error {
   border-color: red;
}
#contact-form select.error {
   border-color: red;
}
#contact-form textarea.error {
   border-color: red;
}

/* Post pagination styles */
.post-pagination {
   position: relative;
   display: block;
}
.post-pagination.martop20 {
   margin-top: 20px;
}
.post-pagination li {
   display: inline-block;
   margin: 0 3px;
}
.post-pagination li a {
   position: relative;
   display: block;
   background: #ffffff;
   border-radius: 0px;
   border: 1px solid #ededed;
   color: #2f2f2f;
   font-size: 18px;
   font-weight: 600;
   height: 50px;
   width: 50px;
   padding: 11px 0;
   transition: all 500ms ease 0s;
   font-family: "Poppins", sans-serif;
}
.post-pagination li a i {
   position: relative;
   font-size: 20px;
}
.post-pagination li.active a,
.post-pagination li:hover a {
   color: #fff;
   background: #e9212e;
   border: 1px solid #e9212e;
}

/* Post pagination styles 2 */
.post-pagination2 {
   display: block;
   margin-top: 20px;
}
.post-pagination2 li {
   display: inline-block;
   margin: 0 3px;
}
.post-pagination2 li a {
   position: relative;
   display: block;
   color: #222222;
   font-size: 18px;
   font-weight: 600;
   height: 32px;
   width: 32px;
   line-height: 32px;
   text-align: center;
   transition: all 500ms ease 0s;
   font-family: "Poppins", sans-serif;
   border-radius: 50%;
}
.post-pagination2 li.active a,
.post-pagination2 li:hover a {
   background: #f36727;
   color: #ffffff;
}
.post-pagination2 li a.left {
   width: auto;
   height: auto;
   display: block;
   color: #868298;
   padding-right: 10px;
   transition: all 500ms ease;
}
.post-pagination2 li:hover a.left {
   background: none;
}
.post-pagination2 li a.left i {
   position: relative;
   top: 1px;
   display: inline-block;
   padding-right: 8px;
   font-size: 21px;
}
.post-pagination2 li a.left:hover {
   color: #f36727;
}

.post-pagination2 li a.right {
   width: auto;
   height: auto;
   display: block;
   color: #868298;
   padding-left: 10px;
   transition: all 500ms ease;
}
.post-pagination2 li a.right:hover {
   color: #f36727;
}
.post-pagination2 li:hover a.right {
   background: none;
}
.post-pagination2 li a.right i {
   position: relative;
   top: 1px;
   display: inline-block;
   padding-left: 8px;
   font-size: 21px;
}

/* Overlay styles */
.overlay-style-one {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: rgba(233, 33, 48, 0.85);
   transition: all 700ms ease 100ms;
   opacity: 0;
   z-index: 2;
}
.overlay-style-one .box {
   display: table;
   height: 100%;
   width: 100%;
}
.overlay-style-one .box .content {
   display: table-cell;
   text-align: center;
   vertical-align: middle;
}

.overlay-style-two {
   position: absolute;
   left: 0px;
   bottom: 0px;
   right: 0px;
   top: 0px;
   z-index: 2;
   opacity: 0;
   transition: all 900ms ease;
}
.overlay-style-two:before {
   position: absolute;
   content: "";
   top: 0px;
   left: 0px;
   width: 100%;
   height: 50%;
   display: block;
   opacity: 0;
   text-align: center;
   transform: perspective(400px) rotateX(-90deg);
   transform-origin: top;
   transition: all 0.5s;
   background-color: rgba(0, 0, 0, 0.8);
}
.overlay-style-two:after {
   position: absolute;
   content: "";
   left: 0px;
   bottom: 0px;
   width: 100%;
   height: 50%;
   display: block;
   opacity: 0;
   text-align: center;
   transform: perspective(400px) rotateX(90deg);
   transform-origin: bottom;
   transition: all 0.5s;
   background-color: rgba(0, 0, 0, 0.8);
}

.review-box {
   position: relative;
   display: block;
   overflow: hidden;
   line-height: 16px;
}
.review-box ul {
   display: block;
   overflow: hidden;
}
.review-box ul li {
   display: inline-block;
   float: left;
   margin-right: 4px;
}
.review-box ul li:last-child {
   margin-right: 0px;
}
.review-box ul li i {
   font-size: 16px;
   color: #e9212e;
}

.sociallinks-style-one {
}
.sociallinks-style-one li {
   display: inline-block;
   float: left;
   margin-right: 20px;
}
.sociallinks-style-one li:last-child {
   margin-right: 0px;
}
.sociallinks-style-one li a i {
   color: #9491a2;
   font-size: 15px;
   font-weight: 400;
   transition: all 500ms ease;
}
.sociallinks-style-one li a:hover i {
   color: #39345a;
}
.sociallinks-style-two {
   overflow: hidden;
}
.sociallinks-style-two li {
   display: inline-block;
   float: left;
   margin-right: 20px;
}
.sociallinks-style-two li:last-child {
   margin-right: 0px;
}
.sociallinks-style-two li a i {
   position: relative;
   display: block;
   width: 50px;
   height: 50px;
   background: #203260;
   border: 1px solid #31426c;
   border-radius: 50%;
   color: #ffffff;
   font-size: 14px;
   line-height: 48px;
   text-align: center;
   transition: all 500ms ease 0s;
}
.sociallinks-style-two li a:hover i {
   color: #3398fd;
   transform: rotate(360deg);
}

/* Update header Style */
@keyframes menu_sticky {
   0% {
      margin-top: -90px;
   }
   50% {
      margin-top: -74px;
   }
   100% {
      margin-top: 0;
   }
}

/*==============================================
    Top Bar Style1 Css
===============================================*/
.top-bar-style1 {
   position: relative;
   display: block;
   background: #26272b;
   padding: 19px 0 62px;
}
.top-style1 {
   position: relative;
   display: block;
   text-align: center;
}
.top-style1 p {
   margin: 0;
}
.top-style1 p a {
   color: #ffffff;
   transition: all 300ms ease 100ms;
}
.top-style1 p a:hover {
   color: #828282;
}

/*==============================================
    Main Header Css        
===============================================*/
.main-header {
   position: relative;
   display: block;
   z-index: 999;
}
.header-upper-style1 {
   position: relative;
   display: block;
   /* background: #f6f6f6; */
}
.header-upper-style1.fixed-header .inner-container {
   position: fixed;
   top: 0px;
   left: 0;
   right: 0;
   width: 100%;
   max-width: 1170px;
   margin: 0 auto;
   box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
   transition: all 900ms ease 100ms;
   z-index: 99999;
}

.header-upper-style1.fixed-header .logo-box-style1 {
   margin: 0px 0;
   transition: all 500ms ease 100ms;

   animation: none;
}
.header-upper-style1.fixed-header .main-menu .navigation > li > a {
   padding: 29px 0px 27px;
   transition: all 500ms ease 100ms;
}
.header-upper-style1.fixed-header .outer-search-box {
   padding: 10px 0;
   transition: all 500ms ease 100ms;
}
.header-upper-style1.fixed-header .cart-box {
   margin: 10px 0;
   transition: all 500ms ease 100ms;
}

.header-upper-style1 .inner-container {
   position: relative;
   display: block;
   padding: 0 40px;
   margin-top: -60px;
   background: #ffffff;
   border-radius: 10px;
   -webkit-box-shadow: 0px 4px 11px -1px #ececec;
   box-shadow: 0px 4px 11px -1px #ececec;
   z-index: 999;
}
/* .inner-container .nav_content {
   display: flex;
   justify-content: space-between;
   align-items: center;
} */

.logo-box-style1 {
   position: relative;
   display: block;
   margin: 0;
   margin-left: 25px;
   transition: 0.5s;
}

.logo-box-style1 a {
   display: inline-block;
}
.logo-box-style1 a img {
   height: 86px;
}

.nav_mid {
   display: none;
   position: absolute;
   left: 50%;
   top: 50%;
   transform: translate(-50%, -50%);
}

.nav_mid a {
   display: inline-block;
   width: 40px;
   height: 40px;
   /* border: 1px solid #ddd; */
   box-shadow: 0px 0px 14px #ddd9;
   border-radius: 50%;
   line-height: 50px;
   text-align: center;
   margin-left: 10px;
}

.nav_mid .fa {
   font-size: 24px;
}
.nav_mid .fa-whatsapp {
   color: #25d366;
}

.main-menu-box {
   position: relative;
   display: block;
}

.main-menu {
   position: relative;
   display: inline-block;
   float: left;
}
.main-menu .navbar-collapse {
   padding: 0px;
}
.main-menu .navigation {
   position: relative;
}
.main-menu .navigation > li {
   position: relative;
   display: inline-block;
   float: left;
   margin-right: 35px;
}
.main-menu .navigation > li:last-child {
   margin-right: 0;
}
.main-menu .navigation > li > a {
   position: relative;
   display: block;
   color: #27282c;
   font-size: 14px;
   line-height: 14px;
   font-weight: 500;
   text-transform: uppercase;
   opacity: 1;
   padding: 39px 0px 37px;
   transition: all 300ms ease;
   font-family: "Rubik", sans-serif;
}
.main-menu .navigation > li:hover > a,
.main-menu .navigation > li.current > a {
   color: #e9212e;
}

.main-menu .navigation > li > ul {
   position: absolute;
   left: 0px;
   top: 130%;
   width: 270px;
   background: transparent;
   padding: 10px 0px 0;
   visibility: hidden;
   opacity: 0;
   display: block;
   border-radius: 0px;
   transition: all 500ms ease;
   z-index: 100;
}
.main-menu .navigation > li > ul:before {
   position: absolute;
   top: 10px;
   left: 0;
   bottom: 0;
   width: 100%;
   background: #ffffff;
   content: "";
   z-index: -1;
}
.main-menu .navigation > li:hover > ul {
   top: 76%;
   padding: 0;
   opacity: 1;
   visibility: visible;
   box-shadow: 0px 2px 12px #ddd;
}
.main-menu .navigation > li > ul > li {
   position: relative;
   display: block;
   float: none;
   margin: 0;
   padding: 0;
   width: 100%;
   transition: all 500ms ease;
   z-index: 1;
}
.main-menu .navigation > li > ul > li > a {
   position: relative;
   display: block;
   color: #828282;
   font-size: 15px;
   line-height: 20px;
   font-weight: 400;
   border-bottom: 1px solid #e2e8f0;
   text-transform: capitalize;
   transition: all 500ms ease 0s;
   padding: 16px 30px 15px;
   padding-right: 0;
   font-family: "Rubik", sans-serif;
}
.main-menu .navigation > li > ul > li:last-child a {
   border-bottom: none;
}
.main-menu .navigation > li > ul > li > a:after {
   position: absolute;
   top: 0;
   left: 30px;
   bottom: 0;
   content: "";
   background: url(../images/icon/dropdown-menu-arrow.png);
   width: 26px;
   height: 11px;
   opacity: 0;
   transform: scale(0);
   transition: all 500ms ease;
   margin: 20px 0;
}
.main-menu .navigation > li > ul > li:hover a:after {
   opacity: 1;
   transform: scale(1);
}
.main-menu .navigation > li > ul > li:hover > a {
   color: #e9212e;
   padding-left: 70px;
}

.main-menu .navigation > li > ul > li > ul {
   position: absolute;
   left: 100%;
   top: 20px;
   width: 270px;
   margin-left: 0px;
   visibility: hidden;
   opacity: 0;
   background: transparent;
   z-index: 100;
   box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
   transition: all 200ms ease;
}
.main-menu .navigation > li > ul > li > ul:before {
   position: absolute;
   left: 0px;
   bottom: 0;
   width: 100%;
   height: 100%;
   background: #ffffff;
   content: "";
   z-index: -1;
   border-radius: 0px;
}
.main-menu .navigation > li > ul > li:hover > ul {
   visibility: visible;
   opacity: 1;
   top: 0px;
}
.main-menu .navigation > li > ul > li > ul > li {
   position: relative;
   display: block;
   float: none;
   margin: 0;
   padding: 0;
   width: 100%;
   transition: all 500ms ease;
}
.main-menu .navigation > li > ul > li > ul > li a {
   position: relative;
   display: block;
   color: #828282;
   font-size: 15px;
   line-height: 20px;
   font-weight: 400;
   border-bottom: 1px solid #e2e8f0 !important;
   text-transform: capitalize;
   transition: all 500ms ease 0s;
   padding: 16px 30px 15px;
   padding-right: 0;
   font-family: "Rubik", sans-serif;
}
.main-menu .navigation > li > ul > li > ul > li:last-child a {
   border-bottom: 0px !important;
}
.main-menu .navigation > li > ul > li > ul > li a:before {
   position: absolute;
   top: 0;
   left: 30px;
   bottom: 0;
   content: "";
   background: url(../images/icon/dropdown-menu-arrow.png);
   width: 26px;
   height: 11px;
   opacity: 0;
   transform: scale(0);
   transition: all 500ms ease;
   margin: 20px 0;
}
.main-menu .navigation > li > ul > li > ul > li:hover a:before {
   opacity: 1;
   transform: scale(1) !important;
}
.main-menu .navigation > li > ul > li > ul > li:hover > a {
   color: #e9212e;
   padding-left: 70px;
}

/*
.main-menu .navigation li ul li.dropdown{
    position: relative;
    display: block;
    width: 100%;
}
.main-menu .navigation li ul li.dropdown:after{
    position: absolute;
    font-family: 'FontAwesome';
    content: "\f105";
    font-size: 18px;
    line-height: 30px; 
    display: block;
    top: 0;
    bottom: 0;
    right: 30px;
    margin: 11px 0;
    color: #8d8d8d;
}
**/
.main-menu .navbar-collapse > ul li.dropdown .dropdown-btn {
   position: absolute;
   top: 10px;
   right: 20px;
   width: 16px;
   height: 16px;
   border: 2px solid #ffffff;
   /* background: url(../images/icon/submenu-icon.png) center center no-repeat; */
   background-size: 20px;
   cursor: pointer;
   z-index: 5;
   display: none;
   border-top: none;
   border-left: none;
   rotate: 45deg;
}

/*** 
=====================================================
	Main Slider style
=====================================================
***/

.main-slider ul li .tp-caption {
   z-index: 5;
   margin-left: 100px;
}
.main-slider .tp-dottedoverlay {
   background: none !important;
}
.main-slider .tparrows {
   top: 40% !important;
}

.main-slider .slide-content {
   position: relative;
   display: block;
}

.main-slider .slide-content .btn-box a.project-view-button {
   position: relative;
   display: inline-block;
   margin-left: 35px;
   color: #ffffff;
   font-size: 15px;
   line-height: 56px;
   font-weight: 500;
   font-family: "Rubik", sans-serif;
   transition: all 500ms ease;
}
.main-slider .slide-content .btn-box a.project-view-button:hover {
   color: #e9212e;
}
.main-slider .slide-content .btn-box a.project-view-button:before {
   position: absolute;
   left: 0;
   bottom: 16px;
   right: 0;
   height: 2px;
   background: #ffffff;
   content: "";
}

/*** 
=====================================================
	Main Slider Style2 style
=====================================================
***/
.main-slider.style2 {
   position: relative;
   display: block;
   z-index: 10;
   margin-top: -30px;
}
.main-slider.style2 .slide-content .big-title {
   position: relative;
   color: #ffffff;
   font-size: 42px;
   line-height: 1.1em;
   font-weight: 500;
   /* text-transform: uppercase; */
   font-family: "Rubik", sans-serif;
}
.slide-content .big-title.dark_big_title {
   color: #000 !important;
}
.main-slider.style2 .slide-content .text {
   position: relative;
   display: block;
   color: #ffffff;
   font-size: 18px;
   line-height: 1.6em;
   font-weight: 400;
   letter-spacing: normal;
   text-transform: none;
   font-family: "Rubik", sans-serif;
}
.main-slider.style2 .slide-content .text.text_dark {
   color: #222;
}
.main-slider.style2 .slide-content .btn-box a.play-button {
   width: 70px;
}
.main-slider.style2 .btn-box a.play-button,
.main-slider.style2 .btn-box a.slide-style2-button {
   display: table-cell;
   vertical-align: middle;
}

.main-slider.style2 .btn-box a.hero_btn {
   position: relative;
   display: inline-block;

   border: 1px solid #222;
   border-radius: 10px;
   padding: 10px 25px;
   line-height: 30px;
   margin-left: 30px;
   color: #000;
   font-size: 15px;
   font-weight: 500;
   font-family: var(--popp);
   letter-spacing: 0.6px;
   transition: all 500ms ease;
}

.main-slider.style2 .btn-box a.hero_btn:hover {
   background-color: var(--first);
}

.main-slider.style2 .slide-content .btn-box a.play-button {
   position: relative;
   display: inline-block;
   width: 70px;
   height: 70px;
   border-radius: 50%;
   background: #e9212e;
   text-align: center;
}
.main-slider.style2 .slide-content .btn-box a.play-button span:before {
   position: relative;
   display: block;
   color: #ffffff;
   font-size: 30px;
   line-height: 70px;
}
.main-slider.style2 .btn-box a.slide-style2-button {
   position: relative;
   display: inline-block;
   margin-left: 25px;
   color: #ffffff;
   font-size: 15px;
   line-height: 70px;
   font-weight: 500;
   font-family: "Rubik", sans-serif;
   transition: all 500ms ease;
}
.main-slider.style2 .btn-box a.slide-style2-button:before {
   position: absolute;
   left: 0;
   bottom: 25px;
   right: 0;
   height: 2px;
   background: #ffffff;
   content: "";
}

.main-slider.style2 .tp-bullets {
   position: absolute;
   top: 50% !important;
   right: 20px !important;
   opacity: 1 !important;
   display: block !important;
   text-align: center;
   width: auto !important;
   text-align: right;
   left: auto !important;
   transform: none !important;
}
.main-slider.style2 .hermes .tp-bullet {
   position: relative !important;
   display: block !important;
   right: 0 !important;
   margin: 10px 0 !important;
   left: auto !important;
   top: auto !important;
   width: 14px;
   height: 14px;
}
.main-slider.style2 .hermes .tp-bullet:after {
   position: absolute;
   content: " ";
   bottom: 0;
   height: 0;
   left: 0;
   width: 100%;
   background-color: #fff;
   box-shadow: 0 0 1px #fff;
   -webkit-transition: height 0.3s ease;
   transition: height 0.3s ease;
}
.tp-bullet.selected,
.tp-bullet:hover {
   background: var(--first);
}
/*** 
=============================================
    About Area style      
=============================================
***/
.about-area {
   position: relative;
   display: block;
   padding-top: 60px;
   padding-bottom: 70px;
}
.about-image-box {
   position: relative;
   display: block;
   max-width: 470px;
   width: 100%;
   height: 80%;
   background: #f6f6f6;
   padding-top: 50px;
   padding-left: 60px;
   border-radius: 25px 0 0 0;
}
.about-image-box:before {
   position: absolute;
   top: 0;
   right: 0;
   width: 60px;
   height: 100%;
   background: #ffffff;
   content: "";
   z-index: 1;
}
.about-image-box .inner-box {
   position: relative;
   display: block;
   z-index: 2;
   border-radius: 10px;
   overflow: hidden;
   border: 1px solid #ddd;
}

.about-image-box .inner-box .overlay {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
}
.about-image-box .inner-box .overlay .box {
   display: table;
   width: 100%;
   height: 100%;
}
.about-image-box .inner-box .overlay .box .icon {
   display: table-cell;
   vertical-align: middle;
   text-align: center;
}
.about-image-box .inner-box .overlay .box .icon img {
   width: auto;
   border-radius: 50%;
   max-height: 160px;
   box-shadow: 0px 0px 10px #eee;
   animation: 15s rotate_logo linear infinite;
}

.about-image-box .text-box {
   position: relative;
   display: block;
   padding-top: 33px;
   padding-bottom: 52px;
   padding-right: 20px;
   margin-right: 60px;
   z-index: 1;
}
.about-image-box .text-box:before {
   position: absolute;
   right: 40px;
   bottom: 30px;
   font-family: "icomoon";
   content: "\e939";
   color: #ebebeb;
   font-size: 70px;
   line-height: 70px;
   transform: perspective(1200px) rotateX(180deg) translateZ(0px);
   z-index: -1;
}
.about-image-box .text-box p {
   color: #828282;
   font-size: 20px;
   line-height: 30px;
   margin: 0 0 17px;
}
.about-image-box .text-box h3 {
   color: #3a3a3a;
   font-size: 18px;
   font-weight: 600;
}
.about-image-box .text-box h3 span {
   color: #e9212e;
   font-size: 15px;
   font-weight: 400;
   font-family: "Rubik", sans-serif;
}

.about-text {
   position: relative;
   display: block;
   padding-left: 50px;
}
.about-text .sec-title {
   padding-bottom: 25px;
}
.about-text .inner-content {
   position: relative;
   display: block;
}
.about-text .inner-content .text {
   display: block;
   padding-bottom: 26px;
   font-family: var(--popp);
}

.about-carousel-box {
   position: relative;
   display: block;
   background: #e9212e;
   padding: 30px 25px 20px;
   border-radius: 15px;
   max-width: 520px;
   width: 100%;
   z-index: 1;
}
.about-carousel-box:before {
   position: absolute;
   left: 40px;
   bottom: -30px;
   font-family: "Flaticon";
   content: "\f103";
   color: #e9212e;
   font-size: 40px;
   line-height: 40px;
   transform: perspective(1200px) rotateY(180deg) translateZ(0px);
}
.about-carousel-box .single-box {
   position: relative;
   display: block;
}
.about-carousel-box .single-box .icon-holder {
   width: 90px;
}
.about-carousel-box .single-box .icon-holder span:before {
   color: #ffffff;
   font-size: 90px;
   line-height: 90px;
   margin-left: 1px;
}

.about-carousel-box .single-box .icon-holder,
.about-carousel-box .single-box .text-holder {
   display: table-cell;
   vertical-align: middle;
}
.about-carousel-box .single-box .text-holder {
   padding-left: 30px;
}
.about-carousel-box .single-box .text-holder h3 {
   color: #ffffff;
   font-size: 20px;
   font-weight: 600;
   margin: 0 0 14px;
   text-decoration: underline;
}
.about-carousel-box .single-box .text-holder p {
   color: #ffffff;
   margin: 0;
}

.about-carousel-box.owl-carousel .owl-stage-outer {
   position: relative;
   overflow: hidden;
   padding-bottom: 0px;
}
.about-carousel-box .owl-dots {
   position: absolute;
   margin-top: 60px;
   height: 25px;
   line-height: 25px;
   left: -10px;
}
.about-carousel-box .owl-dots .owl-dot {
   background-image: none;
   width: 20px;
   height: 5px;
   margin: 0px 10px;
   background: #e1e1e1;
   border: 2px solid #e1e1e1;
   padding: 0px;
   border-radius: 0%;
   transition: all 500ms ease;
   display: inline-block;
}
.about-carousel-box .owl-dots .owl-dot span {
   display: none;
}
.about-carousel-box .owl-dots .owl-dot.active {
   background: #e9212e;
   border-color: #e9212e;
}

/*** 
=============================================
    Working Area style
=============================================
***/
.working-area {
   position: relative;
   display: block;
   background-attachment: fixed;
   background-size: cover;
   background-position: center top;
   background-repeat: no-repeat;
   padding: 80px 0 40px;
   z-index: 1;
}
.working-area::before {
   background: rgba(40, 41, 46, 0.97) none repeat scroll 0 0;
   position: absolute;
   top: 0;
   left: 0;
   height: 100%;
   width: 100%;
   content: "";
   z-index: -1;
}
.single-working-box {
   position: relative;
   display: block;
   margin-bottom: 50px;
}
.single-working-box .img-holder {
   position: relative;
   display: block;
}
.single-working-box .img-holder .inner {
   position: relative;
   display: block;
   overflow: hidden;
}
.single-working-box .img-holder .inner img {
   width: 100%;
   transform: scale(1.01);
   transition: all 700ms ease 300ms;
   max-height: 250px;
}
.single-working-box:hover .img-holder .inner img {
   transform: scale(1.2) rotate(2deg);
}
.single-working-box .img-holder .inner .overlay-style-one {
   background-color: rgba(0, 0, 0, 0.5);
}
.single-working-box:hover .img-holder .inner .overlay-style-one {
   opacity: 1;
}

.single-working-box .img-holder .inner:before,
.single-working-box .img-holder .inner:after {
   position: absolute;
   top: 0;
   left: 0;
   content: "";
   width: 100%;
   height: 100%;
   transform: scale(0);
   transform-origin: left top;
   transition: all 700ms ease 500ms;
   border-radius: 0px;
   z-index: 3;
}
.single-working-box .img-holder .inner:before {
   transform: scale(0, 1);
   transform-origin: bottom center;
   border-top: 4px solid #e9212e;
   border-bottom: 4px solid #e9212e;
}
.single-working-box:hover .img-holder .inner:before {
   transform: scale(1, 1);
}
.single-working-box .img-holder .inner:after {
   transform: scale(1, 0);
   transform-origin: left center;
   border-left: 4px solid #e9212e;
   border-right: 4px solid #e9212e;
}
.single-working-box:hover .img-holder .inner:after {
   transform: scale(1, 1);
}

.single-working-box .text-holder {
   position: relative;
   display: block;
   background: #ffffff;
   margin: 0 15px;
   margin-top: -40px;
   border-radius: 10px 10px 0 0;
   z-index: 5;
}
.single-working-box .text-holder .plus-icon-box {
   position: absolute;
   right: 30px;
   top: -25px;
   width: 50px;
   height: 50px;
   background: #e9212e;
   border-radius: 50%;
   text-align: center;
   display: block;
   padding: 15px 0;
   transition: all 300ms ease 100ms;
}

.single-working-box:hover .text-holder .plus-icon-box {
   top: -50px;
   height: 75px;
   background: #e9212e;
   border-radius: 25px 25px 0px 0px;
   padding: 27px 0;
}

.single-working-box .text-holder .plus-icon-box span:before {
   display: block;
   color: #ffffff;
   font-size: 20px;
   line-height: 20px;
}

.single-working-box .text-holder .outer-box {
   position: relative;
   display: block;
   padding: 25px 15px 20px;
}
.single-working-box .text-holder .outer-box .icon {
   position: absolute;
   top: 0;
   left: 0;
   width: 70px;
   height: 100%;
   background: rgb(237, 237, 237);
   background: linear-gradient(
      0deg,
      rgba(237, 237, 237, 1) 0%,
      rgba(237, 237, 237, 0) 0%,
      rgba(237, 237, 237, 1) 100%,
      rgba(32, 50, 96, 0) 100%,
      rgba(32, 50, 96, 0.6530987394957983) 100%,
      rgba(80, 166, 253, 1) 100%,
      rgba(93, 173, 253, 1) 100%
   );
}
.single-working-box .text-holder .outer-box .icon .inner {
   display: table;
   width: 100%;
   height: 100%;
}
.single-working-box .text-holder .outer-box .icon .inner .box {
   display: table-cell;
   vertical-align: middle;
   text-align: center;
}
.single-working-box .text-holder .outer-box .icon .inner .box span:before {
   color: #e9212e;
   font-size: 35px;
   line-height: 35px;
}

.single-working-box .text-holder .outer-box .text {
   position: relative;
   display: block;
   padding-inline: 15px;
}
.single-working-box .text-holder .outer-box .text h5 {
   color: #27282c;
   margin: 0 0 13px;
   text-align: center;
}
.single-working-box .text-holder .outer-box .text p {
   margin: 0;
   font-family: var(--popp);
}

/*** 
=============================================
    Working Process area Style      
=============================================
***/
.working-process-area {
   position: relative;
   display: block;
   /* background: #f6f6f6; */
   background-color: transparent;
   background-image: linear-gradient(180deg, #deeff6 0%, #ffffff 100%);
   padding: 60px 0 40px;
   z-index: 2;
}

.single-working-process {
   position: relative;
   display: block;
   padding-top: 40px;
   background: transparent;
   transition: all 500ms ease;
   margin-bottom: 60px;
}
.single-working-process:hover {
   transform: translateY(-10px);
}
.single-working-process .top-box {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   width: 80px;
   height: 80px;
   display: block;
   border-top: 3px solid #e9212e;
   padding: 25px 0;
   background: #ffffff;
   border-radius: 50%;
   text-align: center;
   margin: 0 auto;
   z-index: 3;
}
.single-working-process .top-box::before {
   position: absolute;
   top: -1px;
   left: -1px;
   bottom: -1px;
   right: -1px;
   content: "";
   background: #e9212e;
   border-radius: 50%;
   transition: all 0.5s ease-in-out 0s;
   transform-style: preserve-3d;
   transform: perspective(1200px) rotateY(-90deg) translateZ(0px);
   opacity: 0;
   z-index: -1;
}
.single-working-process:hover .top-box::before {
   transform: perspective(1200px) rotateY(0deg) translateZ(0px);
   transition-delay: 0.1s;
   opacity: 1;
}
.single-working-process .top-box span {
   color: #27282c;
   font-size: 24px;
   line-height: 30px;
   font-weight: 500;
   text-transform: uppercase;
   transition: all 700ms ease 100ms;
}
.single-working-process:hover .top-box span {
   color: #ffffff;
   transition: all 700ms ease 500ms;
}

.single-working-process .inner {
   position: relative;
   display: block;
   padding: 55px 15px 25px;
   background: #ffffff;
   border-top: 3px solid #e9212e;
   -webkit-box-shadow: 0px 4px 10px 3px #eeea;
   box-shadow: 0px 4px 10px 3px #eeea;
   transition: all 300ms ease;
}
.single-working-process:hover .inner {
   box-shadow: none;
}
.single-working-process .inner h5 {
   color: #27282c;
   font-weight: 600;
   margin: 0 0 18px;
}
.single-working-process .inner p {
   margin: 0;
}

.single-working-process .inner .icon-holder {
   position: relative;
   display: block;
   padding-top: 22px;
}
.single-working-process .inner .icon-holder span:before {
   color: #bababa;
   font-size: 80px;
   line-height: 80px;
   transition: all 700ms ease 500ms;
}
.single-working-process:hover .inner .icon-holder span:before {
   color: #e9212e;
   transition: all 700ms ease 500ms;
}

/*** 
=============================================
    Slogan area style
=============================================
***/
.slogan-area {
   position: relative;
   display: block;
   background: #e9212e;
   padding: 35px 0;
}

.slogan-area .title {
   position: relative;
   display: block;
}
.slogan-area .title h3 {
   color: #ffffff;
   font-size: 20px;
   line-height: 30px;
}
.slogan-area .button {
   position: relative;
   display: block;
}
.slogan-area .button a {
   color: #27282c;
   background: #ffffff;
}
.slogan-area .button a:hover {
   color: #ffffff;
   background: #e11f2c;
}

/*** 
=============================================
    appointment Area Style      
=============================================
***/
.appointment-area {
   position: relative;
   display: block;
   background: #27282c;
   background-position: top right;
   background-attachment: scroll;
   background-repeat: no-repeat;
   background-size: auto;
   padding-top: 110px;
   padding-bottom: 110px;
   z-index: 1;
}

.map-content-box {
   margin-bottom: 20px;
}

.map-content-box .inner {
   position: relative;
   display: block;
   max-width: 570px;
   width: 100%;
   margin: 0 auto;
   z-index: 99;
}
.map-content-box .inner .overlay {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
}

.map-content-box .inner .contact_info {
   max-width: 515px;
   width: 100%;
   background-color: #fff;
   border-radius: 10px;
   padding: 20px 15px;
   margin-bottom: 20px;
   margin-inline: auto;
   transition: 0.4s linear;
}

.map-content-box .inner .contact_info:hover {
   transform: translateY(3px);
   outline: 1px solid #4448;
   outline-offset: -4px;
   box-shadow: 0px 2px 10px #eeea;
}
.map-content-box .inner .contact_info:hover span {
   color: var(--first);
}

.map-content-box .inner .contact_info .icon,
.map-content-box .inner .contact_info .text {
   display: table-cell;
   vertical-align: middle;
}

.map-content-box .inner .contact_info .icon {
   width: 65px;
}

.map-content-box .inner .contact_info .icon span {
   font-size: 52px;
}

.map-content-box .inner .contact_info .text p {
   margin: 0;
}
.map-content-box .inner .contact_info .text p a {
   color: #444;
   letter-spacing: 0.6px;
}
.map-content-box .inner .contact_info .text:hover p a {
   color: var(--first);
}

.map-content-box .inner .overlay .single-location-box {
   position: absolute;
}
.map-content-box .inner .overlay .single-location-box.one {
   top: 60px;
   left: 70px;
}
.map-content-box .inner .overlay .single-location-box.two {
   top: 100px;
   left: 50%;
}
.map-content-box .inner .overlay .single-location-box.three {
   left: 150px;
   bottom: 70px;
}
.map-content-box .inner .overlay .single-location-box.four {
   right: 50px;
   bottom: 60px;
}

.map-content-box .inner .overlay .marker-box {
   display: inline-block;
}
.map-content-box .inner .overlay .marker-box span:before {
   color: #ffffff;
   font-size: 50px;
   line-height: 50px;
   cursor: pointer;
}

.map-content-box .inner .overlay .location-info {
   position: absolute;
   left: -10px;
   bottom: 100px;
   width: 270px;
   opacity: 0;
   visibility: hidden;
   padding: 25px 30px 22px;
   padding-right: 20px;
   margin-left: 0;
   border-radius: 0px;
   background-color: #ffffff;
   transition: all 0.3s ease;
   z-index: 9999999999;
}
.map-content-box .inner .overlay .location-info:before {
   position: absolute;
   left: 30px;
   bottom: -30px;
   font-family: "Flaticon";
   content: "\f103";
   color: #ffffff;
   font-size: 40px;
   line-height: 40px;
   transform: perspective(1200px) rotateY(180deg) translateZ(0px);
}

.map-content-box .inner .overlay .single-location-box:hover .location-info {
   opacity: 1;
   visibility: visible;
   bottom: 90px;
}
.map-content-box .inner .overlay .single-location-box:hover .marker-box span:before {
   color: #e9212e;
   transition: all 500ms ease;
}
.map-content-box .inner .overlay .location-info h3 {
   color: #27282c;
   font-weight: 700;
   margin: 0 0 13px;
}
.map-content-box .inner .overlay .location-info p {
   margin: 0;
}

.appointment-box {
   position: relative;
   display: block;
   padding: 40px 40px 25px;
   max-width: 530px;
   width: 100%;
   background: #ffffff;
}
.appointment-box .title-box {
   position: relative;
   display: block;
   padding-bottom: 22px;
}
.appointment-box .title-box h2 {
   color: #27282c;
   font-size: 24px;
   line-height: 34px;
   font-weight: 600;
   margin: 0 0 10px;
}

.appointment {
   position: relative;
   display: block;
}
.appointment-form .single-box {
   position: relative;
   display: block;
}
.appointment-form input[type="text"],
.appointment-form input[type="number"],
.appointment-form input[type="email"],
.appointment-form textarea {
   position: relative;
   display: block;
   padding: 0 20px;
   border: 1px solid #ededed;
   background: #ffffff;
   color: #7c7e84;
   font-size: 15px;
   font-weight: 400;
   width: 100%;
   height: 50px;
   margin-bottom: 20px;
   border-radius: 5px;
   transition: all 500ms ease;
}
.appointment-form input[type="text"]:focus {
   border-color: #e9212e;
}
.appointment-form input[type="number"]:focus {
   border-color: #e9212e;
}
.appointment-form input[type="email"]:focus {
   border-color: #e9212e;
}
.appointment-form textarea:focus {
   border-color: #e9212e;
}
.appointment-form .single-box button {
   display: block;
   width: 100%;
   background: #e9212e;
   color: #ffffff;
   margin-top: 14px;
   border-radius: 5px;
   max-width: 250px;
   margin-left: auto;
   line-height: 48px;
}
.appointment-form input::-webkit-input-placeholder {
   color: #7c7e84;
}
.appointment-form input:-moz-placeholder {
   color: #7c7e84;
}
.appointment-form input::-moz-placeholder {
   color: #7c7e84;
}
.appointment-form input:-ms-input-placeholder {
   color: #7c7e84;
}

.appointment-form .single-box .bootstrap-select {
   position: relative;
   display: block;
}
.appointment-form .single-box .bootstrap-select > .dropdown-toggle {
   outline: none !important;
   border-radius: 5px;
   border: 1px solid #edf2f7;
   height: 60px;
   background-color: transparent;
   padding: 0;
   padding-left: 20px;
   color: #83888d;
   line-height: 60px;
   margin: 0;
   box-shadow: none !important;
}
.appointment-form .single-box .bootstrap-select > .dropdown-toggle::after {
   position: absolute;
   top: 50%;
   right: 20px;
   width: auto;
   height: auto;
   font-family: "FontAwesome";
   content: "\f107";
   color: #83888d;
   font-size: 18px;
   transform: translateY(-50%);
   margin: 0;
   border: none;
}
.appointment-form .single-box .bootstrap-select .dropdown-menu {
   margin: 0;
   padding: 0;
   border-radius: 0;
   border: 0px solid #ddd;
   background: #f9f9f9;
   font-size: 16px;
   color: #000000;
}
.appointment-form .single-box .dropdown-item {
   display: block;
   width: 100%;
   padding: 9px 20px 9px;
   font-weight: 400;
   color: #222222;
   text-align: inherit;
   white-space: nowrap;
   background-color: transparent;
   border: 0;
   border-radius: 0;
   transition: all 500ms ease;
}
.appointment-form .single-box .dropdown-item.active,
.appointment-form .single-box .dropdown-item:active {
   background: #e9212e;
   color: #fff;
}
.appointment-form .single-box .dropdown-item:hover {
   background: #e9212e;
   color: #fff;
}

/*** 
=============================================
    Footer area style
=============================================
***/
.footer-area {
   position: relative;
   display: block;
   /* background: #27282c; */
   background: #000;
   padding-top: 70px;
   padding-bottom: 60px;
   z-index: 1;
}
.footer-shape-bg {
   position: absolute;
   top: 0;
   right: 0;
   width: 675px;
   aspect-ratio: 1/1;
   background: url(../images/footer/footer-shape.png) no-repeat top right/ 100% 90%;
   opacity: 0.6;
   z-index: -1;
}

.single-footer-widget {
   position: relative;
   display: block;
   overflow: hidden;
}
.single-footer-widget .title {
   position: relative;
   display: block;
   padding-bottom: 15px;
   margin-top: -1px;
   margin-bottom: 15px;
   z-index: 1;
}
.single-footer-widget .title:before {
   position: absolute;
   left: 0;
   bottom: 0;
   width: 100%;
   height: 1px;
   background: #404043;
   content: "";
   z-index: -1;
}
.single-footer-widget .title:after {
   position: absolute;
   left: 0;
   bottom: 0;
   width: 50px;
   height: 1px;
   background: #e9212e;
   content: "";
   z-index: 1;
}
.single-footer-widget .title h3 {
   color: #ffffff;
   font-size: 22px;
   line-height: 24px;
   font-weight: 600;
   text-transform: capitalize;
}

/*** 
=============================================
    Footer Bottom Area Style      
=============================================
***/
.footer-bottom-area {
   position: relative;
   display: block;
   padding: 20px 0;
   background: #111;
   z-index: 10;
}
.footer-bottom-area .copyright-text {
   margin: 0;
}
.footer-bottom-area .copyright-text p {
   color: #999;
   font-size: 15px;
   line-height: 24px;
   font-weight: 400;
   font-family: var(--popp);
   margin: 0;
}
.footer-bottom-area .copyright-text p a {
   color: #ddd;
   transition: all 500ms ease;
   text-decoration: underline;
   text-underline-offset: 6px;
}
.footer-bottom-area .copyright-text p a:hover {
   color: var(--first);
}

.footer-social-links {
   position: relative;
   display: block;
}
.footer-social-links span {
   position: relative;
   display: inline-block;
   float: left;
   padding-right: 15px;
   color: #27282c;
   font-size: 14px;
   line-height: 30px;
   font-weight: 600;
}
.footer-social-links .sociallinks-style-one {
   position: relative;
   display: inline-block;
   line-height: 30px;
   float: left;
}
.footer-social-links .sociallinks-style-one li a i {
   color: #7c7e84;
   font-size: 14px;
   font-weight: 400;
   transition: all 500ms ease;
}
.footer-social-links .sociallinks-style-one li a:hover i {
   color: #e9212e;
}

/*** 
=============================================
    Top Bar Style2 style
=============================================
***/
.top-bar-style2 {
   position: relative;
   display: block;
   /* background: #26272b; */
   background: #000;
   padding: 15px 0px 70px;
}
.top-style2 {
   display: flex;
   justify-content: space-between;
   flex-direction: row;
   flex-wrap: nowrap;
   align-items: center;
}
.top-style2-left {
   position: relative;
   display: block;
}
.top-style2-left .top_left-whatsapp {
   display: none;
   padding-left: 10px;
   margin-left: 10px;
   border-left: 1px solid #bbb;
}

.top-style2-left .top_left-whatsapp a,
.top-style2-left .top_left-whatsapp .fa::before {
   color: #eee;
}

.top-style2-left p {
   position: relative;
   display: inline-block;
   float: left;
   color: #ffffff;
   font-size: 15px;
   font-weight: 500;
   line-height: 30px;
   margin: 0;
   font-family: "Poppins", sans-serif;
}
.top-style2-left p a {
   color: var(--first);
   letter-spacing: 0.5px;
   font-size: 104%;
}
.top-style2-left p span:before {
   position: relative;
   top: 3px;
   color: #e9212e;
   font-size: 20px;
   line-height: 20px;
   display: inline-block;
   padding-right: 9px;
}
.top-style2-left ul {
   position: relative;
   display: inline-block;
   padding-left: 20px;
}
.top-style2-left ul li {
   position: relative;
   display: inline-block;
   padding-left: 16px;
   margin-left: 15px;
   color: #ccc;
   font-size: 15px;
   line-height: 30px;
}
/* .top-style2-left ul li:last-child {
   padding-right: 0;
   margin-right: 0;
} */
.top-style2-left ul li:before {
   position: absolute;
   top: 7px;
   left: 0;
   width: 1px;
   height: 15px;
   background: #999;
   content: "";
}
/* .top-style2-left ul li:last-child:before {
   display: none;
} */

.top-style2-left ul li a {
   color: #eee;
   letter-spacing: 0.8px;
   font-family: var(--popp);
   transition: 0.4s;
}
.top-style2-left ul li a:hover {
   color: var(--first);
}

.top-style2-right {
   position: relative;
   display: block;
   overflow: hidden;
   float: right;
}
.top-style2-right .top-right-menu {
   position: relative;
   display: inline-block;
   float: left;
   padding-right: 20px;
   margin-right: 20px;
}
.top-style2-right .top-right-menu:before {
   position: absolute;
   top: 7px;
   right: 0;
   width: 1px;
   height: 15px;
   background: #404043;
   content: "";
}
.top-style2-right .top-right-menu li {
   position: relative;
   display: inline-block;
   float: left;
   line-height: 30px;
   padding-right: 30px;
}
.top-style2-right .top-right-menu li:last-child {
   padding-right: 0;
}
.top-style2-right .top-right-menu li a {
   color: #7c7e84;
   font-size: 15px;
   transition: all 500ms ease;
}
.top-style2-right .top-right-menu li a:hover {
   color: #e9212e;
}

.top-style2-right .topbar-social-links {
   position: relative;
   display: inline-block;
   float: right;
}
.top-style2-right .topbar-social-links li {
   position: relative;
   display: inline-block;
   float: left;
   line-height: 30px;
   padding-inline: 5px 15px;
}
.top-style2-right .topbar-social-links li:last-child {
   padding-right: 10px;
}

.top-style2-right .topbar-social-links li a {
   display: inline-block;
   width: 35px;
   aspect-ratio: 1/1;
   /* border: 1px solid transparent; */
   text-align: center;
   border-radius: 50%;
   transition: all 0.4s ease;
   overflow: hidden;
}

.top-style2-right .topbar-social-links li a i {
   color: #fff;
   font-size: 16px;
   line-height: 34px;
}
.top-style2-right .topbar-social-links li a:hover {
   outline: 1px solid #fffd;
   outline-offset: 2px;
}

.top-style2-right .topbar-social-links li a.whatsapp {
   background-color: #25d366;
}
.top-style2-right .topbar-social-links li a.facebook {
   background-color: #4267b2;
}
.top-style2-right .topbar-social-links li a.instagram {
   background: -moz-radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%);
   background: -webkit-radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%);
   background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%);
}

.top-style2-right .topbar-social-links li a.youtube {
   background-color: #ff0000;
}

.top-style2-right .topbar-social-links li a.twitter {
   background-color: #1da1f2;
}

.top-style2-right .topbar-social-links li a.linkedin {
   background-color: #0a66c2;
}

/*** 
=============================================
    Header Style2 style
=============================================
***/

.logo-box-style2 {
   position: relative;
   display: block;
   margin: 20px 0;
   transition: all 500ms ease 100ms;
}
.logo-box-style2 a {
   display: inline-block;
}

/*** 
=============================================
    About Style2 Area style
=============================================
***/
.about-style2-area {
   position: relative;
   display: block;
   padding: 110px 0 110px;
}
.about-style2-text {
   position: relative;
   display: block;
}
.about-style2-text .sec-title {
   padding-bottom: 30px;
}
.about-style2-text .sec-title p {
   margin: 0 0 27px;
}
.about-style2-text .text {
   position: relative;
   display: block;
   border-top: 1px dashed #cccccc;
   padding-top: 44px;
   padding-bottom: 35px;
}
.about-style2-text .text p {
   margin: 0;
}
.about-style2-text .button {
   position: relative;
   display: block;
   padding-top: 50px;
}

.about-style2-image-box {
   position: relative;
   display: block;
}
.about-style2-image-box .pattern {
   position: absolute;
   top: -110px;
   left: 5px;
   right: 0;
   bottom: -110px;
   background: #f9f9f9;
   background-repeat: no-repeat;
   width: 664px;
   height: 765px;
   content: "";
}
.about-style2-image-box .image {
   position: relative;
   display: block;
   max-width: 470px;
   width: 100%;
   margin: 0 auto;
   z-index: 3;
}
.about-style2-image-box img {
   width: 100%;
}
.about-style2-image-box .overlay-box {
   position: absolute;
   left: 40px;
   bottom: 30px;
   right: 40px;
   background: #ffffff;
}
.about-style2-image-box .overlay-box:before {
   font-family: FontAwesome;
   position: absolute;
   top: -20px;
   left: 30px;
   content: "\f0d8";
   color: #ffffff;
   font-size: 50px;
}

.about-style2-image-box .overlay-box .title {
   position: relative;
   display: block;
   float: left;
   padding: 23px 0 20px;
   padding-left: 30px;
}
.about-style2-image-box .overlay-box .title h1 {
   color: #555555;
   font-size: 48px;
   font-weight: 500;
   filter: alpha(opacity=50);
   font-family: "Rubik", sans-serif;
}
.about-style2-image-box .overlay-box .title h1 span {
   position: relative;
   display: inline-block;
   font-size: 18px;
   line-height: 24px;
   font-weight: 700;
   text-transform: uppercase;
   font-family: "Poppins", sans-serif;
}

.about-style2-image-box .overlay-box .button {
   position: relative;
   display: block;
   float: right;
}
.about-style2-image-box .overlay-box .button a span:before {
   position: relative;
   display: block;
   width: 80px;
   background: #e9212e;
   color: #ffffff;
   font-size: 30px;
   line-height: 100px;
   text-align: center;
   transform: rotate(180deg);
}

/*** 
=============================================
    Working Style2 Area style
=============================================
***/
.working-style2-area {
   position: relative;
   display: block;
   background-attachment: fixed;
   background-size: cover;
   background-position: center top;
   background-repeat: no-repeat;
   padding: 0px 0 110px;
   margin-top: 110px;
   z-index: 1;
}
.working-style2-area::before {
   background: rgba(0, 0, 0, 0.8) none repeat scroll 0 0;
   position: absolute;
   top: 0;
   left: 0;
   height: 100%;
   width: 100%;
   content: "";
   z-index: -1;
}
.working-style2-content {
   margin-top: -110px;
}
.single-working-box-style2 {
   position: relative;
   display: block;
   width: 25%;
   float: left;
}
.single-working-box-style2 .img-holder {
   position: relative;
   display: block;
   overflow: hidden;
}
.single-working-box-style2 .img-holder img {
   width: 100%;
   transform: scale(1);
   transition: all 700ms ease;
}
.single-working-box-style2:hover .img-holder img {
   transform: scale(1.2);
}
.single-working-box-style2 .static-content {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: 2;
   visibility: visible;
   opacity: 1;
   transform: translateY(0px);
   transition: all 500ms ease 100ms;
}
.single-working-box-style2:hover .static-content {
   opacity: 0;
   visibility: hidden;
   transform: translateY(100%);
   transition: all 900ms ease 100ms;
}
.single-working-box-style2 .static-content .box {
   display: table;
   width: 100%;
   height: 100%;
}
.single-working-box-style2 .static-content .box .inner {
   display: table-cell;
   vertical-align: middle;
   text-align: center;
}
.single-working-box-style2 .icon-holder {
   position: relative;
   display: block;
   width: 110px;
   height: 110px;
   margin: 0 auto 60px;
   text-align: center;
   border: 2px solid #ffffff;
   border-radius: 50%;
}
.single-working-box-style2 .icon-holder span:before {
   display: block;
   color: #ffffff;
   font-size: 55px;
   line-height: 106px;
}
.single-working-box-style2 .text-holder {
   position: relative;
   display: block;
}
.single-working-box-style2 .text-holder .title {
   position: relative;
   display: block;
}
.single-working-box-style2 .text-holder .title h3 {
   color: #ffffff;
   font-size: 20px;
   line-height: 70px;
   font-weight: 600;
   z-index: 1;
}
.single-working-box-style2 .text-holder .title .count {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   color: #2d2e32;
   font-size: 100px;
   line-height: 70px;
   font-weight: 500;
   font-family: "Rubik", sans-serif;
   z-index: -1;
}
.single-working-box-style2 .overlay-content {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: 3;
   opacity: 0;
   transform: translateY(100%);
   transition: all 300ms ease 100ms;
}
.single-working-box-style2:hover .overlay-content {
   opacity: 1;
   transform: translateY(-10px);
   transition: all 900ms ease 300ms;
}
.single-working-box-style2 .overlay-content .box {
   display: table;
   width: 100%;
   height: 100%;
}
.single-working-box-style2 .overlay-content .box .inner {
   display: table-cell;
   vertical-align: middle;
   text-align: center;
}
.single-working-box-style2 .overlay-content .icon-holder {
   margin: 0 auto 50px;
   border: 2px solid #e9212e;
   background: #e9212e;
}
.single-working-box-style2 .text-holder .text {
   position: relative;
   display: block;
   padding: 0 20px;
   margin-top: 34px;
}
.single-working-box-style2 .text-holder .text p {
   color: #7c7e84;
   margin: 0;
}
.single-working-box-style2 .read-more a span:before {
   position: absolute;
   left: 0;
   bottom: -30px;
   right: 0;
   width: 60px;
   height: 60px;
   margin: 0 auto;
   background: #e9212e;
   border-radius: 50%;
   color: #ffffff;
   font-size: 20px;
   line-height: 60px;
   text-align: center;
   opacity: 0;
   transform: scale(0.5);
   transition: all 200ms ease 100ms;
}
.single-working-box-style2:hover .read-more a span:before {
   opacity: 1;
   transform: scale(1);
   transition: all 900ms ease 900ms;
}
.working-style-bottom {
   position: relative;
   display: block;
   padding-top: 84px;
}
.working-style-bottom p {
   color: #ffffff;
   font-size: 18px;
   font-weight: 500;
   line-height: 28px;
   margin: 0 0 42px;
   font-family: "Poppins", sans-serif;
}
.working-style-bottom a {
   padding: 0 40px;
}

/*** 
=============================================
    Working Process Style2 Area style
=============================================
***/
.working-process-style2-area {
   position: relative;
   display: block;
   background-attachment: fixed;
   background-size: cover;
   background-position: center top;
   background-repeat: no-repeat;
   padding: 110px 0 110px;
   z-index: 1;
}
.single-working-process-style2 {
   position: relative;
   display: block;
   max-width: 370px;
   min-width: 370px;
   width: 100%;
   margin: 0 auto;
   background: #ffffff;
}
.single-working-process-style2 .top-box {
   position: relative;
   display: block;
   padding: 30px 40px 20px;
   z-index: 2;
}
.single-working-process-style2 .top-box:before {
   position: absolute;
   top: 11px;
   right: 0;
   width: 370px;
   height: 113px;
   background: url(../images/pattern/working-process-item-bg.png);
   content: "";
   z-index: -1;
   opacity: 1;
   transition: all 300ms ease 100ms;
}
.single-working-process-style2:hover .top-box:before {
   opacity: 0;
   transition: all 900ms ease 500ms;
}
.single-working-process-style2 .top-box:after {
   position: absolute;
   top: 0px;
   left: 0;
   width: 370px;
   height: 99px;
   background: url(../images/pattern/working-process-item-hover-bg.png);
   content: "";
   z-index: -1;
   transition: all 900ms ease 100ms;
   transform-style: preserve-3d;
   transform: perspective(1200px) rotateX(-90deg) translateZ(-45px);
   opacity: 0;
}
.single-working-process-style2:hover .top-box:after {
   opacity: 1;
   transform: perspective(1200px) rotateX(0deg) translateZ(0px);
   transition: all 900ms ease 300ms;
}
.single-working-process-style2 .top-box .count {
   position: relative;
   display: block;
   float: left;
}
.single-working-process-style2 .top-box .count h1 {
   color: #e9212e;
   font-size: 60px;
   line-height: 46px;
   font-weight: 500;
   font-family: "Rubik", sans-serif;
   transition: all 700ms ease 500ms;
}
.single-working-process-style2:hover .top-box .count h1 {
   color: #ffffff;
}
.single-working-process-style2 .top-box .icon {
   position: relative;
   display: block;
   float: right;
}
.single-working-process-style2 .top-box .icon span:before {
   color: #d0d0d0;
   font-size: 70px;
   line-height: 70px;
}
.single-working-process-style2 .inner {
   position: relative;
   display: block;
   overflow: hidden;
   padding: 35px 40px 52px;
   width: 100%;
}
.single-working-process-style2 .inner h3 {
   color: #27282c;
   font-weight: 600;
   margin: 0 0 18px;
}
.single-working-process-style2 .inner p {
   margin: 0;
}

.contact-details-content {
   position: relative;
   display: block;
   background: #f6f6f6;
   z-index: 3;
}

/*** 
=============================================
    Brand Area style2 Style2 style
=============================================
***/
.brand-area.style2 {
   padding-top: 110px;
   padding-bottom: 110px;
}
.single-brand-item.style2 {
   max-width: 170px;
   width: 100%;
   float: left;
   margin-right: 30px;
}
.single-brand-item.style2:last-child {
   margin-right: 0;
}
.single-brand-item.style2 a:hover {
   -webkit-box-shadow: 0px -4px 10px 3px #e8e8e8;
   box-shadow: 0px -4px 10px 3px #e8e8e8;
}

/*** 
=============================================
    Footer Area Style2 style
=============================================
***/
.footer-area.style2 {
   padding: 110px 0 100px;
   z-index: 10;
}
.single-footer-widget .title-style2 {
   position: relative;
   display: block;
   margin-top: -4px;
   padding-bottom: 33px;
}
.single-footer-widget .title-style2 h3 {
   color: #ffffff;
   font-size: 24px;
   line-height: 30px;
   font-weight: 600;
   text-transform: capitalize;
}

.single-footer-widget .our-info-box .footer-logo {
   position: relative;
   display: block;
   padding-bottom: 10px;
   text-align: center;
}
.single-footer-widget .our-info-box .footer-logo a {
   display: inline-block;
}
.single-footer-widget .our-info-box .footer-logo a img {
   max-height: 130px;
   width: auto;
   animation: 15s rotate_logo linear infinite;
}
@keyframes rotate_logo {
   100% {
      rotate: 360deg;
   }
}

.single-footer-widget .our-info-box .text {
   position: relative;
   display: block;
   padding-bottom: 23px;
}
.single-footer-widget .our-info-box .text p {
   color: #eee;
   margin: 0;
}

.single-footer-widget .usefull-links {
   position: relative;
   display: block;
   overflow: hidden;
   margin-top: -12px;
}
.single-footer-widget .usefull-links ul {
   position: relative;
   display: block;
   overflow: hidden;
}
.single-footer-widget .usefull-links ul.marleft30 {
   margin-left: 30px;
}
.single-footer-widget .usefull-links ul.borders-left {
   position: relative;
   margin-left: 80px;
   padding-left: 30px;
}
.single-footer-widget .usefull-links ul li {
   position: relative;
   display: block;
   line-height: 36px;
}
.single-footer-widget .usefull-links ul li a {
   color: #ddd;
   font-size: 15px;
   font-weight: 400;
   padding-left: 20px;
   letter-spacing: 0.5px;
   transition: all 500ms ease;
}
.single-footer-widget .usefull-links ul li a:hover {
   color: var(--first);
}
.single-footer-widget .usefull-links ul li a:before {
   position: absolute;
   top: 0px;
   left: 0;
   content: "\f107";
   font-family: "Flaticon";
   color: #7c7e84;
   font-size: 10px;
   transition: all 500ms ease;
   font-weight: 600;
   line-height: 36px;
   margin: 0px 0 0px;
}
.single-footer-widget .usefull-links ul li a:hover:before {
   color: #ffffff;
   content: "\f108";
   transition: all 500ms ease;
}
.single-footer-widget .usefull-links ul.borders-left:before {
   position: absolute;
   top: 12px;
   left: 0;
   bottom: 7px;
   width: 1px;
   background: #404043;
   content: "";
}

.single-footer-widget .subscribe-box {
   position: relative;
   display: block;
}
.single-footer-widget .subscribe-form {
   position: relative;
   display: block;
   max-width: 370px;
   width: 100%;
}
.single-footer-widget .subscribe-form input[type="email"] {
   position: relative;
   display: block;
   background: #27282c;
   border: 1px solid #404043;
   color: #999;
   font-size: 15px;
   font-weight: 400;
   width: 100%;
   height: 46px;
   margin-bottom: 0px;
   padding: 0 20px;
   transition: all 500ms ease;
}
.single-footer-widget .subscribe-form input::-webkit-input-placeholder {
   color: #999;
}
.single-footer-widget .subscribe-form input:-moz-placeholder {
   color: #999;
}

.single-footer-widget .subscribe-form input:-ms-input-placeholder {
   color: #999;
}
.single-footer-widget .subscribe-form button {
   margin-top: 10px;
   line-height: 42px;
}
.single-footer-widget .subscribe-form input[type="email"]:focus {
   border: 1px solid #ffffff;
   background: #ffffff;
   color: #222222;
}
.single-footer-widget .subscribe-form input[type="email"]:focus + button,
.single-footer-widget .subscribe-form button:hover {
   background: #191a1c;
   color: #fff;
}
.single-footer-widget .subscribe-box .text {
   position: relative;
   display: block;
   padding-top: 14px;
}
.single-footer-widget .subscribe-box .text p {
   color: #7c7e84;
   font-size: 15px;
   margin: 0;
}
.single-footer-widget .subscribe-box .text p span {
   color: #e9212e;
}

/*** 
=============================================
    Header Style3 Area style
=============================================
***/
.logo-box-style3 {
   position: relative;
   display: block;
   margin: 30px 0;
}
.logo-box-style3 a {
   display: inline-block;
}

.header-call-button {
   position: relative;
   display: block;
   width: 270px;
   background: #e9212e;
   text-align: right;
   padding: 30px 30px 30px;
   z-index: 1;
}
.header-call-button:before {
   position: absolute;
   left: 30px;
   bottom: 0;
   right: 30px;
   height: 1px;
   background: #ea5f68;
   content: "";
}
.header-call-button .inner {
   position: relative;
   display: block;
   padding-right: 60px;
}
.header-call-button .inner .icon {
   position: absolute;
   top: 0;
   right: 0;
   transform: rotateY(180deg);
}
.header-call-button .inner .icon span:before {
   color: #ffffff;
   font-size: 40px;
   line-height: 50px;
}
.header-call-button .inner .title {
   position: relative;
   display: block;
}
.header-call-button .inner .title span {
   color: #ffffff;
   font-size: 15px;
   font-weight: 400;
}
.header-call-button .inner .title h3 {
   color: #ffffff;
   font-size: 18px;
   line-height: 22px;
   font-weight: 500;
   margin: 3px 0 0;
   font-family: "Rubik", sans-serif;
}

/*** 
=============================================
    Footer Bottom Area Style2 Style      
=============================================
***/
.footer-bottom-area.style2 {
   background: #1f1f23;
}
.footer-social-links.clr-white span {
   color: #ffffff;
}

.footer-social-links .top-style2-right .topbar-social-links li {
   padding-inline: 10px;
}
.footer-social-links .top-style2-right .topbar-social-links li a:hover {
   outline: none;
}

/*** 
=============================================
    Breadcrumb area style
=============================================
***/
.breadcrumb-area {
   position: relative;
   background-attachment: scroll;
   background-position: center top;
   background-repeat: no-repeat;
   background-size: cover;
   padding: 0px 0 0px;
   z-index: 10;
}
.breadcrumb-area2 {
   position: relative;
   background-attachment: scroll;
   background-position: center top;
   background-repeat: no-repeat;
   background-size: cover;
   padding: 0px 0 290px;
   z-index: 10;
}
.breadcrumb-area .inner-content {
   position: relative;
   display: block;
   padding: 360px 0 0;
}
.breadcrumb-area .title {
   position: relative;
   display: block;
   padding-top: 24px;
   padding-bottom: 47px;
}
.breadcrumb-area .title:before {
   position: absolute;
   top: 0;
   left: 0;
   width: 120px;
   height: 4px;
   background: #ffffff;
   content: "";
}
.breadcrumb-area .title h1 {
   color: #ffffff;
   font-size: 48px;
   line-height: 60px;
   font-weight: 700;
   text-transform: capitalize;
   margin: 0;
}

.breadcrumb-area .breadcrumb-menu {
   position: relative;
   display: inline-block;
   line-height: 10px;
}
.breadcrumb-area .breadcrumb-menu ul {
   position: relative;
   display: inline-block;
   line-height: 30px;
   padding-bottom: 20px;
}
.breadcrumb-area .breadcrumb-menu ul li {
   position: relative;
   display: inline-block;
   float: left;
   color: #ffffff;
   font-size: 15px;
   line-height: 30px;
   font-weight: 400;
   text-transform: capitalize;
   transition: all 500ms ease;
   margin-right: 10px;
   padding-right: 17px;
}
.breadcrumb-area .breadcrumb-menu ul li:before {
   position: absolute;
   top: 0;
   bottom: 0;
   right: 0px;
   width: 7px;
   height: 2px;
   background: url(../images/icon/arrow.png);
   content: "";
   margin: 14px 0;
}
.breadcrumb-area .breadcrumb-menu ul li:last-child:before {
   display: none;
}
.breadcrumb-area .breadcrumb-menu ul li:last-child {
   margin-right: 0;
   padding-right: 0;
}
.breadcrumb-area .breadcrumb-menu ul li a {
   color: #ffffff;
   font-size: 15px;
   font-weight: 400;
   text-transform: capitalize;
   transition: all 500ms ease;
}
.breadcrumb-area .breadcrumb-menu ul li.active {
   font-weight: 500;
}
.breadcrumb-area .breadcrumb-menu ul li a:hover {
   color: #e9212e;
}

/*** 
=============================================
    Breadcrumb Area style2 Style      
=============================================
***/
.breadcrumb-area .inner-content-box .title-s2 {
   position: relative;
   display: block;
   padding: 143px 0 86px;
}
.breadcrumb-area .inner-content-box .title-s2 span {
   color: #e9212e;
   font-size: 14px;
   line-height: 18px;
   font-weight: 600;
   text-transform: uppercase;
   font-family: "Poppins", sans-serif;
}
.breadcrumb-area .inner-content-box .title-s2 h2 {
   color: #ffffff;
   /* font-size: 48px; */

   margin: 14px 0 0;
   text-transform: capitalize;
}

/*** 
=============================================
    Footer Area Style4 Style      
=============================================
***/
.footer-area.style4 {
   padding: 70px 0 60px;
   z-index: 10;
   /* border-radius: 14px 14px 0 0; */
   overflow: hidden;
}

/*** 
=============================================
    Footer bottom Area Style3 Style      
=============================================
***/
.footer-bottom-area.style3 {
   position: relative;
   display: block;
   padding: 88px 0 28px;
   background: #1f1f23;
   z-index: 10;
}

/*** 
=============================================
    Login Register Area style
=============================================
***/
.login-register-area {
   position: relative;
   display: block;
   padding-top: 103px;
   padding-bottom: 102px;
}
.login-register-area .form .shop-page-title {
   padding-bottom: 26px;
}
.login-register-area .form form {
   width: 100%;
}
.login-register-area .form .input-field {
   position: relative;
}
.login-register-area .form .input-field input[type="text"] {
   position: relative;
   display: block;
   width: 100%;
   height: 50px;
   border: 1px solid #ededed;
   color: #83888d;
   font-size: 15px;
   margin-bottom: 30px;
   padding-left: 15px;
   padding-right: 50px;
   transition: all 700ms ease 0s;
}
.login-register-area .form .input-field .icon-holder {
   position: absolute;
   top: 15px;
   right: 20px;
}
.login-register-area .form .input-field .icon-holder i {
   color: #999999;
   font-size: 14px;
   font-weight: 400;
}
.login-register-area .form button {
   line-height: 50px;
   padding: 0 40px;
}

.login-register-area .form .remember-text {
   margin-top: 19px;
}
.login-register-area .form .remember-text .checkbox label {
   color: #27282c;
   font-size: 16px;
   font-weight: 600;
   margin: 0;
   cursor: pointer;
}
.login-register-area .form .remember-text .checkbox input {
   position: relative;
   top: 1px;
}
.login-register-area .form .remember-text .checkbox span {
   color: #27282c;
   font-size: 16px;
   font-weight: 600;
   font-family: "Poppins", sans-serif;
}

.login-register-area .form .social-icon {
   position: relative;
   float: right;
   margin-right: -8px;
   margin-top: 10px;
}
.login-register-area .form .social-icon .login-with {
   position: absolute;
   left: -100px;
   top: 8px;
   margin: 0;
}
.login-register-area .form .social-icon li {
   display: inline-block;
   margin: 0 8px;
}
.login-register-area .form .social-icon li a i {
   background: #47588f none repeat scroll 0 0;
   border-radius: 50%;
   color: #fff;
   display: block;
   font-size: 14px;
   font-weight: 100;
   height: 40px;
   line-height: 24px;
   padding: 8px 0;
   text-align: center;
   transition: all 700ms ease 0s;
   width: 40px;
}
.login-register-area .form .social-icon li a i.twitter {
   background: #33ccfe none repeat scroll 0 0;
}
.login-register-area .form .social-icon li a i.gplus {
   background: #dd4b39 none repeat scroll 0 0;
}

.login-register-area .form .right {
   display: block;
   overflow: hidden;
   margin-left: -60px;
}
.login-register-area .form .right h6 {
   float: left;
   color: #828282;
   font-size: 14px;
   font-weight: 400;
   margin-top: 18px;
}
.login-register-area .form .right h6 span {
   color: #e9212e;
}
.login-register-area .form .input-field input[type="text"]:focus {
   border: 1px solid #1d1d1d;
}
.login-register-area .form .social-icon li a:hover i {
   background: #18387b;
}
.login-register-area .form .social-icon li a:hover i.twitter {
   background: #12addf;
}
.login-register-area .form .social-icon li a:hover i.gplus {
   background: #c62d1a;
}

/*** 
=============================================
    Breadcrumb Area Contact Page style
=============================================
***/
.breadcrumb-area.contact-page .inner-content-box .title-s2 {
   padding: 113px 0 220px;
}

/* ============ My custom styling =============== */

.main-slider.style2 .tparrows {
   background-color: #fff8;
   color: #000;
   border-radius: 10px;
}
.main-slider.style2 .tparrows:before {
   color: #000;
}

.contact_sec {
   background-color: transparent;
   background-image: linear-gradient(180deg, #deeff6 0%, #ffffff 100%);
}
.appointment-area {
   background-color: transparent;
   background-image: linear-gradient(180deg, #fff 0%, #deeff6 100%);
}
.appointment-box {
   box-shadow: 0px 0px 15px #eeea;
}
.appointment-area .inner img {
   opacity: 0.1;
}

.contact_sec .inner .contact_info:hover {
   outline-offset: 0;
}

.single-box textarea {
   height: auto;
   resize: none;
}

.contact_sec .single-box .btn-one {
   max-width: 260px;
   margin-left: auto;
}

.contact_sec input[type="text"],
.contact_sec input[type="number"],
.contact_sec input[type="email"],
.contact_sec textarea {
   border-color: #ccc;
}

.contact_sec .sec-title .title {
   color: #000;
}

.map_sec {
   line-height: 0;
}

/* =====payment Page Start======== */

.payment_sec {
   position: relative;
   padding: 60px 0 50px;
   background-color: #eee9;
}
.payment_sec .content input {
   display: none;
}

.payment_sec .content {
   display: flex;
   justify-content: space-between;
   align-items: center;
}

.payment_sec .content .list {
   display: flex;
   flex-direction: column;
   align-items: center;
   position: relative;
   /* width: 20%; */
   /* margin-right: 50px; */
   background-color: #fff;
   /* padding: 15px 10px; */
   max-width: 240px;
   width: 100%;
   margin-inline: auto;
   user-select: none;
   margin-bottom: 10px;
   border-radius: 10px;
}

.payment_sec .content .list label {
   cursor: pointer;
   height: 60px;
   line-height: 60px;
   font-size: 18px;
   font-weight: 500;
   font-family: var(--popp);
   color: #000;
   /* padding-left: 25px; */
   transition: all 0.5s ease;
   z-index: 10;
   margin: 0;
}

.payment_sec .content .list label:not(:first-child) {
   border-top: 1px solid #eee;
}

.payment_sec .content .list label img {
   height: 54px;
   width: auto;
}

#home:checked ~ .list label.home,
#blog:checked ~ .list label.blog,
#help:checked ~ .list label.help #help:checked ~ .list label.canara #help:checked ~ .list label.axis {
   color: #fff;
}

.payment_sec .content .slider {
   position: absolute;
   left: 0;
   top: 0;
   height: 60px;
   width: 100%;
   border-radius: 12px;
   transition: all 0.5s ease;
   color: #fff;
   background: var(--first);
   /* background: #; */
}

#home:checked ~ .list .slider {
   top: 0;
}

#blog:checked ~ .list .slider {
   top: 60px;
}

#help:checked ~ .list .slider {
   top: 120px;
}
#canara:checked ~ .list .slider {
   top: 180px;
}
#axis:checked ~ .list .slider {
   top: 240px;
}

.payment_sec .content .text-content {
   /* width: 80%; */
   height: 100%;
   color: #222;
   background-color: #fff;
   padding: 20px 26px 10px;
   border-radius: 10px;
}

.payment_sec .content .text {
   display: none;
}

.payment_sec .content .text .title {
   font-size: 22px;
   margin-bottom: 10px;
   font-weight: 500;
   font-family: var(--popp);
}

.payment_sec .container .text .pay_img {
   height: 400px;

   overflow: hidden;
   text-align: center;
   display: flex;
   justify-content: space-evenly;
   align-items: center;
   flex-wrap: wrap;
}

.payment_sec .container .text .pay_img :where(h5, h6) {
   margin-bottom: 10px;
   color: #000;
   letter-spacing: 0.8px;
   font-weight: 500;
}
.payment_sec .container .text .pay_img img {
   height: 100%;
   border: 1px solid #aaa;
   border-radius: 10px;
   overflow: hidden;
}
.payment_sec .content .text-content .home {
   display: block;
}

#home:checked ~ .text-content .home,
#blog:checked ~ .text-content .blog,
#help:checked ~ .text-content .help,
#canara:checked ~ .text-content .canara,
#axis:checked ~ .text-content .axis {
   display: block;
}

#blog:checked ~ .text-content .home,
#help:checked ~ .text-content .home,
#canara:checked ~ .text-content .home,
#axis:checked ~ .text-content .home {
   display: none;
}

.payment_sec .content .list label:hover {
   color: var(--first);
}

.course_sec {
   position: relative;
   background-color: #eee8;
   padding: 60px 0 50px;
}
.course_sec .course_container {
   background-color: #fff;
   padding: 30px 25px;
   border-radius: 10px;
}

.social_btn {
   display: none;
   position: relative;
   padding: 15px 0 10px;
   float: none;
   text-align: center;
}

.social_btn ul.topbar-social-links {
   float: none;
}
.social_btn ul li {
   position: relative;
   display: inline-block;
   line-height: 30px;
   padding-inline: 10px;
   float: none;
}

.about_page_sec {
   padding: 60px 0 0px;
}
.about_page_sec .about_page_content h4 {
   text-align: center;
   margin-bottom: 20px;
   color: var(--first);
   font-family: "Rubik", sans-serif;
   font-weight: 500;
}

.about_page_sec .about_page_content p {
   color: #111;
   line-height: 28px;
   font-family: var(--popp);
}

.about_page.appointment-area {
   padding: 50px 0 25px;
}

.course_content h6 {
   margin-bottom: 10px;
}
.course_content ul li {
   list-style: disc;
   padding: 10px 5px;
   margin-left: 15px;
}

.payment_tbl {
   max-width: 440px;
   width: 100%;
}
.payment_tbl tr {
   /* display: inline-block; */
   /* border: 1px solid #ddd; */
   /* padding: 10px 4px;
   width: 100%; */
}

.payment_tbl tr th {
   font-weight: 500;
}

.payment_tbl tr td {
   letter-spacing: 0.8px;
}

.payment_tbl tr td,
.payment_tbl tr th {
   width: 50%;
   padding: 10px 8px;
   border: 1px solid #ddd;
}