How to change size of divs for a video container?

I have 2 video containers for a video call application but I can not change sizes

Basically what I want to do is

  1. make a bigger remote video container
  2. make a smaller local video container

For localVideoContainer, I defined localVideo css class and used but nothing changed on the screen , stil same size, can someone help me ?

#remoteVideoContainer(v-bind:class="{ a2: isActive2 }")
#localVideoContainer.localVideo(v-bind:class="{ a2: !activeCall.sendingVideo }")
.localVideo {
  height: 40px;
  width: 40px;
}

Is it wrong to assign some css class to html element start with # ?
I can not understand whats wrong here

Not wrong, it means that the element will have localVideoContainer ID attribute and localVideo class