This is happening because you have set the width of the div using inline style which overrides the responsive behavior of the theme. You can remove the style you have set (which will make the div automatically responsive) or you have to override the width for the other resolutions in the custom css. Please put the following code to the custom css tab of the theme options and change the width value to your liking.
@media only screen and (min-width: 769px) and (max-width: 1024px){
#purple-box {
width: 450px !important;
}
}
@media only screen and (min-width: 480px) and (max-width: 768px) {
#purple-box {
width: 450px !important;
}
}