Viewing 30 results - 181 through 210 (of 18,716 total)
  • Author
    Search Results
  • #1484547

    Hi,
    We will need to see your page so we can determe the css effecting your magazine font size.

    Best regards,
    Mike

    #1484536

    Thank you. I am working on setting up staging so I can convert to the child theme.

    IN THE MEANTIME.. I noticed my other website does not have the font so big, and after all this, I remember years ago I wanted the images bigger, so you gave me this code to put in the QUICK CSS…

    THERE ARE A FEW THINGS YOU GAVE ME IN HERE. CAN WE CHANGE THE PART FOR THE MAGAZINE TO HAVE A SMALLER FONT SIZE USING THIS CODE?

    I am giving you the whole section because I don’t know for sure which part is magazine and which is something else.

    THANK YOU IN ADVANCE FOR HELPING !!!

    THIS IS EVERYTHING IN THE QUICK CSS:
    p strong{
    color:#000!important;
    }

    #top .av-caption-style-overlay .av-masonry-entry .av-masonry-entry-title {
    color: white!important;
    }

    .av-magazine-thumbnail {
    min-height: auto;
    }

    #top .av-caption-style-overlay .av-masonry-entry .av-masonry-entry-title {
    color: white!important;
    }

    .av-magazine-thumbnail {
    min-height: auto;
    }
    div .slideshow_caption h2 {
    text-transform: none;
    }

    .av-magazine-thumbnail {
    width: 135px;
    height: auto;
    }

    @media only screen and (min-width: 768px) and (max-width: 1024px) {
    h2.avia-caption-title {
    font-size: 30px !important;
    }
    .avia-caption-content p {
    font-size: 22px !important;
    line-height: 24px;
    }
    }

    @media only screen and (max-width: 767px) {
    h2.avia-caption-title {
    font-size: 20px !important;
    }
    .avia-caption-content p {
    font-size: 14px !important;
    line-height: 16px;
    }
    .slideshow_caption {
    padding-top: 20px !important;
    }
    }

    #header_meta .menu li a {
    color: #fff !important;
    }
    .av-burger-overlay-scroll #av-burger-menu-ul a {
    color: #fff;
    }

    .html_av-overlay-side #top #wrap_all .av-burger-overlay-scroll #av-burger-menu-ul a {
    color: #fff;
    }

    .html_av-overlay-side.av-burger-overlay-active #top .av-hamburger-inner, .html_av-overlay-side.av-burger-overlay-active #top .av-hamburger-inner::before, .html_av-overlay-side.av-burger-overlay-active #top .av-hamburger-inner::after {
    background-color: #fff;
    }

    #header_meta .sub_menu .menu li a {
    color: #030303 !important;
    }

    .avia_textblock a strong {
    color: blue !important;
    }

    #1484483

    Thank you @Ismael,
    regrettably, it doesn’t seem to do anything. I also change the font size to 26px to see and no change at all.
    What else can I do?

    #1484474

    Hey Antonio,

    Thank you for the inquiry.

    You can use this css code to adjust the style of the tab titles:

    #top div .tabcontainer .tab {
        font-size: 20px;
        padding: 12px 24px 14px 24px;
    }

    Best regards,
    Ismael

    #1484461
    abortolotti
    Participant

    Hi there,
    how can I increase the font size for the tab element titles?
    They are pretty small and I’d like them a lot bigger.
    Thanks for your help.

    Antonio

    Same issues. Logo still shows left justified on desktop and on mobile view, the logo is over the top button. There must be code that is working against this. Below is my entire code if you can take a look and see whats wrong. I don’t have products either, so not sure why I have all this code.
    I just need to fix these things and we are done with the website.
    thanks for your help

    .product-sales-count {
    font-size: 0.8em;
    margin-top: 0;
    top: -10px;
    position: relative;
    }

    /* TEXT SHADOW FOR – Fullwidth Easy Slider – Headline: */
    .avia_transform .av_slideshow_full .active-slide .avia-caption-title,
    .avia_transform .av_fullscreen .active-slide .avia-caption-title
    {text-shadow: 2px 2px 2px #717070;}

    /* TEXT SHADOW FOR – Fullwidth Easy Slider – Caption Text: */
    #top .avia-slideshow .av-slideshow-caption .avia-caption-content p {
    text-shadow: 2px 2px #717070;
    }

    /* TEXT SHADOW FOR – ALL H1 headlines: */
    .av-special-heading h1 {
    text-shadow: 1px 1px #717070;
    }

    /* TEXT SHADOW FOR – SPECIFIC H1 headlines: */
    .av-special-heading.av-nlr5x-bb365aeef7c91c871c871ed41100301d h1 {
    text-shadow: 1px 1px #717070;
    }

    /* TEXT SHADOW FOR – subheading text: */
    #top .av-subheading p {
    text-shadow: 1px 1px #717070;
    }

    #header_meta a, #header_meta span {
    font-size: 16px !important;
    line-height: 17px;
    }

    /* Sticky header on mobile */
    @media only screen and (max-width: 767px) {
    .responsive #top #main {
    /* Margin top value should be equal to header height*/
    margin-top: 80px;
    }
    .responsive #top #wrap_all #header {
    position: fixed;
    }
    }

    @media only screen and (max-width: 1100px) {
    .av-main-nav > li.menu-item { display: none; }
    .av-main-nav > li.menu-item-avia-special { display: block; }
    }

    .phone-info {
    font-size: 16px;
    }

    @media only screen and (max-width: 479px) {
    .responsive #top .slideshow_caption h2 {
    font-size: 18px !important;
    }

    .responsive #top .slideshow_caption .avia-caption-content {
    font-size: 16px !important;
    line-height: 14px;
    }

    .avia-slideshow-inner, .avia-slideshow-inner li, .avia-slideshow-inner li img {
    height: 30vh !important;
    }
    }

    span.avia-menu-text {
    text-transform: uppercase;
    }

    .avia-section.av-minimum-height .container .content {
    vertical-align: bottom;
    }

    .avia-section.av-minimum-height.text-bottom .container .content {
    vertical-align: bottom;
    }
    .avia-section.av-minimum-height.text-top .container .content {
    vertical-align: top;
    }

    .avia-button {
    border: 1.5px solid !important;
    }

    #top .avia-button {
    border-radius: 5px !important;
    }

    @media only screen and (max-width: 767px) {
    body, body .avia-tooltip {
    font-size: 20px;
    }
    }

    @media only screen and (max-width: 767px) {
    .page-id-3230 .avia-builder-el-0.av-minimum-height-100:not(.av-slideshow-section) .container {
    height: 767px !important;
    }
    }

    #main .sidebar a,
    #footer a,
    #socket a {
    text-decoration: underline;
    }
    a.avia-button{
    text-decoration:none!important;
    }
    @media only screen and (max-width: 989px){
    .html_mobile_menu_tablet #top #wrap_all .av_header_transparency {
    background-color: transparent;
    }
    .responsive #top #main {
    margin-top: 0;
    }
    }

    #top #wrap_all #socket .container {
    text-align: center;
    }

    #top #wrap_all #socket .container {
    text-align: center;
    }

    #top #wrap_all #socket .copyright {
    display: block;
    float: none;
    clear: both;
    text-align: center;
    }

    #top .content .flex_column .widget_nav_menu li {
    border-top-width: 0;
    border-bottom-width: 0;
    }

    #footer h3.widgettitle{
    border:none!important;
    }

    @media only screen and (max-width: 769px) {
    .flex_column.av-l3szqp26-162f9236fd15346c9c727f5f94b66dce {
    min-height: 50vh !important;
    }
    }

    .html_elegant-blog #top .post-entry .post-meta-infos,
    .html_elegant-blog .avia-content-slider .slide-meta,
    #top .news-time {
    display: none;
    }

    html, body {
    background-color: #fff !important;
    }

    #header:not(.av_header_transparency) #header_main {
    -moz-box-shadow:0 5px 5px rgba(182, 182, 182, 0.75);
    -webkit-box-shadow: 0 5px 5px rgba(182, 182, 182, 0.75);
    box-shadow: 0 5px 5px rgba(182, 182, 182, 0.75);
    }

    #top.single-product .product_meta {
    visibility: hidden;
    }

    .is-large.wc-block-cart .wc-block-cart-items th span {
    font-size: 2em;
    }

    table.wc-block-cart-items .wc-block-cart-items__row .wc-block-components-product-name {
    font-size: 2em;
    }

    .wc-block-components-form .wc-block-components-text-input.is-active label, .wc-block-components-text-input.is-active label {
    display: none;
    }

    #top div ul.product_list_widget li a {
    display: block;
    font-weight: bold;
    font-size: 1.5em;
    line-height: 1.6em !important;
    }

    #top .dropdown_widget ul.product_list_widget li .quantity {
    color: #000000;
    font-size: 1em;
    }

    #top .dropdown_widget .total span.woocommerce-Price-currencySymbol, #top .dropdown_widget .total {
    color: #000000;
    font-size: 1em;
    }

    div .product-sorting {
    display: none;
    }

    @media only screen and (max-width: 767px) {
    .responsive #top #main {
    padding-top: 88px !important;
    }
    .responsive.html_header_transparency #top #main {
    padding-top: 0 !important;
    }
    }

    .page-id-432 .components-flex-item input, .page-id-433 .wc-block-components-text-input input {
    padding: 8px 116px;
    }

    .wc-block-cart__submit-container a .wc-block-components-button__text {
    color: #fff;
    }

    .wc-block-components-address-form-wrapper .components-base-control__label {
    top: -50px;
    }

    .wc-block-components-address-form-wrapper .components-base-control__label {
    top: -30px !important;
    }

    #top .av-product-class-minimal img {
    border-radius: 30px !important;
    }
    #top .av-product-class-minimal img {
    border-radius: 30px !important;
    }

    .select2-container–default .select2-results__option–highlighted[aria-selected], .select2-container–default .select2-results__option–highlighted[data-selected], #top .select2-results {
    color: #000 !important;
    }

    @media only screen and (max-width: 768px) {

    /* Add your Mobile Styles here */
    #top #bc-custom-section div .flex_column {
    width: 46% !important;
    margin-left: 3% !important;
    border-radius: 30px;
    }
    }

    #top #bc-custom-section div .flex_column img {
    border-radius: 30px;
    }

    .woocommerce-Tabs-panel ul {
    list-style: disc;
    margin-left: 15px;
    }

    .woocommerce-Tabs-panel ul, .woocommerce-product-details__short-description ul {
    list-style: disc;
    margin-left: 15px;
    }

    #menu-item-150 > a > .avia-menu-text {
    color: #f19809!important;
    }

    #av-burger-menu-ul .menu-item-150 > a > .avia-menu-text {
    color:#f19809!important;
    }

    #menu-item-2076 > a > .avia-menu-text {
    color: #f19809!important;
    }

    #av-burger-menu-ul .menu-item-2076 > a > .avia-menu-text {
    color:#f19809!important;
    }

    .avia-image-container .avia_image, .avia-image-container .avia-image-overlay-wrap {
    border-radius: 30px;
    }

    #footer .textwidget .menu-blissfull-main-menu-container p {
    margin: 0;
    width: auto;
    display: inline-block;
    }

    @media only screen and (max-width: 767px) {
    .responsive .home #wrap_all #av-section-shop-category .flex_column {
    width: 48%;
    padding: 1%;
    }
    }

    ul.a-unordered-list.a-vertical.a-spacing-mini li {
    margin-bottom: 20px;
    }

    #top .price, #top .price span, #top del, #top ins {
    display: inline;
    text-decoration: none;
    font-size: 24px;
    line-height: 24px;
    font-weight: 600;
    }

    .page-id-389 .shop_columns_3 .products .product {
    width: 100%;
    }

    .page-id-91 .shop_columns_3 .products .product {
    width: 100%;
    }

    h1{
    text-transform: capitalize !important;
    }

    .template-page .entry-content-wrapper h1{
    text-transform: capitalize !important;
    }

    a.cart_dropdown_link {
    font-size: 28px !important;
    }

    #top a.cart_dropdown_link span[data-av_icon] {
    font-size: 28px;
    color: var(–enfold-header-color-color);
    }

    #top #header .av-main-nav #menu-item-wc-account-icon > a {
    color: #f19809;
    font-size: 28px;
    }

    /* Increase base font size on mobile devices */
    @media only screen and (max-width: 767px) {
    body,
    p,
    .entry-content {
    font-size: 18px !important;
    line-height: 1.6 !important;
    }
    }

    @media only screen and (max-width: 767px) {
    #top .av-special-heading .av-subheading p {
    font-size: 24px
    }
    }

    img[src*=”amazon-adsystem”] {
    display: none;
    }

    #top .av-burger-overlay-bg {
    opacity: 0.8;
    background: #000;
    }

    ——————–

    div .logo {
    left: 37%;
    }
    div.av-burger-overlay-bg {
    background-color: rgba(0, 0, 0, .7);
    }

    #top .av-burger-overlay-bg {
    opacity: 0.8;
    background: #000;
    }

    #top .av-main-nav-wrap {
    float: right;
    position: relative;
    z-index: 3;
    padding: 0 !important;
    margin: 0 0 0 15px !important;
    }

    .header_color.av_header_transparency .av-hamburger-inner,
    .header_color.av_header_transparency .av-hamburger-inner::before,
    .header_color.av_header_transparency .av-hamburger-inner::after {
    background-color: #FFF !important;
    }

    #top .av_header_transparency .phone-info,
    #top .av_header_transparency .social_bookmarks li a {
    color: #FFF !important;
    }

    #top .av_header_glassy.av_header_transparency .avia-menu.av_menu_icon_beside {
    border: none !important;
    }

    #top .main_menu {
    width: 170px
    }

    #top .logo {
    /*width: calc(100% – 170px);*/
    width: 100%;
    left: unset;
    }

    @media only screen and (max-width: 767px) {
    #av_section_1 .container.av-section-cont-open,
    .page-id-910 #av-layout-grid-1 {
    padding-top: 130px !important;
    }
    }

    #top .logo img {
    left: 50%;
    transform: translateX(-50%)
    }

    @media only screen and (min-width: 768px) and (max-width: 989px) {
    .responsive.html_mobile_menu_tablet #top #wrap_all #header {
    position: fixed;
    }
    }

    @media only screen and (max-width: 767px) {
    #header .social_bookmarks {
    display: none !important;
    }
    }

    #top #wrap_all #av-burger-menu-ul li {
    font-size: 30px !important;
    }

    ——————-

    #av-burger-menu-ul li.av-show-submenu > a > .avia-menu-text {
    color: blue;
    }
    #av-burger-menu-ul li.av-show-submenu > .sub-menu > li > a > .avia-menu-text {
    color: #f5c526;
    font-size: 20px;
    line-height: 20px;
    }
    .html_av-submenu-hidden #av-burger-menu-ul .av-submenu-indicator:before {
    color: #f5c526;
    font-size: 20px;
    }
    #top #wrap_all #av-burger-menu-ul .menu-item-2846 {
    font-size: 24px !important;
    }

    .html_av-overlay-full #top #wrap_all #av-burger-menu-ul li.av-show-submenu li {
    line-height: 20px;
    }

    • This reply was modified 9 months, 1 week ago by bemodesign.
    #1484402

    In reply to: Header tweaks

    Hey bemodesign,
    duplicate thread, please see here instead.

    Best regards,
    Mike

    #1484174

    Hi,

    I copied the content of the page in question to a test page, and I see that your content is full of what seems like unnecessary markup, for example:

    <span class="wysiwyg-color"><span class="wysiwyg-font-size-16">

    Please try cleaning up all unnecessary tags like that, as something is likely breaking the layout builder. You would also try to recreate the page, and make sure to only copy the text that you want to add, and not the markup which has been added in your current page. The server is also returning a 500 internal server error on the file in private, which might indicate that something is going wrong on the server side.

    Best regards,
    Rikard

    #1484023

    Hi,
    I see that you have this custom css:

    #top .avia-smallarrow-slider:not(.av-slideshow-ui) .avia-slideshow-arrows a, #top .avia-smallarrow-slider.av-slideshow-ui .avia-slideshow-arrows.av-visible-prev a.prev-slide, #top .avia-smallarrow-slider.av-slideshow-ui .avia-slideshow-arrows.av-visible-next a.next-slide {
        width: 24px !important;
        opacity: 1;
    }

    this is forcing the width to 24px, you can change this css and then add the css above, or try this css instead:

    #top .avia-smallarrow-slider:not(.av-slideshow-ui) .avia-slideshow-arrows a, #top .avia-smallarrow-slider.av-slideshow-ui .avia-slideshow-arrows.av-visible-prev a.prev-slide, #top .avia-smallarrow-slider.av-slideshow-ui .avia-slideshow-arrows.av-visible-next a.next-slide {
        width: 50px !important;
        height: 50px !important;
        line-height: 50px !important;
        font-size: 20px !important;
    }
    #top .avia-smallarrow-slider .avia-slideshow-arrows {
      position: relative;
      width: 120px;
      left: auto;
      height: 50px;
      right: 10px;
    }
    #top .avia-smallarrow-slider .avia-slideshow-arrows a.avia-svg-icon svg:first-child, #top .avia-smallarrow-slider .avia-slideshow-arrows a.avia-svg-icon img[is-svg-img="true"] {
        height: 20px;
        margin-top: 17px;
    }

    Please ensure to copy the code from the forum and not an email notification so the symbols are not converted.
    currently:
    Screen Shot 2025 05 11 at 9.06.26 AM
    with this new css:
    Screen Shot 2025 05 11 at 9.07.36 AM
    After applying the css, please clear your browser cache and check.

    Best regards,
    Mike

    Hi,
    Change this css:

    #av-burger-menu-ul li.av-show-submenu > .sub-menu > li > a > .avia-menu-text {
    	color: yellow;
    }

    to this:

    #av-burger-menu-ul li.av-show-submenu > .sub-menu > li > a > .avia-menu-text {
    	color: yellow;
    	font-size: 20px;
    	line-height: 20px;
    }

    then add this css:

    .html_av-overlay-full #top #wrap_all #av-burger-menu-ul li.av-show-submenu li {
        line-height: 20px;
    }

    Screen Shot 2025 05 10 at 5.34.09 AM
    adjust to suit.
    Please ensure to copy the code from the forum and not an email notification so the symbols are not converted.

    Best regards,
    Mike

    #1483964

    In reply to: Ctrl + F in html

    hail brave new AI world

    New snippet
    see in Action here: https://webers-testseite.de/impressum/

    it is a draggable Window:

    this is for child-theme functions.php:

    see code here on paste bin: https://pastebin.com/zc4fvX1w

    because of a innerHtml (lines 158-176) it is not possible to post it here – (maybe mod knows how)

    and here is the style for quick css

    /* --- Draggable Search Window --- */
    #gcmSearchUIContainer { /* Changed ID for clarity */
      position: fixed;
      top: 100px; /* Initial position from the top */
      left: 50%;  /* Start horizontally centered */
      transform: translateX(-50%); /* Adjust for true centering */
      width: 380px; /* A suitable width for a small window */
      background-color: #f9f9f9;
      border: 1px solid #ccc;
      border-radius: 8px;
      box-shadow: 0 5px 15px rgba(0,0,0,0.25);
      z-index: 100001; /* Ensure it's on top, slightly higher than before if needed */
      overflow: hidden; /* To contain rounded corners with header */
    }
    
    #gcmSearchUIContainer.hidden {
      display: none;
    }
    
    #gcmSearchUIHeader {
      padding: 10px 15px;
      background-color: #e8e8e8;
      border-bottom: 1px solid #ccc;
      cursor: move; /* Indicates this area is draggable */
      border-top-left-radius: 8px; /* Match container's radius */
      border-top-right-radius: 8px; /* Match container's radius */
      display: flex;
      justify-content: space-between;
      align-items: center;
    }
    
    #gcmSearchUIHeader .gcm-title {
      font-weight: bold;
      font-size: 1.1em;
      color: #333;
    }
    
    #gcmSearchUIHeader #gcmCloseSearchBtnDraggable { /* Specific ID for close button in this context */
      background: none;
      border: none;
      font-size: 1.3em;
      font-weight: bold;
      color: #777;
      cursor: pointer;
      padding: 0 5px;
    }
    #gcmSearchUIHeader #gcmCloseSearchBtnDraggable:hover {
      color: #000;
    }
    
    #gcmSearchUIBody {
      padding: 15px;
      display: flex;
      flex-direction: column; /* Stack elements vertically */
      gap: 10px; /* Space between elements in the body */
    }
    
    #gcmSearchUIBody #gcmSearchInputDraggable { /* Specific ID for input */
      width: 100%;
      padding: 10px;
      border: 1px solid #ccc;
      border-radius: 4px;
      box-sizing: border-box;
    }
    
    #gcmSearchUIBody .gcm-controls-row {
      display: flex;
      justify-content: space-between; /* Space out controls */
      align-items: center;
      gap: 8px; /* Space between buttons in a row */
    }
    
    #gcmSearchUIBody .gcm-navigation {
        display: flex;
        gap: 5px;
    }
    
    #gcmSearchUIBody button {
      padding: 8px 12px;
      border: 1px solid #aaa;
      border-radius: 4px;
      background-color: #e7e7e7;
      cursor: pointer;
      min-width: 40px; /* For Next/Prev buttons */
      text-align: center;
    }
    
    #gcmSearchUIBody button:hover {
      background-color: #d7d7d7;
    }
    
    #gcmSearchUIBody #gcmSearchBtnDraggable { /* Specific ID */
        flex-grow: 1; /* Allow Find button to take more space if needed */
    }
    
    #gcmSearchUIBody .gcm-results-count-draggable { /* Specific ID */
      font-size: 0.95em;
      color: #333;
      white-space: nowrap; /* Prevent wrapping */
    }
    
    /* --- Highlighting Styles (remain the same) --- */
    .custom-highlight {
      background-color: yellow;
      color: black;
      font-weight: bold;
    }
    
    .custom-highlight.current-custom-highlight {
      background-color: orange;
      outline: 1px solid red;
    }

    Do not forget to remove the leading php on that downloaded snippet before you insert it to your child-theme functions.php

    Download: https://pastebin.com/dl/zc4fvX1w

    Ok great, but can you get me CSS for smaller Font size for all the “sub menu” items? (So the Main menu fonts size is larger and the Sub Menu is smaller.)

    #1483897

    Hi,

    To adjust the size and position of the slider arrows, try to add this css code:

    #top .avia-smallarrow-slider .avia-slideshow-arrows a {
      opacity: 0;
      margin: 0;
      width: 50px !important;
      height: 50px !important;
      line-height: 50px !important;
      font-size: 20px !important;
      top: 0;
    }
    
    #top .avia-smallarrow-slider .avia-slideshow-arrows a.avia-svg-icon svg:first-child, #top .avia-smallarrow-slider .avia-slideshow-arrows a.avia-svg-icon img[is-svg-img="true"] {
      height: 20px;
      width: auto;
      margin-top: 15px;
    }
    
    #top .avia-smallarrow-slider .avia-slideshow-arrows {
      position: relative;
      width: 120px;
      top: 20px;
      left: auto;
      height: 24px;
      right: 10px;
    }

    If you’re trying to disable the image overlay, add this code:

    .image-overlay, .image-overlay .image-overlay-inside {
        display: none !important;
    }

    Best regards,
    Ismael

    #1483815

    Hi,

    Try to use this css code to adjust the font size of the menu items inside the nav widget:

    #top .widget_nav_menu li {
        font-size: 16px;
    }

    Best regards,
    Ismael

    Lissasan
    Participant

    I’ve tried the solutions for this from previous questions, but so far I’ve had no luck. I’m trying to use a different font from what is set for default headings (Open Sans) in Enfold for just one easy slider caption. When I change the default font in the theme settings, I can see the font I want (Tangerine). When set the default back to Open Sans and use the CSS override in Quick CSS, I see the font switch to serif, but it will not resolve Tangerine. What am I doing wrong?

    I inspected the caption in Chrome and copied the selector, so the CSS is
    #faithtop > div > ul > li > div > div > div > div > div > div > h2.avia-caption-title {
    font-family: “Tangerine”, serif !important; font-size: 4em !important; color: #2d5c88 !important;
    }

    Hi,

    .main-title looks like a different font or font weight

    Looks like the title is set to use a lighter font weight instead of the default 400. Did you configure the Heading elements in the Enfold > Advanced Styling tab? You can also adjust it with this css:

    #top #wrap_all .main_color h1, #top #wrap_all .alternate_color h1, #top #wrap_all .socket_color h1 {
        font-weight: 400;
    }

    Regarding the burger/mobile menu, try to edit the Main Menu (Icon) elements in the Advanced Styling panel, or use this css code:

    #top #wrap_all .av-burger-overlay .av-burger-overlay-scroll #av-burger-menu-ul li a {
        color: #ffffff;
        font-size: 18px;
        line-height: 1.8em;
    }
    
    .html_av-overlay-side #top #wrap_all div .av-burger-overlay-scroll #av-burger-menu-ul li:hover a, #top #wrap_all .av-burger-overlay .av-burger-overlay-scroll #av-burger-menu-ul li a:hover {
        background-color: #333366;
        color: #ffffff !important;
    }

    If you have any additional questions at this time we kindly ask that you open them up in a separate thread. The longer threads get in the forum, they become more difficult to support as they tend to drift off topic and they also make it troublesome for users trying to search for solutions. Keeping threads relevant to their original inquiry ensures that we can keep better track of what has been resolved and that users can more effectively find answers to similar issues they might be experiencing.

    Thanks!

    Best regards,
    Ismael

    This reply has been marked as private.
    #1483641

    The blue box marks the container, which you set to 1500px in the Enfold settings – see my comment above : link
    Since the font is set to centered, it will be placed in the middle of the container. If the size is smaller, there will be a gap to the outer edges of the blue box.

    Originally, you can see in the first screenshot that there is a manually placed line break (<br>) at the point marked in red.
    (click to enlarge the images)

    In the second screenshot, I have removed this manual line break in my browser’s dev tools to show you that when there are no line breaks, these lines have the said 1500px width.

    Where you are now reporting the lack of smaller widths, you have simply not set manual breaks as above inside the text-block elements.

    Hi,

    You can adjust the value for all breakpoints, including the first one, which applies to desktops or large screens. To adjust the style of the slider buttons on smaller screens, you can add the following css code:

    /*
    Mobile Styles
    ================================================== */
    /* Note: Add new css to the media query below that you want to only effect the Mobile and Tablet Portrait view */
    
    @media only screen and (max-width: 768px) {
    
      /* Add your Mobile Styles here */
      #top .container .slideshow_inner_caption .avia-slideshow-button {
        margin-top: 10px;
        padding: 6px 8px;
        font-size: 13px;
      }
    }

    Best regards,
    Ismael

    #1483573

    As i mentioned above – and Mike pointed out again – there are a lot of manual set linebreaks (<br>)
    but if you like you can force a max width of the p-tags by font length units one of the modern one is ch (The width of the 0 character of the font in use) so – 110ch means nearly 110 characters. A more common font unit is em (The font size of the element, or its nearest parent container)

    I would not recommend this procedure; I would probably rather limit the container itself there, but so that you can see that it also works via css:

    #top .avia_textblock p {
      max-width: 110ch;
      word-wrap: break-word;
      margin: 0.85em auto 0;
    }

    Hi,
    Try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

    #av-burger-menu-ul li.av-show-submenu > a > .avia-menu-text {
    	color: blue;
    }
    #av-burger-menu-ul li.av-show-submenu > .sub-menu > li > a > .avia-menu-text {
    	color: yellow;
    }
    .html_av-submenu-hidden #av-burger-menu-ul .av-submenu-indicator:before {
    	color: yellow;
    	font-size: 20px;
    }
    #top #wrap_all #av-burger-menu-ul .menu-item-2846 {
    	font-size: 12px !important;
    }

    Please ensure to copy the code from the forum and not an email notification so the symbols are not converted.
    After applying the css, please clear your browser cache and check.

    Best regards,
    Mike

    #1483551

    Hi,
    Try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

    @media only screen and (max-width: 767px) { 
    .responsive #top.home #wrap_all #av_section_3 .flex_column.av_one_third {
    	width: 31%;
      margin-left: 6px;
    }
    }
     @media only screen and (max-width: 500px) { 
     	#top.home #wrap_all #av_section_3.main_color .flex_column.av_one_third h3 {
        font-size: 0.6em;
     	}
     }
     @media only screen and (min-width: 501px) and (max-width: 767px) { 
     	#top.home #wrap_all #av_section_3.main_color .flex_column.av_one_third h3 {
        font-size: 0.9em;
     	}
     }

    After applying the css, please clear your browser cache and check.

    Best regards,
    Mike

    This reply has been marked as private.
    #1483502

    Hey bemodesign,

    Please try the following in Quick CSS under Enfold->General Styling:

    
    @media only screen and (max-width: 767px) {
      #top .isotope-item.special_av_fullwidth .av_table_col .entry-title {
        font-size: 24px;
      }
    }

    Best regards,
    Rikard

    Hey connect4consulting,

    Thank you for the inquiry.

    You can add this css code code to adjust the font size of the elements in the header and footer.

    @media only screen and (max-width: 767px) {
    
      /* Add your Mobile Styles here */
      .phone-info a {
        font-size: 12px !important;
      }
    
      #socket .sub_menu_socket li {
        line-height: 1.4em;
      }
    }

    Regarding the slider caption, try to edit the slides’ Styling > Font Sizes settings. You can define font size values for different breakpoints or screen sizes.

    View post on imgur.com

    Best regards,
    Ismael

    #1483478

    In reply to: Photo Caption Size

    Hi,

    Yes, the default content font size and typography settings are recent additions to the theme options. Regarding the line spacing, you can try this css code:

    @media only screen and (max-width: 767px) {
    
      /* Add your Mobile Styles here */
      .av-image-caption-overlay-center {
        line-height: 1em;
      }
    }

    View post on imgur.com

    Best regards,
    Ismael

    #1483469

    Hi,

    Glad you found the feature useful. You can use the following css code to adjust the size of the social icons and disable the animation.

    .av-share-box ul li a {
        font-size: 30px;
        transition: none;
        opacity: 1;
        visibility: visible;
    }

    View post on imgur.com

    Best regards,
    Ismael

    bemodesign
    Participant

    Hello, I need CSS for Font size and Color options for “Full page overlay menu” sub menu.

    They have a lot of SubMenus and I am trying to differentiate from main nav.

    Thanks

    https://championschoolssouthmountain.armourcloud.io/

    #1483458
    bemodesign
    Participant

    On the main Portfolio page, the Header font size is too small on “Mobile view” only, and the text below the header might need to be adjusted on Mobile also. Can you get me some CSS code?

    thanks

    screenshot: https://img.savvyify.com/image/Screen-Shot-2025-05-01-at-9.49.17-AM.9tvxO

    page: https://sonoranwaters.armourcloud.io/projects/

    #1483436

    In reply to: Photo Caption Size

    Hi,

    Thank you for the update.

    You may need to remove the body and p tag configs in the Enfold > Advanced Styling panel because they override the custom styling of the image caption. You can adjust the Default Content Font Size in the Enfold > General Styling > Typography panel instead.

    Here is what it looks like after we removed the advanced styling of the p and body tags.

    View post on imgur.com

    `

    Best regards,
    Ismael

Viewing 30 results - 181 through 210 (of 18,716 total)