Widget max-width

Travelify
1

Hello guys,

I have a question I’m trying to get the the widgets area on the home page max-width: 100% the same as the content area menu balk, but i tried many things but none of them helped to make it full width. And I want each widget that it is use 50% width. It is this site http://www.dutchyipsstudy.nl/.I hope someone can help me. My css code

#site-generator .copyright {
display: none;
}
#branding {
margin-top: 45px;
}
.hgroup-wrap {
padding-top: 0px;
padding-bottom: 0px;
}
#main{
padding-top: 0px;
padding-bottom: 4px;
padding-right: 0px;
padding-left: 0px;
max-width: 100%;
}
#content {
margin-left: 0px;
margin-right: 0px;
}
#main-nav ul li ul li a {
text-transform: none !important;
}
.wrapper {
max-width: 100%;
}
.container {
max-width: 100%;
}
#site-generator {
padding-top: 0px;
padding-bottom: 0px;
}
#site-logo {
margin-top: 0px;
}
#comments {
display: none;
}
.widget-title{
text-transform: none !important;
}
.page-title{
padding-bottom: 10px;
padding-left: 2.5%;
color: #1b1e1f;
font: 24px ‘Ubuntu’, sans-serif;
font-size: 34px !important;
font-weight: normal;
border: 0;
display: none;
}
a {
color: #1b1e1f;
}
#metaslider_widget-4.widget.widget_metaslider_widget {
width: 100%;
max-height: 340px;
}
#rpwe_widget-2.widget.rpwe_widget.recent-posts-extended {
min-height: 340px;
max-height: 340px;
}
.widget-area.clearfix{
padding-bottom: 0px;
margin-top: -40px;
padding-left: 0px;
}

2

And how can i make the white unused space between widgets lesser

3

Hello there,

I hope you are doing well today.

You can use the following CSS code to reduce the space between the widgets by going to Appearance > Customize > Additional CSS and pasting it there.

/*Widget space*/
.widget {
    margin-bottom: 10px;
}

Best Regards,
Support