Hi @Wynaco,
For the above you’ll need little customization. First create a child theme. You can find more on creating child theme HERE. Then in your child theme’s functions.php add the following codes.
function cleanbox_child_move_slider_below_site_title(){
remove_action( 'clean_box_header', 'clean_box_featured_slider', 30 );
add_action( 'clean_box_header', 'clean_box_featured_slider', 110 );
}
add_action('init', 'cleanbox_child_move_slider_below_site_title');
This will move, Featured Slider below the Site Title and above Featured Content.
Then for making Featured Slider same as the content, go to “Dashboard=> Appearance=> Customize=> Theme Options=> Custom CSS” box and add the following CSS.
#feature-slider .wrapper {
width: 1200px;
}
@media screen and (max-width: 1280px) {
#feature-slider .wrapper {
width: 1140px;
}
}
@media screen and (max-width: 1152px) {
#feature-slider .wrapper {
width: 1038px;
}
}
@media screen and (max-width: 1100px) {
#feature-slider .wrapper {
width: 960px;
}
}
@media screen and (max-width: 990px) {
#feature-slider .wrapper {
width: 738px;
}
}
@media screen and (max-width: 767px) {
#feature-slider .wrapper {
width: 660px;
}
}
@media screen and (max-width: 700px) {
#feature-slider .wrapper {
width: 561px;
}
}
@media screen and (max-width: 600px) {
#feature-slider .wrapper {
width: 522px;
}
}
@media screen and (max-width: 540px) {
#feature-slider .wrapper {
width: 462px;
}
}
@media screen and (max-width: 480px) {
#feature-slider .wrapper {
width: 380px;
}
}
@media screen and (max-width: 400px) {
#feature-slider .wrapper {
width: 320px;
padding: 0;
}
}
#feature-slider {
margin-top: 0;
}
#featured-content {
padding-top: 20px;
}
Regards,
Mahesh