h1, h2, h3, h4, h5, h6{
    /* font-family:  "Spectral", serif; */
    margin-bottom: 0px;
}

h1{
    font-weight: 1000;
    color: #464646;
    position:relative;

}


.sec-title::after {
    content:'';
    position:absolute;
    width:170px;
    height:4px;
    background:#c8a57e;
    bottom:0;
    left:0;
    right:0;
    margin:auto;
}

h2{
    font-weight: 800;
    color: #464646;
}

h3,
h4, 
h5,
h6 {
    font-weight: 800!important;
}


h5{
    font-size: 1.2rem;
}

h1{
    font-size: 3rem;
}
h2{
    font-size: 2.3rem;
}
h3{
    font-size: 2rem;
}


.nav-link{
    font-size: 1.1rem!important;
    font-weight: 600!important;
    padding: 3px;
}

#nav-cont {
    /* margin-left: 10%;
    margin-right: 10%; */
    margin-left: auto;
    margin-right: auto;
    max-width: 1500px!important;
    margin-top: 10px;
    margin-bottom: 10px;
}

#top-nav {
    background-color: #2C2D2D;
    color: white;
    padding-left: 4px;
    z-index: 1000;
    font-weight: 600;
    font-size: 15px;
    padding-top: 3px;
    padding-bottom: 3px;
}



#nav {
    background-color: white;
    box-shadow: 0px 0px 4px;
}

#nav-mob{
    box-shadow: 0px 0px 4px;
    background-color: white;
}

.navbar-toggler-icon{
    height: 1.3rem!important;
    width: 1.3rem!important;
}

.btn{
    border-radius: 0px;
}

.btn-primary{
    background-color: #5b7586;
    border-color: #ffffff;
}

.btn-primary:hover{
    background-color: #2C2D2D;
    border-color: #2C2D2D;
}

input{
    border-radius: 0px!important;
}

textarea{
    border-radius: 0px!important;
}

.grid {
    column-count: 2;
    column-gap: 50px;
}



.navbar-toggler{
    border: none;

}

.active {
    border-bottom: 4px solid black;
}


.card{
    border-radius: 0px!important;
}

#bar>h2{
    font-weight: 400!important;
}

.nav-item-mob{
    border-bottom: solid 1px rgb(218, 217, 217);
    width: 90% !important;
}

.nav-item-mob>a{
    font-size: smaller;
    padding: 3px;
}


.nav-item {
    width: max-content;
    margin-left: 6px;
    margin-right: 6px;
}

.nav-item:hover {
    border-bottom: 2px solid black;
}

.my-cont {
    margin-bottom: 220px;
}

#heading {
    color: #C29B70;
    font-weight: 600 !important;
}

#detail {
    font-weight: 700 !important;
}

.close{
    border: 0px;
    background-color: #2C2D2D;
    color: white!important;
}

.close:hover{
    border: solid 1px #2C2D2D;
    background-color: white;
    color: #2C2D2D!important;
}

.project-card{
    box-shadow: 0 2px 5px rgba(0, 0, 0, .3) !important;
    padding: 20px;
}


.r-img-p{
    border: solid 1px rgb(160, 160, 160);
    /* padding: 15px; */
}

.r-img{
    width: 270px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, .3);
}


.r-img-in {
    width: 270px; 
    height: 270px;
    object-fit: cover;
    margin-bottom: 10px;
    background-color: white;
}

.rs-img{
    width: 270px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, .3);
}

.rs-img-in {
    width: 270px; 
    height: 250px;
    object-fit: cover;
    margin-bottom: 10px;
    background-color: white;
    padding: 5px;
}

.r-img-in-sm {
    width: 200px;
    height: 200px;
    object-fit: cover;
    margin-bottom: 10px;
}

.rs-img-in-sm {
    width: 100px;
    height: 100px;
    object-fit: cover;
    margin-bottom: 10px;
    background-color: white;
    padding: 5px;
}

.r-img-in-title{
    text-align: center!important;
}

.img-title>h6{
    font-weight: 600;
    color: #2C2D2D;
    font-size: 16px;
}

.modal-content {
    border-radius: 0px !important;
}
.no-style{
    text-decoration: none;
}

.scroll-nav {
    position: sticky;
    top: 200px;
    margin-bottom: 30px;
}

.hide-mobile{
    margin-right: 100px;
}

.fixed-nav-item {
    text-decoration: none !important;
    color: rgb(31, 47, 66);
    padding-left: 10px;
    padding-bottom: 15px;
    padding-top: 15px;
    border-bottom: solid 1px rgb(218, 217, 217);
}

.fixed-nav-item.active {
    border-left: solid 5px #c0935f;
}

.scroll-list-cont {
    position: relative;
    /* top: 100px; */
    margin-bottom: 100px;
}

.scrollspy-example {
    margin-bottom: 310px;
}

.avatar {
    width: 130px;
    height: 130px;
    border-radius: 50%;
    object-fit: cover;
    margin-top: 20px;
    margin-bottom: 20px;
}

.name {
    font-weight: 800;
    color: #464646;
}

.designation {
    font-weight: 400;
    color: #b37c3e;
    font-size: 16px;
}

.short-bio {
    font-weight: 400;
    color: #464646;
    font-size: 14px;
}

.people-item{
    width: 250px!important;
}

.modal-bio{
    font-size: 17px;
    font-weight: 400;

}

.footer{
    background-color: rgb(44, 45, 45) !important;
    color: white!important;
    /* padding: 20px; */
    /* margin-top: 100px; */
    font-size: smaller;
    width: 100%;
}

.footer>.container{
    max-width: 1500px!important;
}

.footer-text{
    color: white!important;
    font-size: medium!important;
    font-weight: 300!important;
}

.footer-link{
    color: white!important;
    text-decoration: none!important;
    font-size: medium!important;
    font-weight: 300!important;
    margin-right: 20px;
}

.footer-link:hover{
    color: #ffffff!important;
    text-decoration: none!important;
    font-weight: 600!important;
}

.citation{
    font-weight: 400;
    font-size: 18px;
    padding: 10px;
    padding-left: 20px;
    padding-right: 20px;
    color: rgb(105, 105, 105);
    text-align: justify;
    box-shadow: 0 2px 5px rgba(0, 0, 0, .3);
}


.alert-error{
    color: rgb(126, 25, 25);
    background-color: rgb(255, 190, 190);
    border: solid 1px rgb(134, 22, 22);
}

label {
    font-weight: 600;
}

.form-group {
    margin-bottom: 10px!important;
    margin-top: 10px!important;
}

.bio-link{
    color: #2588af;
    text-decoration: none;
    font-size: large;
}

.item{
    display: inline-block;
    width: 100%;
}

.gallery-img-title{
    /* linear background-color */
    background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 1));
    padding-top: 50px!important;
    
}

.modal-body > p >img{
    width: 100%!important;
}

.modal-body > p{
    font-size: large;
    font-weight: 400;
}

p{
    font-weight: 400!important;
    color: #464646;
}

.hide-mobile-only{
    top: 0px;
    position: relative;
}

.mobile-logo{
    opacity: 0.9;
}

#myBtn{
    border: none;
    background-color: white;
}

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

    
    .name {
        font-weight: 800;
    }

    #nav-cont{
        margin-bottom: 4px;
        margin-top: 4px;
    }
    
    .nav-link{
        font-size: 1rem!important;
        font-weight: 600!important;
        padding: 3px;
    }

    .nav-item{
        border-bottom: solid 1px rgb(219, 219, 219);
        width: 100%!important;
    }

    .mobile-logo{
        width: 70px;
    }
    
    #bar {
        display: none !important;
    }

    .hide-mobile-only{
        display: none !important;
    }

    .hide-mobile{
        display: none !important;
    }

    #detail{
        font-size: 1.35rem;
    }

    .grid {
        column-count: 2;
        column-gap: 10px;
    }
    
    
    .container{
        padding-left: 5%;
        padding-right: 5%;
    }

    .fixed-top{
        display: none;
    }

    .citation{
        font-size: 16px!important;
    }

    
}



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

    
    #more {
        display: none;
    }

    /* .r-img{
        width: 95vw;
    }

    .r-img-in {
        width: 40vw; 
        height: 40vw;
    } */

    .rs-img{
        width: 95vw;
    }

    .rs-img-in {
        width: 50vw; 
        height: 50vw;
        margin: auto;
    }

    

    .mobile-logo{
        width: 60px;
    }

    .no-style{
        top: 20px!important;
    }

    #heading{
        position: relative;
        top: 10px!important;
        font-size: 1.5rem!important;
    }

    #detail{
        font-size: 0.9rem!important;
    }

    #nav-mob{
        padding-top: 0px!important;
        padding-bottom: 0px!important;
    }
    
    .grid {
        column-count: 1;
        column-gap: 10px;
    }

    

    h1{
        font-size: 2rem!important;
        font-weight: 1000!important;
    }

    h2{
        font-size: 1.5rem!important;
    }

    h3{
        font-size: 1.5rem!important;
        font-weight: 1000!important;
    }

    h4{
        font-size: 1.2rem!important;
        font-weight: 1000!important;
    }

    h5{
        font-size: 1rem!important;
        font-weight: 1000!important;
    }

    h5{
        font-size: 1rem!important;
        font-weight: 1000!important;
    }

    p{
        font-size: smaller!important;
    }
}


@media only screen and (min-width: 990px) {
    .hide-pc{
        opacity: 0;;
    }
    .hide-pc-full{
        display: none;
    }
    body{
        font-size: larger;
    }

    .modal-dialog{
        width: 800px!important;
        max-width: 800px!important;
    }

    .not-fixed-top{
        opacity: 0;
    }
    #nav{
        margin-top:40px;
    }
    .my-cont{
        position: relative;
        top: -7px;
    }
}


@media only screen and (min-width: 550px) {
    #myBtn{
        display: none;
    }
    #dots{
        display: none;
    }
}