body.search_start{
    background-color: #5c3a64;
    background-image:none;
}

div#profile_container{
    margin:0px;
    padding-right:0px;
    justify-items: auto;
    gap:5px;
}

div.search_field_container {
    display:flex;
    padding:10px;
    background-color: #342c43;
    border: 2px solid #FC851D;
    border-radius:25px;
    align-items:center;
}

div.page_container.search_start{
    display:grid; 
    grid-template-rows: 85px 1fr auto;
    height:99vh;
}

div.content.search_start{
    display:grid;
    grid-template-rows: 250px 100px 40px 100px;
    align-items:center;
    justify-items:center;
    margin-top:10%;
}

img.banner.search_start{
    height:250px;


}

img.feed.icon.search_start{
    height:50px;
}

h1.title.search_start{
    font-family: "Mouse Memoirs";
    color: #FC851D;
    font-size: 80px;
    font-weight: 400;
    letter-spacing: .01px;
}

h3.title.search_start{
    font-family: "Mouse Memoirs", sans-serif;
    color: #ffffff;
    font-size: 30px;
    font-weight: 400;
    letter-spacing: .01px;
}

h5.copy.search_start{
    font-family: "Mouse Memoirs", sans-serif;
    color: #aa9aae;
    font-size: 20px;
    font-weight: 400;
    letter-spacing: .01px;
}

span.pipe {
    margin: 0 8px; /* adjust spacing */
    color: #aa9aae;   /* optional: match text color */
}

input.field.search_bar.search_start{
    background-color: #342c43;
    font-family: "Economica", sans-serif;
    font-size: 45px;
    font-weight: 600;
    color: white;
    width:900px;
    border:none;
    outline:none;
    caret-color:#ffffff;
    margin:0px;
    height:60px;
}

input.field.search_bar.search_start:focus{
    background-color: #342c43;
}


/* Subtle placeholder color */
input.field.search_bar.search_start::placeholder{
    color: rgba(255,255,255,0.6);
}

img.search_icon.search_start{
    width:100%;
    height:100%
}

button.search_icon_button.search_start{
    background-color: #394547;
    border-radius: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 65px;
    height: 60px;
    border: 2px solid #415154;
    cursor:pointer;
    padding:7px;
   
}

button.search_icon_button.search_start:hover{
    background-color: #405154;
}

div.footer.search_start{
    display: flex;
    flex-direction: column;
    justify-content: flex-end; /* Push children to bottom */
    padding: 1rem;
}

div.information_nav.panel.search_start{
    margin:auto;
}

div.profile_frame.search_start{
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    border: 2px solid #7b6581;
    border-radius: 50%;
    background-color: #342c43;
    width: 50px;
    height: 50px;
    
}

div.profile_frame.search_start:hover{
    border-color:#FC851D
}

div.feature_info.frame.search_start{
    display:flex;
    justify-content:center;
    border-radius: 20px;
    padding:5px;
    border: 2px solid #5c3a64;
}

div.feature_info.frame.search_start:hover{
    border: 2px solid #FC851D;
}


div.header_navigation_tools.search_start{
      grid-template-columns: 1fr;  
}

body{
    background-color: #5c3a64;
}

div.header_navigation_tools.search_start {
    background-color: #5c3a64;
}


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

    div.content.search_start{
        margin-top:20%;
    }

    h1.title.search_start{
        font-size:60px;
    }

    h3.title.search_start{
        font-size:22px;
    }

    input.field.search_bar.search_start{
        width:25vh;
        font-size:26px;
    }

    img.banner.search_start{
        height:175px
    }

    div.content.search_start{
        grid-template-rows: 175px 80px 30px 100px;
    }

    button.search_icon_button.search_start{
        width:45px;
        height:35px;
    }

    div.search_field_container{
        padding:6px;
    }

    input.field.search_bar{
        margin-bottom:0px
    }


}


@media only screen and (max-width: 600px) {
 
    img.feed.icon.search_start{
        height:35px;
    }

    div.profile_frame.search_start{
        width:30px;
        height:30px;
    }

    img.profile.site_header{
        width:40px;
        height:40px;
    }

    div.search_field_container{
        border-radius:15px;
    }

    input.field.search_bar.search_start{
        height:100%
    }

}