CSS Code effect is not working in Header part.

Hello Experts,
I am trying to add mobile menu on my website, with the help of HTML element,
The problem is, In header css code is not working, It is working in Page body.

  1. The site URL.- https://studioxspace.wixsite.com/mysite-1/jamalpurflowermarket

  2. The HTML code that I try to add.





.dropbtn {

color: white;
padding: 16px;
font-size: 16px;
border: none;
cursor: pointer;
}

.dropdown {
position: relative;
display: inline-block;

}

.dropdown-content {
display: none;
position: absolute;
right: 0;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;

}

.dropdown-content a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;

}

.dropdown-content a:hover {background-color: #f1f1f1;}

.dropdown:hover .dropdown-content {
display: block;

}

.dropdown:hover .dropbtn {
background-color: #FFFFFF;
}



-




Please update with the solution if css effect is working in header part or not.
Thanks.