body {

    font-size: 14px;

    font-weight: 400;

    color: #050224;

    font-family: poppins, sans-serif;

    line-height: 30px

}



a {

    text-decoration: none

}



.navbar-dark .navbar-nav .nav-link i {

    background: #fff;

    color: #000;

    font-size: 18px;

    margin-right: 6px;

    width: 26px;

    height: 26px;

    border-radius: 50%;

    text-align: center;

    line-height: 26px

}



.navbar-dark .navbar-nav .nav-link {

    color: #fff

}



.bg-dark {

    background-color: #000 !important

}



.top-banner {

    background: #000;

    padding-top: 100px;

    padding-bottom: 50px

}



.form {

    background: #000;

    border-radius: 5px

}



.form h4 {

    background: #fff;

    color: #080331;

    font-size: 18px;

    font-weight: 600;

    border-top-left-radius: 5px;

    border-top-right-radius: 5px

}



.form i {

    background: #000;

    color: #fff;

    font-size: 16px;

    width: 26px;

    height: 26px;

    border-radius: 50%;

    text-align: center;

    line-height: 26px

}



.form h2 {

    color: #fff;

    font-size: 24px;

    font-weight: 700

}



.form-control {

    height: 45px

}



.form-control::placeholder {

    font-size: 14px

}



.btn-success,

.btn-success:disabled,

.btn-success.disabled,

.btn-success:disabled {

    background: 0 0;

    color: #fff;

    border-right: 1px solid #fff;

    background: #000;

    border-color: #000;

    transition: all .5s;

    opacity: 1

}



.alert-success {

    font-size: 15px;

    padding: 5px

}



.btn-success:focus,

.btn-success:hover {

    background: #fff;

    border-color: #ff3b00;

    color: #ff3b00;

    outline: 0;

    box-shadow: none;

    transition: all .5s

}



.form-control:focus {

    border-color: #060228;

    box-shadow: 0 0 0 .25rem rgb(6, 2, 40, .5)

}



.heading h3 {

    font-size: 40px;

    color: #000;

    font-weight: 600

}



.heading::after {

    content: "";

    width: 100px;

    height: 2px;

    background: #ff3b01;

    margin-top: 20px;

    display: block;

    margin: auto

}



.package {

    border: 1px solid #ff3b01;

    background: #f7f7f7;

    transition: all .5s;

    border-radius: 5px;

    box-shadow: 0 0 10px rgb(0 0 0 / 14%)

}



.package h5 {

    font-size: 26px;

    color: #080231;

    background: #ffd9ce;

    border-top-left-radius: 5px;

    border-top-right-radius: 5px

}



.package h3 {

    background: #ff3b01;

    border-bottom: 1.5px dashed #fff;

    border-top: 1.5px dashed #fff;

    font-weight: 800;

    font-size: 32px;

    color: #fff;

    transition: all .5s

}



.package ul li {

    font-size: 14px;

    color: #060226;

    border-bottom: 1px solid #dadfe3;

    padding: 1px 0

}



.package ul li:last-child {

    border: 0

}



.package ul li i {

    margin-right: 7px;

    color: #ff3b01

}



.mid-area {

    margin-top: 50px

}



.btn-primary {

    color: #fff;

    border-radius: 0;

    background: #ff3b01;

    border-color: #ff3b01;

    font-weight: 600;

    letter-spacing: .5px;

    transition: all .5s;

    font-size: 16px

}



.package .btn-primary {

    padding: 0;

    border-radius: 3px

}



.btn-primary:focus,

.btn-primary:hover {

    background: #fff;

    border-color: #ff3b01;

    color: #ff3b01;

    transition: all .5s;

    outline: 0;

    box-shadow: none

}



.package:hover {

    background: #000;

    transition: all .5s;

    box-shadow: 0 4px 7px #030011

}



.package:hover.package ul li {

    color: #fff !important;

    transition: all .5s

}



.package:hover .btn-primary {

    background: #fff;

    color: #ff3b01;

    transition: all .5s

}



.package:hover.package h3 {

    background: #ff3b01;

    color: #fff;

    border-bottom: 1.5px dashed #ff3b01;

    border-top: 1.5px dashed #ff3b01;

    transition: all .5s

}



.package:hover.package h5 {

    background: #000;

    color: #fff

}



#active,

#active.package h5,

#active.package ul li {

    background: #000;

    color: #fff !important

}



#active .btn-primary {

    background: #fff;

    color: #ff3b01;

    transition: all .5s

}



#active {

    box-shadow: 0 4px 7px #030011

}



footer {

    margin-top: 50px;

    background: #000

}



.top-footer {

    background: #fc3902;

    color: #fff;

    padding: 25px 0 !important

}



.icon-width {

    max-width: 11%

}



.refer h6 {

    font-weight: 300

}



footer ul li {

    color: #fff;

}



.footer ul li i {

    color: #ff3b01;

    font-size: 8px;

    vertical-align: middle;

    margin-right: 6px

}



.f-contact {

    background: #1c1c1c;

    color: #fff

}



p {

    line-height: 25px

}



.f-contact h4 {

    font-size: 18px

}



.all-button {

    position: fixed;

    bottom: 0;

    left: 50%;

    transform: translateX(-50%);

    z-index: 99

}





.modal-title b {

    color: #ff3b01;

    font-weight: 800

}



.modal-body label {

    font-weight: 500

}



.btn-danger {

    background: #bd3207;

    border-color: #bd3207;

    font-weight: 600;

    letter-spacing: .5px

}



.btn-danger:focus,

.btn-danger:hover {

    background: #0c0056;

    border-color: #0c0056;

    color: #fff;

    outline: 0;

    text-shadow: none;

    outline: 0;

    box-shadow: none

}





.desk-whats {

    position: fixed;

    bottom: 20px;

    right: 20px

}



.btn-success:disabled {

    color: #ff3b01;

    background-color: #000;

    border-color: #000;

    opacity: .9

}



.client-happy {

    background: #ff3b01;

    color: #fff;

    position: relative;

    top: -50px;

    border-radius: 5px;

    box-shadow: 0 5px 10px rgb(30 30 30)

}



.client-happy .row div:not(:last-child) {

    border-right: 1px solid

}



.client-happy h3 {

    font-weight: 800;

    font-size: 40px

}



.client-happy h6 {

    font-size: 20px;

    font-weight: 400

}



.mid-area1 {

    margin-top: 0

}



@media (max-width:768px) {

    .form h2 {

        font-size: 22px

    }



    .form-control {

        font-size: 14px

    }



    .heading h3 {

        font-size: 35px

    }



    .icon-width {

        max-width: 14%

    }



    .refer {

        margin-top: 30px

    }



    .client-happy h3 {

        font-size: 35px

    }



    .client-happy h6 {

        font-size: 18px

    }



    .mid-area1 {

        margin-top: 0

    }

}



@media (max-width:600px) {

    .form {

        margin-top: 30px

    }



    .icon-width {

        max-width: 19%

    }



    .f-contact {

        margin-bottom: 0

    }



    .enquire .btn {

        font-size: 20px

    }



    #active .features a {

        color: #fff

    }



    .call a {

        border-radius: 0;

        border: 0;

        background: #20107d;

        height: 50px;

        line-height: 50px;

        display: block;

        color: #fff;

        font-size: 20px

    }



    .enquire .btn {

        border-radius: 0;

        height: 50px;

        background: #ff3b00;

        border: 0

    }



    .features {

        margin: 12px 0

    }



    .features a {

        color: #0c0056;

        padding: 10px;

        font-weight: 600;

        font-size: 16px

    }



    .package:hover .features a {

        color: #fff

    }



    .package h5 {

        font-size: 22px

    }



    .package h3 {

        font-size: 26px

    }



    .mid-area {

        margin-top: 30px

    }



    .client-happy h3 {

        font-size: 30px

    }



    footer {

        margin-top: 60px

    }



    .mid-area1 {

        margin-top: 0

    }

}



@media (max-width:480px) {



    .package h5 {

        font-size: 18px

    }



    .package h3 {

        font-size: 22px

    }



    .btn-primary {

        font-size: 14px

    }



    .heading h3 {

        font-size: 24px

    }



    .mid-area {

        margin-top: 50px

    }



    .icon-width {

        max-width: 100%;

        text-align: center

    }



    .icon-width img {

        margin-bottom: 20px

    }



    .refer h6 {

        font-size: 14px

    }



    .call-icon {

        text-align: center

    }



    .navbar-brand img {

        width: 105px;

        padding-bottom: 10px

    }



    .call a {

        height: 45px;

        line-height: 45px

    }



    .enquire .btn {

        font-size: 15px;

        height: 45px

    }



    .bg-dark {

        height: 60px

    }



    .client-happy {

        top: 0;

        border-radius: 0

    }



    .top-banner {

        padding-bottom: 50px

    }



    .client-happy h3 {

        font-size: 25px

    }



    .client-happy h6 {

        font-size: 16px

    }



    .mid-area1 {

        margin-top: 50px

    }

}



@media (max-width:320px) {

    .bg-dark {

        height: 60px

    }

}



@media (max-width:767px) {

    .smt-0 {

        margin-top: 0 !important

    }

}



.navbar-nav li a {

    font-size: 15px

}



.clients .w-100 {

    border-radius: 5px;

    box-shadow: 0 0 10px rgb(0 0 0 / 14%)

}



.portfolio img {

    box-shadow: 0 0 10px rgb(0 0 0 / 14%)

}



.key-tags h1,

.key-tags h2,

.key-tags h3 {

    font-size: 1px;

    float: left;

    color: #000

}



.top-banner .heading::after {

    display: none

}



.top-banner .heading h3 {

    position: relative;

    z-index: 1;

    padding: 8px 0;

    margin: 0;

    font-size: 60px;

    font-weight: 700;

    line-height: 60px;

    color: #fff

}



.top-banner .heading h3:before {

    content: "";

    position: absolute;

    left: 0;

    top: 0;

    width: 30px;

    height: 100%;

    z-index: -1;

    background: #ff3b01

}



.top-banner .heading p {

    color: #fff;

    font-size: 18px;

    line-height: 25px;

    padding-top: 20px

}



.form {

    width: 380px;

    margin-left: auto;

    background: #ff3b01

}



.glow {

    font-size: 80px;

    color: #fff;

    text-align: center;

    border: 5px solid #fff

}



.service-card {

    margin-top: 10px;

    margin-bottom: 50px

}



.single-features-box {

    margin-top: 20px;

    background-color: #000;

    position: relative;

    z-index: 1;

    padding: 15px 35px;

    padding-top: 20px;

    -webkit-transition: .5s;

    transition: .5s;

    border-radius: 5px

}



.single-features-box .icon {

    color: #ff3b01;

    display: inline-block

}



.single-features-box .icon i::before {

    font-size: 30px

}



.single-features-box h3 {

    color: #fff;

    margin-top: 10px;

    padding-left: 10px;

    display: inline-block;

    font-size: 25px

}



.single-features-box .bar {

    background: #ff3b01;

    position: relative;

    z-index: 1;

    width: 65px;

    height: 3px;

    margin-top: 7px;

    margin-bottom: 20px;

    -webkit-transition: .5s;

    transition: .5s

}



.single-features-box .bar::after,

.single-features-box .bar::before {

    content: "";

    position: absolute;

    height: 100%;

    width: 3px;

    top: 0;

    background: #fff;

    -webkit-transition: .5s;

    transition: .5s

}



.single-features-box .bar::before {

    right: 20px

}



.single-features-box .bar::after,

.single-features-box .bar::before {

    background: #111

}



.single-features-box .bar::after,

.single-features-box .bar::before {

    background: #111

}



.single-features-box .bar::after {

    right: 10px

}



.single-features-box p {

    color: #fff

}



.single-features-box .dot-img {

    position: absolute;

    right: 5px;

    bottom: 5px;

    z-index: -1;

    -webkit-transition: .5s;

    transition: .5s

}



.single-features-box .dot-img img {

    -webkit-transition: .5s;

    transition: .5s

}



.single-features-box .dot-img img.white-dot {

    display: none

}



.single-features-box:hover {

    background: #ff3b01

}



.single-features-box:hover .icon {

    color: #fff

}



.single-features-box:hover .bar {

    background: #fff

}



.single-features-box:hover .bar::after,

.single-features-box:hover .bar::before {

    background: #ff3b01

}



.single-features-box.active,

.single-features-box.active:hover {

    background: #ff3b01

}



.single-features-box.active .icon,

.single-features-box.active:hover .icon {

    color: #fff

}



.single-features-box.active .bar,

.single-features-box.active:hover .bar {

    background: #fff

}



.single-features-box.active .bar::after,

.single-features-box.active .bar::before,

.single-features-box.active:hover .bar::after,

.single-features-box.active:hover .bar::before {

    background: #ff3b01

}



.single-features-box.active .dot-img img.white-dot,

.single-features-box:hover .dot-img img.white-dot {

    display: block

}



.single-features-box.active .dot-img img.color-dot,

.single-features-box:hover .dot-img img.color-dot {

    display: none

}



.usp {

    margin-bottom: 50px

}



.usp .single-services {

    margin-top: 20px;

    background: #000;

    position: relative;

    z-index: 1;

    padding: 20px 5px 20px 70px;

    transition: .5s;

    border-radius: 65px 5px 5px 65px

}



.single-services h3 {

    color: #fff;

    font-size: 15px;

    font-weight: 500;

    margin: 0;

    transition: .5s

}



.single-services h3 div {

    display: inline-block

}



.single-services .icon {

    background-color: #000;

    color: #ff3b01;

    position: absolute;

    left: 10px;

    top: 50%;

    z-index: -1;

    width: 45px;

    height: 45px;

    background: #fff;

    display: inline-block;

    text-align: center;

    border-radius: 50%;

    margin-top: -23px

}



.single-services .icon i {

    line-height: 45px

}



.single-services .icon i::before {

    font-size: 25px

}



.single-services .link-btn {

    position: absolute;

    right: 20px;

    top: 50%;

    color: #f9f9f9;

    display: block;

    margin-top: -12px;

    transition: .5s

}



.single-services .link-btn::before {

    font-size: 25px

}



.navbar-dark .navbar-brand img {

    width: 250px

}



@media (max-width:767px) {

    .navbar-dark .navbar-brand {

        margin-right: 0

    }



    .navbar-dark .navbar-brand img {

        width: 165px

    }



    .navbar-dark .navbar-nav .nav-link i {

        margin-right: 1px

    }



    .top-banner {

        padding-top: 80px

    }



    .top-banner .heading h3 {

        font-size: 40px;

        line-height: 40px

    }



    .top-banner .heading p {

        margin-bottom: 0

    }



    .top-banner .bnr-btn {

        margin-bottom: 20px

    }



    .form {

        width: 100%;

        margin: auto

    }



    .client-happy .row div:nth-child(2) {

        border-right: 0

    }



    .service-card {

        margin-top: 50px

    }



    .single-features-box {

        padding: 15px 25px

    }



    .usp .single-services {

        padding-left: 68px

    }



    .single-services .icon {

        width: 45px;

        height: 45px;

        margin-top: -23px

    }



    .single-services .icon i {

        line-height: 45px

    }



    .single-services .icon i::before {

        font-size: 25px

    }



    .single-services h3 div {

        display: inline-block

    }



    ul.list-unstyled {

        padding-left: 20px;

        position: relative

    }



    ul.list-unstyled li {

        font-size: 12px;

        line-height: 20px

    }



    ul.list-unstyled li i {

        position: absolute;

        left: 0;

        transform: translate(0, 5px)

    }

    footer ul.list-unstyled li{

        font-size:14px;

    }

}



@media (max-width:350px) {

    .navbar-dark .navbar-brand img {

        width: 125px

    }

}