* {
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
}

.btn-info {
    background: rgb(58, 199, 211) !important;
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.animated {
    animation: fadeIn 2s ease-in-out;
}

@keyframes slideIn {
    0% {
        transform: translateX(-100%);
    }

    100% {
        transform: translateX(0);
    }
}


@keyframes scaleUp {
    0% {
        transform: scale(0);
    }

    100% {
        transform: scale(1);
    }
}

@keyframes rotate {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@keyframes anim-lineUp {
    0% {
        opacity: 0;
        transform: translateY(80%);
    }

    20% {
        opacity: 0;
    }

    50% {
        opacity: 1;
        transform: translateY(0%);
    }

    100% {
        opacity: 1;
        transform: translateY(0%);
    }
}

/* Conditional */
.inactive {
    display: none;
}

.active {
    display: block;
}

.remove-header-content {
    display: none !important;
}

/* Start ---------------------------------------------------- */
.container {
    max-width: 1250px !important;
}

.main-header {
    margin-bottom: calc(95vh - 10vh - 25vh - 35vh);
}

/* .header div{
    position:fixed;
} */

.bg-vedio {
    height: 95vh;
    background: rgb(0, 0, 0, 1);
    object-fit: cover;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: -4;
}

#background-video {
    height: 95vh;
    width: 100%;
    object-fit: cover;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: -5;
    opacity: 1;
    background: rgb(0, 0, 0, 1);
}

#Backgrond-color {
    height: 95vh;
    width: 100%;
    object-fit: cover;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: -5;
    opacity: 0.5;
    background-color: #f9f4ef;
    color: #000;
}

header-left h1 {
    color: rgb(57, 208, 222);
}

.header {
    width: 100vw;
    height: 10vh;
    background-color: transparent;
    display: flex;
    justify-content: space-between;
    color: white;
    /* font-size: large;
    font-weight: 600; */
    align-items: center;
    padding-bottom: 1rem;
    font-family: Verdana, Geneva, Tahoma, sans-serif
}

.mobile {
    display: none;
}

.mobile-menus {
    transition-duration: 1s !important;
    transition-delay: 1s !important;
    transition: step-start !important;
    padding: 15px;
    animation: fadeIn 1s ease-in-out;
}

.mobile-menus ul {
    padding: 0 !important;
}

.mobile-menus ul li {
    list-style: none;
}

.mobile-menus ul li a {
    text-decoration: none;
    color: black;
}

.header-right ul {
    margin: 0;
    padding: 0;
    display: flex;
    gap: 30px;
    align-items: center;
}

.header-right ul li {
    list-style: none;
    padding: 20px 0px 20px 0px;
}

.header-right ul li a {
    height: 100%;
    text-decoration: none;
    color: white;
}

.header-right ul li:hover {
    /* text-decoration: overline; */
    border-top: 5px solid rgb(57, 208, 222);
    /* color: aqua; */
    font-weight: 400;
}

/* New Drop Down Menu ---------------------------------- */
.dropdown-content {
    padding: 40px 0px 40px 0px;
    z-index: 1;
    position: fixed;
    left: 111px;
    width: 85vw !important;
    display: none;
    margin-top: 20px;
    width: max-content;
    background: white;
    border-radius: 10px;

    /* width: 200px !important;
    display: none;
    margin-top: 10px;
    position: absolute;
    width: max-content;
    background: rgb(57, 208, 222);
    border-radius: 10px; */
}

.dropdown-content .col-md-3 a .service-menu {
    border-left: 2px solid rgb(93, 245, 230);
    background-color: white;
    width: 90%;
    height: 45%;
    text-align: left;
    margin: 10px;
    transition: background-position 0.3s ease-in-out;
    /* animation: anim-lineUp 2s ease-in-out; */
    background: white;
    background-size: 100% 200%;
    background-position: 0% 0%;
    position: relative;
    z-index: 7;
    overflow: hidden;
}

.dropdown-content .col-md-3 a .service-menu:hover {
    border-left: 2px solid rgb(93, 245, 230);
    padding: 30px 15px;
}

.dropdown-content .services-dropdown-heading h1 {
    color: rgb(0, 172, 175);
    font-size: xx-large;
    font-weight: 800;
}

.dropdown-content .col-md-3 a .service-menu i {
    color: rgb(0, 172, 175);
    font-size: xx-large;
    padding: 0px 0px 20px 0px;
}

.dropdown-content .col-md-3 a .service-menu h5 {
    font-size: medium;
    color: #000;
}

.dropdown-content .col-md-3 a .service-menu {
    padding: 30px 15px;
}

.dropdown-content .col-md-3 a .service-menu::before {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    z-index: -7;
    background: rgb(78, 224, 237);
    transition: all 0.3s ease-in-out;
}

.dropdown-content .col-md-3 a .service-menu:hover::before {
    left: 0;
    /* height: 100%; */
}

.dropdown:hover .dropdown-content {
    display: block;
}

/* End Drop Down -------------------------------------- */
/* 
.dropdown-content a {
    display: block;
    color: white !important;
    font-size: medium;
    padding: 10px 7px 10px 7px;
    height: fit-content !important;
    font-size: small;
    font-weight: 500;
} */

/* .dropdown-content .drop-menu:hover {
    border-bottom: 3px solid white;
} */

/* .dropdown-content hr {
    margin: 0;
    padding: 0;
} */

/* .drop-menu {
    display: flex;
}

.drop-menu .menu-logo {
    margin: auto;
} */

/* Slider Content ----------------------------------------- */

.home-content {
    margin-top: 15vh;
    color: white;
}

.home-content h1 {
    width: 70%;
    font-weight: 700;
    font-size: 55px;
    color: #00A8B5;
    /* animation: anim-lineUp 3s ease-in-out; */
    /* animation: rotate 2s linear infinite; */

}

.home-content h2 {
    font-size: 55px;
    color: white;
    /* animation: anim-lineUp 2s ease-in-out; */
}

.home-content p {
    margin-top: 30px;
    font-size: 18px;
    color: white;
    width: 80%;
    /* animation: anim-lineUp 2s ease-in-out; */
}

.home-content button {
    margin-top: 30px;
    font-size: 18px;
    color: white;
}

/* About Content ----------------------------------------- */

.about-container {
    /* height: auto; */
    padding: 100px;
}

.about-content h1 {
    font-weight: 700;
    animation: anim-lineUp 3s ease-in-out;
}

.about-content p {
    font-size: large;
    font-weight: 500;
    animation: anim-lineUp 3s ease-in-out;
}

.about-res .row {
    height: auto;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    margin: 20px;
}

.about-res .row .col-md-3 {
    padding: 10% 0 auto 0;

}

.about-res .row .col-md-3 .num {
    text-align: center;
    padding-top: 20%;
    font-size: xx-large;
    font-weight: 700;
    animation: anim-lineUp 3s ease-in-out;

}

.about-res .row .col-md-3 .text {
    text-align: center;
    font-size: large;
    font-weight: 500;
    padding-bottom: 20%;
    animation: anim-lineUp 3s ease-in-out;

}

.about-res .row .col-md-3 .num {
    font-size: xx-large;
    font-weight: 700;
}

/* What we do ----------------------------------------- */
.heading {
    font-size: xxx-large;
    font-weight: 900 !important;
    animation: fadeIn 2s ease-in-out;

}

.what-we-do-container {
    padding: 100px 50px 100px 50px;
    background-color: #f4f5f7;
}

.what-we-do-header {
    text-align: left;
}

.what-we-do-header h1 {
    animation: fadeIn 2s ease-in-out;
    color: #333;
    font-weight: 700;
}

.what-we-do-header p {
    animation: fadeIn 2s ease-in-out;
    color: #666;
}

.services {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin-top: 30px;
}

.service {
    background-color: white;
    width: 30%;
    text-align: left;
    margin: 10px;
    padding: 30px;
    border-radius: 10px;
    animation: anim-lineUp 3s ease-in-out;
}

.service {
    background: white;
    /* fallback for old browsers */
    background-size: 100% 200%;
    /* double the height to reserve space for the animation */
    transition: background-position 0.3s ease-in-out;
    /* animate the background-position */
    background-image: linear-gradient(to bottom, white 50%, rgb(78, 224, 237) 50%);
    /* define the gradient */
    background-position: 100% 0;
    /* start with the gradient at the top */
}

.service:hover {
    background-position: 100% 100%;
    color: #fff !important;
    /* move the gradient to the bottom on hover */
}

.service img {
    max-width: 100%;
    height: auto;
    margin-bottom: 15px;
}

.service h2 {
    color: #333;
    font-size: medium;
}

.service p {
    color: #666;
    font-size: small;
}

.service a {
    color: #00A8B5;
    text-decoration: none;

}

/* technology -------------------------------------------- */

.technology-container {
    padding: 100px 50px 100px 50px;
    background-color: #000;
}

.technology-header {
    text-align: left;
    animation: fadeIn 3s ease-in-out;

}

.technology-header h1 {
    color: #fff;
    margin-bottom: 10px;
}

.technology-header p {
    color: #fff;
    width: 70%;
}

.technologies {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin-top: 30px;
    animation: anim-lineUp 4s ease-in-out;

}

.technology {
    width: 10%;
    text-align: center;
    margin-bottom: 20px;

}
.technology:hover {
    color: #00A8B5;
    filter: invert(31%) sepia(81%) saturate(2000%) hue-rotate(137deg) brightness(66%) contrast(88%);
}

.technology img:hover {
    fill: #00A8B5;
}

.technology img {
    /*max-width: 1060%;*/
    object-fit: scale-down;
    width: 60px;
    height: 60px;
    padding: 10%;
    filter: none;
    /* height: 60px; 
    border-radius: 10px; */
}

.technology h4 {
    color: #fff;
    font-size: small;
}

/* testimonial -------------------------------------------- */
.testimonial-container {
    background-color: #eff3ff !important;
    padding: 100px 50px 100px 50px;
    text-align: center;
}

.testimonial {
    display: none;
}

.testimonial-part {
    display: flex;
    justify-content: space-around;
    align-items: center;
    animation: fadeIn 3s ease-in-out;
}

.testimonial.active {
    display: block;
    text-align: -webkit-center;
    margin-top: 40px;
}

.testimonial-quote {
    font-style: italic;
    width: 60%;
}

.testimonial-author {
    margin-top: 20px;
    font-weight: bold;
}

.testimonial-navigation {
    display: flex;
    justify-content: space-between;
    max-width: 600px;
    margin: 30px auto;
}

.nav-arrow {
    cursor: pointer;
    background-color: white;
    border-radius: 50%;
    padding: 15px;
}

/* Indystry -------------------------------------------- */

.Industry-container {
    padding: 100px 50px 100px 50px;
    background-color: #000;
}

.Industry-header {
    text-align: left;
    animation: fadeIn 2s ease-in-out;
}

.Industry-header h1 {
    color: #fff;
    margin-bottom: 10px;
}

.Industry-header p {
    color: #fff;
    width: 70%;
}

.Industries {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin-top: 30px;
}

.Industry {
    width: 20%;
    text-align: left;
    display: flex;
    align-items: center;
    margin: 20px;
    padding: 15px;
    background-color: #1d1d1d;
    border-radius: 15px;
    animation: anim-lineUp 4s ease-in-out;

}

.Industry img {
    max-width: 100%;
    height: auto;
    /* border-radius: 10px; */
}

.Industry h4 {
    color: #fff;
    font-size: small;
    margin-left: 10px;
}

/* Trusted -------------------------------------------- */

.Trusted-container {
    padding: 100px 50px 100px 50px;
    background-color: #fff;
}

.Trusted-header {
    text-align: left;
    animation: fadeIn 2s ease-in-out;

}

.Trusted-header h1 {
    color: #000;
    margin-bottom: 10px;
}

.Trusted-header p {
    color: #000;
    width: 70%;
}

.Trusts {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 30px;
}

.Trusted {
    /* width: 20%; */
    text-align: center;
    animation: anim-lineUp 4s ease-in-out;
}

.Trusted img {
    max-width: 1000px;
    object-fit: fill;
    margin: 15px;
}

.get-in-touch-container {
    width: 70%;
    display: flex;
    justify-content: center;
    padding: 40px 100px 40px 100px;
    border-radius: 10px;
    background-color: #000;
    color: white;
    animation: anim-lineUp 4s ease-in-out;
}

.get-in-touch {
    text-align: center;
}

.get-in-touch h1 {
    font-size: xxx-larger;
    font-weight: 900;
}

.get-touch-outer {
    width: 100%;
    display: flex;
    justify-content: center;
}

footer {
    background-color: #000;
    color: hsla(0, 0%, 100%, .7);
}

.footer-services h6,
.footer-company h6,
.footer-contact h6,
.footer-links h6 {
    font-size: larger;
}

.footer-services p a,
.footer-company p a,
.footer-contact p a,
.footer-links p a {
    font-size: medium;
}

/* Services Page -------------------------------------------------------- */

.services-container {
    display: block;
    position: relative;
    width: auto;
    height: auto;
    background-color: white;
}

.services-container .container .row {
    padding: 20px;
}

.services-container .container .row .col-md-6 {
    padding: 10px 10px 0px 10px;
}

.services-container .container .row .col-md-6 h1 {
    width: 80%;
    font-size: 40px;
    font-weight: 800;
    color: #00A8B5;
}

.services-container .container .row .col-md-6 h3 {
    font-size: 30px;
    font-weight: 700;
    width: 85%;
}

.services-container .container .row .col-md-6 p {
    color: #7e8085;
    font-size: 15px;
    font-weight: 400;
    padding-top: 10px;
    width: 85%;
}

.services-container .service-part-1 .row .col-md-6 a {
    text-decoration: none;

    font-size: 20px;
    font-weight: 700;
    padding-top: 10px;
}

.services-container .service-part-2 .row .col-md-6 a {
    text-decoration: none;

    font-size: 20px;
    font-weight: 500;
    padding-top: 10px;
}

.services-container .service-part-2 .row .col-md-6 img {
    height: auto;
    max-width: 80%;
    vertical-align: top;
    border-radius: inherit;
}

.services-container .service-part-2 .row .service-img-1 p {
    color: #7e8085;
    font-size: 15px;
    font-weight: 600;
    padding-top: 10px;
    width: 80%;
}

.read-more-case-study {
    display: inline;
    padding: 5px;
    border-bottom: 2px solid #00A8B5;
}

.read-more-case-study a {
    text-decoration: none;
    color: #00A8B5;
    font-size: 20px;
    font-weight: 900 !important;
}

.our-client-on-services {
    background-color: #f9f4ef !important;
}

.our-clients-logos-container {
    width: 70% !important;
    display: flex;
    flex-wrap: wrap;
}

.our-clients-logos-container-in {
    /* background-color: white; */
    width: 33%;
    display: inline-block;
    background-size: contain;
    object-fit: scale-down;
    padding: 50px 0px 50px 0px;
    text-align: center;
}

.our-clients-logos-container-in img{
    width: 70%;
    text-align: center;
}

.ol-solutions {
    padding-left: 20px;
}

.ul-features {
    padding-left: 25px;
}

/* Our Works Page ------------------------------------ */
.our-work-container {
    display: block;
    position: relative;
    width: auto;
    height: auto;
    background-color: white;
}

.our-work-container .our-work-container-in {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #686762;
    margin: 30px;
}

.our-work-container .our-work-container-in .our-work-container-left {
    width: 50%;
    padding: 30px;
    color: #fff;
}

.our-work-container .our-work-container-in .our-work-container-left img {
    width: -webkit-fill-available;
}

.our-work-container .our-work-container-in .our-work-container-right {
    color: #fff;
    width: 50%;
    padding: 30px;
}

.our-work-container .our-work-container-in .our-work-container-right h2 {
    font-weight: 700 !important;
}

.our-work-container .our-work-container-in .our-work-container-right p {
    font-size: larger;
    font-weight: 600 !important;
}

.our-work-container .our-work-container-in .our-work-container-right a {
    font-size: small;
    font-weight: 700 !important;
}

.hire-team-container {
    background-color: black;
    padding: 50px;
}

.hire-team-container .container {
    display: flex;
    justify-content: center;
    align-items: center;
}

.hire-team-content {
    width: 60%;
    color: white;
}

.hire-team-content h1 {
    font-weight: 700;
}

.hire-team-content p {
    font-size: larger;
    font-weight: 500;
    color: #7e8085;
}

.hire-team-content a {
    font-weight: 700;
}


/* Career / Jobs ------------------------------------ */
.jobs-container {
    display: block;
    position: relative;
    width: auto;
    height: auto;
    background-color: white;
}

.jobs-open-pos-container {
    display: block;
    position: relative;
    width: auto;
    height: auto;
    background-color: #f9f4ef;
    padding: 10px;
}

.jobs-flex-1 {
    padding: 10% 0px 0px 10%;
    display: flex;
}

.jobs-flex-2 {
    padding: 5% 0px 0px 30%;
    display: flex;
    width: fit-content;
}

.jobs-container-1 {
    width: 50%;
}

.jobs-container-2 {
    width: 65% !important;
}

.jobs-container-1 h1,
.jobs-container-2 h1 {
    font-size: 60px;
    font-weight: 700;
    color: #7e8085;
}

.jobs-container-1 p {
    padding: 20px 0px 20px 0px;
    font-size: large;
    font-weight: 600;
}

.jobs-container-2 p {
    padding: 20px 0px 20px 0px;
    font-size: medium;
    font-weight: 600;
    color: #7e8085;
}

.jobs-flex-2 .jobs-container-2 .jobs-table .row .col-sm-12 h1 {
    color: #000 !important;
    font-size: x-large !important;
    font-weight: 700;
}

.jobs-flex-2 .jobs-container-2 .jobs-table .row .col-sm-12 p {
    font-weight: 500;
}

.jobs-pos-heding h1 {
    font-size: 45px;
    font-weight: 700;
    padding: 10px 0px 10px 0px;
}

.Job-posts {
    padding: 0px;
    border-bottom: 1px solid black;
    justify-content: center;
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.jobs-posts-first h2 {
    font-size: large;
    font-weight: 700;
}

.jobs-posts-first p {
    font-size: small;
    color: #ccc;
    font-weight: 700;
}

.jobs-slider {
    display: block;
    position: relative;
    width: auto;
    height: auto;
    background-color: black;
    color: white;
    padding: 50px 20px 50px 20px;
}

.jobs-slider .container h2 {
    margin: 0px 0px 50px 00px;
    font-size: xxx-large;
    font-weight: 700;
}

/* Slider -------------*/

.slick-slide {
    margin: 0px 20px;
}

.slick-slide img {
    width: 100%;
}

.slick-slider {
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list {
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    padding: 0;
}

.slick-list:focus {
    outline: none;
}

.slick-list.dragging {
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.slick-track {
    position: relative;
    top: 0;
    left: 0;
    display: block;
}

.slick-track:before,
.slick-track:after {
    display: table;
    content: '';
}

.slick-track:after {
    clear: both;
}

.slick-loading .slick-track {
    visibility: hidden;
}

.slick-slide {
    display: none;
    float: left;
    height: 100%;
    min-height: 1px;
}

[dir='rtl'] .slick-slide {
    float: right;
}

.slick-slide img {
    display: block;
}

.slick-slide.slick-loading img {
    display: none;
}

.slick-slide.dragging img {
    pointer-events: none;
}

.slick-initialized .slick-slide {
    display: block;
}

.slick-loading .slick-slide {
    visibility: hidden;
}

.slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
    display: none;
}

.any-question {
    display: block;
    position: relative;
    height: auto;
    width: auto;
    background-color: #000;
    color: white;
}

.any-question .container h1 {
    margin: 50px 50px 20px 50px;
    font-size: xxx-large;
    font-weight: 800;
}

.any-question .container p {
    margin: 0px 50px 50px 50px;
    font-size: x-large;
    font-weight: 600;
}

/* About Page ---------------------------------------------------- */
.about-first-container {
    display: block;
    position: relative;
    width: auto;
    height: auto;
    background-color: white;
    padding: 45px 15px 35px 45px;
}

.about-in-part-1 {
    padding: 30px;
    display: flex;
}

.about-1-left {
    text-align: center;
    width: 50%;
}

.about-1-left h1 {
    display: inline;
    font-weight: 700;
    color: #00A8B5;
}

.about-1-right {
    width: 50%;
}

.about-1-right h1 {
    font-weight: 700;
    padding-bottom: 15px;
}

.about-1-right h3 {
    font-size: x-large;
    font-weight: 400;
    padding-bottom: 15px;
}

.about-2-right-in h1 {
    font-size: x-large;
    font-weight: 700;
    padding-bottom: 5px;
}
.about-2-right-in img {
    filter: grayscale();
}

/* Testimonial Page ---------------------------------------------- */
.testimonial-page-container {
    display: block;
    position: relative;
    background-color: white;
    width: auto;
    height: auto;
    /* padding: 45px 15px 45px 15px; */
}

.testimonial-page-heading {
    padding: 30px;
}

.testimonial-page-heading h1 {
    width: 50%;
    color: #00A8B5;
    font-weight: 700;
}

.testimonial-page-content {
    display: flex;
    padding: 30px;
}

.testimonial-content-1 {
    width: 25%;
    text-align: center;
}

.testimonial-content-1 i {
    font-size: 100px;
    color: #00A8B5;
}

.testimonial-content-2 {
    width: 45%;
}

.testimonial-content-2-in {
    margin: 0px 55px 0px 15px;
}

.testimonial-content-3 {
    width: 30%;
}

.testimonial-content-3 img {
    width: 100%;
}

.about-us-cynux-journey h5 {
    font-size: larger;
    font-weight: 700;
}

.about-us-cynux-journey h2 {
    font-size: xxx-large;
    font-weight: 800 !important;
    color: #00A8B5;
    width: 50%;
    margin: 0px 0px 10px 0px !important;
    line-height: 1;
}

.about-us-cynux-journey p {
    font-size: large;
    font-weight: 700;
    width: 45%;
    margin-bottom: 60px !important;
}

.join-our-team-container {
    display: block;
    position: relative;
    width: auto;
    height: auto;
    padding-top: 45px;
    background-color: black;
    color: white;
    padding-bottom: 45px 10px 45px 10px;
}

.join-our-team-in {
    display: flex;
    justify-content: space-between;
}

.join-our-team-1 {
    width: 40%;
}

.join-our-team-1 h1 {
    color: #00A8B5;
    font-weight: 700;
}

.join-our-team-1 p {
    color: #b1b0b0;
    font-weight: 700;
    font-size: x-large;
}

.join-our-team-1 h1 {
    color: #00A8B5;
}

.join-our-team-2 {
    width: 30%;
}

.join-our-team-2 a {
    font-weight: 700;
}

.about-2-right-in img {
    width: 100%;
}

/* contact Page ------------------------------------ */
.contact-page-container {
    background-color: #fffef6 !important;
    display: block;
    position: relative;
    width: auto;
    height: auto;
    padding: 50px;
    /* text-align: center; */

}

.contact-page-container .container {
    background-color: #fff !important;
    width: 70%;
    height: auto;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    /* text-align: center; */
}

.contact-page-form {
    padding: 100px;
}

.contact-page-form-in-1 {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
}

.contact-page-form-in-1 h1 {
    color: #00A8B5;
    font-size: 35px;
    font-weight: 700;
}

.contact-page-form-in-1 i {
    color: #00A8B5;
}

.contact-page-form-in-2 label {
    color: #000;
    font-size: medium;
    font-weight: 500;
}

.checkboxes-container-contact {
    margin-top: 10px;
    padding: 0px 20px 0px 20px;
    display: flex;
    flex-wrap: wrap;
}

.checkboxes-container-contact .checkbox {
    width: 33%;
}

.checkboxes-container-contact .checkbox label {
    color: #000;
    font-size: small;
    font-weight: 400;
}

.contact-page-address {
    background-color: #fffef6 !important;
    display: block;
    position: relative;
    width: auto;
    height: auto;
    padding-top: 50px;
}

.contact-page-address .container {
    width: 50%;
    text-align: center;
}

.contact-address-div {
    display: flex;
    justify-content: space-around;
}

.contact-page-address h1 {
    font-weight: 700;
    margin-bottom: 20px;
}

.address-1 div,
.address-2 div {
    display: flex;
}
.address-2 h3 {
    padding-left: 10px;
    display: flex;
}

.address-1 div img,
.address-2 div img {
    height: 30px;
}

.address-1 p,
.address-2 p {
    text-align: left;
}

.footer-page-container-in {
    padding: 30px;
}

/* Case Study ----------------------------------------------- */
.case-study-container {
    /* background-color: #fffef6 !important; */
    display: block;
    position: relative;
    width: auto;
    height: auto;
    padding: 100px 0px 100px 0px;
    background-color: white;
}

.case-study-container .container .row {
    padding-bottom: 50px;
}

.case-study-container .container .row .col-md-6 h1 {
    font-size: xxx-large;
    font-weight: 800;
}

.case-study-container .container .row .col-md-6 h5 {
    font-size: x-large;
    font-weight: 500;
}

.case-study-container .container .row .col-12 img {
    width: 100%;
    height: auto;
}

.case-study-points h3 {
    margin-top: 30px;
    font-size: x-large;
    font-weight: 700;
}

.case-study-points p {
    font-size: medium;
    font-weight: 400;
    color: #808080;
}

.case-study-points a {
    font-size: large;
    font-weight: 700;
}

.what-we-did-case-study h1 {
    font-size: xxx-large;
    font-weight: 700;
}

.what-we-did-case-study p {
    margin-top: 40px;
    font-size: medium;
    font-weight: 400;
    color: #808080;
}

.case-study-imgs {
    margin-top: 50px;
    background-color: #f2f2f2 !important;
    padding: 100px !important;

}

.case-study-imgs img {
    width: 100%;
}

.testimonial-case-study {
    background-color: #000;
    color: white;
    padding: 100px;
}

.testimonial-case-study h1 {
    font-size: xx-large;
    font-weight: 700;
}

.testimonial-case-study p {
    margin-top: 30px;
    color: #f2f2f2;
    font-size: large;
    font-weight: 400;
}

/*----------------------------------------------------- Tablet -------------------------------------------------------- */

@media (max-width: 1024px) {
    .main-header {
        margin-bottom: calc(95vh - 10vh - 25vh - 30vh);
    }

    .bg-vedio {
        height: 80vh;
    }

    #background-video {
        height: 80vh;
    }

    .home-content h1 {
        width: 90%;
    }

    .dropdown-content {
        z-index: 1;
        position: fixed;
        left: 0px;
        width: 98vw !important;
        display: none;
        margin-top: 20px;
        /* position: absolute; */
        width: max-content;
        background: white;
        border-radius: 10px;
    }

    .dropdown-content .col-md-2 a .service-menu {
        padding: 10px;
    }

    .dropdown-content .col-md-2 a .service-menu:hover {
        padding: 10px;
    }

    .service {
        width: 30%;
    }

    .Industry {
        width: 28%;
    }

    .testimonial-container {
        padding: 100px 10px 100px 10px;
    }

    .our-clients-logos-container {
        width: 100% !important;

    }

    .our-clients-logos-container-in {
        background-color: white;
        width: 33%;
        padding: 50px 0px 50px 0px;
        text-align: center;
    }

    .our-work-container .container .our-work-container-in {
        flex-wrap: wrap;
        margin: 15px;
    }

    .our-work-container .container {
        padding: 0;
        padding-top: 10px;
    }

    .our-work-container .our-work-container-in .our-work-container-left {
        width: 100%;
    }

    .our-work-container .our-work-container-in .our-work-container-right {
        width: 100%;
    }

    /* About Page ------------------------------------------------------ */
    .about-first-container {
        padding: 30px 30px 30px 30px;
    }

    .about-in-part-1 {
        padding: 0px;
        display: block;
    }

    .about-1-left {
        margin-bottom: 10px;
        text-align: left;
        width: 100%;
    }

    .about-1-left h1 {
        display: inline;
        font-size: xx-large;
    }

    .about-1-right {
        width: 100%;
    }

    .about-1-right h1 {
        padding-bottom: 15px;
    }

    .about-1-right h3 {
        font-size: large;
        padding-bottom: 15px;
    }

    .about-2-right-in {
        margin-top: 30px !important;
        margin-bottom: 0px !important;
    }

    .about-2-right-in h1 {
        padding-bottom: 5px !important;
    }

    .about-us-cynux-journey h2 {
        width: 100%;
    }

    .about-us-cynux-journey p {
        width: 100%;
    }

    .join-our-team-in {
        display: block;
    }

    .join-our-team-1 {
        width: 100%;
    }

    .join-our-team-2 {
        width: 100%;
    }

    .join-our-team-container {
        padding: 30px;
    }

    .testimonial-page-heading {
        padding: 30px 30px 30px 30px;
    }

    .testimonial-page-heading h1 {
        width: 100%;
        font-size: xx-large;
    }

    .testimonial-page-content {
        display: block;
        padding: 0px !important;
    }

    .testimonial-content-1 {
        width: 100%;
    }

    .testimonial-content-1 i {
        margin: 40px 40px 40px 40px;
        font-size: 100px;
        color: #00A8B5;
    }

    .testimonial-content-2 {
        width: 100%;
    }

    .testimonial-content-2-in {
        padding: 30px !important;
    }

    .testimonial-content-2-in p {
        font-size: larger;
    }

    .testimonial-content-2-in h3 {
        font-size: larger;
        font-weight: 700;
    }

    .testimonial-content-3 {
        width: 100%;
        height: 100%;
        padding: 30px 30px 30px 30px;
    }

    .testimonial-content-3 img {
        width: 100%;
    }

    /* contact Page ------------------------------------ */
    .contact-page-container {
        padding: 30px;
    }

    .contact-address-div {
        display: block;
    }

    .contact-page-container .container {
        width: 100%;
    }

    .contact-page-form-in-1 h1 {
        font-size: x-large;
    }

    .contact-page-form {
        padding: 30px 10px 30px 10px;
    }

    .checkboxes-container-contact {
        display: block;
    }

    .checkboxes-container-contact .checkbox {
        width: 100%;
    }

    .contact-page-address .container {
        margin: 30px;
        width: auto;
    }

    .contact-page-address {
        padding-top: 30px;
    }

    .footer-page-container-in {
        padding: 20px 10px 20px 10px;
    }

    .footer-services p a,
    .footer-links p a {
        color: #b1b0b0 !important;
    }

    .footer-contact p {
        color: #b1b0b0 !important;
    }

    .case-study-imgs {
        margin-top: 30px;
        background-color: #f2f2f2 !important;
        padding: 20px !important;
    }


    .testimonial-case-study {
        padding: 40px;
    }

    .testimonial-case-study h1 {
        font-size: x-large;
    }

    .testimonial-case-study p {
        font-size: medium;
    }

}

/*----------------------------------------------------- Mobile -------------------------------------------------------- */
@media (max-width: 550px) {

    .laptop {
        display: none;
    }

    .mobile {
        display: block;
    }

    .main-header {
        margin-bottom: calc(95vh - 10vh - 25vh - 40vh);
    }

    .bg-vedio {
        height: 78vh;
    }

    #background-video {
        height: 78vh;
    }

    .out-header {
        background-color: white;
    }

    .header-fixed .header {
        /* position: fixed !important; */
    }

    .header {
        height: 6vh;
    }

    .header-left h1 {
        font-size: large;
    }

    /* Slider Content --------------------------------------------------- */
    .home-content {
        margin-top: 7vh;
    }

    .home-content h1 {
        font-size: 40px;
        width: 90%;
    }

    .home-content h2 {
        font-size: 40px;
    }

    .home-content p {
        width: 100%;
    }

    /* About Content ----------------------------------------- */

    .about-container {
        height: auto;
    }

    .about-content h1 {
        margin-top: 10%;
        font-weight: 700;
    }

    .about-content p {
        font-size: large;
        font-weight: 500;
    }

    .about-res .row {
        padding: auto;
        height: auto;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    }

    .about-res .row .col-md-3 {
        padding: 10% 0 auto 0;
        margin: 20px;
    }

    .about-res .row .col-md-3 .num {
        text-align: center;
        padding-top: 20%;
        font-size: xx-large;
        font-weight: 700;
    }

    .about-res .row .col-md-3 .text {
        text-align: center;
        font-size: large;
        font-weight: 500;
        padding-bottom: 20%;
    }

    .about-res .row .col-md-3 .num {
        font-size: xx-large;
        font-weight: 700;
    }

    /* What we do?? --------------------------------------- */
    .what-we-do-container {
        padding: 20px;
    }

    .service {
        width: 95%;
        margin: 5px;
    }

    .technology {
        width: 30%;
    }

    .Industry-container {
        padding: 100px 10px 100px 10px;
    }

    .Industry {
        width: 100%;
        margin: 5px;
    }

    .Trusted {
        width: 50%;
    }

    .Trusted-container {
        padding: 100px 10px 100px 10px;
    }

    /* Services -------------------------------------------------- */

    .services-container .container .row .col-md-6 {
        padding: 10px 10px 0px 10px;
    }

    .services-container .container .row .col-md-6 h1 {
        font-size: 30px;
        font-weight: 700;
        color: #00A8B5;
        width: 100%;
    }

    .services-container .container .row .col-md-6 h3 {
        font-size: 35px;
        font-weight: 700;
        width: 100%;
    }

    .services-container .container .row .col-md-6 p {
        color: #7e8085;
        font-size: 20px;
        font-weight: 400;
        padding-top: 10px;
        width: 100%;
    }

    .our-clients-logos-container {
        width: 100% !important;
    }

    .our-clients-logos-container-in {
        background-color: white;
        width: 48%;
        padding: 50px 5px 50px 5px;
        text-align: center;
    }

    .our-clients-logos-container-in img {
        width: -webkit-fill-available;
    }

    .our-client-on-services .container .row {
        padding: 0px;
        margin: 0px !important;
    }

    .jobs-slider .container h2 {
        margin: 0px 0px 50px 00px;
        font-size: x-large;
        font-weight: 700;
    }

    .jobs-slider .container {
        overflow: hidden;
    }

    .jobs-slider .container section {
        width: 200%;
        height: 200%;
    }

    /* Our Works Page -------------------------------------------------- */
    .hire-team-container {
        padding: 15px;
    }

    .hire-team-content {
        width: 100%;
    }

    .hire-team-content h1 {
        padding-top: 60px;
        font-weight: 700;
        font-size: x-large;
    }

    .hire-team-content p {
        font-size: large;
        font-weight: 500;
        color: #7e8085;
    }

    .hire-team-content a {
        font-weight: 700;
    }

    /* Career / Jobs ------------------------------------ */
    .jobs-flex-1 {
        padding: 10px;
    }

    .jobs-flex-2 {
        padding: 10px;
    }

    .jobs-container-1 {
        width: 100%;
    }

    .jobs-container-2 {
        width: 100% !important;
    }

    .jobs-container-1 h1,
    .jobs-container-2 h1 {
        font-size: 30px;
    }

    .jobs-container-1 p {
        padding: 10px;
    }

    .jobs-container-2 p {
        padding: 10px;
    }

    /* About Page ------------------------------------------------------ */
    .about-first-container {
        padding: 30px 0px 30px 0px;
    }

    .about-in-part-1 {
        padding: 0px;
        display: block;
    }

    .about-1-left {
        margin-bottom: 10px;
        text-align: left;
        width: 100%;
    }

    .about-1-left h1 {
        display: inline;
        font-size: xx-large;
    }

    .about-1-right {
        width: 100%;
    }

    .about-1-right h1 {
        padding-bottom: 15px;
    }

    .about-1-right h3 {
        font-size: large;
        padding-bottom: 15px;
    }

    .about-2-right-in {
        margin-top: 30px !important;
        margin-bottom: 0px !important;
    }

    .about-2-right-in h1 {
        padding-bottom: 5px !important;
    }

    .about-us-cynux-journey h2 {
        width: 100%;
    }

    .about-us-cynux-journey p {
        width: 100%;
    }

    .join-our-team-in {
        display: block;
    }

    .join-our-team-1 {
        width: 100%;
    }

    .join-our-team-2 {
        width: 100%;
    }

    .testimonial-page-heading {
        padding: 30px 0px 10px 0px;
    }

    .testimonial-page-heading h1 {
        width: 100%;
        font-size: xx-large;
    }

    .testimonial-page-content {
        display: block;
        padding: 0px !important;
    }

    .testimonial-content-1 {
        width: 100%;
    }

    .testimonial-content-1 i {
        margin: 40px 0px 40px 0px;
        font-size: 100px;
        color: #00A8B5;
    }

    .testimonial-content-2 {
        width: 100%;
    }

    .testimonial-content-2-in {
        margin: 10px !important;
    }

    .testimonial-content-2-in p {
        font-size: larger;
    }

    .testimonial-content-2-in h3 {
        font-size: larger;
        font-weight: 700;
    }

    .testimonial-content-3 {
        width: 100%;
        height: 100%;
        padding: 15px 0px 15px 0px;
    }

    .testimonial-content-3 img {
        width: 100%;
    }

    /* contact Page ------------------------------------ */
    .contact-page-container {
        padding: 30px;
    }

    .contact-address-div {
        display: block;
    }

    .contact-page-container .container {
        width: 100%;
    }

    .contact-page-form-in-1 h1 {
        font-size: x-large;
    }

    .contact-page-form {
        padding: 30px 10px 30px 10px;
    }

    .checkboxes-container-contact {
        display: block;
    }

    .checkboxes-container-contact .checkbox {
        width: 100%;
    }

    .contact-page-address .container {
        margin: 30px;
        width: auto;
    }

    .contact-page-address {
        padding-top: 30px;
    }

    .footer-page-container-in {
        padding: 20px 10px 20px 10px;
    }

    .footer-services p a,
    .footer-links p a {
        color: #b1b0b0 !important;
    }

    .footer-contact p {
        color: #b1b0b0 !important;
    }

    .case-study-imgs {
        margin-top: 30px;
        background-color: #f2f2f2 !important;
        padding: 20px !important;
    }

    .case-study-container .container .row .col-md-6 {
        text-align: left !important;
    }

    .testimonial-case-study {
        padding: 30px;
    }

    .testimonial-case-study h1 {
        font-size: large;
    }

    .testimonial-case-study p {
        font-size: small;
    }
}