Elementor CSS
/* Fix Elementor Post Image Padding */
.elementor-posts .elementor-post__card .elementor-post__thumbnail {
padding-bottom: 0 !important;
}
/* Elementor Sticky Header */
.elementor-sticky--effects { background-color: #000;
}
.elementor-sticky--effects .logo img {
width: 50% !important;
}
.e-header {
position: absolute;
width:100% !important;
}
.elementor-sticky--effects { background-color: #19405A;
transition: background-color 0.5s ease !important;
}
.elementor-sticky--effects .logo img {
width: 75% !important;
}
.logo img {
transition: width 2s ease !important;
}
/* Shrinking Logo Header */
.logo-img {
max-width: 200px;
width: 200px;
}
.elementor-sticky--effects .logo-img {
max-width: 100px;
width: 100px;
transition: 0.5s all ease-in-out;
}
/* Mobile Settings*/
@media screen and (max-width: 780px) {
.logo-img {
max-width: 200px;
width: 200px;
}
.elementor-sticky--effects .logo-img {
max-width: 150px;
width: 150px;
transition: 0.5s all ease-in-out;
}
}
/* Creative Border Styling */
hr {
border-color: #B78E2C;
border-width:3px;
background-color: #B78E2C;
border-top: none;
border-left: none;
border-right: none;
}
Modern Event Calendar (MEC) CSS
/*MEC CALENDAR*/
section#main-content {
min-height: 600px !important;
padding-top: 50px;
}
LEarndash CSS
/* LEARNDASH STYLING */
.ld-course-status-action form {
padding-right: 10px;
}
Content CSS
hr divider styling
hr {
border-color: #B78E2C;
border-width:3px;
background-color: #B78E2C;
border-top: none;
border-left: none;
border-right: none;
}
Bullet List Padding
/* Add padding to the bottom of lists */
ul, ol {
margin-bottom: 0.9rem;
}
Table Border Colors
table td, table th {
border: none;
}
Table alternating Row Colors
table tbody>tr:nth-child(odd)>td {
background-color: #ffffff !important;
}
Table row colors on hover
tr:hover td {
background-color: #ffffff !important;
}
Style WP Block Quotes
/* Style WP Block Quotes */
blockquote {
border-left: solid 2px;
border-color: #E29E21;
padding-left: 15px;
}
Text Alignment (Vertical and Horizontal)
// Place on div containing text
.center {
border: 2px solid red;
display: flex;
justify-content: center;
height: 12em;
align-items: center;
}
// Alternative Method
.heading-div {
width: 80%;
border-style: solid;
border-width: 1px;
border-color: #000;
margin: auto;
padding: 10px;
}
.heading {
margin: auto;
border-width: 1px;
border-style: solid;
border-color: red;
text-align: center;
height: 12em;
line-height: 12em;
}
Cut off text with elipses
selector h2{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
selector p {
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
selector {
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.three-row{
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
Hello Elementor Theme Styling
/*HELLO THEME WOOCOMMERCE PADDING*/
div#primary {
padding-top: 50px;
padding-bottom: 50px;
}
User Registration CSS
/* User Registration Default Form Styling */
.ur-form-row span.input-wrapper {
width: 75%;
}
.ur-form-row input {
border: solid 1px #BEBFC1;
border-radius: 3px !important;
}
.ur-form-grid.ur-grid-1 {
padding-bottom: 20px !important;
}
.ur-form-row input {
margin-bottom: 0px !important;
}
div#ur-recaptcha-node {
padding-left: 5px;
}
Mobile Responsiveness
@media only screen and (max-width: 600px) {
body {
background-color: lightblue;
}
}
Disable WordPress Editor
// CUSTOM CSS STYLING IN WORDPRESS ADMIN DASHBOARD — VERY IMPORTANT
/* Globally disable Back to WordPress Editor button */
/* Hide the Back to WordPress Editor button… Would break pages built with Elementor. */
/* Shrink the height of the Elementor Edit Page Content section to make custom fields more visible */
add_action('admin_head', 'my_custom_style'); // admin_head is a hook my_custom_fonts is a function we are adding it to the hook
function my_custom_style() {
echo '<style>
#elementor-switch-mode .elementor-switch-mode-on{
display: none;
}
body.elementor-editor-active #elementor-switch-mode-button{
visibility: hidden;
}
body.elementor-editor-active #elementor-switch-mode-button:hover{
visibility: hidden;
}
#elementor-editor{
height: 100px;
}
</style>';
}
Infusionsoft/Keap Form Styling
<style>
label {
display: none;
}
.infusion-field {
margin-bottom: 15px;
}
input#inf_field_FirstName, input#inf_field_Email {
width: 100%;
border: none;
padding: 15px;
border-radius: 5px;
}
form#inf_form_3ab56deb37c5e3fe72f1a21b99d3e86a {
padding: 15px;
}
button#recaptcha_3ab56deb37c5e3fe72f1a21b99d3e86a {
border: none;
padding-top: 15px;
padding-bottom: 15px;
width: 100%;
border-radius: 5px;
background-color: #FFAD31;
color: white;
}
</style>
BuddyBoss Theme Styling
/* BuddyBoss Left Menu Icons */
.welcome-menu-icon .fa-file:before {
content: "\f005";
}
.my-courses-menu-icon .fa-file:before {
content: "\f19d";
}