* {
    margin: 0;
    padding: 0;
    font-size: 16px;
    line-height: 20px;
    font-family: 'Roboto', sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin: 0;
}

ul {
    margin: 0;
    padding: 0;
}

ul li {
    list-style: none;
}

a {
    text-decoration: none;
}

a:hover {
    text-decoration: none;
}

.contact-mob {
    
    color: #2c3d8d;
    font-weight: 700;
}


.top-header{
    border-bottom: 1px solid #2b3e8b
}
.top-header .navbar .navbar-nav .nav-link.active { 
    color: #24abe2;
        font-family: "Merriweather", serif;
        font-weight: 700;
        font-style: italic;
}

.top-header .navbar .navbar-nav .nav-link {
    color: #2c3d8d;
    font-family: "Merriweather", serif;
    font-weight: 700;
    font-style: italic;
}
.top-header .navbar .navbar-nav .nav-item .nav-link[href="career.html"]{
    display: none;
}

.top-header .navbar-toggler {
    padding: 0.25rem 0.75rem;
    font-size: 1.25rem;
    line-height: 1;
    background-color: #add3cf;
    border: 1px solid #00000029;
}


.top-header .navbar .navbar-nav .nav-item .nav-link:hover {
    color: #24abe2;
}

.message-us {
    background-color: #24abe2;
    color: #fff;
    padding: 10px;
    border-radius: 20px 0;
}

.mob-mail {
    display: flex;
    align-content: space-evenly;
}

.phone {
    margin-left: 30px;
}

input {
    width: 100%;
    padding: 7px;
    border: 1px solid #ced4da;
    border-radius: 4px;
}

.modal-footer .btn {
    background-color: #39968d;
    color: #fff;
    transition: all 1s;
    text-decoration: none;
    border: 2px solid #39968d !important;
}

.modal-footer .btn:hover {
    border: 2px solid #39968d !important;
    color: #39968d !important;
    background-color: transparent !important;
}

footer {
    background-color: #24abe2;
    padding: 10px 0;
}

p.right {
    text-align: center;
    line-height: 40px;
    color: #fff;
    font-family: "Merriweather", serif;
    font-weight: 700;
    font-style: italic;
    font-size: 18px;
    text-shadow: 1px 1px 3px black;

}

.banner {
    background-image: url(../images/bg\ image1.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding: 200px 0;
}

.contact,
.know {
    background-color: #24abe2;
    color: #fff;
    padding: 10px 20px;
    border-radius: 10px ;
    display: inline-block;
    border: 1px solid #24abe2;
    margin: 30px 0; 
    text-shadow: 1px 1px 3px black;
    font-family: "Merriweather", serif;
    font-weight: 700;
    font-style: italic;
    
}

.contact:hover {
    color: white;
    border: 1px solid white;
    background-color: transparent;
   
}



.banner h2 {
    color: white;
    text-shadow: 1px 1px 3px black;
    font-family: "Merriweather", serif;
    font-weight: 700;
    font-style: italic;
}
.banner p{
    color: white;
    text-shadow: 1px 1px 3px black;
}
.welcome {
    padding: 100px 0;
}

.welcome h3 {
    text-align: center;
    margin-bottom: 20px;
    color: #2b3e8a;
    text-shadow: 1px 1px 3px black;
    font-family: "Merriweather", serif;
    font-weight: 700;
    font-style: italic;
}

.welcome span {
    font-size: 23px;
    font-weight: 700;
    text-shadow: 1px 1px 3px black;
    color: #2ba6df;
    font-family: "Merriweather", serif;
    font-weight: 700;
    font-style: italic;

}

.welcome .card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0, 0, 0, .125);
    border-radius: 0.25rem;
    height: 197px;
    z-index: 11;
    box-shadow: -1px 4px 10px -2px #0000002b;
}

.welcome .card::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    height: 100%;
    border-radius: 3px;
    background-color: #2ba6df;
    z-index: -1;
    -webkit-transition: 0.4s;
    transition: 0.5s;
}

.welcome .card:hover::before {
    width: 100%;
}

.welcome .card:hover .card-body h4 {
    color: #fff;

}

.welcome .card:hover .card-body p {
    color: #fff;

}

.welcome .card-body p {
    margin: 10px 0 36px 0;
}

.card-body h4 {
    text-align: center;
    font-family: "Merriweather", serif;
    font-weight: 700;
    font-style: italic;
}
/*---------- end -------*/




/***************ABOUT US ***************/
.about img {
    width: 100%;
    border-radius: 11px;
    transition: all 3s;
}

.about img:hover {
    transform: scale(1.5);
}

.about h2 {
    padding: 20px 0;
    text-align: center;
    color: #24abe2;
    text-shadow: 1px 1px 2px black;
    font-family: "Merriweather", serif;
    font-weight: 700;
    font-style: italic;

}
.about .know{
    color: white;
    background-color: #24abe2;
    border: 1px solid #24abe2;
    
}
.about .know:hover{
    background: transparent;
    border: solid 2px #24abe2;
    color: #24abe2;
    text-shadow: none;
}
.about {
    padding: 80px 0;
}

.about-text {
    margin: 56px;
    padding: 50px 0;
}

.about-img {
    overflow: hidden;
    border-radius: 11px;
    width: 100%;
}

/*---------- end -------*/



/*********it service**************/
.service-m h2 {
    padding: 20px 0;
    text-align: center;
    color: #24abe2;
    text-shadow: 1px 1px 2px black;
    font-family: "Merriweather", serif;
    font-weight: 700;
    font-style: italic;
}

.service-m h4 {
    line-height: 30px;
}

.service-m p {
    line-height: 22px;
    margin: 10px 0;
    color: #6e6d6d;
}

.service-m {
    margin: 40px 0;
}

.service-m img {
    width: 200px;
    height: 150px;
}

/******owl**********/
.owl-box .owl-carousel .owl-item img {
    display: inline-block;
    width: 100%;
    height: 100%;
}

.owl-box .card-title {
    color: #24abe2;
    font-family: "Merriweather", serif;
    font-weight: 700;
    font-style: italic;
}

.owl-box .owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
    background: #2c3d8d;
}

.owl-box .owl-theme .owl-dots .owl-dot span {
    width: 15px;
    height: 15px;
}

.owl-box .card-body .btn {
    background-color: #2c3d8d;
    color: #fff;
    font-family: "Merriweather", serif;
    font-weight: 700;
    font-style: italic;
}
.owl-box .card-body .btn:hover{
    border: solid 1px #2c3d8d;
    background-color: transparent;
    color: #2c3d8d;
}

.btn:focus {
    box-shadow: none;
}
.owl-box{
    margin: 50px 0;
}

.owl-box .card {
    margin: 6px 10px;
    transition: all 2s;
}

.card img{
    max-height: 200px;
}

.card:hover {
    box-shadow: 5px 3px 6px 3px #0c0c0c5c;
}

.info-u {
    display: flex;
    margin: 10px 0;
}
/*---------- end -------*/




/************message************/
.send-message h2 {
    text-align: center;
    margin: 70px 0;
    text-shadow: 1px 1px 3px black;
    color: #24abe2;
    font-family: "Merriweather", serif;
    font-weight: 700;
    font-style: italic;
}
.send-message h4{
    color: #2c3d8d;

}
.send-message h5{
    color: #2c3d8d;
}
.send-message .form-control {
    border: none;
    border-bottom: 1px solid;
    border-radius: 0;
    margin: 10px 0;
    padding: 10px 0;
    box-shadow: none;

}

.send-message .form-control[type="tel"] {
    margin: 10px 0 10px 20px;
}

label[for="exampleInputEmail1"] {

    margin-right: 10px;
    color: #6c757d;

}

input:focus::placeholder {
    color: transparent;
}

textarea {
    width: 100%;
}


.con-info p {
    font-size: 14px;
    line-height: 23px;
}

.send {
    background-color: #24abe2;
    padding: 5px 10px;
    width: 100%;
    color: #fff;
}
.send:hover{
    border: 1px solid #2c3d8d;
    background-color: transparent;
}
.reset {
    border: #2c3d8d 1px solid;
    padding: 5px 10px;
    width: 100%;
    color: #2c3d8d;
}


.addr p {
    line-height: 27px;
}

.addr span {
    color: #24abe2;
}

.br-l {
    position: relative;
    padding-top: 35px;

}
.br-l::after{
    position: absolute;
    content: '';
    width: 1px;
    height: 100%;
    background-color: #6c757d;
    left: -41px;
    top: 0;
    right: 0;
}
.needs-validation{
    margin: 5px 0 30px;
}
/*---------- end -------*/





/*--------------- career -------------*/

.career-table{
    text-align: center;
    width: 100%;
    border: 2px solid #2c3d8d ;
}
.career-table thead{
    background-color: #24abe2;
    color: white;
    font-family: "Merriweather", serif;
    font-weight: 700;
    font-style: italic;
    font-size: 20px;
}
.career-table thead th{
    padding: 10px 0;
    border: 1px solid #2b3e8b;
}
.career-table tbody td{
    padding: 15px 0;
    border: 1px solid #2b3e8b;
}
.career-table .apply-btn{
    padding: 5px 5px;
    background-color:#24abe2 ;
    border: 1px solid #24abe2 ;
    border-radius: 5px;
    font-size: 14px;
    color: white;
}
.career-table .apply-btn:hover{
    border:1px solid #24abe2;
    color: #24abe2;
    background-color: transparent;
}
/*---------- end -------*/
  

/************  Digital marketing ***********/

.os-card{
    padding: 50px 0;
}
.dm-img{
    padding: 30px 0 50px 0;
}
.os-card h1{
    color: #24abe2;
    text-align: center;
    margin: 30px 0;
    font-family: "Merriweather", serif;
    font-weight: 700;
    font-style: italic;
    text-shadow: 1px 1px 3px black;
}
.os-card h6{
    color: #24abe2;
    font-family: "Merriweather", serif;
    font-size: 25px;
    margin-bottom: 20px;
    margin-top: 3em;
    font-weight: 700;
    font-style: italic;
    text-shadow: 1px 1px 1px black;
}
.os-card .row img{
    width: 100%;
}
.os-card .box{
    width: 100%;
}
.os-card .brand-carousel{
    margin-bottom: 10em;
}


/************** other services **************/
.otherservice h1{
    color: #24abe2;
    margin: 20px 0;
    text-align: center;
    font-family: "Merriweather", serif;
    font-weight: 700;
    font-style: italic;
    text-shadow: 1px 1px 1px black;
}
.tbs{
    margin: 30px 0;
}
.tbs img{
    width: 100%;
    margin-top: 1em;
    height: 60%;
}
.tbs h5{
    color: #24abe2;
    margin-top: 2em;
    margin-bottom: 2em;
    font-size: 30px;
    font-family: "Merriweather", serif;
    font-weight: 700;
    font-style: italic;
    text-shadow: 1px 1px 1px black;

}
.tbs p{
    margin-bottom: 20px;
}
.tbs li{
    margin-bottom: 15px;
}
.tbs li span{
    color: #24abe2;
    font-family: "Merriweather", serif;
    margin-right: 8px;
    font-weight: 700;
    font-style: italic; 
}


/*******   Responsive *********/
@media only screen and (max-width:1280px) {
    .post-slide .post-content {
        padding: 0px 15px 25px 15px;
    }
}

@media only screen and (max-width: 991px) {}

@media only screen and (max-width: 767px) {}

@media only screen and (max-width: 575px) {
    .clients_inner ul li {
    width: 100%;
    }
}

@media only screen and (max-width: 480px) {
    .banner {
        background-image: url(../images/bg4.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        padding: 200px 0;
    }

    .team .carousel-indicators {
        position: absolute;
        right: 0;
        bottom: -59px;
    }
    
     .clients_inner ul li {
    width: 100%;
    }
}

@media only screen and (max-width: 375px) {}