/*why us start */
.why-us .right h1, .why-us .left h4 {
    color: var(--black);
}
.why-us .left i {
    font-size: 100px;
}
.why-us .right {
    margin-top: 3%;
}
/*why us end */

/*what we do start*/
.whatwedo {
    width: 100%;
    background: var(--black);
    padding-bottom: 200px;
}

.whatwedo-content h2 {
    font-weight: 600;
    letter-spacing: 0.115em;
    color: var(--white);
    text-align: center;
}

.whatwedo-content p {
    text-align: center;
    color: var(--white);
}

.do-item {
    padding: 60px 20px;
    margin-bottom: 20px;
    position: relative;
}

.whatwedo-block {
    position: relative;
    margin-top: -220px;
}

@media (max-width: 991px) {
    .do-item {
        padding: 10px 10px;
    }

    .whatwedo-block {
        margin-top: -190px;
    }
}


.do-item > div {
    background: var(--white);
    padding: 50px 50px 15px 50px;
    box-shadow: -5px 5px 20px var(--black-5);
    text-align: center;
    background: var(--white);
    height: 100%;
    position: relative;
}

.do-item > div::after {
    content: '';
    position: absolute;
    width: 3px;
    height: 0%;
    background: var(--p-color);
    bottom: -20px;
    right: -10px;
    transition: 0.4s;
}

.do-item > div::before {
    content: '';
    position: absolute;
    width: 00%;
    height: 3px;
    background: var(--p-color);
    bottom: -10px;
    right: -20px;
    transition: 0.4s;
}

.do-item > div > i {
    color: var(--black);
    font-size: 60px;
}

.do-item > div h4 {
    color: var(--t-color);
    /*    font-size: 60px;    */
    margin: 20px 0px 20px 0px;

}

.do-item > div > div {
    text-align: right;
    right: auto;
    left: 30px;
    top: 0px;
}

.do-item > div > div i {
    font-size: 18px;
    color: var(--white);
    background: var(--black-5);
    clip-path: circle();
    padding: 9px;
}

.do-item:hover > div::after {
    width: 3px;
    height: 90%;
}

.do-item:hover > div::before {
    width: 90%;
    height: 3px;
}

.do-item:hover > div {
    background: var(--black-8);
}

.do-item:hover > div > div i {
    color: var(--black-8);
    background: var(--white);
}

.do-item:hover div h4 {
    color: var(--white);
}

.do-item:hover > div > i {
    color: var(--white);
}

@media (max-width: 991px) {
    .do-item > div {

        padding: 50px 20px 15px 20px;
    }

    .do-item {
        padding: 50px 10px;
    }

    .whatwedo-block.container {
        max-width: 100% !important;
    }
}

@media (max-width: 767px) {
    .do-item {
        max-width: 90% !important;
        margin-left: 5% !important;
        padding: 10px 10px;
    }
}

/*what we did*/

.what-we-did > .row > div > h3 {
    color: var(--black);
    font-weight: 400;
}
.whatWeDid {
    width: 100%;
}

.whatWeDid-item > img {
    width: 100%;
}
/*thumb slider 1*/
    .thumb-slider-item {
        padding: 0px 3px;
    }
    .thumb-slider-item > img {
        height: auto;
    }
    .thumb-slider{
        position: relative;
        bottom: 17.2%;
    }
    #interiorDesign{
        position: relative;
    }
/*we are proud of it */
.proud {
    background: var(--black-8);
}

.proud-heading h3 {
    color: var(--white);
}

.proud-heading p {
    color: var(--t-color)
}

.proud-item {
    width: 220px;
    height: 220px;
    padding: 10px 40px;
    border-radius: 100%;
    background: transparent;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border: 4px solid var(--t-color);
    position: relative;
}

.proud-item::after {
    content: '';
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    border-radius: 100%;
    z-index: -1;
    transition: 1s;
}

.proud-item:hover::after {
    transform: scale(1.18);
    background: var(--t-color);
}

.proud-item:hover {
    box-shadow: 0 0 10px var(--white-8);
}

.proud-item p:first-child {
    color: var(--white);
    font-size: 35px;
    font-weight: 500;
    margin: 0;
    padding: 0;
    position: relative;
    line-height: 55px;
}

.proud-item p:last-child {
    font-size: 25px;
    font-weight: 300;
    color: var(--t-color);
    margin: 0;
    padding: 0;
    line-height: 30px;
}

.expreince_img{
    width: 320px;
    height: auto;

}
.expri_img{
    position: relative !important;
}
.expreince_text {
    position: absolute;
    top: 36%;
    left: 31%;;

}
.expreince_text p{
    color: var(--t-color);
    font-size: 20px;
}
.expreince_text p span{
    color: var(--white);
    font-size: 35px;
}
@media (max-width: 769px) {
    .expreince_img{
        width: 255px;
        height: auto;

    }
    .expreince_text {
        top: 30%;
        left: 37%;
    }

}
@media (max-width: 420px) {
    .expreince_text {
        top: 31%;
        left: 31%;
    }
    
}
/*testimonial start*/
.testimonial-item {
    width: 100%;
    display: flex;
    justify-content: center;
}

.testimonial-item > div {
    width: 100%;
}

.testimonial h3 {
    font-weight: 600;
}

.testimonial .testimonial-subheading {
    font-size: 22px;
}

.testimonial .testimonial-text {
    font-size: 30px;
    font-weight: 500;
    color: var(--t-color)
}

.testimonial .message {
    font-size: 22px;
    font-weight: 300;
    color: var(--black);
}

.testimonial .name img {
    width: 80px;
    clip-path: circle();
}

.testimonial .name {
    font-weight: 500;
    font-size: 18px;
    color: var(--black);
}

.testimonial .quote {
    font-size: 60px;
}

.testimonial .badgebg {
    background: var(--t-color);
    clip-path: circle();
}
/* testimonial end */
/*information slider start*/
.information_slider .slick-initialized .slick-slide{
    height: 400px;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
@media (min-width:768px) {
    .information_slider .slick-list {
        padding: 0 25% 0 0;
    }
}
.information_slider .video_slider > div .img_sec {
    height: 350px;
    border-radius: 10px;
    box-shadow: 5px 5px 4px 3px var(--s-color);
}
.information_slider .video_slider > div .img_sec img {
    border-radius: 10px;
}
.information_slider .video_slider > div .info_sec{
    position: relative;
    background-color: var(--black-8);
    width: 100%;
    height: 350px;
    margin: -350px 0 0 0;
    border-radius: 10px;
}
.information_slider .video_slider > div .info_sec .information{
    padding: 30% 0 0 10%;
}
.information_slider .video_slider > div .info_sec .information h2 {
    color: var(--white);
    font-size: 30px;
}
.information_slider .video_slider > div .info_sec .information p{
    color: var(--t-color);
    font-size: 25px;
}
.information_slider .video_slider > div .info_sec .video_wrapper_btn{
    padding: 60% 20%;
}
.information_slider .video_slider > div .info_sec .video_wrapper_btn .video_btn{
    padding: 22px;
    border-radius: 100%;
    background: transparent;
    border: 4px solid var(--t-color);
    position: relative;
    transition: all 1s;
}
.information_slider .video_slider > div .info_sec .video_wrapper_btn .video_btn::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 100%;
    transition: 3s;
}
.information_slider .video_slider > div .info_sec .video_wrapper_btn .video_btn:hover::after {
    transform: scale(1.50);
    background: var(--black-5);
}
.information_slider .video_slider > div .info_sec .video_wrapper_btn .video_btn:hover {
    box-shadow: 0 0 10px var(--white-5);
}
.information_slider .video_slider > div .info_sec .video_wrapper_btn .video_btn i {
    color: var(--t-color);
    font-size: 20px;
}