Many issues with my website

Hi, I have several problems with my website I created with X theme using Cornerstone. The site is online at www.cifexpress.com

1.- My website in not completely fullwidth, there are small margins on the sides, how do I get rid of this?

2.- I don’t know how to set the footer without having that blank section at the bottom?

3.- I am also having trouble on the mobile version with the menu on the header not appearing?

4.- Also on mobile, how can I make the icons on the section with the counters and the section of services to appear in pairs, instead of only 1 single column.

Thank you, looking forward to a quick reply.

Best regards,
Jossie

This is an automated message to notify you that your thread was posted in the wrong forum, and it has been moved to the correct place. A member of our team will be happy to reply just as soon as your thread is up. How support works.

For support, please post all questions in the Support Forum.

For peer to peer conversations with other Themeco customers about tips, customizations, or suggestions you are welcome to use the Peer to Peer Forum (no official support provided here).

Design & Development, Marketing & Media, and Hosting & Optimization are for discussion with fellow Apex members about non Themeco related topics. Please keep this in mind in the future.

Thank-you!

1 Like

Hi There,

Thank you for writing in, 1) Please use a Blank - No Container | Header, Footer page template instead of Layout - Fullwidth template.

screenshot
  1. Your site has no real footer, I believe you have disable it. Please navigate to Theme Options > Footer turn on the BOTTOM FOOTER and put your copyright on the FOOTER CONTENT.

  2. Its there, but it is white so it blends with the white background. Please add this on your custom CSS.

@media (max-width: 979px) {
	.x-btn-navbar.collapsed:hover,
	.x-btn-navbar.collapsed,
	.x-btn-navbar:hover {
	    color: #EC1C24;
	    box-shadow: inset 0 0 0 transparent, 0 1px 5px rgba(0,0,0,0.25);
	    border-radius: 4px;
	    padding: 0.2em;
	}
}

I see that you have a custom CSS block to change the mobile menu color to red, please remove that to avoid conflict.

  1. On those section, add a custom CLASS (e.g. my-class), and then add this on your custom CSS.
@media (min-width: 481px) and (max-width: 767px) {
	.my-class .x-column.x-sm {
		float: left;
		width: 48%;
		margin-right: 4%;
	}
	.my-class .x-column.x-sm:nth-child(2n) {
		margin-right: 0;
	}
}

Replace the my-class with your own CLASS.

This works only on screens between 481px and 767px. On extra small screen 480px and below, we really need to stack back those columns.

Hope it helps,
Cheers!