@import url(../prism/prism-light.css);
@import url(../Alignment/style.css);
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500&display=swap');
* {
    font-family: 'Noto Sans JP', sans-serif;
}
.navbar {
    background-color: rgb(47, 0, 67);
    padding: 10px 0px;
    overflow: hidden;
    border-radius: 20px;
}
.navbar .btn {
    font: inherit;
    color: white;
    text-decoration: none !important;
    padding: 10px;
    border-radius: 10px;

    cursor: pointer;
}
.btn:hover {
    color: white !important;
    background-color: maroon;
}
.btn:visited {
    color: white;
}
.navbar li{
    padding: 5px 0px;
    float: left;
    list-style-type: none;
    margin: 0px 2px;
}
.searchbox {
    margin-right: 5%;
    border-radius: 20px;
    width: 30%;
    background-color:blueviolet;
    float: right;
}
input[type=search] {
    padding: 10px 10px;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    width: 80%;
    background-color: transparent;
    float: left;
    color: white;
    border: none;
    border: 1px solid gray;
}
input[type=search]::placeholder {
    color: rgb(199, 199, 199);
}
input[type=search]:focus{
    border: 1px solid blue;
    outline: none;
}
input[type=search]::-webkit-search-cancel-button{
    visibility: hidden;
}
#search-img {
    width: 100%;
    height: 100%;
    mix-blend-mode: normal;
}
.search-btn{
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    width: 20%;
    height: 41px;
    padding: 8px 5%;
    border:none;
    background-color: rgb(169, 169, 169);
}