/* body {font-family: 'Times New Roman', Times, serif;} */
body {overflow-x: hidden; font-family: roboto !important; font-size: 0.9rem;}
p, h1,h2,h3,h4,h5,h6 { font-family: roboto !important;}
.dark-heading {color: #3b3a3a !important;}
.fw-bold-1 {font-weight: 500 !important;}
.carousel-indicators {display: none;}
.color-change-btn {display: none;}
/*
===========================
header starts
===========================
*/
.navbar {border-bottom: 5px solid #c6c6c690; padding: 0.5rem 0;}
.navbar-nav li a {margin-top: 3px !important; color: #e30715; text-transform: uppercase; font-weight: bolder; margin: 0 1.5rem; font-size: 15px;}
.navbar-nav li a:hover {color: #000; border-top: 1px solid #e30715;}
.navbar-nav li .active {color: #a532ed !important;}
.navbar-toggler:focus {box-shadow: unset !important;}
.navbar .dropdown-menu li a {text-transform: capitalize;  padding-top: 11px !important; padding-bottom: 11px !important;}
.navbar .dropdown-menu {border-radius: 20px; box-shadow: 0px 1px 8px #000000; background-color: #ffffff;}
.navbar .dropdown-menu li a:hover {background-color: unset;}
.navbar .dropdown:hover .dropdown-menu {display: block;}
.navbar .dropdown-menu {text-align: center;}
.navbar .dropdown-menu .dropdown-item {width: unset}

.navbar li a{line-height: 5.5; border-top: 1px solid #000;}
.navbar {padding: 0}
.dropdown-menu li a {line-height: unset; padding-top: 15px !important; padding-bottom: 15px !important;}
.dropdown-menu {padding: 10px 0}
.show {left: 0 !important; transition: all 500ms ease;}
.navbar.sticky {
  position: sticky; /* Fix the navbar at the top */
  top: 0;
  left: 0;
  right: 0;
  background: #fff;
  z-index: 99;
}
/*
===========================
header ends
===========================
*/
/*
===========================
mobile menu starts
===========================
*/
/*
===========================
mobile menu ends
===========================
*/
/*
===========================
main slider starts
===========================
*/
.main-slider .carousel-control-prev-icon, .main-slider .carousel-control-next-icon {width: 3.5rem; height: 3.5rem;}
.main-slider h1 {font1-family: 'DINNeuzeitGroteskLTW01- 812426', "Arial Narrow", sans-serif; font-size: 50px; font-weight: 5 00; letter-spacing: 1.2px;}
.main-slider .carousel-caption {top: 20%;}
/*
===========================
main slider ends
===========================
*/
/*
===========================
main services starts
===========================
*/
.main-services {position: relative;}
.main-services .bg-img {position: absolute; z-index: -1; top: 0; width: 100%; opacity: 0.43;}
.main-services .main-heading {font-size: 34px; font-weight: 600; color: #000; text-transform: uppercase; }
/* .main-services::before {content: ""; position: absolute; width: 100%; height: 100%; background-color: #ffffff10; top: 0; } */
.main-services .card-body {margin-top: 15px;}
.main-services .card p, .card-items li {font-style: italic; font-size: 15px; color: #e30715}
.main-services .card-title {color: #000;}
.section-btn a {padding: 8px; min-width: 30%; border-radius: 50px; background: #e30715; border: 3px solid #e30715; color: #fff; font-weight: 500; font-size: 13px;}
.section-btn a:hover {background-color: #000; border-color: #000; color: #323232; color: #fff;}
.main-services .main-heading::before {content: ""; position: absolute; width: 120px; height: 10px; background-color: #e30715; bottom: -20px;}
.main-services .main-heading {position: relative; text-transform: uppercase; font-size: 34px;}
.main-services::before {content: ""; position: absolute; top: 0; background: rgba(255,255,255, 0.65); width: 100%; height: 100%; opacity: %}
.main-services .card::after {content: ""; position: absolute; background: #3b3939; width: 1px; height: 100%; top: 0; right: -22px;}
.main-services .col-lg-3:nth-child(4) .card::after {display: none;}
/*
===========================
main services ends
===========================
*/
/*
===========================
about us starts
===========================
*/
.about-us .about-content {background: #f7f7f7c7; padding: 5rem 6rem 5rem 6rem !important;}
.about-content .main-heading {color: #000; position: relative; text-transform: uppercase; font-size: 34px;}
.about-content .main-heading::before {content: ""; position: absolute; width: 120px; height: 10px; background-color: #e30715; bottom: -20px;}
.about-content p {color: #e30715; font-size: 21px; font-style: italic11;}
.about-content .card-items li {font-size: 21px;}
.about-content li {font-style: normal;}
/*
===========================
about us ends
===========================
*/
/*
===========================
company project starts
===========================
*/
.company-projects {position: relative;}
.company-projects .main-heading {color:#e30715; font-size: 60px; text-transform: uppercase; font-size: 34px;}
.company-projects img {position: absolute; z-index: -1; opacity: 0.31; top: 0; height: 400px}
.company-projects p {font-size: 22px; line-height: 1.1; font-weight: 500; color: #949494;}
/*
===========================
company project ends
===========================
*/
/*
===========================
projects starts
===========================
*/
.projects .main-heading::before {content: ""; position: absolute; width: 120px; height: 10px; background-color: #e30715; bottom: -20px;}
.projects .main-heading {position: relative; color: #000; text-transform: uppercase; font-size: 34px;}
/*
===========================
projects ends
===========================
*/
/*
===========================
clients starts
===========================
*/
.clients .main-heading::before {content: ""; position: absolute; width: 120px; height: 10px; background-color: #e30715; bottom: -20px;}
.clients .main-heading {position: relative; color: #949494; text-transform: uppercase; font-size: 34px;}
.clients {padding-top: 50px; padding-bottom: 90px; background-image: linear-gradient(90deg, rgba(93,53,0,0.72) 0%, rgba(255,185,229,0.72) 50.1068115234375%, rgba(231,145,0,0.72) 100%) !important;}
/*
===========================
clients ends
===========================
*/
/*
===========================
contact starts
===========================
*/
.home-contact .first-link {color: #3b3a3a; font-weight: 700;}
.home-contact .second-link {color: #3744ad; font-weight: 700;}
.home-contact .content-outer {border: 4px solid #ae633fab; padding: 30px; border-radius: 120px; width: 70%;}
.home-contact .text-underline {text-decoration: underline; font-weight: bold;}
.home-contact .enquiries {border: 4px solid #db9421b5; height: 120px; padding-left: 8px; padding-top: 8px;}
.home-contact .enquiries::before {content: "\f04b"; position: absolute; font-family: fontawesome; color:#db9421b5; transform: rotate(90deg); bottom:-20px; left: 50px;} 
.home-contact .enquiries {position: relative;}
.socials ul {display: flex; gap: 20px;}
.socials ul li {list-style: none; display: flex;}
/*
===========================
contact ends
===========================
*/
.faqs {padding-bottom: 60px !important}
/*
===========================
faqs starts
===========================
*/
/*
===========================
faqs ends
===========================
*/
/*
===========================
services page starts
===========================
*/
.services-heading .main-headingg::before {content: ""; position: absolute; width: 120px; height: 10px; background-color: #e30715; bottom: -20px;}
.services-heading .main-headingg {position: relative; color: #000; text-transform: uppercase; font-size: 34px;}
.bg-grey {background-color: #d9d8da99;}
.service-heading {color: #e30715; font-size: 35px;}
.service-content {width: 65%;}
.service-content p, .service-content ul li {font-size: 19px; font-style: italic; color: #000;}
.services-section-two ul li {font-style: normal;}
.service-items a {text-decoration: none; color: #000;}
/*
===========================
services page ends
===========================
*/
/*
===========================
introduct starts
===========================
*/
/*.about-first .main-heading-2 {color: #e30715;}*/
.about-banner {height: 350px; width: 100%; object-fit: cover;}
.about-first .main-heading::before {content: ""; position: absolute; width: 120px; height: 10px; background-color: #e30715; bottom: -20px;}
.about-first .main-heading {position: relative; color: #000; text-transform: capitalize;font-weight: 500; font-size: 34px;}
.about-first .main-heading-2::before {content: "";text-transform: capitalize; position: absolute; width: 120px; height: 10px; background-color: #e30715; bottom: -20px;}
.about-first .main-heading-2 {position: relative; color: #000; text-transform: capitalize;font-weight: 500; font-size: 34px;}
.about-first .main-heading-3::before {content: "";text-transform: capitalize; position: absolute; width: 120px; height: 10px; background-color: #e30715; bottom: -20px;}
.about-first .main-heading-3 {position: relative; color: #000; text-transform: capitalize;font-weight: 500; font-size: 34px;}
.color-change-btn {background: #e30715 !important; color: #fff !important; text-decoration: none;}
.color-change-btn:hover {background: #000 !important; color: #e30715 !important;}
.about-first { padding-bottom: 70px;}
.about-first li {font-size: 22px; font-style: normal;}
ul.font-style li {font-style: italic;}
.font {font-size: 22px; font-weight: 14300;}
.text-color {color: #3b3a3a !important;}
/*
===========================
introduct ends
===========================
*/
/*
===========================
founder starts
===========================
*/
.founder .main-heading {color: #000; letter-spacing: 2.4px; font-weight: 500; font-size: 34px}
/*
===========================
founder ends
===========================
*/
/*
===========================
specialiteis starts
===========================
*/
.specialities .double-line-border {border-top: 3px solid black; border-bottom: 1px solid black;  height: 7px; margin-left: -5.4%; margin-right: -5.4%;}
.specialities .main-heading::before {content: ""; position: absolute; width: 120px; height: 10px; background-color: #e30715; bottom: -20px;}
.specialities .main-heading {position: relative; color: #000; text-transform: uppercase; font-size: 34px;}
.specialities ul li, .specialities p {font-size: 17px; color: #3b3a3a;}
.specialities .bg-light {background-color: #ffffff  !important;}

/*
===========================
specialiteis ends
===========================
*/
/*
===========================
sales associates starts
===========================
*/
.sales p {color: #3b3a3a; font-size: 17px; font-weight: 500;}
.sales .email {color: #ff3c00}
.sales .main-heading::before {content: ""; position: absolute; width: 120px; height: 10px; background-color: #e30715; bottom: -20px;}
.sales .main-heading {position: relative; color: #000; text-transform: uppercase; font-size: 34px;}
.sales .ready-email {font-weight: 300;}
.sales .carousel-control-prev, .sales .carousel-control-next {display: none;}
.career p {font-weight: normal;}
/*
===========================
sales associates ends
===========================
*/
.home-contact .main-heading::before {content: ""; position: absolute; width: 120px; height: 10px; background-color: #e30715; bottom: -20px;}
.home-contact .main-heading {position: relative; color: #949494; text-transform: uppercase; font-size: 34px;}
/*
===========================
media queries starts
===========================
*/
@media only screen and (max-width: 1350px){
    .navbar-nav li a {font-size: 13px;}
}
@media only screen and (max-width: 1200px){
    .navbar-nav li a {font-size: 13px; margin-left: 12px; margin-right: 12px;}
}
@media only screen and (max-width: 991px){
    .navbar-nav li a {margin-left: 0;}
    .home-contact .address {padding-top: 20px;}
    .specialities .col-9 {width: 100%;}
    /* .navbar-collapse {display: none;} */
}
@media only screen and (max-width: 767px){
  .main-services .col-lg-3 {justify-content: center;}
  .main-services .card {margin-bottom: 1.5rem;}
  .about-us .col-lg-9 {max-width: 100%;}
  .about-us .about-content {padding: 20px !important;}
  .faqs .col-10 {width: 85%; padding-left: 0px; padding-right: 0px;}
  .about-first .col-9 {width: 100%;}
  .accordion .accordion-item {padding-left: 0 !important; padding-right: 0 !important}
  .about-first .col-6 {width: 100%;}
  .founder .col-9 {width: 100%}
  .main-slider .carousel-control-prev-icon, .main-slider .carousel-control-next-icon {width: 1.5rem; height: 1.5rem;}
  .main-slider .carousel-caption {display: block !important;}
  .main-slider .carousel-caption h1 {display: block !important; font-size: 30px;}
  .services-section .service-content {width: 100% !important}
  .row .double-line-border:first-child  {border: 0 !important;}
.specialities .row .col-9 {padding-top: 0 !important}
}
@media only screen and (min-width: 1200px){
  .services-section, .services-section .height {height: 750px}
}
@media only screen and (max-width: 1199px){
  .team-slide .col-9 {width: 100%;}
}
@media only screen and (max-width: 1399px){
  .double-line-border {margin-left: -6.4% !important; margin-right: -6.4% !important;}
}
@media only screen and (max-width: 1199px){
  .double-line-border {margin-left: -7.6% !important; margin-right: -7.6% !important;}
}
@media only screen and (max-width: 767px){
  .double-line-border {margin-left: -4.7% !important; margin-right: -4.7% !important;}
  .specialities .col-9 {padding: 1.5rem !important}
  .sales .first-col {justify-content: center !important; padding-bottom: 28px;}
  .sales .col-10 {width: 100%;}
  .main-services .card::after {display: none;}
  .clients .inner-carousel img {width: 120px; height: 120px; object-fit: contain;}
.clients .inner-carousel {width: 100px}
.clients .inner-carousel .carousel-inner {width: unset; height: unset;}
.main-slider h1 {font-size: 40px}
.contact-form .col-6 {width: 100%;}
}
@media only screen and (max-width: 450px){
  .main-slider .carousel-caption h1 {font-size: 22px; line-height:1; position: relative; top: -16px;}
  .main-slider .carousel-control-prev {left: 20px;} 
  .main-slider .carousel-control-next {right: 20px;}
  .clients .inner-carousel img {width: 80px; height: 80px; object-fit: contain;}
.clients .inner-carousel {width: 80px}
.home-contact .content-outer {width: 100%;}
}
@media only screen and (max-width: 991px){
  .navbar-nav li a{line-height: unset; border-top: unset  !important; margin-right: 0 !important; border-top: 1px solid #e6edfa !important; padding-top: 15px; padding-bottom: 15px;}
  .dropdown-menu li a:hover {border: 0}
  .navbar-nav .dropdown-menu {width: 360px; background: #d4d2d2; }
  .mobile-menu .navbar-nav {padding-top: 1.5rem; padding-left: .6rem; padding-right: .6rem;}
  .navbar-nav li:nth-child(1) a {border-top: 0px !important;}
  /* .mobile-menu::before {box-shadow: 200px 50px 100rem #000; content:""; position: absolute; width: 100%; height:100%;} */
  .navbar-collapse .navbar-nav {display: none;}
  /* .mobile-menu {left: -100% !important; transition: all 500ms ease; position: absolute; width: 450px;} */
  .mobile-menu {width: 450px; position: fixed; top: 0; left: -100%; z-index: 99; background-color: #fff; transition: all 500ms ease; height: 100%}
  .navbar {padding-top: 1rem; padding-bottom: 1rem;}
}
@media only screen and (min-width: 992px){
  .mobile-menu {display: none !important;}
}
@media only screen and (max-width: 575px){
  .mobile-menu {width: 350px;}
  .navbar-nav .dropdown-menu {width: 310px;}
  .main-slider .carousel-indicators {display: none;}
  .main-slider .container {padding-left: 2rem; padding-right: 2rem;}
  .faqs .accordion-button, .faqs .accordion-body {font-size: 14px !important}
  .faqs .accordion-item {padding: 0 !important}
.faqs .rrr {border:0;}

}
@media only screen and (max-width: 1399px){
  .main-services .card::after {right: -13px;}
}
@media only screen and (max-width: 440px){
    .home-contact .col-lg-5 br {display: none}
}
@media only screen and (max-width: 350px){
    .mobile-menu {left: -140%;}
    .main-slider h1 {font-size: 26px !important;}
}
@media (min-width: 992px) {
    .navbar-expand-lg .navbar-collapse {justify-content: center;}
}
@media only screen and (max-width: 400px){
    .navbar img {width: 200px;}
}
/*
===========================
media queries ends
===========================
*/
/* .carousel-control-prev,
.carousel-control-next{display: none;} */
    
  .clients .container {
    margin: 0 auto;
    width: 250px;
    height: 200px;
    position: relative;
    perspective: 1000px;
  }
  
  .clients .carousel-home {
    height: 100%;
    width: 100%;
    /* position: absolute; */
    transform-style: preserve-3d;
    transition: transform 1s;
  }
  
.clients .item {
    display: block;
    position: absolute;
    /* background: #000; */
    width: 250px;
    height: 200px;
    line-height: 200px;
    font-size: 5em;
    text-align: center;
    color: #FFF;
    opacity: 0.95;
    border-radius: 10px;
  }
  
  .a {
    transform: rotateY(0deg) translateZ(250px);
    /* background: #ed1c24; */
  }
  .b {
    transform: rotateY(60deg) translateZ(250px);
    /* background: #0072bc; */
  }
  .c {
    transform: rotateY(120deg) translateZ(250px);
    /* background: #39b54a; */
  }
  .d {
    transform: rotateY(180deg) translateZ(250px);
    /* background: #f26522; */
  }
  .e {
    transform: rotateY(240deg) translateZ(250px);
    /* background: #630460; */
  } 
  .f {
    transform: rotateY(300deg) translateZ(250px);
    /* background: #8c6239; */
  }
  
  .next, .prev {
    color: #444;
    position: absolute;
    top: 100px;
    padding: 1em 2em;
    cursor: pointer;
    background: #CCC;
    border-radius: 5px;
    border-top: 1px solid #FFF;
    box-shadow: 0 5px 0 #999;
    transition: box-shadow 0.1s, top 0.1s;
  }
  .next:hover, .prev:hover { color: #000; }
  .next:active, .prev:active {
    top: 104px;
    box-shadow: 0 1px 0 #999;
  }
  .next { right: 5em; }
  .prev { left: 5em; }
  /*
  ===================================
  waiz css starts 
  ===================================
  */
  .bg {
    background-image: url('assets/images/background.png');
    background-size: cover;
}
.rrr {
    background-color: white;
    border: 20px solid rgb(192, 192, 188);
    padding-left: 10px !important;
    padding-right: 10px !important;
    padding: 30px;
    /* margin-top: 30px; */
    max-width: 1100px;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
    
    outline: 29px solid #3b3a3a;
   
  
}
.header h2 {
    font-size: 26px;
    color: #000;
    text-align: center;
}
.general-label {
    font-size: 16px;
    color: orange;
    font-weight: bold;
}
.accordion-button {
    background-color: white;
    color: #e30715;
    font-size: 18px;
    text-align: left;
}
.accordion-button:not(.collapsed){
    box-shadow:unset;
    background-color:unset;

}
.accordion-button:not(.collapsed) {
  color: inherit !important;
}
.accordion-button:focus{
  box-shadow: unset !important;
}
.button:focus:not(:focus-visible){
    outline:unset;
    box-shadow:unset !important;
}
.accordion-button:not(.collapsed) {
    color: #e30715 !important;
}
.accordion-body {
    font-size: 16px;
    color: rgb(148, 148, 148);
}
.banner {
    background-image: url('assets/images/skye.jfif');
    background-size: cover;
    padding: 20px 0;
    text-align: center;
}
.left-box, .right-box {
    background-color: rgba(200, 200, 150, 0.7);
    padding: 20px;
}
.right-box {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.right-box img {
    margin-top: 10px;
}
.tom {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap; 
    padding: 20px;
}

.cor{
    color:purple;
    text-decoration: underline;
   
}
.cop{
    color:blue;
    text-decoration: underline;
}
.img-responsive {
    width: 100%; 
    width: 633px;
    height: 387px;
    
}
.accordion-button:not(.collapsed)::after{
  background-image: unset; content :"\f107"; font-family: fontawesome;
}
.are{
    border-bottom:1px solid #f5efcb;
    font-size: 24px;
    font-weight: 300;
}
.are::after {background-image: unset; content :"\f107"; font-family: fontawesome;}

.accordion-item{
    border:none
}
.accordion-body{
    font-style: italic;
    font-size: 21px;
    font-weight: 300;
}

@media (max-width: 768px) {
    .tom {
        flex-direction: column;
    }
}
/*============*/
/* h1 {
  color: #d9534f;
  font-weight: bold;
} */

p.lead {
  color: #555;
}

/* ul {
  padding-left: 0;
  list-style: none; 
}

ul li {
  padding: 5px 0;
} */

.color-change-btn {
  background-color: #000000;
  color: white;
  border: none;
  padding: 15px 30px;
  font-size: 16px;
  cursor: pointer;
  transition: background-color 0.3s ease, transform 0.3s ease;
}

.color-change-btn:hover {
  background-color: #ffe70c; 
  transform: scale(1.05); 
  color: rgb(14, 11, 11);
}

.section {
  margin-top: 5rem;
}
.ital{
  font-size: 22px;
  font-style: italic;
}
.ital ul li {
  font-weight: 300;
}
@media (max-width: 576px) {
  .color-change-btn {
      width: 100%; /* Full-width button on small screens */
      padding: 10px; /* Adjust padding */
      font-size: 14px; /* Adjust font size */
  }
}
/*=================*/

.class p {
  color: rgb(59, 58, 58); 
  font-size: 17px;
  line-height: 1.6;
  vertical-align: baseline;
  letter-spacing: normal;
  text-align: justify;
  line-height: normal;
}

.linkedin-icon {
  width: 34px;
  height: 34px;
  margin-left: 5px;
}

.btn-dark {
  background-color: #343a40; 
  color: #fff;
  font-weight: bold;
  border: none;
  
}
.bum{
  text-align: right;

}
/*====================*/
  /*
  ===================================
  waiz css ends 
  ===================================
  */
 


  .card-carousel {
    position: relative;
    margin: 0 auto;
    padding: 0;
    max-width: 100%;
    /* height: 200px; */
    perspective: 2000px;
  }
  .inner-carousel {
    position: relative;
    width: 174px;
    margin: 0 auto;
    top: 30px;
    transform-style: preserve-3d;
  }
  .inner-carousel > div {
    position: absolute;
    margin: 0 auto;
    padding: 20px;
    width: 300px;
    height: 200px;
    opacity: 1;
    
    transition: all 0.5s ease-out;
    z-index: 1;
  }
  
/*form css starts*/  
.form-container {
            background-color: #ffffff;
            padding: 30px;
            border-radius: 8px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
            width: 100%;
            max-width: 350px;
        }
        .form-container .form-title {
            /*font-style: italic;*/
            color: #555;
            text-align: center;
            margin-bottom: 20px;
            font-size: 16px;
        }
        .form-container .form-control {
            border: none;
            border-bottom: 1px solid #888;
            border-radius: 0;
            box-shadow: none;
        }
        .form-container .form-control:focus {
            border-color: #e30715;
            box-shadow: none;
        }
        .form-container .form-check {
            display: inline-block;
            margin-right: 15px;
        }
        .form-container .btn-primary {
            width: 100%;
            background-color: #004495;
            border: none;
        }
        .form-container .btn-primary:hover {
            background-color: #003377;
        }
        .form-container input::placeholder {color: #d2cfcf;}
        .form-container .form-btn {background: #e30715;}
.form-container .form-btn:hover {background: #000;}
.form-check-input:checked {background: #e30715; border-color: #e30715;}
.contact-form .form-btn {background: #e30715; border-color: #e30715;}
.contact-form .form-btn:hover {background: #000; border-color: #000;}
.contact-form form input:focus, .contact-form textarea:focus { box-shadow: unset !important; border-color: #303030;}
  
  
  
  
  