The header is moving to the right because of this media query
@media only screen and (max-width: 767px) and (min-width: 480px)
.responsive .container {
width: 428px;
margin: 0 auto;
}
and
@media only screen and (max-width: 767px)
.responsive .container {
width: 268px;
margin: 0 auto;
}
It's reducing the width of the header and making it align to the center using margin: auto;
If you place your slider content within the container (header) then it will resize accordingly if you specify the width of your slider to be 100%. Else you need to change your slider width as in the above code within those blocks.