*,
*:before,
*:after {
box-sizing: border-box;
}

ul,
ol {
list-style: none;
margin: 0px;
padding: 0px;
}
a:focus {
outline: none;
}
a,
i,
input[type="submit"] {
text-decoration: none;
transition: all 0.4s ease-in-out 0s;
-moz-transition: all 0.4s ease-in-out 0s;
-ms-transition: all 0.4s ease-in-out 0s;
-o-transition: all 0.4s ease-in-out 0s;
-webkit-transition: all 0.4s ease-in-out 0s;
text-decoration: none !important;
}
img {
max-width: 100%;
}
textarea:focus,
input:focus,
select:focus {
outline: 0;
}
/* hero section */
.heroSection {
padding: 150px 0 200px;
text-align: center;
}
.heroSection h1 {
color: #000000;
    font-size: 60px;
    line-height: 1.0714285714;
    font-weight: 900;
    letter-spacing: -0.005em;
}
.heroSection .serviesCheck {

line-height: 25px;
}
.heroSection .serviesCheck img {
width: 24px;
height: 24px;
margin-right: 5px;
float: left;
}
.heroSection input#search-input {
    border: 2px solid #edecec;
    border-radius: 50px;
    height: 70px;
    width: 500px;
    padding: 25px;
    font-size: 1.8em;
}
.heroSection .inputBox img {
width: 29px;
height: 31px;
margin-right: 10px;
}
.heroSection .phoneImg {
bottom: -209px;
right: -130px
}
.phoneImg img {
width: 480px;
height: 480px;
object-fit: contain;
}
/* Services */

.services h4 {
font-size: 1em;
line-height: 25px;
font-weight: 600;
margin-top: 0px;

}
.services .boxArea {
    height: 100%;
    background-color: #fff;
    border-radius: 18px;
    transition: transform 0.5s ease;
    box-shadow: 2px 4px 12px #00000014;
}
.services .boxArea:hover {
    transform: scale(1.05);
}
.services .boxArea h3 {
    font-weight: 600;
    font-size: 28px;
	text-align:center;
 
    border-radius: 6px;
    color: #000;
}

.services .boxArea p {
    margin: 0px;
    padding: 0 0.5rem;
}
.services .boxArea a {
    font-size: 15px;
    line-height: 20px;
    font-weight: 700;
    background: #000;
    color: #FFF;
    padding: 1rem;
    margin-top: auto;
    text-align: center;
    border-radius: 6px;
}
.icons {
    margin: 2rem 0rem;
    margin-bottom: 1rem;
    padding: 1rem;
    padding-top: 2rem;
    background: rgb(210, 210, 215, 0.05);
    border-radius: 18px;
    box-shadow: 2px 4px 12px #00000014;
}

.services h4 {
    font-size: 1em;
    line-height: 30px;
    font-weight: 600;
    color: black;
    margin-top: 0px;
}
.deviceSection h4 {
    font-weight: 500;
    line-height: 35px;
    text-align: center;
}
.icons img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    background: black;
    padding: 4px;
    border-radius: 50%
}
/* Our Client  */
.ourClient {
    max-width: 1366px;
    margin: 0px auto;
}

.ourClient h2 {
 font-weight: 900;
    text-transform: uppercase;
    color: #0a0a0a;
    margin-bottom: 0px;
    font-size: 50px;
    text-align:center;
}

.ourClient h3 {
  color: #afafaf;
  text-align:center;
}
.shadow {
    background-color: rgb(210, 210, 215, 0.05);
    box-shadow: 2px 4px 12px #00000014;
    border-radius: 18px !important;
}

.ourClient h4 {
font-size: 20px;
line-height: 26px;
font-weight: 400;
color: #000;
}
.ourClient p {
color: #000;
}
.prev-button, .next-button {
    position: absolute;
    top: 65%;
    transform: translateY(-50%);
    background-color: #FFF !important;
    border: none;
    padding: 10px;
    padding-top: 15px;
    cursor: pointer;
    border: solid 1px rgba(0, 0, 0, 0.1);
}
.next-button {
    right: -20px;
}
.ourClient .ClientReview {
position: relative;
}
.ourClient .reviewBox {
border-radius: 8px;
}
.ourClient .dotLine {
position: relative;
padding: 0 15px;
}
.ourClient .dotLine::after {
    content: "";
    position: absolute;
    right: 0;
    width: 1px;
    height: -webkit-fill-available;
    display: block;
    border-left: 1px dashed rgba(0, 0, 0, 0.1);
    top: 20px;
    bottom: 20px;
}


.slider-container {
position: relative;
overflow: hidden;
width: 100%;
}
.slider-track {
display: flex;
transition: transform 0.3s ease;
padding: 20px 0;
}
.slider-item {
flex: 0 0 calc(100% / 3);
/* Each slide takes up one-third of the container */
}
.prev-button,
.next-button {
position: absolute;
top: 68%;
transform: translateY(-50%);
/* background-color: #ccc; */
border: none;
padding: 0px;
cursor: pointer;
}
.prev-button {
left: -25px;
}
.next-button {
right: -25px;
}
/* Services Area */
.servicesArea {
background: #fff;
padding: 50px 0;
}
.servicesArea h2 {
    line-height: 57px;
    font-weight: 900;
    color: #0a0a0a;
    margin-bottom: 0px;
    font-size: 50px;
}

.servicesArea button {
width: 195px;
height: 60px;
background: #D0112B99;
border-radius: 8px;
display: flex;
font-size: 18px;
font-weight: 700;
}

/* responsive */
@media (min-width:1122px) and (max-width:1439px) {

.phoneImg img {
width: 15em;
height: auto;
object-fit: contain;
}
.services h4 {
font-size: 16px;
}
.accordion-button {
font-size: 20px;
}
}
@media only screen and (max-width:1122px) {
/* hero Section */
.heroSection {
padding: 80px 0 150px;
}
.heroSection h1 {
font-size: 36px;
line-height: 50px;
}
.heroSection .serviesCheck {

    line-height: 25px;
    background-color: #fff;
    border-radius: 25px;
    transition: transform 0.5s ease;
    box-shadow: 2px 4px 12px #00000014;
    font-weight: 500;
    padding: 0.75rem 1rem;
}
.heroSection .serviesCheck img {
width: 18px;
height: 18px;
}
.heroSection .inputBox {
border-radius: 20px;
width: 100%;
padding: 1px 20px;
}
.heroSection input#search-input {
    border: 2px solid #edecec;
    border-radius: 50px;
    height: 70px;
    width: 465px;
    padding: 25px;
    font-size: 1.8em;
    text-align: left;
}	
.heroSection .inputBox img {
width: 15px;
height: 17px;
}
.heroSection .phoneImg {
bottom: -150px;
right: 0;
text-align: right;
}
.heroSection .phoneImg img {
width: 50%;
height: auto;
}
/* Services */
/* our client */
.ourClient h2 {
font-size: 36px;
margin-bottom: 10px;
}
.ourClient h3 {
font-size: 20px;
}
.ourClient .dotLine {
margin-bottom: 15px;
}
.ourClient .dotLine::after {
content: none;
}
/*services area */
.servicesArea h2 {
font-size: 32px;
line-height: 20px;
}

.servicesArea button {
height: 49px;
}
/* FAQS */
.faqs h2 {
font-size: 36px;
text-align:center;
}
.accordion-header {
font-size: 18px;
line-height: normal;
}
}
@media (min-width:768px) and (max-width:991px) {
.slider-item {
flex: 0 0 calc(100% / 2);
/* Each slide takes up one-third of the container */
}
.prev-button {
width: 30px;
left: -12px;
}
.next-button {
width: 30px;
right: -12px
}
}
.heroSection .serviesCheck img {
    background: white;
    padding: 2px;
    border-radius: 50%;
}
@media only screen and (max-width:767px) {
/* hero section */
.heroSection {
padding: 50px 0 0px;
}
.heroSection h1 {
font-size: 26px;
line-height: 38px;
}
.heroSection .serviesCheck {
margin-bottom: 15px;
width: 260px;
text-align: left;
display: flex;
align-items: center;
}
.heroSection .phoneImg {
position: relative !important;
bottom: 0;
text-align: center;
margin-top: 40px;
}
/* services */
.services .col-lg-3.col-md-6 {
justify-content: flex-start;
width: 320px;
margin: 10px auto;
}
.servicesArea img {
margin-top: 30px;
}
/* our client */
.ourClient h2 {
font-size: 26px;
}
.ourClient h3 {
font-size: 18px;
}
.slider-item {
flex: 0 0 calc(100% / 1);
/* Each slide takes up one-third of the container */
}
.prev-button {
width: 30px;
left: 15px;
}
.next-button {
width: 30px;
right: 15px
}
/* FAQS */
.faqs h2 {
font-size: 26px;
text-align:center;
}
.accordion-button {
font-size: 20px;
line-height: normal;
}
}

.ourClient p {
    color: slategray;
    font-style: italic;
}

.servicesArea h2 {
    font-size: 45px;
    font-weight: 700;
    line-height: 57px;
    color: #000000;
}

/*------------- Media CSS---------------*/
@media only screen and (min-width: 1166px) {

.mx-auto {
    margin-left: auto;
    margin-right: auto;
    position: absolute;
    left: 30%;
}
.homehero{

    padding: 120px 0px 300px !important;
    text-align: center;

}
.heroSection .phoneImg{

    position: absolute;
    left: 75%;
    top: 34%;
}

}
@media only screen and (max-width: 767px) {
    .servicesArea h2 {
        font-size: 26px;
	text-align: center;
    }
	
 .faqs h2 {
        font-size: 26px !important;
	text-align: center;
    }
}

.faqs h2 {
    line-height: 56px;
    font-weight: 900;
    color: #0a0a0a;
    margin-bottom: 0px;
    font-size: 36px;
    text-align:center;
}