@import url('https://fonts.cdnfonts.com/css/poppins');


@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@700&display=swap');


  @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@500;700&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Lobster&family=Poppins:wght@500;700&display=swap');

/* Remove the navbar's default margin-bottom and rounded borders */ 

 .navbar {
    margin-bottom: 0;
    padding-left: 0px !important;
    padding: right 0px !important;
    border-radius: 0;
    position: unset !important;
  }

  .navbar-dark .navbar-nav .nav-link {
    color: rgba(255,255,255,.5);
    padding: 0 !important;
    padding-left: 12px !important;
}

.navbar-collapse{
   
    padding-right: 0px !important;
}

.navbar-nav .nav-link{
    padding-left: 0px !important;
     padding-right: 0px !important;
}

.navbar-nav>li>a{
    padding: 0px !important;
}
  
  
  /* Set height of the grid so .sidenav can be 100% (adjust as needed) */
  .row.content {height: 450px}
 

  
  /* On small screens, set height to 'auto' for sidenav and grid */
  @media screen and (max-width: 767px) {
    .sidenav {
      height: auto;
      padding: 15px;
    }
    .row.content {height:auto;} 
  }
/* nav in center */

.navbar-expand-lg .navbar-nav {
    
    margin-top: 9px;
}
/* height of navbar */
nav.navbar.navbar-inverse {
    height: 99px;
}

/* desktop logo size */
.navbar-brand>img {
    display: block;
    width: 85%;
    text-align: left;
}

.navbar{
    padding-left: 0px !important;
    padding-right: 0px !important;
}

/*li.nav-item.btn-btn-header {*/
/*    margin-left: 7px !important;*/
/*}*/

/*ul.navbar-nav li.btn-btn-header a.nav-link {*/
  
/*    margin-left: 5px !important;*/
/*}*/

/*.navbar-nav li.nav-item{*/
/*        padding-right: 5px;*/
/*}*/

.navbar-inverse {
    background-color: #ECECEC !important;
    border: 0px solid transparent !important;
    border-radius: 0px !important;
  
}

.navbar-dark .navbar-nav .active>.nav-link, .navbar-dark .navbar-nav .nav-link.active, .navbar-dark .navbar-nav .nav-link.show, .navbar-dark .navbar-nav .show>.nav-link  {
    color: #dd2b2c !important;
    font-family: 'Poppins', sans-serif !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    background: transparent !important;
}

/* navbar padding */
.navbar-dark .navbar-nav .nav-link {
    color: Gray !important;
    font-family: 'Poppins', sans-serif !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    background: transparent !important;
    
  
}

.navbar-dark .navbar-nav .nav-link {
    color: rgba(255,255,255,.5);
    /*padding-right: 8px !important;*/
}
button.quote {
    padding: 5px;
    background: #de2b2c;
    border: none;
    font-family: 'Poppins', sans-serif !important;
    font-size: 16px;
    padding-left: 16px;
    padding-right: 16px;
    margin-top: -19px;
}

button.quote a{
color: white;
font-weight: 600 !important;
}

.topheading{
    font-family: 'Poppins', sans-serif !important;
    color: #de2b2c;
    font-size: 44px;
    font-weight: 700;
    margin-top: 133px;
    line-height: 50px;
}

section#sec-01 {
    background-image: url(img/WebBanner.png) !important;
    height: 90vh !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
        margin-top: -30px;
}

#top{
    background: #ECECEC;
}

.toppara {
    font-family: 'Poppins', sans-serif;
    font-size: 16px;
    font-weight: 500 !important;
    color: black;
}

p.rated {
    font-size: 14px;
    color: black;
    font-weight: 400;
    font-family: 'Poppins', sans-serif;
}

.toplist li{
    font-family: 'Poppins', sans-serif !important;
    font-size: 16px;
    font-weight: 500 !important;
    color: black;
    list-style-type:none !important;
    margin-left: -20px;
}

.toplist li:before {
    content: "\2713";
    list-style: none;
    margin-right: 6px;
    background: #de2b2c;
    padding: 0px 4px;
    border-radius: 43px;
    color: white;
    font-weight: 900;
    font-weight: 700;
    font-size: 12px;
}


/* Styling for Counters Starts*/



.count-title {
   font-size: 36px;
    margin-top: 10px;
  
    text-align: center;
    color: #de2b2c;
    font-weight: 700;
    font-family: poppins;
}

.count-text {
    font-family: 'Poppins', sans-serif !important;
    font-size: 14px;
    font-weight: normal;
    margin-top: 10px;
    margin-bottom: 0;
    text-align: center;
    color: black !important;
}

h2.additional {
    font-size: 36px;
    margin-top: 10px;
    text-align: center;
    color: #de2b2c;
    font-weight: 700;
    font-family: poppins;
}

div#mycounters {
    /*max-width: 100%;*/
    padding-top: 34px;
}

div#mycounters {
       max-width: 100% !important;
    /* padding-top: 34px; */
    display: flex !important;
    /* align-items: center; */
    /* vertical-align: middle; */
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}
   
}


span.plus {
    font-size: 34px;
    font-weight: 800;
    text-align: center;
    color: #DD2B2C !important;
    position: absolute;
    top: -3px;
    right: -8px;
}

span.plus4 {
    font-size: 35px;
    font-weight: 800;
    text-align: center;
    color: #DD2B2C !important;
    position: absolute;
    top: -4px;
    right: 5.1px;
}


span.plus5 {
    font-size: 34px;
    font-weight: 800;
    text-align: center;
    color: #DD2B2C !important;
    position: absolute;
    top: -3px;
    right: 20.1px;
}
/* Styling for Counters ends*/


/* Section 2 background image Styling starts starts */


#sec3back {
    position: absolute;
    background-repeat: no-repeat;
    background-size: cover;
    width: 35%;
    height: 700px;
    /* left: 0; */
    top: 2000px;
}


/* Section 2 background image Styling ends header */



div#ranking {
    max-width: 51%;
    padding-top: 43px;
}
#ranking img{
    width: 90%;
}

/*#designfirms {*/
/*    width: 48% !important;*/
/*    margin-left: 35%;*/
/*}*/

.jumbotron{
    background: transparent !important;
    padding-left: 0px !important;
     padding-right: 0px !important;
} 

.works{
    margin-top: 60px;
font-family: 'Poppins', sans-serif !important;
font-size: 64px;
font-weight: 700;
line-height: 78px;
letter-spacing: 0em;
text-align: center;
color: #DD2B2C;


}


.works-para{
    font-size: 16px;
    font-family: 'Poppins', sans-serif !important;
    color:#6D6E70;
    font-weight: 500px;
}


.Unique{
    font-family: 'Poppins', sans-serif !important;
    font-weight: 700;
    line-height: 64px !important;
    letter-spacing: 0em;
    text-align: center;
    color: #DD2B2C;
    
    
    }

    .Unique-para{
        font-size: 16px;
        font-family: 'Poppins', sans-serif !important;
        color:black;
        font-weight: 500;
    }

    

    h6.wireframe {
        padding-top: 20px;
        font-size: 16px;
        font-family: 'Poppins', sans-serif !important;
        color: #DD2B2C;
        text-align: center;
    }
.wpara{
   
        text-align: center;
        font-size: 14px;
        color: black;
        font-family: 'Poppins', sans-serif !important;
    
}

#imgbox img {
    text-align: center;
   
    width: 28%;
}

div#imgbox {
    padding-top: 30px !important;
}

h1.contact-heading {
    font-family: 'Poppins', sans-serif !important;
    color: #dd2b2c;
    font-size: 32px;
    font-weight: 700;
  
}


input#name {
    border: none;
    font-family: 'Poppins', sans-serif !important;
    border-bottom: 1px solid #D8D8D8;
    border-radius: none;
    border-radius: 0px;
    padding-bottom: 5px;
    width: 357px;
    font-size: 14px;
    font-weight: 300;
    
}


ul.serviceslist {
    list-style-type: none;
    padding-left: -14px;
    margin-left: -41px;
    color: gray;
    font-size: 14px;
    font-family: 'Poppins', sans-serif !important;
}

h3.fsevices {
    font-family: 'Poppins', sans-serif !important;
    font-size: 16px;
    color: Gray;
}

h3.fabout {
    font-family: 'Poppins', sans-serif !important;
    font-size: 16px;
    color: Gray;
}



h3.fquick{
    font-family: 'Poppins', sans-serif !important;
    font-size: 16px;
    color: Gray;
}

input#email {
    border: none;
    font-family: 'Poppins', sans-serif !important;
    border-bottom: 1px solid #D8D8D8;
    border-radius: none;
    border-radius: 0px;
    padding-bottom: 5px;
    width: 357px;
    font-size: 14px;
    font-weight: 300;
}

input#phone {
    border: none;
    font-family: 'Poppins', sans-serif !important;
    border-bottom: 1px solid #D8D8D8;
    border-radius: none;
    border-radius: 0px;
    padding-bottom: 5px;
    width: 300px;
    font-size: 14px;
    font-weight: 300;
    
}

input#message {
    font-family: 'Poppins', sans-serif !important;
    border: none !important;
    border-bottom: 1px solid #D8D8D8;
    border-radius: none;
    border-radius: 0px;
    padding-bottom: 5px;
    width: 357px;
    font-size: 14px;
    font-weight: 300;
}

textarea {
    font-family: 'Poppins', sans-serif !important;
    overflow: auto;
    resize: vertical;
    border: none;
    border-bottom: 1px solid #D8D8D8;
    width: 357px;
    font-weight: 300;
    font-size: 14px;

}

textarea#message {
    font-size: 15px;
    font-family: poppins;
}

label,
input,
select,
textarea {
  margin-bottom: 1rem !important; /* You can adjust this value to increase/decrease the spacing */
}

/* Add some extra margin between the message field and the submit button */
textarea {
  margin-bottom: 2rem !important;
}


button, select {
    text-transform: none;
    padding-top: 5px;
    padding-bottom: 5px;
    background: #D8D8D8;
    border: 0px;
    color: gray;
    font-weight: 300;
}

button.send {
    background: #dd2a2d;
    color: white;
    padding-left: 30px;
    padding-right: 30px;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 4px;
    font-family: 'Poppins', sans-serif !important;
    font-size: 14px;
}


form.form {
    padding-top: 28px;
}


h1.Contact {
    font-size: 32px;
    font-weight: 700;
    font-family: 'Poppins', sans-serif !important;
    padding-bottom: 20px;
    color: black;
    padding-left: 35px;
}

.col-sm-12.col-md-6.portion2 {
    text-align: center;
}


p.order {
   font-size: 16px;
    color: #DD2B2C;
    font-weight: 400;
    font-family: 'Poppins', sans-serif !important;
}

p.order a:link {
    color: black;
    font-weight: 700;
}

p.order a:visited {
    color: black;
    font-weight: 700;
}


p.num {
    font-size: 16px;
    color: #DD2B2C;
    font-weight: 400;
    font-family: 'Poppins', sans-serif !important;
    margin-top: -10px;
 
}

p.whatsapp-num {
    font-size: 16px;
    color: #DD2B2C;
    font-weight: 400;
    font-family: 'Poppins', sans-serif !important;
    margin-top: -15px;
    
}



img.contactimg {
    width: 100%;
    /* margin-left: -64px; */
}

div#contact {
    margin-left: 82px;
}


p.phone-number {
    font-size: 13px;
    font-family: 'Poppins', sans-serif !important;
    font-weight: 500;
}

p.address{
    font-size: 14px;
    font-family: 'Poppins', sans-serif !important;
    font-weight: 500;
}

.USA{
    font-size: 13px !important;
    font-family: 'Poppins', sans-serif !important;
    font-weight: 300;
    color: #6D6E70;
}

a.location-link {
    color: black;
    font-family: 'Poppins', sans-serif !important;
    font-size: 13px;
}

img.footer-logo {
    padding-top: 40px;
}

section.sec-04 {
    padding-top: 73px;
    padding-bottom: 70px;
}

.unq {
    text-align: center;
}

.services-back-img{
    text-align: right !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 100% !important;
    overflow: hidden !important;
    /* margin-bottom: -72%; */
    float: right;
    margin-top: -256px;
}

/* Mobile Responsivnes | Media Query Starting Here |  */

@media (min-width: 300px) and (max-width: 767.98px) { 
    
    #sec2back {
        display: none;
    }
    
    .footer-desc img {
    width: 36% !important;

}

    #sec3back{
        display: none;
    }

    body{
        overflow-x: hidden !important;
    }

    div#section-port {
        margin-left: -52px;
    }

    .tab-content {
        max-width: 49% !important;
        margin-top: 52px !important;
     
     
    }
    
    .card {
        
            /* padding-left: 100px !important;
            padding-right: 100px; */
            /* padding: 22%; */
            padding-top: 16px;
            /*margin-left: -79px;*/
        }

    .card-hd{
        padding-right: 10px !important;
    }
    
    
    div#contact {
        margin-left: -45px;
    }

    .Unique-para{
        color:#000;
        font-size: 12px;
        line-height: 20px;
    }
    
    h1.Contact {
        font-size: 32px;
        font-weight: 700;
        font-family: 'Poppins', sans-serif !important;
        padding-bottom: 20px;
        /*margin-left: 35px;*/
        margin-top: 33px;
        text-align: center;
        color: black !important;
    }
    
    p.order {
        font-size: 14px;
        color: #242424;
        font-weight: 200;
        font-family: 'Poppins', sans-serif !important;
        /*margin-left: 38px;*/
        text-align: center;
    }
    
    p.num {
        font-size: 14px;
        color: #DD2B2C;
        font-weight: 200;
        font-family: 'Poppins', sans-serif !important;
        margin-top: -20px;
        /*margin-left: 39px;*/
        text-align: center;
    }

    /*img.contactimg{*/
    /*    margin-left: 104px;*/
    /*}*/

    /*button.send{*/
    /*    margin-left: 131px;*/
    /*}*/
    
    img.footer-logo {
        padding-top: 40px;
        margin-left: 68px;
        padding-bottom: 37px;
    }
    
    h3.fsevices {
        font-family: 'Poppins', sans-serif !important;
        font-size: 16px;
        color: Gray;
        text-align: center;
    }
    
    ul.serviceslist {
        list-style-type: none;
        padding-left: -14px;
        margin-left: -41px;
        color: gray;
        font-size: 14px;
        font-family: 'Poppins', sans-serif !important;
        text-align: center;
    }
    
    h3.fquick {
        font-family: 'Poppins', sans-serif !important;
        font-size: 16px;
        color: Gray;
        text-align: center;
    }
    
    h3.fabout {
        font-family: 'Poppins', sans-serif !important;
        font-size: 16px;
        color: Gray;
        text-align: center;
    }
    
    p.phone-number {
        font-size: 13px;
        font-family: 'Poppins', sans-serif !important;
        font-weight: 500;
        text-align: center;
    }
    
    .Unique {
        font-family: 'Poppins', sans-serif !important;
        font-weight: 700;
        line-height: 50px;
        /* letter-spacing: 0em; */
        text-align: center;
        color: #DD2B2C;
        font-size: 15px;
    line-height: 25px !important;
    }

    div#section-port ul.nav.nav-pills {
        /* margin-left: 52px; */
        padding-left: 52px !important;
        justify-content: center !important;
    }
    ul.nav.nav-pills {
        justify-content: center;
        /* padding-left: 17px; */
        justify-content: space-around;
        /* padding-left: 14px; */
        max-width: 100% !important;
        margin-left: 3px !important;
        /* margin-top: 11px; */
    }
    
    ul.nav.nav-pills li a {
        background: #D9D9D9;
        color: black;
        font-size: 10px;
        padding-top: 1px !important;
        padding-bottom: 1px !important;
        padding-left: 3px !important;
        padding-right: 3px !important;
        border-radius: 5px;
        margin: 4px 2px 4px 2px !important;
    }
    
    .navbar-toggler:not(:disabled):not(.disabled) {
        cursor: pointer;
        /* color: black !important; */
        background: #dd2b2c;
        /* color: white; */
    }
    
    .topheading {
    font-family: 'Poppins', sans-serif !important;
    color: #de2b2c;
    font-size: 20px;
    font-weight: 700;
    margin-top: 153px;
    line-height: 26px;
    text-align: center;
    }
    
    .toppara {
        font-family: 'Poppins', sans-serif !important;
        font-size: 15px;
        font-weight: 500 !important;
        color: black;
        text-align: center;
    }
    
    .works {
        font-family: 'Poppins', sans-serif !important;
        font-size: 33px;
        font-weight: 700;
        line-height: 78px;
        letter-spacing: 0em;
        text-align: center;
        color: #DD2B2C;
    }
    
    .works-para {
        font-size: 16px;
        font-family: 'Poppins', sans-serif !important;
        color: #6D6E70;
        font-weight: 500px;
        line-height: 28px;
    }

    h1.contact-heading{
        text-align: center;
    }

}

/* Mobile Responsivnes | Media Query ends Here |  */
/* usama css start */


.carousel-control-prev {
    left: 0px;
    width: 4% !important;
    font-size: 25px !important;
}

.carousel-control-next {
    right: 0;
    width: 4% !important;
    font-size: 25px !important;
}

.main-new-slider .text-success {
    color: #dd2b2c !important;
    font-size: 26px;
}
.main-new-slider .carousel-indicators li {
    position: relative;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    width: 30px;
    height: 3px;
    margin-right: 3px;
    margin-left: 3px;
    text-indent: -999px;
    cursor: pointer;
    background-color: rgb(0 0 0 / 50%) !important;
}

.main-new-slider .carousel-indicators .active {
    background-color: #000 !important;
}


#ranking img {
  
    padding-top: 34px;
}

/*img#designfirms {*/
/*    width: 42% !important;*/
/*    margin-left: 26px;*/
/*}*/

.counter {
    margin-right: 4px;
}

.works-para{
    font-size: 15px;
    line-height: 22px;
}

/* span.plus{
    right: 19px;
}

span.plus4 {
    right: 28.1px;
}

span.plus5{
    right: 46.1px;
} */

.footer-desc {
    display: flex;
}

.footer-desc img {
    width: 13%;
    height: 78px !important;
    margin-right: 15px;
}

.footer-desc .test-desg h4 {
    font-family: 'Poppins', sans-serif !important;
    font-size: 18px;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0px !important;
    line-height: 20px;
}

.footer-desc .test-desg p {
    font-size: 16px;
    font-style: italic;
    color: #aaadad;
}

.footer-desc .test-desg {
    vertical-align: middle !important;
    padding-top: 11px;
}


ul.tab-data a li {
    display: inline-block;
    color: rgb(255, 255, 255);
    text-transform: capitalize;
    font-weight: 600;
    font-size: 12px;
    font-family: Poppins, sans-serif !important;
    padding: 4px 13px;
    background: rgb(180, 180, 180);
    border-radius: 4px;
}

ul.tab-data {
   LIST-STYLE: NONE;
    margin-top: 75px;
    PADDING: 0PX;
    position: absolute;
    top: 209px;
    text-align: center;
    margin-bottom: 150px;
    left: 119px;
}
section.pb-5.section-data {
    padding: 70px 0px 164px !important;
}
/* usama css end  */




/* Media query Starts for 280 - 600px | Hassan | Starts here */

@media (min-width: 280px) and (max-width: 600px) { 

    #sec-01{
   height: 74vh !important;
   background-repeat: no-repeat !important;
   background-size: cover;
}


span.plus{
    right: 19px;
}

span.plus4 {
    right: 28.1px;
}

span.plus5{
    right: 46.1px;
}

}

/* Media query Starts for 280 - 600px | Hassan | Ends here */



/* Services Page Styling Starts */

img.services-img {
    width: 100%;
    
    position: unset;
    text-align: right !important;
    float: left !important;
}

h1.services-heading {
    color: #DD2B2C;
    font-family: 'Poppins', sans-serif !important;
    font-size: 52px;
    font-weight: 700;
    margin-top: 176px;
    /* text-decoration: underline; */
    /* line-height: 23px; */
    border-bottom: 3.5px solid #dd2b2c;
    padding-bottom: 4px;
    width: 224px;
}
p.service-para {
    font-size: 16px;
    font-family: poppins;
    line-height: 19px;
    color: 
    #6D6E70;
}

img.Services-top-bkg-img {
    width: 100%;
    position: unset;
    text-align: right !important;
    float: left !important;
}

img.logo-icon {
    width: 60%;

}

img.web-icon {
    width: 60%;
    margin-left: 12px;
}

img.mobile-icon {
    width: 94%;
    margin-left: 12px;
}

img.branding-icon {
    width: 77%;
    margin-left: 40px;
}

img.motion-icon {
    width: 66%;
    margin-left: 48px;
}

div#icon-div {
    
    padding-left: 67px;
}



img.logo-portion {
    width: 68%;
    margin-top: -58px;
}

h2.head-logo {
    font-size: 42px;
    font-weight: 700;
    color: #dd2b2c;
    font-family: 'Poppins', sans-serif !important;
}

p.paralogo {
    font-size: 15px;
    font-weight: 500;
    color: #6D6E70;
    line-height: 21px;
}

div#logo-portion {
    /*padding-left: 80px;*/
    padding-top: 40px;
   
}

button.Watchcases {
    background: #dd2b2c;
    /* color: white !important; */
    padding: 4px 8px 4px 8px;
    padding-top: 4px;
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 4px;
    border-radius: 3px;
}

button.Watchcases a{
    color: white;
    font-family: 'Poppins', sans-serif !important;
    font-size: 14px;
    border-radius: 6px;
}

ul.logo-list {
    list-style-type: none;
    font-family: poppins;
    font-size: 14px;
    margin-left: -36px;
    color: #6D6E70;
}

section.service-sec-03 {
    background: none;
    background: white;
}

section.service-sec-02 .col-sm-12.col-md-5 {
    vertical-align: middle !important;
}

.main-image img {
    width: 60px;
    height: 75px;
}

.main-image {
    text-align: center;
}

div#icon-div {
    padding-left: 0px;
    display: block;
}

img.cartoon-portion {
    width: 100%;
}


img.motion-portion {
    width: 74%;
}


img.Brand-portion {
    width: 98%;
    margin-top: -40px;
}

.contact-02 .col-sm-12.col-md-6 {
    text-align: center;
}

.contact-02 .col-sm-12.col-md-6 img {
    width: 50%;
}

img.pak-landmark {
   
    vertical-align: end;
        margin-top: 277px;
}

/* .contact-02 
{
    background-image: url("img/Logo-05.png");
    background-repeat: no-repeat !important;
    background-size: contain;
} */



img.contact-bkg-img {
    width: 65% !important;
    z-index: 0;
    position: absolute;
    z-index: -1;
    top: -100px;
    left: -160px;
}




/* Services Page Styling Ends */


/*CONTACT US PAGE STYLING START*/
h5.company-name {
    font-size: 24px;
    color: black;
    font-family: poppins;
    text-align: center;
}

p.Address-office {
    font-size: 14px;
    font-family: poppins;
    font-weight: 700;
    color: gray;
    line-height: 23px;
}

/*CONTACT US PAGE STYLING  END*/



/* Company Page Styling Start */

section.company-sec{
    background-image: url("img/Company resize.png");
    background-size: 1233px 649px;
    background-repeat: no-repeat;
  
}

section.company-top {
    padding-top: 610px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: bottom;
}



h1.company-heading {
    /* margin-top: -159px !important; */
    position: relative;
    top: -340px;
    color: #de2b2c;
    font-size: 42px;
    font-weight: 700;
}

p.company-para {
    position: relative;
    top: -330px;
    font-weight: 500;
    color: #6D6E70;
    line-height: 20px;
}


p.para-company {
    color: black;
    font-weight: 400;
    font-family: 'Poppins', sans-serif !important;
    font-size: 15px;
}

section.counters {

    padding-top: 80px;
    padding-bottom: 80px;
    background: #ECECEC;

    margin-top: -100px;
}

.full-image{
    background-image: url("img/Rectangle 26.png");

    padding-top: 200px;
    padding-bottom: 200px;

background-repeat: no-repeat;
background-size: cover;

}

h1.awards {
    font-size: 52px;
    font-weight: 700;
    color: #de2b2c;
    font-family: poppins;
}

p.awards-para {
    /*padding-left: 60px;*/
    /*padding-right: 60px;*/
    text-align: center;
    font-family: 'Poppins', sans-serif !important;
        color: black;
    font-size: 15px;
}




/* Company Page Styling End */

section.awards-section {
    text-align: center;
    padding: 50px 0px;
    
}


/* Works Page Styling Starts */

section.works-top{
    background-image: url("img/Portfolio Banner 1.png");

    /*height: 100vh;*/
    background-size: cover;
    background-repeat: no-repeat;
    padding-bottom: 250px;
}

h1.heading-works {
    font-size: 42px;
    font-weight: 700;
    color: #de2b2c;
    padding-top: 94px;
    font-family: 'Poppins', sans-serif !important;
  
    
}


p.works-para {
    color: black;
    font-weight: 700;
    line-height: 20px;
    font-size: 13px;
   
}


img.works-bkg-img {
    width: 48% !important;
    z-index: 0;
    position: absolute;
    z-index: -1;
    top: -6px;
    left: -160px;
}

section.tabs-works .nav-tabs{
    justify-content: center;
}

.tabs-works .tab-content {
    text-align: center;
    /*margin-top: 52px !important;*/
}


ul.tab-ul {
    display: inline-flex;
    list-style-type: none;
    max-width: 100%;
}

ul.tab-ul-2 {
    
    list-style-type: none;

}

ul.tab-ul-2 {
    display: inline-flex !important;
    list-style-type: none;
  
    max-width: 100%;

    /* text-align: center; */
    
}

.tabs-works img {
    /* padding-left: 0px; */
    width: 95%;
    padding-top: 30px;
}


.nav-tabs .nav-link.active {
    background: #616161 !important;
    border-radius: 5px;
    color: white !important;
    padding: 2px 8px 3px 8px;
    font-size: 14px;
    font-family: 'Poppins', sans-serif !important;
    font-weight: 300;
}

.nav-tabs .nav-link{
    background: #D9D9D9 !important;
    border-radius: 5px;
    color: black !important;
    padding: 2px 6px 3px 6px;
    font-size: 14px;
    font-family: 'Poppins', sans-serif !important;
    font-weight: 300;
}

.nav-tabs .nav-link {
   
    margin-left: 9px;
}


section.tabs-works .nav-tabs {
    justify-content: center;
    border: none;
    
}

.nav-tabs .nav-item {
    padding-bottom: 11px !important;
}

section.tabs-works {
    padding-top: 50px;
    padding-bottom: 50px;
    background: #ECECEC;
}


/* Works Page Styling Ends */


/* Responsivness start Page Works */

@media (min-width: 280px) and (max-width: 767.98px) {
    
    
.tab-content {
    max-width: 100% !important;
    /* margin-left: 130px !important; */
    
}

/*.tabs-works img {*/
    /* padding-left: 0px; */
/*    width: 88%;*/
/*    padding-top: 20px;*/
/*}*/

.tabs-works img {
    /* padding-left: 0px; */
    width: 93%;
    padding-top: 20px;
}

ul.tab-ul-2 {
    /*display: flex;*/
    list-style-type: none;
    max-width: 100%;
    /* text-align: center; */
    /*margin-left: -19px;*/
}


ul.tab-ul {
    display: inline-flex;
    list-style-type: none;
    max-width: 100%;
    /*margin-left: -43px;*/
}


/*section.works-top {*/
    
/*    height: 68vh;*/
   
/*}*/

img.works-bkg-img {
    width: 48% !important;
    z-index: 0;
    position: absolute;
    z-index: 0;
    top: 49px;
    left: -87px;
}


 }

/* Responsivness End Page Works */




/* How it works page styling starts */

h1.top-head {
    text-align: center;
}


h1.tell-us {
    margin-top: 80px;
}

img.work-pic-1 {
    width: 100%;
    margin-top: 40px;
}



h1.top-head {
    text-align: center;
    padding-top: 40px;
    color: #de2b2c;
    font-size: 35px;
    font-weight: 700;
  
    font-family: 'Poppins', sans-serif !important;
}

h1.tell-us {
    margin-top: 80px;
    font-size: 44px;
    font-weight: 700;
    line-height: 40px;
    font-family: 'Poppins', sans-serif !important;
    color: #de2b2c;
}


p.para-how {
    color: black;
    font-weight: 600;
    font-size: 17px;
    font-family: 'Poppins', sans-serif !important;
}


.list-how{
    margin-left: 15px;;
}
.list-how li {
    font-size: 14px;
    font-weight: 400;
    font-family: poppins !important;
    color: black;

}

button.let-button {
    background: none;
}

a.let-text {
    color: #de2b2c;
    font-size: 16px;
    font-family: poppins;
    font-weight: 600;
}

img.work-pic-2 {
    width: 100%;
}

.how-works-02{
    padding: 40px 40px;
}

.finalize{

    margin-top: 80px;
    font-size: 35px;
    font-weight: 700;
    line-height: 48px;
    font-family: 'Poppins', sans-serif !important;
    color: #de2b2c;
    font-style: italic;

}


.work-pic-3{
  width: 100%;
  margin-top: 60px;
}

.how-works-top{
    padding-bottom: 40px;
}
/* How it works page styling ends */

/*For mobile company page view*/

@media (min-width: 300px) and (max-width: 767px) { 

h1.company-heading {
margin-top: -225px !important;
top: -326px;
background: white;

}

p.company-para{
    background: #fff;
}

input#name{

width: 280px;
}

input#email{
width: 280px !important;
}

textarea#message {
    width: 280px;
}

input#phone {
    width: 275px;
}

p.para-company{
    padding-left: 0px !important;
    padding-right: 0px !important;
}

p.address {
   
    text-align: center;
}

a.location-link{
  text-align: center;
}

a.location-link1 {
    text-align: center;
    margin-left: 106px;
}

a.location-link1:link {
    text-align: center;
    margin-left: 106px;
    color: #6d6e70 !important;
}

a.location-link1:visited {
    text-align: center;
  
    color: #6d6e70 !important;
}

div#mycounters{
    display: none;
}


}
    
    
    
    

/*For laptop landing page view end*/



@media (min-width: 1000px) and (max-width: 1200px){
    span.plus5{
        right: 167px
        
    }
}


@media (min-width: 768px) and (max-width: 980px){
    span.plus5 {
    right: 43.1px;
}


button.navbar-toggler {
    background: #dd2b2c !important;
    padding: 20px;
    color: white;
}

}

@media (min-width: 240px) and (max-width: 295px){
  div#mycounters{
    display: none;
}

button.navbar-toggler {
    background: #dd2b2c !important;
    padding: 20px;
    color: white;
    /*margin-left: 80px;*/
    /*margin-top: 30px;*/
}

.navbar-company img {
    width: 74% !important;
}

.navbar-brand{
       padding: 0px !important;
}

input#name{

width: 180px;
}

input#email{
width: 180px !important;
}

textarea#message {
    width: 180px;
}

input#phone {
    width: 175px;
}

form.form {
    margin-left: 0px;

}

/*h1.contact-heading{*/

/*    margin-left: 10px;*/
/*}*/

p.para-company {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

img.company-bottom-image {
    width: 171px;
}

/*div#contact {*/
/*    margin-left: 26px;*/
/*}*/

h1.company-heading{

    top: -519px;
    background: white;
}

p.company-para{
    top: -510px;
    background: white;
}

}



img.seo-portion {
    width: 84%;
}

img.smm-portion {
    width: 70%;
}

img.domain-portion {
    width: 56%;
}


.container-fluid{
  
   padding: 0px !important;
   overflow-x: hidden;

}    

body{
    overflow-x: hidden !important;
}

.pkg-hd ul.nav.nav-pills {
    text-align: center !important;
    /*padding-left: 58px;*/
}

h5.package-heading {
    font-family: 'Poppins', sans-serif !important;
    color: black;
    font-weight: 700;
}

p.mono {
    margin-bottom: 5px !important;
    text-transform: low !important;
    text-transform: capitalize;
    font-family: poppins;
    font-weight: 500;
    
}

.port-sec a.active {
    font-family: 'Poppins', sans-serif !important;
    background: #dd2b2c !important;
    padding: 3px 8px;
    color: white;
    font-size: 14px;
    border-radius: 4px;
    color: white !important;
}

/*.port-sec{*/
/*    padding-bottom: 17px;*/
/*}*/

h5.price {
    color: #333A3F;
    font-family: poppins;
    font-size: 44px !important;
    font-weight: 900;
}

p.suitable {
    font-family: 'Poppins', sans-serif !important;
    font-size: 14px !important;
    text-align: center;
    line-height: 2;
    font-weight: 700;
    padding-left: -5px;
    /* margin-left: -35px; */
    /* max-width: 110%; */
    margin-left: -40px;
}
    .pkg-list li:before {
    content: "\2713";
    margin-right: 0.5em;
    font-weight: 600;
   
}  

.pkg-list li {
    list-style-type: none;
    font-family: 'Poppins', sans-serif !important;
    text-align: left;
    /* margin-left: -31px; */
    padding-bottom: 8px;
    font-size: 12px;
    font-weight: 600;
}

.card:hover {
  background-color: #6D6E70;
}

.port-coll .card:hover > * {
  color: white !important;
}

.card:hover > h5.price {
  color: white !important;
}

.card:hover {
  transform: scale(1.05);
  transition: transform 0.3s ease;
}
                            /*GRAY SECTION STYLING START*/
.webpadding{
   padding-left: 50px !important;
   padding-right: 50px !important;
}                            
                            
                            
                            /*GRAY SECTION STYLING END*/



                            /*CONTACT US PAGE MOBILE RESPONSIVE START*/
@media (min-width: 250px) and (max-width: 767.98px){
.navbar-company img {
    width: 103% !important;
    height: 57px;
}

div#navbarSupportedContent {
    
     padding-left: 0px !important; 
    text-align: center ;

}

ul.navbar-nav li.btn-btn-header a.nav-link{
   
    margin: 10px 0px !important;
    
}

button.send{
    margin-left: 80px;
}

p.num {
    padding-bottom: 0px;
    padding-top: 10px !important;
    font-size: 16px;
    font-weight: 400;
    text-align: center;
}

p.whatsapp-num {
    padding-top: 10px;
    
}

p.Address-office {
    line-height: 18px !important;
}

img.pak-landmark {
    margin-top: 50px !important;
}

}                                
   
   @media (min-width: 1000px) and (max-width: 1200px) { 
       
/*    .navbar-company img {*/
/*    width: 362% !important;*/
/*}   */

/*.navbar-dark .navbar-nav .nav-link {*/
   
/*    font-size: 11px !important;*/
/*}*/

.navbar-dark .navbar-nav .nav-link {
    font-size: 10px !important;
}

.navbar-nav li.nav-item {
    padding-right: 4px !important;
}

div#navbarSupportedContent {
    /* text-align: end !important; */
    padding-left: 0px !important;
}

/*ul.navbar-nav li.btn-btn-header a.nav-link{*/
/*    margin-left: 3px !important;*/
/*}*/

p.Address-office {
    line-height: 21px !important;
}
       
   }  
   
   @media (min-width: 1200px) and (max-width: 1500px) { 
       .navbar-nav li.nav-item {
    padding-right: 5px !important;
}

.navbar-dark .navbar-nav .nav-link {
   
    font-size: 13px !important;
  
}

/*ul.navbar-nav li.btn-btn-header a.nav-link {*/
/*    margin-left: 6px !important;*/
/*}*/



       
   }
   
   .faq_details p {
    font-size: 16px;
    font-family: poppins;
}
      
      div#navbarSupportedContent{
          padding-left: 13%;
      } 
      /*CONTACT US PAGE MOBILE RESPONSIVE END*/
      
      @media (min-width: 240px) and (max-width: 280px){
          .card{
              padding: 0px !important;
          }
          
          a.order-now.mn-dsc-btn{
              border: none !important;
             
          }
      }
      
      
   .carousel-indicators .mb-0{
  margin-bottom: -40px !important;
      
  }   
  
  .lead{
      font-size: 14px !important;
  }
      
      
       @media (min-width: 300px) and (max-width: 767px){
         
          
          ul.tab-data{
              left: 0px !important;
             
          }
          
          a.order-now.mn-dsc-btn {
   
    font-size: 12px !important;
   
   
}

.lead {
    font-size: 10px !important;
}
      }
      
.col-under{
    background-image: url("img/Videoback.png");
    background-repeat: no-repeat;
    background-size: cover;
    height: 572px;
    justify-content: center;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 30px;
    
}

.col-md-12.main-under {
    margin-top: 40px;
    padding-left: 0px;
    padding-right: 0px;
}

.pro-div {
    display: flex;
    justify-content: space-between;
    padding-bottom: 10px;
}
  
  .readmore {
    text-align: center;
}  
    h1.prof {
   
    font-family: poppins;
    text-transform: uppercase;
    color: #dd2b2c;
    font-size: 20px;
    
}  

.pro-div img {
    width: 18%;
    height: 85px;
}

.cards-2 .col-md-4 {
    padding-top: 20px;
    padding-bottom: 20px;
    background: #F2F2F2;
    margin-top: 24px;
}

.cards-2 .col-md-4 img {
    padding-top: 20px;
}

p.digital-para {
    color: white;
    font-family: poppins;
    margin-right: 62px;
    font-size: 16px;
    margin-bottom: 0px;
}

.digital-div {
    display: flex;
    /* align-items: center; */
    justify-content: center;
        padding-top: 50px;
}

.readmore a {
    color: black;
    font-weight: 600;
    font-size: 14px;
    font-family: poppins;
}
     
     .readmore {
    border-top: 1px solid #D9D9D9;
    padding-top: 10px;
} 

     section.video-secion {
         padding-bottom: 60px;
    /* background-image: linear-gradient(to top, #DD2B2C 40%, #fff6f6 60%); */
    background-image: linear-gradient(to top, rgba(221,43,44,1) 40%, rgba(221,43,44,0) 40%);
    /*padding-left: 200px !important ;*/
    /*padding-right: 200px;*/
} 
a.digital-butt {
    background: white;
    font-size: 13px;
    padding: 5px 14px;
    /* color: red; */
    font-family: poppins;
    color: #dd2b2c;
}

h1.talk-bus {
    font-size: 52px;
    color: white;
    font-family: poppins;
    font-weight: 700;
    padding: 30px 0px;
}



a.nav-link.get-a-quote {
    background: #dd2b2c;
    color: white !important;
    font-family: poppins;
    font-size: 15px;
    font-weight: 600;
    padding: 1px 11px !important;
    /* line-height: 8px; */
}

li.nav-item {
    vertical-align: middle !important;
}

/*a.nav-link {*/
/*    padding: 0px 5px !important;*/
/*}*/


.navbar-brand{
    padding: 0px !important;
}

a.nav-link {
    color: black !important;
    font-family: poppins;
    font-size: 15px !important;
    font-weight: 600 !important;
}

.red-div{
    padding-left: 57px;
    padding-top: 100px;
    padding-bottom: 52px;
    margin-top: -97px;
    position: relative;
    z-index: 0;
    width: 92%;
}

.upper-part{
    background-image: url("img/Rectangle 47.png");
    text-align: left;
    /* padding: 1px 0px; */
    background-size: 287px 210px;
    position: relative;
    z-index: 1;
    /* padding-bottom: 16px; */
    /* margin-left: 30px; */
    background-repeat: no-repeat;
    background-position-x: 58px;
    background-position-y: -10px;
    padding-left: 46px;

}

section.new-contact {
    padding-bottom: 45px;
}

h1.ball {
   font-size: 32px;
    font-family: poppins;
    color: #DD2B2C;
    /* padding: 48px 0px; */
    padding-top: 38px;
    padding-bottom: 51px;
    /* margin-left: -30px; */
    line-height: 50px;
    padding-bottom: 63px;
    padding-left: 54px;
}


p.ask-u {
    color: white;
    font-size: 16;
    font-family: poppins;
    line-height: 20px;
}

p.tls-email {
    font-size: 22px;
    font-family: poppins;
    color: white;
    font-weight: 400;
}

a.btn-chat {
   background: #F2F2F2;
    color: gray;
    font-family: poppins;
    font-size: 14px;
    font-weight: 600;
    padding: 4px 16px;
    border-radius: 4px;
    color: #dd2b2c !important;
    
}

.mn-div {
    margin-top: -165px;
}



#phone::placeholder {
  color: black;
  font-weight: 500;
}

#name::placeholder {
    font-family: poppins;
    font-size: 15px;
}

#email::placeholder {
    font-family: poppins;
    font-size: 15px;
}

textarea#message::placeholder {
    font-family: poppins;
    font-size: 15px;
}


.border-div{
    background: url('img/Rectangle 37.png');
    background-repeat: no-repeat;
 
    background-position-y: 16px;
    background-size: contain;
}

.col-md-12.main-under {
   
    padding-left: 22px;
    padding-right: 22px;
}


.col-under a img {
    /* border: 10px solid red; */
    /* border-radius: 40px; */
    background: #ffffffab;
    border-radius: 70px;
    padding: 5px;
}


.col-under {
  position: relative;
  overflow: hidden;
}

.col-under:before,
.col-under:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
}

/*.col-under:before {*/
/*  background-color: #dd2b2c;*/
/*  mix-blend-mode: multiply;*/
/*}*/

/*.col-under:hover:before {*/
/*  opacity: 0.5;*/
/*}*/

.col-under:after {
  background-color: #fff;
}

.col-under:hover:after {
  opacity: 0.1;
}

#imgbox .col-sm-12.col-md-4:hover .wpara {
  text-shadow: 1px 1px 2px rgba(0,0,0,0.2);
}


i.fa.fa-phone.tabs {
    padding: 2px;
    font-size: 10px;
    margin-right: 2px;
    border-radius: 2px;
}

i.fas.fa-comment-dots {
    color: #3a3a3a;
    font-size: 14px;
}

.card:hover i.fas.fa-comment{
    color: white !important;
}

.text {
    text-align: center;
    padding-top: 40px;
}

.cards-2 .col-md-4:hover{
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
  transform: translateY(-3px);
  transition: box-shadow 0.4s ease-in-out, transform 0.4s ease-in-out;
}

h1.Unique-people {
    font-weight: 700;
    line-height: 64px;
    letter-spacing: 0em;
    text-align: center;
    color: #DD2B2C;
    font-family: poppins;
    font-size: 52px;
    padding-bottom: 24px;
}


p.testimonial {
    margin-bottom: 17px;
    font-size: 16px;
    font-weight: 300 !important;
    line-height: 1.46428571;
    color: #000000 !important;
    font-family: poppins;
    text-style: normal !important;
    font-style: normal !important;
    font-weight: 500 !important;
}

.main-new-slider .carousel-indicators .active {
    background-color: #DD2B2C !important;
}

.main-new-slider .carousel-indicators li{
    margin-right: 30px !important;
}


i.fa.fa-angle-left.text-dark.text-lg {
    /* color: #6D6E70 !important; */
    font-size: 30px;
}

i.fa.fa-angle-right.text-dark.text-lg {
    /* color: #6D6E70 !important; */
    font-size: 30px;
}


img.testimonial-border {
    width: 100%;
    margin-top: 35px;
}


li.head p {
    font-family: 'Poppins';
    color: #de2b2c;
    font-size: 14px;
    font-weight: 600;
}


li.but {
    /* margin-right: 21px; */
    font-family: 'Poppins';
    color: #de2b2c;
    font-size: 14px;
    font-weight: 600;
   margin-right: 8px;
    margin-left: 8px;
}

.ul-but{
       display: flex;
    list-style-type: none;
  
    margin-right: 5px !important;
   
    padding: 0px;
}

.but a {
    border: 1px solid #de2b2c;
    padding: 2px 10px;
    border-radius: 50px;
}

.but a:link{
    color: #de2b2c;
} 

.but a:visited{
    color: #de2b2c;
}



 @media (min-width: 1000px) and (max-width: 1100px) { 
     
     a.nav-link{
         margin-right: 5px !important;
     }
     
 }
 
  @media (min-width: 1100px) and (max-width: 1200px) { 
     
     a.nav-link{
         margin-right: 5px !important;
     }
     
 }
 
 
 @media (min-width: 1200px) and (max-width: 1500px){ 
     
     a.nav-link{
         margin-right: 5px !important;
     }
     
 }
 
 
 a#contact-but {
    padding: 3px 9px !important;
    background: transparent;
    border: 1.5px solid #de2b2c;
    color: #de2b2c !important;
}
 
 a#contact-but:hover{
     background: #de2b2c;
     color: white !important;
 }


/*cursor animation css start */

:root {
   --white-rbg-color: 245, 0, 4;
   --green-rbg-color: 245, 0, 4;
}

.cursor {
    width: 4px !important;
    height: 1px !important;
    border: 11px solid rgba(var(--white-rbg-color), .8);
    border-radius: 74%;
    position: absolute;
    transition-duration: 120ms;
    transition-timing-function: ease-out;
    animation: cursor-animate 537ms infinite alternate;
    z-index: 11111;
}

.cursor::after {
    content: "";
    width: 107px;
    height: 107px;
    border: 14px solid rgba(var(--white-rbg-color), .2);
    border-radius: 50%;
    position: absolute;
    top: -53px;
    left: -54px;
    animation: cursor-animate-2 550ms infinite alternate;
}


/*.cursor::after {*/
/*   content: "";*/
/*   width: 40px;*/
/*   height: 40px;*/
/*   border: 15px solid rgba(var(--white-rbg-color), .2);*/
/*   border-radius: 50%;*/
/*   position: absolute;*/
/*   top: -25px;*/
/*   left: -25px;*/
/*   animation: cursor-animate-2 550ms infinite alternate;*/
/*}*/


/*Modificador*/
.cursor--expand {
   animation: cursor-animate-3 550ms forwards;
   border: 10px solid rgb(var(--green-rbg-color));
}

.cursor--expand::after {
   border: 15px solid rgba(var(--green-rbg-color), .3);
}

/*Keyframes*/
@keyframes cursor-animate {
   from {
      transform: scale(.30);
   }

   to {
      transform: scale(1.05);
   }
}

@keyframes cursor-animate-2 {
   from {
      transform: scale(1);
   }

   to {
      transform: scale(.3);
   }
}

@keyframes cursor-animate-3 {
   0% {
      transform: scale(1);
   }

   50% {
      transform: scale(3);
   }

   100% {
      transform: scale(1);
      opacity: 0;
   }
}


/*cursor animation end*/
.mn-lst-btn{
    display:none !important;
}
div#eCommercePackages .card-image {
    height: 200PX !important;
}
div#BRANDING .card-image{
    height: 200PX !important;
}

