@import url('https://fonts.googleapis.com/css2?family=Grand+Hotel&family=Pattaya&family=Yuji+Mai&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Grand+Hotel&family=Jomhuria&family=Nunito:wght@300&family=Pattaya&family=Yuji+Mai&display=swap');

#map{
    height: 600px;
    width: 70%;
    border-radius: 30%;
}

/* body{
    background: repeating-linear-gradient(to top right,
    rgb(29, 36, 7),
    rgb(96, 76, 222) 5px,
    rgb(203, 35, 35) 5px,
    rgb(28, 142, 58) 10px);

} */

body{
    background: repeating-linear-gradient(to top right,
    rgba(29, 36, 7, 0.491),
    rgba(95, 76, 222, 0.549) 5px,
    rgba(203, 35, 35, 0.626) 5px,
    rgba(28, 142, 58, 0.535) 10px);

}

/*did rest of h1 styling in JS*/
h1{
    font-family: 'Grand Hotel', cursive;
    border-width: 20px 30px 10px 15px;
}

#selectBorough{
    position: relative;
    width: 150px;
    background: rgb(248, 214, 214);
}

section{
    display: flex;
    flex-direction: row;
    /* align-items: center; */
}

#info{
    margin: 40px;
    width: 20%;
    color: rgb(120, 241, 0);
    /* color: indigo; */
    font-size: 20px;
    font-family: 'Nunito', sans-serif;
    font-weight: bolder;
    text-shadow: 0 2px 3px black;
}

#museum-list{
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    font-size: 18px;
    font-weight: 100;
    columns: 70px 4;
    margin-top: 50px;
}

/*created li in JS - can include it in css to style it*/
#museum-list,li{
    list-style: none;
}

/*created <a></a> in JS - can include it in css to style it*/
#museum-list,a{
    color: indigo;
    text-decoration: none;
    line-height: 1.5;
}

#museum-list,a:hover{
    color: gold;
}


#museum-list,a:active{
    color: lightsalmon;
}

#box{
    margin-top: 60px;
}

#boroughFilter{
    color: white;
    line-height: 1.5;
}

.leaflet-marker-icon,leaflet-zoom-animated,leaflet-interactive{
    color: red;
}
