body {
    background-color: #fafafa;
}

.navbar{
   background-color: #fafafa;
    box-shadow: none;
    outline: none;
    border: none;
}

.navbar-link,
.nav-link {
    font-family: neue-kabel-book, sans-serif; /* Apply the Adobe Fonts Book style */
    color: black; /* Set the color to black */
    text-decoration: none; /* Remove underline */
    transition: font-family 0.3s, font-size 0.3s;
    font-size: 16px;
    padding: 0 15px;
}

.navbar-link:hover,
.nav-link:hover {
    font-family: neue-kabel-bold, sans-serif; /* Change the font to bold when hovering */
    font-size: 18px;
}

#projectRightNavBar{
    background-color: #c4d9de;
}

#visualColumn{

    background-color: #c4d9de;
    
    background-position: center;
  
}

#technicalColumn{
    height: 95.6vh;
}


/* active switch color */
.form-check-input:checked {
    background-color: #00539c; /* Change background color when switch is checked */
}

button, a {
    color: #808080;
    border: none; /* Remove border */
    background-color: transparent; /* Remove background color */
    padding: 0; /* Remove padding */
    font-family: neue-kabel-book, sans-serif;
    cursor: pointer; /* Change cursor to pointer */
    margin-right: 10px;
}

button, a:hover {
    /*color: #00539c;*/
    font-family: neue-kabel-bold, sans-serif; /* Change the font to bold when hovering */
    font-size: 18px;
}

#sectionOfWork{
    color: #808080;
    font-family: neue-kabel-bold, sans-serif;
    
}

.technicalSynopsis{
    font-family: neue-kabel-ExtraBold, sans-serif;
    color: #808080
}

h3, h5{
    font-family: "bebas-neue", sans-serif;
    color: #303030
}

ul {
    list-style-type: none;
}

.technicalDetails{
    color: #808080;
    font-family: neue-kabel-bold, sans-serif;
}

.custom-ratio {
    width: 70%; /* Adjust width as needed */
    height: auto; /* Maintain aspect ratio */
}

.accordion-button:not(.collapsed) {
    background-color: #c4d9de;
}

.accordion-button:focus {
    box-shadow: 0 0 0 0.25rem #d3e8ee;
}

.accordion-button::after {
    color: #303030;
}

.dropdown-submenu {
    position: relative;
}

.dropdown-submenu .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -1px;
}

#modalInfo {        
    text-decoration: underline; /* Underline the text */
    cursor: pointer;          /* Show pointer cursor on hover */
}

#renderCanvas{
    cursor: pointer;          /* Show pointer cursor on hover */
}

li{
    list-style-type: none;
}
  

  

@media(max-width: 992px){   /*Medium devices tablets, landscape mode*/
    #visualColumn, #technicalColumn {
        height: auto;
        padding-right: 0;
    }

    .custom-ratio {
        width: 100%;
    }

    #projectRightNavBar{
        background-color: #fafafa;
    }
    
    #visualColumn{
        background-color: #fafafa;
    }

    .technicalWriting{
        padding-top: 50px;

    }

    .navbar-nav{
        padding-top: 1.5rem;
    }

    .dropdown-submenu .dropdown-menu {
        top: 0;
        left: 100%;
        margin-top: 0px;
    }
}

@media(max-width: 576px) { /* Extra small devices phones */

    #technicalColumn{
        padding-bottom: 100px;
    }

    .navbar-nav{
        padding-top: 1.5rem;
    }

    .dropdown-submenu .dropdown-menu {
        top: 0;
        left: 100%;
        margin-top: 0px;
    }
    

}