Custom code newbie

Hello! 

Very new to website design and a bit out of my element. I'm having two coding issues that I can't figure out no matter how many youtube videos I watch 😞 

1. I am trying to lock an image that is placed next to an accordion. I'm trying to do this on 2 separate pages- one page has an accordion and two text boxes next to it that I dont want expanded, and the other page has a logo next to the 3 accordion options which I also do not want expanded. 

2.  I added the following code to try to highlight an "English" and "Espanol" tab on my headers. When I am on the Spanish pages, English is circled but the home page "Pagina Principal" is not. This is how it should be. When I am on the English pages, for some reason "Espanol" AND "Home" are circled. The links for spanish and english are set up exactly the same as are the home pages for each language so I'm not sure why it's showing correctly for one and not the other. Screenshots attached for reference since I'm sure this didn't make sense. 

Also here is my custom css window for both problems 

header#header [href="/home"]{
  color:white;
  background-color:blue;
  padding: .3rem 1.6032rem;
  border-radius: .8rem;
}
header#header [href="/home-1"]{
  color:white;
  background-color:blue;
  padding: .3rem 1.6032rem;
  border-radius: .8rem;
}

.sqs-block-button-element {width: 200px}

/* Fix image next to accordion */
@media screen and (min-width:992px) {
div#block-yui_3_17_2_1_1698192694970_8307 img {
    height: 400px !important;
}
}

If you share site url, we can check code easier