How to apply CSS shiny code in Pagepiling

[mosman2]

I am trying to stylize my UI in a shiny app that I am making. I had previously built a fairly comprehensive map that I now have to modularize to improve readability by setting the map background as a transparent layer. Unfortunately, I cannot seem to understand how to go about applying CSS styles while using modules.

mapUI <- function(id) {
  ns <- NS(id)
  leafletOutput(ns("map"),width =250 , height = 250))
}

basin <-  rgdal::readOGR("data/basin.kml", "basin")

ui <- pagePiling(
  tags$head(
    tags$link(rel = "stylesheet", type = "text/css", href = "style.css")),
  sections.color = c('#f2f2f2', '#2C3E50', '#39C'),
  opts = options,
  menu = c("Start" = "start",
           "Station 1" = "station1",
           "Station 2" = "station2"
  ),
  pageSectionImage(
    center = TRUE,
    img = "image1.jpg",
    menu = "start",
    mapUI("map1")
  ),
  pageSectionImage(
    center = TRUE,
    img ="image2.jpg",
    menu = "station1",
    mapUI("map2")
  ),
pageSectionImage(
    center = TRUE,
    img ="image3.jpg",
    menu = "station2",
    mapUI("map3")
  )
)

server <- function(input, output){
 

  mapServer <- function(id) {
    moduleServer(
      id,
      function(input, output, session) {
        output$map<-renderLeaflet({
          leaflet(options = leafletOptions(zoomControl = FALSE, minZoom = 5, maxZoom = 5))%>%
            addPolygons(data = basin,color = "white",weight = 2,opacity = 1,fillOpacity = 0.9 ) 
        })
      })
  }
  mapServer("map1")
  mapServer("map2")
}

here is the style.css that doesn't work for me!

#bottommap-map{
 background: rgba(0,0,0,0.05);
}