Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1442608

    Hi, I guess my custom css produces a glitch on mobile: The underlined font is not displayed properly and the cookie banner appears misplaced (at the far bottom of the page).
    On Desktop everthing looks great. Can you help me please?

    This is my custom css:

    /* Header mobile */
    @media only screen and (max-width: 767px) {
      .responsive #top #wrap_all #header {
        position: fixed;
      }
    }
    @media only screen and (max-width: 767px) {
    .responsive #header_main .container {
        height: 50px !important;
    }
    .responsive .logo a {
        vertical-align: top !important;
    }
    .responsive .logo img {
        max-height: 50px !important;
    }
    }
    @media only screen and (max-width: 767px) {
    .responsive #top #wrap_all .main_menu {
        top: -15px;
        height: 45px;
        left: auto;
        right: 0;
        display: block;
        position: absolute;
    }
    }
    @media only screen and (max-width: 500px) { 
    .responsive #top #wrap_all #main {
            padding-top: 50px !important;
        }
    }
    /* Farbe Nachrichtenversand */
    h3.avia-form-success{
     color:#99a502!important;	
    }
    /* Header Button Mobile*/
    @media only screen and (max-width: 767px) {
    .home .avia-fullscreen-slider .caption_bottom .slideshow_caption {
        bottom: 325px;
        left: 300px;
    }
    .home .slideshow_inner_caption .avia-slideshow-button.avia-button {
        background-color: #a37652;
        color: white;
        border-radius: 10px;
    }
    }
    @media only screen and (max-width: 767px) {
      #top #wrap_all .slideshow_inner_caption .avia-slideshow-button.avia-button {
        background-color: #a37652;
        color: white;
      border-radius: 10px;
      }
    }
    /* Text mit Foto*/
    .avia_textblock p img {
    	  border-radius: 100%;
    	  box-shadow: rgba(255, 255, 255, 0.6) 0px 0px 4px 4px;
    }
    .avia_textblock img.alignleft {
      margin-right: 40px;
    margin-bottom: 20px;
    }
    @media only screen and (max-width: 767px) { 
    #hello .avia_textblock img {
    	width: 50%;
    }
    }
    /* ScrollDown Pfeil */
    #top .scroll-down-link {
    	color: #a47654;
    }
    /* Blog Leerzeile entfernen */
    .page-id-691 #after_section_2 {
      display: none; 
    }
    /* Blog Postdatum entfernen */
    .page-id-691 .av-masonry .av-masonry-date {
      display: none; 
    }
    /* SocialMedia Icons*/
    #top #wrap_all .av-social-link-instagram:hover a, #top #wrap_all .av-social-link-instagram a:focus {
        color: #fff;
        background-color: #c82161;
    }
    /* Icon Circle schneller*/
    .avia_start_animation .avia-icon-circles-inner {
      transition: all 0s cubic-bezier(0,0,0,0);
    }
    /* Desktop Menu*/
    @media only screen and (max-width: 2500px) {
      #top #header.av_header_transparency .av-main-nav > li.menu-item  {
          display: none!important;
      }
      #top #header.av_header_transparency .av-burger-menu-main {
          cursor: pointer;
          display: block!important;
      }
    }
    /* Header Button Desktop*/
    @media only screen and (max-width: 450px) { 
    .slideshow_inner_caption {
    	top: -40px;
    }
    }
    @media only screen and (min-width: 768px) { 
    #top .caption_bottom .slideshow_caption .slideshow_inner_caption {
        position: relative;
        text-align: center;
    }
    #top .slideshow_inner_caption .avia-slideshow-button.avia-button {
        width: 500px;
        height: 56px;
        font-size: 22px;
    }
    @media only screen and (min-width: 768px) { 
    .slideshow_inner_caption {
    	top: -125px;
    }
    }
    #top #wrap_all .slideshow_inner_caption .avia-slideshow-button.avia-button {
        background-color: #a37652;
        color: white;
        border-radius: 10px;
    }
    #top #wrap_all .slideshow_inner_caption .avia-slideshow-button.avia-button:hover {
        background-color: #c79a52;
        color: white;
        border-radius: 15px;
    }
    /* CookieBanner*/
    #top .avia-cookie-consent .avia-cookie-consent-button.av-extra-cookie-btn,
    #top .avia-popup .avia-cookie-consent-button.av-extra-cookie-btn {
        background-color: #484f5d;
        color: #ffffff;
        border-color: #484f5d;
       border-radius: 10px;
    }
    #top #wrap_all .header_color #menu-item-1628.av-menu-button-colored > a .avia-menu-text,
    #top #wrap_all .header_color #menu-item-1627.av-menu-button-colored > a .avia-menu-text {
        background-color: #484f5d;
        color: #ffffff;
        border-color: #484f5d;
       border-radius: 10px;
    }
    .html_elegant-blog #top .avia-content-slider .blog-categories {
      display:  none;
    }

    Website-Link on private content.

    Thank you in advance an best regards!

    #1442655

    Hey northorie,

    Thank you for the inquiry.

    We’ve found an invalid css rule above, which we’ve corrected. We have also removed duplicated css media queries. Please delete everything and replace it with this code.

    // https://pastebin.com/ABdSuACk

    Best regards,
    Ismael

    #1442807

    Thank you so much for your effort!
    I’m very thankful So glad I chose enfold out of all available themes :)

    Topic can be closed

    #1442891

    Hi,

    Great, I’m glad that Ismael could help you out. Please open a new thread if you should have any further questions or problems.

    Best regards,
    Rikard

Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Glitch on mobile’ is closed to new replies.