Customize your banner using the Custom CSS functionality and create a banner that looks like a part of your website and matches your website branding.


All the elements of Cookie Banner and Manage Preference are marked in the below screenshot with numbers and relevant class and ID name are displayed in the table. In this way, you can apply Custom CSS easily.


Once you apply Custom CSS, used class style will be overwritten.


Note: Custom CSS style will be display on live banner only.


Cookie Banner



No.

Name 

Class Name 

ID Name 

Banner Title 

.mdt-banner-title 

#mdt_banner_title 

Banner Content 

.mdt-banner-notice 

#mdt_banner_notice 

Language icon 

.mdt-banner-select-language 

#mdt_banner_select_language 

Banner Close Button 

.mdt-banner-btn-close 

#mdt_banner_btn_close 

Banner Accept All button 

.mdt-banner-btn-acceptall 

#mdt_banner_btn_acceptall 

Banner Decline All button 

.mdt-banner-btn-declineall 

#mdt_banner_btn_declineall 

Banner Manage Preference button 

.mdt-banner-btn-preference 

#mdt_banner_btn_preference 

Banner Privacy Policy Button 

.mdt-banner-btn-privacy 

#mdt_banner_btn_privacy 

Button Group 

.mdt-banner-btn-wrapper 

 



Cookie Banner - Manage Preference



No.

Name 

Class Name 

ID Name 

Preference Title 

.mdt-pc-title 

#mdt_pc_title 

Preference Close Button 

.mdt-pc-btn-close 

#mdt_pc_btn_close 

Preference privacy title 

.mdt-pc-privacy-title 

 

Preference privacy text 

.mdt-pc-privacy-text 

 

Preference consent info title 

.mdt-pc-consent-title 

 

Preference consent data 

 

#mdt_pc_consent_data table 

Preference consent note 

.mdt-pc-consent-note 

 

Preference category header background 

.mdt-pc-category-header 

 

Preference category name 

.mdt-pc-category-name 

 

10 

Preference category description 

.mdt-pc-category-description 

 

11 

Preference category description table 

.mdt-pc-category-description-table 

 

12 

Preference category cookie info title 

.mdt-cookie-info-details li h5 

 

13 

Preference category cookie info 

.mdt-cookie-info-details li label 

 

14 

Preference language icon 

.mdt-pc-select-language 

#mdt_pc_select_language 

15 

Preference Decline All button 

.mdt-pc-btn-declineall 

#mdt_pc_btn_declineall 

16 

Preference Selected button 

.mdt-pc-btn-selected 

#mdt_pc_btn_selected 

17 

Preference Accept All button 

.mdt-pc-btn-acceptall 

#mdt_pc_btn_acceptall 


Floating Action Button


No.

Name 

Class Name 

ID Name 

Floating Action button position

.mdt-cookie-badge


Floating Action button customization

.mdt-cookie-badge svg