*{
    margin: 0px;
    padding: 0px;
    font-family: 'Montserrat';
}

input, select, textarea {
    box-shadow: none;
    font-family: 'Montserrat Light';

}

input:focus,
select:focus, textarea:focus {
    box-shadow: none !important;

}

.nav-item a,
.nav-link.dropdown-toggle  {
    font-size: 15px;
    font-family: "Montserrat Regular";
    color: var(--primary-xlight);
    margin-right: 10px;
}

li.nav-item.dropdown.dropdown-mega
a.nav-link.dropdown-toggle.active {
    color: var(--primary-xlight) !important;
    font-weight: bolder !important;
    font-family: "Montserrat Bold";
}

a.nav-link:hover, .nav-item a.active,
.nav-link.dropdown-toggle.show{
    color: var(--primary-xlight) !important;
    font-weight: bolder !important;
    font-family: "Montserrat Bold";
}

.dropdown-toggle::after {
    display: none !important;
}

.small {
    font-size: 12px !important;
}

.bold {
    font-weight: bolder !important;
    font-family: "Montserrat Bold";
}

.hidden {
    display: none !important;
}

.contact {
    font-weight: bolder;
    font-family: "Montserrat Bold";
}

a {
    text-decoration: none;
}

.border-radius-10 {
    border-radius: 10px;
}

.border-radius-15 {
    border-radius: 15px;
}

.border-white {
    border: 1px solid var(--white);
}

.desktop-header {
    display: block !important;
}

.desktop-header div.man-nav-fixed{
    position: fixed;
    width: 100%;
    z-index: 1001;
    margin-top: -7rem;
}

.mobile-header {
    display: none !important;
}

.mega-item{
    border-bottom: 1px solid var(--primary) !important;
    padding: 0px !important;
}

.mega-item.active h6,
.mega-item.active p {
    color: var(--primary) !important;
}

.mega-item:hover h6,
.mega-item:hover p {
    color: var(--primary) !important;
}

.mega-item a h6{
    color: var(--primary-dark);
    font-family: "Montserrat Bold";
    font-size: 16px !important;
}

.mega-item a p{
    font-size: 16px !important;
}

img.service-img {
    height: 80vh !important;
    width: 100% !important;
}

.no-border {
    border: none !important;
}

.no-radius {
    border-radius: 0px !important;
}

.portfolio-pricing-sec {
    /* background-color: red !important; */
    border-left: 1px solid var(--primary) !important;
}

/*====== Page Title  */
.page-title{
    background-image: url("../img/page-title-bg.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding: 5rem;
    padding-left: 7rem;

}

/* Back to top Button */
#myBtn {
  display: none; /* Hidden by default */
  position: fixed;
  bottom: 120px;
  right: 30px;
  z-index: 99;
  border: none;
  outline: none;
  background-color: var(--primary-dark);
  cursor: pointer;
  padding: 14px 18px;
  border-radius: 50%;

}

#myBtn:hover {
  background-color: var(--primary); /* Add a dark-grey background on hover */
}


/*====== ANIMATIONS =======*/



/*===== REQUEST QUOTE  ========*/
.request-quote-close {
    position: absolute;
    left: 100%;
    background-color: transparent;
    border: none !important;
    padding: 0px !important;
}

.quote-body {
    background-color: var(--primary-dark);
}

.quote-form {
    background-color: var(--white);
    padding: 2rem;
    margin: 0rem 4rem;
    margin-bottom: 2rem;
    border-radius: 10px;
    margin-bottom: 3rem;
}

.quote-form input,
.quote-form select,
.quote-form textarea {
    padding: 0.7rem;
}

.quote-body-head {
    padding: 1rem 6rem;
    padding-top: 2rem;
}

.quote-body-head p small {
    font-size: 18px;
}

.modal-quote-pic {
    height: 300px;
}

.quote-body-footer {
    padding: 1rem 6rem;
    padding-top: 0rem;
}

.quote-body-footer p small {
    font-size: 18px;
}

/*===== search canvas  ====*/
.search-canvas {
    min-height: 100vh;
    background-color: #01018bce;
}

.search-canvas-body {
    padding: 10rem 18rem;
}

.search-canvas-input {
    display: flex;
    background-color: transparent;
}

.search-canvas-input input,
.search-canvas-input input:focus {
    background-color: transparent;
    border: none;
    border-bottom: 1px solid var(--white);
    color: var(--white);
    font-size: 20px;
}

.search-canvas-input input::placeholder {
    color: var(--white);
}

.search-canvas-input button {
    border: none !important;
    box-shadow: none !important;
}

.canvas-search-header {
    padding-top: 7rem;
}


/*======= Footer =========*/
.footer-form{
    border-radius: 10px;
}


.footer-form input::placeholder {
    color: var(--white);
    font-size: 14px;
}

.footer-form button{
    border: none !important;
    box-shadow: none !important;
}

.footer-action a.consult {
    padding: 15px 25px !important;
}

.footer-link a,
footer p {
    font-family: "Montserrat Regular";
    font-weight: 400px;
    font-size: 16px;
}

.footer-link a:hover {
    color: var(--primary) !important;
}

.footer-link a.active {
    color: var(--primary) !important;
    font-family: "Montserrat Bold";
}



/*==============================
    MOBILE SCREENS
================================*/

@media only screen and (max-width: 600px) and (min-width: 200px) {

    .ps {
        padding: 0.27rem !important;
    }

    .desktop-header {
        display: none !important;
    }

    .mobile-header {
        display: block !important;
    }

    .mobile-header {
        display: flex !important;
        justify-content: space-between !important;
        width: 100%;
        z-index: 1001;
    }

    body {
        /* padding-top: 100px;  */
        margin: 0px;
        padding-top: 60px !important;
    }

    img.mobile-logo{
        width: 200px;
    }

    .offcanvas-header {
        padding: 0px 15px 0px 2px  !important;
    }

    .offcanvas-body {
        padding: 0px !important;
    }
    .canvas-search-form {
        display: flex;
        border-radius: 10px;
        padding: 10px;
    }

    .canvas-search {
        font-size: 16px !important;
        font-weight: 400;
        background-color: var(--grey-light) !important;
    }
    .canvas-saerch-btn {
        box-shadow: none !important;
        border: none !important;
    }

    .canvas-nav .nav-item a,
    .canvas-nav .nav-item a span{
        color: var(--grey-dark) !important;
        font-weight: 700 !important;
        font-family: "Montserrat Bold";
        font-size: 16px;
    }

    .canvas-nav li.nav-item {
        padding: 12px 24px;
    }

    .canvas-nav a.nav-link.active,
    .canvas-nav .submenu-item.active {
        color: var(--primary) !important;
        font-weight: bolder;
        font-family: "Montserrat Bold";
    }

    a.submenu-item {
        font-size: 15px;
    }

    .cavas-plus {
        display: flex;
        justify-content: flex-end;
    }

    .canvas-nav .accordion-button::after {
        background-image: url("../img/icons/minus.png") !important;
        background-size: auto;
        background-position: center;
        transition: transform 0.2s ease-in-out;
        box-shadow: 5px 5px 5px 5px rgba(0, 0, 0, .075) !important;
        width: 35px;
        height: 35px;
        padding: 10px;
        border-radius: 5px;

    }

    .canvas-nav .accordion-button.collapsed::after {
        background-image: url("../img/icons/plus.png") !important;
    }

    .canvas-nav .accordion-button.collapsed .accordion-header {
        background-color: var(--white) !important;
    }

    .canvas-nav .accordion-button {
        color: var(--primary) !important;
        font-family: "Montserrat Bold";
        background-color: var(--white) !important;
        border: none !important;
        box-shadow: none !important;
        border-bottom: 1px solid var(--grey-light);
    }

    .canvas-nav .accordion-button.collapsed {
        color: var(--grey-dark) !important;
    }

    .canvas-nav .accordion-body {
        padding: 0 !important;
        width: 100% !important;
        padding-left: 15px !important;
    }



    /*===== search canvas  ====*/
    .search-canvas {
        min-height: 100vh;
        background-color: #01018bce;
    }

    .search-canvas-body {
        padding: 10rem 18rem;
    }

    .search-canvas-input {
        display: flex;
        background-color: transparent;
    }

    .search-canvas-input input,
    .search-canvas-input input:focus {
        background-color: transparent;
        border: none;
        border-bottom: 1px solid var(--white);
        color: var(--white);
        font-size: 20px;
    }

    .search-canvas-input input::placeholder {
        color: var(--white);
    }

    .search-canvas-input button {
        border: none !important;
        box-shadow: none !important;
    }

    .canvas-search-header {
        padding-top: 7rem;
    }

      /*====== Page Title  */
    .page-title{
        padding: 1rem;
        padding-top: 3rem;

    }


    /*======== Footer */

    .footer-form input{
        background-color: var(--bg-primary-medium) !important;
    }

    .footer-action {
        display: flex;
        flex-direction: column;
    }

    .footer-action a {
        margin-top: 10px;
    }



    /*===== REQUEST QUOTE  ========*/
    .request-quote-close {
        left: 90%;
        z-index: 1001;
    }

    .quote-form {
        padding: 0.6rem;
        margin: 0rem 1rem;
        margin-bottom: 2rem;
    }

    .quote-body-head {
        padding: 1rem 1rem;
    }

    .modal-quote-pic {
        height: 200px;
    }

    .quote-body-footer {
        padding: 1rem 1rem;
        text-align: center;
    }

}

/*==============================
    IPAD SCREENS
================================*/
@media only screen and (max-width: 1080px) and (min-width: 375px) {

    .desktop-header {
        display: none !important;
    }

    .mobile-header {
        display: block !important;
    }

    .mobile-header {
        display: flex !important;
        justify-content: space-between !important;
        width: 100%;
        z-index: 1001;
    }

    body {
        padding-top: 100px;
    }

    img.mobile-logo{
        width: 200px;
    }

    .offcanvas-header {
        padding: 0px 15px 0px 2px  !important;
    }

    .offcanvas-body {
        padding: 0px !important;
    }
    .canvas-search-form {
        display: flex;
        border-radius: 10px;
        padding: 10px;
    }

    .canvas-search {
        font-size: 16px !important;
        font-weight: 400;
        background-color: var(--grey-light) !important;
    }
    .canvas-saerch-btn {
        box-shadow: none !important;
        border: none !important;
    }

    .canvas-nav .nav-item a,
    .canvas-nav .nav-item a span{
        color: var(--grey-dark) !important;
        font-weight: 700 !important;
        font-family: "Montserrat Bold";
        font-size: 16px;
    }

    .canvas-nav li.nav-item {
        padding: 12px 24px;
    }

    .canvas-nav a.nav-link.active,
    .canvas-nav .submenu-item.active {
        color: var(--primary) !important;
        font-weight: bolder;
        font-family: "Montserrat Bold";
    }

    .cavas-plus {
        display: flex;
        justify-content: flex-end;
    }

    .canvas-nav .accordion-button::after {
        background-image: url("../img/icons/minus.png") !important;
        background-size: auto;
        background-position: center;
        transition: transform 0.2s ease-in-out;
        box-shadow: 5px 5px 5px 5px rgba(0, 0, 0, .075) !important;
        width: 35px;
        height: 35px;
        padding: 10px;
        border-radius: 5px;

    }

    .canvas-nav .accordion-button.collapsed::after {
        background-image: url("../img/icons/plus.png") !important;
    }

    .canvas-nav .accordion-button.collapsed .accordion-header {
        background-color: var(--white) !important;
    }

    .canvas-nav .accordion-button {
        color: var(--primary) !important;
        font-family: "Montserrat Bold";
        background-color: var(--white) !important;
        border: none !important;
        box-shadow: none !important;
        border-bottom: 1px solid var(--grey-light);
    }

    .canvas-nav .accordion-button.collapsed {
        color: var(--grey-dark) !important;
    }

    .canvas-nav .accordion-body {
        padding: 0 !important;
        width: 100% !important;
        padding-left: 15px !important;
    }

    /*====== Page Title  */
    .page-title{
        padding: 1rem;
        padding-top: 4rem;
        margin-top: -2rem;
        padding-bottom: 2rem;

    }

    /*============= FOOTER  */
    .footer-form input{
        background-color: var(--bg-primary-medium) !important;
    }


     /*===== REQUEST QUOTE  ========*/
    .request-quote-close {
        left: 90%;
        z-index: 1001;
    }

    .quote-form {
        padding: 0.6rem;
        margin: 0rem 1rem;
        margin-bottom: 2rem;
    }

    .quote-body-head {
        padding: 1rem 1rem;
    }

    .modal-quote-pic {
        height: 200px;
    }

    .quote-body-footer {
        padding: 1rem 1rem;
        text-align: center;
    }

}