CSS to Target Different Elements
To be added to the sites.css
Template width to 1500px
@media screen and (min-width:1200px) {
.rows-1200 .dmRespDesignRow, .rows-1200 .dmRespRow:not(.fullBleedMode) .dmRespColsWrapper { max-width: 1500px }
}
Class to bold the link styles.
*#dm div.dmNewParagraph a,
*#dm div.dmCustomHtml a,
*#dm div.dmBlockElement a,
*#dm div.dmCustomWidget a { text-decoration: none !important; font-weight: 700 !important; -webkit-transition: color 0.4s ease-in !important; -o-transition: color 0.4s ease-in !important; outline: 0 !important; }
*#dm div.dmCustomHtml a:hover,
*#dm div.dmNewParagraph a:hover,
*#dm div.dmBlockElement a:hover,
*#dm div.dmCustomWidget a:hover { text-decoration: none !important; font-weight: 700 !important; }
Add this below as an addition if you need a link colour in a HTML widget.
*#dm div.dmCustomHtml a
*#dm div.dmCustomHtml a:hover
Breadcrumbs
#dm nav[aria-label="Breadcrumbs"].dmBlockElement a:visited { color:#ffffff !important; }
Classes to start a line of CSS to target different sizes.
DESKTOP
.dmDesktopBody
TABLET
.dmTabletBody
MOBILE
.dmMobileBody
Target Header/Footer container class.
HEADER
.dmHeaderContainer
FOOTER
.dmFooterContainer
Target H tags to override.
#dm div.dmLayoutWrapper .dmNewParagraph h1,
#dm div.dmLayoutWrapper .dmNewParagraph h2,
#dm div.dmLayoutWrapper .dmNewParagraph h3,
#dm div.dmLayoutWrapper .dmNewParagraph h4,
#dm div.dmLayoutWrapper .dmNewParagraph h5,
#dm div.dmLayoutWrapper .dmNewParagraph h6 { font-weight:300; }
CSS class to target inside the editor.
body.bodyInsideD1
Fix accordion padding (expandable useful links etc)
.plusMinus .accordion-title { padding:10px 20px !important; }
