* {

    padding: 0;

    margin: 0;

    font-family: sans-serif;

}



:root {

    --red: #A50000;

    --black: #3E3E3E;

}


.office-interior-details p{
	font-size: 18px;
    line-height: 26px;
}
a {

    text-decoration: none;

}



.top {

    background: #f1f1f1;

}



.btn {

    padding: 5px 10px;

    background: #fff;

    border: 1px solid #A51500;

    border-radius: 3px;

    color: #A51500;

    transition: 0.5s;

    font-size: 14px;

}





section {

    padding: 50px 0px;

}



@media(max-width: 767px) {

    section {

        padding: 20px 0px;

    }



}



/* banner content */

.heading {

    position: absolute;

    top: 0;

    left: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    width: 100%;

    height: 100%;

    z-index: 1;

    background: #4a101033;

}



.sub-heading {

    width: 70%;

    margin: auto;

    font-size: 24px;

    color: #ffff;

    background: transparent;

    text-align: center;

}



.sub-heading h1 {

    color: #ffff;

    font-size: 42px;

    font-weight: 300;

    transition-delay: 2s;

}



.sub-heading p {

    color: #ffff;

    font-weight: 300;

    transition-delay: 2s;

}



/* banner cont end */

.btn:hover {

    background: #A51500;

    color: #fff;

}



.img-fit {

    width: 100%;

}



.top div div div {

    padding: 10px 0px;

}



.top div div div a {

    text-decoration: none;

    color: #333;

    padding: 0px 15px;

    font-size: 14px;

}



.top div div div a i {

    color: #A51500;

    font-size: 20px;

}



.zero {

    padding: 0 !important;

}



.imgfit {

    width: 100%;

}



#bar {

    padding: 10px;

    background: #A51500;

    cursor: pointer;

}



#bar img {

    width: 50px;

}



.logo {

    width: 175px;

    padding: 10px;

    background: #f1f1f1;

}



#header {

    z-index: 999;

    background: #fff !important;

}



.hstatick {

    position: static;

    top: -150px;

    transition: 0.5s;

}



.hsticky {

    position: sticky;

    top: 0px;

    transition: 0.5s;

    animation: anim 950ms ease-in-out;

    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);

}



@keyframes anim {

    0% {

        transform: scale(0.95) rotateX(100deg) translateY(-95px);

    }



    100% {

        transform: scale(1);

    }



}



/* fixed bar */

#fixBox {

    position: fixed;

    top: 0;

    right: 0;

    width: 100%;

    height: 100%;

    background: #a516002f;

    transition: all 500ms ease-in-out;

    z-index: 1;

}



.dblock {

    z-index: 1;

    display: block;

    right: 0%;

}



.dnone {

    z-index: 1;

    display: none;

    right: -100%;

}



#fixBar {

    z-index: 9;

    background: #f1f1f1;

    padding: 50px;

    width: 30%;

    height: 100%;

    position: fixed;

    top: 0px;

}



.dleft {

    right: 0%;

    transition: 0.6s;

}



.dright {

    right: -100%;

    transition: 0.6s;

}



#fixBar p {

    color: #555;

}



#fixBar p a {

    text-decoration: none;

    color: #333;

    font-size: 16px;

}



#fixBar p a i {

    color: #A51500;

    font-size: 20px;

}



#fixBar h3 {

    font-weight: 500;

    padding: 15px 0px;

    position: relative;

}



#fixBar h3::after {

    position: absolute;

    content: " ";

    background: #A51500;

    left: 0px;

    bottom: -5px;

    height: 2px;

    width: 100px;

}



#cros {

    position: absolute;

    left: -12%;

    top: 15%;

    z-index: 9;

    padding: 10px;

    background: #A51500;

}



#cros img {

    width: 30px;

}



#section-1 div div div h2 {

    font-size: 34px;

    color: #A51500;

}



#section-1 div div div p {

    color: #555;

}



@media(max-width: 767px) {

    #section-1 div div div h2 {

        font-size: 22px;

        font-weight: 600;

    }

}







/* gallery */





.cont {

    display: flex;

    align-items: center;

    justify-content: center;

    flex-wrap: wrap;

    background-color: rgba(255, 255 255, 0.31);

    /* box-shadow: rgba(0, 0, 0, 0.2) 0px 60px 40px -7px !important; */

    backdrop-filter: blur(1.9px);

    /* border: 1px solid rgba(0, 0, 0, 0.16); */

    width: 90%;

    margin: 20px auto;

    overflow: hidden;

    position: relative;

    text-align: center;

    white-space: nowrap;

}



.cont .year img {

    width: 100%;

}



.cont #slider {

    position: absolute;

    top: 0;

    left: -20%;

    background: #abe9cd;

    background-image: linear-gradient(315deg, #abe9cd 0%, #3eadcf 74%);

    opacity: 0.7;

    height: 50%;

    font-size: 1.2rem;

    width: 20%;

    min-width: 4.25rem;

    transition: 0.9s;

    z-index: 9;



}



.year {

    width: 20%;

    min-width: 4.25em;

    font-size: 1.2;

    display: inline-block;

    padding: 0.75em 1em;

    cursor: pointer;

    position: relative;

    z-index: 5;

    transition: 0.9s;

}



.year img {

    cursor: pointer;

}





.year:nth-child(1)~#slider {

    transform: translateX(0%);

}



.year:nth-child(2)~#slider {

    transform: translateX(100%);

}



.year:nth-child(3)~#slider {

    transform: translateX(200%);

}



.year:nth-child(4)~#slider {

    transform: translateX(300%);

}



.year:nth-child(5)~#slider {

    transform: translateX(400%);

}



.year:nth-child(6)~#slider {

    transform: translateX(0%);

    transform: translateY(100%)

}



.year:nth-child(7)~#slider {

    transform: translateX(100%);

    transform: translateY(100%)

}



.year:nth-child(8)~#slider {

    transform: translateX(200%);

    transform: translateY(100%)

}



.year:nth-child(9)~#slider {

    transform: translateX(300%);

    transform: translateY(100%)

}



.year:nth-child(10)~#slider {

    transform: translateX(400%);

    transform: translateY(100%)

}













.year:nth-child(1):hover~#slider {

    transform: translateX(100%);

    background-color: #eec0c6;

    background-image: linear-gradient(315deg, #eec0c6 0%, #e58c8a 74%);



}



.year:nth-child(2):hover~#slider {

    transform: translateX(200%);

    background-color: #eec0c6;

    background-image: linear-gradient(315deg, #0cbaba 0%, #eec0c6 74%);



}



.year:nth-child(3):hover~#slider {

    transform: translateX(300%);

    background-color: #eec0c6;

    background-image: linear-gradient(315deg, #eec0c6 0%, #7ee8fa 74%);



}



.year:nth-child(4):hover~#slider {

    transform: translateX(400%);

    background-color: #e899dc;

    background-image: linear-gradient(315deg, #e899dc 0%, #d387ab 74%);

}



.year:nth-child(5):hover~#slider {

    transform: translateX(500%);

    background-color: #90d5ec;

    background-image: linear-gradient(315deg, #eec0c6 0%, #fc575e 74%);



}



.year:nth-child(6):hover~#slider {

    transform: translateX(100%) translateY(100%);

    background-color: #90d5ec;

    background-image: linear-gradient(315deg, #eec0c6 0%, #fc575e 74%);

}



.year:nth-child(7):hover~#slider {

    transform: translateX(200%) translateY(100%);

}



.year:nth-child(8):hover~#slider {

    transform: translateX(300%) translateY(100%);

}



.year:nth-child(9):hover~#slider {

    transform: translateX(400%) translateY(100%);

}



.year:nth-child(10):hover~#slider {

    transform: translateX(500%) translateY(100%);

}



/* Book Effects */

#bkSort {

    background: linear-gradient(90deg, rgba(255, 255, 255, 0.897) 50%, #4a1010d8 50%), url('../image/banner/hightech-banner-1.jpg');

    background-attachment: fixed;



}



#bkSort .container {

    height: 100vh;

    display: flex;

    justify-content: center;

    align-items: center;

}



.book input {

    display: none;

}



#cover img {

    width: 100%;

    height: 100%;

}



.flip div img {

    width: 100%;

    height: 100%;

}



.book {

    display: flex;

}



#cover {

    width: 99%;

    height: auto;

}



.flip-book {

    width: 99%;

    height: auto;

    position: relative;

    perspective: 1500px;

}



.next-btn i {

    font-size: 24px;

    box-shadow: 0 0 10 #777;

}



.back-btn i {

    font-size: 24px;

    box-shadow: 0 0 10 #777;

}



.flip {

    width: 100%;

    height: 100%;

    position: absolute;

    top: 0;

    left: 0;

    transform-origin: left;

    transform-style: preserve-3d;

    transform: rotateY(0deg);

    transition: 0.5s;

    color: #000;

}



p {

    font-size: 14px;

    line-height: 24px;

}



.front {

    position: absolute;

    width: 100%;

    height: 100%;

    top: 0;

    left: 0;

    overflow: scroll;

    background-color: #fff;

    box-sizing: border-box;

    padding: 25px 13px;

    box-shadow: 0 0 20px rgba(119, 119, 119, 0.39);

    box-shadow: inset 20px 0 50px rgba(0, 0, 0, 0.5) 0 2px 5px rgba(0, 0, 0, 0.5);

}



.front-num {

    position: absolute;

    bottom: 10px;

    right: 15px;

    font-size: 64px;

    color: #4d1f1e56;

}



.back {

    position: absolute;

    width: 100%;

    height: 100%;

    top: 0;

    left: 0;

    z-index: 99;

    transform: rotateY(180deg);

    backface-visibility: hidden;

    background-color: #000;

    box-shadow: 0 0 20px rgba(153, 153, 153, 0.336);

}



.next-btn {

    position: absolute;

    bottom: 45%;

    right: -1px;

    cursor: pointer;

    color: #000;

}



.back-btn {

    position: absolute;

    bottom: 45%;

    left: -1px;

    cursor: pointer;

    color: #fff;

}



#p1 {

    z-index: 3;

}



#p2 {

    z-index: 2;

}



#p3 {

    z-index: 1;

}



#c1:checked~.flip-book #p1 {

    transform: rotateY(-180deg);

    z-index: 1;

}



#c2:checked~.flip-book #p2 {

    transform: rotateY(-180deg);

    z-index: 2;

}



#c3:checked~.flip-book #p3 {

    transform: rotateY(-180deg);

    z-index: 3;

}















/* testimonial */

.section-3 {

    background-image: url('../image/testimonal/testomonial-bg.jpg');

    background-position: center;

    background-size: contain;

    background-attachment: fixed;

}



.testimonial {

    background-color: #fff;

}



.review {

    background-color: rgba(255, 255, 255, 0.829);

    padding: 15px 55px;

}





/* Footer */

footer {

    background: #f1f1f1;

}



.footer-link {

    text-decoration: none;

    color: #333;

}



.footer-link:hover {

    color: #A51500;

}





.bottom {

    background: #9f9f9f;

    padding: 5px 0px;

    color: #111;

}



.bottom a {

    text-decoration: none;

    color: #111;

}



.bottom a i {

    color: #A51500;

    font-size: 4px;

}



.bottom a:hover {

    color: #A51500;

}



/* Tab botton */

.tab-btn {

    border: none;

    outline: none;

    background: #fff;

    padding: 10px 15px;

    margin: 0px 25px;

    color: #444;

    border-radius: 3px;

    transition: all 300ms ease-in;

}



.tab-btn:hover {

    background: #A51500;

    color: #fff;

}



.card {

    margin: 12px 0;

}



.card img {

    position: relative;

}



.card-cont {

    position: absolute;

    width: 100%;

    height: 100%;

    background: #a51600c5;

    top: 0px;

    left: 0px;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-direction: column;

    opacity: 0;

    transition: 0.5s;

    transform: scale(0.2);

}



.card:hover .card-cont {

    opacity: 1;

    transform: scale(1);

}



.card-cont p {

    color: #ffff;

}



.activate {

    color: #fff;

    background: #A51500;

}



/* card button hover effects */

.crdBtn {

    position: relative;

    display: inline-block;

    padding: 10px 14px;

    color: #fff;

    text-transform: uppercase;

    text-decoration: none;

    font-size: 14px;

    overflow: hidden;

    transition: 0.5s;

}



.crdBtn:hover {

    color: #fff;

    letter-spacing: 2px;

    background: #A51500;

    transition-delay: 1s;

}



.crdBtn span {

    position: absolute;

    display: block;

}



.crdBtn span:nth-child(1) {

    top: 0;

    left: -100%;

    width: 100%;

    height: 2px;

    background: linear-gradient(90deg, transparent, #fff);

}



.crdBtn:hover span:nth-child(1) {

    left: 100%;

    transition: 1s;

}



.crdBtn span:nth-child(3) {

    bottom: 0;

    right: -100%;

    width: 100%;

    height: 2px;

    background: linear-gradient(270deg, transparent, #fff);

}



.crdBtn:hover span:nth-child(3) {

    right: 100%;

    transition: 1s;

    transition-delay: 00.5s;

}



.crdBtn span:nth-child(2) {

    top: -100%;

    right: 0;

    width: 2px;

    height: 100%;

    background: linear-gradient(180deg, transparent, #fff);

}



.crdBtn:hover span:nth-child(2) {

    top: 100%;

    transition: 1s;

    transition-delay: 0.25s;

}



.crdBtn span:nth-child(4) {

    bottom: -100%;

    left: 0;

    width: 2px;

    height: 100%;

    background: linear-gradient(360deg, transparent, #fff);

}



.crdBtn:hover span:nth-child(4) {

    bottom: 100%;

    transition: 1s;

    transition-delay: 0.75s;

}



/* fixed icons */



.fixed-mail {

    position: fixed;

    z-index: 1000;

    font-size: 36px;

    left: 3%;

    top: 90%;

    color: #A51500;

}



.fixed-mail:hover {

    color: #A51500;

}



.fixed-call {

    position: fixed;

    z-index: 1000;

    font-size: 36px;

    left: 3%;

    top: 80%;

    color: #A51500;

}



.fixed-call:hover {

    color: #A51500;

}



.fixed-whatsp {

    position: fixed;

    z-index: 1000;

    font-size: 36px;

    right: 3%;

    top: 90%;

    color: #A51500;

}



.fixed-whatsp:hover {

    color: #A51500;

}



#fixedtop {

    position: fixed;

    z-index: 1000;

    font-size: 28px;

    padding: 5px 15px;

    right: 2%;

    top: 0%;

    opacity: 0;

    transition: 1s;

    color: #fff;

    background: #A51500;

}



/* client section */

.clint {

    display: flex;

    align-items: center;

    justify-content: center;

    /* box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); */

}



#container {

    width: 1050px;

    overflow: hidden;

    margin: auto;



}



.slidebox {

    position: relative;

    width: 2960px;

    animation-name: anni;

    animation-duration: 20s;

    animation-iteration-count: infinite;

    animation-timing-function: ease;

    animation-play-state: running;

}



.slidebox:hover {

    animation-play-state: paused;

}



.slidebox div {

    display: flex;

    align-items: center;

    justify-content: center;

    margin-left: 10px;

    width: 200px;

    height: 200px;

    float: left;

    border-radius: 5px;

}



@keyframes anni {

    0% {

        right: 10px;

        top: 0;



    }



    8% {

        right: 10px;

        top: 0;

    }



    10% {

        right: 210px;

        top: 0;

    }



    18% {

        right: 210px;

        top: 0;

    }



    20% {

        right: 420px;

        top: 0;

    }



    28% {

        right: 420px;

        top: 0;

    }



    30% {

        right: 630px;

        top: 0;

    }



    38% {

        right: 630px;

        top: 0;

    }



    40% {

        right: 840px;

        top: 0;

    }



    48% {

        right: 840px;

        top: 0;

    }



    50% {

        right: 1050px;

        top: 0;

    }



    58% {

        right: 1050px;

        top: 0;

    }



    58% {

        right: 1050px;

        top: 0;

    }



    60% {

        right: 1260px;

        top: 0;

    }



    68% {

        right: 1260px;

        top: 0;

    }



    70% {

        right: 1470px;

        top: 0;

    }



    78% {

        right: 1470px;

        top: 0;

    }



    80% {

        right: 1680px;

        top: 0;

    }



    88% {

        right: 1680px;

        top: 0;

    }



    90% {

        right: 1890px;

        top: 0;

    }



    100% {

        right: 1890px;

        top: 0;

    }



}



/* catagory pages code*/







/* about us */

.abtshake {

    animation-name: pendulam;

    animation-duration: 5s;

    animation-iteration-count: infinite;

    animation-delay: 1s;

    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.5);

}



@keyframes pendulam {



    0%,

    100% {

        transform: rotate(1deg);

    }



    50% {

        transform: rotate(-1deg);

    }

}



/* contact us */

/* form */

/* contact form */

.cont-form {

    width: 100%;

    background-color: #fff;

    display: flex;

    align-items: center;

    justify-content: center;

}



.cont-form form textarea {

    width: 98%;

}



.cont-form form label {

    font-size: 18px;

    color: #A51500;

    font-weight: 400;

    text-align: left;

    display: inline-block;

    margin: 10px 0 5px 0;

    padding: 0;

}



.cont-form form input {

    width: 98%;

    padding: 10px;

    font-size: 18px;

    font-weight: 300;

    display: inline-block;

    outline: none;

}



.cont-form form textarea {

    width: 98%;

    padding: 10px;

    font-size: 18px;

    font-weight: 300;

    display: inline-block;

    outline: none;

}



.cont-form form {

    width: 100%;

    margin: auto;

    padding: 30px 50px;

    /* box-shadow: 5px 5px 15px 1px rgba(0, 0, 0, 0.2); */

}



.cont-form form .btn {

    width: 150px;

    display: block;

    border: 1px solid #000;

    padding: 10px 0;

    margin: 30px auto 0;

    text-align: center;

    background: none;

    outline: none;

    position: relative;

    color: #A51500;

    overflow: hidden;

    z-index: 1;

}



.cont-form form .btn::before {

    content: " ";

    position: absolute;

    width: 100%;

    height: 100%;

    left: 0;

    top: 100%;

    background-color: #A51500;

    transition: all 500ms ease-in-out;

    z-index: -1;

}



.cont-form form .btn:hover::before {

    top: 0;

}



.cont-form form .btn:hover {

    color: #fff;

}



.cont-box {

    border-radius: 5px;

    box-shadow: 0 0 20px rgba(119, 119, 119, 0.507);

}



/* Modal  */

.modal-header {

    width: 100%;

    height: 50px;

    background-color: #A51500;

    color: #fff;

}



.modal .modal-body {

    width: 100%;

    padding: 40px 20px;

    text-align: center;

}



.modal form {

    color: #A51500;

}



.modal .input-group {

    position: relative;

    display: flex;

    flex-wrap: wrap;

    align-items: stretch;

    width: 100%;

}



.modal form input {

    width: 100%;

    padding: 5px 7px;

    margin-bottom: 15px;

    outline: none;

    font-size: 14px;

}



.modal textarea {

    width: 100%;

    padding: 5px 7px;

    margin-bottom: 15px;

    outline: none;

    font-size: 14px;

    height: auto;

    border: 1px solid #4F4F4F;

}



.modal .form-btn {

    color: #000;

    /* font-weight: 800; */

    font-size: 14px;

    background-color: transparent;

    padding: 17px 35px;

    border-radius: 20px;

    cursor: pointer;

    transition: .3s;

    margin-top: 10px;

    border: 1px solid #cfcfd0;

    line-height: 0%;

    width: auto;

    height: auto;

    transition: .3s;

    font-family: 'Roboto', sans-serif;

}



.modal .form-btn:hover {

    background-color: #A51500;

    color: #fff;

}



.modal .btn-close {

    color: #fff;

    background-color: #ffff;

    z-index: 99999999999;

    font-size: 10px;

}



.modal h5 {

    font-size: 20px !important;

    font-weight: 600;

}























@media screen and (max-width: 1189px) {

    #container {

        width: 840px;

    }

}



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

    #bar {

        display: none;

    }



    #container {

        width: 630px;

    }



    .sub-heading {

        width: 90%;

    }



    .sub-heading h1 {

        font-size: 26px;

    }



}



@media screen and (max-width: 744px) {

    #container {

        width: 420px;

    }



    .heading {

        height: 75vh;

    }

}



@media screen and (max-width: 540px) {

    .cont {

        width: 100%;

    }



    .year {

        padding: 0px;

    }



    .heading {

        display: none;

    }

}



@media screen and (max-width: 431px) {

    #container {

        width: 210px;

    }



    .heading {

        display: none;

    }



    #bkSort .container {

        height: auto;

    }

}



@media screen and (max-width: 373px) {

    #slider {

        display: none;

    }



    .year {

        margin: 10px 5px;

    }



    .top {

        display: none;

    }

}



























/* azzu css start */



/* navbar css start */



.navbar {

    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;

    position: sticky;

    padding: 0;

}



.navbar-brand img {

    height: 70px !important;

}



.navbar-nav .nav-item .nav-link {

    color: #000;

    font-weight: 500;

    transition: 0.1s ease-in-out;

    padding: 5px 10px;

    font-size: 18px;

}



.navbar-nav .nav-item .nav-link:hover {

    color: var(--red);

    padding: 5px 10px;

}









.active-nav {

    color: var(--red) !important;

    padding: 5px 15px;

}









.nav-soical-icon {

    display: flex;

    justify-content: center;

    align-items: center;

    gap: 15px;

}



.nav-soical-icon a i {

    border: 1px solid var(--red);

    color: var(--red);

    font-size: 18px;

    padding: 12px 12px;

    border-radius: 50%;

    transition: 0.4s ease-in-out;



}



.nav-soical-icon a i:hover {

    background-color: var(--red);

    color: #fff

}





/* first dropdown start */



.dropdown:hover .dropdown-menu {

    display: block;

}



.dropdown .dropdown-menu {

    padding-bottom: 0;

}



.dropdown .dropdown-item:hover {

    color: #000;

    font-weight: 500;

}



.dropdown .dropdown-menu li a {

    border-bottom: 1px solid #e61111c8;

    display: inline-block;

}



.dropdown .dropdown-menu li i {

    color: var(--red);

    margin-right: 10px;

}



.dropdown-menu .dropdown-submenu {

    position: relative;

}



.dropdown-menu .dropdown-submenu>.dropdown-menu {

    top: 0;

    left: 100%;

    margin-top: -8px;

    display: none;

    border-radius: 0 6px 6px 6px;

}



/* 3) Show the nested submenu on hover */

.dropdown-menu .dropdown-submenu:hover>.dropdown-menu {

    display: block;

}



.dropdown-menu .dropdown-submenu .dropdown-item .fa-caret-right {

    margin-left: 5px;

}







@media(max-width: 767px) {

    .navbar-brand img {

        height: 50px;

    }



    .navbar-nav .nav-item .nav-link {

        color: #000;

        font-weight: 500;

        transition: 0.1s ease-in-out;

        padding: 5px 10px;

        font-size: 16px;

    }



    .nav-soical-icon {

        display: flex;

        justify-content: start;

        align-items: start;

        gap: 10px;

    }



    .nav-soical-icon a i {

        border: 1px solid var(--red);

        color: var(--red);

        font-size: 12px;

        padding: 8px 8px;

        border-radius: 50%;

        transition: 0.4s ease-in-out;



    }



}



.carousel-item img {

    width: 100%;

}





@media(max-width: 767px) {

    .navbar-brand img {

        height: 40px !important;

    }

}



/* navbar css end */













/* banner css start */

.carousel-item {

    position: relative;

}



.carousel-item img {

    /* height: 100vh; */

    object-fit: cover;

}



.carousel-item::after {

    content: "";

    position: absolute;

    inset: 0;

    background: rgba(0, 0, 0, 0.45);

    z-index: 1;

}





.carousel-text {

    position: absolute;

    top: 50%;

    left: 13%;

    transform: translateY(-50%);

    z-index: 2;

    color: #fff;

    max-width: 48%;

}



.carousel-text h2 {

    font-size: 35px;

    font-weight: 700;

    margin-bottom: 0.8rem;

}



.carousel-text p {

    font-size: 16px;

    line-height: 1.5;

    font-weight: 500;

    margin-bottom: 25px;

}





.fixed-form-container {

    position: absolute;

    top: 65%;

    right: 6%;

    transform: translateY(-50%);

    z-index: 10;

    background: rgba(255, 255, 255, 0.9);

    /* padding: 1.5rem; */

    border-radius: 12px;

    max-width: 380px;

}





.contact-form-box {

    max-width: 500px;

    background: #fff;

    border-radius: 12px;

    border: 1px solid #eee;

    padding: 18px;

}





.form-heading {

    text-align: center;

    color: var(--red);

    font-weight: 700;

    margin-bottom: 16px;

    font-size: 18px;

}



.fixed-form-container .form-control {

    border-radius: 8px;

    font-size: 13px;

}



.fixed-form-container .btn {

    background-color: var(--red);

    color: #fff;

    font-weight: 600;

    border-radius: 8px;

    transition: all 0.3s ease;

}



.fixed-form-container .btn:hover {

    background-color: #000000;

    color: #ffffff;

}



.ul-list-hightech {

    display: flex;

    gap: 50px;

}





.ul ul {

    padding-left: 0px;

}



.ul ul li {

    list-style: none;

    line-height: 2;

}



.ul ul li a {

    color: #fff;



}







.form-control,

.form-select {

    border: 1px solid #c5c5c5;

    border-radius: 8px;

    font-size: 14px;

    font-weight: 600;

    padding: 7px 10px;

    color: #0d1b6e;

    transition: all 0.3s ease;

}





.form-select option[disabled],

.form-select option:disabled {

    color: var(--red);

}





.form-control:hover,

.form-select:hover {

    border-color: var(--red);

}





.form-control:focus,

.form-select:focus {

    border-color: var(--red);

    box-shadow: none;

}



textarea.form-control {

    resize: none;

}











@media(max-width: 1440px) {

    .fixed-form-container {

        top: 60%;



    }



    .navbar-nav .nav-item .nav-link {

        color: #000;

        font-weight: 500;

        transition: 0.1s ease-in-out;

        padding: 5px 10px;

        font-size: 16px;

    }

}









@media(max-width:992px) {

    .contact-form-box {

        display: none;

        /* Hides form */

    }







    .carousel-text {

        max-width: 80%;

        left: 5%;

    }



    .fixed-form-container {

        position: static;

        transform: none;

        margin: 2rem auto;

        max-width: 90%;

    }

}



@media(max-width: 767px) {

    .carousel-text h2 {

        font-size: 20px;

    }



    .carousel-text p {

        font-size: 12px;

        margin-bottom: 13px;

    }



    .ul ul li a {

        font-size: 12px;

    }



    .ul ul li {

        list-style: none;

        line-height: 1.6;

    }



    .carousel-item img {

        height: 80vh;

        object-fit: cover;

    }



    .ul-list-hightech {

        display: flex;

        flex-direction: column;

        gap: 0px;

    }



}











/* captcha start */

.captchasep1 {

    display: flex;

}



.captchasep1 input {

    width: 100% !important;

    margin-top: 0 !important;

    height: 36px;

    font-size: 14px;

}



.captchasep1 .captcha-codes-sec {

    display: flex;

    justify-content: center;

    align-items: center;

    width: 100% !important;

    border-radius: 5px;

    border-top: 1px solid #ced4da;

    border-right: 1px solid #ced4da;

    border-bottom: 1px solid #ced4da;

    font-weight: bolder !important;

}



.captchasep1 .captcha-codes-sec p {

    margin-bottom: 0;

    letter-spacing: 9px;

    font-style: italic;

    font-size: 14px;

    padding: 5px;

    height: 100%;

    /* color: #fff; */

    font-weight: bolder !important;

}



@media (max-width: 768px) {

    .captchasep1 .captcha-codes-sec p {

        font-size: 24px;

    }



    .captchasep1 {

        margin-bottom: 10px;

    }

}



@media (max-width: 992px) {

    .captchasep1 .captcha-codes-sec p {

        font-size: 18px;

    }

}



.captchasep1 .captcha-codes-sec {

    margin-bottom: 10px;

}



.captchasep1 .captcha-codes-sec button {

    font-style: italic;

    font-size: 22px;

    outline: none;

    background: transparent;

    height: 100%;

    border: none;

    font-weight: bolder;

}



.captchasep1 .captcha-codes-sec button i {

    background: #000;

    color: #fff;

    padding: 3px;

    border-radius: 6px;

}



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

    .captchasep1 {

        display: flex;

        flex-direction: column !important;

    }



    .captchasep1 .captcha-codes-sec {

        border-left: 1px solid #ced4da;

        border-right: 1px solid #ced4da;

        border-bottom: 1px solid #ced4da;

        margin-top: 3px;

    }

}



/* banner css end */





/* why choose us css start */



.testimonial-section {

    position: relative;

    background: url(../image/testimonal/testomonial-bg.jpg) center/cover no-repeat;

    padding: 80px 20px;

    color: #fff;

}



.testimonial-section .overlay {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background: rgba(20, 20, 20, 0.6);

    z-index: 0;

}



.testimonial-section .container {

    position: relative;

    z-index: 1;

}





.tag {

    background: #f25d38;

    padding: 6px 16px;

    font-size: 18px;

    font-weight: 600;

    border-radius: 4px;

    display: inline-block;

    margin-bottom: 50px;

    letter-spacing: 1px;

}





.title {

    font-size: 35px;

    font-weight: 700;

    margin-bottom: 40px;

}





.quote {

    font-style: italic;

    max-width: 650px;

    margin: 0 auto 15px;

    color: #eee;

    font-size: 17px;

}



.author {

    font-size: 22px;

    font-weight: 600;

    text-transform: uppercase;

    color: #fff;

}







.test-slide {

    background-color: #00000083;

    padding: 30px 40px;

}



@media(max-width: 767px) {

    .tag {

        font-size: 16px;

        margin-bottom: 20px;

    }



    .title {

        font-size: 23px;

        font-weight: 700;

        margin-bottom: 20px;

    }







    .test-slide {

        background-color: #00000083;

        padding: 12px 20px;

    }



    .quote {

        font-size: 10px;

    }



    .author {

        font-size: 15px;

    }



    .carousel-control-icon {

        font-size: 10px;

        color: #f5c542;



    }

}



/* why choose us css end */





/* we work */



.card {

    border: 2px solid var(--red) !important;

}



.we-heading h2 {

    font-size: 30px;

    font-weight: 600;

}



.we-heading p {

    font-size: 18px;

}



@media(max-width: 767px) {

    .we-work {

        margin-bottom: 20px;

    }



    .we-heading h2 {

        font-size: 25px;

        font-weight: 600;

    }



    .we-heading p {

        font-size: 14px;

    }

}



/* we work end */





/* service start */







/* service end */



/* about css start */



.about-content {

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: center;

    height: 100%;

}



.about-head h2 {

    font-size: 32px;

    font-weight: 600;

    margin-bottom: 15px;

    text-decoration: underline;

}



.about-head h3 {

    font-size: 40px;

    font-weight: 600;

    margin-bottom: 20px;

}





.about-content p {

    font-size: 16px;

    text-align: justify;

    color: #000 !important;

}



.about-carousel {

    display: flex;

    justify-content: center;

    align-items: center;

    /* height: 100%; */

}



.ser-btn a {

    background-color: var(--red);

    color: #fff;

    padding: 10px 15px;

    border-radius: 4px;

}



@media(max-width: 767px) {

    .about-img {

        margin-bottom: 20px;

    }



    .about-content h2 {

        font-size: 23px;

        font-weight: 600;

        margin-bottom: 15px;

    }



    .about-content p {

        font-size: 14px;

        text-align: justify;

        color: #000 !important;

    }



    .about-head h3 {

        font-size: 26px;

        margin-bottom: 12px;

    }

}



/* about css end */







/* service css start */



.service-card {

    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;

    overflow: hidden;

    margin-bottom: 30px;

    min-height: 350px;

    max-height: 350px;

}



.service-content {

    padding: 20px;

}



.service-post img {

    transition: 0.5s ease-out;

}



.service-card:hover .service-post img {

    transform: scale(1.06);

}



.service-content .service-name h3 {

    font-size: 16px;

    font-weight: 600;

}



.service-content .service-para {

    margin-bottom: 20px;

}



.service-content .service-btn a {

    background-color: var(--red);

    color: #fff;

    padding: 7px 20px;

    font-weight: 500;

    transition: 0.6s ease-out;

    font-size: 14px;

}



.service-content .service-btn a:hover {

    background-color: var(--black);

}



@media(max-width: 767px) {

    .service-content .service-name h3 {

        font-size: 20px;

        font-weight: 600;

    }



    .service-content .service-para {

        margin-bottom: 15px;

    }



    .service-content .service-para p {

        font-size: 12px;

        line-height: 17px;

    }



    .service-content .service-btn a {

        padding: 8px 15px;

        font-size: 12px;

    }



}



/* service css end */







/* gallery css  */



.gallery-card {

    border: 3px solid var(--red);

    padding: 1px;

    border-radius: 4px;

    margin-bottom: 15px;

}







/* sub page */

/* catagory heading */

.catg-heading {

    /* background: linear-gradient(#a5160091, #a516008e), url('../image/gallery-2/gall3.jpg'); */

    /* background-position: center; */

    /* background-repeat: no-repeat; */

    /* background-size: cover; */

    background: var(--red);

}



.catg-heading div div p a,

.catg-heading div div p span {

    text-decoration: none;

    color: #fff;

}



.catg-heading div div h2 {

    font-size: 35px;

    color: #fff;

}



/* end sub page */





.enquiry-section-page {

    padding: 40px 0 10px;

}



.enquiry-section-page p {

    font-size: 16px;

}



.enquiry-section-page ul li {

    font-size: 16px;

}



.enquiry-section-page h2 {

    font-size: 26px;

    color: var(--red);

}



.enquiry-section-page h3 {

    font-size: 22px;

    color: var(--red);



}



/* office interior css start */

 

        .office-interior-post {

            display: flex;

            justify-content: center;

            align-items: center;

            height: 100%;

        }


..office-interior-post p{
font-size: 18px;
}
        .office-interior-details h2,

        h3 {

            font-size: 25px;

            font-weight: 700;

        }



        .office-interior-details ul li {

            font-weight: 500;

        }





        @media(max-width: 767px) {

            .office-interior-post {

                margin-bottom: 15px;

            }



            .office-interior-details h2,

            h3 {

                font-size: 20px;

                font-weight: 700;

            }



            .office-interior-details ul li {

                font-size: 14px;

            }

        }

    /* office end */













    /* ================================================================================== */









    

/* ------------- testimonial section css start here --------------- */



.testimonials {

  background: #f6f6f6;

}



.testimonials .testimonial-text {

  display: flex;

  flex-direction: column;

  justify-content: center;

  height: 100%;

  background: linear-gradient(rgba(245, 74, 74, 0.555), rgba(77, 77, 77, 0.719), rgb(39, 39, 39));

  padding-left: 20px;

}



.testimonials .testimonial-text p {

  margin-bottom: 5px;

  font-size: 20px;

  font-weight: 500;

  color: #000;

}



.testimonials .testimonial-text h2 {

  font-size: 40px;

  font-weight: 600;

  color: #fff;

}



.testimonial-card {

  background: #fff;

  padding: 30px;

  border-radius: 20px;

  min-height: 250px;

}



.testimonial-card .testimonial-card-text .star-icon {

  margin-bottom: 20px;

}



.testimonial-card .testimonial-card-text .star-icon i {

  color: var(--red);

  font-size: 12px;

}



.testimonial-card .testimonial-card-text p {

  font-style: italic;

  font-size: 12px;

  font-weight: 400;

  color: rgb(154, 149, 149);

  line-height: 2;

}



.testimonial-card .testimonial-card-text h3 {

  font-size: 18px;

  font-weight: 350;

  color: var(--blue);

}



/* responsive css start */



@media screen and (max-width: 1200px) {

  .testimonials .testimonial-text h2 {

    font-size: 28px;

  }

}



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

  .testimonials .testimonial-text {

    margin-bottom: 10px;

  }

  .testimonials .testimonial-text p {

    font-size: 16px;

    margin-bottom: 0px;

  }



  .testimonials .testimonial-text h2 {

    font-size: 20px;

  }

}



/* responsive css end */



/* ----------- end of testimonial section here -------------- */