Your association's website is based on one of our awesome standard layouts or a custom layout specially developed by our partners.
In Congressus Manager, you can customize your website's appearance to match your corporate identity using your logo, favicon, colors, and fonts. You can also significantly enhance your website's impact by using high-quality images, such as header images.
Custom CSS
However, if you want to customize more, you can go a step further as an expert.
Adding Custom CSS
To add custom CSS, go to Website Management > Website Settings, Custom Code tab.
It's not possible to customize your website's HTML with Custom CSS.
Custom CSS Examples
We've compiled a few useful CSS examples:
Light text on dark footer
 Before |  After |
NOTE: Replace color code #072853 in the example below with your desired background color.
footer{
background-color: #072853;
color: #fff;
}
footer .headline {
border-bottom: 1px solid rgba(255,255,255,.1);
}
.social-icons li a {
background-color: rgba(255,255,255,.2);
}
dl.headlines.headlines-footer dd .text-muted {
color: rgba(255,255,255,.5);
}
footer a,
dl.headlines.headlines-footer dd a {
color: #ddd;
color: rgba(255,255,255,.7);
}
footer a:focus,
footer a:hover,
dl.headlines.headlines-footer dd a:focus,
dl.headlines.headlines-footer dd a:hover {
color: #fff;
}
Show full images for news/events
Since the January 2021 visual update, we've been displaying event images in a 16:9 aspect ratio. The rest of the image is hidden. This isn't desirable for every club. You can use the CSS below to set the image to display in full again.
.module-news .paragraphs .img-responsive {
object-fit: contain !important; object-position: center left;
}
.heading-image {
padding-bottom: 25%;
} .module-events .paragraphs .img-responsive {
object-fit: contain !important; object-position: center left;
}
.heading-image {
padding-bottom: 25%;
}