Styling in HTML with CSS while using Javascript -

how transfer style code external css file? think using .gamelist won't work because of <form> or <input> stuff. know can leave style in html file neat , organized possible.

here's html code:

<div id="sidebar">     <p class="gamelist">         <form>             <input type="image" src="images/mariosadv.jpg" border="2" style="border:2px solid black;max-width:150px;" value="enter protected area" onclick="password()">         </form>         <form>             <input type="image" src="images/mariosadv2.jpg" border="2" style="border:2px solid black;max-width:150px;" value="enter protected area" onclick="password()">         </form> </div> 

here's simple javascript function:

function password() {     var testv = 1;     var pass1 = prompt('please enter password',' ');     while (testv < 3) {     if (!pass1)      history.go(-1);     if (pass1.tolowercase() == "letmein") {     alert('you got right!');     window.open('mariosadv.html');     break; }      testv+=1;     var pass1 =      prompt('access denied - password incorrect, please try again.','password'); }     if (pass1.tolowercase()!="password" & testv ==3)      history.go(-1);     return " "; }  

here's css tried:

.gamelist img {     display: block;     border: 2px solid black;     width:150px;     margin: 5px 0px 5px 0px; } 

this have javascript http://i.imgur.com/qvc6dgu.jpg

and want without javascript http://i.imgur.com/snx3els.jpg

if additional information needed please ask before rejecting question. thanks.

you'll need styling .gamelist [type=image] instead of .gamelist img, since img only refers tags name (not images in general).

edit here's html should like:

<div class="gamelist">     <form>         <input type="image" src="images/mariosadv.jpg" value="enter protected area" onclick="password()">     </form>     <form>         <input type="image" src="images/mariosadv2.jpg" value="enter protected area" onclick="password()">     </form> </div>