@font-face {
    font-family: 'K_font';
    src: url('KohinoorLatin-Light-BF63c76513209af.otf') format('opentype');
}

@font-face {
    font-family: 'K_font_Bold';
    src: url('KohinoorLatin-Demi-BF63c765144638d.otf') format('opentype');
}

html {
    scroll-behavior: smooth;
}

* {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

.navbar a {
    text-decoration: none;
    color: black;
}

a {
    text-decoration: none;
}

body {
    padding-top: 56px;
}

.navbar {
    background-color: rgb(255, 255, 255);
    color: black;
    height: 56px;
    position: absolute;
    /* Add this line */
    top: 0;
    /* Add this line */
    left: 0;
    /* Add this line */
    width: 100%;
    /* Add this line */
    z-index: 1;
    /* Add this line */
}

.navbar .flex {
    justify-content: space-between;
}

.navbar ul {
    display: flex;
    align-items: center;
}

.small-svg {
    width: 142px;
    /* Set the desired width */
    height: auto;
}

.container {
    overflow: auto;
    margin: 0 auto;
    padding: 0 49px;
}

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

.vertical-line {
    border-left: 1px solid rgb(142, 142, 142);
    /* Adjust the color and thickness as needed */
    height: 20px;
    /* Set the desired height */
}

.navbar a {
    padding: 20px;
    margin: 0 10px;
    display: inline-block;
    transition: transform 0.3s ease;
}

.navbar .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 49px;
}

.navbar .logo {
    display: flex;
    align-items: center;
}

ul {
    list-style-type: none;
}

a {
    text-decoration: none;
    color: black;
}


.testimonials-box a {
    text-decoration: none;
    color: rgb(255, 255, 255);
    transition: transform 0.3s ease;
}

text-box,
container,
h1,
h2 {
    font-weight: 300;
    line-height: 1.2;
    margin: 10px 0;
}

p {
    margin: 10px 0;
}








/*Testimonials*/

.testimonials-box {
    background-color: #040125;
    color: white;
    padding: 20px;
    height: 15rem;
}

.testimonials-box h3 {
    font-size: 35px;
    font-weight: bold;
    font-family: 'K_font';
    padding-left: 2.5rem;
    padding-top: 0.6rem;
}

.testimonial-row {
    display: flex;
    padding-top: 1rem;
}

.testimonial {
    flex: 1;
    margin: 10px;
}

.testimonial h2 a {
    transition: transform 0.3s ease;
    display: inline-block;
}

h2 {
    font-size: 22px;
    font-weight: bold;
}

.testimonial-content {
    margin-top: 10px;
}

.line_up {
    border-top: 1px solid white;
    margin: 5px 0;
    width: 24%;
    border-radius: 2px;
}

.line {
    border-top: 1px solid white;
    margin: 5px 0;
    width: 98%;
    border-radius: 1px;
}

.testimonial-content p {
    font-size: 16px;
    font-style: italic;
}

.testimonial-row {
    padding-left: 1rem;
}




/* Photo Testimonial */

.stuff {
    display: flex;
    margin-top: 0.5rem;
}

.stuff_1,
.stuff_2 {
    flex: 1;
    text-align: start;
    padding: 20px;
}

.stuff_1 h2,
.stuff_2 h2 {
    font-size: 20px;
    font-weight: bold;
    padding-left: 9px;
    font-family: 'K_font';
}

.stuff_1 img,
.stuff_2 img {
    display: block;
    max-width: 100%;
    height: auto;
    margin-top: 10px;
}



/* Concluding */

.line_2 {
    border-top: 2px solid rgb(0, 29, 118);
    width: 98%;
    border-radius: 2px;
    padding-bottom: 1rem;
}

.Conclusion {
    padding-left: 35px;
    padding-right: 20px;
    margin-top: 0.6rem;
    font-family: 'K_font';
}

.Text_DH {
    font-size: 17px;
    font-family: "Times New Roman", Times, serif;
    line-height: 1.3;
}



/* Pre-footer */
.container-Logo {
    display: flex;
    align-items: center;
}

.logo {
    width: 20%;
    /* Adjust the width as needed */
    height: auto;
    /* Maintain aspect ratio */
    margin-right: 20px;
    /* Add spacing between logo and text */
}

.text-Logo {
    font-size: 15px;
    line-height: 1.4;
    color: #333;
    font-family: 'K_font';
    font-weight: bold;
}

div.container-Logo {
    padding-left: 2rem;
    padding-bottom: 2rem;
    margin-top: 2rem;
}



/* Footer */
.footer {
    background-color: #040125;
    color: #fff;
    padding: 20px;
    display: flex;
    flex-direction: column;
    /* Arrange items in a column layout */
    height: 90%;
}

.description {
    margin-bottom: 20px;
    /* Add spacing between description and contact info */
}

.description p {
    margin: 5px 22px;
    color: #ff5151;
}

footer.footer div.description p {
    color: #ff5151;
}

.contact-info {
    display: flex;
    justify-content: space-between;
    font-family: 'K_font';
    font-weight: bold;
    color: white;
}

.contact-info p {
    margin-right: 4rem;
    margin-left: 4rem;
    font-size: 16px;
}




/* Hovering */

.navbar a:hover {
    transform: scale(1.04);
}

.contact-info p:hover {
    text-decoration: underline;
}

div#section3.contact-info p a {
    color: white;
}

.testimonial h2 a:hover {
    font-style: italic;
    transform: scale(1.01);
}




@media (min-width: 1200px) and (max-width: 1920px) { 
    .navbar {
        font-size: 20px; /* 16 px is optimal */
    }
}

@media (min-width: 0px) and (max-width: 480px) {

    .navbar {
        font-size: 11px;
        height: 10px;
    }

    .navbar .container {
        padding: 0 5px;
    }

    .navbar a {
        padding: 0px;
    }

    .small-svg {
        width: 88px;
    }

    .testimonials-box {
        height: 29rem;
        padding: 13px;
    }

    .testimonial-row {
        padding-left: 0;
        padding-bottom: 1rem;
        padding-top: 0;
    }

    .testimonial-content {
        font-size: 15px;
    }

    .stuff {
        display: flex;
        flex-direction: column;
    }

    .stuff_1 h2,
    .stuff_2 h2 {
        font-size: 16px;
    }

    .stuff_1,
    .stuff_2 {
        padding: 12px;
    }

    div.container-Logo {
        display: flex;
        flex-direction: column-reverse;
    }

    .Text_DH {
        font-size: 15px;
    }

    .text-Logo {
        font-size: 14px;
    }

    .container-Logo img {
        width: 50%;
        padding-top: 2rem;
    }

    .contact-info {
        display: flex;
        flex-direction: column;
    }

    .description p {
        margin: 3px 0px;
        font-size: 13px;
    }

    .contact-info p a {
        font-size: 13px;
        margin: 6px 0;
    }
}



@media (min-width: 480px) and (max-width: 660px) {

    .testimonials-box {
        height: 21rem;
    }

    .navbar ul {
        font-size: 12px;
    }

    .navbar a {
        padding: 15px;
        margin: 0 4px;
    }

    .navbar .container {
        padding: 0 13px;
    }

    .small-svg {
        width: 130px;
    }

    .stuff_1 h2,
    .stuff_2 h2 {
        font-size: 11px;
    }

    .stuff_1,
    .stuff_2 {
        padding: 12px;
    }

    .Text_DH {
        font-size: 15px;
    }

    .text-Logo {
        font-size: 11px;
    }

    .container-Logo img {
        width: 23%;
    }

    .description p {
        margin: 0px 5px;
        font-size: 13px;
    }

    .contact-info p {
        font-size: 13px;
        margin-right: 0rem;
        margin-left: 0rem;
    }
}





@media (min-width: 660px) and (max-width: 768px) {

    .navbar a {
        padding: 16px;
    }

    .testimonials-box {
        height: 19rem;
    }

    .container-Logo img {
        width: 24%;
    }

    .text-Logo {
        font-size: 13px;
    }

    .stuff_1 h2,
    .stuff_2 h2 {
        font-size: 16px;
    }

    .description p {
        margin: 2px 9px;
        font-size: 14px;
    }

    .contact-info p {
        margin-right: 2rem;
        margin-left: 2rem;
        font-size: 13px;
    }
}



@media (min-width: 769px) and (max-width: 889px) {

    .testimonials-box {
        height: 16rem;
    }

    .contact-info p {
        margin-right: 2rem;
        margin-left: 2rem;
        font-size: 13px;
    }

    .text-Logo {
        font-size: 14px;
    }

    .container-Logo img {
        width: 22%;
    }
}