/* Auther: Morgan Presley
Made by: Caleb Ader
Dates: 4/30/26 | 5/4/26 | 5/5/26 | 5/6/26 */

/* Header */
header {
    margin: 0rem;
    padding: 0rem;
    position: fixed;
    z-index: 10;
    top: 0rem;
    width: 100%;
}

/* Nav */
/* Changes the nav's background color */
.container-fluid,
.dropdown-menu {
    background-color: #04471C;
    text-align: center;
    border-radius: 0rem 0rem 1rem 1rem;
}

/* Colors the text */
.dropdown-item {
    color: #020202;
    text-align: center;
}

/* Makes it easier to tell that it is a button */
.dropdown-item:hover {
    color: #020202;
    font-weight: bold;
}

/* Aligns the nav bar */
.navbar-brand {
    font-size: 1.5rem;
    text-align: center;
    color: #020202;
    font-weight: bold;
}

/* Makes them look nicer */
.nav-link {
    font-size: 1.3rem;
    text-align: center;
    color: #020202;
}

/* Makes it easier to tell that you are hoving over the nav button */
.navbar-brand:hover,
.nav-link:hover {
    border: .2rem dotted #020202;
    border-radius: 1rem;
}

/* Title images */
/* Makes the images not so big */
.carousel-item {
    max-height: 100%;
    height: 20rem;
}

/* Fixes image size */
.carousel-inner {
    height: 40rem;
}

/* Fixes compression */
.images-title {
    margin: 5.3rem 1.5rem 0rem 1.5rem;
}

/* Makes the title text more visiable */
.title {
    position: relative;
    bottom: 4rem;
    text-align: center;
    color: #058C42;
    font-weight: bold;
    font-size: 4rem;
}

/* Makes the description look nicer */
.blog-description{
    text-align: center;
    margin: 0rem 1.5rem 0rem 1.5rem;
    border: .5rem solid #0D2818;
    border-radius: 1rem;
    background-color: #0D2818;
    color: #058C42;
}

/* Fixes spacing */
.card-descriptions{
    margin: 6rem 1.5rem 3rem 1.5rem;
}

/* Makes the cards look nicer */
.card {
    margin-top: 4rem;
    background-color: #04471C;
    color: #058C42;
    border: .3rem solid #020202 ;
}

/* Video border */
.videos {
    text-align: center;
    margin-top: 3rem;
    border: .5rem dotted #04471C;
}

/* Title for birder feeders */
#bird-title {
    margin-top: 6rem;
}

/* Makes footer look nicer */
footer{
    text-align: center;
    margin: 4rem 0rem 0rem 0rem;
    border: 1rem solid #04471C;
    border-radius: 1rem 1rem 0rem 0rem;
    background-color: #04471C;
    color: #020202;
}

/* For tablet */
@media screen and (min-width: 650px) {
    .carousel-item{
        height: 30rem;
        margin-top: 2rem;
    }
    .title{
        bottom: 5rem;
    }
    .blog-description {
        margin-top: 4rem;
    }
    .card-descriptions {
        margin-top: 4rem;
    }
}

/* For desktop */
@media screen and (min-width: 1200px) {
    main {
        padding: 0rem 3rem 4.5rem 3rem;
    }
    .carousel-item{
        height: 35rem;
    }
    .title{
        bottom: 5rem;
    }
}